/* ===================================================== */

/* Preloader

/* ===================================================== */



.spin {

    display: inline-block;

    -webkit-animation: spin 1s infinite linear;

    -moz-animation: spin 1s infinite linear;

    -o-animation: spin 1s infinite linear;

    animation: spin 1s infinite linear;

}



@-moz-keyframes spin {

    from { -moz-transform: rotate(0deg); }

    to { -moz-transform: rotate(360deg); }

}

@-webkit-keyframes spin {

    from { -webkit-transform: rotate(0deg); }

    to { -webkit-transform: rotate(360deg); }

}

@keyframes spin {

    from {transform:rotate(0deg);}

    to {transform:rotate(360deg);}

}



.preloader {

    background: white;

    content: '';

    height: 100%; width: 100%;

    position: fixed;

    z-index: 1000;

}



.preloader i {

    color: #222;

    font-size: 20px;

    left: 50%;

    line-height: 3;

    margin-top: -20px;

    position: absolute;

    top: 50%;

}



/* Hides all animated elements */

.animated {

    visibility: hidden;

}



/* SVG hexes cannot be hidden */

.feature-hex {

    visibility: visible;

}



/* turns it off for ie8 */

.ie8 .animated {

    visibility: visible;

}



.img {

    max-width: 100%;

}





/* ===================================================== */

/* Sections                                              */

/* ===================================================== */



.section-title {

    text-transform: uppercase;

    text-align: center;

    padding-bottom: 10px;

}



.sub-title {

    border-bottom: 1px solid #ddd;

    margin-bottom: 30px;

    padding-bottom: 5px;

    text-transform: uppercase;

}



h1.section-title:after,

.description:after {

    border-bottom: 3px solid #7fbbc5;

    content: "";

    display: block;

    margin: 30px auto;

    width: 80px;

}



.sect-1,

.sect-2,

.sect-4 {

    padding: 90px 0 70px;

}



.sect-2 {

    background: #f5f5f5;

}



.sect-3 {

    padding: 60px 0;

}



.sect-4 {

    background: #222;

}



.section-title .description {

    text-transform: none;

}



.sect-4 .title {

    color: #fff;

}



.description {

    text-align: center;

    font-size: 20px;

    width: 70%;

    margin: 0 auto 60px;

}



.image-section {

    background-size: cover;

    background-position: center;

    color: white;

    text-align: center;

}



.image-section h1,

.image-section h2,

.image-section h3,

.image-section h4,

.image-section h5,

.image-section h6 {

    color: #fff;

}



.image-section .tint {

    background-color: rgba(0,0,0,.4);

    padding: 90px 0 70px;

}



/* Padding For pages other than home */

.page {

    padding-top: 150px;

    padding-bottom: 70px;

}





/* ===================================================== */

/* Callout                                               */

/* ===================================================== */



.callout {

    text-align: center;

}



.callout .title {

    color: #7fbbc5;

    margin-bottom: 10px;

}



.callout .button {

    background-color: white;

    margin: 0;

    z-index: 9999;

    box-shadow: 0 0 0 20px white;

}



.callout:after {

    border-bottom: 1px solid #e0e0e0;

    content: "";

    display: block;

    margin: -18px auto 90px;

    width: 220px;

}



.image-callout {

     background-image: url('../img/bg-callout.jpg');

}



.video-button {

    color: #fff;

    font-size: 50px;

}



/* ===================================================== */

/* Features                                              */

/* ===================================================== */



.features {

    text-align: center;

}



.features li {

    margin-bottom: 20px;

}



.features .title {

    text-transform: uppercase;

}



.features i {

    border-radius: 50%;

    border: 1px solid #e2e2e2;

    color: #7fbbc5;

    font-size: 24px;

    margin-bottom: 20px;

    padding-top: 29px;

    width: 80px; height: 80px;

    text-align: center;

}





/* ===================================================== */

/* Testimonials                                          */

/* ===================================================== */



.testimonials {

    background: url('../img/bg-testimonial2.jpg');

    background-size: cover;

    background-position: center center;

    color: #fff;

    text-align: center;

}



.testimonials h1 {

    color: #fff;

}



.quote {

    width: 80%;

    margin: 0 auto 30px;

}



.testimonials .name {

    color: #777;

    font-size: 23px;

}



.testimonials .tint {

    background-color: rgba(0,0,0,.4);

    padding: 150px 0 130px;

}





/* ===================================================== */

/* Clients:     ;                                        */

/* ===================================================== */



.clients li {

    float: left;

    list-style: none;

    margin-left: 1.6%; /* Less spacing than standard grid */

    width: 18.72%;



    opacity: .7; /* LOWERS OPACITY OF THE IMAGES */

}



.clients img {

    max-width: 100%;

}



.clients li:first-child {

    margin-left: 0;

}





/* ===================================================== */

/* Feature Images                                        */

/* ===================================================== */



.feature-imgs {

    text-align: center;

    padding-top: 60px;

}



.feature-imgs li {

    margin-bottom: 20px;

}



.feature-imgs .middle {

    margin-top: -60px;

}



.feature-imgs .img {

    display: inline-block;

    height: 140px; width: 140px;

    position: relative;

    overflow: hidden;

}



.feature-imgs img {

    display: block;

    height: 100%;

    margin: 0 auto;

}



.feature-imgs .title {

    text-transform: uppercase;

}



.feature-imgs .title:before {

    background: #d0d0d0;

    content: "";

    display: block;

    margin: -7px auto 20px;

    height: 50px; width: 2px;

}



.feature-img p {

    padding: 0 60px;

}



.feature-hex .svg-graphic {

    margin-left: 1px;

}





/* ===================================================== */

/* Portfolio                                             */

/* ===================================================== */



.portfolio-wrapper>.container {

    padding: 0;

}



.portfolio {

    margin-bottom: 40px;

}



.port-item {

    margin: 0;

    margin-bottom: 20px;

    padding: 0 2%;

    position: relative;

    width: 24.9%;

}







.port-item img {

    display: block;

    width: 100%;

    -o-transition:.5s;

    -ms-transition:.5s;

    -moz-transition:.5s;

    -webkit-transition:.5s;

    transition:.5s;

}



.port-info {

    background: #fff;

    border-top: 6px solid #f0f0f0;

    color: #555;

    text-align: center;

    margin-bottom: 0;

    text-transform: uppercase;

    padding: 54px 0 10px;

    position: relative;

}



.port-name {

    display: block;

    color: #7fbbc5;

    font-size: 24px;

    line-height: 1.5;

    margin-bottom: 20px;

}



.port-cat {

    color: #999;

    display: block;

}



.port-info i {

    background: #f0f0f0;

    color: #666;

    display: inline-block;

    width: 50px;

    height: 20px;

    left: 50%;

    margin-left: -25px;

    padding-top: 8px;

    position: absolute;

    top: 0;

}



.port-info i:before {

    z-index: 1;

    position: relative;

}



.port-info i:after {

    content: "";

    position: absolute;

    bottom: -15px;

    left: 0;

    width: 0;

    height: 0;

    border-left: 25px solid transparent;

    border-right: 25px solid transparent;

    border-top: 15px solid #f0f0f0;

}



.portfolio-wrapper {

    text-align: center;

}





/* PORTFOLIO ITEM BUTTON OVERLAY */



.port-overlay {

    overflow: hidden;

    position: relative;



}

.lightbox-btn,

.project-btn {

    background: rgba(0,0,0,.5);

    position: absolute;

    height: 100%;

    line-height: 16;

    opacity: 0;

    top: 0;

    left: 0;

    z-index: 9999;

    width: 100%;

}



.lightbox-btn i,

.project-btn i {

    color: #fff;

    height: 30px;

    width: 30px;

    font-size: 30px;

}



.port-overlay:hover .lightbox-btn,

.port-overlay:hover .project-btn {

    opacity: 1;

}



.port-overlay:hover img {

    transform: scale(1.05);

    -ms-transform: scale(1.05);

    -webkit-transform: scale(1.05);

    -o-transform: scale(1.05);

    -moz-transform: scale(1.05);

}





/* ===================================================== */

/* PORTFOLIO SLIDER

/* ===================================================== */



.portfolio-slider-wrapper {

    margin-bottom: 80px;

    position: relative;

}



.portfolio-slider img {

    width: 100%;

}





/* ===================================================== */

/* Filter Menu

/* ===================================================== */



.filter-menu {

    clear: both;

    display: block;

    float: none;

    height: auto;

    margin: 0 auto 20px;

    padding: 0;

    position: relative;

    text-align: center;

    text-transform: uppercase;

}



.filter-menu li {

    background: #fff;

    display: inline-block;

    margin: 0 4px;



    -o-transition:.5s;

    -ms-transition:.5s;

    -moz-transition:.5s;

    -webkit-transition:.5s;

    transition:.5s;

    padding:5px 20px 4px;

}



.filter-menu li:hover,

.filter-menu li:focus {

    background: #f0f0f0;

}





/* ===================================================== */

/* Banner                                                */

/* ===================================================== */



.rev-slider,

.main-slider  li,

.slider-wrapper  .bx-viewport,

.slider-wrapper .bx-wrapper,

.slider-wrapper,

.main-slider {

    background-size: cover;

    background-position: center center;

    height: 100% !important;

}



/* Override styling of revolusion spinner */

.tp-loader.spinner0 {

    display: none;

}



.slider-wrapper.pattern {

    background-size: auto;

}



.video-slider {

    background: #000;

}



.video-placeholder {

    background-image: url('../img/slider/video-placeholder.jpg');

    background-size: cover;

    background-position: center center;

}



.slider-wrapper {

    position: relative;

}



.down {

    bottom: 50px;

    color: #fff;

    left: 50%;

    margin-left: -45px;

    text-align: center;

    position: absolute;

    z-index: 51;

    -webkit-backface-visibility: hidden;

}



.down i {

    border-radius: 50%;

    border: 2px solid white;

    color: #fff;

    font-size: 50px;

    margin: 0 0 14px;

    height: 50px;

    width: 50px;

    -o-transition:.5s;

    -ms-transition:.5s;

    -moz-transition:.5s;

    -webkit-transition:.5s;

    transition:.5s;

}



.down:hover {

    color: #fff;

}



.down:hover i {

    background: #7fbbc5;

    border-color: #7fbbc5;

}



.down span {

    display: block;

}





.main-slider {

    color: #fff;

    text-align: center;

    text-transform: uppercase;

}



.welcome .caption-title {

    color: inherit;

    font-size: 80px;

    font-weight: 300;

}



.welcome .caption-subtitle {

    font-size: 30px;

    margin-bottom: 0;

}



.welcome .caption-subtitle:after,

.welcome .line-upper {

    border-bottom: 2px solid #fff;

    content: "";

    display: block;

    margin: 50px auto;

    width: 80px;

    opacity: 1;

}



.welcome .line-lower {

    margin-top: 120px; /* Position from center */

}



.vertical-align {

    display: table-cell;

    vertical-align: middle;

    width: 100% !important;

}



.caption {

    display: table;

    margin: auto;

    width: 90% !important; height: 100%;

}



.welcome .caption-logo {

    display: inline-block;

    margin-bottom: 30px;

}





/* ===================================================== */

/* Slider style 2

/* ===================================================== */



.caption-title2 {

    color: #fff;

    font-size: 80px;

    font-weight: 600;

    text-transform: uppercase;

    padding: 0 120px;

}



.caption-title2 span {

    color: #ccc;

}



.slider-list {

    color: #fff;

    display: inline-block;

    font-size: 24px;

}





/* ===================================================== */

/* Main Header

/* ===================================================== */



.header {

    height: 60px;

    overflow: visible;

    text-align: center;

    position: fixed;

    top: 0;

    z-index: 9999;

    width: 100%;

}



.header.solid {

   background: #555;

}



.logo {

    display: inline-block;

    color: #fff;

    font: 28px/1.4 'Oswald', sans-serif;

    font-weight: 300;

    float: left;

    padding: 0;

    text-align: center;

    text-transform: uppercase;

}



.logo img {

    display: inline-block;

}



.logo:hover {

    color: #000;

}





/*================================================= */

/* Navigation

/*================================================== */



.main_menu {

    display: inline-block;

    font-size: 14px;

    float: right;

    margin-top: 0;

    position: relative;

}



.main_menu li {

    cursor: pointer;

    display: block;

    position: relative;

}



/* All links */

.main_menu a {

    display: block;

    position: relative;

}



/* Menu Buttons */

.main_menu>li {

    display :inline-block;

    font-size: 14px;

    line-height: 1;

    padding: 23px 30px 21px 25px;

}



.main_menu li:first-child:after {

    content: '';

}



/* Main buttons link */

.main_menu>li>a {

    border-bottom: 2px solid transparent;

    color: #fff;

    display: block;

    text-transform: uppercase;

    font-weight: 400;

}



/* Main buttons Hover and current */

.main_menu>li>.touch,

.no-touch .main_menu>li:hover>a,

.main_menu>li>.current {

    border-bottom: 2px solid #fff;

}



/* All Dropdowns */

.main_menu ul {

    background: #333;

    display: none;

    position: absolute;

    margin: 20px 0 0 0;

    left: 0;

    text-align: left;

    z-index: 9999;

}



.main_menu ul li {

    margin-bottom: 0;

}



.main_menu ul li:first-child {

    border-top: none;

}



/* All Dropdown links */

.main_menu ul li a {

    color: #aaa;

    display: block;

    font-family: Tahoma, Arial, sans-serif;

    font-size: 12px;

    padding: 10px 20px;

    width: 170px;

}



/* Menu Hovers */



/* Drop Down hover */

.main_menu ul li>a:hover,

.main_menu ul li .current {

    background-color: #444;

}



/* 3rd DropDown */

.main_menu ul ul {

    left: 100%;

    margin-top: 0;

    top: 0;

}



.selectnav {

    background: #aaa;

    color: #444;

    display: none;

    height: 30px;

    margin: 0 auto;

    width: 180px;

}





/* ===================================================== */

/* Recent Posts                                          */

/* ===================================================== */



.post-content .title {

    text-transform: uppercase;

}



.post-date {

    border: 1px solid #d0d0d0;

    color: #7fbbc5;

    float: left;

    line-height:1.2;

    font-size: 20px;

    margin-right: 25px;

    position: relative;

    width: 80px; height: 80px;

    text-align: center;

    text-transform: uppercase;

    padding-top: 12px;

}



.post-date:before {

    background: #d0d0d0;

    content: "";

    display: block;

    margin: 11px auto 20px;

    position: absolute;

    left: 50%;

    top: 68px;

    height: 30px; width: 1px;

}



.post-date:after {

    border: 1px solid #d0d0d0;

    border-radius: 50%;

    content: "";

    display: block;

    margin-left: -5px;

    position: absolute;

    left: 50%;

    top: 109px;

    height: 11px; width: 11px;

}



.post-date .day {

    font-weight: 600;

    font-size: 28px;

}



.post-content {

    overflow: hidden;

    min-height: 125px;

}





/* ===================================================== */

/* Team

/* ===================================================== */



.team {

    position: relative;

}





.team>li {

    background: #f0f0f0;

    text-align: center;

    margin-bottom: 20px;

    position: relative;

}



.team img {

    display: block;

    width: 100%;

}



.team-job {

    display: block;

    color: #7fbbc5;

    font-size: 20px;

    margin-bottom: 20px;

    text-transform: uppercase;

}



.team-name {

    display: block;

    margin-bottom: 6px;

}



.team .img-wrap {

    border-bottom: 6px solid #f0f0f0;

    margin-bottom: 50px;

    position: relative;

    text-align: center;

}



.team .img-wrap i {

    background: #f0f0f0;

    color: #666;

    display: inline-block;

    width: 50px;

    height: 20px;

    left: 50%;

    margin-left: -25px;

    padding-top: 10px;

    position: absolute;

    bottom: -20px;

}



.team .img-wrap i:before {

    position: relative;

    z-index: 1;

}



.team .img-wrap i:after {

    content: "";

    position: absolute;

    bottom: -15px;

    left: 0;

    width: 0;

    height: 0;

    border-left: 25px solid transparent;

    border-right: 25px solid transparent;

    border-top: 15px solid #f0f0f0;

}





/* ===================================================== */

/* Social Icons

/* ===================================================== */



.social-icons {

    margin: 0;

    padding: 0;

}



.social-icons li {

    display: inline-block;

    margin: 0 0 10px 0;

}



.social-icons i {

    color: #bbb;

    display: block;

    font-size: 18px;

    height: 35px; width: 35px;

    line-height: 34px;

    text-align: center;



    -o-transition:.5s;

    -ms-transition:.5s;

    -moz-transition:.5s;

    -webkit-transition:.5s;

    transition:.5s;

}



.social-icons a:hover i {

    color: #888;

}





/* ===================================================== */

/* Footer                                                */

/* ===================================================== */



.footer {

    background: #1A1A1A;

    text-align: center;

    padding: 60px 0 30px;

    position: relative;

    font-size: 18px;

}



.footer-logo {

    margin-bottom: 20px;

}



.footer .address {

    margin-bottom: 30px;

}



.footer .social-icons {

    margin-bottom: 20px;

}



.footer .social-icons i {

    border: 1px solid white;

    border-radius: 50%;

    padding-top: 1px;

    margin: 0 10px;

}



.footer .copy {

    font-size: 12px;

    padding-bottom: 10px;

}



.footer a {

    color: #ccc;

}





/* ===================================================== */

/* Contact                                               */

/* ===================================================== */



/* styling */



.contact-form {

    margin: auto;

    width: 80%;

}



.contact-form textarea,

.contact-form input {

    width: 100%;

}



.contact-form textarea {

    height: 142px;

    margin-bottom: 40px;

}



.contact-form input {

    margin-bottom: 15px;

}



.contact-form .contact-button {

    display: block;

    clear: both;

    float: none;

    margin: 0 auto 0;

}



/* Form errors */

form .error  {

    background: rgb(253, 228, 228) !important;

    border: 1px solid rgb(224, 107, 107) !important;

    color: red !important;

}



form .error,

form .error:focus {

    color: #555

}



.required {

    color: red;

}



.inline-error {

    color: red;

    display: block;

    margin-bottom: 10px;

}





/* ===================================================== */

/* Skills                                                */

/* ===================================================== */



.skills {

    text-align: center;

}



.skills li {

    position: relative;

    margin-bottom: 10px;

}



.skill-title {

    text-transform: uppercase;

}



.skill-bar {

    display: inline-block;

    margin: 0 0 0 0;

    height: 85px;

    overflow: hidden;

}



.skill-semi {

    background: #7fbbc5;

    border-radius: 100px 100px 0 0;

    color: white;

    height: 50px;

    font-size: 20px;

    padding: 19px 0 0 0;

    position: absolute;

    top: 19px; left: 50%;

    margin-left: -50px;

    text-align: center;

    width: 100px;

}





/* ===================================================== */

/* Pricing Tables                                        */

/* ===================================================== */



.price-head {

    background: url('../img/patterns/pat-4.png');

    color: #fff;

    height: 102px;

    padding: 20px 0 0;

    text-align: center;

}



.price-title {

    color: #fff;

    text-transform: uppercase;

    margin-bottom: 15px;

}



.price-label {

    background: #7fbbc5;

    border-radius: 50%;

    border: 4px solid white;

    font-size: 18px;

    display: inline-block;

    height: 90px; width: 90px;

    line-height: 1.1;

    padding-top: 24px;

}



.price-label span {

    display: block;

    font-size: 13px;

}



.price-content {

    background: #fff;

    color: #555;

    margin-bottom: 20px;

    padding: 70px 0 30px;

    text-align: center;

    text-transform: uppercase;

}



.price-content li {

    display: block;

    margin-bottom: 10px;

}



.price-content li:after {

    content: '';

    background: #ddd;

    display: block;

    height: 1px; width: 40px;

    margin: 10px auto;

}





/* ===================================================== */

/* Our Process                                           */

/* ===================================================== */



.process-slider img {

    width: 100%;

}



.process-slider-wrap {

    margin-bottom: 70px;

    padding-right: 30px;

    position: relative;

}



.process-list {

    padding-left: 30px;

}



.process-list i {

    background: #333;

    border-radius: 50%;

    color: #555;

    float: left;

    height: 40px; width: 40px;

    margin-right: 20px;

    padding: 13px 0 0 0;

    text-align: center;

}



.process-list li {

    margin-bottom: 40px;

}



.process-list li.current i {

    background: #7fbbc5;

    color: #fff;

}



.process-list li.current .process-title {

    color: #fff;

}



.process-list li.current p {

    color: #aaa;

}



.process-list li.current .process-title:after {

    background: #fff;

}



.process-list p {

    color: #777;

    margin-left: 60px;

}



.process-title {

    color: #777;

    text-transform: uppercase;

}



.process-title:after {

    background: #777;

    content: '';

    display: block;

    height: 2px; width: 50px;

    margin: 10px 60px;

}





/* ===================================================== */

/* Map                                                   */

/* ===================================================== */



.map-button {

  background: #ddd;

  height: 60px;

  font-size: 18px;

  padding-top: 16px;

  text-align: center;

  cursor: pointer;

}



.map-button i {

  margin-right: 10px;

}



.map-wrapper {

    height: 0;

  overflow: hidden;



  -webkit-transition: height .5s ease;

  -moz-transition: height .5s ease;

  transition: height .5s ease;

}



#google-map {

  height: 400px;

  width: 100%;

}



/* Hides the map window */

#content {

    display: none;

    height: 0;

}





/* ===================================================== */

/* OVERIDE BXSLIDER STYLING

/* ===================================================== */



.bx-wrapper .bx-viewport {

  background: none;

  border: none;

  -moz-box-shadow: none;

  -webkit-box-shadow: none;

  box-shadow: none;

  left: 0;

  overflow: hidden;

}



.bx-wrapper .bx-loading {

  background-image: url(../img/bxslider/bx_loader.gif);

}



.bx-wrapper .bx-controls .bx-next,

.bx-wrapper .bx-controls .bx-prev {

  background-image: url(../img/bxslider/controls.png);

  -webkit-transition: none;

  -moz-transition: none;

  transition: none;

}



.bx-wrapper .bx-controls-direction a {

  z-index: 51;

}



.bx-wrapper img {

    width: 100%;

}





/* ===================================================== */

/* BLOG

/* ===================================================== */



.blog,

.blog-single {

    background: #f5f5f5;

}



.blog-post.single {

    margin-bottom: 60px;

}



.main-image {

    margin-bottom: 30px;

    width: 100%;

}



.recent-posts {

    margin-bottom: 50px;

}



.blog-post {

    position: relative;

}



.blog-date {

    background: #222;

    color: #fff;

    display: inline-block;

    width: 50px;

    height: 44px;

    left: 40px;

    line-height: 1.1;

    margin-left: -25px;

    text-align: center;

    text-transform: uppercase;

    padding-top: 7px;

    position: absolute;

    top: 0;

    z-index: 52;

}



.blog-date .day {

    font-size: 20px;

}



.blog-date:before {

    position: relative;

    z-index: 1;

}



.blog-date:after {

    content: "";

    position: absolute;

    bottom: -14px;

    left: 0;

    width: 0;

    height: 0;

    border-left: 25px solid transparent;

    border-right: 25px solid transparent;

    border-top: 15px solid #222;

}



.blog-title {

    margin-bottom: 10px;

}



.blog-meta {

    margin-bottom: 10px;

}





/* ===================================================== */

/* Comments

/* ===================================================== */



.comment-list {

    margin-bottom: 60px;

}



.comment-avatar {

    margin: 0 20px 0 0;

    float: left;

    height: 70px; width: 70px;

}



.comment-content {

   background: #fff;

    margin-bottom: 20px;

    overflow: hidden;

    padding: 20px;

}



.comment-author {

    margin-bottom: 10px;

}



.comment-meta {

    float: right;

    font-size: 12px;

    color: #aaa;

}



.leave-comment .textarea-wrap {

    margin-bottom: 20px;

}



.leave-comment textarea {

    height: 141px;

    margin-bottom: 40px;

    width: 100%;

}



.leave-comment span input {

    margin-bottom: 15px;

    width: 100%;

}



.leave-comment .button {

    display: block;

    clear: both;

    float: none;

    margin: 0 auto 0;

}





/* ===================================================== */

/* Widgets

/* ===================================================== */



.aside .title {

    margin-bottom: 20px;

}



.widget {

    margin-bottom: 30px;

}





/* CATEGORIES */



.categories {

    margin-bottom: 20px;

}



.categories a {

    color: #777;

}



.categories li {

    border-bottom: 1px solid #f2f2f2;

    padding: 6px 0;

}



.categories li:first-child {

    padding-top: 0;

}



.categories i {

    color: #ccc;

    padding-right: 7px;

}





/* ===================================================== */

/* Tags

/* ===================================================== */



.tags a {

    background: #fff;

    border: 1px solid #f2f2f2;

    color: #777;

    display: inline-block;

    font-size: 12px;

    margin: 0 5px 10px 0;

    padding: 2px 10px;

    text-transform: uppercase;

}



.tags a:hover {

    background: #eee;

}





/* ===================================================== */

/* Search form

/* ===================================================== */



.search {

    position: relative;

    margin-bottom: 40px;

    max-width: 240px;

}



input.search-box {

    margin-bottom: 20px;

}



.search-btn {

    background: #ddd;

    border: none;

    box-shadow: none;

    margin: 0;

    position: absolute;

    padding: 0;

    padding: 8px 12px 9px;

    right: 0;

    border-radius: 0;

}





/* ===================================================== */

/* Pagination

/* ===================================================== */



.pagination {

    margin-bottom: 10px;

}



.pagination li {

    float: left;

    margin: 0 5px 5px 0;

}



.pagination .current a {

    background: #E9E9E9;

    border: none;

    color: #777;

    margin-top: 0;

}



.pagination a {

    background: #fff;

    color: #aaa;

    display: block;

    height: 28px; width: 28px;

    line-height: 2;

    margin-top: -1px;

    text-align: center;



    -moz-box-sizing: content-box;

    -webkit-box-sizing: content-box;

    box-sizing: content-box;

}



.pagination a:hover {

    background: #ccc;

    color: white;

}



.pagination .prev,

.pagination .next {

    background: #E9E9E9;

    border: none;

    color: #777;

    display: block;

    float: left;

    font-weight: bold;

    height: 28px; width: 28px;

    overflow: hidden;

    position: relative;

    margin-top: 0;

}



/* Hovers */

.pagination li.current a:hover,

.pagination a.next:hover,

.pagination a.prev:hover {

    background: #ccc;

    border: 1px solid #ccc;

}





/* ===================================================== */

/* Triggers: toggle, accordion, tabs

/* ===================================================== */



.accordian, .toggle {

    margin-bottom: 10px;

}



.toggle .trigger,

.accordian .trigger {

    padding-bottom: 10px;

}



.trigger {

    margin: 0;

    display: block;

}



.trigger a {

    display: block;

    font-family: 'Open Sans', sans-serif;

    font-weight: 100;

    line-height: 22px;

    margin: 0;

    padding: 7px 16px 5px;

    position: relative;

    text-align: left;

    text-decoration: none;

    text-transform: uppercase;

    -webkit-tap-highlight-color: rgba(0,0,0,0);

    -webkit-use-select:none;

}



.trigger i {

    display: inline;

    margin-right: 10px;

}



/* Default */

.trigger a {

    background: white;

    border: 1px solid #ddd;

    display: block;

    color: #999;

    position: relative;

}



/* HOVER AND CURRENT */

.trigger a:focus,

.trigger a:hover,

.trigger .current {

    color: #444;

}



.trigger a:hover span {

    color: inherit;

}



.trigger span {

    color: #7fbbc5;

    line-height: 20px;

    position: absolute;

    right: 16px;

    top: 8px;

}





/* ===================================================== */

/* Tabs

/* ===================================================== */



.tabs {

    margin-bottom: 20px;

}



.tabs .content {

    background: #fff;

    border-top: 1px solid #ccc;

    clear: both;

    padding: 20px 20px 1px;

}



.tabs .trigger {

    float: left;

    margin: 0 -1px 0 0; /* remove double border */

}



.tabs .trigger a {

    padding-top: 8px;

    border-bottom: none;

}



.tabs .trigger i {

    font-size: 16px;

    margin-top: 3px;

}





/* ===================================================== */

/* Sidetabs

/* ===================================================== */



.tabs-wrap {

    float: left;

    margin-top: 2px;

    margin-bottom: 20px;

    padding: 0 20px 0 0;

}



.sidetabs .trigger {

    margin: 10px 0 0 0;

}



.sidetabs .trigger:first-child {

    margin-top: 0;

}



.sidetabs .contents-wrap {

    padding-top: 5px;

    overflow: hidden;

}





/* ===================================================== */

/* Alert Boxs

/* ===================================================== */



.alert {

    background: #f2f2f2;

    border: none;

    border: 1px solid gray;

    margin: 0 0 20px 0;

    padding: 10px 35px 10px 20px;

    position: relative;

}



.alert strong {

    font-weight: 600;

}



.alert.success {

    background: #B8F2BC;

    border-color: #90CD90;

    color: #3F963E;

}



.alert.warning {

    background: #FFFFC7;

    border-color: #FFFF00;

    color: #BEA34E;

}



.alert.error {

    background: #FFE1E1;

    border-color: #E38888;

    color: #D34848;

}



.alert.notice {

    background: #C6DAFF;

    border-color: #8A89F4;

    color: #504FA9;

}



/* Close button */

.alert .alert-button {

    color: white;

    font-size: 14px;

    right: 0;

    top: 0;

    padding: 10px 18px; /* Extra click space */

    position: absolute;

}





/* ===================================================== */

/* Progress Bar

/* ===================================================== */



.progress-bars {

    display: block;

    margin: 54px 0 0 0;

}



.progress-bars .title {

    color: gray;

    display: block;

    font-family: 'Open Sans', sans-serif;

    position: absolute;

    top: -25px;

    text-transform: uppercase;

    text-align: center;

}



.bar {

    background: #f2f2f2;

    height: 26px;

    margin-bottom:40px;

    position: relative;

}



.progress {

    background: #7fbbc5;

    color: white;

    display: block;

    height: 100%;

    font-style: italic;

    line-height: 25px;

    padding: 0 10px 0 0;

    text-align: right;

}





/* ===================================================== */

/* DropCaps

/* ===================================================== */



.dropcap {

    color: rgb(77, 77, 77);

    float: left;

    font-size: 40px;

    line-height: 1;

    line-height: 30px;

    margin: 0 5px 0 0;

}



.dropcap.color {

    color: #7fbbc5;

}





/* ===================================================== */

/* Tables

/* ===================================================== */



.table-standard {

    background: #fff;

    border: 1px solid #EEEEEE;

    width: 100%;

}



.table-standard th, .table-standard td {

    border: 1px solid #EEEEEE;

    padding: 10px;

}



.table-standard th {

    background: #f2f2f2;

}





/* ===================================================== */

/* Highlights

/* ===================================================== */



.highlight-color {

    background: #7fbbc5;

    color: white;

    padding: 0 2px;

}



.highlight-gray {

    background: #a7a7a7;

    color: white;

    padding: 0 2px;

}





/* ===================================================== */

/*  Milestones

/* ===================================================== */



.milestones .one-fourth {

    padding: 14px 0 20px;

    text-align: center;

}



.milestones i {

    color: #7fbbc5;

    font-size: 20px

}



.milestones .count {

    font-size: 38px;

    font-weight: 800;

    color: #777;

}





/* ===================================================== */

/* Infobox

/* ===================================================== */



.info-box {

    background: #fff;

    border: 1px solid #f2f2f2;

    display: block;

    margin-bottom: 20px;

    padding: 20px 20px 20px 20px;

    position: relative;

}



.info-box[class^="icon-"] {

    padding-left: 80px;

}



.info-box:before {

    background: #ccc;

    color: white;

    font-size: 20px;

    height: auto;

    top: 0;

    left: 0;

    bottom: 0;

    padding: 20px;

    position: absolute;

}





/*================================================= */

/* Project Viewer

/*================================================= */



.project-wrapper {

    height: 0;

    overflow: hidden;

    color: #777;

    text-align: left;

}



.project {

    background: #fff;

    padding-bottom: 40px;

    margin-bottom: 50px;

}



.project .container {

    height: 100%;

}



.project-wrapper .button {

    margin-bottom: 0;

}



.project-wrapper .close {

    display: block;

    height: 50px; width: 50px;

    font-size: 30px;

    color: #ddd;

    padding: 50px 0 80px 0;

    text-align: center;

    width: 100%;

}



.project-wrapper .loader {

    color: #444;

    height: 50px;

    padding-top: 16px;

    text-align: center;

}



.project-details {

    margin-bottom: 40px;

}



.project-details li {

    margin-bottom: 15px;

}



.project-details li i {

    background: rgba(255, 255, 255, 0.07);

    border: none;

    border-radius: 50%;

    color: #aaa;

    display: inline-block;

    font-size: 12px;

    padding: 0 10px 0 0;

    text-align: center;

    left: 0; top: -5px;

}





/*================================================= */

/* prettyPhoto

/*================================================= */



div.light_square .pp_close:before {

    content: "\f05c";

}



div.light_square .pp_close {

    background: none;

    color: #ccc;

  font-size: 24px;

      display: inline;

  font-family: FontAwesome;

  font-style: normal;

  font-weight: normal;

  line-height: 1;

  text-indent: 0;

  width: 20px;

  overflow: hidden;

  -webkit-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale;



  z-index: 9999;

}