/*==============================================================================
// File:        hyatt-cologne-gflow-style.css
// Package:     Guest Flow
// Synopsis:    Hyatt Cologne Guest Flow Styles
//============================================================================*/

/* Set IE8 background colour */
.ie8 .gflow-widgets-inner.default {
    background: rgb(255, 255, 255)
}
.radiant-language-selector .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #333 transparent transparent transparent
}
.radiant-language-selector .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: transparent transparent #333 transparent
}

@font-face {
    font-family: "Open Sans";
    src: url("../fonts/opensans-regular.eot");
    src: url("../fonts/opensans-regular.eot?#iefix") format("embedded-opentype"),
         url("../fonts/opensans-regular.woff") format("woff"),
         url("../fonts/opensans-regular.ttf") format("truetype"),
         url("../fonts/opensans-regular.svg#opensans-regular") format("svg");
    font-style: normal;
    font-weight: 200
}

body {
    background: #000;
    color: #FFF
}

h1, h2 {
    font-family: "Open Sans", Verdana, Arial, Helvetica, sans-serif;
    text-transform: uppercase;
    text-align: center;
    font-weight: bold;
    margin: 0 0 5px;
    font-size: 22px;
    color: #605f99
}

h2 {
   font-size: 20px
}

h1 {
    padding-bottom: 10px
}

.gflow-wrapper {
    margin: 0 auto
}

.gflow-wrapper-bg {
    background: transparent url(../img/hyatt-cologne-bg.jpg) no-repeat fixed center top;
    background-size: cover;
    position: absolute;
    min-height: 100%;
    width: 100%;
    opacity: 1
}

.hotel-logo {
    background: transparent url(../img/hyatt-regency-logo.png) no-repeat top;
    background-size: 200px;
    margin: 10px auto 20px;
    display: block;
    height: 200px;
    width: 200px
}

/*------------------------------------------------------------------------------
// Hyatt Cologne Overrides
//----------------------------------------------------------------------------*/

.gflow-widgets-inner {
    background: rgba(255, 255, 255, .8);
    padding: 10px 25px 15px;
    margin: 35px auto 30px;
    border-radius: 10px;
    max-width: 715px;
    min-width: 310px
}

.gflow-main-form {
    border: 10px solid #DEDEDE;
    outline: 5px solid #FFF;
    background: #FFF;
    max-width: 100%;
    color: #000
}

.gflow-flavor-text p {
    color: #000
}

.gflow-main-form p.p1 {
    font-family: "Open Sans", Verdana, Arial, Helvetica, sans-serif;
    text-transform: uppercase;
    font-size: 22px;
    color: #605f99
}

.gflow-content .gflow-widgets {
    color: #FFF
}

.gflow-content .gflow-widgets a {
    color: #428BCA
}

.gflow-content .gflow-widgets a:hover,
.gflow-content .gflow-widgets a:focus {
    color: #428BCA
}

.gflow-content .gflow-widgets img.img-responsive {
     margin: 0 auto 15px
}

.gflow-content .welcome-option.clickable {
    float: none;
    width: auto
}

.gflow-main-form button[type="submit"],
.gflow-main-form .welcome-option a,
.gflow-form button[type="submit"],
input.btn-default {
    font-family: "Open Sans", Verdana, Arial, Helvetica, sans-serif;
    background: #605f99;
    border-radius: 0
}

.gflow-main-form button[type="submit"]:hover,
.gflow-main-form button[type="submit"]:focus,
.gflow-main-form .welcome-option a:hover,
.gflow-main-form .welcome-option a:focus,
.gflow-form button[type="submit"]:hover,
.gflow-form button[type="submit"]:focus,
input.btn-default:hover,
input.btn-default:focus {
    text-decoration: none;
    background: #7A79B7;
    outline: none;
    color: #FFF;
    opacity: 1
}

.gflow-main-form .welcome-option a {
    margin: 10px auto 8px
}

.gflow-content .option-descr {
    font-size: 16px
}

.back-to-options * {
    display: none
}

.gflow-content .gflow-main-form p.title {
    font-size: 22px
}

@media screen and (min-width: 100px) and (max-width: 645px) {

    .gflow-main-form {
        margin: 35px 0 30px;
        padding: 15px 5px
    }

} /* End Custom 645px to 100px */

@media screen and (min-width: 421px) and (max-width: 645px) {

    .gflow-main-form p.p1,
    h1 {
        font-size: 20px
    }

    h2 {
        font-size: 18px
    }

    .gflow-main-form button[type="submit"],
    .gflow-main-form .welcome-option a,
    .gflow-form button[type="submit"],
    input.btn-default {
        font-size: 16px
    }

} /* End Custom 645px to 421px */

@media screen and (min-width: 100px) and (max-width: 420px) {

    .gflow-main-form p.p1,
    h1 {
        font-size: 18px
    }

    h2 {
        font-size: 16px
    }

    .hotel-logo {
        background-size: contain;
        width: 100%
    }

    .gflow-main-form button[type="submit"],
    .gflow-main-form .welcome-option a,
    .gflow-form button[type="submit"],
    input.btn-default {
        padding: 7px 5px;
        font-size: 14px
    }

} /* End Custom 420px to 100px */