html {
    overflow-y: scroll;
}

body {
    font-size: 12pt;
    font-family: 'Titillium Web',Helvetica,Arial,sans-serif;
    background-color: white;
    background-position: center top;
    text-align: left;
    margin: 0px !important;
    font-weight: bold;
}

/* Page column Sizes */
div#body_container {
    /*width: 1082px;  1082 + 18 scroll bar = 1100 */
    width: 900px;
    height: 100%;
    background-color: White;
    text-align: left;
    margin-left:0px !important;
    margin-right:0px !important;
}


div#content_container {
    /*width: 1059px;*/
    width: 900px;
    min-height: 368px;
    text-align: left;
    /* top right bottom left */
    margin: 0px !important;
    padding: 0px 0px 0px 0px;
}


/* DLCHANGED2107 */
div#content_container.preview_schedule {
    /* width: 1180px; */
    width: 900px;
}


div#publication_container {
    font-weight: normal;
    min-height: 320px;
}

div#publication_container label  {
    font-weight: normal;
    font-size: 9pt;
}

div#content_container > div.column.left {
    float: left;
    width:0px;
    min-height:50px;
}

div#content_container > div.column.middle {
    margin-left: 24px;
    box-sizing:border-box;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    border-top:1px solid #d7d7d7;
    border-right: 1px solid #D7D7D7;
    width: 685px !important;
}

/* DLCHANGED2107
div#content_container.preview_schedule > div.column.middle {
    width: 834px !important;
    width: 634px !important;
}
*/


div#content_container > div.column.right {
    border-top:1px solid #d7d7d7;
}

.right {
    width: 191px;
}

/* END OF PAGE */
div.map_left_panel {
    float: none;
    width: auto;
}

.map_selected_image {
    width: 550px;
    height: 420px;

}

.map_selected_image_c {
    width: 550px;
    height: 564px;
}

.map_section_info {
    position: absolute;
    top: 0px;
    left: 0px;
    display: none;
    z-index: 1;
}




/* Carousel */
.carousel_outer_box {
    width: calc(100% - 7px);
    display: block;
    height: 150px;
}

.carousel_inner_box {
    width: calc(100% - 25px);
}

.jcarousel-skin-custom .jcarousel-container-horizontal {
    width: calc(100% - 3px);
    padding: 5px 0px 0px 15px;
}

.jcarousel-skin-custom .jcarousel-clip-horizontal {
    width: calc(100% - 20px);
}

div.map_left_panel_section {
    width: 215px;
    height: 18px;
}

div#preview_container.tabbed_layout {
    height: 400px;
    width: 350px;
}

div.doc_content.frame.tabbed {
    padding-right: 6px !important;
    padding-left: 6px !important;
}

.frame.tabbed div.doc_content.doccontent_panel > div input,
.frame.tabbed div.doc_content.doccontent_panel > div textarea,
.frame.tabbed div.doc_content.doccontent_panel > div iframe {
    width: 300px !important;
    /* was 98% */
}

div#designmode_accordian_section div.grid_container {
    height: 193px; /* was 255px */
}

div#designmode_accordian_section div.grid_item {
    height: 185px; /* Was 250px */
}

div#designmode_accordian_section div.grid_item img {
    max-height: 190px; /* 237px */
}

div#classification_accordian_section div.grid_item {
    width: 162px;
    height: 157px;
    background-color: #CCC;
}

div#classification_accordian_section div.grid_item img {
    max-height: 147px;
    max-width: 283px;
}

div.grid_item:nth-child(2n) {
    float: left;
}

/* --- Info Panel --*/
#info_panel {
    width: 167px !important;
    min-height: 420px;
    margin-left: 24px;
    margin-right: 24px;
    padding: 0 0 0 0;
    background-image: none;
    border-style: none;
    font-size: 10pt;
}

#info_panel ul {
    color: black;
}

#info_panel h3 {
    font-size: 12pt;
    margin-top:12px;
    padding-bottom:12px;
}

#info_panel h3.price_total {
    text-align: left;
    padding-left: 8px;
    font-size: 300%;
    background-color: black;
    color: white;
}

#info_panel h4 {
    color: black;
    font-size: 10pt;
    font-weight: bold;
}

#info_panel section[section-key="schedule"] {
    padding: 8px;
    background-color: lightgrey;
    color: black;
}

#info_panel section[section-key="schedule"] li {
    color: black;
    display: inline-block;
}

#info_panel section[section-key="schedule"] li[title] {
    display: list-item;
    font-size: 10pt;
    font-weight: bold;
}


#info_panel span#price_total_msg {
    top: 10px;
    position: relative;
    background-color: black;
    color: darkorange;
    display: block;
    line-height: 22px;
    padding-left: 8px;
    font-size: 11pt;
    font-weight: bold;
}

#info_panel span#price_total_msg span{
    padding-right: 20px;
}

#postcodePrice {
    background-color: white;
    color: darkorange;
    height: 80px;
    margin-left:24px;
    border:1px solid lightgrey;
    text-align:center;
}

#postcodePrice span#price_total_msg {
    display: block;
    height: 22px;

    top: 10px;
    padding-bottom:10px;
    padding-left: 0px;
    position: relative;



    color: black;
    font-size: 18pt;
    font-weight: bold;
    line-height: 22px;

    text-align:center;
}

#postcodePrice h3.price_total {
    text-align: center;
    padding-left: 8px;
    font-size: 200%;
    margin-top: 2px;
}
/* END OF INFO PNAEL */

div.bread_crumb_items {
    float:left;
    padding-bottom: 12px
}

div#circulationPrices {
    font-size: 8pt;
  /*  height: 214px; Make it sit up and neat */
    overflow: auto;
    margin-left:24px;
}

#paybyinvoiceOLD {
    background: #3498db;
    background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
    background-image: -moz-linear-gradient(top, #3498db, #2980b9);
    background-image: -ms-linear-gradient(top, #3498db, #2980b9);
    background-image: -o-linear-gradient(top, #3498db, #2980b9);
    background-image: linear-gradient(to bottom, #3498db, #2980b9);
    -webkit-border-radius: 28;
    -moz-border-radius: 28;
    border-radius: 28px;
    font-family: Arial;
    color: #ffffff;
    font-size: 12px;
    padding: 10px 20px 10px 20px;
    text-decoration: none;
}

#paybyinvoiceOLD:hover {
    background: #3cb0fd;
    background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
    background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
    background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
    background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
    background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
    text-decoration: none;
}

#paybycreditOLD {
    background: #3498db;
    background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
    background-image: -moz-linear-gradient(top, #3498db, #2980b9);
    background-image: -ms-linear-gradient(top, #3498db, #2980b9);
    background-image: -o-linear-gradient(top, #3498db, #2980b9);
    background-image: linear-gradient(to bottom, #3498db, #2980b9);
    -webkit-border-radius: 28;
    -moz-border-radius: 28;
    border-radius: 28px;
    font-family: Arial;
    color: #ffffff;
    font-size: 12px;
    padding: 10px 20px 10px 20px;
    text-decoration: none;
}

#paybycreditOLD:hover {
    background: #3cb0fd;
    background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
    background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
    background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
    background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
    background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
    text-decoration: none;
}




div.accordion_header {
    /*width: 718px; */
    width:688px;
    background-color: #ffffff;
    color: #000000;
    background-image: none !important;
    border-bottom: 1px solid lightgrey;
    border-left: 0px;
    border-right: 0px;
    text-align: left;
    width:688px;
    margin-bottom:12px;
}

div.accordion_header.selected {
    background-color: #ffffff;
    color: #000000;
    background-image: none !important;
    border-bottom: 1px solid lightgrey;
    border-left: 0px;
    border-right: 0px;
    text-align: left;
    width:670px;
    margin-bottom:12px;
}

/* DLCHANGED201607 */
.preview_schedule div.accordion_header.selected {
    width: 665px;
}


div.display_grid_container {
    width: 688px;
    height: 332px;
    background-color: white;
    border-style: solid;
    border-color: #D7D7D7;
    border-width: 1px;
    overflow-x: hidden;
    overflow-y: scroll;

    /*padding: 5px 5px 5px 5px; */
}

div.display_grid_container#packages_list {
    height: 482px;
}

div.display_grid_container#packages_list.classified {
    height: 510px;
    width: 535px;
}

/* GRID */

/*
div.grid_container {
    width: auto;
    Disabled for packages and styles page
}
*/
div.grid_container {
    background-color: white;
    border-color: #d7d7d7;
    border-style: solid;
    border-width: 1px;
    height: 332px;
    overflow-x: hidden;
    overflow-y: scroll;
    padding: 0px 8px;
    width: 667px !important; /* Set for packages and style page template grid 662px
            Set to 665 pixels for grid of selection images
            Set to 667 pixels to keep Google CHrome happy in display mode
            Set to 688pixels to
            WAS 667px
            */
}

div.display_grid_item {
    width: 162px;
    height: 241px;
    float: left;
    text-align: center;
    background-color: #ffffff;
    padding-left: 4px;
    cursor: pointer;
    overflow: hidden;
}


div.display_grid_item:nth-child(2n) {
    float: right;
}

#packages_list div.display_grid_item:nth-child(2n){
    float: left;
}

div.display_grid_item.selected {
    background-color:#5DAEE1;
}

div.display_grid_item input {
    display: none;
}

#packages_list.classified div.classified_grid_item {
    width: 162px;
    height: 241px;
}

div.classified_grid_item {
    width: 293px;
    height: 157px;
    float: left;
    text-align: center;
    background-color: #CCCCCC;
    margin: 5px;
    cursor: pointer;
    overflow: hidden;
}

div.classified_grid_item:nth-child(2n) {
    float: right;
}

div.classified_grid_item.selected {
    background-color:#5DAEE1;
}

div.classified_grid_item input {
    display: none;
}


/* Coded on Friday evening a box to hold messages in */
/* removed padding as it overflows on build and category page */
#page_validation {
    margin-bottom: 24px;
    margin-right: 24px;
    margin-top: 12px;
    padding: 0px;
    width: 664px;
    border: 1px solid lightgrey;
    display: none;
}


.frame.tabbed div.doc_content.doccontent_panel {
    background: white none repeat scroll 0 0;
    width: 386px;
}

/* Build page tab selected */
div.doc_content.frame > ul > li.selected {
    background: #ffffff none repeat scroll 0 0;
    border-top: 1px solid #d7d7d7;
    /* color: #0b6098; */
    color:black;

}

div.doc_content.frame > ul > li {
    background: #FF8700 none repeat scroll 0 0;
    border-top: 1px solid darkgrey;
    border-bottom: medium none;
    border-left: 1px solid darkgrey;
    border-right: 1px solid darkgrey;
    color: #ffffff;
    cursor: pointer;
    display: none;
    font-size: 10pt;
    font-weight: bold;
    height: 12px;
    list-style: outside none none;
    margin-right: 3px;
    padding: 0.3em 1em 0.8em;
    text-align: center;
}

/* The Preview page skinning skde by side */
div.preview_right_panel {
    float: right;
    width: 415px;
    border:1px solid #d7d7d7;
    pading: 5px;
}

div#scheduling_instructions {
    background-color: #ffffff;
    border: 1px solid #d7d7d7;
    font-size: 10pt;
    height: 55px;
    margin: 12px;
    width: 380px; /* Make wider */
}

div.scheduling_calendar {
    padding: 0px !important;
    margin-left: 12px !important;
}
/*
ul.scheduling_tab {
    display: inline-block;
    float: right;
    list-style: outside none none;
    margin: 0;
    padding: 5px;
    vertical-align: top;
    width: 50%;
}
*/
ul.scheduling_tab {
    display: inline-block;
    float: right; /* Move to the right */
    list-style: outside none none;
    margin: 0px;
    vertical-align: top;
    width: 100%;  /* Adjust the width  to fit better */
}

ul.scheduling_tab li {
    background-color: #0b6098;
    background-size: 202px 20px;
    border-bottom: 1px solid white;
    border-right: 1px solid white;
    color: #5daee1;
    cursor: pointer;
    font-size: 8pt;
    height: 20px;
    line-height: 20px;
    margin: 0;
    overflow: hidden;
    padding-left: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: auto;
}
/* Fif the header weight and position */
div.preview_right_panel > div:first-child {
    font-size: 10pt;
    font-weight: 600;
    line-height: 32px;
    margin-bottom: 10px;
    margin-left: 12px;
    text-align: left;
}

div.preview_container {
    min-height: 300px;
    text-align: center;
    width: 230px;
    float: left;
}

div#preview_container {
    min-height: 300px;
    text-align: left;
    width: 230px;
    float: left;
}

.preview_schedule div.preview_container {
    height: 400px;
    width: 230px;
}

.scheduling_wrapper {
    display: inline-block;
    float: right;
    height: 200px;
    overflow-y: scroll;
    width: 190px;
    border:1px solid #d7d7d7;
    margin-left: 0px;
    margin-right: 12px;
}

#scheduling_tabs {
    height: 200px;
}

div.scheduling_container {
    border: none;
    padding: 4px 5px 12px 5px;
    margin-top: 5px;
    background-color: white;
    /*border: 1px #D7D7D7 solid; */
    overflow: hidden;
    position: relative;
    min-height: 250px;
}

.ui-datepicker {
    display: none;
    padding: 0.2em 0.2em 0;
    width: 15em; /* adjusts width of date picker */
}

/* End of preview page skinning */

.loggedInBox {
    background-color: white;
    /*border: 1px solid #d7d7d7; */
    border: none !important;
    display: inline-block;
    margin-left: calc(48px + 7px);
    /*margin-left: 5px; */
    padding-left:5px;
    margin-right: 0px;
    margin-top:5px;
    text-align: left;
    width: 127px;
}

/* background-color: #ffffff; */
.preview_action_save {
	background:none ;
    background-image:none !important;
    background-color: blue;
	color:black !important;
    /* background-image: url("../../../adportal/img/borderTop.png"); */
    /* background-position: center top;
    background-repeat: repeat-x; */
     border: 1px solid darkgrey !important;
    /* border-top: medium none; */
    padding-top: 2px;
    word-break:keep-all;
    width:200px !important;

}

div#saveAd {
    padding-bottom: 12px;
    text-align: center;
}

.postcodeContainer {
    margin-left:12px;
    padding-left:12px;
}

#postcodeList {
    width: 300px;
    height: 550px;
    margin-left:0px;
    margin-right: 0px;
}

div.schedule_leaflet > div:first-child {
    width: 295px;
}

/* Hover over buttons */


a.action_prev {
    background: url(../../../adportal/img/backArrow2.jpg) no-repeat right;
    width: 118px;
    font-size: 12pt;
    text-align: center;
    line-height: 28px;
    color: #5A5A5A;
}

a.action_prev:active {
    background: url(../../../adportal/img/backArrowHover.jpg) no-repeat right;
    width: 118px;
    font-size: 12pt;
    text-align: center;
    line-height: 28px;
    text-decoration: none;
    color:#FA8706;
}

a.action_prev:hover {
    background: url(../../../adportal/img/backArrowHover.jpg) no-repeat right;
    width: 118px;
    font-size: 12pt;
    text-align: center;
    line-height: 28px;
    text-decoration: none;
    color:#FA8706;
}

a.action_next {
    background: url(../../../adportal/img/nextArrowHover.jpg) no-repeat left;
    width: 118px;
    font-size: 12pt;
    text-align: center;
    line-height: 28px;
    color: #FA8706;
}

a.action_next.paybycreditButton, a.action_next.paybycreditButton:active, a.action_next.paybycreditButton:hover {
    width: 145px;
}

a.action_next:active {
    background: url(../../../adportal/img/nextArrowHover.jpg) no-repeat left;
    width: 118px;
    font-size: 12pt;
    text-align: center;
    line-height: 28px;
    text-decoration: none;
    color:#FA8706;
}

a.action_next:hover {
    background: url(../../../adportal/img/nextArrowHover.jpg) no-repeat left;
    width: 118px;
    font-size: 12pt;
    text-align: center;
    line-height: 28px;
    text-decoration: none;
    color:#FA8706;
}

.dialogBoxButtons {
    margin: 7px 3px 10px 16px;
    border-radius: 5px;
    background-color: white;
    position: absolute;
    bottom: 4px;
    left: 50px;
    right: 4px;
}

/* Add the header that doesn't mean anything */
div.accordion_header_message {
    /* width: 718px; */
    width: 688px;
    height:25px;
    display: inline-block;
    background-color: #ffffff;
    color: #000000;
    background-image: none !important;
    border-bottom: 1px solid lightgrey;
    border-left: 0px;
    border-right: 0px;
    text-align: left;
    /* margin-bottom: 12px; */
    font-size: 10pt;
    margin: 2px auto 5px 0px;

}
div.accordion_header_message h3 {
    margin: 0px;
    padding-top: 4px;
}

.uploadRemote, .uploadRemote.disabled {
    opacity: 0;
}
/* Fixing the upload dialog Upload and Gallery buttons */
.uploadRemote span {
    bottom: 1px;
    font-size: 9pt;
    left: 10px;
    position: relative;
}

.dialogCaption {
    font-weight: normal;
    left: 10px;
    position: absolute;
    right: 10px;
    top: 60px;
}
/* Calendar skinning
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited {
    color: #ffffff;
    text-decoration: none;
    border: none;
    background: none;
    background-image:none;
    font-weight:normal;
}
*/

/* .ui-state-default
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    border: 1px solid #ffffff;
    background: #1484e6 url("../../../adportal/css/images/ui-bg_diagonals-thick_22_1484e6_40x40.png") 50% 50% repeat;
    font-weight: bold;
    color: #ffffff;
}
*/
a.ui-state-active {
    border: 1px solid #ffffff;
    background-color:inherit;
    background-image: inherit;
    /* background: #1484e6 url("../../../adportal/css/images/ui-bg_diagonals-thick_22_1484e6_40x40.png") 50% 50% repeat !important; */
    font-weight: bold !important;
    text-decoration: none !important;
}

td.ui-state-active {
    color: #ffffff !important;
    text-decoration: none !important;
    border:  1px solid #e69700 !important;
    background: #e69700 url("../../../adportal/css/images/ui-bg_diagonals-thick_20_e69700_40x40.png") 50% 50% repeat !important;
}


div.doc_content.doccontent_panel > div.text_field span {
    margin-left: 5px;
    display:block;
}

div.loggedInMessage {
    padding-left: 0px;
    display: inline-block;
    padding-top: 12px;
}

.top_action_bar {
    height: 27px;
}

.validationMessages, .validationMessages div.validationTitle {
    color: red;
}

div.validationMessagesDocContent {
    position: relative;
    left: 0px;
    width: 650px;
    margin-bottom: 10px;
}

.leftDialogButton.uploadLocal {
    text-align: center;
}

.example_msg {
    font-style: italic;
    font-weight: normal;
    font-size: 14px;
}

.register_msg {
    font-weight:bold;
    font-size:13px;
}
.build_right_panel {
    float: left;
}

.notification_messages{
    margin-botton: 24px;
    margin-right: 24px;
    margin-top: 12px;
    padding: 12px;
    width: 664px;
    border: 1px solid lightgrey;
    display: none;
    color: green;
}

.warning_messages{
    margin-botton: 24px;
    margin-right: 24px;
    margin-top: 12px;
    padding: 12px;
    width: 664px;
    border: 1px solid lightgrey;
    display: none;
    color: red;
}

.waitDialog.notificationDialog img{
    position: absolute;
    left: 123px;
    top: 35px;
}

.footer {
    clear: both;
}


.longButton {
    -webkit-border-radius: 28;
    -moz-border-radius: 28;
    border-radius: 28px;
    font-family: Arial;
    color: #ffffff;
    font-size: 12px;
    background: #FA8706;
    padding: 10px 100px 10px 100px;
    text-decoration: none;
    display: block;
    width: 115px;
    text-align: center;
    height: 10px;
    margin-left: 10px;
    margin-top: 10px;
}

.longButton:hover {
    background: #3cb0fd;
    background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
    background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
    background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
    background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
    background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
    text-decoration: none;
}

.resetButton {
  width: 30px;
  display: block;
  height: 12px;
  background: #FA8706;
  -webkit-border-radius: 10;
  -moz-border-radius: 10;
  border-radius: 10px;
  font-family: Arial;
  color: #ffffff;
  font-size: 11px;
  padding: 10px 10px 10px 10px;
  text-decoration: none;
}

.resetButton:hover {
  background: #3cb0fd;
  background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
  background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
  text-decoration: none;
}

.bkoPubBackground {
    background-color: lightblue !important;
}
.bkoOnlyPubBackground {
    background-color: lightskyblue !important;
}

#content_validation {
    margin-bottom: 24px;
    margin-right: 24px;
    margin-top: 12px;
    padding: 0px;
    width: 664px;
    border: 1px solid lightgrey;
}

.stepOneLeftButton {
    display : none;
}

.stepOneRightButton {
    color:#FFFFFF;
    line-height:16px;
    background: url("../../../adportal/img/webcomponents/shared/button_small.png");
    width: 67px;
    height: 19px;
    cursor: pointer;
    opacity: 1;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    border-radius : 5px;
    text-align : center;
    postion : relative;
    right : 110px;
    bottom : 0px;
}

#register_personal_account{
    padding-left: 80px;
}