


@media only screen and (min-width: 2560px) { 
    * 
    {
        overflow-x: visible;
    }
    .designSageLogo 
    {
        scale: 2;
        top: 200px;
    }
    .designSageText 
    {
        font-size: 15em;
        top: 200px;
    }
    .designSageDesc
    {
        font-size: 4em;
        width: 100%;
        left: 50%;
        transform: 0;
        margin: auto 0;
        color: rgba(238, 238, 160, 0.933);
    }
    .designSageLogo .lightRayOne  
    {
        height: 100%;
    }
    .redirectSocialdesignSage 
    {
        top: 80%;
        scale: 2;
    }
    .redirectSocialdesignSage::before  
    {
        left: 15%;
    }
    .inProgressText 
    {
        top: 75%;
        font-size: 2em;
    }
    footer 
    {
        top: 80px;
        scale: 2;
    }
}


@media only screen and (min-width: 1440px) { 
    .designSageLogo 
    {
        scale: 1.2;
        top: 50px;
    }
    .designSageText 
    {
        font-size: 8em;
    }
    .designSageDesc
    {
        font-size: 2em;
        width: 80%;
        left: 40%;
        transform: 0;
        margin: auto 0;
        color: rgba(238, 238, 160, 0.933);
    }
    .designSageLogo .lightRayOne  
    {
        height: 60%;
        transform: rotate(-20deg) !important;
    }
    .redirectSocialdesignSage 
    {
        top: 80% !important;
        scale: 1;
    }
    .redirectSocialdesignSage::before  
    {
        left: 15%;
    }
    .inProgressText 
    {
        top: 75% !important;
        font-size: 1em;
    }
    footer 
    {
        scale: 1.2;
    }
}


@media only screen and (max-width: 1024px) { 
    .designSageLogo .lightRayOne  
    {
        height: 63% !important;
        transform: rotate(-26deg) !important;
    }
    .redirectSocialdesignSage 
    {
        scale: 1 !important;
    }
    .redirectSocialdesignSage::before  
    {
        left: 15%;
    }
    .inProgressText 
    {
        top: 80%;
        font-size: 1.2em;
    }
    footer 
    {
        scale: 1;
    }
}


@media only screen and (min-width: 768px) { 
    .designSageLogo .lightRayOne  
    {
        height: 80% !important;
        transform: rotate(-20deg) !important;
    }
    footer 
    {
        scale: 1;
    }
    .redirectSocialdesignSage 
    {
        top: 90%;
        scale: 1;
    }
    .designSageText 
    {
        font-size: 6em;
    }
    .designSageDesc
    {
        font-size: 1.5em;
    }
}

@media only screen and (max-width: 600px) {
    .designSageMask
    {
        justify-content: center;
        align-items: center;
    }
    .designSageLogo 
    {
        scale: 1;
        top: 00px;
    }
    .designSageText 
    {
        font-size: 4em !important;
    }
    .designSageDesc
    {
        font-size: 1em;
        width: 80%;
        left: 40%;
        transform: 0;
        margin: auto 0;
        color: rgba(238, 238, 160, 0.933);
    }
    .designSageLogo
    {
        width: 100%;
    }
    .designSageLogo .lightRayOne 
    {
        left: 50px;
        top: 40px;
        height: 70% !important;
        transform: rotate(-15deg) !important;
    }
    .designSageLogo .lightRayTwo 
    {
        left: 80px;
        height: 60%;
    }
    .redirectSocialdesignSage::before  
    {
        left: 35%;
    }
    .inProgressText 
    {
        top: 75%;
        font-size: 0.8em;
    }
    footer 
    {
        scale: 1;
    }
    .redirectSocialdesignSage 
    {
        top: 90%;
        scale: 1;
    }
}
