
/* Default settings */
@media screen {

    /* General styles */
    body {
        background-color: black;
        font-family: Georgia, Times, Times, serif;
        font-style: italic;
        color: white;
    }

    /* Title styles */
    .title {
        height: auto;
        width: auto;
        text-align: center;
        font-size: 5.3rem; /* font size of the title*/
        margin-top: 8rem; /* margin-top of the title */
    }

    /* Social icons styles */
    .socials, .socials2 {
        display: flex;
        justify-content: space-around;
        margin-top: 8rem; /* margin-top of the social icons*/
    }
    .socials {
        padding-left: 25rem; /* padding-left of the social icons */
        padding-right: 25rem; /* padding-right for the social icons */
    }
    .socials2 {
        margin-left: 38rem; /* margin-left for the social icons */
        margin-right: 38rem; /* margin-right for the social icons */
    }

    /* image size */
    .socials img, .socials2 img {
        width: 7rem; /* width of the images */
        height: 7rem; /* height of the images */
    }

}



/* Settings for 0-349 */
@media screen and (min-width: 0px) and (max-width: 349px) {

    /* Title styles */
    .title {
        font-size: 4rem; /* font size of the title*/
        margin-top: 6rem; /* margin-top of the title */
    }

    /* Social icons styles */
    .socials, .socials2 {
        margin-top: 8rem; /* margin-top of the social icons*/
    }
    .socials {
        padding-left: 0.7rem; /* padding-left of the social icons */
        padding-right: 0.7rem; /* padding-right for the social icons */
    }
    .socials2 {
        margin-left: 5rem; /* margin-left for the social icons */
        margin-right: 5rem; /* margin-right for the social icons */
    }

    /* image size */
    .socials img, .socials2 img {
        width: 4rem; /* width of the images */
        height: 4rem; /* height of the images */
    }

}



/* Settings for 350-599 */
@media screen and (min-width: 350px) and (max-width: 599px) {

    /* Title styles */
    .title {
        font-size: 4rem; /* font size of the title*/
        margin-top: 6rem; /* margin-top of the title */
    }

    /* Social icons styles */
    .socials, .socials2 {
        margin-top: 6rem; /* margin-top of the social icons*/
    }
    .socials {
        padding-left: 0.7rem; /* padding-left of the social icons */
        padding-right: 0.7rem; /* padding-right for the social icons */
    }
    .socials2 {
        margin-left: 4rem; /* margin-left for the social icons */
        margin-right: 4rem; /* margin-right for the social icons */
    }

    /* image size */
    .socials img, .socials2 img {
        width: 4rem; /* width of the images */
        height: 4rem; /* height of the images */
    }

}



/* Settings for 600-799 */
@media screen and (min-width: 600px) and (max-width: 799px) {

    /* Title styles */
    .title {
        font-size: 3.3rem; /* font size of the title*/
        margin-top: 3rem; /* margin-top of the title */
    }
    
    /* Social icons styles */
    .socials, .socials2 {
        margin-top: 2.7rem; /* margin-top of the social icons*/
    }
    .socials {
        padding-left: 7rem; /* padding-left of the social icons */
        padding-right: 7rem; /* padding-right for the social icons */
    }
    .socials2 {
        margin-left: 13rem; /* margin-left for the social icons */
        margin-right: 13rem; /* margin-right for the social icons */
    }


    /* image size */
    .socials img, .socials2 img {
        width: 3.7rem; /* width of the images */
        height: 3.7rem; /* height of the images */
    }
       
}



/* Settings for 800-999 */
@media screen and (min-width: 800px) and (max-width: 999px) {

    /* Title styles */
    .title {
        font-size: 3.5rem; /* font size of the title*/
        margin-top: 3rem; /* margin-top of the title */
    }
    
    /* Social icons styles */
    .socials, .socials2 {
        margin-top: 2.7rem; /* margin-top of the social icons*/
    }
    .socials {
        padding-left: 10rem; /* padding-left of the social icons */
        padding-right: 10rem; /* padding-right for the social icons */
    }
    .socials2 {
        margin-left: 17rem; /* margin-left for the social icons */
        margin-right: 17rem; /* margin-right for the social icons */
    }


    /* image size */
    .socials img, .socials2 img {
        width: 4rem; /* width of the images */
        height: 4rem; /* height of the images */
    }
       
}



/* Settings for 1000-1249 */
@media screen and (min-width: 1000px) and (max-width: 1249px) {

    /* Title styles */
    .title {
        font-size: 6rem; /* font size of the title*/
        margin-top: 5rem; /* margin-top of the title */
    }
    
    /* Social icons styles */
    .socials, .socials2 {
        margin-top: 5rem; /* margin-top of the social icons*/
    }
    .socials {
        padding-left: 8rem; /* padding-left of the social icons */
        padding-right: 8rem; /* padding-right for the social icons */
    }
    .socials2 {
        margin-left: 15rem; /* margin-left for the social icons */
        margin-right: 15rem; /* margin-right for the social icons */
    }
    
    /* image size */
    .socials img, .socials2 img {
        width: 6.5rem; /* width of the images */
        height: 6.5rem; /* height of the images */
    }
       
}



/* Settings for 1250-1499 */
@media screen and (min-width: 1250px) and (max-width: 1499px) {

    /* Title styles */
    .title {
        font-size: 8rem; /* font size of the title*/
        margin-top: 5rem; /* margin-top of the title */
    }
    
    /* Social icons styles */
    .socials, .socials2 {
        margin-top: 5rem; /* margin-top of the social icons*/
    }
    .socials {
        padding-left: 8rem; /* padding-left of the social icons */
        padding-right: 8rem; /* padding-right for the social icons */
    }
    .socials2 {
        margin-left: 15rem; /* margin-left for the social icons */
        margin-right: 15rem; /* margin-right for the social icons */
    }
    
    /* image size */
    .socials img, .socials2 img {
        width: 8rem; /* width of the images */
        height: 8rem; /* height of the images */
    }
       
}



/* Settings for 1500-1749 */
@media screen and (min-width: 1500px) and (max-width: 1749px) {

    /* Title styles */
    .title {
        font-size: 3.5rem; /* font size of the title*/
        margin-top: 3rem; /* margin-top of the title */
    }

    /* Social icons styles */
    .socials, .socials2 {
        margin-top: 3rem; /* margin-top of the social icons*/
    }
    .socials {
        padding-left: 8rem; /* padding-left of the social icons */
        padding-right: 8rem; /* padding-right for the social icons */
    }
    .socials2 {
        margin-left: 15rem; /* margin-left for the social icons */
        margin-right: 15rem; /* margin-right for the social icons */
    }

    /* image size */
    .socials img, .socials2 img {
        width: 4rem; /* width of the images */
        height: 4rem; /* height of the images */
    }
   
}







/* Settings for 800-999 */
@media screen and (min-width: 500px) and (max-width: 699px) and (orientation: portrait) {

    /* Title styles */
    .title {
        font-size: 4rem; /* font size of the title*/
        margin-top: 6rem; /* margin-top of the title */
    }
    
    /* Social icons styles */
    .socials, .socials2 {
        margin-top: 6rem; /* margin-top of the social icons*/
    }
    .socials {
        padding-left: 3rem; /* padding-left of the social icons */
        padding-right: 3rem; /* padding-right for the social icons */
    }
    .socials2 {
        margin-left: 6rem; /* margin-left for the social icons */
        margin-right: 6rem; /* margin-right for the social icons */
    }


    /* image size */
    .socials img, .socials2 img {
        width: 5rem; /* width of the images */
        height: 5rem; /* height of the images */
    }
       
}



/* Settings for 800-999 */
@media screen and (min-width: 700px) and (max-width: 849px) and (orientation: portrait) {

    /* Title styles */
    .title {
        font-size: 6rem; /* font size of the title*/
        margin-top: 8rem; /* margin-top of the title */
    }
    
    /* Social icons styles */
    .socials, .socials2 {
        margin-top: 7rem; /* margin-top of the social icons*/
    }
    .socials {
        padding-left: 5rem; /* padding-left of the social icons */
        padding-right: 5rem; /* padding-right for the social icons */
    }
    .socials2 {
        margin-left: 10rem; /* margin-left for the social icons */
        margin-right: 10rem; /* margin-right for the social icons */
    }


    /* image size */
    .socials img, .socials2 img {
        width: 6.5rem; /* width of the images */
        height: 6.5rem; /* height of the images */
    }
       
}



/* Settings for 800-999 */
@media screen and (min-width: 850px) and (max-width: 999px) and (orientation: portrait) {

    /* Title styles */
    .title {
        font-size: 8rem; /* font size of the title*/
        margin-top: 10rem; /* margin-top of the title */
    }
    
    /* Social icons styles */
    .socials, .socials2 {
        margin-top: 8rem; /* margin-top of the social icons*/
    }
    .socials {
        padding-left: 5rem; /* padding-left of the social icons */
        padding-right: 5rem; /* padding-right for the social icons */
    }
    .socials2 {
        margin-left: 10rem; /* margin-left for the social icons */
        margin-right: 10rem; /* margin-right for the social icons */
    }


    /* image size */
    .socials img, .socials2 img {
        width: 8rem; /* width of the images */
        height: 8rem; /* height of the images */
    }
       
}



/* Settings for 800-999 */
@media screen and (min-width: 1000px) and (max-width: 1249px) and (orientation: portrait) {

    /* Title styles */
    .title {
        font-size: 8rem; /* font size of the title*/
        margin-top: 11rem; /* margin-top of the title */
    }
    
    /* Social icons styles */
    .socials, .socials2 {
        margin-top: 8rem; /* margin-top of the social icons*/
    }
    .socials {
        padding-left: 5rem; /* padding-left of the social icons */
        padding-right: 5rem; /* padding-right for the social icons */
    }
    .socials2 {
        margin-left: 10rem; /* margin-left for the social icons */
        margin-right: 10rem; /* margin-right for the social icons */
    }


    /* image size */
    .socials img, .socials2 img {
        width: 8.5rem; /* width of the images */
        height: 8.5rem; /* height of the images */
    }
       
}