/*
Theme Name: Cravata Galbena
Author: Andweb
Author URI: https://www.andweb.ro/
Description: A custom theme for WordPress.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: cravata-galbena
*/
@font-face {
  font-family: 'Oswald';
  src: url('fonts/Roundark.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}

@keyframes zoomIn {
    to {
        transform: scale(1);
    } 
}
input,textarea{
    color:#FFF;
}
html{
	background: #01020D;
	margin: 0;
	padding: 0;
}
body{
	background: #01020D;
	padding: 15px 0 0 0;
}
.site-main{
	margin: 5px 25px 15px 25px;
}
.menu-toggle{
	display: block;
	background: none;
    color: #fff;
    font-size: 26px;
    border: 1px solid #fff;
    padding: 0px 10px;
    border-radius: 15px;
    margin: 0 0 0 auto;
    right: 20px;
    position: relative;
    z-index: 1002;
}
.program-proiectii-table tbody,.program-proiectii-table td,.program-proiectii-table tfoot,.program-proiectii-table th,.program-proiectii-table thead,.program-proiectii-table tr {
    border-color: inherit;
    border-style: solid;
    border-width: 0;
    color: #fff;
    border: 1px solid;
    padding: 10px;
}
.program-proiectii-table{
    margin:30px 0 0 0;
}
.program-proiectii-table table{
    margin:auto;
}
header{
    position:fixed;
    right:1vw;
    z-index:999999;
}
.menu{
	display: flex;
    flex-direction: row;
    gap: 40px;
    justify-content: center;
    text-align: center;
    border: 1px solid #34364E;
    border-radius: 25px;
    width: max-content;
    padding: 15px 27px;
    margin: 0 auto 0 auto;
    background:#000;
}
.menu li{
	list-style: none;
}
.overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  z-index: 1000;
}
.menu a{
	color: #fff;
	font-family: 'Inter', sans-serif;
	font-weight: 500;
	font-size: 13px;
	text-decoration: none;
}
.program-content-box{
    border:1px solid #34364E;
    border-radius:20px;
    padding:0;
    margin:20px 0;
}
.program-content-box.has-mg-right{
    margin-right:20px;
}
.program-cinema{
    color:#e5cb77;
    font-size:18px;
    font-weight:700;
    display: flex;
    border-bottom: 1px solid #34364E;
    padding-bottom: 15px;
    padding:20px 30px !important;
}
.program-cinema a{
    color:#e5cb77;
    font-size:18px;
    font-weight:700;
    text-decoration:none;
}
.program-content-box .available-hours{
    border-bottom: 1px solid #34364E;
    padding-bottom: 15px;
}
.border-bottom-none {
    border-bottom:0 !important;
}
.available-hours p{
    color:#DFE1F4;
    font-size:16px;
    font-weight:700;
    display: flex;
    padding: 0 30px !important;
}
.available-hours p::before{
    content: url("/wp-content/uploads/2025/11/clock.png");
    padding-right:5px;
}
.program-box h2,.program-box p{
    padding:10px 30px;
}
.program-cinema::before{
    content: url("/wp-content/uploads/2025/11/ticket-01.svg");
    padding-right:5px;
}
.is-active{
  	color: #000;
  	border: 1px solid #000;
  }
  .menu {
    flex-direction: column;
    background: rgba(255, 255, 255, 0.9);
    position: fixed;
    top: 0;
    right: -100%;
    width: 15%;
    height: 100%;
    padding: 100px 0 0 30px;
    transition: right 0.3s ease-in-out;
    z-index: 1001;
    text-align: left;
    border-radius: initial;
    display: block;
  }
  .menu a{
  	color: #000;
  	text-align: left;
  	font-size: 24px;
  	margin: 10px 0;
  	display: block;
  }

  .menu.active {
    right: 0;
  }

  .overlay.active {
    display: block;
}
#custom-popup {
    display: none;
    position: fixed;
    top: 25%; left: 13%;
    transform: translate(-50%, -50%);
    background: #fff;
    padding: 40px;
    max-width: 400px;
    width: 90%;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
    z-index: 9999;
    text-align: center;
}
#custom-popup-close {
    position: absolute;
    top: 10px; right: 10px;
    background: #eee;
    border-radius: 50%;
    width: 30px; height: 30px;
    line-height: 30px;
    text-align: center;
    cursor: pointer;
    font-weight: bold;
}
#custom-popup a{
    text-decoration:none;
}
#custom-popup button {
    border-radius: 50px;
    border:1px solid #000;
    background: #fff;
    color: #000;
    text-decoration: none;
    font-family: 'Inter', sans-serif;
    font-weight: 500;
    font-size: 16px;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    padding: 10px;
    margin:auto;
    text-align:center;
}
.hero-image {
    position: relative;
    height: 90vh;
    border-radius: 25px;
    background-size: cover;
    background-position: center;
    animation: zoomIn 2s ease-out forwards;
    transform: scale(0.2);
}
.redaction-team{
	position: absolute;
	z-index: 10;
	width: 80%;
	top: 5%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.ticket-image {
    display: block;
    width: 100%;
    height:initial;
}
.is-single .ticket-image{
    height:auto;
}
.ticket-image img,.ticket-image figure{
    display: block;
    width: 100%;
    height:initial;
    object-fit:contain;
}
.height-auto .ticket-image img,.height-auto .ticket-image figure,.height-auto .ticket-image{
    height:auto;
}
.white-background-partner{
    background:#FFF;
    padding:10px;
}
.hero-title {
	position: absolute;
	left: 35%;
	top: -100vw;
	transform: translate(-50%, -50%);
	animation: comeFromTop 2s ease-out forwards;
	opacity: 0;
}
.play-video{
    position:absolute;
    top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	z-index:2;
	width:5%;
}
.play-video img{
    opacity:1 !important;
    height:max-content !important;
}
.mt-15{
    margin-top:15px;
}
@keyframes comeFromTop {
	from {
		top: -100vw;
		opacity: 0;
	}
	to {
		top: 35%;
		opacity: 1;
	}
}
@keyframes Left {
	from {
		left: -100vw;
		opacity: 0;
	}
	to {
		left: 35%;
		opacity: 1;
	}
}
.redacted-by{
	position: absolute;
	left: -100vw;
	animation: Left 3s ease-out forwards;
	top: 50%;
	transform: translate(-50%,-50%);
}
.story{
	position: absolute;
	left: -100vw;
	animation: Left 3s ease-out forwards;
	top: 60%;
	transform: translate(-50%,-50%);
}
.cinema{
	position: absolute;
	left: -100vw;
	animation: Left 3s ease-out forwards;
	top: 80%;
	transform: translate(-50%,-50%);
}
.btns{
	position: absolute;
	left: -100vw;
	animation: Left 3s ease-out forwards;
	top: 90%;
	transform: translate(-50%,-50%);
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 20px;
}
.btns a{
	border-radius: 50px;
	background: #fff;
	color: #000;
	text-decoration: none;
	font-family: 'Inter', sans-serif;
	font-weight: 500;
	font-size: 20px;
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 10px;
	padding: 10px;
}
.info-film{
	background: url(/wp-content/uploads/2025/07/infofilm.png);
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    height: 12vw;
    position: relative;
    margin-top: 6.944444444444445vw;
}
.synopsis{
	background: url(/wp-content/uploads/2025/07/synopsis.png);
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
}
.distributia{
	background: url(/wp-content/uploads/2025/07/distributia.png);
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
}
.galerie{
	background: url(/wp-content/uploads/2025/07/galerie.png);
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
    margin-bottom: 50px;
}
.wpcf7-response-output{
    color:#FFF;
}
.info-film p{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	color: #fff;
	z-index: 10;
	font-size: 80px;
	font-family: 'Oswald';
	font-weight: 400;
	text-transform: uppercase;
}
.wpcf7-acceptance label{
    display:flex;
    gap:5px;
}
.wpcf7-acceptance input{
    margin:0 !important;
    width:15px !important;
}
.regie{
	text-align: left;
	font-family: 'Oswald';
	font-weight: 400;
	font-size: 22px;
	color: #fff;
	margin-top:4.861111111111112vw;
}
.nl-form{
    width:75%;
    margin:4.861111111111112vw auto 0 auto;
}
.nl-form .flex-contact{
    width:100%;
}
.nl-form .flex-contact p{
    display: block;
    width: -webkit-fill-available;
}
.contact-title{
	font-family: 'Oswald';
	font-weight: 400;
	font-size: 80px;
	color: #fff;
	line-height: 103%;
}
.buy-now-tickets{
	text-align: center;
	font-family: 'Oswald';
	font-weight: 400;
	font-size: 32px;
	color: #fff;
}
.logo-nl{
    width:15%;
    margin:auto;
}
.nl-title{
    font-family: 'Oswald';
	font-weight: 400;
	color:#FF0801;
	font-size:24px;
}
.oblique{
    font-family: 'Oswald';
	font-weight: 400;
	color:#fff;
	font-size:24px;
	text-align:center;
}
.nl-hl{
	text-align: center;
	font-family: 'Oswald';
	font-weight: 400;
	font-size: 24px;
	color: #fff;
}
.from-november{
    font-size:38px;
    font-weight:600;
    text-transform: uppercase;
	text-align: center;
	font-family: 'Oswald';
	color:#b1a183;
}
.regie strong{
	color: #fff;
}
.where-to-buy-tickets-list {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 50px;
    flex-wrap: wrap;
    width: 100%;
    justify-content: center;
    margin: 2.312321312321vw auto 0 auto;
}
.ticket-source{
	/*border: 1px solid #34364E;*/
	padding: 20px;
	position: relative;
	border-radius: 20px;
	width:10%;
}
.larg-width{
    width:20%;
}
.go-little-bigger .ticket-source{
    width:13%;
}
.medium-width{
    width:14%;
}
.source-a{
    color: #DFE1F4;
	font-family: 'Roundark' sans-serif;
	font-weight: 700;
	font-size: 14px;
	text-transform: uppercase;
	text-decoration: none;
	opacity: 50%;
    text-align:center;
}
.source-a a{
	position: absolute;
	bottom: 5%;
	left: 50%;
	transform: translate(-50%,-50%);
	color: #DFE1F4;
	font-family: 'Roundark' sans-serif;
	font-weight: 700;
	font-size: 14px;
	text-transform: uppercase;
	text-decoration: none;
	opacity: 50%;
}
.trailer{
	margin: 2.861111111111112vw 0;
	height:34vw;
	position:relative;
}
.trailer img{
	width: 100%;
	height:100%;
	cursor: pointer;
	object-fit:cover;
	opacity:0.7;
}
.footer-logo{
    width:7%;
}
.movie-info {
	width: 100%;
	margin: 20px auto 0 auto;
}
.movie-info p{
	color: #fff;
	font-size: 22px;
	font-weight: 400;
	font-family: 'Oswald';
}
.movie-info strong{
    transition: color 2s ease;
	color: #3E3E3E;
}
.movie-info strong.highlight-strong {
  color: #fff;
}
footer{
	margin-top: 9.722222222222223vw;
	border-top: 1px solid #34364E;
}
.footer-elements{
	padding-top: 30px;
	text-align: center;
	margin: auto;
}
.flex-socials{
	display: flex;
	align-items: center;
	gap: 20px;
	flex-direction: row;
    justify-content: center;
    margin-top: 30px;
    margin-bottom: 3.4722222222222223vw;
}
.flex-socials a{
	border-radius: 50px;
	border: 1px solid rgba(255, 255, 255, 0.35);
	padding: 10px;
    width: 45px;
    position: relative;
    height: 41px;
}
.flex-socials img{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.copyright{
	font-family: 'Inter', sans-serif;
	font-weight: 400;
	color: #F9F9F9;
	padding-bottom: 20px;
	opacity: 80%;
	font-size:14px;
}
.contact-box{
	width: 85%;
	margin: auto;
}
.default-text{
	font-family: 'Inter', sans-serif;
	font-weight: 400;
	font-size: 16px;
	color: #fff;
	line-height: 30px;
}
.flex-contact{
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 30px;
}
form label{
	font-family: 'Inter', sans-serif;
	color: #DFE1F4;
	font-weight: 400;
	font-size: 14px;
	line-height: 20px;
	display: block;
}
form input::placeholder, form textarea::placeholder{
	color: #34364E;
}
form input, form textarea{
	background: transparent;
	border-radius: 15px;
	border: 1px solid #34364E;
	box-shadow: 0px 1px 2px 0px #1018280D;
	padding: 10px;
	width: 100%;
	font-family: 'Inter', sans-serif;
	margin-top: 10px;
}
.wpcf7-submit{
	width: max-content !important;
	background: #fff !important;
	color: #000 !important;
	font-size: 16px;
	font-weight: 500;
	border-radius: 30px;
	padding: 10px 30px;
}
.contact-img img{
	height: 90vh;
	object-fit: cover;
	border-radius: 20px;
	object-position: top center;
}
@media screen and (max-width:991px){
    .program-content-box.has-mg-right{
        margin-right:0;
    }
    .ticket-source{
        width:20%;
    }
    .go-little-bigger .ticket-source{
        width:23%;
    }
    .where-to-buy-tickets-list{
        gap:20px;
    }
    .ticket-image{
        height:7.5vw;
    }
    .larg-width {
        width: 35%;
    }
    .medium-width{
        width:32%;
    }
	.contact-img img{
		height: 60vh;
	}
	.contact-title{
		font-size: 44px;
	}
	.contact-box{
		width: 100%;
	}
	.info-film{
		height: 20vw;
	}
	@keyframes Left {
		from {
			left: -100vw;
			opacity: 0;
		}
		to {
			left: 50%;
			opacity: 1;
		}
	}
}
@media screen and (max-width: 767px){
    #custom-popup{
        left:50%;
    }
    .flex-contact p{
        width:100%;
    }
    .go-little-bigger .ticket-source{
        width:85%;
    }
    .menu{
        width:85%;
    }
    .larg-width.is-single{
        width:80% !important;
    }
    .medium-width{
        width:70% !important;
    }
    .site-main{
        margin:5px;
    }
    .where-to-buy-tickets-list{
        gap:0;
    }
    .ticket-image {
        height: auto !important;
    }
    .ticket-image img, .ticket-image figure{
        height:auto;
    }
    .flex-contact{
        flex-direction:column;
        gap:0;
    }
    .flex-socials{
        flex-wrap:wrap;
    }
    .trailer iframe{
        height:100% !important;
    }
    .trailer{
        height:54vw;
    }
    .play-video{
        width:15%;
    }
    .logo-nl {
        width: 50%;
    }
    .from-november {
        font-size: 28px;
    }
    .footer-logo{
        width:50%;
    }
	.hero-image{
		background: url(/wp-content/uploads/2025/07/mobile.png) !important;
		background-size: cover !important;
		background-repeat: no-repeat !important;
		width: 100%;
		height: 55vh;
	}
	.info-film p{
		font-size: 55px;
        width: 100%;
        margin: auto;
        text-align: center;
	}
    .info-film {
        height: 35vw;
    }
    .regie{
    	width: 100%;
    	font-size: 20px;
    }
    .ticket-source{
    	width: 33%;
    	text-align: center;
    }
    .movie-info {
    	width: 90%;
	}
	@keyframes comeFromTop {
		from {
			top: -100vw;
			opacity: 0;
		}
		to {
			top: 16%;
			opacity: 1;
		}
	}
	.redaction-team{
		width: 95%;
	}
	.hero-title{
		left: 70%;
		width: 50%;
	}
	.redacted-by{
		left: 65% !important;
        width: 60%;
        top: 28%;
	}
	.btns a{
		font-size: 9px;
	}
	.btns{
		width: 100%;
		justify-content: center;
		top: 94%;
	}
	.btns img{
		width: 20px;
		height: 20px;
	}
	.story{
		width: 90%;
		top: 76%;
	}
	.cinema{
		width: 90%;
		top:81%;
	}
}