@import url(reset.css);

body { background: #F2F2F2 url(../images/body-background.gif) top center repeat-y; font-family: Helvetica, Arial, sans-serif; }

#page-wrap { background: #FFF; margin: 0 auto; padding: 26px 0 0; width: 900px; }
strong { font-weight: bold; }
a { color: #3F55C4; -webkit-transition : all 0.3s ease-in-out; -moz-transition : all 0.3s ease-in-out; }
a:hover { color: #000; }
.clear-both { clear: both; }

/* Masthead
-------------------------------------------------*/
#home-page #masthead { background: url(../images/home-banner.jpg) bottom center no-repeat; }
#about-page #masthead { background: url(../images/about-banner.jpg) bottom center no-repeat; }
#product-page #masthead { background: url(../images/product-banner.jpg) bottom center no-repeat; }
#download-page #masthead { background: url(../images/download-banner.jpg) bottom center no-repeat; }
#masthead { margin-bottom: 23px; padding-bottom: 299px; }
#logo { background: url(../images/logo.gif) top left; height: 49px; margin: 0 18px 25px; text-indent: -9999px; width: 865px; }

/* Navigation
-------------------------------------------------*/
#masthead ul { background: #B8262A url(../images/nav-background.gif) top left repeat-x; border-bottom: 1px solid #FE4146; overflow: hidden; }
#masthead li { float: left; }
#masthead li a { border-right: 1px solid #AB1C1F; border-left: 1px solid #FC4E52; color: #FFF; display: block; font-size: 12px; padding: 20px 0; text-align: center; text-decoration: none; width: 148px; }
#masthead li a:hover { background-color: #FE393E; }
#home-page #masthead li a.home, #about-page #masthead li a.about-us, #product-page #masthead li a.products, #download-page #masthead li a.downloads { background-color: #FE393E; }

/* Main content
-------------------------------------------------*/
#content-wrap { background: url(../images/form-border.gif) 601px 0 repeat-y; }
#main-content { float: left; margin: 0 0 0 18px; position: relative; width: 582px; }
#main-content h2 { color: #4E4E4E; font-size: 30px; font-weight: bold; margin: 0 0 18px; }
#page-wrap div[id="main-content"] h2 { background: rgba(184,38,42,0.4); color: #FFF; font-size: 30px; font-weight: bold; left: 0; padding: 18px; position: absolute; top: -89px; width: 829px; z-index: 300; }
#main-content h3 { color: #4E4E4E; font-size: 18px; font-weight: bold; margin: 0 18px 18px 0; }
#product-page #main-content h3 { border-top: 1px solid #999; color: #3F55C4; padding-top: 18px; }
#main-content p { color: #4E4E4E; font-size: 18px; line-height: 22px; margin: 0 18px 18px 0;  }
#main-content p.intro { font-size: 22px; line-height: 28px; }
#main-content p strong { color: #3F55C4; font-weight: bold; }
#main-content ul { margin: 0 0 18px; }
#main-content li { color: #4E4E4E; font-size: 18px; line-height: 22px; list-style-type: disc; margin: 0 0 0 18px; }
#main-content .content-image { margin: 0 18px; width: 288px; }
#main-content .content-image img { -webkit-transition : all 0.3s ease-in-out; -moz-transition : all 0.3s ease-in-out; }
#main-content .content-image:hover img { -webkit-transform: scale(1.1) rotate(2deg); -moz-transform: scale(1.1) rotate(2deg); }
#main-content .image-align-right { float: right; }
#main-content .content-image img { background: #FFF; border: 1px solid #FE9A9C; padding: 2px;
/* Moz */
-moz-box-shadow: 3px 3px 5px #888; }
#main-content .content-image p { font-size: 12px; font-style: italic; }

/* Contact (fast form / sidebar)
-------------------------------------------------*/
#contact { background-color: #FFF; border-left: 2px solid #DDD; float: right; margin: -54px 17px 0 0; padding: 18px 0 0 0; position: relative; width: 280px; z-index: 500; }
#contact .alternative { border-top: 1px solid #CCC; padding-top: 18px; }
#contact h3 { color: #FE353A; font-size: 22px; font-weight: bold; margin: 0 18px 25px; }
#contact h4 { color: #4E4E4E; font-size: 14px; line-height: 18px; margin: 0 0 -18px 18px; }
#contact p { color: #4E4E4E; font-size: 14px; line-height: 18px; margin: 0 18px 18px; }
#contact .vcard p { margin: 0 18px 18px 95px; }
#contact .vcard strong { color: #3F55C4; font-weight: bold; }
#contact p span { display: block; }
#contact p.tel .type { position: absolute; top: 0; left: -9999px; }
#contact label { display: block; position: relative; }
#contact label input { border: 1px solid #4E4E4E; padding: 4px 6px; position: absolute; right: 0; top: 0; }
#contact label input:focus { border: 2px solid #4E4E4E; right: -1px; top: -1px; }
#submit { background: url(../images/submit-contact-me.gif) top left no-repeat; border: none; cursor: pointer; height: 62px; width: 264px;
-webkit-transition : all 0.3s ease-in-out; }
#submit:hover { -webkit-transform: scale(1.1);  -moz-transform: scale(1.1); }

/* Footer
-------------------------------------------------*/
#footer { background: #FE393E url(../images/footer-background.gif) bottom left repeat-x; clear: both; overflow: hidden; padding: 18px 0; }
#footer p, #footer li { color: #FFF; font-size: 11px; line-height: 16px; }
#footer a { color: #FFF; }
#footer a:hover { background: #3F55C4; margin: 0 -3px; padding: 0 3px; }
#registered-address, #legal-info, #footer ul { float: left; padding: 0 0 0 18px; width: 132px; }