.custom-skew-1 { transform: skewX(-35deg); } @media (min-width: 992px) { #header.header-narrow .header-nav.header-nav-stripe { position: relative; z-index: 3; } #header.header-narrow .header-logo .logo-default { margin: -37px -70px -102px 0; position: relative; z-index: 2; opacity: 1; } #header.header-narrow .header-logo .logo-small { -webkit-backface-visibility: hidden; backface-visibility: hidden; transform: translate3d(87px, 0, 0); position: absolute; z-index: 1; opacity: 0; left: 0; } #header .header-nav.header-nav-stripe .header-nav-main nav > ul > li > a { min-height: 90px !important; } #header .header-nav.header-nav-stripe .header-nav-main nav > ul > li.dropdown .dropdown-menu { margin-top: 0px !important; } .sticky-header-active #header.header-narrow .header-logo .logo-small { transform: translate3d(0, 0, 0); opacity: 1; z-index: 3; margin: 12px 12px 12px 0; } .sticky-header-active #header.header-narrow .header-logo .logo-default { opacity: 0; top: -90px; } } @media (max-width: 991px) { .logo-default { display: none !important; } .logo-small { display: block; } #header .header-logo { width: auto !important; height: auto !important; } } #header { min-height: 0 !important; width: 100%; position: absolute; } html:not(.sticky-header-active) #header.header-semi-transparent-light .header-body { background: #FFF !important; } html.sticky-header-active #header.header-semi-transparent-light .header-body { background: rgba(255, 255, 255, 0.8) !important; } @media (min-width: 992px) { html #header.header-semi-transparent-light .header-body { transition: transform 0.3s ease; transform: translate3d(0, 25px, 0); border: 0; } html #header.header-semi-transparent-light .header-body:before { background: #fff none repeat scroll 0 0; opacity: 1; } html:not(.sticky-header-active) #header.header-semi-transparent-light .header-nav-main nav > ul > li:not(.active) > a { color: #222529; } html:not(.sticky-header-active) #header.header-semi-transparent-light .header-nav-main nav > ul > li:not(.active) > a.dropdown-toggle:after { border-color: #222529 transparent transparent transparent; } html:not(.sticky-header-active) #header.header-semi-transparent-light .header-nav-main nav > ul > li:not(.active):hover > a { color: #FFF; } html:not(.sticky-header-active) #header.header-semi-transparent-light .header-nav-main nav > ul > li:not(.active):hover > a.dropdown-toggle:after { border-color: #FFF transparent transparent transparent; } html.sticky-header-active #header.header-semi-transparent-light .header-body { transform: translate3d(0, 0, 0); } html.ie9 #header.header-narrow .header-nav.header-nav-stripe nav > ul > li.dropdown .dropdown-menu, html.ie9 #header.header-narrow .header-nav.header-nav-stripe nav > ul > li.dropdown:hover .dropdown-menu, html.ie9 #header.header-narrow .header-nav.header-nav-dropdowns-dark nav > ul > li.dropdown .dropdown-menu, html.ie9 #header.header-narrow .header-nav.header-nav-dropdowns-dark nav > ul > li.dropdown:hover .dropdown-menu { margin-top: -2px; } } h2 { font-size: 2em; font-weight: 700; } .social-icons li { box-shadow: none; } .social-icons li a { background: transparent; } .feature-box.custom-feature-box .feature-box-icon { top: 20px; } .owl-carousel.custom-nav-with-transparency.nav-dark:not(.nav-style-1):not(.nav-style-2):not(.nav-style-3):not(.show-nav-title):not(.nav-arrows-1) .owl-nav button[class*="owl-"] { background-color: rgba(38, 42, 47, 0.5) !important; } .owl-carousel.custom-nav-with-transparency.nav-dark:not(.nav-style-1):not(.nav-style-2):not(.nav-style-3):not(.show-nav-title):not(.nav-arrows-1) .owl-nav button[class*="owl-"]:hover { background-color: #262a2f !important; } .tp-caption-custom-stripe { color: #FFF !important; } .tparrows { background: transparent; margin-top: 40px; } .tparrows:hover { background: transparent; } .tparrows:before { position: relative; z-index: 1; } .tparrows:after { transition: all 0.2s ease; background: #000 none repeat scroll 0 0; opacity: 0.2; height: 40px; margin: -40px 0 0; position: relative; transform: rotate(-45deg); width: 40px; content: ""; display: block; z-index: 0; } .tparrows:hover:after { opacity: 1; } @media (min-width: 1199px) { html[dir="rtl"] .home-concept-construction { background: none; } .home-concept-construction { background: transparent url(../../img/home/home-concept-small.png) no-repeat center 63%; } } .diamonds { font-size: 0; margin: 40px auto 85px; position: relative; text-align: center; padding: 50px 0 0 57px; } .diamonds > li { display: inline-block; font-size: 18px; margin-right: 135px; } .diamonds .diamond { background: #f7f7f7; display: block; height: 255px; overflow: hidden; position: relative; text-decoration: none; width: 255px; overflow: hidden; transform: rotate(-45deg); } .diamonds .diamond:after { transition: all 0.2s ease; content: " "; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #000; opacity: 0; transform: scale(0); z-index: 100; } .diamonds .diamond:hover:after { opacity: 0.3; transform: scale(1); } .diamonds .diamond:hover .content:after { opacity: 0.8; transform: scale(1); } .diamonds .content { display: table-cell; height: 255px; padding: 0 10px; transform: rotate(45deg); text-align: center; vertical-align: middle; width: 255px; position: relative; } .diamonds .content:after { transition: all 0.2s ease; color: #fff; content: "\e091"; font-family: "simple-line-icons"; font-size: 28px; left: 27%; margin: -6px -12px; opacity: 0; position: absolute; top: 50%; z-index: 1000; transform: scale(2); } .diamonds .content img { max-width: 375px; margin-left: -50%; } .diamonds .diamond-sm .content:after { left: 24%; top: 48%; } @media (min-width: 1199px) { .diamonds > li:nth-child(3) { margin-right: 0; } .diamonds > li:nth-child(4) { right: 132px; top: 9px; position: absolute; } .diamonds > li:nth-child(5) { margin-left: 527px; margin-top: -70px; } .diamonds > li:nth-child(6) { position: absolute; margin: -6px 0 0 -27px; right: -32px; } .diamonds > li:nth-child(7) { position: absolute; margin: 97px 0 0 -133px; right: 73px; } .diamonds .diamond-sm { height: 128px; width: 128px; } .diamonds .diamond-sm .content { height: 128px; width: 128px; } .diamonds .diamond-sm .content img { max-width: 195px; } .row-diamonds-description { margin-top: -150px; } } @media (max-width: 1198px) { .diamonds { text-align: center; width: 748px; margin: 0 auto; padding: 75px 0 75px 75px; } .diamonds::after { clear: both; content: ""; display: block; } .diamonds > li { margin: 0; position: static; float: left; } .diamonds > li:nth-child(2n+2) { margin-bottom: -50px; margin-left: 55px; margin-top: 200px; } .diamonds > li:nth-child(2n+1) { clear: both; } } @media (max-width: 748px) { .diamonds { margin: 0 auto; padding: 25px 0 0 0; text-align: center; width: 445px; } .diamonds > li { float: none !important; clear: both !important; margin: 45px 0 115px 95px !important; display: block; } } @media (max-width: 575px) { .diamonds-wrapper { min-height: 2650px; } .diamonds-wrapper .diamonds { margin: 0 auto; padding: 25px 0 0; text-align: center; width: 445px; position: absolute; left: 50%; margin-left: -222px; } .diamonds-wrapper .diamonds > li { text-align: center; } } .section-custom-construction { overflow: hidden; } .section-custom-construction .container { position: relative; } .section-custom-construction .container:after { background: #000 none repeat scroll 0 0; bottom: -220px; content: ""; height: 200px; position: absolute; right: 0; transform: rotate(50deg); width: 200px; z-index: 1; } .section-custom-construction .container:before { background: #000 none repeat scroll 0 0; bottom: -235px; content: ""; height: 200px; position: absolute; right: 75px; transform: rotate(50deg); width: 200px; z-index: 2; } @media (min-width: 992px) { .section-custom-construction-2 { overflow: hidden; position: relative; padding-bottom: 80px; } .section-custom-construction-2:after { background: #000 none repeat scroll 0 0; bottom: -140px; content: ""; height: 200px; left: 25px; position: absolute; transform: rotate(50deg); width: 200px; z-index: 1; } } .testimonial.testimonial-with-quotes blockquote p { font-size: 20px; } @media (max-width: 991px) { section.section.section-background { background-size: auto 100%; background-repeat: no-repeat; } } .project-detail-construction .list-project-details { margin: 30px 0; padding: 0; list-style: none; } .project-detail-construction .list-project-details li { padding: 0 0 15px 0; } .project-detail-construction .list-project-details li label { padding: 0; margin: 0; color: #999; font-size: 11px; text-transform: uppercase; font-weight: normal; } .project-detail-construction .list-project-details li p { padding: 0; margin: 0; color: #111; } .project-detail-construction .progress-bars-project-detail { margin: 30px 0; } .project-detail-construction .progress-bars-project-detail .progress.progress-sm { margin-bottom: 32px; } .project-detail-construction .progress-bars-project-detail .progress-label span { padding: 0; margin: 0; color: #999; font-size: 11px; text-transform: uppercase; font-weight: normal; } #footer { background: #E9EFF2 url(../../img/demos/construction/footer-construction.jpg) no-repeat 50% 50%; border-top: 0; padding: 60px 0 30px; min-height: 400px; overflow: hidden; } #footer h1, #footer h2, #footer h3, #footer h4, #footer a { color: #333; } #footer .list-footer-nav { list-style: none; margin: 0; padding: 0; } #footer .list-footer-nav a { font-size: 14px; color: #777; text-decoration: none; } #footer .list-footer-nav a:hover { color: #888; } #footer .newsletter form { max-width: 100%; margin: 27px 0 12px; } #footer .newsletter form input.form-control { height: 45px; padding: 12px; } #footer .newsletter form .btn { height: 45px; width: 45px; } #footer [class*="fa-"] { display: inline-block; padding-right: 2px; position: relative; top: 1px; color: #000; } #footer .footer-copyright { background: transparent; margin: -10px 0 0; padding: 20px 0 0; border-top: 1px solid #FFF; } #footer .footer-copyright p { color: #ababab; } @media (min-width: 992px) { #footer { margin-top: 0; } #footer:after { background: #000 none repeat scroll 0 0; bottom: -233px; content: ""; height: 400px; position: absolute; right: -177px; transform: rotate(50deg); width: 400px; z-index: 1; } } @media (min-width: 768px) { .logo { margin-top: 75px; } }