/*style sheet for the lab page - labs.html*/



/*main body of the page*/
body {
    background-color: #F7C6C6;
    width: 100%;
    margin: 0; /*reset padding and margin of body*/
    padding: 0;
}

/*page header on all pages*/
h1 {
    color: #24305E;
    width: 100%;
    font-size: 45pt;
    font-family: "Lucida Bright";
    text-align: center;
    border: 1px;
    padding-top: 25px;
    padding-bottom: 25px;
    margin: 0;
}

/*links of navigation bar*/
#navigation-bar a {
    font-family: "Lucida Bright";
    font-size: 25pt;
    padding: 0;
}

/*navigation bar div*/
#navigation-bar {
    margin: 0;
    padding: 0;
}

/*home link div on navigation bar*/
#home-link {
    width: 25%;
    background-color: #A8D0E6;
    float: left;
    text-align: center;
    font-weight: bold;
    color: #374785;
}

/*labs link div on navigation bar*/
#labs-link {
    width: 25%;
    background-color: #F8E9A1;
    float: left;
    text-align: center;
    font-weight: bold;
    color: #374785;
}

/*about me link div on navigation page*/
#about-link {
    width: 25%;
    background-color: #A8D0E6;
    float: left;
    text-align: center;
    font-weight: bold;
    color: #374785;
}

/*resume link div on navigation page*/
#portfolio-link {
    width: 25%;
    background-color: #F8E9A1;
    float: left;
    text-align: center;
    font-weight: bold;
    color: #374785;
}

/*lab 1 div*/
#lab-1 {
    position: relative; /*position is relative to its normal positioning*/
    background-color: #374785;
    padding: 10px;
    margin: 0;
    text-align: left;
    top: 37px;
    font-size: 16pt;
}

/*header in lab 1 div*/
#lab-1 h3 {
    font-family: "Century Gothic";
    color: #A8D0E6;
    margin: 0;
}

/*paragraph text in lab 1 div*/
#lab-1 p {
    font-family: "Century Gothic";
    color: #F8E9A1;
    font-size: 15pt;
}
/*lab 2 div*/
#lab-2 {
    position: relative; /*position is relative to its normal positioning*/
    background-color: #374785;
    padding: 10px;
    margin: 0;
    text-align: left;
    top: 35px;
    font-size: 16pt;
}

/*header in lab 2 div*/
#lab-2 h3 {
    font-family: "Century Gothic";
    color: #A8D0E6;
    margin: 0;
}

/*paragraph text in lab 2 div*/
#lab-2 p {
    font-family: "Century Gothic";
    color: #F8E9A1;
    font-size: 15pt;
}

#lab-2 a {
    font-family: 'Century Gothic';
    color: #F7C6C6;
    font-weight: bold;
}
/*lab 3 div*/
#lab-3 {
    position: relative; /*position is relative to its normal positioning*/
    background-color: #374785;
    padding: 10px;
    margin: 0;
    text-align: left;
    top: 35px;
    font-size: 16pt;
}

/*header in lab 3 div*/
#lab-3 h3 {
    font-family: "Century Gothic";
    color: #A8D0E6;
    margin: 0;
}

/*paragraph text in lab 3 div*/
#lab-3 p {
    font-family: "Century Gothic";
    color: #F8E9A1;
    font-size: 15pt;
}

#lab-3 a {
    font-family: 'Century Gothic';
    color: #F7C6C6;
    font-weight: bold;
}

/*lab 4 div*/
#lab-4 {
    position: relative; /*position is relative to its normal positioning*/
    background-color: #374785;
    padding: 10px;
    margin: 0;
    text-align: left;
    top: 35px;
    font-size: 16pt;
}

/*header in lab 4 div*/
#lab-4 h3 {
    font-family: "Century Gothic";
    color: #A8D0E6;
    margin: 0;
}

/*paragraph text in lab 4 div*/
#lab-4 p {
    font-family: "Century Gothic";
    color: #F8E9A1;
    font-size: 15pt;
}

#lab-4 a {
    font-family: 'Century Gothic';
    color: #F7C6C6;
    font-weight: bold;
}

#tutorial {
    position: relative; /*position is relative to its normal positioning*/
    background-color: #374785;
    padding: 10px;
    margin: 0;
    text-align: left;
    top: 35px;
    font-size: 16pt;
}

#tutorial h3 {
    font-family: "Century Gothic";
    color: #A8D0E6;
    margin: 0;
}

#tutorial p {
    font-family: "Century Gothic";
    color: #F8E9A1;
    font-size: 15pt;
}

#tutorial a {
    font-family: 'Century Gothic';
    color: #F7C6C6;
    font-weight: bold;
    display: block;
}


/*links on page when mouse hovers over them*/
a:hover {
    color: #F7C6C6;
}

/*all links on the page*/
a:link {
    color: #24305E;
    text-decoration: none;
}

/*footer div*/
#footer {
    position: relative; /*position is relative to its normal positioning*/
    background-color: #A8D0E6;
    width: 100%;
    height: 6%;
    padding: 10px;
    clear: both; /*does not allow floating on either side of element*/
    box-sizing: border-box; /*width and height include border and padding*/
    margin: 0;
    top: 30px;
}

/*link in footer*/
#footer a {
    font-family: "Century Gothic";
    font-weight: normal;
    color: #24305E;
}

/*paragraph text in footer*/
#footer p {
    position: relative; /*position is relative to its normal positioning*/
    font-family: "Century Gothic";
    font-weight: normal;
    float: right;
    color: #24305E;
    margin: 0;
}

/*styling for small screens smaller than 600px*/
@media screen and (max-width: 600px) {
    #navigation-bar a {
        font-size: 17pt;
    }

    #lab-1 {
        top: 25px;
    }

        #lab-1 p {
            font-size: 13pt;
        }

        #lab-1 h3 {
            font-size: 15pt;
        }

    #footer {
        top: 0;
    }
}