body {
    color:#444;
    font-family:Arial, Helvetica, sans-serif, Verdana;
    font-size:13px;
    font-weight:normal;
    text-align:left;
    /*background:#FFF url(images/headbg2015.jpg) top center no-repeat;*/
}
h1 { color:#004580; font-family:'Open Sans',sans-serif,arial; font-weight:bold; font-size:22px; margin-bottom:16px; }
h2, h2 a { color:#d52831; font-family:'Open Sans',sans-serif,arial; font-weight:bold; font-size:18px; margin-bottom:16px; margin-top:20px; }
h2 a {text-decoration: underline;}
h2 a:visited {color:#d52831;}
h3 { color:#004580; font-family:'Open Sans',sans-serif,arial; font-weight:bold; font-size:15px; margin-bottom:10px; margin-top:15px; }
p { margin-bottom:8px; }
ul, ol { margin:0px 0px 10px 20px; }
li { margin-bottom:5px; }
label { color:#3d7eb6; font-weight:bold; cursor:pointer; }
input[type="checkbox"], input[type="radio"], select { cursor:pointer; font-family:arial; font-weight:normal; }
input[type="text"], input[type="password"], select, textarea {
    font-size:13px;
    font-weight:normal;
    color:#333;
    border:1px solid #b6c6d4;
    -webkit-border-radius:5px;
    border-radius:5px;
    padding:8px 10px 10px 13px;
}
textarea { resize:none; overflow:none; }
select {
    padding-right:30px; /* correction */
    line-height: 1;
    background: url(images/sel-downarrow.png) no-repeat right center;
    -webkit-appearance: none; /* Removes default chrome and safari style */
    -moz-appearance: none; /* Removes Default Firefox style*/
    appearance: none;
    text-indent: 0.01px; /* Removes default arrow from firefox */
    text-overflow: "";  /* Removes default arrow from firefox */
}
input[type="text"]:hover, input[type="password"]:hover, select:hover, textarea:hover { border-color:#004580; -webkit-transition: all .5s ease; transition: all .5s ease; }
input[type=submit], input[type=button], button {
    -webkit-appearance:none; /* ios hack */
    cursor:pointer;
    color:#fff; background-color:#d52831;
    border:0px solid #d52831;
    font-size:14px; font-weight:bold;
    -webkit-border-radius:5px; border-radius:5px;
    padding:9px 20px 11px 20px;
}
input[type=submit]:hover, input[type=button]:hover, button:hover{ background-color:#fa3640; -webkit-transition: all .5s ease; transition: all .5s ease; }
hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:10px 0px; }

.pad10 { margin:10px 0px; }
.pad15 { margin:15px 0px; }
.pad20 { margin:20px 0px; }
.rounded { -webkit-border-radius:8px; border-radius:8px; }
.greyborder { border:1px #ddd solid; }
.marginbottom { margin-bottom:30px; }
.boxpad { padding:20px; }
.site2center { width:960px; margin:0 auto; }
#header { width:100%; display:table; table-layout:fixed; /*This resolves the issue of images or content pushing the [table-cell]'s wider or larger causing the layout to break responsiveness */ }
#csalogo-container { display:table-cell; width:320px; text-align:center; }
#csalogo-container img#csalogo { width:200px; margin:40px 0px; }
#header-right { display:table-cell; vertical-align:top; text-align:right; }
#header-right div.inner { text-align:right; padding-left:40px; }
#langselect_area { width:130px; padding:20px 0px 2px 0px; text-align:right; float:right; display:block; z-index:999; }
#langselect_area a { color:#fff; }
#lang-select label { color:#fff; }
#lang-select label.dd-option-text { color:#004580; }
#lang-select {
    -webkit-border-radius:3px;
    border-radius:3px;
    width:140px;
    font-family:Arial,'PT Sans Narrow';
    font-size:10px;
    font-weight:bold;
}
#topmenuarea { text-align:right; }
#topmenuarea a { text-decoration:none; color:#d52932; font-family:Arial,sans-serif,Verdana; font-size:12px; border-bottom:1px dotted transparent; -webkit-transition: all .5s ease; transition: all .5s ease; }
#topmenuarea a:hover { color:#fa3640; border-bottom:1px dotted #fa3640; }
.menu-separator { display:inline-block; padding:0px 5px; }
#slogen-container { width:100%; display:table; table-layout:fixed; /*border:1px #0f0 solid;*/ }
#slogen-blankleft { display:table-cell; width:360px; }
#slogen-outer { position:relative; }
#slogen { 
    position:absolute;
    display:table;
    table-layout:fixed;
    width:100%;
    top:-42px;
}
.slogen-logo { display:table-cell; width:180px; height:80px; padding-right:20px; vertical-align:middle; text-align:right; }
.slogen-text { display:table-cell; padding-left:20px; vertical-align:middle; text-align:left; line-height:1.2; font-size:20px; color:#004580; font-family:'Open Sans',sans-serif,arial; font-weight:bold; }
#leftside { float:left; width:320px; /*border:1px solid #f00;*/ }
#rightside { overflow:hidden; /* flexible right side beside to the fixed width left column (don't use float) */ /*border:1px solid #0f0;*/ }
#rightside #right-inner { padding:70px 0px 0px 40px; }
#rightcontent { width:100%; }
#fullsize-content { width:100%; padding-top:70px; }
#footer-logo {}
#footer-logo .pad { padding:20px 20px; }
#footer-logo #pglogo { float:left; width:250px; text-align:left; }
#footer-logo #banklogo { float:right; width:330px; text-align:right; padding-top:8px; }
#footer-menu { padding:15px; background-color:#004580; color:#fff; text-align:center; font-size:12px; -webkit-border-radius: 8px 8px 0px 0px; border-radius: 8px 8px 0px 0px; }
#footer a { color:#fff; text-decoration:none; }
.newsimage, .slideshow { width:100%; }
.newsimage img, .slideshow img { width:100%; -webkit-border-radius:8px 8px 8px 8px; border-radius:8px 8px 8px 8px; }
.newslist .newsline { padding-bottom:10px; display:table; }
.newslist .newsline:last-child { padding-bottom:0px; }
.newslist .ndate { display:table-cell; width:80px; font-size:12px; color:#444; font-family:Arial,sans-serif,Verdana; }
.newslist .newstitle { display:table-cell; }
.newslist .newstitle a { color:#004580; }
#bookingbox select { padding:10px; width:100%!important; }
#bookingbox .input-container { padding-bottom:10px; }
.button-container { padding-top:20px; text-align:right; }
#transferlist th { font-size:16px; font-weight:normal; color:#004580; line-height:1.1; padding-bottom:20px; }
#transferlist .productname { color:#3d7eb6; font-weight:bold; font-size:16px; vertical-align:middle; }
.price { color:#3d7eb6; font-weight:bold; font-size:20px; }
.invoice_description { padding-bottom:15px; }
.invoice-price-container { padding-bottom:20px; display:table; }
.invoice-price-container .table-cell { display:table-cell; padding-right:15px; vertical-align:middle; }
.total-price-container { display:table; width:100%; }
.total-price-container .price-info { display:table-cell; vertical-align:middle; text-align:left; }
.total-price-container .btnNext-container { display:table-cell; vertical-align:middle; text-align:right; }
.total-price { color:#3d7eb6; font-weight:bold; font-size:22px; }
.price_type { font-size:12px; font-weight:normal; }
.booking-details-container { display:table; width:100%; }
.booking-details-container .booking-details-row { display:table-row; }
.booking-details-container .fieldname { display:table-cell; width:35%; vertical-align:middle; padding-bottom:5px; }
.booking-details-container .data { display:table-cell; width:63%; text-align:right; vertical-align:middle; padding-bottom:5px; }
.booking-details-container .required { color:#f00; }
.booking-details-container input { width:100%; box-sizing: border-box; }
.booking-details-buttons { display:table; width:100%; }
.booking-details-buttons .l { display:table-cell; text-align:left; }
.booking-details-buttons .r { display:table-cell; text-align:right; }
.servicelist { margin:0px 0px 0px 15px; }
.payscreen { display:table; width:100%; }
.payscreen .l{ display:table-cell; }
.payscreen .r{ display:table-cell; width:300px; }

/* media queries to responsive layout */
@media only screen and (min-width:1px) and (max-width:970px) {
    .site2center { width:100%; }
    .site2center div.sitepadding { padding:0px 10px; }
}
@media only screen and (min-width:1px) and (max-width:750px) {
    #csalogo-container { width:200px; text-align:left; }
    #csalogo-container img#csalogo { width:180px; margin:20px 0px; }
    #header-right { vertical-align:middle; text-align:right; }
    #header-right div.inner { text-align:right; padding-left:0px; }
    #langselect_area { padding-top:8px; }
    #slogen-container { width:100%; display:block; margin-bottom:20px; }
    #slogen-blankleft { display:none; }
    #slogen-outer { position:static !important; }
    #slogen { position:static !important; top:0px; }
    #footer-logo .pad { padding:20px 0px; }
    #footer-logo #pglogo { float:none; width:100%; text-align:center; }
    #footer-logo #banklogo { float:none; width:100%; text-align:center; }
    #footer-logo .pad br{ clear:none; display:none; }
    #rightside #right-inner { padding:0px 0px 0px 25px; }
    #fullsize-content { padding-top:0px; }
}
@media only screen and (min-width:1px) and (max-width:500px) {
    /* slogen from table to block divs*/
    #slogen { position:static !important; display:block; width:100%; top:0px; }
    .slogen-logo { display:block; width:100%; height:auto; padding:0px 0px 15px 0px; text-align:center; }
    .slogen-text { display:block; padding:15px 0px; text-align:center; line-height:1.2; }
}
@media only screen and (min-width:1px) and (max-width:650px) {
    /* content move to below booking box */
    #leftside { float:none; width:100%; }
    #rightside { overflow:visible; }
    #rightside #right-inner { padding:0px 0px 0px 0px; }
    #fullsize-content { padding:0px 0px 0px 0px; }
}
@media only screen and (min-width:1px) and (max-width:400px) {
    #csalogo-container { width:140px; text-align:left; }
    #csalogo-container img#csalogo { width:120px; margin:20px 0px; }
}
@media only screen and (min-width:1px) and (max-width:320px) {
    .site2center { width:320px; }
    .site2center div.sitepadding { padding:0px 10px; }
    h1, h2 { font-size:20px; }
    #csalogo-container { width:120px; text-align:left; }
    #csalogo-container img#csalogo { width:100px; margin:20px 0px; }
}
