@charset "UTF-8";


/*Add this to the other css files: thumbs,etc.*/

html {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
*, *:before, *:after {
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit;
  }



/*------------------------------------------------------------------

--------CSS FOR INDEX.HTML: ONE FIXED CENTERED COLUMN LAYOUT--------

--------------------------------------------------------------------
*/

body {
	font-family: 'Karla', sans-serif;
	background-color: #939597;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;
}
.oneColFixCtrHdr #container {
	max-width: 1410px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	width: 100%; /*----Added May 15-----*/
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	border: 0px solid #000000;
	text-align: left; /* this overrides the text-align: center on the body element. */
	
}
.oneColFixCtrHdr #header {
	padding: 0;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
	height: 100px;
	background-color: #939597;

}
.oneColFixCtrHdr #header h1 {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	padding: 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
	padding-top: 50px;
}
.oneColFixCtrHdr #mainContent {
	padding: 0; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	background-color: #939597;
}
.oneColFixCtrHdr #footer {
	padding: 0; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	text-align: center;
	height: 50px;
}
.oneColFixCtrHdr #footer p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}

img {
border: 0px;
max-width: 100%; /* Added for RWD May8-2019 */
}




/*-------------------------------------------------------------------

--------------------CSS FOR GALLERY IMAGE PAGES----------------------

---------------------------------------------------------------------
*/

.oneColFixCtrHdr #frameContent {
	padding: 0; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	background-color: #939597 ;
	text-align: center;
	margin: 0 auto;
}

.frame {
  float: left;
  border: 0px solid #e5e5e4;
  background-color: #ffffff;
  
}

.frame-captions {
	float: left;
	padding: 20px 30px 20px 30px;
}

.col-2 {
    
}

.col-lg-2 {
    width: 73.55%;
    margin-left: 15px;
    margin-right: 0px;
    margin-bottom: 15px;
	
}
.col-lg-3 {
    width: 23%;
	margin-left: 15px;
    margin-right: 15px;
    margin-bottom: 5px;	
  	border-top: 0px solid #e5e5e4;
  	background-color: #ffffff;
}

h3 {
    font-family: 'Karla';
    font-variant: normal;
    font-weight: 550;
    font-size: 1.75em;
    text-align: left;
    line-height: .65em;
    word-spacing: -0.075em;
    letter-spacing: -0.012em;
    color: #3E3E3E;
}


h4 {
    font-family: 'Karla';
    font-variant: normal;
    font-weight: 550;
    font-size: 1.4em;
    text-align: left;
    line-height: 1.17em;
    word-spacing: -0.075em;
    letter-spacing: -0.012em;
    color: #3E3E3E;
}

h6 {
    font-family: 'Karla';
    font-variant: normal;
    font-weight: 550;
    font-size: 1.3em;
    text-align: left;
    line-height: 1.15em;
    word-spacing: -0.075em;
    letter-spacing: -0.012em;
    color: #3E3E3E;
}



p {
    font-family: 'Karla', sans-serif;
    font-size: 0.938em; /*15px*/
	text-align: left;
    line-height: 1.29em; /*20.5px*/
	font-weight: 400;
	word-spacing: -0.02em;
	color: #333;
}

.responsive-image {
    width: 100%;
    height: auto;
    display: block;
}

.head-numbers {
    color: #D60E0E;
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 0.95em;
}

.head-numbers2 {
    color: #000000;
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 0.95em;
}


.footer-text {
    float: right;
    font-family: 'Karla', sans-serif;
    font-style: normal;
    font-size: 1.135em; /*20px*/
    line-height: 1.29em; /*20.5px*/
    color: #000000;
    font-variant: small-caps;
    font-weight: bold;
    letter-spacing: 0.11em;
    margin-left: 15px;
    margin-right: 15px;
}

.footer-text2 {
    float: left;
    font-family: 'Karla', sans-serif;
    font-style: normal;
    font-size: 1.125em; /*18px*/
    line-height: 1.29em; /*20.5px*/
    color: #000000;
    font-variant: small-caps;
    font-weight: 700;
    letter-spacing: 0.11em;
    margin-right: 15px;
    margin-left: 15px;
}


.symbol-sm {
    font-family: 'Karla', sans-serif;
    font-style: normal;
	font-size: 0.75em; /*12px*/
	line-height: 1.29em;
	color: #000000;
    font-variant: normal;
	font-weight: 700;
	letter-spacing: 0.15em;
    
}
.symbol-at {
	font-family: 'Karla', sans-serif;
    font-style: normal;
	font-size: 0.75em;
	line-height: 1.29em;
	color: #ffffff;
    font-variant: normal;
	font-weight: bold;
	letter-spacing: 0.15em;
}


/*------------ GLOBAL TOP TEXT Navigation-----------------------------*/

ul {
	list-style: none;
	margin: 100px 0 0 0;
	padding-bottom: 35px;
	height: 0px;
}


ul li {
    float: left;
    margin-right: 15px;
    font-variant: small-caps;
    font-weight: 700;
    letter-spacing: 0.15em;
    font-family: 'Karla', sans-serif;
    font-style: normal;
    font-size: 1.125em;
}


ul {
	float: right;
}

ul a:link {
    color: #000000;
}

ul a:visited { 
    color: #000000;
}

ul a:hover{
    color: #000000;
    text-decoration: underline;
    
}

ul a:active {
	color:#000000;
    text-decoration: underline;
}

.header-logo {
	float: left;
}

ul.my-list-style {
    list-style-type: circle;
    padding: 10px 20px;
}

ul li.my-list-style {
	float: left;
    margin-right: 15px;
    font-variant: normal;
    font-weight: normal;
    letter-spacing: 0.15em;
    font-family: 'Karla', sans-serif;
    font-style: normal;
    font-size: 1.125em;
}

/*--------------Hamburger Menu Navigation--------------*/

nav {
	float:right;
	
}
/*this says in desktop view don't display hamburger icon*/
.mobile-view {
    float: left;
	display: none;
	margin-top: 73px;
	margin-left: 35px;
	
}

.desktop-view {
}


/*-------------Hamburger Menu Navigation - ENDS HERE----*/



.spacer {   /*Note index space does not include the padding-bottom*/
	clear:both; 
	padding-bottom: 14px;
}

.spacer2 {
  clear: both;
  margin: 0;
  padding: 20px 0 0px 0;
}



/*------------------------General Hyperlinks--------------------------------- */
a:link {
	color: #333;
	text-decoration: none;
}

a:visited { 
color: #333;
text-decoration: none; 
}

a:hover { 
color: #333;
text-decoration: underline; 
 
}

a:active { 
color: #191919;
text-decoration: none; 
}

/*------------------------Underline Hyperlinks in the Paragraph Text  --------------------------------- */

a.textlink:link {
	color: #333;
	text-decoration: underline;
}

a.textlink:visited { 
color: #333;
text-decoration: none; 
}

a.textlink:hover { 
color: #333;
text-decoration: underline; 
 
}

a.textlink:active { 
color: #191919;
text-decoration: none; 
}

/*------------------------Underline Hyperlinks in the Paragraph ends here --------------------------------- */



.overlay {
  position: fixed;
  z-index: 99;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.9);
  display: flex;
  align-items: center;
  text-align: center;
  visibility: hidden;
  opacity: 0;
  transition: opacity .3s;
}

.overlay img{
  max-width: 90%;
  max-height: 90%;
  width: auto;
  height: auto;
  transform: scale(0.95);
  transition: transform .3s;
}

.overlay:target {
  visibility: visible;
  outline: none;
  cursor: default;
}

.overlay:target img {
    transform: scale(1);
}


/*------------------------Media Queries---------------------------------------*/

/*-------Desktop from 1139px to tablet------------------*/

@media (min-width: 769px) and (max-width: 1139px) {
	

.col-md-2 {
    width: 100%;
}
.frame-captions {
	padding: 5px 30px 25px 30px;
	}
	
}

/*-----------Tablet view 768----------------------*/

@media (max-width: 768px){
	
.col-md-2 {
    width: 100%;
}
	
.col-lg-3 {
	margin-left: 0px;
	}
	
.col-lg-2 {
	margin-left: 0px;
	}

}

/*-----------Tablet view up to 767----------------------*/

@media (min-width: 401px) and (max-width: 767px){
	
.mobile-view {
    display: block;
}
	
.desktop-view {
    display: none;
}
	
.mobile-view375px-hamburger {
	margin-top: 48px;
	margin-left: 3%; /*to push the hamburger menu away from browser's right edge */
	}

ul {
	margin-top: 20px;
	margin-bottom: 15px;
	}	
	
.spacer2 {
	padding-top: 0px;
	}	
	
	
.expand {
    display: block;
}


.oneColFixCtrHdr #header {
	height: 90px; /*Just added to height in header area*/
	}
	
.oneColFixCtrHdr #header h1 {
	padding-top: 25px;
	}	
	
	
.col-md-2 {
    width: 100%; 
	
}
	
.col-lg-3 {
	padding-top: 0px;
	margin-left: 0px;
	}
	
.col-lg-2 {
	margin-left: 0px;
	}

h1 img {
	margin-left: 15px;
	}
	
	
.footer-text {
		float: none;
		text-align: center;
		padding-bottom: 100px;
	}

.footer-text2 {
		float: none;
		text-align: center;
		padding-bottom: 5px;
	}
}




/*---------Mobile View 400------------------------------*/
@media (max-width: 400px){
	
.col-sm-2 {
    width: 100%;
}

.oneColFixCtrHdr #header h1 {
	padding-top: 25px;	
	
	}	

.oneColFixCtrHdr #header {
	height: 90px; /*Just added to height in header area*/
	}
	
.col-lg-3 {
	padding-top: 0px;
	margin-left: 0px;
	}
	
.col-lg-2 {
	margin-left: 0px;
	}
	
.footer-text {
		float: none;
		text-align: center;
		padding-bottom: 100px;
	}

.footer-text2 {
		float: none;
		text-align: center;
		padding-bottom: 5px;
	}	

.mobile-view375px-hamburger {
	margin-top: 48px;
	}

ul {
	margin-top: 20px;
	margin-bottom: 15px;
	}			
	
.spacer2 {
	padding-top: 0px;
	}	
	
}

	
/*-----------Mobile view 414------------------------*/

@media (max-width: 414px){
	
.mobile-view {
    display: block;
}
	
.desktop-view {
    display: none;
}
	
.expand {
    display: block;
}	

ul {
	margin-top: 20px;	
	margin-bottom: 15px;
	}
	
h1 img {
    width: 83%;
    height: 83%;
	}	
	
.mobile-view375px-hamburger {
    margin-top: -24px;
    margin-left: 365px;
    display: block;	
}
.spacer2 {
	padding-top: 0px;
	}	
	
.oneColFixCtrHdr #header h1 {
	padding-top: 25px;	
	}	

.oneColFixCtrHdr #header {
	height: 85px; /*Just added to height in header area*/
	}
	
.col-lg-3 {
	padding-top: 0px;
	margin-left: 0px;
	}	

.col-lg-2 {
	margin-left: 0px;
	}
	
.footer-text {
		float: none;
		text-align: center;
		padding-bottom: 100px;
	}

.footer-text2 {
		float: none;
		text-align: center;
		padding-bottom: 5px;
	}		
	
}



/*-------Mobile view 412------------------------------*/

@media (max-width: 412px){
	
.mobile-view {
    display: block;
}
.desktop-view {
    display: none;
}
.expand {
    display: block;
}	

ul {
	margin-top: 20px;
	margin-bottom: 15px;
	}
	
	
h1 img {
    width: 80%;
    height: 80%;
	}	
	
.mobile-view375px-hamburger {
    margin-top: -24px;
    margin-left: 355px;
    display: block;	
}
.spacer2 {
	padding-top: 0px;
	}	
	
.mobile-view412px {
    display: block;
}
	
.oneColFixCtrHdr #header h1 {
	padding-top: 25px;	
	}	

.oneColFixCtrHdr #header {
	height: 85px; /*Just added to height in header area*/
	}
	
.col-lg-3 {
	padding-top: 0px;
	margin-left: 0px;
	}	
	
.col-lg-2 {
	margin-left: 0px;
	}
	
.footer-text {
	float: none;
	text-align: center;
	padding-bottom: 100px;
	}

.footer-text2 {
	float: none;
	text-align: center;
	padding-bottom: 5px;
	}		
		

	
}


/*-------Mobile view 375-------------------------------------*/

@media (max-width: 375px){

.mobile-view {
    display: block;
}
	
h1 img {
    width: 87%;
    height: 87%;
	}	
	
.mobile-view375px-hamburger {
    margin-top: -22px;
    margin-left: 320px;
    display: block;	
}
.spacer2 {
	padding-top: 0px;
	}

.expand {
    display: block;
}	
	
ul {
	margin-top: 20px;
	margin-bottom: 15px;
	}	

.oneColFixCtrHdr #header h1 {
	padding-top: 25px;	
	padding-left: 0px;
	
	}	
	
.oneColFixCtrHdr #header {
	height: 80px; /*Just added to height in header area*/
	}
	
.col-lg-3 {
	padding-top: 0px;
	margin-left: 0px;
	}
	
.col-lg-2 {
	margin-left: 0px;
	}
	
.footer-text {
		float: none;
		text-align: center;
		padding-bottom: 100px;
	}

.footer-text2 {
		float: none;
		text-align: center;
		padding-bottom: 5px;
	}	
	
}
	

/*------------------------------------Media Queries ENDS HERE ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/


/*--------------OLD NAVIGATION-----------------*/
.oneColFixCtrHdr #navigation {
	padding: 0; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	text-align: right;
	height: 0px;
	background-color: none;
	margin-right: 15px;
	
}

a.portfolio {
	width: 70px;
	height: 20px;
	display: block;
	text-decoration: none;
	background: url(../img/portfolio.png);	
}

a.portfolio:hover {
	background-position: -70px 0;
}

a.next {
	width: 9px;
	height: 20px;
	display: block;
	text-decoration: none;
	background: url(../img/next.png);	
}

a.next:hover {
	background-position: -9px 0;
}

a.previous {
	width: 9px;
	height: 20px;
	display: block;
	text-decoration: none;
	background: url(../img/previous.png);	
}

a.previous:hover {
	background-position: -9px 0;
}

.floatarrows {
  float: right;
  padding-left: 1px;
}

.oneColFixCtrHdr #caption {
	padding: 0; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	text-align: left;
	height: 20px;
	background-color: none;
	margin-left: 15px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11.5px;
	color: #000;
}

.oneColFixCtrHdr #text {
	padding: 0; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	text-align: left;
	height: 60px;
	background-color: none;
	margin-left: 15px;
	margin-right: 10px;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 10.5px;
	line-height: 14px;
	color: #191919;
}

.oneColFixCtrHdr #text2 {
	padding: 0; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	text-align: left;
	height: 80px;
	background-color: none;
	margin-left: 15px;
	margin-right: 10px;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 10.5px;
	line-height: 14px;
	color: #191919;
}

.italic {
	font-style: italic;	
}