@charset "UTF-8";
/* CSS Document */

*{
margin:0;
padding:0;
}

body {
background-color: #f3eee9;
font-family:"Lucida Grande","Lucida Sans",Verdana,Helvetica,Arial,sans-serif;
font-size:15px;
color: #000;
}

#wrapper {
width:1024px;
width:1280px;
width:1600px;
width:1440px;
width:1920px;
width:1360px;
width:1280px;
background-color:#fff;
margin:auto;
border: thin solid #6C6A6A;

}

.removespace img{
display: block;
}

#branding{
height:36em;
background-color: #000000;
background-image:url(images2018/background03.jpg);
background-repeat:no-repeat;
background-size: cover;
}



#branding h1{
line-height:1em;
font-family: Times, Times New Roman,  serif;
font-size:340%;
color: #FFFFFF;
letter-spacing:0.08em;
font-style:italic;
 text-shadow: 2px 2px 4px #000000;
padding-top:8em;
}

#branding p{
color: #FFFFFF;
letter-spacing:0.08em;
font-style:italic;
 text-shadow: 2px 2px 4px #000000;
 padding-right:0em;
}

#branding a{
text-decoration:none;
color:#FFFFFF;
}


img {
    max-width: 100%;
    height: auto;
}




.menu{
font-size:19px;
width:100%;
height: 2.0em;
background-color: #000;
border-bottom: thin solid burlywood;
}

.menu ul{
list-style-type: none; /* Remove bullets */
  padding: 0; /* Remove padding */
  margin: 0; /* Remove margins */
}

/*divide 100% (could be 90%) by the number of links to estimate the value of width: % below */
.menu li{
float:left;
width:20%;
text-align: center;
line-height: 1.8em;
}


.menu a,
.menu a:link,
.menu a:visited{
text-decoration:none;
color:#fff;
display:block;
text-align:center;
outline-style:none;
letter-spacing:0.08em;

/*border:#000 thin dotted;*//* Only to outline the menu links while designing */

}

.menu a:hover,
.menu a:active{
text-decoration: underline;
/*font-style: italic;*/
color: #00c9f4;
color: #52aad8;
color: #c9ab81;
}

.menu .current a:link,
.menu .current a:visited{
color:#00c9f4;
color: #52aad8;
font-style: normal;

}





.sticky {
width:100%;
position: sticky;
top: -5px;
background-color:#fff;
}


.nav{
font-size:19px;
letter-spacing:0.10em;
width:100%;
height:2.0em;
font-family: 'andale mono', Helvetica, "sans-serif";
/*border-top:#284482 thin solid;
border-bottom:#284482 thin solid;*/
border-bottom:#BBBBBB thin solid;
}

/*remove bullets from ul in navbar */

.nav ul{
 list-style-type: none; /* Remove bullets */
  padding: 0; /* Remove padding */
  margin: 0; /* Remove margins */
}

/*divide 100% (could be 90%) by the number of links to estimate the value of width: % below */
.nav li{
float:left;
width:25%;
}


.nav a,
nav a:link,
nav a:visited{
text-decoration:none;
color:#4f4f4f;
display:block;
text-align:center;
outline-style:none;
letter-spacing:0.10em;
line-height:2.0em;


/*border:#000 thin dotted;*//* Only to outline the menu links while designing */

}

nav a:hover,
nav a:active{

font-style: italic;
color: #000;
letter-spacing:0.10em;
}





nav .current a:link,
nav .current a:visited{
/*font-family:'Belleza', serif;*/
letter-spacing:0.10em;
/*font-weight:bold;*/

color:#706E6E;
text-decoration: underline;



}
.menutiny {
background: #000000;
height: 40em;


}
.menutiny a,
.menutiny a:link,
.menutiny a:visited{
text-decoration:none;
color:#fff;
letter-spacing:.1em;
display:block;
border-bottom: #fff thin solid;
text-align:center;
outline-style:none;
line-height:4em;
font-size: 140%;
}

.menu-fixed {
width:70px;
background-color: #000;
position: fixed;
top:10px; right:10px;
border:#999999 thin solid;
z-index: +1;
}


.menu-fixed a{
width:100%;
text-decoration:none;
color: #fff;
display:block;
outline-style:none;
letter-spacing:0.07em;
font-size:120%;
text-align: center;

}

.menu-fixed a:hover,
.menu-fixed a:active{
color:#fff;
text-decoration:none;
font-style:italic;
}

#bar{
width:100%;
height:1em;
background-color:#0000FF;
}

.box{
width:6.5em;
position: relative;
}

.box-logo {
width:33%;
float:left;
padding-top:1em;
padding-left:3em;
}

.boxtext{
width:75%;
text-align:left;
margin:auto;
border:#CCCCCC thin solid;
padding:0.5em;
background-color: #f4f4f4;

}

#main{
background-color: #fff;
padding-left:2%;
padding-right:2%;
min-height:48em;
border-left:#e4e1de thin solid;
border-right:#e4e1de thin solid;

}

#main h1{
font-family:Georgia, "Times New Roman", Times, serif;
color:#7d9fca;
color:#7a0000;
font-size:190%;
}

#main h2, #mainwhite h2{
font-family:Georgia, "Times New Roman", Times, serif;
color:#7d9fca;
color:#7a0000;
font-size:160%;
}

#main h3{
font-family:Georgia, "Times New Roman", Times, serif;
color:#7d9fca;
color:#7a0000;
font-size:140%;
}

#main h4{
font-family:Georgia, "Times New Roman", Times, serif;
color:#a7a6a6;
font-size:154%;
}

#main hr{
background-color:#e4e1de;height:1px;border:none;
}

#main ul{
padding-left:3em;
}


#main a,
#main a:link,
#main a:visited{
color:#238B0B;
letter-spacing:.05em;
text-decoration:underline;
outline-style:none;
}


#main a:hover, 
#main a:active{
color: #666666;
text-decoration:none; font-style: italic;
}

#mainwhite{
background-color: #fff;
padding-left:1.5em;
padding-right:1.5em;
min-height:48em;
}
#mainwhite hr{
background-color:#e4e1de;height:1px;border:none;
}



.leftbox1 {
float:left;
width:36em;
min-height:5em;

}




.column-quarter{
float:left;
width:24%;
padding-left: 1%;
min-height:1em;
}

.leftbox3 {
float:left;
width:25em;
min-height:10em;
}

.column-third {
float:left;
width:33%;
min-height:10em;
}


.column-twothirds {
width:65%;
float:left;
margin-left:2%;
}

/*portfolio */
.listing {
width:100%;
}

#columnleft {
float:left;
width:27em;
height:9em;
}

.column-half {
float:left;
width:47%;
margin-left:2%; 
min-height:3em;
}

#columnright {
float:right;
width:27em;
height:9em;

}

.boxleft {
float:left;
width:48%;
padding-left:1%;
padding-right:1%;
height:10em;
}

.boxright{
float:right;
width:13em;
height:9em;
}

.textbox {
font-size: 80%;
width: 96%;
}


.flex-container2 {
  display: flex;
  flex-wrap: nowrap;
  background-color: #fff;
  
}

.flex-container2>div {

  padding: 10px;
  border: thin #424040 solid;
  flex: 50%;
  
  
}
.flex-container>div 
 {
background-color:aqua;
  flex: 50%;
  
  
}


/* Responsive layout - makes a one column-layout instead of two-column layout */
@media (max-width: 800px) {
  .flex-container2 {
    flex-direction: column;
	
  }

}





/* Style rules for formal, captioned figures */
 figure {
 width: 80%;
 max-width: 600px;
 clear: both;
margin:auto;
 border: solid 1px gray;
 border-radius: 10px;
 box-shadow: 3px 3px 3px 3px #ddd;
 }
 figure img {
 width: 100%;
 display: block;
 border-top-left-radius: 10px;
 border-top-right-radius: 10px;
 }
 figcaption {
 font: 10pt/10pt Verdana, Tahoma, Sans-serif;
 padding: 2px 4px;
 text-align:right;
 }
 


#footer {
min-height: 10em;
font-size:16px;
background-color: #000;
color: #333333;
color: #c9ab81;
padding-left:1.5em;
padding-right:1.5em;
text-align:center;
border-top:#CCC thin solid;
}

#footer a,
#footer a:link,
#footer a:visited{
text-decoration:none;
color: #666666;
}

#footer a:hover,
#footer a:active{
text-decoration:underline;
color:#000;
}