﻿
/* BEGIN MAIN WRAPPERS AND PAGE LAYOUT DIVS */
/* !!! Please tread carefully when modifying these styles, as all pages and formatting will be affected !!! */
/* Master_L0_Wrapper: Wraps all the objects in the Website */

/* GRAY BLUES
	*darkestblue*#224d96
	*darkblue*#6684B3
	*mediumblue*#7F98BF
	*lightblue*#9EB2D2
	*lightestblue*#eef3fb 
	*gray*#eef1f4
	*orange*#F8983B
*/
 
.wi_row_width{
	width: 100%;
}

/*div#Master_L0_Wrapper {

	}*/

			
/* Master_L0_Wrapper-bg: Provides the background image for the entire website */
/*div#Master_L0_Wrapper-bg {

	}*/	
	
/* wi_master_l0_header: Provides the background color and/or images for the Website Header section */
.wi_master_l0_header {
	/*
		padding-left: 15px;
		*/
	padding-top: 5px;
	padding-top: 5px;
	/*
	background-color:#FFFFFF;
	height:79px;
	width: 100%;

	*/
}

/* Master_L0_Footer: Provides the background color and/or images for the Website Footer section */
div#Master_L0_Footer {
		background: /*darkblue*/#6684B3  /*url(imagesV2/bg_footer.png) 0px 0px repeat-x*/;
	width: 100%; 
	height:31px; 
	}
	
/* Master_L0_TopBar: Provides the size, background color and image for the horizontal bar that separates the site header of the content*/
div#Master_L0_TopBar {
		background: /*darkestblue*/#224d96;
	height: 1px;
	width: 100%;
	margin-bottom:0px;
	/*margin-top:5px;*/
	}

/* Master_L0_MainContent: Provides the background properties for the content section of the website */
div#Master_L0_MainContent {
		background-color:#fff;
	width: 100%;
	height:100%;
	margin: 0px;
	}
	
	
/* Master_L0_CopyRight: Provides the attributes for the copyright section of the website */
div#Master_L0_CopyRight
{
	font-family:Arial, Helvetica, Sans-Serif; 
	font-size: 10px; 
	font-style: normal; 
	font-weight: normal; 	
	text-align: right; 
	vertical-align: middle;
	line-height: 10px; 
	font-variant: normal; 
	width:100%;
}

/*	 END MAIN WRAPPERS AND PAGE LAYOUT DIVS */	



/* LoginView CONTROL - START */
/* LOGINVIEWBOX DEFINES THE BACKGROUND IMAGE BEHIND THE LOGIN INFORMATION - CURRENT USER INFORMATION */
/* IN THE DEFAULT CREDITSOFT INSTALLATION THIS CLASS IS REFERENCED IN THE HEADER.HTM AND HAS THE GREEN BACKGROUND WITH THE LOGIN INFORMATION */
div#LoginViewBox{
	/*
	float: right;
	
		position: absolute;
			top:38px;
	right:15px;
	clear: both;
	
	width: 315px; height: 51px;
	*/
	background: /*lightestblue*/#eef3fb;
	border-radius: 5px;
	text-align:right;
	}

/* LoginViewText - IS USED TO POSITION THE ACTUAL LOGIN INFORMATION TEXT - CURRENT USER INFORMATION */
/* THIS DIV IS USED IN THE LOGINVIEW USER CONTROL */
div#LoginViewText{
	/*
	float: right;

	position: absolute;
	top:15px;
	right:30px;
	clear: both;
	
	text-align:right;
	width: 300px; height:30px;
		*/
	/*color:#fff;*/
	font-size: 12px;
min-height: 32px;
	}	

/* Links that are Inside the LoginViewText have different style because they may have a different background*/
a:link.wi_loginviewtext {		text-decoration: underline;	/*color: #fff;*/ }
a:visited.wi_loginviewtext {	text-decoration: underline;	/*color: #fff;*/ }
a:hover.wi_loginviewtext {	text-decoration: underline;	/*color: #fff; */}
a:active.wi_loginviewtext {	text-decoration: underline; /*	color: #fff;*/ } 


td#Master_L1_LoginContent {
	width: 100%;
	margin-left:20px;
	margin-top:20px;
	float:left;
	}
	
td#Master_L1_LoginBoxWrapper
{
	vertical-align:top;
}
	
/* LoginView CONTROL - END */


/* SITE HEADER AND FOOTER CLASSES  - START */
/* THIS CLASS IS USED BY THE HEADER.HTM PAGE.  IT CONTAINS THE MAIN LOGO OF THE COMPANY */
.wi_masterheader {
	width: 100%;
	/*
	max-height: 61px;
		*/
	height: 61px;
	margin: 0px;
	background: none;
	background-repeat:no-repeat;
background-size:contain;
/*
	background-position:center;
	*/
    margin-top: 5px;
    margin-bottom: 5px;
	}
	
/* THIS CLASS IS USED BY THE FOOTER.HTM PAGE.  IT CONTAINS THE BACKGROUND IMAGE OF THE SITE FOOTER*/
.wi_masterfooter { 
	text-align: right; 
	text-transform: uppercase; 
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 10px; 
	color: #fff;
	}	

/* THIS CLASS IS USED BY THE FOOTER.HTM PAGE.  IT CONTAINS THE FONT TYPE AND ALINGMENT OF THE SITE FOOTER*/
.wi_footer {   
	background-repeat:no-repeat;
	padding-right:10px;
	font: Verdana, Arial, Helvetica, sans-serif 11px bold;
	line-height: 33px; 
	text-transform: capitalize;
	}	
/* SITE HEADER AND FOOTER CLASSES  - END */


/* CSS Classes associated with the CSMaster_L1_MenuPanel Master Page * START */

/* wi_master_l1_mastertable: This is the main table of this Master Page.  It has three columns to allocate the three panels described below. */
.wi_master_l1_mastertable
{
	margin-right:0px auto;
	top:0px;
	margin-top:0px auto;
	width:100%;
}

  


/* Master_L1_LeftPanel: This table cell is also divided into two sub-sections: Menu Panel and Left Bottom Content.  */
.wi_master_l1_leftpanel {
	background: /*lightestblue*/ #eef3fb;
	/* we cannot set width because then we break the col-md- of bootstrap 
	width:215px;
		*/
	vertical-align: top;
	/*this one needs to match the margin-bottom of the Master_L0_TopBar
		or you can choose to set the margin-bottom of the Master_L0_TopBar to 0 and then get rid of this one too
	*/
	margin-top: 0px;
	/*make the panel background go to the bottom of the screen
		http://stackoverflow.com/questions/25213171/how-to-make-bootstrap-column-height-to-100-row-height
	
		removed to avoid extra space at the bottom of the screen
		margin-bottom: -1000px;
    padding-bottom: 1000px;
    overflow: hidden;
	*/
	/*max-width:220px;*/ /*otherwise it grows too much on bigger screens*/
}

/*.Master_L1_Menu: The menu section that allow users navigate to the different web pages that they have access to */
.wi_master_l1_menu {
	/*
		float: left;
	height: auto;
		*/
	/* we need to set the margin all around, not just top and left, so the div containing the menu buttons has a little space all around
	margin-top: 10px;
	margin-left: 10px;
	*/
	margin: 10px;
	/* we cannot set width because then we break the col-md- of bootstrap
	width:190px;
		*/
}

/* Master_L1_RightPanel: This section can be customized for each individual page to display custom information. It can be customized using the Right URL field on the Internet Menus.*/
.wi_master_l1_rightpanel {
	background: #fff;
	vertical-align: top;
	/* Setting the width disables the auto-sizing that bootstrap does. And when it moves to the bottom on smaller screens it looks weird only 195px wide. You should not hardode this.
		width:195px;
		*/
}

/* Master_L1_LeftBottomPanel: This section can be customized for each individual page to display custom information. It can be customized using the Left URL field on the Internet Menus*/
.wi_master_l1_leftbottompanel {
	margin-top: 15px !important;
	text-align: center !important;
	padding-left: 10px;
}

/* Master_L1_CenterPanel:This panel contains the space where the actual web page will be contained. This panel is also divided in four sub-sections: Top Content, Main Application Panel, Bottom Content and Navigation Buttons place holder. */
.wi_master_l1_centerpanel {
	/*
		background: #eef3fb;
																*/
	vertical-align: top;
}

/* wi_master_l1_navbuttons: Place holder to show the navigation buttons applicable for each web page. For example: Save and Cancel, Next and Previous, etc. */
.wi_master_l1_navbuttons 
{
	/*background: #fff  ;*/
    
    height:auto;
     /*padding:10px;*/
/*     position: relative;*/  /*Commented out due to problem in IE7 - Navigation Buttons were disabled - Issue # 21786 */
}




.hidden
{
    display:none;
}



/* BEGIN LOGIN PAGE STYLES */
/* Log In Page General Layout and Styles */


/* Div that contains the Login Control.  This Div provides the background image for the Login Control */
div#LoginBox {
  position: relative;
  overflow: hidden;
  /*
			width: 359px; height: 323px;
		*/
  /*
	background: url(imagesv2/bg_login.png) center  no-repeat;
		*/
  /*
		float:right;
		*/
  background: linear-gradient(#eef3fb,white);
  border-radius: 15px;
  margin-top: 6px; /* otherwise the rounded border goes right up against the header of the website */
}

div#LoginBox img{
			 display:none;
			 position:absolute;
			 width:100%;

}

/* Div that contains the Login control.  This Div provides the padding and alignment to the Login Control */
div#LoginText {
	position: relative;
	vertical-align: top;
	padding: 30px;

	}	
	
/*Provides Font-Size to the Custom HTML content files for the default pages. Example: enrollmentdefault.aspx (enrollment.htm) */
.wi_loginwelcometext {
	font-size: 14px;
	padding-bottom: 10px;
	}

/*Provides Font-Size and color to the Custom HTML content files for the default pages. Example: enrollmentdefault.aspx (enrollment.htm) */
.wi_loginwelcometextblue {
	font-size: 14px;
	padding-top: 5px;
	padding-bottom: 15px;
	color: #3d5b8a;
	}

.wi_loginbuttondiv {
	text-align:center;
	padding:5px
}

/* END LOGIN PAGE STYLES */

.wi_mobilemenu {
	/*this "resets" the margins so it actually gets margins from bootstrap. Otherwise the dropdown is too close to the edges of the browser and looks weird*/
	margin:0px;
}

.wi_userinfo {
  /* getting rid of these to make it align with the dropdownlist */
	 /*margin-left:-10px;
	 margin-top:5px;*/
}

/*This menu only should be visible on mobile when hamburguer icon is clicked*/ 
div.wi_menuclass_mobile {
	display: none;
}

/* This breakpoint relates exactly to the breakpoint in bootstrap where col-lg classes begin to apply and col-md classes stop applying
  Notice that the CSMaster_L1_MenuPanel.master has col-lg-2 for the left, col-lg-8 for the center (or 10 in VB code depending on right panel visibility), and col-lg-2 for the right
  But for medium, because the left panel is hidden (display:none) it has col-md-auto for the center.
*/
@media only screen and (min-width: 992px) {
	.wi_master_l1_leftpanel {
		display: block;
	}
	.wi_master_l1_rightpanel {
		display: table;
	}

	.wi_mobilemenu {
		display: none;
	}

	.wi_userinfo {
		/*display: block; not needed, always visible*/
		/*this padding is used to balance the ".MobileMenu display: none;" and keep the user info closer to the top bar*/
		/*padding-top:40px;*/
	}	
}

/* 992px and more causes the menu to be on the left instead of up*/
@media only screen and (max-width: 991px) {
	.wi_master_l1_leftpanel {
		display: none;
	}
	.wi_master_l1_rightpanel {
		display: none;
	}

	.wi_mobilemenu {		/* shows the mobile menu items */
		display: block;
	}

	.wi_loginview_groupdiv {
		/* we should show the user info (the envelope and icons), we just hide the dropdown with the profile and sign out options */
		display: none;
	}
	

}


	 /* Small Devices And Tablets */
@media only screen and (max-width: 360px) {

	.wi_master_l1_leftpanel {
		display: none;
	}
	.wi_master_l1_rightpanel {
		display: none;
	}

	.wi_mobilemenu
	 {			/* shows the mobile menu items */
		display: block;
	}

	.wi_userinfo {
		/* we should show the user info (the envelope and icons), we just hide the dropdown with the profile and sign out options */
		/* display: none;*/
	}

	.wi_loginview_groupdiv {
		/* we should show the user info (the envelope and icons), we just hide the dropdown with the profile and sign out options */
		display: none;
	}



	.wi_masterheader {
		background-position-x: center;
	}

	.wi_masterfooter {
		background-position-x:center;
		text-align: center;
	}

	div#Master_L0_CopyRight {
		text-align: center;
	}	
}
