.flag-container img {
    width: 100%;
}

.flex-grid {
    display        : flex !important;
    justify-content: space-between;
    width          : 100%;
    flex-wrap      : wrap;
    align-items    : center;
    overflow       : hidden;
}

.flex-grid.flex-grid--bottles {
    justify-content: center;
}

.flex-grid-item {
    display   : block;
    transition: border 0.4s;
    border    : 5px solid #efefef;
    cursor    : pointer;
}

.flex-grid-item img {
    width: 100%;
}

.flex-grid--5 .flex-grid-item {
    width: 15%;
}

.flex-grid--bottles .flex-grid-item {
    width: 10.7%;
}

.cycle-pager-active {
    border: 5px solid #666;
}

.input_hidden {
    position: absolute;
    left    : -9999px;
}

.bottle label {
    display      : inline-block;
    cursor       : pointer;
    padding      : 10px 0;
    opacity      : 0.7;
    transition   : opacity 0.3s;
    border-bottom: 3px solid #efefef;
}

.bottle label.selected {
    opacity      : 1;
    border-bottom: 3px solid #666;
}

.hide_span {
    display   : block;
    min-height: 50px;
}

.bottle label:hover {
    opacity: 1;
}

.perfect-blend {
    margin: 0 0 40px;
}

.perfect-blend h1 {
    font-size  : 60px;
    line-height: 65px;
    margin     : 0;
    padding    : 40px 0 30px;
    color      : #000;
    text-align : center;
    font-weight: 600;
    font-family: sans-serif;
}

.perfect-blend h2 {
    font-size  : 50px;
    text-align : center;
    padding    : 0;
    margin     : 0 0 20px;
    line-height: 26px;
    color      : #C2A765;
    font-weight: 600;
}

.perfect-blend h3 {
    font-size  : 26px;
    text-align : center;
    padding    : 0;
    margin     : 30px 0 20px;
    line-height: 26px;
}

.perfect-blend h4 {
    font-size  : 22px;
    text-align : center;
    padding    : 0;
    margin     : 0 0 10px;
    line-height: 26px;
    font-family: "bodoni-urw";
}

.perfect-blend p {
    font-size  : 22px;
    line-height: 24px;
    text-align : center;
    padding    : 0 0 20px;
    margin     : 0;
}

.perfect-blend ul {
    margin: 0;
}
.perfect-blend ul.works_li{
	margin: 0 auto;
	display:inline-block;
}
.perfect-blend ul li {
    font-size  : 22px;
    line-height: 24px;
    text-align : left;
    padding    : 0;
    margin     : 0;
}

.perfect-blend a {
    text-decoration: none;
}

.perfect-blend a .enter-button {
    background-color: #000;
    width           : 200px;
    text-align      : center;
    text-transform  : uppercase;
    padding         : 20px 30px;
    color           : #C2A765;
    font-family     : "bodoni-urw";
    font-size       : 22px;
    font-weight     : bold;
    margin-top      : 20px;
}

.perfect-blend a .enter-button:hover {
    color: #fff;
}
.main-Title.gold_text{
    color: #c2a765;
}
.perfect-blend.centered {
    text-align: center;
}

.ingredient {
    margin: 20px 0;
}

.ingredient h4 {
    color    : #000;
    font-size: 24px;
}

.ingredient .competitionForm input[type="text"] {
    float       : left;
    width       : 47.5%;
    margin-right: 5%;
    padding     : 8px 2%;
    text-align  : left;
}

.ingredient .competitionForm input[type="text"]:nth-child(2n) {
    margin-right: 0;
}

.competitionForm h4 {
    margin: 30px 0;
}

.click-text {
    text-align    : center;
    font-size     : 12px;
    padding       : 0;
    color         : #000;
    margin        : 0 auto 20px;
    text-transform: uppercase;
}

textarea {
    width           : 100%;
    height          : 200px;
    max-height      : 200px;
    font-family     : "ff-good-headline-web-pro-con";
    padding         : 20px;
    font-size       : 22px;
    line-height     : 24px;
    color           : rgba(0, 0, 0, 0.5) !important;
    margin          : 10px 0;
    border          : 0;
    background-color: rgba(255, 255, 255, 0.8);
}

.blend-container {
    width          : 100%;
    display        : flex;
    justify-content: center;
}

.blend-box {
    background-color: #51C4D9;
    padding         : 20px 30px;
    color           : #000;
    font-size       : 22px;
    line-height     : 24px;
    text-align      : center;
    margin          : 0 auto 20px;
    float           : left;
    font-family     : "ff-good-headline-web-pro-con";
    box-shadow      : 0 0 20px rgba(0, 0, 0, 0.1);
}

.blend-box p {
    text-align : center;
    padding    : 0;
    font-size  : 22px;
    line-height: 24px;
}

.blend-box.grey {
    background-color: #a3a3a3;
    color           : #000;
    width           : 100%;
    margin-top      : 30px;
}

.blend-box.grey h3 {
    color     : #000;
    margin-top: 0;
    font-size : 36px;
}

.blend-box.gold {
    background-color: #C2A765;
    color           : #000;
    margin          : 0;
}

.blend-box.gold h3 {
    color     : #000;
    margin-top: 0;
    font-size : 36px;
}

.gold-border {
    border : solid #C2A765 2px;
    padding: 7px;
    margin : 20px auto 10px;
}

.celebrate {
    font-size     : 36px;
    line-height   : 38px;
    margin        : 0;
    padding       : 0 0 20px;
    color         : #000;
    text-align    : center;
    font-weight   : 600;
    text-transform: uppercase;
}

.enter-as {
    font-size  : 18px;
    font-family: "ff-good-headline-web-pro-con";
}

.banner-image {
    height             : 400px;
    display            : flex !important;
    justify-content    : center;
    align-items        : center;
    background-position: bottom;
    background-size    : cover;
    flex-direction     : column;
    max-width          : 2000px;
}

.banner-image--perfect-blend-main {
    background-image: url("../img/banners/The_blend_2018_Web_header.jpg");
}

.banner-image--perfect-blend {
    background-image: url("../img/banners/The_blend_2018_Web_header-2.jpg");
}

#clickme2 {
    text-align      : center;
    font-size       : 12px;
    background-color: #000;
    color           : #C2A765;
    padding         : 10px;
    width           : 250px;
    margin          : 0 auto 20px;
    text-transform  : uppercase;
}

#flags {
    display: none;
    width  : 100%;
}

#bottles {
    display: none;
    width  : 100%;
}

.competitionForm select {
    float       : left;
    width       : 49%;
    margin-right: 2%;
    padding     : 8px 0;
    text-align  : left;
}

.competitionForm select:nth-child(2n) {
    margin-right: 0;
}

.competitionForm p {
    margin     : 0 0 10px;
    padding    : 0;
    font-family: "ff-good-headline-web-pro-con";
    font-size  : 22px;
    line-height: 24px;
    text-align : center;
}

.competitionForm input[type="submit"] {
    background-color: #000;
    width           : 200px;
    text-transform  : uppercase;
    padding         : 20px 30px;
    color           : #C2A765;
    display         : flex;
    align-self      : center;
    text-align      : center;
    justify-content : center;
    font-family     : "bodoni-urw";
    font-size       : 22px;
    opacity         : 1;
}

.competitionForm input[type="submit"]:hover {
    color: #fff;
}

.competitionForm input[type="text"].full-text-field {
    width: 100%;
}

.competitionForm input[type="checkbox"] {
    width     : 2%;
    float     : left;
    height    : 25px;
    margin-top: 0;
}

.competitionForm input[type="radio"] {
    margin: 0 0 4px 2px;
}

.competitionForm label {
    font-family: "ff-good-headline-web-pro-con";
    font-size  : 18px;
    margin-top : 5px;
    display    : block;
    cursor     : pointer;
}

.competitionList p {
    font-size  : 22px;
    line-height: 24px;
}

.competitionForm ul li {
    font-size  : 22px;
    line-height: 24px;
    align-self : center;
}

.competitionForm p {
    margin     : 0 0 10px;
    padding    : 0;
    font-family: "ff-good-headline-web-pro-con";
    font-size  : 22px;
    line-height: 24px;
    text-align : center;
}

.checkbox-text {
    color      : rgba(0, 0, 0, 0.5) !important;
    font-family: "ff-good-headline-web-pro-con";
    font-size  : 22px;
    line-height: 22px;
    width      : 97%;
    float      : left;
    text-align : left;
}

.checkbox-text a {
    color          : rgba(0, 0, 0, 0.5) !important;
    text-decoration: underline;
}

.cycle-slideshow div.bottle-group {
    min-height: inherit;
}

.form_field {
    float        : left;
    margin-right : 5%;
    padding      : 0;
    text-align   : left;
    width        : 47.5%;
    margin-bottom: 20px;
}

.form_field:nth-child(2n) {
    margin-right: 0;
}

.form_field.full_width {
    width: 100%;
}

.form_field input[type="text"] {
    float     : none;
    margin    : 0;
    padding   : 8px 15px;
    text-align: left;
    width     : 100%;
    min-height: 46px;
}

.form_field select {
    width      : 100%;
    margin     : 0;
    padding    : 8px 10px;
    text-indent: 3px;
}

.form_field label {
    display: inline-block;
}

.form_field.double_field input {
    margin-top: 20px;
}
.form_field select.error {
    margin-bottom: 5px;
}
.form_field span.error {
    color       : #DE4B45;
    cursor      : auto;
    padding-left: 15px;
    display     : block;
    font-size   : 14px;
    margin-top  : 5px;
    clear: both;
}

.form_field optgroup {
    font-size: 22px!important;
}

.form_field.checkbox_wrap,
.form_field.radio_btn_wrap {
    position      : relative;
    padding-bottom: 30px;
}

.form_field.checkbox_wrap {
    margin-bottom: 0;
}

.form_field.checkbox_wrap span.error,
.form_field.radio_btn_wrap span.error {
    position: absolute;
    bottom  : 12px;
}

.form_field.checkbox_wrap span.error {
    padding-left: 22px;
}

.checkbox_wrap input[type="checkbox"] {
    width       : auto;
    margin-right: 10px;
}
/* Terms and condition */
.terms-and-conditions {
    margin-bottom: 50px;
}

.terms-and-conditions h1 {
    font-size  : 60px;
    line-height: 65px;
    margin     : 0;
    padding    : 40px 0 30px;
    color      : #000;
    text-align : center;
    font-weight: 600;
    font-family: sans-serif;
}

.terms-and-conditions ol li {
    font-size    : 24px;
    margin-bottom: 5px;
    margin-top   : 20px;
    font-family  : "ff-good-headline-web-pro-con";
}

.terms-and-conditions ol p {
    font-size    : 20px;
    font-family  : "ff-good-headline-web-pro-con";
    margin-bottom: 10px;
    padding      : 0;
    text-align   : left;
    margin-left  : 20px;
}

.terms-and-conditions ul li {
    font-size    : 20px;
    margin-bottom: 5px;
    font-family  : "ff-good-headline-web-pro-con";
    margin-top   : 0;
}
/* Terms and condition */
.flex-grid-item label {
    margin-top: 0;
}

.bottle_section {
    width: 100%;
}

.navy {
    color: #18254f;
}

.custom_flag_container {
    position   : relative;
    padding-top: 30px;
}

.custom_flag_container #region-error {
    position: absolute;
    left    : 45%;
    top     : 0;
    color   : #de4b45;
}
/* ------------ */
@media only screen and (max-width: 1000px) {
    .perfect-blend h1 {
        font-size  : 50px;
        line-height: 52px;
    }
}
@media only screen and (max-width: 940px) {
    .hide_span {
        display: none;
    }

    .bottle-group {
        min-height: 200px;
    }
}
@media only screen and (max-width: 800px) {
    .perfect-blend h1 {
        font-size  : 40px;
        line-height: 42px;
    }

    .celebrate {
        font-size: 24px;
    }
}
@media only screen and (max-width: 700px) {
    .flex-grid-item {
        display   : block;
        transition: border 0.4s;
        border    : 5px solid #efefef;
        cursor    : pointer;
    }

    .flex-grid-item img {
        width: 100%;
    }

    .flex-grid--5 .flex-grid-item {
        width: 20%;
    }

    .flex-grid--bottles .flex-grid-item {
        width: 25%;
    }

    .bottle-group {
        min-height: 100px;
    }
}
@media only screen and (max-width: 600px) {
    .perfect-blend h1 {
        font-size  : 36px;
        line-height: 38px;
    }
}
@media only screen and (max-width: 500px) {
    input[type="password"],
    input[type="text"] {
        font-size: 16px;
    }
}
