/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* #Site Styles
================================================== */

body {background:#fff; font: 14px/21px 'proximanova', "Helvetica Neue", Arial, sans-serif;font-weight:normal; color:#111;}
h1, h2, h3, h4, h5, h6, p, li, a {font-weight:normal;}
h1 {font-family: 'capita','Times New Roman',serif; color:#333333;margin-bottom:15px; font-size:35px;}
h2, h3, h4, h5, h6 { font-size: 14px; font-family: 'proximanova',"Helvetica Neue", Arial,sans-serif; font-weight:600;}
h5 {margin:20px 0;}

h2.header-name {font-size:14px; font-family: 'proximanova', "Helvetica Neue", Arial, sans-serif; font-weight: bold; padding: 0; margin: 0; display: inline-block;}
.header-small {font-family:'proximanova', "Helvetica Neue", Arial, sans-serif; font-weight: 600; margin: 20px 0; font-size: 18px; line-height: 24px;}
.header-small#index {margin-top: 0;}
.header-large {font-family: 'capita','Times New Roman',serif; color: #333333; margin-bottom: 15px; font-size: 35px; line-height: 40px;}

.ie8 *, .ie7 *, .ie6 * {font-family:Arial, sans-serif;}

.sr-only {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0;}

#masthead {clear:both; background:#E1E9F2 url(../images/bg-gradient.jpg) top center no-repeat; background-size:cover; /* overflow:hidden; */ height:161px; }
	#masthead .container {position: relative; /* z-index:999999; */}
	#masthead h1, #masthead h2, #masthead .logo-header {font-family: 'capita','Times New Roman',serif; font-weight:normal; font-size:34px; color:#333; padding-top:92px;line-height: 1.1em;}
	#masthead h1 span.preheading, #masthead h2 span.preheading, #masthead .logo-header span.preheading {/* font-family:'proximanova',"Helvetica Neue", Arial,sans-serif; */font-size:16px; display:block; line-height:18px; text-transform:uppercase; margin-top:-56px; margin-bottom:0px; font-weight:400;}
	#masthead h1 a, #masthead h2 a, #masthead .logo-header a {text-decoration:none;color:#333;}
	#masthead p.tagline {margin-top:0;}
	div.osu_logo {float:right;}
	div.osu_logo a {display:block; overflow:hidden; width:167px; height:180px; text-indent:-9999px; background:transparent url(../images/osu-web-header-vert2.png) 0 0 no-repeat; }
	div.ourteam {padding:15px 18px 18px 18px; background-color: #E1E9F2; }
	div.ourteam a {text-decoration: none;}
	#masthead div.square {float:right; list-style: none; display: inline-block; line-height: 0px; height:129px; width:129px; margin-left:5px; margin-top: 13px;}
		#masthead div.logo {background-image: url(../images/4sq_logo.jpg); height:136px; width:136px; overflow: hidden;}
			#masthead div.logo a {height:136px; width:136px;text-indent: -99999px;display:block; }
		#masthead div.hardhat {background-image: url(../images/4sq_hardhat.jpg); height:136px; width:136px;}
		#masthead div.headphones {background-image: url(../images/4sq_headphones.jpg); height:136px; width:136px;}
		#masthead div.cleancoal {background-image: url(../images/4sq_cleancoal.jpg); height:136px; width:136px;}

#content {clear:both;}
#main_column ul {list-style-type: disc; margin: 0 1.5em 1.5em;}

#footer {background:#333  url(../images/bg-footer.jpg) center top no-repeat; background-size:cover; color:#fff; padding:30px 0;}
#footer h4, #footer h5, #footer h6 {color:#fff;}
#footer p, #footer a {font-size:13px; color:#fff;}
#footer li {margin-bottom:.25em;}
#footer li a {text-decoration:none; color:#ccc;}
#footer li a:hover {text-decoration:underline; color:#fff;}

/* #Page Styles
================================================== */

#index #content{}

#index .slideshow li {font-family: 'proximanova',"Helvetica Neue", Arial,sans-serif; font-weight:400;}

h5#index {margin-top:0;}

#content p, #content li, #content p a, #content li a {/* font-family:'proximanova',"Helvetica Neue", Arial,sans-serif; */ line-height:21px;}
#content p {margin: 0 0 1.5em 0;}
#content p a:hover {text-decoration: none;}
#content ul, #content ol {margin-bottom: 1.5em;}

#page #content .hero_banner {position: relative; padding-bottom: 56.25%; padding-top: 0; height: 0; overflow: hidden;}
#page #content .hero_banner img,
#page #content .hero_banner iframe,
#page #content .hero_banner object,
#page #content .hero_banner embed {width:100%; height:100%; position:absolute; top:0; left:0;}

#content #main_column {background:#fff;}

#content #sidebar {/* padding:15px 18px 18px 18px; background-color: #E1E9F2;  */}
	#sidebar img {border:8px solid white;margin: 0 0 10px 21px;;box-shadow: 0px 0px 4px #666666;width:120px;}
	#sidebar hr {margin:10px 0 10px 0;width:100%;}
	#sidebar p {margin:0;}

#content h2 {
background:
#333;
color:
#fff;
font-weight: 300;
text-transform: uppercase;
margin: 10px 0;
padding: 3px 6px;
font-size: 22px;
line-height: 30px;
}

#content h3 {
	font-size: 22px;
}

div.quotebox {padding:15px 18px 18px 18px; background: #E1E9F2 url(../images/classroom_color.png) no-repeat 100% bottom; position: relative; height:334px;}
	div.quotebox h2 { background: none !important; color: #111 !important; font-family: 'capita','Times New Roman',serif !important; font-size:18px !important; line-height: 28px !important; text-transform: none !important; margin-top:0px !important; }

div.publicrecords {padding:15px 18px 18px 18px; background: #E1E9F2 url(../images/classroom_color.png) no-repeat 100% bottom; position: relative; min-height:434px; }
	div.generallist {margin-bottom:20px;}
	div.generallist a {font-size: 16px; font-weight:600; color:#004fad; text-decoration: none;}
		div.generallist a:hover {text-decoration: underline;}
	div.indentedlist {margin-bottom:10px;}
		ul div.indentedlist{margin-left:16px; }
			ul div.indentedlist li {list-style-type:square; color:#666666;}
			ul div.indentedlist li a {color:#004fad; font-weight:600; text-decoration: none;}
			ul div.indentedlist li a:hover {text-decoration: underline;}

div.news {padding:15px 18px 18px 18px; background: #E1E9F2;}
	.news .date_author {margin-top:0px; margin-bottom:10px;}



#ethicspoint {padding: 6px; background-color: #E1E9F2;vertical-align: center;overflow: hidden; margin-bottom: 1.5em;display:block;}
	#ethicspoint p {line-height: 15px;margin:4px 0 0 0;}
	#ethicspoint .redbutton {background-color: #bb0000; width:250px; height:40px;color:#ffffff; text-align: center;vertical-align: center;margin-right:20px; float:left;border-radius:6px;}
		#ethicspoint .redbutton p {text-transform: uppercase; font-weight: bold; margin-top:13px;text-decoration: none;}

#contacttable {background: #EFEFEF; padding: 20px; margin-bottom:8px;}
	#contacttable p {margin:0;}

.date_author {color: #999; font-style: italic; font-size: 13px; margin-top: -16px;}
.newsimage {float: right; font-size: 12px; padding: 10px 10px 4px 10px; background-color: #EEEEEE; margin-left: 14px;}


/* Feature slider */
#slideshow {
	-moz-box-shadow: 0 2px 3px #ccc;
	-webkit-box-shadow: 0 2px 3px #ccc;
	box-shadow: 0 2px 3px #ccc;}
ul.featureslider {}

/* News slider */
ul.newsslider {}
li .news_slide {font-family:'proximanova', "Helvetica Neue", Arial,sans-serif; font-size:13px;}


/* Social Media Icons */
a.social_icon img {height:32px; width:32px; margin-right:10px; background:#666; border-radius:4px;}
a:hover.social_icon img {background:#b00;}

/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {
		#masthead div.cleancoal {display:none;}
	}

	/* Tablet Portrait size to standard 960 (devices and browsers) FIRST BREAK POINT*/
	@media only screen and (min-width: 768px) and (max-width: 959px) {
		#masthead {}
		#masthead h1, #masthead h2, #masthead .logo-header {font-size:28px; padding-top:95px;}
		#sidebar img {max-width:90%;}
		div.quotebox, div.publicrecords {background: none;}
		div.ourteam img {display: none;}
	}

	/* All Mobile Sizes (devices and browser) TABLETS & PHONES*/
	@media only screen and (max-width: 767px) {
		#masthead {}
		#masthead h1, #masthead .logo-header {font-size:32px; padding-top:20px;}
		#masthead h2 {font-size:32px; padding-top:75px;}
		#masthead h1 span.preheading, #masthead .logo-header span.preheading {margin-top:0;}
		div.osu_logo {display:none;}
		#sidebar img {display:none;}
		#masthead div.hardhat {display:none;}
		#masthead div.headphones {display:none;}
		#contacttable {padding: 0px;}
		#contacttable h4 {margin-left:20px;margin-top:20px;line-height: 100%; font-size:30px;}
		#contacttable h6 {margin-left:20px; margin-right:20px;}
		#contacttable p {margin-left:20px; margin-right:20px;}
		#masthead {clear:both; background:#E1E9F2 url(../images/bg-gradient.jpg) top center no-repeat; background-size:cover; /* overflow:hidden; */ height:161px; }
		div.quotebox, div.publicrecords {background: none;height:inherit;}
		#sidebar {display:none;}
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) TABLETS */
	@media only screen and (min-width: 480px) and (max-width: 767px) {

	}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) IPHONES */
	@media only screen and (max-width: 479px) {
		#masthead h1, #masthead h2, #masthead .logo-header {font-size:25px;}
		.iosSlider .slider .item .text1, .iosSlider .slider .item .text2 {background:rgba(0,0,0,0.8);}
		.iosSlider .slider .item .text1 span {font: 30px/40px 'proximanova',"Helvetica Neue", Arial,sans-serif;}
		#page #content img {max-width:100%;}
		#page #content #sidebar {padding:0;}
		div.quotebox {display: none;}
		#ethicspoint .redbutton {margin-bottom:6px;margin-right:0px;}
	}

/* #IE fixes
================================================== */

#global_nav { border-top:1px solid rgb(187,0,0)\9;}
#global_nav ul li a:hover {background:rgb(68,68,68)\9;}

#index #content h2 span.more {*margin-top:-30px;}

/* Visually Hidden
================================================== */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/* Clery form specific styles
================================================== */

.required-fields {
	border-radius: .25em;
	border: 1px solid #bb0000;
	font-weight: bold;
	padding: 1em;
}

#incident-report-form h4 {
	border-bottom: 1px solid #ccc;
	color: #bb0000;
}

#extra-incident-information {
	border: 1px solid #ccc;
	border-bottom: 0;
	border-left: 0;
	border-right: 0;
}

#incident-report-form fieldset > h5 {
	margin: 20px 0 10px 0;
}

#incident-report-form label,
#incident-report-form input[type="text"] {
	display: inline;
}

#incident-information-group fieldset fieldset {
	display: inline;
	margin-bottom: 0;
}

#incident-report-form label {
	font-weight: normal;
	font-size: 14px;
}

#io-container > div > label,
#ir-container > div > label {
	display: inline-block;
	width: 45px;
}

#incident-location-group label {
	float: right;
	width: 95%;
	padding-top: 1px;
}

#incident-report-form textarea {
	width: 440px;
}

#incident-respondent-group > fieldset,
#extra-incident-information dl,
#io-time,
#ir-time,
#form-completer-dept,
#form-completer-email,
#form-completer-phone {
	margin-top: 1em;
}

#incident-report-form dl > dt {
	font-weight: bold;
}

#incident-report-form dl > dd {
	margin-bottom: 1em;
}

#extra-incident-information h5 {
	margin: 40px 0 0 0;
}
#extra-incident-information h5:first-child {
	margin-top: 0;
}

#incident-report-form .columns,
#extra-incident-information h5 + p {
	margin: 0;
}

#extra-incident-information h5:last-child,
#io-time,
#ir-time,
#io-date,
#ir-date,
#i-motivation,
#i-description,
#rp-third-party-relation,
#incident-respondent-group fieldset fieldset fieldset,
#incident-report-form fieldset fieldset > .row,
#form-completer-phone,
#form-completer-email,
#form-completer-dept,
#form-completer,
#incident-respondent-group fieldset {
	margin-bottom: 0;
}

#rp-third-party-relation {
	width: 125px;
}

#rp-third-party-relation-container {
	padding-left: 22px
}

#reporting-party > fieldset label {
	display: inline-block;
	width: 45px;
}

#incident-report-form input[type="submit"] {
	/*width: 100%;*/
	text-align: center;
	margin: 1em 0;
	font-size: 14px;
	padding: 1em 2em
}

#extra-incident-information {
	margin-top: 2em;
	padding-top: 2em;
}

#incident-report-form p.error {
	color: #bb0000;
	margin: 0;
	font-size: 12px;
}

.clery-success {
	margin-bottom: 1em;
	padding: 1em;
	background: #e0efd8;
	border: 1px solid #4b8558;
	border-radius: .25em;
}

@media (max-width: 500px) {
	#incident-location-group label {
		width: 90%;
	}

	#incident-report-form textarea{
		width: 100%;
	}

	.period-container {
		display: block;
		margin-top: 1em;
	}

	#reporting-party-container {
		margin-top: 1em;
	}
}