/*
Theme Name: OOD
Theme URI: http://underscores.me/
Author: Mad Jane
Description: Office of Development Theme, built with Underscores
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ood

OOD is based on Underscores http://underscores.me/, (C) 2012-2015 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------

# Normalize
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Clearings
# Content
	## Posts and pages
# Royalslider
# Media Queries
--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/

html {
	font-family: sans-serif;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust:     100%;
	/*test*/
}

body {
	margin: 0;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
	display: block;
}

a {
	background-color: transparent;
}

b,
strong {
	font-weight: bold;
}

dfn {
	font-style: italic;
}

h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

img {
	border: 0;
}

button,
input,
optgroup,
select,
textarea {
	color: inherit;
	font: inherit;
	margin: 0;
}

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
/*
Font: 		Gordita
Style: 		Medium
URL: 		https://www.youworkforthem.com/font/T7073/gordita
Foundry: 	Thomas Gillett
Foundry: 	https://www.youworkforthem.com/designer/829/thomas-gillett
Copyright:	Copyright (c) 2016 by THOMAS GILLETT. All rights reserved.
Version: 	17
Created:	June 04, 2018
License: 	https://www.youworkforthem.com/font-license 
License: 	The WebFont(s) listed in this document must follow the YouWorkForThem
			WebFont license rules. All other parties are strictly restricted 
			from using the WebFonts(s) listed without a purchased license. 
			All details above must always remain unaltered and visible in your CSS.
*/

@font-face {
	font-family: 'Gordita-Medium';
	src: url('fonts/gordita-medium.eot');
	src: url('fonts/gordita-medium.eot?#iefix') format('embedded-opentype'),
             url('fonts/gordita-medium.woff2') format('woff2'),
	     url('fonts/gordita-medium.woff') format('woff'),
	     url('fonts/gordita-medium.ttf') format('truetype'),
	     url('fonts/gordita-medium.svg#youworkforthem') format('svg');
	font-weight: normal;
	font-style: normal;
}

/*
Font: 		Gordita
Style: 		Medium Italic
URL: 		https://www.youworkforthem.com/font/T7073/gordita
Foundry: 	Thomas Gillett
Foundry: 	https://www.youworkforthem.com/designer/829/thomas-gillett
Copyright:	Copyright (c) 2016 by THOMAS GILLETT. All rights reserved.
Version: 	17
Created:	June 04, 2018
License: 	https://www.youworkforthem.com/font-license 
License: 	The WebFont(s) listed in this document must follow the YouWorkForThem
			WebFont license rules. All other parties are strictly restricted 
			from using the WebFonts(s) listed without a purchased license. 
			All details above must always remain unaltered and visible in your CSS.
*/

@font-face {
	font-family: 'Gordita-MediumItalic';
	src: url('fonts/gordita-medium-italic.eot');
	src: url('fonts/gordita-medium-italic.eot?#iefix') format('embedded-opentype'),
             url('fonts/gordita-medium-italic.woff2') format('woff2'),
	     url('fonts/gordita-medium-italic.woff') format('woff'),
	     url('fonts/gordita-medium-italic.ttf') format('truetype'),
	     url('fonts/gordita-medium-italic.svg#youworkforthem') format('svg');
	font-weight: normal;
	font-style: normal;
}


body,
button,
input,
select,
textarea {
	color: #004e6e; 
	font-family: 'Gordita-Medium', Arial;
	font-size: 0.875rem;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
}

p {
	margin-bottom: 1em;
}

dfn,
cite,
em,
i {
	font-family: 'Gordita-MediumItalic', Arial;
}

address {
	margin: 45px 0 0 20px;
	font-style: normal;
	color: white;
}


.bigger {
	/*font-size: 52px;*/
	font-size: 3.25rem;
	line-height: 1.2;
}

.smaller {
    font-size: 1.3rem;
	align-self: center;
    -webkit-align-self: center;
    -moz-align-self: center;
}

.nowrap {
white-space: nowrap;
word-break: keep-all;
}


/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/


html {
	box-sizing: border-box;
	min-height: 100%;
}

body {
	background: #1a1a1a;
	margin: 0 auto; 
	width: 100%; 
	height: 100%;
	overflow-x: hidden; 
	position: fixed;
}

.no-flexbox .flex_container { /*container for vertically centering content*/
	width: 100%;
	height: 100%;
	position: relative;
}


.flex_container { /*container for vertically centering content*/
	width: 100%;
	height: 100%;
	position: fixed;
  	display: -ms-flexbox;
  	display: -webkit-flex;
  	display: flex;
	flex-direction: row;
	-webkit-flex-direction: row;
	-ms-flex-direction: row;
}


/*make text page without javascript scrollable*/
.no-js .page-template-page-text .flex_container, .no-js body.page-template-page-text {
position: relative;
}


ul,
ol {
	margin: 0 0 1.5em 3em;
}

ul {
	list-style: none;
}



li > ul,
li > ol {
	margin-bottom: 0;
	margin-left: 24px;
	margin-left: 1.5em;
}

img {
	height: auto; /* Make sure images are scaled correctly. */
	max-width: 100%; /* Adhere to container width. */
	margin-left: 0;
}

/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
nav {
	font-size: .8rem;
}
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
a {
	color: white;
	text-decoration: none;
}


a:hover,
a:focus,
a:active {
	color: #f04e23; 
}


a:focus {
	outline: 0;
}

.current-menu-item a, .lower {
    color: #f04e23;
}
/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/

input#op {
display: none;
}

@media screen and (min-width: 1025px) and (min-height: 450px) { /* desktop menu settings, greater than 690 px wide AND 450px tall*/


nav {
    margin-left: 84.5%; 
    width: 100vh;   
  	height: 45px;
  	position: fixed;
  	-webkit-transform-origin: left top;
  	-moz-transform-origin: left top;
  	-ms-transform-origin: left top;
  	-o-transform-origin: left top;
  	transform-origin: left top;
  	-webkit-transform:rotate(-90deg) translateX(-100%);
  	-moz-transform:rotate(-90deg) translateX(-100%);
  	-ms-transform:rotate(-90deg) translateX(-100%);
  	-o-transform:rotate(-90deg) translateX(-100%);
  	transform:rotate(-90deg) translateX(-100%);
  	z-index: 1;
  	display: -ms-flexbox;
  	display: -webkit-flex;
  	display: flex;
}

.no-flexbox nav, .no-csstransforms nav {
    width: 100%;   
	-webkit-transform: none;
	-moz-transform: none;
	transform: none;
	margin-left: 15px;
}

.no-csstransforms nav {
  	position: fixed;
  	margin: 0;
}
	
.main-navigation ul {
	list-style: none;
	padding: 0;
	clear: both;
	display: block;
	margin: 0 auto;
}


.main-navigation li {
	margin-right:25px;
    float:left;
  	height:100%;
  	line-height:45px; 
}

.main-navigation li:last-child {
margin-right: 0;
}

.main-navigation a {
	text-decoration: none;
	vertical-align: middle;
	
}

.main-navigation ul ul {
	position: absolute;
	top: 24px;
	top: 1.5em;
	left: -999em;
	z-index: 99999;
}

.main-navigation ul ul ul {
	left: -999em;
	top: 0;
}

.main-navigation ul ul a {
	width: 200px;
}

.no-csstransforms .main-navigation ul {
margin-left: 15px;
}

.lower {
display: none;
}

}

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	/*font-size: 14px;*/
	font-size: 0.875rem;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {
	outline: 1px dotted red;
}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.aligncenter {
	clear: both;
	display: block;
	margin: 0 auto;
}
/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
	content: "";
	display: table;
	table-layout: fixed;
}

.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
	clear: both;
}

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## SVG, Posts and pages
--------------------------------------------------------------*/
.sticky {
	display: block;
}

.page-content,
.entry-content,
.entry-summary {
	/*margin: 1.5em 0 0;*/
	max-width: 70%;
}


.content-area {
width: 100%;
height: auto;
overflow: hidden;
align-self: center;
-webkit-align-self: center;
-moz-align-self: center;
}

.content-area p, .content-area h1, .smaller {
margin-left: 15px;
}

/*--------------------------------------------------------------
## Royalslider
--------------------------------------------------------------*/

/* v1.0.6 */

.royalSlider > .rsSlide {
display: none; }
 /*http://help.dimsemenov.com/kb/royalslider-jquery-plugin-issues/slider-content-appears-for-a-second-before-initialization
(tried this to fix flash of unstyled text on 'text' page, but it didn't work*/

.royalSlider, .style-svg {
	max-width: 1000px; 
	height: auto;
}

.royalSlider {
	position: relative;
	direction: ltr;
}

.hidden {
display: none;
}

.break{
padding-top: 10px;
}

/*style for text posts on "text" page*/
.royalSlider p { 
align-self: center;
-webkit-align-self: center;
-moz-align-self: center;
font-size: 1.5rem;
line-height: 1.35;
padding-right: 15%;
}

/*style for "text" page with js disabled*/
.no-js .page-template-page-text .royalSlider {
margin-top: 20px;
}

.no-js img.rsImg {
display: none;
}
	
.rsImg.rsMainSlideImage {
margin-left: 0;
}

.royalSlider > * {
	float: left;
}

.rsFade.rsWebkit3d .rsSlide,
.rsFade.rsWebkit3d img,
.rsFade.rsWebkit3d .rsContainer {
    -webkit-transform: none;
}
.rsOverflow {
	width: 100%;
	height: 100%;
	position: relative;
	overflow: visible !important; /*make second slide visible*/
	float: left;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
}
.rsVisibleNearbyWrap {
	width: 100%;
	height: 100%;
	position: relative;
	overflow: visible !important; /* make second slide visible*/
	left: 0;
	top: 0;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
}
.rsVisibleNearbyWrap .rsOverflow {
	position: absolute;
	left: 0;
	top: 0;

}
.rsContainer {
	position: relative;
	width: 100%;
	height: 100%;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
}

.rsArrow,
.rsThumbsArrow {
	cursor: pointer;
}

.rsThumb {
	float: left;
	position: relative;
}


.rsArrow,
.rsNav,
.rsThumbsArrow {
	opacity: 1;
	-webkit-transition:opacity 0.3s linear;
	-moz-transition:opacity 0.3s linear;
	-o-transition:opacity 0.3s linear;
	transition:opacity 0.3s linear;
}
.rsHidden {
	opacity: 0;
	visibility: hidden;
	-webkit-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
	-moz-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
	-o-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
	transition:visibility 0s linear 0.3s,opacity 0.3s linear;
}


.rsGCaption {
	width: 100%;
	float: left;
	text-align: center;
}


.royalSlider .rsSlide.rsFakePreloader {
	opacity: 1 !important;
	-webkit-transition: 0s;
	-moz-transition: 0s;
	-o-transition:  0s;
	transition:  0s;
	display: none;
}

.rsSlide {
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	overflow: hidden;
}

/* to center text on text page*/
.page-template-page-text .rsSlide {
	display: flex;
	display: -ms-flexbox;
  	display: -webkit-flex;
	height: 100%;
	width: 100%;
}

.royalSlider.rsAutoHeight,
.rsAutoHeight .rsSlide {
	height: auto;
}

.rsContent {
	width: 100%;
	height: 100%;
	position: relative;
}

.rsPreloader {
	position: fixed;
	width:20px;
    height:20px;
	background-image:url(preloaders/preloader-white.gif);
	top: 50%;
	margin-top:-10px;	
}

.rsNav {
	-moz-user-select: -moz-none;
	-webkit-user-select: none;
	user-select: none;
}
.rsNavItem {
	-webkit-tap-highlight-color:rgba(0,0,0,0.25);
}

.rsThumbs {
	cursor: pointer;
	position: relative;
	overflow: hidden;
	float: left;
	z-index: 22;
}
.rsTabs {
	float: left;
	background: none !important;
}
.rsTabs,
.rsThumbs {
	-webkit-tap-highlight-color:rgba(0,0,0,0);
}

img.rsImg {
	max-width: none;
	margin-left: 0;
}

.grab-cursor {
	cursor:url(preloaders/grab.png) 8 8, move; 
}

.grabbing-cursor{ 
	cursor:url(preloaders/grabbing.png) 8 8, move;
}

.rsNoDrag {
	cursor: auto;
}

.rsLink {
	left:0;
	top:0;
	position:absolute;
	width:100%;
	height:100%;
	display:block;	
	z-index: 20;
	background: url(blank.gif);
}

/*Mozilla-specific hack to fix slide jerkiness*/
.rsSlide {
-moz-backface-visibility: hidden;
-moz-transform: translateZ(0);
}
/*--------------------------------------------------------------
## Media Queries
--------------------------------------------------------------*/
@media screen 
  and (min-width: 2501px) {
  
  .royalSlider {
  max-width: 40%;
}

nav {
    margin-left: 90%;
}
}

@media screen 
  and (max-width: 2500px) and (min-width: 1900px) {
  
nav {
    margin-left: 86%;
}
}

@media screen 
  and (max-width: 2500px) and (min-width: 1701px) {
  
  .royalSlider {
  max-width: 43%;
}
}


@media screen 
  and (max-width: 1700px) and (min-width: 1601px){
nav{
margin-left: 82%;
}  
}


@media screen 
  and (max-width: 1600px) {
  
  .royalSlider {
  max-width: 70%;
}
}

@media screen and (max-width: 1400px){
.content-area, .rsSlide {
overflow: visible;

}
}

@media screen and (max-width: 1074px) and (max-height: 570px){
.smaller { 
font-size: 0.875rem;
}

.royalslider p {
font-size: 1rem;
}
}

@media screen and (max-width: 900px), screen and (max-height:500px) {
.bigger {
font-size: 1.875rem;
}
}

@media screen and (max-width: 900px), screen and (max-height:300px) {
.bigger {
font-size: 1.375rem;
}
}


/*mobile menu settings, less that 690 px wide and 450 tall*/
@media screen and (max-width: 1024px), screen and (max-height: 450px){

	.home .page-content {
		display: none;
	}
.home .main-navigation {
	display: -ms-flexbox;
  	display: -webkit-flex;
  	display: flex;
  	padding-left: 10px;
}

.home .menu {
-webkit-align-self: center;
align-self: center;
position: fixed;
}

ul, menu, dir {
-webkit-margin-before: 0;
-webkit-margin-after: 0;
-webkit-margin-start: 0;
-webkit-margin-end: 0;
-webkit-padding-start: 0;
-moz-margin-before: 0;
-moz-margin-after: 0;
-moz-margin-start: 0;
-moz-margin-end: 0;
-moz-padding-start: 0;
}

.lower{
  background:transparent;
  margin-left: 83%; 
   width: 100vh;   
  height: 45px;
  	position: fixed;
  	-webkit-transform-origin: left top;
  	-ms-transform-origin: left top;
  	-moz-transform-origin: left top;
  	-o-transform-origin: left top;
  	transform-origin: left top;
  	-webkit-transform:rotate(-90deg) translateX(-100%);
  	-moz-transform:rotate(-90deg) translateX(-100%);
  	-ms-transform:rotate(-90deg) translateX(-100%);
  	-o-transform:rotate(-90deg) translateX(-100%);
  	transform:rotate(-90deg) translateX(-100%);
  	z-index: 2;
  	display: -ms-flexbox;
  	display: -webkit-flex;
  	display: flex;
}

.lower:hover{
  color:white;
}

.lower label{
  font-size: 14px;
  margin: 0 auto;
}

.lower label:hover{
  cursor:pointer;
}

.overlay{
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: #1a1a1a;
	z-index: 3;
	display: -ms-flexbox;
  	display: -webkit-flex;
  	display: flex;
}

.home label, .home label:hover {
cursor:default;
color: #f04e23;
}

.overlay label{
	margin-left: 83%;
	position: fixed;
	z-index: 4;
  cursor:pointer;
  align-self: center;
 	-webkit-align-self: center;
	-moz-align-self: center;
}

.overlay nav {
	position: relative;
	align-self: center;
 	-webkit-align-self: center;
	-moz-align-self: center;
	margin-left: 10px;
}

.overlay ul li a:hover,
.overlay ul li a:focus {
	color: #f04e23;
}

.lower~.overlay-hugeinc{
	opacity: 0;
	visibility: hidden;
	-webkit-transition: opacity 0.5s, visibility 0s 0.5s;
	-moz-transition: opacity 0.5s, visibility 0s 0.5s;
	-ms-transition: opacity 0.5s, visibility 0s 0.5s;
	-o-transition: opacity 0.5s, visibility 0s 0.5s;
	transition: opacity 0.5s, visibility 0s 0.5s;
}

#op:checked~.overlay-hugeinc{
	opacity: 1;
	visibility: visible;
}

.main-navigation li:first-child {
display: none;
}

.close {
  position: relative;
  display: inline-block;
  width: 10px;
  height: 10px;
  overflow: hidden;
}
.close:hover::before, .close:hover::after {
  background: #f04e23;
}
.close::before, .close::after {
  content: '';
  position: absolute;
  height: 1px;
  width: 50%;
  top: 50%;
  margin-top: -1px;
  background: white;
  bottom: 25%;
  left: 25%;
}
.close::before {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
.close::after {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.close.hairline::before, .close.hairline::after {
  height: 1px;
}
.circle {
	border-radius: 50%;
	width: 40px;
	height: 40px; 
	background-color: #004e6e;
}
}


@media screen and (max-height: 555px) and (min-height: 450px){
.main-navigation a {
	font-size: 0.75rem;	
}
}


@media screen and (min-width: 562.5px) {
	.main-navigation ul {
		display: block;
	}
	
	.menu-toggle,
.main-navigation.toggled ul {
	display: none;
}
}

@media screen and (min-width: 563px) and (max-width: 850px) and (min-height: 406px){ 
.smaller { 
font-size: 1rem;
line-height: 1.2;
padding-right: 5%;
}

.royalSlider p { 
line-height: 1.2;
padding-right: 5%;
font-size: 1.1rem;
}
.content-area, .rsSlide {
overflow: visible;
}

}

@media screen and (max-width: 562.5px), screen and (max-height: 405px) {

.bigger {
font-size: 1.75rem;
}

.lower {
margin-left: 80%;
}

.overlay label {
margin-left: 78%;
}
}

@media screen and (max-width: 562.5px) {
.smaller { 
font-size: 0.875rem;
line-height: 1.2;
padding-right: 5%;
margin-left: 8px;
}
	
.royalSlider p { 
font-size: 1rem;
line-height: 1.2;
padding-right: 5%;
margin-left: 8px;
}


}

/*galaxy s4*/
@media screen and (max-width: 400px) and (max-height: 560px){
.smaller { 
font-size: 0.6875rem;
margin-left: 8px;
}
.royalSlider p {
font-size: .75rem;
}
}

@media screen and (max-width: 330px) {

.smaller, address {
font-size: 0.75rem;
}

.royalSlider p, .smaller { 
margin-left: 8px;
}
	
.lower {
margin-left: 78%;
}

.overlay label {
margin-left: 75%;
}

.bigger {
/*font-size: 28px;*/
font-size: 1.75rem;
}
}

/*phone landscape settings*/
@media screen and (max-width: 736px) and (max-height: 414px){
.smaller {
font-size: 0.6875rem;
}
.royalSlider p {
font-size: 0.75rem;
}
}