* {margin: 0; padding: 0; font-family: Tahoma;}
body h1,body h2,body h3,body p {color: white;}
div.col-1 {text-align: center;}
/*Main content*/
/* Alternating background grays for layout*/
/* First section contains header and such*/
div#firstSection {
    background-color: #333333;
    padding-bottom: 20px;
}  
#section1 img{
    height: 400px;
    width: 360px;
    border-radius: 50%;
}
/* Section 1 - intro area*/
#section1 {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
}
/* Section 2 - Section 2: showing carousel of languages/etc and current/past schedule 
About Me section 2 */
div#section2 {
    background-color: #262626;
    padding: 20px 0px;
}
div#section2 h1 {
    text-align: center;
}
#section2Carousel {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
}
#section2AboutMe {
    font-size: 13pt;
    color: white;
}
div#section2Carouselslide {
    height: 400px;
    width: 500px;
    overflow: hidden;
    margin: 20px auto;
}
.carousel-item img {
    height: 400px;
}
#courseReflection {
    margin: 0px 20px;
}
/* Section 3: containing current projects, cards, and past projects archive button */
div#section3 {
    background-color: #333333;
    padding: 20px 0px;
}
#cardGrid .card {
    height: 300px;
    overflow: hidden;
    text-align: center;
}
#cardGrid .card img {
    height: 65%;
}
div#section3 h1, div#section3 h2 {
    text-align: center;
}
#past-projects-button {
    display: block;
    margin: 20px 0px;
}
/* Section 4: Resume, contact info, extras to be here, download link */
#section4 {
    background-color: #262626;
    padding: 20px 0px;
    text-align: center;
}
a#resumeLink {
    color: black;
    border: 3px solid black; 
    border-radius: 15px; 
    padding-top: 2px;
    transition: 250ms;
}
a#resumeLink:hover {
    background-color: black;
    color: white;
    border-radius: 15px;
    transition: 250ms;
}
#quoteOutput {
    font-size: 16pt;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Verdana, sans-serif;
}
#authorOutput {
    font-family:'Lucida Sans Regular';
}
/* References.html styling */
div#tableContainer {
    border: 2px solid red;
    text-align: center;
    color: white;
    margin: 20px auto;
    padding: 20px;
}

div.card {
    display: inline-block;
    margin: 20px auto;
}

table, th, td {
    border: 2px solid gold;
    padding: 20px;
}
/*---------------media queries-----------------*/
@media(max-width: 1536px) {
    /*Section 1*/
    #section1 img{
        height: 350px;
        width: 310px;
    }
    /*Section 2*/
    div#section2Carouselslide {
        height: 250px;
        width: 250px;
        margin: 20px auto;
    }
    #cardGrid .card img {
        height: 65%;
    }
    .carousel-item img {
        height: 250px;
    }
    #section3AboutMe {
        font-size: 14pt;
    }
}

@media(max-width: 1380px) {
    /*Section 1*/
    #section1 img{
        height: 300px;
        width: 260px;
    }
    /*Section 2*/
    div#section2Carouselslide {
        height: 200px;
        width: 200px;
        margin: 10px auto;
    }
    .carousel-item img {
        height: 200px;
    }
    #section3AboutMe {
        font-size: 12pt;
    }
    /*Section 3*/
    #cardGrid .card {
        height: 200px;
    }
    #cardGrid .card img {
        height: 50%;
    }
}
@media(max-width: 700px) {
    /*Section 2*/
    #section2Carousel {
        flex-wrap: wrap;
    }
    /*Section 3*/
    #cardGrid .card {
        height: 150px;
        font-size: 10pt;
    }
    #cardGrid .card img {
        height: 40%;
    }
}