﻿/* Base Style
-------------------------------------------------------*/

@import url(http://reset5.googlecode.com/hg/reset.min.css);

@font-face {
font-family: "futuraheavy";
src: url(futuraheavy.ttf)
     url(futuraheavy.otf)
     url(futuraheavy.svg)
}

body {
background-color:#fff200;
font-family: "futuraheavy", Arial, Sans-Serif;
}

article {
padding: 10px;
}


#container {
position: relative;
max-width: 1200px;
padding: auto;
margin: auto;
border-style: solid;
border-width: 0px 0px 0px 1px;
border-color: #fff45f;
box-shadow: 10px -10px 20px #ee3d96;
}


header li {
float: left;
list-style-type: none;
padding: 10px;
}

#headerleft {
display: block;
position: absolute;
top: 0;
left: 0;
}

#headermiddle {
display: block;
float: left;
height: 70px;
}

#headermiddle img {
margin: auto;
}


#headerright {
display:block
position: absolute;
top: 0;
right: 0;
hieght: 70px;
}

#headerright li {
float:right;
display: block;
background-image: url(liback.png);
background-repeat: no-repeat;
background-position: center;
line-height: 70px;
text-align: center;
padding: 0px 10px 0px;
width: 80px;
height: 70px;
}

#headerright li a {
display: block;
text-decoration: none;
font-weight: bold;
color: #ffffff;
width: 80px;
height: 70px;
}

#headerright li a:hover {
display: block;
box-shadow: 3px 3px 3px #222222;
}

#headerright li a:active {
display: block;
background-image: url(hover.png);
background-repeat: no-repeat;
background-position: center;
width: 80px;
height: 70px;
}

#upmain {
clear: both;
min-height: 600px;
}

#maintopleft {
float:left;
width: 300px;
height: 600px;
}

#maintopright {
height: 600px;
margin-left: 300px;
}

#optimallogo {
height: 360px;
width: 416px;
padding: 120px 0px;
margin: auto;
}

#middle {
clear:both;
position: relative;
background-color: #f26522;
}

#middle h1 {
font-size: 2.5em;
margin: .83em;
text-shadow: 3px 3px 4px #333333;
}

#middle h2 {
font-size: 2em;
margin: .83em;
text-shadow: 3px 3px 4px #333333;
}

#middle h3 {
font-size: 1.5em;
margin: .83em;
text-shadow: 3px 3px 4px #333333;
}

#middle p {
font-size: 1.17em;
margin: .83em;
}

#content {
color:#ffffff;
background-color: #f26522;
max-width: 1200px;
margin: auto;
border-style: solid;
border-width: 0px 0px 0px 1px;
border-color: #f58220;
box-shadow: 10px 0px 20px #f58220;
}

#servicenav li {
display: block;
float: left;
list-style-type: none;
border-style: solid;
border-width: 2px 2px 2px 2px;
border-color: #f58220;
}

#servicenav li a {
display: block;
text-decoration: none;
font-weight: bold;
color: #ffffff;
padding: 10px;
}


article {
clear: both;
}

#lower {
max-width: 1180px;
min-height: 100px;
padding: 10px;
margin: 0px auto 20px;
border-style: solid;
border-width: 0px 0px 0px 1px;
border-color: #fff45f;
box-shadow: 10px 15px 20px #ee3d96;
}

#lower li {
list-style-type: none;
}

#lowerleft {
display: block;
width: 110px;
}

#lowerright {
display: block;
margin: auto;
}


/* 320px and up
-------------------------------------------------------*/

/* 480px and up
-------------------------------------------------------*/

/* 600px and up
-------------------------------------------------------*/

/* 600px-767px
-------------------------------------------------------*/

/* 768px
-------------------------------------------------------*/