/**** MEDIA QUERIES START */
@media (min-width: 320px) {
    .container {
        max-width: 300px;
    }

    /**** Main Nav Start ****/
    #headerBackBar {
        height: 115px;
    }

    div#header.container {
        width: 300px;
        margin-left: -15px;
    }

    div#header div.row {
        width: 300px;
        margin-left: 0px;
    }

    #navbarSupportedContent ul {
        width: 300px;
        margin-top: 0px;
        padding-left: 15px;
        padding-right: 15px;
    }

    #spacerColumn {
        display: none;
        width: 100%;
        height: auto;
    }

    nav {
        left: -10px;
    }

    .navbar {
        width: 100% !important;
        padding: 0px;
        left: 0px;
    }

    #navbarSupportedContent ul {
        width: 300px;
        padding-left: 15px;
        padding-right: 15px;
    }

    a.nav-link {
        margin-top: 90px;
    }

    li.nav-item {
        width: 100px;
        float: right;
    }

    div.dropdown-menu.show {
        height: 430px !important;
        left: -75px;
    }

    #work, #workHome {
        margin-left: 0px;
        padding: 0px;
        float: right;
    }

    #about, #aboutHome {
        margin-left: 0px;
        padding: 0px;
        float: right;
    }
    /**** Main Nav End ****/

    #contactDescription {
        width: 270px;
        margin-left: 0px;
    }

    #aboutImageContainer {
        width: 200px;
        margin-left: calc((100% - 200px)/2);
        margin-bottom: 10px;
    }

    #contactInfoRow {
        width: 300px;
        position: relative;
        float: left;
    }

    #aboutImage {
        width: 200px;
        margin-left: calc((100% - 200px)/2);
        margin-right: calc((100% - 200px)/2);
    }
    
    #footerCopyright, #footerEmail {
        font-size: 0.7em !important;
        text-align: center;
    }

    #footerCopyright {
        width: 70px;
    }

    #footerEmail {
        width: 80px;
    }

    #footerEmail a {
        width: 80px;
    }

    footer div.container div.row {
        margin-left: 0px;
    }

    footer div.container div.row ul {
        width: 100%;
    }

    [title~="copyright"] {
        width: 70px !important;
        margin-left: -10px !important;
    }

    [title~="email"] {
        width: 80px !important;
        margin-right: -10px !important;
    }

    footer div.container div.row ul li {
        float: left;
        margin-left: 5px;
        margin-right: 5px;
    }
}

@media (min-width: 576px) {
    .container {
        max-width: 540px;
    }

    /**** Main Nav Start ****/
    #headerBackBar {
        height: 115px;
    }

    div#header.container {
        width: 540px;
        margin-left: -15px;
    }

    div#header div.row {
        width: 540px;
        margin-left: 0px;
    }

    #navbarSupportedContent ul {
        width: 540px;
        margin-top: 0px;
        padding-left: 15px;
        padding-right: 15px;
    }

    #spacerColumn {
        display: block;
        width: 50%;
        height: auto;
    }

    nav {
        left: -15px;
    }

    .navbar {
        width: 100% !important;
        padding: 0px;
        margin-left: 0px;
    }

    #navbarSupportedContent ul {
        width: 540px;
        padding-left: 15px;
        padding-right: 15px;
    }

    a.nav-link {
        margin-top: 90px;
    }

    li.nav-item {
        width: 100px;
        float: right;
    }

    div.dropdown-menu.show {
        height: 430px !important;
    }

    #work, #workHome {
        margin-left: 0px;
        padding: 0px;
        float: right;
    }

    #about, #aboutHome {
        margin-left: 0px;
        padding: 0px;
        float: right;
    }
    /**** Main Nav End ****/

    #aboutMeTextContainer {
        display: block;
        width: 540px;
        height: auto;

    }

    #contactDescription {
        width: 510px;
        position: relative;
        float: none;
        margin-left: 0px;
        margin-top: 0px;
    }

    #contactDescription h4 {
        width: 540px;
    }

    #aboutImage {
        display: block;
        width: 200px;
        height: auto;
        margin-left: 0px;
        margin-right: 10px;
    }

    #contactInfoRow {
        width: 540px;
        position: relative;
        float: left !important;
    }

    #footerCopyright, #footerEmail {
        font-size: 1.0rem !important;
        text-align: center;
    }

    #footerCopyright {
        width: 190px;
    }

    #footerEmail {
        width: 190px;
    }

    #footerEmail a {
        width: 80px;
    }

    footer div.container div.row {
        margin-left: 0px;
    }

    footer div.container div.row ul {
        width: 100%;
    }

    [title~="copyright"] {
        width: 190px !important;
        margin-left: 0px !important;
    }

    [title~="email"] {
        width: 190px !important;
        margin-right: -10px !important;
    }

    footer div.container div.row ul li {
        float: left;
        margin-left: 5px;
        margin-right: 5px;
    }
}

@media (min-width: 768px) {
    .container {
        max-width: 720px;
    }

    /**** Main Nav Start ****/
    #headerBackBar {
        height: 115px;
    }

    div#header.container {
        width: 100%;
        margin-left: -15px;
    }

    div#header div.row {
        width: 720px;
        margin-left: 0px;
    }

    #spacerColumn {
        display: block;
        width: 100%;
        height: auto;
    }

    nav {
        left: -15px;
    }

    .navbar {
        width: 100% !important;
        padding: 0px;
    }

    #navbarSupportedContent {
        width: 720px;
    }

    #navbarSupportedContent ul {
        width: 100%;
        padding-left: 15px;
        padding-right: 15px;
        margin-left: 0px;
    }

    a.nav-link {
        margin-top: 90px;
    }

    li.nav-item {
        width: 100px;
        float: right;
    }

    div.dropdown-menu.show {
        height: 430px !important;
        left: -125px;
    }

    #work, #workHome {
        margin-left: 0px;
        padding: 0px;
        float: right;
    }

    #about, #aboutHome {
        margin-left: 0px;
        padding: 0px;
        float: right;
    }
    /**** Main Nav End ****/

    #aboutMeTextContainer {
        width: 720px;

    }

    #contactInfoRow {
        width: 720px;
        position: relative;
        float: left;
    }

    #contactDescription {
        width: 700px;
    }

    #footerCopyright, #footerEmail {
        font-size: 1.0rem !important;
        text-align: center;
    }

    #footerCopyright {
        width: 190px;
    }

    #footerEmail {
        width: 190px;
    }

    #footerEmail a {
        width: 80px;
    }

    footer div.container div.row {
        margin-left: 0px;
    }

    footer div.container div.row ul {
        width: 100%;
    }

    [title~="copyright"] {
        width: 190px !important;
        margin-left: 15px !important;
    }

    [title~="email"] {
        width: 190px !important;
        margin-right: -10px !important;
    }

    footer div.container div.row ul li {
        float: left;
        margin-left: 5px;
        margin-right: 5px;
    }
}

@media (min-width: 1024px) {
    .container {
        max-width: 992px;
    }

    /**** Main Nav Start ****/
    #headerBackBar {
        height: 115px;
    }

    div#header.container {
        width: 100%;
        margin-left: -15px;
    }

    div#header div.row {
        width: 992px;
        margin-left: 0px;
    }

    #spacerColumn {
        display: block;
        width: 100%;
        height: auto;
    }

    nav {
        left: -15px;
    }

    nav.navbar {
        width: 992px !important;
        padding: 0px;
        left: 0px;
    }

    #navbarSupportedContent {
        width: 992px;
        margin-right: 0px;
    }

    #navbarSupportedContent ul {
        width: 992px;
        padding-left: 15px;
        padding-right: 15px;
        margin-left: -15px;
    }

    a.nav-link {
        margin-top: 90px;
    }

    li.nav-item {
        width: 100px;
        float: right;
    }

    div.dropdown-menu.show {
        height: 430px !important;
    }

    #work, #workHome {
        margin-left: 0px;
        padding: 0px;
        float: right;
    }

    #aboutHome, #workHome {
        margin-right: 0px;
    }

    #about, #aboutHome {
        margin-left: 0px;
        padding: 0px;
        float: right;
    }
    /**** Main Nav End ****/

    #contactInfoRow {
        width: 100%;
    }
}

@media (min-width: 1280px) {
    .container {
        max-width: 1220px;
    }

    /**** Main Nav Start ****/
    #headerBackBar {
        height: 115px;
    }

    div#header.container {
        width: 100%;
        margin-left: -15px;
    }

    div#header div.row {
        width: 1220px;
        margin-left: 0px;
    }

    #spacerColumn {
        display: block;
        width: 100%;
        height: auto;
    }

    nav {
        left: -15px;
    }

    nav.navbar {
        width: 1220px !important;
        padding: 0px;
        left: 0px;
    }

    #navbarSupportedContent {
        width: 1220px;
        margin-right: 0px;
    }

    #navbarSupportedContent ul {
        width: 1220px;
        padding-left: 15px;
        padding-right: 15px;
        margin-left: -15px;
    }

    a.nav-link {
        margin-top: 90px;
    }

    li.nav-item {
        width: 100px;
        float: right;
    }

    div.dropdown-menu.show {
        height: 430px !important;
    }

    #work, #workHome {
        margin-left: 0px;
        padding: 0px;
        float: right;
    }

    #about, #aboutHome {
        margin-left: 0px;
        padding: 0px;
        float: right;
    }
    /**** Main Nav End ****/

    .footerFixedBottom div div {
        left: calc((100% - 1220px)/2);
        text-align: center;
    }

    #footerCopyright, #footerEmail {
        font-size: 1.0rem !important;
        text-align: center;
    }

    #footerCopyright {
        width: 190px;
    }

    #footerEmail {
        width: 190px;
    }

    #footerEmail a {
        width: 80px;
    }

    footer div.container div.row {
        margin-left: 0px;
    }

    footer div.container div.row ul {
        width: 100%;
    }

    [title~="copyright"] {
        width: 190px !important;
        margin-left: 145px !important;
    }

    [title~="email"] {
        width: 190px !important;
        margin-right: -10px !important;
    }

    footer div.container div.row ul li {
        float: left;
        margin-left: 5px;
        margin-right: 5px;
    }

}
/**** MEDIA QUERIES END ****/