@charset "UTF-8";

/*  RESETS AND FIXERS  */
/* * { box-sizing: border-box;
}*/
body, h1, h2, h3, h4, h5, h6, p, blockquote, ul, ol, dl, address {
	margin: 0;
	padding: 0;
}
img { border: none; }
header, nav, main, section, article, aside, figure, time, footer { display: block; }

a:focus { outline: thin dotted; }

/* DOCUMENT */
html { background: #ffffff url(images/background-monte.jpg) no-repeat top center; }

body { 
	max-width: 1250px; 
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;
	/*font-size: 1em;*/
	margin: 0 auto;
}
/* ___________________*/
/*       HIDDEN      */
.navMenu { display: none; }

/* _________________ */
/*      CONTAINER    */
.container { 
	max-width: 1250px;
	margin: 0 auto;
	/*font-size: 1em;*/
}

/* UNIVERSALS use ems when possible */
.indent {
	text-align: left;	
	padding: 0 1.5em 0 1.5em;
}
.caption {
	text-align: center;	
	margin: -3px 0 0 0;
}
.letUs {
	text-align: center;
	padding: 2% 5% 5% 5%;
	width: 85%;
}

.mainHead { 
	font-size: 1.15em;
	padding: .7500em 0 .7500em 0; 
	color: #f4a460; 
	text-shadow: 1px 1px 1px #666; 
}
.capName { 
	text-transform: uppercase; 
	padding: 0 0 -25em 0;
}
#perfH { 
	/*font-size: 15px; */
	/*font-size: .9375em;*/
	/*font-size: 1em;*/
	font-size: 90%;
	/*font-size: .75rem;*/
	padding: .5% 0 .5% 0; 
}
#perfF { 
	/*font-size: 15px; */
	/*font-size: .9375em;*/
	font-size: 90%;
	/*font-size: .75rem;*/
	padding: .5% 0 .5% 0; 
}
.logoUp { padding: -30px 0 0 0; }

.contact {  
	padding: 8px 0 0 0; 
}
/* MASTER TEXT */
h1 {
	color: #333333;
	margin: 0 2.5% .05% 2.5%;
	/*padding-top: 1%;*/
	font-size: 100%;
	font-weight: normal;
	letter-spacing: normal;
	text-align: center;
	
	width: 95%;
}
h2 {
	color: #333333;
	margin: 0 2.5% .05% 2.5%;
	font-size: 95%; 
	font-weight: normal;
	letter-spacing: normal;
	text-align: center;
	
	width: 95%;
}

h3 {
	color: #333333;
	margin: 0 2.5% .05% 2.5%;
	font-size: 85%; 
	font-weight: normal;
	letter-spacing: normal;
	text-align: center;
	width: 95%;
}
p {
	color: #333333;
	margin: 1% 3% 3% 3%;
	/*font-size: 15px;*/
	/*font-size: 100%;*/
	font-size: 1em;
	font-weight: normal;
	letter-spacing: normal;
	line-height: 156.25%;
}
ul { 
	display: inline-block;
	font-size: 100%;
	font-weight: normal;
}

li {
	color: #333333;
	margin: 0 0 .8px 0;
	font-size: 100%;
	font-weight: normal;
	line-height: 100%;
}

a:link { 
/*cornflowerblue*/
	color: #6495ed;
	font-weight: bold;
	text-decoration: none;
	margin: 0 0 0 0;
	text-align: center;
}
a:visited { 
/*cornflowerblue*/
	color: #6495ed;
	font-weight: bold; 
	text-decoration: none;
	margin: 0 0 0 0;
}
a:hover {
/*purpleblue*/
	color: #4b0082;
	text-decoration: underline;
}	
#active { 
/*sandybrown*/
	color: #f4a460;
	text-decoration: none;
  	pointer-events: none;
}
/* _________________*/
/*     HEADER     */
.header {
   /*white*/ 
    background-color: rgba(244,244,244,.6);
    -moz-border-radius: 25px 25px 25px 25px; 
    border-radius: 25px 25px 25px 25px;
	margin: 1% 2% 2% 3%;
	padding: 2% 5% 2% 5%;
	text-align: center;
    
   	position: relative;
	overflow: hidden;
    width: 80%;  
}

/* _______________ */
/*    NAVIGATION   */
.navigation { 
/*dark blue*/ 
   background-color: #1981BD;
    -moz-border-radius: 25px 25px 25px 25px; 
    border-radius: 25px 25px 25px 25px;
	text-align: center;
	margin: 1% 2% 0 3%;
	padding: 0 .0625em 0 .0625em;
	position: relative;
	width: 90%;
}
.navigation ul { 
	display: inline-block;
	text-align: center;
	/*margin: 0 1% 0 1%;*/
	/* margin: 0 auto; */
	padding: 0 0 0 0;
	list-style: none;
	
	width: 92%;
}
.navigation li { 
	color: #ffffff;
	display: inline-block; 
	text-align: center;
	margin: 1% 1% 1% 1%;
	padding: 0 0 0 0;
    font-weight: bold;
	white-space: nowrap; 
} 
.navigation a:link { 
/*cornflowerblue*/
	/*color: #6495ed;*/
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	/*margin: 0 3% 0 3%;*/
	padding: 0 5% 0 5%;
	text-align: center;
}
.navigation a:visited { 
	/*  white  */
	color: #fff;
	font-weight: bold; 
	text-decoration: none;
	/*margin: 0px 5px 0px 5px;*/
	padding: 0 5% 0 5%;
}
.navigation a:hover {
/*purpleblue*/
	color: #4b0082;
	text-decoration: underline;
	padding: 0 5% 0 5%;
}

/* ___________________*/
/* NEW CONSTRUCTION & INTRO */
.intro { 
    /* blue */
    background-color: rgba(171,212,241,0.5);
    -moz-border-radius: 25px 25px 25px 25px;
    border-radius: 25px 25px 25px 25px;
	margin: 0 auto;
	padding: 5px 0 5px 0;
	
    text-align: left;
    position: relative;
    overflow: hidden;
	clear: both;
	width: 63%;
}

/* _________________ */
/* ABOUT */

.about { 
/* peach */
    background-color: rgba(249,172,105,.2);
    -moz-border-radius: 25px 25px 25px 25px; 
    border-radius: 25px 25px 25px 25px;
	margin: 0 auto;
	padding: 2% 2% 2% 2%;
 
    text-align: left;
    position: relative;
    overflow: hidden;
	clear: both;
	width: 52%;
}

/* ______________*/
/* FLOATER */

.floater {
    /*off white*/ 
    background-color: rgba(244,244,244,.6);
    -moz-border-radius: 25px 25px 25px 25px; 
    border-radius: 25px 25px 25px 25px;

	margin: 0 auto;
	padding: 1% 2% 5% 2%;
	
    float: center;
	display: inline-block;
	font-size: 100%;
    position: relative;
	text-align: center;
	width: 85%;
}

/* ______________*/
/* FLOATEE work photos */
.floatee {
	display: inline-block;
    padding: 1% 0 1% 0;
	text-align: left;
	font-size: 100%;
	vertical-align: text-bottom;
	width: 215px;
}
.floatee h1 {
    clear: both;
    text-align: center;
	padding: 3% 0 2% 0;
    width: 95%;
}
.floatee h2 {
    clear: both;
    text-align: center;
	padding: 0;
    width: 95%;
}
.floatee p {
	padding: 0 0 0 0;
	line-height: 22px;
	/*font-size: 100%;*/
	font-size: 1em;
	width: 95%;
}
.workImage {
	margin-top: 3%;
	vertical-align: bottom;
	width: 100%;
}

/* ___________________*/
/* FOOTER */    
.footer {
/*off white*/ 
    background-color: rgba(244,244,244,.6);
    -moz-border-radius: 25px 25px 25px 25px;
    border-radius: 25px 25px 25px 25px;
	
	margin: 0 auto;
	padding: 3% 0 3% 0;
	clear: both;
	text-align: center;
    
	position: relative; 
	overflow: hidden;
 
    width: 89%;
}
.footer p.updated { 
	text-align: center;
	font-size: .8125em; 
	margin: 10px 0 10px 0;
	padding: 0 0 5px 0;
}

/* ___________________*/
/* MEDIA SCREEN 600px  */
/* ___________________*/
/* MEDIA SCREEN 600px  */
/* ___________________*/
/* MEDIA SCREEN 600px  */

@media screen and (max-width: 600px) {
 .navigation {
 display: none;
}
.navMenu { display: inline-block; }

/* ____________________*/
/* NAVIGATION MENU */
.main { font-size: .5em; }
.sidenav {
	height: 100%;
	width: 0;
    position: fixed;
    z-index: 1;
	top: 0;
	left: 0;
	background-color: #87AECF;
    overflow-x: hidden;
    transition: 0.5s;
	padding-top: 60px;
}
.sidenav a {
	padding: 8px 8px 8px 8px;
    text-decoration: none;
	font-size: 19px;
	color: #fff;
    display: block;
    transition: 0.3s;
}
.sidenav a:hover {
	color: #7557B7;
	text-decoration: underline;
}
.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 15px;
	font-size: 36px;
    margin-left: 50px;
}
/* ____________________*/
/* ADJUSTMENTS 600px*/

/*  HEADER */
.header { 
	margin: 0 2% 2% 2%; 
	padding: 0% 2% 3% 2%; 
	width: 90%; 
}

/* NEW CONSTRUCTION */
.intro { 
	margin: 2% 2% 0 2%; 
	padding: 2% 2% 2% 3%; 
	width: 90%; }

/*   ABOUT   */
.about { 
	margin: 0 1% 0 2%; 
	padding: 2% 3% 0 3%; 
	width: 90%; }

/*  FLOATER  */
.floater { 
	margin: 2% 3% 2% 3%; 
	padding: 1% 2% 0 2%; 
	width: 90%; }

.floatee h1 { 
	margin: 0 2% 2% 2%; 
	padding: 5% 2% 10% 2%; 
	width: 90%; }

/*   FOOTER    */
.footer { 
	/*margin: 2% 6% 2% 3%;*/ 
	margin: 0 auto;
	padding: 4% 0 4% 0;
	width: 89%; }
}

