
html, body {height:100%;}

body{color:#000!important; padding-right: 0; -moz-osx-font-smoothing: grayscale;text-rendering: optimizelegibility;font-family:'Merel-Regular'!important;font-size: 13px;}

p{margin:0 0 20px 0; font-size: 13px;}

/**********
text
**********/
h1{font: 38px/38px 'Congenial-Bold';margin:0;}
h2{font: 44px/44px 'Congenial-Bold';}
h3{font: 24px/24px 'Congenial-Bold';}

h3{text-align: center;}

.intro-text{font: 15px/15px 'Merel-Bold';}

a {outline : none!important;text-decoration: underline;} a:hover {text-decoration: none;}

.white-text{color: #FFF;} .red-text{color: #E20E17;} .blue-text{color:#1EABC2;}

p a{color:#000;text-decoration: none;}
p a:hover{color:#E20E17;}


/**********
margins
**********/
.less-pad-top{padding-top:25px!important;} .less-pad-bottom{padding-bottom:25px!important;}
.pad-top{padding-top:50px!important;} .pad-bottom{padding-bottom:50px!important;}
.more-pad-top{padding-top:75px!important;} .more-pad-bottom{padding-bottom:75px!important;}

.less-margin-top{margin-top:20px!important;} .less-margin-bottom{margin-top:20px!important;}
.margin-top{margin-top:40px!important;} .margin-bottom{margin-bottom:40px!important;}
.more-margin-top{margin-top:60px!important;} .more-margin-bottom{margin-bottom:60px!important;}

.pad-sides{padding-left:90px;padding-right: 90px;}

.no-left-padding{padding-left:0px;}
.no-side-padding{padding-left:0px;padding-right:0px;}

/**********
genral randomness
**********/
.full-height{height: 100%;}
.half-height{height: 50%;}

.vertical-center{position: relative;top: 50%;transform: translateY(-50%);}

.offset-vertical-center{position: relative;top: 50%;transform: translateY(-75%);}

.center-block {float: none;}

.more-padding{padding-left: 20px;padding-right: 20px;}

/**********
animations
**********/
@keyframes shake {
  10%, 90% {
    transform: translate3d(-1px, 0, 0);
  }

  20%, 80% {
    transform: translate3d(2px, 0, 0);
  }

  30%, 50%, 70% {
    transform: translate3d(-4px, 0, 0);
  }

  40%, 60% {
    transform: translate3d(4px, 0, 0);
  }
}

.more-btn:hover {
  animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  perspective: 1000px;
}

/**********
backgrounds
**********/
.white-bkg{background: #FFFFFF;}
.linen-bkg{background: #FBFBFB;}
.light-grey-bkg{background:#F0F0F0;}
.black-bkg{background:#000;}

/**********
header
**********/
header .col-md-12{min-height: 0px;}
.logo {position: absolute;z-index: 100;}
.logo img{width:135px;}

/**********
internal header
**********/
.internal-header{border-bottom:1px solid #F0F0F0;}
.internal-header .title-wrap, .internal-header .banner-wrap{height: 236px;}
.internal-header .title-wrap h1{margin: 130px 0 0;}
.internal-header .banner-wrap{background: rgba(0, 0, 0, 0) url("img/bean-bkg.png") repeat-x scroll 0 0 / 273px auto;}
.internal-header .banner-wrap .banner{padding: 0 25px;}
.internal-header .banner-wrap .banner img{box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.5);}

/* dropdown */
.select-wrap {margin: 17px 0;}

.dropdown-menu{font-size: 13px;}
.dropdown-menu.open {border: 2px solid #f0f0f0!important;border-radius: 2px;font-size: 13px;}
.btn {border: 2px solid #f0f0f0!important;border-radius: 2px;font-size: 13px;outline: medium none}
.caret {border: solid #1eabc2;border-width: 0 2px 2px 0;display: inline-block;padding: 3px;transform: rotate(45deg);-webkit-transform: rotate(45deg);   }

.bootstrap-select.btn-group .dropdown-toggle .caret {margin-top: -6px;position: absolute;right: 12px;top: 50%;vertical-align: middle;}

label {font-weight: normal;margin-right:10px;}

/**********
home
**********/
.home-feature a{left: 0;margin: 0 auto;position: absolute;right: 0;width: 75px}
.home-feature a img{width:70px;}
.home-feature h2{text-shadow: 1px 1px 3px #fff;}

.feature-title{margin-bottom:10px;}
.home-feature .vertical-center {top: 40%;}



.suppliers-pannel{text-align: center;}
.suppliers-pannel h3{margin-bottom:30px;}
.suppliers-pannel img{width:50%;}

.owl-carousel, .owl-stage-outer, .owl-stage, .owl-item, .slide{height:100%;}
.slide .more-btn{position: absolute;bottom: 90px;left: 0; right: 0;margin: 0 auto;width: 100px!important;}

.slide-1-layer-2-desktop{text-align: center;}
.slide-1-layer-2-desktop img{width: 80%!important;max-width: 100%;display:inline!important;}

.slide-1-layer-2-mobile{display: none;}

.slide-2-layer-2{text-align: center;}
.slide-2-layer-2 img{width: 70%!important;max-width: 100%;display:inline!important;}


.owl-controls {position: absolute; width: 100%;bottom: 30px;z-index: 9999;}
.owl-controls .owl-dots{text-align: center;}
.owl-controls .owl-dot {background: rgba(0, 0, 0, 0) url("img/slide-nav-dot.png") repeat scroll 0 -18px / 100% auto;display: inline-block;height: 17px;margin: 0 5px;width:25px;}
.owl-controls .owl-dot.active{background-position-y: 0px;}

.home-carousel {height: 100%;}

.owl-carousel .owl-stage-outer{
   overflow: hidden;
   position: relative;
   width: 100%;
   z-index: 1;  /* added this */
}
.owl-item {
  transform: translateZ(0);
 -webkit-transform: translateZ(0);
 -ms-transform: translateZ(0);
}

/**********
products summary
**********/
.product-summary{border-right:1px solid #F0F0F0;border-bottom:1px solid #F0F0F0;height:246px;}
.product-summary h2{font: 22px/22px 'Merel-Bold'; margin-bottom: 5px;}

.product-summary .more-btn{position: relative;width: 51px;margin-top: 20px;}
.product-summary .more-btn a{color: #FFF;font: 17px/17px 'Merel-Bold';text-align: center;}

.product-summary .more-btn:hover {
  animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  perspective: 1000px;
}



.product-summary span{position: absolute;margin-top: 5px;width: 51px;}

.product-summary .image-wrap{width:50%;float: left;text-align: center;}
.product-summary .image-wrap img{height:180px;}
.product-summary .detail-wrap{width:50%;float: left;}

.product-detail h2{font: 22px/22px 'Merel-Bold'; margin-bottom: 30px;margin-top: 20px;}
.product-detail .availibility{font:15px/15px 'Merel-Regular';}

a.product-button{border-radius: 2px;display: inline-block;padding: 8px 15px;font-family:'Merel-Bold';color: #FFF;margin-top: 30px;
	      -webkit-transition: all .3s ease;
           -moz-transition: all .3s ease;
                transition: all .3s ease;
}

a.product-button:hover{opacity:0.7;}

a.product-button .fa-angle-double-left{float: left;font-size: 20px;padding: 0 10px 0 0;}
a.product-button .back-btn-text {float: left;padding-top: 2px;}

.product-carousel .owl-controls {position: absolute; width: 100%;bottom: 25px;}

/**********
competition
**********/
.competition-bkg{position: relative;height:100%;}
.competition-bkg img{position: absolute;left: 0;right: 0;top: 70px;padding-left: 10%;padding-right: 10%;display: inline-block;max-width: 100%;vertical-align: middle;}

.competition-block{position: relative;height:100%;}
.competition-block .info{width: 50%;float:right;}
.competition-block h2{color: #FFF; font-size: 28px;line-height: 33px; text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5);text-align: center;}
.competition-block span{position: absolute;margin-top: 5px;width: 51px;}
.competition-block .more-btn{margin: 0 auto;width: 51px;}
.competition-block .more-btn a{color: #FFF;font: 17px/17px 'Merel-Bold';text-align: center;}
.competition-block .more-btn:hover {
  animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  perspective: 1000px;
}


.competition-form input[type="submit"]{ background: #fff url("img/btn-enter-here.png") no-repeat scroll 0 0 / 64px auto;border: medium none!important;padding: 15px 0;transition: opacity 0.3s ease 0s, border 0.3s ease 0s;width: 64px;float: right;}

.competition-form input[type="submit"]:hover{animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;transform: translate3d(0, 0, 0);backface-visibility: hidden;perspective: 1000px;}

/* cf7 checkbox */
.competition-form .wpcf7-list-item {height:20px;position: relative;margin:5px auto;}
.competition-form .wpcf7-list-item input[type=checkbox]{position: absolute;z-index: 99999;width:30px;height: 30px;top:0px;left:0px;}
.competition-form .wpcf7-list-item .wpcf7-list-item-label {width: 140px!important;font-size: 90% !important;height: 30px;cursor: pointer;position: absolute;top: 0;left: 0;background: #FFF;border-radius: 0px;background: rgba(0, 0, 0, 0) url("img/checkbox-bkg.png") no-repeat scroll left center / 30px 30px;padding-left: 40px;}
.competition-form .wpcf7-list-item .wpcf7-list-item-label:after {content: '';width: 9px;height: 5px;position: absolute;top: 11px;left: 11px;border: 3px solid #1EABC2;border-top: none;border-right: none;background: transparent;opacity: 0;-webkit-transform: rotate(-45deg);transform: rotate(-45deg);}
.competition-form .wpcf7-list-item input[type=checkbox] {opacity: 0; cursor: pointer;}
.competition-form .wpcf7-list-item input[type=checkbox]:checked + .wpcf7-list-item-label:after {opacity: 1;}

.competition-form .social-icons-container ul{padding-left:0px;text-align: center;}
.competition-form .social-icons-container ul li {display:inline;margin-right: 10px;}
.competition-form .social-icons-container ul li a {font-size: 46px!important;color:#1EABC2;}

.news-popup {color:#FFF;position: relative;background-color:#E20E18;padding: 30px;width: auto;max-width: 650px;margin: 20px auto; min-height: 450px;}
.news-popup .loader{margin:150px auto;width:150px;}
.news-popup h3{font: 20px/20px "Merel-Bold";margin-bottom: 20px;margin-top: 0;padding-bottom: 0px;}

/*lightbox overrides*/
.mfp-bg {background: transparent!important;}
.mfp-close-btn-in .mfp-close{background-image: url('img/close.png'); background-size: 40px auto; width:40px;height:40px;opacity:1;right: 10px;
    top: 10px;}
.mfp-close:active {top: 10px!important;}

/**********
social feed
**********/
.social-pannel .social-feed-container-354 {width: 100%!important;}
.social-pannel .social-feed-element .media-object {display: none;}
.social-pannel  .social-feed-container-354 .social-feed-element {background-color: transparent!important;box-shadow: none!important;}
.social-pannel .social-feed-element .content {padding: 0px!important;}
.social-pannel .social-feed-container-354 .author-title {float:left!important}
.social-pannel .posted-time{float:left;clear:left;}
.social-pannel .social-icon{float:left}
.social-pannel .social-icon{clear: left;float: left;}

.social-feed-container-354 .fa-twitter, .social-feed-container-354 .fa-instagram{position: unset!important;color: #E20E17!important;background: transparent!important;float: left;clear: left;font-size: 20px;}

.social-pannel .social-feed-container-354 .social-feed-element:hover {box-shadow: none!important;}
.social-pannel .social-feed-container-354 .social-feed-element {
    color: black!important;
    font-family:'Merel-Regular'!important;font-size: 13px!important;
    font-size: 12px!important;
    line-height: 16px!important;
    margin-bottom: 30px!important;margin-top: 30px!important;
}

.social-pannel .social-feed-container-354 .text-wrapper {border-left: 1px solid #ccc;padding-left: 13px;}
.social-pannel .col-md-7 {padding-left: 0;}
.social-pannel .social-feed-container-354 .social-feed-element a {color: #E20E17!important;}
.social-pannel .social-feed-image{margin-bottom:5px!important;}

.social-pannel{overflow: hidden;position: relative;}
.social-pannel-inner{ width: 100%;height: 100%;overflow: auto;padding-right: 25px;padding-left: 10px;position: absolute;}

/**********
account
**********/
.page-template-full-width h1{margin-bottom:30px;}

.um-login input[type="submit"], .um-form input[type="submit"]{background: #1EABC2!important;border-radius: 2px!important;font-family: "Merel-bold"!important;}

.um-center input.um-button {min-width: 50%!important;}

.um-error-block, .um-field-error, p.um-notice.err{background: #e20e17!important;}

input#username-157, input#user_password-157, input#account_number-175, input#last_name-175, input#user_email-175, input#user_password-175{padding: 8px 8px 8px 40px!important;}

input#username-157, input#user_email-175{background: #fff url("img/email-icon.png") no-repeat scroll 10px 12px / 15px auto;}
input#user_password-157, input#user_password-175{background: #fff url("img/key-icon.png") no-repeat scroll 10px 9px / 18px auto;}


input#account_number-175{background: #fff url("img/dots-icon.png") no-repeat scroll 10px 15px / 18px auto;}
input#last_name-175{background: #fff url("img/building-icon.png") no-repeat scroll 10px 9px / 14px auto;}

.confirmation-icon img {width:109px;}


.confirmation .more-btn{position: relative;width: 51px;margin: 0 auto;}
.confirmation .more-btn a{color: #FFF;font: 17px/17px 'Merel-Bold';text-align: center;}

.confirmation .more-btn:hover {
  animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  perspective: 1000px;
}

.confirmation span{position: absolute;margin-top: 5px;width: 51px;}

.p1 a{color:#000;text-decoration: underline;}
.p1 a:hover{color:#E20E17;}

/**********
marketing assets
**********/
.marketing-assets{border-right:1px solid #F0F0F0;border-bottom:1px solid #F0F0F0;height:auto;margin-top:140px;}
.marketing-assets h2{font: 22px/22px 'Merel-Bold'; margin-bottom: 5px;}

.marketing-assets .more-btn{margin: 20px auto;width: 51px;}
.marketing-assets .more-btn a{color: #FFF;font: 17px/17px 'Merel-Bold';text-align: center;}

.marketing-assets .more-btn:hover {
  animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  perspective: 1000px;
}

.marketing-assets .tag a{color:#000;text-decoration: none;}
.marketing-assets .tag a:hover{color:#e20e17;}

.marketing-assets .download-icon img{height:90px;}

.marketing-assets span{position: absolute;margin-top: 5px;width: 51px;}

.marketing-assets .detail-wrap{width:100%;text-align: center;}


/**********
contact
**********/
.contact-span h2{font: 38px/38px 'Congenial-Bold'; text-align: center;}
.contact-span .phone-number{ background: #e20e17 none repeat scroll 0 0; color: #fff;font: 21px/21px "Merel-Regular";margin: 0 auto;padding: 20px 0;text-align: center;width: 40%;border-radius: 2px;}
.contact-span .content p{margin: 0 auto;width: 50%;}

.your-name input{background: #fff url("img/name-icon.png") no-repeat scroll 10px 8px / 15px auto;}
.your-email input{background: #fff url("img/email-icon.png") no-repeat scroll 10px 12px / 15px auto;}
.your-message textarea{background: #fff url("img/message-icon.png") no-repeat scroll 10px 8px / 15px auto;}

.wpcf7-form p {text-align: center;}

/*form*/
input, textarea {border: 2px solid #D9D9D9!important;border-radius: 2px;margin: 0 0 10px;padding: 8px 8px 8px 40px;width:100%;}
textarea{resize: none;height: 140px;}

input[type="submit"]{ background: #fff url("img/btn-send.png") no-repeat scroll 0 0 / 64px auto;border: medium none!important;padding: 15px 0;transition: opacity 0.3s ease 0s, border 0.3s ease 0s;width: 64px;}
input[type="submit"]:hover{
	animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  perspective: 1000px;
}

input::-webkit-input-placeholder {color: #000 !important;}
input:-moz-placeholder { /* Firefox 18- */color: #000 !important;}
input::-moz-placeholder {  /* Firefox 19+ */color: #000 !important;}
input:-ms-input-placeholder {  color: #000 !important;}

textarea::-webkit-input-placeholder {color: #000 !important;}
textarea:-moz-placeholder { /* Firefox 18- */color: #000 !important;}
textarea::-moz-placeholder {  /* Firefox 19+ */color: #000 !important;}
textarea:-ms-input-placeholder {  color: #000 !important;}


div.wpcf7-validation-errors, div.wpcf7-mail-sent-ok, div.wpcf7-response-output, span.wpcf7-not-valid-tip {color:#106bae;float:left;font: 15px/15px "Merel-Bold";}
div.wpcf7-validation-errors {border: none!important;} div.wpcf7-mail-sent-ok {border: none;font: 15px/15px "Merel-Bold";}
div.wpcf7-response-output {margin:0 auto 20px 0;text-align: center;width: 100%;font: 15px/15px "Merel-Bold";color: #000;}
span.wpcf7-not-valid-tip {margin: 0 0 10px!important;}



@media (min-width : 1400px) {
.vertical-center-mobile{position: relative;top: 50%;transform: translateY(-50%);}
}

/* Large devices (large desktops, 1200px and smaller) */
@media (max-width : 1200px) {
.um-center input.um-button {min-width: 100%!important;}

}

/* Medium Devices, Desktops Menu changes here, col-md-12 stacks here*/
@media  (max-width : 992px) {

/* stack padding */
.stack-padding{padding-top:25px;}

.internal-header .title-wrap h1 {text-align: center;margin: 25px 0;}
.select-wrap {margin: 20px 0;text-align: center;}
.footer-left, .footer-right{text-align: center!important;}

.internal-header .title-wrap, .page-template-the-range .internal-header .title-wrap{height: auto;}

.logo {left: 0;margin: 0 auto;right: 0;width: 135px;}

.product-detail {text-align: center;}

.competition-image-wrap{height:700px;}
.competition-bkg img {top: 130px;}

.internal-header .banner-wrap {height: 125px;}

.slide-1-layer-2-desktop{display: none;}

.slide-1-layer-2-mobile {display: block;text-align: center; position: relative;top: 68%;transform: translateY(-75%);}
.slide-1-layer-2-mobile img{width: 80%!important;max-width: 100%;display:inline!important;display: block;}

.suppliers-pannel img.last{padding-bottom:30px;}

.social-pannel .social-feed-container-354 .text-wrapper {border-left: medium none;}
.social-pannel .social-feed-container-354 .author-title, .social-pannel .posted-time, .social-pannel .social-icon, .social-pannel .social-feed-container-354 .text-wrapper {text-align: center;width: 100%;}

.social-feed-container-354 .fa-twitter, .social-feed-container-354 .fa-instagram {float: none;}

.banner{display: none;}


}

/* Small Devices, Tablets*/
@media (max-width : 768px) {

}



@media (max-width : 767px) {

.home-feature h2 {text-shadow: 1px 1px 2px #FFF;}
.page-template-the-range .internal-header .banner-wrap{height: 125px;}
.internal-header .banner-wrap{height: 125px;}

.social-pannel{height:500px!important;}
.social-pannel-inner {padding-left: 0!important;}

.home-feature {background: rgba(0, 0, 0, 0) url("http://dev-one.fly-grid.co.uk/wp-content/uploads/2017/04/IMG_2912-2.jpg") no-repeat scroll 0 -147px / 640px auto!important;}
.col-md-6.half-height.home-feature {height: 280px;}

.home-feature .vertical-center {
    position: relative;
    top: 59%;
    transform: translateY(-50%);
}


}

/* Extra Small Devices, Landscape */
@media (max-width : 568px) {

}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {
.col-xs-6.competition-block {width: 100%!important;}

.contact-span .phone-number, .contact-span .content p {width: 100%;}

.competition-image-wrap{height:480px;}
.competition-bkg > div {height: 100%;}

body {padding-right: 0!important;}



/* Extra Small Devices, Small Phones, we dont really use this anymore*/
@media only screen and (max-width : 375px) {



}
