@charset "UTF-8";

form#hotelOnlySearchBox div#search_container_col1 div#ratingAndBoard div.propertyDetails,
#byDestDestination, #byDestResort {
    display: none;
}


h1.header {
    width: 100% !important;
}

.mainContainer {
    margin-top: 15px !important;
    padding-top: 0 !important;
}

.breadcrumbs {
    overflow: auto;
    height: auto;
}

.bannerBlock {
    box-sizing: border-box !important;
    margin-bottom: 15px;
    height: auto;
    font-size: 0 !important;
}

#ddMenuIcon {
    box-sizing: border-box;
}

#slideMenuButton {
    overflow: auto;
}

.reviewsContainer #servicereviews .pagination {
    width: 100%;
}

.reviewsContainer .reviewsHeading h2 {
    width: 80%;
}

.offerCallToBook .call {
    width: auto;
}

.sixPack table tbody tr td {
    display: inline;
}

div.sixPack table tbody tr td a span.details {
    padding-top: 0;
}

.image .pinkBox .smallText {
    color: #00427C !important;
}

.bookingJourney .hotelResultBlock .info .starRating {
    margin-bottom: 1em !important;
}

p.justified {
    clear: both;
    /* These are technically the same, but use both */
    overflow-wrap: normal;
    word-wrap: normal;
    -ms-word-break: normal;
    /* This is the dangerous one in WebKit, as it breaks things wherever */
    word-break: break-all;
    /* Instead use this non-standard one: */
    word-break: normal;
    /* Adds a hyphen where the word breaks, if supported (No Blink) */
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
}

.bookingOptions {
    margin-top: 1em !important;
}

.sixPack, .sixPack ul, .sixPack ul li, .sixPack.autoHeights ul, .sixPack.autoHeights ul li {
    box-sizing: border-box !important;
}

.intro-rates #rateBoard {
    margin-bottom: 1.5em !important;
}

.forexPageBranchLocatorBlock {
    margin-top: 1.5em !important;
}

.flightResult .select a {
    line-height: 1;
}

.formback #promocode_code {
    height: auto !important;
}

/*------------------------------------*\
    #search forms section
\*------------------------------------*/


#searchFromTable {
    width: auto !important;
    border-bottom: none !important;
    margin-bottom: 0 !important;
}

#searchForm {
    padding-top: 15px !important;
    border-top: 1px solid white;
}

#searchFromTable th {
    padding: 0 1em;
    width: auto;
    white-space: nowrap !important;
}

#searchFromTable th:nth-child(4) {
    display: none;
}

#searchFromTable th:nth-child(3) {
    padding-right: 0;
}

#searchFromTable th:nth-child(1) {
    padding-left: 0;
}

#searchFromTable .searchHeading {
    margin-left: 0 !important;
    font-weight: normal;
    text-align: center !important;
    color: #fff;
}

a#searchFromTable th:nth-child(1) span {
    color: #fde40d;
}

#searchBar {
  overflow: hidden;
  padding-left: 15px; 
  padding-right: 15px;
}

#searchBar #searchForm {
    padding-top: 1em;
    width: 100%;
    box-sizing: border-box;
}

#searchForm label {
    color: #fff;
}

#blendedSearchBox {
    color: #fff;
}

#room2select, #room3select {
    display: none;
}

#formContainer {
    padding-top: 0 !important;
}

#blendedSearchBox label, #blendedSearchBox span {
    padding: 0.5em 0;
}

#flightOnlySearchBox {
    margin-bottom: 1em;
    overflow: auto;
    box-sizing: border-box;
}

#flightOnlySearchBox tr:nth-child(3) {
    display: none;
}

#flightOnlySearchBox label, #hotelOnlySearchBox label {
    display: block;
    line-height: 1.6 !important;
    padding-bottom: 0.3em;
    font-weight: normal !important;
}

#flightOnlySearchBox .directFlights span {
    font-weight: normal !important;
}

#flightOnlySearchBox td, #hotelOnlySearchBox td {
    height: auto;
    line-height: 0;
    padding-bottom: 1em;
    width: 30%;
    vertical-align: top;
    min-height: 50px;
}

#hotelOnlySearchBox td {
    width: 50%;
}

#flightOnlySearchBox td select, #hotelOnlySearchBox td select {
    width: 90%;
    padding: 0.5em 0 !important;
    font-weight: normal !important;
}

#flightOnlySearchBox td .date, #hotelOnlySearchBox td .date {
    top: auto;
}

#flightOnlySearchBox #retDatePicker, #depDatePicker {
    font-size: 12px;
    font-family: Arial,Helvetica,sans-serif;
    font-weight: normal !important;
    right: auto !important;
    width: auto !important;
    max-width: 90%;
}

#flightOnlySearchBox input.ylw-btn, #hotelOnlySearchBox input.ylw-btn {
    width: auto;
    height: auto;
    padding: 0.7em 3em !important;
    float: right;
    font-size: 16px !important;
    font-weight: bold !important;
}

#flightOnlySearchBox #receptional_childages {
    margin-top: 0 !important;
    line-height: 1.6;
}

#flightOnlySearchBox .receptional_childages, #hotelOnlySearchBox .receptional_childages {
    top: auto;
}

#flightOnlySearchBox #receptional_childages div {
    margin-left: 0 !important;
}

#flightOnlySearchBox #childline {
    width: 100% !important;
}

#flightOnlySearchBox #receptional_childages .title {
    color: #fff;
    font-size: 16px;
    padding-bottom: 0.8em;
    font-weight: normal !important;
}

#flightOnlySearchBox .childText, #flightOnlySearchBox .flightClass label {
    text-align: left;
    font-weight: normal !important;
    color: #fff;
}

#flightOnlySearchBox #submitFlightForm {
    float: left;
    margin-top: 1em;
}

#flightOnlySearchBox .childDrop {
    max-width: 10em;
}

#flightOnlySearchBox select {
    font-size: 12px !important;
}

#flightOnlySearchBox #depair, #flightOnlySearchBox #destair, #flightOnlySearchBox #country {
    font-weight: normal !important;
}

#flightOnlySearchBox input[type="date"]::-webkit-input-placeholder {
    visibility: hidden !important;
}

#flightOnlySearchBox #departDate, #flightOnlySearchBox #departDate label, #flightOnlySearchBox #returnDate label, #flightOnlySearchBox #returnDate input, #flightOnlySearchBox #departDate input, #flightOnlySearchBox #returnDate, #search_container_col2 div {
    float: left;
    min-width: 5em;
    box-sizing: border-box;
    clear: both;
}

#flightOnlySearchBox #returnDate, #flightOnlySearchBox .adults, #flightOnlySearchBox .children {
    clear: none;
}

#flightOnlySearchBox #returnDate, #flightOnlySearchBox #departDate {
    padding-right: 0;
}

#flightOnlySearchBox .adults {
    padding-right: 1.5em;
}

div#receptional_childages div div select, div#receptional_childages div div span select {
    width: 100% !important;
}

#flightOnlySearchBox #search_container_col2 div.childText, #flightOnlySearchBox div.childText {
    padding: 0;
}

#flightOnlySearchBox #search_container_col2 .adults, #flightOnlySearchBox #search_container_col2 .children {
    width: 12em !important;
    padding: 0 !important;
}

#flightOnlySearchBox #search_container_col2 .adults select {
    width: 90% !important;
}

#hotelOnlySearchBox .hotelThird {
    margin-bottom: 1em;
}

#bydest a, #bytext a {
    display: block;
    clear: both;
    height: auto;
    overflow: auto;
    line-height: 1.6;
}

#bydest {
    display: table;
    table-layout: fixed;
    width:100%;
    box-sizing: border-box;
}

.hotelQuerter {
    display: table-cell;
}

#hotelOnlySearchBox .room select {
    margin-bottom: 1em;
}

#hotelOnlySearchBox .room span {
  clear: both;
  display: block;
  font-weight: normal;
  height: 2px;
  text-align: left;
}

#hotelOnlySearchBox td .rooms {
    left: auto;
}
#flightOnlySearchBox div#search_container_col1 div.date input#datePicker{
    width: auto !important;
    margin-top: 0;
    border: none;
    max-width: 10em;
}

#datePicker {
    right: auto !important;
    box-sizing: border-box;
}

div.col2_row1 div.date_label_dec label, .search_container_col2 label, .search_container_col3 span, .search_container_col3 label, div.col2_row1 div.date_label_dec label, div.col2_row1 div.date_container_dec, .search_container_col2 {
    top: auto !important;
    left: auto !important;
}

.col2_row1 {
    padding-right: 15px;
}

div.nights select#nights {
    left: auto;
}



.roomLabel {
    width: auto;
}

#hotelOnlySearchBox .childDrop {
    width: 100% !important;
    float: none;
}

#hotelOnlySearchBox #receptional_childages {
    margin-top: 0 !important;
}



#hotelOnlySearchBox .roomLabel, #hotelOnlySearchBox .childText {
    font-weight: normal !important;
}


#hotelOnlySearchBox .smallText {
    line-height: 1.6;
}

#hotelOnlySearchBox .smallText a {
    color: #fde40d;
}

#hotelOnlySearchBox #wantedname {
    display: block !important;
    margin-left: 0 !important;
}

#hotelOnlySearchBox label {
    line-height: 1.6;
    color: #fff;
}

#closeForm {
    top: auto !important;
    width: auto !important;
    height: auto !important;
    box-sizing: border-box !important;
    margin-bottom: 1em !important;
}

#closeForm p {
    margin: 0 !important;
    padding: 0 !important;
}

#closeForm #sfClose {
    padding: 0 !important;
    aoverflow: auto !important;
}

#closeForm #sfClose i {
    padding: 0 !important;
    margin: 0 !important;
    top: auto !important;
}

#flightOnlySearchBox .childText, #flightOnlySearchBox .flightClass label, #flightOnlySearchBox label, #flightOnlySearchBox .directFlights span {
    font-size: 12px !important;
}

.bannerBlock {
    width: 100%;
}

#search_container_col1, #search_container_col2 {
    margin-bottom: 1em;
    clear: both;
    width: 100%;
}

#search_container_col2 { 
    margin-bottom: 0
}

#flightOnlySearchBox #search_container_col3 {
    margin-top: 0.5em;
}

#flightOnlySearchBox .flightClass {
    float: left;
}

.directFlights {
    margin-top: 1em;
}

.directFlights label {
    float: left;
    margin-right: 0.5em;
}
#directonly {
    background: #fff;
    float: left;
    color: #000;
}

#flightOnlySearchBox .flightClass select {
    width: 100%;
}

#search_container_col3 .smallText {
    clear: both;
    width: 100%;
    text-align: center;
    display: block;
    padding-top: 0.5em;
}

#search_container_col3 .submitForm {
    margin-top: 0.6em;
}


div.date input#datePicker {
    width: 100%;
}


 #flightOnlySearchBox input, #flightOnlySearchBox select {
    font-size: 12px !important;
  -webkit-border-radius: 0px;
  padding: 5px !important;
  border: none;
  font-weight: normal !important;
}


.qtrLast {
    width: auto !important;
    clear: both;
    
}

#hotelOnlySearchBox div#search_container_col2 #roomSelection {
    width: auto;
}
 form#flightOnlySearchBox div#search_container_col1 div#roomSelection div#room1select.room {
    float: left;
    width: auto;
    clear: none;
    padding-right: 1.5em;
    box-sizing: border-box;
}

#room1select, #room2select, #room3select {
    margin-top: 0 !important;
}

#roomSelection select {
    width: auto !important;
        min-width: 4em;
}

#hotelOnlySearchBox div#search_container_col2 div#child_ages_row_dec {
    width: auto;
    clear: none;
    float: left;
}

.childLine {
    width: auto !important;
}

#childdrop-1-1, #childdrop-1-2, #childdrop-1-3, #childdrop-1-4, #childdrop-1-5, #childdrop-2-1, #childdrop-2-2, #childdrop-2-3, #childdrop-2-4, #childdrop-2-5 {
    display: none !important;
}

div#receptional_childages.receptional_childages .childLine .childText span.childDrop select {
    width: auto !important;
    min-width: 4em;
}

.rooms {
    left: auto;
}

.date {
    top: auto;
}

/*------------------------------------*\
    #footer section
\*------------------------------------*/
.siteFooter .confidenceRow {
    padding: 0 1.5em;
    box-sizing: border-box;
}

.siteFooter .confidenceRow .abtaAtol {
    margin-left: 0;
}

.siteFooter .wrapper .footerContentRow, .siteFooter .wrapper .footerContentRow .linkColumn {
    height: auto;
    overflow: auto;
    box-sizing: border-box;
    min-height: 30em;
}

body > div.siteFooter > div.wrapper > div.footerContentRow {
    box-sizing: border-box;
    padding: 0 15px;
    margin: 0 auto !important;
    overflow: hidden;
    display: inline-block;
    width: auto;
    overflow: hidden;
}

.footerContentRow #last {
    padding-right: 0;
}

.siteFooter .wrapper .footerContentRow .linkColumn {
    padding-bottom: 1.5em;
    margin-bottom: 1.5em;
    padding-right: 2em;
    width: auto !important;
    display: inline-block;
    float: left;
    text-align: left;
    border-right: 1px solid #ccc;
    border-left: none;
    min-width: 190px;
}

.companyColumn {
    display: inline-block;
    border-right: 1px solid #ccc;
    min-height: 30em;
    margin-top: 20px;
    text-align: left;
    width: auto;
    padding-right: 1.5em;
    max-width: 190px;
    box-sizing: border-box;
}

.siteFooter .wrapper .footerContentRow .companyColumn .heading {
    margin-top: 0;
}

.siteFooter .copyrightRow {
    clear: both;
    margin: 0 auto;
    width: 80%;
    box-sizing: border-box;
    height: auto !important;
    padding: 0;
    overflow: auto;
    padding: 1em 1.5em;
    border-top: none;
}

.siteFooter .wrapper {
    text-align: center;
    overflow: auto;
    border-bottom: 1px solid #bcbec0;
}

#copyright-text {
    float: left;
    margin-left: 0 !important;
}

#copyright-text p {
    margin: 0;
}

.siteMapAndCopywriter {
    float: right;
    top: auto !important;
    margin-right: 0;
}

.branchLocatorBannerAd {
    height: auto !important;
    overflow: auto;
    width: 100%;
    box-sizing: border-box !important;
    padding: 1em;
}

.branchLocatorBannerAd span {
    position: relative !important;
    left: auto !important;
}

.branchLocatorBannerAd .bottomLine {
    clear: both;
    float: right;
    padding-top: 1em;
    top: auto;
}

.branchLocator_results .branchResult .info .left {
    width: 75%;
    /* rc edit 28_01_2016 */
}

.branchLocator_controls .enterPostcode input[type="text"] {
    width: 230px;
}

.navBar .wrapper .branchAndRegion {
    width: auto;
    float: right;
    text-align: right;
    left: auto;
    right: auto;
    top: auto;
    margin-right: 0;
}

#deskMenu .nav, div#mainMenu.navBar div#deskMenu.wrapper {
    margin-left: 0;
}

div#mainMenu.navBar div#deskMenu.wrapper {
    box-sizing: border-box;
    margin: 0 auto;
    text-align: center;
    width: 80% !important;
    max-width: 1280px;
    float: none;
}

#headerContent {
    height: auto;
    overflow: auto;
}

#topBar {
    overflow: auto;
    height: auto;
}

#tlineQues {
    margin-bottom: 0;
}

#header {
    margin-top: 2em !important;
    margin-bottom: 1em !important;
}

#mainMenu.navBar {
    overflow: auto;
    height: 50px !important;
    padding: 1.4em 0 !important;
    box-sizing: border-box;
}

#topBar .wrapper, #headerContent, #searchBar, #headerContent, #header {
    width: 80% !important;
    max-width: 1280px;
    box-sizing: border-box;
    vertical-align: middle;
    clear: both;
    margin: 0 auto;
}

#headerContent {
    width: 100% !important;
}

#centerHeadCol {
    display: block !important;
    left: auto;
    right: auto;
    width: 40%;
    text-align: center;
    float: left;
    top: auto;
    padding-top: .5em;
    text-transform: uppercase;
}

#centerHeadCol .headerMessageAndPhone, #rightHeadCol .headerMessageAndPhone, .haysLogo {
    margin-top: 0;
}

#centerHeadCol .message p {
    position: relative;
    top: auto;
    bottom: auto;
    left: auto;
    right: auto;
    width: auto;
    padding: 0;
    margin: 0;
    font-size: 15px;
}


.headerMessageAndPhone .phone .mainNumber {
    font-size: 23px !important;
    top: auto !important;
}

#leftHeadCol {
    clear: both;
    float: left;
    overflow: auto;
}

#deskMenu .nav {
    width: auto !important;
}

.searchDesk, #searchBar {
    width: 100%;
}

#ddmenu div {
    left: auto;
}

#ddmenu div.menu-icon i {
    top: auto;
}

.navBar #ddmenu {
    box-sizing: border-box;
}

#slideDDlist {
    width: 100%;
    box-sizing: border-box;
}

ul.ddList {
    box-sizing: border-box;
    width: 100% !important;
}

.btn-ylw {
    width: auto !important;
}

.search_button_dec .btn-ylw {
    width: 100% !important;
}

.wrapper .siteTab a.myBooking {
    padding: .7em 1.5em;
    margin-right: 1.5em;
}

.contactForm iframe {
    margin: 0 auto;
    text-align: center;
    position: relative;
    display: block;
    height: 430px !important;
}

.whiteBlock.community .content {
    width: 100% !important;
}

.whiteBlock.community .image {
    width: 100% !important;
    height: auto;
}

.whiteBlock.community .image img {
    max-width: 100% !important;
    max-height: 300px !important;
    width: auto !important;
    height: auto !important;
    display: block;
    margin: 0 auto;
    text-align: center;
}

.imageDealBlocks ul li a span.price span {
    font-size: 28px;
}

.destinationMapCanvas, #branchGoogleMap {
    width: 100%;
}

.summary table tr td {
    color: #797979 !important;
    border: none !important;
}

#openForm {
    top: auto;
}

#openForm p {
    display: block;
    max-width: 965px;
    overflow: hidden;
    text-align: right;
    height: auto;
    margin: 0 auto;
}

#openForm p a {
    float: right;
    right: auto;
    left: auto;
    margin: 0 !important;
    position: relative !important;
    text-align: right;
    padding-right: 0 !important;
}

.hotelDisclaimerMessage {
    padding-bottom: 1em;
}

.destinationTopHotelIntro .title {
    width: auto;
}

#hotelMapCanvas {
    width: 100% !important;
    margin-top: 1em;
}

.messageToSearch {
    width: auto;
    height: auto;
    min-height: 40px;
    padding: 1em;
    box-sizing: border-box;
}

.messageToSearch h2 {
    padding: 0;
    margin: 0;
}

.offers .date {
    top: auto;
}

.offers li div.price {
    top: auto;
    right: auto;
    float: right;
    display: block;
    position: relative;
    width: 45%;
    box-sizing: border-box;
}

.offers .price span {
    width: 100% !important;
}

.offers ul {
    overflow: auto;
}

.offers .price span p {
    top: auto !important;
    padding-top: .8em;
    margin-top: 0 !important;
    position: relative !important;
}

#one, #two, #three, #four, #five, #six, #seven, #eight, #nine {
    float: left;
    height: 140px !important;
    top: auto;
    bottom: auto;
    left: auto;
    right: auto;
    padding: 10px;
    width: calc(33.33333% - 6px) !important;
    box-sizing: border-box !important;
}

.imageDealBlocks ul, .offers ul {
    overflow: auto;
}

.imageDealBlocks ul li {
    padding: 1em;
    height: auto !important;
    box-sizing: border-box !important;
}

.imageDealBlocks ul li span {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    clear: both;
    width: 100% !important;
}

.imageDealBlocks ul li a span.star {
    padding: 1em 0;
    height: 45px;
    width: 45% !important;
    float: left;
    clear: none;
    border: none;
    text-align: left;
}

.imageDealBlocks ul li a span.image img {
    width: 100%;
}

.imageDealBlocks ul li span.details {
    float: left;
    height: auto !important;
    width: auto !important;
}

.imageDealBlocks ul li span.title {
    padding-top: .5em;
    border-top: 1px solid #bcbec0;
}

.imageDealBlocks ul li span.price {
    float: right;
    clear: none;
    height: auto !important;
    width: auto !important;
    margin-top: .5em;
}

.destinationGuideBlocks *, .imageDealBlocks *, .offers {
    box-sizing: border-box !important;
}

.destinationTryAd, .lpStaffBlock {
    width: 80%;
    margin: 1em auto;
    box-sizing: border-box !important;
}

.destinationGuideBlocks .destinationGuideBlock, .imageDealBlocks ul li, .offers ul li {
    width: 32% !important;
    width: calc(33.333% - 6px) !important;
    display: inline-block;
    box-sizing: border-box !important;
    margin: 3px !important;
}

.imageDealBlocks ul, .offers ul {
    overflow: auto;
}

.imageDealBlocks ul li {
    padding: 1em;
    height: auto !important;
    box-sizing: border-box !important;
}

.imageDealBlocks ul li span {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    clear: both;
    width: 100% !important;
}

.imageDealBlocks ul li a span.star {
    padding: 1em 0;
    height: 45px;
    width: 50% !important;
    float: left;
    clear: none;
    border: none;
    text-align: left;
    box-sizing: border-box;
}

.imageDealBlocks ul li a span.star:nth-child(3) {
    float: right;
    text-align: right;
}

.imageDealBlocks ul li a span.image img {
    width: 100%;
}

.imageDealBlocks ul li span.details {
    float: left;
    height: auto !important;
    width: auto !important;
}

.imageDealBlocks ul li span.title {
    padding-top: .5em;
    border-top: 1px solid #bcbec0;
}

.imageDealBlocks ul li span.price {
    float: right;
    clear: none;
    height: auto !important;
    width: auto !important;
    margin-top: .5em;
}

.destinationGuideBlocks .destinationGuideBlock {
    padding: 1em !important;
    height: auto !important;
    overflow: hidden;
}

.destinationGuideBlock a.title, .destinationGuideBlock span.details {
    width: 100% !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    position: relative !important;
    padding-top: 0.5em !important;
    height: auto !important;
    display: block !important;
    padding-bottom: .5em;
}

.destinationGuideBlock span.details {
    min-height: 6em !important;
}

.destinationGuideBlocks .noBlock {
    padding: 1em 0 !important;
    clear: both !important;
}

a.destinationGuideBlocks .destinationGuideBlock:before {
    content: "";
    display: block;
    padding-top: 100%;
    /* initial ratio of 1:1*/
}

.destinationGuideBlocks .destinationGuideBlock img.image {
    width: 100% !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    position: relative !important;
    margin: 0 !important;
    aheight: auto !important;
}

/* Payment details */
.sideItinerary {
    width: 40%;
    float: right;
    margin-bottom: 1em;
}

.paymentDetails {
    overflow: auto;
    text-align: left;
    font-size: 18px !important;
}

.paymentDetailsForm {
    width: 50%;
    float: left;
}

.paymentDetailsForm input, .paymentDetailsForm select {
    font-size: 1em;
    border-radius: 0 !important;
}

.paymentDetails input, .paymentDetails select {
    font-size: 18px !important;
}

.paymentDetails .paymentDetailsBreadcrumbs {
    color: #797979;
    padding: 1em;
}

.paymentDetails .paymentDetailsBreadcrumbs span {
    color: #00427C;
}

.paymentDetails .paymentDetailsBlock {
    background-color: #fff;
    border: 1px solid #bcbec0;
    padding: 1em;
    margin: 0 0 2em;
    clear: both;
    overflow: auto;
    box-sizing: border-box !important;
}

.paymentDetails .paymentDetailsBlock .paymentDetailsForm {
    float: left;
}

.paymentDetails .paymentDetailsBlock .paymentDetailsForm .introText {
    color: #797979;
    margin: .5em 0;
    clear: both;
}

.paymentDetails .paymentDetailsBlock .paymentDetailsForm .formLabel {
    clear: left;
    display: block;
    float: left;
    margin: .25em 0;
    font-size: 16px;
    width: auto;
}

.paymentDetails .paymentDetailsBlock .paymentDetailsForm .formField {
    clear: right;
    display: block;
    float: left;
    margin: .25em 0;
    width: 100%;
}

.paymentDetails .paymentDetailsBlock .paymentDetailsForm .formField select {
    background-color: #FFF;
    border: 1px solid #BCBEC0;
    color: #58595B;
    margin: 0;
    width: 100%;
}

.paymentDetails .paymentDetailsBlock .paymentDetailsForm .formField.autosize select {
    width: auto;
}

.paymentDetails .paymentDetailsBlock .paymentDetailsForm .formField input[type="text"] {
    background-color: #FFF;
    border: 1px solid #BCBEC0;
    color: #58595B;
    margin: 0;
    padding: 2px 1px;
    width: 100%;
}

.paymentDetails .paymentDetailsBlock .sideItinerary {
    float: right;
    border: 1px solid #bcbec0;
    padding: 1em;
    overflow: auto;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .itineraryItem {
    border-bottom: 1px solid #bcbec0;
    margin: 0 0 .6em;
    padding: 0 0 .6em;
    overflow: auto;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .itineraryItem .heading {
    background-color: #797979;
    color: #FFF;
    margin-bottom: 1em;
    padding: .5em .7em;
    width: auto;
    max-width: 10em;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .itineraryItem .detail {
    float: left;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .itineraryItem .detail .title {
    color: #00427C;
    margin: 0 0 .3em;
    clear: both;
    overflow: auto;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .itineraryItem .detail .details {
    color: #797979;
    margin-bottom: .5em;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .itineraryItem .detail .details span {
    color: #00427C;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .itineraryItem .detail .smalltext {
    color: #797979;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .itineraryItem .price {
    color: #00427C;
    float: right;
    text-align: right;
    clear: both;
    font-weight: 600;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .itineraryItem .price a {
    color: #797979;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .itineraryExtra {
    border-bottom: 1px solid #BCBEC0;
    margin-bottom: .5em;
    padding-bottom: .5em;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .itineraryPriceModifier {
    color: #00427C;
    clear: both;
    overflow: auto;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .itineraryPriceModifier .label {
    float: left;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .itineraryPriceModifier .price {
    float: right;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .totalPricing {
    color: #00427C !important;
    padding: 1em 0;
    clear: both;
    background: #fde40d;
    overflow: auto;
    padding: 1em;
    margin-top: 1em;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .totalPricing .label {
    color: #00427C !important;
    float: left;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: .5em;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .totalPricing .price {
    color: #00427C !important;
    float: right;
    text-align: right;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .totalPricing .price span {
    color: #00427C !important;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .depositPricing {
    color: #797979;
    margin-top: 1em;
    padding: 1em;
    border: 1px solid #bcbec0;
    color: #00427C;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .depositPricing .label {
    float: left;
    text-transform: uppercase;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .depositPricing .price {
    float: right;
    text-align: right;
}

.paymentDetails .paymentDetailsBlock .sideItinerary .depositPricing .dueDate {
    text-align: right;
}

.paymentDetails .paymentDetailsBlock .paymentDetailsForm .bookButton {
    text-align: right;
    margin: 1em 0 2em;
    display: block;
    overflow: auto;
}

.paymentDetails .paymentDetailsBlock .paymentDetailsForm .bookButton input[type="submit"] {
    padding: .5em 1em;
    color: #fff;
    background-color: #00427C;
    text-transform: uppercase;
    border: 0;
    border-radius: 0;
}

.summary .detail {
    overflow: auto !important;
}

.summary .breakdown {
    clear: both !important;
    position: relative !important;
    clear: both !important;
}

.featherlight-inner html {
    background-color: #FFF !important;
}

#surround *, #surround input, #surround select {
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    font-size: 16px !important;
    border-radius: 0 !important;
    line-height: 1.6 !important;
    vertical-align: middle !important;
    color: #000 !important;
}

#surround {
    width: auto !important;
    position: relative;
    max-width: 900px;
    height: auto !important;
    min-height: 50% !important;
    -webkit-overflow-scrolling: touch !important;
}

#surround #content {
    padding: 2em !important;
    width: 100%;
    background: #FFF !important;
    z-index: 25;
    -webkit-overflow-scrolling: touch !important;
    top: 0;
    bottom: 0;
    /* Decrease this value for cross-browser compatibility */
}

#surround h2 {
    font-size: 1.5em !important;
    color: #00427C !important;
    margin-bottom: 0.5em !important;
    margin-top: 1em !important;
}

#surround div {
    display: block !important;
    float: left !important;
    clear: none;
    z-index: 5;
}

#surround table {
    width: 100% !important;
}

#surround input, #surround select {
    padding: 0.5em !important;
    width: auto !important;
    max-width: auto;
    margin-bottom: 0.5em !important;
}

form[name=fusionextras] {
    overflow: auto;
}

#surround div.formback {
    background: #FFF !important;
    padding: 1em !important;
    border: none;
    width: 95%;
}

#surround td {
    font-weight: 400 !important;
    width: auto !important;
}

#content > form > span.submit {
    display: block;
    clear: both;
    width: 200px;
    margin: 1em auto !important;
    text-align: center;
    float: none !important;
    position: relative;
}

#surround input[type="submit"] {
    background: #FDE40D;
    width: 200px;
    color: #00427C !important;
    text-transform: uppercase;
    border: none;
    padding: 0.5em 1em !important;
}

#surround div.fusionextras_passenger > div {
    margin-bottom: 1em !important;
}

div.fusionextras_passenger {
    clear: both;
    width: 100% !important;
    float: left;
    text-align: left !important;
    padding: 1em !important;
}

table.fusionextras_head {
    width: 100%;
}

#surround table.fusionextras_head td input {
    padding: 0 0.5em !important;
    margin: 0.5em !important;
}

#surround table.fusionextras_head td {
    border-bottom: 1px solid #ddd;
}

.listheader .price, .listheader .name {
    text-align: left;
}

#surround div.baggageinfo {
    padding: 0 0.5em !important;
}

#surround .baggageinfo a.infolink span {
    display: none;
    clear: both;
    text-align: left !important;
    float: left !important;
    line-height: auto;
    padding: 0.5em 0 !important;
    font-size: 60%;
    awidth: 80% !important;
}

#surround .baggageinfo {
    float: left !important;
    text-align: center;
    padding: 2px;
    clear: none !important;
}

#surround .infolink {
    z-index: 1;
}

#surround .fusionextras_passengers div {
    padding-right: 1em !important;
}

#surround [id^='baggagequantitytitle'] {
    clear: both !important;
    padding: 0.5em 0 !important;
}

#surround [id^='baggagequantitytitle'] div {
    padding-right: 0.5em !important;
}

#surround div.fusionextras_passenger > div:last-child > div:last-child {
    clear: both;
    float: left !important;
    text-align: left;
}

#surround div.fusionextras_passenger > div:last-child > div:last-child div, #surround div.fusionextras_passenger > div:last-child > div:last-child input {
    display: block !important;
    float: left !important;
    text-align: left !important;
    vertical-align: middle !important;
    padding-right: 0.5em !important;
}

#surround div.fusionextras_passenger > div:last-child > div:last-child input {
    margin-right: 0.5em !important;
    margin-top: 0.3em !important;
}

div.featherlight-content {
    width: 90%;
    max-width: 900px;
    min-height: 50% !important;
    height: auto !important;
    box-sizing: border-box !important;
    -webkit-overflow-scrolling: touch !important;
}

#surround .listheader th {
    padding: 0.5em 0 !important;
    background: #FFF !important;
    color: #00427C !important;
}

.featherlight .featherlight-content .featherlight-inner {
    width: 100%;
    height: 100% !important;
    box-sizing: border-box !important;
    position: absolute !important;
    margin-left: -10px !important;
}

#pageContent {
    padding-bottom: 1em;
}

.offers h3 {
    display: block;
    height: 3em;
    margin: .5em 0;
    padding: .5em 0;
    overflow: hidden;
    text-align: left;
}

.offers ul li {
    height: auto !important;
}

.rightColumn .noBlock.ad, .rightColumn .noBlock.ad a, div.rightColumn > div.noBlock.ad > a {
    margin: 0 auto !important;
    text-align: center !important;
    display: block !important;
}

#carparkingDetails {
    clear: both;
    overflow: auto;
}

.basket .itineraryItem a.addOptionalExtras {
    background-color: #fde40d;
    color: #00427C;
    box-sizing: border-box !important;
    width: auto !important;
    text-align: center;
    padding: 10px !important;
    left: auto !important;
    right: 10px !important;
    top: 10px !important;
    overflow: auto !important;
    position: absolute !important;
}

.passno {
    display: block;
    float: left;
    clear: both;
    width: 100%;
}

.featherlight-content, #surround, .featherlight-inner iframe body {
    background: #FFF !important;
}

.destinationPageHeader .comboNavigation {
    width: auto !important;
    font-size: 16px !important;
    float: right;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    margin: .5em 0;
    position: relative;
}

.destinationFastFacts {
    padding: 1em;
    height: auto !important;
    box-sizing: border-box !important;
    overflow: auto !important;
}

.destinationFastFacts div, .destinationFastFacts .introText, .destinationFastFacts span {
    display: block;
    padding: 0;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    float: left;
    height: auto !important;
    position: relative !important;
    box-sizing: border-box !important;
    overflow: auto;
}

.destinationFastFacts .introText {
    padding-bottom: 1em;
    width: 100%;
}

.destinationFastFacts span.flightTime, .destinationFastFacts span.timeDifference, .destinationFastFacts span.temperature, .destinationFastFacts span.currency {
    display: inline-block !important;
    float: left;
    top: auto !important;
    left: auto !important;
    width: 25% !important;
    padding-left: 50px;
    min-height: 45px;
}

.destinationFastFacts span span {
    width: 100% !important;
}

.destinationWeather {
    box-sizing: border-box !important;
}

.destinationTopHotel {
    height: 130px;
}

.destinationTopHotel .hotelLink {
    top: auto;
    bottom: 1em;
}

.destinationTopHotel .hotelDescription {
    width: auto;
    height: auto;
}

.sixPack ul {
    margin-left: 0 !important;
}

.sixPack ul li {
    width: 32% !important;
    margin: 2px !important;
}

/* holiday specials */
.holidayspecials .offers li img {
    width: 100%;
}

.holidayspecials .offers li img.exclusive {
    width: auto;
}

/* branch profile */
.branchBannerBlock {
    box-sizing: border-box;
    padding: 1em;
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center top;
    padding-top: 240px;
}

.branchBannerBlock .jumpMenu {
    width: auto;
}

.branchOpeningHours {
    width: 50%;
    min-width: 200px;
    box-sizing: border-box;
    margin-bottom: 1em;
    font-size: 12px;
}

.branchOpeningHours div {
    width: 100%;
    box-sizing: border-box;
}

.branchOpeningHours span {
    float: right;
    text-align: right;
}

.branchOpeningHours .heading16 {
    float: none;
    text-align: left;
}

.branchFacebookLink {
    display: block;
    height: auto !important;
    margin-bottom: 1em;
}

.branchContactDetails {
    clear: both;
}

.branchBannerBlock .jumpMenu {
    text-align: left;
    font-size: 14px;
}

.branchBannerBlock .jumpMenu, .branchBannerBlock .title, .branchBannerBlock .info, .branchBannerBlock img {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    float: left !important;
    clear: both !important;
    width: 100%;
    display: block !important;
    box-sizing: border-box !important;
}

.branchBannerBlock img {
    width: 110px;
    height: 130px;
    margin-top: 110px;
}

.branchBannerBlock .jumpMenu, .branchBannerBlock .title {
    left: 120px !important;
    width: auto !important;
    top: -130px !important;
    box-sizing: border-box;
}

.branchBannerBlock .info {
    top: -45px !important;
}

#overviewTab_content .heading {
    font-weight: 700;
    padding: 1em 0 .5em;
}

/* hotel search results */
.bookingJourney .hotelResultBlock .info {
    width: 65%;
    box-sizing: border-box;
}

.bookingJourney .hotelResultBlock .info .description {
    width: 100%;
    box-sizing: border-box;
}

.packageResults .hotelResultFilter {
    height: auto !important;
    margin-bottom: 0;
    padding: 0.5em !important;
    box-sizing: border-box;
    top: auto;
    left: auto;
}

.packageResults .hotelResultFilter .starRatingFilter {
    width: calc(16.666% - 4px) !important;
    margin: 2px;
    box-sizing: border-box;
}

.packageResults .hotelResultFilter .starRatingFilter.first {
    margin: 2px !important;
}

.packageResults div.hotelResultFilter form#filterForm {
    left: auto;
    top: auto;
    box-sizing: border-box;
}

#filterForm input, #filterForm select, #filterForm select.filterControl, form#filterForm select.filterControl, form#filterForm input#filterwantedname.filterControl, form#filterForm select.filterControl {
    width: calc(20% - 4px) !important;
    margin: 2px !important;
    box-sizing: border-box;
}

select.filterControl, #filterwantedname, .bookingJourney .hotelResultFilter .filterButton {
    font-size: 13px !important;
    border-radius: 0 !important;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    padding: 7px !important;
    margin: 0.5em !important;
    margin-bottom: 0 !important;
}

form#filterForm select.filterControl {
    margin-left: 2px !important;
}

select.filterControl.first {
    margin-left: 2px !important;
}

div.hotelResultFilter form#filterForm {
    margin-left: 0 !important;
    width: 100% !important;
}

div.sort select#changeHotelSort.filterControl {
    width: auto !important;
    margin-left: 0 !important;
    margin-top: 0 !important;
    padding: 0.5em 1em !important;
    max-width: none !important;
}

.hotelResultFilter .filterButton {
    border: 1px solid #00427C !important;
}

.bookingJourney .hotelResultFilter .starRatingFilter {
    margin-bottom: 0.5em !important;
    margin-left: 0 !important;
    margin-right: 0.5em !important;
    font-size: 13px !important;
}

.packageResults .hotelResultFilter .filterButton {
    font-size: 14px;
    padding: 0.5em 1em !important;
}

.packageResults .hotelResultPageNumbers .sort {
    top: auto;
    left: auto;
    width: auto;
}

.packageResults .hotelResultPageNumbers {
    padding: 0 !important;
}

.bookingJourney .hotelResultPageNumbers {
    margin-bottom: 1.5em;
}

.packageResults .hotelResultPageNumbers .pages {
    left: auto;
    top: auto;
    font-size: 14px;
}

.hotelResultClose, .hotelResultRefine {
    padding: 1em 0;
}

.packageResults .hotelResultPageNumbers {
    top: auto;
}

#filterwantedname {
    margin-left: 0 !important;
}

#formContainer {
    height: auto;
}

.noBlock .heading20 {
    text-align: center;
    padding: 1em 0;
}

.creditCards {
    margin-right: 0;
}

.moreFlightInfo .flightDirection .flightDetails {
    line-height: 1.6;
}

.moreFlightInfo .totalPricing {
    border-bottom: none !important;
    padding: 1em !important;
}

#surround .passenger_head {
    clear: both !important;
    float: left !important;
    margin-right: 1em !important;
}

.hotelMoreInfo .hotelRooms .hotelRoomLine {
    height: auto;
}

.hotelMoreInfo .hotelRooms .hotelRoomLine .description {
    padding-bottom: 1em;
}

.packageResults .hotelResultPageNumbers .sort select {
    left: auto;
}

div.sort select#changeHotelSort.filterControl {
    top: auto;
}

.packageResults .hotelResultFilter .starRatingFilter .title {
    color: #fff;
}

.packageResults .packageResultBlock .selectedFlight .selectedFlightInfo {
    display: block;
    overflow: auto;
    height: auto;
    padding-left: 40px;
    top: auto;
    position: relative;
    left: auto;
    padding-top: 1em;
}

.flightChangeLink {
    clear: both;
    float: right;
    width: 100%;
    top: auto !important;
    position: relative !important;
    left: auto !important;
    text-align: right;
    padding: 0.5em 0 !important;
}

.arrowToSeach, .messageToSearch {
    display: none;
}

#preferredContactDay, #preferredContactTime, #preferredContactMethod, #field_title, #field_title #title {
    width: auto;
}

#branchLocator_branchesCombo {
    margin-left: 0;
    font-size: 14px !important;
}

#branchLocator_txtPostcode {
    font-size: 14px !important;
}

.branchLocator_controls .selectBranch {
    width: auto;
    margin-right: 2em;
}

.branchLocator_controls .enterPostcode {
    width: auto;
}

.selectBranch {
    margin-bottom: 1em;
}

input[name="creditcard-amount"] {
    margin-left: 1em;
}

#topHeader > div.mainContainer > div:nth-child(2) > div.rightColumn > div.whiteBlock.noTopMargin.noTopBorder > div.branchOpeningHoursAndFeefo {
    margin-top: -110px !important;
}

.homepageRotator .viewport, .homepageRotator .viewport a, .homepageRotator .viewport img {
    width: 100%;
    height: auto;
}


.formback .formtable:first-child input.formbutton {
    padding: 0.5em 2em !important;
    font-size: 12px;
    box-sizing: border-box;
    text-transform: uppercase;
    min-width: 0;
}

#viewmybooking_content .header {
    margin-left: 0 !important;
    font-size: 120% !important;
}

.branchOpeningHoursAndFeefo {
    width: 200px;
    float: right;
    margin-top: -110px;
}

#flightOnlySearchBox {
    
}

#flightOnlySearchBox #bydest label {
    width: auto;
    float: left;
    clear: both;
}

#flightOnlySearchBox #bydest select {
    width: auto;
    float: left;
    clear: both;
}

#flightOnlySearchBox #bydest div {
    width: auto;
    float: left;
    clear: none;
}

form#blendedSearchBox div.search_container_col1 div#bydest.dest_dec {
    width: 100%;
    display: block;
    float: left;
}

form#flightOnlySearchBox div#bydest{
    width: 50%;
    display: block;
    float: left;
}

#flightOnlySearchBox #departDate {
    clear: none;
    float: left;
}


#flightOnlySearchBox #departDate input#depDatePicker, #flightOnlySearchBox #returnDate input#retDatePicker {
    width: 7em !important;
    width: 90% !important;
    max-width: 100%;
    margin-right: 20px;
}

#flightOnlySearchBox .directFlights {
    margin-top: 0;
}

#flightOnlySearchBox #returnDate input#retDatePicker {
    margin-right: 0;
}


#flightOnlySearchBox .date {
    min-width: 0 !important;
}

#flightOnlySearchBox select {
    width: 130px !important;
    margin-right: 20px !important;
}

#flightOnlySearchBox select#adults, #flightOnlySearchBox select#children, #flightOnlySearchBox select#flightclass {
    width: 70px !important;
    width: 90% !important;
}

#flightOnlySearchBox .adults, #flightOnlySearchBox .children {
    float: left;
    padding-right: 0;
}

#flightOnlySearchBox .adults {
    padding-left: 20px !important;
    border-left: 1px solid #fff;
    padding-bottom: 20px;
    margin-left: 20px !important;
}

#flightOnlySearchBox #departDate, #flightOnlySearchBox .adults {
    height: 60px;
    box-sizing: border-box;
}

#flightOnlySearchBox .directFlights {
    clear: both;
    width: auto;
    float: left;
}

#flightOnlySearchBox #submitFlightForm {
    margin-top: 0;
    float: right;
    position: relative;
    clear: none;
    width: 20%;
}

#flightsBlock {
    float: right;
}

#flightOnlySearchBox select#children {
    margin-right: 0 !important;
}

#searchBar {
    max-width: 1280px;
}

.iwant, #selDest, #selList, #selDest a, #selList a {
    color: #fff;
}
/* children popup */

#receptional_childages.ispopup {
    position: absolute;
    right: 40%;
    background: #fff;
    width: 20%;
    color: #00427C;
    padding: 5px !important;
    z-index: 12345;
    padding-bottom: 40px !important;
    min-width: 250px;
}

#receptional_childages.ispopup #receptional_childline-1, #receptional_childages.ispopup #receptional_childline-2, #receptional_childages.ispopup #receptional_childline-3 {
    margin-bottom: 1em;
}

#receptional_childages.ispopup #rm1Lbl, #receptional_childages.ispopup #rm2Lbl, #receptional_childages.ispopup #rm3Lbl {
    margin: 1em 0 0.5em 0;
    font-weight: bold;
}

#receptional_childages.ispopup .submit {
    cursor: pointer;
}

#receptional_childages.ispopup select {
    margin: 0.5em 0;
}

#flightOnlySearchBox #receptional_childages .childText, #flightOnlySearchBox  #receptional_childages .title {
    color: #00427C;
}

#receptional_childages.ispopup .title , #receptional_childages.ispopup .receptional_childagesTitle {
    background: #fed6ec;
    border: 1px dotted #00427C;
    padding: 3px 5px !important;
    font-size: 12px !important;
    color: #00427C !important;
    box-sizing: border-box;
    clear: both;
    position: absolute;
    bottom: 5px;
    width: calc(100% - 10px);
}

#receptional_childages.ispopup label {
        color: #00427C !important;
        display: block;
        float: left;
        padding-right: 1em;
}


#receptional_childages span.submit {
  background: #fde40d none repeat scroll 0 0;
  top: 5px;
  clear: both;
  color: #00427C;
  display: block;
  float: right;
  padding: 3px 6px;
  position: absolute;
  right: 5px;
  text-transform: uppercase;
  font-size: 12px;
}

#flightOnlySearchBox .childDrop {
    width: auto;
    clear: both;
    float: left;
    margin: 0.5em 0;
}

#flightOnlySearchBox .childDrop select {
    width: auto !important;
    float: left;
    clear: none;
    margin: 0 !important;  
    border: 1px solid #ccc;
}

#receptional_childages.ispopup #childline-2 div, #receptional_childages.ispopup #childline-1 div {
    aoverflow: auto;
    padding-bottom: 0.5em; 
} 

#receptional_childages.ispopup #childline-2 span.childDrop {
    padding: 0;
}


#receptional_childages.ispopup #childline-1, #receptional_childages.ispopup #childline-2, #receptional_childages.ispopup #childline-3 {
    width: 33% !important;
    box-sizing: border-box;
    float: left;
    padding-right: 1em;
}

form#flightOnlySearchBox div#bydest div, #flightsBlock div {
    width: 23% !important;
    box-sizing: border-box;
}

div#formContainer.container div#searchForm form#flightOnlySearchBox div#bydest div select {
    width: 90% !important;
    box-sizing: border-box;
    }
    
#flightOnlySearchBox select#flightclass {
    width: 90% !important;
}

div#formContainer.container div#searchForm form#flightOnlySearchBox div#bydest, #flightsBlock {
    box-sizing: border-box;
    float: left;
}



#flightsBlock {
    width: 35% !important;
}


    #flightOnlySearchBox select {
    margin-right: 0 !important;
    }
    
#flightOnlySearchBox input.ylw-btn {
    width: 100%;
    padding: 0.8em 0 !important;
    }

#flightOnlySearchBox #bydest .directFlights {
    width: auto !important;
    padding-top: 0.5em;
}

#flightOnlySearchBox #bydest .directFlights label {
    clear: none !important;
}
    
@media only screen and (max-width: 1200px) {
    #rightHeadCol {
    left: auto;
    width: 30% !important;
    top: auto;
    padding-top: .3em;
}

    div#formContainer.container div#searchForm form#flightOnlySearchBox div#bydest div select {
    width: 90% !important;
    box-sizing: border-box;
    }
    div#mainMenu.navBar div#deskMenu.wrapper, #topBar .wrapper, #headerContent, #searchBar, #headerContent, #header {
        width: 100% !important;
        max-width: 965px;
}
    
    
}
@media only screen and (max-width: 800px) {
    #rightHeadCol {
    left: auto;
    width: 30% !important;
    top: auto;
    padding-top: .3em;
    }

    #receptional_childline-1, #receptional_childline-2, #receptional_childline-3 {
        margin-bottom: 1.5em;
    }
    
    #receptional_childline-1 div, #receptional_childline-2 div, #receptional_childline-3 div {
        margin-bottom: 1em;
        }
    
    #rm1Lbl, #rm2Lbl, #rm3Lbl {
        padding: 0.5em;
    }

    .childLine {
        clear: both;
    }

    div#formContainer.container div#searchForm form#flightOnlySearchBox div#bydest div select {
    width: 100% !important;
    box-sizing: border-box;
    }
    #flightsBlock {
    float: none;
    width: 100% !important;
    }
    
    #flightOnlySearchBox #receptional_childages {
        border: none;
    }
    
    #bydest div select {
        width: 100% !important;
    }
    
    #receptional_childages {
        max-width: none;
    }

    
    #flightOnlySearchBox .childDrop {
        margin: 0;
    }
    
    #receptional_childages .title {
        font-size: 16px !important;
        margin-top: 0.5em;
        color: #fff;
    }
    

    #flightOnlySearchBox select, #flightOnlySearchBox input, #flightOnlySearchBox label, #flightOnlySearchBox #bydest div, #flightOnlySearchBox .adults, #flightOnlySearchBox .children, #flightOnlySearchBox select#adults, #flightOnlySearchBox select#children, #flightOnlySearchBox select#flightclass {
        width: 100% !important;
    }
    
    #flightOnlySearchBox #directonly {
        width: auto !important;
        float: left;
        margin-top: 16px;
    }
    
    #flightOnlySearchBox .directFlights label {
        clear: none;
        float: left;
        width: auto !important;
    }
    
    #flightOnlySearchBox #departDate {
        border-left: none;
        padding-left: 0 !important;
    }
    
    #flightOnlySearchBox .adults {
    padding-left: 0 !important;
    border-left: none;
    margin-left: 0 !important;
    padding-bottom: 0 !important;
    }
  
    #flightOnlySearchBox #receptional_childages .title, #flightOnlySearchBox label {
        background: transparent;
        color: #fff !important;
        border: none;
        
    }
    
    #receptional_childages .title {
        padding: 2em 0.5em 1em 0.5em !important;
        clear: both;
    }
    
    #flightOnlySearchBox .childDrop select, #flightOnlySearchBox .childDrop, #flightOnlySearchBox label {
        width: 100% !important;
        max-width: none !important;
    }
    

    #flightOnlySearchBox .adults {
        height: auto;
    }

    #flightOnlySearchBox #submitFlightForm {
        width: 100%;
        margin-top: 1em;
        clear: both;
        float: left !important;
    }
    
    #flightOnlySearchBox #bydest div, #flightOnlySearchBox #flightsBlock div {
        width: 100% !important;
        overflow: auto;
        clear: both;
        float: left;
        height: auto;
    }
    
    #flightOnlySearchBox #departDate input#depDatePicker, #flightOnlySearchBox #returnDate input#retDatePicker {
        width: 100% !important;
    }

    #topHeader > div.mainContainer > div:nth-child(2) > div.rightColumn > div.whiteBlock.noTopMargin.noTopBorder > div.branchOpeningHoursAndFeefo {
        margin-top: 0px !important;
    }


    .formback .formtable:first-child select, .formback .formtable:first-child input {
        width: auto !important;
        amin-width: 30%;
    }


    #viewmybooking_content p {
        clear: both;
    }

    select[name="creditcard-country"] {
        width: auto !important;
    }


    /*------------------------------------*\
        #search forms section
    \*------------------------------------*/
    #searchForm {
        font-size: 16px !important;
    }

    #flightOnlySearchBox td, #hotelOnlySearchBox td {
        width: 50% !important;
        display: inline-block;
        box-sizing: border-box;
    }

    #flightOnlySearchBox td select {
        width: 90%;
    }

    #flightOnlySearchBox td[colspan="4"], #hotelOnlySearchBox td[colspan="2"], #hotelOnlySearchBox td[colspan="5"] {
        width: 100% !important;
    }

    #flightOnlySearchBox #childline {
        width: 100% !important;
    }

    #hotelOnlySearchBox tr:nth-child(1) td:nth-child(3), #hotelOnlySearchBox tr:nth-child(1) td:nth-child(4) {
        width: 25% !important;
    }

    #hotelOnlySearchBox tr:nth-child(1) td:nth-child(3) select, #hotelOnlySearchBox tr:nth-child(1) td:nth-child(4) select {
        width: auto !important;
    }

    #hotelOnlySearchBox #datePicker {
        margin-top: 0 !important;
    }




    #hotelOnlySearchBox .boardBasis label {
        text-align: left;
    }

    #hotelOnlySearchBox tr:nth-child(3) td:nth-child(4) {
        width: 100% !important;
    }

    #hotelOnlySearchBox tr:nth-child(3) td:nth-child(4) input {
        text-align: center;
        float: none;
        margin: 0 auto;
        display: block;
    }

    #hotelOnlySearchBox .childText {
        float: left;
        text-align: left;
    }

    #hotelOnlySearchBox #datePicker {
        box-sizing: border-box;
        font-size: 16px !important;
    }

    #hotelOnlySearchBox select, #flightOnlySearchBox select, #flightOnlySearchBox #retDatePicker, #depDatePicker, #hotelOnlySearchBox #datePicker, #flightOnlySearchBox .directFlights span, #flightOnlySearchBox label, #hotelOnlySearchBox label {
        font-size: 16px !important;
        padding: 2px !important;
    }
    
    .date, .nights, .rooms {
        width: 31%;
        float: left;
    }

    .date select, .nights select, .rooms select {
        awidth: 100% !important;
        amax-width: none !important;
    }
    
    .nights {
        margin-right: 0.5em !important;
    }
    
    .starRating, .boardBasis, .propertyDetails {
        width: 100%;
        box-sizing: border-box;
     
        float: left;
    }

    .starRating select, .boardBasis select, .propertyDetails input {
        width: 100%;
    }

    .starRating {
        padding-left: 0;
    }
    
    .propertyDetails {
        padding-right: 0;
    }
    .submitForm {
        clear: both;
        width: 100%;
        margin-top: 1em;
        text-align: center;
        overflow: auto;
        margin: 0.5em auto;
    }
    
    #hotelOnlySearchBox .ylw-btn {
        float: none;
        margin-top: 1em;    
    }
    
    
    #bytext #to {
        font-size: 18px;
    }

    .imageDealBlocks.useresortimage .image, .imageDealBlocks.useresortimage .image img {
        height: auto !important;
    }

    .branchBannerBlock img {
        margin-top: 50px;
    }

    .siteFooter .copyrightRow {
        width: 100%;
    }

    .wrapper .footerContentRow .companyColumn {
        width: 170px !important;
        box-sizing: border-box;
    }

    #header {
        padding: 0 15px;
    }

    .abtaAtolTopBar {
        margin-right: 15px;
    }

    .siteFooter .confidenceRow, .siteFooter .confidenceRow div {
        width: 100% !important;
        height: auto;
        box-sizing: border-box;
        margin: 0;
    }

    .creditCards, .abtaAtol {
        text-align: center !important;
        padding: 1em 0 !important;
        right: auto;
        top: auto;
        margin-right: 0 !important;
    }

    #centerHeadCol {
        display: none !important;
    }

    #rightHeadCol {
        text-align: right;
    }

    #ddmenu {
        overflow: visible !important;
    }

    #mainMenu.navBar {
        overflow: visible !important;
        padding-top: 0.5em !important;
    }

    #ddmenu div {
        margin: 0 !important;
    }

    #ddmenu #slideDDlist {
        height: auto !important;
        padding: 0 !important;
    }

    #ddmenu ul {
        top: 40px;
        padding-bottom: 50px;
    }

    .navBar #ddmenu #ddMenuIcon.menu-icon {
        top: auto !important;
    }

    #openForm p {
        padding: 1em 15px 0 0;
    }

    #ddmenu div.menu-icon {
        left: auto;
    }

    #ddmenu {
        overflow: visible;
    }

    #ddMenuIcon {
        width: 100%;
        left: auto !important;
        right: auto;
        box-sizing: border-box;
    }

    ul.ddList {
        clear: both;
        top: 10px !important;
    }

    ul.ddList li.ddItem a.first {
        left: auto !important;
        top: auto !important;
    }

    #searchBar {
        padding: 15px;
        padding-bottom: 0;
    }

    #searchForm {
        left: auto !important;
    }

    .search_button_dec {
        width: 100% !important;
    }

    .itineraryItem .detail .heading14 {
        font-size: 22px;
    }

    .whatsThisTrigger {
        display: none !important;
        /* basket tooltip */
    }

    input[type=submit] {
        -webkit-border-radius: 0 !important;
    }

    .rightColumn {
        box-sizing: border-box !important;
    }

    .pricePerPerson {
        color: #00427C !important;
    }

    .rightColumn .bookingOptions {
        width: 100% !important;
        max-width: none !important;
        margin-top: 1em !important;
    }

    .basket .itineraryItem .detail {
        width: 100% !important;
    }

    .basket .summary .itineraryItem .details .label {
        color: #00427C;
    }

    .basket .summary .itineraryItem .details {
        margin-bottom: 1em !important;
    }

    .itineraryExtra {
        font-size: 20px;
        margin: 1em 0;
    }

    .basket .transfersHere, .basket .carParkingHere, .basket .itineraryItem {
        padding: 10px 0 !important;
    }

    .basket .itineraryItem .heading, .basket .transfersHere .heading, .basket .carParkingHere .heading, .totalPricing .totalHolidayPrice {
        font-size: 46px !important;
        margin-top: 0.3em !important;
    }

    .totalPricing .totalHolidayPrice {
        font-size: 32px !important;
    }

    #itineraryform .basketRef, .basket .detail .title, .basket .transfersSectionHead, .totalPricing .pricePerPerson {
        font-size: 27px !important;
        margin: 1em 0 !important;
    }

    .basket, .basket .transfersHere .intro, .basket .carParkingHere .intro, .basket .itineraryItem .detail .details, .basket .itineraryItem .detail .baggageText, .basket .itineraryItem .detail .baggageText span, .basket .basketBreadCrumbs, .basket .breakdown, .basket .itineraryPriceModifier, .basket .basketEnquiryLink, .basket a, .passengerDetails .passengerDetailsBreadcrumbs {
        font-size: 20px !important;
    }

    .basket .itineraryItem, .basket .transfersHere, .basket .carParkingHere, .basket .itineraryPriceModifier, .basket .bookNow {
        border-left: none !important;
        border-right: none !important;
        border-bottom: none !important;
    }

    .basket .summary .itineraryItem {
        clear: both !important;
        padding-bottom: 1em !important;
        overflow: auto !important;
    }

    .basket .carParkingHere {
        border-bottom: 1px solid #bcbcbc !important;
    }

    .basket .summary .basketRefAndBook .basketRef {
        width: 100% !important;
    }

    .basket .summary, .basket .itineraryItem {
        box-sizing: border-box !important;
    }

    #itineraryform div.breakdown {
        clear: both !important;
        overflow: auto !important;
        width: 100%;
        position: relative !important;
        bottom: auto !important;
        line-height: 1.6;
    }

    .basket .itineraryItem a.addOptionalExtras {
        box-sizing: border-box !important;
        clear: both !important;
        float: left !important;
        width: 100% !important;
        font-size: 20px !important;
        text-align: center;
        margin: 20px 0 !important;
        padding: 10px 0 !important;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        overflow: auto !important;
        position: relative !important;
    }

    .basket .itineraryItem .price {
        position: relative !important;
        clear: both;
        float: right;
        width: auto !important;
        font-size: 40px !important;
    }

    .basket .transfersItem {
        margin-top: 15px !important;
    }

    .basket .transfersItem .label {
        width: 100% !important;
    }

    .basket .transfersItem .button, .basket .carParkingHere .button {
        overflow: auto;
        width: auto !important;
        height: auto !important;
        text-align: center !important;
    }

    .basket .transfersItem .button a, .basket .carParkingHere .button a, #promocodeHere input[type="button"] {
        font-size: 20px !important;
        display: block;
        padding: 10px 40px !important;
        clear: both;
        position: relative;
    }

    .basket .transfersItem .price, .basket .carParkingHere .price {
        padding-top: 10px !important;
        text-align: right !important;
        display: block !important;
        float: right !important;
    }

    .carParkingHere .toggleExtras {
        width: auto !important;
        display: block !important;
        text-align: center !important;
        position: relative !important;
        text-transform: uppercase !important;
        padding: 10px 30px !important;
        float: left !important;
        clear: both !important;
        overflow: auto !important;
        margin: 1em 0 !important;
    }

    .basket .itineraryPriceModifier {
        clear: both !important;
    }

    .basket .summary .bookNow {
        margin: 0 !important;
        padding: 2em 0 1em !important;
        amargin-top: 2em !important;
    }

    .basket .summary .bookNow .links {
        width: 100% !important;
        font-size: 20px !important;
    }

    .basket input#promocode_code {
        width: 100% !important;
        font-size: 20px;
        padding: 5px 0 5px 5px !important;
        margin: 10px 0 15px !important;
        box-sizing: border-box;
    }

    #promocodeHere input[type="button"] {
        float: right;
    }

    .bookNow div.button, .bookNow div.button input {
        display: block !important;
        clear: both !important;
        width: 100% !important;
        background: #00427C !important;
        color: #fde40d !important;
        font-size: 20px !important;
    }

    .bookNow div.button input {
        height: auto !important;
        padding: 1em !important;
    }

    .bookNow .totalPricing {
        clear: both !important;
        margin: 1em 0 !important;
    }

    form#itineraryform div.summary div.itineraryItem div.detail div.details span.label {
        font-size: 20px !important;
    }

    .basket .label {
        padding-bottom: 0.5em !important;
    }

    .basket .summary .errataInfo {
        display: none !important;
    }

    .legHeadings div, .legDetails div {
        width: 25% !important;
    }

    .legHeadings div {
        font-weight: 700;
    }

    .flightDetails, .legDetails {
        line-height: 1.6;
    }

    .passengerDetails {
        padding: 0 15px !important;
    }

    .passengerDetailsBreadcrumbs {
        margin-bottom: 1em !important;
    }

    .passengerDetails .sideItinerary {
        border-top: 1px solid #999 !important;
        overflow: auto;
        width: 100%;
    }

    .passengerDetails .itineraryItem {
        border-bottom: 1px solid #bcbec0 !important;
    }

    .passengerDetails .itineraryItem .heading {
        display: block;
        float: left;
        width: auto;
        text-align: left;
        min-width: 30%;
        background: #797979;
        color: #fff;
        font-size: 30px;
        padding: .5em;
        margin-top: 0.5em !important;
    }

    .passengerDetails .itineraryItem .detail .title, .itineraryPriceModifier {
        clear: both;
        float: left;
        display: block;
        color: #00427C;
        font-size: 24px;
        width: 100%;
        padding: .8em 0;
    }

    .itineraryPriceModifier {
        padding: .3em 0;
    }

    .passengerDetails .itineraryItem .details, .passengerDetails .itineraryItem .price {
        clear: both;
        float: left;
        line-height: 1.2;
        margin-bottom: 1em;
    }

    .passengerDetails .itineraryItem .price {
        float: right;
        color: #00427C;
        font-size: 24px;
        font-weight: 700;
    }

    .passengerDetails .itineraryItem span {
        color: #00427C;
    }

    .itineraryPriceModifier div, .itineraryPriceModifier img {
        float: left;
        width: auto;
    }

    .itineraryPriceModifier .price {
        float: right;
    }

    .totalPricing {
        background: #FDE40D;
        width: 100%;
        clear: both;
        color: #00427C;
        font-size: 22px;
        padding: .5em;
        box-sizing: border-box;
        margin-top: .5em;
    }

    .totalPricing .price {
        text-align: right;
        float: right;
    }

    .passengerDetails .passengerDetailsForm {
        font-size: 20px !important;
        padding: 0.5em 0 !important;
        border-left: none;
        border-right: none;
    }

    .passengerDetails .passengerDetailsForm .formSide {
        width: 100% !important;
    }

    .passengerDetails .passengerDetailsForm .formSide .instructionsText {
        font-size: 20px !important;
    }

    form#passengerDetailsForm label, form#passengerDetailsForm input, form#passengerDetailsForm select, .passengerDetails .passengerDetailsForm .formSide .formLabel {
        font-size: 20px !important;
        width: 100%;
    }

    form#passengerDetailsForm label {
        width: 30%;
    }

    .passengerDetails .passengerDetailsForm .formSide .formField, .passengerDetails .passengerDetailsForm .formSide textarea {
        width: 100% !important;
        max-width: 400px;
        box-sizing: border-box !important;
    }

    form#passengerDetailsForm input[type=button] {
        width: auto !important;
        padding-left: 1em;
        padding-right: 1em;
    }

    form#passengerDetailsForm input#continue {
        width: 100%;
        text-align: center;
        clear: both;
        padding: .5em 0;
        font-size: 40px !important;
        color: #fde40d;
        margin: 1em 0;
    }

    .passengerDetails .passengerDetailsForm .formSide .sectionHeading {
        margin-top: 1.5em;
        font-size: 27px !important;
        clear: both;
    }

    .formSide .instructionsText {
        margin: 1em 0 !important;
    }

    .formSide .instructionsText input {
        display: block !important;
        float: left !important;
        width: auto !important;
    }

    #pcaButtonDK34 {
        margin: 1em 0 !important;
    }

    #dobday-1, #dobmonth-1, #dobyear-1, #dobday-2, #dobmonth-2, #dobyear-2 {
        width: 31% !important;
    }

    .totalPricing .label {
        text-transform: uppercase;
        font-size: 22px !important;
        font-weight: 600;
        width: 100% !important;
        float: left;
    }

    .carParkInfo .carParkInfoRowDetail, .carParkInfo .selectedCarParkInfo .details, .basket .carParkingHere .carparkingItem .label, .carParkInfo .carParkInfoRowHeader {
        width: 100% !important;
        font-size: 18px;
    }

    .carParkInfo .carParkInfoRowHeader {
        font-size: 20px;
        font-weight: 700;
    }

    .carParkInfo .sectionHeading {
        font-size: 22px !important;
        font-weight: 700;
    }

    .carParkInfo .selectedCarParkInfo .details, .carParkInfo .selectedCarParkInfo .details .topLine, .carParkInfo .selectedCarParkInfo .details .bottomLine, .carParkInfo .selectedCarParkInfo .price .topLine {
        font-size: 18px !important;
    }

    .carParkInfo .pageTitle {
        font-weight: 700;
    }

    .noBlock ul {
        display: block;
        box-sizing: border-box !important;
    }

    .rightColumn .noBlock.ad, .rightColumn .noBlock.ad a, div.rightColumn > div.noBlock.ad > a {
        margin: 0 auto !important;
        text-align: center !important;
        display: block !important;
    }

    .noBlock.ad a img {
        width: 100%;
        height: auto;
    }

    .offers, .imageDealBlocks, .destinationGuideBlocks {
        width: 100% !important;
        box-sizing: border-box !important;
        margin: 0 auto !important;
    }

    .offers, .imageDealBlocks ul {
        overflow: auto;
        display: block;
        float: none;
        margin: 0 auto;
        text-align: center;
        box-sizing: border-box !important;
    }

    a.destinationTryAd {
        display: block;
        position: relative;
        float: none;
        height: auto;
        overflow: auto;
        width: 100%;
        clear: both;
        padding: 1em;
        box-sizing: border-box !important;
    }

    a.destinationTryAd span.topLine, a.destinationTryAd span.bottomLine {
        float: left;
        clear: both;
        display: block;
        position: relative;
        top: auto;
        left: auto;
    }

    a.destinationTryAd img.logo {
        margin-top: 1em;
        position: relative;
        width: 160px;
        height: auto;
        top: auto;
        left: auto;
        right: auto;
        display: block;
        float: right;
        clear: both;
    }

    .lpStaffBlock {
        box-sizing: border-box !important;
        width: 100% !important;
    }

    .lpStaffBlock .image {
        box-sizing: border-box !important;
        width: 25%;
        height: auto;
        margin: 0;
        padding: 1em;
    }

    .lpStaffBlock .image img {
        width: 100%;
        height: auto;
    }

    .lpStaffBlock .content {
        box-sizing: border-box !important;
        padding: 1em;
        width: 75% !important;
        float: right !important;
    }

    .sixPack ul {
        width: 100%;
    }

    .paymentDetailsForm {
        width: 100%;
        box-sizing: border-box !important;
        float: none;
    }

    .sideItinerary {
        width: 100%;
        float: none;
        box-sizing: border-box !important;
    }

    .bookButton input {
        box-sizing: border-box !important;
        width: 100%;
        float: none;
    }

    .imageDealBlocks ul li, .offers ul li {
        box-sizing: border-box !important;
        text-align: left;
        width: calc(50% - 6px) !important;
    }

    .imageDealBlocks ul li span.details {
        padding: 0 1em 1em 0;
    }

    #surround *, #surround input, #surround select {
        font-size: 14px !important;
    }

    .destinationTopHotel {
        height: 140px;
    }

    .destinationTopHotel .hotelLink {
        top: auto;
        bottom: 1em;
    }

    .flightResults .alternateTitle {
        font-size: 22px;
    }

    .flightResults .resultHeadings div, .flightResults .flightResult div {
        margin: 0 !important;
    }

    .flightResults .outboundFlight, .flightResults .inboundFlight {
        width: 130px !important;
    }

    .resultHeadings .outboundFlight, .resultHeadings .inboundFlight {
        width: 154px !important;
    }

    .flightResults .resultHeadings .stops, .flightResults .flightResult .stops {
        width: 90px;
    }

    .bookingJourney .hotelResultBlock .info {
        width: 55%;
    }

    .packageResults .resultIntro .topLine, .packageResults .resultIntro .bottomLine {
        width: 100%;
        margin-left: 0;
        max-width: none;
    }

    #filterForm input, #filterForm select, #filterForm select.filterControl, form#filterForm select.filterControl, form#filterForm input#filterwantedname.filterControl, form#filterForm select.filterControl {
        width: calc(25% - 4px) !important;
    }

    #one, #two, #three, #four, #five, #six, #seven, #eight {
        width: calc(50% - 6px) !important;
        box-sizing: border-box;
    }

    #viewmybooking_content .formtable a {
        display: none;
    }

    #viewmybooking {
        padding: 0 1em;
    }

}

@media only screen and (max-width: 800px) {
    
    form#flightOnlySearchBox div#bydest div, #flightsBlock div {
  box-sizing: border-box;
  width: 100% !important;
}
    div#formContainer.container div#searchForm form#flightOnlySearchBox div#bydest {
  width: 100%  !important;
}
    
    
    #blendedSearchBox .search_container_col3 select, #blendedSearchBox .search_container_col1, #blendedSearchBox .search_container_col2, #blendedSearchBox .search_container_col3 {
        width: 100% !important;
    }
    
    #blendedSearchBox #wantedname {
        display: none;
    }
    
    #blendedSearchBox div.col2_row2 div.number_nights_container_dec select#nights, #blendedSearchBox .search_container_col2 select, #blendedSearchBox input#datePicker.hasDatepicker {
        width: 100% !important;
        max-width: none !important;
    }
    
    #blendedSearchBox select, #blendedSearchBox input, #blendedSearchBox input#datePicker.hasDatepicker {
        font-size: 16px !important;
    }
    
    #blendedSearchBox label,     #blendedSearchBox .search_container_col3 span {
        font-weight: normal !important;
        font-size: 16px !important;
        padding: 10px !important;
        margin: 0 !important;
        box-sizing: border-box;
    }
    
    #blendedSearchBox .search_container_col3 span {
        display: block;
        float: left;
    }
    
    #blendedSearchBox .col2_row1 {
        padding: 0;
    }
    
    #blendedSearchBox .submitButton_container_row {
        width: 100%;
    }
    #blendedSearchBox .btn-ylw {
        padding: 0.5em !important;
        line-height: 1.6;
    }
    
form#hotelOnlySearchBox div#search_container_col1 div.nights select#nights,
   .room,  .roomSelect {
        width : 100% !important;
    }
div#search_container_col2 div#roomSelection div#room1select.room div.roomSelect label {
             width : 100%;
             clear: both;
        
    }
    

#flightOnlySearchBox #search_container_col2 .adults, #flightOnlySearchBox #search_container_col2 .children
{
    width: 100% !important;
    padding: 0 !important;
}

#flightOnlySearchBox #search_container_col2 .adults select {
    width: 100% !important;
}

#flightOnlySearchBox .flightClass {
    padding-right: 0;
}

#flightOnlySearchBox #submitFlightForm {
    clear: both;
    float: none;
}

    
    
    #roomSelection .room {
        padding-right: 0;
        }

    
    form#hotelOnlySearchBox .date,     
    form#hotelOnlySearchBox .rooms,     
    form#hotelOnlySearchBox .nights, 
    form#hotelOnlySearchBox .date input,     
    form#hotelOnlySearchBox .rooms select,     
    form#hotelOnlySearchBox .nights select, 
    #roomSelection select, 
    #hotelOnlySearchBox div#search_container_col2 #roomSelection,
    #child_ages_row_dec, 
    #hotelOnlySearchBox .childText, 
    div#receptional_childages.receptional_childages .childLine .childText span.childDrop select,
    #flightOnlySearchBox #search_container_col2 div,
    #flightOnlySearchBox #search_container_col2 div input,
    #flightOnlySearchBox .flightClass {
        width: 100% !important;
        max-width: none ;
        box-sizing: border-box;
    }
    
    #receptional_childages .childline {
        overflow: auto;
        text-align: left;
        width: 100%;
    }
    
    
    #search_container_col3 {
        padding-top: 0.5em;
    }
    
    #flightOnlySearchBox #search_container_col3 .directFlights label,     .directFlights input {
        padding: 0 !important;
        padding-left: 10px !important;
        float: left;
        width: auto !important;
    }
    
    #search_container_col3 .directFlights {
        padding-bottom: 0.5em;
        float: left;
    }
    
    div#search_container_col2 div#roomSelection div#room1select.room div.roomSelect select {
        clear: both;
        width : 100%;
    }
    #hotelOnlySearchBox select, #flightOnlySearchBox select, #flightOnlySearchBox #retDatePicker, #flightOnlySearchBox #depDatePicker, #depDatePicker, #hotelOnlySearchBox #datePicker, #flightOnlySearchBox .directFlights span, #flightOnlySearchBox label, #hotelOnlySearchBox label, input#wantedname {
        font-size: 16px !important;
        padding: 10px !important;
        width : 100%;
        box-sizing: border-box;
    }
       #one, #two, #three, #four, #five, #six, #seven, #eight, #nine {
        width: 100% !important;
    }
    
    .adults {
        clear: both;
    }


    .packageResults .hotelResultFilter .starRatingFilter {
        width: calc(100% - 4px) !important;
        height: 85px !important;
        padding-top: 0.5em !important;
    }

    .packageResults .hotelResultFilter .starRatingFilter .description {
        font-size: 16px !important;
    }

    #filterForm input, #filterForm select, #filterForm select.filterControl, form#filterForm select.filterControl, form#filterForm input#filterwantedname.filterControl, form#filterForm select.filterControl, html body div#topHeader div.mainContainer div div.rightColumn.packageResults div.hotelResultFilter form#filterForm input#filterwantedname.filterControl, #filterButton {
        width: calc(100% - 4px) !important;
        padding: 0.5em !important;
    }

    .packageResults .hotelResultPageNumbers .sort {
        width: 100% !important;
    }

    div.sort select#changeHotelSort.filterControl {
        width: 100% !important;
        top: auto;
    }

    .packageResults .hotelResultPageNumbers .pages {
        clear: both;
        float: none;
        margin: 0 auto;
        padding-top: 1em;
    }

    .packageResults .hotelResultFilter .starRatingFilter.first {
        color: #fff;
    }

    .imageDealBlocks ul li a span.image, .imageDealBlocks ul li a span.image img {
        height: auto !important;
    }

    /*------------------------------------*\
        #search forms section
    \*------------------------------------*/
    #flightOnlySearchBox td, #hotelOnlySearchBox td {
        width: 100% !important;
    }

/*    #flightOnlySearchBox td select, #flightOnlySearchBox .title, #hotelOnlySearchBox td select, #hotelOnlySearchBox .title {
        width: 100%;
    }*/

    #flightOnlySearchBox .childText {
        font-size: 15px;
        font-weight: normal;
    }

    #hotelOnlySearchBox .hotelThird {
        width: 100%;
    }

    #hotelOnlySearchBox tr:nth-child(1) td:nth-child(3), #hotelOnlySearchBox tr:nth-child(1) td:nth-child(4), #hotelOnlySearchBox tr:nth-child(2) td:nth-child(1), #hotelOnlySearchBox tr:nth-child(2) td:nth-child(2) {
        width: 50% !important;
    }

    #hotelOnlySearchBox tr:nth-child(1) td:nth-child(3) select, #hotelOnlySearchBox tr:nth-child(1) td:nth-child(4) select, #hotelOnlySearchBox tr:nth-child(2) td:nth-child(1) select, #hotelOnlySearchBox tr:nth-child(2) td:nth-child(2) select {
        width: 90% !important;
    }

 
    form#hotelOnlySearchBox div#search_container_col1 div.date {
    width: 100% !important;
    apadding-right: 20px;
}
    .date, .nights, .rooms, .starRating, .boardBasis, .propertyDetails, #bydest div.hotelQuarter, #bydest {
        width: 100% !important;
        padding: 0;
        box-sizing: border-box;
    }
    
    #hotelOnlySearchBox input, #hotelOnlySearchBox label, #hotelOnlySearchBox select {
        box-sizing: border-box;
    }
    
    #departDate, #returnDate {
        width: 50% !important;
    }
    
    #search_container_col1 select, #hotelOnlySearchBox #datePicker {
        width: 100%!important;
    }
 #leftHeadCol, #rightHeadCol, #centerHeadCol {
        width: 100%;
        display: block !important;
        clear: both;
        text-align: center;
    }

    #hotelOnlySearchBox  input, #flightOnlySearchBox input.ylw-btn, #hotelOnlySearchBox input.ylw-btn {
        width: 100% ;
    }
    
    #search_container_col3 .submitForm {
        clear: both;
        float: left;
    }
    
    #hotelOnlySearchBox input.ylw-btn {
        padding: 0.5em !important;
        line-height: 1.6;
        font-size: 16px;
        margin: 0 auto !important;
        text-align: center;
        height: auto;        
        }
    
    #bydest div.hotelQuarter {
        width: 100% ;
    
        margin-right: 0.5em;
    }
    
    #roomSelection {
    clear: both;
    margin-top: 1em;    
    }


}


@media only screen and (max-width: 600px) {
    #rightHeadCol {
    left: auto;
    width: 100% !important;
    top: auto;
    padding-top: .3em;
}

    #leftHeadCol, #rightHeadCol, #centerHeadCol {
        width: 100%;
        display: block !important;
        clear: both;
        text-align: center;
    }

    #hotelOnlySearchBox tr:nth-child(3) td:nth-child(4) input, #flightOnlySearchBox input.ylw-btn, #hotelOnlySearchBox input.ylw-btn {
        width: 100% ;
    }
    
    #bydest div.hotelQuarter {
        min-width: 8em;
        margin-right: 0.5em;
    }

    #topHeader #header {
        height: auto !important;
        min-height: 0 !important;
    }

    .bookingJourney .hotelResultBlock .info {
        width: 100%;
        margin-bottom: 1em;
    }

    /* branch profile */
    .branchOpeningHoursAndFeefo {
        clear: both;
        float: none;
        width: 100%;
        box-sizing: border-box;
        margin-top: 1em;
    }

    .branchOpeningHoursAndFeefo div {
        float: left;
        margin: 0 1em 1em 0;
    }

    .branchBannerBlock {
        padding-top: 180px;
    }

    .offers li div.price {
        width: 35%;
    }

    .offers .price span p {
        font-size: 18px !important;
        padding-top: .9em;
    }

    .offers .price .mbl, .offers .details .dept {
        font-size: 13px !important;
    }

    .offers .details {
        width: 58%;
    }

    .messageToSearch {
        width: 100%;
    }

    .arrowToSeach {
        display: none;
    }

    .imageDealBlocks ul li, .offers ul li, .destinationGuideBlocks .destinationGuideBlock {
        width: calc(50% - 8px) !important;
    }

    div.featherlight-content {
        min-height: 75% !important;
    }

    .destinationWeather .weatherIcon {
        width: 16.66667% !important;
    }

    .destinationFastFacts span.flightTime, .destinationFastFacts span.timeDifference, .destinationFastFacts span.temperature, .destinationFastFacts span.currency {
        width: 50% !important;
        padding-bottom: 1em;
        min-height: 6em !important;
    }

    .flightResult div.select {
        clear: both;
        width: 100% !important;
        padding: 0.5em 0 !important;
    }

    .flightResults .flightResult .select a {
        width: auto !important;
    }

    .flightResults .resultHeadings div {
        display: none !important;
    }

    .flightResults .flightResult .outboundFlight, .flightResults .flightResult .inboundFlight, .flightResults .flightResult .stops, .flightResults .flightResult .price {
        width: 45% !important;
        float: left;
        box-sizing: border-box !important;
        font-size: 14px;
    }

    .flightResults .flightResult .stops, .flightResults .flightResult .price {
        padding: 0.5em 0 0.5em 24px !important;
    }

    .destinationTopHotel {
        height: 190px;
    }

    .creditCards {
        margin-top: 0 !important;
    }

    .bookingJourney .hotelResultBlock {
        height: auto;
        overflow: auto;
    }

    .bookingJourney .hotelResultBlock .image {
        width: 100%;
        box-sizing: border-box;
        height: auto;
        overflow: auto;
        box-sizing: border-box;
    }

    .bookingJourney .hotelResultBlock .image img {
        position: relative;
        width: 100%;
        height: auto;
        max-height: 160px;
        box-sizing: border-box;
    }

    .bookingJourney .hotelResultBlock .image .bookBtn {
        clear: both;
        width: 100%;
        bottom: 0px;
        left: 0;
        top: auto;
        font-size: 16px;
        padding: 1em 0;
    }

    .bookingJourney .hotelResultBlock .image .pinkBox {
        padding: 3px;
        top: auto !important;
        bottom: 58px !important;
        left: auto !important;
        right: 0 !important;
        height: 55px !important;
        background: rgba(255, 255, 255, 0.6) !important;
    }

    .expandableText .justified {
        font-size: 16px;
        line-height: 1.4;
    }

    .packageResults .hotelResultFilter .starRatingFilter {
        width: calc(33.333% - 4px) !important;
    }

    #filterForm input, #filterForm select, #filterForm select.filterControl, form#filterForm select.filterControl, form#filterForm input#filterwantedname.filterControl, form#filterForm select.filterControl, html body div#topHeader div.mainContainer div div.rightColumn.packageResults div.hotelResultFilter form#filterForm input#filterwantedname.filterControl {
        width: calc(50% - 4px) !important;
    }

    form#filterForm select.filterControl {
        max-width: none;
    }

    .packageResults .hotelResultFilter .filterButton {
        left: auto;
    }

    .flightChangeLink {
        padding-right: 1em !important;
    }

    .hotelImageGallery .bigImage, .bigImage img {
        height: auto !important;
        width: auto !important;
        border: none !important;
        margin: 0 auto !important;
        float: none !important;
        text-align: center !important;
        max-width: calc(100% - 4px);
    }

    .bigImage img {
        margin: 0 !important;
        padding-bottom: 1em;
        box-sizing: border-box;
        max-width: 100%;
    }

    .hotelImageGallery .viewport, .viewport .btmRow, .viewport .topRow {
        width: 100% !important;
        box-sizing: border-box;
        height: auto !important;
        line-height: 0;
    }

    .viewport .btmRow img, .viewport .topRow img {
        width: calc(50% - 4px) !important;
        margin-right: 2px !important;
        margin-bottom: 4px !important;
        margin-left: 2px !important;
        height: auto !important;
        border: none !important;
    }

    .hotelImageGallery .controls {
        display: none;
    }

    .destinationTabs span {
        box-sizing: border-box !important;
        width: 100% !important;
        padding: 0.8em;
    }

    .destinationTabs span::before {
        content: " > ";
    }

    .formback input#payment {
        margin-left: 0 !important;
        clear: both;
        padding: 0.7em 0 !important;
        width: 100%;
        margin-bottom: 1em !important;
        font-size: 13px !important;
    }

    .formback .formtable:first-child select, .formback .formtable:first-child input {
        min-width: 0;
    }


}
@media only screen and (max-width: 420px) {
    .bookingJourney .hotelResultBlock .info .hotelName {
  color: #00427C;
  font-size: 18px;
  height: 75px;
}
    #one, #two, #three, #four, #five, #six, #seven, #eight {
        width: 100% !important;
    }


    .packageResults .hotelResultFilter .starRatingFilter {
        width: calc(100% - 4px) !important;
        height: 85px !important;
        padding-top: 0.5em !important;
    }

    .packageResults .hotelResultFilter .starRatingFilter .description {
        font-size: 16px !important;
    }

    #filterForm input, #filterForm select, #filterForm select.filterControl, form#filterForm select.filterControl, form#filterForm input#filterwantedname.filterControl, form#filterForm select.filterControl, html body div#topHeader div.mainContainer div div.rightColumn.packageResults div.hotelResultFilter form#filterForm input#filterwantedname.filterControl, #filterButton {
        width: calc(100% - 4px) !important;
        padding: 0.5em !important;
    }

    .packageResults .hotelResultPageNumbers .sort {
        width: 100% !important;
    }

    div.sort select#changeHotelSort.filterControl {
        width: 100% !important;
        top: auto;
    }

    .packageResults .hotelResultPageNumbers .pages {
        clear: both;
        float: none;
        margin: 0 auto;
        padding-top: 1em;
    }

    .packageResults .hotelResultFilter .starRatingFilter.first {
        color: #fff;
    }

    .imageDealBlocks ul li a span.image, .imageDealBlocks ul li a span.image img {
        height: auto !important;
    }

    /*------------------------------------*\
        #search forms section
    \*------------------------------------*/
    #flightOnlySearchBox td, #hotelOnlySearchBox td {
        width: 100% !important;
    }

    #flightOnlySearchBox td select, #flightOnlySearchBox .title, #hotelOnlySearchBox td select, #hotelOnlySearchBox .title {
        width: 100%;
    }

    #flightOnlySearchBox .childText {
        font-size: 15px;
        font-weight: normal;
    }

    #hotelOnlySearchBox .hotelThird {
        width: 100%;
    }

    #hotelOnlySearchBox tr:nth-child(1) td:nth-child(3), #hotelOnlySearchBox tr:nth-child(1) td:nth-child(4), #hotelOnlySearchBox tr:nth-child(2) td:nth-child(1), #hotelOnlySearchBox tr:nth-child(2) td:nth-child(2) {
        width: 50% !important;
    }

    #hotelOnlySearchBox tr:nth-child(1) td:nth-child(3) select, #hotelOnlySearchBox tr:nth-child(1) td:nth-child(4) select, #hotelOnlySearchBox tr:nth-child(2) td:nth-child(1) select, #hotelOnlySearchBox tr:nth-child(2) td:nth-child(2) select {
        width: 90% !important;
    }

    #hotelOnlySearchBox tr:nth-child(2) td:nth-child(4) {
        display: none;
    }
    
    .date, .nights, .rooms, .starRating, .boardBasis, .propertyDetails, #bydest div.hotelQuarter, #bydest {
        width: 100% !important;
        padding: 0;
    }
    
    #departDate, #returnDate {
        width: 50% !important;
    }
    
    #search_container_col1 select, #hotelOnlySearchBox #datePicker {
        width: 100%;
    }

    .rightColumn, .rightColumn p {
        font-size: 16px;
        line-height: 1.5;
    }

    #branchLocator_branchesCombo {
        font-size: 18px !important;
    }

    .destinationFastFacts span.flightTime, .destinationFastFacts span.timeDifference, .destinationFastFacts span.temperature, .destinationFastFacts span.currency {
        min-height: 3em !important;
    }

    .destinationFastFacts span.temperature {
        min-height: 4em !important;
        clear: both;
    }

    .branchBannerBlock span.title {
        width: 50% !important;
        min-height: 90px;
    }

    .branchBannerBlock .info {
        top: -95px !important;
    }

    #flightsortlist {
        clear: both;
        display: block;
        width: auto;
        padding-top: .5em;
    }

    .flightResults .flightResult .outboundFlight, .flightResults .flightResult .inboundFlight {
        width: 100% !important;
        padding-bottom: 0.5em !important;
    }

    .imageDealBlocks ul li, .offers ul li, .destinationGuideBlocks .destinationGuideBlock {
        width: 98% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
    }

    .passengers .heading {
        display: none !important;
    }

    .passengers div {
        width: auto !important;
        padding-right: 0.5em !important;
    }

    .passengers .title {
        width: 2em !important;
    }

    .passengers div.paxNo {
        clear: both !important;
    }

    #surround *, #surround input, #surround select {
        afont-size: 10px !important;
    }

    #surround {
        padding: 0 !important;
    }

    .destinationWeather .weatherIcon {
        width: 33.33333% !important;
        height: auto;
        font-size: 14px;
        padding-bottom: 1.5em;
    }

    .destinationTopHotel {
        height: auto !important;
    }

    .destinationTopHotel div, .destinationTopHotel a {
        width: 100% !important;
        height: auto !important;
        position: relative !important;
        clear: both !important;
        overflow: auto !important;
        top: auto !important;
        bottom: auto !important;
        left: auto !important;
        right: auto !important;
        padding-bottom: 0.5em !important;
    }

    .destinationTopHotel .hotelImage img {
        width: 100% !important;
        height: auto !important;
    }

    .mainContainer {
        padding-top: 0 !important;
    }

    .breadcrumbs {
        display: none !important;
    }

    .offers .price span p {
        font-size: 26px !important;
        padding-top: .3em;
    }

    .branchBannerBlock {
        background-size: 390px 130px;
        padding-top: 130px;
    }

    div.mainContainer > div:nth-child(2) > div > div.bookingOptions > span.branch, div.mainContainer > div:nth-child(2) > div > div.bookingOptions > span.phone {
        left: 10px !important;
    }

    .rightColumn .bookingOptions .online, .rightColumn .bookingOptions .email {
        left: 55% !important;
    }

    .formback .formtable:first-child input.formbutton {
        width: 100%!important;
        padding: 0.5em 0 !important;
        float: none !important;
        font-size: 13px;
        box-sizing: border-box;
        text-transform: uppercase;
    }

}
@media only screen and (max-width: 320px) {
    /*------------------------------------*\
        #search forms section
    \*------------------------------------*/
    #flightOnlySearchBox .ylw-btn {
        width: 100%;
    }

    .basket .itineraryItem .heading, .basket .transfersHere .heading, .basket .carParkingHere .heading {
        font-size: 40px !important;
    }

    .totalPricing .label {
        width: 100% !important;
    }

    #itineraryform .basketRef, .basket .detail .title, .basket .transfersSectionHead, .totalPricing .pricePerPerson {
        font-size: 22px !important;
    }

    .basket, .basket .transfersHere .intro, .basket .carParkingHere .intro, .basket .itineraryItem .detail .details, .basket .itineraryItem .detail .baggageText, .basket .itineraryItem .detail .baggageText span, .basket .basketBreadCrumbs, .basket .breakdown, .basket .itineraryPriceModifier, .basket .basketEnquiryLink, .basket a, .basket .summary .bookNow .links, form#itineraryform div.summary div.itineraryItem div.detail div.details span.label, .passengerDetails .passengerDetailsBreadcrumbs {
        font-size: 18px !important;
    }

    .basket .itineraryItem a.addOptionalExtras {
        font-size: 18px !important;
        margin: 18px 0 !important;
        padding: 8px 0 !important;
    }
    
    #hotelOnlySearchBox input, #hotelOnlySearchBox select {
        font-size: 18px !important;
    }

    .basket .itineraryItem .price {
        font-size: 34px !important;
    }

    .basket .transfersItem .button a, .basket .carParkingHere .button a, #promocodeHere input[type="button"] {
        font-size: 18px !important;
        padding: 8px 35px !important;
    }

    .basket input#promocode_code {
        font-size: 18px;
        padding: 5px 0 5px 5px !important;
        margin: 10px 0 15px !important;
    }

    .basket {
        padding: .5em;
    }

    .passengerDetails .passengerDetailsForm .formSide .formField, .passengerDetails .passengerDetailsForm .formSide textarea {
        width: 100% !important;
    }

    form#passengerDetailsForm label, form#passengerDetailsForm input, form#passengerDetailsForm select {
        width: 100%;
    }

    .offers ul li {
        margin: 1em 0 !important;
    }

    .lpStaffBlock .image {
        width: 100%;
    }

    .lpStaffBlock .image img {
        width: auto;
        height: auto;
    }

    .lpStaffBlock .content {
        width: 100% !important;
    }

    .lpStaffBlock .content .header {
        width: 100% !important;
    }

    .imageDealBlocks ul li {
        width: 100% !important;
        margin: 0.5em 0 !important;
    }

    .destinationTopHotelIntro .title {
        font-size: 12px;
    }

    .destinationTabs {
        box-sizing: border-box !important;
    }

    h1.header {
        font-size: 26px;
    }

    .branchOpeningHours, #feefologohere, #feefologoa, #feefologoa img {
        width: 100% !important;
        margin: 0 !important;
        max-width: none !important;
        box-sizing: border-box;
        display: block;
        overflow: auto;
    }

    .branchOpeningHours {
        margin-bottom: 1em !important;
    }

    .bookingJourney .hotelResultBlock .image {
        margin: 1em auto;
        float: none;
        clear: both;
    }

    #rightHeadCol {
        width: 100% !important;
    }

    #bottomSideBar {
        display: none !important;
    }

}


#hotelOnlySearchBox #search_container_col3 #childages {
    display: none !important
}

/**
 * Featherlight - ultra slim jQuery lightbox
 * Version 1.3.5 - http://noelboss.github.io/featherlight/
 *
 * Copyright 2015, Noël Raoul Bossart (http://www.noelboss.com)
 * MIT Licensed.
**/
@media all {
    .featherlight {
        display: none;
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 2147483647;
        text-align: center;
        white-space: nowrap;
        cursor: pointer;
        background: #333;
        background: transparent;
    }

    .featherlight:last-of-type {
        background: rgba(0, 0, 0, 0.8);
    }

    .featherlight:before {
        content: '';
        display: inline-block;
        height: 100%;
        vertical-align: middle;
        margin-right: -.25em;
    }

    .featherlight .featherlight-content {
        position: relative;
        text-align: left;
        vertical-align: middle;
        display: inline-block;
        overflow: auto;
        padding: 25px 25px 0;
        border-bottom: 25px solid transparent;
        min-width: 30%;
        margin-left: 5%;
        margin-right: 5%;
        max-height: 95%;
        background: #fff;
        cursor: auto;
        white-space: normal;
    }

    .featherlight .featherlight-inner {
        display: block;
    }

    .featherlight .featherlight-close-icon {
        position: absolute;
        z-index: 9999;
        top: 0;
        right: 0;
        line-height: 25px;
        width: 25px;
        cursor: pointer;
        text-align: center;
        font-family: Arial,sans-serif;
        background: #fff;
        background: rgba(255, 255, 255, 0.3);
        color: #000;
    }

    .featherlight .featherlight-image {
        width: 100%;
    }

    .featherlight-iframe .featherlight-content {
        border-bottom: 0;
        padding: 0;
    }

    .featherlight iframe {
        border: 0;
    }
}
@media only screen and (max-width: 1024px) {
    .featherlight .featherlight-content {
        margin-left: 10px;
        margin-right: 10px;
        max-height: 98%;
        padding: 10px 10px 0;
        border-bottom: 10px solid transparent;
    }
}
.toast-title {
    font-weight: 700;
}

.toast-message {
    -ms-word-wrap: break-word;
    word-wrap: break-word;
}

.toast-message a, .toast-message label {
    color: #fff;
}

.toast-message a:hover {
    color: #ccc;
    text-decoration: none;
}

.toast-close-button {
    position: relative;
    right: -.3em;
    top: -.3em;
    float: right;
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    -webkit-text-shadow: 0 1px 0 #fff;
    text-shadow: 0 1px 0 #fff;
    opacity: .8;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
    filter: alpha(opacity=80);
}

.toast-close-button:focus, .toast-close-button:hover {
    color: #000;
    text-decoration: none;
    cursor: pointer;
    opacity: .4;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
    filter: alpha(opacity=40);
}

button.toast-close-button {
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: 0;
    -webkit-appearance: none;
}

.toast-top-center {
    top: 0;
    right: 0;
    width: 100%;
}

.toast-bottom-center {
    bottom: 0;
    right: 0;
    width: 100%;
}

.toast-top-full-width {
    top: 0;
    right: 0;
    width: 100%;
}

.toast-bottom-full-width {
    bottom: 0;
    right: 0;
    width: 100%;
}

.toast-top-left {
    top: 12px;
    left: 12px;
}

.toast-top-right {
    top: 12px;
    right: 12px;
}

.toast-bottom-right {
    right: 12px;
    bottom: 12px;
}

.toast-bottom-left {
    bottom: 12px;
    left: 12px;
}

#toast-container {
    position: fixed;
    z-index: 999999;
    pointer-events: none;
}

#toast-container * {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

#toast-container > div {
    position: relative;
    pointer-events: auto;
    overflow: hidden;
    margin: 0 0 6px;
    padding: 15px 15px 15px 50px;
    width: 300px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    background-position: 15px center;
    background-repeat: no-repeat;
    -moz-box-shadow: 0 0 12px #999;
    -webkit-box-shadow: 0 0 12px #999;
    box-shadow: 0 0 12px #999;
    color: #fff;
    opacity: .8;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
    filter: alpha(opacity=80);
}

#toast-container > :hover {
    -moz-box-shadow: 0 0 12px #000;
    -webkit-box-shadow: 0 0 12px #000;
    box-shadow: 0 0 12px #000;
    opacity: 1;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    filter: alpha(opacity=100);
    cursor: pointer;
}

#toast-container > .toast-info {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=) !important;
}

#toast-container > .toast-error {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=) !important;
}

#toast-container > .toast-success {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==) !important;
}

#toast-container > .toast-warning {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGYSURBVEhL5ZSvTsNQFMbXZGICMYGYmJhAQIJAICYQPAACiSDB8AiICQQJT4CqQEwgJvYASAQCiZiYmJhAIBATCARJy+9rTsldd8sKu1M0+dLb057v6/lbq/2rK0mS/TRNj9cWNAKPYIJII7gIxCcQ51cvqID+GIEX8ASG4B1bK5gIZFeQfoJdEXOfgX4QAQg7kH2A65yQ87lyxb27sggkAzAuFhbbg1K2kgCkB1bVwyIR9m2L7PRPIhDUIXgGtyKw575yz3lTNs6X4JXnjV+LKM/m3MydnTbtOKIjtz6VhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+RWnYhskLBv2vmE+hBMCtbA7KX5drWyRT/2JsqZ2IvfB9Y4bWDNMFbJRFmC9E74SoS0CqulwjkC0+5bpcV1CZ8NMej4pjy0U+doDQsGyo1hzVJttIjhQ7GnBtRFN1UarUlH8F3xict+HY07rEzoUGPlWcjRFRr4/gChZgc3ZL2d8oAAAAASUVORK5CYII=) !important;
}

#toast-container.toast-bottom-center > div, #toast-container.toast-top-center > div {
    width: 300px;
    margin-left: auto;
    margin-right: auto;
}

#toast-container.toast-bottom-full-width > div, #toast-container.toast-top-full-width > div {
    width: 96%;
    margin-left: auto;
    margin-right: auto;
}

.toast {
    background-color: #030303;
}

.toast-success {
    background-color: #51a351;
}

.toast-error {
    background-color: #00427C;
}

.toast-info {
    background-color: #2f96b4;
}

.toast-warning {
    background-color: #f89406;
}

.toast-progress {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 4px;
    background-color: #000;
    opacity: .4;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
    filter: alpha(opacity=40);
}

@media all and (max-width: 240px) {
    #toast-container > div {
        padding: 8px 8px 8px 50px;
        width: 11em;
    }

    #toast-container .toast-close-button {
        right: -.2em;
        top: -.2em;
    }
}
@media all and (min-width: 241px) and (max-width: 480px) {
    #toast-container > div {
        padding: 8px 8px 8px 50px;
        width: 18em;
    }

    #toast-container .toast-close-button {
        right: -.2em;
        top: -.2em;
    }
}
@media all and (min-width: 481px) and (max-width: 768px) {
    #toast-container > div {
        padding: 15px 15px 15px 50px;
        width: 25em;
    }
}