@font-face{
     font-family:Raleway-Medium;
     src:url(../../fonts/Raleway-Medium.ttf) 
}
 @font-face{
     font-family:Raleway-Bold;
     src:url(../../fonts/Raleway-Bold.ttf) 
}
 @font-face{
     font-family:Raleway-SemiBold;
     src:url(../../fonts/Raleway-SemiBold.ttf) 
}
 @font-face{
     font-family:FontAwesome;
     src:url(../../fonts/FontAwesome.otf) 
}
 body{
     font-family:Raleway-Medium 
}
 a{
     color:#283a44 
}
 img{
     max-width:100% 
}
 p{
     font-size:15px;
	  margin: 0 0 20px;
}
 .fl{
     float:left 
}
 .fr{
     float:right 
}
 .clr{
     clear:both 
}
 .f-14{
     font-size:14px 
}
 .f-16,.lead-16{
     font-size:16px 
}
 .text-blue{
     color:#225e8c 
}
 .text-black{
     color:#000 
}
 .text-dark-blue{
     color:#283a44 
}
 .text-red{
     color:red 
}
 .bg-dark-blue{
     background:#283a44 
}
 .bg-grey{
     background:#E1E5E8 
}
 .bg-black{
     background:#000 
}
 .bg-white{
     background:#fff 
}
 .heading-hr{
     width:100px;
     height:3px 
}
 .Raleway-bold{
     font-family:Raleway-Bold 
}
 .Raleway-semibold,.blog-box .title,.content-heading,.info h3,.product-box .product-title{
     font-family:Raleway-SemiBold 
}
 .lead-16{
     line-height:26px 
}
 .lead-18{
     font-size:18px;
     line-height:30px 
}
 .lead-20{
     font-size:20px;
     line-height:34px 
}
 .p-40{
     padding-top:40px 
}
 .ml-100{
     margin-left:100px 
}
.banner-content{
     text-align:center 
}
 .banner-content p{
     margin-top: 22px;
     margin-bottom: 0;
}
 #return-to-top,a:hover{
     text-decoration:none 
}
 .hovereffect p, .our-studio p {
     font-size: 14px 
}
 .hovereffect {
     width: 100%;
     max-width: 276px;
     margin: 0 auto 10px;
     height: auto;
     overflow: hidden;
     position: relative;
     cursor: default;
     margin-bottom: 10px;
     border-radius: 5px 
}
 .hovereffect .overlay {
     width: 100%;
     height: 100%;
     position: absolute;
     overflow: hidden;
     text-align: center;
     top: 0;
     left: 0;
     opacity: 0;
     background-color: rgba(0, 0, 0, .5);
     transition: all .2s ease-in-out 
}
 .hovereffect img {
     display: block;
     position: relative;
     -webkit-transition: all .2s linear;
     transition: all .2s linear 
}
 .hovereffect p {
     color: #fff;
     padding: 0 16px 
}
 .hovereffect h5 {
     color: #fff;
     position: relative;
     font-size: 14px;
     font-weight: 500;
     background: rgb(13, 33, 71, 0.5);
     -webkit-transform: translatey(-100px);
     -ms-transform: translatey(-100px);
     transform: translatey(-100px);
     transition: all .2s ease-in-out;
     padding: 10px;
     margin-top: 20px 
}
 .hovereffect i {
     display: inline-block;
     color: #fff;
     border: 1px solid #fff;
     background-color: transparent;
     opacity: 0;
     filter: alpha(opacity=0);
     -webkit-transition: all .2s ease-in-out;
     transition: all .2s ease-in-out;
     margin: 10px 0 0;
     padding: 10px 14px;
     cursor: pointer 
}
 .free-quote-btn, .read-more-btn {
     text-transform: uppercase;
     display: block;
     transition: .2s;
     font-family: 'Fjalla One', sans-serif;
     text-align: center 
}
 .hovereffect i:hover {
     box-shadow: 0 0 5px #fff 
}
 .hovereffect:hover img {
     -ms-transform: scale(1.2);
     -webkit-transform: scale(1.2);
     transform: scale(1.2) 
}
 .hovereffect:hover .overlay {
     opacity: 1;
     filter: alpha(opacity=100) 
}
 .hovereffect:hover h5, .hovereffect:hover i {
     opacity: 1;
     filter: alpha(opacity=100);
     -ms-transform: translatey(0);
     -webkit-transform: translatey(0);
     transform: translatey(0) 
}
 .hovereffect:hover i {
     -webkit-transition-delay: .2s;
     transition-delay: .2s 
}
 .latest-works .works {
     border-radius: 3px;
     box-shadow: 0 2px 5px 0 rgba(0,0,0,.16), 0 2px 10px 0 rgba(0,0,0,.12);
     padding: 30px 20px 15px;
     background: #fff;
     margin-bottom: 10px;
}
 .latest-works .works i {
     color: #4182bf;
     height: 36px;
     width: 36px;
     line-height: 36px;
     text-align: center;
     border-radius: 50%;
     border: 1px solid rgba(0,0,0,0.2);
     padding-left: 2px;
     transition: 0.2s all;
}
 .latest-works .works i:hover {
     background: #283a44;
}
 .latest-works .works h5 {
}
 .latest-works .works p {
     font-size: 14px;
}
/* Outer */
 .popup {
     width:100%;
     height:100%;
     display:none;
     position:fixed;
     z-index: 1000;
     top:0px;
     left:0px;
     background:rgba(0,0,0,0.75);
}
/* Inner */
 .popup-inner {
     max-width:700px;
     width:90%;
     padding:40px;
     position:absolute;
     top:50%;
     left:50%;
     -webkit-transform:translate(-50%, -50%);
     transform:translate(-50%, -50%);
     box-shadow:0px 2px 6px rgba(0,0,0,1);
     border-radius:3px;
     background:#fff;
}
/* Close Button */
 .popup-close {
     width:30px;
     height:30px;
     padding-top:4px;
     display:inline-block;
     position:absolute;
     top:0px;
     right:0px;
     transition:ease 0.25s all;
     -webkit-transform:translate(50%, -50%);
     transform:translate(50%, -50%);
     border-radius:1000px;
     background:rgba(0,0,0,0.8);
     font-family:Arial, Sans-Serif;
     font-size:20px;
     text-align:center;
     line-height:100%;
     color:#fff;
}
 .popup-close:hover {
     -webkit-transform:translate(50%, -50%) rotate(180deg);
     transform:translate(50%, -50%) rotate(180deg);
     background:rgba(0,0,0,1);
     text-decoration:none;
     color: #fff;
}
 .audio-container audio {
     width: 100%;
}
 .testimonials {
     position: relative;
     padding-top: 30px;
     background: #f1f1f1;
     margin-top: 20px;
}
 .testimonials i {
     width: 80px;
     height: 80px;
     line-height: 80px;
     text-align: center;
     background: #f1f1f1;
     border-top: 1px solid rgba(0,0,0,0.1);
     font-size: 36px;
     color: #4182bf;
     position: absolute;
     left: 0;
     right: 0;
     top: -40px;
     margin: 0 auto;
     border-radius: 50%;
}
 #owl-testimonial {
     text-align: center;
}
 #owl-testimonial .item {
     margin: 30px;
}
 #owl-testimonial p {
     font-size: 14px;
}
 #owl-testimonial img {
     width: 90px;
     border-radius: 50%;
     margin: 0 auto;
     margin-bottom: 10px;
     background: #fff;
}
 #owl-testimonial h5 {
     margin-bottom: 5px;
     font-size: 18px;
}
 #owl-testimonial h6 {
     font-size: 14px;
}
 .connect-us {
     margin: 12px 0;
}
 .connect-us li {
     list-style-type: none;
     font-size: 14px;
     line-height: 22px;
}
 .connect-us li i {
     margin-right: 5px;
     color: #283a44;
}
 .sticky{
     position:fixed!important;
     width:100%;
     left:0;
     top:0;
     z-index:100;
     border-top:0 
}
 .banner-box{
     position:relative 
}
 .banner-box img:after{
     content: "";
}
 .banner-content{
     position:absolute;
     color:#fff;
     top:30%;
     left:0;
     right:0;
     font-size:40px;
     margin:0 auto 
}
 .banner-heading{
     font-size:42px;
     line-height: 54px;
}
 .banner-heading span{
     font-size: 44px;
     display: block;
     color: #f1f1f1;
}
 .banner-section .owl-theme .owl-nav.disabled+.owl-dots{
     position:absolute;
     left:0;
     right:0;
     bottom:0 
}
 .product-tabs{
     overflow:hidden 
}
 .button{
     position:relative;
     display:inline-block;
     color:#283a44;
     padding:.5rem 1.5rem;
     margin:0 auto;
     background-color:#E1E5E8;
     border:none;
     width:100%;
     font-size:1.2rem;
     text-align:left;
     -webkit-transition:all .3s;
     -moz-transition:all .3s;
     transition:all .3s 
}
 .button:hover{
     background-color:#283a44;
     color:#fff 
}
 .button:hover:after,.button:hover:before{
     color:#4cc4cf 
}
 .button:after,.button:before{
     -webkit-transition:all .3s;
     -moz-transition:all .3s;
     transition:all .3s 
}
 .box{
     border-radius:3px;
     box-shadow:0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12);
     padding:38px 30px;
     text-align:right;
     display:block;
     background:#fff;
     margin-bottom:10px 
}
 .box:hover>.box-icon,.box>.box-icon{
     border:2px solid #4182bf 
}
 .box-icon span{
     color:#fff;
     display:table-cell;
     text-align:center;
     vertical-align:middle 
}
 .info h3{
     color:#555454;
     font-size:18px;
     margin:0;
     font-weight:100;
     padding:28px 0 
}
 .info>p{
     color:#717171;
     font-size:15px;
     text-align:center 
}
 .box:hover>.box-icon{
     background-color:#fff;
     color:#283A44;
     -webkit-transition:All .5s ease;
     -moz-transition:All .5s ease;
     -o-transition:All .5s ease 
}
 .box:hover>.box-icon>span{
     color:#283A44 
}
 .box-icon{
     background-color:#4182bf;
     border-radius:50%;
     display:table;
     height:90px;
     margin:0 auto;
     width:90px 
}
 .tab_container,ul.tabs{
     display:inline-block;
     vertical-align:top;
     position:relative 
}
 .tabs_wrapper{
     width:100%;
     text-align:center;
     margin:0 auto;
     background:0 0 
}
 ul.tabs{
     z-index:10;
     margin:25px 0 0;
     padding:0;
     width:24%;
     overflow-y:scroll;
     height:279px;
     min-width:175px;
     list-style:none;
     -ms-transition:all .3s ease;
     -webkit-transition:all .3s ease;
     transition:all .3s ease;
     box-shadow:2px 2px 10px rgba(0,0,0,.4) 
}
 ul.tabs li,ul.tabs li:hover{
     color:#fff;
     -ms-transition:all .3s ease;
     -webkit-transition:all .3s ease 
}
 ul.tabs li{
     margin:0;
     cursor:pointer;
     padding:0 15px;
     line-height:31px;
     text-align:left;
     background:#2a3e47;
     background:-moz-linear-gradient(top,#2a3e47 0,#436772 100%);
     background:-webkit-linear-gradient(top,#2a3e47 0,#436772 100%);
     background:linear-gradient(to bottom,#2a3e47 0,#436772 100%);
     filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#2a3e47', endColorstr='#436772', GradientType=0 );
     transition:all .3s ease 
}
 ul.tabs li:hover{
     background:#3a5563;
     background:-moz-linear-gradient(top,#3a5563 0,#527b8c 100%);
     background:-webkit-linear-gradient(top,#3a5563 0,#527b8c 100%);
     background:linear-gradient(to bottom,#3a5563 0,#527b8c 100%);
     filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#3a5563', endColorstr='#527b8c', GradientType=0 );
     transition:all .3s ease 
}
 ul.tabs li.active{
     background:#172026;
     background:-moz-linear-gradient(top,#172026 0,#22323a 100%);
     background:-webkit-linear-gradient(top,#172026 0,#22323a 100%);
     background:linear-gradient(to bottom,#172026 0,#22323a 100%);
     filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#172026', endColorstr='#22323a', GradientType=0 );
     color:#ddd;
     -ms-transition:all .3s ease;
     -webkit-transition:all .3s ease;
     transition:all .3s ease 
}
 .tab_container{
     z-index:20;
     left:0;
     width:74%;
     min-width:10px;
     text-align:left;
     background:#fff;
     border-radius:12px;
     box-shadow:2px 2px 10px rgba(0,0,0,.5) 
}
 .tab_content,.tab_drawer_heading{
     display:none 
}
 .tab_content{
     padding:20px;
     height:100% 
}
 .content-heading{
     color:#283A44;
     font-size:30px 
}
 @media screen and (max-width:781px){
     ul.tabs{
         display:none 
    }
     .tab_container{
         display:block;
         margin:0 auto;
         width:95%;
         border-top:none;
         border-radius:0;
         box-shadow:0 0 10px #000 
    }
     .tab_drawer_heading{
         background:#2a3e47;
         background:-moz-linear-gradient(top,#2a3e47 0,#436772 100%);
         background:-webkit-linear-gradient(top,#2a3e47 0,#436772 100%);
         background:linear-gradient(to bottom,#2a3e47 0,#436772 100%);
         filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#2a3e47', endColorstr='#436772', GradientType=0 );
         color:#fff;
         font-size:22px;
         margin:0;
         padding:5px 20px;
         display:block;
         cursor:pointer;
         -webkit-touch-callout:none;
         -webkit-user-select:none;
         -khtml-user-select:none;
         -moz-user-select:none;
         -ms-user-select:none;
         user-select:none;
         text-align:center 
    }
     .content-heading,.d_active{
         font-size:24px 
    }
     .tab_drawer_heading:hover{
         background:#3a5563;
         background:-moz-linear-gradient(top,#3a5563 0,#527b8c 100%);
         background:-webkit-linear-gradient(top,#3a5563 0,#527b8c 100%);
         background:linear-gradient(to bottom,#3a5563 0,#527b8c 100%);
         filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#3a5563', endColorstr='#527b8c', GradientType=0 );
         color:#fff 
    }
     .d_active{
         background:#172026;
         background:-moz-linear-gradient(top,#172026 0,#22323a 100%);
         background:-webkit-linear-gradient(top,#172026 0,#22323a 100%);
         background:linear-gradient(to bottom,#172026 0,#22323a 100%);
         filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#172026', endColorstr='#22323a', GradientType=0 );
         color:#ddd 
    }
}
 .product-box{
     padding:10px 20px 25px;
     text-align:center;
     -moz-transition:all .2s ease;
     -ms-transition:all .2s ease;
     -o-transition:all .2s ease;
     transition:all .2s ease 
}
 .product-box:hover{
     background:rgba(40,58,68,.2);
     border-radius:5px 
}
 .product-box .product-img{
     padding:10px 20px 0 
}
 .product-box .product-title{
     color:#283A44;
     font-size:18px 
}
 .product-box p{
     font-size:14px;
     min-height:63px 
}
 .blog-box{
     border-radius:3px;
     box-shadow:0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12);
     padding:25px;
     display:block;
     background:#fff;
     margin-bottom:10px 
}
 .blog-box .title{
     color:#283A44;
     min-height:88px 
}
 .blog-box ul{
     margin-bottom:6px 
}
 .blog-box ul li{
     font-size:12px;
     display:inline-block;
     margin-right:8px;
     color:#777 
}
 .blog-box ul li i{
     margin-right:2px;
     color:#283A44 
}
 .blog-box p{
     font-size:14px;
     color:#777 
}
 .read-more{
     color:#283A44;
     margin-top:4px;
     border:1px solid #283A44;
     -moz-transition:all .2s ease;
     -ms-transition:all .2s ease;
     -o-transition:all .2s ease;
     transition:all .2s ease 
}
 .read-more:hover{
     background:#283A44;
     color:#fff 
}
 .testimonial-single{
     padding:30px 
}
 .testimonial-single .t-author{
     text-align:center;
     margin:auto;
     padding:2%;
     max-width:101px 
}
 .testimonial-single .t-author img{
     border:4px solid #fff;
     border-radius:50%;
     padding:5px;
     margin-bottom:15px 
}
 .testimonial-single .t-author h3{
     color:#fff;
     text-transform:uppercase;
     font-size:1em;
     line-height:22px 
}
 .testimonial-single .t-text{
     background:#fff;
     padding:30px 30px 10px;
     position:relative;
     transition:.2s all;
     min-height:298px 
}
 .testimonial-single .t-text:hover{
     transform:translateX(-10px) 
}
 .testimonial-single .t-text:before{
     content:"";
     display:block;
     border:10px solid transparent;
     position:absolute;
     top:40px;
     left:-20px;
     border-right-color:#fff 
}
 #return-to-top{
     position:fixed;
     z-index:1000;
     bottom:20px;
     right:20px;
     background:#000;
     background:rgba(0,0,0,.7);
     width:50px;
     height:50px;
     -webkit-border-radius:35px;
     -moz-border-radius:35px;
     border-radius:35px;
     display:none;
     -webkit-transition:all .3s linear;
     -moz-transition:all .3s ease;
     -ms-transition:all .3s ease;
     -o-transition:all .3s ease;
     transition:all .3s ease 
}
 #return-to-top i{
     color:#fff;
     margin:0;
     position:relative;
     left:16px;
     top:13px;
     font-size:19px;
     -webkit-transition:all .3s ease;
     -moz-transition:all .3s ease;
     -ms-transition:all .3s ease;
     -o-transition:all .3s ease;
     transition:all .3s ease 
}
 #return-to-top:hover{
     background:rgba(0,0,0,.9) 
}
 #return-to-top:hover i{
     color:#fff;
     top:5px 
}
 footer{
     background: #283a44;
}
 .social-btns .btn, .social-btns .btn .fa, .social-btns .btn:before {
     -webkit-transition: all .35s;
     transition: all .35s;
     -webkit-transition-timing-function: cubic-bezier(.31, -.105, .43, 1.59);
     transition-timing-function: cubic-bezier(.31, -.105, .43, 1.59);
     padding: 4px;
}
 .social-btns .btn:before {
     top: 90%;
     left: -110% 
}
 .social-btns .btn .fa {
     -webkit-transform: scale(.8);
     transform: scale(.8) 
}
 .social-btns .btn.facebook:before {
     background-color: #3b5998 
}
 .social-btns .btn.facebook .fa {
     color: #3b5998 
}
 .social-btns .btn.twitter:before {
     background-color: #3cf 
}
 .social-btns .btn.twitter .fa {
     color: #3cf 
}
 .social-btns .btn.google:before {
     background-color: #dc4a38 
}
 .social-btns .btn.google .fa {
     color: #dc4a38 
}
 .social-btns .btn.linkedin:before {
     background-color: #0077B5 
}
 .social-btns .btn.linkedin .fa {
     color: #0077B5 
}
 .social-btns .btn.youtube:before {
     background-color: #d62a39 
}
 .social-btns .btn.youtube .fa {
     color: #d62a39 
}
 .social-btns .btn:focus:before, .social-btns .btn:hover:before {
     top: -10%;
     left: -10% 
}
 .social-btns .btn:focus .fa, .social-btns .btn:hover .fa {
     color: #fff;
     -webkit-transform: scale(1);
     transform: scale(1) ;
     display: block;
}
 .social-btns {
     margin: auto;
     font-size: 0;
     text-align: center 
}
 .social-btns .btn {
     display: inline-block;
     background-color: #fff;
     width: 50px;
     height: 50px;
     line-height: 40px;
     margin: 0 8px;
     text-align: center;
     position: relative;
     overflow: hidden;
     border-radius: 50%;
     border: 1px solid #b1b1b1;
     -webkit-box-shadow: 0 5px 15px -5px rgba(0, 0, 0, .1);
     box-shadow: 0 5px 15px -5px rgba(0, 0, 0, .1);
     opacity: .99 
}
 .social-btns .btn:before {
     content: '';
     width: 120%;
     height: 120%;
     position: absolute;
     -webkit-transform: rotate(45deg);
     transform: rotate(45deg) 
}
 .social-btns .btn .fa {
     font-size: 30px;
     vertical-align: middle 
}
 .fancybox-title-float-wrap .child {
     white-space: normal;
     color: #57c3ff;
     font-weight: 500;
     line-height: 18px;
     padding: 5px;
     border-radius: 5px;
}
 .bordered-btn a,.we-accept span{
     display:inline-block;
     font-family:Raleway-Bold 
}
 .bordered-btn a{
     color:#656565;
     font-size:14px;
     border:1px solid #ccc;
     padding:10px 25px;
     border-radius:28px;
     -webkit-transition:all .4s;
     -o-transition:all .4s;
     transition:all .4s 
}
 .bordered-btn a i{
     font-size:16px;
     margin-right:2px;
     color:#283A44 
}
 .bordered-btn a:hover i{
     color:#fff 
}
 .bordered-btn a:hover{
     background:#283A44;
     border-color:#283A44;
     color:#fff 
}
 @media screen and (min-width:768px) and (max-width:991px){
     .bordered-btn a{
         padding:10px 18px 
    }
}
 @media only screen and (max-width: 991px) {
 .hovereffect {
     max-width: 270px;
     margin: 0 auto 10px;
}
 @media screen and (max-width:667px){
     .banner-content {
         top: 9% !important;
    }
}
 @media screen and (max-width:576px){
     .banner-box img {
         height: 310px;
    }
}
 @media screen and (max-width:480px){
     .banner-content{
         top:15% 
    }
     .banner-content p{
         font-size:14px 
    }
     .banner-heading{
         font-size:30px 
    }
}
 @media screen and (max-width:360px){
     .logo{
         width:160px 
    }
}
 @media screen and (min-width:270px) and (max-width:320px){
     .banner-content{
         top:15%;
         font-size:36px 
    }
     .banner-content p{
         font-size:12px 
    }
     .banner-heading{
         font-size:20px 
    }
}