@import url("open-sans.css");

:root {
    --theme-color-green: #033932;
    --theme-color-text: #fff;
}


*{padding: 0; margin: 0; box-sizing: border-box;}
img{border: none; display: block;}
a{outline: none !important; text-decoration: none; transition: all 0.3s ease-in-out;}
a:hover{text-decoration: underline;}
ul{list-style: none !important;}

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}
.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */

body{
    font-family: "Inter", sans-serif !important;
    font-size: 15px;
    line-height: 1.7;
    font-weight: 400;
    color: var(--theme-color-text) !important;
    background-color: var(--theme-color-green) !important;
    overflow: hidden;
}

p{font-family: "Open Sans" !important;}

body::before{width: 100% !important; box-shadow: none !important; position: relative !important;}

.container{max-width: 1170px;}

.mobile-nav{display: none; position: fixed; width: 100%; height: 100%; left: 0; top: 0; background-color: var(--theme-color-green); z-index: 9999999999; transition: all 0.3s ease-in-out; opacity: 0; padding: 125px 30px;}
.mobile-nav.open{display: block; opacity: 1;}
.mobile-nav ul{padding: 0 !important; margin: 0 !important; font-size: 30px; line-height: 34px; font-weight: 300;}
.mobile-nav ul li{margin: 0 0 10px;}
.mobile-nav ul li a{color: #fff;}

.burger {
    width: 45px;
    height: 45px;
    border-radius: 10px;
    /*background: #07475a;
    box-shadow: rgb(136 165 191 / 28%) 6px 2px 16px 0px, rgb(255 255 255 / 50%) -6px -2px 16px 0px;*/
    cursor: pointer;
    /*display: flex;
    display: none;*/
    justify-content: center;
    align-items: center;
    padding: 5px;
    transition: all .5s ease;
    float: right;
    position: fixed;
    top: 15px;
    right: 15px;
    z-index: 999999999999;
    margin: 0 auto;
}
.burger.active {
    /*background: rgb(56 56 56);
    background: #07475a;*/
}
.burger-strip {
    transition: all .5s ease;
}
.strip div {
    height: 1px;
    border-radius: 0;
    background: #fff;
    margin: 10px;
    transition: all .55s cubic-bezier(0.075, 0.82, 0.165, 1);
    width: 30px;
}
/*.burger-strip div:first-child {
    width: 16px;
}
.burger-strip div:last-child {
    width: 28px;
}*/
/*.burger:hover .burger-strip div:first-child,*/
.burger.active .burger-strip div:first-child {
    width: 15px;
    transform: rotate(45deg) translateY(2px) translateX(6px);
}
/*.burger:hover .burger-strip div:nth-child(2),*/
.burger.active .burger-strip div:nth-child(2) {
    transform: rotate(-45deg);
}
/*.burger:hover .burger-strip div:last-child,*/
.burger.active .burger-strip div:last-child {
    width: 15px;
    transform: rotate(45deg) translateY(-13.8px) translateX(6px);
}

.text-right{text-align: right;}

.theme-button{display: inline-block; font-size: 16px; font-weight: 600; line-height: 1.2; color: var(--theme-color-text) !important; background-color: var(--theme-color-yellow) !important; border-radius: 13px; border: none; padding: 12px 24px;}
.theme-button:after {
    content: "\f105";
    font-family: FontAwesome;
    margin: 0 0 0 15px;
    font-weight: 900;
    font-size: 18px;
 }
.theme-button:hover{text-decoration: none; background-color: #fff !important;}

/* Header */
header{position: relative; padding: 40px 0;}
    header p:last-child{margin: 0 !important;}

    header .logo-cont{}
        header .logo-cont a{font-size: 34px; line-height: 40px; color: #fff;}
            header .logo-cont a:hover{text-decoration: none;}
        header .logo-cont img{max-width: 240px;}
        nav{float: right; clear: both;}
            nav ul{padding: 5px 0 0 !important; margin: 0 !important; font-size: 20px; line-height: 24px; font-weight: 400; float: left;}
                nav ul li{float: left !important; margin: 0 0 0 30px; position: relative;}
                    nav ul li a{color: var(--theme-color-text); }
                        nav ul li > a:hover,
                        nav ul li.current-menu-item > a,
                        nav ul li.current-menu-parent > a{text-decoration: none; color: var(--theme-color-text) !important;}                  


/* Body */
main{}
    main p:last-child{margin: 0 !important;}

    .film-list{padding: 25px 0 40px;}
        .film-list h1{font-size: 42px; line-height: 50px; color: #fff; font-weight: 300; margin: 0 0 40px;}
        .film-list .movie-block{margin: 0 0 30px;}
            .film-list .movie-block a{color: #fff;}
                .film-list .movie-block a:hover{text-decoration: none;}
            .film-list .movie-block img{margin: 0 0 10px; transition: all 0.3s ease-in-out;}  
                .film-list .movie-block a:hover img{opacity: 0.5;}
            .film-list .movie-block h3{font-size: 18px; line-height: 24px; font-weight: 400; margin: 0;}

    .film-details{padding: 25px 0 40px;}
        .film-details .film-content{padding: 0 0 0 5%;}
            .film-details .film-content .film-content-block{padding: 0 0 60px;}
                .film-details .film-content .film-content-block img{margin: 0 0 15px;}
                .film-details .film-content .film-content-block a:hover{opacity: 0.7;}
        .film-details h1{font-size: 36px; line-height: 40px; color: #fff; font-weight: 300; margin: 0 0 40px;}
        .film-details h2{font-size: 18px; line-height: 24px; color: #fff; font-weight: 600; margin: 0 0 20px; text-transform: uppercase;}
        .film-details p{font-size: 15px; line-height: 18px; margin: 0 0 15px;}

    .inner-main{padding: 25px 0 40px;}
        .inner-main h1{font-size: 42px; line-height: 50px; color: #fff; font-weight: 300; margin: 0 0 40px;}
        .inner-main p{font-size: 18px; line-height: 24px; margin: 0 0 15px;}



/* Footer */
footer{padding: 55px 0; text-align: center;}
    footer p:last-child{margin: 0; font-size: 16px; line-height: 24px; color: var(--theme-color-text);}


.nopage-section{
  padding: 8rem 0 10rem;
  border-top: var(--theme-color-yellow) 15px solid;
}

.nopage-section .error{
  font-size: 150px;
  color: #07475a;
  text-shadow: 
    1px 1px 1px #0d6986,    
    2px 2px 1px #0d6986,
    3px 3px 1px #0d6986,
    4px 4px 1px #0d6986,
    5px 5px 1px #0d6986,
    6px 6px 1px #0d6986,
    7px 7px 1px #0d6986,
    8px 8px 1px #0d6986,
    25px 25px 8px rgba(0,0,0, 0.2);
}

.nopage-section .page{
  margin: 2rem 0;
  font-size: 20px;
  font-weight: 600;
  color: #444;
}

.nopage-section .back-home{
  display: inline-block;
  border: 2px solid var(--theme-color-blue);
  color: #fff;
  text-transform: uppercase;
  font-weight: 600;
  padding: 0.75rem 1rem 0.6rem;
  transition: all 0.2s linear;
  box-shadow: 0 15px 15px -11px rgba(0,0,0, 0.4);
  background: var(--theme-color-blue);
}
.nopage-section .back-home:hover{
  background: var(--theme-color-blue);
  color: #fff;
  opacity: 0.7;
  text-decoration: none;
}

#cmplz-document{max-width: 100% !important;}
.cmplz-soft-cookiewall{background-color: rgba(0, 0, 0, 0.2) !important;}



/* Media Query */
@media screen and (max-width: 1700px) {

}

@media screen and (max-width: 1600px) {

}

@media screen and (max-width: 1500px) {

}

@media screen and (max-width: 1400px) {

}

@media screen and (max-width: 1300px) {

}

@media screen and (max-width: 1200px) {

}

@media screen and (max-width: 1024px) {

}

@media screen and (max-width: 900px) {
}

@media screen and (max-width: 767px) {
header{padding: 25px 0;}
header .logo-cont a{font-size: 25px; line-height: 40px;}
footer{padding: 35px 0;}
}

@media screen and (max-width: 670px) {

}

@media screen and (max-width: 550px) {

}

@media screen and (max-width: 480px) {

}