@media screen and (max-width: 770px) {
    header{
        height: 710px;
        background-position: center 0;
        background-size: 1120px;

    }

    /*--------------------------- mobile menu*/

    .image_phone_nemu{
        position: absolute;
        top: 25%;
    }

    #labelBtnMobileMenu{
        display: block;
    }

    #btnMobileMenu:checked~.mobileDetails{
        display: block;
        height: 100vh;
        background: linear-gradient(158.52deg, rgba(47, 126, 181, 0.5) 12.07%, rgba(99, 195, 224, 0.5) 74.08%), linear-gradient(170.12deg, #0395AF 7.94%, #7AD9D9 97.82%);
        position: relative;
        top: 0;
        z-index: 10;
    }
    #btnMobileMenu:checked~*{
        display: none;
    }
    #btnMobileMenu:checked+#labelBtnMobileMenu{
        display: block;

        background: url("images/btnMobileCross.webp");
    }

    /*-----------------body details*/

    .inst_logo_top{
        top: 68px;
        right: 140px;
        position: absolute;
    }

    .mobileDetailsHeader{
        display: flex;
        width: 70%;
        position: absolute;
        left: 25px;
        margin-top: 59px;
        align-items: center;
        justify-content: space-around

    }
    .mobileDetails .phones{
        flex-direction: column;
    }

    .mobileDetails{
        min-height: 800px;
    }
    .mobileDetailsPhones div{
        min-width: 159px;
        text-align: right;
    }
    .mobileDetailsPhones a{
        font-family: 'Open Sans';
        font-style: normal;
        font-weight: 700;
        font-size: 14px;
        line-height: 19px;
        color: #FFFFFF;
    }
    .mobileDetailsHeader select{
        font-family: 'Open Sans';
        font-style: normal;
        font-weight: 600;
        font-size: 16px;
        line-height: 22px;
        /* identical to box height */

        text-align: center;

        color: #FFFFFF;
        background: none;
        border: none;

        /* border: 1px solid #000000;*/
        text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    }

    .mobileDetailsContent{
        position: relative;
        top: 110px;
    }

    .mobileDetailsContent ul{
        padding-left: 0;
    }

    .mobileDetailsContent ul,.mobileDetailsContent a{
        font-family: 'Open Sans';
        font-style: normal;
        font-weight: 700;
        font-size: 15px;
        line-height: 258%;
        text-align: center;
        color: #FFFFFF;
        list-style: none;
        margin: 0;
        text-decoration: none;
    }

    /*--------------------------- mobile menu end that*/


    .heroes{
        margin-left: 0;
        top: -118px;
        transform: scale(0.3);


    }
    #wavesContainer{

        bottom: -64px;
        transform: scale(0.5);
        right: -2773px;
    }

    #mainBtn{
        position: absolute;
        top: 650px;
        transform: scale(1.1);
        z-index: 1;
    }

    #mainBtnHidden{
        height:0;
    }
    #mainDialog{
        margin-top: 150px;
        font-style: normal;
        font-weight: 700;
        font-size: 23px;
        line-height: 26px;
    }

    .underTitle{
        font-style: normal;
        font-weight: 700;
        font-size: 15px;
        line-height: 20px;
        text-align: center;
    }
    .sline{
        display: none;
    }
    .fline select{
        display: none;
    }
    .fline{
        justify-content: end;
    }
    .phones{
        display: none;
    }
    .logo{
        transform: scale(1);
        margin-left: 14px;
    }
    .baseNav{
        display: none;
    }
    .localisation{
        transform: scale(1);
        width: 170px;
        padding-top: 50px;
    }
    .tmpBR{
        display: block;
    }

    /*-------------- main content*/
    .contentH2,.contentH3,.contentSmallText, .contentMediumText{
        text-align: center;
    }
    .contentH2{
        font-family: 'Balsamiq Sans';
        font-style: normal;
        font-weight: 700;
        font-size: 48px;
        line-height: 48px;
    }
    .contentMediumText{
        font-family: 'Open Sans';
        font-style: normal;
        font-weight: 700;
        font-size: 20px;
        line-height: 22px;
        text-align: center;
    }

    .contentContainer{
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
        margin-left: -0;
        transform: scale(1)
    }
    .contentAnimation{
        transform: scale(0.6);
    }
    .contentText{
        width: 100%;
    }

    .contentContainer .contentText:nth-child(1){
        position: static;
        left: -0;
    }
    .contentContainer .contentAnimation:nth-child(1){
        position: static;
        left: -0;
    }


/*------ aboutus*/
    #aboutAs{
        height: 819px;
    }
    #aboutAs .contentContainer{
        right: 0;
        position: relative;
    }
    #aboutAs .contentAnimation{
        display: flex;
        justify-content: center;
        right: -90px;
        top: -118px;
    }

    #aboutAsAnimation{
        position: relative;
        left: -154px;
    }


/*-------------- forms of magik*/
    #formOfMagic{
        background: url("images/formofmagik/backforphone.webp");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: bottom;
    }
    .application{
        padding-left: 5%;
    }
    .input{
        width: 90%;
    }
    #formOfMagic .contentAnimation{
        display: none;
    }

    /*---------- happy birth*/
    #happyBirthday{
        min-height: 1419px;
        background: url("images/happybirthday/mobileback.webp");
        background-repeat: no-repeat;
        background-size: cover;
    }
    .contentMarginTop {
        margin-top: -130px;
    }
    #happyBirthday .contentText{
        margin-top: -200px;
        width: 92%;
    }

    .textMarginTop {
        margin-top: -116px;
    }

    #happyBirthday .contentAnimation{

        left: 0;
    }

    .sendbtnContainer {
        margin-top: 50px;
        display: flex;
        justify-content: center;
        position: relative;
        z-index: 3;
    }

    #happyBirthday .contentH2 span {
        font-size: 40px;
    }

    .btn{
        padding: 25px 35px;
        width: 70%;
        font-family: 'Open Sans';
        font-style: normal;
        font-weight: 700;
        font-size: 18px;
        line-height: 25px;
        /* identical to box height */

        text-align: center;
    }

    /*---------- show program*/
    #shouPrograms{
        z-index: 3;
        margin-top: -100px;
        height: 955px;
    }
    #shouPrograms .contentContainer{
        flex-direction: column-reverse;
        margin-top: -180px;
    }
    #shouPrograms .contentText{
        margin-top: -100px;
    }
    /*---------- master classes*/
    #masterClasses{
        background: url("images/masterclases/mobileback.webp");
        background-repeat: no-repeat;
        background-size: cover;
        height: 988px;
    }
    #masterClasses .contentContainer{
        margin-top: -250px;
        position: relative;
        z-index: 5;
    }

    #masterClasses .contentText{
        margin-top: -100px;
    }

    /*---------- calendar celebr*/
    #calendarCelebrate{
        height: 1014px;
    }

    #calendarCelebrate .contentContainer{
        flex-direction: column-reverse;
        margin-top: -184px;

    }
    #calendarCelebrate .contentText{
        margin-top: -100px;
    }
    .cursiveText{
        text-align: center;
    }

    /*---------- invite to celebr*/
    #inviteToCelebrate{
        height: 1108px;;
        background: url("images/invitetocelebrate/mobileback.webp");
        background-repeat: no-repeat;
        background-size: cover;
    }
    #inviteToCelebrate .contentContainer{
        margin-top: -352px;
    }
    #inviteToCelebrate .contentText{
        margin-top: -100px;
    }

    #inviteToCelebrate .contentAnimation{
        left: 0;
    }


    /*---------- sweets*/

    #sweets {
        height: 896px;
    }
    #sweets .contentContainer{
        flex-direction: column-reverse;
        margin-top: -235px;
    }

    #sweets .contentText{
        margin-top: -170px;;
    }

    /*---------- external support*/
    #externalSupport .contentContainer{
        margin-top: -250px;
    }
    #externalSupport .contentText{
        margin-top: -135px;
    }

    #externalSupport{
        height: 1075px;
        padding-top: 300px;
        background: url("images/Frame 57.webp"), url(images/externalsupport/splashBackStar.webp);
        background-position: center, top;
        background-size: cover,190%;
        background-repeat: no-repeat, no-repeat;
        background-blend-mode: hard-light;
    }


    /*---------- tarifs*/
    #contain{
        flex-direction: column;
        align-items: center;
    }
    .item{
        width: 80%;
        align-items: center;
    }
    .li{
        font-family: 'Nunito';
        font-style: normal;
        font-weight: 500;
        font-size: 13px;
        line-height: 26px;
    }


    /*------------------form of fairy*/
    #formOfFairy{
        background: url("images/formoffairy/mobileback.webp");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: bottom;
    }
    .btnmenu{
        justify-content: flex-start;
        margin-top: 20px;
        align-items: start;
        flex-direction: row;
        width:auto;
    }
    #echo{
        overflow-y: visible;
        overflow-x: clip;
        z-index: 5;
    }
    #sendbtnShow{
        border: 0;
        margin-top: 5px;
        right: 4.5%;
        width: 73px;
        height: 70px;
        background: url(images/animators_mob/helpBtn.webp);
        background-position: center -20px;
        content: "";
        padding: 0;
    }

    .formBtn{
        width: 25%;
        align-self: start;
        margin-top: 30px;
    }
    .btnUp{
        bottom: 102px;
    }
    #formOfFairy .contentAnimation{
        display: none;
    }

    #turtlebtn, #fairybtn{
        width: auto;
        padding: 15px 25px;
        align-self: center;
        background: linear-gradient(180deg, #FFEC40 0%, #FC990F 100%);
        border: none;
        box-shadow: 0px 10px 30px rgba(245, 134, 52, 0.25);
        border-radius: 100px;
        font-family: 'Open Sans';
        font-style: normal;
        font-weight: 700;
        font-size: 16px;
        line-height: 25px;
        text-align: center;
        background-origin: border-box;
        color: #373435;
        text-decoration: none;
        transition: 1s;
    }


    /*---------------------- footer*/

    #img{
        display: none;
    }

    #main{
        flex-direction: column;
        align-items: center;
    }

    #main .text{
        display: none;
    }
    #main .text:last-child{
        display: block;
        width: 180px;
        margin-right: 0;
        text-align: center;
    }
    #media{
        justify-content: center;
    }
    #location {
         width: auto;
         margin-left: 0;
         margin-right: 0;
    }
    /*---------------------- quest*/
    #quests .questsFlex{
        max-width:571px;
    }

    #helpToChoose {
        min-height: 1306px;
    }
}


@media screen and (max-width: 605px) {

    #aboutAs{
        height:942px;
    }
    #happyBirthday{
        min-height: 1626px;
    }
    #shouPrograms{
        height: 1071px;
    }
    #masterClasses{
        height: 1124px;
    }
    #calendarCelebrate{
        height: 1124px;
    }
    #inviteToCelebrate{
        height: 1165px;
    }
    #sweets {
        height: 1045px;
    }
}
@media screen and (max-width: 590px) {
    #externalSupport{
        height: 1108px;
        background: url("images/externalsupport/extsupportmob.webp");
        background-size: cover;
    }
}