/* 
 Theme Name: legalhelp theme
 Description: Szablon strony Legal Help
 Version: 1.0 
 */

@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300&family=Libre+Baskerville&family=Nanum+Myeongjo&family=Roboto:wght@300&family=Syncopate&display=swap');

@media screen and (min-width: 1025px){
    :root{
        --screen-width: 1000px;
    }
}
@media screen and (min-width: 1200px){
    :root{
        --screen-width: 1200px;
    }
}
@media screen and (min-width: 1500px){
    :root{
        --screen-width: 1500px;
    }
}
html{
    scroll-behavior: smooth;
}

@media screen and (min-width: 1025px) {

    /**/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /*LANDING PAGE*/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /**/

    body{
        margin: 0;
        padding: 0;
        width: 100%;
        height: 100%;
        font-size: 16px;
    }
    .container{
        width: 100%;
        height: 100vh;
        position: relative;
        box-sizing: border-box;
    }


    /**/
    /*NAV STYLE*/
    /**/


    nav{
        width: 100%;
    }
    .nav-mobile{
        display: none;
    }
    .nav-desktop{
        height: auto;
        position: absolute;
        top: 0;
        left: 0;
        text-align: center;
        padding: 20px 0 20px 0;
        background-color: initial;
        width: 100%;
        z-index: 1000;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
    .nav-desktop-logo{
        width: 250px;
    }
    .nav-desktop-link{
        padding-left: 50px;
        padding-right: 50px;
    }
    .nav-desktop-link, .nav-desktop-link:focus, .nav-desktop-link:active, .nav-desktop-link:hover{
        text-decoration: none;
        color: #f2eee6;
        font-family: 'Lato', sans-serif;
        font-weight: 500;
    }



    /**/
    /*LANDING PAGE*/
    /**/


    .landing_page-container{
        background-image: linear-gradient(#2c2c2c, #f2eee6);
    }
    .landing_page-video{
        width: 100%;
        height: 100%;
        object-fit: cover
    }
    .landing_page-content{
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        text-align: center;
        z-index: 100;
    }
    .landing_page-header{
        font-family: 'Syncopate', sans-serif;
        color: #f2eee6;
        font-size: 7vh;
        margin: 0 0 10%;
    }
    .landing_page-button{
        background-color: #5198f9;
        border: none;
        cursor: pointer;
        padding: 15px 35px 15px 35px;
        border-radius: 30px;
        color: #f2eee6;
        font-family: 'Lato', sans-serif;
        transition: background-color 0.5s;
        font-size: 2vh;
        font-weight: bold;
    }
    .landing_page-button:hover{
        background-color: #357efc;
    }

   
    /**/
    /*WHY US*/
    /**/


    .why_us-container{
        background-color: #5198f9;
        color: #f2eee6;
        display: flex;
        align-items: center;
        min-height: 100vh !important;
    }
    .why_us-content{
        width: var(--screen-width);
        margin: auto;
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        align-content: center;
        padding: 100px 0 100px 0;
        box-sizing: border-box;
    }
    .why_us-header-container hr{
        width: 50%;
        height: 2px;
        background-color: #f2eee6;
        border: none;
        margin-bottom: 7%;
    }
    .why_us-header-container h2{
        font-size: 2.3vh;
        font-family: 'Syncopate', sans-serif;
    }
    .why_us-content p{
        font-size: 4vh;
        letter-spacing: 1px;
        font-family: 'Nanum Myeongjo', serif;
        align-self: flex-start;
    }


    /**/
    /*COMPLAINT PROCESS*/
    /**/

    .complaint_process-container{
        background-color: #f2eee6;
        min-height: 100vh !important;
    }
    .complaint_process-content{
        width: var(--screen-width);
        margin: auto;
        min-height: 100vh !important;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        padding: 100px 0 100px 0;
        box-sizing: border-box;
    }
    .complaint_process-top, .complaint_process-bottom{
        height: fit-content;
        width: 100%;
        order: 0;
        align-items: center;
        display: flex;
    }
    .complaint_process-bottom{
        align-items: stretch;
        padding-top: 100px;
    }
    .complaint_process-header{
        width: 70% !important;
    }
    .complaint_process-header div{
        width: fit-content;
    }
    .complaint_process-header h2{
        font-family: 'Syncopate', sans-serif;
        color: #16488f;
        font-size: 2.3vh;
        padding: 0;
        margin: 0;
    }
    .complaint_process-header hr{
        width: 50%;
        height: 2px;
        background-color: #16488f;
        border: none;
        margin-bottom: 7%;
        margin-left: 0;
    }
    .complaint_process-video{
        flex-grow: 1;
        margin-top: -300px;
    }
    .complaint_process-video video{
        width: 100%;
        padding: 0;
        margin: 0;
        height: 70vh;
    }
    .complaint_process-icon_container{
        width: 25%;
        box-sizing: border-box;
        margin: 0 50px 0 50px;
        text-align: center;
        font-family: 'Roboto', sans-serif;
        font-size: 2vh;
    }
    .complaint_process-icon_container:first-of-type{
        margin-right: 50px;
        margin-left: 0;
    }
    .complaint_process-icon_container:last-of-type{
        margin-left: 50px;
        margin-right: 0;
    }
    .complaint_process-icon_container img{
        width: 70%;
    }


    /**/
    /*FIRST SLIDER*/
    /**/

    .first_slider-header{
        margin: 0 0 0 2%;
    }
    .first_slider-container{
        width: 100%;
        height: 100vh !important;
    }
    .first_slider-content{
        width: var(--screen-width);
        margin: auto;
        height: 100vh !important;
        display: flex;
        justify-content: center;
        align-items: stretch;
        flex-direction: row;
        padding: 100px 0 100px 0;
        box-sizing: border-box;
    }
    .first_slider-slide{
        width: 100%;
        padding: 0;
        margin: 0;
    }
    .first_slider-header img{
        width: 50%;
    }
    .first_slider-img-mobile{
        display: none !important;
    }
    .first_slider-header h2{
        font-size: 2.3vh;
        font-family: 'Syncopate', sans-serif;
        letter-spacing: 1px;
    }
    .first_slider-text ol{
        font-size: 4.5vh;
        margin: 0;
        padding: 0 0 0 150px ;
    }
    .first_slider-text li{
        padding-left: 30px;
    }
    .slider_dots{
        display: flex;
        align-items: center;
    }
    .slide-1{
        background-color: #5198f9;
        color: white;
    }
    .slide-2{
        background-color: #16488f;
        color: white;
    }
    .slide-3{
        background-color: #5198f9;
        color: #f2eee6;
    }
    .slide-4{
        background-color: #16488f;
        color: white;
    }
    .first_slider-mobile{
        display: none;
    }

    /**/
    /*OPINIONS*/
    /**/


    .opinions_mobile-container{
        display: none;
    }
    .opinions-slide{
        width: 100%;
        height: 100vh !important;
        padding: 0;
        margin: 0;
    }
    .opinions-slide-1{
        background-color: #16488f;
        color: #f2eee6;
    }
    .opinions-slide-2{
        background-color: #5198f9;
        color: #f2eee6 !important;
    }
    .opinions-slide-2 hr{
        background-color: #f2eee6 !important;
    }
    .opinions-photo{
        width: 50%;
    }
    .opinions-img img{
        height: 100%;
        object-fit: cover;
    }
    .opinions-slide-3{
        background-color: #f2eee6;
    }
    .opinions-slide-3 hr{
        background-color: #f2eee6 !important;
    }
    .opinions-content{
        width: var(--screen-width);
        margin: auto;
        position: relative;
        height: 100vh !important;
        display: flex;
        justify-content: center;
        align-items: stretch;
        flex-direction: row;
        padding: 100px 0 100px 0;
        box-sizing: border-box;
    }
    .opinions-slider_dots{
        display: flex;
        align-items: center;
    }
    .opinions-text{
        width: 80%;
        display: flex;
        align-items: stretch;
        flex-direction: column;
        text-align: center;
        box-sizing: border-box;
        padding: 0 50px 0 50px;
    }
    .opinions-photo{
        flex-grow: 1;
        display: flex;
        align-items: center;
        align-content: center;
    }
    .opinions-photo div{
        width: 70%;
        height: 70%;
        margin: 50px;
        margin: auto;
        display: flex;
        justify-content: center;
        align-content: center;
    }
    .opinions-text div{
        width: fit-content;
        margin: 0 auto 0 auto;
    }
    .opinions-text hr{
        width: 100%;
        height: 2px;
        background-color: #f2eee6;
        border: none;
        margin-bottom: 7%;
        margin-left: 0;
    }
    .opinions-text h2{
        font-size: 2.3vh;
        font-family: 'Syncopate', sans-serif;
    }
    .opinions-text p{
        font-size: 26px;
        letter-spacing: 1.5px;
    }
    .opinions-text p:last-of-type{
        font-size: 1.5vh;
        font-family: 'Roboto', sans-serif;
    }


    /**/
    /*FOOTER*/
    /**/


    footer{
        width: 100%;
        color: #f2eee6;
        background-color: #222222;
    }
    .footer-container{
        width: var(--screen-width);
        margin: auto;
    }
    .footer-container img{
        padding: 50px 0 50px;
        width: 200px;
    }
    .footer-info{
        width: 100%;
        display: flex;
        flex-direction: row;
    }
    .footer-links{
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
    }
    .footer-links > div{
        flex: 1 0 50%;
    }
    .footer-links > div:last-child{
        flex: 0 1 100%;
    }
    .footer-links div:first-child{
        display: flex;
        flex-direction: column;
    }
    .footer-links button{
        background-color: #357efc;
        border: none;
        cursor: pointer;
        padding: 10px 25px 10px 25px;
        border-radius: 30px;
        color: #fff;
        font-weight: bold;
        font-family: 'Lato', sans-serif;
        font-size: 2vh;
        align-self: center;
        margin-bottom: -10px;
        margin-left: auto;
    }
    .footer-button-container{
        display: flex;
        align-items: flex-end;
        justify-content: flex-end;
    }
    footer a{
        cursor: pointer;
        margin: 0 0 10px 0;
        font-family: 'Lato', sans-serif;
        font-weight: 500;
        width: fit-content;
        font-size: 2vh;
        color: #f2eee6;
        
    }
   
    footer a:last-child{
    }
    .footer-text p{
        margin: 0;
        font-family: 'Lato', sans-serif;
        font-size: 2vh;
    }
    .footer-text{
        box-sizing: border-box;
        width: 40%;
    }
    .icons-container{
        display: flex;
        flex-direction: row;
        width: 100%;
    }
    .icons-container img{
        width: 20px;
        background-color: #f2eee6;
        height: 20px !important;
        margin: 20px 20px 20px 0;
        padding: 5px;
        border-radius: 50%;
    }
    .footer-text div{
        display: flex;
        flex-direction: row;
        margin-top: 20px;
        font-family: 'Lato', sans-serif;
    }
    .footer-text img{
        width: 20px;
        padding: 0;
        filter: invert(100%);
        margin-right: 10px;
    }
    .footer-text-bottom{
        width: var(--screen-width);
        margin: auto;
        font-family: 'Lato', sans-serif;
        font-size: 1.5vh;
        padding: 30px 0 30px 0;
    }

    /**/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /*BLOG*/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /**/


    .blog-container{
        width: 100%;
        /* height: 100vh; */
        margin: 0;
        padding: 0;
        background-color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .blog-content-box{
        width: var(--screen-width);
        display: flex;
        flex-direction: column;
        align-items: center;
        align-content: center;
        justify-content: center;
        /* height: 100vh; */
        padding: 100px 0 100px 0;
        box-sizing: border-box;
    }
    /* .blog-content{
        width: 100%;
        display: flex;
        flex-direction: row;
        align-content: center;
        align-items: flex-start;
        box-sizing: border-box;
    } */
    .blog-content {
        grid-template-columns: 1fr 1fr 1fr;
        gap: 60px 10px;
        grid-auto-flow: row;
        display: grid;
    }
        
     


    .blog-header-box hr{
        width: 200%;
        height: 2px;
        background-color: #16488f;
        border: none;
        margin-bottom: 7%;
        margin-left: -50%;
        padding: 0;
    }
    .blog-header-box h2{
        font-size: 2vh;
        font-family: 'Syncopate', sans-serif;
        color: #16488f;
        margin: 0;
        padding: 0;
    }
    .blog-header-box{
        margin-bottom: 70px;
    }
    .blog-post{
        /* width: 33%; */
        /* display: flex; */
        /* flex-direction: column; */
        /* align-items: stretch; */
        padding: 0 40px 0 40px;
        box-sizing: border-box;
    }



    .blog_post img{

    }
    .blog-post p{
        font-family: 'Roboto', sans-serif;
        padding: 0;
        margin: 10px 0 10px 0;
        font-weight: 600;
        font-size: 1.5vh;
    }
    .blog-post p:last-of-type{
        text-decoration: underline 1px #222222;
    }
    .blog-post h3{
        color: #357efc;
        font-family: 'Nanum Myeongjo', serif;
        font-weight: normal;
        font-size: 3.5vh;
    }


    /**/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /*SINGLE BLOG*/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /**/


    .single_blog-container{
        background-color: white;
        min-height: 100% !important;
    }
    .single_blog-content{
        width: var(--screen-width);
        margin: auto;
        display: flex;
        flex-direction: column;
        min-height: 100%;
    }
    .single_blog-header-container{
        display: flex;
        justify-content: space-between;
        align-items: baseline;
        color: #16488f;
        padding-top: 50px;
    }
    .single_blog-header-container h2{
        font-family: 'Syncopate', sans-serif;
        font-size: 1.5rem;
        padding: 0;
        margin: 0;
    }
    .single_blog-header-container a{
        font-family: 'Roboto', sans-serif;
        font-size: 1rem;
        font-weight: 600;
    }
    .single_blog-header-container hr{
        width: 200%;
        height: 2px;
        background-color: #16488f;
        border: none;
        margin-left: -50%;
        margin-bottom: 7%;
    }
    .single_blog-main-content{
        flex-grow: 1;
        display: flex;
        flex-direction: row;
        box-sizing: border-box;
    }
    .single_blog-content h3{
        font-size: 3.5rem;
        font-family: 'Libre Baskerville', serif;
        font-weight: normal;
        color: #357efc;
        margin: 0;
        padding: 150px 350px 50px 0;
    }
    .single_blog-big-photo{
        width: 65%;
        display: flex;
        flex-direction: column;
        border-right: 1px solid #222222;
        padding-right: 70px;
    }
    .single_blog-big-photo-content{
        flex-grow: 1;
    }
    .single_blog-big-photo-content p{
        font-family: 'Roboto', sans-serif;
        font-size: 1rem;
    }
    .single_blog-big-photo-content img{
        padding: 0;
        margin: 0;
        width: 100%;
        height: 400px;
        object-fit: cover;
    }
    .single_blog-small-photos{
        width: 35%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        border-left: 1px solid #222222;
    }
    .single_blog-small-photos-content {
        height: 400px;
        margin-left: 70px;
    }
    .single-small-post{
        height: 50%;
        width: 100%;
        box-sizing: border-box;
        display: flex;
        flex-direction: row;
    }
    .single-small-post:first-of-type{
        padding-bottom: 70px;
        border-bottom: 1px solid #222222;
    }
    .single-small-post:last-of-type{
        padding-top: 70px;
        border-top: 1px solid #222222;
    }
    .single-small-post h4{
        font-weight: normal;
        font-size: 1.3rem;
        color: #357efc;
        margin: 0;
        padding: 0;
    }
    .single-small-post p{
        font-size: 1rem;
        font-family: 'Roboto', sans-serif;
    }
    .single-small-post img{
        height: 100%;
    }
    .single_blog-small-photos-mobile-img{
        display: none;
    }
    .spacer{
        height: 100px;
    }


    /**/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /*CONTACT*/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /**/


    .contact-container{
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: row;
    }
    .contact-left{
        width: 50%;
        height: 100%;
        background-color: #f2eee6;
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }
    .contact-left div{
        width: calc(var(--screen-width)/2);
        height: 100%;
        padding: 150px 150px 150px 0;
        box-sizing: border-box;
    }
    .contact-left div img{
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .contact-right{
        width: 50%;
        background-color: #5198f9;
    }
    .contact-right-content{
        width: calc(var(--screen-width)/2);
        box-sizing: border-box;
        padding: 0 0 0 150px;
        display: flex;
        flex-direction: column;
        height: 100%;
    }
    .contact-right-header-container{
        width: fit-content;
        margin: auto;
    }
    .contact-right-header-container h2{
        font-size: 1.5rem;
        font-family: 'Syncopate', sans-serif;
        color: #f2eee6;
    }
    .contact-right-header-container hr{
        width: 50%;
        height: 2px;
        background-color: #f2eee6;
        border: none;
        margin-bottom: 7%;
        margin-top: 70px;
    }
    .contact-right-text-container{
        flex-grow: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        padding-bottom: 150px;
    }
    .contact-right-text-container p{
        font-size: 2.5rem;
        color: #f2eee6;
    }
    .contact-right-text-container div{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        width: 100%;
    }
    .contact-right-text-container button{
        background-color: #f2eee6;
        border: none;
        cursor: pointer;
        padding: 15px 35px 15px 35px;
        border-radius: 30px;
        color: #222222;
        font-family: 'Roboto', sans-serif;
        letter-spacing: 1px;
        transition: background-color 0.5s;
        font-size: 1rem;
        font-weight: bold;
    }

    .contact_form-container{
        width: 100%;
        background-color: #16488f;
    }
    .contact_form-content{
        width: var(--screen-width);
        margin: auto;
        display: flex;
        flex-direction: column;
        padding: 100px 0 100px 0;
    }
    .contact_form-content div{
        width: 100%;
    }
    .contact_form-header div{
        width: fit-content !important;
        color: #f2eee6;
        margin: auto;
        padding: 0 0 50px 0;
    }
    .contact_form-header h2{
        font-size: 1.5rem;
        font-family: 'Syncopate', sans-serif;
    }
    .contact_form-header hr{
        width: 100%;
        height: 2px;
        background-color: #f2eee6;
        border: none;
        margin-bottom: 7%;
        margin-left: 0;
    }
    .wpcf7{
        color: #f2eee6;
        font-family: 'Roboto', sans-serif;
        font-size: 1.3rem;
    }
    .wpcf7 form{
        display: flex;
        flex-direction: column;
        width: calc(var(--screen-width)/2);
        margin: auto;
    }
    .wpcf7 div{
        width: 100% !important;
        box-sizing: border-box;
        display: flex;
        flex-direction: row;
    }
    .wpcf7 div p{
        display: flex;
        flex-direction: column;
        padding: 10px;
        margin: 0;
        width: 50%;
    }
    .message-box{
        display: flex;
        flex-direction: column;
        padding: 10px;
        margin: 0;
    }
    #message{
        resize: none;
        margin: 20px 0 20px 0;
        border-radius: 5px;
    }
    .wpcf7 input{
        padding: 10px 15px 10px 15px;
        box-sizing: border-box;
        border: none;
        border-radius: 5px;
        font-family: 'Roboto', sans-serif;
        margin: 20px 0 20px 0 !important;
    }
    #phone ,#email, #name, #lastname{
        width: 100%;
    }
    #phone:focus ,#email:focus, #name:focus, #lastname:focus, #message:focus{
        outline: none;
    }
    .contact_form-button{
        background-color: #f2eee6;
        border: none;
        cursor: pointer;
        padding: 15px 170px 15px 170px !important;
        color: #222222;
        font-family: 'Roboto', sans-serif;
        letter-spacing: 1px;
        transition: background-color 0.5s;
        font-size: 1rem;
        font-weight: bold;
        align-self: center;
        width: 100%;
        box-sizing: border-box;
    }
    .submit-box{
        padding: 0 10px 0 10px;
    }


    /**/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /*BLOG POSTT*/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /**/

    .blog_post-container{
        width: 100%;
    }
    .blog_post-content{
        width: var(--screen-width);
        min-height: 100%;
        margin: auto;
        display: flex;
        flex-direction: column;
        padding: 100px 0 100px 0 ;
    }
    .blog_post-title h1{
        font-size: 3rem;
        color: #357efc;
        padding: 0;
        margin: 0;
    }
    .blog_post-title p{
        font-size: 1rem;
        color: #000;
        font-family: 'Roboto', sans-serif;
        padding: 10px 0 0 0;
        margin: 0;
    }
    .blog_post-title div{
        width: 50% !important;
    }
    .blog_post-title img{
        width: 100%;
    }
    .blog_post-title{
        margin: 50px 0 50px 0;
        display: flex;
        flex-direction: row;
        align-items: flex-start;
    }
    .blog_post-text p{
        font-size: 1.5rem;
        letter-spacing: 1px;
        line-height: 1.6;
        color: #222222;
        font-family: 'Roboto', sans-serif;
    }
    .blog_post-controls {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        padding: 50px 0 50px 0;
    }
    .blog_post-controls a{
        cursor: pointer;
        font-size: 1rem;
        font-family: 'Roboto', sans-serif;
        color: #357efc;
        font-weight: 600;
    }




    /**/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /*SLIDER DOTS*/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /**/


    .vertical-dots
    {
        list-style: none;
        display: block;
        margin-top: -10px;
        text-align: right;
        margin-bottom: 0;
    }
    .vertical-dots li
    {
        position: relative;
        width: 35px;
        height: 35px;
        cursor: pointer;
    }
    .vertical-dots li button
    {
        font-size: 0;
        line-height: 0;
        display: block;
        width: 20px;
        height: 20px;
        padding: 5px;
        cursor: pointer;
        color: transparent;
        border: 0;
        outline: none;
        background: transparent;
    }
    .vertical-dots li button:hover,
    .vertical-dots li button:focus
    {
        outline: none;
    }
    .vertical-dots li button:hover:before,
    .vertical-dots li button:focus:before
    {
        opacity: 1;
    }
    .vertical-dots li button:before
    {
        font-family: 'slick';
        font-size: 60px;
        line-height: 20px;

        position: absolute;
        top: 0;
        left: 0;

        width: 20px;
        height: 20px;

        content: '•';
        text-align: center;

        opacity: .25;
        color: #bdbdbd;

        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
    .vertical-dots li.slick-active button:before
    {
        opacity: .75;
        color: #bdbdbd;
    }
}





/**/
/*////////////*/
/*////////////*/
/*////////////*/
/*MOBILE CSS*/
/*////////////*/
/*////////////*/
/*////////////*/
/**/


@media screen and (max-width: 1024px){
    html, body{
        margin: 0;
        padding: 0;
        width: 100%;
        height: 100%;
        font-size: 1rem;
    }
    .container{
        position: relative;
        margin: 0;
        padding: 0;
    }


    /**/
    /*NAV STYLE*/
    /**/


    .nav-desktop{
        display: none;
    }
    .nav-mobile{
        position: fixed;
        z-index: 9999;
        width: 100%;
        padding: 0;

    }
    .nav-mobile img{
        height: 20px;
        position: relative;
        left: 50%;
        transform: translateX(-100%);
    }
    .nav-mobile label {
        display: inline-block;
    }
    .nav-items {
        flex-wrap: wrap;
    }
    .nav-items {
        display: none;
        background-color: initial;
    }
    .nav-mobile input:checked ~ .nav-items{
        display: flex;
    }
    .nav-mobile label {
        font-size: 2em;
        padding: 10px;
    }
    .nav-mobile {
        background: #333;
    }
    .nav-mobile, .nav-items a {
        color: #fff;
        text-decoration: none;
        display: block;
        width: 100%;
        background-color: initial;
        font-family: 'Roboto', sans-serif;
    }
    .nav-items a{
        text-align: left;
        padding: 20px 0 20px 20px;
    }
    .nav-items a:last-of-type{
        padding-bottom: 40px;
    }
    #hamburger {
        display: none;
    }
    .nav-mobile input:checked ~ .nav-items, .nav-mobile input:checked .nav-mobile {
        display: flex;
    }
    .nav-items hr{
        width: 90%;
    }
    .ham-label{
        color: #222222;
        -webkit-text-stroke: 3px darkgrey;
        -webkit-text-fill-color: white;
    }


    /**/
    /*LANDING PAGE*/
    /**/


    .landing_page-container{
        background-image: linear-gradient(#2c2c2c, #f2eee6);
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        align-content: center;
    }
    .landing_page-video{
        display: none;
    }
    .landing_page-content{
        text-align: center;
        z-index: 100;
        margin: auto;
    }
    .landing_page-header{
        font-family: 'Syncopate', sans-serif;
        color: #f2eee6;
        font-size: 3rem;
        
    }
    .landing_page-button{
        background-color: #5198f9;
        border: none;
        cursor: pointer;
        padding: 15px 25px 15px 25px;
        border-radius: 30px;
        color: #f2eee6;
        font-family: 'Lato', sans-serif;
        transition: background-color 0.5s;
        font-size: 1rem;
        font-weight: bold;
        margin-top: 5%;
    }
    .landing_page-button:hover{
        background-color: #357efc;
    }


    /**/
    /*WHY US*/
    /**/


    .why_us-container{
        width: 100%;
        min-height: 100%;
        background-color: #5198f9;
        color: #f2eee6;
        display: flex;
        align-items: center;
    }
    .why_us-content{
        width: 90%;
        margin: auto;
        display: flex;
        flex-direction: column;
        align-content: center;
        align-items: center;
        padding: 50px 0 50px 0;
    }
    .why_us-header-container hr{
        width: 50%;
        height: 2px;
        background-color: #f2eee6;
        border: none;
        margin-bottom: 7%;
    }
    .why_us-header-container h2{
        font-size: 1.5rem;
        font-family: 'Syncopate', sans-serif;
        text-align: center;
    }
    .why_us-content p{
        font-size: 1.5rem;
        text-align: center;
        font-family: 'Nanum Myeongjo', serif;
    }


    /**/
    /*COMPLAINT PROCESS*/
    /**/


    .complaint_process-container{
        min-height: 100%;
        width: 100%;
        background-color: #f2eee6;
    }
    .complaint_process-content{
        width: 90%;
        margin:auto;
    }
    .complaint_process-video{
        display: none;
    }
    .complaint_process-bottom{
        display: flex;
        flex-direction: column;
        align-items: center;
        align-content: center;
        text-align: center;
    }
    .complaint_process-bottom img{
        width: 40%;
    }
    .complaint_process-bottom p{
        font-family: 'Roboto', sans-serif;
        font-size: 1rem;
        width: 60%;
        margin: auto;
    }
    .complaint_process-icon_container{
        padding: 50px 0 50px 0;
    }
    .complaint_process-header{
        width: fit-content;
        margin: auto;
        text-align: center;
        padding: 50px 0 50px 0;
    }
    .complaint_process-header hr{
        width: 50%;
        height: 2px;
        background-color: #222222;
        border: none;
        margin-bottom: 7%;
    }
    .complaint_process-header h2{
        font-size: 1.5rem;
        font-family: 'Syncopate', sans-serif;
        padding: 0;
        margin: 0;
    }


    /**/
    /*FIRST SLIDER*/
    /**/


    .first_slider-container{
        width: 100%;
        min-height: 100vh !important;
    }
    .first_slider-slide{
        width: 100%;
        min-height: 100vh !important;
        padding: 0;
        margin: 0;
        display: flex;
    }
    .slide-1{
        background-color: #5198f9;
        color: #f2eee6;
    }
    .slide-2{
        background-color: #16488f;
        color: #f2eee6;
    }
    .slide-3{
        background-color: #5198f9;
        color: #f2eee6;
    }
    .slide-4{
        background-color: #16488f;
        color: #f2eee6;
    }
    .first_slider-content{
        width: 90%;
        margin: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        align-content: center;
        text-align: center;
        padding: 50px 0 50px 0;
    }
    .first_slider-content .slider_dots{
        padding-top: 20px;
    }
    .first_slider-img-desktop{
        display: none !important;
    }
    .first_slider-img-mobile{
        margin: auto;
    }
    .first_slider-header h2{
        font-size: 1.3rem;
        font-family: 'Syncopate', sans-serif;
        text-align: center;
        letter-spacing: 2px;
    }
    .first_slider-text ol{
        list-style: none;
        padding-left: 0;
    }
    .first_slider-text{
        font-size: 1.1rem;
    }


    /**/
    /*OPINIONS*/
    /**/


    .opinions-container{
        display: none;
    }
    .opinions_mobile-container{
        width: 100%;
        min-height: 100vh !important;
    }
    .opinions_mobile-slide{
        width: 100%;
        min-height: 100vh !important;
        padding: 0;
        margin: 0;
        display: flex !important;
        align-items: center;
        align-content: center;
    }
    .opinions_mobile-slide-1{
        background-color: #16488f;
        color: #f2eee6;
    }
    .opinions_mobile-slide-2{
        background-color: #5198f9;
        color: #f2eee6;
    }
    .opinions_mobile-slide-3{
        background-color: #16488f;
        color: #f2eee6;
    }
    .opinions_mobile-photo{
        background-size: cover;
        width: 50%;
        height: 40%;
    }
    .opinions_mobile-photo img{
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .opinions_mobile-content{
        width: 90%;
        height: 80%;
        margin: auto;
        display: flex;
        align-items: center;
        align-content: stretch;
        flex-direction: column;
        padding: 50px 0 50px 0;
    }
    .opinions_mobile-content p:last-of-type{
        text-align: center;
        font-size: 1.2rem;
        font-family: 'Roboto', sans-serif;
        letter-spacing: 1px;
        margin: 10px 0 20px 0;
    }
    .opinions_mobile-name{
        font-family: 'Roboto', sans-serif;
        font-size: 0.9rem;
        margin: 20px 0 10px 0;
    }


    /**/
    /*FOOTER*/
    /**/


    footer{
        width: 100%;
        background-color: #222222;
        color: #f2eee6;
    }
    .footer-container{
        width: 90%;
        margin: auto;
        display: flex;
        align-content: center;
        align-items: center;
        flex-direction: column;
    }
    .footer-container img{
        width: 50%;
        margin: auto;
        padding: 30px 0 30px 0;
    }
    .footer-links{
        display: none;
    }
    .footer-text{
        font-size: 1rem;
        font-family: 'Lato', sans-serif;
    }
    .footer-text p{
        padding: 0;
        margin: 0;
    }
    footer hr{
        margin: 0;
        padding: 0;
    }
    .footer-text-bottom{
        width: 90%;
        margin: auto;
        font-family: 'Lato', sans-serif;
        font-size: 0.9rem;
        padding: 10px 0 10px 0;
    }
    .footer-text div{
        display: flex;
        flex-direction: row;
        font-family: 'Lato', sans-serif;
        padding: 20px 0 20px 0;
    }
    .footer-text img{
        width: 20px;
        padding: 0;
        filter: invert(100%);
        margin-right: 10px;
        margin-left: 0;
    }

    /**/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /*BLOG*/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /**/

    .landing_page-container{
        background-image: linear-gradient(#2c2c2c, #ffffff) !important;
    }
    .blog-container{
        width: 100%;
    }
    .blog-content-box{
        width: 90%;
        min-height: 100%;
        margin: auto;
        text-align: center;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .blog-header-box{
        width: fit-content;
        text-align: center;
        margin: 70px 0 60px 0;
    }
    .blog-header-box h2{
        font-size: 1.5rem;
        font-family: 'Syncopate', sans-serif;
        color: #16488f;
        padding: 0;
        margin: 0;
    }
    .blog-header-box hr{
        width: 200%;
        height: 2px;
        background-color: #16488f;
        border: none;
        margin-bottom: 7%;
        margin-left: -50%;
    }
    .blog-post{
        margin-bottom: 100px;
        text-align: left;
    }
    .blog-post img{
        width: 100%;
    }
    .blog-post p{
        padding: 0;
        margin: 0;
        font-family: 'Roboto', sans-serif;
        font-weight: 600;
    }
    .blog-post p:last-of-type{
        text-decoration: underline 1px #222222;
    }
    .blog-post h3{
        font-size: 1.3rem;
        font-family: 'Nanum Myeongjo', serif;
        color: #16488f;
        margin: 20px 0 20px 0;
    }


    /**/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /*SINGLE BLOG*/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /**/


    .single_blog-container{
        width: 100%;
    }
    .single_blog-content{
        width: 90%;
        margin: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 50px 0 0 0 ;
    }
    .single_blog-content h3{
        font-size: 2rem;
        margin: 0;
        color: #357efc;
        font-weight: normal;
        padding-bottom: 50px;
    }
    .single_blog-header-container{
        width: fit-content;
        text-align: center;
        padding: 50px 0 150px 0;
    }
    .single_blog-header-container h2{
        font-family: 'Syncopate', sans-serif;
        font-size: 1.5rem;
        padding: 0;
        margin: 0;
        color: #16488f;
    }
    .single_blog-header-container hr{
        width: 200%;
        height: 2px;
        background-color: #16488f;
        border: none;
        margin-left: -50%;
        margin-bottom: 7%;
    }
    .single_blog-main-content{
        width: 100%;
    }
    .single_blog-big-photo-content img{
        width: 100%;
    }
    .single_blog-big-photo-content p{
        font-family: 'Roboto', sans-serif;
        font-size: 1rem;
        padding: 0;
        margin: 0;
    }
    .single_blog-big-photo{
        padding-bottom: 50px;
        border-bottom: 2px solid #222222;
    }
    .single_blog-small-photos-content{
        display: flex;
        flex-direction: row;
        padding: 50px 0 50px 0;
    }
    .single-small-post{
        width: 50%;
    }
    .single-small-post:first-child{
        padding-right: 10px;
    }
    .single-small-post:last-child{
        padding-left: 10px;
    }
    .single-small-post h4{
        color: #357efc;
        margin: 0;
        padding: 0;
        font-size: 1rem;
    }
    .single-small-post p{
        font-family: 'Roboto', sans-serif;
        font-size: 1rem;
        padding: 10px 0 0 0 ;
        margin: 0;
    }
    .single_blog-small-photos-content img{
        display: none;
    }
    .single_blog-small-photos-mobile-img{
        display: initial !important;
        width: 100%;
        object-fit: cover;
    }
    .single_blog-container a{
        display: none;
    }


    /**/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /*CONTACT*/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /**/


    .contact-left{
        display: none;
    }
    .contact-right{
        width: 100%;
        min-height: 100%;
        background-color: #5198f9;
    }
    .contact-right-content{
        width: 90%;
        margin: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 50px 0 0 0 ;
    }
    .contact-right-header-container{
        width: fit-content;
        padding: 50px 0 100px 0;
    }
    .contact-right-header-container hr{
        width: 50%;
        height: 2px;
        background-color: #f2eee6;
        border: none;
        margin-bottom: 7%;
    }
    .contact-right-header-container h2{
        font-size: 1.5rem;
        font-family: 'Syncopate', sans-serif;
        color: #f2eee6;
        padding: 0;
        margin: 0;
        text-align: center;
    }
    .contact-right-text-container{
        padding: 0 0 150px 0;
    }
    .contact-right-text-container p{
        font-size: 2rem;
        color: #f2eee6;
    }
    .contact-right-text-container div{
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
    .contact-right-text-container button {
        background-color: #f2eee6;
        border: none;
        cursor: pointer;
        padding: 15px 35px 15px 35px;
        box-sizing: border-box;
        width: 250px;
        border-radius: 30px;
        color: #222222;
        font-family: 'Roboto', sans-serif;
        letter-spacing: 1px;
        transition: background-color 0.5s;
        font-size: 1rem;
        font-weight: bold;
        margin: 10px 0 10px 0;
    }
    .contact_form-container{
        width: 100%;
        background-color: #16488f;
        color: #f2eee6;
    }
    .contact_form-content{
        width: 90%;
        margin: auto;
        padding: 50px 0 50px 0;
    }
    .contact_form-header hr{
        width: 50%;
        height: 2px;
        background-color: #f2eee6;
        border: none;
        margin-bottom: 7%;
    }
    .contact_form-header h2{
        font-size: 1.5rem;
        font-family: 'Syncopate', sans-serif;
        color: #f2eee6;
        padding: 0;
        margin: 0;
        text-align: center;
    }
    .contact_form-header{
        padding: 0 0 50px 0;
    }
    .wpcf7 form{
        display: flex;
        flex-direction: column;
        font-size: 1rem;
        font-family: 'Roboto', sans-serif;
    }
    .wpcf7 p{
        margin: 0;
    }
    .wpcf7 input, .wpcf7 textarea{
        width: 100%;
        padding: 10px 15px 10px 15px;
        box-sizing: border-box;
        border: none;
        border-radius: 5px;
        font-family: 'Roboto', sans-serif;
        margin: 20px 0 20px 0 !important;
    }
    .wpcf7 input:focus, .wpcf7 textarea:focus {
        outline: none;
    }
    .contact_form-button{
        font-size: 1rem;
        font-weight: 600;
    }


    /**/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /*BLOG POSTT*/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /**/


    .blog_post-container{
        width: 100%;
        min-height: 100%;
    }
    .blog_post-content{
        width: 90%;
        margin: auto;
    }
    .blog_post-title{
        padding: 100px 0 50px 0;
        display: flex;
        flex-direction: column;
    }
    .blog_post-title h2{
        font-size: 2.5rem;
        padding: 0;
        margin: 0;
        color: #357efc;
    }
    .blog_post-title p{
        font-size: 1rem;
        font-family: 'Roboto', sans-serif;
        padding: 10px 0 0 0;
        margin: 0;
    }
    .blog_post-text{
        font-size: 1.3rem;
        font-family: 'Roboto', sans-serif;
        line-height: 2;
        color: #000000;
    }
    .blog_post-controls{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        color: #357efc;
        font-family: 'Roboto', sans-serif;
        font-weight: 600;
        padding: 50px 0 50px 0;
    }
    .blog_post-content img{
        width: 100%;
        padding: 20px 0 0 0;
    }

    /**/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /*SLIDER DOTS*/
    /*////////////*/
    /*////////////*/
    /*////////////*/
    /**/


    .vertical-dots{
        display: flex;
        list-style: none;
        margin: 0;
        padding: 0;
    }
    .vertical-dots button{
        font-size: 0;
        padding: 0;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        border: none;
        margin: 10px;
        outline: none;
        background-color: #bdbdbd;
    }
    .vertical-dots li.slick-active button:before
    {
        opacity: .75;
        color: #f2eee6;
    }
}




a.landing_page-button {
    text-decoration: none;
}

.submit-box p {    
    flex: auto;
}

h2 a {
    color: #16488f;
    text-decoration: none;
}

span.prev_link_title, span.next_link_title {
    width: 70%;
    display: block;
}

span.next_link_title {
    text-align: right;
}

.responsive {
    width: 100%;
    height: auto;
  }