@font-face {
    font-family: 'ChunkFive';
    src: url('fonts/chunkfive/chunkfive-webfont.eot');
    src: url('fonts/chunkfive/chunkfive-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/chunkfive/chunkfive-webfont.woff') format('woff'),
         url('fonts/chunkfive/chunkfive-webfont.ttf') format('truetype'),
         url('fonts/chunkfive/chunkfive-webfont.svg#chunkfiveroman') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'folks_light';
    src: url('fonts/folks_light_macroman/Folks-Light-webfont.eot');
    src: url('fonts/folks_light_macroman/Folks-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/folks_light_macroman/Folks-Light-webfont.woff') format('woff'),
         url('fonts/folks_light_macroman/Folks-Light-webfont.ttf') format('truetype'),
         url('fonts/folks_light_macroman/Folks-Light-webfont.svg#chunkfiveroman') format('svg');
    font-weight: normal;
    font-style: normal;

}


body {
	background:#f7f7f7; 
	font-family:Tahoma, Geneva, sans-serif;
	}
	


/* ---------------------------------------------------------------------------------
FONTS, GENERAL, MISC
------------------------------------------------------------------------------------ */

h1, h2, h3 { font-weight:normal; }

h1 { 
	color:#7523e8; 
	font-size:2.2em; 
	line-height:1.8em; 
	text-transform:uppercase; 
	display:block;
	width:515px;
	height:98px;
	background:url("../images/logo.png") center center no-repeat;
	text-indent:-9999px;
	}
	
h2, h2 a {
	font-family:folks_light;
	color:#b330be;
	font-size: 42px;
	line-height:48px;
	margin-bottom:15px;
	margin-top:0;
	}
a,p,li,h3{
	-webkit-transition: color ease-in 0.1s; /* For Safari 3.1 to 6.0 */
	transition: color ease-in 0.1s;
	}

h2.welcome { text-align:center;font-size:2.8em; line-height:1.1em; margin-top:0;}
.welcome{margin-bottom:0px;}
	
h2 span.slogan {
	font-family:folks_light;
	font-size:17px;
	display:block;
	color:#b330be;
	margin-top:5px;
	}

h3, h3 a, p.title {
    font-family:folks_light;
	color: #51a6e8;
    font-size: 28px;
    line-height:36px;
    margin-bottom: 10px;
}

h4, h4 a {
	font-family:folks_light;
	text-transform:uppercase;
	color:#666;
	font-size:20px;
	line-height:26px;
	margin-top:15px;
	}
	
hr {
	height:6px;
	border:0;
	background:#f3f3f3;
	margin:30px 0;
	clear:both;
	}

p, li {
	font-size:1em;
	line-height:1.6em;
	color:#6b6f71;
	font-family:Tahoma, Geneva, sans-serif;
	}

a { color: #7523e8;}
a:hover { text-decoration: none; }
.main-content a { border-bottom:1px dashed #e7e7e7; }
.main-content a:hover { border-bottom:0px dashed #5553e8; }

.main-content .btn-primary { border-bottom:0; }
.main-content li, .main-content ol { padding:6px 0; }


ol { margin-left:20px; }


/* ---------------------------------------------------------------------------------
HEADER
------------------------------------------------------------------------------------ */

/* Top MCPS Button ---------------------------- */

.btn-default { color:#f9f77e; font-size:10px; background:transparent; background-image: none; background-repeat: no-repeat; border:0; text-shadow:none; box-shadow:none; margin-top:3px; 
-webkit-transition: background-color ease-in-out .2s; /* For Safari 3.1 to 6.0 */
    transition: background-color ease-in-out .2s;
}
a:hover.btn-default { color:white; background:transparent; }

/* END - Top MCPS Button ---------------------------- */

.site-header { position:relative; background: url('../images/header.png') 60% top no-repeat; height:159px;}
.masthead { background: url('../images/headerbg.png') repeat-x; background-position: center; height:159px; margin-bottom:0px;}
#ctl00_hpyLogo{ position:relative; top:10px; }
address { display:none; }


/* ---------------------------------------------------------------------------------
NAVIGATION
------------------------------------------------------------------------------------ */

.navbar { 
	min-height:auto;
	background:#5553e8;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	border-radius: 0px;
	-khtml-border-radius: 0px; /* for old Konqueror browsers */ 
}

.navbar .container {
	font-family:folks_light;
	background:#006caf;
}

.navbar-default .navbar-nav > li > a {
	font-family:folks_light;
	color:white;
	text-transform:uppercase;
	font-size:1.3em;
	padding:10px 16px;
	}
	
.navbar-default li{
	background:url(../images/nav-star.png) no-repeat;
	background-position:0px 4px;
	padding-left:10px;
	}
	
.navbar-default li:first-child { background:none; }
.navbar-default .navbar-nav > li > a:hover { color: #f9f77e; }
.navbar-default .navbar-nav > li > a:active { color: f9f77e; }
.nav-wrapper { background:#5553e8; }


/* ---------------------------------------------------------------------------------
CONTENT
------------------------------------------------------------------------------------ */

#content { padding-top:30px; }
.container { padding:0px 0; }
#content .container .row { margin:0; }
.main-content .content-inner { padding:0 3%;}
.main-content .content-inner img { padding:3px; background:#fff; border:none; border-radius: 20px 0px 20px 0px; box-shadow:0px 0px 3px #ccc;}
#departmentList p { margin:0 !important; }


/* ---------------------------------------------------------------------------------
SIDEBAR LEFT
------------------------------------------------------------------------------------ */

#sb-menu1 { margin-bottom:20px; }
#sb-menu2 { padding-bottom:20px;  }

a.btn-map {
	font-size:0.8em;
	color:#fff;
	background:#5553e8;
	padding:6px 10px;
	text-decoration:none;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px; /* future proofing */
	-khtml-border-radius: 6px; /* for old Konqueror browsers */
	}

a:hover.btn-map { color:#999; background:#fff; }
	
.school-info-box {
	text-align:center;
	background:#fff;
	padding:5px 10px 10px 10px;
	margin-bottom:48px;	
	box-shadow: 0 0 1px 1px #e7e7e7;
	-moz-box-shadow: 0 0 1px 1px #e7e7e7; 
	-webkit-box-shadow: 0 0 1px 1px #e7e7e7; 
	-khtml-box-shadow: 0 0 1px 1px #e7e7e7;
	 -moz-border-radius: 0px 20px 0px 20px;
	 -webkit-border-radius: 0px 20px 0px 20px;
	 border-radius: 0px 20px 0px 20px; /* future proofing */
	 -khtml-border-radius: 0px 20px 0px 20px; /* for old Konqueror browsers */
	}

.school-info-box h4 {color:#b330be; font-size:18px; line-height:0.9em; padding-bottom:0px; padding-top:15px; margin-top:0px; }

.school-info-box a{color:#4d4bae;}
.school-info-box a:hover{color:#c06dc7;}
.school-info-box p { font-size:1.0em; line-height:1.7em; margin-bottom:8px; color:#494545; }
.school-info-box .btn-primary { color:#5553e8; background:#f2e3b6; }	
.school-info-box hr { margin:10px 0; background:#fcfcfa; }


/* ---------------------------------------------------------------------------------
SIDEBAR NAVIGATION
------------------------------------------------------------------------------------ */

.list-group { border-radius: 0; box-shadow: none; margin-bottom:40px; }	
nav.list-group ul, 
nav.list-group ul li { list-style:none; padding:0; color:#4d4bae; }	
nav.list-group ul ul { padding:0; }
nav.list-group ul { padding:0; }
.secondary-menu ul {  padding:0; margin:0; }
#sb-menu1 { border-right:0px solid #f9f77e; }
nav.list-group ul li a { font-size:0.9em; color:#4d4bae; text-align:left; display:block;padding:8px 2%; border-bottom: 1px dashed #ccc; line-height:1.4em; }		
nav.list-group ul li a, .languages ul li{
	-webkit-transition: background ease-in 0.1s; /* For Safari 3.1 to 6.0 */
    transition: background ease-in 0.1s;
	}
nav.list-group ul li a:hover, .languages ul li:hover { color:white; text-decoration:none; background:#4d4bae;}	
.languages ul li a{display:block; text-decoration:underline;}
.languages li:hover a{color:#fff;}	


/* ---------------------------------------------------------------------------------
NEWS
------------------------------------------------------------------------------------ */

.RecentNewsSchoolBlock .news, #announcements { margin: 20px 0; padding-top:15px; }
.RecentNewsSchoolBlock .news h2, #announcements h2 { padding: 15px 0 10px 0; margin:0; margin-top:10px; margin-bottom:20px; border-bottom:2px dashed #b330be; }	
article.list-group { margin-bottom:50px; }
.main-content a.list-group-item { border-bottom: 1px dashed #e7e7e7; }
.list-group-item { border:0; padding:15px 1%; border-bottom: 1px dotted #ccc; background-color:transparent; margin-bottom:0; }
.list-group-item p { font-size:0.9em; line-height:1.6em; }
a.list-group-item h3 { font-size: 2.2em; line-height:1.2em; margin-bottom: 0; margin-top: 0; color: #9758ef;}
a.list-group-item:hover h3 { color:#999; }
a.list-group-item:hover { background:transparent; border-bottom-color:#ccc; }
a.list-group-item:hover p { color:#ccc; }
.list-group-item:first-child,
.list-group-item:last-child {
  /* Safari 3-4, iOS 1-3.2, Android 1.6- */
  -webkit-border-radius: 0px; 
  /* Firefox 1-3.6 */
  -moz-border-radius: 0px; 
  /* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
  border-radius: 0px; 
}


/* ---------------------------------------------------------------------------------
SIDEBAR BLOCK
------------------------------------------------------------------------------------ */

.search, #sb-menu3, .sb-block, .sbr-2 { padding:24px 0; }
aside.sb-block, .sbr-2, .sbr-1 { text-align:center; } 
#sb-menu3 { display:none; }	
.sbr-1 { padding:20px 0; }
aside.sb-block { display:none; }
.sidebar-1 h2 { color:#000; font-size:2.6em; text-align:center; font-family:mathletebulky; margin-bottom:0; }


/* ---------------------------------------------------------------------------------
SEARCH
------------------------------------------------------------------------------------ */

.search { overflow:auto; margin-bottom:10px;}
.searchtext,
.searchbtn {
    background-color: #FFFFFF;
    color: #ffee4e;
    display: block;
    font-size: 14px;
    height: 34px;
    line-height: 1.42857;
    padding: 6px 12px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    vertical-align: middle;
	float:left;
}

.searchtext { width: 60%; color:#6b6f71; 
	 border: 1px solid #E6E2D0;
    border-radius: 4px 4px 4px 4px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
	}

.searchbtn {
	font-family:Verdana, Geneva, sans-serif;
	font-weight:bold;
	font-size:12px;
	width: 34%;
	margin-left:4%;
	color:#ffffff;
	box-shadow:0px 2px 5px 0px #ececec;
	background-color:#5553e8;
	border-radius: 5px;
	border:none;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#0000',endColorstr='#000',GradientType=0);
}

.search { float: right; margin: 0; padding: 0; width: 30%; }
.three-column .search { float: none; margin: 0; padding: 0; padding-bottom:12px; width: 100%; margin-bottom:12px; }
.one-column .search { width:25%; }


/*-----------------------------------------------------------------------------------------
SLIDESHOW
------------------------------------------------------------------------------------------- */

.slideshow { position:relative; text-align:center; }
.slideshow img{ border-top:5px solid #fff; border-bottom:5px solid #fff; padding:0; width:100%; margin:0 !important; }
.slideshow p { margin:0; }
.pika-stage, .pika-textnav { width: 100% !important; }
.content-inner iframe { border:5px solid #ccc; }
.slideshow-btn{position:relative; bottom:30px;}
	
	
/* ---------------------------------------------------------------------------------
CALENDAR
------------------------------------------------------------------------------------ */

.UpcomingEventsSchoolBlock .calendar {
	padding: 10px; 
	padding-top: 30px; 
	padding-bottom: 30px; 
	text-align:center; 
	background: white 5px no-repeat; 
	box-shadow: 0 0 1px 1px #e7e7e7; 
	-moz-box-shadow: 0 0 1px 1px #e7e7e7; 
	-webkit-box-shadow: 0 0 1px 1px #e7e7e7; 
	-khtml-box-shadow: 0 0 1px 1px #e7e7e7; 
	-moz-border-radius: 0px 20px 0px 20px; 
	-webkit-border-radius: 0px 20px 0px 20px; 
	border-radius: 0px 20px 0px 20px; /* future proofing */
	-khtml-border-radius: 0px 20px 0px 20px; /* for old Konqueror browsers */ 
	}
	
.UpcomingEventsSchoolBlock .calendar h4, .languages h4, .sidebar-1 h2 { color:#b330be; font-size:20px; line-height:0.9em; padding-bottom:5px; padding-top:0px; margin-top:0px;}


.UpcomingEventsSchoolBlock .calendar a { color:#4d4bae; font-family: Verdana, Geneva, sans-serif; font-size: 12px; padding:10px 0; margin:10px; text-align:center;  }
.UpcomingEventsSchoolBlock .calendar a:hover { color:#c06dc7;}
.UpcomingEventsSchoolBlock .calendar p{ padding-bottom:5px; padding-top:1px; line-height:1.3em; }

.UpcomingEventsSchoolBlock .calendar p strong {
    color: #666;
    font-size: 11px;
    font-weight: normal;
    text-align: center;
    text-transform: uppercase;
}

.btn-calendar { margin-top:-20px; text-align:center;  }


/* --------------------------
CALENDAR - TOP LIST
------------------------------ */

ul#taxonomylist { margin:0; padding:0; list-style:none; }
ul#taxonomylist li {
    background: none repeat scroll 0 0 #F6F3E5;
    display: inline-block;
	*zoom: 1;
    *display: inline;
    margin: 0.25%;
    padding: 6px 0.25%;
    text-align: center;
    width: 18%;
}


/* ---------------------------------------------------------------------------------
STAFF DIRECTORY
------------------------------------------------------------------------------------ */

#box_left h3, #box_right h3 { color:#fff; background:#5553e8; padding:15px 5%; }
.alternaterow { background-color: #eef1f6; }
#employee { padding:15px 5%; }
#departmentList { padding: 10px 0; border-bottom:1px dotted #eef1f6; }
#departmentList p { line-height: 1.4em; margin: 0; }
#departmentList p a:hover { text-decoration:none; }	


/* ---------------------------------------------------------------------------------
FOOTER
------------------------------------------------------------------------------------ */

.footer { 
	background:#5553e8; 
	border-top:3px #f8eb7c solid; 
	outline:solid;
	outline-color:#b487f4;}
.footer-inner .container { position:relative; padding-top:65px; }
#content{
	margin-bottom:0px;

	}
#content::after{ content:url(../images/ftrimg.png); position:relative; top:80px; left:60%;}
.mcps-info, .credits, .tron-login { margin: 0; padding: 12px 0; }
.tron-login a { color:#fff;}
.credits { text-align:center; font-size:0.8em; line-height:1.5em; color:#fff; border-bottom:1px dashed #ecf7fc; }
.credits a { color:#ffee4e; text-decoration:none; }
.credits a:hover { color:#c06dc7; text-decoration:none; }
.mcps-logo { background:url(../images/ftr-mcps-logo.png) 5% top no-repeat; padding-top:75px; }
.mcps-logo p { font-size:0.8em; line-height:1.5em; color:#fff; }
.footer ul, .footer li { list-style:none; margin:0; padding:0; }
.footer li a { font-size:0.8em; color:#ffee4e; display:block; padding:0px 10px; text-decoration:none; }
.footer li a:hover { color:#c06dc7; text-decoration:none; }
ul#global-footerNav { width:50%; float:right; }	

.tron-login { border-bottom:0px; text-align:center }	
.tron-login a { opacity:0.4; }	
.tron-login a:hover { opacity:1; }	


/* Misc -------------------------------------------------------- */

.btn-primary {
	font-family:Tahoma, Geneva, sans-serif;
	font-size:0.9em;
	line-height:1.2em;
	color:white;
	background:#5553e8;
    border:0;
	padding:12px 20px;
	-webkit-border-radius: 5px; 
	-moz-border-radius: 5px; 
	border-radius: 5px; 
	font-weight:bold;
	-webkit-transition: background ease-in 0.1s; /* For Safari 3.1 to 6.0 */
    transition: background ease-in 0.1s;
}
.searchbtn{
	-webkit-transition: background ease-in 0.2s; /* For Safari 3.1 to 6.0 */
    transition: background ease-in 0.2s;
	}

a.btn-primary:hover,
.searchbtn:hover {
    color:#5553e8 !important;
	background-image: none;
	background:#f9f77e;
	border-color:none;
	text-shadow:none;
}

a.btn-primary:active,
.searchbtn:active {
	background:#8c8aed;
	color:white;
}

html.embed { background:transparent; }

.hp-subcontent h3 {
    font-family:Verdana, Geneva, sans-serif;
	color:#000;
    font-size: 1.4em;
    line-height: 1.3em;
    text-align: center;
    text-transform: uppercase;
}

.hp-subcontent p { text-align:center; }
.hp-subcontent .img-responsive { margin:0 auto; }

.languages h4, .secondary-menu h2{
	border-bottom: 1px dashed #b330be;
    font-family: folks_light;
    text-align: left;
	font-size:18px !important;
	text-transform:uppercase;
	}
.btn-calendar hr{display:none;}

.languages{margin-top:30px;}

.languages ul {
	padding:0;
	margin:0;
	list-style:none;
	text-align:center;
	}	

.languages ul li {
    border-bottom: 1px dashed #f4da6c;
    color:#4d4bae;
    line-height: 1.4em;
    padding: 0.8em 5%;
    text-align: center;
}

ul.latest-news {
	padding:0 15px;
	margin:0;
	margin-bottom:20px;
	}

ul.latest-news li {
	padding:0.6em 0;
	}


/* ---------------------------------------------------------------------------------
RESPONSIVE
------------------------------------------------------------------------------------ */



/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-width : 240px) 
and (max-width : 768px) {
/* Styles */

html, body { background:#fff; }

p, li { font-size: 1.2em; line-height:1.6em; }
h2, h2 a { font-size: 30px; line-height: 36px; margin-top: 20px; }
#intro h2 { font-size:26px; line-height:30px; }
h3, h3 a { font-size: 1.5em; line-height: 1.4em; }

.navbar-collapse { max-height:none; }	
.navbar-toggle { display: block; float: none; margin: 10px auto; }
.site-header { height:95px; }
.masthead h1 {
    background:url(../images/logo-290.png) no-repeat;
    display: block;
    height: 55px;
    margin: 12px auto;
    position: static;
    text-indent: -9999px;
    width:290px;
}

.masthead {height:auto; }
#banner { display:none; }
address { display:none; }
.site-header { background:transparent;}

#content { padding-top: 10px; background:transparent; }
#content .container { background:transparent;  }
.container{padding-top:0px;}

h2.hp-title { display:none; }

.RecentNewsSchoolBlock .news h2, #announcements h2 {
    border-top: 1px dashed #77660E;
    font-size: 1.5em;
    margin: 0;
    padding: 60px 0 0;
    text-align: center;
}


.sidebar-1, .school-info-box {
	border:0px solid #e6e2d0;
	background:#f3f3f3;
	padding:24px 1%;
	}

.sidebar-1 aside, 
.sidebar-1 nav,
.sidebar-2 aside,
.sidebar-2 div.search { margin:10px auto; width:96%; }
nav.list-group ul li a { font-size:12px; }
.school-info-box hr { background:#DFD8B7; }

#ctl00_ContentPlaceHolder1_tronSlideShowHomepage1_pnlSlideHome img { width:100% !important; }

li.secondary-menu h2, .UpcomingEventsSchoolBlock .calendar h4, .school-info-box h2 { background:#f9f77e; padding:15px 1%; text-align:center; }

#sb-menu2 { border-bottom:0px solid #E6E2D0; }
.navbar { -moz-box-shadow:0; -webkit-box-shadow:0; box-shadow:0; }
.navbar .container, .nav-wrapper { background:transparent; }
.container > .navbar-header, .container > .navbar-collapse { margin-left: 0; margin-right: 0; padding:0; }
#sb-menu1 { border-right:0px solid #f9f77e; }
.navbar-default .navbar-nav > li { margin:0; padding:0; }
.navbar-default .navbar-nav > li > a { color:#fff; border-top:1px dashed #014421; padding:0.5em 0; width:100%; margin:0; }
.navbar-default .navbar-nav > li > a:last-child { border-bottom:0;}
.navbar-default .navbar-nav > li > a:hover { color:#000; background:#f9f77e; border-top:1px dashed #014421; padding:0.5em 0; margin:0;  }
.nav-wrapper { margin-bottom:0; }
.nav li { display: block; }
nav.list-group ul li a { text-align: center; border-bottom:1px dotted #ccc; }

#content-lower1, #content-lower2 { background-image:none; padding:24px 0; }
#content-lower1 h2, #content-lower2 h2 { background:transparent; text-indent:0; width:100%; height:auto; text-align:center; }
#content-lower2 h2 { color:#fff; text-align:center; }
#content-lower2 h2 span { display:block; }
#content-lower1 .col-md-3 { text-align:center; padding-bottom:24px; }
#content-lower1 p.summary { font-size: 1.2em; }
 
.main-content { background:transparent; padding-bottom:20px; }
.main-content .content-inner { padding: 0 1%; }	
.sidebar-2 { background:transparent; padding:20px 0; }	
.list-group-item { border-bottom: 1px dotted #ccc; }

#box_left, #box_right { float:none !important; width:100% !important; }
#departmentList p { line-height: 1.8em; color:#ccc; }
#departmentList p a { font-size:11px; line-height:16px; display:inline-block; }
a.btn-print { display:block; border:0; }
.btn-print img { float:none; }

.school-info-box p, .UpcomingEventsSchoolBlock .calendar p { font-size:120%; }
.mcps-logo { background-position:center top; }
.ftr-image { background:transparent; }

.RecentNewsSchoolBlock .news h2 { background: transparent; font-size: 1.6em; padding: 10px 0; }

.program { padding:24px 0; }
#content-lower2 img, #content-lower2 h3, .program p { display:block; text-align:center; float:none; }
#content-lower2 img { margin:0 auto; }

.search { width:100%; float:none; }

#content:after { display:none; }

}


/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-width : 769px) 
and (max-width : 1024px) {
/* Styles */	

.container {
    max-width: 100%;
}

.nav li { display: inline-block; }
.navbar-default .navbar-nav > li > a {
	padding-left:6px;
	padding-right:6px;
	}

}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */

}

/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
/* Styles */

.navbar-default .navbar-nav > li > a {
	font-size:11px;
	border:0;
	padding:5px 8px;
	}

.navbar-default .navbar-nav > li > a:hover {
	border:0;
	padding:5px 8px;
	}
	
.navbar-toggle { display:none; }

}