
/* CSS - THE FONT USED
------------------------ */
@font-face{ 
	font-family: 'Lato-Light'; 
	src: url('../fonts/lato-light-webfont.eot'); 
	src: url('../fonts/lato-light-webfont.eot?#iefix') format('embedded-opentype'), 
		 url('../fonts/lato-light-webfont.woff') format('woff'), 
		 url('../fonts/lato-light-webfont.ttf') format('truetype'), 
		 url('../fonts/lato-light-webfont.svg#webfont') format('svg'); 
}

/* CSS - THE BODY ELEMENT
---------------------------- */

html {
	width:100%;
	height:100%;
	font-family: "Lato-Light", Arial, Verdana, sans-serif;
	color:#333333;
	background:#000 url(../images/background/learning_books_education_jackets_light_1920x1080_59453.jpg) center center fixed no-repeat;
	background-size:cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-backgro und-size: cover; 	
	/*overflow:hidden;*/
}

body {
	width:100%;
	/*height:100%;*/
	font-size:1.000em;
	overflow-x:hidden;
	margin:0 auto;
}

h1{
	font-weight:lighter;
	font-size:3.25em;
	border:none;
}

h2{
	font-weight: normal;
	font-size:2.750em;
	border:none;
}

h3{
	font-weight: normal;
	font-size:1.500em;
	border:none;
}

h4{
	font-weight: normal;
	font-size:1.250em;
	border:none;
}

h5{
	font-weight: normal;
	font-size:1.000em;
	line-height:1.2;
	border:none;
}

h6{
	font-weight: normal;
	font-size:0.875em;
	line-height:1.2;
	border:none;
}

h7{
	font-weight: normal;
	font-size:0.750em;
	line-height:1.2;
	border:none;
}

h8{
	font-weight: normal;
	font-size:0.625em;
	line-height:1.2;
	border:none;
}

hr{ 
	border-style: none;
    border-color: inherit;
    border-width: 0;
    height: 1px;
	background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(191,191,191,0.75), rgba(0,0,0,0)); 
	}

strong, .strong{
	font-weight:bold !important;
}

.italic{
	font-style:italic !important;
}

.width100Percent{
	width:100% !important; 
	height:auto;
}

.floatRight{
	float:right;
}

.floatLeft{
	float:left;
}
	
a{
	text-decoration:none;
	color:#666;
}

a:visited{
	text-decoration:none;
}

a:hover{
	text-decoration:none;
	color:#999;
} 

p{
	margin:15px 0px 0px 0px ;
}

div{
	clear:none !important;
}

img{
	cursor: pointer;
    cursor: hand;
}

#logo img{
	width:80px;
	float:left;
	padding:0px 0px 0px 20px;
}

#logo h3{
	position:absolute;
	margin:20px 0px 0px 100px;
}

.topRightMenu{
	float:right;
}

.topRightMenu ul{
	margin:10px 0px 0px 0px;
}

.topRightMenu li{
	float:left;
	padding:15px;
	background:url(../images/background/menuDiv.png) no-repeat left center;
}

.topRightMenu li.first{
	background:none;
}

.topRightMenu a{
	color:#FFFFFF;
}

.topRightMenu a:hover{
	color:#CCCCCC;
}

#lblPageTitle{
	font-weight: normal;
	font-size:0.750em;
	line-height:1.2;
	border:none;
}

#imgPassport, .imgPassport{
	float:left;
	width:100px;
	height:134px;
	margin: 0px 10px 10px 0px;
}

.imgPassport{
	float:none !important;
	margin: 0px 10px 3px 0px;
}

.imgPassportDetails{
	font-family: "Lato-Light", Arial, Verdana, sans-serif;
	font-weight: normal;
	font-size:1.250em;
	color:#2186B8;
	float:left;
	max-width:600px;
	width:100%;
	line-height:248px;
	height:134px;
	margin: 0px 10px 3px 0px;
}
	
.miniDetailHolder{
	margin: 30px 0px 0px 0px;
	float:left;
	width:auto;
}

.miniDetailHolder a, .miniDetailHolder span{
	float:none;
	display:block;
	width:100%;
	margin: 0px 0px 5px 0px;
}

#classLabel, #btnChangePassword, .DesignationLabel{
	font-weight: normal;
	font-size:0.750em;
	border:none;
}

#sessionLabel{
	font-weight: normal;
	font-size:1.500em;
	border:none;
}

#lblMasterStaffsName,.MasterName{
	margin:0px 0px 10px 0px;
	font-weight:bold;
	float:none;
	display:block;
	width:100%;
}

.loginBodyWrapper{
	margin:100px auto auto auto;
}

.admissionBodyWrapper{
	margin:20px auto auto auto;
}

.loginSeventyPercentPanel{
	padding: 50px 0px 20px 20px !important;
}

.loginThirtyPercentPanel{
	padding:20px;
}

.dashboardBodyWrapper{
	margin:10px auto auto auto;
}

.dashboardSeventyPercentPanel{
	float:left;
	width:100%;
	padding: 20px;
	margin:0px 0px 20px 0px;
	box-sizing: border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing: border-box;
	text-align:left;
}

.dashboardSeventyPercentPanel h2{
	font-weight: normal;
	font-size:2.000em;
	border:none;
}

.dashboardSeventyPercentPanel a {
    margin-right: 20px;
}

.dashboardSeventyPercentPanel li {
	position:relative;
    width: 100%;
}

.dashboardSeventyPercentPanel li label{
    height: 34px;
    margin: 0;
    max-width: 100%;
    outline: medium none;
    padding: 5px;
}

#thirtyPercentPanelDash a{
	min-width:220px;
}

.dashboardThirtyPercentPanel{
	padding: 0px 20px 0px 0px !important;
}

.dashboardThirtyPercentPanel ul{
	width:100% !important;
	padding: 10px 20px 20px 20px !important;
	box-sizing: border-box !important;
	-webkit-box-sizing:border-box !important;
	-moz-box-sizing: border-box !important;
	background:#FFFFFF;
	box-shadow: 0 1px 3px rgba(0,0,0,0.2);	
	-moz-box-shadow:0 1px 3px rgba(0,0,0,0.2);
	-khtml-box-shadow:0 1px 3px rgba(0,0,0,0.2);
	-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.2);   
}

.dashboardThirtyPercentPanel li{
	padding: 10px 0px 10px 0px;
	border-bottom:thin solid #999;
	width:100%;
}

.dashboardThirtyPercentPanel li:last-child{
	padding: 10px 0px 10px 0px;
	border-bottom:none;
}

table {
    background-color: #F9F9F9;
    border-spacing: 0;
    width: 100%;
    border:thin solid #FFF;
}

table th {
    background-color: #24598C;
    border-right:thin solid #FFF;
    border-bottom:thin solid #FFF;
	font-size:15px;
	font-weight:bold;
    color: #FFF;
    padding: 10px;
    text-align: right;
    text-transform: uppercase;
}

table td {
    border-right:thin solid #FFF;
    border-bottom:thin solid #FFF;
    padding: 10px;
    text-align: right;
	font-size:13px;
}

.colorTd{
    background-color: #D8E7F3;
}

.divTitle{
	margin:0px 0px 10px 0px;
}

.modalPopup {
	background-color:#FFFFFF;
	padding:20px 20px 0px 20px !important;
	min-width:300px !important;
	max-width:500px !important;
	width:100% !important;
	height:auto !important;
}

.modalPopup span{
	margin: 0px 0px 10px 0px !important;
}

.hidden{
	display:none;
}

.logo {
	float: left;
	width:150px;
	height:auto;
}

.iconBtn {
	width: 40px !important;
	height: 40px !important;
	text-align: center;
	vertical-align: middle;
	line-height: 40px;
	padding: 5px !important;
	margin:auto !important;
	color: #FFF;
	background:none !important;
	border: none !important;
	border-radius: none !important;
	box-shadow:none !important;
	box-sizing:none !important;
}

.etranzactLogo{
	width:150px !important;
	height:auto !important;
}

.leftDiv{
	float:left;
	width:50%;
}

.leftDiv li{
	margin:5px 0px 10px 0px !important;
}

.rightDiv{
	float:right;
	width:auto;
}

#payPageTitle{
	font-size: 40px;
	line-height: 20px;
	padding:20px 30px;
	margin: -10px -10px 0 0;
	color: #fff;
	font-weight:bold;
}

.amtPaidTitle{
	font-size: 20px;
	line-height: 20px;
	margin-bottom: 10px;
	color: #086FA1;
	font-weight:bold;
}

.amtPaidView{
	font-size: 60px;
	margin: 10px 0 10px 0;
	color: #086FA1;
	text-transform: uppercase;
	font-weight:bold;
}

.spanAutoWrap{
	position:relative;
	display: inline;
	float: left;
	width: 100%;
	margin:0.5% 0 0.5% 0;
	padding:0.5%;
	background:#;
}

.spanFull{
	position:relative;
	display: inline;
	float: left;
	width: 100%;
	margin:0 0 0.5% 0;
	background:#;
}

.spanOneOne{
	position:relative;
	display: inline;
	float: left;
	width: 97%;
	margin:0.5% 1% 0.5% 0;
	padding:0.5%;
	background:#;
	font-size:1.100em;
}
.spanOneOneUpload{
	position:relative;
	display: inline;
	width: 97%;
	float:right;
	margin:0.5% 1% 0.5% 0;
	padding:0.5%;
	background:#;
	font-size:1.100em;
}

.spanOneSecond{
	position:relative;
	display: inline;
	float: left;
	width: 47%;
	margin:0.5% 1% 0.5% 0;
	padding:0.5%;
	font-size:1.100em;
    top: 0px;
    left: 0px;
}

.spanOneThird{
	position:relative;
	display: inline;
	float: left;
	width: 30.33333333333333%;
	margin:0.5% 1% 0.5% 0;
	padding:0.5%;
	background:#;
	font-size:1.100em;
}

.spanTwoThird{
	position:relative;
	display: inline;
	float: left;
	width: 60.66666666666666%;
	margin:0.5% 1% 0.5% 0;
	padding:0.5%;
	background:#;
	font-size:1.100em;
}

.spanOneFourth{
	position:relative;
	display: inline;
	float: left;
	width: 22%;
	margin:0.5% 1% 0.5% 0;
	padding:0.5%;
	background:#;
	font-size:1.100em;
}

.spanOneFifth{
	position:relative;
	display: inline;
	float: left;
	width: 17%;
	margin:0.5% 1% 0.5% 0;
	padding:0.5%;
	background:#;
	font-size:1.100em;
}

.spanOneSixth{
	position:relative;
	display: inline;
	float: left;
	width: 13.66666666666667%;
	margin:0.5% 1% 0.5% 0;
	padding:0.5%;
	background:#;
	font-size:1.100em;

}

.spanOneSeventh{
	position:relative;
	display: inline;
	float: left;
	width: 11.28571428571429%;
	margin:0.5% 1% 0.5% 0;
	padding:0.5%;
	background:#;
	font-size:1.100em;
}

.spanOneEight{
	position:relative;
	display: inline;
	float: left;
	width: 9.5%;
	margin:0.5% 1% 0.5% 0;
	padding:0.5%;
	background:#;
	font-size:1.100em;
}

@media only screen and (max-width: 1024px) {
}

@media only screen and (max-width: 768px) {
}

@media only screen and (max-width: 480px) {
	
}

/* THIS STYLES THE FORM ELEMENTS
--------------------------------- */

input:not([type=submit]):not([type=file]){
	position:relative;
	font-family: "Lato-Light", Arial, Verdana, sans-serif;
    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #CCCCCC;
    border-radius: 2px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
	-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
    color: #555555;
    display: inline-block;
	font-size:1.250em;
    margin: 0px 20px 20px 0px;
    min-height: 34px;
    padding: 15px;
    transition: all 0.2s ease-out 0s;
    width:100%;
	box-sizing: border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing: border-box;
	outline: none; 
}

input[type="text"].readOnly, input[type="text"].insideForm, textarea, select {
	font-family: "Lato-Light", Arial, Verdana, sans-serif;
    background-color: #fff;
    border: 1px solid #ccc;
    color: #000000;
    height: 34px;
    margin-bottom: 10px;
    max-width: 100%;
    outline: medium none;
    padding: 5px;
    width: 300px;
    font-size: 15px;
    border-radius: 2px;
    box-shadow:none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
}

input:not([type=submit]):not([type=file]):focus, textarea:focus, select:focus {
    border:1px solid #4D92CA;
    box-shadow: 0 0 10px #719ECE;
}

input[type="text"].readOnly{
    border: none !important;
	padding-left:0 !important;
	margin-bottom:0 !important;
}

legend{
	font-family: "Lato-Light", Arial, Verdana, sans-serif;
	font-weight: normal;
	font-size:1.000em;
	color:#666;
	padding:5px 10px 5px 0px;
}

label{
	font-family: "Lato-Light", Arial, Verdana, sans-serif;
    font-size: 15px;
	/*line-height:30px;*/
	margin:0px 10px 0px 0px;
    font-weight: 600;
    text-transform: capitalize;
	width: 100%;
}

input[type=radio], input[type=checkbox] {
	display:none !important;
}

input[type="radio"] + label, input[type="checkbox"] + label{
    display:inline-block;
	font-weight: bold;
	font-size:1.000em;
    width:auto;
    height:40px;
	padding: 0px 0px 0px 50px;
	margin: 0px 0px 0px 0px;
	vertical-align:middle;
    background: url(../_images/_button/uncheck.png) no-repeat -20px -20px;
	cursor: pointer;
    cursor: hand;
	text-align:center;
	line-height:2.2;
}

input[type="radio"]:checked + label, input[type="checkbox"]:checked + label {
    background: url(../_images/_button/check.png) no-repeat -20px -20px;
}

button, .buttonLink, input[type=submit], .uploadFile {
	border-style: none;
    border-color: inherit;
    border-width: medium;
    font-family: "Lato-Light", Arial, Verdana, sans-serif;
	font-weight: normal;
/*	height:40px;*/
	color: #FFF;
    padding: 15px 20px;
    margin: 0px 20px 20px 0px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
	cursor: pointer;
    cursor: hand;
    background-image: -o-linear-gradient(#24598C, #2186B8) !important;
}

.uploadFile input[type="file"] {
    position: fixed;
    top: -1000px;
}

.uploadFileHolder {
	margin-left:0;
	padding-left:0;
	margin-bottom:20px;
}

button:hover, .buttonLink:hover,  input[type=submit]:hover{
	background-image: -o-linear-gradient(#24598C, #2186B8) !important;
}

@media only screen and (max-width: 1024px) {
}

@media only screen and (max-width: 768px) {
}

@media only screen and (max-width: 480px) {
}

/* THIS STYLES THE FOOTER SECTION
--------------------------------- */

@media only screen and (max-width: 768px) {
}

@media only screen and (max-width: 480px) {
}

/* CSS - EXTERNAL ADDONS
---------------------------------- */
.borderAll{
	border: 1px solid #CCCCCC;
	border-radius: 2px;
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
}

.wordwrap { 
   white-space: pre-wrap;      /* CSS3 */   
   white-space: -moz-pre-wrap; /* Firefox */    
   white-space: -pre-wrap;     /* Opera <7 */   
   white-space: -o-pre-wrap;   /* Opera 7 */    
   word-wrap: break-word;      /* IE */
}

.transparency{
	opacity:0.5;    
	filter:alpha(opacity=50);
	-moz-opacity:.50; 
	-khtml-opacity:.50; 
	-webkit-opacity:.50;   
}

.dropShadow{
	box-shadow: 0 1px 3px rgba(0,0,0,0.2) !important;	
	-moz-box-shadow:0 1px 3px rgba(0,0,0,0.2) !important;
	-khtml-box-shadow:0 1px 3px rgba(0,0,0,0.2) !important;
	-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.2) !important;   
}

.dropShadowBig{
	box-shadow: 0 1px 7px rgba(0,0,0,1);	
	-moz-box-shadow:0 1px 7px rgba(0,0,0,1);
	-khtml-box-shadow:0 1px 7px rgba(0,0,0,1);
	-webkit-box-shadow:0 1px 7px rgba(0,0,0,1);   
}

.curveAllEdges{
	border-radius:5px;
	-moz-border-radius:5px;
	-khtml-border-radius:5px; 
	-webkit-border-radius:5px;
}

.curveAllLeftEdges{
	border-top-left-radius:5px;
	-moz-border-top-left-radius:5px;
	-khtml-border-top-left-radius:5px; 
	-webkit-border-top-left-radius:5px;
	border-bottom-left-radius:5px;
	-moz-border-bottom-left-radius:5px;
	-khtml-border-bottom-left-radius:5px; 
	-webkit-border-bottom-left-radius:5px;
}

.curveAllRightEdges{
	border-top-right-radius:5px;
	-moz-border-top-right-radius:5px;
	-khtml-border-top-right-radius:5px; 
	-webkit-border-top-right-radius:5px;
	border-bottom-right-radius:5px;
	-moz-border-bottom-right-radius:5px;
	-khtml-border-bottom-right-radius:5px; 
	-webkit-border-bottom-right-radius:5px;
}

.zeroToHundredBlackOpacity{
	/* For WebKit */
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0)), to(rgba(0,0,5,9.5)));
	/* For Mozilla */
	background: -moz-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,5,9.5));
	/* For lt IE8 */
	filter: progid:DXImageTransform.Microsoft.gradient(gradientyype=0,
	startColorstr='#00000000', endColorstr='#FF000000');
	/* For gt IE8 */
	-moz-filter: progid:DXImageTransform.Microsoft.gradient(gradientyype=0,
	startColorstr='#00000000', endColorstr='#FF000000');
}

.Colour-Black{background-color:#000000;}
.Colour-Gray{background-color:#CCCCCC;}
.Colour-Lgray{background-color:#F5F5F5;}
.Colour-Orange{background-color:#E8591B;}
.Colour-Blue{background-color:#24598C;}
.Colour-Red{background-color:#DD4B39;}
.Colour-Violet{background-color:#6E1DBA;}
.Colour-Lemon{background-color:#97CE68;}
.Colour-Navy{background-color:#4D68A2;}
.Colour-Green{background-color:#1FBBA6;}
.Colour-White{background-color:#FFFFFF;}

.transImageBgBlack{ background:url(../images/background/black_trans_bg.png)}
.transImageBgOrange{ background:url(../images/background/orange_trans_bg.png)}
.transImageBgBlue{ background:url(../images/background/blue_trans_bg.png)}
.transImageBgRed{ background:url(../images/background/red_trans_bg.png)}
.transImageBgViolet{ background:url(../images/background/violet_trans_bg.png)}
.transImageBgLemon{ background:url(../images/background/lemon_trans_bg.png)}
.transImageBgGreen{ background:url(../images/background/green_trans_bg.png)}
.transImageBgWhite{ background:url(../images/background/white_trans_bg.png)}

.text-Black{color:#0d1625;}
.text-Orange{color:#E8591B;}
.text-Blue{color:#24598C;}
.text-Gray{color:#666;}
.text-Lgray{color:#999;}
.text-Green{color:#72B64A;}
.text-White{color:#FFFFFF;}
.text-Red{color:#DD4B39;}

.clearFix:before, .clearFix:after { content: ""; display: table; }
.clearFix:after { clear: both; }
.clearFix { zoom: 1; }
