@charset "UTF-8";

header{
    position:relative;
}

header .info-box{
    display:flex;
    flex-flow:row nowrap;
    width:50%;
    height:180px;
    position:absolute;
    bottom:0;
    right:0;
    z-index:3;
    background-color:var(--dark-color);
}

header .info-box > div{
    width:50%;
    position: relative;
}

header .info-box > div:first-child{
    padding:1.5rem;
}

header .info-box > div:first-child p{
    margin-top:0;
    margin-bottom:1rem;
}

header .info-box > div:first-child h5{
    color:#fff;
}

header .info-box > div > .container{
    padding:1.5rem;
    position: absolute;
    z-index:2;
    height:100%;
    display:flex;
    flex-flow: column wrap;
    justify-content:center;
    background-color:rgba(0,0,0,0.5);
}

header .info-box > div > .container > h3{
    color:#fff;
}

header .info-box > div > .container > h3 > span{
    display:block;
    font-weight:300;
}

header .info-box > div > .container  a{
    margin-top:0.5rem;
    display:inline-block;
    width:auto;
    color:var(--secondary-color);
    font-weight:600;
    text-decoration:none;
}

header .info-box:hover .background > img,
header .info-box:focus .background > img,
header .info-box:active .background > img{
    transform:scale(1.2);
}

header .info-box > div > .background{
    position:absolute;
    z-index:1;
    height:100%;
}

header .info-box > div > .background > img{
    transition:transform 0.3s ease-in-out;
}

header,
header .swiper-wrapper,
header .swiper-wrapper .swiper-slide{
    height:100vh;
}

header .swiper-wrapper .swiper-slide{
    position:relative;
}

header .swiper-wrapper .swiper-slide .container{
    display:flex;
    align-items:center;
    justify-content:center;
    position:absolute;
    height:inherit;
    z-index:2;
    background:rgb(29,37,43);
    background:linear-gradient(90deg, rgba(29,37,43,1) 0%, rgba(29,37,43,0) 100%);
}

header .swiper-wrapper .swiper-slide .container .button{
    margin-top:1rem;
}

header .swiper-wrapper .swiper-slide .background{
    position:absolute;
    z-index:1;
}

#indexMain p:last-child{
    margin-bottom:0;
}

#indexServices .box{
    background-color:var(--secondary-color);
    padding:2rem;
}

#indexServices .box span{
    font-size:4rem;
    color:var(--dark-color);
}

#indexServices .box h5{
    color:var(--dark-color);
}

#indexServices .box p{
    margin-bottom:0;
    color:var(--dark-color);
}

#indexServices img{
    margin-bottom:2rem;
}

#indexBlog .container{
    height:100%;
    min-height:600px;
    position:relative;
}

#indexBlog .container .background{
    position:absolute;
    z-index:1;
}

#indexBlog .container .solar{
    position: absolute;
    z-index:2;
    display:flex;
    align-items:center;
}

#indexBlog .container .solar .button.secondary.outline{
    color:#fff;
}

#indexBlog .post-boxes{
    margin-top:3rem;
}

#indexStats .stats{
    margin-top:3rem;
}

#indexStats .stats h2{
    color:var(--secondary-color);
    font-weight:700;
    font-size:3rem;
}

@media(max-width:1199px){
    header .info-box{
        width:65%;
    }
}

@media(max-width:991px){
    header{
        text-align:center;
    }

    header .info-box{
        width:75%;
    }

    #indexMain .title{
        text-align:center;
        margin-bottom:2rem;
    }

    #indexServices .title{
        text-align:center;
    }

    #indexServices .box{
        margin-top:2rem;
    }

    #indexBlog .title{
        text-align:center;
    }
    
    #indexBlog .container .background img{
        object-position: center top;
    }

    #indexStats img{
        display:block;
        margin:0 auto;
        max-width:350px;
    }

    #indexStats .title,
    #indexStats .stats{
        text-align:center;
    }
}

@media(max-width:767px){
    header .info-box{
        width:50%;
    }

    header .info-box > div:first-child{
        width:100%;
    }

    header .info-box > div:last-child{
        display:none;
    }
}

@media(max-width:575px){
    header{
        height:calc(100vh + 170px);
    }
    header .info-box{
        width:100%;
        height:170px;
    }
}