@media only screen and (max-width: 1440px) {
    .holding-title{
        bottom: 41%;
    }

    .polygon-text{
        font-size: inherit;
    }
}

@media only screen and (max-width: 1200px){
    .about-circle-bg {
        height: 70em;
        width: 70em;
        top: 10%;
    }
}

@media only screen and (max-width: 1024px) {
    .holding-bg{
        background-size: cover;
    }

    .polygon-triangle{
        height: 25vw;
        width: 25vw;
        left: 5%;
        top: 32%;
    }

    .polygon-circle{
        height: 25vw;
        width: 25vw;
        right: 6%;
        top: 29%;
    }

    .polygon-circle-position{
        right: 10%;
    }

}

@media only screen and (max-width: 992px){
    .about-iac-main-div{
        max-width: 100%;
    }
}

@media only screen and (max-width: 850px) {
    .polygon-text, .cloud-tips .info{
        font-size: small;
    }

    .cloud-tips.dinosaur-tips{
        width: 300px;
        height: 240px;
    }

    .cloud-tips.end{
        left: -12em !important;
        bottom: -10px !important;
    }

    .cloud-tips.dinosaur-tips .info{
        width: 100%;
        margin-left: 11%;
    }

    .about-circle-bg{
        right: -22%;
    }

    .about-iac-info{
        padding-left: 27%;
    }

    .about-iac-main-div {
        min-height: 170vh;
        overflow-x: hidden;
    }
}

@media only screen and (max-width: 768px) {
    .holding-bg{
        background-image: url(../images/common/holding_page_background_mobile_v2.png);
        background-size: 100% 100%;
    }

    .holding-date {
        right: 0;
        left: 0;
        margin: 0 auto;
        top: 5%;
        content:url(../images/common/holding_date_mobile.png);
        width: 20vw;
    }

    .holding-title {
        bottom: 52%;
        width: 50vw;
    }

    .polygon-triangle .polygon-text{
        left: 10%;
    }

    .cloud-tips {
        width: 250px;
        height: 200px;
        left: -7em;
    }

    .clouds-div{
        width: 60vw;
    }

    .polygon-triangle {
        height: 30vw;
        width: 30vw;
        left: 20%;
        top: 47%;
    }

    .polygon-triangle .polygon-text {
        left: 18%;
    }

    .polygon-circle {
        height: 30vw;
        width: 30vw;
        right: 20%;
        top: 45%;
    }

    .polygon-parallelogram {
        height: 18vw;
        width: 18vw;
        left: -10%;
        top: 49%;
    }

    .index-date{
        bottom: 0;
        top: 5%;
        content:url(../images/common/holding_date_mobile.png);
    }

    .polygon-triangle-position{
        left: 20%;
        top: 50%;
    }

    .polygon-circle-position {
        right: 21%;
        top: 45%;
    }

    .polygon-circle-position .polygon-circle .polygon-text,
    .polygon-triangle-position .polygon-triangle .polygon-text{
        top: 49%;
    }

    .polygon-parallelogram-index{
        top: 35%;
        height: 35vw;
        width: 35vw;
    }
    
    .header-background-div{
        display: flex;
        justify-content: center;
        padding: 0 0 3% 0;
        height: 13vh;
        min-height: 6em;
    }

    .header-items{
        display: none;
    }

    .header-background-div .inner, .function-inners {
        align-items: center;
    }

    .stage-inner{
        padding: 1% 5%;
    }

    .pdf-div{
        padding: 10%;
        margin-bottom: 15%;
    }

    .footer-mascot-icon {
        top: -29%;
        width: 11em;
    }

    .footer-sitemaps-div{
        display: none;
    }
    
    .footer-div{
        min-height: 25vh;
        padding-top: 10%;
        border-radius: 18% 18% 10% 10% / 50% 50% 0% 0%;
    }

    .footer-functions-div{
        display: grid;
        justify-content: center;
    }

    .footer-functions-div .media-inner {
        width: 100%;
        justify-content: space-between;
    }

    .footer-div .function-icons {
        margin-right: unset;
        width: 30px;
        height: 30px;
    }

    .become-iac-friends{
        padding: 5px 20px;
        font-weight: bold;
    }

    .iac-friends-icon {
        width: 30px;
        height: 30px;
    }

    .footer-iac-logo {
        width: 9em;
        position: absolute;
        bottom: -2%;
    }

    .copyright-div .site-links{
        display: none;
    }

    .footer-bottom{
        min-height: 250px;
        padding-top: 5%;
    }

    .content-title{
        display: block;
        text-align: center;
        margin-top: 15%;
    }

    .content-title .main-title{
        font-size: 2em;
        margin-bottom: 2%;
    }

    .filter-icon {
        width: 40px;
        height: 40px;
    }

    .mobile-menu{
        display: block;
    }

    .content-inner .inner-bottom{
        height: 150px;
    }

    .content-inner .inner-top{
        height: 190px;
    }

    .stage-individual-inner {
        padding: 5% 0%;
    }

    .stage-individual-inner .info-div{
        margin-top: 5%;
    }

    .stage-individual-inner .polygon-infos{
        padding: 20% 10%;
    }

    .stage-individual-inner .main-info .nav-item{
        width: fit-content;
    }

    .stage-individual-inner .main-info .nav-item.active::after{
        left: unset;
        right: -25%;
        margin: auto 0;
        top: 0;
        bottom: 0;
    }

    .logo-flex{
        display: block;
    }
  
}

/* @media only screen and (max-width: 767px) {
    .stage-individual-inner .main-info .nav-item.active::after{

    }
} */

@media only screen and (max-width: 700px) {
    .polygon-circle .polygon-text{
        left: 15%;
    }
}

@media only screen and (max-width: 680px) {
    .about-iac-info {
        padding-left: 10%;
        padding-right: 10%;
        max-height: 100vh;
        overflow: scroll;
    }

    .about-iac-main-div {
        min-height: 200vh;
    }

    .about-circle-bg {
        height: -webkit-fill-available;
        width: -webkit-fill-available;
        right: 0;
        left: 0;
        margin: 0 auto;
        top: 0;
    }
}

@media only screen and (max-width: 625px) {
    .polygon-circle .polygon-text {
        left: 8%;
    }

    .polygon-triangle {
        height: 30vw;
        width: 30vw;
    }

    .content-title .main-title{
        font-size: 1.6em;
    }

    /* .about-iac-info {
        padding-left: 35%;
        padding-right: 35%;
    } */
   
}

@media only screen and (max-width: 600px) {
    .stage-individual-inner {
        padding: 5% 7%;
    }
}

@media only screen and (max-width: 570px) {
    .polygon-circle {
        right: 9%;
        height: 30vw;
        width: 30vw;
    }
    
    .holding-title {
        bottom: 55%;
    }
}


@media only screen and (max-width: 490px) {
    .polygon-triangle {
        height: 40vw;
        width: 40vw;
        top: 40%;
    }

    .polygon-circle {
        top: 40%;
        height: 40vw;
        width: 40vw;
    }
    
    .polygon-circle .polygon-text {
        left: 20%;
    }

    .clouds-div {
        width: 80vw;
    }

    .content-inner{
        padding: 10% 0%;
    }

    .holding-bg .cloud-main, .cloud-main-dotted-line{
        left: -0.5%;
    }

    .download-prog-button{
        margin: 5% 0;
    }

    .stage-individual-inner .info-div {
        margin-bottom: 30%;
    }

    .row.related-items{
        flex-wrap: inherit;
        overflow: scroll;
        position: relative;
    }

    .related-prog-div .related-items .item{
        width: 14em;
    }

    .related-prog-div{
        position: relative;
        overflow: hidden;
    }

    .related-prog-div::after{
        content: "";
        position: absolute;
        z-index: 1;
        top: 0;
        right: 0;
        bottom: 15px;
        pointer-events: none;
        background-image: linear-gradient(to right, rgba(255,255,255,0), #fff8e9 85%);
        width: 15%;
    }

    .related-prog-div-outer .arrow-right,
    .related-prog-div-outer .arrow-left{
        display: block;
        position: absolute;
        top: 0;
        bottom: 0;
        margin: auto 0;
        right: -8%;
        z-index: 1;
        width: 50px;
        height: auto;
        cursor: pointer;
    }
    .related-prog-div-outer .arrow-left{
        left: -8%;
    }

    .related-prog-div-outer{
        position: relative;
    }

    .about-us-bg-bottom-image{
        width: 60vw;
        right: 10%;
    }
    
}



@media only screen and (max-width: 425px) {
    .holding-title {
        bottom: 58%;
        width: 60vw;
    }
    
    .polygon-circle {
        height: 40vw;
        width: 40vw;
        right: 13%;
        top: 40%;
    }
    
    .polygon-triangle {
        height: 45vw;
        width: 45vw;
        left: 12%;
        top: 45%;
    }

    .polygon-triangle .polygon-text {
        left: 10%;
    }

    .polygon-parallelogram {
        height: 25vw;
        width: 25vw;
        left: -14%;
        top: 39%;
    }

    .holding-date{
        width: 30vw;
    }

    .polygon-circle .polygon-text {
        top: 55%;
        left: 12%;
    }

    .cloud-control-bar-div {
        left: 20%;
        width: 60%;
        bottom: 5%;
    }

    .cloud-tips{
        background-image: url(../images/common/cloud_tips_mobile.png);
        left: -3em;
    }

    .cloud-tips.end{
        background-image: url(../images/common/dinosaur-cloud.png);
        left: -12em;
    }

    .polygon-triangle-position{
        left: 10%;
    }

    .polygon-circle-position{
        right: 15%;
    }

    .polygon-text .icon {
        width: 10vw;
    }

    .polygon-circle-position .polygon-circle .polygon-text, 
    .polygon-triangle-position .polygon-triangle .polygon-text {
        top: 43%;
    }

    .polygon-circle-position .polygon-circle .polygon-text{
        left: 31%;
    }

    .lang-div{
        width: 100%;
    }

    .footer-div {
        min-height: 20vh;
    }

    .footer-follow-us {
        font-size: medium;
    }

    .footer-iac-logo {
        width: 5em;
    }

    .footer-mascot-icon{
        width: 8em;
    }

    .footer-functions-div{
        padding: 0 10%;
    }

    .become-iac-friends{
        margin-top: 5%;
        padding: 5px 7px;
    }

    .become-iac-friends span{
        font-size: 12px;
    }

    .banner-iframe{
        height: 300px;
    }

    .about-iac-main-div {
        min-height: 190vh;
    }

    .booking-guide-div .about-iac-main-div {
        min-height: 180vh;
    }

    .about-circle-bg {
        height: 180vh;
    }

    .booking-guide-div .about-circle-bg{
        height: 150vh;
    }

    .news-title,
    .download-div .news-title{
        padding-bottom: 35%;
    }

    .news-div .content-inner .iac-bg-bottom-image,
    .download-div .content-inner .iac-bg-bottom-image{
        width: 13em;
        top: 12%;
    }

    .download-div .content-inner .iac-bg-bottom-image{
        top: 3%;
    }

    .news-div .content-inner .inner-top ,
    .download-div .content-inner .inner-top{
        background-size: 100% 100%;
        height: 60px;
    }
    
    .news-content .items .right p,
    .news-content .items .right .items-title{
        font-size: 0.9em;
    }

    .news-content .items .right{
        margin-top: 5%;
    }

    .booking-guide-div.tips .content-infos{
        padding-right: 24%;
    }

    .booking-guide-div.tips .content-infos li{ 
        overflow: hidden;
        text-overflow: ellipsis;
    }
    
    .mouse-down-div img{
        width: 1em;
    }

    .footer-bottom .logos.chac-logos{
        width: 140px;
        margin: 15px 0;
    }

    .footer-bottom .logos.for-youth-logos{
        width: 140px;
    }
    
    .footer-bottom .spec-logos-col{
        max-width: unset;
    }
    
}

@media only screen and (max-width: 375px) {
    .polygon-triangle {
        height: 50vw;
        width: 50vw;
        left: 11%;
        top: 50%;
    }

    .polygon-triangle .polygon-text {
        left: 8%;
    }

    .polygon-circle {
        height: 50vw;
        width: 50vw;
        right: 12%;
        top: 35%;
    }

    .polygon-circle .polygon-text {
        left: 17%;
    }

    .polygon-circle-position {
        right: 12%;
        top: 39%;
    }

    .polygon-triangle-position{
        top: 55%;
    }
}