/*
Theme Name: SPS zrt
Theme URI: https://spsrt.com/
Author: https://spsrt.com/
Author URI:https://spsrt.com/
Description: https://spsrt.com/
Requires at least: 5.9
Tested up to: 6.3
Requires PHP: 5.6
Version: 1.5
License: 
License URI: https://spsrt.com/
Text Domain: https://spsrt.com/
Tags: 


*/
.navbar{
    background-color: #333333 !important;
}
.navbar-brand{
    letter-spacing: 2px;
    font-size: 30px;    
}
.navbar ul li a{
    color: #fff !important;
}

.navbar ul li a:hover{
    border-bottom: 1px solid #fff;
    padding-bottom: 2px;
}
.carousel-item{
    height:100vh;
    min-height: 400px;
    background: no-repeat center center;
    background-size: cover;
}

.carousel-caption{
    position:realtive;
    bottom:25%;
    width:50%;
    left: 50%;
    transform: translate(-50%,-50%);

}

#company hr{
    width:70%;
    height: 2px;
    background: rgb(228, 228, 228);
}
#company{
    width: 100%;
}
#company h2{
    color: #4caac9;
}

#services h3{
    color: #4caac9;
}

#services hr{
    height: 2px;
    background: rgb(228, 228, 228);
}

#services{
    background: rgb(250, 250, 250);    
}
#services h2{
    color: #4caac9;
}

#about hr{
    width:400px;
    height: 2px;
    background: rgb(228, 228, 228);
}
#about{
    width: 100%;
    padding: 70px;
}

#about h2{
    color: #4caac9;
}

#services .btn{
    background: rgb(37, 73, 236);
}

#services .btn:hover{
    background:rgb(20, 43, 148);
    transition: all 0.6s ease-in-out;
}
.card-header{
    background-color: #3490ae;
    color:rgb(250, 250, 250)
}
.card-body{
    background: rgb(250, 250, 250);
}

#frequently .btn:hover{
    color:rgb(255, 255, 255);
}

#frequently{
    width: 100%;
    padding: 70px;
}

#frequently hr{
    width:400px;
    height: 2px;
    background: rgb(228, 228, 228);
}

#frequently h2{
    color: #4caac9;
}

#contact hr{
    width:70%;
    height: 2px;
    background: rgb(228, 228, 228);
}
#contact{
    width: 100%;
    padding: 70px;
}

#contact h2{
    color: #4caac9;
}

@media (min-width: 768px) {
    .navbar-brand{
        letter-spacing: 2px;
        font-size: 30px;
    }
    .navbar ul li a{
        color: #fff !important;
    }
    
    .navbar ul li a:hover{
        border-bottom: 1px solid #fff;
        padding-bottom: 2px;
    }
    .carousel-item{
        height:100vh;
        min-height: 400px;
        background: no-repeat center center;
        background-size: cover;
    }
    
    .carousel-caption{
        position:realtive;
        bottom:25%;
        width:50%;
        left: 50%;
        transform: translate(-50%,-50%);
    
    }
    
    #company hr{
        width:400px;
        height: 2px;
        background: rgb(228, 228, 228);
    }
    #company{
        width: 100%;
        padding: 70px;
    }
    
    #about hr{
        width:400px;
        height: 2px;
        background: rgb(228, 228, 228);
    }
    #about{
        width: 100%;
        padding: 70px;
        background: rgb(250, 250, 250);
    }

    #about h2{
        color: #4caac9;
    }
    
    #contact h2{
        color: #4caac9;
    }

    #contact hr{
        width:400px;
        height: 2px;
        background: rgb(228, 228, 228);
    }
    #contact{
        width: 100%;
        padding: 70px;
    }
    
    #services {
        background: rgb(250, 250, 250);
    }

    #services div:not(:first-child){
        box-shadow: 3px 3px 3px 2px rgb(236, 236, 236);
        padding:15px;
    }

    #services hr{
        width:400px;
        height: 2px;
        background: rgb(228, 228, 228);
    }
        
    #services .btn{
        background: rgb(37, 73, 236);
    }

    #services .btn:hover{
        background:rgb(20, 43, 148);
        transition: all 0.6s ease-in-out;
    }

    #frequently h2{
        color: #4caac9;
    }

    #frequently{
        width: 100%;
        padding: 70px;
    }

    #frequently hr{
        width:400px;
        height: 2px;
        background: rgb(228, 228, 228);
    }
}