@charset "UTF-8";

body {font-family: 'Raleway', sans-serif; background:#fff; }

body, html{height: 100%;}

a{display: block; transition: all linear .3s}
a:hover{text-decoration: none;}
ul{margin: 0}
.mb-30 {padding: 30px 0;}

header#header {background: #fff; margin-top: 10px; width: 100%; position: fixed; z-index: 1}
header#header.page-index {position: relative;}

header#header nav{background: #fff; border:0; margin: 10px 0 15px 0}
header#header .navbar-collapse{float: right; margin-top:10px}
header#header .navbar-nav{float: left;}
header#header .navbar-nav li a{color: #000; font-weight: 600;padding: 15px 3px 10px 3px; margin: 5px 15px 0 15px; border-bottom: 4px solid #fff; }
header#header .navbar-nav li:hover a,
header#header .navbar-nav li a.active{background: transparent; color: #d03926; font-weight: 600; border-bottom: 4px solid #d03926;  }
header#header #phone{float: right; margin: 15px 0px 0 20px; font-size: 16px}
header#header #phone span{ margin-right: 5px; background: #d03926; color: #fff; border-radius: 50%; display: inline-block; width: 33px; height: 32px; line-height: 30px; text-align: center;}
header#header #phone span .fa{ font-size: 13px; border: 1px solid #fff; border-radius: 50%; width: 23px; line-height: 21px; }
header#header .logo {padding-top: 10px}

/*Slider-Start*/
#slider .jumbotron,#slider .carousel-content {background: none; border: none; width: 40%; top: 20%; display: inline; margin:0 auto; left: 30%; text-align: center;}
#slider .jumbotron__title h1 {color: #fff; font-size: 36px; font-weight: 500; background: rgba(0,0,0,.2); padding:10px; font-weight: 600}
#slider .jumbotron__content > h4{font-size: 26px; line-height: 30px;color: #46647e; color: #fff; font-weight: 600;  }
#slider .jumbotron__content > h4 > span{color:#d03926}
#slider .carousel-control.left,
#slider .carousel-control.right {background: none; font-size: 100px; font-weight: 700; opacity: .5}
#slider .carousel-control.left {left:5%;}
#slider .carousel-control.right {right: 5%}
#slider .carousel-control.left:hover,
#slider .carousel-control.right:hover{opacity: 1}
/*Slider-Finish*/

#page-content {background: url(../img/bg-parallax.jpg) repeat center top; }
#page-content .services-negative-top {margin: 0; position: relative; padding:30px 0;}
#page-content .service-media {position: relative; overflow: hidden;}
#page-content .service-media a {display: block; position: absolute; background-color: #d03926; color: #fff; bottom: 0; right: 0;text-transform: uppercase;}
#page-content .service-media a > span{padding-left: 10px}
#page-content .service-media a > span > .fa{background: #2e3740; padding: 7px 8px; margin:0 -1px 0 5px}
#page-content .service-media a:hover{background-color: #2e3740;}
#page-content .service-media a:hover > span > .fa{background-color: #1a2128;}

#page-content .service-body {background: #fff; padding: 15px}
#page-content .service-body h4{font-weight: 600; font-size: 20px; line-height: 60px; margin: 0; position: relative;}
#page-content .service-body h4:before{content: ''; width: 50px; height: 4px;background: #d03926; position: absolute; top: 0 }
#page-content .service-body p{font-size: 16px; line-height: 24px} 
#page-content.parallax {background-attachment: fixed;background-repeat: no-repeat;background-size: cover; background-color:#1f1f2d;}

#main {padding:30px 0;}
#main .custom-heading02 {text-align: center;}
#main .custom-heading02 h2{font-size: 32px;line-height: 10px; color: #2e3740; font-weight: 600; position: relative;}
#main .custom-heading02:before{content: ''; margin-left: -25px; width: 50px; height: 4px; background: #d03926; position: absolute; bottom: 0}
#main .custom-heading02 p{font-size: 15px;line-height: 22px; color: #999; padding: 10px 0}

#main .service-icon-left-boxed {background-color: rgba(242,242,242,.4);padding: 30px 40px; margin:15px 0;}
#main .service-icon-left-boxed .icon-container { float: left;width: 100px; }
#main .service-icon-left-boxed .service-details {padding-left: 120px;}
#main .service-icon-left-boxed .service-details h3{margin: 0 0 10px 0; font-size: 22px; font-weight: 600; }
#main .service-icon-left-boxed .service-details p{overflow: hidden; height: 68px; line-height: 22px }

#about {padding:30px 0; background: url(../img/bg-about.jpg) no-repeat center top;}
#about .custom-heading02 {text-align: center; padding:0 0 20px 0}
#about .custom-heading02 h2{font-size: 32px;line-height: 10px; color: #fff; font-weight: 600; position: relative;}
#about .custom-heading02:before{content: ''; margin-left: -25px; width: 50px; height: 4px; background: #d03926; position: absolute; bottom: 0}
#about .custom-heading02 p{font-size: 15px;line-height: 30px; color: #999;}

#about .about-details {padding:15px 0; text-align: center;}
#about .about-details p{font-size: 16px; color: #b8b9bc; line-height:24px;}
#about .about-details a{font-size: 16px; color: #d03926; font-weight: 600; margin-top: 30px;}
#about .about-details a:hover{color: #fff;}

#services {margin: 30px 0;}
#services .custom-heading h3{font-weight: 600; font-size: 24px; line-height: 60px; margin: 0; position: relative;}
#services .custom-heading h3:before{content: ''; width: 50px; height: 4px;background: #f8c200; position: absolute; top: 3px }

#services .pi-latest-posts li{display: inline-block;margin:10px 0;}
#services .pi-latest-posts li .post-media {float: left; width: 100px; height: 100px;}
#services .pi-latest-posts li .post-details{padding-left: 120px}
#services .pi-latest-posts .post-date p {color: #565f66;font-size: 12px;font-weight: 600;text-transform: uppercase; margin-bottom: 3px}
#services .pi-latest-posts .post-details h4{color: #161622;font-size: 15px;font-weight: 600; line-height: 20px; margin:0;}
#services .pi-latest-posts .post-details a{color: #f8c200;font-size: 14px;font-weight: 600; line-height: 20px; margin-top: 10px; float: right;}
#services .pi-latest-posts .post-details a:hover{color: #565f66;}
#services .pi-latest-posts .post-date p>.fa{color:#f8c200;}

#services .testimonial {padding: 15px; background: #f0f0f2}
#services .testimonial p{color:#161616;}
#services .testimonial .testimonial-author {border-top: 1px solid #bfbfc1; padding-top: 10px;}
#services .slick .slick-prev, #services .slick .slick-next{background: #2f3840; top:auto; bottom: 0; z-index: 2; transition: all linear .3s}
#services .slick .slick-prev:hover, #services .slick .slick-next:hover{background: #f8c200;}
#services .slick .slick-prev:before{font-family: 'FontAwesome'; content: '\f104'}
#services .slick .slick-next:before{font-family: 'FontAwesome'; content: '\f105'}
#services .slick .slick-prev{right: 34px; left: auto;}
#services .slick .slick-next{right: 10px}
#services .testimonial-carousel .slick-next{background: #2f3840; top:auto; bottom: 0}

#services .locations a{color: #f8c200;font-size: 14px;font-weight: 600; line-height: 20px; float: right;}
#services .locations a:hover{color: #565f66;}
#services .locations p{color: #161616; padding-top: 10px;}

#logos {margin-top: 30px; padding: 30px 0; background: #f6f6f6}
#logos #client-carousel div{ margin:0px 10px; display: block; text-align:center}
#logos #client-carousel div img:hover{opacity: .8}

#logos .custom-heading02 {text-align: center; padding:0 0 15px 0; margin-bottom: 20px}
#logos .custom-heading02 h2{font-size: 20px;line-height: 10px; color: #161622; font-weight: 600; position: relative;}
#logos .custom-heading02:before{content: ''; margin-left: -25px; width: 50px; height: 4px; background: #d03926; position: absolute; bottom: 20px}

#logos .slick .slick-prev, #logos .slick .slick-next{opacity: 0; background: #2f3840; top:auto; bottom: 0; z-index: 2; transition: all linear .3s}
#logos .slick .slick-prev:hover, #logos .slick .slick-next:hover{background: #f8c200;}
#logos .slick .slick-prev:before{font-family: 'FontAwesome'; content: '\f104'}
#logos .slick .slick-next:before{font-family: 'FontAwesome'; content: '\f105'}
#logos .slick .slick-prev{right: 10px; top: 55px; left: auto;}
#logos .slick .slick-next{right: 10px}
#logos .slick:hover .slick-next, #logos .slick:hover .slick-prev{opacity: 1;}
#logos .testimonial-carousel .slick-next{background: #2f3840; top:auto; bottom: 0}

footer#footer {padding: 20px 0; background-color: #25272e}
footer#footer .title{padding: 15px 0 0 0; margin-bottom: 15px}
footer#footer .title h4{color: #fff; font-weight: 600; font-size: 16px; line-height: 20px; margin:0;}
footer#footer .title h4 > span{color: #fd3645;}

footer#footer p{color: #9a9aa0}
footer#footer a{color: #9a9aa0; font-weight: bold;}
footer#footer a:hover{color: #d03926;}
footer#footer .footer-logo{padding: 10px 0}
footer#footer .social li{float: left; margin:10px 5px }
footer#footer .social li > a{background-color: #39393c; font-size: 16px; color: #fff; width: 30px; height: 30px; text-align: center; line-height: 30px; border-radius: 50%}
footer#footer .social li > a.facebook:hover{background-color: #4867aa;}
footer#footer .social li > a.twitter:hover{background-color: #32d0fe;}
footer#footer .social li > a.mail:hover{background-color: #fd3645;}

footer#footer .footer-menu li { list-style: disc;}
footer#footer .footer-menu li > a{color: #9a9aa0; line-height: 24px; font-size: 13px}
footer#footer .footer-menu li > a:hover{color: #fff}

footer#footer .photo-gallery > a{margin:3px; float: left}

footer#footer .contact li {margin:7px 0; }
footer#footer .contact li > a{color: #9a9aa0; }
footer#footer .contact li > a:hover{color: #d03926; }
footer#footer .contact li:first-child{margin-bottom: 20px }
footer#footer .contact li > a > .fa {width: 20px; margin-right: 10px; font-size: 13px; width: 22px; height: 22px; line-height: 22px; background-color: #39393c; text-align: center; border-radius: 50%}

footer#footerBottom{background-color: #222328; padding: 15px 0;}
footer#footerBottom p{color: #9a9aa0;margin-bottom: 0; font-size: 13px}


.gallery a{position: relative; margin: 15px 0;}
.gallery a > img{margin:0; display: inline-block; }
.gallery a > span > .fa{color: #fff; font-size: 34px; position: absolute; top: 40%;left: 43%;}
.gallery a > span{ transition: all linear .3s; text-align: center; width: 100%; height: 100%; opacity: 0; left: 0; top: 0;background: rgba(0,0,0,.2); position: absolute;}
.gallery a:hover > span{opacity: 1}

section#breadcrumbs{background: url(../img/bg-parallax.jpg) no-repeat center top; text-align: center;padding:30px 0;}
section#breadcrumbs h1{font-size: 30px;color: #fff;position: relative;text-align: center;}
section#breadcrumbs h1:after{background-color: #d03926;width: 70px;height: 3px;bottom: 0;content: "";margin: 0 auto;text-align: center;display: block;position: relative;top: 10px;}
section#breadcrumbs ul{padding-top: 15px; text-align: center; display: inline-block;margin: 0 auto;}
section#breadcrumbs ul li {float: left; padding: 0;}
section#breadcrumbs ul li a{color:#a9a6a6; padding:0 5px; border-left: 1px solid #a9a6a6; font-size: 13px}
section#breadcrumbs ul li a:hover,
section#breadcrumbs ul li.active a{color:#fff;}
section#breadcrumbs ul li:first-child a{border-left: 0}

.typography .contact .address{border:1px solid #ddd; padding: 15px; background: #fafafb; margin-bottom: 15px}
.typography .contact a{display: inline;  }

.typography .contact-form .form-control,
.typography .contact-form textarea.form-control{font-size: 13px; border-radius: 0; border: 1px solid #ddd; box-shadow: none}
.typography .contact-form .btn{transition: all linear .3s; background: #d03926; color: #fff; border: 0; padding:6px 20px; border-radius: 3px;}
.typography .contact-form .btn:hover{ background: #121212; }

#map {border-top: 5px solid #d7d7dc; margin-top: 20px}

/*Typography-Start*/
.typography{padding: 20px 0;}
.typography ul, .typography > p,
.typography h1 > a, .typography h2 > a, .typography h3 > a, .typography h4 > a, .typography h5 > a, .typography h6 > a, .typography p > a {
    font-family: 'Raleway', serif;
    color: #333;
    padding: 0;
    margin-bottom: 15px;
    font-weight: 400;
    font-size: 14px;
    line-height: 22px;
}
.typography h1, .typography h2, .typography h3, .typography h4, .typography h5, .typography h6{ color: #333; position: relative; 
margin: 10px 0 20px 0;
}
.typography h1:before, .typography h2:before, .typography h3:before, .typography h4:before, .typography h5:before, .typography h6:before{
    position: absolute; content: ''; width: 50px; height: 4px; background: #d03926; bottom: -10px;
}

.typography h1, h1.post-title {
    font-size: 36px;
    font-weight: 700;
    line-height: 46px;
}

.typography h2, h2.post-title {
    font-size: 30px;
    font-weight: 700;
    line-height: 38px;
}

.typography h3, h3.post-title {
    font-size: 24px;
    font-weight: 700;
    line-height: 34px;
}

.typography h4, h4.post-title {
    font-size: 20px;
    font-weight: 700;
    line-height: 30px;
}

.typography h5, h5.post-title {
    font-size: 18px;
    font-weight: 700;
    line-height: 26px;
}

.typography h6, h6.post-title {
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
}

.typography p, .typography ul,.typography a {
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
}
.typography a {color: #333;}
.typography a:hover{color: #d03926;}
.typography ul {
    margin-left: 14px;
    line-height: 24px
}
.typography ul li:before{
    font-family: "FontAwesome";
    content: "\f111";
    font-size: 6px;
    position: relative; 
    bottom: 2px; margin-right: 8px;
    color: #121212
}
.typography hr{ color: #ddd }
.typography img{margin:0 10px }

.typography ul.contact-list li:before{display: none;}
.typography ul.contact-list li{line-height: 28px;}

/*Responsive*/
@media (max-width: 1200px) 
{
header#header .logo {float: left; width: 50%}
header#header ..navbar-default .navbar-toggle {float: left; width: 50%}
header#header .navbar-nav,header#header #phone {float: none; }
header#header #phone {margin: 15px 0px 0 0px}
header#header .navbar-default .navbar-toggle {border: 0}
#slider .jumbotron, #slider .carousel-content {width: 90%; left: 5%;}
#page-content .services-negative-top {margin: 30px 0}
}
@media (max-width: 992px) 
{
header#header .logo {float: left; width: 50%}
header#header ..navbar-default .navbar-toggle {float: left; width: 50%}

}
@media (max-width: 768px) 
{
#page-content .service-feature-box {margin-bottom: 20px;}
header#header {position: relative;}
#slider .jumbotron, #slider .carousel-content {width: 90%; left: 1%; right: 1%;}
#slider {background:#8d8e94}
}

.margin-top-40 {margin-top: 40px }

.typography .sidebar ul {margin:25px 0 0  }
.typography .sidebar ul li {border-bottom: 1px solid #ddd; padding: 5px;; margin:5px 0;}
.typography .sidebar ul li a{display: inline-block;}
.typography .sidebar ul li.active a{color:#d03926;}

.typography .item h5{margin:20px 0; display: block;}
.typography .item img {margin:30px 0 20px; border: 2px solid #ddd}
.typography .item a {padding:0px 0 8px;font-weight: bold ;}
.typography .item a:hover {border-color: #d03926}