*, *:before, *:after {
    -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

::placeholder { /* Firefox, Chrome, Opera */ 
    color: #0076c1 !important;
} 

:-ms-input-placeholder { /* Internet Explorer 10-11 */ 
    color: #0076c1 !important; 
} 

::-ms-input-placeholder { /* Microsoft Edge */ 
    color: #0076c1 !important; 
}

html, body { 
    font-size: 100%;
    font-family: 'Helvetica';
    margin: 0px;
    height: 100%;
    background-color: #09BCFD !important;
}

.removeMarginTB {
    margin-top: 0px;
    margin-bottom: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
}

.removePaddingLR {
    padding-left: 0px;
    padding-right: 0px;
}

.white-background {
    background-color: white;
}

.blue-background {
    background-color: #003E7E;
}

/* Navigation menu */

.bn-nav {
    cursor: pointer;
}

.liveWorkshopActive {
    font-weight: bold;
    color: #0000FF !important;
    background-color: #D4EDDA;
}

.navbar-nav {
    font-size: 65%;
    font-weight: bold;
}

a.nav-item.nav-link {
    margin-left: 2px;
    margin-right: 2px;
}

.navbar-dark .navbar-nav .nav-link.active {
    background-color: white; 
    color: #F7AC5E;
}

.countdownText {
    font-size: 100%;
    font-weight: bold;
}

.countdownInst {
    font-size: 70%;
    font-weight: normal;
}

.infoAlertText {
    font-size: 100%;
}

.workshopStartedAlertText {
    font-size: 100%;
}

.alertLink {
    font-weight: bold;
}

.alertLink:hover {
    cursor: pointer;
}

.siteTitle {
    font-size: 110%;
    font-weight: bold;
    color: #0076BF;
}

.siteSubtitle {
    font-size: 90%;
    font-weight: bold;
    color: black;
}

/* Welcome page */

.airportCode {
    font-size: 250%;
    font-weight: bold;
    color: #44C4F1;
    margin-left: 5px;
    margin-bottom: -3px;
    line-height: 100%;
}

.welcomeArea {
    width: 100%;
    /*height: 100%;*/
    min-height: 200px;
    max-height: 250px;
    overflow-y: auto;
}

.welcomeHeading {
    color: #003E7E;
    font-size: 100%;
    font-weight: bold;
}

.welcomeContent {
    font-size: 75%;
    margin-top: -10px;
}

.liveWorkshopBG {
    background-color: #0076BF;
}

.liveWorkshopTimes {
    max-height: 150px;
    overflow-y: auto;
}

.liveWorkshopHeading {
    margin-top: 10px;
    color: white;
    font-size: 100%;
    font-weight: bold;
    background-color: #003E7E;
    padding-left: 50px;
    padding-right: 50px;
}

.liveWorkshopArea ul {
    /*margin-left: -50px;*/
}

.liveWorkshopArea li {
    color: white;
    font-weight: normal;
    list-style-type: none;
    font-size: 90%;
    /*margin-left: 15px;*/
}

.liveMtg {
    text-decoration: underline;
    color: #F7AC5E;
}

.liveMtg:hover {
    cursor: pointer;
    color: white;
}

/* Webinar List */

.faaDisclaimer {
    font-size: 80%;
    font-style: italic;
    color: black;
}

.popup { 
    font-size: 95% !important; 
    text-align:right;
}  

.popupCol1 td:nth-child(1){ 
    text-align:left !important;
}     

.popupLastRow tbody > tr:last-child > td{
    font-weight: bold;
    padding-top: 5px;
}

.table { 
    font-size: 75%;
    border: 0px solid #003E7E;
}

.table thead {
    background-color: #003E7E;
}

.table thead > tr > th { 
    border-bottom: none;
    color: white;
    vertical-align: middle;
    padding: 2px;
}

.table thead > tr > th, .table tfoot > tr > th, .table thead > tr > td, .table tfoot > tr > td { 
    border: 0px solid #003E7E;
}

.table tbody > tr > td, .table tbody > tr > th {
    color: #003E7E;
    background-color: white;
    border-top: 0px;
    border-bottom: 1px solid #0076c1;
    line-height: .5;
}

.WebinarContainer {
    background-color: #0076c1; 
    width: 90%; 
    margin: auto;
}

.WebinarContainerLeftContent {
    vertical-align: top;
    text-align: center;
    padding: 2px 1px 2px 2px;
}

.WebinarContainerTitleText {
    color: white;
    font-size: large;
}

.WebinarContainerSupportContent {
    position: absolute;
    bottom: 0px; 
    color: white; 
    text-align: center; 
    width: 100%; 
    height: 22px; 
    margin: 0px 2px 2px 0px;
}

.webinarTableHead {
    font-size: 1.2vw;
}

.webinarTableRow {
    font-size: 1.1vw;
}

@media only screen and (max-width: 700px){
    .webinarTableHead {
        font-size: 1.8vw;
    }
    .webinarTableRow {
        font-size: 1.7vw;
    }
}

.WebinarContainerSupportText {
    line-height: 1.6vw;
    font-size: 1.6vw;
    width: 100%;
}

.WebinarContainerRightContent {
    background-color: #0076c1; 
    padding: 2px 2px 2px 1px;
}

.WebinarContainerTableLink {
    color: #003E7E;
    text-decoration: underline;
    cursor: pointer;
}

a.WebinarContainerTableLink:link {
    color: #003E7E;
    text-decoration: underline;
}

a.WebinarContainerTableLink:visited {
    color: #003E7E;
}

a.WebinarContainerTableLink:hover {
    color: #003E7E;
}

a.WebinarContainerTableLink:active {
    color: #003E7E;
}

a.WebinarContainerSupportLink:link {
    color: white;
    text-decoration: underline;
}

a.WebinarContainerSupportLink:visited {
    color: white;
}

a.WebinarContainerSupportLink:hover {
    color: white;
}

a.WebinarContainerSupportLink:active {
    color: white;
}

.WebinarJoinLink {
    color: white;
    cursor: pointer;
}

a.WebinarJoinLink:link {
    color: white;
    text-decoration: underline;
}

a.WebinarJoinLink:visited {
    color: white;
}

a.WebinarJoinLink:hover {
    color: white;
}

a.WebinarJoinLink:active {
    color: white;
}

.webinarText {
    font-size: 1.3vw;
}

.webinarNotes {
    font-size: 1.0vw;
}

@media only screen and (max-width: 700px){
    .webinarText {
        font-size: 2.2vw;
    }
    .webinarNotes {
        font-size: 1.8vw;
    }
}


/* Webinar Signin */

.WebinarSigninContainerLocation {
    background-color: white;
    color: #003E7E;
    text-align: center;
    font-size: large;
    padding: 5px;
    font-weight: bold;
}

.WebinarSigninContainerTitle {
    background-color: #0076c1;
    color: white;
    text-align: center;
    font-size: large;
    padding: 5px;
}

.WebinarSigninContainerForm {
    background-color: white;
    color: #0076c1;
    padding-top: 15px;
}

.WebinarSigninContainerForm label {
    background-color: white;
    color: #0076c1;
}

.WebinarSigninContainerForm input {
    margin-bottom: 5px;
}

.WebinarSigninContainerForm label {
    font-size: medium;
}

.WebinarSigninContainerForm button {
    background-color: #0076c1;
}

.LabelHead {
    font-size: small !important;
    font-weight: bold;
    margin: 0px 0px 2px;
}

/* Boards */

.carousel-indicators li {
    width: 10px;
    height: 10px;
    border-radius: 100%;
}
.carousel-indicators {
    bottom: -50px;
}

/* Style the Image Used to Trigger the Modal */
.myImg {
    cursor: pointer;
    transition: 0.3s;
}

.myImg:hover {opacity: 0.7;}

/* The Modal (background) */
.modal {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0,0,0,1.0);
}

/* Modal Content (Image) */
.modal-content {
    margin: auto;
    display: block;
    width: 90%;
    /* max-width: 700px; */
}

/* Caption of Modal Image (Image Text) - Same Width as the Image */
#caption {
    margin: auto;
    display: block;
    width: 90%;
    /* max-width: 700px; */
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px;
}

/* Add Animation - Zoom in the Modal */
.modal-content, #caption {
    -webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 0.6s;
}

@-webkit-keyframes zoom {
    from {-webkit-transform:scale(0)}
    to {-webkit-transform:scale(1)}
}

@keyframes zoom {
    from {transform:scale(0)}
    to {transform:scale(1)}
}

/* The Close Button */
.closeModal {
    position: absolute;
    top: 15px;
    right: 35px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
}

.closeModal:hover,
.closeModal:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}

/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px){
    .modal-content {
        width: 100%;
    }
}

.carousel-control-prev {
    margin-left: -5vw;
}

.carousel-control-next {
    margin-right: -5vw;
}

.boardsArea {
    width: 100%;
    height: 100%;
    /*    min-height: 200px;
        max-height: 250px;*/
    overflow-y: auto;
}

.boardsHeading {
    color: #003E7E;
    font-size: 100%;
    font-weight: bold;
}

.boardsContent {
    font-size: 75%;
    margin-top: -10px;
}

.boardsMediaHeading {
    text-align: left;
    margin-top: 10px;
    margin-left: 5px;
    color: white;
    font-size: 100%;
    font-weight: normal;
}

.boardsAudioIframeContainer {
    margin-left: 15px;
    margin-right: 15px;
    margin-bottom: 15px;
}

.boardsVid {
    height: 40%;
}

/* Project Background */

.backgroundArea {
    width: 100%;
    /*height: 100%;*/
    min-height: 200px;
    max-height: 250px;
    overflow-y: auto;
}

.backgroundHeading {
    color: #003E7E;
    font-size: 100%;
    font-weight: bold;
}

.backgroundContent {
    font-size: 75%;
    margin-top: -10px;
}

/* Noise Tool */

.noiseParent {
    border: 6px solid #0076BF;
    z-index: 1;
}

.noiseHelp {
    color: white;
    font-weight: bold;
    position: absolute;
    top: -4px;
    right: 0px;
}

.noiseHelp:hover {
    cursor: pointer;
}

.noiseButtonNormal {
    background-color: #0076c1;
}

.noiseButtonSelected {
    background-color: orange;
}

.noiseButton {
    cursor: pointer;
    display: inline-block;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 5px;
    padding-right: 5px;
    margin-bottom: 10px;
    line-height: 1.3vw;
    font-size: 1.3vw;
    color: white;
    border: 1px solid #000000;
    border-radius: 6px;
}

@media only screen and (max-width: 800px) {
    .noiseButton {
        line-height: 2.5vw;
        font-size: 2.5vw;
    }

    .leaflet-control-geocoder-form input {
        width: 210px;
    }
}

@media only screen and (max-width: 1000px) {

    .noiseInfo {
        margin-bottom: 20px;
        justify-content: center!important;
    }
}

/* Archive */

.archiveColumn {
    background-color: #0076BF;
}

.archiveArea {
    /*width: 100%;*/
    height: 100%;
    /*    min-height: 500px;
        max-height: 550px;*/
    overflow-y: auto;
}

.archiveHeading {
    color: white;
    background-color: #003E7E;
    font-size: 100%;
    font-weight: normal;
    margin-top: 10px;
}

.archiveArea ul {
    margin-top: 10px;
}

.archiveArea li {
    list-style-type: none;
}

.archiveArea li a {
    color: white;
    font-weight: normal;
    list-style-type: none;
    font-size: 90%;
}

/* Tech Support */

.techSupportLink {
    color: blue;
    cursor: pointer;
}

.techSupportColumn {
    margin-top: 30px;
    background-color: #0076BF;
}

.techSupportArea {
    min-height: 500px;
    max-height: 550px;
    overflow-y: auto;
}

.techSupportHeading {
    color: white;
    background-color: #003E7E;
    font-size: 100%;
    font-weight: bold;
    margin-top: 10px;
    text-align: center;
}

.techSupportContent {
    color: white;
    margin-top: 15px;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

.techSupport2PanelToggle {
    -webkit-transition: right .3s ease;
    -moz-transition: right .3s ease;
    -o-transition: right .3s ease;
    transition: right .3s ease;
    position: absolute;
    display: block;
    overflow: hidden;
    right: -40px;
}

.techSupport2PanelToggleIn {
    right: 139px;
}

.techSupport2Panel {
    -webkit-transition: right .3s ease;
    -moz-transition: right .3s ease;
    -o-transition: right .3s ease;
    transition: right .3s ease;
    position: absolute;
    overflow: hidden;
    right: -170px;
}

.techSupport2PanelIn {
    right: 10px;
}

.rotateLeft90 {
    transform: rotate(-90deg);

    /* Legacy vendor prefixes that are probably not needed... */

    /* Safari */
    -webkit-transform: rotate(-90deg);

    /* Firefox */
    -moz-transform: rotate(-90deg);

    /* IE */
    -ms-transform: rotate(-90deg);

    /* Opera */
    -o-transform: rotate(-90deg);

    /* Internet Explorer */
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

}

.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                        supported by Chrome, Opera and Firefox */
}

.rotateLeft90Airport {
    white-space: nowrap;
    /* transform-origin: right top; */
    top: 0px;
    bottom: 0px;
    transform: rotate(-90deg);

    /* Legacy vendor prefixes that are probably not needed... */

    /* Safari */
    -webkit-transform: rotate(-90deg);

    /* Firefox */
    -moz-transform: rotate(-90deg);

    /* IE */
    -ms-transform: rotate(-90deg);

    /* Opera */
    -o-transform: rotate(-90deg);

    /* Internet Explorer */
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

}

.rotate {
    white-space: nowrap;
    position: absolute;
    top: 50%;
    left: 50%;
}

.rotate-up {
    transform: translateX(-50%) translateY(-50%) rotate(-90deg)
}

.rotate-down {
    transform: translateX(-50%) translateY(-50%) rotate(90deg)
}

.brandingBN {
    color: rgba(255,255,255,0.7);
    font-size: 80%;
}

.bnLogo {
    width: 100px;
    opacity: .8;
}

.footerColumn {   
    margin-top: 20px;
    margin-bottom: 50px;
    /*    position: absolute;
        margin: 1%;*/
}

.siteAttribution {
    position: absolute;
    left: 5px;
    bottom: 5px;
}

.landingPageLinks {
    color: #0076c1;
    font-weight: bold;
    text-decoration: underline;
    cursor: pointer;
}

a.landingPageLinks:link {
    color: #0076c1;
    text-decoration: underline;
}

a.landingPageLinks:visited {
    color: #0076c1;
}

a.landingPageLinks:hover {
    color: #0076c1;
}

a.landingPageLinks:active {
    color: #0076c1;
}

.workshopRegistrationSelector {
    font-size: 1.3vw;
}

@media only screen and (max-width: 700px){
    .workshopRegistrationSelector {
        font-size: 2.5vw;
    }
}

@media only screen and (min-width: 992px){
    .workshopRegistrationSelector {
        font-size: 1.4vw;
    }
}

.form-group-personal {
    min-width: 320px;
}

.form-group-affiliation {
    min-width: 320px;
}

.workshopLocationSelector {
    font-size: 1.3vw;
}

@media only screen and (max-width: 700px){
    .workshopLocationSelector {
        font-size: 2.5vw;
    }
}

@media only screen and (min-width: 992px){
    .workshopLocationSelector {
        font-size: 1.4vw;
    }
}

.lbl-toggle::before {
    content: ' ';
    display: inline-block;

    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 5px solid currentColor;

    vertical-align: middle;
    margin-right: .7rem;
    transform: translateY(-2px);

    transition: transform .2s ease-out;
}

.rotateTriangle::before {
    transform: rotate(90deg) translateX(-3px);
}

.workshopSchedTable { 
    border: 0px solid #CECECE;
}

.workshopSchedTable thead {
    background-color: #CECECE;
}

.workshopSchedTable thead > tr > th 
{ 
    border-bottom: none;
    color: black;
    vertical-align: middle;
    padding: 5px;
}

.workshopSchedTable thead > tr > th, .workshopSchedTable tfoot > tr > th, .workshopSchedTable thead > tr > td, .workshopSchedTable tfoot > tr > td 
{ 
    border: 0px solid #CECECE;
}

.workshopSchedTable tbody > tr > td, .workshopSchedTable tbody > tr > th {
    color: black;
    background-color: white;
    /*border-top: 0px;*/
    border: 1px solid #CECECE;
}

.workshopSchedTableHead {
    font-size: 1.2vw;
}

.workshopSchedTableRow {
    font-size: 1.1vw;
}

@media only screen and (max-width: 700px){
    .workshopSchedTableHead {
        font-size: 1.8vw;
    }
    .workshopSchedTableRow {
        font-size: 1.7vw;
    }
}

.goToTopBtn {
    /*display: none;*/
    position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 99;
    border: none;
    outline: none;
    padding: 5px;
    border-radius: 3px;
    font-size: 100%;
}

.lpAnchors {
    /*background-color: #007BFF;*/
    color: #007BFF;
    cursor: pointer;
    text-decoration: underline;
}

a.lpAnchors:link {
    color: #007BFF;
    text-decoration: underline;
}

a.lpAnchors:visited {
    color: #007BFF;
}

a.lpAnchors:hover {
    color: #007BFF;
}

a.lpAnchors:active {
    color: #007BFF;
}

ul.listItemIndents {
    /*padding-left: 0px;*/
    list-style: none;
}

.lpLocations {
    width: 30%;
}

@media only screen and (max-width: 700px){
    .lpLocations {
        width: 60%;
    }
}

.archiveAnchors {
    /*background-color: #007BFF;*/
    color: white;
    cursor: pointer;
    text-decoration: underline;
}

a.archiveAnchors:link {
    color: white;
    text-decoration: underline;
}

a.archiveAnchors:visited {
    color: white;
}

a.archiveAnchors:hover {
    color: white;
}

a.archiveAnchors:active {
    color: white;
}

.mainDiv{
    position: relative;
    width: 100%;
    overflow-x: hidden;
}

.contentDiv{
    position: relative;
    width: 100%;
    padding-left: 1%;
    padding-right: 1%;
    overflow-x: hidden;
}

.divAlertsContent{
    position: absolute;
    width: 90%;
    top: 1%;
    left: 5%;
}
