/******************************************************************************
 * Charter Breeze Screen Stylesheet | Copyright (C) 2010 Noah Petherbridge    *
 ******************************************************************************/

/* Generic HTML tag styles */

body {
 background-color: #C0C0C0;
 background-image: url("stripes.png");
 background-repeat: repeat;
 font-family: Verdana,Arial,Helvetica,sans-serif;
 font-size: small;
 color: #000000;
 margin: 0px;
 padding: 0px;
 overflow-x: hidden
}

a:link, a:visited {
 color: #0000FF;
 text-decoration: underline
}
a img {
 border: 0px
}

h1,h2,h3,h4 {
 font-family: "Trebuchet MS",Verdana,Arial,Helvetica,sans-serif;
 font-weight: bold;
 color: #A6DBFF;
 text-shadow: 1px 1px 1px #333333;
 -moz-text-shadow: 1px 1px 1px #333333;
 -webkit-text-shadow: 1px 1px 1px #333333;
 margin-top: 20px;
 margin-bottom: 20px
}

h1 {
 font-size: 24pt;
 margin-top: 0px
}

h2 {
 font-size: 20pt
}

h1.first, h2.first, h3.first, h4.first {
 margin-top: 0px
}

h1 a:link, h1 a:visited, h2 a:link, h2 a:visited, h3 a:link, h3 a:visited, h4 a:link, h4 a:visited {
 color: #A6DBFF
}

legend {
 font-family: "Trebuchet MS",Verdana,Arial,Helvetica;
 font-size: medium;
 font-weight: bold;
 color: #0000FF
}

/*******************************************************************************
 * Styles Needed by Specific Pages in the CMS                                  *
 ******************************************************************************/

/* Downloads */

.distro {
 border: 1px solid #CCCCCC
}
.distro th {
 width: 150px;
 text-align: center;
 vertical-align: top
}
.distro td {
 width: 150px;
 text-align: center;
 vertical-align: top;
 border: 1px solid #808080
}
.distro td img {
 float: left
}

/********
 * Blog *
 *******/

/* Blog titles when shown on index view */
a.blog-title-index:link, a.blog-title-index:visited {
 font-family: "Trebuchet MS",Verdana,Arial,Helvetica,sans-serif;
 font-weight: bold;
 color: #A6DBFF;
 text-shadow: 1px 1px 1px #333333;
 -moz-text-shadow: 1px 1px 1px #333333;
 -webkit-text-shadow: 1px 1px 1px #333333;
 margin-top: 20px;
 margin-bottom: 20px;
 font-size: 24pt;
 text-decoration: none
}
a.blog-title-index:hover, a.blog-title-index:active {
 text-decoration: underline
}

/* Poster's avatar box */
.blog-author, .comment-author {
 float: right;
 background-color: #FFFFFF;
 border: 1px solid #CCCCCC;
 padding: 2px;
 margin-left: 10px;
 margin-bottom: 10px;
 width: 100px; /* 96 avatar width + 4px padding */
 text-align: center;
 font-weight: bold
}

/* Timestamp and author line below blog titles */
.blog-timestamp {
 font-size: smaller;
 font-style: italic;
 padding-left: 30px;
 padding-top: 5px;
 padding-bottom: 10px
}

/* Blog comment wrapper */
.comment {
 border: 1px dashed #006699;
 padding: 5px
}

.invisible {
 display: none
}

/******************************************************************************
 * Charter Breeze "Sky" Design                                                *
 ******************************************************************************/

/* Body background gradient */
#gradient {
 position: absolute;
 top: 0px;
 left: 0px;
 right: 0px;
 height: 1000px;
 width: 100%;
 background-image: url("gradient.png");
 background-repeat: repeat;
 z-index: -9000
}

/* Hyperlink that surrounds the logo */
a#homelink {
 position: absolute;
 top: 4px;
 left: 40px;
 width: 420px;
 height: 130px
}

/* Hyperlink that surrounds the call us */
a#callus {
 position: absolute;
 top: 88px;
 left: 655px;
 width: 190px;
 height: 65px
}

/* Header background and logo */
#header {
 background-color: #A6DBFF;
 height: 170px
}
#logo {
 position: relative;
 background-image: url("logo.png");
 background-repeat: no-repeat;
 background-position: top left;
 width: 876px;
 height: 170px;
 margin-left: auto;
 margin-right: auto
}

/* Footer Links & Copyright */
#footer {
 width: 876px;
 text-align: center;
 margin-left: auto;
 margin-right: auto;
 margin-bottom: 40px
}
#footer a:link, #footer a:visited {
 color: #000000;
 text-decoration: none
}
#footer a:hover, #footer a:active {
 text-decoration: underline
}

/* Top navigation panel */
#navigation {
 background-color: #F2F2F2;
 height: 60px;
 border-bottom: 1px solid #000000;
 -box-shadow: 0px 4px 6px #000000;
 -moz-box-shadow: 0px 4px 6px #000000;
 -webkit-box-shadow: 0px 4px 6px #000000;
 filter: progid:DXImageTransform.Microsoft.Shadow(color=#000000, direction=180, strength=4)
}

/* Style for nav tab row */
#sections {
 background-color: #B7B7B7;
 width: 876px;
 height: 30px;
 margin-left: auto;
 margin-right: auto;
 line-height: 30px
}

/* Style for a nav bar item */
.section {
 width: 144px; /* 876 / 6 + 2 */
 height: 30px;
 line-height: 30px;
 text-align: center;
 border-right: 2px solid #F2F2F2;
 float: left
}
.section:hover {
 background-color: #F2F2F2
}
.section a {
 display: block
}

/* Active tab bar item */
.section.active {
 background-color: #F2F2F2
}

/* Hyperlinks in the nav tabs */
#sections .section a:link, #sections .section a:visited {
 color: #000000;
 text-decoration: none;
 font-weight: bold;
}
#sections .section a:hover {
 text-decoration: underline
}

/* Sub Navigation Bar */
.subnav {
 width: 876px;
 margin-left: auto;
 margin-right: auto;
 font-size: smaller
}
.subnav ul {
 margin: 0px;
 padding: 0px;
 line-height: 30px;
 margin-left: 0px;
 list-style: none
}
.subnav ul li {
 float: left;
 background-image: url("arrow-right.gif");
 background-position: left center;
 background-repeat: no-repeat;
 padding-left: 16px;
 margin-right: 20px
}
.subnav ul li a:link, .subnav ul li a:visited {
 color: #000000;
 text-decoration: none
}
.subnav ul li a:hover, .subnav ul li a:active {
 text-decoration: underline
}
.subnav ul li span {
 cursor: default;
 padding-left: 20px;
 color: #999999
}

/* Main body wrapper */
#body {
 width: 876px;
 margin-left: auto;
 margin-right: auto;
 margin-top: 90px
}

/* Generic content panel wrapper */
.panel {
 background-color: #F2F2F2;
 border: 1px solid #000000;
 padding: 10px;
 border-radius: 8px;
 -moz-border-radius: 8px;
 -webkit-border-radius: 8px;
 box-shadow: 2px 2px 6px #000000;
 -moz-box-shadow: 2px 2px 6px #000000;
 -webkit-box-shadow: 2px 2px 6px #000000;
 filter: progid:DXImageTransform.Microsoft.Shadow(color=#000000, strength=4, direction=135)
}

/* Generic clearing div */
.clear {
 clear: both;
 height: 30px
}

/* 75/25 Layout Wrapper */
.layout-75-25 .panel.left{
 float: left;
 width: 580px;
}
.layout-75-25 .panel.right {
 float: right;
 width: 220px;
}

/* 60/40 Layout Wrapper */
.layout-60-40 .panel.left{
 float: left;
 width: 480px;
}
.layout-60-40 .panel.right {
 float: right;
 width: 320px;
}

/* Homepage Slideshow Styles */

.slideshow {
 position: relative;
 height: 300px
}

.slideshow .shadow-box {
 position: absolute;
 top: 0px;
 left: 0px;
 width: 876px;
 height: 300px;
 background-color: #000000;
 border: 1px solid #000000;
 border-radius: 8px;
 -moz-border-radius: 8px;
 -webkit-border-radius: 8px;
 box-shadow: 2px 2px 6px #000000;
 -moz-box-shadow: 2px 2px 6px #000000;
 -webkit-box-shadow: 2px 2px 6px #000000;
 filter: progid:DXImageTransform.Microsoft.Shadow(color=#000000, strength=4, direction=135)
}

.slideshow .photo-box {
 position: absolute;
 top: 0px;
 left: 0px;
 width: 876px;
 height: 300px;
 background-position: top left;
 background-repeat: no-repeat;
 border: 1px solid #000000;
 border-radius: 8px;
 -moz-border-radius: 8px;
 -webkit-border-radius: 8px;
}
 

/* Page-specific styles */

.panel.photograph {
 background-repeat: no-repeat;
 background-position: top left;
 height: 280px
}

.panel.photograph.hollywood, .panel.photograph.observatory {
 background-image: url("../images/hollywood.jpg")
}

.panel.photograph.charter-breeze {
 background-image: url("../images/charter-breeze-buses.jpg")
}

.panel.photograph.los-angeles {
 background-image: url("../images/los-angeles.jpg")
}

.panel.photograph.santa-monica {
 background-image: url("../images/santa-monica.jpg")
}

.panel.photograph.beverly-hills {
 background-image: url("../images/beverly-hills.jpg")
}

.panel.photograph.orange-county {
 background-image: url("../images/orange-county.jpg")
}

.panel.photograph.santa-barbara {
 background-image: url("../images/santa-barbara.jpg")
}