/*!
Theme Name: RCBB 2024
Theme URI: https://littleworkshop.ro
Author: LightPixel
Author https://littleworkshop.ro
Description: Theme created by littleworkshop
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: rcbb
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/


/* ---------------------------------------------------------------------------------------------------------------------------------------- */
/*	GENRAL STUFF	*/
body {margin: 0;font-family:"Open Sans",sans-serif;font-size:19px;color:#000;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
a,a:visited, a:active, a:link{text-decoration:none;color:inherit}
a:hover{color:#fba719;}

button, a, input{outline:none}
button, input{border-radius:0px !important;}

.clear{clear:both}

img {height: auto;max-width: 100%;}
img.alignleft{vertical-align:top;margin-right:45px;margin-bottom:45px;float:left}
img.alignright{vertical-align:top;margin-left:45px;margin-bottom:45px;float:right}

hr{border-color:#ddd}
.font0{font-size:0px;}
.container-large{width:1800px;margin:0 auto;max-width:90%;}
.clear{clear:both}

h1{font-size:60px;font-weight:300;margin-top:90px;margin-bottom:25px}
h2{font-size:30px;font-weight:300;margin-top:30px;margin-bottom:25px}
/* ---------------------------------------------------------------------------------------------------------------------------------------- */
/*	GENERAL EFFECTS	*/
@keyframes pop-in{
	0% { opacity: 0; transform: scale(0); }
	100% { opacity: 1; transform: scale(1); }
} 
@keyframes fade-in{
	0% { opacity: 0; }
	100% { opacity: 1; }
} 
@keyframes slide-left {
	0% { opacity: 0; transform: translateX(200px); }
	100% { opacity: 1; transform: translateX(0px); }
}  
@keyframes slide-right {
	0% { opacity: 0; transform: translateX(-200px); }
	100% { opacity: 1; transform: translateX(0px); }
} 
/* ---------------------------------------------------------------------------------------------------------------------------------------- */
.slide-left{animation:slide-left 1s ease-out;-webkit-animation:slide-left 1s ease-out;-moz-animation:slide-left 1s ease-out;-ms-animation:slide-left 1s ease-out;}
.slide-right{animation:slide-right .7s ease-out;-webkit-animation:slide-right .7s ease-out;-moz-animation:slide-right .7s ease-out;-ms-animation:slide-right .7s ease-out;}
.pop-in{animation:pop-in .7s ease-out;-webkit-animation:pop-in .7s ease-out;-moz-animation:pop-in .7s ease-out;-ms-animation:pop-in .7s ease-out;}
.fade-in{animation:fade-in 4s ease-out;-webkit-animation:fade-in 4s ease-out;-moz-animation:fade-in 4s ease-out;-ms-animation:fade-in 4s ease-out;} 
.fade-in-fast{animation:fade-in 1s ease-out;-webkit-animation:fade-in 1s ease-out;-moz-animation:fade-in 1s ease-out;-ms-animation:fade-in 1s ease-out;} 

.off-right{transform: translateX(-2000px)}
.off-left{transform: translateX(2000px)}
.off-pop{opacity: 0; transform: scale(0);}
/* ---------------------------------------------------------------------------------------------------------------------------------------- */
/*	HEADER	*/
.site-header{background:#000;min-height:150px;color:#fff;font-size:16px;position:relative}
.header{position:absolute;top:0px;left:0px;width:100%; background-image: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,0));z-index:100}
.logo-container{margin:30px 45px 30px 0px}
.logo-container img{max-width:110px;max-height:110px;width:auto;height:auto}
.menu-top ul, .lang-top ul{list-style:none;margin:0px;padding:0px;}
.menu-top ul li{display:inline-block;margin-right:25px;font-weight:700;border-bottom:solid 3px transparent;padding-top:25px;padding-bottom:22px;transition:all .8s}
.lang-top ul li{display:inline-block;margin-left:20px;font-weight:700;border-bottom:solid 3px transparent;padding-top:25px;padding-bottom:22px;transition:all .8s}
.lang-top ul li a{text-transform:uppercase;display:inline-block;font-weight:inherit;}
.menu-top ul li a{display:inline-block;font-weight:inherit}

.menu-top ul li a, .lang-top ul li a{color:#fff;transition:all .4s}

.menu-top ul li:hover,.lang-top ul li:hover{border-bottom:solid 3px #fba719}
.menu-top ul li:hover a, .lang-top ul li:hover a{transform:scale(1.07)}

.side-menu{position:fixed;left:-1000px;top:50%;list-style:none;margin:0;padding:0;margin-top:-100px;color:#fff;z-index:99994;transition:all .6s ease}
.side-menu li{min-width:40px;height:40px;line-height:40px;}
.side-menu li .bx{width:40px;height:40px;font-size:20px;line-height:40px;text-align:center;color:#fff;background:rgba(0,0,0,.5);vertical-align:top}
.side-menu li a span{opacity:0;transform:translateX(-500px);background:#fba719;transition:all .2s;height:40px;line-height:40px;display:inline-block;vertical-align:top;color:#fff;padding:0px 20px}
.side-menu li a:hover span{opacity:1;transform:translateX(0px)}
.side-menu li a:hover .bx{background:#fba719}
.float-right{transform:translateX(1000px);}
/* ---------------------------------------------------------------------------------------------------------------------------------------- */
/*	DESPRE NOI	*/
.despre-noi-container p{font-size:15px;white-space:pre-wrap}
.despre-noi-container h1{font-weight:300}
.despre-noi-container img{max-width:100px;max-height:100px;width:auto;height:auto}

.despre-noi-container .col{padding-bottom:70px;position:relative;margin-bottom:80px}
.despre-noi-container .more{position:absolute;bottom:0px;left:0px;width:100%;height:50px;}
.despre-noi-container .more a{display:inline-block;line-height:50px;width:450px;max-width:80%;border:solid 1px #000;font-size:15px}
.despre-noi-container .more a:hover{color:#fff;background:#fba719}
/* ---------------------------------------------------------------------------------------------------------------------------------------- */
/*	FOOTER	*/
.menu-bottom-container{background:#999999;color:#fff;padding-top:2em;padding-bottom:2em}
.copyright {margin-top:1.3em;margin-bottom:1.3em}
.copyright ul{list-style:none;margin:0px;padding:0px;}
.copyright ul li{display:inline-block;margin-left:2em}
.logo-footer img{max-width:160px;max-height:160px;width:auto;height:auto;}
/* ---------------------------------------------------------------------------------------------------------------------------------------- */
/*	CONTACT	*/
.wpcf7-form p,.wpcf7-form label, .wpcf7-form input, .wpcf7-form textarea{width:100%}
.wpcf7-form input, .wpcf7-form textarea{border:solid 1px #777;padding:5px 10px;margin-bottom:8px}
.wpcf7-form textarea{height:150px}
.wpcf7-form input[type="submit"]{width:auto}
/* ---------------------------------------------------------------------------------------------------------------------------------------- */
/*	PARALLAX	*/
.parallax{height:640px !important; min-height: 300px !important;background-size:cover !important;margin-bottom:60px}
.parallax-box{width:100%;height:100%;padding:125px 90px;background-image: linear-gradient(130deg, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.85) 50%, rgba(0,0,0,0) 100%);font-size:17px;color:#fff}
.parallax-box h1{color:#fff;font-size:45px;margin-top:0px;margin-bottom:75px}
.parallax-box h2{color:#fff;font-size:24px;margin-top:0px;margin-bottom:15px;}
.parallax-box p{white-space:pre-wrap;display:inline-block;width:1400px;max-width:100%}
.parallax .more{margin-top:60px}
.parallax .more a{display:inline-block;padding:15px 180px;border:solid 1px #fff;font-size:15px}
.parallax .more a:hover{color:#fff;background:#fba719}
/* ---------------------------------------------------------------------------------------------------------------------------------------- */
/* MIROSLAVA */
.miroslava{padding-bottom:40px}
.miroslava h1{font-size:60px;margin-top:0px;margin-bottom:75px}
.miroslava h2{font-size:30px;margin-top:0px;margin-bottom:15px;}
.miroslava p{white-space:pre-wrap;display:inline-block;font-size:16px;}
.miroslava-info{padding-left:100px;padding-top:80px}
.miroslava .more{margin-top:60px}
.miroslava .more a{display:inline-block;padding:15px 180px;border:solid 1px #000;font-size:15px}
.miroslava .more a:hover{color:#fff;background:#fba719}
/* ---------------------------------------------------------------------------------------------------------------------------------------- */
/*
.container-video{position: relative;height: 840px;z-index: 0;overflow:hidden}
*/
.container-video{position: relative;z-index: 0;overflow:hidden}
.back-video{ object-fit: cover;margin-top:-10%;width: 100%; height: calc(100vw * 9/16);}
/* ---------------------------------------------------------------------------------------------------------------------------------------- */
/*	RESPONSIVE	*/
@media screen and (max-width: 1600px) {
	body{font-size:18px}
}
@media screen and (max-width: 1440px) {
	body{font-size:18px}
	.parallax-box{font-size:16px;padding:90px 90px;}
	.parallax-box h1{font-size:40px}
	.parallax-box h2{font-size:18px}	
}
@media screen and (max-width: 1320px) {
	.menu-top ul li{margin-right:15px}
	.lang-top ul li{margin-left:10px}
	.lang-top ul li:first-child{margin-left:0px}
}
@media screen and (max-width: 1200px) {
	body{font-size:16px}
	.container-large{max-width:100%;}
	.parallax-box{font-size:15px;padding:40px}
	.parallax .more a, .miroslava .more a{display:inline-block;padding:15px 0px;text-align:center;width:100%;white-space:no-wrap}
	.parallax .more, .miroslava .more{width:80%;margin:0 auto;}
	.parallax{height:auto !important;}
	
	.copyright li, .copyright-text{padding:20px 0px 0px 0px}
	
	.miroslava-info{padding:80px 20px}
}

@media screen and (max-width: 900px) {
	.menu-top{position:absolute;top:0px;right:0px}
	.slogan{display:none}
	.mobile-menu{border:solid 1px #fff;background:none;color:#fff}
	.lang-top{border:none !important;text-align:right !important;position:absolute;top:0px;right:20px}	
	.lang-top li:hover{border-bottom:solid 3px transparent !important}
	.meniu{position:absolute;display:none;background:#000;top:70px;right:-20px;z-index:500}
	.meniu li{display:block !important;padding:20px 30px !important}
	
	.back-video{ object-fit: cover !important;margin-top:-10%;margin-left:-25%;width: 150%; height: calc(150vw * 9/16);}	
	.ratio{--bs-aspect-ratio: 65%;}
}

@media all and (-webkit-min-device-pixel-ratio : 1.5) {
	.parallax{background-size:initial !important;}
}
