/*-------------------------------------------------------------------------------------------*/
/* Main Banner ||---------------------------- */
/*-------------------------------------------------------------------------------------------*/
.banner_slider{
position: relative;
height: 100vh;
}
.banner_static {
background: url(../images/banner/construction_banner.jpg);
background-size: cover;
overflow: hidden;
background-attachment: fixed;
height: 100vh;
position: relative;
}
.banner_static p{
color:#222
}
.banner_content {
position: absolute;
right: 0px;
bottom: 0px;
padding: 100px;
width: 50%;
background: #e8a20d;
color: #fff;
}
.banner_content .btn-text {
border:none;
position:relative;
z-index:1;
}
.solid_show:hover{
background: #1d1d1d !important;
border-color: #1d1d1d !important;
color: #fff;
}
@media (min-width: 768px) and (max-width: 991px) {
.banner_content {
padding: 50px;
width: 65%;
}
}
@media (max-width: 767px) {
.banner_content {
width: 88%;
text-align: center;
padding: 40px 20px;
margin: 0 auto;
left: 0;
bottom: 50%;
transform: translateY(50%);
}
}
@media (max-width: 400px) {
.banner_stetic{
height:75vh;
}
}
/*sec_tital*/
.sec-title {
position: relative;
}
.sec-title h2 {
position: relative;
color: #1d1d1d;
font-size: 36px;
font-weight: 700;
line-height: 1.2em;
padding-bottom: 15px;
}
.sec-title h2:before {
position: absolute;
content: '';
left: 0px;
bottom: 0px;
width: 270px;
border-bottom: 2px solid #e4e4e4;
}
.sec-title h2:after {
position: absolute;
content: '';
left: 0px;
bottom: 0px;
width: 70px;
border-bottom: 5px solid #ffb200;
}
.center_bdr h2:before, .center_bdr h2:after{
left: 50%;
transform: translateX(-50%);
}
@media (max-width:767px){
.sec-title h2{
font-size:28px;
}
.about_comp h2{
font-size:20px;
}
}
/*banner_bottum*/
.about_comp h2 {
margin: 20px 0px;
}
.about_comp span {
color: #333 !important;
}
.about_comp p {
margin-bottom: 20px;
}
.about_box p {
margin: 0px;
}
.white_btn {
border: 1px solid #1d1d1d;
color: #1d1d1d;
}
.white_btn:hover {
color: #fff;
border-color: #1d1d1d;
background: #1d1d1d;
}
/***========Services Section===================== ***/
.services-section {
position: relative;
padding: 95px 0px 60px;
}
.services-block {
position: relative;
}
.services-block .inner-box {
position: relative;
display: block;
}
.services-block .inner-box .image {
position: relative;
}
.services-block .inner-box .image img {
position: relative;
width: 100%;
display: block;
}
.services-block .inner-box .image .overlay-box {
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
opacity: 0;
display: block;
padding: 30px 30px;
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: rgba(51,51,51,0.90)
}
.services-block .inner-box:hover .image .overlay-box {
opacity: 1;
}
.services-block .inner-box .image .icon-box {
position: absolute;
left: 0px;
width: 60px;
height: 60px;
line-height: 60px;
bottom: 0px;
top: auto;
color: #222;
font-size: 35px;
z-index: 1;
text-align: center;
background-color: #ffb200;
margin: 0px;
border-radius: 0px;
transform: inherit;
}
.services-block .inner-box .image .overlay-box .text {
position: relative;
color: #ffffff;
font-size: 14px;
line-height: 1.8em;
margin-bottom: 10px;
}
.services-block .inner-box .image .overlay-box .read-more {
position: relative;
float: right;
color: #fff;
font-size: 14px;
font-weight: 600;
font-family: 'Raleway', sans-serif;
}
.services-block .inner-box .image .overlay-box .read-more:hover {
color: #ffb200;
}
.services-block .inner-box .lower-box {
position: relative;
padding: 10px 0px;
border-bottom: 1px solid #ffb200;
}
.services-block .inner-box .lower-box h3 {
position: relative;
color: #333333;
font-size: 22px;
font-weight: 500;
line-height: 1.2em;
}
.services-block .inner-box .lower-box a {
color: #333333;
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;
}
.services-block .inner-box .lower-box a:hover {
color: #ffb200;
}
/*Porject*/
.booking-section {
overflow: hidden;
}
.bg-color {
background:#1d1d1d;
}
.left-block {
width: 50%;
float: left;
position: relative;
height: 630px;
}
.treatment {
float: right;
max-width: 650px;
padding: 0 60px 0;
width: 100%;
}
.light-color p, .light-color h2, .light-color {
color: #fff;
}
.bg-side {
background: url(../images/construction_video.jpg) 50% 50% /cover no-repeat;
}
.right-block {
width: 50%;
float: right;
position: relative;
height: 630px;
}
.tital_projct {
position: relative;
margin-top:25px;
}
@media (max-width:767px){
.tital_projct{
margin-top: 9px;
}
}
.tital_projct span {
opacity: 0.4;
display: block;
text-align: center;
font-size: 80px;
font-weight: 500;
color: #fff;
}
.tital_projct p {
position: absolute;
color: #fff;
top: 0px;
left: 50%;
margin: 0px;
transform: translate(-50%);
}
.project_ditail {
margin-top: 35px;
}
.project_ditail h2{
line-height: 1.58;
}
.project_ditail h2, .project_ditail p {
margin-bottom:25px;
line-height: 1.82;
}
@media (min-width: 992px) and (max-width: 1199px) {
.services-block .inner-box .image .overlay-box{
padding:20px;
}
.services-block .inner-box .image .overlay-box .text{
font-size:12px;
}
.treatment{
padding: 20px;
float: none;
}
.tital_projct p{
width: 100%;
text-align: center;
}
}
@media (max-width: 991px) and (min-width: 768px) {
.services-block .inner-box .image .overlay-box{
padding:20px;
}
.services-block .inner-box .image .overlay-box .text{
font-size:14px;
}
.treatment {
padding-left: 10px;
padding-right: 10px;
}
.right-block, .left-block {
width: 100%;
display: none;
}
.treatment {
margin: 0 auto;
float: none;
padding-bottom: 0;
}
}
@media (max-width: 767px) {
.project_ditail h2{
font-size:25px;
}
.tital_projct span{
font-size:40px;
}
.left-block {
height: auto;
width: 100%;
}
.booking-section {
width: 100%;
}
.treatment, .right-block, .left-block {
height: auto;
}
.right-block {
height: auto;
}
.treatment{
padding: 30px 15px 40px;
float: none;
margin: 0 auto;
max-width: 480px;
width: 100%;
}
.tital_projct p{
width: 100%;
text-align: center;
}
}
/*video_sec*/
.video_sec {
background: url(../images/construction_video.jpg);
position: relative;
background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed;
height: 500px;
}
.bg-black {
background-color: #000;
}
.opacity-extra-medium {
position: absolute;
height: 100%;
width: 100%;
opacity: 0.7;
top: 0;
left: 0;
}
.pop_section a img {
width: 150px;
}
.pop_section h4, .pop_section p {
color: #fff;
}
.bg_black {
background: #1d1d1d;
}
.margin_top {
margin-top: -140px;
}
.left_hedding h2 {
color: #fff;
line-height: 1.5;
margin-bottom: 0;
}
.right_big_text p {
font-size: 20px;
line-height: 1.5;
margin: 0px;
}
.bg_yellow {
background: #e8a20d;
color: #222;
}
@media (min-width: 768px) and (max-width: 991px) {
.video_sec {
height: auto;
}
.margin_top {
margin: 0px;
}
.left_hedding h2 {
font-size: 25px;
}
.reponsive_full{
width: 100%;
}
}
@media (max-width: 767px) {
.margin_top {
margin-top: 0;
text-align: center;
}
.video_sec {
height: auto;
}
.left_hedding h2{
font-size: 28px;
}
}
/*=======Blog Section=========*/
.latest__block-post {
padding: 20px;
background: #fff;
}
.latest__block .more_btn__block {
margin-top: 10px;
}
.latest__block-title {
font-size: 20px;
font-weight: 800;
}
.latest__block-title:hover a {
color: #f6bb18;
}
.team__block-section .team-member {
margin-bottom: 0;
}
.more_btn__block {
color: #222 !important;
font-weight: bold;
display: inline-block;
margin-top: 30px;
}
@media (max-width: 767px) {
.more_btn__block {
margin-top: 0;
}
}
/*tetstimonial*/
.testimonial-box {
text-align: left;
}
.testimonial-block__section .quote-box {
padding-right: 30px;
}
.testimonial-block__section .quote-left {
padding-top: 0;
}
.testimonial-block__section .quote-icon i {
font-size: 30px;
}
.quote-text {
padding-left: 30px;
padding-top: 10px;
}
.quote-text p{
color:#222;
}
.quote-right {
text-align: right;
}
.quote-author {
float:none;
text-transform: uppercase;
padding-left: 30px;
}
@media (max-width:767px){
padding-left:0;
}
.owl-nav {
position: static;
}
.testimonial-box img{
max-width:300px;
margin-left:auto;
margin-right:auto;
}
.nf-carousel-theme.nf-carousel-arrow .owl-controls .owl-prev:hover, .nf-carousel-theme.nf-carousel-arrow .owl-controls .owl-next:hover {
border: 2px solid #fab702;
color: #fff;
background: #fab702;
}
@media (max-width: 767px) {
.testimonial-block__section .quote-left {
padding-top: 26px;
}
.nf-carousel-theme.nf-carousel-arrow .owl-controls .owl-prev, .nf-carousel-theme.nf-carousel-arrow .owl-controls .owl-next {
top: auto;
bottom: -57px;
}
}
.owl-carousel .owl-controls .owl-nav .owl-prev, .owl-carousel .owl-controls .owl-nav .owl-next, .owl-carousel .owl-controls .owl-dot {
cursor: pointer;
cursor: hand;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.owl-prev {
left: 0;
opacity: 1;
}
.owl-prev, .owl-next {
width: 40px;
height: 40px;
line-height: 40px;
text-align: center;
display: block;
position: absolute;
background: rgba(255, 255, 255, 0.33);
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
background: rgba(245,245,245,0.8);
color: #252525;
display: block;
top: 50%;
transition: all 0.25s ease 0s;
-o-transition: all 0.25s ease 0s;
-moz-transition: all 0.25s ease 0s;
-webkit-transition: all 0.25s ease 0s;
z-index: 3;
position: absolute;
text-align: center;
}
.owl-prev {
left: 0;
}
.owl-prev, .owl-next {
position: absolute;
top: 0;
height: 100%;
width: 0;
background: rgba(25, 169, 153, 0.56);
-webkit-transition: all 0.4s ease 0s;
-moz-transition: all 0.4s ease 0s;
-ms-transition: all 0.4s ease 0s;
-o-transition: all 0.4s ease 0s;
transition: all 0.4s ease 0s;
font-size: 25px;
overflow: hidden;
color: #fff;
text-align: center;
}
/*Team*/
figure.effect-zoe figcaption {
background: #e8a20d;
}
figure.effect-zoe p.description {
background: rgba(232, 162, 13, 0.68);
}
.grid figure.effect-zoe img {
/* width: 100%; */
display: block;
margin: 0 auto;
}
.grid figure.effect-zoe {
margin: 0px;
border: 2px solid #ffc527;
padding: 20px 20px 0;
}
@media (min-width: 992px) and (max-width: 1199px) {
figure.effect-zoe figcaption {
padding: 10px;
}
figure.effect-zoe p.icon-links a span::before {
padding: 8px 6px;
}
}
/* ===================================================================================================== */
/*Work Section*/
/* ===================================================================================================== */
.project_bg .sec-title {
float: left;
}
.project_bg .sec-title h2 {
color: #fff;
}
.project_bg {
background: url(../images/project_bg.jpg);
position: relative;
background-repeat: no-repeat;
background-size: cover;
background-attachment: fixed;
}
.project_bg:before {
position: absolute;
content: "";
top: 0px;
left: 0px;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.69);
}
.container-filter {
margin-top: 0;
margin-right: 0;
margin-left: 0;
margin-bottom: 10px;
padding: 0;
}
.container-filter li {
list-style: none;
display: inline-block;
margin-bottom: 0px;
}
.container-filter li a {
margin: 0px 4px 0px 0px;
font-size: 13px;
cursor: pointer;
border-radius: 3px;
border: none;
padding: 10px 15px;
position: relative;
display: inline-block;
-webkit-transition: color .3s ease-in-out, background-color .3s ease-in-out, border-color .3s ease-in-out;
transition: color .3s ease-in-out, background-color .3s ease-in-out, border-color .3s ease-in-out;
border: 1px solid transparent;
}
.container-filter li a.active, .container-filter li a:hover {
color: #787878;
background: #fff;
}
.item-box {
position: relative;
overflow: hidden;
display: block;
}
.item-box a {
display: inline-block;
}
.item-box {
position: relative;
overflow: hidden;
display: block;
border: 1px solid #e8a20d;
}
.item-box img {
width: 100%;
}
.gallery-heading h4 {
margin-bottom: 0;
}
.gallery-heading h4 a {
color: #fff;
}
.gallery-heading h4 a:hover {
color: #daa106;
}
.gallery-heading {
transition: all 0.2s linear 0s;
-webkit-transition: all 0.2s linear 0s;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
color: #fff;
z-index: 1;
background: #333;
text-align: center;
padding-bottom: 10px;
}
.gallery-heading p {
margin-bottom: 0;
}
.item-container {
-webkit-transform: translateY(0px);
transform: translateY(0px);
width: 100%;
transition: transform .25s;
}
.item-box:hover .item-container {
-webkit-transform: translateY(-70px);
transform: translateY(-70px);
}
.item-box > a {
display: block;
position: relative;
z-index: 2;
}
@media (min-width: 992px) and (max-width: 1199px) {
.container-filter li a{
padding: 9px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.project_bg .sec-title {
width: 100%;
text-align: center;
}
.project_bg .sec-title h2:before,.project_bg .sec-title h2:after{
right:0;
margin-left:auto;
margin-right:auto;
}
.container-filter {
float: left;
margin-top: 20px;
width: 100%;
text-align: center;
}
}
@media (max-width: 767px) {
.project_bg .sec-title {
width: 100%;
text-align: center;
}
.sec-title,.about_comp {
text-align:center;
}
.sec-title h2:before{
right:0;
margin-left:auto;
margin-right:auto;
}
.sec-title h2:after{
right:0;
margin-left:auto;
margin-right:auto;
}
.container-filter {
float: left;
margin-top: 20px;
}
.container-filter li{
margin-top:10px
}
.container-filter li a {
margin: 0px 4px 5px 0px;
}
}
/*-------------------------------------------------------------------------------------------*/
/* Counter STYLE ||---------------------------- */
/*-------------------------------------------------------------------------------------------*/
.fact-counter-wrapper {
position: relative;
background: url(../images/numberingscore.jpg) no-repeat;
background-size: cover;
width: 100%;
background-position: center center;
}
.fact-counter-wrapper:before {
background-color: rgba(0, 0, 0, 0.68);
left: 0;
top: 0;
position: absolute;
width: 100%;
height: 100%;
content: "";
}
.single-fact {
text-align: center;
display: inline-block;
}
.single-fact .icon-boxed {
width: 70px;
height: 70px;
font-size: 45px;
color: #e3ba67;
text-align: center;
line-height: 74px;
margin: 0 auto;
position: static;
transform: translate(0, 0);
-webkit-transform: translate(0, 0);
}
.single-fact span {
padding: 4px 0;
line-height: 1.2;
display: block;
font-size: 40px;
color: #fff;
font-weight: 700;
}
.fact-counter-wrapper h2 {
font-size: 36px;
line-height: 42px;
color: #fff;
margin: 0;
margin-bottom: 27px;
}
.single-fact p {
margin: 0;
font-size: 15px;
text-transform: uppercase;
color: #fff;
font-weight: 500;
}
.single-fact .icon-box i:before {
font-size: 50px;
}
.overlay-dark, .overlay-dark80, .overlay-light, .overlay-light80 {
position: relative;
z-index: 1;
}
.dark-bg p, .dark-bg h2, .dark-bg h6 {
color: #fff;
}
.overlay-dark80:before {
background-color: rgba(0, 0, 0, 0.90);
}
.overlay-dark:before, .overlay-dark80:before, .overlay-light:before, .overlay-light80:before, .tp-bgimg:before {
left: 0;
top: 0;
position: absolute;
width: 100%;
height: 100%;
content: "";
z-index: -1;
}