📁 PHP Dosya Yöneticisi
/
/
home
/
demodesigncom
/
esnafbul.demodesign.com.tr
/
tema2
/
css
📝
style.css
← Geri Dön
/* Bricks HTML Template */ /*** ==================================================================== Attachment Css Files ==================================================================== ***/ @import url('global.css'); @import url('rtl.css'); @import url('header.css'); @import url('footer.css'); @import url('font-awesome.css'); @import url('flaticon.css'); @import url('animate.css'); @import url('owl.css'); @import url('preloader.css'); @import url('jquery-ui.css'); @import url('custom-animate.css'); @import url('jquery.fancybox.min.css'); @import url('jquery.mCustomScrollbar.min.css'); @import url('jquery.bootstrap-touchspin.css'); /*** ==================================================================== Main Slider Section ==================================================================== ***/ .main-slider{ position:relative; overflow:hidden; } .main-slider .slide{ position:relative; overflow:hidden; padding:200px 0px 320px; background-size:cover; background-position:center right; } .main-slider .slide:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:0px; opacity:0.70; background-color:var(--main-color-two); } .main-slider .content-column{ position:relative; max-width:680px; } .main-slider .content-column .inner-column{ position:relative; } .main-slider .title{ position:relative; font-weight: 500; opacity: 0; line-height:1.6em; transform: scaleY(0); transform-origin: top; color:var(--white-color); font-size:var(--font-18); text-transform:uppercase; margin-bottom: var(--margin-bottom-20); -webkit-transition: all 1000ms ease; -moz-transition: all 100ms ease; -ms-transition: all 1000ms ease; -o-transition: all 1000ms ease; transition: all 1000ms ease; } .main-slider .active .title{ opacity: 1; transform: scaleY(1); -webkit-transition-delay: 300ms; -moz-transition-delay: 300ms; -ms-transition-delay: 300ms; -o-transition-delay: 300ms; transition-delay: 300ms; } .main-slider h1{ color:var(--white-color); opacity: 0; transform: scaleY(0); transform-origin: top; -webkit-transition: all 1000ms ease; -moz-transition: all 100ms ease; -ms-transition: all 1000ms ease; -o-transition: all 1000ms ease; transition: all 1000ms ease; margin-bottom:var(--margin-bottom-20); } .main-slider h1 span{ color:var(--main-color); } .main-slider .active h1{ opacity: 1; transform: scaleY(1); -webkit-transition-delay: 600ms; -moz-transition-delay: 600ms; -ms-transition-delay: 600ms; -o-transition-delay: 600ms; transition-delay: 600ms; } .main-slider .text{ font-weight: 400; opacity: 0; line-height:1.8em; transform: scaleY(0); transform-origin: top; color:var(--white-color); font-size:var(--font-18); margin-bottom: var(--margin-bottom-35); -webkit-transition: all 1000ms ease; -moz-transition: all 100ms ease; -ms-transition: all 1000ms ease; -o-transition: all 1000ms ease; transition: all 1000ms ease; } .main-slider .active .text{ opacity: 1; transform: scaleY(1); -webkit-transition-delay: 900ms; -moz-transition-delay: 900ms; -ms-transition-delay: 900ms; -o-transition-delay: 900ms; transition-delay: 900ms; } .main-slider .btns-box{ opacity:0; transform: scaleY(0); transform-origin: top; display:inline-block; -webkit-transition: all 900ms ease; -moz-transition: all 900ms ease; -ms-transition: all 900ms ease; -o-transition: all 900ms ease; transition: all 900ms ease; } .main-slider .active .btns-box{ opacity: 1; transform: scaleY(1); -webkit-transition-delay: 1200ms; -moz-transition-delay: 1200ms; -ms-transition-delay: 1200ms; -o-transition-delay: 1200ms; transition-delay: 1200ms; } .main-slider .play-box{ position:absolute; left:50px; bottom:50px; z-index:10; } .main-slider .play-box .play-button span{ position: relative; width:100px; height:100px; text-align:center; line-height:100px; display:inline-block; color:var(--main-color-two); font-size:var(--font-22); -webkit-transition: all 600ms ease; -moz-transition: all 600ms ease; -ms-transition: all 600ms ease; -o-transition: all 600ms ease; transition: all 600ms ease; background-color:var(--white-color); } .main-slider .play-box .play-button span:hover{ color:var(--white-color); background-color:var(--main-color); } .main-slider .play-box .play-button .ripple, .main-slider .play-box .play-button .ripple:before, .main-slider .play-box .play-button .ripple:after { position: absolute; top: 50%; left: 50%; width:100px; height:100px; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); -ms-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); -o-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); -webkit-animation: ripple 3s infinite; -moz-animation: ripple 3s infinite; -ms-animation: ripple 3s infinite; -o-animation: ripple 3s infinite; animation: ripple 3s infinite; } .main-slider .play-box .play-button .ripple:before { -webkit-animation-delay: .9s; -moz-animation-delay: .9s; -ms-animation-delay: .9s; -o-animation-delay: .9s; animation-delay: .9s; content: ""; position: absolute; } .main-slider .play-box .play-button .ripple:after { -webkit-animation-delay: .6s; -moz-animation-delay: .6s; -ms-animation-delay: .6s; -o-animation-delay: .6s; animation-delay: .6s; content: ""; position: absolute; } @-webkit-keyframes ripple { 70% {box-shadow: 0 0 0 70px rgba(253, 167, 0, 0);} 100% {box-shadow: 0 0 0 0 rgba(253, 167, 0, 0);} } @keyframes ripple { 70% {box-shadow: 0 0 0 70px rgba(253, 167, 0, 0);} 100% {box-shadow: 0 0 0 0 rgba(253, 167, 0, 0);} } .main-slider .owl-dots{ position:absolute; right:50px; top:50%; width:7px; z-index:10; min-height:200px; margin-top:-65px; } .main-slider .owl-dots .owl-dot{ position:relative; width:3px; height:40px; margin:2px 0px; transition:all 0.3s ease; -moz-transition:all 0.3s ease; -webkit-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; background-color:var(--white-color); } .main-slider .owl-dots .owl-dot.active, .main-slider .owl-dots .owl-dot:hover{ background-color:var(--main-color); } .main-slider .owl-nav{ position:absolute; right:30px; top:50%; width:50px; z-index:10; min-height:260px; margin-top:-130px; transition:all 0.3s ease; -moz-transition:all 0.3s ease; -webkit-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; } .main-slider .owl-nav .owl-prev{ position:absolute; left:0px; top:0px; width:50px; height:50px; color:var(--main-color); font-size:var(--font-24); line-height:46px; text-align:center; border-radius:0px; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; background-color:var(--white-color); } .main-slider .owl-nav .owl-next{ position:absolute; left:0px; bottom:0px; color:var(--main-color); font-size:var(--font-24); width:50px; height:50px; line-height:50px; border-radius:0px; text-align:center; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; background-color:var(--white-color); } .main-slider .owl-nav .owl-prev:hover, .main-slider .owl-nav .owl-next:hover{ background-color:var(--main-color); color:var(--white-color); } /*** ==================================================================== Main Slider Section Two ==================================================================== ***/ .main-slider-two{ position:relative; overflow:hidden; } .main-slider-two .slide{ position:relative; overflow:hidden; padding:200px 0px 255px; background-size:cover; background-position:center right; } .main-slider-two .slide:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:0px; opacity:0.60; background-color:var(--main-color-two); } .main-slider-two .content-column{ position:relative; max-width:680px; float:right; width:100%; } .main-slider-two .content-column .inner-column{ position:relative; } .main-slider-two .title{ position:relative; font-weight: 500; opacity: 0; line-height:1.6em; transform: scaleY(0); transform-origin: top; color:var(--white-color); font-size:var(--font-18); text-transform:uppercase; margin-bottom: var(--margin-bottom-20); -webkit-transition: all 1000ms ease; -moz-transition: all 100ms ease; -ms-transition: all 1000ms ease; -o-transition: all 1000ms ease; transition: all 1000ms ease; } .main-slider-two .active .title{ opacity: 1; transform: scaleY(1); -webkit-transition-delay: 300ms; -moz-transition-delay: 300ms; -ms-transition-delay: 300ms; -o-transition-delay: 300ms; transition-delay: 300ms; } .main-slider-two h1{ color:var(--white-color); opacity: 0; transform: scaleY(0); transform-origin: top; -webkit-transition: all 1000ms ease; -moz-transition: all 100ms ease; -ms-transition: all 1000ms ease; -o-transition: all 1000ms ease; transition: all 1000ms ease; margin-bottom:var(--margin-bottom-20); } .main-slider-two h1 span{ color:var(--main-color); } .main-slider-two .active h1{ opacity: 1; transform: scaleY(1); -webkit-transition-delay: 600ms; -moz-transition-delay: 600ms; -ms-transition-delay: 600ms; -o-transition-delay: 600ms; transition-delay: 600ms; } .main-slider-two .text{ font-weight: 400; opacity: 0; line-height:1.8em; transform: scaleY(0); transform-origin: top; color:var(--white-color); font-size:var(--font-18); margin-bottom: var(--margin-bottom-35); -webkit-transition: all 1000ms ease; -moz-transition: all 100ms ease; -ms-transition: all 1000ms ease; -o-transition: all 1000ms ease; transition: all 1000ms ease; } .main-slider-two .active .text{ opacity: 1; transform: scaleY(1); -webkit-transition-delay: 900ms; -moz-transition-delay: 900ms; -ms-transition-delay: 900ms; -o-transition-delay: 900ms; transition-delay: 900ms; } .main-slider-two .btns-box{ opacity:0; transform: scaleY(0); transform-origin: top; display:inline-block; -webkit-transition: all 900ms ease; -moz-transition: all 900ms ease; -ms-transition: all 900ms ease; -o-transition: all 900ms ease; transition: all 900ms ease; } .main-slider-two .active .btns-box{ opacity: 1; transform: scaleY(1); -webkit-transition-delay: 1200ms; -moz-transition-delay: 1200ms; -ms-transition-delay: 1200ms; -o-transition-delay: 1200ms; transition-delay: 1200ms; } .main-slider-two .play-box{ position:absolute; right:50px; bottom:50px; z-index:10; } .main-slider-two .play-box .play-button span{ position: relative; width:100px; height:100px; text-align:center; line-height:100px; display:inline-block; color:var(--main-color-two); font-size:var(--font-22); -webkit-transition: all 600ms ease; -moz-transition: all 600ms ease; -ms-transition: all 600ms ease; -o-transition: all 600ms ease; transition: all 600ms ease; background-color:var(--white-color); } .main-slider-two .play-box .play-button span:hover{ color:var(--white-color); background-color:var(--main-color); } .main-slider-two .play-box .play-button .ripple, .main-slider-two .play-box .play-button .ripple:before, .main-slider-two .play-box .play-button .ripple:after { position: absolute; top: 50%; left: 50%; width:100px; height:100px; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); -ms-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); -o-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); -webkit-animation: ripple 3s infinite; -moz-animation: ripple 3s infinite; -ms-animation: ripple 3s infinite; -o-animation: ripple 3s infinite; animation: ripple 3s infinite; } .main-slider-two .play-box .play-button .ripple:before { -webkit-animation-delay: .9s; -moz-animation-delay: .9s; -ms-animation-delay: .9s; -o-animation-delay: .9s; animation-delay: .9s; content: ""; position: absolute; } .main-slider-two .play-box .play-button .ripple:after { -webkit-animation-delay: .6s; -moz-animation-delay: .6s; -ms-animation-delay: .6s; -o-animation-delay: .6s; animation-delay: .6s; content: ""; position: absolute; } .main-slider-two .owl-dots{ position:absolute; left:55px; top:50%; width:7px; z-index:10; min-height:200px; margin-top:-65px; } .main-slider-two .owl-dots .owl-dot{ position:relative; width:3px; height:40px; margin:2px 0px; transition:all 0.3s ease; -moz-transition:all 0.3s ease; -webkit-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; background-color:var(--white-color); } .main-slider-two .owl-dots .owl-dot.active, .main-slider-two .owl-dots .owl-dot:hover{ background-color:var(--main-color); } .main-slider-two .owl-nav{ position:absolute; left:30px; top:50%; width:50px; z-index:10; min-height:260px; margin-top:-130px; transition:all 0.3s ease; -moz-transition:all 0.3s ease; -webkit-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; } .main-slider-two .owl-nav .owl-prev{ position:absolute; left:0px; top:0px; width:50px; height:50px; color:var(--main-color); font-size:var(--font-24); line-height:46px; text-align:center; border-radius:0px; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; background-color:var(--white-color); } .main-slider-two .owl-nav .owl-next{ position:absolute; left:0px; bottom:0px; color:var(--main-color); font-size:var(--font-24); width:50px; height:50px; line-height:50px; border-radius:0px; text-align:center; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; background-color:var(--white-color); } .main-slider-two .owl-nav .owl-prev:hover, .main-slider-two .owl-nav .owl-next:hover{ background-color:var(--main-color); color:var(--white-color); } /*** ==================================================================== Counter Section ==================================================================== ***/ .counter-section{ position:relative; } .counter-section .outer-container{ position:relative; text-align:right; } .counter-section .outer-container .inner-container{ position:relative; overflow:hidden; margin-top:-90px; z-index:10; display:inline-block; border-radius:10px 0px 0px 10px; } .counter-section .column{ position:relative; padding:0px; float:left; } /* Fact Counter */ .fact-counter{ position:relative; } .fact-counter .column{ position:relative; } .fact-counter .column .inner{ position:relative; text-align:left; padding:50px 35px 50px; transition:all 0.3s ease; -moz-transition:all 0.3s ease; -webkit-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; background-color:var(--main-color-two); } .fact-counter .column:nth-child(2) .inner{ background-color:var(--main-color); } .fact-counter .column:nth-child(2) .inner .count-outer, .fact-counter .column:nth-child(2) .inner .counter-title, .fact-counter .column:nth-child(2) .inner .content .icon{ color:var(--main-color-two); } .fact-counter .column .inner .content{ position:relative; padding-left:var(--padding-left-80); } .fact-counter .column .inner .content .icon{ position:absolute; left:0px; top:0px; line-height:1em; display:inline-block; color:var(--main-color); font-size:var(--font-60); } .fact-counter .count-outer .percentage{ display:inline-block; } .fact-counter .column .inner .count-outer{ position:relative; line-height:1em; font-weight:900; color:var(--white-color); font-size:var(--font-50); } .fact-counter .column .inner .counter-title{ position:relative; font-weight:500; width:190px; font-size:var(--font-18); color:var(--white-color); margin-top:var(--margin-top-10); } .fact-counter.style-two .column .inner .content .icon{ width:95px; height:95px; line-height:95px; text-align:center; border-radius:50px; font-size:var(--font-40); color:var(--main-color-two); background-color:var(--main-color); } .fact-counter.style-two .column:nth-child(2) .inner .content .icon{ color:var(--white-color); background-color:var(--main-color-two); } .fact-counter.style-two .column:nth-child(2){ transform:scale(1,1.10); } .fact-counter.style-two .column .inner .content{ padding-left:var(--padding-left-120); } .fact-counter.style-three .column .inner{ padding:0px 0px; background:none; } .fact-counter.style-three .column:nth-child(2) .inner .content .icon{ color:var(--main-color); } .fact-counter.style-three .column .inner .count-outer, .fact-counter.style-three .column .inner .counter-title{ color:var(--main-color-two); } /*** ==================================================================== Counter Section ==================================================================== ***/ .counter-section-two{ position:relative; } .counter-section-two .inner-container{ position:relative; margin-top:-90px; } .counter-section-two .column{ position:relative; float:left; padding:0px; } /*** ==================================================================== Services Section ==================================================================== ***/ .services-section{ position:relative; padding:100px 0px 90px; } .services-section .image-layer-one{ position:absolute; left:0px; width:50%; bottom:0px; height:450px; } .services-section .image-layer-one:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:0px; opacity:0.80; background-color:#f3f3f3; } .services-section .inner-container{ position:relative; overflow:hidden; border-radius:6px; background-size:cover; padding:65px 50px 40px; background-attachment:fixed; margin-bottom:var(--margin-bottom-50); box-shadow:0px 0px 15px rgba(0,0,0,0.15); } .services-section .inner-container:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:0px; opacity:0.90; background-color:var(--main-color-two); } .service-block{ position:relative; margin-bottom:var(--margin-bottom-30); } .service-block .inner-box{ position:relative; text-align:center; } .service-block:last-child .inner-box:before{ display:none; } .service-block .inner-box:before{ position:absolute; content:''; right:-20px; top:0px; bottom:0px; width:1px; opacity:0.70; border-right:1px dotted var(--main-color); } .service-block .inner-box .icon{ position:relative; line-height:1em; color:var(--main-color); font-size:var(--font-60); } .service-block .inner-box h4{ position:relative; margin-top:var(--margin-top-10); } .service-block .inner-box h4 a{ position:relative; color:var(--white-color); } .service-block .inner-box h4 a:hover{ color:var(--main-color); } .service-block .inner-box .text{ position:relative; padding:0px 30px; font-size:var(--font-16); color:var(--white-color); margin-top:var(--margin-top-15); } .service-block .inner-box .read-more{ position:relative; font-weight:700; font-size:var(--font-16); color:var(--main-color); display:inline-block; margin-top:var(--margin-top-15); } .service-block .inner-box .read-more .fa{ position:relative; top:1px; margin-left:var(--margin-left-5); } .service-block .inner-box .read-more:hover{ color:var(--white-color); } /*** ==================================================================== Experiance Section ==================================================================== ***/ .experiance-section{ position:relative; overflow:hidden; } .experiance-section .image-layer{ position:absolute; right:0px; width:50%; top:0px; height:450px; overflow:hidden; border-radius:0px 0px 0px 10px; } .experiance-section .image-layer:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:0px; opacity:0.80; background-color:#f3f3f3; } .experiance-section .content-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .experiance-section .content-column .inner-column{ position:relative; } .experiance-section .content-column .year-box{ position:relative; width:225px; height:230px; text-align:center; padding-top:50px; border-radius:0px 0px 15px 15px; background-color:var(--main-color); margin-bottom:var(--margin-bottom-40); } .experiance-section .content-column .year-box .count-box{ position:relative; font-weight:900; line-height:1em; font-size:var(--font-90); color:var(--main-color-two); } .experiance-section .content-column .year-box .years{ position:relative; font-weight:900; font-size:var(--font-24); text-transform:uppercase; color:var(--main-color-two); } .experiance-section .content-column .title{ position:relative; font-weight:800; line-height:1.1em; font-size:var(--font-36); color:var(--main-color-two); padding-left:var(--padding-left-85); } .experiance-section .content-column .title i{ position:relative; font-style:normal; font-weight:300; color:var(--main-color); } .experiance-section .content-column .title .icon{ position:absolute; left:0px; top:10px; line-height:1em; font-weight:normal; color:var(--main-color); font-size:var(--font-60); } .experiance-section .content-column .text{ position:relative; margin-top:var(--margin-top-20); margin-bottom:var(--margin-bottom-30); } .experiance-section .form-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .experiance-section .form-column .inner-column{ position:relative; padding-top:230px; } .experiance-section .form-column .content{ position:relative; max-width:500px; width:100%; padding:70px 90px; border-radius:8px; margin-left:80px; background-color:#0c2d62; } .experiance-section .form-column .title{ position:relative; text-align:center; margin-bottom:var(--margin-bottom-30); } .experiance-section .form-column .title h4{ color:var(--white-color); } .experiance-section .form-column .title span{ position:relative; display:block; color:var(--main-color); margin-top:var(--margin-top-10); text-transform:uppercase; font-size:var(--font-18); } /* Email Form */ .email-form .form-group{ position:relative; display:block; } .email-form .form-group input[type="text"], .email-form .form-group input[type="tel"], .email-form .form-group input[type="email"], .email-form .form-group textarea{ position:relative; display:block; width:100%; color:#000000; line-height:20px; height:70px; font-size:var(--font-16); color:#797979; overflow:hidden; border-radius:6px; font-weight:400; text-align:center; padding:10px 25px 10px 25px; background:var(--white-color); -webkit-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; -moz-transition:all 300ms ease; transition:all 300ms ease; } .email-form .form-group input[type="submit"], .email-form button{ position:relative; margin-top:10px; width:100%; padding:18px 15px; text-transform:uppercase; } .email-form.style-two .form-group input{ text-align:left; margin-bottom:var(--margin-bottom-10); } /*** ==================================================================== Projects Section ==================================================================== ***/ .projects-section{ position:relative; padding:90px 0px 100px; } .projects-section .auto-container{ max-width:1500px; } .projects-section .tab-btns-box{ position:relative; text-align:center; margin-bottom:var(--margin-bottom-20); } .projects-section .tab-btns-box .p-tab-btn{ position:relative; color:#003b49; cursor:pointer; font-weight:700; margin:0px 15px; display:inline-block; font-size:var(--font-18); transition:all 0.3s ease; padding-bottom:var(--padding-bottom-5); -moz-transition:all 0.3s ease; -webkit-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; margin-bottom:var(--margin-bottom-20); } .projects-section .tab-btns-box .p-tab-btn:hover, .projects-section .tab-btns-box .p-tab-btn.active-btn{ color:var(--main-color); } .projects-section .tab-btns-box .p-tab-btn:before{ position:absolute; content:''; left:0px; bottom:0px; width:100%; height:3px; opacity:0; display:block; background-color:var(--main-color); transform:scale(0.2,1); -moz-transition:all 0.3s ease; -webkit-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; } .projects-section .tab-btns-box .p-tab-btn:hover::before, .projects-section .tab-btns-box .p-tab-btn.active-btn::before{ opacity:1; transform:scale(1,1); } .project-tab .p-tabs-content{ position:relative; display:block; } .project-tab .p-tabs-content .owl-nav{ display:none; } .project-tab .p-tabs-content .owl-dots{ position:relative; text-align:center; margin-top:var(--margin-top-20); } .project-tab .p-tabs-content .owl-dots .owl-dot{ position:relative; width:16px; height:16px; margin:0px 8px; border-radius:50px; display:inline-block; background-color:#dadada; transition:all 0.7s ease; -moz-transition:all 0.7s ease; -webkit-transition:all 0.7s ease; -ms-transition:all 0.7s ease; -o-transition:all 0.7s ease; } .project-tab .p-tabs-content .owl-dots .owl-dot:hover, .project-tab .p-tabs-content .owl-dots .owl-dot.active{ background-color:var(--main-color); } .project-tab .p-tab{ position:absolute; left:0px; top:0px; width:100%; height:auto; visibility:hidden; } .project-tab .p-tab.active-tab{ position:relative; visibility:visible; z-index:5; } .p-tab.active-tab .gallery-block{ -webkit-transform:scaleY(1); -ms-transform:scaleY(1); -o-transform:scaleY(1); -moz-transform:scaleY(1); transform:scaleY(1); } .p-tab .gallery-block{ transition:all 0.7s ease; -moz-transition:all 0.7s ease; -webkit-transition:all 0.7s ease; -ms-transition:all 0.7s ease; -o-transition:all 0.7s ease; -webkit-transform:scaleY(0); -ms-transform:scaleY(0); -o-transform:scaleY(0); -moz-transform:scaleY(0); transform:scaleY(0); } .projects-section .owl-carousel .owl-stage-outer{ padding-bottom:var(--padding-bottom-30); } .gallery-block{ position:relative; margin-bottom:var(--margin-bottom-30); } .gallery-block .inner-box{ position:relative; } .gallery-block .inner-box .image{ position:relative; } .gallery-block .inner-box .image img{ position:relative; width:100%; display:block; overflow:hidden; border-radius:5px; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .gallery-block .inner-box:hover .image img{ opacity:0.60; } .gallery-block .inner-box .image .overlay-box{ position:absolute; left:25px; right:25px; bottom:-25px; padding:25px 30px 30px; } .gallery-block .inner-box .image .overlay-box:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:0px; border-radius:10px; background-color:var(--main-color-two); } .gallery-block .inner-box h5{ position:relative; } .gallery-block .inner-box h5 a{ position:relative; color:var(--white-color); } .gallery-block .inner-box h5 a:hover{ color:var(--main-color); } .gallery-block .inner-box .location{ position:relative; font-size:var(--font-16); color:var(--main-color); margin-top:var(--margin-top-10); padding-left:var(--padding-left-25); } .gallery-block .inner-box .location:before{ position:absolute; left:0px; top:-1px; content: "\f143"; font-family: "flaticon"; } /*** ==================================================================== Solution Section ==================================================================== ***/ .solution-section{ position:relative; overflow:hidden; padding:100px 0px 70px; background-size:cover; } .solution-section .side-image{ position:absolute; right:0px; bottom:0px; } .solution-section:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:0px; opacity:0.70; background-color:#f4f4f4; } .solution-section .title-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .solution-section .title-column .inner-column{ position:relative; padding-top:var(--padding-top-100); } .solution-section .content-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .solution-section .content-column .inner-column{ position:relative; } /* Feature Block */ .feature-block{ position:relative; margin-bottom:var(--margin-bottom-40); } .feature-block:last-child{ margin-bottom:var(--margin-zero); } .feature-block .inner-box{ position:relative; padding-left:var(--padding-left-160); } .feature-block .inner-box .icon{ position:absolute; left:0px; top:0px; width:130px; height:130px; line-height:130px; text-align:center; border-radius:50%; font-size:var(--font-50); color:var(--main-color-two); background-color:var(--main-color); transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .feature-block .inner-box:hover .icon{ -webkit-transform: scale(-1) rotate(180deg); -moz-transform: scale(-1) rotate(180deg); -ms-transform: scale(-1) rotate(180deg); -o-transform: scale(-1) rotate(180deg); transform: scale(-1) rotate(180deg); color:var(--main-color); background-color:var(--main-color-two); } .feature-block .inner-box h4{ } .feature-block .inner-box h4 a{ position:relative; color:var(--main-color-two); } .feature-block .inner-box:hover h4 a{ color:var(--main-color); } .feature-block .inner-box .text{ margin-top:var(--margin-top-5); } .feature-block .inner-box .read-more{ position:relative; letter-spacing:1px; font-weight:700; display:inline-block; text-transform:uppercase; margin-top:var(--margin-top-5); text-decoration:underline; } .feature-block .inner-box:hover .read-more{ color:var(--main-color-two); } /*** ==================================================================== Video Section ==================================================================== ***/ .video-section{ position:relative; overflow:hidden; padding:100px 0px 100px; background-attachment:fixed; background-size:cover; } .video-section:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:0px; opacity:0.70; background-color:#031125; } .video-section .content{ position:relative; text-align:center; } .video-section .content h2{ color:var(--white-color); } .video-section .content .text{ font-size:var(--font-18); color:var(--main-color); margin-top:var(--margin-top-20); margin-bottom:var(--margin-bottom-40); } .video-section .video-box{ position:relative; color:var(--main-color); font-size:var(--font-80); text-align:center; border-radius:10px; line-height: 1em; display:inline-block; z-index:1; transition:all 0.3s ease; -moz-transition:all 0.3s ease; -webkit-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; } .video-section .video-box .overlay-box span{ position: absolute; left:50%; top: 50%; z-index:99; color:var(-white-color); font-size:var(--font-16); font-weight:400; text-align: center; border-radius:10px; padding-left:7px; display: inline-block; margin-top: -30px; margin-left:-30px; transition: all 900ms ease; -moz-transition: all 900ms ease; -webkit-transition: all 900ms ease; -ms-transition: all 900ms ease; -o-transition: all 900ms ease; box-shadow:0px 0px 15px rgba(0,0,0,0.10); } .video-section .video-box .ripple, .video-section .video-box .ripple:before, .video-section .video-box .ripple:after { position: absolute; top: 46%; left: 50%; width:80px; height:80px; margin-left:.5px; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; border-radius: 50px; -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, .4); -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, .4); -ms-box-shadow: 0 0 0 0 rgba(255, 255 , 255, .4); -o-box-shadow: 0 0 0 0 rgba(255, 255, 255, .4); box-shadow: 0 0 0 0 rgba(255, 255, 255, .4); -webkit-animation: ripple 3s infinite; -moz-animation: ripple 3s infinite; -ms-animation: ripple 3s infinite; -o-animation: ripple 3s infinite; animation: ripple 3s infinite; } .video-section .video-box .ripple:before { -webkit-animation-delay: .9s; -moz-animation-delay: .9s; -ms-animation-delay: .9s; -o-animation-delay: .9s; animation-delay: .9s; content: ""; position: absolute; } .video-section .video-box .ripple:after { -webkit-animation-delay: .6s; -moz-animation-delay: .6s; -ms-animation-delay: .6s; -o-animation-delay: .6s; animation-delay: .6s; content: ""; position: absolute; } @-webkit-keyframes ripple { 70% {box-shadow: 0 0 0 70px rgba(255, 255, 255, 0);} 100% {box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);} } @keyframes ripple { 70% {box-shadow: 0 0 0 70px rgba(255, 255, 255, 0);} 100% {box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);} } /*** ==================================================================== Team Section ==================================================================== ***/ .team-section{ position:relative; padding:100px 0px 100px; background-position:right bottom; background-repeat:no-repeat; } .team-section:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:0px; opacity:0.75; background-color:var(--white-color); } .team-tabs{ position:relative; min-height:550px; padding-left:440px; } .team-tabs .tab-btns{ position:absolute; left:0px; top:0px; width:100%; max-width:380px; margin-bottom:var(--margin-bottom-30); } .team-tabs .tab-btns .tab-btn{ position:relative; display:block; font-size:var(--font-26); background:none; color:var(--main-color-two); border-bottom:1px solid #c5c5c5; text-transform:capitalize; font-weight:800; line-height:24px; cursor:pointer; display:block; padding:25px 20px 25px 70px; transition:all 500ms ease; } .team-tabs .tab-btns .tab-btn i{ position:relative; display:block; color:#19697c; font-weight:400; font-style:normal; margin-top:var(--margin-top-10); font-size:var(--font-16); } .team-tabs .tab-btns .tab-btn .number{ position:absolute; left:0px; top:25px; color:#c0c0c0; font-weight:800; line-height:1em; font-size:var(--font-60); } .team-tabs .tab-btns .tab-btn:hover, .team-tabs .tab-btns .tab-btn.active-btn, .team-tabs .tab-btns .tab-btn:hover .number, .team-tabs .tab-btns .tab-btn.active-btn .number{ color:var(--main-color); } .team-tabs .tabs-content{ position:relative; } .team-tabs .tabs-content .tab{ position:relative; display:none; } .team-tabs .tabs-content .tab.active-tab{ display:block; } .team-tabs .tabs-content .image-column{ position:relative; } .team-tabs .tabs-content .image-column .image{ position:relative; } .team-tabs .tabs-content .image-column .image img{ position:relative; width:100%; display:block; } .team-tabs .tabs-content .info-column{ position:relative; } .team-tabs .tabs-content .info-column h4{ position:relative; } .team-tabs .tabs-content .info-column .designation{ position:relative; font-size:var(--font-18); margin-top:var(--margin-top-10); color:var(--main-color); } .team-tabs .tabs-content .info-column .text{ position:relative; margin-top:var(--margin-top-20); margin-bottom: var(--margin-bottom-20); } .team-tabs .tabs-content .contact-info{ position: relative; } .team-tabs .tabs-content .contact-info li{ position: relative; line-height: 24px; font-weight: 400; font-size: var(--font-16); color: var(--main-color-two); padding-left: var(--padding-left-40); margin-bottom: var(--margin-bottom-15); } .team-tabs .tabs-content .contact-info li .icon{ position: absolute; left: 0; top: 0; line-height: 1.4em; font-size: var(--font-24); color: var(--main-color-two); } .team-tabs .tabs-content .contact-info li strong{ display: block; line-height: 26px; font-weight: 600; font-size: var(--font-18); color: var(--main-color-two); margin-bottom: var(--margin-bottom-5); } .team-tabs .tabs-content .contact-info li a{ color: var(--main-color-two); display: inline-block; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; } .team-tabs .tabs-content .contact-info li a:hover{ color: var(--main-color); } .team-tabs .tabs-content .contact-info li:last-child{ margin-bottom:var(--margin-zero); } .team-tabs .tabs-content .social-box{ position:relative; margin-top: var(--margin-top-20); } .team-tabs .tabs-content .social-box li{ position:relative; display:inline-block; margin-right:var(--margin-right-15); } .team-tabs .tabs-content .social-box li a{ position:relative; font-size: var(--font-18); color: var(--main-color-two); } .team-tabs .tabs-content .social-box li a:hover{ color: var(--main-color); } /*** ==================================================================== Fullwidth Section ==================================================================== ***/ .fullwidth-section{ position:relative; } .fullwidth-section .left-column{ position:relative; width:50%; float:left; background-size:cover; } .fullwidth-section .left-column:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:0px; opacity:0.90; background-color:var(--main-color-two); } .fullwidth-section .left-column .inner-column{ position:relative; padding-top:120px; text-align:center; } .fullwidth-section .left-column .title{ position:relative; font-weight:700; letter-spacing:1px; color:var(--main-color); font-size:var(--font-14); text-transform:uppercase; } .fullwidth-section .left-column h3{ color:var(--white-color); margin-top:var(--margin-top-15); } .fullwidth-section .left-column .text{ position:relative; font-weight:400; color:var(--main-color); font-size:var(--font-18); margin-top:var(--margin-top-15); } .fullwidth-section .left-column .plus{ position:relative; width:80px; height:80px; line-height:80px; text-align:center; display:block; margin:0 auto; font-size:var(--font-24); color:var(--white-color); margin-top:var(--margin-top-80); border-radius:7px 7px 0px 0px; background-color:var(--main-color); } .fullwidth-section .left-column .plus:hover{ color:var(--main-color-two); background-color:var(--white-color); } .fullwidth-section .right-column{ position:relative; width:50%; float:left; background-color:var(--main-color); background-position:left bottom; background-repeat:no-repeat; display:flex; flex-wrap:wrap; justify-content:center; align-item:center; } .fullwidth-section .right-column .inner-column{ position:relative; padding-top:120px; text-align:center; } .fullwidth-section .right-column:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:0px; opacity:0.90; background-color:var(--main-color); } .fullwidth-section .right-column h3{ } .fullwidth-section .right-column h5{ margin-top:var(--margin-top-15); margin-bottom:var(--margin-bottom-35); } /*** ==================================================================== News Section ==================================================================== ***/ .news-section{ position:relative; padding:100px 0px 100px; } .news-section .button-box{ margin-top:var(--margin-top-20); } .news-block{ position:relative; margin-bottom:var(--margin-bottom-30); } .news-block .inner-box{ position:relative; } .news-block .inner-box .image{ position:relative; overflow:hidden; border-radius:10px; background-color:var(--main-color-two); } .news-block .inner-box .image img{ position:relative; width:100%; display:block; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .news-block .inner-box:hover .image img{ opacity:0.7; transform:scale(1.05,1.05) rotate(2deg); } .news-block .inner-box .lower-content{ position:relative; padding-top:var(--padding-top-25); } .news-block .inner-box .lower-content .post-date{ position:relative; font-weight:700; font-size:var(--font-15); color:var(--main-color); text-transform:uppercase; padding-left:var(--padding-left-30); } .news-block .inner-box .lower-content .post-date:before{ position:absolute; content:'\f073'; left:0px; top:0px; font-weight:normal; font-family: 'FontAwesome'; } .news-block .inner-box .lower-content h4{ margin-top:var(--margin-top-10); } .news-block .inner-box .lower-content h4 a{ position:relative; color:var(--main-color-two); } .news-block .inner-box .lower-content h4 a:hover{ color:var(--main-color); } .news-block .inner-box .lower-content .post-meta{ position:relative; margin-top:var(--margin-top-15); } .news-block .inner-box .lower-content .post-meta li{ position:relative; line-height:1.2em; display:inline-block; color:var(--main-color-two); border-right:1px solid #b3b3b3; padding-left:var(--padding-left-25); padding-right:var(--padding-right-15); margin-right:var(--margin-right-15); text-transform:uppercase; } .news-block .inner-box .lower-content .post-meta li:last-child{ padding-right:var(--padding-zero); margin-right:var(--margin-zero); border:0px; } .news-block .inner-box .lower-content .post-meta li .icon{ position:absolute; left:0px; top:0px; color:var(--main-color); } /* News Block Two */ .news-block-two{ position:relative; margin-bottom:var(--margin-bottom-30); } .news-block-two .inner-box{ position:relative; border-radius:10px; background-color:#f5f5f5; } .news-block-two .inner-box .image{ position:relative; overflow:hidden; border-radius:10px; background-color:var(--main-color-two); } .news-block-two .inner-box .image img{ position:relative; width:100%; display:block; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .news-block-two .inner-box:hover .image img{ opacity:0.7; transform:scale(1.05,1.05) rotate(2deg); } .news-block-two .inner-box .lower-content{ position:relative; padding:15px 15px 30px; } .news-block-two .inner-box .post-date{ position:absolute; left:50%; bottom:15px; padding:8px 20px; font-weight:700; border-radius:5px; display:inline-block; font-size:var(--font-15); text-transform:capitalize; color:var(--main-color-two); background-color:var(--main-color); transform:translateX(-50%); } .news-block-two .inner-box .lower-content .post-date:before{ position:absolute; content:'\f073'; left:0px; top:0px; font-weight:normal; font-family: 'FontAwesome'; } .news-block-two .inner-box .lower-content h4{ text-align:center; margin-top:var(--margin-top-20); } .news-block-two .inner-box .lower-content h4 a{ position:relative; color:var(--main-color-two); } .news-block-two .inner-box .lower-content h4 a:hover{ color:var(--main-color); } .news-block-two .inner-box .lower-content .text{ position:relative; text-align:center; color:var(--main-color-two); margin-top:var(--margin-top-10); } .news-block-two .inner-box .lower-content .post-meta{ position:relative; text-align:center; padding:10px 0px; background-color:var(--white-color); } .news-block-two .inner-box .lower-content .post-meta li{ position:relative; line-height:1.2em; display:inline-block; color:var(--main-color-two); border-right:1px solid #b3b3b3; padding-left:var(--padding-left-25); padding-right:var(--padding-right-15); margin-right:var(--margin-right-15); text-transform:capitalize; } .news-block-two .inner-box .lower-content .post-meta li:last-child{ padding-right:var(--padding-zero); margin-right:var(--margin-zero); border:0px; } .news-block-two .inner-box .lower-content .post-meta li .icon{ position:absolute; left:0px; top:0px; color:var(--main-color); } .news-section .circle-layer{ position:absolute; left:-350px; top:-350px; width:700px; height:700px; border-radius:50%; background-color:#f5f5f5; } /* News Block Three */ .news-block-three{ position:relative; margin-bottom:var(--margin-bottom-30); } .news-block-three .inner-box{ position:relative; border-radius:10px; } .news-block-three .inner-box .image{ position:relative; } .news-block-three .inner-box .image img{ position:relative; width:100%; display:block; overflow:hidden; border-radius:10px 10px 0px 0px; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .news-block-three .inner-box:hover .image img{ opacity:0.7; } .news-block-three .inner-box .lower-content:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:18px; border:6px solid #f5f5f5; border-top:0px; border-radius:0px 0px 8px 8px; } .news-block-three .inner-box .lower-content{ position:relative; padding:25px 40px 0px; } .news-block-three .inner-box .post-date{ position:absolute; left:40px; width:75px; height:75px; bottom:-20px; font-weight:800; padding:14px 5px 6px; text-align:center; border-radius:5px; line-height:28px; display:inline-block; font-size:var(--font-30); text-transform:capitalize; color:var(--white-color); background-color:var(--main-color-two); } .news-block-three .inner-box .post-date span{ display:block; font-weight:400; font-size:var(--font-14); text-transform:uppercase; } .news-block-three .inner-box .lower-content h5{ margin-top:var(--margin-top-20); font-weight:600; } .news-block-three .inner-box .lower-content h5 a{ position:relative; color:var(--main-color-two); } .news-block-three .inner-box .lower-content h5 a:hover{ color:var(--main-color); } .news-block-three .inner-box .lower-content .post-meta{ position:relative; text-align:center; padding:12px 0px; border-radius:7px; margin-left:-10px; margin-right:-10px; margin-top:var(--margin-top-25); background-color:var(--white-color); box-shadow:0px 0px 15px rgba(0,0,0,0.07); } .news-block-three .inner-box .lower-content .post-meta li{ position:relative; line-height:1.2em; display:inline-block; color:var(--main-color-two); border-right:1px solid #b3b3b3; padding-left:var(--padding-left-25); padding-right:var(--padding-right-15); margin-right:var(--margin-right-15); text-transform:uppercase; } .news-block-three .inner-box .lower-content .post-meta li:last-child{ padding-right:var(--padding-zero); margin-right:var(--margin-zero); border:0px; } .news-block-three .inner-box .lower-content .post-meta li .icon{ position:absolute; left:0px; top:0px; color:var(--main-color); } /*** ==================================================================== Main Slider Section ==================================================================== ***/ .work-section{ position:relative; z-index:12; padding:0px 0px 70px; } .work-section .blocks-column{ position:relative; margin-bottom:30px; } .work-section .blocks-column .inner-column{ position:relative; border-radius:6px; overflow:hidden; margin-top:-310px; box-shadow:0px 10px 25px rgba(0,0,0,0.07); } .work-section .blocks-column .inner-column .image{ position:relative; } .work-section .blocks-column .inner-column .image img{ position:relative; width:100%; display:block; } .work-section .blocks-column .blocks-outer{ position:relative; } .work-section .blocks-column .blocks-outer .feature-block-two:nth-child(2n + 1){ position:relative; background-color:#f5f5f5; } .work-section .blocks-column .more{ position:relative; padding:25px 15px; text-align:center; display:block; font-weight:700; font-size:var(--font-18); background-color:var(--main-color); color:var(--main-color-two); text-transform:uppercase; } .work-section .blocks-column .more:hover{ background-color:var(--main-color-two); color:var(--white-color); } /* Feature Block Two */ .feature-block-two{ position:relative; } .feature-block-two .inner-box{ position:relative; padding:28px 30px 25px 50px; } .feature-block-two .inner-box .content{ position:relative; padding-left:var(--padding-left-100); } .feature-block-two .inner-box .icon{ position:absolute; left:0px; top:0px; width:80px; height:80px; line-height:80px; text-align:center; border-radius:50%; font-size:var(--font-34); color:var(--main-color-two); background-color:var(--main-color); transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .feature-block-two .inner-box:hover .icon{ -webkit-transform: scale(-1) rotate(180deg); -moz-transform: scale(-1) rotate(180deg); -ms-transform: scale(-1) rotate(180deg); -o-transform: scale(-1) rotate(180deg); transform: scale(-1) rotate(180deg); color:var(--main-color); background-color:var(--main-color-two); } .feature-block-two .inner-box h5{ } .feature-block-two .inner-box h5 a{ position:relative; color:var(--main-color-two); } .feature-block-two .inner-box:hover h5 a{ color:var(--main-color); } .feature-block-two .inner-box .text{ margin-top:var(--margin-top-5); } .feature-block-two .inner-box .read-more{ position:relative; letter-spacing:1px; font-weight:700; display:inline-block; text-transform:uppercase; margin-top:var(--margin-top-5); text-decoration:underline; } .feature-block-two .inner-box:hover .read-more{ color:var(--main-color-two); } .work-section .content-column{ position:relative; margin-bottom:30px; } .work-section .content-column .inner-column{ position:relative; border-radius:6px; overflow:hidden; padding:79px 70px; margin-top:var(--margin-top-110); background-size:cover; } .work-section .content-column .inner-column:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:0px; opacity:0.60; z-index:1; background-color:var(--main-color-two); } .work-section .content-column h2{ position:relative; color:var(--white-color); z-index:2; padding-left:var(--padding-left-30); border-left:5px solid var(--main-color); } .work-section .content-column h2 span{ position:relative; display:block; font-size:var(--font-24); font-weight:400; color:var(--main-color); } .work-section .content-column .text{ position:relative; color:#f3f3f3; z-index:2; font-size:var(--font-18); margin-top:var(--margin-top-25); margin-bottom:var(--margin-bottom-30); } .work-section .content-column .phone-box{ position:relative; float:left; z-index:2; font-weight:500; font-size:var(--font-15); color:var(--main-color); padding-left:var(--padding-left-60); } .work-section .content-column .phone-box a{ position:relative; font-weight:700; display:inline-block; font-size:var(--font-22); color:var(--white-color); margin-top:var(--margin-top-5); } .work-section .content-column .phone-box .icon{ position:absolute; left:0px; top:10px; line-height:1em; font-size:var(--font-36); color:var(--main-color); } .work-section .content-column .phone-box .or{ position:absolute; right:-60px; width:40px; height:40px; bottom:0px; text-align:center; border-radius:50px; line-height:40px; font-weight:700; display:inline-block; font-size:var(--font-14); text-transform:uppercase; color:var(--white-color); background-color:var(--main-color-two); } .work-section .content-column .button-box{ position:relative; float:left; z-index:2; margin-left:var(--margin-left-80); } /*** ==================================================================== Services Section Two ==================================================================== ***/ .services-section-two{ position:relative; padding:0px 0px 100px; } .services-section-two.style-two{ padding-top:110px; } .services-section-two .owl-nav{ display:none; } .services-section-two .owl-dots{ position:relative; text-align:center; margin-top:var(--margin-top-10); } .services-section-two .owl-dots .owl-dot{ position:relative; width:12px; height:12px; margin:0px 5px; display:inline-block; background-color:#dadada; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .services-section-two .owl-dots .owl-dot.active, .services-section-two .owl-dots .owl-dot:hover{ background-color:#f2be00; } .service-block-two{ position:relative; margin-bottom:var(--margin-bottom-30); } .service-block-two .inner-box{ position:relative; padding:50px 25px 35px; border-radius:8px; border:8px solid #f5f5f5; background-color:#f5f5f5; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .service-block-two .inner-box:hover{ background-color:#ffffff; } .service-block-two .inner-box .icon{ position:relative; color:var(--main-color); font-size:var(--font-50); } .service-block-two .inner-box h5{ position:relative; margin-top:var(--margin-top-15); } .service-block-two .inner-box h5 a{ position:relative; color:var(--white-color-two); } .service-block-two .inner-box h5 a:hover{ color:var(--main-color); } .service-block-two .inner-box .text{ position:relative; color:#19697c; font-size:var(--font-16); margin-top:var(--margin-top-15); } .service-block-two .inner-box .read-more{ position:relative; font-weight:700; display:inline-block; color:var(--main-color); font-size:var(--font-14); text-transform:uppercase; margin-top:var(--margin-top-20); } .service-block-two .inner-box .read-more .fa{ position:relative; top:1px; margin-left:var(--margin-left-5); } .service-block-two .inner-box .read-more:hover{ color:var(--white-color-two); } .service-block-two.style-two .inner-box{ text-align:center; } /*** ==================================================================== Experiance Section Two ==================================================================== ***/ .experiance-section-two{ position:relative; overflow:hidden; padding:100px 0px 170px; background-color:#f3f3f3; } .experiance-section-two.style-two{ background-color:#ffffff; padding-bottom:var(--padding-bottom-80); } .experiance-section-two.style-two .content-column .button-box{ margin-top:var(--margin-top-40); } .experiance-section-two .image-layer{ position:absolute; left:0px; width:100%; bottom:0px; height:980px; background-position:left bottom; background-repeat:no-repeat; } .experiance-section-two .content-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .experiance-section-two .content-column .sec-title{ margin-bottom:var(--margin-bottom-25); } .experiance-section-two .content-column .inner-column{ position:relative; } .experiance-section-two .content-column .mark-text{ position:relative; color:#003b49; font-size:16px; font-style:italic; line-height:1.7em; padding-left:var(--padding-left-30); border-left:4px solid var(--main-color); } .experiance-section-two .content-column .text{ margin-top:var(--margin-top-30); margin-bottom:var(--margin-bottom-30); } .experiance-section-two .image-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .experiance-section-two .image-column .inner-column{ position:relative; padding-left:80px; } .experiance-section-two .image-column .image{ position:relative; border-radius:7px; overflow:hidden; } .experiance-section-two .image-column .image img{ position:relative; width:100%; display:block; } .experiance-section-two .image-column .year-box{ position:absolute; left:0px; bottom:45px; width:225px; height:230px; z-index:1; padding-top:50px; text-align:center; border-radius:15px; background-color:var(--main-color); margin-bottom:var(--margin-bottom-40); } .experiance-section-two .image-column .year-box .count-box{ position:relative; font-weight:900; line-height:1em; font-size:var(--font-90); color:var(--main-color-two); } .experiance-section-two .image-column .year-box .years{ position:relative; font-weight:900; font-size:var(--font-24); text-transform:uppercase; color:var(--main-color-two); } /*** ==================================================================== Projects Section Two ==================================================================== ***/ .projects-section-two{ position:relative; padding:100px 0px 100px; } .projects-section-two .filters{ position:relative; margin-bottom:40px; text-align:center; } .projects-section-two .filters .filter-tabs{ position:relative; } .projects-section-two .filters li{ position: relative; display: inline-block; color: var(--main-color-two); padding:0px 0px 10px; cursor: pointer; font-size: var(--font-18); font-weight: 700; margin:0px 15px 0px; transition: all 300ms ease; -webkit-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; } .projects-section-two .filters .filter.active, .projects-section-two .filters .filter:hover{ color: var(--main-color); } .projects-section-two .filters li:before{ position:absolute; content:''; left:0px; bottom:-1px; height:3px; width:100%; opacity:0; transform: scale(0.5,1); background-color:var(--main-color); transition:all 300ms ease; -webkit-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; } .projects-section-two .filters li:hover:before, .projects-section-two .filters li.active::before{ opacity:1; transform: scale(1,1); } .projects-section-two .button-box{ margin-top:var(--margin-top-10); } .gallery-block-two{ position:relative; margin-bottom:var(--margin-bottom-30); } .gallery-block-two .inner-box{ position:relative; text-align:center; } .gallery-block-two .inner-box .image{ position:relative; border-radius:8px; overflow:hidden; background-color:var(--main-color-two); } .gallery-block-two .inner-box .image img{ position:relative; width:100%; display:block; overflow:hidden; border-radius:5px; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .gallery-block-two .inner-box:hover .image img{ opacity:0.60; } .gallery-block-two .inner-box .lower-content{ position:relative; padding-top:var(--padding-top-25); } .gallery-block-two .inner-box h5{ position:relative; } .gallery-block-two .inner-box h5 a{ position:relative; color:var(--main-color-two); transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .gallery-block-two .inner-box h5 a:hover{ color:var(--main-color); } .gallery-block-two .inner-box .designation{ position:relative; font-weight:700; font-size: var(--font-16); color:var(--main-color-two); margin-top:var(--margin-top-10); } .gallery-block-two .inner-box .designation span{ position:relative; font-weight:400; color:var(--main-color); } .gallery-block-two.mix{ display:none; } /*** ==================================================================== Testimonial Section ==================================================================== ***/ .testimonial-section{ position:relative; padding:100px 0px 142px; } .testimonial-section .image-layer{ position:absolute; left:0px; top:0px; top:0px; right:0px; height:600px; } .testimonial-section .image-layer:before{ position:absolute; content:''; left:0px; top:0px; bottom:0px; right:0px; z-index:1; opacity:0.70; background-color:var(--main-color-two); } .testimonial-section .title-column{ position:relative; z-index:2; margin-bottom:var(--margin-bottom-30); } .testimonial-section .title-column .inner-column{ position:relative; } .testimonial-section .title-column h2{ color:var(--white-color); } .testimonial-section .title-column .text{ color:var(--main-color); font-size:var(--font-18); margin-top:var(--margin-top-15); margin-bottom:var(--margin-bottom-30); } .testimonial-section .carousel-column{ position:relative; z-index:2; margin-bottom:var(--margin-bottom-30); } .testimonial-section .carousel-column .inner-column{ position:relative; } .testimonial-section .carousel-column .owl-dots{ display:none; } .testimonial-section .carousel-column .owl-nav{ position:relative; margin-top:var(--margin-top-35); } .testimonial-section .carousel-column .owl-nav .owl-prev, .testimonial-section .carousel-column .owl-nav .owl-next{ position:relative; width:60px; height:60px; text-align:center; line-height:60px; border-radius:6px; display:inline-block; font-size:var(--font-26); color:var(--white-color-two); margin-right:var(--margin-right-15); background-color:var(--white-color); transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .testimonial-section .carousel-column .owl-nav .owl-prev:hover, .testimonial-section .carousel-column .owl-nav .owl-next:hover{ color:var(--white-color); background-color:var(--main-color); } .testimonial-block{ position:relative; } .testimonial-block .inner-box{ position:relative; padding-left:185px; } .testimonial-block .inner-box .author-image{ position:absolute; left:0px; top:0px; width:157px; height:157px; overflow:hidden; border-radius:50%; display:inline-block; } .testimonial-block .inner-box .text{ position:relative; color:var(--white-color); font-size:var(--font-18); margin-bottom:var(--margin-bottom-20); } .testimonial-block .inner-box h5{ color:var(--white-color); margin-bottom:var(--margin-bottom-10); } .testimonial-block .inner-box .designation{ position:relative; color:var(--main-color); font-size:var(--font-16); } /*** ==================================================================== Clients Section ==================================================================== ***/ .clients-section{ position:relative; text-align:center; z-index:10; } .clients-section .inner-container{ position:relative; padding:40px 30px; border-radius:10px; margin-top:-45px; background-color:var(--main-color); box-shadow:0px 0px 15px rgba(0,0,0,0.15); } .clients-section .sponsors-outer .owl-dots, .clients-section .sponsors-outer .owl-nav{ position:relative; display:none; } .clients-section .sponsors-outer .image-box{ position:relative; text-align:center; margin:0px; } .clients-section .sponsors-outer .image-box img{ max-width:100%; width:auto; display:inline-block; -webkit-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; -moz-transition:all 300ms ease; transition:all 300ms ease; } .clients-section .sponsors-outer .image-box img:hover{ opacity:0.7; -webkit-filter: grayscale(100%); filter: grayscale(100%); } /*** ==================================================================== Quality Section ==================================================================== ***/ .quality-section{ position:relative; margin-top:-95px; padding:210px 0px 100px; background-size:cover; background-position:right bottom; } .quality-section:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:0px; opacity:0.95; background-color:#f3f3f3; } .quality-section .content-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .quality-section .content-column .inner-column{ position:relative; padding-right:var(--padding-right-50); } .quality-section .content-column .sec-title{ margin-bottom:var(--margin-bottom-30); } .quality-section .content-column .sec-title h2{ text-transform:capitalize; } .quality-section .content-column .check-list{ position:relative; } .quality-section .content-column .check-list li{ position:relative; line-height:1.7em; font-size:var(--font-16); color:var(--main-color-two); padding-left:var(--padding-left-60); margin-bottom:var(--margin-bottom-20); } .quality-section .content-column .check-list li:before{ position:absolute; content: "\f199"; left:0px; top:7px; line-height:1em; font-size:var(--font-40); color:var(--main-color); font-family: "flaticon"; } .quality-section .image-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .quality-section .image-column .inner-column{ position:relative; text-align:right; } .quality-section .image-column .image img{ position:relative; overflow:hidden; border-radius:8px; } .quality-section .image-column .image{ position:relative; display:inline-block; } .quality-section .image-column .play-box{ position:absolute; right:25px; bottom:-25px; z-index:10; border-radius:10px; } .quality-section .image-column .play-box .play-button span{ position: relative; width:100px; height:100px; text-align:center; line-height:100px; display:inline-block; border-radius:10px; color:var(--main-color-two); font-size:var(--font-56); -webkit-transition: all 600ms ease; -moz-transition: all 600ms ease; -ms-transition: all 600ms ease; -o-transition: all 600ms ease; transition: all 600ms ease; background-color:var(--main-color); } .quality-section .image-column .play-box .play-button span:hover{ color:var(--white-color); background-color:var(--main-color); } .quality-section .image-column .play-box .play-button .ripple, .quality-section .image-column .play-box .play-button .ripple:before, .quality-section .image-column .play-box .play-button .ripple:after { position: absolute; top: 50%; left: 50%; width:100px; height:100px; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-border-radius: 12px; -moz-border-radius: 12px; -ms-border-radius: 12px; -o-border-radius: 12px; border-radius: 12px; -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); -ms-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); -o-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); -webkit-animation: ripple 3s infinite; -moz-animation: ripple 3s infinite; -ms-animation: ripple 3s infinite; -o-animation: ripple 3s infinite; animation: ripple 3s infinite; } .quality-section .image-column .play-box .play-button .ripple:before { -webkit-animation-delay: .9s; -moz-animation-delay: .9s; -ms-animation-delay: .9s; -o-animation-delay: .9s; animation-delay: .9s; content: ""; position: absolute; } .quality-section .image-column .play-box .play-button .ripple:after { -webkit-animation-delay: .6s; -moz-animation-delay: .6s; -ms-animation-delay: .6s; -o-animation-delay: .6s; animation-delay: .6s; content: ""; position: absolute; } .quality-section .image-column .image-two{ position:absolute; left:0px; bottom:-75px; overflow:hidden; border-radius:12px; } /*** ==================================================================== Main Slider Section Three ==================================================================== ***/ .main-slider-three{ position:relative; overflow:hidden; } /*** ==================================================================== Waves Section ==================================================================== ***/ .waves { position: absolute; left:0px; bottom:0px; width: 100%; height: 15vh; min-height: 100px; max-height: 150px; } .waves .content { position: relative; height: 20vh; text-align: center; background-color: white; } /* Animation */ .parallax > use { -webkit-animation: move-forever 25s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite; animation: move-forever 25s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite; } .parallax > use:nth-child(1) { -webkit-animation-delay: -2s; animation-delay: -2s; -webkit-animation-duration: 7s; animation-duration: 7s; } .parallax > use:nth-child(2) { -webkit-animation-delay: -3s; animation-delay: -3s; -webkit-animation-duration: 10s; animation-duration: 10s; } .parallax > use:nth-child(3) { -webkit-animation-delay: -4s; animation-delay: -4s; -webkit-animation-duration: 13s; animation-duration: 13s; } .parallax > use:nth-child(4) { -webkit-animation-delay: -5s; animation-delay: -5s; -webkit-animation-duration: 20s; animation-duration: 20s; } @-webkit-keyframes move-forever { 0% { -webkit-transform: translate3d(-90px, 0, 0); transform: translate3d(-90px, 0, 0); } 100% { -webkit-transform: translate3d(85px, 0, 0); transform: translate3d(85px, 0, 0); } } @keyframes move-forever { 0% { -webkit-transform: translate3d(-90px, 0, 0); transform: translate3d(-90px, 0, 0); } 100% { -webkit-transform: translate3d(85px, 0, 0); transform: translate3d(85px, 0, 0); } } @-webkit-keyframes move-up-down { 0% { -webkit-transform: translateY(0px); transform: translateY(0px); } 50% { -webkit-transform: translateY(-15px); transform: translateY(-15px); } 100% { -webkit-transform: translateY(0px); transform: translateY(0px); } } @keyframes move-up-down { 0% { -webkit-transform: translateY(0px); transform: translateY(0px); } 50% { -webkit-transform: translateY(-15px); transform: translateY(-15px); } 100% { -webkit-transform: translateY(0px); transform: translateY(0px); } } @media (max-width: 768px) { .waves { height: 40px; min-height: 40px; } } .main-slider-three .waves{ position:absolute; left:0px; bottom:0px; z-index:20; } .main-slider-three .slide{ position:relative; overflow:hidden; padding:300px 0px 260px; background-size:cover; background-position:center right; } .main-slider-three .slide:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:0px; opacity:0.60; background-color:var(--main-color-two); } .main-slider-three .content-column{ position:relative; text-align:center; } .main-slider-three .content-column .inner-column{ position:relative; } .main-slider-three .title{ position:relative; font-weight: 500; opacity: 0; line-height:1.6em; transform: scaleY(0); transform-origin: top; color:var(--main-color); font-size:var(--font-18); text-transform:capitalize; margin-bottom: var(--margin-bottom-20); -webkit-transition: all 1000ms ease; -moz-transition: all 100ms ease; -ms-transition: all 1000ms ease; -o-transition: all 1000ms ease; transition: all 1000ms ease; } .main-slider-three .active .title{ opacity: 1; transform: scaleY(1); -webkit-transition-delay: 300ms; -moz-transition-delay: 300ms; -ms-transition-delay: 300ms; -o-transition-delay: 300ms; transition-delay: 300ms; } .main-slider-three h1{ color:var(--white-color); opacity: 0; line-height:1em; transform: scaleY(0); transform-origin: top; -webkit-transition: all 1000ms ease; -moz-transition: all 100ms ease; -ms-transition: all 1000ms ease; -o-transition: all 1000ms ease; transition: all 1000ms ease; margin-bottom:var(--margin-bottom-20); } .main-slider-three h1 span{ display:block; font-weight:600; color:var(--main-color); font-size:var(--font-24); } .main-slider-three .active h1{ opacity: 1; transform: scaleY(1); -webkit-transition-delay: 600ms; -moz-transition-delay: 600ms; -ms-transition-delay: 600ms; -o-transition-delay: 600ms; transition-delay: 600ms; } .main-slider-three .text{ font-weight: 400; opacity: 0; line-height:1.8em; transform: scaleY(0); transform-origin: top; color:var(--white-color); font-size:var(--font-16); margin-bottom: var(--margin-bottom-35); -webkit-transition: all 1000ms ease; -moz-transition: all 100ms ease; -ms-transition: all 1000ms ease; -o-transition: all 1000ms ease; transition: all 1000ms ease; } .main-slider-three .active .text{ opacity: 1; transform: scaleY(1); -webkit-transition-delay: 900ms; -moz-transition-delay: 900ms; -ms-transition-delay: 900ms; -o-transition-delay: 900ms; transition-delay: 900ms; } .main-slider-three .btns-box{ opacity:0; transform: scaleY(0); transform-origin: top; display:inline-block; -webkit-transition: all 900ms ease; -moz-transition: all 900ms ease; -ms-transition: all 900ms ease; -o-transition: all 900ms ease; transition: all 900ms ease; } .main-slider-three .btns-box .theme-btn{ float:left; margin-right:var(--margin-right-30); } .main-slider-three .active .btns-box{ opacity: 1; transform: scaleY(1); -webkit-transition-delay: 1200ms; -moz-transition-delay: 1200ms; -ms-transition-delay: 1200ms; -o-transition-delay: 1200ms; transition-delay: 1200ms; } .main-slider-three .play-box{ position:relative; float:left; margin-top:-10px; } .main-slider-three .play-box .play-button span{ position: relative; width:75px; height:75px; text-align:center; line-height:75px; display:inline-block; color:var(--main-color-two); font-size:var(--font-26); border-radius:50%; background-color:var(--white-color); -webkit-transition: all 600ms ease; -moz-transition: all 600ms ease; -ms-transition: all 600ms ease; -o-transition: all 600ms ease; transition: all 600ms ease; } .main-slider-three .play-box .play-button span:hover{ color:var(--white-color); background-color:var(--main-color); } .main-slider-three .play-box .play-button .ripple, .main-slider-three .play-box .play-button .ripple:before, .main-slider-three .play-box .play-button .ripple:after { position: absolute; top: 50%; left: 50%; width:75px; height:75px; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); -ms-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); -o-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); -webkit-animation: ripple 3s infinite; -moz-animation: ripple 3s infinite; -ms-animation: ripple 3s infinite; -o-animation: ripple 3s infinite; animation: ripple 3s infinite; } .main-slider-three .play-box .play-button .ripple:before { -webkit-animation-delay: .9s; -moz-animation-delay: .9s; -ms-animation-delay: .9s; -o-animation-delay: .9s; animation-delay: .9s; content: ""; position: absolute; } .main-slider-three .play-box .play-button .ripple:after { -webkit-animation-delay: .6s; -moz-animation-delay: .6s; -ms-animation-delay: .6s; -o-animation-delay: .6s; animation-delay: .6s; content: ""; position: absolute; } .main-slider-three .owl-dots{ display:none; } .main-slider-three .owl-nav{ position:absolute; left:30px; top:50%; right:30px; z-index:10; margin-top:0px; transition:all 0.3s ease; -moz-transition:all 0.3s ease; -webkit-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; } .main-slider-three .owl-nav .owl-prev{ position:absolute; left:0px; width:50px; height:50px; color:var(--main-color); font-size:var(--font-24); line-height:46px; text-align:center; border-radius:0px; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; background-color:var(--white-color); } .main-slider-three .owl-nav .owl-next{ position:absolute; right:0px; color:var(--main-color); font-size:var(--font-24); width:50px; height:50px; line-height:50px; border-radius:0px; text-align:center; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; background-color:var(--white-color); } .main-slider-three .owl-nav .owl-prev:hover, .main-slider-three .owl-nav .owl-next:hover{ background-color:var(--main-color); color:var(--white-color); } /*** ==================================================================== Company Section ==================================================================== ***/ .company-section{ position:relative; padding:110px 0px 70px; } .company-section .circle-layer{ position:absolute; right:20px; top:40px; width:150px; height:150px; border-radius:50%; background-color:#f5f5f5; } .company-section .big-letter{ position:absolute; left:0px; bottom:-380px; } .company-section .content-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .company-section .content-column .inner-column{ position:relative; padding-top:var(--padding-top-20); } .company-section .content-column .title{ position:relative; opacity:0.80; font-size:var(--font-18); color:var(--main-color-two); } .company-section .content-column h2{ margin-top:var(--margin-top-20); } .company-section .content-column .text{ position:relative; font-size:var(--font-16); line-height:1.6em; color:var(--main-color-two); margin-top:var(--margin-top-20); margin-bottom:var(--margin-bottom-30); } .company-section .content-column .button-box{ margin-top:var(--margin-top-40); } .company-section .form-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .company-section .form-column .inner-column{ position:relative; padding-left:var(--padding-left-100); } .company-section .form-column .content{ position:relative; border-radius:6px; padding:50px 55px; background-color:var(--main-color); box-shadow:0px 0px 15px rgba(0,0,0,0.10); } .company-section .form-column .title-box{ position:relative; text-align:center; margin-bottom:var(--margin-bottom-20); } .company-section .form-column .title-box h3{ position:relative; } .company-section .form-column .title-box .text{ position:relative; margin-top:var(--margin-top-10); } /*Default Form*/ .default-form{ position:relative; } .default-form .row{ margin:0px -5px; } .default-form .form-group{ position:relative; padding:0px 5px; margin-bottom:var(--margin-bottom-10); } .default-form input[type="text"], .default-form input[type="email"], .default-form input[type="password"], .default-form select, .default-form textarea{ display:block; width:100%; line-height:28px; height:56px; padding:8px 22px; border-radius:5px; font-size:var(--font-16); color:var(--main-color-two); transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; background-color:var(--white-color); } .default-form .form-group textarea::-webkit-input-placeholder, .default-form .form-group input::-webkit-input-placeholder{ color:#777777; } .default-form textarea{ height:170px; resize:none; font-size:15px; padding-top:18px; } .default-form input[type="text"]:focus, .default-form input[type="email"]:focus, .default-form input[type="password"]:focus, .default-form select:focus, .default-form textarea:focus{ border-color:#ffc108; } .default-form .theme-btn{ cursor:pointer; width:100%; margin-top:var(--margin-top-10); } /*** ==================================================================== Services Section Three ==================================================================== ***/ .services-section-three{ position:relative; padding:20px 0px 100px; } .services-section-three .inner-container{ position:relative; padding:0px 100px; } .services-section-three .button-box{ margin-top:var(--margin-top-20); } /*** ==================================================================== Clients Section Two ==================================================================== ***/ .clients-section-two{ position:relative; } .clients-section-two.style-two{ padding:100px 0px 90px; } .clients-section-two .title-box{ position:relative; margin-bottom:var(--margin-bottom-30); } .clients-section-two .title-box h2{ position:relative; padding-left:var(--padding-left-90); } .clients-section-two .title-box .icon{ position:absolute; left:15px; top:0px; color:var(--main-color); font-size:var(--font-70); line-height:1em; } .clients-section-two .title-box .text{ position:relative; font-size:var(--font-18); margin-top:var(--margin-top-25); } .clients-section-two .owl-carousel .owl-stage-outer{ position:relative; padding:20px 0px; } .clients-section-two .owl-theme .image-box{ margin:0px 10px; } .clients-section-two .owl-carousel{ margin:0px -10px; width:auto; } .clients-section-two .inner-container{ position:relative; } .clients-section-two .sponsors-outer .owl-dots, .clients-section-two .sponsors-outer .owl-nav{ position:relative; display:none; } .clients-section-two .sponsors-outer .image-box{ position:relative; text-align:center; border-radius:8px; background-color:var(--white-color); box-shadow:0px 0px 15px rgba(0,0,0,0.15); } .clients-section-two .sponsors-outer .image-box img{ max-width:100%; width:auto; display:inline-block; -webkit-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; -moz-transition:all 300ms ease; transition:all 300ms ease; } .clients-section-two .sponsors-outer .image-box img:hover{ opacity:0.7; -webkit-filter: grayscale(100%); filter: grayscale(100%); } /*** ==================================================================== Projects Section Three ==================================================================== ***/ .projects-section-three{ position:relative; margin-top:-85px; overflow:hidden; padding:170px 0px 100px; background-position:left bottom; background-repeat:no-repeat; background-color:var(--main-color-two); } .projects-section-three .lower-text{ position:relative; text-align:center; font-size:var(--font-16); color:var(--white-color); margin-top:var(--margin-top-30); } .projects-section-three .lower-text a{ position:relative; text-align:center; font-weight:700; color:var(--main-color); text-decoration:underline; } .projects-section-three .lower-text a:hover{ color:var(--white-color); } .projects-section-three .owl-carousel .owl-stage-outer{ overflow:visible; } .projects-section-three .owl-dots{ display:none; } .projects-section-three .owl-nav{ position:absolute; left:15px; top:50%; right:15px; z-index:10; margin-top:-40px; transition:all 0.3s ease; -moz-transition:all 0.3s ease; -webkit-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; } .projects-section-three .owl-nav .owl-prev{ position:absolute; left:0px; width:50px; height:50px; color:var(--main-color); font-size:var(--font-24); line-height:46px; text-align:center; border-radius:6px; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; background-color:var(--white-color); } .projects-section-three .owl-nav .owl-next{ position:absolute; right:0px; color:var(--main-color); font-size:var(--font-24); width:50px; height:50px; line-height:50px; border-radius:6px; text-align:center; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; background-color:var(--white-color); } .projects-section-three .owl-nav .owl-prev:hover, .projects-section-three .owl-nav .owl-next:hover{ background-color:var(--main-color); color:var(--white-color); } .gallery-block-three{ position:relative; margin-bottom:var(--margin-bottom-30); } .gallery-block-three .inner-box{ position:relative; } .gallery-block-three .inner-box .image{ position:relative; border-radius:8px; overflow:hidden; background-color:var(--main-color-two); } .gallery-block-three .inner-box .image img{ position:relative; width:100%; display:block; overflow:hidden; border-radius:5px; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .gallery-block-three .inner-box:hover .image img{ opacity:0.60; transform:scale(1.05,1.05); } .gallery-block-three .inner-box .image:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:0px; opacity:0.60; z-index:1; background-color:#00181e; } .gallery-block-three .inner-box .overlay-content{ position:absolute; left:50px; bottom:50px; right:50px; z-index:2; } .gallery-block-three .inner-box h4{ position:relative; } .gallery-block-three .inner-box h4 a{ position:relative; color:var(--white-color); transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .gallery-block-three .inner-box h4 a:hover{ color:var(--main-color); } .gallery-block-three .inner-box .designation{ position:relative; font-weight:700; font-size: var(--font-16); color:var(--main-color); margin-top:var(--margin-top-15); } .gallery-block-three .inner-box .designation span{ position:relative; font-weight:400; color:var(--main-color); } .gallery-block-three .inner-box .plus{ position:absolute; right:0px; top:5px; width:50px; height:50px; line-height:50px; border-radius:5px; text-align:center; font-size:var(--font-20); color:var(--main-color-two); background-color:var(--main-color); } .gallery-block-three .inner-box .plus:hover{ color:var(--main-color); background-color:var(--white-color); } /*** ==================================================================== Projects Section Three ==================================================================== ***/ .faq-section{ position:relative; padding:100px 0px 70px; } .faq-section .left-image{ position:absolute; left:0px; bottom:0px; } .faq-section .right-image{ position:absolute; right:0px; bottom:0px; } .faq-section .accordion-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .faq-section .accordion-column .inner-column{ position:relative; } /*** ==================================================================== Accordion Style ==================================================================== ***/ .accordion-box{ position:relative; } .accordion-box .heading{ position:relative; color:#000000; font-size:28px; font-weight:600; margin-bottom:45px; } .accordion-box .block{ position: relative; padding:0px 0px 10px 0px; margin-bottom:20px; border-bottom:1px solid rgba(0,0,0,0.10); } .accordion-box .block .number{ position:relative; color:var(--main-color-two); font-size:var(--font-18); } .accordion-box .block:last-child{ } .accordion-box .block .acc-btn{ font-size:var(--font-18); position:relative; cursor:pointer; line-height:30px; color:var(--main-color-two); font-weight:700; padding-left:var(--padding-left-40); padding-bottom:var(--padding-bottom-10); transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; text-transform:capitalize; } .accordion-box .block .icon-outer{ position:absolute; left:0px; top:0px; font-size:var(--font-18); color:var(--main-color-two); transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .accordion-box .block .icon-outer .icon{ position: absolute; left:0px; top: 0px; font-size:var(--font-18); color:var(--main-color-two); transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .accordion-box .block .icon-outer .icon-plus{ opacity:1; } .accordion-box .block .icon-outer .icon-minus{ opacity:0; color:var(--main-color-two); font-weight:400; } .accordion-box .block .acc-btn.active .icon-outer .icon-minus{ opacity:1; } .accordion-box .block .acc-btn.active .icon-outer .icon-plus{ opacity:0; } .accordion-box .block .acc-btn.active .icon-outer{ border-color:#ff3548; color:#ff3548; } .accordion-box .block .acc-content{ position:relative; display:none; } .accordion-box .block .acc-content .content-text{ } .accordion-box .block .acc-content.current{ display:block; } .accordion-box .block .content{ position:relative; font-size:var(--font-16); padding:5px 0px 10px 0px; } .accordion-box .block .content .text p{ margin-bottom:0px; line-height:1.7em; font-size:var(--font-16); color:var(--main-color-two); } .accordion-box .block .content p:last-child{ margin-bottom:var(--margin-zero); } .faq-section .blocks-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .faq-section .blocks-column .inner-column{ position:relative; } .faq-section .blocks-column .feature-block-three:nth-child(1), .faq-section .blocks-column .feature-block-three:nth-child(3){ transform:translateY(60px); } .feature-block-three{ position:relative; margin-bottom:var(--margin-bottom-30); } .feature-block-three .inner-box{ position:relative; padding:50px 25px; border-radius:10px; text-align:center; background-color:var(--white-color); box-shadow:0px 0px 15px rgba(0,0,0,0.10); } .feature-block-three .inner-box .block-number{ position:absolute; left:40px; bottom:10px; line-height:1em; color:#e2e2e2; font-weight:800; opacity:0.50; font-size:var(--font-150); } .feature-block-three .inner-box .icon{ position:relative; line-height:1em; display:inline-block; color:var(--main-color); font-size:var(--font-60); transition: all 600ms ease; -moz-transition: all 600ms ease; -webkit-transition: all 600ms ease; -ms-transition: all 600ms ease; -o-transition: all 600ms ease; } .feature-block-three .inner-box:hover .icon{ -webkit-transform: scale(-1) rotate(180deg); -moz-transform: scale(-1) rotate(180deg); -ms-transform: scale(-1) rotate(180deg); -o-transform: scale(-1) rotate(180deg); transform: scale(-1) rotate(180deg); } .feature-block-three .inner-box h5{ position:relative; font-weight:700; text-transform:uppercase; margin-top:var(--margin-top-10); } .feature-block-three .inner-box h5 a{ position:relative; color:var(--main-color-two); } .feature-block-three .inner-box h5 a:hover{ color:var(--main-color); } /*** ==================================================================== Shop Section ==================================================================== ***/ .shop-section{ position:relative; padding:100px 0px 100px; } .shop-block{ position:relative; margin-bottom:var(--margin-bottom-30); } .shop-block .inner-box{ position:relative; } .shop-block .inner-box .image{ position:relative; border-radius:7px; overflow:hidden; background-color:#f4f4f4; } .shop-block .inner-box .image img{ position:relative; width:100%; display:block; } .shop-block .inner-box .new-tag{ position:absolute; left:20px; top:20px; padding:7px 16px 4px; border-radius:5px 5px 0px 5px; font-weight:700; text-transform:uppercase; background-color:var(--main-color); } .shop-block .inner-box .new-tag:before{ position:absolute; content:''; right:0px; bottom:-10px; border-top: 15px solid var(--main-color); border-left: 15px solid transparent; } .shop-block .inner-box .lower-content{ position:relative; text-align:center; padding-top:var(--padding-top-25); } .shop-block .inner-box .price{ position:relative; font-weight:700; font-size:var(--font-20); color:var(--main-color); } .shop-block .inner-box .price span{ position:relative; font-size:var(--font-16); text-decoration:line-through; color:var(--main-color-two); } .shop-block .inner-box h5{ margin-top:var(--margin-top-15); } .shop-block .inner-box h5 a{ color:var(--main-color-two); } .shop-block .inner-box h5 a:hover{ color:var(--main-color); } .shop-block .inner-box .sub-title{ position:relative; opacity:0.80; font-size:var(--font-16); color:var(--main-color-two); margin-top:var(--margin-top-10); } /*** ==================================================================== Testimonial Section ==================================================================== ***/ .testimonial-section-two{ position:relative; z-index:1; padding:100px 0px 100px; background-attachment:fixed; background-size:cover; } .testimonial-section-two:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:0px; opacity:0.70; background-color:var(--main-color-two); } .testimonial-section-two .inner-container{ position:relative; max-width:950px; margin:0 auto; } .testimonial-section-two .owl-dots{ display:none; } .testimonial-section-two .owl-nav{ position:absolute; left:15px; top:55%; right:15px; z-index:10; transition:all 0.3s ease; -moz-transition:all 0.3s ease; -webkit-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; } .testimonial-section-two .owl-nav .owl-prev{ position:absolute; left:0px; width:50px; height:50px; color:var(--main-color); font-size:var(--font-24); line-height:46px; text-align:center; border-radius:6px; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; background-color:var(--white-color); } .testimonial-section-two .owl-nav .owl-next{ position:absolute; right:0px; color:var(--main-color); font-size:var(--font-24); width:50px; height:50px; line-height:50px; border-radius:6px; text-align:center; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; background-color:var(--white-color); } .testimonial-section-two .owl-nav .owl-prev:hover, .testimonial-section-two .owl-nav .owl-next:hover{ background-color:var(--main-color); color:var(--white-color); } .testimonial-block-two{ position:relative; } .testimonial-block-two .inner-box{ position:relative; text-align:center; } .testimonial-block-two .inner-box .author-image{ position:relative; width:157px; height:157px; overflow:hidden; border-radius:50%; display:inline-block; } .testimonial-block-two .inner-box .text{ position:relative; color:var(--white-color); font-size:var(--font-18); padding:0px 120px; line-height:1.7em; margin-top:var(--margin-top-20); margin-bottom:var(--margin-bottom-20); } .testimonial-block-two .inner-box h5{ color:var(--white-color); margin-bottom:var(--margin-bottom-10); } .testimonial-block-two .inner-box .designation{ position:relative; color:var(--main-color); font-size:var(--font-16); } /*** ==================================================================== CTA Section ==================================================================== ***/ .cta-section{ position:relative; padding:60px 0px 30px; background-color:var(--main-color); } .cta-section.style-two{ position:relative; padding:var(--padding-zero); background:none; z-index:10; } .cta-section.style-two .inner-container{ margin-top:-96px; border-radius:8px; padding:60px 20px 25px 70px; background-color:var(--main-color); box-shadow:0px 0px 15px rgba(0,0,0,0.10); } .cta-section .title-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .cta-section .title-column .inner-column{ position:relative; } .cta-section .title-column h3{ color:var(--main-color-two); } .cta-section .title-column .text{ font-size:var(--font-16); color:var(--main-color-two); margin-top:var(--margin-top-10); } .cta-section .info-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .cta-section .info-column .inner-column{ position:relative; } .cta-section .info-column .phone-box{ position:relative; float:left; z-index:2; font-weight:500; font-size:var(--font-15); color:var(--main-color-two); padding-left:var(--padding-left-70); } .cta-section .info-column .phone-box a{ position:relative; font-weight:800; display:inline-block; font-size:var(--font-22); color:var(--main-color-two); margin-top:var(--margin-top-10); } .cta-section .info-column .phone-box .icon{ position:absolute; left:0px; top:0px; width:60px; height:60px; text-align:center; line-height:60px; border-radius:60px; font-size:var(--font-26); color:var(--main-color-two); background-color:var(--white-color); } .cta-section .info-column .phone-box .or{ position:absolute; right:-60px; width:40px; height:40px; bottom:0px; text-align:center; border-radius:50px; line-height:40px; font-weight:700; display:inline-block; font-size:var(--font-14); text-transform:uppercase; color:var(--white-color); background-color:var(--main-color-two); } .cta-section .info-column .button-box{ position:relative; float:left; z-index:2; margin-left:var(--margin-left-80); } /*** ==================================================================== Main Slider Section Four ==================================================================== ***/ .main-slider-four{ position:relative; overflow:hidden; } .main-slider-four .slide{ position:relative; overflow:hidden; padding:200px 0px 255px; background-size:cover; background-position:center right; } .main-slider-four .slide:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:0px; opacity:0.50; background-color:var(--black-color); } .main-slider-four .content-column{ position:relative; } .main-slider-four .content-column .inner-column{ position:relative; text-align:center; } .main-slider-four .content-column .big-text{ position:absolute; left:0px; top:0px; } .main-slider-four .play-box{ position:relative; opacity: 0; transform: scaleY(0); transform-origin: top; color:var(--white-color); font-size:var(--font-18); text-transform:uppercase; margin-bottom: var(--margin-bottom-20); -webkit-transition: all 1000ms ease; -moz-transition: all 100ms ease; -ms-transition: all 1000ms ease; -o-transition: all 1000ms ease; transition: all 1000ms ease; } .main-slider-four .active .play-box{ opacity: 1; transform: scaleY(1); -webkit-transition-delay: 150ms; -moz-transition-delay: 150ms; -ms-transition-delay: 150ms; -o-transition-delay: 150ms; transition-delay: 150ms; } .main-slider-four .play-box .play-button span{ position: relative; width:100px; height:100px; text-align:center; line-height:100px; border-radius:50%; display:inline-block; color:var(--white-color); font-size:var(--font-28); -webkit-transition: all 600ms ease; -moz-transition: all 600ms ease; -ms-transition: all 600ms ease; -o-transition: all 600ms ease; transition: all 600ms ease; background-color:var(--main-color); } .main-slider-four .play-box .play-button span:hover{ color:var(--white-color); background-color:var(--main-color); } .main-slider-four .play-box .play-button .ripple, .main-slider-four .play-box .play-button .ripple:before, .main-slider-four .play-box .play-button .ripple:after { position: absolute; top: 50%; left: 50%; width:100px; height:100px; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); -ms-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); -o-box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); box-shadow: 0 0 0 0 rgba(255, 255, 255, .6); -webkit-animation: ripple 3s infinite; -moz-animation: ripple 3s infinite; -ms-animation: ripple 3s infinite; -o-animation: ripple 3s infinite; animation: ripple 3s infinite; } .main-slider-four .play-box .play-button .ripple:before { -webkit-animation-delay: .9s; -moz-animation-delay: .9s; -ms-animation-delay: .9s; -o-animation-delay: .9s; animation-delay: .9s; content: ""; position: absolute; } .main-slider-four .play-box .play-button .ripple:after { -webkit-animation-delay: .6s; -moz-animation-delay: .6s; -ms-animation-delay: .6s; -o-animation-delay: .6s; animation-delay: .6s; content: ""; position: absolute; } .main-slider-four h1{ color:var(--white-color); opacity: 0; transform: scaleY(0); transform-origin: top; -webkit-transition: all 1000ms ease; -moz-transition: all 100ms ease; -ms-transition: all 1000ms ease; -o-transition: all 1000ms ease; transition: all 1000ms ease; margin-bottom:var(--margin-bottom-20); } .main-slider-four h1 span{ color:var(--main-color); display:block; font-weight:400; font-size:var(--font-24); } .main-slider-four .active h1{ opacity: 1; transform: scaleY(1); -webkit-transition-delay: 600ms; -moz-transition-delay: 600ms; -ms-transition-delay: 600ms; -o-transition-delay: 600ms; transition-delay: 600ms; } .main-slider-four .text{ font-weight: 400; opacity: 0; line-height:1.8em; transform: scaleY(0); transform-origin: top; color:var(--white-color); font-size:var(--font-18); margin-bottom: var(--margin-bottom-35); -webkit-transition: all 1000ms ease; -moz-transition: all 100ms ease; -ms-transition: all 1000ms ease; -o-transition: all 1000ms ease; transition: all 1000ms ease; } .main-slider-four .active .text{ opacity: 1; transform: scaleY(1); -webkit-transition-delay: 900ms; -moz-transition-delay: 900ms; -ms-transition-delay: 900ms; -o-transition-delay: 900ms; transition-delay: 900ms; } .main-slider-four .btns-box{ opacity:0; transform: scaleY(0); transform-origin: top; display:inline-block; -webkit-transition: all 900ms ease; -moz-transition: all 900ms ease; -ms-transition: all 900ms ease; -o-transition: all 900ms ease; transition: all 900ms ease; } .main-slider-four .active .btns-box{ opacity: 1; transform: scaleY(1); -webkit-transition-delay: 1200ms; -moz-transition-delay: 1200ms; -ms-transition-delay: 1200ms; -o-transition-delay: 1200ms; transition-delay: 1200ms; } .main-slider-four .owl-dots{ display:none; } .main-slider-four .owl-nav{ position:absolute; left:30px; top:50%; right:30px; z-index:10; margin-top:0px; transition:all 0.3s ease; -moz-transition:all 0.3s ease; -webkit-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; } .main-slider-four .owl-nav .owl-prev{ position:absolute; left:0px; width:50px; height:50px; color:var(--main-color); font-size:var(--font-24); line-height:46px; text-align:center; border-radius:0px; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; background-color:var(--white-color); } .main-slider-four .owl-nav .owl-next{ position:absolute; right:0px; color:var(--main-color); font-size:var(--font-24); width:50px; height:50px; line-height:50px; border-radius:0px; text-align:center; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; background-color:var(--white-color); } .main-slider-four .owl-nav .owl-prev:hover, .main-slider-four .owl-nav .owl-next:hover{ background-color:var(--main-color); color:var(--white-color); } /*** ==================================================================== Construction Section ==================================================================== ***/ .construction-section{ position:relative; padding:80px 0px 50px; background-color:var(--main-color); } .construction-section .side-image{ position:absolute; left:0px; bottom:0px; } .construction-block{ position:relative; margin-bottom:var(--margin-bottom-30); } .construction-block .inner-box{ position:relative; border-radius:8px; overflow:hidden; } .construction-block .inner-box .image{ position:relative; } .construction-block .inner-box .image img{ position:relative; width:100%; display:block; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .construction-block .inner-box:hover .image img{ transform:scale(1.07,1.07); } .construction-block .inner-box .overlay-box{ position:absolute; left:0px; top:0px; width:100%; height:100%; } .construction-block .inner-box .overlay-box:before{ position:absolute; content:''; left:0px; top:0px; width:100%; height:100%; opacity:0.50; background-color: #00050c; } .construction-block .inner-box .overlay-inner{ position:absolute; left:0px; top:0px; width:100%; height:100%; display:table; vertical-align:middle; padding:10px 40px; } .construction-block .inner-box .overlay-inner .content{ position:relative; display:table-cell; vertical-align:middle; } .construction-block .inner-box .years{ position:relative; font-weight:700; font-size:var(--font-24); color:var(--white-color); text-transform:uppercase; } .construction-block .inner-box h2{ font-weight:400; line-height:1em; margin-top:var(--margin-top-15); } .construction-block .inner-box h2 a{ color:var(--main-color); transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .construction-block .inner-box .read-more:hover, .construction-block .inner-box h2 a:hover{ color:var(--white-color); } .construction-block .inner-box .read-more{ position:relative; font-weight:700; display:inline-block; color:var(--main-color); font-size:var(--font-14); text-transform:uppercase; margin-top:var(--margin-top-20); padding-left:var(--padding-left-25); padding-right:var(--padding-right-25); font-family: 'Nunito Sans', sans-serif; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .construction-block .inner-box .read-more:before{ position:absolute; content:''; left:0px; top:4px; width:10px; height:10px; background-color:var(--main-color); } .construction-block .inner-box .read-more .arrow{ position:absolute; right:0px; top:-1px; font-size:var(--font-16); } /*** ==================================================================== Since Section ==================================================================== ***/ .since-section{ position:relative; padding:100px 0px 320px; background-position:left bottom; background-repeat:no-repeat; } .since-section .title-column{ position:relative; margin-bottom:30px; } .since-section .title-column .inner-column{ position:relative; } .since-section .title-column .title-box{ position:relative; } .since-section .title-column .title-box .title{ position: relative; line-height: 1.7em; font-size: var(--font-18); color: var(--text-color); font-family: var(--font-family-rubik); } .since-section .title-column .title-box h2{ color:var(--main-color-two); font-weight:700; margin-top:var(--margin-top-15); } .since-section .title-column .title-box h2 span{ font-weight:400; color:var(--main-color); } .since-section .title-column .button-box{ margin-top:var(--margin-top-40); } .since-section .content-column{ position:relative; margin-bottom:30px; } .since-section .content-column .inner-column{ position:relative; } .since-section .content-column .text{ position:relative; margin-bottom:var(--margin-bottom-30); } .since-section .content-column .text p:last-child{ margin-bottom:var(--margin-zero); } /*** ==================================================================== Services Section Four ==================================================================== ***/ .services-section-four{ position:relative; margin-top:-250px; padding:0px 0px 100px; background-position:right bottom; background-repeat:no-repeat; } .services-section-four.style-two{ padding-top:var(--padding-top-100); margin-top:var(--margin-zero); } .services-section-four .lower-text{ position:relative; text-align:center; margin-top:20px; } .services-section-four .lower-text .text{ position:relative; font-size:var(--font-18); color:var(--white-color); } .services-section-four .lower-text .text a{ position:relative; font-weight:700; color:var(--main-color); text-decoration:underline; } .services-section-four .lower-text .text a:hover{ color:var(--white-color); } .services-section-four:before{ position:absolute; content:''; left:0px; bottom:0px; right:0px; height:767px; z-index:-1; background-color:var(--main-color-two); } .service-block-three{ position:relative; margin-bottom:var(--margin-bottom-30); } .service-block-three .inner-box{ position:relative; overflow:hidden; border-radius:0px 0px 0px 20px; } .service-block-three .inner-box .image{ position:relative; border-radius:12px; overflow:hidden; background-color:var(--main-color-two); } .service-block-three .inner-box .image img{ position:relative; width:100%; display:block; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .service-block-three .inner-box:hover .image img{ opacity:0.50; transform:scale(1.05,1.05); } .service-block-three .inner-box .lower-content{ position:relative; margin-top:-40px; display:inline-block; padding:25px 40px 32px 25px; } .service-block-three .inner-box .lower-content:before{ position:absolute; content:''; right:0px; top:0px; bottom:0px; left:-40px; transform:skew(-15deg); background-color:var(--main-color); } .service-block-three .inner-box .lower-content .content{ position:relative; padding-left:var(--padding-left-70); } .service-block-three .inner-box .lower-content .icon{ position:absolute; left:0px; top:10px; line-height:1em; font-size:var(--font-50); color:var(--white-color); } .service-block-three .inner-box .lower-content h5{ position:relative; } .service-block-three .inner-box .lower-content h5 a{ position:relative; color:var(--main-color-two); } /*** ==================================================================== Clients Section Three ==================================================================== ***/ .clients-section-three{ position:relative; padding:60px 0px 40px; } .clients-section-three .inner-container{ position:relative; } .clients-section-three .sponsors-outer .owl-dots, .clients-section-three .sponsors-outer .owl-nav{ position:relative; display:none; } .clients-section-three .sponsors-outer .image-box{ position:relative; text-align:center; } .clients-section-three .sponsors-outer .image-box img{ max-width:100%; width:auto; display:inline-block; -webkit-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; -moz-transition:all 300ms ease; transition:all 300ms ease; } .clients-section-three .sponsors-outer .image-box img:hover{ opacity:0.7; -webkit-filter: grayscale(100%); filter: grayscale(100%); } /*** ==================================================================== Fluid Section One ==================================================================== ***/ .fluid-section-one{ position:relative; } .fluid-section-one .outer-container{ position:relative; min-height:250px; background-color:#f5f5f5; } .fluid-section-one .image-column{ position:absolute; right:0px; top:0px; width:50%; height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover; } .fluid-section-one .image-column .image-box{ position:relative; display:none; } .fluid-section-one .image-column .image-box img{ position:relative; display:block; width:100%; } .fluid-section-one .image-column:before{ position:absolute; content:''; left:0px; top:0px; width:100%; height:100%; opacity:0.50; background-color:var(--black-color); } .fluid-section-one .image-column .play-box{ position:absolute; left:60px; bottom:60px; z-index:1; } .fluid-section-one .image-column .play-box .box-inner{ position:relative; padding-left:var(--padding-left-150); } .fluid-section-one .image-column .play-box .video-box{ position:absolute; left:0px; top:0px; width:120px; height:120px; line-height:120px; text-align:center; border-radius:50%; padding-left:var(--padding-left-5); font-size:var(--font-34); display:inline-block; color:var(--white-color); background-color:var(--main-color); } .fluid-section-one .image-column .play-box .title{ position:relative; font-size:var(--font-18); color:var(--white-color); } .fluid-section-one .image-column .play-box h3{ color:var(--white-color); margin-top:var(--margin-top-10); } .fluid-section-one .content-column{ position:relative; float:left; width:50%; z-index:1; background-position:right bottom; background-repeat:no-repeat; } .fluid-section-one .content-column .inner-column{ position:relative; max-width:600px; width:100%; float:left; padding-right:var(--padding-right-15); padding-top:var(--padding-top-100); padding-left:var(--padding-left-100); padding-bottom:var(--padding-bottom-100); } /*** ==================================================================== Projects Section Four ==================================================================== ***/ .projects-section-four{ position:relative; padding:100px 0px 100px; } .projects-section-four .lower-text{ position:relative; text-align:center; font-size:var(--font-16); color:var(--text-color); margin-top:var(--margin-top-30); } .projects-section-four .lower-text a{ position:relative; text-align:center; font-weight:700; color:var(--main-color); text-decoration:underline; } .projects-section-four .lower-text a:hover{ color:var(--white-color); } .gallery-block-four{ position:relative; margin-bottom:var(--margin-bottom-30); } .gallery-block-four .inner-box{ position:relative; } .gallery-block-four .inner-box .image{ position:relative; border-radius:8px; overflow:hidden; background-color:var(--main-color-two); } .gallery-block-four .inner-box .image img{ position:relative; width:100%; display:block; overflow:hidden; border-radius:5px; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .gallery-block-four .inner-box:hover .image img{ opacity:0.60; transform:scale(1.05,1.05); } .gallery-block-four .inner-box:hover .overlay-content{ -webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); transform: scale(1, 1); -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; } .gallery-block-four .inner-box .overlay-content{ position:absolute; left:0px; top:0px; bottom:0px; right:0px; transition: -webkit-transform 0.4s ease; transition: transform 0.4s ease; transition: transform 0.4s ease,-webkit-transform 0.4s ease; -webkit-transform: scale(0, 1); -ms-transform: scale(0, 1); transform: scale(0, 1); -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; } .gallery-block-four .inner-box .overlay-content:before{ position:absolute; content:''; left:0px; top:0px; bottom:0px; right:0px; opacity:0.50; background-color:var(--black-color); } .gallery-block-four .inner-box .overlay-content .content{ position:absolute; left:25px; bottom:25px; right:25px; z-index:1; } .gallery-block-four .inner-box h4{ position:relative; } .gallery-block-four .inner-box h4 a{ position:relative; color:var(--white-color); transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .gallery-block-four .inner-box h4 a:hover{ color:var(--main-color); } .gallery-block-four .inner-box .designation{ position:relative; font-weight:700; font-size: var(--font-16); color:var(--main-color); margin-top:var(--margin-top-15); } .gallery-block-four .inner-box .designation span{ position:relative; font-weight:400; color:var(--main-color); } .gallery-block-four .inner-box .plus{ position:relative; width:50px; height:50px; line-height:50px; border-radius:5px; text-align:center; font-size:var(--font-20); color:var(--main-color-two); margin-bottom:var(--margin-bottom-20); background-color:var(--main-color); } .gallery-block-four .inner-box .plus:hover{ color:var(--main-color); background-color:var(--white-color); } /*** ==================================================================== Testimonial Section Three ==================================================================== ***/ .testimonial-section-three{ position:relative; z-index:1; padding:100px 0px 200px; background-attachment:fixed; background-size:cover; } .testimonial-section-three:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:0px; opacity:0.70; background-color:var(--main-color-two); } .testimonial-section-three .inner-container{ position:relative; } .testimonial-section-three .owl-dots{ display:none; } .testimonial-section-three .owl-nav{ position:absolute; left:-70px; top:42%; right:-70px; z-index:10; transition:all 0.3s ease; -moz-transition:all 0.3s ease; -webkit-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; } .testimonial-section-three .owl-nav .owl-prev{ position:absolute; left:0px; width:50px; height:50px; color:var(--main-color); font-size:var(--font-24); line-height:46px; text-align:center; border-radius:6px; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; background-color:var(--white-color); } .testimonial-section-three .owl-nav .owl-next{ position:absolute; right:0px; color:var(--main-color); font-size:var(--font-24); width:50px; height:50px; line-height:50px; border-radius:6px; text-align:center; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; background-color:var(--white-color); } .testimonial-section-three .owl-nav .owl-prev:hover, .testimonial-section-three .owl-nav .owl-next:hover{ background-color:var(--main-color); color:var(--white-color); } .testimonial-block-three{ position:relative; } .testimonial-block-three .inner-box{ position:relative; padding:50px 50px 50px 0px; } .testimonial-block-three .inner-box:before{ position:absolute; content:''; left:70px; top:0px; right:0px; bottom:0px; border-radius:6px; background-color:#0c2d62; } .testimonial-block-three .inner-box .content{ position:relative; padding-left:190px; } .testimonial-block-three .inner-box .author-image{ position:absolute; left:0px; top:0px; width:157px; height:157px; overflow:hidden; border-radius:50%; display:inline-block; } .testimonial-block-three .inner-box .text{ position:relative; color:var(--white-color); font-size:var(--font-18); line-height:1.7em; margin-bottom:var(--margin-bottom-20); } .testimonial-block-three .inner-box h4{ color:var(--white-color); margin-bottom:var(--margin-bottom-5); } .testimonial-block-three .inner-box .designation{ position:relative; color:var(--main-color); font-size:var(--font-16); } /*** ==================================================================== Team Section Two ==================================================================== ***/ .team-section-two{ position:relative; margin-top:-95px; padding:190px 0px 100px; background-color:#f4f4f4; background-position:center bottom; background-repeat:no-repeat; } .team-section-two.style-two{ margin:var(--margin-zero); padding:100px 0px 100px; background-color:#ffffff; } .team-block{ position:relative; margin-bottom:var(--margin-bottom-30); } .team-block .inner-box{ position:relative; } .team-block .inner-box .image{ position:relative; border-radius:6px; overflow:hidden; background-color:var(--main-color-two); } .team-block .inner-box .image img{ position:relative; width:100%; display:block; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .team-block .inner-box:hover .image img{ opacity:0.80; transform:scale(1.05,1.05); } .team-block .inner-box .lower-content{ position:relative; padding-top:25px; text-align:center; } .team-block .inner-box .lower-content h5{ position:relative; } .team-block .inner-box .lower-content h5 a{ position:relative; color:var(--main-color-two); } .team-block .inner-box .lower-content h5 a:hover{ color:var(--main-color); } .team-block .inner-box .lower-content .designation{ position:relative; color:var(--text-color); font-size:var(--font-16); margin-top:var(--margin-top-5); } .team-block .inner-box:hover .social-box{ bottom:20px; } .team-block .inner-box .social-box{ position:absolute; left:0px; bottom:-80px; right:0px; text-align:center; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .team-block .inner-box .social-box li{ position:relative; display:inline-block; margin-right:var(--margin-right-5); } .team-block .inner-box .social-box li a{ position:relative; width:48px; height:48px; border-radius:6px; text-align:center; line-height:48px; display:inline-block; font-size: var(--font-18); color: var(--main-color-two); background-color:var(--white-color); } .team-block .inner-box .social-box li a:hover{ color: var(--white-color); background-color: var(--main-color); } /*** ==================================================================== News Section Two ==================================================================== ***/ .news-section-two{ position:relative; padding:110px 0px 110px; } .news-section-two .title-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .news-section-two .title-column .inner-column{ position:relative; } .news-section-two .blocks-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .news-section-two .blocks-column .inner-column{ position:relative; } .news-block-four{ position:relative; margin-bottom:var(--margin-bottom-30); } .news-block-four .inner-box{ position:relative; background-color:var(--white-color); -webkit-transition:all 500ms ease; -moz-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; transition:all 500ms ease; box-shadow:0px 10px 30px rgba(0,0,0,0.08); } .news-block-four .inner-box:hover{ box-shadow:0px 0px 15px rgba(0,0,0,0.12); } .news-block-four .inner-box .image{ position:relative; overflow:hidden; } .news-block-four .inner-box .image:before{ position:absolute; content:''; left:0px; top:100%; right:0px; bottom:0px; z-index:1; opacity:0; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; background-image: -ms-linear-gradient(top, rgba(255,255,255,0) 0%, var(--main-color) 100%); background-image: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, var(--main-color) 100%); background-image: -o-linear-gradient(top, rgba(255,255,255,0) 0%, var(--main-color) 100%); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(255,255,255,0)), color-stop(100, var(--main-color))); background-image: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, var(--main-color) 100%); background-image: linear-gradient(to bottom, rgba(255,255,255,0) 0%, var(--main-color) 100%); } .news-block-four .inner-box:hover .image:before{ top:0%; opacity:1; } .news-block-four .inner-box .image img{ position:relative; width:100%; display:block; -webkit-transition:all 500ms ease; -moz-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; transition:all 500ms ease; } .news-block-four .inner-box:hover .image img{ transform:scale(1.05,1.05); } .news-block-four .inner-box .image .post-date{ position:absolute; left:0px; bottom:25px; z-index:1; color:var(--white-color); font-size:var(--font-14); font-weight:700; line-height:20px; display:inline-block; padding:7px 15px 6px 12px; background-color:var(--main-color-two); } .news-block-four .inner-box .image .post-date:before{ position:absolute; content:''; right:-15px; top:0px; bottom:0px; width:25px; height:33px; background-color:var(--main-color-two); clip-path: polygon(100% 0%, 63% 50%, 100% 100%, 0 100%, 0% 50%, 0 0); } .news-block-four .inner-box .image .post-date span{ position:relative; display:block; font-weight:300; } .news-block-four .inner-box .lower-content{ position:relative; padding:25px 25px; } .news-block-four .inner-box .lower-content .post-meta{ position:relative; padding-bottom:15px; border-bottom:1px solid #E6E6E6; } .news-block-four .inner-box .lower-content .post-meta li{ position:relative; font-weight:400; display:inline-block; font-weight:600; font-size:var(--font-14); color:var(--main-color-two); text-transform:uppercase; margin-right:var(--margin-right-10); padding-left:var(--padding-left-25); } .news-block-four .inner-box .lower-content .post-meta li .icon{ position:absolute; left:0px; top:0px; margin-right:var(--margin-right-5); } .news-block-four .inner-box .lower-content .post-meta li:last-child{ margin-right:var(--margin-zero); } .news-block-four .inner-box .lower-content h5{ margin-top:var(--margin-top-20); font-family: 'Poppins', sans-serif; } .news-block-four .inner-box .lower-content h5 a{ position:relative; color:var(--main-color-two); -webkit-transition:all 500ms ease; -moz-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; transition:all 500ms ease; } .news-block-four .inner-box .lower-content h5 a:hover{ color:var(--main-color); } .news-block-four .inner-box .text{ position:relative; margin-top:var(--margin-top-15); } .news-block-four .inner-box .more-detail{ position:relative; color:var(--main-color-two); font-size:var(--font-16); font-weight:700; margin-top:var(--margin-top-20); padding-right:var(--padding-right-20); display:inline-block; -webkit-transition:all 500ms ease; -moz-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; transition:all 500ms ease; } .news-block-four .inner-box .more-detail:before{ position:absolute; content: "\f061"; right:0px; top:1px; font-size:var(--font-15); font-family: 'FontAwesome'; } .news-block-four .inner-box .more-detail:hover{ color:var(--main-color); } /*** ==================================================================== Page Title ==================================================================== ***/ .page-title{ position:relative; overflow:hidden; } .page-title .content{ position:relative; text-align:center; padding:170px 0px 100px; background-size:cover; background-attachment:fixed; } .page-title .content:before{ position:absolute; content:''; left:0px; bottom:0px; top:0px; right:0px; opacity:0.50; background-color:var(--main-color-two); } .page-title .content h1{ color:var(--white-color); text-transform:capitalize; } .page-breadcrumb{ position:relative; padding:15px 0px; text-align:center; background-color:var(--main-color-two); } .page-breadcrumb li{ position:relative; font-weight:600; display:inline-block; color:var(--main-color); font-size:var(--font-18); text-transform:capitalize; margin-right:var(--margin-right-10); padding-right:var(--padding-right-20); } .page-breadcrumb li:after{ position:absolute; content: '\f061'; right:-3px; top:0px; color:var(--main-color); font-size:var(--font-12); font-family: 'FontAwesome'; } .page-breadcrumb li:last-child::after{ display: none; } .page-breadcrumb li:last-child{ padding-right:0px; margin-right:0px; } .page-breadcrumb li a{ font-weight:600; color:var(--white-color); text-transform: capitalize; transition:all 0.3s ease; -moz-transition:all 0.3s ease; -webkit-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; } .page-breadcrumb li a:hover{ color:var(--main-color); } /*** ==================================================================== Faq Page Section ==================================================================== ***/ .faq-page-section{ position:relative; padding:100px 0px 100px; } /*** ==================================================================== Faq Section ==================================================================== ***/ .faq-section-two{ position:relative; padding:100px 0px 70px; background-color:#f4f4f4; } .faq-section-two .accordion-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .faq-section-two .accordion-column .inner-column{ position:relative; padding-right:var(--padding-right-30); } .faq-section-two .image-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .faq-section-two .image-column .inner-column{ position:relative; } .faq-section-two .image-column .image{ position:relative; text-align:right; } .faq-section-two .image-column .image-two{ position:relative; margin-top:-60px; } .faq-section-two .image-column .border-layer{ position:absolute; left:60px; top:70px; width:190px; height:370px; border-radius:50px 0px 0px 0px; border:10px solid var(--main-color-two); } .faq-section-two .image-column .border-layer:before{ position:absolute; content:''; left:-6px; top:-6px; right:-6px; bottom:-6px; border-radius:50px 0px 0px 0px; border:2px dashed var(--white-color); } .faq-section-two .image-column .icon-outer{ position:absolute; right:80px; bottom:-120px; } .faq-section-two .image-column .icon-outer .icon{ position:relative; width:150px; height:150px; z-index:1; text-align:center; line-height:150px; color:var(--main-color); font-size:var(--font-80); background-color:var(--white-color); box-shadow:0px 0px 15px rgba(0,0,0,0.10); } .faq-section-two .image-column .icon-outer:before{ position:absolute; content:''; left:22px; bottom:-22px; width:150px; height:150px; z-index:-1; background:url(../images/background/10.html) no-repeat; } /*** ==================================================================== Faq's Form ==================================================================== ***/ .faq-form .form-group{ margin-bottom:20px; } .faq-form .form-group:last-child{ margin-bottom:0px; } .faq-form .form-group .text{ position:relative; font-size:var(--font-18); color:var(--white-color); margin-top:var(--margin-top-10); } .faq-form .form-group input[type="text"], .faq-form .form-group input[type="password"], .faq-form .form-group input[type="tel"], .faq-form .form-group input[type="email"], .faq-form .form-group select{ position:relative; display:block; width:100%; line-height:28px; padding:10px 25px; height:55px; border-radius:0px; font-size:var(--font-16); color:var(--main-color-two); background:var(--white-color); -webkit-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; -moz-transition:all 300ms ease; transition:all 300ms ease; border:1px solid transparent; } .faq-form .form-group input[type="text"]:focus, .faq-form .form-group input[type="password"]:focus, .faq-form .form-group input[type="tel"]:focus, .faq-form .form-group input[type="email"]:focus, .faq-form .form-group select:focus, .faq-form .form-group textarea:focus{ border-color:var(--main-color-two); } .faq-form .form-group textarea{ position:relative; display:block; width:100%; line-height:24px; padding:15px 25px 25px; font-size:var(--font-16); color:var(--main-color-two); height:180px; background:var(--white-color); resize:none; font-size:16px; border-radius:0px; -webkit-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; -moz-transition:all 300ms ease; transition:all 300ms ease; border:1px solid transparent; } .faq-form .theme-btn{ cursor:pointer; } /*** ==================================================================== Pricing Section ==================================================================== ***/ .pricing-section{ position:relative; overflow:hidden; padding:100px 0px 100px; background-position:right bottom; background-repeat:no-repeat; } .pricing-section .three-color-layer{ position:absolute; left:-240px; top:130px; transform:rotate(-15deg); } .pricing-section .three-color-layer .color-one{ position:absolute; left:0px; top:0px; width:290px; height:410px; z-index:2; border-radius:25px; background-color:var(--main-color-two); } .pricing-section .three-color-layer .color-two{ position:absolute; left:20px; top:20px; width:290px; height:410px; z-index:1; border-radius:25px; background-color:var(--main-color); } .pricing-section .three-color-layer .color-three{ position:absolute; left:40px; top:40px; width:290px; height:410px; border-radius:25px; background-color:#f2f2f2; } .pricing-section .circles-layer{ position:absolute; right:40px; width:440px; height:440px; bottom:-40px; border-radius:50%; border:1px solid #ebebeb; } .pricing-section .circles-layer .circle-one{ position:absolute; right:70px; top:70px; left:70px; bottom:70px; border-radius:50%; border:1px dashed var(--main-color); } .pricing-section .circles-layer .circle-two{ position:absolute; right:130px; top:130px; left:130px; bottom:130px; border-radius:50%; background-color:var(--main-color); } .pricing-section .circles-layer .pattern-layer{ position:absolute; left:80px; top:80px; width:221px; height:221px; border-radius:50%; } .price-block{ position:relative; } .price-block .inner-box{ position:relative; padding:50px 60px; overflow:hidden; background-color:var(--white-color); box-shadow:0px 0px 15px rgba(0,0,0,0.10); border-left:10px solid var(--main-color); -webkit-transition: all 600ms ease; -moz-transition: all 600ms ease; -ms-transition: all 600ms ease; -o-transition: all 600ms ease; transition: all 600ms ease; } .price-block .inner-box .hover-layer-one{ position:absolute; left:0px; top:0px; width:50%; height:100%; transform:scale(0,1); background-color:var(--main-color); -webkit-transition: all 600ms ease; -moz-transition: all 600ms ease; -ms-transition: all 600ms ease; -o-transition: all 600ms ease; transition: all 600ms ease; } .price-block .inner-box .hover-layer-two{ position:absolute; right:0px; top:0px; width:50%; height:100%; transform:scale(0,1); background-color:var(--main-color); -webkit-transition: all 600ms ease; -moz-transition: all 600ms ease; -ms-transition: all 600ms ease; -o-transition: all 600ms ease; transition: all 600ms ease; } .price-block.active .inner-box .hover-layer-one, .price-block .inner-box:hover .hover-layer-one{ transform:scale(1,1); } .price-block.active .inner-box .hover-layer-two, .price-block .inner-box:hover .hover-layer-two{ transform:scale(1,1); } .price-block .inner-box .curve-layer{ position:absolute; left:0px; top:-10px; height:55%; width:10px; transform: skewY(-40deg); background-color:var(--main-color-two); -webkit-transition: all 600ms ease; -moz-transition: all 600ms ease; -ms-transition: all 600ms ease; -o-transition: all 600ms ease; transition: all 600ms ease; } .price-block.active .inner-box .curve-layer, .price-block .inner-box:hover .curve-layer{ background-color:var(--white-color); } .price-block .inner-box .title{ position:relative; font-weight:700; font-size:var(--font-24); color:var(--main-color); text-transform:capitalize; font-family:var(--font-family-inter); margin-bottom:var(--margin-bottom-20); -webkit-transition: all 600ms ease; -moz-transition: all 600ms ease; -ms-transition: all 600ms ease; -o-transition: all 600ms ease; transition: all 600ms ease; } .price-block.active .inner-box, .price-block .inner-box:hover{ border-color:var(--main-color-two); } .price-block.active .inner-box .price span, .price-block.active .inner-box .price sup, .price-block.active .inner-box .title, .price-block.active .inner-box .price-list li:before, .price-block .inner-box:hover .price span, .price-block .inner-box:hover .price sup, .price-block .inner-box:hover .title, .price-block .inner-box:hover .price-list li:before{ color:var(--white-color); } .price-block .inner-box .price{ position:relative; font-weight:700; line-height:1em; font-size:var(--font-72); color:var(--main-color-two); font-family:var(--font-family-inter); } .price-block .inner-box .price sup{ position:relative; top:-25px; font-size:var(--font-34); -webkit-transition: all 600ms ease; -moz-transition: all 600ms ease; -ms-transition: all 600ms ease; -o-transition: all 600ms ease; transition: all 600ms ease; } .price-block .inner-box .price span{ position:relative; margin-left:-45px; display:inline-block; line-height:1em; color:var(--main-color); font-size:var(--font-18); top:20px; -webkit-transition: all 600ms ease; -moz-transition: all 600ms ease; -ms-transition: all 600ms ease; -o-transition: all 600ms ease; transition: all 600ms ease; } .price-block .inner-box .price-list{ position:relative; margin-top:var(--margin-top-50); } .price-block .inner-box .price-list li{ position:relative; font-weight:600; font-size:var(--font-16); color:var(--text-color); padding-left:var(--padding-left-30); margin-bottom:var(--margin-bottom-15); } .price-block .inner-box .price-list li:before{ position:absolute; content: "\f1c5"; left:0px; top:0px; font-weight:400; color:var(--main-color); font-family: "flaticon"; -webkit-transition: all 600ms ease; -moz-transition: all 600ms ease; -ms-transition: all 600ms ease; -o-transition: all 600ms ease; transition: all 600ms ease; } .price-block .inner-box .price-list li:last-child{ margin:var(--margin-zero); } .price-block .inner-box .button-box{ position:relative; margin-top:var(--margin-top-40); } /*** ==================================================================== Team Single Section ==================================================================== ***/ .team-single-section{ position:relative; padding-top:var(--padding-top-100); padding-bottom:var(--padding-bottom-60); } .team-single-section .image-column{ position:relative; margin-bottom:var(--margin-bottom-40); } .team-single-section .image-column .inner-column{ position:relative; } .team-single-section .image-column .image{ position:relative; border-radius:5px; overflow:hidden; } .team-single-section .image-column .image img{ position:relative; width:100%; display:block; } .team-single-section .content-column{ position:relative; margin-bottom:var(--margin-bottom-40); } .team-single-section .content-column .inner-column{ position:relative; padding-left:var(--padding-left-20); } .team-single-section .content-column h3{ color:#222222; } .team-single-section .content-column h3 span{ position:relative; top:-3px; color:var(--white-color); font-size:var(--font-16); padding:8px 28px 6px; border-radius:2px; margin-left:var(--margin-left-15); background-color:var(--main-color); } .team-single-section .content-column .post-meta{ position:relative; margin-top:15px; margin-bottom:10px; } .team-single-section .content-column .post-meta li{ position:relative; font-weight:500; display:inline-block; color:var(--black-color); font-size:var(--font-16); margin-bottom:var(--margin-bottom-5); padding-left:var(--padding-left-30); margin-right:var(--margin-right-25); } .team-single-section .content-column .post-meta li .icon{ position:absolute; left:0px; top:1px; font-size:var(--font-16); } .team-single-section .content-column .post-meta li a{ position:relative; color:var(--black-color); } .team-single-section .content-column .text{ position:relative; margin-bottom:var(--margin-bottom-20); } .team-single-section .content-column .text p{ position:relative; font-weight:500; line-height:1.9em; color:var(--black-color); font-size:var(--font-16); margin-bottom:var(--margin-bottom-5); } .team-single-section .content-column .text p:last-child{ margin-bottom:0px; } .team-single-section .list-style-two li{ margin-bottom:var(--margin-bottom-10); } .team-single-section .social-box{ margin-top:var(--margin-top-10); } .team-single-section .social-box li{ position:relative; display:inline-block; margin-right:var(--margin-right-5); } .team-single-section .social-box li a{ position:relative; width:40px; height:40px; line-height:40px; text-align:center; color:var(--black-color); display:inline-block; border:1px solid var(--black-color); -webkit-transition:all 300ms ease; -moz-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; transition:all 300ms ease; } .team-single-section .social-box li a:hover{ background-color:var(--main-color); border-color:var(--main-color); color:var(--white-color); } /*** ==================================================================== Quote Section ==================================================================== ***/ .quote-section{ position:relative; background-color:#f5f5f5; padding-top:var(--padding-top-100); padding-bottom:var(--padding-bottom-60); background-position:left bottom; background-repeat:no-repeat; } .quote-section .title-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .quote-section .title-column .inner-column{ position:relative; } .quote-section .title-column .phone-box{ position:relative; font-weight:500; font-size:var(--font-15); color:var(--main-color-two); padding-left:var(--padding-left-70); } .quote-section .title-column .phone-box a{ position:relative; font-weight:800; display:inline-block; font-size:var(--font-22); color:var(--main-color-two); margin-top:var(--margin-top-10); } .quote-section .title-column .phone-box .icon{ position:absolute; left:0px; top:0px; width:60px; height:60px; text-align:center; line-height:60px; border-radius:60px; font-size:var(--font-26); color:var(--main-color-two); background-color:var(--main-color); } .quote-section .form-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .quote-section .form-column .inner-column{ position:relative; border-radius:6px; padding:60px 50px 40px; background-color:var(--main-color); background-position:left bottom; background-repeat:no-repeat; } .quote-section .form-column .title-box{ position:relative; margin-bottom:var(--margin-bottom-25); } .quote-section .form-column .title-box h3{ color:var(--main-color-two); text-transform:uppercase; } .quote-section .form-column .title-box .text{ color:var(--main-color-two); text-transform:capitalize; margin-top:var(--margin-top-10); } /*** ==================================================================== Testimonial Page Section ==================================================================== ***/ .testimonial-page-section{ position:relative; padding-top:var(--padding-top-100); padding-bottom:var(--padding-bottom-60); } .testimonial-block-four{ position:relative; margin-bottom:var(--margin-bottom-30); } .testimonial-block-four .inner-box{ position:relative; padding:30px 30px; background-color:var(--white-color); background-position:right bottom; background-repeat:no-repeat; box-shadow:0px 0px 15px rgba(0,0,0,0.05); } .testimonial-block-four .inner-box .quote{ position:absolute; right:40px; top:40px; color:var(--main-color-two); font-size:var(--font-100); line-height:1em; } .testimonial-block-four .inner-box .image{ position:relative; width:100px; height:100px; border-radius:50%; overflow:hidden; } .testimonial-block-four .inner-box .text{ position:relative; color:var(--main-color-two); font-size:var(--font-16); margin-top:var(--margin-top-20); line-height:1.7em; margin-bottom:var(--margin-bottom-20); } .testimonial-block-four .inner-box h6{ color:var(--main-color-two); text-transform:uppercase; } .testimonial-block-four .inner-box .designation{ position:relative; font-weight:700; margin-top:var(--margin-top-5); color:var(--main-color-two); font-size:var(--font-14); text-transform:uppercase; } /*** ==================================================================== Coming Soon ==================================================================== ***/ .coming-soon{ position:fixed; width:100%; height:100%; display:block; overflow-y:auto; background-repeat: no-repeat; background-position: center right; background-size: cover; text-align: center; } .coming-soon .content{ position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; display: table; vertical-align: middle; } .coming-soon .content:before{ position: absolute; left: 0; top: 0; height: 100%; width: 100%; background-color: var(--black-color); content: ""; opacity: .50; } .coming-soon .content .content-inner{ position: relative; padding: 90px 15px; display: table-cell; vertical-align: middle; } .coming-soon .content .content-inner .logo{ position:relative; margin-bottom: var(--margin-bottom-20); } .coming-soon .content .content-inner h2{ color: var(--white-color); margin-bottom: var(--margin-bottom-200); } .time-counter{ position:relative; } .time-counter .time-countdown{ position:relative; margin-bottom: var(--margin-bottom-150); } .time-counter .time-countdown .counter-column{ position:relative; display: inline-block; width:180px; height:180px; line-height: 1em; color:var(--white-color); text-transform:uppercase; font-size:var(--font-20); font-weight:600; text-align: center; z-index: 7; border-radius: 0px; box-shadow: 0 0 30px rgba(0,0,0,0.25); background-color: rgba(0,0,0,.80); margin:0 15px 20px; } .time-counter .time-countdown .counter-column .count{ position:relative; display:block; font-size:var(--font-70); line-height:30px; padding:60px 0px 30px; color:var(--white-color); font-weight:600; } .coming-soon .emailed-form{ position: relative; margin-bottom: var(--margin-bottom-40); } .coming-soon .emailed-form h3{ color:var(--white-color); margin-bottom: var(--margin-bottom-20); } .coming-soon .emailed-form .text{ display: block; color:var(--white-color); font-size: var(--font-18); margin-bottom: var(--margin-bottom-40); } .coming-soon .emailed-form .form-group{ position:relative; display:block; max-width:540px; width:100%; margin: 0 auto; } .coming-soon .emailed-form .form-group input[type="text"], .coming-soon .emailed-form .form-group input[type="tel"], .coming-soon .emailed-form .form-group input[type="email"], .coming-soon .emailed-form .form-group textarea{ position:relative; display:block; width:100%; line-height:28px; height:60px; color:var(--black-color); font-size: var(--font-16); overflow:hidden; padding:15px 50px 15px 20px; background: var(--white-color); border: 1px solid #f1f1f1; box-shadow: 0 0 13px rgba(0,0,0,0.10); -webkit-transition:all 300ms ease; -moz-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; transition:all 300ms ease; } .coming-soon .emailed-form .form-group input:focus, .coming-soon .emailed-form .form-group select:focus, .coming-soon .emailed-form .form-group textarea:focus{ border-color:var(--main-color);; } .coming-soon .emailed-form .form-group input[type="submit"], .coming-soon .emailed-form button{ position:absolute; right:0px; top:0px; width: 60px; height:60px; line-height:40px; font-size: var(--font-18); color: var(--main-color); background-color: transparent; -webkit-transition:all 300ms ease; -moz-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; transition:all 300ms ease; } .coming-soon .emailed-form .form-group input[type="submit"]:hover, .coming-soon .emailed-form button:hover{ color: var(--main-color-two); } .coming-soon .copyright-text{ position: relative; font-size: var(--font-18); line-height: 26px; color: var(--white-color); font-weight: 400; } .coming-soon .copyright-text a{ color: var(--main-color); } .coming-soon .copyright-text a:hover{ text-decoration: underline; } .clock-wrapper{ position: absolute; top: 50%; right: 0; left: 0; width: 250px; height: 250px; margin: auto; margin-top: -145px; border-radius: 50%; box-shadow: 0 0 20px rgba(0,0,0,0.05); background-color: rgba(0,0,0,.40); transform: scale(2); } .clock-base{ width: 250px; height: 250px; border-radius: 50%; } .click-indicator{ position: absolute; z-index: 1; top: 10px; left: 10px; width: 230px; height: 230px; } .click-indicator div{ position: absolute; width: 2px; height: 4px; margin: 113px 114px; } .click-indicator div > span{ height: 5px; width: 5px; background-color: var(--white-color); display: inline-block; border-radius: 50%; margin-left: -1px; margin-top: -1px; } .click-indicator div:nth-child(1) { transform: rotate(30deg) translateY(-120px); } .click-indicator div:nth-child(2) { transform: rotate(60deg) translateY(-120px); } .click-indicator div:nth-child(3) { transform: rotate(90deg) translateY(-120px); background-color: var(--main-color); } .click-indicator div:nth-child(4) { transform: rotate(120deg) translateY(-120px); } .click-indicator div:nth-child(5) { transform: rotate(150deg) translateY(-120px); } .click-indicator div:nth-child(6) { transform: rotate(180deg) translateY(-120px); background-color: var(--main-color); } .click-indicator div:nth-child(7) { transform: rotate(210deg) translateY(-120px); } .click-indicator div:nth-child(8) { transform: rotate(240deg) translateY(-120px); } .click-indicator div:nth-child(9) { transform: rotate(270deg) translateY(-120px); background-color: var(--main-color); } .click-indicator div:nth-child(10) { transform: rotate(300deg) translateY(-120px); } .click-indicator div:nth-child(11) { transform: rotate(330deg) translateY(-120px); } .click-indicator div:nth-child(12) { transform: rotate(360deg) translateY(-120px); background-color: var(--main-color); } .clock-hour{ position: absolute; z-index: 2; top: 75px; left: 123px; width: 4px; height: 65px; background-color: var(--main-color); border-radius: 2px; box-shadow: 0 0 2px rgba(0,0,0,.2); transform-origin: 2px 50px; transition: .5s; -webkit-animation: rotate-hour 43200s linear infinite; -moz-animation: rotate-hour 43200s linear infinite; } .clock-minute{ position: absolute; z-index: 3; top: 55px; left: 123px; width: 4px; height: 85px; background-color: var(--main-color); border-radius: 2px; box-shadow: 0 0 2px rgba(0,0,0,.2); transform-origin: 2px 70px; transition: .5s; -webkit-animation: rotate-minute 3600s linear infinite; -moz-animation: rotate-minute 3600s linear infinite; } .clock-second{ position: absolute; z-index: 4; top: 15px; left: 124px; width: 2px; height: 130px; background-color: var(--white-color); opacity: .9; box-shadow: 0 0 2px rgba(0,0,0,.2); transform-origin: 1px 110px; transition: .5s; -webkit-animation: rotate-second 60s linear infinite; -moz-animation: rotate-second 60s linear infinite; } .clock-second:after{ content: ""; display: block; position: absolute; left: -3px; bottom: 16px; width: 8px; height: 8px; background-color: var(--text-color); border: solid 2px var(--text-color); border-radius: 50%; box-shadow: 0 0 3px rgba(0,0,0,.2); } .clock-center{ position: absolute; z-index: 1; width: 150px; height: 150px; top: 50px; left: 50px; box-shadow: 0 0 3px rgba(0,0,0,.2); border-radius: 50%; } .clock-center:after{ content: ""; display: block; width: 20px; height: 20px; margin: 65px; background-color: var(--text-color); border-radius: 50%; } .coming-soon .social-box{ margin-top:var(--margin-top-10); } .coming-soon .social-box li{ position:relative; display:inline-block; margin-right:var(--margin-right-10); } .coming-soon .social-box li a{ position:relative; color:var(--white-color); width:40px; height:40px; line-height:40px; text-align:center; display:inline-block; border:1px solid var(--white-color); -webkit-transition:all 300ms ease; -moz-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; transition:all 300ms ease; } .coming-soon .social-box li a:hover{ background-color:var(--main-color); border-color:var(--main-color); color:var(--white-color); } /*** ==================================================================== Privacy Section ==================================================================== ***/ .privacy-section{ position:relative; padding:110px 0px 80px; } .privacy-section .pattern-layer{ position:absolute; top:50px; left:0px; width:100%; height:100%; background-repeat:no-repeat; background-position:right top; } .privacy-section .privacy-content{ position:relative; padding-bottom:15px; margin-bottom:25px; border-bottom:1px solid #e2e2e2; } .privacy-section .privacy-content:last-child{ padding-bottom:0px; margin-bottom:0px; border:none; } .privacy-section h2{ color:var(--main-color-two); margin-bottom:var(--margin-bottom-20); } .privacy-section p{ margin-bottom:var(--margin-bottom-15); } .privacy-section .date{ position:relative; font-weight:500; color:var(--main-color); font-size:var(--font-18); margin-bottom:var(--margin-bottom-15); } .privacy-section h4{ color:var(--main-color-two); margin-bottom:var(--margin-bottom-20); } .privacy-section .privacy-list{ position:relative; margin-left:var(--margin-left-20); } .privacy-section .privacy-list li{ position:relative; font-weight:400; padding-left:26px; line-height:1.7em; font-size:var(--font-18); color:var(--main-color-two); margin-bottom:var(--margin-bottom-10); } .privacy-section .privacy-list li:before{ position:absolute; content:''; left:0px; top:10px; width:7px; height:7px; border-radius:50px; background-color:var(--main-color-two); } /*** ==================================================================== Team Single Section Two ==================================================================== ***/ .team-single-section-two{ position:relative; padding:100px 0px 70px; } .team-single-section-two .color-layer{ position:absolute; left:0px; top:0px; right:0px; bottom:180px; background-color:#f5f5f5; background-position:center bottom; background-repeat:no-repeat; } .team-single-section-two .content-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .team-single-section-two .content-column .heart-icon{ position:absolute; right:50px; top:20px; font-size:var(--font-30); color:var(--main-color-two); } .team-single-section-two .content-column .inner-column{ position:relative; } .team-single-section-two .content-column .title{ position:relative; color:var(--main-color-two); font-size:var(--font-18); } .team-single-section-two .content-column h2{ margin-top:var(--margin-top-10); } .team-single-section-two .content-column .text{ margin-top:var(--margin-top-25); } .team-single-section-two .content-column .info-box{ position:relative; border:1px solid #dad8d8; margin-top:var(--margin-top-30); background-color:var(--white-color); } .team-single-section-two .content-column .info-box li{ position:relative; padding:25px 30px; font-weight:700; padding-left:var(--padding-left-100); color:var(--main-color-two); text-transform:uppercase; border-bottom:1px solid #dad8d8; } .team-single-section-two .content-column .info-box li:last-child{ border-bottom:var(--border-zero); } .team-single-section-two .content-column .info-box li i{ position:relative; display:block; color:#19697c; font-weight:700; font-style:normal; margin-top:var(--margin-top-5); text-transform:capitalize; } .team-single-section-two .content-column .info-box li .icon{ position:absolute; left:40px; top:25px; line-height:1em; font-weight:normal; font-size:var(--font-40); color:var(--main-color) } .team-single-section-two .content-column .social-links{ position:relative; margin-top:var(--margin-top-30); } .team-single-section-two .content-column .social-links a{ position:relative; display:inline-block; font-size:var(--font-16); width:42px; height:42px; line-height:42px; text-align:center; color:var(--white-color); background:#fc721e; margin-right:var(--margin-right-10); transition:all 0.5s ease; -moz-transition:all 0.5s ease; -webkit-transition:all 0.5s ease; -ms-transition:all 0.5s ease; -o-transition:all 0.5s ease; } .team-single-section-two .content-column .social-links a:hover{ opacity:0.80; } .team-single-section-two .content-column .social-links .facebook{ background:#3b5998; } .team-single-section-two .content-column .social-links .twitter{ background:#33ccfe; } .team-single-section-two .content-column .social-links .google-plus{ background:#dd4b39; } .team-single-section-two .image-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .team-single-section-two .image-column .inner-column{ position:relative; } .team-single-section-two .image-column .image{ position:relative; border-radius:8px; overflow:hidden; } .team-single-section-two .image-column .image img{ position:relative; width:100%; display:block; } .team-single-section-two .lower-section{ position:relative; margin-top:var(--margin-top-60); } .team-single-section-two .lower-section h3{ color:var(--main-color-two); margin-bottom:var(--margin-bottom-20); } .team-single-section-two .lower-section p{ margin-bottom:var(--margin-bottom-15); } /*** ==================================================================== Team Tabs ==================================================================== ***/ .team-tabs-two{ position:relative; overflow:hidden; margin-top:var(--margin-top-50); } .team-tabs-two .tab-btns{ position:relative; overflow:hidden; border-radius:12px 12px 0px 0px; background-color:var(--main-color); } .team-tabs-two .tab-btns .tab-btn{ position:relative; display:block; font-size:var(--font-18); color:var(--main-color-two); font-weight:600; line-height:24px; cursor:pointer; display:inline-block; padding:33px 50px; text-transform:uppercase; transition:all 500ms ease; font-family:var(--font-family-inter); } .team-tabs-two .tab-btns .tab-btn:hover, .team-tabs-two .tab-btns .tab-btn.active-btn{ color:var(--white-color); background-color:var(--main-color-two); } .team-tabs-two .tabs-content{ position:relative; padding:50px 55px; background-color:var(--white-color); border-radius:0px 0px 12px 12px; border:1px solid #dad8d8; border-top:0px; } .team-tabs-two .tabs-content .tab{ position:relative; display:none; } .team-tabs-two .tabs-content .tab.active-tab{ display:block; } .team-tabs-two .tabs-content h4{ margin-bottom:var(--margin-bottom-20); } /*** ==================================================================== Related Team Section ==================================================================== ***/ .related-team-section{ position:relative; padding:40px 0px 70px; } /*** ==================================================================== Sidebar Page Container ==================================================================== ***/ .sidebar-page-container{ position:relative; padding:100px 0px 80px; } .sidebar-page-container .content-side, .sidebar-page-container .sidebar-side{ margin-bottom:40px; } .service-detail{ position:relative; } .service-detail .inner-box{ position:relative; } .service-detail .upper-box{ position:relative; margin-bottom:var(--margin-bottom-40); } .service-detail .upper-box .icon{ position:absolute; left:0px; top:10px; line-height:1em; font-size:var(--font-58); color:var(--main-color); } .service-detail .upper-box .box-inner{ position:relative; padding-left:var(--padding-left-90); } .service-detail .upper-box .title{ position:relative; font-size:var(--font-16); color:var(--main-color-two); } .service-detail .upper-box h2{ margin-top:var(--margin-top-10); margin-bottom:var(--margin-bottom-20); } .service-detail .inner-box .image{ position:relative; border-radius:8px; overflow:hidden; margin-bottom:var(--margin-bottom-30); } .service-detail .inner-box .image img{ position:relative; width:100%; display:block; } .service-detail .inner-box h4{ margin-bottom:var(--margin-bottom-15); } .service-detail .inner-box p{ line-height:1.6em; font-size:var(--font-16); color:var(--main-color-two); margin-bottom:var(--margin-bottom-20); } .service-detail .inner-box .service-list{ position:relative; margin-bottom:var(--margin-bottom-20); } .service-detail .inner-box .service-list li{ position:relative; font-weight:600; font-size:var(--font-16); color:var(--main-color-two); margin-bottom:var(--margin-bottom-10); padding-left:var(--padding-left-30); } .service-detail .inner-box .service-list li:before{ position:absolute; content:'\f00c'; left:0px; top:0px; font-family: 'FontAwesome'; } .service-detail .inner-box .service-list li:last-child{ margin-bottom:var(--margin-zero); } .sticky-top{ top:90px; z-index:1; } .sidebar-widget{ margin-bottom:var(--margin-bottom-40); } /* Search Box Widget */ .sidebar .search-box{ padding:40px 40px; background-color:#f5f5f5; } .sidebar .search-box .form-group{ position:relative; margin:var(--margin-zero); } .sidebar .search-box .form-group input[type="text"], .sidebar .search-box .form-group input[type="search"]{ position:relative; line-height:28px; font-size:var(--font-16); padding:10px 50px 10px 25px; background:var(--white-color); display:block; width:100%; height:60px; border-radius:0px; font-weight:700; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .sidebar .search-box .form-group button{ position:absolute; right:0px; top:0px; height:60px; width:60px; display:block; cursor:pointer; line-height:100%; font-weight:normal; border-radius:0px; font-size:var(--font-18); color:var(--white-color); background:var(--main-color); transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .sidebar .search-box .form-group button:hover{ background:var(--main-color-two); } /* Sidebar Title */ .sidebar-title{ position:relative; margin-bottom:var(--margin-bottom-25); } .sidebar-title h4:before{ position:absolute; content:''; left:0px; bottom:0px; height:3px; width:40px; background-color:var(--main-color); } .sidebar-title h4:after{ position:absolute; content:''; left:44px; bottom:0px; height:3px; width:9px; border-left:3px solid var(--main-color-two); border-right:3px solid var(--main-color-two); } .sidebar-title h4{ padding-bottom:var(--padding-bottom-15); } .sidebar-widget .title-box{ position:relative; padding:20px 28px; border-radius:8px 8px 0px 0px; background-color:var(--main-color); } .categories-widget .title-box h4{ color:var(--main-color-two); } /* Blog Cat */ .blog-cat-two{ position:relative; padding:15px 30px 30px; border:6px solid #f3f3f3; border-top:none; border-radius:0px 0px 8px 8px; } .blog-cat-two li{ position:relative; padding:16px 0px; border-bottom:1px solid #dddddd; } .blog-cat-two li:last-child{ margin-bottom:var(--margin-zero); border-bottom:none; padding-bottom:var(--padding-zero); } .blog-cat-two li a{ position:relative; font-weight:700; display:block; font-size: var(--font-16); color:var(--main-color-two); padding-left: var(--padding-left-25); -webkit-transition:all 300ms ease; -moz-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; transition:all 300ms ease; } .blog-cat-two li a:before{ position:absolute; content:'\f101'; left:0px; top:3px; line-height:1em; font-family: 'FontAwesome'; } .blog-cat-two li a span{ position:absolute; right:0px; } .blog-cat-two li a:hover{ color:var(--main-color); } /* Quote Widget */ .quote-widget .widget-content{ position:relative; padding:40px 35px 25px; border-radius:0px 0px 12px 12px; overflow:hidden; background-size:cover; background-color:var(--main-color-two); } .quote-widget .title-box{ position:relative; text-align:center; } .quote-widget .title-box .title{ position:relative; font-size:var(--font-16); color:var(--white-color); } .quote-widget .title-box h3{ color:var(--main-color-two); margin-top:var(--padding-top-10); } /*** ==================================================================== Project Detail Section ==================================================================== ***/ .projects-detail-section{ position:relative; padding:100px 0px 100px; } .projects-detail-section .title-box{ position:relative; margin-bottom:var(--margin-bottom-30); } .projects-detail-section .title-box .title{ position:relative; color:#19697c; font-size:var(--font-18); } .projects-detail-section .title-box .pull-right{ padding-top:var(--padding-top-10); } .projects-detail-section .title-box h2{ margin-top:var(--margin-top-10); } .projects-detail-section .title-box .heart-icon{ position:relative; margin-right:20px; display:inline-block; font-size:var(--font-30); top:10px; } .projects-detail-section .info-box{ position:relative; border-radius:10px; border:1px solid #dad8d8; } .projects-detail-section .info-box .info-upper{ position:relative; border-bottom:1px solid #dad8d8; } .projects-detail-section .info-box .info-column{ position:relative; } .projects-detail-section .info-box .info-column .column-inner{ position:relative; padding:30px 35px; border-right:1px solid #dad8d8; } .projects-detail-section .info-box .info-column:last-child .column-inner{ border-right:0px;; } .projects-detail-section .info-box .info-column .text{ position:relative; color:#19697c; font-weight:600; } .projects-detail-section .info-box .info-column .text strong{ position:relative; display:block; font-weight:800; font-size:var(--font-14); color:var(--main-color-two); text-transform:uppercase; } .projects-detail-section .info-box .lower-info{ position:relative; padding:25px 35px; } .projects-detail-section .info-list{ position:relative; } .projects-detail-section .info-list li{ position:relative; color:#19697c; font-weight:600; display:inline-block; font-size:var(--font-16); margin-right:var(--margin-right-30); padding-right:var(--padding-right-30); } .projects-detail-section .info-list li span{ position:relative; font-weight:700; font-size:var(--font-16); text-transform:uppercase; color:var(--main-color-two); margin-right:var(--margin-right-5); } .projects-detail-section .info-box .social-box{ position: relative; } .projects-detail-section .info-box .social-box li{ position: relative; margin-left:var(--margin-left-15); display:inline-block; } .projects-detail-section .info-box .social-box .follow{ position:relative; font-weight:800; font-size:var(--font-16); color:var(--main-color-two); text-transform:uppercase; font-family:var(--font-family-fira); } .projects-detail-section .info-box .social-box li a{ position: relative; font-size:var(--font-18); color:var(--main-color-two); } .projects-detail-section .info-box .social-box li a:hover{ color:var(--main-color); } .projects-detail-section .main-image{ position:relative; border-radius:6px; overflow:hidden; margin-top:var(--margin-top-50); margin-bottom:var(--margin-bottom-50); } .projects-detail-section .main-image img{ position:relative; width:100%; display:block; } .projects-detail-section h3{ margin-bottom:var(--margin-bottom-20); } .projects-detail-section h4{ margin-bottom:var(--margin-bottom-20); } .projects-detail-section p{ color:var(--main-color-two); margin-bottom:var(--margin-bottom-15); } .projects-detail-section .image{ position:relative; border-radius:6px; overflow:hidden; margin-top:var(--margin-top-10); margin-bottom:var(--margin-bottom-30); } .projects-detail-section .image img{ position:relative; width:100%; display:block; } .projects-detail-section .project-list{ position:relative; margin-bottom:var(--margin-bottom-20); } .projects-detail-section .project-list li{ position:relative; font-weight:600; font-size:var(--font-16); color:var(--main-color-two); margin-bottom:var(--margin-bottom-10); padding-left:var(--padding-left-30); } .projects-detail-section .project-list li:before{ position:absolute; content:'\f00c'; left:0px; top:0px; font-family: 'FontAwesome'; } .projects-detail-section .project-list li:last-child{ margin-bottom:var(--margin-zero); } /* New Posts */ .new-posts{ position:relative; margin-top:var(--margin-top-30); } .new-posts .post-inner{ position:relative; padding:10px 12px; border-radius:8px; border:1px solid #dad8d8; } /* Prev Post */ .new-posts .prev-post{ position:relative; min-height:92px; padding-top:var(--padding-top-20); padding-left:var(--padding-left-120); } .new-posts .prev-post .post-image{ position:absolute; left:0px; top:0px; width:92px; height:92px; overflow:hidden; border-radius:8px; } .new-posts .prev-post .post-image:before{ position:absolute; content:''; left:0px; right:0px; top:0px; bottom:0px; opacity:0.50; background-color:var(--main-color-two); } .new-posts .prev-post h5{ margin-bottom:var(--margin-bottom-5); } .new-posts .prev-post h5 a{ position:relative; color:var(--main-color-two); } .new-posts .prev-post .post{ position:relative; font-weight:700; text-transform:uppercase; color:var(--main-color-two); } /* Next Post */ .new-posts .next-post{ position:relative; min-height:92px; text-align:right; padding-top:var(--padding-top-20); padding-right:var(--padding-left-120); } .new-posts .next-post .post-image{ position:absolute; right:0px; top:0px; width:92px; height:92px; overflow:hidden; border-radius:8px; } .new-posts .next-post .post-image:before{ position:absolute; content:''; left:0px; right:0px; top:0px; bottom:0px; opacity:0.50; background-color:var(--main-color-two); } .new-posts .next-post h5{ margin-bottom:var(--margin-bottom-5); } .new-posts .next-post h5 a{ position:relative; color:var(--main-color-two); } .new-posts .next-post .post{ position:relative; font-weight:700; text-transform:uppercase; color:var(--main-color-two); } .new-posts .next-post .post:hover, .new-posts .prev-post .post:hover, .new-posts .prev-post h5 a:hover, .new-posts .next-post h5 a:hover{ color:var(--main-color); } .product-details .basic-details .details-header .rating{ font-size:var(--font-14); color:var(--main-color); margin-bottom:var(--margin-bottom-15); } .product-details .basic-details .details-header .rating .fa{ display:inline-block; margin-right:var(--margin-right-5); } .product-details .basic-details .details-header .rating .txt{ font-size:var(--font-14); padding-left:var(--padding-left-15); color:var(--main-color-two); } .product-details .basic-details .details-header .item-price{ font-size:var(--main-color-two); font-weight:700; color:var(--main-color); line-height:24px; letter-spacing:1px; font-size:var(--font-26); margin-bottom:var(--margin-bottom-15); } .product-details .basic-details .prod-info{ margin-bottom:var(--margin-bottom-15); line-height:1.6em; font-size:var(--font-14); } .product-details .basic-details .prod-info strong{ font-weight:700; color:var(--main-color-two); } .product-details .basic-details .text{ margin-bottom:var(--margin-bottom-15); color:var(--main-color-two); font-size:var(--font-16); font-weight:300; line-height:1.8em; } .product-details .basic-details .location{ position:relative; color:var(--main-color-two); font-size:var(--font-16); font-weight:300; margin-bottom:var(--margin-bottom-15); } .product-details .basic-details .item-quantity .field-label{ float:left; font-weight:700; line-height:32px; display:inline-block; font-size:var(--font-16); padding-right:var(--padding-right-20); } .product-details .basic-details .quantity-spinner, .cart-section input.quantity-spinner{ line-height:24px; padding:10px 15px !important; height:46px !important; box-shadow:none !important; } .product-details .basic-details .item-quantity{ position:relative; float:left; width:85px; margin-bottom:var(--margin-bottom-20); margin-right:var(--margin-right-20); } .product-details .basic-details .item-quantity .field-label{ float:left; font-weight:700; font-size:var(--font-14); line-height:32px; display:inline-block; padding-right:var(--padding-right-20); } .product-details .basic-details .quantity-spinner, .cart-table input.quantity-spinner{ font-size:var(--font-18); line-height:24px; padding:10px 15px !important; height:54px !important; box-shadow:none !important; } .product-details .basic-details .bootstrap-touchspin .input-group-btn-vertical > .btn, .cart-table .bootstrap-touchspin .input-group-btn-vertical > .btn{ padding:13px 11px; border-radius:0px; } .product-details .bootstrap-touchspin .input-group-btn-vertical{ width:21px; position:absolute; right:0px; } .product-details .bootstrap-touchspin .input-group-btn-vertical i, .cart-table .bootstrap-touchspin .input-group-btn-vertical i{ top:0px; } .product-details .basic-details .add-to-cart{ padding:13px 37px; } .product-details .basic-details .expired{ position:relative; color:var(--main-color); font-size:var(--font-16); margin-bottom:var(--margin-bottom-20); } .bootstrap-touchspin .glyphicon-chevron-up:before { content: "\f0d8"; font-size:var(--font-18); font-style:normal; font-weight:800; font-family: 'FontAwesome'; } .bootstrap-touchspin .glyphicon-chevron-down:before { content: "\f0d7"; font-size:var(--font-18); font-style:normal; font-weight:800; font-family: 'FontAwesome'; } /*Pincode Form*/ .pincode-form{ position:relative; margin-bottom:var(--margin-bottom-15); } .pincode-form .form-group{ margin-bottom:var(--margin-bottom-10); } .pincode-form .form-group input[type="text"]{ position:relative; line-height:14px; padding:4px 10px 4px 15px; border:1px solid #f7f7f7; background:none; font-size:16px; width:170px; height:40px; color:var(--main-color-two) display:inline-block; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .pincode-form .form-group button{ position:relative; height:40px; width:100px; cursor:pointer; font-size:var(--font-16); color:var(--white-color); font-weight:500; line-height:100%; background:var(--main-color-two); margin-left:var(--margin-left-10); letter-spacing:1px; display:inline-block; text-transform:uppercase; } /*Related Products*/ .related-products{ position:relative; } .related-products h4{ margin-bottom:var(--margin-bottom-20); } /*** ==================================================================== Product Tabs Style ==================================================================== ***/ .shop-single .product-details .prod-tabs{ position:relative; margin-top:var(--margin-top-30); margin-bottom:var(--margin-bottom-40); } .shop-single .product-details .prod-tabs .tab-btns{ position:relative; z-index:1; border-bottom:1px solid #eeeeee; } .shop-single .product-details .prod-tabs .tab-btns .tab-btn{ position:relative; top:1px; display:block; float:left; margin-right:var(--margin-right-5); font-size:var(--main-color); background:#f4f4f4; color:var(--main-color-two); border:1px solid #f4f4f4; text-transform:uppercase; font-size:var(--font-15); font-weight:400; line-height:24px; cursor:pointer; font-weight:700; padding:14px 24px 14px; transition:all 500ms ease; } .shop-single .product-details .prod-tabs .tab-btns .tab-btn.active-btn:after{ position:absolute; content:''; left:0px; bottom:-1px; width:100%; height:1px; background-color:var(--white-color); } .shop-single .product-details .prod-tabs .tab-btns .tab-btn:hover, .shop-single .product-details .prod-tabs .tab-btns .tab-btn.active-btn{ color:var(--main-color); background:var(--white-color); } .shop-single .product-details .prod-tabs .tabs-content{ position:relative; padding:30px 30px 40px; border:1px solid #f0f0f0; border-top:0px; } .shop-single .product-details .prod-tabs .tabs-content .tab{ position:relative; display:none; border-top:0px; } .shop-single .product-details .prod-tabs .tabs-content .tab.active-tab{ display:block; } .prod-tabs .tabs-content .tab .title{ position:relative; color:var(--text-color); font-size:var(--font-20); font-weight:400; margin-bottom:var(--margin-bottom-25); } /*Comment Form*/ .shop-comment-form{ position:relative; } .shop-comment-form h4{ margin-bottom:var(--margin-bottom-25); } .shop-comment-form .group-title{ margin-bottom:var(--margin-bottom-20); } .shop-comment-form .rating-box{ position:relative; margin-bottom:var(--margin-bottom-30); } .shop-comment-form .rating-box .text{ color:var(--main-color-two); margin-bottom:var(--margin-bottom-10); } .shop-comment-form .rating-box .rating{ position:relative; display:inline-block; border-right:1px solid #ebebeb; margin-right:var(--margin-right-10); padding-right:var(--padding-right-10); } .shop-comment-form .rating-box .rating:last-child{ border-right:0px; } .shop-comment-form .rating-box .rating .fa{ position:relative; display:inline-block; margin-right:var(--margin-right-5); } .shop-comment-form .rating-box .rating a{ position:relative; color:var(--main-color-two); font-size:var(--font-16); display:inline-block; -webkit-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; -moz-transition:all 300ms ease; transition:all 300ms ease; } .shop-comment-form .rating-box .rating a:hover{ color:var(--main-color); } .shop-comment-form .form-group{ position:relative; margin-bottom:var(--margin-bottom-15); } .shop-comment-form .form-group label{ position:relative; color:var(--main-color-two); font-size:var(--font-16); font-weight:300; } .shop-comment-form .form-group:last-child{ margin-bottom:0px; } .shop-comment-form .form-group input[type="text"], .shop-comment-form .form-group input[type="password"], .shop-comment-form .form-group input[type="tel"], .shop-comment-form .form-group input[type="email"], .shop-comment-form .form-group select{ position:relative; display:block; width:100%; line-height:28px; padding:10px 15px; border:1px solid #efefef; height:50px; color:var(--main-color-two); font-weight:300; background:var(--white-color); -webkit-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; -moz-transition:all 300ms ease; transition:all 300ms ease; } .shop-comment-form .form-group input[type="text"]:focus, .shop-comment-form .form-group input[type="password"]:focus, .shop-comment-form .form-group input[type="tel"]:focus, .shop-comment-form .form-group input[type="email"]:focus, .shop-comment-form .form-group select:focus, .shop-comment-form .form-group textarea:focus{ border-color:var(--main-color); } .shop-comment-form .form-group textarea{ position:relative; display:block; width:100%; line-height:26px; padding:10px 15px; color:var(--main-color-two); border:1px solid #efefef; height:105px; font-weight:300; background:var(--white-color); resize:none; -webkit-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; -moz-transition:all 300ms ease; transition:all 300ms ease; } .shop-comment-form button{ position:relative; margin-top:var(--margin-top-10); } .shop-comment-form input:focus, .shop-comment-form select:focus, .shop-comment-form textarea:focus{ border-color:var(--main-color); } /*** ==================================================================== Comments Area ==================================================================== ***/ .sidebar-page-container .comments-area .comment-box:hover{ border-color:var(--main-color); } .sidebar-page-container .comments-area .comment-box.reply-comment{ margin-left:var(--marg-left-30); } .sidebar-page-container .comments-area .comment .comment-inner{ position:relative; padding:15px 20px; border:1px solid #f4f4f4; } .sidebar-page-container .comments-area .comment-info{ position:relative; font-size: var(--font-16); color: var(--main-color-two); line-height:24px; font-weight:700; } .sidebar-page-container .comments-area .comment-box .text{ font-weight:400; font-size: var(--font-16); color: var(--main-color-two); margin-top:var(--marg-top-10); margin-bottom:var(--margin-bottom-10); } .company-widget .widget-content{ position:relative; padding:30px 30px; background-color:#f5f5f5; } /* Project Widget */ .project-widget{ position:relative; margin-bottom:var(--margin-bottom-10); } .project-widget .inner-box{ position:relative; border-radius:6px; overflow:hidden; } .project-widget .inner-box .image{ position:relative; } .project-widget .inner-box .image img{ position:relative; width:100%; display:block; } .project-widget .inner-box .overlay-box{ position:absolute; left:0px; top:0px; right:0px; bottom:0px; } .project-widget .inner-box .overlay-box:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:0px; opacity:0.50; background-color:var(--main-color-two); } .project-widget .inner-box .overlay-box .content{ position:absolute; left:25px; right:20px; bottom:25px; } .project-widget .inner-box .overlay-box h5{ font-weight:700; } .project-widget .inner-box .overlay-box h5 a{ color:var(--white-color); } .project-widget .inner-box .overlay-box h5 a:hover{ color:var(--main-color); } .project-widget .inner-box .overlay-box .role{ position:relative; font-weight:700; font-size:var(--font-16); color:var(--white-color); margin-top:var(--margin-top-10); } .project-widget .inner-box .overlay-box .role span{ font-weight:400; color:var(--main-color); } /* Subscribe Widget */ .subscribe-widget{ position:relative; padding:35px 30px; border-radius:10px; background-color:var(--main-color-two); } .subscribe-widget h5{ text-align:center; color:var(--white-color); margin-bottom:var(--margin-bottom-20); } /* Sidebar Range slider */ .range-slider-one{ position:relative; min-height:48px; overflow:hidden; padding:35px 30px; background-color:#f5f5f5; } .range-slider-one .title{ position:relative; float:left; color:var(--main-color-two); font-size:var(--font-16); margin-top:var(--margin-top-10); } .range-slider-one .title:before{ position:absolute; content:'$'; right:-14px; top:0px; font-weight:300; font-size:var(--font-16); color:var(--main-color-two); } .range-slider-one .input{ float:right; left: 8px; max-width:75px; padding-left:var(--padding-left-10); margin-top:var(--margin-top-10); position: relative; } .range-slider-one .input input{ background:none; color:var(--main-color-two); font-size:var(--font-16); font-weight:400; width:auto; text-align:left; } .range-slider-one .ui-widget.ui-widget-content{ height:5px; border:none; margin-bottom:35px; background:#e5e5e5; border-radius:0px; } .range-slider-one .ui-slider .ui-slider-range{ top:0px; height:5px; background:var(--main-color-two); } .range-slider-one .ui-state-default, .range-slider-one .ui-widget-content .ui-state-default{ top:-4px; width:14px; height:14px; border:3px solid var(--main-color-two); background:var(--main-color); border-radius:0%; cursor:pointer; } .range-slider-one .theme-btn{ padding:6px 25px; } /*** ==================================================================== Cart Section style ==================================================================== ***/ .cart-section{ position:relative; padding:80px 0px; } .cart-outer .title-box{ margin-bottom:var(--margin-bottom-25); } .cart-section .cart-table{ width:100%; min-width:900px; } .cart-table .cart-header{ position:relative; width:100%; text-transform:uppercase; font-size:var(--font-16); border-radius:0px; background:#f7f7f7; color:var(--main-color-two); } .cart-table thead tr th{ line-height:24px; padding:20px 15px; min-width:120px; font-weight:400; color:var(--main-color-two); font-size:var(--font-16); } .cart-table thead tr th.prod-column{ text-align:left; padding-left:var(--padding-left-40); } .cart-table tbody tr td{ line-height:24px; padding:30px 10px 20px; min-width:100px; } .cart-table tbody tr .qty{ width:90px; padding-right:40px; } .cart-table tbody tr .qty .quantity-spinner{ background:#f5f5f5; } .cart-table tbody tr .prod-column .column-box{ position:relative; min-height:90px; padding-left:var(--padding-left-90); padding-top:var(--padding-top-20); text-align:left; } .column.default-column .cart-table tbody tr .qty{ width:110px; padding-right:20px; padding-right:var(--padding-right-20); } .cart-table tbody tr .prod-column .column-box .prod-thumb{ position:absolute; width:70px; border:1px solid #f0f0f0; left:0px; top:0px; } .cart-table tbody tr .prod-column .column-box .prod-thumb img{ display:block; max-width:100%; } .cart-table tbody tr .prod-column .column-box h3{ margin-bottom:var(--margin-bottom-10); } .cart-table tbody tr .remove-btn{ position:relative; font-size:var(--font-18); color:var(--main-color-two); width:34px; height:34px; text-align:center; line-height:30px; display:inline-block; border:2px solid #ececec; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; -moz-transition:all 500ms ease; transition:all 500ms ease; } .cart-table tbody tr .remove-btn .fa{ position:relative; top:2px; font-size:var(--font-12); line-height:14px; width:14px; height:14px; margin-right:var(--margin-right-5); background:#f0f0f0; color:var(--white-color); text-align:center; overflow:hidden; text-indent:100px; } .cart-table tbody tr .remove{ text-align:center; } .cart-table tbody tr .remove-btn:hover{ color:var(--main-color); border-color:var(--main-color); } .cart-table tbody tr .remove-btn:hover .fa{ text-indent:0px; background:var(--main-color); } .cart-table tbody tr{ border-bottom:1px solid #f0f0f0; } .cart-table tbody tr td{ vertical-align:middle; } .cart-table tbody tr td .quantity-spinner{ padding:5px 0px 5px 20px; line-height:24px; height:34px; display:block; width:100%; position:relative; } .cart-table tbody .available-info{ position:relative; font-size:var(--font-16); color:var(--main-color-two); padding-left:var(--padding-left-50); } .cart-table tbody .available-info .icon{ position:absolute; left:0px; top:5px; width:40px; height:40px; line-height:40px; text-align:center; font-size:var(--font-18); color:var(--white-color); background:var(--main-color); border-radius:50%; } .cart-section .coupon-outer{ position:relative; margin:50px 0px 70px ; } .cart-section .apply-coupon{ position:relative; } .cart-section .apply-coupon .form-group{ position:relative; float:left; margin-right:var(--margin-right-15); } .cart-section .apply-coupon .form-group input[type="text"]{ display:block; line-height:26px; padding:12px 20px; border:2px solid #f7f7f7; height:60px; width:230px; background:none; } .cart-section .estimate-form{ position:relative; } .cart-section .sec-title{ margin-bottom:var(--margin-bottom-15); } .cart-section .estimate-form .row{ margin-left:-7px; margin-right:-7px; } .cart-section .estimate-form .row .form-group{ padding:0px 7px !important; margin-bottom:var(--margin-bottom-30); } .cart-section .totals-table{ position:relative; border:1px solid #f0f0f0; border-radius:2px; margin-bottom:var(--margin-bottom-30); } .cart-section .totals-table .col{ position:relative; display:block; float:left; padding:15px 15px; line-height:24px; width:50%; font-weight:600; font-size:var(--font-16); color:var(---main-color-two); } .cart-section .totals-table .col-title{ font-size:var(--font-16); color:var(---main-color-two); border-right:1px solid #f0f0f0; } .cart-section .totals-table li{ position:relative; border-bottom:1px solid #f0f0f0; } .cart-section .totals-table li:last-child{ border-bottom:none; } .cart-section .cart-note{ position:relative; margin-bottom:50px; padding:16px 20px; text-align:center; border:1px dashed #b2dd4c; background:#f4f4f4; line-height:1.7em; } .product-details .basic-details .item-quantity input[type="text"], .cart-table tbody tr .qty input[type="text"]{ position:relative; line-height:46px; height:46px; background:#f4f4f4; } .bootstrap-touchspin .input-group-btn-vertical > .btn{ height:24px; background:#e9e9e9; } .bootstrap-touchspin .input-group-btn-vertical i{ left:6px; top:6px; } /* Shopping Form */ .shipping-form .form-group{ position:relative; padding:0px 15px; margin-bottom:var(--margin-bottom-30); } .shipping-form .form-group .ui-selectmenu-button.ui-button{ background-color:var(--white-color); height:45px; line-height:24px; z-index:10; background-position:right top; background-repeat:no-repeat; background-image:url(../images/icons/arrow-right.html); } .shipping-form .form-group .ui-button .ui-icon{ opacity:0; } .shipping-form .form-group input, .shipping-form .form-group select{ position:relative; display:block; width:100%; line-height:33px; padding:10px 20px; height:45px; font-size:14px; font-weight:600; background-color:var(--white-color); border:1px solid #f4f4f4; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -moz-transition:all 500ms ease; transition:all 500ms ease; } .shipping-form .form-group textarea{ position:relative; display:block; width:100%; line-height:30px; padding:10px 20px; height:120px; resize:none; font-size:16px; font-weight:300; background:#f7f7f7; border:1px solid #f4f4f4; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -moz-transition:all 500ms ease; transition:all 500ms ease; } .shipping-form .form-group input:focus, .shipping-form .form-group textarea:focus{ border-color:var(--main-color); } /*** ==================================================================== CheckOut Sectioon ==================================================================== ***/ .checkout-page{ position:relative; padding:75px 0px 70px; } .checkout-page .default-links{ position:relative; margin-bottom:var(--margin-bottom-40); } .checkout-page .default-links li{ margin-bottom:var(--margin-bottom-15); line-height:24px; padding:18px 30px; background:#f7f7f7; font-weight:600; color:var(--main-color-two); font-size:var(--font-16); border-left:2px solid var(--main-color); } .checkout-page .default-links li a{ color:var(--main-color); } .checkout-form{ position:relative; } .checkout-form .checkout-title{ position:relative; } .checkout-form .checkout-title h4{ margin-bottom:var(--margin-bottom-30); padding-bottom:var(--padding-bottom-10); } .checkout-form .checkout-title h4:after{ position:absolute; content:''; left:0px; bottom:0px; width:40px; height:2px; background-color:var(--main-color); } .checkout-form .form-group{ position:relative; margin-bottom:var(--margin-bottom-20); } .checkout-form .form-group .field-label{ display:block; line-height:24px; margin-bottom:var(--margin-bottom-5); text-transform:capitalize; color:var(--main-color-two); font-size:var(--font-16); font-weight:400; } .checkout-form .form-group .field-label sup{ top:-1px; /*color:#ff6600;*/ font-size:var(--font-16); } .checkout-form input[type="text"], .checkout-form input[type="email"], .checkout-form input[type="password"], .checkout-form input[type="tel"], .checkout-form input[type="number"], .checkout-form input[type="url"], .checkout-form select, .checkout-form textarea{ position:relative; display:block; width:100%; background:var(--white-color); line-height:22px; padding:12px 15px; height:48px; border:2px solid #f4f4f4; transition:all 300ms ease; -webkit-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; -moz-transition:all 300ms ease; } .checkout-form textarea{ resize:none; height:120px !important; } .checkout-form input:focus, .checkout-form select:focus, .checkout-form textarea:focus{ border-color:var(--main-color); } .checkout-page .check-box{ line-height:24px; font-size:var(--font-14); font-weight:normal; padding-top:var(--padding-top-5); } .checkout-page .check-box label{ position:relative; top:-1px; font-weight:normal; padding:0px; font-size:var(--font-14); cursor:pointer; color:var(--main-color); } .checkout-page .lower-content{ margin-top:var(--margin-top-30); } .checkout-page .lower-content .order-column{ margin-bottom:var(--margin-bottom-40); } .checkout-page .lower-content .column h4{ margin-bottom:var(--margin-bottom-30); padding-bottom:var(--padding-bottom-15); } .checkout-page .lower-content .column h4:after{ position:absolute; content:''; left:0px; bottom:0px; width:40px; height:2px; background-color:var(--main-color); } /*cart outer*/ .cart-outer{ position:relative; } .cart-outer .table-outer{ position:relative; width:100%; overflow-x: auto; } .checkout-page .lower-content .order-column .cart-outer{ overflow-x:auto; } .checkout-page .lower-content .order-column .cart-table{ width:100%; } .cart-table .cart-header{ position:relative; width:100%; text-transform:capitalize; font-size:var(--font-18); background:#f7f7f7; color:var(--main-color-two); } .cart-table thead tr th{ line-height:24px; padding:13px 30px; font-weight:400; } .cart-table thead tr th .fa{ font-size:var(--font-18); } .cart-table thead tr th.prod-column{ text-align:left; } .cart-table tbody tr{ border-bottom:1px solid #eeeeee; } .cart-table tbody tr .qty input{ width:45px; height:50px; color:var(--main-color-two); font-size:var(--font-18); line-height:50px; background:#f7f7f7; text-align:center; /*border:1px solid #eaeaea;*/ } .cart-table tbody tr .prod-column .column-box{ position:relative; min-height:70px; padding-left:var(--padding-left-100); padding-top:var(--padding-top-20); text-align:left; min-width:230px; } .cart-table tbody tr .prod-column .column-box .prod-thumb{ position:absolute; width:80px; left:0px; top:0px; } .cart-table tbody tr .prod-column .column-box .prod-thumb img{ display:block; width:100%; } .cart-table tbody tr .prod-column .column-box h6{ color:var(--main-color-two); padding-bottom:var(--padding-bottom-5); text-transform:capitalize; } .cart-table tbody tr .sub-total{ font-weight:300; font-size:var(--font-20); color:var(--main-color); } .cart-table tbody tr .price{ font-weight:700; font-size:var(--font-14); color:var(--main-color-two); } /*Total Table*/ .checkout-page .lower-content .totals-table{ position:relative; margin-bottom:var(--margin-bottom-40); border:1px solid #eeeeee; } .checkout-page .lower-content .totals-table li .col{ padding:12px 20px; } .checkout-page .lower-content .totals-table li{ line-height:24px; border-bottom:1px solid #eeeeee; } .checkout-page .lower-content .totals-table li .col.title{ font-weight:500; font-size:var(--font-14); color:var(--main-color-two); border-right:1px solid #eeeeee; } .checkout-page .lower-content .totals-table li:last-child{ border-bottom:none; margin-bottom:0px; } .checkout-page .lower-content .totals-table .col{ position:relative; display:block; float:left; line-height:24px; width:50%; color:var(--main-color-two); font-weight: 300; font-size:var(--font-16); } /*Payment Option*/ .checkout-page .payment-options{ position:relative; padding:30px 20px; background-color:#f7f7f7; } .checkout-page .payment-options li{ position:relative; margin-bottom:var(--margin-bottom-15); } .checkout-page .payment-options li .radio-option{ position:relative; } .checkout-page .payment-options li .radio-option label{ position:relative; display:inline-block; padding-left:var(--padding-left-30); font-weight:500 !important; text-transform:capitalize; letter-spacing:1px; color:var(--main-color-two); cursor:pointer; } .checkout-page .payment-options li .radio-option label strong{ font-weight:700; color:var(--main-color-two); font-size:var(--font-16); } .checkout-page .payment-options li .radio-option label strong a{ font-size:var(--font-16); padding-left:var(--padding-left-30); text-decoration:underline; } .checkout-page .payment-options li .radio-option input[type="radio"]{ position:absolute; left:0px; top:3px; } .checkout-page .payment-options li .radio-option label .small-text{ display:block; padding-top:var(--padding-top-5); letter-spacing:0px; text-transform:none; font-size:var(--font-16); color:var(--main-color-two); font-weight:300; line-height:1.7em; } .checkout-page .payment-options li .radio-option label img{ position:relative; top:-3px; display:inline-block; max-width:100%; padding-left:var(--padding-left-30); } /*** ==================================================================== Login / Register Section ==================================================================== ***/ .register-section{ position:relative; padding:80px 0px 40px; } .register-section .form-column{ margin-bottom:var(--margin-bottom-80); } .register-section .form-column .form-title{ position:relative; margin-bottom:var(--margin-bottom-40); } .register-section .form-column .form-title h4{ padding-bottom:var(--padding-bottom-15); } .register-section .form-column .form-title h4:after{ position:absolute; content:''; left:0px; bottom:0px; width:45px; height:3px; background-color:var(--main-color); } .styled-form{ position:relative; } .styled-form .submit-text{ font-weight:400; font-size:var(--font-15); color:var(--main-color-two); margin-top:var(--margin-top-10); } .styled-form .form-group{ position:relative; margin-bottom:var(--margin-bottom-30); font-size:var(--font-15); } .checkout-section .styled-form .form-group{ position:relative; margin-bottom:var(--margin-bottom-20); } .styled-form .form-group .check-box{ line-height:24px; font-size:var(--font-15); font-weight:normal; padding-top:var(--padding-top-5); color:var(--main-color-two); } .styled-form .form-group .check-box label{ position:relative; top:-1px; font-weight:normal; padding:0px; font-size:15px; cursor:pointer; } .styled-form .pull-left label, .styled-form .pull-right label{ cursor:pointer; } .styled-form .form-group .adon-icon{ position:absolute; top:50%; margin-top:-10px; right:10px; width:20px; height:20px; line-height:20px; font-size:var(--font-15); color:var(--main-color-two); z-index:2; } .styled-form .form-group .field-label{ display:block; color:var(--main-color-two); text-transform:capitalize; font-size:var(--font-16); margin-bottom:var(--margin-bottom-10); font-weight:400; } .styled-form input[type="text"], .styled-form input[type="email"], .styled-form input[type="password"], .styled-form input[type="tel"], .styled-form input[type="number"], .styled-form input[type="url"], .styled-form select, .styled-form textarea{ position:relative; display:block; width:100%; background:var(--white-color); line-height:30px; padding:8px 20px; height:50px; border:2px solid #f4f4f4; transition:all 300ms ease; -webkit-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; -moz-transition:all 300ms ease; } .checkout-section .styled-form input[type="text"], .checkout-section .styled-form input[type="email"], .checkout-section .styled-form input[type="password"], .checkout-section .styled-form select{ line-height:26px; height:44px; } .styled-form select{ -webkit-appearance:none; -ms-appearance:none; -moz-appearance:none; -o-appearance:none; background:var(--white-color) url(../images/icons/icon-select.png) right center no-repeat; cursor:pointer; } .styled-form select option{ text-indent:20px; } .styled-form textarea{ resize:none; height:110px; } .styled-form input:focus, .styled-form select:focus, .styled-form textarea:focus{ border-color:var(--main-color); } .styled-form .remember-me{ position:relative; color:var(--main-color-two); font-size:var(--font-16); font-weight:500; } .social-links-two a{ position:relative; display:inline-block; font-size:var(--font-14); width:42px; height:42px; line-height:42px; text-align:center; color:var(--white-color); background:var(--main-color); margin:0px 0px 0px 5px; transition:all 0.5s ease; -moz-transition:all 0.5s ease; -webkit-transition:all 0.5s ease; -ms-transition:all 0.5s ease; -o-transition:all 0.5s ease; } .social-links-two a:hover{ opacity:0.80; } .social-links-two .facebook{ background:#3b5998; } .social-links-two .twitter{ background:#33ccfe; } .social-links-two .google-plus{ background:#dd4b39; } /*** ==================================================================== Contact Page Section ==================================================================== ***/ .contact-page-section{ position:relative; padding:100px 0px 70px; } .contact-page-section .image-layer{ position:absolute; left:0px; top:0px; right:0px; height:770px; background-size:cover; } .contact-page-section .image-layer:before{ position:absolute; content:''; left:0px; top:0px; right:0px; bottom:0px; opacity:0.70; background-color:#f5f5f5; } .contact-page-section .title-box{ position:relative; text-align:center; margin-bottom:var(--margin-bottom-40); } .contact-page-section .title-box h2{ color:var(--main-color-two); } .contact-page-section .title-box .text{ margin-top:var(--margin-top-15); color:var(--main-color-two); } .contact-page-section .info-column{ position:relative; margin-bottom:var(--margin-bottom-30); } .contact-page-section .info-column .inner-column{ position:relative; padding:30px 25px 25px 100px; } .contact-page-section .info-column .inner-column:before{ position:absolute; content:''; left:40px; top:0px; right:0px; bottom:0px; border-radius:6px; background-color:var(--white-color); box-shadow:0px 0px 15px rgba(0,0,0,0.10); } .contact-page-section .info-column .icon{ position:absolute; left:0px; top:18px; width:80px; height:80px; line-height:80px; text-align:center; border-radius:50px; display:inline-block; font-size:var(--font-34); color:var(--main-color-two); background-color:var(--main-color); } .contact-page-section .info-column .text{ position:relative; font-weight:600; font-size:var(--font-16); color:var(--main-color-two); } .contact-page-section iframe{ position: relative; left: 0; top: 0; width: 100%; height: 500px; overflow:hidden; border-radius:8px; margin-top:var(--margin-top-45); } .contact-page-section .lower-section{ position:relative; margin-top:-150px; } .contact-page-section .lower-section .title-column{ position:relative; } .contact-page-section .lower-section .title-column .inner-column{ position:relative; padding-top:var(--padding-top-200); } .contact-page-section .lower-section .title-column h2{ margin-bottom:var(--margin-bottom-15); } .contact-page-section .lower-section .title-column .text{ margin-bottom:var(--margin-bottom-35); font-size:var(--font-16); color:var(--main-color-two); } .contact-page-section .lower-section .form-column{ position:relative; } .contact-page-section .lower-section .form-column .inner-column{ position:relative; padding:40px 40px; border-radius:6px; margin-right:var(--margin-right-80); background-color:var(--main-color); } .contact-page-section.style-two{ padding-bottom:var(--padding-bottom-100); } .contact-page-section.style-two .image-layer{ height:540px; } .contact-page-section.style-two .lower-section{ margin:var(--margin-zero); margin-top:var(--margin-top-60); margin-bottom:var(--margin-bottom-50); } .contact-page-section.style-two .lower-section .title-column .inner-column{ padding-top:var(--padding-top-150); } /*** ==================================================================== Styled Pagination ==================================================================== ***/ .styled-pagination{ position:relative; } .styled-pagination li{ position:relative; display:inline-block; margin:0px 5px 6px 5px; } .styled-pagination li a{ position:relative; display:inline-block; line-height:60px; height:60px; width:60px; min-width:40px; font-size:var(--font-20); color:var(--main-color-two); font-weight:700; text-align:center; background-color:#e1e1e1; text-transform:capitalize; transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; -moz-transition:all 500ms ease; } .styled-pagination li.prev a, .styled-pagination li.next a{ background-color:var(--main-color); color:var(--white-color); border:none; } .styled-pagination li a:hover, .styled-pagination li a.active{ color:var(--white-color); background-color:var(--main-color-two); } /* Post Widget */ .post-widget .widget-content{ position:relative; padding:30px 30px 30px; background-color:#f5f5f5; } .post-widget .post{ position: relative; min-height: 78px; padding-left: var(--padding-left-90); margin-bottom: var(--margin-bottom-20); } .post-widget .post:last-child{ margin-bottom: var(--margin-zero); padding-bottom: var(--padding-zero); } .post-widget .post .thumb{ position: absolute; left: 0; top: 0; height: 75px; width: 75px; overflow: hidden; border-radius:6px; } .post-widget .post .thumb a{ display: block; } .post-widget .post .thumb img{ display: block; width: 100%; height: auto; } .post-widget .post h6{ line-height:1.3em; } .post-widget .post h6 a{ color:var(--main-color-two); -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; } .post-widget .post h6 a:hover{ color:var(--main-color); } .post-widget .post .post-date{ position: relative; display: block; font-weight:600; font-size: var(--font-14); color:var(--main-color-two); margin-top: var(--margin-top-5); padding-left: var(--padding-left-25); font-family: var(--font-family-inter); } .post-widget .post .post-date:before{ position: absolute; content:'\f073'; left:0px; top:-1px; color:var(--main-color); font-family: 'FontAwesome'; } .blog-detail{ position:relative; } .blog-detail .inner-box{ position:relative; padding-left:var(--padding-left-100); } .blog-detail .inner-box .image{ position:relative; border-radius:8px; overflow:hidden; } .blog-detail .inner-box .image img{ position:relative; width:100%; display:block; } .blog-detail .inner-box .social-box{ position:absolute; left:0px; top:0px; width:50px; text-align:center } .blog-detail .inner-box .social-box .follow{ position:relative; display:block; } .blog-detail .inner-box .social-box li{ position:relative; margin-bottom:var(--margin-bottom-5); } .blog-detail .inner-box .social-box li.follow{ position:relative; font-weight:700; color:var(--main-color-two); margin-bottom:var(--margin-bottom-10); } .blog-detail .inner-box .social-box li a{ position:relative; width:45px; height:45px; line-height:45px; display:inline-block; background-color:#f0f0f0; color:var(--main-color-two); } .blog-detail .inner-box .social-box li a:hover{ color:var(--white-color); background-color:var(--main-color-two); } .blog-detail .inner-box .lower-content{ position:relative; padding-top:var(--padding-top-30); } .blog-detail .inner-box .post-info{ position:relative; } .blog-detail .inner-box .post-info li{ position:relative; color:#999999; font-style:italic; display:inline-block; font-size:var(--font-16); color:var(--main-color-two); margin-right:var(--margin-right-20); padding-left:var(--padding-left-25); } .blog-detail .inner-box .post-info li .icon{ position:absolute; left:0px; top:0px; color:var(--main-color); font-size:var(--font-16); } .blog-detail .inner-box .post-info li:first-child{ position:relative; padding:7px 14px 7px 35px; font-weight:700; border-radius:6px; background-color:var(--main-color); } .blog-detail .inner-box .post-info li:first-child .icon{ left:14px; top:6px; color:var(--main-color-two); } .blog-detail .inner-box h4{ color:var(--main-color-two); margin-top:var(--margin-top-25); margin-bottom:var(--margin-bottom-15); } .blog-detail .inner-box .post-meta{ position:relative; margin-top:var(--margin-top-15); margin-bottom:var(--margin-bottom-15); } .blog-detail .inner-box .post-meta li{ position:relative; line-height:1.2em; display:inline-block; color:var(--main-color-two); border-right:1px solid #b3b3b3; padding-left:var(--padding-left-25); padding-right:var(--padding-right-15); margin-right:var(--margin-right-15); text-transform:uppercase; } .blog-detail .inner-box .post-meta li:last-child{ padding-right:var(--padding-zero); margin-right:var(--margin-zero); border:0px; } .blog-detail .inner-box .post-meta li .icon{ position:absolute; left:0px; top:0px; color:var(--main-color); } .blog-detail .inner-box blockquote{ position:relative; border-radius:8px; padding:35px 30px; text-align:center; line-height:1.5em; font-weight:600; font-style:italic; font-size:var(--font-20); color:var(--main-color-two); background-position:left bottom; background-repeat:no-repeat; margin-top:var(--margin-top-30); background-color:var(--main-color); margin-bottom:var(--margin-bottom-25); font-family: var(--font-family-inter); } .blog-detail .inner-box blockquote .icon{ position:relative; display:block; line-height:1em; font-size:var(--font-40); color:var(--main-color-two); margin-bottom:var(--margin-bottom-15); } .blog-detail .inner-box .list{ position:relative; } .blog-detail .inner-box .list li{ position:relative; font-size:var(--font-16); color:var(--main-color-two); margin-bottom:var(--margin-bottom-10); padding-left:var(--padding-left-30); } .blog-detail .inner-box .list li:before{ position:absolute; content: "\f00c"; left:0px; top:0px; font-size:var(--font-16); font-family: 'FontAwesome'; color:var(--main-color); } .blog-detail .inner-box .two-column{ margin-top:var(--margin-top-45); } /* Author Box */ .blog-author-box{ position:relative; border-radius:8px; overflow:hidden; padding: 30px 30px 30px 0px; margin-top:var(--margin-top-40); margin-bottom:var(--margin-bottom-40); } .blog-author-box:before{ position:absolute; content:''; left:70px; top:0px; right:0px; bottom:0px; border-radius:8px; border: 5px dashed #f5f5f5; } .blog-author-box .author-inner{ position:relative; padding-top: var(--padding-top-25); padding-left: var(--padding-left-160); } .blog-author-box .thumb{ position:absolute; left:0px; top:0px; width: 135px; overflow: hidden; border-radius:8px; } .blog-author-box .thumb img{ display: block; width: 100%; height: auto; } .blog-author-box .name{ display: block; color: var(--main-color-two); } .blog-author-box .text{ display: block; font-size: var(--font-16); color: var(--main-color-two); margin-top: var(--margin-top-10); margin-bottom: var(--margin-bottom-15); } .blog-author-box .social-icon{ position: absolute; right:0px; top:0px; } .blog-author-box .social-icon li{ position: relative; float:left; display: inline-block; } .blog-author-box .social-icon li:last-child{ margin-right: 0; } .blog-author-box .social-icon li.facebook a{ background-color:#4e57ae; } .blog-author-box .social-icon li.google a{ background-color:#d12727; } .blog-author-box .social-icon li.twitter a{ background-color:#40a3db; } .blog-author-box .social-icon li a{ position:relative; width:55px; height:45px; display: block; font-weight:400; line-height: 45px; text-align:center; display:inline-block; font-size: var(--font-16); color:var(--white-color); -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; } .blog-author-box .social-icon li a:hover{ color: var(--white-color); border-color:var(--main-color); background-color:var(--main-color); } /*** ==================================================================== Comments Area ==================================================================== ***/ .sidebar-page-container .comments-area{ position:relative; margin-top:var(--margin-zero); margin-bottom:var(--margin-bottom-40); } .sidebar-page-container .comments-area .comment-box{ position:relative; -webkit-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; -moz-transition:all 300ms ease; transition:all 300ms ease; margin-bottom:var(--margin-bottom-30); } .sidebar-page-container .comments-area .comment-box:nth-child(1){ padding-top:0px; } .sidebar-page-container .comments-area .comment-box:hover{ border-color:var(--main-color); } .sidebar-page-container .comments-area .comment-box.reply-comment{ margin-left:var(--marg-left-30); } .sidebar-page-container .comments-area .comment{ position:relative; font-size: var(--font-14); padding:0px 0px 0px 80px; } .sidebar-page-container .comments-area .comment .comment-inner{ position:relative; padding:15px 20px; border:1px solid #f4f4f4; } .sidebar-page-container .comments-area .comment .comment-inner .rating{ position:absolute; right:15px; top:15px; } .sidebar-page-container .comments-area .comment .comment-inner .rating .fa{ display:inline-block; font-size: var(--font-14); color: var(--main-color); } .sidebar-page-container .comments-area .comment-box .author-thumb{ position:absolute; left:0px; top:0px; margin-bottom:var(--margin-bottom-20); } .sidebar-page-container .comments-area .comment-box .author-thumb img{ width:60px; display:block; } .sidebar-page-container .comments-area .comment-info{ position:relative; font-size: var(--font-16); color: var(--main-color-two); line-height:24px; font-weight:700; } .sidebar-page-container .comments-area .comment-box .text{ font-weight:400; font-size: var(--font-16); color: var(--main-color-two); margin-top:var(--marg-top-10); margin-bottom:var(--margin-bottom-10); } /*Comment Form*/ .comment-form{ position:relative; } .sidebar-page-container .group-title{ margin-bottom:var(--margin-bottom-20); } .comment-form .rating-box{ position:relative; margin-bottom:var(--margin-bottom-20); } .comment-form .rating-box .text{ position:relative; font-size: var(--font-16); color: var(--main-color-two); margin-bottom:var(--margin-bottom-10); } .comment-form .rating-box .rating{ position:relative; display:inline-block; margin-right:var(--margin-right-10); padding-right:var(--padding-right-10); border-right:1px solid #ebebeb; } .comment-form .rating-box .rating:last-child{ border:0px; } .comment-form .rating-box .rating .fa{ position:relative; display:inline-block; margin-right:var(--margin-right-5); } .comment-form .rating-box .rating a{ position:relative; display:inline-block; font-size: var(--font-10); color: var(--main-color-two); -webkit-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; -moz-transition:all 300ms ease; transition:all 300ms ease; } .comment-form .rating-box .rating a:hover{ color:var(--main-color); } .comment-form .form-group{ position:relative; margin-bottom:15px; margin-bottom:var(--margin-bottom-15); } .comment-form .form-group label{ position:relative; font-size: var(--font-15); color: var(--main-color-two); } .comment-form .form-group:last-child{ margin-bottom:var(--margin-zero); } .comment-form .form-group input[type="text"], .comment-form .form-group input[type="password"], .comment-form .form-group input[type="tel"], .comment-form .form-group input[type="email"], .comment-form .form-group select{ position:relative; display:block; width:100%; height:50px; line-height:28px; padding:10px 15px; border:1px solid #efefef; font-size: var(--font-15); color: var(--main-color-two); background:var(--white-color); -webkit-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; -moz-transition:all 300ms ease; transition:all 300ms ease; } .comment-form .form-group input[type="text"]:focus, .comment-form .form-group input[type="password"]:focus, .comment-form .form-group input[type="tel"]:focus, .comment-form .form-group input[type="email"]:focus, .comment-form .form-group select:focus, .comment-form .form-group textarea:focus{ border-color:var(--main-color); } .comment-form .form-group textarea{ position:relative; display:block; width:100%; resize:none; height:100px; font-weight:300; line-height:26px; padding:10px 15px; font-size: var(--font-15); color: var(--main-color-two); background:var(--white-color); border:1px solid #efefef; -webkit-transition:all 300ms ease; -ms-transition:all 300ms ease; -o-transition:all 300ms ease; -moz-transition:all 300ms ease; transition:all 300ms ease; } .comment-form button{ margin-top:var(--margin-top-20); } .comment-form input:focus, .comment-form select:focus, .comment-form textarea:focus{ border-color:var(--main-color); } /*** ==================================================================== Error Section ==================================================================== ***/ .error-section{ position:relative; width:100%; text-align:center; padding:140px 0px 150px; } .error-section .inner-section{ position:relative; text-align:center; display:inline-block; border-radius:50%; padding:100px 30px 100px; background-color:var(--main-color-two); } .error-section .inner-section h1{ line-height:1em; color:var(--main-color); font-size:var(--font-200); margin-bottom:var(--margin-bottom-20); } .error-section .inner-section h6{ color:var(--white-color); font-weight:400; text-transform:uppercase; margin-bottom:var(--margin-bottom-10); } .error-section .inner-section .text{ color:var(--white-color); font-size:var(--font-16); margin-top:var(--marg-top-15); margin-bottom:var(--margin-bottom-30); } .error-section .go-back{ position:relative; font-size:var(--font-16); color:var(--white-color); font-weight:400; text-align:center; display:inline-block; margin-top:var(--margin-top-20); transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; } .error-section .go-back:hover{ color:var(--main-color); } /*Error Form*/ .error-search-form .form-group{ position:relative; max-width:430px; margin:0 auto; width:100%; } .error-search-form .form-group input[type="text"], .error-search-form .form-group input[type="search"]{ position:relative; line-height:28px; background:none; display:block; width:100%; height:50px; font-size:var(--font-16); padding:10px 50px 10px 20px; transition:all 500ms ease; -moz-transition:all 500ms ease; -webkit-transition:all 500ms ease; -ms-transition:all 500ms ease; -o-transition:all 500ms ease; background-color:var(--white-color); } .error-search-form .form-group input:focus{ } .error-search-form .form-group button{ position:absolute; right:0px; top:0px; height:50px; width:50px; display:block; font-size:var(--font-16); color:var(--white-color); line-height:100%; background:var(--main-color); font-weight:normal; } .contact-form input.error, .contact-form select.error, .contact-form textarea.error{ border-color:#ff0000 !important; } .contact-form label.error{ display:block; line-height:24px; padding:5px 0px 0px; margin:0px; text-transform:uppercase; font-size:12px; color:#ffffff; font-weight:500; } /*Boxed Layout Style*/ .box-layout{ position: relative; box-shadow: 0px 0px 15px rgba(0,0,0,0.20); } .box-layout:before{ position:fixed; content: ''; left:0px; top: 0px; width: 100%; height:100%; display: block; background: url(../images/background/1.jpg); } .box-layout .page-wrapper{ max-width:1170px; width: 100%; margin: 0 auto; padding:15px; overflow:hidden; background-color: #ffffff; } .box-layout .main-footer .request-widget .theme-btn{ padding:16px 22px; font-size:14px; } .box-layout .main-header .info-box{ margin-left:var(--margin-left-20); } .box-layout .work-section .content-column .button-box{ margin-left:var(--margin-left-30); } .box-layout .services-section-four:before{ z-index:0; } .box-layout .work-section .content-column .phone-box .or{ display:none; } .want-sticky-header .main-header .sticky-header{ position:relative; display:none; }
💾 Kaydet
İptal
📝 Yeniden Adlandır
İptal
Kaydet
🔐 Dosya İzinleri (chmod)
İzin Değeri:
Hızlı Seçim:
777
755
644
600
777
= Herkes okur/yazar/çalıştırır
755
= Sahip tam, diğerleri okur/çalıştırır
644
= Sahip okur/yazar, diğerleri okur
600
= Sadece sahip okur/yazar
İptal
Uygula