@charset "UTF-8";
/* CSS Document */

.studio_main_screen
{
    width: 100%;
    height: auto;
    background-color: #f8bd00;
    padding-bottom: 50px;
}
.studio_container
{
    position: relative;
    top: 0px;
    padding: 220px 100px 0;
    max-width: 1400px;
    margin: 0 auto ;
    align-items: start;
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 0px;
    /*row-gap: 150px;*/

}
.studio_anim_container{
    z-index: 0;
}
.studio_text{
    padding-top: 3.3%;
    font-size: 26px;
    line-height: 42px;
    z-index: 10;
    /*margin-bottom: 50px;*/
}
.studio_text>.name{
    margin-top: 50px;
}

.studio_text>div.line{
    /*width:0%;*/
    height: 2px;
    background-color: black;
    position: relative;
    margin-bottom: 50px;
   animation: line_gor 5s ease;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;

}

@keyframes line_gor{
    0%{width:0%}
    90%{width:0%}
    100%{width:100%}  
}

.studio_text_left{
    padding-top: 3.3%;
    font-size: 36px;
    line-height: 52px;
    padding-right: 50px;
}

.studio_text>p,
.studio_text_left>p,
.studio_text>ul
{
    /*margin: 0 0 25px;*/
    padding: 0;
    animation: text_apear 5s ease;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    
}


.studio_container2
{
    position: relative;
    top: 0px;
    padding: 50px 100px 0;
    max-width: 1400px;
    margin: 0 auto 220px;
    align-items: baseline;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-row: 1fr 1fr;
    column-gap: 0px;
    /*row-gap: 150px;*/

}


@keyframes text_apear{
    0%{
        transform: translateY(-20%);
        opacity:0
    }
    85%{
        transform: translateY(-20%);
        opacity:0
    }
    100%{
        transform: translateY(0%);
        opacity:1
    }
    
}


.studio_text>p.studio_title{
    font-size: 24px;
    margin-top: 50px;
}

.studio_text ul{
    padding-left: 0px;
}

.contacts_container{
    position: relative;
    top: 0px;
    padding-top: 100px;
    padding-left: 50px;
    padding-right: 50px;
    max-width: 1600px;
    margin: auto;
    color: black;
}

.contacts_container>div{
    font-size: 3.2vw;
    text-align: center;
    margin: 3vw auto 0;
}

.contacts_container>div>p{
    /*font-size: 40px;*/
    margin: 1.5vw auto;
}

.contacts_container>div.gohome{
    display: block;
    width: 40%;
    margin: auto;
}

.contacts_anim_container{
    width: 75%;
    margin-left:0;
    padding-right: 10%;
}

/*--------------- 1200 ------------*/
@media (max-width: 1200px){

.studio_text{
    font-size: 24px;
    line-height: 38px;
}    

}


/*--------------- 1024 ------------*/
@media (max-width: 1024px){

.studio_text{
    font-size: 22px;
    line-height: 32px;
}    

.studio_text_left{
    font-size: 28px;
    line-height: 48px;

}
    
    
}


/*--------------- 768 ------------*/
@media (max-width: 768px){
.studio_container,
.studio_container2
{
    grid-template-columns: 1fr;
    padding-top: 100px;
 }
    
.studio_container2{
     padding-top: 50px;   
}

.studio_anim_container{
    width: 75%;
    margin: auto;
     /*display: none;*/   
}

.studio_text>div.line{
    display: none;
}
    
.studio_text>p,
.studio_text>ul{
    /*animation: none;  */      
}

.contacts_container{
    padding-left: 100px;
    padding-right: 100px;
}
    

.contacts_container>div.gohome{
    display: block;
    width: 75%;
    margin: auto;
}

.contacts_container>div{
    font-size: 6vw;
    text-align: center;
    margin: 10vw auto 0;
}
    
.contacts_container>div>p{
    /*font-size: 40px;*/
    margin: 3vw auto;
}

.contacts_anim_container{
    width: 100%;
    margin-left:0;
    padding-right: 0%;
}
}


/* --------------------- 576px ------------*/
@media (max-width: 576px){
.contacts_container,
.studio_container,
.studio_container2
{
    padding-left: 25px;
    padding-right: 25px;
}

.studio_anim_container{
     display: none;   
}

.studio_text>p,
.studio_text>ul,
.studio_text_left>p
{
    animation: none;    
}
}