@IMPORT url("reset.css");

@font-face { font-family: "Typewriter Scribbled"; src: url( ../images/fonts/typewriterscribbled.eot ); } /* IE */
@font-face { font-family: "Typewriter Scribbled"; src: url( ../images/fonts/typewriterscribbled.ttf ) format("truetype"); } /* non-IE */

html { height:100%; width:100%; background: url(../images/checks2.png); }
body { margin:0; padding:0; font-family: "Typewriter Scribbled", Consolas, Courier New, Courier, Monospace; font-size:13pt; width:100%; }

div.reset { clear:both; float:none; }

div.center { width: 880px; margin-left: auto; margin-right: auto; margin-top:-10px; }
div.wrapper { background-color:white; border:2px solid #888; border-bottom:none; width:876px; padding-bottom:60px; }

a { color: black; }

/**
 * Header
 */

#logo img { display:none; }
#logo { background: url(../images/logo-slogan-4.gif); height:107px; width:597px; margin-left:40px; float:left; text-indent:-20000px; display:inline; } /* display:inline to defeat the "double margin float bug" in IE6 */
#logo span { display:block; }

#utilities { height: 100px; float:right; text-align:right; width:auto; margin-right:40px; position:relative; display:inline; } /* display:inline to defeat the "double margin float bug" in IE6 */ 
#utilities ul { display:block; position:absolute; bottom:0; right:0; margin:0; padding:0; padding-bottom:4px; margin-bottom:-6px;}
#utilities ul li { margin-top:8px; }
#utilities ul li a { text-decoration:none; border-bottom:2px solid white; color: #666; }
#utilities ul li a:hover { border-bottom:2px solid #aaa; }

.get-a-quote { display:block; float:right; width: 158px; height:39px; margin-top:64px; margin-right:40px; text-indent:-20000px; background:url(../images/get-a-quote.gif); background-position:0px 39px; display:inline; } /* display:inline to defeat the "double margin float bug" in IE6 */
.get-a-quote:hover { background-position:0px 0px; }

/**
 * Menu
 */

#menu { clear:both; float:none; height:35px; background:url(../images/barcode-footer-colored.png); margin-top:10px; padding-top:1px; padding-bottom:1px; border-right:none; border-left:none;  border:1px solid white; }
#menu ul { width:820px; display:block; list-style:none; white-space:nowrap; list-style-type:none; margin:8px auto 10px 42px; }
#menu ul li { display:inline; text-transform:lowercase; }

#menu #inner { background-color:white; border:1px solid white; border-right:none; border-left:none; height:33px; width:100%; position:relative; top:0px;}

#menu ul li a { text-decoration:none; color:black; display:block; float:left; width:auto; margin:0px 158px 0px 0px; border-bottom:2px solid white; }
#menu ul li.last a { margin-right:0px; }
#menu ul li.current a, #menu ul li a:hover { color:black; border-bottom: 2px solid black; }

/**
 * Blocks
 */

.container { padding:0px; margin:0px; padding-top:30px; float:none; }
.block, .menublock { width: 255px; height: 290px; margin-right: 10px; display:block; float: left; border:2px solid #ccc; background:url(../images/homepage/fade.jpg); }
.container .block.noclick { cursor:default; }
.block .inside, .menublock { }

.block p { font-family: verdana, arial, helvetica; font-size:10pt; line-height:150%;  }
.block a.more { position:absolute; bottom:5px; right:5px; font-family: verdana, arial, helvetica; font-size:10pt; line-height:150%; text-decoration:none; }
.block a.more span { text-decoration:underline; }

.block.hover a, .block.clicked a, #content .block.hover h3, #content .block.clicked h3 { color:white; }
.block.hover a:hover, .block.clicked a:hover { text-decoration: underline; }
.block.hover a.more:hover, .block.clicked a.more:hover, .hidden a:hover { text-decoration: none; }

.body .block ul li.list { line-height:0px; }

#content .block h1 { display:none; position:absolute; margin-bottom:0px; font-size:15pt; z-index:2; } 
#content .block h2, #content .menublock h2 { display:block; font-family:arial black, arial, helvetica; font-size:36pt; letter-spacing:-4px; margin-bottom:0px; margin-top:-4px; line-height: 120%; } 
#content .content h3, #content .block h3 { display:block; font-family:arial black, arial, helvetica; color: #7fcbe7; font-size:24pt; letter-spacing:-2px; margin-bottom:0px; margin-top:23px; }

.menublock { position:relative; height: 35px; margin-top:5px; margin-left:0px; margin-right:0px; }
.menublock h2 { margin-top: -5px; text-align: right; margin-right: 4px; }
#content .menublock h2 { font-size:24pt; letter-spacing:-2px; } 
#content .menublock.hover h2 { color:white; }
#content .menublock.hover h3 { color:white; }
.menublock h2 { color:#7fcbe7; }

.menublock.hover { background-color:#088ccc; }

.block.first { }
.block.first .inside h2 { color:#088ccc; }
.container .block.first.clicked .inside, .container .block.first.hover .inside { background-color: #088ccc; }
.block.first.clicked .inside h2, .block.first.hover .inside h2 { color:white; }

.block.second { }
.block.second .inside h2 { color:#7fcbe7; }
.container .second.clicked .inside, .container .second.hover .inside { background-color:#7fcbe7; }
.block.second.clicked .inside h2, .block.second.hover .inside h2 { color:white; }

.block.third { }
.block.third .inside h2 { color:#088ccc; }
.container .block.third.clicked .inside, .container .block.third.hover .inside { background-color:#088ccc; }
.block.third.clicked .inside h2, .block.third.hover .inside h2 { color:white; }

.inside { display: block; height:100%; width:100%; float: left; color: black; } 
.inside a { text-decoration:none; }
.inside.hover { }

.block .body { padding:4px; margin-top:10px; color:black;  }
.block.clicked .body, .block.hover .body { color:white; }
.block.clicked .inside a { color:white; }
.block.clicked .inside a:hover { border-bottom:1px solid white; }

.block a.more { display:block; width:100%; text-align:right; } 

.body ul li { line-height:160%; } 

.block noscript a { display:block; clear:both; padding-top:5px; width:100%; text-align:right; }

/**
 * Content
 */

/* main content wrapper */
#content { display:block; padding-left:40px; clear:both; }

span.textlogo { }
span.textlogo strong { font-weight:800; color: black; }

/* content that's displayed in a block */
.content { display:none; font-family:verdana, arial; float:left; width: 530px; min-height:316px; font-size:10pt; border: 2px solid #ccc; padding:2px; line-height: 150%;  padding-bottom:20px; background:url(../images/homepage/fade.jpg); }
.content .photo { float: right; padding: 7px; background-color: #ccc; margin: 10px; border: 1px solid #888; }
.content .photo img { display: block; margin-bottom:10px; clear:both; float:none; }
.content .photo span { display: block; text-align: center; font-style: italic; clear:both; float: none; }

.content img { margin-left:20px; margin-top:40px; }
.content img.noborder { border: none; }

.block .menu li.current a { border-bottom:2px solid white; }

.block .menu ul.subsub { margin-left:20px; margin-bottom:10px; margin-top:5px;}
.block .menu ul.subsub li { line-height:110%; }
.block .menu ul.subsub li a { border-bottom:none; color:#fafecb; line-height:150%; }
.block .menu ul.subsub li.current a { border-bottom:2px solid #fafecb; }

.content p { position:relative; z-index:2; padding:10px 20px 0 20px; }
.content ul { list-style:square; margin-left: 20px; padding:10px 20px 0 20px; }
.content strong {  }
.content h2 { font-family: Arial Black, Arial, Helvetica, Sans Serif; letter-spacing: -4px; font-size:34pt; line-height:150%; margin-top:-15px; display:block; width:510px; text-align:right; color: #7fcbe7; z-index: 1; text-transform:lowercase; } 

/**
 * Rounded borders
 * inspired by http://www.kyleschaeffer.com/web-controls/five-elegant-rounded-corner-boxes/
 */
.block, .content { position:relative; }
.corner { position:absolute; width:10px; height:10px; background: url(../images/corners.gif); font-size:0%; line-height:0; }
.tl { top: 0px; left: 0px; background-position: 0 0; margin: -2px 0 0 -2px; }
.tr { top: 0px; right: 0px; background-position: -10px 0; margin: -2px -2px 0 0;}
.bl { bottom: 0px; left: 0px; background-position: 0 -10px; margin: 0 0 -2px -2px; }
.br { bottom: 0px; right: 0px; background-position: -10px -10px; margin: 0 -2px -2px 0; }

.block.first.clicked .tl, .block.first.hover .tl, .block.third.clicked .tl, .block.third.hover .tl { background-position: 0px 20px; }
.block.first.clicked .tr, .block.first.hover .tr, .block.third.clicked .tr, .block.third.hover .tr { background-position: -10px 20px; }
.block.first.clicked .bl, .block.first.hover .bl, .block.third.clicked .bl, .block.third.hover .bl { background-position: 0px 10px; }
.block.first.clicked .br, .block.first.hover .br, .block.third.clicked .br, .block.third.hover .br { background-position: -10px 10px; }

.block.second.clicked .tl, .block.second.hover .tl { background-position: 20px 0px; }
.block.second.clicked .tr, .block.second.hover .tr { background-position: 10px 0px; }
.block.second.clicked .bl, .block.second.hover .bl { background-position: 20px -10px; }
.block.second.clicked .br, .block.second.hover .br { background-position: 10px -10px; }

/**
 * Footer
 */

#footer { background: transparent url(../images/barcode-footer-colored.png) repeat-x top left; width:876px; margin-top:-23px; margin-left:2px; padding-top:40px; text-align:center; color:#888; line-height:140%; }
#footer a { color:#888; }

/**
 * Utilities
 */

.small { font-family:verdana, arial, helvetica, consolas, courier new, courier, monospace; letter-spacing:normal; font-size:70%; }
.hidden { display:none; }