@font-face {
    font-family: 'Netto Regular';
    src: url('../bundles/app/fonts/NettoOT.eot');
    src: url('../bundles/app/fonts/NettoOT.eot?#iefix') format('embedded-opentype'),
    url('../bundles/app/fonts/NettoOT.woff') format('woff'),
    url('../bundles/app/fonts/NettoOT.ttf') format('truetype'),
    url('../bundles/app/fonts/NettoOT.svg') format('svg');
}

@font-face {
    font-family: 'Netto Bold';
    src: url('../bundles/app/fonts/NettoOT-Bold.eot');
    src: url('../bundles/app/fonts/NettoOT-Bold.eot?#iefix') format('embedded-opentype'),
    url('../bundles/app/fonts/NettoOT-Bold.woff') format('woff'),
    url('../bundles/app/fonts/NettoOT-Bold.ttf') format('truetype'),
    url('../bundles/app/fonts/NettoOT-Bold.svg') format('svg');
}

@font-face {
    font-family: 'icomoon';
    src:  url('../bundles/app/fonts/icomoon.eot?s8f2zw');
    src:  url('../bundles/app/fonts/icomoon.eot?s8f2zw#iefix') format('embedded-opentype'),
    url('../bundles/app/fonts/icomoon.ttf?s8f2zw') format('truetype'),
    url('../bundles/app/fonts/icomoon.woff?s8f2zw') format('woff'),
    url('../bundles/app/fonts/icomoon.svg?s8f2zw#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}


html,body{
    height: 100%;
    line-height: 1.4;
    font-family: 'Netto Regular';
    font-size: 16px;
    background: #fff;
    color: #666;
}

a {
    color: #1887ad;
}

h1, h2, h3, h4, h5, h6{
    margin-top: 20px;
    margin-bottom: 10px;
    font-family: 'Netto Bold';
    color: #333;
}

strong,b{
    font-family: 'Netto Bold';
}

p{
    margin-top: 0px;
    margin-bottom: 20px;
}

.lead{
    font-size: 200%;
    margin-bottom: 30px;
}

.dark .lead {
    color: #999;
}

.larger{
    font-size: 150%;
}

h1{ font-size: 400%; }
h2{ font-size: 360%; }
h3{ font-size: 320%; }
h4{ font-size: 280%; }
h5{ font-size: 240%; }
h6{ font-size: 200%; }

input[type="text"],
input[type="number"],
input[type="email"],
input[type="tel"],
textarea,
select{
    display: inline-block;
    height: 41px;
    padding: 7px 10px;
    font-size: 18px;
    line-height: 1.4;
    color: #323232;
    vertical-align: middle;
    background-color: #fff;
    border: 1px solid #d9d9d9;
    border-radius: 5px;
    font-weight: 300;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

input[type="text"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
textarea,
select:focus{
    border-color: #333;
    outline: 0;
}

form{
    display: block;
}

@media screen and (max-width: 767px) {

    h1, h2, h3, h4, h5, h6{
        margin-top: 10px;
        margin-bottom: 5px;
    }

    h1{ font-size: 200%; }
    h2{ font-size: 180%; }
    h3{ font-size: 160%; }
    h4{ font-size: 140%; }
    h5{ font-size: 120%; }
    h6{ font-size: 100%; }

    .lead{
        font-size: 120%;
        margin-bottom: 15px;
    }

    .larger{
        font-size: 120%;
    }

    input[type="text"],
    input[type="number"],
    input[type="email"],
    input[type="tel"],
    textarea,

    select{
        display: block;
        margin-bottom: 20px;
        width: 100%;
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
    }

    .btn-icon{
        width: 100%;
        margin-bottom: 20px;
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
    }

}

dl{
    margin-top: 5px;
    margin-bottom: 15px;
}

dt{
    display: inline;
    margin: 0px;
    padding: 0px;
    padding-right: 5px;
    color: #333;
    font-family: 'Netto Bold';
}

dd{
    display: inline;
    margin: 0px;
    padding: 0px;
}

abbr{
    color: #333;
    font-family: 'Netto Bold';
}

.cf:before,
.cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.cf:after {
    clear: both;
}

.cf {
    *zoom: 1;
}

.spaced-bottom{
    margin-bottom: 30px;
}

ul.keg-bulleted {
    text-align:left;
    list-style: none;
}

ul.keg-bulleted li {
    background: url('../img/star-white-on-tp-small.png') no-repeat left 4px;
    background-size: 20px 20px;
    padding-left:25px;
    line-height: 2em;
}


/* Navigation
   ========================================================================== */

.menu-link,
.menu-icon {
    position: fixed;
    top: 40px;
    right: 40px;
    width: 40px;
    padding: 5px 0;
    z-index: 100;
    cursor: pointer;
}

.menu-icon {
    border: 0 solid #fff;
    border-width: 5px 0;
    -webkit-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
    -o-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
}

.menu-link .back-link {
    color: white;
    font-size: 1.3em;
    font-weight: bold;
}



.menu-icon.white-bg
{
    border-color: green;
}

.menu-icon-active.white-bg {
    border-color:transparent;
}

.menu-icon.white-bg:before {
    background: green;
}

.menu-icon-active.white-bg:after {
    background: green;
    border-color: green;
}

.menu-icon:before {
    content: "";
    display: block;
    height: 5px;
    background: #fff;
}

.menu-icon:after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    height: 40px;
    width: 5px;
    margin-left: -2.5px;
    margin-top: -20px;
    background: #fff;
    background: rgba(255,255,255,0);
}


.menu-icon-active{
    transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    -webkit-transform:rotate(45deg);
    border-color: transparent;
}

.menu-icon-active:after {
    background: rgba(255,255,255,1);
}

.main-navigation{
    position: fixed;
    z-index: 99;
    top: 0px;
    right: 0px;
    bottom: 0px;
    overflow: auto;
    padding: 40px;
    background: #333;
    margin-right: -100%;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

.main-navigation-active{
    margin-right: 0%;
}

.main-navigation .links{
    display: block;
    margin-top: 70px;
    text-align: right;
}

.main-navigation .links .nav-link{
    display: block;
    color: #fff;
    text-decoration: none;
    font-size: 24px;
    padding: 10px 0;
}

@media screen and (max-width: 767px) {

    .menu-icon {
        top: 20px;
        right: 20px;
    }

    .menu-link .back-link {
        color: black;
    }

    .main-navigation{
        padding: 20px;
    }

}

/* Buttons
   ========================================================================== */

.btn{
    display: inline-block;
    padding: 10px 20px;
    /*border: solid 2px #000;*/
    text-decoration: none;
    color: #fff;
    border-radius: 5px;
    background: #1887ad;
}

.white-bg .btn,
.green-bg .btn {
    background-color: green;
}

.white-bg .btn:hover,
.green-bg .btn:hover {
    background-color: darkgreen;
}

.btn:hover{
    background: #0f536a;
}

.btn-form{
    padding: 15px 20px;
}

.btn-lg{
    padding: 20px 40px;
    font-size: 24px;
}

.icon-sc{
    height: 24px;
    width: 24px;
    vertical-align: middle;
}

.btn .icon{
    font-size: 24px;
    position: relative;
    top: 6px;
    line-height: 0;
}

/* Pages
   ========================================================================== */

.page{
    min-height: 100%;
    width: 100%;
    overflow: hidden;
    display: table;
    vertical-align: middle;
    background: #f2f2f2;
    position:relative;
}

.page .page-content{
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    padding: 30px;
}

.welcome{
    height: 100%;
    width: 100%;
    background: #000;
    color: #fff;
}

.page.dark {
    background: #000;
    color: #fff;
}

.page.dark h1,
.page.dark h2,
.page.dark h3,
.page.dark h4,
.page.dark h5,
.page.dark h6{
    color: #fff;
}

.page.white h1,
.page.white h2,
.page.white h3,
.page.white h4,
.page.white h5,
.page.white h6,
.page.white p,
.page.white legend,
.page.white span,
.page.white li
{
    color: #fff;
}

.page.white-bg {
    background: #fff;
}

.page.green-bg {
    background: #64c438;
}

.page.green{
    color: #64c438;
}

h2#keglease-header {
    color: #64c438;
}

.green h1,
.green h2,
.green h3,
.green h4,
.green h5,
.green h6,
.green p {
    color: #64c438;
}

.black h1,
.black h2,
.black h3,
.black h4,
.black h5,
.black h6,
.black p {
    color: black;
}

.page-content .two-col {
    width:40%;
    float: left;
    margin:2%;
    padding:2%;
}

.page-content p.large-text {
    font-size: 1.3em;
}

.page.half-width {
    width:50%;
    float:left;
}

.page.half-width .two-col {
    width:100%;
}

@media screen and (max-width: 767px) {
    .page-content .two-col {
        width:80%;
    }

    .page.half-width {
        width:100%;
    }

    .welcome.mid-height-xs {
        height:50%;
    }

    .page.mid-height-xs {
        min-height:50%;
    }
}

.page-content .large-column {
    width: 100%;
    clear: both;
}

.welcome .page-content .main-logo {
    width: 50%;
    max-width: 240px;
    height: auto;
    margin-bottom: 30px;
}

.welcome .page-content h2{
    margin-bottom: 40px;
    font-weight: normal;
}

.welcome .regions {
    text-align: center;
}

.welcome .regions a {
    color: #fff;
    text-decoration: none;
    display: inline-block;
    width: 200px;
}

.welcome .regions a img {
    height: 170px;
}

.welcome .regions a img:hover {
    opacity: 0.8;
}

.welcome .regions a span {
    font-size: 30px;
    display: block;
}

#privacy .page-body {
    text-align: justify;
    max-height: 70vh;
    overflow: auto;
    padding: 0 20px;
    margin-bottom: 10vh;
}

#privacy .page-body h5 {
    font-size: 22px;
    margin: 10px 0;
}

#privacy .page-body p {
    margin-bottom: 10px;
}
div a.enquire-privacy-link {
    font-size: 18px;
    font-weight: bold;
    color: #666;
    float: right;
}
.dark div a.enquire-privacy-link {
    font-size: 18px;
    font-weight: bold;
    color: #fff;
    float: right;
}

.locations {
    width: 70%;
    margin: 0 auto;
}

.locations .location {
    display: inline-block;
    width: 47%;
    margin: 0 1%;
}

.locations .location h3 {
    font-size: 20px;
}

.locations .location .map {
    width: 100%;
    height: 300px;
}

.locations .location .address {
    margin-top: 20px;
}

@media screen and (max-width: 767px) {
    .welcome .regions a {
        display: block;
        width: 100%;
        margin-bottom: 10px;
    }

    .welcome .regions a img {
        height: 113px;
    }

    .welcome .regions a span {
        font-size: 30px;
        display: block;
    }

    .locations {
        width: 90%;
        margin: 0 auto;
    }

    .locations .location {
        display: block;
        width: 100%;
        margin: 0;
    }
}

.video{
    background: url('../img/kegs-bg.png') center center no-repeat;
    background-size: cover;
}

.video .vid-container{
    width: 100%;
    max-width: 767px;
    margin: 0 auto 30px;
}

.video .video-subtitle {
    margin-top: 10px;
    font-size: 13px;
}

.pricing {
    background: #000;
    color: #fff;
}

.pricing h1,
.pricing h2,
.pricing h3,
.pricing h4,
.pricing h5,
.pricing h6{
    color: #fff;
}

.pricing .pricing-details {
    margin-bottom: 60px;
}

.pricing .pricing-details .fees-note {
    font-size: 14px;
}

.pricing .pricing-details .fee {
    display: inline-block;
    width: 170px;
    margin-left: 10px;
    margin-right: 10px;
    vertical-align: top;
}

.pricing .pricing-details .fee.fee-slow {
    display: inline-block;
    width: 200px;
}

.pricing .pricing-details .fee.fee-sticker strong {
    display: block;
}

.pricing .pricing-details .main-fees {
    margin-top: 60px;
    margin-bottom: 60px;
}

.pricing .pricing-details .other-fees {
    margin-bottom: 40px;
}

.pricing .pricing-details .fee img {
    height: 100px;
}

.pricing .pricing-details .fee span {
    font-size: 20px;
    display: block;
}

.pricing .pricing-details .main-fees .fee span {
    font-size: 30px;
    display: block;
}

.pricing .pricing-details .main-fees .fee {
    display: inline-block;
    width: 300px;
}

.pricing .pricing-details .main-fees img {
    height: 200px;
}

.pricing .pricing-table {
    width: 80%;
    max-width: 800px;
    margin:auto auto 2em auto;
    padding:auto;

}

.pricing .pricing-table th {
    font-weight: bold;
    font-size: 1.1em;
}

.pricing .pricing-table td {
    font-weight: 300;
    font-size: 1.3em;
}

@media screen and (max-width: 767px) {
    .pricing .pricing-details .main-fees {
        margin: 0;
    }

    .pricing .pricing-details .fee {
        width: 100%;
        margin: 0 0 20px 0;
    }

    .pricing .pricing-details .fee img {
        width: 100px;
        height: 100px;
    }

    .pricing .pricing-details .fee.fee-slow img {
        width: auto;
    }

    .pricing .pricing-table {
        width: 100%;
    }
}

.collection-content {
    margin-bottom: 20px;
}
.video .collection-content .vid-container {
    margin: 0;
    border: 1px solid #666;
    display: inline-block;
    vertical-align: top;
    margin-top: 25px;
}
.collection-options {
    width: 155px;
    display: inline-block;
    margin-right: 30px;
}
.collection-options .icon-container {
    width: 90px;
    height: 90px;
    font-size: 88px;
    margin-bottom: 15px;
    background: #1887AD;
}
.collection-options .icon-container img {
    width: 60px;
}

.plane-page{
    overflow: hidden;
}

.page .click-behind{
    position: relative;
    pointer-events: none;
    overflow: hidden;
}

.plane-spacer{
    position: relative;
    height: 20.285714285714285vw;
    margin-top: 184px;
    margin-bottom: 184px;
}

.plane-spacer .click-behind-heading{
    position: absolute;
    width: 100%;
    bottom: calc(100% - 10px);
    pointer-events: auto;
}

.plane-spacer .click-behind-button{
    position: absolute;
    width: 100%;
    top: calc(100% + 30px);
    pointer-events: auto;
}

.app-links img {
    vertical-align: top;
}
.play-store img {
    width: 300px;
}
.app-store img {
    margin-top: 19px;
    width: 264px;
}

.white{
    background: #fff;
    color: #666;
}

.icons-container{
    margin-bottom: 30px;
    padding-top: 30px;
}

.icons{
    max-width: 1368px;
    margin: 0 auto;
    padding-bottom: 30px;
    position: relative;
}

.icons:before{
    content: "";
    position: absolute;
    top: 0px;
    left: 20px;
    right: 18px;
    height: 133px;
    border: solid 5px #fff;
}

.icons:after{
    content: "";
    position: absolute;
    top: -7.5px;
    left: 50%;
    margin-left: -15px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 30px 10px 0;
    border-color: transparent #ffffff transparent transparent;
}

.process-step{
    float: left;
    width: 16%;
    padding: 80px 2% 0;
    position: relative;
}

.two-columns .process-step {
    width: 29%;
}

.resp-benefit-container{
    float: left;
    min-width:30%;
    max-width:35%;
    margin: 0 4%;
    padding: 5%;
    position: relative;
    border-top: 1px solid #64c438;
}

.resp-benefit-container p {
    max-width:300px;
    margin:auto;
    font-size:1.1em;
}

.resp-benefit-container h6 {
    font-size:1.5em;
    /*max-width:50%;*/
}

@media screen and (max-width: 1000px) {
    .resp-benefit-container {
        min-width: 80%;
    }
}

img.benefit-image {
    width: 200px;
}

img.benefit-image.vertical {
    height: 250px;
    width: 300px;
}

img.notice-image {
    width: 300px;
}

.two-col .logo-image {
    height:400px;
}

.process-step .arrow{
    position: absolute;
    top: 0px;
    left: 50%;
    height: 40px;
    width: 50%;
    border-top: solid 5px #fff;
    border-left: solid 5px #fff;
}

.process-step .arrow:after{
    position: absolute;
    content: "";
    bottom: 0px;
    left: 0px;
    margin-left: -13px;
    margin-bottom: -15px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 30px 10px 0 10px;
    border-color: #ffffff transparent transparent transparent;
}

.process-step:before{
    content: "";
    position: absolute;
    top: 140px;
    margin-top: -2.5px;
    height: 5px;
    background: #fff;
    width: 100%;
    z-index: 1;
    left: 0px;
}

.process-step:after{
    position: absolute;
    right: -20px;
    top: 130px;
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 0 10px 30px;
    border-color: transparent transparent transparent #fff;
    z-index: 11;
}

.process-step:first-child{
    background: #000;
}

.light .process-step:first-child {
    background: #f2f2f2;
}

.process-step:first-child:before{
    left: 50%;
    width: 50%;
}

.process-step:last-child:before{
    width: 50%;
}

.process-step:last-child:after{
    top: 50px;
    right: 10px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 10px 30px 10px;
    border-color: transparent transparent #ffffff transparent;
}

.no-arrow .process-step{
    padding-top: 20px;
}

.no-arrow:before,
.no-arrow:after,
.no-arrow .process-step:before,
.no-arrow .process-step:after{
    display: none;
}

.icon-container{
    display: inline-block;
    padding: 10px;
    font-size: 100px;
    height: 100px;
    width: 100px;
    line-height: 1;
    background: #fff;
    border-radius: 100%;
    color: #000;
    margin-bottom: 30px;
    position: relative;
    z-index: 10;
}

.icon-container img{
    height: 100px;
    width: 100px;
}

.no-arrow .icon-container{
    padding: 0px;
    height: 120px;
    width: 120px;
    font-size: 120px;
    background: none;
    color: #ffffff;
}

.light .no-arrow .icon-container {
    color: #000000;
}

.info{
    background: url(../img/specs.jpg) center center;
    background-size: cover;
}
.info-uk{
    background: url(../img/keg-euro-bg.jpg) center center;
    background-size: cover;
}
.scanning {
    background: url(../img/kegstar-scanning-bg.jpg) center center;
    background-size: cover;
}

.kegs{
    width: 100%;
    max-width: 1280px;
    margin: 30px auto;
    text-align: left;
    overflow: auto;
}

.kegs .keg-info{
    float: left;
    padding-right: 2%;
}
.kegs4 .keg-info {
    width: 23%;
}
.kegs3 .keg-info {
    width: 31%;
}
.kegs2 .keg-info {
    width: 48%;
}

.keg-info-content{
    padding-left: 45%;
}

.kegs .keg-info .keg-img{
    width: 45%;
    float: left;
}

.bottom-section{
    margin-bottom: 60px;
}

.bottom-section a{
    color: #1887ad;
    text-decoration: none;
}

.social a {
    font-size: 64px;
}

.content-container{
    width: 100%;
    max-width: 1280px;
    margin: 0 auto 30px;
    text-align: left;
}

.float-list{
    float: left;
    width: 47%;
    padding-right: 3%;
}

.empty-keg{
    background: url('../img/kegs-bg.png') center center no-repeat;
    background-size: cover;
}

.form-row-2,
.form-row-3{
    margin-bottom: 20px;
}

.form-row-2 input[type="text"]{
    width: 302px;

}

.form-row-3 input[type="text"],
.form-row-3 select{

    width: 225px;
}

.form-row-3 input[type="number"]{
    width: 150px;

}
#contact-form-success {
    display: none;
    font-size: 200%;
    font-size: 20px;
}

#contact-form-error {
    display: none;
    color: #cc0000;
    font-size: 20px;
    margin-bottom: 20px;
}

@media screen and (max-width: 1367px) {

    .empty-keg .empty-text{
        font-size: 55px;
    }

    .empty-keg .page-content{
        border-top: solid transparent 120px;
        border-bottom: solid transparent 120px;
    }

}

@media screen and (max-width: 1000px) {

    .icon-container{
        -webkit-transform: scale(0.7);
    }

    .empty-keg .empty-text{
        font-size: 35px;
    }

    .empty-keg .page-content{
        border-top: solid transparent 100px;
        border-bottom: solid transparent 100px;
    }

}

@media screen and (max-width: 767px) {

    .kegs{
        text-align: center;
    }

    .kegs .keg-info .keg-img{
        width: 100%;
        max-width: 200px;
        margin-right: 0px;
        float: none;
    }

    .keg-info-content{
        padding-left: 0px;
    }

    .two-columns .process-step,
    .process-step {
        float: none;
        width: auto;
        padding: 0 0 30px;
    }

    .process-step .arrow{
        display: none;
    }

    .process-step:after,
    .process-step:before,
    .icons:before,
    .icons:after{
        display: none;
    }

    .icon-container{
        -webkit-transform: scale(1);
    }

    .kegs .keg-info{
        float: none;
        width: auto;
        overflow: auto;
        margin-bottom: 30px;
        padding-right: 0%;
    }

    .float-list{
        float: none;
        width: auto;
        padding-right: 0px;
    }

    .empty-keg .empty-text{
        font-size: 30px;
    }

    .form-row-2,
    .form-row-3{
        margin-bottom: 0px;
    }

    .form-row-2 input[type="text"]{
        width: 100%;

    }

    .form-row-3 input[type="text"],
    .form-row-3 select{

        width: 100%;
    }

    .form-row-3 input[type="number"]{
        width: 100%;

    }

}

@media screen and (max-width: 539px) {

    .empty-keg .empty-text{
        font-size: 18px;
    }

    .empty-keg .page-content{
        border-top: solid transparent 70px;
        border-bottom: solid transparent 70px;
    }

}

.interested{
    text-align: left;
    max-width: 1200px;
    margin: 0 auto;
}

.interested fieldset{
    margin: 0px;
    padding: 0px;
    border: none;
}

.interested .input{
    width: 100%;
    margin-bottom: 20px;
}

.interested .your-message{
    height: 120px;
}

.interested .help-text{
    display: block;
    margin: -10px 0 20px;
}

@media screen and (min-width: 1000px) {

    .interested{
        text-align: center;
    }

    .interested fieldset{
        display: inline-block;
        vertical-align: top;
        width: 47%;
        margin: 0 1%;
    }

    .interested .your-message{
        height: 285px;
    }

}

.enquire {
    text-align: center;
    max-width: 1200px;
    margin: 0 auto;

    box-sizing: border-box;

}

.enquire * {
    box-sizing: border-box;
}

.enquire > div.fields {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;

    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;

    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-content: space-between;
    align-content: space-between;

    -webkit-box-align: start;
    -moz-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;

    justify-content: flex-start;

}

.enquire fieldset {
    margin: 0;
    padding: 0;
    border: none;
    text-align: left;

    vertical-align: top;
    width: 100%;

}

.enquire fieldset > * {
    font-size: 0;
}

.enquire fieldset > select,
.enquire fieldset > textarea,
.enquire fieldset > .input {
    font-size: 18px;
}

.enquire .input {
    width: 100%;
    margin-bottom: 20px;
}

.enquire .your-message {
    height: 250px;
}

.enquire .help-text {
    display: block;
    margin: -10px 0 20px;
}

.enquire .f_name {
    order: 10;
}

.enquire .l_name {
    order: 11;
}

.enquire .f_email {
    order: 12;
}

.enquire .f_number {
    order: 13;
}

.enquire .f_enquire {
    order: 14;
}

.enquire .f_brewer {
    order: 15;
}

.enquire .f_fills {
    order: 21;
}

.enquire .f_international {
    order: 22;
}

.enquire .f_containers {
    order: 23;
}

.enquire .f_solution {
    order: 24;
}

.enquire .f_message {
    order: 25;
}

@media screen and (min-width: 1000px) {

    .enquire .f_name {
        order: 10;
    }

    .enquire .f_email {
        order: 11;
    }

    .enquire .f_number {
        order: 12;
    }

    .enquire .f_fills {
        order: 21;
    }

    .enquire .f_brewer {
        order: 9;
    }

    .enquire .f_international {
        order: 22;
    }

    .enquire .f_enquire {
        order: 13;
    }

    .enquire .f_solution {
        order: 24;
    }

    .enquire .f_containers {
        order: 23;
    }

    .enquire .f_message {
        order: 25;
    }

    .enquire > div.fields {
        height: 550px;
    }

    .enquire fieldset {
        width: 47%;
    }

}

@media screen and (min-width: 1119px) {
    .enquire > div.fields {
        height: 600px;
    }
}

.enquire fieldset > label,
.enquire fieldset > div {
    display: inline-block;
    margin-right: 15px;
    margin-bottom: 10px;
}

.dark .enquire fieldset > legend {
    color: #fff;
}
.enquire fieldset > legend {
    color: #323232;
    font-size: 18px;
    font-weight: 300;
    padding-left: 3px;
    padding-bottom: 3px;
}

.enquire label > input[type="checkbox"] + span {
    display: inline-block;
    height: 41px;
    padding: 7px 10px;
    font-size: 18px;
    line-height: 1.4;
    color: #323232;
    vertical-align: middle;
    background-color: #fff;
    border: 1px solid #d9d9d9;
    border-radius: 5px;
    font-weight: 300;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -webkit-transition: background-color ease-in-out .15s, border-color ease-in-out .15s;
    transition: background-color ease-in-out .15s, border-color ease-in-out .15s;
    cursor: pointer;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.enquire .dynamic-autosize {
    position: relative;
    height: 41px;
    min-width: 90px;
}

.enquire .dynamic-autosize > input.input {
    margin: auto;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    padding-right: 0;
    -webkit-transition: background-color ease-in-out .15s, border-color ease-in-out .15s;
    transition: background-color ease-in-out .15s, border-color ease-in-out .15s;
}

.enquire label > input[type="checkbox"] {
    opacity: 0;
    width: 0;
    height: 0;
    padding: 0;
    margin: 0;
}

.enquire label > input[type="checkbox"]:checked + span,
.enquire input.checked {
    color: #fff;
    background-color: #1887ad;
    border-color: #1887ad;
}

label > input[type="checkbox"]:focus + span {
    border-color: #333;
}

.enquire .dynamic-autosize-shadow {
    padding: 0;
    margin: 0;
    visibility: hidden;
    font-size: 18px;
    font-weight: 300;
    white-space: nowrap;
    height: 1px;
    display: inline-block;
}

.enquire .dynamic-autosize-lifter {
    padding: 0;
    margin: 0 30px 0 0;
    visibility: hidden;
    height: 1px;
    display: block;
    -webkit-transition: width linear .03s;
    transition: width linear .03s;
}

.success-show {
    display: none;
}

/* Icons
   ========================================================================== */

@font-face {
    font-family: 'icomoon';
    src:url('../bundles/app/fonts/icomoon.eot?-ny7wpt2');
    src:url('../bundles/app/fonts/icomoon.eot?#iefix-ny7wpt2') format('embedded-opentype'),
    url('../bundles/app/fonts/icomoon.woff?-ny7wpt2') format('woff'),
    url('../bundles/app/fonts/icomoon.ttf?-ny7wpt2') format('truetype'),
    url('../bundles/app/fonts/icomoon.svg?-ny7wpt2#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

.icon {
    font-family: 'icomoon';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-empty:before {
    content: "\e600";
}
.icon-full:before {
    content: "\e601";
}
.icon-keyboard:before {
    content: "\e602";
}
.icon-phone:before {
    content: "\e603";
}
.icon-truck:before {
    content: "\e604";
}
.icon-arrow:before {
    content: "\e605";
}
.icon-dollar:before {
    content: "\e606";
}
.icon-facebook:before {
    content: "\e607";
}
.icon-graph:before {
    content: "\e608";
}
.icon-instagram:before {
    content: "\e609";
}
.icon-keg:before {
    content: "\e60a";
}
.icon-leaf:before {
    content: "\e60b";
}
.icon-twitter:before {
    content: "\e60c";
}
.icon-pound{
    color: #f2f2f2;
    background: #000;
    border-radius: 100%;
}
.icon-pound:before{
    content: "\e901";
}
.icon-circle:before {
    content: "\e900";
}
.icon-more-funds:before {
    content: "\e902";
}
.icon-fixed-margins:before {
    content: "\e903";
}
.icon-lost-kegs:before {
    content: "\e904";
}
.icon-logistics:before {
    content: "\e905";
}
.icon-transparency:before {
    content: "\e906";
}
/* WIP
   ========================================================================== */
.collection-form,
.email-form {
    display: none;
}