@font-face {
    font-family: 'ScalaSansOT-Light';
    src: url('https://www.hnoc.org/css/fonts/ScalaSansOT-Light.otf') format("opentype");
}
@font-face {
    font-family: 'ScalaSansOT-Bold';
    src: url('https://www.hnoc.org/css/fonts/ScalaSansOT-Bold.otf') format("opentype");
}
@font-face {
    font-family: 'ScalaSansOT';
    src: url('https://www.hnoc.org/css/fonts/ScalaSansOT.otf') format("opentype");
}

@font-face {
    font-family: 'Movement-DirectBlack';
    src: url('https://www.hnoc.org/css/fonts/Movement-DirectBlack.woff') format("opentype");
}

/* JULY 2020 UPDATE - BODY BG COLOR */
body {
  background-color: #ffffff;
}


/* Menu Nav styling ---------------------------------- */

.primary_menu {
	background: url("../images/navigationSecondary_bgtop.gif") no-repeat scroll center top transparent;
}
/* JULY 2020 UPDATE - LEFT NAV BG COLOR */
.block-menu, .views-table {
	background-color: #9cc4d1;
}
/*.menu h2 {
	color: #333;
	font-family: Verdana;
	font-size: 12px;
	font-weight: bold;
	padding-bottom: 5px;
	text-transform: uppercase;	
}*/

/*.menu h2 {
	font-size: 1.5em;
	font-style: italic;
	font-weight: bold;
	color: #323280;
	padding-left: 1em;
	background-color:#fee1c2;
	padding-bottom:1em;
	margin-top: 0px;
}*/

/* JULY 2020 UPDATE - LEFT NAV MENU ITEMS COLOR AND BG COLOR + HOVER & VISITED COLOR */
.menu h2 {
	color: #ffffff;
	background-color: #2e8096;
    border-bottom: 1px solid #ccc;
    /*color: #323280;*/
    font-size: 1.5em;
	/*font-style: italic;*/
	font-weight: bold;
	padding: .5em 0 .5em .5em;
	font-family: 'ScalaSansOT-Bold';
}
.menu h2 a:visited, .menu h2 a:hover {
	color: #ffffff;
	text-decoration: underline;
}

.home .menu h2 {
	background-color: #fff;
	padding: 0 0 3px .5em;
}

.menu ul, .menu-tight ul {
	list-style: none;
	/*margin-bottom: 30px;*/
	z-index: 1;
}

div.block ul.menu, div.block ul.menu-tight { padding: 0 } /* Overwrite some Drupal styling */

.menu ul li a, .menu-tight ul li a {
	border-bottom: 1px #ccc dotted;
	color: #003;
	display: block;
	/*font-size: 12px;
	line-height: 15px;*/
	padding: 10px 13px;
	text-decoration: none;
}

.menu ul li.current a {
	background: #fff;
	font-weight: 800;
}

.menu ul ul { margin: 0 0 0 15px }

ul.menu li.leaf { list-style: none; margin: 0; padding: 0 }

.menu-tight ul li a {
	color: #333;
	font-size: 11px;
	line-height: 14px;
	padding: 5px 13px;
}

/*

.menu ul li a:hover, .menu-tight ul li a:hover, .menu ul li a.active, .menu-tight ul li a.active {
	background-color: #fff;
	text-decoration: none;
}
*/
.menu ul li a span {
	color: #666;
	display: block;
}


/* Pubs Book content ---------------------------------- */
.book_cover {
	float:left;
	padding-right: 10px;
 	
}
.field_content .book_cover {
	float:left;
	padding-right: 10px;
	padding-left: 10px;
}

/* 50@50 content ---------------------------------- */
.fifty {  /* Used for image */
	float:right;
	padding-left:15px; 
	padding-bottom:15px;
 	
}
.fifty_content {
	font-family: 'ScalaSansOT';
	font-size: 14px;
	line-height: 1.42857143;
	color: #333;	
}



tbody {
    border-top: 1px solid #000000;
}

/*  Used to style the Issue and Year for Quarterlies.  Without it, each would display on separate lines. */
/*
.field-items {
	float:left;
}
*/

#user-login, #user-pass {  /* Styled User Login and Change User Password pages */
	padding-left: 20px;
	font-size: 12px;
	line-height: 14px;
	padding: 5px 13px;
}



table#drupal{
	width:98%;
	border:1px;
}

table#drupal td {
    padding: 5px;
	text-align:left;
	vertical-align:text-top;
	width:250px;
}

/* WEbform styling  ---------------------------------- */

#colTwo .form-text { width: 400px }
#colTwo .form-text, #colTwo .form-password, #colTwo select, #colTwo textarea { font-size: 13px; line-height: 100% }
#colTwo .form-radio, #colTwo .form-checkbox { margin: 2px 5px 1px 0; position: relative; top: -2px; vertical-align: top }
#colTwo .form-radios, #colTwo .form-checkboxes { float: right; margin-top: 0; width: 428px }
#colTwo .form-submit { background: #e6e6e6; border-bottom-color: #969696; border-left-color: #ccc; border-right-color: #969696; border-top-color: #ccc; border-style: solid; border-width: 2px; color: #333; cursor: pointer; display: block; font-size: 13px; margin: 15px 0 25px 0; padding: 3px 6px }
#colTwo .form-submit:active { border-bottom-color: #ccc; border-left-color: #969696; border-right-color: #ccc; border-top-color: #969696 }
#colTwo .form-file { width: 250px }

#colTwo fieldset { background: #F5F1EB; border: 1px solid #E6DDCF; margin: 18px 0 6px; padding: 5px 0 10px }
#colTwo fieldset legend { background: #fff; border: 1px solid #E6DDCF; display: block; font-size: 12px; padding: 7px; margin-left: 15px }
#colTwo fieldset .form-item { clear: both; display: block; margin: 1em 20px }
#colTwo fieldset .form-item .form-item { display: inline; margin: 0; width: auto }
#colTwo fieldset .form-item label { display: block; float: left; font-size: 12px; line-height: 14px; padding: 3px 20px 0 0; position: relative; text-align: right; width: 200px }
#colTwo fieldset .form-item label.option { float: none; margin-right: 5px; text-align: left; width: auto }
#colTwo fieldset .resizable-textarea { clear: right; display: block; float: right; margin-right: 25px; padding-bottom: 15px; width: 400px }
#colTwo span.form-required { color: #600; display: block; position: absolute; right: 6px; top: 5px }

#colTwo input { font: 12px/100% Verdana, sans-serif; color: #494949 }
#colTwo textarea, #colTwo select { font: 12px/160% Verdana, sans-serif; color: #494949 }

#colTwo html.js fieldset.collapsed { background: transparent; padding-top: 0; padding-bottom: .6em }
#colTwo html.js fieldset.collapsible legend a { padding-left: 2em; }
/*
#colTwo html.js fieldset.collapsible legend a { padding-left: 2em; background: url(http://curly.loyno.edu/themes/garland/images/menu-expanded.gif) no-repeat 0% 50% }
#colTwo html.js fieldset.collapsed legend a { background: url(http://curly.loyno.edu/themes/garland/images/menu-collapsed.gif) no-repeat 0% 50% }
*/

.form-item input.error, .form-item textarea.error { border: 1px solid #c52020; color: #363636 }

#colTwo .description p { color: #666; display: block; float: left; font-size: 12px; font-style: italic; font-weight: 100; line-height: 15px; padding: 0 20px 0 0; text-align: right; width: 200px }
#colTwo .webform-component-markup p { padding: 5px 18px }
#colTwo .webform-component-markup ul, #colTwo .webform-component-markup ol { padding: 2px 18px }
.textarea-identifier { clear: both; font-size: .7em; margin: 0 20px 0 240px; padding-bottom: 15px }
#colTwo .webform-component-markup h5 { font-size: 14px; padding: 10px 0 0 18px }
#colTwo .webform-component-markup blockquote { padding-left: 20px }
.wrap-wide-right div.error { margin-bottom: 10px }
.wrap-wide-right div.error ul { list-style: disc; padding: 8px 8px 3px 22px }
.wrap-wide-right div.error ul li { color: #300; font-size: 13px; padding-bottom: 5px }


/* EDU We are Historians styling ---------------------------------- */
.links {
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    align-content:center;
}
a.historian-oh-button {
    flex-grow: 1;
    padding: 20px;
    text-align:center;
    margin: 5px;
    display:block;
    font-size: 1.75rem;
    font-weight: bold;
    background-color: #009899;
    color: white;
    border: none;
    border-radius: 5px;
    text-decoration: none;
    color: #fff;
	cursor: pointer;
	display: block;
	position: relative;
}
a.historian-oh-button:hover {
	color: #57524f !important;
	background-color: #8bd8d8;
}