/* page template*/ body { margin: 0px 0px 0px; font-family: 'Baskervville', serif; } #page { width: 100%; height: 100%; } /* links */ a:link { text-decoration:none; } a:visited { text-decoration:none; } a:active { text-decoration:none; } a:hover { text-decoration: none; } /* header and footer*/ .headerholder { height: 50px; position: fixed; text-align: left; width: 100%; z-index:+1; } .header { height: 50px; margin-top:0px; margin-left:0px; margin-right:0px; width: 100%; z-index:+1; background-color:#333; color: #FFF; } .footerholder { height: 50px; bottom: 0px; position: fixed; text-align: center; width: 100%; z-index:+1; } .footer { color:#666; font-size:9px; letter-spacing:1px; height: 50px; margin: auto; width: 100%; z-index:+1; background-color:#333; color: #FFF; } .menuHeader { font-size: 12px; color:#FFF !important; letter-spacing: 2px; font-weight: 400; padding-left: 20px; } .menuBody { font-size: 12px; color:#333 !important; letter-spacing: 2px; font-weight: 400; padding-left: 20px; } .submenu { font-size: 10px; color:#333 !important; letter-spacing: 1px; font-weight: 300; padding-left: 30px; } /* main content */ .pagePadding{ padding-top: 100px; padding-bottom: 100px;} .pageTitle{font-size: 30px; padding-bottom: 25px; letter-spacing: 5px; color: #333;} .pageText{font-size: 20px; color: #333; letter-spacing: 2px;} .specBox { color:#FFF; padding:20px; } .detailsBox { width: 500px; } .shadow { text-shadow: 1px 1px 2px #FFF; } .Title { font-size:30px; font-weight:300; letter-spacing: 5px; } .Title2 { font-size:24px; font-weight:400; letter-spacing: 2px; } .Title3 { font-size:12px; font-weight:300; letter-spacing: 2px; } .Description { font-size:13px; letter-spacing:2px; } .specsTitle { margin-top: 5px; font-size:13px; font-weight:400; letter-spacing: 2px; } .specs { padding-top: 5px; font-size:12px !important; font-weight:400 !important; letter-spacing:2px !important; } .specsSubtitle { font-size:11px; font-weight:300; letter-spacing:2px; } .buttonDetails { width:60px; margin-top:15px; background-color:#FFF; padding:8px; font-size:10px; color:#666; font-weight:400; letter-spacing:2px; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; } .buttonDetails:hover { color: #FFF; border: none; background: #CCC; font-weight:400; } /* universal forms */ input[type=text], select { padding: 4px 6px; display: inline-block; border: 1px solid #ccc; border-radius: 2px; box-sizing: border-box; } input[type=submit] { font-weight:400; letter-spacing:3px; background-color: #999; color: #FFF; padding: 4px 6px; border: none; border-radius: 2px; cursor: pointer; } input[type=submit]:hover { background-color: #CCC; } /* vertical divs */ #vcontainer { display: table; height: 100%; margin: 0 auto; width: 100%; } .vcontent { padding: 0px; text-align: center; display: table-cell; vertical-align: middle; } /* responsive */ .backgroundResponsive { } @media only screen and (min-width: 750px) { /* For tablets: */ .col-m-1 {width: 8.33%;} .col-m-2 {width: 16.66%;} .col-m-3 {width: 25%;} .col-m-4 {width: 33.33%;} .col-m-5 {width: 41.66%;} .col-m-6 {width: 50%;} .col-m-7 {width: 58.33%;} .col-m-8 {width: 66.66%;} .col-m-9 {width: 75%;} .col-m-10 {width: 83.33%;} .col-m-11 {width: 91.66%;} .col-m-12 {width: 100%; height: 100%;} .backgroundResponsive {background-color: #FFF;} } @media only screen and (min-width: 960px) { /* For desktop: */ .col-1 {width: 8.33%;} .col-2 {width: 16.66%;} .col-3 {width: 25%;} .col-4 {width: 33.33%;} .col-5 {width: 41.66%;} .col-6 {width: 50%;} .col-7 {width: 58.33%;} .col-8 {width: 66.66%;} .col-9 {width: 75%;} .col-10 {width: 83.33%;} .col-11 {width: 91.66%;} .col-12 {width: 100%; height: 100%;} .backgroundResponsive {background-color: #FFF;} } @media only screen and (min-width: 1920px) { /* For desktop: */ .col-1 {width: 8.33%;} .col-2 {width: 16.66%;} .col-3 {width: 25%;} .col-4 {width: 33.33%;} .col-5 {width: 41.66%;} .col-6 {width: 50%;} .col-7 {width: 58.33%;} .col-8 {width: 66.66%;} .col-9 {width: 75%;} .col-10 {width: 83.33%;} .col-11 {width: 91.66%;} .col-12 {width: 100%; height: 100%;} .backgroundResponsive {background-color: #FFF;} } @media only screen and (orientation: landscape) { .backgroundResponsive {}