@charset "utf-8";
/* CSS Document */

@font-face {
    font-family: squareFont;
    src: url(fonts/E-SQUARE_demo.otf);
}

.homeline{ margin-top: 95px;
}

.check{
	margin-top:17px !important;
}
.radiouser{
margin-top: 19px !important;

}
.radiouseryes{
	margin-top: -36px !important;
margin-left: 90px !important;
}
.formusersearch{
margin-bottom: -2px !important;
}
.formsearchgroup{
	margin-bottom:-2px !important;
}
.terminatedusermenus{
	margin-bottom: -18px;
    margin-left: 255px;
}

.usermenus{
	margin-bottom: -18px;
    margin-left: 35px;
}

#menu {
	width: 60%;
	height: 40px;
	float: left;
	margin-top: 30px;
	margin-left: 10px;
}
 
ul#nav {
	float: left;
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
}
 
ul#nav li {
display: inline;
}
 
ul#nav li a {
	float: left;
	font: bold 1.1em arial,verdana,tahoma,sans-serif;
	line-height: 40px;
	color: #fff;
	text-decoration: none;
	text-shadow: 1px 1px 1px #880000;
	margin: 0;
	padding: 0 4%;
}
ul#nav li a.firstlevelA  {
	min-width: 16.66%;
    padding: 0;
    text-align: center;
}

ul#nav li a.firstlevelA .icon  {
	float: right;
    /*padding-right: 2px;*/
}
/* APPLIES THE ACTIVE STATE */
ul#nav .current a, ul#nav li:hover > a, ul#nav li.current > a {
color: #fff;
text-decoration: none;
text-shadow: 1px 1px 1px #330000;
}
 
/* THE SUBMENU LIST HIDDEN BY DEFAULT */
ul#nav li.current ul {
	display: block;
}

ul#nav ul {
display: none;
}
 
/* WHEN THE FIRST LEVEL MENU ITEM IS HOVERED, THE CHILD MENU APPEARS */
ul#nav li.current ul {
	display: block;
	position: fixed;
	margin: 40px auto 0 ;
	left: 0px;
	float: left;
	padding-left: 5%;
}

ul#nav li:hover > ul, ul#nav li.current ul {
position: fixed;

/*height: 45px;*/
margin: 40px auto 0 ;
left: 0px;
float: left;
padding-left: 5%;
/*background: #aa0000 url(../img/menu-child.png) repeat-x;*/
}
 
ul#nav li:hover > ul li a, ul#nav li.current > ul li a {
float: left;
/*font: bold 1.1em arial,verdana,tahoma,sans-serif;*/
line-height: 45px;
color: #fff;
text-decoration: none;
text-shadow: none;
margin: 0;
padding: 0 15px 0 0;
/*background: #aa0000 url(../img/menu-child.png) repeat-x;*/
}

/* top level
--------------------------------------------*/
.menuTemplate1
{
    /* You will get totally diffrent menu alignment and layout by setting following margin, width, and float with different values.
    For detailed instruction please visit www.menucool.com/horizontal/menu-layout  */
    margin: 0 auto; width: auto;float:left;
    /*following "behavior" works for IE6, IE7, and IE8. Other browsers will ignore it.*/
    /*Note: htc file path(if using relative path) inside the CSS file should be relative to the page, not to the CSS file (this is unlike image path inside the CSS that is relative to the CSS file location only). 
    So we recommend using the absolute path for the behavior file.*/
    behavior: url("/horizontal/menuh/cssmenu.htc");
    position:relative;
    z-index:4;
    height: 36px;
    background: #ffffff;
    /*border: 1px solid #BBB;*/
    font-family: Arial, Helvetica, sans-serif;
    list-style: none;
    padding: 0;
	margin: 0!important;
}

.menuTemplate1 div {
    box-sizing:content-box;
}  
   
.menuTemplate1 li
{
    padding: 0;
    float: left;
    height: 36px;
    position: relative;/*delete it if you want submenu to be positioned relative to the whole menu instead of this li element*/
    color: black;
    z-index:5;
}

.menuTemplate1 a
{
    padding: 0 30px;
    line-height: 36px; /*Note: keep this value the same as the height of .menuTemplate1 li */
    font-size: 12px;
    font-weight: bold;
    display: inline-block;
    outline: 0;
    text-decoration: none;
    color: black;
    position: relative;
}
.menuTemplate1 li:hover a, .menuTemplate1 li.onhover a
{
    background: white url(bg.gif) repeat-x 0 -48px;
    color: #000;
    z-index: 9;
}
 
        
/*Used to align a top-level item to the right*/        
.menuTemplate1 li.menuRight
{
    float: right;
    margin-right: 0px;
}
        
/*for the top-level separators*/
.menuTemplate1 li.separator
{
    font-size:0;
    overflow:hidden;
    border-left:1px solid #F7F7F7;
    border-right:1px solid #BBBBBB;
    z-index:4;
}
               
        
/* sub level
--------------------------------------------*/
.menuTemplate1 .drop
{
    position: absolute;
    z-index:5;
    left: -9999px;
    border: 1px solid #DDD;
    border-bottom:3px solid #0F4F89;
    background: #FFF;            
    text-align: left;
    padding: 20px;  
    color:#0F4F89;
    top: 40px;              
}

.menuTemplate1 .drop a
{
    padding-left: 0px;
    padding-right: 0px;
    line-height: 26px;
    font-size: 12px;
    font-weight: normal;
    display: inline;
    text-align: left;
    
    position: static;
    z-index: 0;
    background-image:none;
}

.menuTemplate1 li:hover .drop, .menuTemplate1 li.onhover .drop
{
    left: -1px;/*Use this property to change offset of the dropdown*/
    background:white url(bg-right.png) no-repeat right bottom;
}
.menuTemplate1 li:hover .dropToLeft, .menuTemplate1 li.onhover .dropToLeft
{
    left: auto;
    right: -1px;
    background:white url(bg-left.png) no-repeat 0 bottom;
}
.menuTemplate1 li:hover .dropToLeft2, .menuTemplate1 li.onhover .dropToLeft2
{
    left: auto;
    right: -60px;
}

/* Elements within the drop down sub-menu
--------------------------------------------*/

.menuTemplate1 div.drop div div
{
    padding: 6px 20px;
}
.menuTemplate1 li:hover .drop a, .menuTemplate1 li.onhover .drop a
{
    background: none;
    background-image:none;
    padding:0 0;
}
.menuTemplate1 div.drop div a
{
    line-height: 24px;  
    color: #0F4F89;
    background:none;
}
.menuTemplate1 div.drop div a:hover
{
    text-decoration:underline;
    cursor:pointer;
    color:Red;
}

.menuTemplate1 div.left {float:left;}

        
/* CSS3 effects
--------------------------------------------*/

/*for top-level*/     


/*for submenu.*/    
.decor1_2 
{
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;

    -moz-box-shadow: 0px 12px 20px #CCCCCC;
    -webkit-box-shadow: 0px 12px 20px #CCCCCC;
    box-shadow: 0px 12px 20px #CCCCCC;  
}

#sortable1, #sortable2  {
	float: left; width: 50%;
}

#plussign {
	/*background-color: #4F4F4F;*/
	color: #ffffff;
	border-radius: 12px;
	font-size: 18px;
	cursor: pointer;
}

.center-holder{
	/*background: none repeat scroll 0 0 #42be94;*/
    display: none;
    float: left;
    margin: 0 auto 15px 1%;
    padding: 31px 0 0;
    width: 98%;
}

.center-holder h1 {
    color: #fff;
    font-size: 30px;
    line-height: 34px;
    margin: 0 33px;
}

.center-holder h1:after {
    background: none repeat scroll 0 0 transparent;
    content: " ";
    display: block;
    height: 1px;
    left: 0;
    position: absolute;
    top: 50%;
    width: 100%;
}

.center-holder h1 span {
    background: none repeat scroll 0 0 transparent;
    padding: 0 5px;
    position: relative;
    z-index: 1;
}

.center-holder h2 {
    color: #fff;
    font: 24px/28px "Intro-Light-Alt",Arial,Helvetica,sans-serif;
    margin: 0 33px 20px;
}

.columns-container {
    padding: 0 0 0 3%;
	float: left;
	width: 97%;
}


.columns-container .column {
    float: left;
    width: 33%;
}

.module-box {
    background: none repeat scroll 0 0 #fff;
    margin: 0 0 22px;
    overflow: hidden;
    position: relative;
}

.module-box.width1 {
    width: 95%;
}

.module-box .text {
    background: none repeat scroll 0 0 #dcf5ed;
    color: #4f4f4f;
    float: left;
    font: 300 24px/28px Arial,Helvetica,sans-serif;
    letter-spacing: -1px;
    padding: 7px 9px;
    width: 100%;
}

.module-box .btn-close {
    background: url("../img/icons/btn-close.png") no-repeat scroll 8px 9px #dcf5ed;
    height: 42px;
    overflow: hidden;
    position: absolute;
    right: 1px;
    text-indent: -9999px;
    top: 1px;
    width: 37px;
}

.module-box .btn-open {
    background: url("../img/icons/btn-add.png") no-repeat scroll 9px 9px #dcf5ed;
    height: 42px;
    overflow: hidden;
    position: absolute;
    right: 1px;
    text-indent: -9999px;
    top: 1px;
    width: 37px;
}

.module-box.width2 {
    width: 65%;
}

.courseBoxContainer {
	float: left; 
	/*display: flex; */
	width: 100%; 
	height: auto; 
	background: none repeat scroll 0 0 transparent!important;
	/*overflow-x: hidden; 	*/
}

.courseBoxScroll {
	float:left; 
	padding: 135px 2% 0;
	width: 5%;
	display: none;
}

.courseBoxScroll img{
	float:left; 
	width: 100%;
}

.courseBox {
	float:left; 
	margin: 10px 5px; 
	width: 268px;
	min-height: 355px;
	box-shadow: 0 0 6px 0 rgba(50, 50, 50, 0.75);
	position: relative;
}
.courseImage {
	float: left;
	width: 100%;
}

.cursor{
	cursor: pointer;
}

.courseTitle {
	width: 94%;
	padding: 10px 3%;
	color: #595047;
	font-weight: bold;
	font-size: 16px;
	text-transform: capitalize;
	float: left;
}

.courseDesc {
	width: 94%;
	padding: 10px 3%;
	color: #8a8e85 ;
	font-weight: normal;
	min-height: 30px;
	font-size: 14px;
	text-transform: capitalize;
	float: left;
}

.courseDesc p {
	margin: 0;
}

.courseDue {
	/*float: left;*/
	width: 100%;
	position: absolute;
    bottom: 2px;
}

.courseCredit {
	background: transparent url(icons/courseCredit.png) no-repeat right bottom;
	float:left;
	width: 39px;
	height: 39px;
}

.courseDueText{
	float: left;
	width: 74%;
	padding: 10px 3%;
	color: #000000 ;
	font-weight: bold;	
	font-size: 14px;
}

.courseCredit  div {	
    color: #4469b4;
    font-size: 14px;
    font-weight: bold;
    margin-top: 8px;
    text-align: center;
	font-family: squareFont;
}

.courseCredit + .courseDueText {
	width: 100px;
	padding: 12px 3% 0;
}

.courseEnroll {    
    float: right;
    margin-top: 6px;   
    padding: 1% 0;
    width: auto;
}

.courseEnrollChk {
	float: right;
    padding-top: 10px;
}

.courseEnrollPicTD{
	padding: 1px 5px!important;
	vertical-align: middle;
	text-align: center;
}

.courseEnrollPicTD1{
	padding: 5px!important;
	vertical-align: middle;
	text-align: center;
}

.courseEnrollPic{
	border-radius: 25px;
}

@media screen and (max-width: 600px) {
    
	#menu {
		margin: 0;
		width: 100%;
	}
	
	ul#nav {
		width: 100%;
	}
	
	ul#nav li a {
		min-width: 50px;
		padding: 0 22px;
	}
	
	ul#nav li:hover > ul, ul#nav li.current > ul {
		/*height: 90px;*/
		padding-left: 2%;
		height: auto;
	}
	
	ul#nav li:hover > ul li a, ul#nav li.current > ul li a {
		line-height: 30px;
	}
	
	.homeline {
		margin-top: 115px;
	}
	
	#sortable1, #sortable2  {
		float: left; width: 100%;
	}
	
	.center-holder h1 {
		color: #fff;
		font-size: 22px;
		line-height: 25px;
		margin: 0 33px;
	}

	.center-holder h2 {
		color: #fff;
		font: 18px/22px "Intro-Light-Alt",Arial,Helvetica,sans-serif;
		margin: 0 12px 20px;
	}
	.module-box .text {
		font: 300 18px/24px Arial,Helvetica,sans-serif;
	}	
	
	.courseBoxContainer {
		width: 100%;
	}
	
	.courseBox {		
		margin: 10px 5px; 
		width: 268px;
		min-height: 355px;
		position: relative;
	}
}

@media (min-width: 601px) and (max-width: 768px) { 
  /* CSS for browsers less than 768px*/
	#menu {
		margin: 0 0 0 -2%;
		width: 102%;
	}
	
	ul#nav {
		width: 100%;
	}
	
	ul#nav li a {
		/*padding: 0 4%;*/
		padding: 0;
		text-align: center;
		font-size: 1.1em;
		min-width: 16.66%;
	}
	
	ul#nav li:hover > ul , ul#nav li.current > ul{
		/*height: 90px;*/
		padding-left: 2%;
		height: auto;
	}
	
	ul#nav li:hover > ul li a, ul#nav li.current > ul li a {
		line-height: 30px;
		padding: 0 20px 0 0;
		min-width: auto;
		text-align: left;
	}
	
	.homeline {
		margin-top: 115px;
	}
	
	#sortable1, #sortable2  {
		float: left; width: 100%;
	}
	
	.center-holder h1 {
		color: #fff;
		font-size: 22px;
		line-height: 25px;
		margin: 0 33px;
		text-align: center;
	}

	.center-holder h2 {
		color: #fff;
		font: 18px/22px "Intro-Light-Alt",Arial,Helvetica,sans-serif;
		margin: 0 12px 20px;
		text-align: center;
	}
	
	.module-box .text {
		font: 300 18px/24px Arial,Helvetica,sans-serif;
	}	
	
	.courseBoxContainer {
		width: 100%;
	}
	
	.courseBox {		
		margin: 10px 5px; 
		width: 268px;
		min-height: 355px;
		position: relative;
	}
}

@media (min-width: 769px) and (max-width: 930px) { 
	#menu {
		margin: 0 0 0 -2%;
		width: 102%;
	}
	
	ul#nav {
		width: 100%;
	}
	
	ul#nav li a {
		/*padding: 0 4%;*/
		padding: 0;
		text-align: center;
		font-size: 1.1em;
		min-width: 16.66%;
	}
	
	.homeline {
		margin-top: 115px;
	}
	
	#siteLogo{
		height: 70px;
	}
	
	ul#nav li:hover > ul, ul#nav li.current > ul {
		height: auto;
		padding-left: 2%;
	}	
	
	ul#nav li:hover > ul li a, ul#nav li.current > ul li a {
		line-height: 35px;		
		min-width: auto;
		text-align: left;
	}
	
	.courseBoxContainer {
		width: 100%;
	}
}
@media (min-width: 931px) and (max-width: 1024px) { 
	#menu {
		margin-left: 0;
	}
	
	ul#nav li a {
		padding: 0 3%;
		font-size: 1em;
	}
	
	ul#nav li:hover > ul, ul#nav li.current > ul {
		height: auto;
		padding-left: 2%;
	}	
	
	ul#nav li:hover > ul li a, ul#nav li.current > ul li a {
		line-height: 35px;		
	}
	
	.courseBoxContainer {
		width: 100%;
	}
	
}
@media (min-width: 1024px) and (max-width: 1200px) { 
	
	#menu {
		margin-left: 0;
	}
	
	ul#nav li a {
		padding: 0 3%;
	}
	
	ul#nav li:hover > ul li a, ul#nav li.current > ul li a {
		line-height: 35px;		
	}
	
	#toolbar .right {
		right: 3%;
	}
}