@charset "UTF-8";

@media screen {

/* Tags */
html, body { margin: 0; padding: 0; background-color: #f7f7f7; }
body { background-image: url("../img/background.png"); background-repeat: repeat-x; font-family: "Tahoma", "Verdana", "Arial", "helvetica", sans-serif; font-size: 12px; }

/* IDs */
#main { width: 950px; margin: 0 auto; }

/* Header */
#header { height: 196px; position: relative; background: url("../img/header_img.png") no-repeat; }
#logo { width: 400px; height: 120px; position: absolute; top: 20px; left: 0; }
#logo h1 { padding: 0; margin: 0; }
#logo h1 img { border: 0; }
#contact { position: absolute; bottom: 49px; right: 0; color: #7f7e7e; text-align: right; line-height: 1.5; height: 66px; }
#contact #contact-triangle { background: url("../img/contact-triangle_bg.png"); width: 66px; height: 66px; float: left; }
#contact #contact-content { background: url("../img/contact_bg.png"); padding: 0 12px 0 0; height: 66px; float: right; }
#contact #contact-phone { background-image: url("../img/icon-phone.png"); background-repeat: no-repeat; background-position: center left; padding: 5px 0 5px 35px; }
#contact #contact-email { background-image: url("../img/icon-mail.png"); background-repeat: no-repeat; background-position: center left; padding: 5px 0 5px 35px; }
#menu { height: 49px;  /*width: 550px;*/ position: absolute; bottom: 0; right: 0; }
#menu ul { list-style: none; color: white; padding: 0; margin: 0; float: right; }
#menu ul li { float: left; display: block; }
#menu ul li a { color: white; font-weight: bold; text-decoration: none; padding: 0 18px; display: table-cell; vertical-align: middle; height: 49px; font-size: 1.2em; }
#menu ul li a:hover, #menu ul li a.sel { background-color: white; color: #00155f; }

/* Body */
#body { background-color: white; }
#content { float: left; width: 600px; padding: 15px; margin: 2px 0 0 0; min-height: 300px; color: #6f6f6f; }
#info { width: 320px; float: right; }
#info h2 { width: 320px; height: 33px; background-color: #ee6710; background-image: url("../img/info-header_bg.png"); background-repeat: repeat-x; color: white; font-weight: normal; font-size: 1.1em; text-align: center; margin: 0; padding: 0; display: table-cell; vertical-align: middle; border-bottom: 1px solid #ccd8eb; }
#info h3 { font-size: 1.2em; padding: 10px 15px; margin: 0; }
#info .info-block { padding: 5px 10px; }
#info .info-block img { border: 1px solid #e0e0e0; }
#info .info-date { padding: 5px 0; }

/* Footer */
#footer { color: #888888; padding: 35px 15px 15px 15px; clear: both; background-image: url("../img/footer_bg.png"); background-repeat: no-repeat; }
#footer-copyright { font-size: 1em; }
#footer-developer { float: right; }
#footer-developer img { vertical-align: middle; border: 0; }
#footer-developer small { font-size: 1em; }

/* Reference list */
.references { list-style: none; margin: 0; padding: 0; }
.reference-block { position: relative; border: 1px solid #979694; float: left; width: 170px; height: 180px; padding: 5px 10px; text-align: center; margin: 0 10px 10px 0; }
.reference-block.third { margin: 0 0 10px 0; }
.reference-block img { border: 1px solid #727272; }
.reference-block a { display: block; width: 100%; height: 100%; }
.reference-title { color: #2a137f; font-size: 1.2em; font-weight: normal; display: block; height: 2.4em; overflow: hidden; }
.reference-block a:hover .reference-title { color: #e37d10; }
.reference-date { color: black; position: absolute; bottom: 3px; left: 0; width: 100%; text-align: inherit; }

/* Reference photos */
#reference-photos { text-align: center; }
#reference-photos img { border: 1px solid #e0e0e0; }
#reference-photos a { display: block; margin: 2px 4px; float: left; }

/* Reference files */
#reference-files { text-align: center; list-style: none; margin: 0 auto; padding: 0; width: 80%; }
#reference-files li { display: block; margin: 2px 4px; float: left; width: 30%; text-align: left; }

/* Certification photos */
#certification-photos { text-align: center; padding: 0 0 10px 0; }
#certification-photos img { border: 1px solid #e0e0e0; }
#certification-photos a { display: block; margin: 2px 4px; float: left; }

/* Certification files */
#certification-files { text-align: center; list-style: none; margin: 0 auto; padding: 0; width: 80%; }
#certification-files li { display: block; margin: 2px 4px; float: left; width: 30%; text-align: left; }

/* Classes */
.hidden { display: none; }
.break { clear: both; }
.center { text-align: center; }

}