body { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 62.5%; color: #333333; height: 100%; text-align: center; margin-top: 20px; background: #79A8BC; }
#container { position: relative; width: 960px; margin-right: auto; margin-left: auto; background-color: #FFFFFF; border: 1px solid #FFFFFF; }
#header { position: relative; margin-right: auto; margin-left: auto; margin-top: 0px; top: 10px; }
#nav { position: relative; font-size: 1.2em; margin-bottom: 50px; margin-right: auto; margin-left: auto; width: 920px; top: 20px; }
#content { position: relative; font-size: 1.2em; line-height: 1.5em; height: auto; margin-bottom: 40px; text-align: justify; width: 920px; margin-right: auto; margin-left: auto; }
a:link { color: #333333; text-decoration: underline; }
a:visited { color: #333333; text-decoration: underline; }
a:hover { color: #006699; text-decoration: none; }
h1 { width: 100%; color: #4A7E95; font: 1.5em/1.9em Verdana, Arial, Helvetica, sans-serif; padding-top: 20px; border-bottom: 1px dotted #79A8BC; }
h2 { color: #4A7E95; margin-bottom: -.5em; font: bold 1.2em/1.5em Verdana, Arial, Helvetica, sans-serif; }
h3 { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 1.2em; font-weight: bold; margin-bottom: 0em; border-bottom-width: 1px; border-bottom-style: dotted; border-bottom-color: #000000; line-height: 1.5em; background-image: url(file:///F|/webclients/peewees/website/assets/template/h2-graphic.gif); background-attachment: fixed; background-repeat: no-repeat; background-position: left bottom; color: #333333; text-align: left; margin-top: 2em; letter-spacing: 0.2em; }
h4 { color: #009999; font-size: 1.2em; letter-spacing: 0.3em; margin-bottom: -1em; }
.footer { font-weight: normal; color: #990000; font-size: 1em; height: auto; vertical-align: middle; margin-bottom: 15px; text-align: center; padding-top: 2px; padding-bottom: 2px; width: 100%; clear: both; }
.note { font-size: 1em; font-style: italic; line-height: 1.8em; }
.foot-logo {
    margin-bottom: 20px;
    margin-top: 20px;
}
.note2 { font-style: italic; line-height: 1.8em; color: #006666; margin-top: 1em; }
.footer a { color: #990000; text-decoration: none; }
.footer a:visited { color: #990000; text-decoration: none; }
.footer a:hover { color: #000000; text-decoration: underline; }
.photo { margin-right: 20px; float: left; clear: left; margin-bottom: 5px; }
#dwd { padding-top: 15px; }
#frame { position: relative; width: 960px; margin-right: auto; margin-left: auto; background-color: #FFFFFF; border: 5px solid #FFFFFF; }
.photo-right { float: right; clear: right; margin-bottom: 5px; margin-left: 40px; }
.rightcol { width: 340px; float: right; border-left: 1px solid #CCCCCC; margin-bottom: 20px; margin-left: 20px; background: #F1F5F8; padding: 10px; font-size: .95em; }
/************new styles***************/
.homeBottom { display: block; clear: both; float: left; width: 100%; max-width: 100%; margin-bottom: 15px; }
#projectleft { width: 510px; float: left }
.gallery img { max-width: 100%; height: auto; }
.contactleft { float: left; margin-bottom: 20px; }
.srviceleft { float: left; margin-bottom: 20px; width: 535px; }
@media (max-width:979px) and (min-width:768px) {
body { max-width: 100%; }
#container { width: 100%; max-width: 100%; }
#header img { width: 100%; max-width: 100%; height: auto; }
#nav { width: 100%; margin-bottom: 30px; }
#content { width: 98%; padding: 0 1%; }
#content iframe { width: 100%; max-width: 100% }
.homeBottom img { width: 32%; float: left; margin-right: 1.5%; height: auto; }
.homeBottom img:nth-of-type(3) { margin-right: 0 }
.homeBottom img:nth-of-type(2) { position: relative; right: 2px; }
.footer { width: 100%; height: auto }
#content h2 { font-size: 13px; }
.serviceImg { height: auto; width: 160px; max-width: 100%; }
.gallery { width: 50% !important; padding-left: 0 !important; padding-right: 0 !important }
.srviceleft { width: 355px; }
.fiberImg { width: 160px; height: auto; }
#projectleft { width: 360px; float: left; }
.photo-right { width: 335px; margin-top: 15px; }
.gallery-caption { width: 100% !important; padding: 3px 0 !important }
}
@media (max-width:1024px) {
.footer { width: 100%; }
}
@media (max-width:767px) {
#container { width: 100%; max-width: 100%; }
#header img { width: 100%; max-width: 100%; height: auto; }
#nav { width: 100%; margin-bottom: 30px; z-index: 999; position: relative }
#content { width: 98%; padding: 0 1%; }
#content iframe { width: 100%; max-width: 100% }
.footer { width: 100%; height: auto }
#services .rightcol { width: auto; float: left; margin-left: 0; }
.srviceleft { width: 100%; }
}
@media (max-width:767px) and (min-width:640px) {
.homeBottom img { width: 32%; float: left; margin-right: 1.5%; height: auto; }
.homeBottom img:nth-of-type(3) { margin-right: 0 }
.homeBottom img:nth-of-type(2) { position: relative; right: 2px; }
#services .rightcol img { width: 49%; height: auto; vertical-align: top; }
#services .rightcol img:nth-of-type(1) { margin-bottom: 10px }
#services .rightcol img:nth-of-type(2) { margin-bottom: 10px; position: relative; bottom: 2px; }
#services .rightcol img:nth-of-type(4) { position: relative; left: 6px; }
.gallery { width: 48% !important; padding-left: 0px !important; padding-right: 0px !important; vertical-align: top; }
.gallery img { width: 215px; height: auto; }
.gallery-caption { width: 100% !important; padding: 3px 0 !important }
#projectleft { width: 350px !important; margin-bottom: 20px; }
.photo-right { width: 220px; height: auto; margin-top: 15px; }
}
@media (max-width:639px) {
.homeBottom img { width: 100%; float: left; margin: 0 0 10px; height: auto; }
#nav { display: block; clear: both; float: left; width: 100%; z-index: 1; margin-bottom: 10px; }
#p7PMnav { display: block; clear: both; float: left; width: 100%; }
#p7PMnav li { float: left; width: 100% !important; }
#p7PMnav a { padding: 10px !important }
#content { display: block; clear: both }
.rightcol { width: auto; float: left; margin-left: 0; }
#content h1 { font-size: 14px; display: block; clear: both; float: left; }
#services .rightcol img { width: 100%; height: auto; margin-bottom: 10px; }
.serviceImg, .fiberImg { height: auto; width: 146px; max-width: 100%; display: inline-block; float: none; margin: 0 auto; }
.gallery { width: 100% !important; padding: 0 !important }
.gallery img { width: 96%; height: auto; float: none; margin: 0 auto }
.gallery-caption { width: 100% !important; padding: 3px 0 !important }
#projectleft { width: 100% !important; margin-bottom: 15px; float: none !important; }
.photo-right { width: 100%; height: auto; }
}