/*IM 2.00, Site Lite CSS Hyssop Production*/
/*general use CSS, no not modify--------------------------------------------------------------------------------------*/
.font-xxl {font-size:xx-large;}
.font-xl {font-size:x-large;}
.font-l {font-size:large;}
.font-m {font-size:medium;}
.font-s {font-size:small;}
.font-xs {font-size:x-small;}
.font-xxs {font-size:xx-small;}

.left {text-align:left;}
.center {text-align:center;}
.right {text-align:right;}

.indent {text-indent:15px;}
.exdent {text-indent:-15px;}

.shift-r {position:relative; left:15px;}

.underline {text-decoration:underline;}
.bold {font-weight:bold;}
.unbold {font-weight:normal;}
.ital {font-style:italic;}

.border-0 {border-width:0;}
.border-1 {border:1px solid #000000;}

.float-left {float:left;}
.float-right {float:right;}
.clear-left {clear:left;}
.clear-right {clear:right;}
.clear-both {clear:both;}

.error {color:red; text-decoration:underline;}
.validator, .validator a:link, .validator a:visited {font-size:xx-small; text-align:left; background-color:#fff; color:#000; text-decoration:none;}
.validator a:hover {text-decoration:underline; color:#f00;}

body {
font-family:Verdana, Arial, Helvetica, sans-serif;
padding:20px;
margin:0;
background-color:#002e5b;
text-align:center;
}

#container {
max-width:1000px; /*page width*/
margin:0px auto; /*centers main divs*/
overflow:hidden;
background-color:#fff;
color:#ac5600;
font-size:0.75em;
}

#header {
text-align:left;
padding:20px 0px 0px;
margin:0px;
height:210px;
}

#main-wrapper {
padding:30px;
margin:0px;
}

/*uncomment declarations in next ID to accomodate sidebar(s), adjust width and margin-left per design in the next 3 IDs*/
#main-content {
padding:0px;
margin:0px;
text-align:left;
/*float:left;
display:inline;
width:700px;
margin-left:150px;*/
}

#left-sidebar {
float:left;
padding:0px;
margin:0px;
width:150px;
margin-left:-850px;
}

#right-sidebar {
float:left;
padding:0px;
margin:0px;
width:150px;
}

#footer {
clear:both;
text-align:center;
padding:0px 0px 20px;
margin:0px;
}

fieldset {
border-width:0px;
}

legend {
display:none;
}

/*contact form CSS--------------------------------------------------------------------------------------*/
#con-form {
width:600px; /*contact form width*/
text-align:right;
}

#con-form input, #con-form textarea {
padding:1px;
margin:1px;
}

/*menu links CSS--------------------------------------------------------------------------------------*/
div.links-main {
background-image:url(images/menu-bg.png);
background-position:bottom;
background-repeat:repeat-x;
border-top:1px solid #000;
border-bottom:1px solid #000;
height:24px;
margin-top:15px;
}

div.links-main ul {
float:left;/*remove to left justify menu*/
position:relative;
left:50%;
padding:0px;
margin:0px;
}

div.links-main ul li {
float:left;
position:relative;
right:50%;
padding:0px;
margin:0px;
list-style:none;
}

div.links-main a:link, div.links-main a:visited {
padding:0px 20px;
display:block;
font-size:16px;
line-height:24px;
font-weight:bold;
color:#ccc;
text-decoration:none;
}

div.links-main a:hover, div.links-main a:active, div.links-main a:focus {
background-image:url(images/menu-bg.png);
background-position:center;
background-repeat:repeat-x;
}

div.links-main a:active, div.links-main a:focus {
background-position:top;
outline:0;
}

/*--------------------------------------------------------------------------------------*/
div.links-sec ul {
float:left;/*remove to left justify menu*/
position:relative;
left:50%;
padding:0px;
margin:0px;
}

div.links-sec ul li {
float:left;
position:relative;
right:50%;
padding:0px 5px;
margin:0px;
display:block;
list-style:none;
font-size:12px;
line-height:20px;/*accommodates 20px icon*/
}

div.links-sec a {
color:#000;
text-decoration:none;
background-color:transparent;
}

div.links-sec a:hover {
text-decoration:underline;
}

.soc-media img {
border-width:0px;
}

.soc-media {
display:inline;
}

/*tool tips CSS--------------------------------------------------------------------------------------*/
a.info span.info {
display:none;
}

a.info:hover span.info {
display:block;
position:absolute;
top:1.3em;
left:0;
width:968px;
border:1px solid #000;
background-color:#fff;
color:#000;
padding:5px;
font-size:small;
text-decoration:none;
z-index:100;
}

/*copyright notice CSS--------------------------------------------------------------------------------------*/
#copyright {
clear:both;
font-size:10px;
color:#000;
}

/*custom CSS, add additional CSS declarations here--------------------------------------------------------------------------------------*/
a:link, a:visited {
color:#ac5600;
}

a:hover {
background-color:#ccc;
}

p {
margin:0px;
padding-bottom:20px;
text-align:justify;
}

ul {
margin:0px;
padding:0px 0px 20px 10px;
}

img {
max-width:100%;
vertical-align:middle;
border:0;
}

a img {
border-width:0px;
}

.img-left, .img-right {
float:left;
margin:0px 20px 20px 0px;
padding:2px;
border:1px solid #ccc;
text-align:center;
color:#000;
font-size:0.9em;
}

.img-right {
float:right;
margin:0px 0px 20px 20px;
}

.slideshow {
float:left;
width:70%;
height:0;
padding-bottom:52.5%;
overflow:hidden;
}

.slideshow object {
max-width:100%;
}

.text-box-30, .text-box-70 {
float:left;
border:2px dashed #dce2e8;
xmargin:0px;
xpadding:20px 20px 0px;
background-color:#f2f9ff;
xoverflow:hidden;
}

.text-box-30 {
width:30%;
xmargin:0px auto;
}

.text-box-70 {
width:70%;
xmargin:0px auto;
}

#video-portfolio, #web-portfolio {
position:relative;
left:5px;
width:715px;
margin:0px auto;
text-align:center;
}

#web-portfolio div {
float:left;
width:225px;
margin:0px 5px;
text-align:left;
}

#web-portfolio div p {
font-weight:bold;
}

#video-portfolio p {
overflow:hidden;
}

#video-portfolio object {
float:left;
margin:0px 20px 20px 0px;
padding:0px;
}

#tag-line {
font-style:italic;
font-size:0.9em;
text-align:center;
border:1px solid #aaa;
margin:0px 0px 20px 0px;
padding:3px;
}

object {
outline:0;
}

/*narrow CSS--------------------------------------------------------------------------------------*/
@media (max-width:30em) {
.float-right, div.links-main ul, div.links-main ul li {
float:none;
}
}