@font-face {
    font-family: 'mathletebulky';
    src: url('fonts/Mathlete-Bulky-webfont.eot');
    src: url('fonts/Mathlete-Bulky-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Mathlete-Bulky-webfont.woff') format('woff'),
         url('fonts/Mathlete-Bulky-webfont.ttf') format('truetype'),
         url('fonts/Mathlete-Bulky-webfont.svg#mathletebulky') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'josefin_slabbold';
    src: url('fonts/josefinslab-bold-webfont.eot');
    src: url('fonts/josefinslab-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/josefinslab-bold-webfont.woff') format('woff'),
         url('fonts/josefinslab-bold-webfont.ttf') format('truetype'),
         url('fonts/josefinslab-bold-webfont.svg#josefin_slabbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'josefin_slablight';
    src: url('fonts/josefinslab-light-webfont.eot');
    src: url('fonts/josefinslab-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/josefinslab-light-webfont.woff') format('woff'),
         url('fonts/josefinslab-light-webfont.ttf') format('truetype'),
         url('fonts/josefinslab-light-webfont.svg#josefin_slablight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'josefin_slabregular';
    src: url('fonts/josefinslab-regular-webfont.eot');
    src: url('fonts/josefinslab-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/josefinslab-regular-webfont.woff') format('woff'),
         url('fonts/josefinslab-regular-webfont.ttf') format('truetype'),
         url('fonts/josefinslab-regular-webfont.svg#josefin_slabregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

body {
	background:#fff; 
	font-family:Tahoma, Geneva, sans-serif;
	}


/* ---------------------------------------------------------------------------------
FONTS, GENERAL, MISC
------------------------------------------------------------------------------------ */

h1, h2, h3 { font-weight:normal; }

h1 { color:#255fb1; font-size:2.2em; line-height:1.8em; }
	
h2, h2 a {
	font-family:josefin_slabbold;
	color:#000;
	font-size: 2.8em;
	line-height:1.0em;
	margin-bottom:20px;
	margin-top:25px;
	text-transform:uppercase;
	}

h2.welcome { text-align:center;font-size:1.6em; line-height:1.1em; margin:0;  }
	
h2 span.slogan {
	font-family:josefin_slablight;
	font-size:0.8em;
	display:block;
	color:#0f6bc7;
	}

h3, h3 a, p.title {
    font-family:josefin_slabregular;
	color: #0f6bc7;
    font-size: 2em;
    line-height: 1.4em;
	margin-top:25px;
    margin-bottom: 5px;
}

h4, h4 a {
	font-family:mathletebulky;
	text-transform:uppercase;
	color:#000;
	font-size:1.8em;
	line-height:1.4em;
	margin-top:35px;
	}
	
hr {
	height:6px;
	border:0;
	background:#f9f9f9;
	margin:30px 0;
	clear:both;
	}

p, li {
	font-size:1em;
	line-height:1.6em;
	color:#444;
	font-family:Tahoma, Geneva, sans-serif;
	}

a { color: #0f6bc7; text-decoration: none; }
a:hover { color: #000; text-decoration: none; }
.main-content a { border-bottom:1px dashed #e7e7e7; }
.main-content a:hover { border-bottom:0px dashed #77660e; }

.main-content .btn-primary { border-bottom:0; }
.main-content li, .main-content ol { padding:6px 0; margin-left:20px; }


/* ---------------------------------------------------------------------------------
HEADER
------------------------------------------------------------------------------------ */

/* Top MCPS Button ---------------------------- */

.btn-default { color:#999; font-size:10px; background:transparent; background-image: none; background-repeat: no-repeat; border:0; text-shadow:none; box-shadow:none; margin-top:3px; }
a:hover.btn-default { color:#999; background:transparent; }

/* END - Top MCPS Button ---------------------------- */

.site-header { position:relative; background: url('../images/hdr-bg.jpg') right center no-repeat; padding-top:10px; }
.masthead { background:#fff; }
	
.masthead h1 {
    background: url('../images/logo.png') no-repeat;
    display: block;
    height:136px;
    text-indent: -9999px;
    width:479px;
	margin:10px 2%;
}

address {
	width:80%;
	text-align:center;
	color:#000;
	background:#f9f77e;
	margin:0 auto;
	padding:5px 0;
	-moz-border-radius: 10px 10px 0 0;
	-webkit-border-radius: 10px 10px 0 0;
	border-radius: 10px 10px 0 0; /* future proofing */
	-khtml-border-radius: 10px 10px 0 0; /* for old Konqueror browsers */
}


/* ---------------------------------------------------------------------------------
NAVIGATION
------------------------------------------------------------------------------------ */

.navbar { background:transparent; border:0; }

.navbar .container {
	font-family:Tahoma, Geneva, sans-serif;
	-moz-box-shadow:    none;
	-webkit-box-shadow: none;
	box-shadow:         none;
	border:0;
	background:#000 url(../images/nav-star.png) left bottom repeat-x;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px; /* future proofing */
	-khtml-border-radius: 10px; /* for old Konqueror browsers */
}

.navbar-default .navbar-nav > li > a {
	font-family:josefin_slabbold;
	color:#f9f77e;
	text-transform:uppercase;
	font-size:1.1em;
	padding:18px 18px;
	}

.navbar-default .navbar-nav > li > a:hover { color:#fff; }
.nav-wrapper { background:transparent; }


/* ---------------------------------------------------------------------------------
CONTENT
------------------------------------------------------------------------------------ */

#content { padding:0; padding-bottom:40px; background:#fff; }
#content .container { padding:10px 0; }
#content .container .row { margin:0; }
.main-content .content-inner { padding:0 3%;}
.main-content .content-inner img { padding:5px; background:#ccc; border:0px solid #ccc; margin:10px; }


/* ---------------------------------------------------------------------------------
SIDEBAR LEFT
------------------------------------------------------------------------------------ */

#sb-menu1 { margin-bottom:60px; }
#sb-menu2 { padding-bottom:20px; display:none; }

a.btn-map {
	font-size:0.8em;
	color:#fff;
	background:#77660e;
	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 {
	padding:0 5%;
	text-align:center;
	margin-bottom:24px;	
	background:#fff;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px; /* future proofing */
	-khtml-border-radius: 10px; /* for old Konqueror browsers */	
	}
.school-info-box h4 {
    background: #f9f9f9 none repeat scroll 0 0;
    border-bottom: 1px dashed #e7e7e7;
    border-top: 1px dashed #e7e7e7;
    color: #000;
    font-size: 2em;
    line-height: 0.9em;
    margin-top: 0;
    padding: 0.4em 0;
}
.school-info-box p { font-size:1.0em; line-height:1.7em; margin-bottom:8px; color:#444; }
.school-info-box .btn-primary { color:#77660e; 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; margin:0; }	
nav.list-group ul ul { padding:0px 0; }
nav.list-group ul { padding:0; }
.secondary-menu ul {  padding:0; margin:0 2%; }
.homepage #sb-menu1 {
    border-top: 6px solid #f9f9f9;
    padding-top: 24px;
}
nav.list-group ul li a { font-size:0.9em; color:#000; text-align:center; display:block; padding:0.8em 0; border-bottom: 1px dashed #e7e7e7; line-height:1.4em; }		
nav.list-group ul li a:hover { color:#333; text-decoration:none; background:#f9f77e; }		


/* ---------------------------------------------------------------------------------
NEWS
------------------------------------------------------------------------------------ */

.RecentNewsSchoolBlock .news, #announcements { margin: 20px 0; padding-top:15px; }
.RecentNewsSchoolBlock .news h2, #announcements h2 { padding: 15px 0; margin:0; margin-top:30px; border-top:3px dashed #000; }	
article.list-group { margin-bottom:50px; }
.main-content a.list-group-item { border-bottom: 1px dashed #e7e7e7; }
.list-group-item { border:0; padding:15px 0; 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.4em; line-height:1.2em; margin-bottom: 0; margin-top: 0; }
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 { 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; }
.searchtext,
.searchbtn {
    background-color: #FFFFFF;
    border: 1px solid #E6E2D0;
    border-radius: 4px 4px 4px 4px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
    color: #555555;
    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%; }

.searchbtn {
	font-family:josefin_slabbold;
	width: 34%;
	margin-left:4%;
	color:#fff;
	border:0px solid #0f6bc7;
	background-color:#0f6bc7;
	border-radius: 4px 4px 4px 4px;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#0000',endColorstr='#000',GradientType=0);
}

.search { float: none; margin: 0; padding: 0; width: 100%; }
.search p.bluelink { float: right; margin: 0; padding: 0; width: 30%; }

.three-column .search { float: none; margin: 0; padding: 0; width: 100%; margin-bottom:24px; }
.three-column .search p.bluelink { float: none; margin: 0; padding: 0; width: 100%; }

.one-column .search { width:25%; }


/*-----------------------------------------------------------------------------------------
SLIDESHOW
------------------------------------------------------------------------------------------- */

.slideshow { position:relative; text-align:center; height:310px; }
.slideshow p { margin:0; }
p.slideshow-btn { left: 60px; position: absolute; top: 230px; }

.pika-stage, .pika-textnav { width: 100% !important; }
.content-inner iframe { border:5px solid #ccc; }
	
.clip img { border:0 !important; width:100%; margin: 0 !important; padding: 1px !important; }
	
/* ---------------------------------------------------------------------------------
CALENDAR
------------------------------------------------------------------------------------ */

.UpcomingEventsSchoolBlock .calendar { text-align:center; padding:1.5em 5% 2.5em 5%; background:#f9f77e; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; /* future proofing */-khtml-border-radius: 10px; /* for old Konqueror browsers */ }
.UpcomingEventsSchoolBlock .calendar h4, .school-info-box h4, .languages h4, .sidebar-1 h2, .sbr-2 h4 { color:#000; font-size:2.0em; border-top:1px dashed #e7e7e7; border-bottom:1px dashed #e7e7e7; line-height:0.9em; padding:0.4em 0; margin-top:0; background:#f9f9f9;  }
.sbr-2 h4 { margin-top:30px;  }
.UpcomingEventsSchoolBlock .calendar p { font-size: 1.1em; color:#444; padding:10px 0; margin:0 5%; line-height:1.2em; text-align:center; border-bottom:0px dashed #ccc; }
.UpcomingEventsSchoolBlock .calendar p strong { font-size: 0.85em; font-family:josefin_slabregular; color: #0f6bc7; text-transform: uppercase; }
.btn-calendar { margin-top:-20px; text-align:center; }
.UpcomingEventsSchoolBlock .calendar p a { color:#000; text-decoration:underline; }
.UpcomingEventsSchoolBlock .calendar p a:hover { color:#666; text-decoration:none; }

.sidebar-2 h3 { font-size:1.3em; text-align:left; }
.sbr-2 ul, .sbr-2 li { margin:0; padding:0; list-style:none; }
.sbr-2 ul { margin-left:0; }
.sbr-2 li, .languages li {
    border-bottom: 0 dashed #e7e7e7;
    font-size: 0.85em;
    list-style: disc outside none;
    margin-left: 20px;
    padding:2px 5px;
    text-align: left;
}



/* --------------------------
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:#000; padding:15px 5%; }
.alternaterow { background-color: #eef1f6; }
#employee { padding:15px 5% !important; }
#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:#fff; }
.footer-inner .container { position:relative; background:url(../images/ftr-bg.png) top center no-repeat; padding-top:65px; }
.mcps-info, .credits, .tron-login { margin: 0; padding: 12px 0; }
.tron-login a { color:#ffd531;}
.credits { text-align:center; font-size:0.8em; line-height:1.5em; color:#000; border-bottom:1px dashed #999; }
.credits a { color:#000; text-decoration:underline; }
.credits a:hover { color:#ccc; 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:#000; }
.footer ul, .footer li { list-style:none; margin:0; padding:0; }
.footer li a { font-size:0.8em; color:#666; display:block; padding:0px 10px; text-decoration:underline; }
.footer li a:hover { color:#ccc; 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:josefin_slabbold;
	font-size:0.9em;
	line-height:1.2em;
	color:#fff;
	background:#0f6bc7;
    border:0;
	text-transform:uppercase;
	padding:12px 20px;
	-webkit-border-radius: 3px; 
	-moz-border-radius: 3px; 
	border-radius: 3px; 
}


a.btn-primary:hover,
.searchbtn:hover {
    color:#fff !important;
	background-image: none;
	background:#000;
	border-color:#000;
	text-shadow:none;
}

html.embed { background:transparent; }

.hp-subcontent h3 {
    font-family: josefin_slabbold;
	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 ul {
	padding:0;
	margin:0;
	list-style:none;
	text-align:center;
	}	


.breadcrumbs { font-size:10px; color:#999; }
.breadcrumbs a { text-decoration:none; border:0; }


/* ---------------------------------------------------------------------------------
RESPONSIVE
------------------------------------------------------------------------------------ */



/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-width : 240px) 
and (max-width : 768px) {
/* Styles */

html, body { background:#fff; }
h2, h2 a, h2.welcome { font-size: 1.8em; line-height: 1.3em; }
h3, h3 a { font-size: 1.5em; line-height: 1.4em; }
p, li { font-size: 1.0em; line-height:1.5em; }
ul, ol, ul.latest-news { margin:10px; padding:0; }
.site-header { margin:0; padding:0; }
.navbar-collapse { max-height:none; }	
.navbar-toggle { display: block; float: none; margin: 10px auto; }

.masthead h1 {
    background:url(../images/logo-290.png) top center no-repeat;
    display: block;
    height: 90px;
    margin: 22px auto 12px auto;
    position: static;
    text-indent: -9999px;
    width: 290px;
}

.masthead {height:auto; }
#banner { display:none; }
address { display:none; }
.site-header { background:transparent;}

#content { padding: 0; background:transparent; }
#content .container { background:transparent; padding-top:0px; }

h2.hp-title { display:none; }
.RecentNewsSchoolBlock .news, #announcements { margin: 0; padding-top: 0; }
.RecentNewsSchoolBlock .news h2, #announcements h2 { font-size: 1.5em; padding: 20px 0 0; text-align: center; }
.RecentNewsSchoolBlock .news h3 { background: transparent; font-size: 2em; padding: 10px 0; }

.sidebar-1, .school-info-box { border:0px solid #e6e2d0; background:#f3f3f3; padding:24px 1%; }
.school-info-box hr { background:#DFD8B7; }
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; background: #000; }
.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; }
.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; }

.main-content { background:transparent; }
.main-content .content-inner { padding: 0 1%; }	
.sidebar-2 { background:transparent; padding:24px 5%; }	
.list-group-item { border-bottom: 1px dotted #ccc; }

#departmentList p { line-height: 1.8em; }

.school-info-box p, .UpcomingEventsSchoolBlock .calendar p { font-size:120%; }
.mcps-logo { background-position:center top; }
.ftr-image { background:transparent; }
.search { float: none; margin: 0; padding: 0; width: 100%; }
.search p.bluelink { float: none; margin: 0; padding: 0; width: 100%; }

.btn-primary { font-size: 0.8em;  padding: 12px 10px; }


}


/* 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; }

}
	