/*
    Note that this file is not actually being referenced in the public site.  To include this file, upload it as the CSS file at SV > Marketing > Public View > Configuration.
*/

/* START OF THEME */

/*
  A customized version of the Bootswatch Spacelab theme (http://bootswatch.com).
@import url("/about/united_bootsrap.min.css");
*/

/*!
  You can change the theme to a non-customized version by replacing the above import statement
  with the following statement.

@import url("/restricted/3rdPartyTools/deployed/bootstrap/themes/bootswatch.spacelab.min.css");
*/

@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css");
@import url('https://fonts.googleapis.com/css?family=Montserrat');
@import url('https://fonts.googleapis.com/css?family=Oswald');
@import url('https://fonts.googleapis.com/css?family=Roboto');

/* END OF THEME */


/* -------------- NAVBAR -------------- */

/* THE HEADER CONTAINER */
div#headerWrapper {
    border-bottom: 1px solid #b4b7bb;
}

/* INDIVIDUAL NAV ITEMS */
#nav1 {
    width: 16.67vw;
}

#nav2 {
    width: 41.66vw;
    display: flex;
}

.form-inline .form-control {
    width: 70% !important;
    margin-left: 15%;
}

.nav-item .form-inline {
    flex-flow: nowrap;
    padding: 0px;
    width: 76%;
}

ul .nav-item {
    padding: 0px;
}

#nav3 {
    margin-top: 3px;
    text-align: left;
    font-size: 12px;
}

#nav4 {
    width: 21.67vw;
    font-size: 15px;
}

#nav5 {
    width: 11.67vw;
    font-size: 14px;
}

#nav6 {
    width: 8.33vw;
    text-align: center;
}

li#nav7 {
    font-weight: bold;
    font-size: 15px;
}

/* CONTROLS THE CART */
#navCart {
    color: white;
    font-size: 1.6rem;
    margin-top: 16px;
}

    #navCart:hover {
        color: lightgray;
    }

#cartCount {
    margin-left: -10px;
    margin-top: 6px;
    background-color: #BD1B34;
}

#PEstart{
    color: white;
    font-size: 12px;
    border-radius: 25px;
    padding-top: 5%;
    width:60%;
    text-align: center;
    
}

#PEstartDate{
    width:25%;
    height: 10%;
}

/* CONTROLS THE STYLING OF NAVBAR 1 LINKS */
.navbar-dark .navbar-nav .nav-link {
    color: white;
    text-align: center;
    text-decoration: none;
}

/* CONTROLS THE ALIGNMENT FOR THE DROPDOWN MENU */
.justify-content-center .dropdown-menu {
    left: 50%;
    transform: translateX(-50%);
}

.navbar-dark .navbar-nav .nav-link:hover {
    color: #BD1B34;
    !important;
}

/* CUSTOM-MADE DROPDOWN DIVIDERS */
.v-divider-light {
    border-left: 1px solid #494c50;
}

.v-divider-dark {
    border-left: 1px solid #212529;
    height: 25px;
    margin-top: 14px;
}

/* CONTROLS THE PADDING FOR THE WHOLE NAVBAR */
.navbar-expand-lg .navbar-nav .nav-link {
    padding-top: 16px;
    padding-bottom: 16px;
}

/* CONTROLS THE NAVBAR BUTTONS */
.nav-button {
    width: 90% !important;
    height: 80% !important;
}

/* CONTROLS THE SEARCH BAR */
button#buttonSearch {
    height: 33.5px;
}


/* -------------- NAV 2 -------------- */


.navbar-light .navbar-nav .nav-link {
    color: #000;
}

#navbar2 {
    height: 25px;
    background-color: #eeeeee !important;
}

#breadcrumbs {
    padding-left: 1rem;
}
/* ------------- MAIN BODY CONTENT ------------- */


/* CONTROLS H2 ON THE LANDING PAGE 
#contentModule5 .row div.col-md-4 h2 {
    font-family: Bebas;
    font-size: 2.28em;
}*/

/* CONTROLS THE LINK STLYING
#contentModule5 .row div.col-md-4 a {
    font-family: "OpenSans";
    font-size: 1.14em;
    color: #9E1B34;
    text-decoration: underline;
}*/


/* -------------- FOOTER -------------- */


#footer {
    position: absolute;
    bottom: 0;
    width: 100%;
}

/* CONTROLS THE GREY BACKGROUND FOR THE ENTIRE FOOTER CONTAINER */
footer {
    background-color: #303030;
    color: #FFFFFF;
    padding-top: 1.28571em;
    bottom: 0em;
    left: 0em;
    right: 0em;
}

/* CONTROLS THE DARK GREY CONTAINER ON TOP OF THE GREY BACKGROUND*/
#footer1Wrapper {
    background-color: #222222;
    padding-top: 1.250em;
}

/* CONTROLS THE FONT STYLE OF THE FOOTER */
#footer1 {
    font-family: Bebas;
    /* font-family: Garamond,Baskerville,Baskerville Old Face,Hoefler Text,Times New Roman,serif; */
}

/* CONTROLS FOOTERS HEADER MARGINS */
.footerContact h3 {
    margin-bottom: 0px;
}

.footerSiteMap h4 {
    margin-bottom: 5px;
}

/*.footerSiteMap .list-unstyled {
    margin-left: 10px;   
}
*/

.footerContact .list-unstyled span {
    margin-right: 15px;
}

/* CONTROLS THE BLACK COPYRIGHT CONTAINER AT THE VERY BOTTOM OF THE PAGE */
#footer2Wrapper {
    background-color: #070707;
    text-align: center;
}

/* SHOULD CONTROL THE CENTER ALIGNMENT FOR THE COPYRIGHT, NOT SURE WHAT IS CONFLICTING TO MAKE THE TEXT ALIGN TO THE LEFT */
#footer2Sub2{
    padding-left: 50%;
    padding-top: 0;
    font-size: 11px;
    color: white;
}



/* CONTROLS THE LINK COLORS FOR THE FOOTER */
div#footerNav a {
    color: white;
    text-decoration: none;
}

    div#footerNav a:hover {
        color: #9E1B34;
        text-decoration: none;
    }
/* CONTROLS THE TEXT NEXT TO THE GLYPHICON */

.footerContact > ul > li {
    display: inline-flex;
}

.footer1 .glyphicon {
    margin-right: 8px;
}

.glyphicon .glyphicon-map-marker {
    margin-right: 20px;
    background-color: #800080;
}

/*.glyphicon {
    position: relative;
    top: 1px;
    display: inline-block;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    font-size: 15pt;
    color: #58565A;
}*/


/* -------------- STUDENT LOGIN & MENU PAGES -------------- */

/**
#pageStudentLogin .col-md-8 {
    border-left: #E3E3E3 solid 1px;
    border-right: #E3E3E3 solid 1px;
    border-bottom: #E3E3E3 solid 1px;
    border-radius: 4px;
    padding-right: 0px;
    padding-left: 0px;
}

#pageStudentLogin #portalNativeLoginPanel {
    background-color: #ededed;
    padding-right: 1rem 1.5rem;
    margin: 1rem;
}

div#portalExternalLogonLinkPanel {
    background-color: #ededed;
    padding-right: 1rem 1.5rem;
    margin: 1rem;
}

#existingStudentDiv > .sectionHeader > h2{
    background-color: #ededed;
    padding-right: 1rem 1.5rem;
    margin: 1rem;
}
**/

#pageStudentLogin #contentModule1 .col-md-8 .card.sectionHeader,
#pageCheckoutLogin #contentModule1 .col-md-8 .card.sectionHeader{background-color: #ededed; padding-top:1rem;}

#pageStudentLogin #contentHeader,
#pageCheckoutLogin #contentHeader{
	
}

#existingStudentDiv > .sectionHeader > h2{
    background-color: #ededed;
    padding-bottom: 1rem;
    margin: 1rem;
}


#pageStudentLogin #contentModule1 .col-md-4 .card.sectionHeader,
#pageCheckoutLogin #contentModule1 .col-md-4 .card.sectionHeader{ background-color: transparent; box-shadow: none; border:none; background-image: none; }

#pageStudentLogin #contentModule1 .col-md-4 .card.sectionHeader h2,
#pageCheckoutLogin #contentModule1 .col-md-4 .card.sectionHeader h2 {color: #000; font-size: 1.4em; margin-top: 1rem; }

#pageStudentLogin #contentModule1 .col-md-8 .col-md-6,

#pageCheckoutLogin #contentModule1 .col-md-8 .col-md-6
{
	background-color: #ededed;
	padding: 1rem 1.5rem;
    margin: 1rem;
}

#pageCheckoutLogin #contentModule1 .col-md-4{
    background-color: #ededed;
    margin-bottom :1rem;
    padding-left: 1rem;
}

#pageStudentLogin #contentModule1 .col-md-4 {
    background-color: #ededed;
	padding: 1rem 1.5rem;
    margin: 0rem 1rem 1rem 1rem;
}

#pageStudentLogin #contentModule1 .col-md-8 .col-md-6,
#pageCheckoutLogin #contentModule1 .col-md-8 .col-md-6{max-width: calc(50% - 2rem); }

#pageStudentLogin #newStudentDiv,
#pageCheckoutLogin #newStudentDiv {
	max-width: calc(33.333333% - 2rem);
	

}

/*#pageStudentLogin #contentModule1 .col-md-8 .col-md-6,
#pageStudentLogin #contentModule1 .col-md-4,
#pageCheckoutLogin #contentModule1 .col-md-8 .col-md-6,
#pageCheckoutLogin #contentModule1 .col-md-4{box-shadow: 5px 5px 0px #f0f0f0;  }*/

/*#pageStudentLogin #contentModule1 .col-md-8 #portalNativeLoginPanel,
#pageCheckoutLogin #contentModule1 .col-md-8 #portalNativeLoginPanel{margin-left: 15px; margin-right: 15px;}*/

#pageStudentLogin .buttons button,
#pageCheckoutLogin .buttons button{
    font-size: 1em;
	/*background:none;*/
    width: 100%;
    text-shadow: none;
    font-weight: bold;
    border:none;
}

/*#pageStudentLogin #contentModule1 .col-md-8 .buttons button,
#pageCheckoutLogin #contentModule1 .col-md-8 .buttons button{
    color: #014d9b;
    border: solid 2px #014d9b;
}*/
/*#pageStudentLogin #contentModule1 .col-md-4 .buttons button,
#pageCheckoutLogin #contentModule1 .col-md-4 .buttons button{
    color: #fff;
	background-color: #004c9b;
}*/
#pageStudentLogin #contentModule1 .col-md-4 .col-md-12,
#pageStudentLogin #contentModule1 .col-md-4 .card,
#pageCheckoutLogin #contentModule1 .col-md-4 .col-md-12,
#pageCheckoutLogin #contentModule1 .col-md-4 .card{
	padding: 0px;
}
#portalExternalLogonLinkPanel h3{padding-top: 15px; 
}

@media (max-width:991px) {

    #pageStudentLogin #contentModule1 .col-md-8 .card.sectionHeader,
    #pageCheckoutLogin #contentModule1 .col-md-8 .card.sectionHeader{background-color: #ededed; margin-right: -1.35rem;}

	#pageStudentLogin #contentModule1 .col-md-8,
	#pageCheckoutLogin #contentModule1 .col-md-8 {max-width: 100%; flex: 0 0 100%;}

	#pageStudentLogin #contentModule1 .col-md-8 .col-md-6,
	#pageCheckoutLogin #contentModule1 .col-md-8 .col-md-6{max-width: 100%; flex: 0 0 100%;}

	#pageStudentLogin #newStudentDiv, #pageCheckoutLogin #newStudentDiv {
		max-width: calc(100% - 10px);

		flex: 0 0 100%;
	}

	#pageStudentLogin #contentModule1 .col-md-4 .card.sectionHeader h2, #pageCheckoutLogin #contentModule1 .col-md-4 .card.sectionHeader h2 {
		font-size: 1.2em;
	}

	#pageStudentLogin #contentModule1 .row,
	#pageCheckoutLogin #contentModule1 .row {
		margin-right: -5px;
	}

}


/*
 *CSS for hiding external login link on Conference login page - commented out with implementation of dual-auth for conferences 2-9-2020:

#pageConferenceLogin #conferenceExternalLoginWrapper {
    display: none;
}
*/

#cartCount {
    z-index: 1000;
}

/*
 *CSS for hiding the application nav button in the student profile, my applications page
*/

#buttonViewMoreApplications {
    display: none;
}

#forgotUserNameLink,
#forgotPasswordLink {
    margin-right: 10px;
    float: right;
}


/* ------- CORPORATE LEARNER PORTALS ------- */


/* To hide our navbars */

#pageCorporateLandingPage #navbar1, #pageCorporateLandingPage #navbar2 {
    display: none;
}

#pageCLPCourseProfile #navbar1, #pageCLPCourseProfile #navbar2 {
    display: none;
}

#pageCLPBasketPage #navbar1, #pageCLPBasketPage #navbar2 {
    display: none;
}

#pageCLPCheckoutLogin #navbar1, #pageCLPCheckoutLogin #navbar2 {
    display: none;
}

#pageCLPCheckoutProfile #navbar1, #pageCLPCheckoutProfile #navbar2 {
    display: none;
}

#pageCLPPayment #navbar1, #pageCLPPayment #navbar2 {
    display: none;
}

/* Styling of old prod CLP nav */

#clpHeader1ContentWrapper {
    max-width: 100%; 
}

#pageCorporateLandingPage #headerWrapper {
    background-color: #343a40
}

#pageCLPCourseProfile #headerWrapper {
    background-color: #343a40
}

#pageCLPBasketPage #headerWrapper {
    background-color: #343a40
}

#pageCLPCheckoutLogin #headerWrapper {
    background-color: #343a40
}

#pageCLPCheckoutProfile #headerWrapper {
    background-color: #343a40
}

#pageCLPPayment #headerWrapper {
    background-color: #343a40
}

#clpHeader1ContentWrapper #landingPageLink {
    padding-left: 15px;
}

span.clpHeaderLinkText.d-none.d-sm-inline {
    margin-right: -15px;
}

#clpHeader1ContentWrapper a {
    color: #fff;
}

#clpHeader1ContentWrapper a .glyphicon {
    color: #fff;
}

#cartInfo .glyphicon-shopping-cart {
    font-size: 1.65rem;
}

#clpHeader1ContentWrapper #cartCount {
    margin-left: -10px;
    margin-top: 2px;
}

span.glyphicon-shopping-cart.glyphicon {
    color: #fff !important;
}

/* Styling of old prod CLP nav */

#clpHeader1ContentWrapper {
    max-width: 100%; 
}

#pageCorporateLandingPage #headerWrapper {
    background-color: #343a40
}

#pageCLPCourseProfile #headerWrapper {
    background-color: #343a40
}

#pageCLPBasketPage #headerWrapper {
    background-color: #343a40
}

#pageCLPCheckoutLogin #headerWrapper {
    background-color: #343a40
}

#pageCLPCheckoutProfile #headerWrapper {
    background-color: #343a40
}

#pageCLPPayment #headerWrapper {
    background-color: #343a40
}

#clpHeader1ContentWrapper #landingPageLink {
    padding-left: 15px;
}

span.clpHeaderLinkText.d-none.d-sm-inline {
    margin-right: -15px;
}

#clpHeader1ContentWrapper a {
    color: #fff;
}

#clpHeader1ContentWrapper a .glyphicon {
    color: #fff;
}

#cartInfo .glyphicon-shopping-cart {
    font-size: 1.65rem;
}

#clpHeader1ContentWrapper #cartCount {
    margin-left: -10px;
    margin-top: 2px;
}

span.glyphicon-shopping-cart.glyphicon {
    color: #fff !important;
}

#groupCorporateLogoWrapper {
    text-align: left;
}

div#schoolCorporateLogoWrapper {
    display: none;
}

#header2ContentWrapper {
    max-width: 100%;
}

/* ----------------- Professional Development Page ---------------- */
#profDevProfile .card-body{
    padding: .25rem;
    padding-left: 1.25rem;
    padding-bottom: 0;
}

.slideButton {
    border: none;
    outline: 0;
    display: inline-block;
    color: white;
    background-color: #343A40;
    text-align: center;
    cursor: pointer;
    width: 100%;
    height: 40px;
    font-size: 14px;
}

.slideButton:hover{
    border-left: 8px solid #a41e35;
}
/* -------------- TEMPLATES -------------- */


#square {
    height: 370px;
    width: 370px;
}


/* -------------- HOME PAGE -------------- */


#pagePublicHome p.form-text.notFoundMessage {
    display: none;
}


/*  -------------- PROGRAM OFFICE PAGES --------------  */

/*Course Side nav style classes for external use*/

.sidenavbuttons{
    transition: 0.3s;
    width: 100%;
    text-align: left;
    text-decoration: none;
    font-size: 15px;
    color: black;
    border: 0.5px solid #f2f2f2;
    padding: 10px 0px 10px 3px;
    font-family: 'Roboto', sans-serif;
}

/* .sidenavbuttons:hover{
    padding-left: 25px;
    background-color: #343A40;
    color: #ffffff;
} */

.sidenavbuttons .active{
    border-left: 7px solid #a41e35;
    padding-left: 25px;
    background-color: #343A40;
    color: #ffffff;
}
/* Style the links inside the sidenav */
#courseSidenav button {
    transition: 0.3s;
    width: 100%;
    text-align: left;
    text-decoration: none;
    font-size: 15px;
    color: black;
    border: 0.5px solid #f2f2f2;
    padding: 10px 0px 10px 3px;
    font-family: 'Roboto', sans-serif;
}

#courseSidenav button:hover {
    padding-left: 25px;
    background-color: #343A40;
    color: #ffffff;
}

/* #courseSidenav button:focus {
    border-left: 7px solid #a41e35;
    padding-left: 25px;
    background-color: #343A40;
    color: #ffffff;
} */

#courseSidenav button.active{
    border-left: 7px solid #a41e35;
    padding-left: 25px;
    background-color: #343A40;
    color: #ffffff;
}

#courseSidenav p {
    padding: 0px 0px 0px 10px;
    margin: 0px;
}

#modalbtn {
    height: auto;
    background-color: transparent;
    border: none;
    padding: 1px;
}

.modal-header .row h3 {
    padding-left: 3%;
    margin-top: 3px;
    width: 400px;
}

.modal-header .row button.close {
    margin-right: 14px;
    padding-top: 19px;
}

/*--------------Summer Math CSS-----------*/
#summermath-jumbo{
    height:280px;
}
@media (max-width:991px) {
    #summermath-jumbo{
        height:100%;
    }
}

/*--------------TUJ Bridge CSS-----------*/
.md-stepper-number{
    display:none;
}
#TUJ-jumbo{
    height:360px;
}
@media (max-width:991px) {
    #TUJ-jumbo{
        height:100%;
    }
}
/*--------------OLLI Side Nav -----------*/
.onPageNav > button a{
    transition: 0.3s;
    width: 100%;
    background-color: white;
    text-align: left;
    text-decoration: none;
    font-size: 15px;
    color: black;
    border: 0.5px solid #f2f2f2;
    padding: 10px 0px 10px 3px;
    font-family: 'Roboto', sans-serif;
}
.onPageNav > button a:hover{
    /*padding-left: 25px;*/
    background-color: white;
    color: black;
}
.onPageNav > button a.active{
    border-left: 7px solid #a41e35;
    /* padding-left: 25px; */
    background-color: #343A40;
    color: #ffffff;
}
.onPageNav > a{
    transition: 0.3s;
    width: 100%;
    background-color: white;
    text-align: left;
    text-decoration: none;
    font-size: 15px;
    color: black;
    border: 0.5px solid #f2f2f2;
    padding: 10px 0px 10px 3px;
    font-family: 'Roboto', sans-serif;
}

.onPageNav > a:hover{
    /* padding-left: 25px; */
    background-color: white;
    color: black;
}
.onPageNav > a.active{
    border-left: 7px solid #a41e35;
    /* padding-left: 25px; */
    background-color: #343A40;
    color: #ffffff;
}
/*----- olli course registration dropdown ------*/
.coloredButtons > button{
    transition: 0.3s;
    width: 100%;
    background-color: white;
    text-align: left;
    text-decoration: none;
    font-size: 15px;
    color: black;
    border: 0.5px solid #f2f2f2;
    padding: 10px 0px 10px 3px;
    font-family: 'Roboto', sans-serif;
}
.coloredButtons > button:hover{
    /*padding-left: 25px;*/
    background-color: white;
    color: black;
}
.coloredButtons > button:active{
    border-left: 7px solid #a41e35;
    /* padding-left: 25px; */
    background-color: #343A40;
    color: #ffffff;
} 

.accordionLeft{
    text-align: left;
    width: 100%;
    position: relative;
}
.btn_nc_grey{
    background-color: #343A40;
    color: #ffffff;
}
.t-deep-red{
    background-color: #a41e35;
    color: #ffffff;
}

@media (max-width:425px) and (min-width:320px){
    .mobileHiddenControlled{
        display: none;
    }
    .mobileUnHideControlled {
        display: block!important;;
    }
}
@media (max-width:767px) and (min-width:426px){
    #openTabletMenuButton{
        text-align: left;
        font-size: 17px;
        width:100%;
    }
    .tabletHiddenControlled{
        display: none;
    }
    .tabletUnhideControlled{
        display: block!important;
    }
}

@media (max-width:1024px) and (min-width:768){
    #openTabletMenuButton{
        text-align: left;
        font-size: 17px;
        width:100%;
    }
    .tabletHiddenControlled{
        display: none;
    }
    .tabletUnhideControlled{
        display: block!important;
    }
}

/* -------------- STUDENT CALENDARS -------------- */


@media only screen and (max-width: 1023px) {
    
    .dhx_cal_navline {
        left: -2%!important;
    }
    
    .dhx_cal_today_button {
        right: 0px;
    }

    #calRow2 {
        top: 40px;
        width: 100%;
        left: 0px!important;
    }

    .dhx_cal_tab.year_tab {
        margin-left: 10%;
    }

    .dhx_cal_navline div.dhx_minical_icon {
        left: 0px;
        margin-left: 45%;
        right: 0px;
    }

    .dhx_cal_tab.agenda_tab {
        margin-left: 70%;
    }

    #calRow3 {
        top: 80px;
        width: 100%;
        left: 0px!important;
    }

    .dhx_cal_prev_button {
        left: 0px;
        margin-left: 1%;
        right: 0px;
    }

    .dhx_cal_navline .dhx_cal_date {
        padding: 0px;
        text-align: center;
        margin-left: 3.1%;
        width: 90%
    }
    
    .dhx_cal_date {
        left: 1.3%!important;
    }

    .dhx_cal_next_button {
        left: 0px;
        margin-left: 83.6%;
    }

    #pageStudentTimetable .dhx_cal_header {
        top: 140px!important;
    }

    #pageStudentTimetable .dhx_cal_data.dhx_resize_denied.dhx_move_denied {
        top: 161px !important;
    }
    
    .dhtmlXTooltip.tooltip {
        visibility: visible!important;
    }
}

/* -------------- HOTFIX -------------- */

#pageCLPCourseProfile .courseSectionTuitionFee {
    display: none;
}


/* -------------- GLOBAL STYLING -------------- */


/* CONTROLS THE SHOPPING CART */
.glyphicon-shopping-cart {
    color: #9E1B34;
}



/* CONTROLS THE STYLING OF IMPORTANT BUTTONS (CHECKOUT, SIGN UP, CONTINUE, ETC.) */
.btn-primary {
    color: #FFFFFF;
    background-color: #9E1B34;
    border-color: #9E1B34;
}

    .btn-primary:hover {
        color: #FFFFFF;
        background-color: #590000;
        border-color: #590000;
    }
   /* Controls the style of the larger than normal buttons on the homepage */ 
    .btn-large-secondary {
        float: left;
        color: #fff;
        background-color: #6c757d;
        border-color: #6c757d;
        display: inline-block;
        font-weight: 400;
        text-align: center;
        vertical-align: middle;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        border: 1px solid transparent;
        padding: 0.5rem 1rem;
        font-size: 2rem;
        line-height: 2;
        border-radius: 0.25rem;
        transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
      }

      .btn-large-primary {
        float: right;
        color: #fff;
        background-color: #9E1B34;
        border-color: #9E1B34;
        display: inline-block;
        font-weight: 400;
        text-align: center;
        vertical-align: middle;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        border: 1px solid transparent;
        padding: 0.5rem 1rem;
        font-size: 2rem;
        line-height: 2;
        border-radius: 0.25rem;
        transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
      }
      
/* CONTROLS THE LINKS/FONT SIZE ON THE HOME PAGE 
#contentModule5 .row div.col-md-4 a {
    font-family: "OpenSans";
    font-size: 1.14em;
    color: #9E1B34;
}*/

/* CONTROLS HTML */
html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    font-size: 87.5%;
}

/* CONTROLS HEADERS */
h1, .h1 {
    font-family: 'Montserrat', sans-serif;
    font-size: 22px;
    color: #000;
    margin-top: 5px;
    margin-bottom: 10px;
    font-weight: 650;
}

h2 {
    font-size: 20px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600
}

h3 {
    font-size: 18px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 550
}

h4 {
    font-size: 16px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 550
}

body {
    font-family: 'Roboto', sans-serif;
}

#pageContainer {
    position: relative;
    min-height: 100vh;
}

#mainContentWrapper {
    padding-bottom: 262.48px;
}

/* CONTROLS LINKS */
a {
    font-family: 'Roboto','Arial','sans';
    text-decoration: underline;
    color: #000;
    font-size: 16px;
}

a:hover {
    color: #000;
    text-decoration: underline;
}

.page-item.active .page-link {
	background-color: #BD1B34;
   	border-color: #BD1B34;
}

.page-link {
    color: #BD1B34;
}

.page-link:hover {
    color: #000;
}

.btn-link {
    color: #000;
}

    .btn-link:hover {
        color: #BD1B34;
    }

li {
    font-family: 'Roboto', sans-serif;
}

.hidden {
    display: none;
}

.wordwrap {
    white-space: normal;
}

.portalMenu .active > a, .sidebarScrollSpy .active > a {
    border-left: 5px solid #9E1B34;
}

.tableLink {
    font-size: 13px!important;
    /* text-decoration: none!important; */
    font-family: roboto, sans-serif
}

/*nav-tabs CUSTOM CSS*/
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active{
    color: #495057;
    background-color: #fff;
    border-color: #dee2e6 #dee2e6 #fff;
    border-width: 1.5px;
    margin-top: -6px;
}

.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
    border-color:  #dee2e6 #dee2e6 #fff;
    margin-top: -6px;
}

.nav-tabs .nav-link {
    text-align: center;
    flex: auto;
    border: 1px solid transparent;
    border-top-left-radius: .25rem;
    border-top-right-radius: .25rem;
    margin-left: 4px;
    background-color: #e9ecef;
}
.nav-tabs {
    border-bottom: 1px solid #e9ecef;
}

/*nav-tabs CUSTOM CSS END */

/* -------------- CUSTOM SIDEBAR MENU -------------- */


/* CREATES THE SIDEBAR */
#sidebar {
    /*moves the div to the top and right */
    top: 118.75px;
    right: -185px;
    height: 420px;
    /* makes the opening and closing smooth */
    transition: all 200ms linear;
    position: fixed;
    z-index: 1001;
    width: 185px;
    background-color: #343A40;
}

#sidebar.active {
    right: 0px;
}

#sidebar a.dropdown-item:hover {
    color: #343A40;
    background-color: white;
}

/* STYLING OF THE SIDEBAR LIST ITEMS */
#sidebar ul li {
    color: rgba(230,230,230,0.9);
    list-style: none;
    padding: 15px 10px;
    border-bottom: 1px solid rgba(100, 100, 100, 0.3);
}

/* POSITIONING OF THE SIDEBAR TOGGLE */
#sidebar .toggle-btn {
    position: absolute;
    right: 230px;
    top: 20px;
}

#sidebar .toggle-btn span {
    display: block;
    width: 30px;
    height: 5px;
    background-color: #151719;
    /*controls the size of the toggle button */
    margin: 5px 0px; 
}

#sidebar .dropdown-item {
    color: white;
    text-decoration: none;
}

#sidebar a.dropdown-item {
    padding: 5% 10% 5% 10%;
}

#sidebar h3 {
    color: white;
    text-align: center;
    margin-top: 12px;
}

/* -------------- Banner Buttons for single page outline--------------------*/

#bannerHeading{
    color: white;
}

#menucards{
    margin-top: -5%;;
}

.cardMenu{
    text-align:center;
    height: 125px;
    background-color: #fcb813;
    text-decoration: none;
}


/* -------------- MOBILE CSS -------------- */


@media only screen and (max-width: 767px) {
    
    #mainContentWrapper {
        padding-bottom: 486.48px; 
    }

    #sidebar {
        top: 118.75px!important;
    }
    
    #nav1 {
        width: 36vw!important;
    }

    #mobileNav2 {
        width: 76vw;
    }
    
    #mobileNav2 {
        margin-top: 10px;
        margin-left: 10px;
    }

    #mobileNav5 a {
        color: white;
        text-decoration: none;
    }
    
     #mobileNav5 a.dropdown-item {
        color: #000;
    }   

    /* STYLING THE SEARCH */

    #mobileNav2 .form-inline .form-control {
        width: 84.7%;
    }


    #mobileNav6 {
        margin-top: 10px;
        padding-left: 2% !important;
    }
    
    #nav2 {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
    }

    #navCart {
        margin: 10px;
    }

    #cartCount {
        margin-left: -20px!important;
        margin-top: -4px!important;
    }
    
    #nav3 {
        display: none;
    }
    
    /* Styles the dropdowns on mobile */
    .dropdown-menu.nav-dropdown-menu.show {
        top: 53%!important;
        left: 64%!important;
        transform: translateX(-50%);
        z-index: 1001;
    }
    
    #toggleNav {
        margin-right: 3%;
    }
    
    /* Fixes accordion word wrap on mobile */
    button.btn.btn-link {
        white-space: normal; 
    }
    
    #pageProgramAreaProfile span.courseCode, #pageProgramAreaProfile span.title {
        font-size: 14px;
    }
    
    .modal-header .row h3 {
        width: 290px;
    }
    
    #nav-contact-tab, #nav-rentals-tab {
        margin-left: 2.5%;
    }
    
    #nav-onLine-tab, #nav-cert-tab, #nav-programs-tab {
        margin-left: 2.5%;
    }
    
    .mobileHidden {
        display: none;
    }
    
    .mobileUnhide {
        display: block!important;
    }

    #nceNavCards{
       padding:10px;
       border-color: transparent;
    }
    
    .d1-center-m {
        margin-left: auto!important;
        margin-right: auto!important;
    }
}



/* ------------- HOME PAGE CONTENT -------------- */

#pagePublicHome #pagePublicHome_carouselShow {
    display: block!important;
}

@media only screen and (min-width: 1169px) {
    
    a#homepagecarousel_next {
        padding: 6vw 0px 6vw 3.5%;
        height: 50%;
        margin-top: 6vw;
    }

    a#homepagecarousel_prev {
        padding: 6vw 3.5% 6vw 0px;
        height: 50%;
        margin-top: 6vw;
    }
}


/* ------------- END HOME PAGE CONTENT -------------- */

@media only screen and (max-width: 1300px) {
    .tabletandlapHidden{
        display: none;
    }
    .tabletandlapUnhide {
        display: block!important;
    }
}
/* -------------- TABLET CSS -------------- */

@media only screen and (max-width: 1023px) {
    
    #sidebar {
        top: 74.75px;
    }

    ul#nav2Items {
        flex-direction: row !important;
        text-align: center;
    }

    #nav1 {
        width: 20vw;
    }

    .form-inline .form-control {
        width: 82.33%;
    }

    #tabletSearch {
        width: 40vw;
    }
    
    #tabletAccnt .nav-link {
        color: white;
        text-decoration: none;
    }
    
    #nav2 {
        width: 100vw;
        padding-left: 14px;
    }

    .navbar-nav .dropdown-menu {
        text-align: center;
        align-self: center;
    }

    #nav3 {
        display: none;
    }
    
    #nav3 a {
        text-decoration: none;
        color: white;
    }

    #nav4 {
        width: 100vw;
        padding-top: 6.5px !important;
        padding-bottom: 6.5px !important;
    }

    #nav5 {
        width: 100vw;
        padding-top: 6.5px !important;
        padding-bottom: 6.5px !important;
    }

    #nav6 {
        width: 100vw;
    }

    #nav7 {
        display: none;
    }

    #nav8 {
        width: 14vw;
        text-align: center;
        text-decoration: none;
        font-size: 14px;
    }

    #nav9 {
        width: 18vw;
        text-align: center;
        text-decoration: none;
        font-size: 14px;
    }

    #nav10 {
        width: 22vw;
        text-align: center;
        text-decoration: none;
        font-size: 14px;
    }

    #nav11 {
        width: 23vw;
        text-align: center;
        text-decoration: none;
        font-size: 14px;
    }

    #nav12 {
        width: 23vw;
        text-align: center;
        text-decoration: none;
        font-size: 14px;
    }

    .v-divider-dark {
        margin-top: -7px;
        display: none;
    }

    #mobileNav6 {
        width: 20%;
    }
    
    #tabletCart {
        width: 7vw;
    }

    #navCart {
        font-size: 1.5rem;
        margin-bottom: 0px;
        margin-top: 5px; 
    }

    #cartCount {
        margin-top: -4px;
    }

    nav#navbar1 {
        padding-top: .5rem !important;
        padding-bottom: .5rem !important;
    }

    .navbar-expand-lg .navbar-nav .nav-link {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
    }

    .justify-content-center .dropdown-menu {
        transform: none;
    }

    #toggleNav:focus {
        outline: 5px auto #BD1B34;
    }
    
    .dropdown-menu.nav-dropdown-menu.show {
        top: 94%;
        left: 82%;
        transform: translateX(-50%);
        z-index: 1001;
    }
    
    #courseSidenav button:focus {
        padding-left: 3px;
    }
    
    #learnMoreBtn {
        color: black;
        font: inherit;
        background: lightgray;
        border: 3px solid lightgray;
        margin-top: 7px;
    }
    
    #profilePageCard {
        padding-bottom: 0px;
    }
    
    #pageProgramAreaProfile p.card-text {
        text-align: center;
    }
    
    .tabletHidden {
        display: none;
    }
    
    .tabletUnhide {
        display: block!important;
    }
}

/* -------------- DESKTOPS AND HIGHER --------------*/

@media only screen and (min-width: 1024px) {

}

/* -------------- END DESKTOPS AND HIGHER --------------*/

/* -------------- BEGIN noncredit 2020 mobileUpdate mediaQueries -------------- */
   
    .controlledHide{
        display:none;
    }
    @media (max-width:768px) and (min-width:426px) {
        .controlledTabletView {
            display: block;
        }

        .controlledTabletHide {
            display: none;
        }
    }

        @media (max-width:425px) and (min-width:374px) {
            .controlledMobileView {
                display: block;
            }
    
            .controlledMobileHide {
                display: none;
            }
    }

    @media (max-width:375px) {
        .controlledxsHide {
            display: none;
        }
}

/* -------------- END noncredit 2020 mobileUpdate mediaQueries -------------- */
/* This is the beginning of Sophia's edits - June 15, 2015 | RE-IMPLEMENTED FOR CONFERENCES */

#breadcrumb {
    margin-top: 1%;
}

.conferenceModule #pageContainer {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    min-height: 100%;
}

.conferenceModule #headerWrapper {
    width: 100%;
    min-height: 10%;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
    background-color: #F7F7F7;
}

.conferenceModule #headerWrapper div {
    height: 100%;
    color: #000000;
}

.conferencePreviewHeaderWrapper .form-text {
    color: #000000;
}

.conferenceModule #header2Container {
    padding-left: 0px;
    padding-right: 0px;
}

.conferenceModule #header2 {
    margin-left: 0px;
    margin-right: 0px;
}

.conferenceModule #headerWrapper .customizableBlockContainer {
    height: 100%;
    width: auto;
    margin-top: 0px;
    margin-bottom: 0px;
}

.conferenceModule #headerWrapper .customizableBlockContainer p > img {
    height: 100%;
    width: auto;
}

.conferenceModule #mainContentWrapper {
    min-height: 65%;
    width: 100%;
    text-align: left;
    overflow: visible;
}

.conferenceModule footer {
    bottom: 0;
    /*min-height: 15%;*/
    width: 100%;
    vertical-align: bottom;
}

.conferenceModule #footer2Wrapper {
    height: 100%;
    width: auto;
    vertical-align: bottom;
}

    .conferenceModule #footer2Wrapper .customizableBlockContainer div {
        background-color: #070707;
    }

.conferenceModule #participantTypeSelectionAccordion .packageSelectName {
    font-weight: bold;
}

.conferenceModule #conferencePreviewHeaderWrapper {
    color: #000000;
}

.conferenceModule .conferencePreviewHeader,
.help-block ul {
    color: #000000;
    text-align: left;
}

.conferenceModule #previewMenu {
    left: 10%;
    right: auto;
}

.conferenceModule #conferencePreviewHeaderMenu {
    text-align: left;
    padding-left: 0;
    margin-left: 0;
}

.conferenceModule #conferencePreviewHeaderWrapper .headerConfPreviewMenuDropdownLink {
    color: #000000;
    padding-left: 0;
}

/*This is the beginning of frank's edits - May 1, 2019*/

#contentModule5 .row div.col-md-4 { /* Lakshmi's Edits for Testimonial Banner */
    background: #FFFFFF;
    border-bottom: 1px solid #ebebeb;
    border-top: 1px solid #ebebeb;
    border-radius: 3px;
    height: 100%;
    margin-bottom: 20px;
    padding-top:20px;
}

input[type="button"],
input[type="submit"],
input[type="reset"],
input[type="file"]::-webkit-file-upload-button,
button {
    background-color: white;
    color: #590000;
    border: 1px solid #9E1B34;
    border-radius: 3px;
    height: 100%;
    line-height: 2.3em;
}

#buttonUploadFile {
    height: 100%;
    line-height: 1.8em;
    box-shadow: 1px 1px 1px black;
    float: right;
    margin-right: 35%;
}

.field-group p {
    font-size: .95em;
    font-style: italic;
    color: #959595;
    margin-left: 2%;
    margin-bottom: 0;
}

    .field-group p:first-child {
        margin-top: 1%;
    }

#buttonDeleteFile {
    display: block;
}

.input-group-btn > button {
    display: block;
}

td > .btn {
    display: block;
}

html {
    position: relative;
    min-height: 100%;
}

.justify-content-end {
    -ms-flex-pack: start !important;
    justify-content: flex-start !important;
    /*v causing the shaking v
    left: 30px;
    */
}

#searchBreadcrumb {
    margin-bottom: 15px;
}

sectionEnrollmentHeader {
    font-size: 17px;
}


#pageProgramAreaProfile table, 
#pageConferences table  {
    border: 1px solid #ccc;
    border-collapse: collapse;
    margin: 0;
    padding: 0;
    width: 100%;
}

#pageProgramAreaProfile table caption, 
 #pageConferences table caption{
        font-size: 1.5em;
        margin: .5em 0 .75em;
    }

    #pageProgramAreaProfile table tr 
    #pageConferences table tr{
        background-color: #f8f8f8;
        border: 1px solid #ddd;
        padding: .35em;
    }

    #pageProgramAreaProfile table th,
    #pageProgramAreaProfile table td,
    #pageConferences table th, 
    #pageConferences table td {
        padding: .325em;
        text-align: left;
    }
    #pageProgramAreaProfile table #reiInfoColumn{
        text-align: center;
        
    }
    #pageProgramAreaProfile table #reiInfoColumn button {
        color: #000;
        border: none;
        background-color: transparent;
    }

    #pageProgramAreaProfile table th,
    #pageConferences table th {
        letter-spacing: .1em;
        text-transform: uppercase;
    }

    #pageProgramAreaProfile table a, 
    #pageConferences table a {
        text-decoration: underline;
        color: #000;
        font-size: 0.95em;
    }

    #pageProgramAreaProfile table a:hover,
    #pageConferences table a:hover {
            color: #000;
            text-decoration: underline;
        }


@media screen and (max-width: 768px) {
    #pageProgramAreaProfile table, 
    #pageConferences table {
/*        border: 0;*/
    }

    #pageProgramAreaProfile table caption, 
    #pageConferences table caption {
        font-size: 1.0em;
    }
/*Controls the mobile view tables to hide or show the column names*/
    #pageConferences table thead {
        border: none;
        clip: rect(0 0 0 0);
        height: 2px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        width: 1px;
    }
    
    #pageProgramAreaProfile #navbar2 {
        height: 50px;
    }
    
    #pageProgramAreaProfile table a, 
    #pageConferences table a {
        text-decoration: underline;
        color: #000;
        font-size: 14px;
    }
    
    #nav-home table a {
        margin: 27px 0px 14px 0px;
        display: flex;
        text-align: left;
        white-space: normal;
    }

    div.ww {
        word-wrap: break-word;
    }

    urlbox {
        width: 100px;
        background-color: red;
    }

        urlbox.wordwrap {
            word-wrap: break-word;
        }

        
    #pageConferences table tr {
        border-bottom: 3px solid #ddd;
        display: block;
        margin-bottom: .625em;
    }
    
    #pageProgramAreaProfile table tr {
        margin-bottom: .625em;
    }
    
    #pageProgramAreaProfile table a {
        display: contents;
    }
    
    #pageProgramAreaProfile table td {
        text-align: left;
    }
    
    #pageConferences table td {
        word-wrap: break-word;
        border-bottom: 1px solid #ddd;
        display: block;
        font size: .7em;
    }
    
    #pageProgramAreaProfile .dataTables_wrapper .dataTables_filter input {
        width: 65vw;
    }
    
    #pageProgramAreaProfile table td::before, 
    #pageConferences table td::before {
            /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */
            content: attr(data-label);
            float: left;
            font-weight: 400;
            font size: .5em;
        }

        #pageProgramAreaProfile table td:last-child,
        #pageConferences table td:last-child{
            border-bottom: 0;
        }

    small {
        display: block;
    }
}

small {
    /*causing an issue where content in a table's <small> tag doesn't show up.*/
    display: none;
}

#pageCourseProfile td small {
    /* Fixed by undoing the display:none specifically on course profile pages */
    display: block;
}

#pageCourseProfile table th {
    /* Same issue as those above */
    text-align: center;
}

/*change name of Continue button on Logon page for students logging in with an AccessNet*/

#buttonContinueExternalLogon:after {
    content: " with AccessNet";
}
/*change name of Log In button on Logon page for students logging in with an Non-Credit Account*/
#buttonContinueCheckoutExisting:after {
    content: " with Non-Credit Account";
}

/**/
a.cc-btn.cc-allow::before{
content: "Ok, I ";
}

img {
    max-width: 100%;
    height: auto;
}

/* Hides navs for all conference pages */

#pageConferenceLogin #headerWrapper, #pageParticipantForgotUsername #headerWrapper, #pageParticipantForgotPassword #headerWrapper, #pageParticipantForcePasswordChange #headerWrapper, #pageConferenceDropRequest #headerWrapper, #pageConferencePackageSelection #headerWrapper, #pageConferencePackageAddOnSelection #headerWrapper, #pageConferenceGroupParticipantSelection #headerWrapper, #pageConferenceGroupCartSummary #headerWrapper, #pageConferenceAdditionalQuestion #headerWrapper, #pageConferencePaymentOption #headerWrapper, #pageConferenceShoppingCart #headerWrapper, #pageConferenceReceipt #headerWrapper, #pageConferenceProfile #headerWrapper, #pageConferenceProfileCredential #headerWrapper, #pageConferenceSessionSelection #headerWrapper, #pageConferenceDetails #headerWrapper, #pageConferenceLandingPage #headerWrapper, #pageConferenceAddOnPurchaseRequest #headerWrapper {
    display: none;
}

/* Conditionally re-implements conference header per page */

.conferenceModule.customizationMode #confBran {
    display: block!important;
}

div #defaultConferenceHeader {
    margin: 0 auto;
}

/* .poweredByDestinyOneWrapper {
    display: none;
} */

/* CONTROLING THE DATEPICKER ON LOGIN PAGE */

.datepicker {
    width: 250px;
    height: 250px;
    float: right;
}

.nav-pills .nav-link.active, .nav-pills .show>.nav-link{
    color: #fff;
    background-color: #212529;
    border-left: #a41e35 solid 5px;
}

/*NCE card design styles*/
.cardCenter {
    text-align: center;
}

.topicCardButton {
    border: none;
    outline: 0;
    display: inline-block;
    padding: 3px;
    color: white;
    background-color: #343A40;
    text-align: center;
    cursor: pointer;
    width: 100%;
    height: 35px;
    font-size: 14px;
}

.topicCardButton:hover{
    border-left: 8px solid #a41e35;
}

#ncetopics {
    border: none;
    outline: 0;
    display: inline-block;
    padding: 8px;
    color: white;
    background-color: #343A40;
    text-align: center;
    cursor: pointer;
    width: 100%;
    height: 50px;
    font-size: 14px;
}

#ncetopics:hover{
    border-left: 8px solid #a41e35;
}

/* .profile {
    margin: auto;
    width: 50%;
    color: #C0C0C0;
    padding: 10px;
    color: #343A40;
    font-size: 85px;
} */
/* CONTROLS COURSE TABLE TEXT FOR DESKTOPS */



@media screen and (min-width: 768px) {

    #corcontent a {
        font-size: 15px;
    }
}

.xtarget:target {
    color: #333333;
    font-weight: 600;
    margin-top: -45px;
    padding-top: 90px;
} 

#contentModule5 h2{ /*Hide the "Hilights" title */
    display: none; 
}




/* CONTROLS COURSE TABLE TEXT FOR DESKTOPS */

@media screen and (min-width: 768px) {

    #corcontent a {
        font-size: 15px;
    }
}

.xtarget:target {
    color: #333333;
    font-weight: 600;
    margin-top: -45px;
    padding-top: 90px;
} 

.alex {
    border-color: #A41e35;
    border-width: 2px;
}

.alex:hover {
    box-shadow: 20px 20px 40px 0px rgba(0,0,0,0.5);
}

.alex {
    margin: 5px;
    height: 80%;
    width: 80%;
}

.card-fluid {
    margin: 10px;
    padding: 0px;
}

.topics {
    padding: none;
    margin: auto;
    
}

.frank {
    padding: none;
}
/*
#pagePublicHome button {
  color:white;
  display: inline;
  font: 300 150% langdon;
  background: transparent;
  border: 3px solid black;
  cursor: pointer;
} 

#pagePublicHome button:hover {
  background: #f7f7f7;
  border: 1px solid #8b8b8b;
}

#pagePublicHome button:active {
  background: #2e2e2e;
  border: 1px solid black;
  color: white;
  }
*/

  .sidenav a {

  padding: 10px 10px 10px 32px;
  text-decoration: none;
  color: black;
  display: block;
  }
  .sidenav a:hover {
    text-decoration-line: underline;
}

  .sidenav{
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 10%;
    left: 0;
    overflow-x: hidden;
    padding-top: 20px;
    margin-left: 0;
  }

  .modal-open {
    padding: 0px !important;
    overflow-y: hidden;
    margin-left: 0px;
}

#pageProgramAreaProfile .container-fluid {
    margin-left: 0px;
}

/* TU ALERT */
.templeAlert {
    background-color: #fdb913;
    background-image: repeating-linear-gradient(-45deg, transparent, transparent 35px, rgba(255, 255, 255, 0.2) 0, rgba(255, 255, 255, 0.2) 70px);
    position: relative;
    width: 100%;
    min-height: 10rem;
    text-align: center;
    overflow: hidden;
    z-index: 20;
}

.tu-alert__icon {
    width: 50px;
    height: 40px;
    margin: 0 auto 10px;
    margin-top: 10px;
    background: url(https://tualert.azureedge.net/images/svg/alert-message-icon.svg) no-repeat 0 center;
    background-size: cover;
}

#btnBody{
    height: 5%;
    margin-bottom: 1%;
}

 #alertTitle{
    font-size: 27px;
    font: bold;
} 
.readMoreButton{
    background-color: #a41e35; 
    border-color: #A41e35;
    color: white;
    margin-bottom: 10px;
}

.readMoreButton i{
    margin-left: 5px;
    size: 15px;
}

.readMoreButton:hover{
    color: #FFFFFF;
    background-color: #590000;
    border-color: #590000;
}


  @media screen and (max-height: 450px) {
    .sidenav {padding-top: 15px;}
    .sidenav a {font-size: 18px;}
  }

 @media screen and (max-width: 468px){
    #courseSidenav{
        display: none;
    }


    #mobileSide{
        height: 100%;
        width: 0;
        position: fixed;
        z-index: 1;
        top:0;
        background-color: #000;
        left: 0;
        overflow-x: hidden;
        transition: 0.5s;
        padding-top: 60px;
        z-index:1100;
        background-color: #343A40;
    }

    #mobileSide button.active > i {
        color: white;
        background-color: #9e1b34;
        border: 3px solid #9e1b34;
    }

    #mobileSide button.active{
        background-color: white;
        color: #343A40;
        border-left: 5px solid #9E1B34; 

    }
   
    #mobileSide button{
        width: 100%;
        height: 40px;
        margin-top: 10px;
        text-decoration: none;
        display: block;
        transition: 0.3s;
        background-color: #343A40;
        border: none;
        text-align: left; 
    }

    #mobileSide button i{
        padding: 3px;
        background-color:  #6c757d;
        border: 3px solid #6c757d;
        border-radius: 2px;
        margin-right: 15px;
    }
    
    #mobileSide .closebtn {
        position: absolute;
        top: 0;
        right: 25px;
        font-size: 36px;
        margin-left: 50px;
        color: white;
      }
     
    #openMenuButton{
        text-align: left;
        font-size: 17px;
        width:100%;
     }
     #openMobileMenuButton{
        text-align: left;
        font-size: 17px;
        width:100%;
     }
     
      #mobileSide h4{
        color: white;
        margin-left:7px;
      }

}