body {
    background-color: #6895BE;
    margin:0;
}
h1 {
    font-size: 22px;
}
h1, h2, h3, table.table-formatted th {
    font-family: arial, sans-serif;
}

a, ul.menu li.account ul li a {
color: #1e3a8c;
}
a:hover, ul.menu li.account ul li a:hover, #page-footer-wrapper #page-footer a:hover {
    color:#777;
}

#page-title-wrapper {
    background:none;
    max-width:100%;
    padding:0;
    width:100%;
    margin:0 auto 0;
    }
    #page-title {
    background-image:url(../images/header_1003.jpg);
    padding-top:0px;
    height:148px;
    width:1003px;
    }
    #page-title h1 {
    margin:0;
    padding: 0;
    }
    #page-title h1 a {
    height:130px;
    width:280px;
    margin:0;
    padding: 0;
    text-indent: 0;
    display:block;
    }
    #page-title h1 a span {
    display: none;
    }


#page-content-wrapper {
    width:100%;
    padding:0;
}
    #page-content {
        width:auto;
        background-color: #fff;
        padding: 20px;
    }

div.pick-selector div.ticket-admittance div.ticket {
  color:#000;
}

#above-content {
    background-color: #EEEFF3;
    border: 1px solid #EEEFF3;
    padding: 3px 0;
}

.parent_event .image a img {
    width:115px;
    }
    .image {
    box-shadow: 0 0 5px #ccc;
    }
div.content-wrapper .body img {
    float:right;
    margin:0 0 10px 10px;
    box-shadow: 0 0 5px #ccc;
}

#crumbs {background-color: transparent; width:auto;}
#crumbs li a, ul.menu li.account ul li a, ul.menu li.cart a {color:#000;}
#crumbs li a:hover, ul.menu li.account ul li a:hover, ul.menu li.cart a:hover, #crumbs li {color:#777;}
#crumbs li a {background: url(../images/crumb.gif) no-repeat right center;}

ul.menu li.account {
    background-color: transparent;
    border-left: 1px solid transparent;
}

ul.menu li.logged-in ul {
    background-color: #ddd;
}
ul.menu ul {
    border:1px solid #ddd;
}
ul.menu li.logged-in ul, ul.menu li.logged-out ul {
    background: #ddd;
}
ul.menu li.account:hover {
    background-color: #ddd;
    border: 1px solid #ddd;
}


.button, .event-date-list a, input[type="submit"], a.checkout-home, #formSeatSelection .button {
    background-color: #6895BE;
    border: 1px solid #6895BE;
    color:#fff;
    font-weight:bold;
    }
    .button:hover, #formSeatSelection .button:hover, .content #formConfirm .button:hover, .content .button:hover, .event-date-list a:hover, input.button:hover, input[type="submit"]:hover, a.checkout-home:hover, a.checkout-home:hover {
    background-color: #777;
    border: 1px solid #777;
    color:#fff;
    }
    a.details {
    background-color: #aaa;
    border: 1px solid #aaa;
    color:#fff;
    }

td.event-date-list-action a:after,
a.button:after {
    content:"Buy Tickets";
}
    td.event-date-list-action a span,
    a.button span {
    display: none;
    }
    a.button.details:after {
    content:"";
    }
    a.button.details span {
    display:block;
    }
    a.checkout-home:after {
    content:"Buy More Tickets";
    }
    a.checkout-home span {
    display: none;
    }
    table.ticket-select td a:after {
        content:"";
    }

table.table-formatted td {
border-bottom: 1px solid #dedede;
}
div.toggla label {
    background: none;
    padding: 0;
}
div.toggla label a {
    color:#333;
    cursor: text;
}
div.map {
    padding: 0;
    border:none;
}

.plan-select, .voucher-activate {
    display: none;
}

#drawing-board-container {
    background:url(../images/plan_bg.png) top center;
    }
    .drawing-board {
    background-color: transparent;
    }

.calendar_event:before {
  content: "DRAFT PROGRAMME. If you are an event organiser please click on the relevant 'Event Details' button to check that the info we have so far is correct, and please email amendments, additions or pictures to web@speenfestival.org";
  color: red;
}

#page-footer-wrapper {
    background: none;
    background-color: transparent;
    color: #eee;
    width: 100%;
    font-size:13px;
    }
    #page-footer-wrapper #page-footer {
    color:#eee;
    margin:0 auto;
    }
    #page-footer-wrapper #page-footer a{
    color: #eee;
    }
    #page-footer-wrapper #page-footer a:hover{
    color: #eee;
    cursor: text;
    }
    #page-footer-wrapper #page-footer a.contact-us-link, #page-footer-wrapper #page-footer a.terms-link, #page-footer-wrapper #page-footer a.privacy-link{
    color: #fff;
    cursor: pointer;
    }
    #page-footer-wrapper #page-footer a.contact-us-link:hover, #page-footer-wrapper #page-footer a.terms-link:hover, #page-footer-wrapper #page-footer a.privacy-link:hover {
    color: #000;
    }

/* payment page */
.field label {
    width: 100%;
    padding: 0 5px;
    }
    .form-payment input {
    width: 91%;
    }
    .form-payment .formRow {
    margin: 0 5px;
    }
    .form-payment .input-card-code {
    width: 18%;
    }
    .form-payment .expiry-date select:nth-child(1) {
    width: 54%;
    }
    .form-payment .expiry-date select:nth-child(2) {
    width: 36%;
    }
    .form-payment select {
    width: 150px;
    }
    .form-payment .auth-net-review .review-label label,
    .form-payment .auth-net-review label {
    color:#383838;
    }
    .form-payment .auth-net-review .review-label label {
    width:54%;
    }
    .form-billing-address h3.form-sub-head,
    .form-card-details h3.form-sub-head {
    padding-bottom: 10px;
    }

/* responsive code */
@media only screen and (min-width: 570px) {
    .form-payment input {
    width: 220px;
    }
    .form-payment .input-card-code {
    width: 44px;
    }
    .form-payment .expiry-date select:nth-child(1) {
    width: 122px;
    }
    .form-payment .expiry-date select:nth-child(2) {
    width: 80px;
    }
}

@media only screen and (max-width: 599px) {
    .menu {
        display: none;
    }
    div.fblike {
        width:50%;
        margin-bottom: 15px;
    }
}

@media only screen and (min-width: 640px) {
    .form-payment select {
    width: 150px;
    }
  }
@media only screen and (min-width: 874px) {
    .field label {
    width: 160px;
    padding:5px;
    }
    .form-payment .formRow {
    margin:5px;
    }
    .form-billing-address h3.form-sub-head,
    .form-card-details h3.form-sub-head {
    padding-bottom: 0;
    }
}

@media only screen and (min-width: 1003px) {
    #page-title {
    background-image:url(../images/header.jpg);
    padding-top:0px;
    height:148px;
    width:991px;
    }
    #page-content {
        width:951px;
    }
    #page-footer-wrapper #page-footer {
        width:930px;
    }
}