@import url('/static/css/buttons.css');
@import url('/static/css/data.css');
@import url('/static/css/headings.css');
@import url('/static/css/form.css');
@import url('/static/css/letter.css');
@import url('/static/css/checkout.css');
@import url('/static/css/basket.css');
@import url('/static/css/login_panel.css');
@import url('/static/css/home.css');

body {
    margin: 0;
    background: #820000 url(/static/images/main/page_background.png) repeat-x;
    font-size: 0.8em;
    font-family: georgia, times-new-roman, serif;
    color: #444444;
}

input, select, textarea {
    font-family: georgia, times-new-roman, serif;
}

img {
    border: 0;
}

img.float-right {
    float: right;
    margin: 0 0 10px 10px;
}

a {
    color: #0000cc;
}

p.highlight,
span.highlight {
    color: #cc0000;
}

p.sub-note {
    font-size: 90%;
}

a:visited {
    color: #000099;
}

a:hover {
    text-decoration: none;
}

p {
    margin: 10px 0;
}

div.clear {
    clear: both;
}

ol.spaced li,
ul.spaced li {
    margin-bottom: 5px;
}

.hidden {
    display: none;
}

div.hr {
    background: url(/static/images/main/divider_horizontal.png) repeat-x;
    height: 1px;
    margin: 10px 0;
    clear: both;
}

div.hr hr {
    display: none;
}

div.editorial-container {
    padding: 10px;
}

p.boxout {
    background-color: #f0f0b9;
    border: #d3d3a3 1px solid;
    text-align: center;
    padding: 5px;
}

#main-container,
#main-container-home {
    width: 950px;
    margin: 10px auto;
}

#main-container-header {
    height: 5px;
    background: url(/static/images/main/container_header.png) 5px 0 no-repeat;
}

#main-container-centre {
    background: url(/static/images/main/container_side_shadow.png) repeat-y;
    padding: 0 5px;
}

#header-top {
    background: url(/static/images/main/header_top.png) no-repeat;
    height: 10px;
}

#main-container-home #header-top {
    background: url(/static/images/main/header_top_home.png) no-repeat;
}

#header-content {
    background: url(/static/images/main/header_right_background.png) right 0 no-repeat;
    height: 90px;
}

#main-container-home #header-content {
    height: 130px;
}

#header-content img {
    float: left;
}

#main-content {
    background: white url(/static/images/main/content_background.png) left bottom no-repeat;
    padding: 10px;
}

#main-content-footer {
    background: url(/static/images/main/content_footer.png) no-repeat;
    height: 10px;
}

#main-container-footer {
    height: 5px;
    background: url(/static/images/main/container_footer.png) 5px 0 no-repeat;
}

#content-column {
    position: relative;
    width: 713px;
    float: left;
    background: url(/static/images/main/divider_vertical.png) right top repeat-y;
    padding-right: 10px;
    float: left;
}

#side-column {
    padding-left: 10px;
    float: left;
    width: 187px;
}

#side-column .affiliate {
    margin: 10px 0;
    border: #cccccc 1px solid;
    -moz-border-radius: 5px;
    padding: 5px;
    color: red;
    font-size: 90%;
}

#side-column .logos {
    text-align: center;
}

#side-column .logos img {
    margin: 10px 0;
}

#page-footer {
    margin-top: 5px;
    color: white;
    font-size: 80%;
    font-family: verdana, helvetica, arial, sans-serif;
    text-align: center;
}

#page-footer .links {
    margin-bottom: 10px;
}

#page-footer .links a {
    margin: 0 3px;
    color: white;
}

/* navigation */
#navigation {
    height: 35px;
    background: url(/static/images/main/navigation/background.png) right top;
    position: relative;
}

#navigation ol {
    height: 35px;
    list-style: none;
    margin: 0;
    float: left;
}

#navigation ol.main-nav {
    padding: 0 0 0 5px;
}

#navigation li {
    display: block;
    float: left;
    height: 35px;
}

#navigation li.selected {
    height: 38px;
    background-image: url(/static/images/main/navigation/tabs.png);
    text-indent: -99999px;
    margin-top: -3px;
}

#navigation li.home {
    width: 46px;
    background-position: 0 0px;
}
#navigation li.logout {
    width: 59px;
    background-position: 0 -38px;
}
#navigation li.account {
    width: 83px;
    background-position: 0 -76px;
}
#navigation li.dvd {
    width: 107px;
    background-position: 0 -114px;
}
#navigation li.text {
    width: 113px;
    background-position: 0 -152px;
}
#navigation li.call {
    width: 112px;
    background-position: 0 -190px;
}
#navigation li.letter {
    width: 123px;
    background-position: 0 -228px;
}
#navigation li.visit {
    width: 112px;
    background-position: 0 -266px;
}

#navigation li.selected a {
    background-image: none;
}

#navigation li a {
    background-image: url(/static/images/main/navigation/buttons.png);
    text-indent: -99999px;
    display: block;
    height: 35px;
}

#navigation li a.home {
    width: 41px;
    background-position: 0 0px;
}

#navigation li a.home:hover {
    width: 41px;
    background-position: 0 -35px;
}

#navigation li a.logout {
    width: 54px;
    background-position: 0 -70px;
}

#navigation li a.logout:hover {
    width: 54px;
    background-position: 0 -105px;
}

#navigation li a.account {
    width: 78px;
    background-position: 0 -140px;
}

#navigation li a.account:hover {
    width: 78px;
    background-position: 0 -175px;
}

#navigation li a.dvd {
    width: 102px;
    background-position: 0 -210px;
}

#navigation li a.dvd:hover {
    width: 102px;
    background-position: 0 -245px;
}

#navigation li a.text {
    width: 108px;
    background-position: 0 -280px;
}

#navigation li a.text:hover {
    width: 108px;
    background-position: 0 -315px;
}

#navigation li a.call {
    width: 107px;
    background-position: 0 -350px;
}

#navigation li a.call:hover {
    width: 107px;
    background-position: 0 -385px;
}

#navigation li a.letter {
    width: 118px;
    background-position: 0 -420px;
}

#navigation li a.letter:hover {
    width: 118px;
    background-position: 0 -455px;
}

#navigation li a.visit {
    width: 107px;
    background-position: 0 -490px;
}

#navigation li a.visit:hover {
    width: 107px;
    background-position: 0 -525px;
}

#navigation div.new-badge {
    width: 29px;
    height: 30px;
    position: absolute;
    background: url(/static/images/main/navigation/new_badge.png) no-repeat;
}

#navigation #dvd-badge {
    left: 250px;
    top: -19px;
}

#navigation ol.user {
    float: right;
    padding: 0 5px 0 0;
}

#navigation ol.user li.details {
    font-size: 90%;
    padding-top: 10px;
}

/* progress */
div.progress {
    margin; 10px 0;
    padding: 3px;
    background-color: #f0f0b9;
    border: #d3d3a3 1px solid;
}

div.progress ul {
    float: left;
    list-style: none;
    margin: 0;
    padding: 0;
}

div.progress li {
    display: inline;
    padding: 0 5px 0 0;
    color: #009900;
}

div.progress a {
    color: #009900;
}

div.progress a:hover {
    text-decoration: none;
}

div.progress li.current {
    font-weight: bold;
    color: #cc0000;
}

div.progress span.indicator {
    color: black;
    float: right;
}

/* santa says */
div.santa-says {
    margin: 10px 0;
    position: relative;
    min-height: 60px;
}

div.santa-says img.santa {
    position: absolute;
}

div.santa-says div.bubble {
    background-color: white;
    position: relative;
    border: #cccccc 1px solid;
    padding: 0 10px;
    -moz-border-radius: 10px;
    margin-left: 80px;
}

div.santa-says div.bubble h3 {
    margin: 10px 0;
    color: #cc0000;
}

div.santa-says div.bubble .video {
    margin: 10px 0;
    width: 320px;
    height: 200px;
}

div.santa-says div.bubble .video-large {
    margin: 10px 0;
    width:640px;
    height:385px;
}

div.santa-says div.bubble div.triangle-left {
    position: absolute;
    width: 13px;
    height: 9px;
    background: url(/static/images/bubble/triangle_left.png) no-repeat;
    top: 10px;
    left: -13px;
}

div.santa-says h2 {
    color: #cc0000;
    margin: 10px 0;
    font-size: 120%;
}

/* notepad */
div.notepad {
    margin: 10px 0;
}

div.notepad div.top {
    background: url(/static/images/notepad/top.png) no-repeat;
    height: 35px;
    width: 711px;
}

div.notepad div.content {
    background: url(/static/images/notepad/centre.png) repeat-y;
    padding: 1px 25px 5px 35px;
}

div.notepad div.bottom {
    background: url(/static/images/notepad/bottom.png) no-repeat;
    height: 13px;
    width: 709px;
}

div.notepad div.content > p:first-child {
    margin-top: 0;
}

div.notepad .highlight {
    color: #cc0000;
}

div.notepad h2 {
    color: #cc0000;
    margin: 5px 0;
    font-size: 120%;
}

div.notepad div.hr {
    border-top: #666666 1px solid;
    background: none;
    height: 1px;
    margin: 5px 0;
    clear: both;
}

div.notepad img.logo {
    margin: 0 auto 10px auto;
    display: block;
}

/* icon list */

ul.icon-list {
  margin: 0;
  padding-left: 0;
  list-style: none;
  margin-top: 10px;
}

ul.icon-list li {
  background-repeat: no-repeat;
  padding: 3px 0 10px 30px;
  margin-bottom: 10px;
}

ul.icon-list li.letter {
  background-image: url(/static/images/icons/white_icon_list/standard_letter.gif);
}

ul.icon-list li.call {
  background-image: url(/static/images/icons/white_icon_list/call.gif);
}

ul.icon-list li.tick {
  background-image: url(/static/images/icons/white_icon_list/tick.gif);
}

ul.icon-list li.cross {
  background-image: url(/static/images/icons/white_icon_list/cross.gif);
}

ul.icon-list li.textmas {
    background-image: url(/static/images/icons/white_icon_list/mobile.gif);
}

ul.icon-list h2 {
    font-weight: normal;
    font-size: 120%;
    color: #cc0000;
    margin-top: 0;
}

/* box out */

div.boxout {
    padding: 10px;
    margin: 10px 0;
    border-right: #cccc66 1px solid;
    border-bottom: #cccc66 1px solid;
    background-color: #ffffcc;
    zoom: 1;
}

/* product type */
div#product-types {}

div#product-types div.item {
    margin-bottom: 10px;
    border: #cccccc 1px solid;
    width:328px;
    height: 168px;
    float: left;
    margin: 10px;
    position: relative;
}

div#product-types div.item:hover {
    border: #dfdfb8 11px solid;
    margin: 0px;
}

div#product-types div.item a.clear {
    display: block;
    text-indent: -99999px;
    width: 328px;
    height: 108px;
}

div#product-types div.heading-panel {
    background-color: white;
    position: absolute;
    opacity: 0.8;
    filter: alpha(opacity=80);
    bottom: 0;
    padding: 5px;
    width: 318px;
    height: 50px;
}

div#product-types div.heading-panel a.title {
    font-size: 145%;
    color: #cc0000;
    letter-spacing: -1px;
}

div#product-types div.heading-panel div.links {
    position: absolute;
    right: 5px;
    bottom: 5px;
}

div#product-types div.heading-panel div.synopsis {
    margin-top: 2px;
    font-size: 80%;
    color: #006600;
}

div#product-types div#call-recorded {
    background-image: url(/static/images/recorded_calls/intro/santa_calls_recorded.jpg);
}

div#product-types div#call-live {
    background-image: url(/static/images/live_call/intro/santa_calls_live.jpg);
}

div#product-types div#letter-classic {
    background-image: url(/static/images/letters/intro/santa_letter_classic.jpg);
}

div#product-types div#letter-special {
    background-image: url(/static/images/letters/intro/santa_letter_special.jpg);
}

div#product-types div#letter-magicsnow {
    background-image: url(/static/images/letters/intro/santa_letter_snow.jpg);
}

div#product-types div#letter-deluxe {
    background-image: url(/static/images/letters/intro/santa_letter_deluxe.jpg);
}

div#product-types div#dvd {
    background-image: url(/static/images/dvd/intro/santa_dvd.jpg);
}

div#product-types div#dvd-letter {
    background-image: url(/static/images/dvd/intro/santa_letter_dvd.jpg);
}

/* site warning */
.site-warning {
    background-color: red; 
    color:white;
    font-size: 150%;
    padding: 5px; 
    border-bottom: white 1px solid;
}

.site-warning a {
    color:white;                                                                                                                            
}