﻿
@import url("/Styles/font-awesome.min.css");
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap');
/*@font-face { font-family: NiveauGrotesk; src: url("/Fonts/Niveau Grotesk Regular.otf") format("opentype"); }
@font-face { font-family: HKGrotesk; src: url("/Fonts/HKGrotesk-Regular.otf") format("opentype"); }
@font-face {font-family:Manrope; src: url("https://fonts.google.com/specimen/Manrope?query=manrope") format("opentype");}*/


:root {
	--text: #334155;
	--blueold: #0e92ff;
	--green: #c1dc59;
	--border: #e4e4e4;
	--gold: #DAA85B;
	--darkblue: #003471;
	--blue: #003471;
}

body {
	background: #FFF;
	margin: 0;
	padding:0;
	font-family: Manrope,sans-serif; font-size: 17px; line-height: 1.6;
	/*font-size: 1.5rem;*/
}

a, a:hover, a:visited {color:#000;}

p{margin:0 0 1.5em 0;}
h1{/*font-size:2.0em;line-height:1.2;margin:1em 0 .75em 0;font-weight:bold;*/}
h2{font-size:1.5em;line-height:1.2;margin:1em 0 .75em 0;font-weight:bold;}
h3{font-size:1.25em;line-height:1.2;margin:1em 0 .75em 0;font-weight:bold;color: var(--blue)}
h4{font-size:1.0em;line-height:1.2;margin:1em 0 .75em 0;font-weight:bold;}
h5{font-size:1.0em;line-height:1.2;margin:1em 0 .75em 0;font-weight:bold;}
h1:first-child,h2:first-child,h3:first-child,h4:first-child,h5:first-child{/*margin-top:0;*/}


.bg {background-image: url('/Images/BackgroundImg.jpg'); background-repeat: no-repeat; background-size: cover; width: 100%; }


.divnavbuttons {width:265px; display:inline-block; text-align: left; vertical-align:top; padding-top: 20px;}
.divdetail {width: calc(100% - 290px); display:inline-block; vertical-align:top;}


.blueButton, .btnPrimary {font-size: 1.2rem !important; background-color: var(--blue); color: #fff !important; border-radius: 3px; padding: 5px 20px 5px 20px; border: 1px solid var(--blue);text-decoration:none; }
.blueButton:hover, .btnPrimary:hover {background-color: var(--blue); border-color: var(--blue); color: #fff }
.btnSecondary {font-size: 1.2rem; background-color: #F1BA65; color: #fff; padding: 5px 20px 5px 20px; border: 1px solid var(--gold); text-decoration:none;}
.btnSecondary:hover {background-color: var(--gold); border-color: var(--gold); color: #fff}

.elementor-shape {
direction: ltr;
left: 0;
line-height: 0;
overflow: hidden;
/*position: absolute;*/
width: 100%;
background-color: #003471;
margin-top: -1px;
}
.elementor-shape-bottom {bottom: -1px; transform: rotate(180deg);}
.elementor-shape-fill {fill: #fff; transform: rotateY(0deg); transform-origin: center;}

.detaildiv {width: 100%;}
.ddl {font-size: 1.1rem; padding: 8px; background-color: #f5f5f5; border: 1px solid #777; color: #666; box-shadow: inset 0 0 2px #888;}
.rbSkinnedButton {
	font-size: 1.2rem !important;
	background-color: var(--blue) !important;
	color: #fff !important;
	border-radius: 3px !important;
	padding: 5px 20px 5px 20px !important;
	border: 1px solid var(--blue) !important;
	text-decoration: none !important;
	height: 34px !important;
	font-family: Arial !important;
}

.buttonClearBlue {
    font-size: 1.1rem;
    color: var(--blue);
    text-transform: uppercase;
    background-color: transparent;
    padding: 8px;
    border: none;
    border-radius: 0;
    /*border-left: 1px solid #ccc; border-bottom: 1px solid #ccc;*/
    margin-top: 0;
    margin-right: 0;
    margin-left: 0;
}
.buttonLinkClearBlue{
	font-size: 1.0rem;
	color: var(--blue);
	background-color: transparent;
	padding: 8px;
	border: none;
	border-radius: 0;
	margin: 0;}
.buttonLinkClearBlue:hover{cursor:grab;color:#CC0000;}

.btnMenu {
	border:none;
	background-color: transparent;
	font-size: 1.2rem;
	margin-left: 5px;
	font-family: NiveauGrotesk, Helvetica, Arial, sans-serif;
}
.btnMenu:hover {color:#F1BA65}

.blueButtonNote {
    font-size: 1.1em;
    color: #fff !important;
    text-transform: uppercase;
    background-color: var(--blue);
    padding: 10px;
    min-height:42px;
    min-width: 120px;
    border-radius: 5px;
    text-decoration:none;
}
	.blueButtonNote:hover {
		color: #F0D538 !important;
	}

.greenButton {
	font-size: 1.0rem;
	color: #fff;
	text-transform: uppercase;
	background-color: #00DD11;
	padding: 8px;
	min-height:42px;
	min-width: 120px;
	border-radius: 5px;
	border: 1px solid #00DD11;
}
.greenButton:hover {
	color: #003300;
}

.redButton {
	border-style: none;
	font-size: 1.1em;
	color: #fff;
	text-transform: uppercase;
	background-color: #C00;
	padding: 8px;
	min-height: 42px;
	min-width: 120px;
	border-radius: 5px;
	margin: 5px 0 5px 0;
}
.myaccountbutton {
	cursor: pointer;
	display: inline-block;
	color: #FFF;
	background: var(--blue);
	font-weight: 100;
	border: 1px solid var(--blue);
	border-radius: 3px;
	width: 130px;
	line-height: 1.6rem;
	padding: .20rem .4rem;
	letter-spacing: 0rem;
	font-size: 1.0em;
}
.myaccountbutton:hover {
	color: #FFF;
	background: var(--gold);
	border: 1px solid var(--gold);
}

.img-circular{
 width: 300px;
 height: 200px;
 background-size: cover;
 display: block;
 border: 10px solid var(--blue);
 margin: 0 auto;
}

.columns4 {max-width: 1200px; text-align:center; margin: 0 auto; vertical-align:top; }
.columns4 .col {width: calc(25% - 200px); min-width:250px; display:inline-block; min-height: 1px; padding-left: 10px; padding-right: 10px; vertical-align:top; margin-top: 30px; font-size: 1.2rem;}
	.col h3 {font-size: 1.3rem;}

.columns3 {width: calc(100% - 20px); max-width: 1200px; margin: 0px auto 0px auto; padding: 0 0 0 0; text-align:left;display:inline-block; /*max-width: 1200px; text-align:center; margin: 0 auto; vertical-align:top;*/ }
.columns3 .col {width: 29%; min-width: 250px; margin: 0 30px 0px 0; display: inline-block; vertical-align: top;/*width: calc(33% - 200px); min-width:376px; display:inline-block; min-height: 1px; padding-left: 10px; padding-right: 10px; vertical-align:top; margin-top: 30px; font-size: 1.2rem;*/}
	.col h3 {font-size: 1.3rem;}

.columns2 {max-width: 1200px; text-align:center; margin: 0 auto; vertical-align:top; }
.columns2 .col {width: calc(50% - 200px); /*min-width:500px;*/ display:inline-block; min-height: 1px; padding-left: 10px; padding-right: 10px; vertical-align:top; margin-top: 30px; font-size: 1.2rem;}
	.col h3 {font-size: 1.3rem;}
.contentcol3rd {
	width: calc((100% / 3) - 31px);
	margin: 5px 0px 20px 0px;
	display: inline-block;
	border: 1px solid #ccc;
	border-radius: 5px;
	padding: 5px;
}
.herodivinner {width: 47%; /*min-width: 430px;*/ display: inline-block; vertical-align:top; color: #fff; line-height: 1.0em; padding: 10px; font-size: 1.5em;}

/*  ---------------------------  PAGE CONTENT  ---------------------------------------------------    */
.main_content {
	width: 100%;
	min-height: 50%;
	overflow: hidden;
	display: block;
	/*color: #060718;*/
	color: #333;
	margin: 120px auto 0px auto;
	min-height: calc(100vh - 300px);
	/*font-size: 1.5rem;*/
}


.titlebar {
	color: #fff; width: calc(100% - 30px); background: var(--blue);  font-size: 1.5rem; padding: 10px 0 10px 0px;
	text-align: center; border-radius: 3px; float: left; margin: 15px 0px 15px 0px; text-transform:uppercase; 
}
.main_content .titlebar {
	width: 100%;
	margin-top: 10px;
	line-height: 1.1em;
}

.content {
	/*font-weight: 100;*/
	/*line-height: 1.3rem;*/
	border: 1px solid #D8D7CE;
	padding: 5px 5px 0px 5px;
	/*float: left;*/
	display:inline-block;
	border-radius: 3px;
	background-color: #fff;
	width: calc(100% - 20px);
	/*margin-top: 0px;
	margin-bottom: 10px;*/
	/*font-size: 1.2rem;*/
	/*margin-left: calc((100% - 800px) / 2);
	margin-right: calc((100% - 800px) / 2);*/
	text-align:left;
	margin: 0 auto 10px auto;
	max-width: 1200px;
}
.contentarea {
	width: calc(100% - 10%); 
	margin-right: calc((100% - 90%) / 2);
	margin-left: calc((100% - 90%) / 2);
	margin-top: 20px;
	font-size: inherit;
	display: inline-block;
	text-align:center;

}




/*  ---------------------------  MAPS  ---------------------------------------------------    */
.ceMapdiv {width: 500px; margin-right: 10px; display: inline-block; }
.cdDatadiv {width: calc(100% - 540px); min-width: 235px; display: inline-block; vertical-align:top; border: 1px solid #ccc; border-radius: 5px; min-height: 380px; padding:10px; margin-bottom: 10px;}
.ceStateButtonsdiv {width: 100%; display:none}
.ceBlueWhitebutton{width:150px;margin: 5px; display:inline-block; background-color: #010228; color: #fff; padding: 10px; text-align:center; border-radius: 5px;}
.ceBlueRedbutton{width:150px;margin: 5px; display:inline-block; background-color: #010228; color: #f00; padding: 10px; text-align:center; border-radius: 5px;}
.ceBlueYellowbutton{width:150px;margin: 5px; display:inline-block; background-color: #010228; color: #ff0; padding: 10px; text-align:center; border-radius: 5px;}
.map{height:340px; width: 500px;}




/*  ---------------------------  TOP MENU  ---------------------------------------------------    */
.menu_wrapper {
	display: inline-block;
	position: relative;
}

.topmenu {
	display: inline-block;
	vertical-align:top; 
	padding: 5px 0 5px 0;
	/*font-size: 1.2rem;*/
}

.topmenu .level1 {
	width: 200px;
	text-align: center;
	float: left;
	vertical-align:top;
}
.topmenu .level1 a {text-decoration: none; text-transform:uppercase; }
.topmenu .level1 a:hover {color: #F1BA65; text-transform:uppercase;}

.topmenu .level1 .level2 {
	/*width: 250px;*/
	padding: 10px;
	background-color: #fff;
	text-align: left;
	margin-top: 10px;
	border: 1px solid var(--blue);
	margin-left: -10px;
	padding-bottom: 40px;
	position: absolute;
}
.topmenu .level1 .level2hide {
	display: none;
}
.topmenu .level1 .level2 a {color: #000; text-decoration: none; padding: 20px 10px 20px 10px; text-transform: none;}
.topmenu .level1 .level2 a:hover {color: #F1BA65; text-transform:none;padding: 20px 10px 20px 10px;}
.topmenu .level1 .level2 > div {
	margin-top: 10px;
}

.topmenu .level1 .level2 .linker a { padding: 5px 0 3px 10px;}

.menudiv ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	gap: 0px;
	justify-content: space-between;
}
.menudiv ul li {
	margin: 0;
	padding: 0;
	list-style: none;
	text-transform: uppercase;
}
.menudiv ul li a {
        color: inherit;
        text-decoration: none;
        font-weight: bold;
        position: relative;
        padding: 3px 20px;
        border-radius: 100px;
        border: 3px solid transparent;
        display: block;
        line-height: 1.2;
        text-align: center;
 }




/*  ---------------------------   PAGE HEADER  -------------------------------------------    */

.menu {
	/*font-family: NiveauGrotesk, Helvetica, Arial, sans-serif;
	font-size: 1.25rem;
	width: calc(100% - 270px);*/
}

.menu {cursor: pointer;
	  /*width: calc(100% - 350px); margin-left: 50px;*/ display: inline-block; vertical-align:top; padding-left: 10px;
}

.page_header {
	/*font-size: 1.2rem;*/
}

.page_header .logo{
	margin-left: 10px; max-width: 260px;
}
.page_header .menu {
	display: inline-block;
}
.page_header .menudiv {
	display: inline-block;
	z-index:100;
}
.page_header .myaccountdiv {
	/*width: 150px;*/
	float:right;
	border: none; 
	margin-right: 15px; 
	margin-top: 0px;
}

.network-bar{background: var(--green);padding:5px 0;font-size:15px;position:sticky;top:0;z-index:100}
	body.admin-bar .network-bar{top:32px;}
	.network-bar .container{display:flex;align-items:center;}
	.network-bar__start{flex:1;white-space:nowrap}
	.network-bar__start ul{margin:0;padding:0;list-style:none;display:flex;}
	.network-bar__start ul li{margin:0;padding:0;list-style:none;}
	.network-bar__start ul li.active{font-weight:bold;}
	.network-bar__start ul li:not(:first-child):before{content:'\2022';margin:0 15px}
	.network-bar__start ul li a{text-decoration:none}
	.network-bar__start ul li:last-child{}
	/*.network-bar__start ul li:last-child a{color:#1977c4;font-weight:bold;text-shadow: 1px 1px 1px #fff6;}*/
	
	.network-bar__end{width:40%;text-align:right;font-size:0}
	.network-bar__end ul{display:inline-flex;align-items:center;justify-content:flex-end;gap:15px;margin:0;padding:0px 0 0 0;}
	.network-bar__end ul li{margin:0;padding:0;list-style:none;}
	.network-bar__end ul li svg{width:20px;height:20px;}

.container {
    max-width: 1160px;
    margin: 0 auto;
    padding: 0 20px;
}
	@media (max-width: 768px) {

	.network-bar{display:none}
	.network-bar .container{display:block}
	.network-bar__start{width:100%;text-align:center;}
	.network-bar__end{width:100%;text-align:center;}
	.network-bar ul{justify-content:center}
}
.newnav {
	/*border-top: 1px solid var(--border);
     border-bottom: 1px solid var(--border);*/
     padding: 12px 0;
     font-size: 15px;
	font-weight: bold;
}
.headerlogo{width: 270px; vertical-align:top; display: inline-block; min-width:150px;}
.headerbanner {
	width: calc(100% - 575px); 
	vertical-align:top; 
	display: inline-block; 
	min-width:150px;
	/*background-image:url('/images/PinnacleBanner.png');*/
	background-repeat: no-repeat; background-size: contain;
	min-height: 100px;
	margin: 0 auto;
	background-position: top;
	max-width: 625px;
	text-align:center;
}
.headerbanner img {/*width: inherit;*/
}

.headerbannerslider {
	width: calc(100% - 575px); 
	vertical-align:top; 
	display: inline-block; 
	min-width:150px;
	min-height: 100px;
	margin: 0 auto;
	background-position: top;
	text-align:center;
	max-height: 100px;
}
.headerbannerslider img {/*width: inherit;*/
}
.colleftwide {
	line-height:1.2em; 
	width: calc(100% - 280px);
	margin: 10px 0px 10px 10px; padding: 0; 
	display: inline-block;
}
.colrightsidebar {
	line-height: 1.0em;
	font-size: 0.8em;
	width: 250px; 
	margin-top:10px;
	vertical-align: top;
	display: inline-block;
	padding-top: 10px;
	margin-left: 10px;}

/*  --------------------------  MODAL POPUP  -------------------------------------------------    */
.modalBackground {
	background-color: #fff;
	filter: alpha(opacity=75);
	opacity: 0.7;
}
.modalPopup {
	background-color: #fff;
	border: 10px solid var(--darkblue);
	border-radius: 8px;
	padding: 10px;
	width: 90%;
	max-width: 600px;
	margin: 0 auto 0 auto;
	max-height: 90%;
	/*overflow-y: auto;*/
	overflow: auto;
	font-size: 1.0em;
}
.modalPopupLeft {
	width: 20%; display: inline-block; padding: 5px; vertical-align: top; min-width: 150px;
}
.modalPopupRight {
	width: calc(90% - 150px); display: inline-block; padding: 5px; text-align: left; 
	vertical-align: top; margin-bottom: 5px;
	max-height: 40vh; overflow-y:auto;
}

.panelWhite {
	background-color: #fff;
}

.signedindiv {
	text-align:left;
}
.signedindiv .accountwrapper {
}
.accountwrapper {text-align:left; float: left; display: block; width: 100%;}
.accountwrapper h3 {margin: 10px 0 3px 0; border-bottom: 1px solid #ccc;}



/*  ---------------------------  WATERMARK TEXTBOX AND TEXTBOXES  ---------------------------------------------------    */
.unwatermarked {
    width: 90%;
    font-size: 1.2rem;
    background-color: #fff;
    border: 1px solid #777;
    color: #666;
    font-style: italic;
    text-align: center;
    box-shadow: inset 0 0 3px #888;
    padding: 8px;
    border-radius: 5px;
}
.watermarked, watermarked input {
    width: 90%;
    font-size: 1.2rem;
    background-color: #fff;
    border: 1px solid #BED5D2;
    color: #BED5D2;
    font-style: italic;
    text-align: center;
    /*box-shadow: inset 0 0 3px #888;*/
    padding: 8px;
    border-radius: 5px;
}
.watermarkednormal, watermarkednormal input {
    font-size: 1.2rem;
    background-color: #fff;
    border: 1px solid #BED5D2;
    color: #BED5D2;
    font-style: italic;
    text-align: center;
    /*box-shadow: inset 0 0 3px #888;*/
    padding: 8px;
    border-radius: 5px;
}
.tbwide {width: 90%; padding: 8px;font-size: 1.0rem;}
.tb {
	/*font-size: 1.0em; background-color: #E7EAC1; border: 1px solid #D8D7CE;*/ 
    /*width: 50%;*/
    font-size: 1.2rem;
    background-color: #fff;
    border: 1px solid #BED5D2;
    /*color: #BED5D2;*/
    /*box-shadow: inset 0 0 2px #888;*/
    border-radius: 5px; 
    padding: 8px;
}
.tbdropdownlist {
    font-size: 1.0rem;
    background-color: #fff;
    border: 1px solid #BED5D2;
    /*color: #BED5D2;*/
    border-radius: 5px;    
    /*box-shadow: inset 0 0 2px #888;*/
    padding: 8px;

}
.tbcal {
    font-size: 1.2rem;
    background-color: #f5f5f5;
    border: 1px solid #777;
    color: #666;
    box-shadow: inset 0 0 2px #888;
    padding: 8px;
    background-image: url(/Images/Calendar.png);
    background-repeat: no-repeat;
    background-position: right center;
    text-align: left;
    width: 140px;
}

.errorlabel {color: #c00;}


/*  ----------------------------   MY ACCOUNT PAGE  ---------------------------------------------    */
.myaccounttopnavwrapper {
	 text-align:center; line-height: 1.1rem;
}
.myaccounttopnavwrapper a{text-decoration: none;}

.myaccounttopnavwrapper .btn {
	padding: 5px; min-height: 75px; width:180px; border: 1px solid #ccc; border-radius: 3px; display: inline-block; overflow-y: hidden; text-align:left;    margin-top: 10px;
}
.myaccounttopnavwrapper .btn:hover {
	background-color: #f0f0f0

}
.myaccounttopnavwrapper .btn .title {
	font-size: 1.1rem; font-weight: 700; text-align: left;
}
.myaccounttopnavwrapper .btn:hover .title, .myaccounttopnavwrapper .btn:hover .subtitle {
	color: #c00;
}
.myaccounttopnavwrapper .btn .subtitle {
	font-weight:normal; display:inline-block; font-size: 1.0rem; text-align:left;
}

.myaccountcontentdiv {
	float:left; width: 100%;
}
.myaccountcontentdivnav {
	padding: 0; 
	border-bottom : 1px solid #ccc; 
	border-top: 1px solid #ccc;
	text-align:center;
	float:left; width:100%;
}
.detaildiv {
	width: calc(100% - 40px);
	margin: 0 auto 0 auto;
}
.myaccountdetaildivdetail {
	width: calc(100% - 312px);
	display: table-cell;
	vertical-align: top;
	float: left;
	margin-right: 1px;
	min-height: 400px;
}
.myaccountdetaildivdetail input {
	font-size: 1.1rem;
	/*padding: 8px;*/
}
.tb input {text-align:left;}
.myaccountdetaildivdetail .tb {
	text-align: left;
}
.myaccountdetaildivdetailsidebar {
	width: 299px;
	display: table-cell;
	vertical-align: top;
	padding-left: 10px;
	float: left;
	height: 100%;
	/*border-left: 1px solid #ccc;*/
	margin-left: 1px;
}
.myaccountdetaildivdetail .accountedittable {margin: 0 auto 0 auto;}

.myaccountgvDiv {
	display: inline-block;
	width: 99%;
}

.btnClearLeft {
	color: #000;
	border:none;
	background-color: transparent;
	font-size: 1.25rem;
	margin:  0 10px 0 0;
	min-width: 150px;
	text-align: left;
	display: inline-block;
	margin-bottom: 10px;
}
.btnClearLeftActive {
	display: inline-block;
	color: var(--blue);
	border: none;
	background-color: #fff;
	font-size: 1.25rem;
	margin: 0 10px 0 0;
	min-width: 150px;
	text-align: left;
	/*border-radius:unset;*/
	font-weight: bold;
	margin-bottom: 10px;
	/*border: 1px solid #ccc;*/
	/*padding: 10px*/
}

.btnClear {
	color: var(--blue);
	border:none;
	background-color: transparent;
	font-size: 1.2rem;
	margin:  0 10px 0 0;
	min-width: 150px;
	text-align: center;
}
.btnClearActive {
	color: #c00;
	border:none;
	background-color: #F5F5F5;
	font-size: 1.2rem;
	margin: 0 10px 0 0;
	min-width: 150px;
	text-align: center;
	border-radius:unset;
	font-weight: bold;
	border: 1px solid #ccc;
	padding: 10px
}

.pagedivnav {font-size: 1.0rem; text-align:center; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; padding-top: 5px; padding-bottom: 5px; background-color: #efefef;}
.pagedivnav .btnClearActive {border: 1px solid #b5b5b5;
	border-radius: 3px;
	padding: 5px 9px 5px 9px;
	margin-top: 5px;
	margin-bottom: 5px;
	background-color: #fafafa
}
.pagedivnav .btnClear{
	border: 1px solid #b5b5b5;
	border-radius: 3px;
	background-color: #fafafa;
	padding: 5px 9px 5px 9px;
	margin-top: 5px;
	margin-bottom: 5px;
}
.pagedivnav .btnClearActive:hover {
	font-style:italic;
}
.pagedivnav .btnClear:hover{
	font-style:italic;
}

.linkbtnClearActive {
	margin: 0 20px 0 20px;
	color: #c00 !important;
	font-weight:bold;
	text-align:center;
	white-space: nowrap;
}
.linkbtnClear {
	margin: 0 20px 0 20px;
	color: #010288;
	text-align:center;
	white-space: nowrap;
}
.lblMessage {color: #0c0; font-weight:700;}



/*  ----------------------------  BROWSE COURSES  ----------------------------------------------    */
.coursesBrowseWrapper {
	width: calc(100% - 0px);
    display: inline-block;
	max-width: 1200px;
	display: inline-block;
	margin: 0 auto;
}


.courseResultsWrapper {
	min-height:100px; 
	border: 1px solid #ccc; 
	border-radius: 4px; 
	width: calc(100% - 20px);
	margin-top: 10px; 
	display: inline-block;
	background-color: #fff; 
	padding: 10px;
	font-size: 1.1rem
}
.browseCourses {
	width: 100%;
	max-width: 1200px;
	margin: 20px auto 0 auto;
}
.coursesBrowseFilter {
	width: 100%;
	max-width: 1200px;
	display: inline-block;
	margin: 0 auto;
	/*background-color: #fff;*/
}

.browseGrid {
	width: 100%;
}
.browseGrid td {padding-right: 5px;}
.browseGridPager a, .browseGridPager span
{
	font-family: 'Montserrat', sans-serif; 
	font-size: 0.9em;
	display: block;
	/*height: 26px;*/
	min-width: 36px;
	text-align: center;
	text-decoration: none;
	border-radius: 5px;
	padding-top: 9px;
	padding-left: 2px;
	padding-right: 2px;
	padding-bottom: 9px;
}
.browseGridPager a
{
     background-color: #fff;
     color: var(--blue);
     border: 1px solid var(--blue);
}
.browseGridPager span
{
     background-color: var(--blue);
     color: #fff;
     border: 1px solid var(--blue);
}

.coursesBrowseSidebar {
	height: 100%;
	width: 100%;
	display: inline-block;
	vertical-align: top;
	margin-left: 20px;
	padding: 0px;
	margin-top: 10px;
}

.coursesBrowseFilter .sectionTitle, .sectionTitle {
	color: #fff; width: 100%; background: var(--blue); font-size: 1.5rem; padding: 15px 0 15px 0; border: solid 1px var(--blue);
	text-align: center; border-top-left-radius: 4px; border-top-right-radius:4px; float: left; margin: 10px 0px 14px 0px;  text-transform:uppercase;
}
.coursesBrowseFilter .showFilter {
	margin-top: -15px;
	float: left;
	width: calc(100% - 20px);
	border: solid 1px var(--blue);
	padding: 15px 10px 5px 10px;
	border-radius: 0px 0px 4px 4px;
	background-color:#fff
}
.coursesBrowseFilter .subtitle {
	font-weight: bold;
	color: var(--blue);
	font-size: 1.0em;
	margin: 5px 0px;
	padding: 0px 0px 2px 15px;
	border-bottom: solid 1px var(--blue);
}
.divMyCoursesFilter {width:46%; float:left;}

.coursesBrowseFilter label {
    color: var(--blue);
}
.coursesBrowseFilter select {
	max-width: 100%;
}
.coursesBrowseFilter select, .coursesBrowseFilter input {
	font-size: 1.0em;
	background-color: #fff;
	border: 1px solid var(--blue);
	color: var(--blue);
	text-align: center;
	padding: 5px;
	font-weight:normal;
	border-radius: 5px;
	margin: 2px;
	/*min-width: 120px;*/
	background-color:transparent;
	text-align:left;
}
.coursesBrowseFilter input {
	text-align: left;
}

.coursesBrowseLeft {
	float: left; width: 200px; margin-right: 10px;
}
.coursesBrowseLeft img {
	width: 200px;
	border: 1px solid #ccc;
	box-shadow: 2px 2px 5px rgba(0,0,0,0.55);
	margin-top: 1px;
	margin-left: 1px;
}
.coursesBrowseMiddle {
	float: left; width: calc((100% - 210px) * .62); display:block; margin-right: 10px;
}
.coursesBrowseTitle {
	font-size: 1.3em; font-weight: 700; color: #000; margin-bottom: 10px; line-height:1.3rem;
}
.coursesBrowseUserHistory {
	font-size: 1.0em; color: #c00; margin-bottom: 10px;
	/*border: 3px solid #c00; padding: 5px;*/
}
.coursesBrowseDetails {
	font-size: 1.0em; color: #000;
}

.coursesBrowseRight {
	float: left; width: calc((100% - 180px) * .35); display:block; font-size: 0.8em; line-height: 1.0em;
	margin-bottom: 10px;
}
.coursesBrowseRight img {
	width: 30px;
}
.coursesBrowseRight input {
	font-size: 1.3em;
	color: #fff;
	text-transform: uppercase;
	background-color: var(--blue);
	border: 1px solid var(--blue);
	padding: 10px;
	border-radius: 5px;
}
	.coursesBrowseRight input:hover {
		background-color: var(--gold); border-color: var(--gold); color: #fff 
	}
.coursePageContent {
	text-align: left;
	width: calc(65% - 40px);
	margin: 0 10px 10px 10px;
	display: inline-block;
	vertical-align: top;
	max-width: 640px;
}
.coursePageInfo {
	width: 35%;
	margin: 0 10px 10px 10px;
	display: inline-block;
	vertical-align: top;
	text-align: left;
	border: 1px solid #ccc;
	border-radius: 5px;
	padding: 10px;
}
.coursepageimage {width: 100% !important; margin: 0; border: 1px solid #ccc; box-shadow: 3px 3px 6px rgba(0,0,0,0.55);}





/*	------- POPUP COURSE APPROVALS -----  */
.courseApprovals {
	position: relative;
	width: 100%;
	padding: 2px 5px;
	overflow: hidden; 
	background: #fff;
	border-radius: 4px;
	font-size: 1.0em;
	border: 1px solid #ccc;
	margin-top: 5px;
	line-height: 1.25em;

}






/*	--- color course name --- */
.courseApprovals .approved	 { color: #3D9B17;font-weight: bold;	}
.courseApprovals .pending	 { color: #5F7DAD;font-weight: bold;	}
.courseApprovals .not_approved { color: #cc0000;font-weight: bold;	}

.browseGridEventRegistration td{padding:5px !important;} 
.browseGridEventRegistration th {border-bottom: 1px solid #ccc;}

.approvalOrgTitle {min-width: 40px;
    float:left; text-align:center; margin-top: 10px; padding: 4px; border-top: 1px solid #ccc; border-right: 1px solid #ccc;
}

.cbPaymentOption input{width:40px; height:40px;display: inline-block; margin-top: 10px; margin-bottom:10px;}
.cbPaymentOption label{display: inline-block; padding-left: 5px; line-height: 1.0em; vertical-align:top; margin-top:10px;}


/* ------------------------  TEST -----------------------------*/
.testcontent {
	line-height: 1.2rem;
	border: 1px solid #D8D7CE;
	padding: 5px 5px 0px 5px;
	float: left;
	border-radius: 3px;
	background-color: #fff;
	width: 100%;
	margin-top: 0px;
	margin-bottom: 10px;
	font-size: 1.1rem;
	text-align:left;
}
.questionResultImage {margin: 0px; width: 16px;}
.rbQuestion input {margin: 5px 0 0 0 !important; display: inline-block; vertical-align:top; }
.rbQuestion label {display: inline-block;
	padding-right: 30px;
	margin-left: 40px;
	text-indent: -20px;
	width: calc(100% - 110px);
}
.rbQuestion input[type='radio'] {transform: scale(1.3); }
.rbList input[type='radio'] {transform: scale(1.7); margin: 5px 0 0 0 !important; display: inline-block; vertical-align:top;}
.rbList label {
	display: inline-block;
	padding-right: 30px;
	margin-left: 15px;
	text-indent: -0px;
	width: calc(100% - 80px);
	border-bottom: 1px solid #efefef;
	margin-bottom: 6px;
}
.questionNotesHTML {width: 100%; text-align:center; }
.questionWrapper {width:100%; margin-top: 10px; display:block; float:left; }
.questionWrapperNumber {width: 35px; display: inline-block; vertical-align:top; text-align:right; top: -200px; font-weight: bold;}
.questionWrapperNumber a{   display: block;
    position: relative;
    top: 10px;
    visibility: hidden;}
.questionWrapperQuestion {width: calc(100% - 60px); display: inline-block;vertical-align:top; font-weight: bold;}
.answerWrapper {width: calc(100% - 20px); margin: 10px 0px 10px 25px !important; float: left; line-height: 1.6rem }
.RadRating {margin: 0 auto 0 auto;}

.testTopNav {
	max-width: 1200px; 
	width: calc(100% - 0px); text-align: right; z-index:1;
	background-color: #F0F0FB; padding-top: 18px; padding-bottom: 18px; padding-right: 12px;vertical-align:middle;
	font-size: 1.0rem;
}




/*  ---------------------------  STUFF  ---------------------------------------------------    */
.mailto:before {
	font-family: FontAwesome;
	color: var(--blue);
	content: "\f0e0";
	margin-right: 10px;
}
.mailto {text-decoration: none;}

.faqQuestion {margin-left: 20px; width: calc(100% - 20px); color: #333;}
.faqbody {margin-left: 40px; width: calc(100% - 100px); background-color: #f9f9f9; padding: 15px; color: #555;}

.Default.reWrapper {width: 100% !important; border: none !important;}
.radeditor {width: 100% !important;}
.reToolbar {float:left !important;}

.divprompt200 {width: 200px; display:inline-block; text-align:right; padding: 8px 5px 0 0; margin-top: 5px;}
.divresponse200 {width: calc(100% - 206px); display:inline-block; min-width:300px; margin-top: 5px;}

.divprompt150 {width: 150px; display:inline-block; text-align:right; padding: 8px 5px 0 0; margin-top: 5px;}
.divresponse150 {width: calc(100% - 166px); display:inline-block; min-width:300px; margin-top: 5px;}

.divprompt100 {width: 100px; display:inline-block; text-align:right; padding: 8px 5px 0 0; margin-top: 5px;}
.divresponse100 {width: calc(100% - 106px); display:inline-block; min-width:300px; margin-top: 5px;}
.divprompt50 {width: 50px; display:inline-block; text-align:right; padding: 8px 5px 0 0; margin-top: 5px;}
.divresponse50 {width: calc(100% - 56px); display:inline-block; min-width:300px; margin-top: 5px;}



/*  ---------------------------  LEFT NAVIGATION  ---------------------------------------------------    */

.nav
{
	margin: 0px 0 0 10px;
	font-family: FontAwesome;
	color: #FFF;
	font-size: 1.5rem;
	padding: 5px 6px 5px 6px;
	background: transparent;
	text-decoration: none;
	text-align: center;
	display:none;
}
.navexpand{
	height: 100%;
	min-height: 100%; 
	width: 100%; 
	background-color: var(--border); 
	position: fixed; 
	top:0; left: 0; 
	display: none; 
	z-index:100; 
	padding-top: 10px;
}
.navexpanded
{
	margin: 5px 0 0 10px;
	font-family: FontAwesome;
	color: var(--blue);
	font-size: 2.5rem;
	padding: 5px 6px 5px 6px;
	background: var(--border);
	text-decoration: none;
	text-align: left;
	transition: left 2.7s, transform 2.7s, height 2.5s;
}
.navexpandedwrapper {
	overflow-x: hidden; overflow-y: auto; height: calc(100% - 100px); 
}

.navexpandedlinktext
{
	font-size: 2.0rem;
	font-family: Manrope, sans-serif;
	margin-left: 10px;
	padding-top: 8px;
	position: absolute;
}
.navexpandedwrapper a {
	color: #fff;
	text-decoration: none;
}
.navexpandedwrapper a:hover {
	color: #F0D538;
}
.navexpandedlinkdivwrapper {
	width: 100%; margin: 10px auto 10px auto; padding: 10px; border-radius: 5px;
}
.navexpandedlinkdiv {
	width: calc(100% - 50px);
	border-radius: 5px;
	background-color: var(--blue);
	color: #fff;

	padding: 15px;
	margin-bottom: 10px;
	font-size: 1.4rem;
	text-decoration: none;
	cursor: pointer;
}

.nav_bars:before
{
	content: "\f0c9";
}
.nav_caret_left 
{
	cursor: pointer;
}
.nav_caret_left:before
{
	content: "\f100";
}


.browseFilter{width:60%; float:left; padding-right:5%;}
.browseSearch {width:35%; float:left;}

.page_footer {background-color: #061332; border-top: 1px solid #ccc; padding: 0 0 20px 0;}
.footer_content {max-width: 1200px; margin: 20px auto 0px auto; padding: 0 0 0 10px; color: #fff; }
.footer_content a {color: #fff;}



/*  ------------------------------  RESPONSIVE LAYOUT  --------------------------------------------  */
@media (min-width:1536px) {

}

@media (max-width: 1440px) {
	.coursesBrowseSidebarImage {
		display: none;
	}
	.coursesBrowseWrapper {
		display: inline-block;
	}
	.coursesBrowseSidebar {
		width: 98%;
		display: inline-block;
		vertical-align: top;
		margin-left: 0px;
		min-height: 300px;
		padding: 0;
		margin-top: 50px;
	}
	.coursesBrowseSidebarImage {
		display: none;
	}
	.coursesBrowseSidebarContent {
		height: 300px;
		background-color: #fff;
		border: 1px solid #ccc;
		padding: 10px;
		border-radius: 5px;
		width: 100%;
	}
}

@media (min-width:1280px) { /* desktop */

}

@media (max-width: 1200px) {
	.coursePageContent {
		width: calc(100% - 10px);
		padding-right: 0px;
	}
	.coursePageInfo {
		width: calc(100% - 30px);
		margin-top: 10px;
		padding-right: 10px;
		max-width:640px;
	}

	.divnavbuttons {width:100%; display:inline-block; text-align: center; vertical-align:top; margin-top: 20px; border-bottom: 1px solid #ccc; border-top: 1px solid #ccc; padding:0;}
	.divdetail {width: 100%; display:inline-block; vertical-align:top; text-align:left;}
	.btnClearLeft {
		color: #000;
		border:none;
		background-color: transparent;
		font-size: 1.25rem;
		margin:  0 10px 0 0;
		min-width: unset;
		text-align: center;
		display: inline-block;
		padding: 10px 10px 10px 10px;
	}
	.btnClearLeftActive {
		display: inline-block;
		color: var(--blue);
		border: none;
		background-color: #fff;
		font-size: 1.25rem;
		margin: 0 10px 0 0;
		min-width: unset;
		text-align: center;
		font-weight: bold;
		padding: 10px 10px 10px 10px;
	}
}

@media (max-width: 1100px){
	.ceMapdiv {margin: 0 auto 0 auto; display: block; }
	.cdDatadiv {margin: 0 auto 10px auto; display: block;}
	.map{height:380px; width: 500px;}
	.colrightwide li {width: 40%;}


}

@media (max-width:1024px) { /* laptop, small desktop */

	.browseCourses {
		width: calc(100% - 20px); margin: 20px auto 0 auto;
	}
	.coursesBrowseLeft {
		float: left; width: 150px; margin-right: 10px;
	}
	.coursesBrowseLeft img {
		width: 150px;
	}
	.coursesBrowseMiddle {
		float: left; width: calc((100% - 160px) * .66); display:block; margin-right: 10px;
	}
	.coursesBrowseTitle {
		font-size: 1.3em; font-weight: 700; color: #00024F; margin-bottom: 10px; line-height:1.3rem;
	}
	.coursesBrowseUserHistory {
		font-size: 1.0em; color: #f00; margin-bottom: 10px;
	}
	.coursesBrowseDetails {
		font-size: 1.0em; color: #000;
	}
	.coursesBrowseRight {
		float: left; width: calc((100% - 160px) * .3); display:block; font-size: 0.8em; line-height: 1.0em;
		margin-bottom: 10px;
	}
	.coursesBrowseRight input {
		font-size: 1.0em;
	}

	.browseFilter{width: 100%;}
	.browseSearch {width: 100%}
}

@media (max-width:950px) {
	.divprompt200 {text-align:left; padding: 5px 5px 0 0; margin-top: 5px;width:99%}
	.divresponse200 {margin-top: 0px; width:99%}
	
	.divprompt150 {text-align:left; padding: 5px 5px 0 0; margin-top: 5px;width:99%}
	.divresponse150 {width: 99%; margin-top: 0px;}
	
	.divprompt100 {text-align:left; padding: 5px 5px 0 0; margin-top: 5px;width:99%}
	.divresponse100 {margin-top: 0px; width:99%}
	.divprompt50 {text-align:left; padding: 5px 5px 0 0; margin-top: 5px;width:99%}
	.divresponse50 {margin-top: 0px; width:99%}
}


@media (max-width: 900px) {
	.btnClear {
		font-size: 1.0em;
		min-width: 130px;
	}
	.btnClearActive {
		font-size: 1.0em;
		min-width: 130px;
	}
	.myaccountdetaildivdetail {
		width: 100%; display: inline-block; vertical-align:top
	}
	.myaccountdetaildivdetailsidebar {
		width: calc(100% - 30px);
		display: inline-block;
		vertical-align: top;
	}
	.myaccountgvDiv {
		width: 85%;
		margin-left: 10%;
	}

	.ceMapdiv {width: 400px; margin-right: 10px; display: inline-block; }
	.cdDatadiv {width: calc(100% - 440px);}
	.map{height:280px; width: 400px;}
}


@media (max-width:1217px) {
	.bg {background-image: url('/Images/BackgroundImg.png'); background-repeat: no-repeat; background-size: cover; width: 100%; }
}

@media (max-width:920px) { /* small  phone */
	.columns3 {width: calc(100% - 40px)}
	.columns3 .col {width: inherit; /*min-width: 100%;font-size: 1.5rem;*/}
		.col h3 {font-size: 1.5rem;}

	.herodivinner {width: 99%; min-width: unset;}
}

@media (max-width:801px) { /* tablet, smaller laptop / desktop */
	.page_header .menu {
		display: none;
	}
}

@media (max-width:800px) { /* tablet, smaller laptop / desktop */
	.main_content {
		margin-top: 70px;
		min-height: calc(100vh - 195px);
	}

	.hidden_page_content .page_content {
		display: none;
	}
	.newnav {
		display: none;
	}
	.headerlogo {width:200px;}
	.page_header {
		height: 75px;
	}

		.page_header .logo {
			min-width: 200px;
			width: 200px;
			max-width: 200px;
			margin-left: 0px;
		}

		.page_header .menu {
			display: block;
			vertical-align: top;
			padding: 5px;
			font-size: .7em;
			float: left;
			padding-top: 0px;
			width: 50px;
			margin-left: 0px;
			display: inline-block;
			vertical-align: top;
			padding-left: 1px;
		}

	.nav {
		display: inline-block;
	}
    .contentcol3rd {
        width: 100%;
    }
	.navexpand {
		width: 100%;
		min-height: 100%;
		
		position: fixed;
		top: 0;
		left: 0;
		display: none;
	}


	.page_footer .footer_content {
		display: block;

		min-width: calc(100% - 20px);
		max-width: calc(100% - 20px);
	}

		.page_footer .footer_content .links a {
			font-size: .8em;
		}

	.page_footer .copyright {
		font-size: .7em;
		max-width: calc(100% -20px);
	}


	.colleftsidebar {
		display: none;
	}

	.colrightwide {
		line-height: 1.2em;
		width: calc(100% - 5px);
		margin: 10px 0px 10px 0px;
		padding: 0px 0px 0px 15px;
		float: left;
	}

	.colleftwide {
		font-size: 0.9em;
		line-height: 1.0em;
		/*width: 100%;*/
		width: calc(100% - 20px);
		margin: 10px 0px 10px 10px;
		padding: 0;
		display: inline-block;
	}

	.colrightsidebar {
		width: 100%;
		font-size: 0.9em !important;
		line-height: 1.0em;
		margin-top: 10px;
		vertical-align: top;
		display: inline-block;
	}

	.testcontent {
		margin-top: 50px;
	}

	.contentarea {
		width: calc(100% - 2%);
		margin-right: calc((100% - calc(100% - 10px)) / 2);
		margin-left: calc((100% - calc(100% - 10px)) / 2);
	}

	.content {
		width: calc(100% - 20px);
	}


	.browseCourses {
		width: calc(100% - 20px);
		margin: 20px auto 0 auto;
	}

	.coursesBrowseLeft img {
		width: 150px;
		margin-right: 10px;
	}

	.coursesBrowseLeft img {
		width: 150px;
	}

	.coursesBrowseMiddle {
		float: left;
		width: calc((100% - 160px) * .66);
		display: block;
		margin-right: 10px;
	}

	.coursesBrowseTitle {
		font-size: 1.3em;
		font-weight: 700;
		color: #00024F;
		margin-bottom: 10px;
		line-height: 1.3rem;
	}

	.coursesBrowseUserHistory {
		font-size: 1.0em;
		color: #f00;
		margin-bottom: 10px;
	}

	.coursesBrowseDetails {
		font-size: 1.0em;
		color: #000;
	}

	.coursesBrowseRight {
		float: left;
		width: calc((100% - 165px) * .3);
		display: block;
		font-size: 0.8em;
		line-height: 1.0em;
		margin-bottom: 10px;
	}

		.coursesBrowseRight input {
			font-size: 1.0em;
		}

	.page_header .menudiv {
		display: none;
	}

	.page_header .myaccountdiv {
		margin-top: 0px;
		margin-right: 0px;
		margin-right: 0px;
		/*float: unset;*/
		margin-left: 25px;
	}

	.headerbannerslider{display:none !important;}

	.myaccountbutton {
		font-size: 0.75rem;
		width: 90px;
		padding: 0;
	}

	.myaccountdiv {margin:0;}

	/*.testTopNav {top: 75px;}*/
	.questionWrapperNumber a{top: 50px;}

	.contentWrapper {
		width: 100%;
		display: inline-block;
	}
	.contentSidebar {
		width: 100%;
		display: inline-block;
		vertical-align: top;
		margin-left: 0px;
		min-height: 300px;
		padding: 0;
		margin-top: 50px;
	}
	.contentSidebarImage {
		display: none;
	}
	.contentSidebarContent {
		height: 300px;
		background-color: #fff;
		border: 1px solid #ccc;
		padding: 10px;
		border-radius: 5px;
		width: 100%;
	}
	.ceMapdiv {width: 400px; margin-right: 10px; display: inline-block; }
	.cdDatadiv {width: calc(100% - 440px);}
	.map {height:400px; height: 280px;}

}

@media (max-width: 750px){
	.ceMapdiv {margin: 0 auto 0 auto; display: block; }
	.cdDatadiv {margin: 0 auto 10px auto; display: block;}
	.map {height: 280px;}
}


@media (max-width: 700px) {
	.coursesBrowseRight {
		float: left; font-size: 0.8em; line-height: 1.0em;
		margin-top: 10px;
		margin-bottom: 10px;
		margin-left: calc((100% - 410px) / 2);
		margin-right: calc((100% - 410px) / 2);
		width: 400px;
	}
	.coursesBrowseRight input {
		font-size: 1.0em;
	}
	.courseApprovals {
		width: 99%;
	}

	.ceHeader {text-align:center;}
	.ceHeader img{margin-top: 10px;}
	.ceMapdiv {display: none; }
	.cdDatadiv {width: 45%; min-width:235px; margin: 0; display: inline-block; padding: 3px}
	.ceStateButtonsdiv {width: 45%; display: inline-block;}
	.ceBlueWhitebutton{width:92px; font-size: 0.6em; margin: 2px; padding: 4px 3px;}
	.ceBlueRedbutton{width:92px; font-size: 0.6em; margin: 2px; padding: 4px 3px;}
	.ceBlueYellowbutton{width:92px; font-size: 0.6em; margin: 2px; padding: 4px 3px;}
}
@media (max-width:650px) {
		.colrightwide li {width: 90%;}
	}

@media (max-height: 600px) {
	.licensesdiv {display: none;}
}

@media (max-width:600px) { /* large phone,  */
	.main_content {
		margin-top: 70px;
		min-height: calc(100vh - 185px);
	}
	.contentarea {
		width: calc(100% - 2%);
		/*width: calc(100% - 30px);*/
		margin-right: calc((100% - calc(100% - 10px)) / 2);
		margin-left: calc((100% - calc(100% - 10px)) / 2);
	}
	.hidden_page_content .page_content {
		display:none;
	}

	.page_header {
		height: 75px;
		/*min-width: 480px;*/
	}
	.page_header .logo{
		min-width: 200px;
		width: 200px;
		max-width: 200px;
		margin-left: 0px;
	}
	.page_header .menu{
		padding-top: 0px;
		width: 50px;
	}
	.page_header .myaccountdiv {
		margin-right: 25px;
		width: 100px;
		text-align: right;
		margin-top: -10px;
	}
	.button {
		width:100%;
		line-height: 1.0em;
		padding: .4em 1.0em;
		font-size: .7rem;
	}
	.buttonhalf {
		width:48%;
		line-height: 1.0em;
		padding: .4em 1.0em;
		font-size: .7rem;
	}
	.noprint .blueButtonNote {font-size: 0.95em; padding: 10px; white-space: nowrap;}
	.blueButton {font-size: 1.0em;}

	.buttondark {
		display: block;
		text-shadow: none;
		color: #FEFFFB;
		background: #B2A975;
		font-weight: 100;
		border: 1px solid #D8D7CE;
		text-shadow: none;
		box-shadow: 1px 1px 2px rgba(0,0,0,0.15);
		border-radius: 3px;
		width: 100%;
		line-height: 2em;
		padding: .25em .5em;
		letter-spacing: .05em;
		font-size: 1.0rem;
	}

	.page_footer .footer_content {
		display: block;
		min-width: calc(100% - 20px);
		max-width:  calc(100% - 20px);
		text-align: center;
		padding-left: 0;
		
	}
	.page_footer .footer_content .links a {
			font-size: .8em;
		}
	.page_footer .copyright {
		margin-top: 3px;
		font-size: .6em;
		min-width: calc(100% -20px);
		max-width:  calc(100% -20px);
		float: none;
		text-align: center;
	}

	.footercol3rd {width: 100%;margin-left: 0; }

	

	/*  -----------------------------------------------------------------------------------------------------
								 BROWSE COURSES
	-----------------------------------------------------------------------------------------------------    */
	.courseResultsWrapper {
		width: 100%;
	}
	.browseCourses {
		width: calc(100% - 20px); margin: 20px auto 0 auto;
	}
	.coursesBrowseLeft {
		float: left; width: 150px; margin-right: 10px;
	}
	.coursesBrowseLeft img {
		width: 150px;
	}
	.coursesBrowseMiddle {
		float: left; width: calc((100% - 170px)); display:block; margin-right: 10px;
	}
	.coursesBrowseTitle {
		font-size: 1.3em; font-weight: 700; color: #00024F; margin-bottom: 10px; line-height:1.3rem;
	}
	.coursesBrowseUserHistory {
		font-size: 1.0em; color: #f00; margin-bottom: 10px;
	}
	.coursesBrowseDetails {
		font-size: 1.0em; color: #000;
	}
	.coursesBrowseRight {
		float: left; font-size: 0.8em; line-height: 1.0em;
		margin-top: 10px;
		margin-bottom: 10px;
		margin-left: calc((100% - 410px) / 2);
		margin-right: calc((100% - 410px) / 2);
		width: 400px;
	}
	.coursesBrowseRight input {
		font-size: 1.0em;
	}
	.courseApprovals {
		width: 99%;
	}

	.modalPopup {font-size: 0.9em; min-width: 300px;}

	.questionWrapperNumber a{top: 50px;}

	.paypaldiv .tbdropdownlist option {font-size: 1.0em; }
}
@media (max-width:500px) {
	.testTopNav {
		font-size: 0.65em;
	}

}

@media (max-width:480px) { /* small  phone */
	.contentarea {
		width: calc(100% - 2%);
		margin-right: calc((100% - calc(100% - 10px)) / 2);
		margin-left: calc((100% - calc(100% - 10px)) / 2);
	}

	.main_content {
		margin-top: 70px;
		min-width: 450px;
		min-height: calc(100vh - 199px);
	}

	.page_header {
		height: 75px;
		min-width: 470px;
	}
	.page_header .logo{
		min-width: 150px;
		width: 150px;
		max-width: 150px;
	}
	.page_header .menu{
		padding-top: 0px;
		width: 50px;
	}

	.coursesBrowseWrapper {
		width:100%;
		display: inline-block;
	}

	.page_footer .footer_content {
		max-width: 470px;
		min-width: 450px;
	}
		.page_footer .footer_content .links a, .linklight {
			font-size: .8em !important;
		}
	.page_footer .copyright {
		/*margin-top: 3px;*/
		font-size: .6em;
	}

	/*  -----------------------------------------------------------------------------------------------------
								 BROWSE COURSES
	-----------------------------------------------------------------------------------------------------    */
	.courseResultsWrapper {
		width: 100%;
	}
	.browseCourses {
		width: calc(100% - 50px); margin: 20px auto 0 auto;
	}
	.coursesBrowseLeft {
		float: left; width: 100px; margin-right: 10px;
	}
	.coursesBrowseLeft img {
		width: 100px;
	}
	.coursesBrowseMiddle {
		float: left; width: calc((100% - 120px)); display:block; margin-right: 10px;
	}
	.coursesBrowseTitle {
		font-size: 1.3em; font-weight: 700; color: #00024F; margin-bottom: 10px; line-height:1.3rem;
	}
	.coursesBrowseUserHistory {
		font-size: 1.0em; color: #f00; margin-bottom: 10px;
	}
	.coursesBrowseDetails {
		font-size: 1.0em; color: #000;
	}
	.coursesBrowseRight {
		float: left; font-size: 0.8em; line-height: 1.0em;
		margin-top: 10px;
		margin-bottom: 10px;
		margin-left: calc((100% - 420px) / 2);
		margin-right: calc((100% - 420px) / 2);
		width: 100%;
	}
	.coursesBrowseRight input {
		font-size: 1.0em;
	}
	.courseApprovals {
		width: 100%;
	}

	.myaccountgvDiv {
		width: 100%;
		margin-left: 0%;
	    font-size: 1.0rem;
	}
	.modalPopup {width: 80%; font-size: 0.9em; min-width: 300px;}
	.testTopNav {
		width: calc(100% - 2%);
	}


.cdDatadiv {width: 43%; min-width:190px; margin: 0 0 0px 0; display: inline-block; padding: 3px}
.cdDatadiv .img {max-width:210px;}
.ceStateButtonsdiv {width: 51%; display: inline-block;}
.ceBlueWhitebutton{width:92px; font-size: 0.6em; margin: 2px; padding: 4px 3px;}
.ceBlueRedbutton{width:92px; font-size: 0.6em; margin: 2px; padding: 4px 3px;}
.ceBlueYellowbutton{width:92px; font-size: 0.6em; margin: 2px; padding: 4px 3px;}
}

@media print {
	.main_content {
		margin-top: 0px !important;
		color: #000 !important;
		font-family: Arial !important;
	}

	.questionNotes, .questionWrapperNumber, .questionWrapperQuestion, .answerWrapper {color: #000 !important; page-break-inside: avoid;}
	.content {border: none !important;}
	.noprint, .noprint *
	{
		display: none !important;
	}
}