/**
 * @file main.css
 * @source /assets/css/main.css 
 * @project CIT
 * @author Albaraa Mishlawi @ Code&Dot
 * @version this
 * @since this
 * @update this 
 */

/*
 ##################################################################
 #	Reset                                                     #
 ##################################################################
*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
body{line-height:1.3em}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
nav ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}
ins{background-color:#ff9;color:#000;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
table{border-collapse:collapse;border-spacing:0}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
input,select{vertical-align:middle}

ul.bjqs{position:relative; list-style:none;padding:0;margin:0;overflow:hidden; display:none;}
li.bjqs-slide{position:absolute; display:none;}
ul.bjqs-controls{list-style:none;margin:0;padding:0;z-index:9999;}
ul.bjqs-controls.v-centered li a{position:absolute; padding: 5px; background: #eee; color: #b32828;}
ul.bjqs-controls.v-centered li.bjqs-next a{right:0; border-radius: 3px 0 0 3px;}
ul.bjqs-controls.v-centered li.bjqs-prev a{left:0; border-radius: 0 3px 3px 0;}
ol.bjqs-markers{list-style: none; padding: 0; margin: 0; width:100%;}
ol.bjqs-markers.h-centered{text-align: center;}
ol.bjqs-markers li{display:inline;}
ol.bjqs-markers li a{display:inline-block;}
p.bjqs-caption{display:block;width:96%;margin:0;padding:2%;position:absolute;bottom:0;}
/*
 ##################################################################
 #	General Classes  					                       #
 ##################################################################
*/
.container{
	width: 960px;
	margin: 0 auto;
	font-family: arial;
}
.lt{ float: left; }
.rt{ float: right; }
.overflow{ overflow: hidden;}
ul,li{margin: 0; padding: 0;}
li{list-style: none;}
body{
	font-size: 16px;
	color: #5c5c5c;
}
a {
color: #FFF;
text-decoration: none;
}
#loader{
	display: none;
	position: absolute;
	top: 0px;
	background-color: rgba(255, 255, 255, 0.8);
	z-index: 999;
}
#loader span {
	position: fixed;
	width: 50px;
	display: block;
	top: 50%;
	left: 50%;
}
#loader div.ajax-content-wrapper {
	position: fixed;
	display: none;
	top: 30%;
	left: 0;
}
#loader div.ajax-content {
	position: relative;
	width: 500px;
	margin: 0 auto;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 0 5px #aaa;
	padding: 20px;
	border-radius: 5px;
	padding-right: 50px;
}
a.close-loader{
	position: absolute;
	top: 10px;
	right: 5px;
	color: #b00;
	font-size: 60px;
	font-weight: 600;
	background: #eee;
	padding: 10px 3px;
	border-radius: 500px;
	cursor: pointer;
}

.major-slide {
	position: relative;
	color: #ECECEC;
}

.major-slide h3 {
	position: absolute;
	top: 45px;
	right: 110px;
	font-size: 30px;
	width: 210px;
	line-height: 1.2em;
}

.major-slide div {
	position: absolute;
	top: 125px;
	right: 65px;
	width: 255px;
}
/*
 ##################################################################
 #	Custom Fonts                                              #
 ##################################################################
*/

/*
 ##################################################################
 #	Layout                                                    # 
 ##################################################################
*/
	#header_wrapper{
		background: #000;
		height: 450px;
	}
	#body_wrapper{
		position: relative;
		padding-top: 100px;
	}
	#footer_wrapper{
		background: url(../../images/footer-bg.jpg) no-repeat top center;
		height: 355px;
	}
/*
 ##################################################################
 #	Inside Layout's Sections                                 	  #
 ##################################################################
*/
#header {
background: #fff;
}
.top {
background: url(../../images/header-bg.jpg) no-repeat top left;
height: 85px;
}
.logo {
margin-left: 25px;
padding-top: 5px;
}
.info {
padding: 16px;
background: #eee;
color: #a52b30;
line-height: 1.3em;
text-align: right;
font-size: 14px;
}
#menu {
background: url(../../images/menu-bg.jpg);
height: 40px;
font-family: serif;
text-shadow: 1px 1px 2px #000;
}
#menu ul li {
float: left;
height: 40px;
}
#menu ul.menu li a {
padding: 11px 20px;
line-height: 2.5em;
font-size: 16px;
text-transform: uppercase;
border-right: 1px solid #C73737;
border-left: 1px solid #9B1818;
}
.login-btn {
background: url(../../images/login-btn.jpg);
text-shadow: 1px 1px 2px #000;
font-style: italic;
}
ul.social li {
display: inline-block;
}
ul.social li a {
display: inline-block;
width: 40px;
height: 40px;
background: url(../../images/header-social.png) no-repeat;
}
ul.social li a.fb {
background-position: 0 0;
}
ul.social li a.tw {
background-position: -40px 0;
}
ul.social li a.in {
background-position: -80px 0;
}
/*********************************** Nav Styles *********************************/
#nav {
position: absolute;
top: -20px;
left: 0;
}
#nav ul li {
float: left;
}
#nav ul li a {
background: #B32828;
display: inline-block;
width: 88px;
height: 45px;
margin-right: 2px;
text-align: center;
position: relative;
padding-top: 60px;
padding: 60px 34px 0px;
line-height: 1.2em;
}
#nav ul li a:hover ,#nav ul li a.active {
background: #dc989b;
}
/*#nav ul li a:hover span.icon{
background-position: 0 -60px;
}*/
.icon {
display: inline-block;
width: 60px;
height: 60px;
background: url(../../images/icons.png);
position: absolute;
top: -20px;
left: 50px;
}
a:hover span.icon {background-position: 0px -60px;}
.majors span.icon {background-position: -60px 0;}
a.majors:hover span.icon {background-position: -60px -60px;}
.acceptance span.icon {background-position: -120px 0;}
a.acceptance:hover span.icon {background-position: -120px -60px;}
.activities span.icon {background-position: -180px 0;}
a.activities:hover span.icon {background-position: -180px -60px;}
.logistic span.icon {background-position: -240px 0;}
a.logistic:hover span.icon {background-position: -240px -60px;}
.decree span.icon {background-position: -300px 0;}
a.decree:hover span.icon {background-position: -300px -60px;}
/********************************************** Footer Styles *************************************/
#social {
margin-top: 220px;
margin: 220px 20px 0;
}
#social ul li {
display: inline-block;
}
#social ul li a {
display: inline-block;
width: 65px;
height: 65px;
background: url(../../images/footer-social.png);
}
#social ul li a.fb {
background-position: 0px 0;
}
#social ul li a.tw {
background-position: -65px 0;
}
#social ul li a.in {
background-position: -130px 0;
}
#site_map {
text-align: center;
margin-top: 125px;
}
ul.links {
margin-top: 20px;
}
.links li {
display: inline-block;
padding: 0 10px;
border-right: 1px solid #fff;
}
.links li.last {
border: 0;
}
/**************************************** Home Page Styles ****************************************/
#news_feed {
width: 448px;
}
#info {
width: 478px;
}
.info-block {
height: 240px;
position: relative;
}
.info-block h5 {
padding: 30px 30px 10px;
background: url(../../images/h5-bg.jpg) no-repeat bottom;
border-bottom: 1px solid #999;
font-size: 20px;
line-height: 1.2em;
}
.info-block.left h5 {
background-position: bottom left;
padding-left: 70px;
}
.info-block.right h5 {
background-position: bottom right;
padding-left: 150px;
}
.info-block img {
position: absolute;
top: 0;
border: 1px solid #555;
}
.info-block.right img {
left: 15px;
}
.info-block.left img {
right: 15px;
}
.info-block p {
font-size: 14px;
padding: 10px;
}
.right.info-block p {
padding-left: 150px;
}
.left.info-block p {
padding-right: 150px;
}
a.more {
color: #555;
font-style: italic;
font-size: 14px;
float: right;
margin: 10px 5px 5px;
}
a.more:hover{text-decoration: underline; color: #B32828;}

#news_feed h4 {
background: #B32828;
color: #FFF;
padding: 15px;
box-shadow: 1px 1px 1px #555;
margin-bottom: 20px;
}
.news {
padding-bottom: 15px;
border-bottom: 1px solid #eee;
margin-bottom: 15px;
}
.date {
width: 75px;
height: 75px;
background: #f6b748;
text-align: center;
border-radius: 100px;
color: #FFF;
font-size: 26px;
line-height: 2.9em;
float: left;
margin-right: 20px;
}
.news p {
width: 428px;
text-align: justify;
}
.title {
display: block;
font-weight: 600;
padding: 0 0 6px;
color: #B32828;
}
.col{
display: inline-block;
}
.col-1{
width: 476px;
}
.col-2{
width: 476px;
}
#events_header {
height: 50px;
margin-top: 10px;
background: #eee;
box-shadow: 1px 1px 4px #999;
text-align: center;
font-size: 22px;
line-height: 2.4em;
}
#calendar {
margin-top: 20px;
margin-left: 30px;
}
/**************************************** Tab Styles ****************************************/
h3.tab {
background: url(../../images/arrow.png) no-repeat #B32829 10px center;
color: #fff;
padding: 10px;
margin: 10px 0;
border-radius: 4px;
cursor: pointer;
padding-left: 45px;
}
.tab-content {
	display: none;
	font-size: 13px;
}
/*
 ##################################################################
 #	Print                                                     #
 ##################################################################
*/


/*
 ##################################################################
 #	Student Profile                                 	  		  #
 ##################################################################
*/

div.user-menu {
	background: #eee;
	/* padding: 10px; */
	border-radius: 5px;
	box-shadow: 0px 2px 2px #aaa;
}

ul.button-bar {
	overflow: hidden;
}

ul.button-bar li a {
	float: left;
	margin: 0px 27px;
	display: inline-block;
	padding: 10px 10px;
	color: #a22;
}

ul.button-bar li a:hover {
	/* background: #A73636;
	color: #fff; */
}

section.user-content.pdf {
	/* background: #eee;
	padding: 10px;
	margin: 20px 0px;
	border-radius: 5px; */
	overflow: hidden;
}

div.label {
	float: left;
	width: 140px;
	text-align: right;
	margin-right: 12px;
	font-size: 15px;
}

div.input input, div.input textarea, div.input select {
	width: 185px;
	padding: 5px;
}

legend.title {
	border-bottom: 1px solid;
	width: 100%;
}

div.fields {
	margin: 30px 0;
}

span.required {
	color: #d22;
}

div.submit input {
	width: 150px;
	padding: 8px 5px;
	background: #a22;
	border: 1px solid #fff;
	color: #fff;
	border-radius: 3px;
	font-weight: bold;
}


/* ul.tabs.center.gradeSeasons {
	overflow: hidden;
}

ul.tabs.center.gradeSeasons li a {
	background: #A83333;
	float: left;
	border-right: 1px solid #fff;
	border-left: 1px solid #fff;
	padding: 5px 8px;
	margin: 0px 5px;
	font-size: 14px;
	border-radius: 4px;
} */




div.errorMessage {
	color: #c22;
	font-size: 14px;
	margin-left: 155px;
	margin-top: 2px;
}

li.notice.success {
	background: #8AE68A;
	border: 1px solid #187718;
	padding: 8px 10px;
	font-size: 15px;
	color: #187718;
	border-radius: 3px;
}

li.notice.error {
	background: #E68A8A;
	border: 1px solid #771818;
	padding: 8px 10px;
	font-size: 15px;
	color: #771818;
	border-radius: 3px;
}


ul.button-bar li.last a {
	float: right;
}