/* ------------------------------------- */
/* TABLE OF CONTENTS 
/* ------------------------------------- 1. IMPORT GOOGLE FONTS 2. GENERAL -2.1 SECTION TITLE -2.2 BUTTONS -2.3 SOCIAL ICON -2.4 PRE LOADER -2.5 SCROLL TO UP 3. HERO AREA 4. NAVBAR 5. SERVICES SECTION 6. FEATURES SECTION 7. VIDEO PROMO SECTION 8. PORTFOLIO SECTION 9. PRICING TABLE 10. COUNTER SECTION 11. TESTIMONIAL AREA 12. TEAM SECTION 13. BLOG SECTION 14. CONTACT SECTION 15. FOOTER SECTION -15.1 COMING SOON PAGE ------------------------------------- */
/* ========================================================================== 1. IMPORT GOOGLE FONTS ========================================================================== */
 @import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i');
/* ========================================================================== 2. GENERAL ========================================================================== */
 body {
     font-family: 'Roboto', sans-serif !IMPORTANT;
     color: #333;
     font-size: 16px;
     background: #fff;
    /* overflow-x: hidden;
     */
}
 html {
     overflow-x: hidden;
}
 p {
     font-size: 16px !important;
     line-height: 26px;
     font-weight:300;
}
 a:hover, a:focus {
     color: #e5310e;
}
 a {
     -webkit-transition: all 0.2s linear;
     -moz-transition: all 0.2s linear;
     -o-transition: all 0.2s linear;
     transition: all 0.2s linear;
}
 h1, h2, h3, h4, h5 {
     font-family: 'Open Sans', sans-serif;
     font-size: 36px;
     font-weight: 700;
     letter-spacing: 1px;
}
 ul {
     margin: 0;
     padding: 0;
}
 ul li {
     list-style: none;
}
 a:hover, a:focus {
     text-decoration: none;
     outline: none;
}
 a:not([href]):not([tabindex]) {
     color: #fff;
}
 a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover {
     color: #61D2B4;
}
 .contents{
     padding:50px 0;
     margin:0;
}
 .contents h1{
     font-size:24px;
     color:#161616;
     text-transform:uppercase;
}
 .contents h2{
     font-size:2.5em;
     color:#e5310e;
     text-transform:uppercase;
}
 .contents p{
     color:#161616;
     font-size:16px;
     text-align:justify;
}
 .contents-w{
     padding:50px 0;
     margin:0;
}
 .contents-w h1{
     font-size:24px;
     color:#fefefe;
     text-transform:uppercase;
}
 .contents-w p{
     color:#fefefe;
     font-size:16px;
     text-align:justify;
}
/* ========================================================================== 2.1 Section Title ========================================================================== */
 .section {
     padding-top: 80px;
     padding-bottom: 0;
}
 .section-header {
     color: #fff;
     margin-bottom: 40px;
     text-align: center;
}
 .section-header .section-title {
     font-size: 42px;
     margin-top: 0;
     text-transform: uppercase;
     font-weight: 700;
     color: #333;
     position: relative;
}
 .section-header .section-title span {
     color: #61D2B4;
}
 .section-header .section-subtitle {
     margin-top: 15px;
     color: #333;
     font-size: 14px;
     font-weight: 400;
}
 .section-header .lines {
     margin: auto;
     width: 70px;
     position: relative;
     border-top: 2px solid #61D2B4;
     margin-top: 15px;
}
/* ========================================================================== 2.2 Buttons ========================================================================== */
 .btn {
     font-size: 14px;
     padding: 11px 40px;
     border-radius: 0px;
     font-weight: 400;
     color: #fff;
     text-transform: uppercase;
     -webkit-transition: all 0.2s linear;
     -moz-transition: all 0.2s linear;
     -o-transition: all 0.2s linear;
     transition: all 0.2s linear;
     display: inline-block;
}
 .btn:focus, .btn:active {
     box-shadow: none;
     outline: none;
     color: #fff;
}
 .btn-common {
    /* border: 1px solid #61D2B4;
     */
     background: #e5310e;
     position: relative;
     color: #fff;
     z-index: 1;
     padding:12px;
    /* border-radius: 30px;
     */
}
 .btn-common:hover {
     color: #e5310e;
     background: #fefefe;
     border-color: #e5310e;
     transition: all .50s ease-in-out;
     -moz-transition: all .50s ease-in-out;
     -webkit-transition: all .50s ease-in-out;
}
 .btn-border {
     color: #fff;
     background-color: transparent;
     border: 2px solid #fff;
     border-radius: 4px;
}
 .btn-border:hover {
     border: 2px solid #fff;
     color: #fff;
     background-color: #61D2B4;
}
 .btn-lg {
     padding: 14px 33px;
     text-transform: uppercase;
     font-size: 16px;
}
 .btn-rm {
     padding: 7px 0px;
     color: #999;
     text-transform: capitalize;
}
 .btn-rm i {
     vertical-align: middle;
}
 button:focus {
     outline: none !important;
}
 .clear {
     clear: both;
}
/* ========================================================================== 2.3 Social Iocns ========================================================================== */
 .social-icons {
     margin-top: 40px;
}
 .social-icons ul {
     margin: 0;
     padding: 0;
     list-style: none;
}
 .social-icons ul li {
     display: inline;
}
 .social-icons ul li a {
     display: inline-block;
     margin-right: 5px;
     margin-bottom: 15px;
     border-radius: 50%;
     line-height: 40px;
     width: 40px;
     height: 40px;
     text-align: center;
    /* background: #ddd;
     */
     font-size: 16px;
}
 .social-icons ul li a:hover {
     color: #fff;
}
 .facebook a {
     color: #4867AA;
}
 .facebook a:hover {
     background: #4867AA;
}
 .twitter a {
     color: #1DA1F2;
}
 .twitter a:hover {
     background: #1DA1F2;
}
 .google-plus a {
     color: #DD4D42;
}
 .google-plus a:hover {
     background: #DD4D42;
}
 .instagram a:hover {
     background: #f35b3b;
}
 .youtube a {
     color: #DF2926;
}
 .youtube a:hover {
     background: #DF2926;
}
 .linkedin a {
     color: #007BB6;
}
 .linkedin a:hover {
     background: #007BB6;
}
 .pinterest a {
     color: #BD081C;
}
 .pinterest a:hover {
     background: #BD081C;
}
 .dribbble a {
     color: #EA4C89;
}
 .dribbble a:hover {
     background: #EA4C89;
}
 .behance a {
     color: #0B7CFF;
}
 .behance a:hover {
     background: #0B7CFF;
}
/* ========================================================================== 2.4 Pre Loader ========================================================================== */
 #loader {
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: #fefefe;
     z-index: 9999999999;
}
 .spinner {
     width: 100px;
     height: 100px;
     top: 50%;
     position: relative;
     margin: 0px auto;
     text-align:center;
}
 .double-bounce1, .double-bounce2 {
    /* width: 100%;
     */
    /* height: 100%;
     */
    /* border-radius: 50%;
     */
    /* background-color: #fefefe;
     */
     opacity: 0.8;
     position: absolute;
     top: 0;
     left: 0;
     -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
     animation: sk-bounce 2.0s infinite ease-in-out;
}
 .double-bounce2 {
     -webkit-animation-delay: -1.0s;
     animation-delay: -1.0s;
}
 @-webkit-keyframes sk-bounce {
     0%, 100% {
         -webkit-transform: scale(0);
    }
     50% {
         -webkit-transform: scale(1);
    }
}
 @keyframes sk-bounce {
     0%, 100% {
         transform: scale(0);
         -webkit-transform: scale(0);
    }
     50% {
         transform: scale(1);
         -webkit-transform: scale(1);
    }
}
/* ========================================================================== -2.5 Scroll To Up ========================================================================== */
 .back-to-top {
     display: none;
     position: fixed;
     bottom: 18px;
     right: 15px;
     z-index:999999999;
}
 .back-to-top i {
     display: block;
     width: 36px;
     height: 36px;
     line-height: 36px;
     color: #fff;
     font-size: 14px;
     text-align: center;
     border-radius: 4px;
     background-color: #e5310e;
     -webkit-transition: all 0.2s linear;
     -moz-transition: all 0.2s linear;
     -o-transition: all 0.2s linear;
     transition: all 0.2s linear;
}
/* ========================================================================== 3. Hero Area ========================================================================== */
 #hero-area {
     background: url(../img/bg/home.png) fixed no-repeat;
     background-size: cover;
     color: #fff;
     overflow: hidden;
     position: relative;
     height:100vh;
     z-index:999;
}
 #hero-area .overlay {
     position: absolute;
     width: 100%;
     height: 100%;
     top: 0px;
     left: 0px;
     background: #61D2B4;
     opacity: 0.9;
}
 #hero-area .contents {
     padding: 200px 0px;
}
 #hero-area .contents h1 {
     color: #fefefe;
     font-size: 42px;
     font-weight: 700;
     margin-bottom: 25px;
}
 #hero-area .contents p {
     font-size: 14px;
     color: #fefefe;
     font-weight: 400;
     line-height: 30px;
     letter-spacing: 0.5px;
}
 #hero-area .contents .btn {
     margin: 25px 25px 0px 0px;
     text-transform: uppercase;
}
 #hero-area .banner_bottom_btn {
     margin-top: 40px;
}
 #hero-area .banner_bottom_btn i {
     color: #fff;
     font-size: 48px;
     -webkit-transition: all 0.2s linear;
     -moz-transition: all 0.2s linear;
     -o-transition: all 0.2s linear;
     transition: all 0.2s linear;
}
 #hero-area .banner_bottom_btn i:hover {
     color: #61D2B4;
}
 #hero-area1 {
     background: url(../img/bg/home/taj-bg-1.png) fixed no-repeat;
     background-size: cover;
     color: #fff;
     overflow: hidden;
     position: relative;
     height:100vh;
}
 #hero-area2 {
     background: url(../img/bg/home/egypt-bg-1.png) fixed no-repeat;
     background-size: cover;
     color: #fff;
     overflow: hidden;
     position: relative;
     height:100vh;
}
 #hero-area3 {
     background: url(../img/bg/home/col-bg-1.png) fixed no-repeat;
     background-size: cover;
     color: #fff;
     overflow: hidden;
     position: relative;
     height:100vh;
}
 #hero-area4 {
     background: url(../img/bg/home/pisa-bg-1.png) fixed no-repeat;
     background-size: cover;
     color: #fff;
     overflow: hidden;
     position: relative;
     height:100vh;
}
 #hero-area5 {
     background: url(../img/bg/home/china-bg-1.png) fixed no-repeat;
     background-size: cover;
     color: #fff;
     overflow: hidden;
     position: relative;
     height:100vh;
}
 #hero-area5a {
     background: url(../img/bg/home/stone-age-1.png) fixed no-repeat;
     background-size: cover;
     color: #fff;
     overflow: hidden;
     position: relative;
     height:100vh;
}
 #hero-area-about {
     background: url(../img/services/service-bg-1.png) fixed no-repeat;
     background-color:#e5310e;
     background-size: cover;
     color: #fff;
     overflow: hidden;
     position: relative;
     height:100vh;
}
 .hero{
     margin-top:5%;
}
 .hero h2{
     font-size:24px;
     color:#e5310e;
     text-transform:uppercase;
}
/* ========================================================================== 4. Case Study ========================================================================== */
 #hero-area6 {
     background: url(../img/case-study/bg/tafe-temple.png) fixed no-repeat;
     background-size: cover;
     color: #fff;
     overflow: hidden;
     position: relative;
     height:100vh;
}
 #hero-area7 {
     background: url(../img/case-study/bg/kmh-hanging-garden.png) fixed no-repeat;
     background-size: cover;
     color: #fff;
     overflow: hidden;
     position: relative;
     height:100vh;
}
 #hero-area8 {
     background: url(../img/case-study/bg/vikas-housing-opera.png) fixed no-repeat;
     background-size: cover;
     color: #fff;
     overflow: hidden;
     position: relative;
     height:100vh;
}
 #hero-area9 {
     background: url(../img/case-study/bg/aqua-proffesionals-temple.png) fixed no-repeat;
     background-size: cover;
     color: #fff;
     overflow: hidden;
     position: relative;
     height:100vh;
}
 #hero-area10 {
     background: url(../img/case-study/bg/beva-silicon-stone-age.png) fixed no-repeat;
     background-size: cover;
     color: #fff;
     overflow: hidden;
     position: relative;
     height:100vh;
}
 #hero-area11 {
     background: url(../img/case-study/bg/taiyo-plus-discovery.png) fixed no-repeat;
     background-size: cover;
     color: #fff;
     overflow: hidden;
     position: relative;
     height:100vh;
}
/* ========================================================================== 4. Navbar Style ========================================================================== */
 .navbar .container{
     padding:0;
}
 .navbar-brand {
     position: relative;
     padding: 0px;
}
 .top-nav-collapse {
     background: #fff;
     z-index: 999999;
     top: 0px !important;
     padding: 0;
     box-shadow: 0px 3px 6px 3px rgba(0, 0, 0, 0.06);
     -webkit-animation-duration: 1s;
     animation-duration: 1s;
     -webkit-animation-fill-mode: both;
     animation-fill-mode: both;
     -webkit-animation-name: fadeInDown;
     animation-name: fadeInDown;
     background: #fff !important;
}
 .top-nav-collapse .navbar-brand {
     top: 0px;
}
 .top-nav-collapse .navbar-nav .nav-link {
     color: #808080 !important;
     margin-top: 0px !important;
     margin-bottom: 0px !important;
     text-transform:uppercase;
     font-weight:500;
}
 .top-nav-collapse .navbar-nav .nav-link:hover {
     color: #e5310e !important;
     transition:all 0.5s ease;
}
 .top-nav-collapse .navbar-nav .nav-link.active {
     color: #e5310e !important;
}
 .indigo {
     background: transparent;
}
 .navbar-expand-lg .navbar-nav .nav-link {
     color: #808080 ;
     padding: 0 22px;
     font-weight:500;
    /* margin-top: 20px;
     */
    /* margin-bottom: 20px;
     */
     line-height: 45px;
    /* border-radius: 30px;
     */
     background: transparent;
     -webkit-transition: all 0.3s ease-in-out;
     -moz-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
     text-transform:uppercase;
}
 .navbar-expand-lg .navbar-nav li a:hover {
     color: #e5310e ;
}
/* .navbar .nav-link.active {
     */
    /* color: #fff !important;
     */
    /* background: #e5310e;
     */
    /* 
}
 */
 .dropdown-toggle::after {
     display: none;
}
 .slicknav_btn {
     border-color: #e5310e;
}
 .slicknav_menu .slicknav_icon-bar {
     background: #e5310e;
}
/* only small tablets */
 @media (min-width: 768px) and (max-width: 991px) {
     #nav-main li a.nav-link {
         padding-top: 18px;
    }
     .slicknav_menu {
         display:block !important;
         position:absolute;
         right:10%;
         width:80%;
    }
     .navbar-header {
         width: 100%;
    }
}
 .navbar-toggler {
     display: none;
}
 .mobile-menu {
     display: none;
}
 .slicknav_menu {
     display: none;
}
 @media screen and (max-width: 768px) {
     .navbar-header {
         width: 100%;
    }
     .navbar-brand {
         position: absolute;
         padding: 15px;
         top: 0;
    }
     .navbar-brand img {
         width: 70%;
    }
     #mobile-menu {
         display: none;
    }
     .slicknav_menu {
         display: block;
    }
     .slicknav_nav .active a {
         background: #61D2B4;
         color: #fff;
    }
     .slicknav_nav a:hover, .slicknav_nav .active {
         color: #61D2B4;
         background: #f8f9fa;
    }
     .slicknav_nav .dropdown li a.active {
         background: #f8f9fa;
         color: #61D2B4;
    }
}
 .mobile-menu{
     color:#e5310e;
     text-transform:uppercase;
}
/* ========================================================================== 5. Services section ========================================================================== */
 .item-boxes {
     text-align: center;
     padding: 0px 15px;
     margin-bottom: 15px;
     -webkit-transition: all 0.3s ease 0s;
     -moz-transition: all 0.3s ease 0s;
     transition: all 0.3s ease 0s;
}
 .item-boxes .icon {
     width: 60px;
     height: 60px;
     text-align: center;
     border: 1px solid #f1f1f1;
     display: inline-block;
     border-radius: 30px;
     margin-bottom: 30px;
     -webkit-transition: all 0.3s ease-in-out;
     -moz-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
}
 .item-boxes .icon i {
     font-size: 26px;
     line-height: 60px;
     color: #61D2B4;
}
 .item-boxes h4 {
     font-size: 20px;
     font-weight: 700;
     margin-bottom: 10px;
}
 .item-boxes:hover .icon {
     background: #61D2B4;
}
 .item-boxes:hover .icon i {
     color: #fff;
}
/* ========================================================================== 6. Features Section Style ========================================================================== */
 #features {
     background: url(../img/bg1.jpg) fixed no-repeat;
     background-size: cover;
     color: #fff;
     overflow: hidden;
     position: relative;
}
 #features .section-title {
     color: #fff;
}
 #features .section-subtitle {
     color: #fff;
}
 #features .icon {
     display: inline-block;
     width: 60px;
     height: 60px;
     border-radius: 30px;
     text-align: center;
     position: relative;
     z-index: 1;
}
 #features .box-item {
     padding: 15px 0;
}
 #features .box-item .icon {
     border: 1px solid #61D2B4;
     text-align: center;
     float: left;
     -webkit-transition: all 0.2s linear;
     -moz-transition: all 0.2s linear;
     -o-transition: all 0.2s linear;
     transition: all 0.2s linear;
}
 #features .box-item .icon i {
     color: #61D2B4;
     font-size: 24px;
     line-height: 60px;
     -webkit-transition: all 0.2s linear;
     -moz-transition: all 0.2s linear;
     -o-transition: all 0.2s linear;
     transition: all 0.2s linear;
}
 #features .box-item .text {
     padding-left: 80px;
}
 #features .box-item .text h4 {
     color: #61D2B4;
     font-weight: 700;
     font-size: 16px;
     text-transform: uppercase;
     line-height: 22px;
}
 #features .box-item .text p {
     font-size: 14px;
     line-height: 26px;
}
 #features .box-item:hover .icon {
     background: #61D2B4;
}
 #features .box-item:hover .icon i {
     color: #ffffff;
}
 #features .show-box img {
     position: absolute;
     bottom: -120px;
}
/* ========================================================================== 7. Video promo Style ========================================================================== */
 .video-promo {
     background: #61D2B4;
     color: #fff;
     overflow: hidden;
     position: relative;
}
 .video-promo .video-promo-content {
     color: #fff;
}
 .video-promo .video-promo-content h2 {
     color: #fff;
     font-size: 30px;
     text-transform: uppercase;
     margin-bottom: 30px;
}
 .video-promo .video-promo-content p {
     margin-bottom: 30px;
}
 .video-promo .video-promo-content .video-popup {
     width: 80px;
     height: 80px;
     text-align: center;
     border: 3px solid #fff;
     color: #fff;
     border-radius: 50%;
     display: inline-block;
     font-size: 30px;
     -webkit-transition: all 0.5s ease-in-out;
     -moz-transition: all 0.5s ease-in-out;
     transition: all 0.5s ease-in-out;
}
 .video-promo .video-promo-content .video-popup i {
     line-height: 72px;
}
 .overlay {
     position: absolute;
     width: 100%;
     height: 100%;
     top: 0px;
     left: 0px;
     background: #61D2B4;
     opacity: 0.9;
     filter: alpha(opacity=90);
}
/* ========================================================================== 8. Portfolio Section ========================================================================== */
 #portfolios .mix {
     padding: 10px;
}
/* #portfolios .portfolio-item .shot-item {
     */
    /* margin: 0px;
     */
    /* 
}
 */
 #portfolio .mix {
     display: none;
}
 .controls {
     text-align: center;
     padding: 0px 0px 20px;
}
 .controls .active {
     color: #61D2B4 !important;
     border-color: #61D2B4;
     background: transparent;
}
 .controls .btn {
     text-transform: uppercase;
     margin: 2px;
}
 .controls:hover {
     cursor: pointer;
}
 .portfolio-img {
     overflow: hidden;
     display: block;
     position: relative;
}
 .portfolio-img img {
     width: 100%;
}
/* .shot-item {
     */
    /* margin-right: 15px;
     */
    /* border-radius: 4px;
     */
    /* background: #fff;
     */
    /* position: relative;
     */
    /* 
}
 */
 .shot-item img {
     width: 100%;
}
 .shot-item h3 {
     padding-top:25px;
     font-size:1.3em;
     color:#fefefe;
     font-weight:700;
}
 .shot-item .overlay {
     position: absolute;
     width: 100%;
     height: 100%;
     text-align: center;
     opacity: 0;
     background: rgba(0, 0, 0, 0.7);
     top: 0;
     left: 0;
}
 .shot-item:hover .overlay {
     opacity: 1;
}
 .overlay .item-icon {
     height: 48px;
     width: 48px;
     line-height: 48px;
     color: #fefefe;
     left: 40%;
     margin-left: -24px;
     margin-top: -24px;
     top: 70%;
     position: absolute;
     z-index: 2;
     visibility: hidden;
     opacity: 0;
     cursor: pointer;
     text-align: center;
     font-size: 20px;
     -webkit-transition: all 0.5s ease-in-out;
     -moz-transition: all 0.5s ease-in-out;
     transition: all 0.5s ease-in-out;
     border: 2px solid #fefefe;
     border-radius: 50%;
}
 .overlay .item-icon-1 {
     height: 48px;
     width: 48px;
     line-height: 48px;
     color: #fefefe;
     left: 60%;
     margin-left: -24px;
     margin-top: -24px;
     top: 70%;
     position: absolute;
     z-index: 2;
     visibility: hidden;
     opacity: 0;
     cursor: pointer;
     text-align: center;
     font-size: 20px;
     -webkit-transition: all 0.5s ease-in-out;
     -moz-transition: all 0.5s ease-in-out;
     transition: all 0.5s ease-in-out;
     border: 2px solid #fefefe;
     border-radius: 50%;
}
 .overlay .item-icon:hover {
     background: #e5310e;
     color: #fff;
     border:1px solid #e5310e;
}
 .overlay .item-icon-1:hover {
     background: #e5310e;
     color: #fff;
     border:1px solid #e5310e;
}
 .shot-item:hover .item-icon {
     visibility: visible;
     opacity: 1;
}
 .shot-item:hover .item-icon-1 {
     visibility: visible;
     opacity: 1;
     transition:all .5s ease-in-out;
}
 .port-icon{
     position:absolute;
     top:70%;
     left:40%;
}
 .port-icon-1{
     position:absolute;
     top:70%;
     left:60%;
}
 .overlay p{
     color:#fefefe;
     text-align:center;
     font-size:14px !important;
     padding:12px 30px;
}
 .print .item-icon, .logo .item-icon{
     left:50%;
}
 .print .item-icon-1, .logo .item-icon-1{
     display:none;
}
 .webdesign .item-icon-1{
     display:block !important;
}
 .webdesign .item-icon{
     left:40% !important;
}
/* ========================================================================== 9. Pricing Table ========================================================================== */
 .pricing-table {
     padding: 0px 0px 40px 0px;
     margin: 0 auto;
     margin-bottom: 5px;
     border: transparent;
     text-align: center;
     background-color: #FFFFFF;
     border: 1px solid #f1f1f1;
     -webkit-transition: all 0.3s;
     -moz-transition: all 0.3s;
     transition: all 0.3s;
}
 .pricing-table:hover {
     box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.1);
}
 .pricing-table .pricing-details h2 {
     font-size: 26px;
     font-weight: 700;
     color: #333;
     margin-bottom: 20px;
     text-transform: uppercase;
     background: #f1f1f1;
     padding: 30px 0;
}
 .pricing-table .pricing-details span {
     display: inline-block;
     font-size: 48px;
     font-weight: 400;
     color: #61D2B4;
     margin-bottom: 20px;
}
 .pricing-table .pricing-details ul {
     margin-bottom: 35px;
}
 .pricing-table .pricing-details ul li {
     padding: 10px;
     font-size: 15px;
     border-bottom: 1px dotted #f1f1f1;
}
 .table-left {
     margin-top: 20px;
}
/* ========================================================================== 10. Counter Section Style ========================================================================== */
 .counters {
     background: url(../img/counter.jpg) fixed;
     position: relative;
}
 .counters .facts-item {
     text-align: center;
     color: #fff;
}
 .counters .facts-item .icon {
     margin-bottom: 30px;
}
 .counters .facts-item .icon i {
     font-size: 50px;
     color: #fff;
}
 .counters .facts-item .fact-count h3 {
     font-size: 35px;
     color: #fff;
     margin-bottom: 15px;
}
 .counters .facts-item .fact-count h4 {
     font-size: 20px;
     font-weight: 400;
     color: #fff;
}
/* ========================================================================== 11. Testimonial Section Style ========================================================================== */
 #testimonial {
     background: url(../img/testimonial-bg.jpg) fixed no-repeat;
     background-size: cover;
     color: #fff;
     overflow: hidden;
     position: relative;
}
 .testimonial-item {
     text-align: center;
}
/* .testimonial-item img {
     */
    /* width: 80px;
     */
    /* border: 3px solid #fff;
     */
    /* height: 80px;
     */
    /* border-radius: 50%;
     */
    /* 
}
 */
 .testimonial-item .testimonial-text h3 {
     font-size: 15px;
     font-weight: 700;
}
 .testimonial-item .testimonial-text span {
     font-size: 14px;
     color: #999;
}
 .testimonial-item .testimonial-text p {
     font-size: 14px;
     font-weight: 400;
     padding: 36px 10px 30px 10px;
     margin: 0;
     line-height: 30px;
}
 .owl-theme .owl-controls .owl-page span {
     background: #61D2B4;
}
 .owl-theme .owl-controls {
     margin-top: 20px;
}
/* ========================================================================== 12. Team Section ========================================================================== */
 .single-team:hover .team-details {
     opacity: 1;
}
 .single-team {
     position: relative;
     -webkit-transition: 0.5s;
     transition: 0.5s;
     box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.1);
     border-radius: 0px;
     background: #61D2B4;
     overflow: hidden;
}
 .single-team img {
     width: 100%;
}
 .single-team .team-inner {
     -webkit-transition: 0.5s;
     transition: 0.5s;
}
 .single-team .team-details {
     text-align: center;
     -webkit-transition: 0.5s;
     -moz-transition: 0.5s;
     transition: 0.5s;
     border-radius: 0px;
     background: #f1f1f1;
     padding: 15px;
}
 .single-team .team-details .team-title {
     margin-bottom: 5px;
     font-size: 20px;
     font-weight: 700;
     color: #333;
}
 .single-team .team-details p {
     color: #333;
}
 .single-team .social-list li {
     display: inline-block;
}
 .single-team .social-list li a {
     display: block;
     height: 34px;
     line-height: 34px;
     text-align: center;
     width: 34px;
     margin: 2px;
     color: #61D2B4;
     font-size: 14px;
     background: #fff;
     border-radius: 50px;
     -webkit-transition: 0.5s;
     -moz-transition: 0.5s;
     transition: 0.5s;
}
 .single-team .social-list .facebook a:hover {
     background: #4867aa;
     color: #fff;
}
 .single-team .social-list .twitter a:hover {
     background: #1da1f2;
     color: #fff;
}
 .single-team .social-list .google-plus a:hover {
     background: #dd4d42;
     color: #fff;
}
 .single-team .social-list .linkedin a:hover {
     background: #007bb6;
     color: #fff;
}
 .single-team .social-list .instagram a:hover {
     background: #e95950;
     color: #fff;
}
/* ========================================================================== 13. Blog ========================================================================== */
 #blog .blog-item-wrapper {
     background: #fff;
     border-radius: 0px;
     -webkit-transition: transform 0.2s linear, -webkit-box-shadow 0.2s linear;
     -moz-transition: transform 0.2s linear, -moz-box-shadow 0.2s linear;
     transition: transform 0.2s linear, box-shadow 0.2s linear;
}
 #blog .blog-item-wrapper:hover .blog-item-img:before {
     opacity: 1;
     height: 100%;
     width: 100%;
}
 #blog .blog-item-img {
     position: relative;
}
 #blog .blog-item-img img {
     width: 100%;
}
 #blog .blog-item-text {
     padding: 20px 0;
}
 #blog .blog-item-text h3 {
     line-height: 26px;
     font-size: 18px;
     font-weight: 700;
     margin-bottom: 10px;
}
 #blog .blog-item-text h3 a {
     color: #333;
}
 #blog .blog-item-text h3 a:hover {
     color: #61D2B4;
}
 #blog .blog-item-text p {
     line-height: 25px;
     margin-bottom: 20px;
}
 .meta-tags {
     margin-bottom: 20px;
}
 .meta-tags span {
     color: #999;
     margin-right: 10px;
}
 .meta-tags span i {
     margin-right: 5px;
}
 .meta-tags span a {
     color: #999;
}
 .meta-tags span a:hover {
     color: #61D2B4;
}
/* ========================================================================== 14. Contact Us ========================================================================== */
 .contact-us h3 {
     font-size: 24px;
     margin-bottom: 5px;
     color:#e5310e;
     font-weight:600;
}
 .contact-form{
     padding-bottom:15px;
}
 .contact-us p span {
     color: #161616;
     padding-left: 16px;
}
 #contact {
     background: #343a40;
    /* color: #fff;
     */
     position: relative;
}
 .form-control {
     width: 100%;
     margin-bottom: 10px;
     padding: 15.5px 10px 15.5px 52px;
     border:none;
    /* border-color: #fff;
     */
     border-radius: 0px;
     color: #444;
     background: #fff;
     font-size: 14px;
     -webkit-transition: all 0.3s;
     -moz-transition: all 0.3s;
     transition: all 0.3s;
}
 .form-control:focus {
     box-shadow: none;
     color: #444;
    /* border-color: #61D2B4;
     */
     background: #fff;
     outline: none;
}
 .form-group{
     margin-bottom:1.5rem;
}
 ::placeholder{
     padding: 2px !important;
}
 textarea::placeholder {
     padding:0px !important;
}
 .btn.disabled, .btn:disabled {
     opacity: 1;
}
 .text-danger {
     font-size: 14px;
     margin-top: 10px;
}
 .list-unstyled li {
     color: #d9534f;
}
 #contactForm .fa{
     position:absolute;
     padding:16px;
     color:#fefefe;
}
/* ========================================================================== 15. Footer Style ========================================================================== */
 footer {
     background: #292f35;
    /* padding: 20px 0;
     */
}
 .footer-links {
     line-height: 48px;
}
 .footer-links li {
     float: left;
     color: #fff !important;
}
 .footer-links li a {
     color: #fff !important;
     margin-right: 15px;
     transition: all 0.3s ease-in-out;
     -webkit-transition: all 0.3s ease-in-out;
     -moz-transition: all 0.3s ease-in-out;
}
 .footer-links li a:hover {
     color: #61D2B4;
}
 .copyright {
     margin-top: 10px;
     float: right;
     opacity:0.3;
     position:relative;
     right:0;
}
 .mail-hr {
     margin-top: 10px;
     float: left;
     opacity:0.5;
     position:relative;
     right:0;
     color:#fefefe;
}
 .mail-hr a i{
     color:#fefefe !important;
     opacity:0.5;
}
 .mail-hr a i:hover{
     color:#e5310e;
     opacity:1;
}
 .copyright p {
     color: #fff;
     font-size:14px !important;
}
 .copyright p a {
     color: #fff;
}
 .copyright p a:hover {
     color: #61D2B4;
}
/* =================================================================== * 13. portfolio - (_layout.scss) * * ------------------------------------------------------------------- */
 #portfolio {
    /* background: #dcdcdc;
     */
    /* min-height: 800px;
     */
     position: relative;
    /* padding: 30px;
     */
}
 .clearfix{
     background: #dcdcdc;
     min-height: 50px;
     position: relative;
     padding: 0;
}
 #portfolio .intro-wrap {
     padding: 15rem 0 21rem;
     background:#000;
}
 #portfolio .section-intro h3 {
     color: rgba(242, 242, 242, 0.5);
}
 #portfolio {
     color: #e5310e;
}
 .section-intro .lead {
     color: rgba(250, 250, 250, 0.7);
}
 .lead b{
     color:#333;
     font-weight:500;
     font-size:1em;
}
 #portfolio .portfolio-content {
}
 #portfolio .bricks-wrapper:before, #portfolio .bricks-wrapper:after {
     content: "";
     display: table;
}
 #portfolio .bricks-wrapper:after {
     clear: both;
}
 #portfolio .bricks-wrapper .brick {
     float: left;
     width: 50%;
     padding: 0;
     margin: 0;
}
 #portfolio .bricks-wrapper .brick:nth-child(2n+1) {
     clear: both;
}
 .portfolio-button1{
     text-align:right;
}
 .portfolio-button2{
     text-align:left;
}
 @media (max-width:470px){
     .portfolio-button1{
         width:100%;
         text-align:center;
    }
     .portfolio-button2{
         width:100%;
         text-align:center;
    }
}
/* ------------------------------------------------------------------- * masonry entries - (_layout.css) * ------------------------------------------------------------------- */
 .bricks-wrapper .item-wrap {
     position: relative;
     overflow: hidden;
}
 .bricks-wrapper .item-wrap .overlay {
     cursor:links;
}
 .bricks-wrapper .item-wrap .overlay img {
     vertical-align: bottom;
     -moz-transition: all 0.3s ease-in-out;
     -o-transition: all 0.3s ease-in-out;
     -webkit-transition: all 0.3s ease-in-out;
     -ms-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
}
 .bricks-wrapper .item-wrap .overlay::before {
     content: "";
     display: block;
     background: rgba(0, 0, 0, 0.7);
     opacity: 0;
     visibility: hidden;
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     -moz-transition: all 0.5s ease-in-out;
     -o-transition: all 0.5s ease-in-out;
     -webkit-transition: all 0.5s ease-in-out;
     -ms-transition: all 0.5s ease-in-out;
     transition: all 0.5s ease-in-out;
     z-index: 1;
}
 .bricks-wrapper .item-wrap .overlay::after {
     content: "...";
     font-size: 3rem;
     z-index: 1;
     display: block;
     height: 30px;
     width: 30px;
     line-height: 30px;
     margin-left: -15px;
     margin-top: -15px;
     position: absolute;
     left: 50%;
     top: 50%;
     text-align: center;
     color: #FFFFFF;
     opacity: 0;
     visibility: hidden;
     -moz-transition: all 0.3s ease-in-out;
     -o-transition: all 0.3s ease-in-out;
     -webkit-transition: all 0.3s ease-in-out;
     -ms-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
     -webkit-transform: scale(0.5);
     -ms-transform: scale(0.5);
     transform: scale(0.5);
}
 .bricks-wrapper .item-wrap .item-text {
     position: absolute;
     top: 0;
     left: 0;
     padding: 3.6rem 0 0 3rem;
     margin-right: 6rem;
     z-index: 3;
}
 .bricks-wrapper .item-wrap .item-text .folio-title {
     color: #FFFFFF;
     font-size: 2.2rem;
     line-height: 1.364;
     font-weight: normal;
     letter-spacing: 1px;
}
 .bricks-wrapper .item-wrap .item-text .folio-types {
     font-size: 1.1rem;
     line-height: 1.5rem;
     text-transform: uppercase;
     letter-spacing: .1rem;
     color: rgba(255, 255, 255, 0.7);
     display: block;
}
 .bricks-wrapper .item-wrap .details-link {
     display: block;
     background-color: transparent;
     border: 1px solid rgba(255, 255, 255, 0.3);
     height: 4.6rem;
     width: 4.6rem;
     line-height: 4.6rem;
     color: white;
     text-align: center;
     z-index: 2;
     border-radius: 3px;
     position: absolute;
     top: 3.6rem;
     right: 3rem;
}
 .bricks-wrapper .item-wrap .details-link i {
     font-size: 2rem;
     line-height: 4.2rem;
}
 .bricks-wrapper .item-wrap .details-link:hover, .bricks-wrapper .item-wrap .details-link:focus {
     background-color: #FFFFFF;
     color: #000000;
}
 .bricks-wrapper .item-wrap .item-text, .bricks-wrapper .item-wrap .details-link {
     opacity: 0;
     visibility: hidden;
     -webkit-transform: translateY(100%);
     -ms-transform: translateY(100%);
     transform: translateY(100%);
     -moz-transition: all 0.3s ease-in-out;
     -o-transition: all 0.3s ease-in-out;
     -webkit-transition: all 0.3s ease-in-out;
     -ms-transition: all 0.3s ease-in-out;
     transition: all 0.3s ease-in-out;
}
 .bricks-wrapper .item-wrap:hover .overlay::before {
     opacity: 1;
     visibility: visible;
}
 .bricks-wrapper .item-wrap:hover .overlay::after {
     opacity: 1;
     visibility: visible;
     -webkit-transform: scale(1);
     -ms-transform: scale(1);
     transform: scale(1);
}
 .bricks-wrapper .item-wrap:hover .overlay img {
     -webkit-transform: scale(1.05);
     -ms-transform: scale(1.05);
     transform: scale(1.05);
}
 .bricks-wrapper .item-wrap:hover .item-text, .bricks-wrapper .item-wrap:hover .details-link {
     opacity: 1;
     visibility: visible;
     -webkit-transform: translateX(0);
     -ms-transform: translateX(0);
     transform: translateX(0);
}
/* ------------------------------------------------------------------- * Light Gallery Overrides - (_layout.css) * ------------------------------------------------------------------- */
 .lg-sub-html {
     padding: 12px 20% 15px;
}
 .lg-sub-html a, .lg-sub-html a:visited {
     color: #fefefe ;
     font-weight: normal;
    /* border: 2px solid #444;
    */
     padding: 4px;
}
 .lg-sub-html a:hover, .lg-sub-html a:focus {
     color: #e5310e;
     font-weight: bold;
     padding:4px 10px;
}
 @media only screen and (max-width: 1024px) {
     .lg-sub-html {
         padding: 12px 15% 15px;
    }
}
 @media only screen and (max-width: 768px) {
     .lg-sub-html {
         padding: 12px 40px 15px;
    }
}
 .lg-sub-html h4 {
     color: #FFFFFF;
     font-size: 1.8rem;
     line-height: 1.333;
     letter-spacing: 1px;
     font-weight: normal;
}
 .lg-sub-html p {
     font-size: 1.3rem;
     line-height: 2.4rem;
     margin: .6rem 0 0;
     color: rgba(255, 255, 255, 0.6);
     letter-spacing: 1px;
}
 .lg-outer .lg-thumb-item.active, .lg-outer .lg-thumb-item:hover {
     border-color: #f9a828;
}
 .lg-progress-bar .lg-progress {
     background-color: #FFFFFF;
}
 #lg-counter {
    /* */
}
/* ------------------------------------------------------------------- * responsive: * portfolio * ------------------------------------------------------------------- */
 @media only screen and (max-width: 768px) {
     #portfolio .intro-wrap {
         padding: 12rem 0 21rem;
    }
}
 @media only screen and (max-width: 600px) {
     #portfolio .bricks-wrapper .brick {
         float: none;
         width: 100%;
    }
     .bricks-wrapper .item-wrap .item-text .folio-title {
         font-size: 2rem;
         line-height: 1.5;
    }
}
/* ========================================================================== 15. Slick Carousel ========================================================================== */
 .swiper-container {
     width: 100%;
     height: auto;
     margin-left: auto;
     margin-right: auto;
}
 .swiper-slide {
     text-align: center;
    /* Center slide text vertically */
     display: -webkit-box;
     display: -ms-flexbox;
     display: -webkit-flex;
     display: flex;
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     -webkit-justify-content: center;
     justify-content: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
     -webkit-align-items: center;
     align-items: center;
}
/* ========================================================================== 14. Slick Carousel ========================================================================== */
 .case-study{
     padding-top:20px;
}
 .case-study h1{
     padding-bottom:20px;
     color:#e5310e;
     font-size:24px;
     font-weight:600;
}
 .case-study h2{
     padding-bottom:20px;
     color:#e5310e;
     font-size:22px;
     font-weight:600;
}
 .case-study p{
     padding-bottom:20px;
     color:#161616;
     font-size:16px;
     font-weight:300;
     text-align:justify;
}
 .dropdown-menu {
    /* display: none;
     */
    /* position: absolute;
     */
     background-color: #fefefe;
     min-width: 200px;
     box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
     z-index: 1;
}
 .dropdown-menu a {
     color: black;
     padding: 12px 16px;
     text-decoration: none;
     display: block;
     transition:all 0.5s ease-in-out;
}
 .dropdown-menu li a:active {
    background-color: #ddd
}
/* .dropdown:hover .dropdown-menu {
     */
    /* display: block;
     */
    /* 
}
 */
/* ========================================================================== 14.Menu Hover ========================================================================== */
/* SVG Buttons */
 .svg-wrapper {
     position: relative;
     top: 50%;
     transform: translateY(-50%);
     margin: 0 auto;
     width: 320px;
     text-decoration:none !important;
}
 .shape {
     stroke-dasharray:25;
     stroke-dashoffset: 12;
     stroke-width: 5px;
     fill: transparent;
     stroke: #e5310e;
     border-bottom: 5px solid black;
     transition: stroke-width 1s, stroke-dashoffset 1s, stroke-dasharray 1s;
     transition:all 1s ease-in-out;
}
 .text {
     letter-spacing: 8px;
     color:#e5310e;
     left:60px;
     top: -20px;
     position: absolute;
}
 .svg-wrapper:hover .shape {
     text-decoration:none;
     stroke-width: 5px;
     stroke-dashoffset: 0;
     stroke-dasharray: 0;
     transition:all 1s ease-in-out;
}
/* SVG Buttons White */
 .svg-wrapper-w {
     position: relative;
     top: 50%;
     transform: translateY(-50%);
     margin: 0 auto;
     width: 320px;
     text-decoration:none !important;
}
 .shape-w {
     stroke-dasharray:25;
     stroke-dashoffset: 12;
     stroke-width: 5px;
     fill: transparent;
     stroke: #fefefe;
     border-bottom: 5px solid black;
     transition: stroke-width 1s, stroke-dashoffset 1s, stroke-dasharray 1s;
     transition:all 1s ease-in-out;
}
 .text {
     letter-spacing: 8px;
     color:#fefefe;
     left:60px;
     top: -20px;
     position: absolute;
}
 .svg-wrapper-w:hover .shape-w {
     text-decoration:none;
     stroke-width: 5px;
     stroke-dashoffset: 0;
     stroke-dasharray: 0;
     transition:all 1s ease-in-out;
}
/* ========================================================================== 14. Services ========================================================================== */
 .snip1369 {
     position: relative;
     float: left;
     overflow: hidden;
     margin: 10px 1%;
     min-width: 230px;
     max-width: 450px;
     width: 100%;
     background: #20638f;
     text-align: left;
     color: #ffffff;
     box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
     font-size: 16px;
}
 .snip1369 * {
     -webkit-box-sizing: border-box;
     box-sizing: border-box;
     -webkit-transition: all 0.3s ease-out;
     transition: all 0.3s ease-out;
}
 .snip1369 > img, .snip1369 .image img {
     -webkit-transform: scale(1.05);
     transform: scale(1.05);
     max-width: 100%;
}
 .snip1369 > img {
     vertical-align: top;
     position: relative;
     -webkit-filter: blur(5px);
     filter: blur(5px);
     opacity: 0.6;
}
 .snip1369 figcaption, .snip1369 .image {
     -webkit-transition-delay: 0.2s;
     transition-delay: 0.2s;
}
 .snip1369 .image {
     position: absolute;
     top: 0;
     bottom: 20%;
     right: 0;
     left: 0;
     overflow: hidden;
     box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.1), 0px 1px 0 rgba(255, 255, 255, 0.2);
}
 .snip1369 .image img {
     position: absolute;
     top: 0;
}
 .snip1369 figcaption {
     position: absolute;
     top: 85%;
     bottom: 40px;
     left: 20px;
     right: 20px;
    /* border-bottom: 2px solid #ffffff;
     */
     padding-top: 20px;
     z-index: 1;
}
 .snip1369 h3, .snip1369 p {
     margin: 0;
}
 .snip1369 h3 {
     font-weight: 700;
     margin-bottom: 5px;
     text-transform: uppercase;
     font-size:20px;
}
 .snip1369 p {
     font-size: 0.9em;
     letter-spacing: 1px;
     font-weight: 400;
     opacity: 0;
}
 .snip1369 .read-more {
     display: block;
     opacity: 0;
     -webkit-transform: translateX(-20px);
     transform: translateX(-20px);
     line-height: 48px;
     text-transform: uppercase;
     letter-spacing: 1px;
     padding: 0 20px;
     color: #ffffff;
     right: 0;
     bottom: 0;
     font-weight: 500;
     position: absolute;
     cursor:pointer;
}
 .snip1369 a {
     left: 0;
     right: 0;
     top: 0;
     bottom: 0;
     position: absolute;
     z-index: 1;
}
 .snip1369:hover .read-more, .snip1369.hover .read-more, .snip1369:hover figcaption, .snip1369.hover figcaption {
     opacity: 1;
     -webkit-transform: translateX(0px);
     transform: translateX(0px);
}
 .snip1369:hover figcaption, .snip1369.hover figcaption, .snip1369:hover .image, .snip1369.hover .image {
     -webkit-transition-delay: 0s;
     transition-delay: 0s;
}
 .snip1369:hover figcaption, .snip1369.hover figcaption {
     top: 10%;
}
 .snip1369:hover .image, .snip1369.hover .image {
     bottom: 100%;
}
 .snip1369:hover p, .snip1369.hover p {
     opacity: 1;
     -webkit-transition-delay: 0.2s;
     transition-delay: 0.2s;
}
 .collapse{
     transition-delay: 0s;
}
 #serv-1{
     background:#d2dee4;
     margin:5% 0;
}
/* ========================================================================== ========================================================================== */
 #inner-hero-area{
     color: #fff;
     overflow: hidden;
     position: relative;
     z-index:999;
}
 #inner-case-study{
     height:500px;
     background-size:contain;
}
 .dvc-logo{
     transition:all .5s ease-in-out;
}
 .dvc-hide{
     left:10%;
     opacity:0;
     transition:all .5s ease-in-out;
     position:absolute 
}
 .navbar-brand:hover .dvc-hide {
     opacity:1;
     transition:all .5s ease-in-out;
     left:100%;
}
 .dvc-mob{
     display:none;
}
 @media (max-width:768px){
     .dvc-logo, .dvc-hide{
         display:none !important;
    }
     .dvc-mob{
         display:block;
    }
}
/* *********************************************************** */
 #inner-case img{
     max-width:100%;
     background-size:contain;
}
/* *********************************************************** */
 .mob-home{
     position:relative;
     top:25%;
}
 .home-char img{
     max-width:100%;
}
/* ************************************************************* */
 .go-back{
     text-align:center;
     padding-top:50px;
     padding-bottom:30px;
}
 .go-back a{
     padding:15px;
     background: #e5310e;
     color: #fefefe;
     transition:all 0.5s ease-in-out;
}
 .go-back a:hover{
     padding:15px;
     background: #fefefe;
     color: #e5310e;
     transition:all 0.5s ease-in-out;
     border:1px solid #e5310e;
}
/* **************************** Static Band ********************************* */