/* =-=-=-=-=-=-=-=-=-==-=-==-=-==-=-=
css from services.php

thewei.com principle css file
FileName:   thewei.css
Created:    20070119
Revised:    20110430

~~~~~~~~~~~~~~~~~~~~~~
Current Colors
~~~~~~~~~~~~~~
cd4d27	orange-red front accents
f2df91	beigey background-color
f1c178	tiger deep beige-orange
f7d191	tiger light beige
FAF3D8	article background-color
4f6899	Deep Blue
92A621	medium bright olivey green
7EA928	same
a88200	Delicious orangey-brown
F99E16	Orangey header type
557288
D16F2E	lighter orange-red
006699
009F07
819dba	pale blue
897171
646262	medium gray
DC7F3C	palish burgundy
A58A6F	green for nav links
A58A6F	brown for nav links
cd4d27	red background-color
A08C72	Link knock-out
E7E0D9	Grayish-light background-color
f1c178	Whitish background-color

-=-=-=-=-=-=-=-=-=-=-=-=-==-=-==-=-==-=-= */

 



/*   FUNDAMENTAL
-=-=-=-=-=-=-=-=-=-=-=-=-=-=--=-=-=-=-=-= */

body {
    margin: 0;
    padding: 0;
    font-size: 80%;
    line-height: 135%;
    font-family: verdana, geneva, arial, sans-serif;
    font-weight: normal;
    text-transform: none;
    color: black; background-color: #f1c178;  
    /*min-width: 960px; max-width: 1200px;*/
    }
p {	
	margin: 0;
	padding-bottom: .6em;
	}
ul, ol  { 
	margin: 0 0 .5em;
	padding: 0;
	}
li {
	list-style-position: inside;
	}
a {	
	text-decoration: none;
    outline: none;
	color: #557288; background-color: transparent; 
	font-weight: 600;
	}
a:visited {
	color: #A08C72; background-color: transparent;
	/*border-bottom: 1px dotted #A08C72;*/
	}
/*a:hover, a:focus { 
	color: #f1c178; background-color: #A08C72;
	}
img {	
    display: block;
    border-width: 0;
	}*/

/* BLOCKS
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=--=-=-=-=-=-= */	
#page {
	width: 100%;
	height: 100%;
	top: 0; left: 0;
	position: absolute;
	z-index: 1;
	}
#pagegrfx {
	background: #d58e54 url('../grfx/tiger.jpg') no-repeat left top; 
	float: left;
	height: 505px; width: 289px;
	border-left: 1px solid #cd4d27;
	border-top: 9px solid #cd4d27;
	border-bottom: 9px solid #cd4d27;
	position: fixed;
	left: 36px;
	z-index: 0;
	}
#wrap { 
	/*overflow: visible;*/
	width: 69%;
	margin: 0 0 4em 350px;
	padding: 0;
	color: #646262; 	
	background-color: #f7d191;
	}
#header {
	position: fixed;
	left: 350px; top: 0;
	width: 69%;
	min-height: 9.5em;
	margin: 0 auto;
	border-top: 9px solid #cd4d27;
	background-color: #f7d191;
	}
#header ul {
	list-style-type: none;
	/*overflow: hidden;
	display: inline;*/	
	}
#content {
    margin: 9.5em 0 2em;
    padding: .5em 0 12em;
    color: #897171;
	}
#content .onecol {
	padding: 0 10em;
	}
#content p {
	text-align: justify;
	}
#intro {
  height: 130px;
  width: 68%;
  margin: 0 auto 1em;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  resize: both;
  overflow: auto;
  color: #4f6899;
  position: relative;
  top: 8em;
}
#intro img {
	display: inline;
	margin-right: 3.2em;
	}
#intro p {
  text-align: justify;
  color: #557288;
  font-weight: 600;
  }
#singlecol { /*replaced by onecol class?*/
    text-align: left;
    margin: 1em 10em;		
    padding: 1.8em 3.2em;
    color: #646262; background-color: #f7d191; 
	}

/* NAVIGATION 
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=--=-=-=-=-=-=- */
	
/* =-=-=-=-=-=-= MY TOPNAV -=-=-=-=-=-=-= */
.leftlogo {
	position: fixed;
	top: 22px; left: 376px;
	}
.topnav {
	width: 60%;
	float: left;
	margin: 0 auto;
	padding: 0;
	font-size: 90%;
	}
.topnav li {
	float: left;
	margin: 1.8em .2em .08em 0;
	/*added for dropdown functionality*/	
	position: relative;
	top: 1.1em; left: 135px;
	display: block;
	transition-duration: 0.5s;
	}
.topnav li a {
	text-align: center;
    border: none;
    margin-top: .9em;
    padding: .5em 1em .6em 1.3em;
    color: #f7d191; background-color: #557288;
    font-weight: 600;
    text-decoration: none;	
    }
.topnav ul li#here a {
	color: #f7d191; background-color: #cd4d27;
	}	
.topnav ul li#last {
	padding-right: 0;
	}
.topnav a:visited {color: #f7d191}
.topnav a:hover, .topnav ul.sub a:hover, .topnav li.subhdr a:hover {
	color: #f7d191; background-color: #cd4d27;
	}
/*=-=-=-=-=-=-= END MY TOPNAV =-=-=-=-=-= */

/*=-=-=-=-=-=-=-= START 2-TIER TOPNAV =-=-=-=-=-=-
.topnav ul {
	background: darkorange;
    list-style: none;
    margin: 0;
    padding-left: 0;
}
.topnav li {
	color: #fff;
	background: darkorange;
	display: block;
	float: left;
	padding: 1em;
	position: relative;
	text-decoration: none;
	transition-duration: 0.5s;
}
.topnav li a {
  color: #fff;
} */

/*.topnav li:hover,
.topnav li:focus-within {
    background: red;
    cursor: pointer;
}
.topnav li:focus-within a {
  out.topnav line: none;
}
.topnav ul li ul {
	display: block;
	visibility: hidden;
	opacity: 0;
	min-width: 5em;
	position: absolute;
	transition: all 0.5s ease;
	margin-top: 1.5em;
	padding: 0;
	left: 0;
	display: none;
}
.topnav ul li ul li {
	margin-top: 1.2em;
	padding: .05em 0 0;
	}
.topnav ul li:hover > ul,
.topnav ul li:focus-within > ul,
.topnav ul li ul:hover,
.topnav ul li ul:focus {
   visibility: visible;
   opacity: 1;
   display: block;
}
.topnav ul li ul li {
	clear: both;
	width: 100%;
}*/

.topnav li:hover,
.topnav li:focus-within {
    background: red;
    cursor: pointer;
}
.topnav li:focus-within a {
  out.topnav line: none;
}
.topnav ul li ul {
	display: block;
	visibility: hidden;
	opacity: 0;
	min-width: 5em;
	position: absolute;
	transition: all 0.5s ease;
	margin-top: 1.5em;
	padding: 0;
	left: 0;
	display: none;
}
.topnav ul li ul li {
	margin-top: 1.2em;
	padding: .05em 0 0;
	}
.topnav ul li:hover > ul,
.topnav ul li:focus-within > ul,
.topnav ul li ul:hover,
.topnav ul li ul:focus {
   visibility: visible;
   opacity: 1;
   display: block
}
.topnav ul li ul li {
	clear: both;
	width: 100%;
}


/*=-=-=-=-=-=-=-= END 2-TIER TOPNAV =-=-=-=-=-=- */


	
/*.socialnav {
	float: right;
	}
.socialnav li {
	float: left;
	margin: 0 .2em .05em 0;
	}
.socialnav li a {
    display: block;
    border: none;
    padding: .12em 1em .3em 1.3em;
    color: #557288; background-color: transparent;
    font-weight: 600;	
    }*/

#socialnav {
	float: right;
	}
#socialnav ul {
	display: inline;
	overflow: auto;
	}
#socialnav ul li {
	float: left;
	}
#socialnav ul li a i {
	background-color: transparent;
	color: #557288;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	font-size: 1.4em;
	text-align: center;
	margin-right: .5em;
	padding-top: .5em;
	}
	
/* BOTTOM NAVIGATION
=-=-=-=-=-=-=-=-=-=-=-=-=-=--=-=-=-=-=-= */
#footer {
    text-align: center;
    margin: 2.5em auto 360px;
    padding: 0 0 0 0;
    font-size: 80%; line-height: 1.6em; 
    color: #ff7123; background-color: transparent;
    }
#footer p {
	text-align: center;
    margin: 2.5em auto 360px;
	}
#footer li {
    display: inline;
	}


/* CONTENT ELEMENTS
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=--=-=-=-=-=-=- */

.boxes {
	display: flex;
	align-items: stretch;
	background-color: #f7d191;
	}
.box { 
	display: flex;
	flex-flow: column;
	margin: .3em; 
	/*border: .15em solid #cd4d27;*/
	color: #557288; background-color: #f7d191;
	}
.box.third {
	flex: 1 1 auto;
	width: 31%
	}
/*.boxright {
	float: right;
	margin: 1em 0 1em 2em;
	}
.boxleft {
	float: left;
	margin: 1em 2em 1em 0;
	}*/
.box p {
	flex-basis: 100%; 
	padding: 1em 1.5em;
	font-size: 90%;
	text-align: justify;
	color: #f7d191; background-color: #cd4d27;
	}
.box h1 {
	text-align: center;
	margin: 0 auto .35em;
	padding: .25em 0 .1em;
	font-size: 1.1em;
	color: #4f6899; background-color: #f7d191;
	}
.box h2 {
	display: inline;
	margin: 0;
	padding: .5em 0 0;
	color: #f7d191; background-color: #cd4d27;	
	}
.box a {	
	text-decoration: none;
    outline: none;
    color: #f1c178; background-color: transparent;
	font-weight: 600; }
	.box a:visited {color: #DDC6AB; background-color: transparent;}
	.box a:hover, .box p a:hover { 
	color: #646262; background-color: transparent;
		}

/* LISTS 
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=--=-=-=-=-=-=- */

ul.bullet , ul.bullet li, ul.bullet li p {
	list-style: square;
	list-style-position: inside;
	text-align: left;
	}
ul.inset p {
	margin-left: 1.5em;
	padding: 0
	}
ul.inset li {
	list-style-type: square;
	padding: 0 0 .4em 0;
	}
ul.nolead {
	padding: 0; 
	}
ul.indentone li {
	margin-left: 2em;
	}
	

/* HEADINGS
-=-=-=-=-=-=-=-=-=-=-=-=-=-=--=-=-=-=-=-=-=-=*/	
h1 {	
    margin: 1.7em 0 1em;
    padding: 0;
	color: #cd4d27; 
	font: 700 1.35em/135% tahoma, sans-serif;
	}
h2 { 
	display: inline;
	text-align: center;
	color: #006699; background-color: transparent; 
	font: 900 1.1em/135% tahoma, sans-serif;
	}
h3 {
	text-align: center;
    margin: 1em 0 .6em;
    padding: 0;
	color: #cd4d27; background-color: transparent;
    font: 900 1.2em/135% tahoma, sans-serif;
	}
h4 {
    text-align: left;
    margin: .3em 0;
    padding: 0;
    color: #006699; background-color: transparent;
    font: 900 1.1em/135% tahoma, sans-serif;
  	}
h5 {
	text-align: center;
	margin: 2.5em 0 1em 0;
	color: #819dba;
	font-size: 150%; line-height: 90%
	}
h6 {
	margin: .2em 0 .08em 0;
	padding: 0;
	color: #869395;
	font-size: 1em; line-height: 90%;
	}
	

/* Gallery 
=-=-=-=-=-=-=-=-=-=-=-=-=-=--=-=-=-=-=-= */
.galhdr a {
	text-align: right;
	float: right;
	margin: 2em 2em 0 0;
	color: #4f4f4f;
	}
	
.gallery {
	text-align: center;
	margin: 0 auto 0;
	}
.gallery h1 {
	text-align: center;
	margin: 1em 0 1em 0;
	color: #CC6; 
	font-size: 1.4em;
	line-height:140%;}
.gallery h4 {
	margin: 0;
	padding: 0;
	color: #4f4f4f; 
	font-weight: 900; 
	}
ul.thumbs {
	vertical-align: top;
	text-align: center;
	margin: .8em auto 1em;
	padding: 0;
	}
ul.thumbs li {
	display: inline;
	width: 50%;
	height: 12em;
	margin: 0 2em 5em;
	padding: 0 0 1em;
	}

ul.caption li {
	margin: 2em auto 1em;
	padding: 0;
	font-size: .9em;
	line-height:135%;
	}
ul.caption img {
	padding-bottom: .4em;
	}


/*~~~~~~~EXTRAS ~~~~~~~~~~~~~*/

.center, .ctr {	
	text-align: center;
	margin: 0 auto;
	}
.clearall {
    clear: both;
	}
.fright {
	float: right;
	}
.fleft {
	float: left;
	}
.pullquote {
    margin: 0 25px;
    font-style: italic; 
	}
.tight {
	margin-bottom: 0;
	padding-bottom: 0;
	}
.imgleft {
	margin-right: 1.5em;
	margin-bottom: 1.5em;
	}
.block {
	display: block;
	}
.inline {
	display: inline;
	}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/