/* HTML5 Boilerplate
*
* What follows is the result of much research on cross-browser styling.
* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
* Kroc Camen, and the H5BP dev community and team. */
/* ==========================================================================
Base styles: opinionated defaults
========================================================================== */
html,
button,
input,
select,
textarea {
color: #222;
}
body {
color:#333;
font-size: 16px;
line-height: 1.25;
font-family:Arial, Helvetica, sans-serif;
}
/* Remove text-shadow in selection highlight: h5bp.com/i
* These selection declarations have to be separate.
* Customize the background color to match your design. */
::-moz-selection {
background: #b3d4fc;
text-shadow: none;
}
::selection {
background: #b3d4fc;
text-shadow: none;
}
/* A better looking default horizontal rule */
hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #ccc;
margin: 1em 0;
padding: 0;
}
/* Remove the gap between images and the bottom of their containers: h5bp.com/i/440 */
img {
vertical-align: middle;
}
/* Remove default fieldset styles. */
fieldset {
border: 0;
margin: 0;
padding: 0;
}
/* Allow only vertical resizing of textareas. */
textarea {
resize: vertical;
}
/* ==========================================================================
Chrome Frame prompt
========================================================================== */
.chromeframe {
margin: 0.2em 0;
background: #ccc;
color: #000;
padding: 0.2em 0;
}
/* ==========================================================================
Author's custom styles
========================================================================== */
sup, sub {
position: relative;
height: 0; line-height: 0;
font-size:65%; font-weight:normal;
vertical-align: baseline;
_vertical-align: bottom;
}
/* Move the superscripted text up */
sup { top:-0.50em; }
/* Move the subscripted text down, but only
half as far down as the superscript moved up */
sub { bottom:-0.25em; }
.nomb { margin-bottom:0 !important; }
.anchor { padding-top:50px; margin-top:-50px; }
/* ==========================================================================
Helper classes
========================================================================== */
/* Image replacement */
.ir {
background-color: transparent;
border: 0;
overflow: hidden;
/* IE 6/7 fallback */
*text-indent: -9999px;
}
.ir:before {
content: "";
display: block;
width: 0;
height: 150%;
}
/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden {
display: none !important;
visibility: hidden;
}
/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
/* Extends the .visuallyhidden class to allow the element to be focusable
* when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
clip: auto;
height: auto;
margin: 0;
overflow: visible;
position: static;
width: auto;
}
/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }
/* Clearfix: contain floats
*
* For modern browsers
* 1. The space content is one way to avoid an Opera bug when the
* `contenteditable` attribute is included anywhere else in the document.
* Otherwise it causes space to appear at the top and bottom of elements
* that receive the `clearfix` class.
* 2. The use of `table` rather than `block` is only necessary if using
* `:before` to contain the top-margins of child elements. */
.clearfix:before,
.clearfix:after {
content: " "; /* 1 */
display: table; /* 2 */
}
.clearfix:after { clear: both; }
/* IE 6/7 only - Trigger hasLayout and contain floats. */
.lt-ie8 .clearfix { *zoom: 1; }
/* Abbreviated Version */
.cf:before, .cf:after { content: " "; display: table; }
.cf:after { clear: both; }
.lt-ie8 .cf { *zoom: 1; }
/* Inline Clear Siblings */
.clear { display:block; float:none; clear:both; }
/* Reveal box-model when debugging */
.debug { border:1px solid #ccc; }
.outline { outline:1px dotted #ccc; }
/* ==========================================================================
EXAMPLE Media Queries for Responsive Design.
Theses examples override the primary ('mobile first') styles.
Modify as content requires.
========================================================================== */
@media only screen and (min-width: 35em) {
/* Style adjustments for viewports that meet the condition */
}
@media print,
(-o-min-device-pixel-ratio: 5/4),
(-webkit-min-device-pixel-ratio: 1.25),
(min-resolution: 120dpi) {
/* Style adjustments for high resolution devices */
}
/* ==========================================================================
Print styles.
Inlined to avoid required HTTP connection: h5bp.com/r
========================================================================== */
@media print {
* {
background: transparent !important;
color: #000 !important; /* Black prints faster: h5bp.com/s */
box-shadow: none !important;
text-shadow: none !important;
}
a,
a:visited {
text-decoration: underline;
}
a[href]:after {
content: " (" attr(href) ")";
}
abbr[title]:after {
content: " (" attr(title) ")";
}
/*
* Don't show links for images, or javascript/internal links
*/
.ir a:after,
a[href^="javascript:"]:after,
a[href^="#"]:after {
content: "";
}
pre,
blockquote {
border: 1px solid #999;
page-break-inside: avoid;
}
thead {
display: table-header-group; /* h5bp.com/t */
}
tr,
img {
page-break-inside: avoid;
}
img {
max-width: 100% !important;
}
@page {
margin: 0.5cm;
}
p,
h2,
h3 {
orphans: 3;
widows: 3;
}
h2,
h3 {
page-break-after: avoid;
}
}
/* ecommerce */
.add {
-moz-box-shadow:inset 0px 1px 0px 0px #f5978e;
-webkit-box-shadow:inset 0px 1px 0px 0px #f5978e;
box-shadow:inset 0px 1px 0px 0px #f5978e;
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f24537), color-stop(1, #8c0305) );
background:-moz-linear-gradient( center top, #f24537 5%, #8c0305 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f24537', endColorstr='#8c0305');
background-color:#f24537;
-webkit-border-top-left-radius:20px;
-moz-border-radius-topleft:20px;
border-top-left-radius:20px;
-webkit-border-top-right-radius:20px;
-moz-border-radius-topright:20px;
border-top-right-radius:20px;
-webkit-border-bottom-right-radius:20px;
-moz-border-radius-bottomright:20px;
border-bottom-right-radius:20px;
-webkit-border-bottom-left-radius:20px;
-moz-border-radius-bottomleft:20px;
border-bottom-left-radius:20px;
text-indent:0;
border:1px solid #ce181e;
display:inline-block;
color:#ffffff !important;
font-family:Arial;
font-size:15px;
font-weight:bold;
font-style:normal;
height:35px;
line-height:35px;
width:57px;
text-decoration:none !important;
text-align:center;
text-shadow:1px 1px 0px #810e05;
}
.add:hover {
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #8c0305), color-stop(1, #f24537) );
background:-moz-linear-gradient( center top, #8c0305 5%, #f24537 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#8c0305', endColorstr='#f24537');
background-color:#8c0305;
}.add:active {
position:relative;
top:1px;
}
.diag .add {margin-bottom:20px;}
/* contact modal popup */
.w3-modal {z-index:8300;display:none;position:fixed;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgb(0,0,0);background-color:rgba(0,0,0,0.4)}
.w3-modal-content{margin:auto;position:relative;padding:0;outline:0;width:70%; background-color:transparent !important; top: 50%; transform: perspective(1px) translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);}
.w3-closebtn{text-decoration:none;float:right;font-size:24px;font-weight:bold;color:inherit; padding:20px;}
.w3-closebtn{text-decoration:none;float:right;font-size:24px;font-weight:bold;color:inherit}
.w3-closebtn:hover,.w3-closebtn:focus{color:#000;text-decoration:none;cursor:pointer}
.w3-modal-content{margin:auto;background-color:#fff;position:relative;padding:0;outline:0;width:670px}
.w3-closebtn{text-decoration:none;float:right;font-size:24px;font-weight:bold;color:inherit; background-color:#fff;}
@media (max-width:600px){.w3-modal-content{margin:0 10px;width:auto!important}}
@media (max-width:768px){.w3-modal-content{width:500px}}
.w3-hover-red:hover{color:#fff!important;background-color:#f44336!important}
.w3-container:after{content:"";display:table;clear:both}
.w3-display-topright{position:absolute;right:0;top:0; z-index:8310;}
.w3-padding-16{padding-top:16px!important;padding-bottom:16px!important}
.popImg {width:45%; padding:2%; cursor:pointer;}
@media (max-width:600px){.popImg{width:100%;}
#iContact{width:100%; height:90%;}
}
#caption {color:white; font-size:2em; font-weight:bold; text-align:center;}
.modal-open {overflow:hidden; position:fixed;}
.CAwarning {color:gray !important; float:right; padding:20px 0; font-size:small;}
.black65 {background:black; color:white;}
.gray65 {background:#ccc; color:black;}
.CA65 td {text-align:center; padding:20px;}
.CA65 table {width:100%;}