html, body { height: 100%; }
#aspnetForm { height: 100%; }
body { background-color: #fff; color: #555; font-family: 'Quattrocento Sans', 'Arial', Sans-Serif; line-height: 1.8em; font-weight:normal; font-size: 14px; margin: 0px auto; }
#wrap { min-height: 100%; margin-bottom:-80px;}
#wrap:after  { display:block; }
#main { overflow:hidden; padding-bottom: 80px; }
.page { width: 1080px; margin: 0px auto; padding:0px 10px; }

#header { width:100%; height:44px; background-color:#222; padding:0px;  }
#logo_div { font-family:'Verdana'; font-style:italic; font-size:16px; font-weight:bold; padding-left:10px; }
#logo_div a { color:#eee; text-decoration:none; }
#mobile_menu_div { display:none;}
#menu_div {display:block; float:right; }
#mobile-menu { width:100%; background-color:#222;  }

#header-l { padding:5px; }
#header-c {}
.menu1 {}
.sms { margin-top:4px; }
.smis a { color:#fff; display:block;  padding:4px 20px 0px 20px; background-color:#555; font-size:14px; }
.shs a { color:#fff; background-color:#777; }
.sss a { color:#000; background-color:#fff; }

.dms { border:solid 1px #000; padding:0px;  }
.dms td { padding:0px;  }
.dmis a { display:block;  padding:0px; background-color:#fff; }
.dmis a { color:#000; display:block;  padding:6px; background-color:#fff; font-size:14px; }
.dhs a { color:#000; background-color:#aaa; }
.dss a { color:#000; background-color:#eee; }

a { color:#777; }

/*
.sms2 { width:100%; font-size:20px;  }
.smis2 { color:#fff; padding-left:0px;  }
.smis2 a { padding-left:20px; }
.shs2 a { background-color:#555; display:block; }

#banner { height:130px; font-family: 'Quattrocento Sans', 'Arial', Sans-Serif; padding-top:20px; }
#banner-header { font-size:50px; line-height:1.4em; }
#banner-body { font-size:20px; }
*/
h1 { font-size:40px; line-height:1.3em; }
h2 { font-size:26px; }
h3 { font-size:20px; }

#footer { position:relative; margin-top:-60px;  height: 60px; padding:10px; clear:both; background-color: #ccc; font-size:15px; }
#footer a { color: #fff; }
#footer a:hover { color: #fff; }

#content a { color:#00aaff; }
#content a:hover { color:#0077ff; }

#contact1 { float:left; min-width:400px; padding-bottom:30px; }
#contact2 { float:left; min-width:500px; border-left:solid 1px #ddd; padding-left:60px; padding-bottom:30px; }
#contact2 input { width: 270px; }
#contact2 textarea { width: 270px; }
.tbl { display:table; }
.tblfw { display:table; width:100% }
.tr { display:table-row; }
.th { display:table-cell; }
.td { display:table-cell; vertical-align:top; }

.Panel1 .tbl { width:600px; }
.tb1 { width:300px; margin-bottom:20px; height:30px; padding-left:6px; font-size:16px; color:#777; }
.tb2 { width:300px; margin-bottom:20px; padding-left:6px; font-size:16px; color:#777; }
.tb3 { width:60px; margin-bottom:20px; height:30px; padding-left:6px; font-size:16px; color:#777; }

#more_btn { background-color: Transparent; border-style: solid; color: #ccc; border: solid 2px #ccc; width: 70px; height: 24px; cursor: pointer; font-size:12px; }
#more_btn:hover { color: #777; border: solid 2px #aaa; }

.pf-desc { padding-left:30px; border-bottom:none; }

.def-pf { width:360px; padding:10px; }
.def-pf img { width:340px; }

.generated-img { width:120px; }

 #recent-projects { display:block; }

@media print {
    #banner { display:none !important; }
    .no-print { display:none !important; }
}

@media screen and (min-width: 480px) and (max-width: 1080px) {
    .page { width: 95%; }
    .smis a { color:#fff; display:block;  padding:0px 15px; }
    .shs a { background-color:#777; }

    #contact1 { float:left; min-width:200px; }
    #contact2 { float:left; min-width:300px; }

    .def-pf img { width:100%; }
}

@media screen and (min-width: 480px) and (max-width: 850px) {
    .page { width: 95%; }
    #mobile_menu_div { display:block; float:right; }
    .MobileMenuButton { outline:none;}
    #menu_div {display:none; }

    .smis a { color:#fff; display:block;  padding:0px 5px; }
    .shs a { background-color:#777; }

    #contact1 { float:none; min-width:40px; }
    #contact2 { float:none; min-width:40px; border-left:none; padding-left:0px; }

    .tbl { display:block; }
    .tblfw { display:block; width:100% }
    .tr { display:block; }
    .th { display:block; }
    .td { display:block; }

    .Panel1 .tbl { width:600px; }
    .tb1 { width:300px; }
    
    .pf-desc { padding-left:0px; padding-top:10px; padding-bottom:30px; border-bottom:solid 1px #ccc; }

    .def-pf img { width:100%; }
}

@media screen and (max-width: 480px) {
    .page { width: 95%; }
    #mobile_menu_div { display:block; float:right; }
    .MobileMenuButton { outline:none;}
    #menu_div {display:none; }
    #banner-header { font-size:34px; }
    #footer { display:block; font-size:12px; line-height:1.6em; height:60px; }
    img { width:100%; }
    
    #contact1 { float:none; min-width:40px; }
    #contact2 { float:none; min-width:40px; border-left:none; padding-left:0px; }

    .tbl { display:block; }
    .tblfw { display:block; width:100% }
    .tr { display:block; }
    .th { display:block; }
    .td { display:block; }

    .Panel1 .tbl { width:600px; }
    .tb1 { width:300px; }
    
    .pf-desc { padding-left:0px; padding-top:10px; padding-bottom:30px; border-bottom:solid 1px #ccc; }

    .def-pf img { width:100%; }
    
    #recent-projects img { width:80%; }
}

@media screen and (min-width: 380px) and (max-width: 479px) {
    #recent-projects img { width:85%; }
}

@media screen and (min-width: 300px) and (max-width: 379px) {
    #recent-projects img { width:70%; }
}