/*
 * DeliveryChef
 * Main Style Sheet
 * by StartCreative
 * V1.5
 */

html, body {
    background-color: #eaeff4;
    margin: 0;
    padding: 0;
    height: auto;
}
body {
    font-family: 'Open Sans', sans-serif;
    font-size: 16px; 
    color: #39495f;
    overflow-x: hidden;
    opacity: 1;
    line-height: 1.4;
    padding-right: 340px;
    -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;    
}
body.fixed {
    overflow: hidden; 
}
a {
    cursor: pointer;
    outline: medium none !important;
    text-decoration: none;
}
.single a {
    color: #4286d9;
}
.single ul {
    list-style: outside none disc;
    padding: 0 18px;
}
.single ul li {
    padding: 5px 0;
}
p {
    font-size: 15px;
    font-weight: 400;
    margin-bottom: 0;
}
ul {
    list-style: outside none none;
}
*, *:before, *:after {
    box-sizing: border-box;
}

h1, h2, h3, h4, h5 {
    margin: 0;
    padding: 0;  
}
h1 {
    font-size: 52px;
    font-weight: 200;
}
h1.open-title {
    font-weight: 200 !important;
    margin-bottom: 25px !important;
}
h2 {
    font-size: 46px;
    font-weight: 300;
    line-height: 1.2;
}
h3 {
    font-size: 22px;
}
hr {
    border-left: 0 none;
    border-right: 0 none;
    border-bottom: 0 none;
    border-top: 2px dashed #e7edf7;
}
.form-title {
    margin-bottom: 35px;
    
}
.form-title a {
    color: #2d96cb;
    float: left;
    font-size: 12px;
    padding: 6px 10px;
}
form h3 {
    font-size: 20px;
    float: left;
    margin: 0 0 28px;
}
form h3.tab {
    border-bottom: 1px solid #dfe5f0;
    background-color: #f3f6fa; 
    cursor: pointer;
    font-size: 16px;
    font-weight: 400;
    padding: 8px 15px;
    margin: 5px 0 12px;
} 
form h3.tab:hover {
    background-color: #2886b6;
    border-color: #2886b6;
    color: #fff;
}
form h3.tab.active {
    border-color: #2d96cb;
    background-color: #2d96cb;
    color: #fff;
}

h5 {
    font-size: 16px;
    text-align: center;
    color: #888;
}



::-webkit-input-placeholder {
    color: #858585;
    font-weight: 300;
}

:-moz-placeholder { /* Firefox 18- */
    color: #858585;
    font-weight: 300;
}

::-moz-placeholder {  /* Firefox 19+ */
    color: #858585;
    font-weight: 300; 
}

:-ms-input-placeholder {  
    color: #858585;
    font-weight: 300;  
}
.clearfix::before, .clearfix::after {
    content: "";
    display: table;
}
.clearfix::after {
    clear: both;
}

label {
    font-size: 14px;
}
.hidden {
    height: 0;
    width: 0;
    visibility: hidden;
    position: absolute;
    left: 0;
}
.row {
    width: 100%;
    float: left;
    padding: 8px 0;
    position: relative;
}
.half {
    float: left !important;
    width: 50%;
    position: relative;
}
.push {
    -webkit-transform: translate3d(300px,0,0);
    transform: translate3d(300px,0,0);
}

a.close-btn {
    border: 1px solid;
    border-radius: 99px;
    color: #086ea2 !important;
    padding: 3px;
    position: absolute;
    right: 15px;
    top: 15px;
}

.no-padding {
    padding: 0 !important;
}

.drop-overlay {
    background-color: transparent;
    height: 100%;
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: fixed;
    top: 0;
    width: 100%;
    -webkit-transition: opacity 0.2s ease-out 0s;
    -moz-transition: opacity 0.2s ease-out 0s;
    -ms-transition: opacity 0.2s ease-out 0s;
    -o-transition: opacity 0.2s ease-out 0s;
    transition: opacity 0.2s ease-out 0s;     

}
.drop-area.show + .drop-overlay {
	opacity: 1;
}
span.note {
    background-color: #daf1fd;
    border-radius: 2px;
    display: block;
    font-size: 13px;
    padding: 8px;
}

/* ----------- Main sections ----------- */

.container {
    display: table;
    position: relative;
    height: 100%;
    table-layout: fixed;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    overflow-x: hidden;
}

#screen {
    display: inline-block;
    position: relative;
    padding: 130px 30px 90px;
    width: 100%;
    float: left;
    height: auto;
    min-height: 100vh;
    overflow: hidden;
    margin-top: -90px; 
    -webkit-transition: -webkit-transform 0.2s;
	transition: transform 0.2s;     
}

#screen.menu-page {
    overflow: visible;
}

#screen .screen-title {
    float: left;
    display: block;
    margin-left: 15px;
}
#screen h1 {
    float: left;
    font-size: 36px;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 15px;
    width: 100%;
}
#screen h2 {
    border-bottom: 1px solid #fff;
    float: left;
    font-size: 26px;
    font-weight: 600;
    letter-spacing: -0.5px;
    line-height: 1.2;
    margin-bottom: 20px;
    padding-bottom: 20px;
    width: 100%;
}
.inner {
    display: inline-block;
    padding: 10px 15px;
    width: 100%;
    float: left;
}
#screen .inner a,
#screen.pages a {
    color: #086ea2;
}
#screen .inner table {
    display: block;
    margin: 12px 0;
    text-align: left;
}
#screen .inner table tr {

    display: inline-block;
    padding: 6px;
    width: 100%;
}
#screen .inner table tr td, #screen .inner table tr th {
    display: block;
    float: left;
    min-width: 200px;
}
section {
    display: inline-block;
    position: relative;
    float: left;
    height: auto;
    width: 100%;
    -webkit-transition: -webkit-transform 0.2s;
	transition: transform 0.2s;       
}


/*  ----------- Header -----------  */
#header {
    background-color: #f7d159;    
    float: left;
    height: 90px;   
    position: relative;    
    padding: 0;
    width: 100%;
    z-index: 99;
}
#header .inner {
    padding-bottom: 0;
}
#header .logo {
    background-color: transparent;
    border: 2px solid #3497c3;
    border-radius: 100px;
    height: 85px;
    left: 15px;
    padding: 0;
    position: absolute;
    top: 15px;
    width: 85px;
}
#header .logo a {
    background-color: #fff;
    border-radius: 100px;
    display: block;
    float: left;
    height: 100%;
    overflow: hidden;
    position: relative;
    width: 100%;
    z-index: 999;
}
#header .logo img {
    color: #fff;
    font-size: 11px;
    height: auto;
    margin-top: 0;
    width: 100%;
}
#header .mainmenu {
    float: right;
    height: 100%;
    margin: 10px;
}
#header .mainmenu ul {
    float: left;
    height: 100%;
    margin: 0;
    padding: 0;
}
#header .mainmenu ul li {
    float: left;
    font-size: 13px;
    font-weight: 600;
    margin: 0;
    padding: 0 3px;
    -webkit-transition: all 0.15s ease-out 0s;
    -moz-transition: all 0.15s ease-out 0s;
    -ms-transition: all 0.15s ease-out 0s;
    -o-transition: all 0.15s ease-out 0s;
    transition: all 0.15s ease-out 0s;       
}

#header .mainmenu ul li a {
    padding: 7px 10px;
    color: #fff;
    display: block;
}

.btn {
    display: inline-block;
    float: left;
    padding: 7px 20px !important;
    color: #2d96cb !important;
    background-color: #fff;
    border-radius: 2px;
    cursor: pointer;
}
.btn.centered {
    float: none;
    margin: 15px 0px;
}
.btn.big {
    font-size: 20px;
}
.btn:hover {
    color: #fff !important;
    background-color: #2d96cb;
}
.del-account {
    background-color: #f3f6fa;
    font-size: 12px;
    padding: 11px 20px !important;
}
.btn-back {
    border: 1px solid;
    border-radius: 2px;
    display: inline-block;
    margin: 20px 0;
    padding: 4px 24px 6px;
}
#pcode_err_msg {
    font-size: 18px !important;
}
.welcome {
    color: #fff;
    display: block;
    padding: 7px 10px;
}
.submit-btn {
    background-color: #fff;
    border: 0 none !important;
    border-radius: 3px;
    color: #4c88a6;
    font-size: 18px;
    margin: 5px auto;
    padding: 8px 36px;
    text-transform: uppercase;
    cursor: pointer !important;
}
.submit-btn:hover {
    background-color: #4c88a6;
    color: #fff;
}
/*  Filters */

.filters:before {
    
}
.filters {
    background-color: #ecb82c;
    float: left;
    height: auto;
    margin: 0;
    padding: 0 12px 0 105px;
    position: relative;
    width: 100%;  
}
.filters ul {
    width: auto;
    float: left;
    margin: 0;
    padding: 0;
}
.filters ul li {
    float: left;
    font-size: 13px;
}
.filters ul li a {
    background-color: transparent;
    border: 0 none;
    border-radius: 0;
    color: #fff;
    cursor: pointer;
    font-weight: 600;
    padding: 10px 20px;
    display: block;
    -webkit-transition: all 0.15s ease-out 0s;
    -moz-transition: all 0.15s ease-out 0s;
    -ms-transition: all 0.15s ease-out 0s;
    -o-transition: all 0.15s ease-out 0s;
    transition: all 0.15s ease-out 0s;    
}
.filters ul li a:hover,
.filters ul li a.active {
    background-color: #e2af27;
}

.filters > div {
    float: right;
}
.filters > div select {
    -webkit-appearance: none;
    padding: 5px 8px;
    background-color: #ffba00;
    border: 1px solid #fff;
    color: #fff;
    margin-top: 5px;
    font-size: 12px;
    width: 100px;    
}
.item-filters {

    left: 0;
    width: auto;
    z-index: 99;
}
.item-filters .owl-item {
    opacity: 1 !important;
    width: auto !important;
}
.item-filters .owl-wrapper-outer {
    position: relative;
}


.item-filters .SumoSelect {
    padding: 6px 0;
}
.item-filters select {
    display: none;
}

/* ----------- HomePage ----------- */

.home-bg {
    background-image: url("/assets/img/img_4.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    margin-bottom: -100px;
}
section.blue::before, section.blue::after {
    background: #2d96cb none repeat scroll 0 0;
    bottom: 0;
    content: "";
    display: inline-block;
    position: absolute;
    top: 0;
    width: 9999px;
}
section.blue::before {
    right: 100%;
}
section.blue::after {
    left: 100%;
}
section.blue {
    background-color: #2d96cb;
    padding: 80px 40px;
}
section.blue h2 {
    color: #fff;
    font-size: 32px;
}
section.blue h4 {
    font-size: 22px;
    font-weight: 600;
}
.cols {
    width: 100%;
    float: left;
    margin: 20px 0;
    display: block;
}
section.blue .col {
    background-color: transparent;
    color: #fff;
    display: block;
    float: left;
    height: 340px;
    padding: 35px;
    position: relative;
    text-align: center;
    width: 25%;
}
section.blue .col:after {
    content: "";
    font-family: "entypo";
    font-size: 30px;
    left: -12px;
    position: absolute;
    top: 30%;
}
section.blue .col:first-child:after {
    content: "";    
}
section.blue .col:last-child:after {
    color: #ffca3c;
}

section.blue .col .icon {
    background-color: #3aadd9;
    border-radius: 150px;
    height: auto;
    max-width: 200px;
    width: 100%;
}

section.white::before, section.white::after {
    background: #fff none repeat scroll 0 0;
    bottom: 0;
    content: "";
    display: inline-block;
    position: absolute;
    top: 0;
    width: 9999px;
}
section.white::before {
    right: 100%;
}
section.white::after {
    left: 100%;
}
section.white {
    background-color: #fff;
    padding: 60px 40px;    
}
section.white h4 {
    color: #363636;
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 40px;
    padding: 0;
}
.col-3 {
    width: 33.3%;
    float: left;
    padding: 30px;
}
.col-home img {
    width: 100%;
    height: auto;
    float: left;
    margin: 20px 0;
}

section.gray {
    background-color: #f3f6fa;
    padding: 60px 380px 60px 40px;    
    height: 600px;
}


/* HomePage Main 4 categories */

ul.mainCat {
    display: block;
    float: left;
    margin: 0;
    padding: 0;
    width: 100%;
    height: auto;
}
li.col-2 {
    float: left;
    padding: 10px;
    width: 50%;  
    height: 35vh;
    min-height: 210px;  
    max-height: 380px;
}
.mainCat-inner {
    border-radius: 2px;
    border: 0;
	position: relative;
    display: block;
    padding: 15px;
    height: 100%;    
	z-index: 1;
	color: #fff;
    min-height: 185px;
    overflow: hidden; 
}

.mainCat-inner:before {
    background: #f7d159 none repeat scroll 0 0;
    bottom: 0;
    content: "";
    height: 10px;
    left: 0;
    position: absolute;
    transform: translate3d(0px, 10px, 0px);
    width: 100%;
    z-index: 999;
}
.mainCat-bg {
    background-color: #39495f;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;    
    top: 0;
    left: 0;
    position: absolute;
    height: 100%;
    width: 100%;
    -webkit-box-shadow: 0 -74px 48px -8px rgba(0, 0, 0, 0.45) inset;
    -moz-box-shadow: 0 -74px 48px -8px rgba(0, 0, 0, 0.45) inset;
    box-shadow: 0 -74px 48px -8px rgba(0, 0, 0, 0.45) inset; 
    -webkit-transition: opacity 0.35s ease 0s;
    -moz-transition: opacity 0.35s ease 0s;
    -ms-transition: opacity 0.35s ease 0s;
    -o-transition: opacity 0.35s ease 0s;
    transition: opacity 0.35s ease 0s;
}
.mainCat-inner:hover .mainCat-bg {
    opacity: 0.8;
}

.mainCat-inner h3 {
    bottom: 0;
    left: 0;
    font-size: 22px;
    font-weight: 400;
    padding: 30px 20px;
    position: absolute;
    text-align: left;
    text-transform: uppercase;
    -webkit-transition: translate3d(0, 20px, 0);
    -moz-transition: translate3d(0, 20px, 0);
    -ms-transition: translate3d(0, 20px, 0);
    -o-transition: translate3d(0, 20px, 0);  
    transform: translate3d(0, 20px, 0);
    width: 100%;    
}
.mainCat-inner .startNow {
    bottom: 44px;
    font-size: 50px;
    font-weight: 200;
    left: 18px;
    position: absolute;
    opacity: 0;
    
    -webkit-transition: translate3d(0, 40px, 0);
    -moz-transition: translate3d(0, 40px, 0);
    -ms-transition: translate3d(0, 40px, 0);
    -o-transition: translate3d(0, 40px, 0);  
    transform: translate3d(0, 40px, 0);    
   
}

.mainCat-inner h3,
.mainCat-inner:before,
.mainCat-inner .startNow {
    -webkit-transition: all 0.35s ease 0s;
    -moz-transition: all 0.35s ease 0s;
    -ms-transition: all 0.35s ease 0s;
    -o-transition: all 0.35s ease 0s;
    transition: all 0.35s ease 0s;
}


.mainCat-inner:hover h3,
.mainCat-inner:hover:before {
    opacity: 1;
    -webkit-transition: translate3d(0, 0, 0);
    -moz-transition: translate3d(0, 0, 0);
    -ms-transition: translate3d(0, 0, 0);
    -o-transition: translate3d(0, 0, 0);  
    transform: translate3d(0, 0, 0);
}
.mainCat-inner:hover .startNow {
    opacity: 1;
    -webkit-transition: translate3d(0, 0, 0);
    -moz-transition: translate3d(0, 0, 0);
    -ms-transition: translate3d(0, 0, 0);
    -o-transition: translate3d(0, 0, 0);  
    transform: translate3d(0, 0, 0);  
}

.single.bs::before {
    background-image: url("/assets/img/bs_flag.png");
    background-repeat: no-repeat;
    background-size: 105px auto;
    content: "";
    display: block;
    height: 100px;
    left: -2px;
    position: absolute;
    top: -2px;
    width: 100px;
    z-index: 9;
}
.single {
    background-color: #FFF;
    padding: 40px;
    margin-bottom: 50px;
    position: relative;
    overflow: hidden;
}
.single-page .single {
    margin-bottom: 0;
}
.single img {
    width: 100%;
}

.single ul.check-list {
    padding: 0;
    width: 100%;
    float: left;
    list-style: none;
}
.single ul.check-list li {
    color: #adadad;
    float: left;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.7px;
    padding: 10px 10px 10px 40px;
    position: relative;
    text-transform: uppercase;
    width: 50%;
}
.single ul.check-list li::before {
    background-image: url("/assets/img/unchecked.png");
    background-repeat: no-repeat;
    background-size: 24px auto;
    content: "";
    height: 50px;
    left: 0;
    position: absolute;
    top: 7px;
    width: 50px;
    z-index: 99;
}
.single ul.check-list li.checked {
    color: #363636;
}
.single ul.check-list li.checked::before {
    background-image: url("/assets/img/checked.png");  
} 
.single .labels {
    float: left;
    width: 100%;
}
.single .labels span {
    background-color: #ecb82c;    
    border-radius: 3px;
    color: #fff;
    float: left;
    font-size: 11px;
    font-weight: 600;
    margin: 3px;
    padding: 4px 8px;
}
.single .sleft {
    display: inline-block;
    width: 40%;
    padding: 0;
    float: left;
}
.sleft a.image-link {
    display: inline-block;
    margin-bottom: 15px;
    line-height: 0;
}
.sleft .price-wrap {
    float: left;
    width: auto;
}
.sleft .price {
    font-size: 28px;
    font-weight: 800;
    float: left;
    line-height: 1;
}
.price small {
    font-size: 16px;
}
.sleft .inc {
    font-size: 10px;
    float: left;
}


.single .feedback {
    width: 100%;
    padding: 5px;
    float: left;
    background-color: #b1ea60;
    position: absolute;
    left: 0;
    top: 0;
    color: #fff;
}
.single .sright {
    display: inline-block;    
    width: 60%;
    padding: 0 5px 15px 20px;
    float: left;  
}
.single .sfull {
    display: inline-block;    
    width: 100%;
    float: left;   
}
.single button,
.checkoutArea button,
form button {
    background-color: #6bb034;
    border: 0 none;
    border-radius: 2px;
    color: #fff;
    cursor: pointer;
    float: right;
    font-size: 14px;
    font-weight: 600;
    padding: 10px 50px;
    transition: all 0.15s ease-out 0s;
}
.addSingle, .addSingleA {
    padding: 10px 35px !important;
}
form button:hover {
    background-color: #5b992d; 
}
.addSingle:hover, .addSingleA:hover {
    background-color: #5b992d;
}
button.addSingle:disabled, .addSingleA:disabled {
    background-color: #6bb034; 
}
button.absolute {
    bottom: -40px;
    position: absolute;
    right: 0;
}
.item-breadcrumb {
    font-size: 12px;
    float: left;
    width: 100%;
    margin-bottom: 8px;
}
.item-breadcrumb a {
    color: #086ea2;
    text-transform: uppercase;
}

.single h1 {
    font-size: 30px !important;
    padding-bottom: 0;
    padding-right: 35px;
}
.single h1.loginTitle {
    margin: 0 !important;    
}
.single h2 {
    color: #39495f !important;
    font-size: 24px;
    margin: 5px 0 25px !important;
}

.single .desc {
    border-top: 1px dashed #e7edf7;
    display: inline-block;
    margin: 50px 0 0;
    width: 100%;
}
.nav {
    color: rgba(255, 255, 255, 0.4);
    display: inline-block;
    float: right;
    margin-top: 5px;
    margin-bottom: 50px;
    width: auto;
}
.nav a {
    background-color: #dfe5f0;
    border-radius: 2px;
    color: #086ea2;
    display: inline-block;
    font-size: 13px;
    margin: 8px 2px;
    padding: 8px 16px;
    text-transform: uppercase;
    -webkit-transition: all 0.10s ease-out 0s;
    -moz-transition: all 0.10s ease-out 0s;
    -ms-transition: all 0.10s ease-out 0s;
    -o-transition: all 0.10s ease-out 0s;
    transition: all 0.10s ease-out 0s;       
}

.nav a:hover {
   color: #075176; 
}

.assignedItems {
    border-bottom: 1px solid #fff;
    float: left;
    margin-top: 50px;
    width: 100%;
}
.assignedItems h2 {
    
}

.ageCheck {
    max-width: 400px;
    display: inline-block;
    margin-top: 25px;  
    text-align: center;
}
.ageCheck p {
    display: inline-block;
    margin-bottom: 15px;
    width: 100%;
}
.ageCheck button {
    background-color: #568ca8;
    float: none;
    font-size: 15px !important;
    font-weight: 400;
    padding: 12px 15px;
}
.ageCheck button:hover {
    background-color: #49778e;
}

.ageCheck button.ok {
    background-color: #fff;
    color: #304c5a;
}

.ageCheck button.ok:hover {
    background-color: #f8f8f8;
}

/* ----------- Grid layout ----------- */
.advanced-item-filters {
    height: 62px;
    margin-bottom: 4px;
    overflow: hidden;
    position: relative;
    text-align: center;
    width: 100%;  
}
.item-filters {
    opacity: 0;
}
.item-filters.owl-carousel {
    opacity: 1;
}
.owl-theme .owl-controls {
    float: left;
    margin-top: 0 !important;
    position: relative;
    text-align: center;
    width: 100%;
}
.owl-buttons {
    margin-top: 0;
    position: relative;
    width: 100%;
}
.owl-prev,
.owl-next {
    background: transparent none repeat scroll 0 0 !important;
    color: #c4ced8 !important;
    font-size: 24px !important;
    margin: 0 !important;
    opacity: 0.7 !important;
    padding: 0 15px !important;
    position: relative !important;
}

#grid {
    width: 100%;
    float: left;
    height: 100%;
    margin: 0 auto;
	padding: 0;    
}
.grid__item {
    border: 0 none;
    padding: 4px;
	display: inline-block;
	float: left;
    height: auto;
    text-align: center;
	margin: 0;
    margin-bottom: 12px;    
    position: relative;
    overflow: hidden;
    height: 49%; 
    width: 25%;
    -webkit-transition: opacity 0.2s ease-out 0s;
    -moz-transition: opacity 0.2s ease-out 0s;
    -ms-transition: opacity 0.2s ease-out 0s;
    -o-transition: opacity 0.2s ease-out 0s;
    transition: opacity 0.2s ease-out 0s;     
}
.grid__item_inner {
    background-color: #fff;
    height: 100%;
    padding: 5px;
    position: relative;
    overflow: hidden;
}
.grid__item.bs .media:before {
    background-image: url("/assets/img/bs_flag.png");
    background-repeat: no-repeat;
    background-size: 55px auto;
    content: "";
    display: block;
    height: 55px;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 55px;
    z-index: 9;
}
.grid__item .gfv {
    color: #fff;
    float: left;
    font-size: 11px;
    font-weight: bold;
    padding: 5px;
    position: absolute;
    right: 0;
    text-align: right;
    top: 0;
    width: 100%;
    z-index: 9;
}
.grid__item .gfv span {
    background: rgba(107, 176, 52, 0.85) none repeat scroll 0 0;
    border-radius: 3px;
    margin: 2px;
    padding: 0 5px;
}
.grid__item h3 {
    display: table;
    float: left;
    font-size: 12px;
    height: 36px;
    line-height: 1.2;
    overflow: hidden;
    padding: 0;
    text-align: center;
    width: 100%;
}
.grid__item h3 a {
    color: #39495f;
    display: table-cell;
    vertical-align: middle;
}
.grid__item .media {
    background-color: #f3f6fa;
    color: #ccc;
    font-size: 10px;
    height: auto;
    left: 0 !important;
    overflow: hidden;
    padding-bottom: 100%;
    position: relative;
    top: 0 !important;
    width: 100%;
}
.grid__item .media img {
    height: auto;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.grid__item .price { 
    float: left;
    font-size: 18px;
    font-weight: 700;
    padding-top: 4px;
    padding-bottom: 7px;
    letter-spacing: -0.5px;
}
.grid__item .price-info {
    float: left;
    font-size: 11px;
    font-weight: 600;
    margin-left: 8px;
    margin-top: 10px;  
}
.grid__item .col-footer {
    background-color: #fff;
    bottom: 0;
    float: left;
    font-size: 12px;
    left: 0;
    padding: 2px 5px 5px;
    position: relative;
    right: 0;
    width: 100%;
}
.grid__item .col-footer .info {
    border: 1px solid #2d96cb;
    border-radius: 3px;
    color: #1d6285;
    float: left;
    font-weight: 600;
    padding: 6px 0;
    width: 38%;
    clear: left;
    -webkit-transition: all 0.15s ease-out 0s;
    -moz-transition: all 0.15s ease-out 0s;
    -ms-transition: all 0.15s ease-out 0s;
    -o-transition: all 0.15s ease-out 0s;
    transition: all 0.15s ease-out 0s;         
}
.grid__item .col-footer .info:hover {
    background-color: #1d6285;
    color: #fff;
    border-color: #1d6285;
}
.grid__item .col-footer .add, 
.grid__item .col-footer .addA {
    color: #fff;
    font-weight: bold;
    border-radius: 3px;
    float: right;
    background-color: #6bb034;
    padding: 6px; 
    border: 1px solid #6bb034;
    cursor: pointer;
    width: 58%;
    position: relative;
    max-height: 30px;
    -webkit-transition: all 0.15s ease-out 0s;
    -moz-transition: all 0.15s ease-out 0s;
    -ms-transition: all 0.15s ease-out 0s;
    -o-transition: all 0.15s ease-out 0s;
    transition: all 0.15s ease-out 0s;         
}
.grid__item .col-footer .add:hover,
.grid__item .col-footer .addA:hover {
    background-color: #5b992d;  
    border: 1px solid #6bb034;
}
.hide-item {
    opacity: 0.15;
    pointer-events: none;
    cursor: default;    
}
.owl-item {
    opacity: 0;
    -webkit-transition: opacity 0.15s ease-out 0s;
    -moz-transition: opacity 0.15s ease-out 0s;
    -ms-transition: opacity 0.15s ease-out 0s;
    -o-transition: opacity 0.15s ease-out 0s;
    transition: opacity 0.15s ease-out 0s;       
}
#grid.owl-theme.active {
    z-index: 9999;  
}
.owl-item.active {
    opacity: 1;
    z-index: 999;
}
.owl-item.active div.is-active {
    z-index: 9999;
}
.owl-carousel {
    display: none;
}
.owl-item.no-dragging,
.grid__item.no-dragging {
    z-index: 0 !important; 
}
.owl-item > div > .grid__item:after,
div > .grid__item:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    z-index: 9;
    display: block;
    width: 100%;
    height: 100%;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 0.2s ease-out 0s;
    -moz-transition: opacity 0.2s ease-out 0s;
    -ms-transition: opacity 0.2s ease-out 0s;
    -o-transition: opacity 0.2s ease-out 0s;
    transition: opacity 0.2s ease-out 0s;     
}
#grid.active .owl-item > div > .grid__item:after,
#grid.active div > .grid__item:after {
    opacity: 1;
    visibility: visible;
}


.grid__item.is-active:after {
    content: none !important;
    width: 0 !important;
    height: 0 !important;
    visibility: hidden !important;
} 

.is-active {
	z-index: 1000;
}

#grid.active .grid__item {
    pointer-events: none;  
    cursor: grab;
    cursor: -moz-grabbing;
    cursor: grabbing;
}
.grid__item:hover {
	cursor: move;
	cursor: -webkit-grab;
	cursor: grab;
}

.grid__item:active {
	cursor: -webkit-grabbing;
	cursor: grabbing;
}

.is-dropped {
	opacity: 0;
	-webkit-transform: scale3d(0.7,0.7,1) !important;
    transform: scale3d(0.7,0.7,1) !important;
}

.is-complete {
	opacity: 1;
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s !important;
	transition: opacity 0.3s, transform 0.3s !important;
	-webkit-transform: scale3d(1,1,1) !important;
	transform: scale3d(1,1,1) !important;
}

.animate {
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}







/* Custom design For Owl Carousel */

button.add:disabled,
button.addSingle:disabled,
button.addA:disabled,
button.addSingleA:disabled {
    border: 0 none !important;
}

button.add:disabled .spinner,
button.addA:disabled .spinner {
    margin: -4px auto auto;
    height: 24px;
    width: 24px;
    -webkit-animation: rotate 0.8s infinite linear;
    -moz-animation: rotate 0.8s infinite linear;
    -o-animation: rotate 0.8s infinite linear;
    animation: rotate 0.8s infinite linear;
    border: 2px solid #fff;
    border-right-color: transparent;
    border-radius: 50%;
    position: relative;
    top: 50%;
}
@-webkit-keyframes rotate {
    0% {
        -webkit-transform: rotate(0deg); 
    }       
    100% {
        -webkit-transform: rotate(360deg);
    }
}
@-moz-keyframes rotate {
    0% {
        transform: rotate(0deg);
    }     
    100% {
        transform: rotate(360deg);
    }
}
@-ms-keyframes rotate {
    0% {
        -ms-transform: rotate(0deg);
    }      
    100% {
        -ms-transform: rotate(360deg);
    }
}
@-o-keyframes rotate {
    0% {
        transform: rotate(0deg);
    }     
    100% {
        transform: rotate(360deg);
    }
}
@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }      
    100% {
        transform: rotate(360deg);
    }
}


button.addSingle:disabled .spinner,
button.addSingleA:disabled .spinner {
    margin: 0 auto auto;
    height: 24px;
    width: 24px;
    -webkit-animation: rotate 0.8s infinite linear;
    -moz-animation: rotate 0.8s infinite linear;
    -o-animation: rotate 0.8s infinite linear;
    animation: rotate 0.8s infinite linear;
    border: 2px solid #fff;
    border-right-color: transparent;
    border-radius: 50%;
    position: relative;
    top: 50%;
}
@-webkit-keyframes rotate {
    0% {
        -webkit-transform: rotate(0deg); 
    }       
    100% {
        -webkit-transform: rotate(360deg);
    }
}
@-moz-keyframes rotate {
    0% {
        transform: rotate(0deg);
    }     
    100% {
        transform: rotate(360deg);
    }
}
@-ms-keyframes rotate {
    0% {
        -ms-transform: rotate(0deg);
    }      
    100% {
        -ms-transform: rotate(360deg);
    }
}
@-o-keyframes rotate {
    0% {
        transform: rotate(0deg);
    }     
    100% {
        transform: rotate(360deg);
    }
}
@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }      
    100% {
        transform: rotate(360deg);
    }
}




/* ---- Typeahead ---- */
.twitter-typeahead {
    width: 100%;
    float: left;
}
.tt-menu,
.gist {
  text-align: left;
}
.typeahead {
  background-color: #fff;
}
.typeahead:focus {
  border: 2px solid #0097cf;
}
.tt-query {
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
     -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
.tt-hint {
    color: #d6dadd !important;
    font-weight: 300;
    letter-spacing: 0.3px;
}
.tt-menu {
    color: #333 !important; 
    max-width: 300px;
    margin: 12px 0;
    padding: 8px 0;
    background-color: #fff;
    -webkit-border-radius: 3px;
       -moz-border-radius: 3px;
            border-radius: 3px;
       -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.25);
          -moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.25);
               box-shadow: 0 0 6px rgba(0, 0, 0, 0.25);
    width: 100%;
}
.tt-suggestion {
    float: left;
    font-size: 14px;
    line-height: 1.4;
    padding: 5px 20px;
    width: 100%;
}
.tt-suggestion:hover {
  cursor: pointer;
  color: #fff;
  background-color: #5e97b3;
}
.tt-notice p {
    font-size: 14px;
    padding: 5px 0;
}
.tt-notice .btn {
    background-color: #2d96cb;
    color: #fff !important;
    margin-top: 15px;
}
.tt-notice:hover {
    background-color: #fff;
    color: #5b5b5b;
}
.tt-suggestion.tt-cursor {
  color: #fff;
  background-color: #0097cf;

}
.tt-suggestion p {
  margin: 0;
}
.gist {
  font-size: 14px;
}

/* ----------- The Cart ----------- */

.cart-header-mobile {
    background-color: #fff;
    -moz-box-shadow:  1px 1px 4px rgba(0, 0, 0, 0.2);
	-webkit-box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2);     
    box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2);
    height: auto;
    padding: 0;
    display: none;
    position: fixed;
    right: 0;
    text-align: right;
    top: 0;
    width: 100%;
    z-index: 999;
}
.cart-header-mobile button {
    background-color: #fff;
    border: 0 none;
    border-radius: 0;
    color: #39495f;
    cursor: pointer;
    float: right;
    font-size: 18px;
    font-weight: 700;
    height: 60px;
    margin: 0;
    padding: 12px;
    position: relative;
}
.cart-header-mobile button i {
    color: #c9d3e6;
}
.cart-header-mobile button:hover {
    background-color: #eaeff4;
}
.cart-header-mobile .mob-button {
    background-color: #2d96cb;
    color: #fff;
    cursor: pointer;
    display: none;
    float: left;
    font-size: 12px;
    height: 100%;
    line-height: 60px;
    padding-right: 10px;
}
.cart-header-mobile .mob-button i {
    float: left;
    font-size: 30px;
    padding: 0;
    margin-top: -1px;
}
.cart-header-mobile .logo img {
    float: left;
    height: auto;
    margin: 5px 0 5px 10px;
    width: 50px;
}

.hide-checkbox {
    display: none;
}
.hide-checkbox + label {
    background-color: #cbd4dd;
    border-radius: 2px;
    color: #fff;
    cursor: pointer;
    display: block;
    float: left;
    font-weight: 600;
    font-size: 11px;
    margin: 0 2px 0;
    padding: 5px 10px;
    text-align: center;
    width: auto;
    -webkit-transition: background-color 0.15s ease-in-out;
    -moz-transition: background-color 0.15s ease-in-out;
    -o-transition: background-color 0.15s ease-in-out;
    transition: background-color 0.15s ease-in-out;
}
.d_filt + label {
    /*background-color: #f7d159;*/
}
.hide-checkbox:checked + label {
    display: inline-block;
    background-color: #1d6285;
}

.mobilnav {
    background-color: #2d96cb;
    height: 100%;
    position: fixed;
    top: 60px;
    width: 300px;
    overflow: scroll;
    -webkit-transition: -webkit-transform 0.3s ease;
    transition: transform 0.3s ease;
    z-index: 99;   
    -webkit-transform: translateX(-300px);
    -ms-transform: translateX(-300px);
    transform: translateX(-300px);    
}
.mobilnav.menu-open {
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
}
.mobilnav h4 {
    border-bottom: 2px solid rgba(255, 255, 255, 0.2);
    display: inline-block;
    color: rgba(255,255,255,0.4);
    float: left;
    font-size: 12px;
    padding: 8px 25px;
    text-align: left;
    text-transform: uppercase;
    width: 100%;
}
.mobilnav ul {
    display: inline-block;    
    padding: 0;
    margin: 0;
    width: 100%;
    float: left; 
    margin-bottom: 30px;
}
.mobilnav ul li {
    border-bottom: 1px dashed rgba(255, 255, 255, 0.2);
    padding: 0;
    width: 100%;
    float: left;
    text-align: left;
}
.mobilnav ul li:hover,
.mobilnav ul li.active {
    background-color: #2c90c3;
}
.mobilnav ul li a {
    color: #fff;
    float: left;
    font-size: 12px;
    font-weight: 600;
    padding: 18px 25px;
    width: 100%;
}

.cart-header {
    position: relative;
    float: left;
    display: block;
    text-align: center;
    width: 100%;
    padding: 0;  
    z-index: 9;
}
#closeCart {
    color: #086ea2;
    cursor: pointer;
    display: none;
    font-size: 30px;
    padding: 0;
    position: absolute;
    right: 10px;
    top: 10px;  
    z-index: 99;
}

.cart-header h2 {
    border-bottom: 1px dashed #e8e8e8;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: -14px;
    padding: 12px 8px;
    text-align: center;
}

.cart-header h2 i {
    color: #c9d3e6;
    font-size: 22px;
    padding: 3px;    
}
.cart-header .gst {
    background-color: #fff;
    color: #363636;
    float: none;
    font-weight: 800;
    font-size: 10px;
    padding: 0 10px;
    width: auto;
}
.cart-header button,
a.shopping {
    background-color: #dfe5f0;
    border: 0 none;
    border-radius: 2px;
    color: #fff;
    cursor: pointer;
    display: table;
    float: none;
    font-size: 18px;
    margin: 15px auto;
    padding: 10px 40px;
    white-space: nowrap;
    -webkit-transition: all 0.15s ease-out 0s;
    -moz-transition: all 0.15s ease-out 0s;
    -ms-transition: all 0.15s ease-out 0s;
    -o-transition: all 0.15s ease-out 0s;
    transition: all 0.15s ease-out 0s;      
}
.cart-header button.active:hover,
.cart-header-mobile button.active:hover {
    background-color: #6f9d2e;
}
.cart-header button.active {
    background-color: #6bb034;
}
.cart-header button.inactive {
    background-color: #e8e8e8;   
}
a.shopping {
    background-color: #2d96cb;
    font-size: 16px;
}

.start-order-btn {
    border: 2px dashed #e7edf7;
    float: none;
    margin: auto;
    max-width: 300px;
    opacity: 1;
    padding: 20px;
    position: relative;
    text-align: center;
    transition: opacity 0.2s ease-out 0s;
    width: 100%;
}
.start-order-btn img {
    max-width: 130px;
    height: auto;
}
.start-order-btn h4 {
    color: #086ea2;
    display: inline-block;
    float: none;
    font-size: 20px;
    font-weight: 300;
    padding: 12px 0 0;
    text-transform: uppercase;
}
.start-order-btn span {
    color: #ccd2dd;
    display: inline-block;
    float: none;
    font-size: 12px;
    padding: 0;
}




.continue-shopping {
    padding: 20px 0;
}
.continue-shopping a {
    color: #6bb034;
}
/*Cart News */
.news {
    background-color: #f3f6fa !important;

}
.news h2 {
    color: #2d96cb;
    font-size: 15px;
    font-weight: 800;
    margin-bottom: 30px;
}
.news article {
    display: block;
    float: left;
    margin: 0 0 50px;
    padding: 10px;
    width: 100%;
    position: relative;
}
.news article header {
    display: block;
    float: left;
    overflow: hidden;
    position: relative;
    width: 100%; 
}
.news article header .date {
    color: #888;
    font-size: 11px;
}
.news article h3 {
    margin: 0 !important;
    font-weight: 400;
}
.news article p {
    color: #6c6c6c;
    font-size: 12px;
    font-weight: 500;
    margin: 0;
}
.news article img {
    width: 100%;
    height: auto;
    float: left;
    margin-top: 10px;
}
.news article footer {
    display: block;
    float: left;
    overflow: hidden;
    position: relative;
    width: 100%; 
}
.news article footer a {
    background-color: #6bb034;
    border-radius: 2px;
    bottom: 10px;
    color: #fff;
    padding: 6px 20px;
    position: absolute;
    right: 10px;
}
.news article footer a:hover {
   background-color: #6d992e;
}



/* Cart Loader */
#cart .load {
    opacity: 1;
    background-color: #fff;
    width: 100%;
    height: 100%;
    height: 100vh;
    position: absolute;
    z-index: 8;
    text-align: center;
}
#cart .load .spinner {
    margin: -24px auto auto;
    height: 38px;
    width: 38px;
    animation: rotate 0.8s infinite linear;
    border: 2px solid #ccc;
    border-right-color: transparent;
    border-radius: 50%;
    position: relative;
    top: 50%;
}
@keyframes rotate {
  0%    { transform: rotate(0deg); }
  100%  { transform: rotate(360deg); }
}

#cart .start_popup_btn {
    float: left;
    font-size: 14px;
    margin: 20px 0 5px;
    width: 100%;    
}
#cart .start_popup_btn span {
    font-size: 12px;
    cursor: pointer;    
}
#cart .start_popup_btn span.change,
#cart .start_popup_btn span.reset-order {
    color: #086ea2;
}

#cart .cart-item {
    display: inline-block;
    float: left;
    padding: 5px 8px;
    position: relative;
    width: 100%;
    z-index: 1;
    line-height: 38px;
    border-top: 2px dashed #e7edf7;
    height: 52px;
    overflow: hidden;
}
#cart .cart-item:last-child {
    border-bottom: 2px dashed #e7edf7;
}
#cart .cart-item.disabled {
    opacity: 0.6;
}

#cart .cart-item img {
    background-color: #fff;
    color: transparent;
    float: left;
    font-size: 8px;
    height: 40px;
    margin-right: 8px;
    width: 40px;
}
#cart .cart-item .label {
    font-size: 11px;
    font-weight: bold;
    text-align: left;
    float: left;
    color: #363636;
    width: 130px;
    height: 100%;
    overflow: hidden;
    text-transform: capitalize;
}
#cart .cart-item .quantity { 
    font-size: 12px;
    padding: 0;
    width: auto;
    float: right;
}
#cart .cart-item .quantity span {
    float: left;
    width: auto;
    padding: 0 1px;
}
#cart .cart-item .remove {
    float: right;
}
#cart .cart-item .remove > i {
    cursor: pointer;
    font-size: 18px;  
}
.qtyValue {
    background-color: #ffba00;
    border-radius: 2px;
    color: #fff;
    font-size: 11px;
    font-weight: bold;
    line-height: 7px;
    margin: 10px 2px;
    padding: 5px !important;
    cursor: default;
}
#cart .qtyPlus,
#cart .qtyMinus {
    cursor: pointer;
}
#cart .count {
    background-color: #ccd2dd;
    border-radius: 99px;
    color: #fff;
    display: block;
    font-size: 10px;
    font-weight: bold;
    left: 60px;
    margin: auto;
    padding: 1px;
    position: absolute;
    right: 0;
    top: 18px;
    width: 16px;
}
#cart .due {
    bottom: 12px;
    color: #b2bdd1;
    font-size: 12px;
    left: 0;
    position: absolute;
    right: 0;  
}
#cart .ord_total:before {
    background-color: #086ea2;
    content: "";
    height: 7px;
    left: -3px;
    position: absolute;
    top: 7px;
    width: 10px;
    -ms-transform: rotate(45deg); 
    -webkit-transform: rotate(45deg); 
    transform: rotate(45deg);       
}
#cart .ord_total {
    font-weight: 700;
    background-color: #086ea2;
    border-radius: 2px;
    color: #fff;
    font-size: 11px;
    padding: 2px 8px;
    position: absolute;
    left: 230px;
    top: 27px; 
    opacity: 0;
    -webkit-transition: opacity 0.15s, right 0.3s ease-out 0s;
    -moz-transition: opacity 0.15s, right 0.3s ease-out 0s;
    -ms-transition: opacity 0.15s, right 0.3s ease-out 0s;
    -o-transition: opacity 0.15s, right 0.3s ease-out 0s;
    transition: opacity 0.15s, right 0.3s ease-out 0s;       
}
#cart .open .ord_total {
    opacity: 1;
}

#cart .cart-item .price {
    font-size: 13px;
    font-weight: bold;
    float: right;
    color: #086ea2; 
    width: 42px;
    overflow: hidden;
}
#cart .cart-item .entypo-cancel {
    float: left;
    font-size: 12px;
    width: auto;   
    padding-left: 2px;
}

/*   Disabled Cart   */
#cart.disabled h3 {
    margin-top: 20px;
}
#cart.disabled .qtyPlus, 
#cart.disabled .qtyMinus {
    display: none !important;
}
#cart.disabled .qtyValue {
    background-color: #888;
}
#cart.disabled span.remove {
    display: none !important;
}
#cart.disabled .cart-item {
    opacity: 0.6;
}


/* PostCode Popup */
.main-popup {
    background-color: #74bbdf;
    border-radius: 2px;
    color: #fff;
    max-width: 800px;
    padding: 0;
    margin: 0;
    display: none;
    position: relative;
    text-align: center !important;
    width: 100%;
    overflow: hidden;
   -webkit-transform: scale(0.8); 
      -moz-transform: scale(0.8); 
       -ms-transform: scale(0.8);
        -o-transform: scale(0.8);
           transform: scale(0.8);    
}
.main-popup .column {
    background-color: #74bbdf;
    padding: 116px 40px;
    cursor: pointer;
    text-align: center;
    border-radius: 3px;
    float: left;
}
.main-popup .column:hover,
.main-popup .column.selected {
    background-color: #6daecf;
}
.main-popup .border {
    border-right: 2px dashed rgba(255,255,255,0.3) 
}
.main-popup img {
    max-width: 120px;
    height: auto;
}
.main-popup h3 {
    color: #fff;    
    display: inline-block;
    float: left;
    font-size: 24px;
    margin: 10px 0;
    font-weight: 300;
    text-align: center;
    width: 100%;
    text-transform: uppercase;
    letter-spacing: 2px;
}
.main-popup p,
.main-popup span {
    color: #fff;
    font-size: 15px;
    font-weight: 300;
    text-align: center;
    margin: 0;

}
.close_btn {
    background-color: rgba(0, 0, 0, 0.1);
    border-radius: 99px;
    cursor: pointer;
    font-size: 19px;
    height: 28px;
    position: absolute;
    padding: 0 !important;
    right: 5px;
    top: 5px;
    width: 28px;
    z-index: 999;  
}
.ok_btn {
    background-color: rgba(0, 0, 0, 0.1);
    border-radius: 3px;
    cursor: pointer;
    display: table;
    float: none;
    font-size: 20px;
    margin: auto;
    margin-top: 20px;
    padding: 12px 50px;
    position: relative;
    text-align: center;
}
#company_input,
#pcode_input {
    display: none;
    position: absolute;
}
#company_input.selected,
#pcode_input.selected {
    display: block;
    position: relative;
}
.main-popup .form-group {
    margin: 150px 0;
    display: table;
}
.main-popup form input[type="text"] {
    border: 1px solid #9ac9fa;
    font-size: 18px;
    padding: 12px;
    width: 100%;    
    float: left;
}
.main-popup .calendar-group {
    background-color: #74bbdf;
    position: relative;
    float: left;
    padding: 0 38px;
}
#pcode_feedback {
    float: left;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    margin-bottom: 15px;
    margin-top: -5px;
    text-align: center;
    width: 100%;
}
.popup_nav {
    color: #fff;
    font-size: 13px;
    left: 8px;
    position: absolute;
    text-transform: uppercase;
    top: 8px;
}

.ui-widget-header .ui-state-disabled {
    opacity: 0;
}

.popupSwich {
    border: 1px solid;
    border-radius: 2px;
    cursor: pointer;
    display: inline-block;
    font-size: 13px;
    margin-top: 60px;
    padding: 7px 20px 9px;
}


.popup_visible .main-popup {
    display: block;
    -webkit-transform: scale(1); 
       -moz-transform: scale(1); 
        -ms-transform: scale(1);
         -o-transform: scale(1);
            transform: scale(1);     
}
.reg-company-btn {
    color: #fff;
    display: block;
    float: none;
    text-align: center;
    cursor: pointer;
    margin: auto;
    padding: 0;
    font-size: 16px !important;
}
.fixpad {
    padding: 15px 90px 15px 65px !important;
}
.form-group {
    margin-bottom: 10px;
    position: relative;
}
.input-group {
    border-collapse: separate;
    display: table;
    float: none;
    margin: 20px auto;
    max-width: 550px;
    position: relative;
    width: 100%;
}
.input-group-addon {
    background-color: #5e97b3;
    border-radius: 2px 0 0 2px;
    color: #fff;
    font-size: 22px;
    font-weight: normal;
    height: 100%;
    line-height: 1;
    padding: 13px 10px;
    position: absolute;
    text-align: center;
    z-index: 999;
}
.input-group .form-control {
    border: 0 none !important;
    float: left;
    margin-bottom: 0;
    position: relative;
    width: 100%;
    z-index: 2;
}
.form-control {
    background-color: #fff;
    border: 0 none;
    border-radius: 2px;
    -moz-box-shadow:  0 1px 1px rgba(0, 0, 0, 0.15) inset;
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15) inset;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15) inset;
    color: #555;
    display: block;
    font-size: 16px;
    padding: 10px 15px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    width: 100%;
}
button.group-submit {
    background-color: #ffca3c;
    color: #fff;
    font-weight: 700;
    float: right; 
    position: absolute; 
    right: 0px; 
    z-index: 99; 
    border: 0 none;
    border-radius: 0px 2px 2px 0px; 
    border-left: 2px solid #74bbdf;
    font-size: 16px; 
    height: 100%; 
    padding: 9px 30px;
    -webkit-transition: all 0.1s ease-out 0s;
    -moz-transition: all 0.1s ease-out 0s;
    -ms-transition: all 0.1s ease-out 0s;
    -o-transition: all 0.1s ease-out 0s;
    transition: all 0.1s ease-out 0s;        
}
button.group-submit:hover {
    background-color: #e2b02b;
}
button.group-submit:disabled {
    background-color: #cad1d5;
    padding: 9px 15px;
    border: 0 none !important;
}

#pcode-err {
    color: #ad0000; 
    font-size: 12px;
    margin: 10px 0;
    width: 100%;
    float: left;
}
#postcode-feedback p {
    color: #179555;
    float: left;
    font-size: 16px;
    font-weight: 400;
    margin: 10px 0;
    width: 100%;
}
.no-ok {
    background-color: #2d96cb;
    color: #fff !important;
    float: left;
    width: 100%;
}
/* Pause, Cancel, Pause all PopUp */
.popUp {
    background-color: #74bbdf;
    color: #fff;
    border-radius: 2px;
    max-width: 450px;
    padding: 30px;
    margin: 10px;
    display: none;
    -webkit-transform: scale(0.8); 
       -moz-transform: scale(0.8); 
        -ms-transform: scale(0.8);
         -o-transform: scale(0.8);
            transform: scale(0.8);     
}
.popUp h3 {
    display: inline-block;
    color: #fff;
    float: left;
    font-size: 26px;
    margin: 10px 0;
    font-weight: 300;
    text-align: left;
    width: 100%;
}
.popUp button {
    font-size: 12px;
    border: 0 none;
    color: #fff;
    margin: 0 5px;
}
.popUp button.no {
    background-color: #eb3939;   
    padding: 6px;
}
.popUp button.yes {
    background-color: #6bb034; 
    padding: 6px 12px;    
}


.popUp span {
    width: 100%;
    float: left;
}
.popup_visible .popUp {
    display: block;
    -webkit-transform: scale(1); 
       -moz-transform: scale(1); 
        -ms-transform: scale(1);
         -o-transform: scale(1);
            transform: scale(1);     
}


#ascrail2001 {
    overflow: hidden;
}
input.error {
    background-color: #fdf5f5 !important;
}
label.error,
form.regular label.error {
    color: #d50000 !important;
    float: right !important;
    font-size: 12px !important;
    height: 15px !important;
}
.err-msg {
    color: #b70000;
    float: left;
    font-size: 12px;
    height: 0;
    position: relative;
    text-align: right;
    width: 100%;   
}
.error-msg {
    color: #b70000;
    font-size: 14px;
    float: left;
    padding: 10px;    
}
.error-msg i {
    background-color: #b70000;
    border-radius: 15px;
    color: #fff;
    margin-right: 3px;
    padding: 1px;
}
.success-msg {
    color: #32ab02;
    float: left;
    font-size: 20px;
    font-weight: 300;
    padding: 8px;
}
.success-msg i {
    background-color: #32ab02;
    border-radius: 15px;
    color: #fff;
    margin-right: 3px;
}

.ns-type-notice {
    background-color: rgba(45, 150, 203, 0.9) !important;
}
.ns-type-error {
    background-color: rgba(204, 0, 0, 0.9) !important;
}
.ns-type-success {
    background-color: rgba(96, 176, 52, 0.9) !important;
}

/* ----------- Check Out ----------- */

.padding-left {
    padding-left: 15px;
}
.padding-right {
    padding-right: 15px;
}


.checkoutArea a {
    color: #086ea2;
}
.cpad-btn {
    float: right;
    padding: 0; 
    display: table-cell;
    margin-top: 30px;
}
.fpadl {
    padding-left: 4px; 
}
.fpadr {
    padding-right: 4px; 
}
.padt {
    padding-top: 40px;
}
.checkoutArea {
    display: table;
    background-color: transparent;
    width: 100%;
}


/*  ----  My Account  ---  */
h2.name {
    font-size: 32px;
    line-height: 32px;
    padding: 10px 0;
}

.calendar {
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    width: 100%;
    max-width: 350px;
    top: 5px;
}
.top-feedback-msg {
    background-color: #5fd0a1;
    border-radius: 3px;
    color: #fff;
    display: block;
    float: left;
    margin-bottom: 25px;
    padding: 30px;
    position: relative;
    width: 100%;
}
.top-feedback-msg span {
    font-size: 32px;    
}
.top-feedback-msg p {
    font-size: 18px;
    font-weight: 300;
    margin: 0;
    padding: 0;
}
.top-feedback-msg ul {
    padding: 0;
    font-size: 16px;
}
.top-feedback-msg-close {
    border: 1px solid #fff;
    border-radius: 30px;
    color: #fff;
    cursor: pointer;
    font-size: 20px;
    position: absolute;
    right: 15px;
    top: 15px;
}
.top-feedback-msg.success {
    background-color: #5fd0a1;   
}
.top-feedback-msg.notice {
    background-color: #4286da;  
}
    

/* Account/Orders */

table.order-manager {
    margin: 0;
    width: 100%;
    font-size: 14px;
    float: left;    
}
table.order-manager thead {
    border-bottom: 2px solid #e8e8e8;
    line-height: 2;
}
table.order-manager tbody {
    
}
table.order-manager tr th, 
table.order-manager tr td {
    padding: 15px 10px;
    text-align: left;
}
tr.order-row {
    border-top: 1px solid #e8e8e8;
}
table.order-manager thead, tr.order-row td:nth-child(1) {
    width: 20%;
}
table.order-manager thead, tr.order-row td:nth-child(2) {
    width: 46%;
}
table.order-manager thead, tr.order-row td:nth-child(3) {
    width: 14%;
}
table.order-manager thead, tr.order-row td:nth-child(4) {
    width: 20%;
}
table.order-manager thead, tr.order-row td:nth-child(5) {
    width: 20%;
}
table.order-manager tr.delivery-day-row td {
    padding: 0 10px 10px;
    font-size: 12px;
}
tr.delivery-day-row td:nth-child(1) {
    width: 20%;
}
tr.delivery-day-row td:nth-child(2) {
    width: 50%;
}
tr.delivery-day-row td:nth-child(3) {
    width: 10%;
}
tr.delivery-day-row td:nth-child(4) {
    width: 20%;
}

tr.order-items {
    background-color: #f3f6fa;
    display: none;
}
table.order-manager tr.order-items td {
    padding: 5px 10px;
    font-size: 12px;
}

tr.order-items td img {
    width: 35px;
    height: 35px;
    border-radius: 99px;
    margin-right: 25px;
}
tr.order-items td ul {
    list-style: none;
    padding: 0;    
    width: 100%;
}
tr.order-items td ul li {
    float: left;    
    list-style: none;    
    padding: 5px;
    min-height: 50px;
}
tr.order-items td ul li:nth-child(1) {
    width: 20%;
}
tr.order-items td ul li:nth-child(2) {
    width: 50%;
}
tr.order-items td ul li:nth-child(3) {
    width: 30%;
}

.status-label span {
    border-radius: 2px;
    color: #fff;
    float: left;
    font-size: 12px;
    font-weight: 500;
    padding: 2px 8px;
    text-align: center;
    width: 100%;
}
.pending {
    background-color: #2d96cb;
}
.delivered {
    background-color: #4c617a;
}
.processing {
    background-color: #6bb034;
}
.today {
    background-color: #6bb034;
}
.cancelled {
    background-color: #d9534f;
}

.order-details-btn {
    cursor: pointer;
    color: #086ea2;
}
ul.order-item-row {
    background-color: #f6f8fa;
    border-bottom: 1px dashed #eee;
    float: left;
    font-size: 14px;
    margin: 0;
    padding: 5px 80px;
    width: 100%;
}
ul.order-item-row img {
    border-radius: 50px;
    height: 35px;
    width: 35px;
}
ul.order-item-row li {
    float: left;
    padding: 10px 25px;
}
ul.order-item-row li:nth-child(1) {
    padding: 0 25px; 
}
ul.order-item-row li:nth-child(2) {
    width: 50%;    
}

.pagination {
    border-radius: 3px;
    display: inline-block;
    margin: 17px 0;
    padding-left: 0;
}
.pagination > li {
    display: inline;
}
.pagination > li > a, .pagination > li > span {
    background-color: #2d96cb;
    border: 0 none;
    color: #ffffff;
    float: left;
    line-height: 1.42857;
    margin-left: -1px;
    padding: 6px 12px;
    position: relative;
    text-decoration: none;
}
.pagination > li:first-child > a, .pagination > li:first-child > span {
    background-clip: padding-box;
    border-bottom-left-radius: 3px;
    border-top-left-radius: 3px;
    margin-left: 0;
}
.pagination > li:last-child > a, .pagination > li:last-child > span {
    border-bottom-right-radius: 3px;
    border-top-right-radius: 3px;
}
.pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus {
    background-color: #2987b7;
}
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    background-color: #2987b7;
    -moz-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.125) inset;
	-webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.125) inset;
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.125) inset;
    color: #ffffff;
    cursor: default;
    z-index: 2;
}



.pull-left {
    float: left;
    width: auto;
}
.bottom-total {
    width: 100%;
    float: left;
    position: relative;
}
.bottom-total p {
    float: left;
    clear: both;
    margin: 0;
}
.bottom-total form {
    float: right;
}


a.btn-wb {
    background-color: #78c4ea;
    border-radius: 2px;
    color: #fff !important;
    float: left;
    font-size: 14px;
    font-weight: 800;
    margin: 10px auto;
    overflow: hidden;
    padding: 12px 40px;
    white-space: nowrap;
    width: auto;
}
a.btn-wb:hover {
    background-color: #2985b3;
    -webkit-transition: all 0.20s ease-out 0s;
    -moz-transition: all 0.20s ease-out 0s;
    -ms-transition: all 0.20s ease-out 0s;
    -o-transition: all 0.20s ease-out 0s;
    transition: all 0.20s ease-out 0s;      
}




/* Calendar */

.ll-skin-nigran {
    width: 100% !important;
    float: left;
}
.ll-skin-nigran .ui-datepicker.ui-datepicker-multi {
    width: 100% !important;
}
.ll-skin-nigran .ui-datepicker-group-middle {
    border-left: 2px dashed rgba(255,255,255,0.2);
    border-right: 2px dashed rgba(255,255,255,0.2);
}
.ll-skin-nigran .ui-widget {
	background: rgba(255,255,255,0.2);
	border: none;
	border-radius: 0;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	box-shadow: 0 none;
    margin: auto;
}
.ll-skin-nigran .ui-datepicker {
	padding: 0;
}
.ll-skin-nigran .ui-datepicker-header {
	border: none;
    border-radius: 0;
	border-bottom: 0 none;
	background: #4c88a6 !important;
	font-weight: normal;
	text-transform: uppercase;
}
.ll-skin-nigran .ui-datepicker-header .ui-state-hover {
	background: transparent;
	border-color: transparent;
	cursor: pointer;
	border-radius: 0;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
}
.ll-skin-nigran .ui-datepicker .ui-datepicker-title {
    margin-bottom: 4px;
    margin-top: 4px;
}
.ll-skin-nigran .ui-datepicker .ui-datepicker-title span {
    font-size: 14px;
    font-weight: 600 !important;
}



.ll-skin-nigran .ui-datepicker .ui-datepicker-prev:before,
.ll-skin-nigran .ui-datepicker .ui-datepicker-next:before {
    color: #fff;
    content: "";
    font-family: "entypo";
    font-size: 24px;
    left: 7px;
    position: absolute;
    top: 0;
    z-index: 999;
}
.ll-skin-nigran .ui-datepicker .ui-datepicker-next:before {
    content: "";
}
.ll-skin-nigran .ui-datepicker .ui-datepicker-prev,
.ll-skin-nigran .ui-datepicker .ui-datepicker-next {
    opacity: 1;
}
.ll-skin-nigran .ui-datepicker .ui-datepicker-prev,
.ll-skin-nigran .ui-datepicker .ui-datepicker-next {
    border: none;
    float: left;
    height: 22px;
    opacity: 1;
    position: relative;
    top: 2px;
    width: 22px;
    z-index: 9; 
}
.ll-skin-nigran .ui-datepicker .ui-datepicker-next {
    float: right;
}
.ll-skin-nigran .ui-datepicker .ui-datepicker-prev.ui-state-disabled:before,
.ll-skin-nigran .ui-datepicker .ui-datepicker-next.ui-state-disabled:before {
    opacity: 0.3;
}
.ll-skin-nigran .ui-datepicker .ui-datepicker-next span,
.ll-skin-nigran .ui-datepicker .ui-datepicker-prev span {
    opacity: 0;
}



.ll-skin-nigran .ui-datepicker table {
	margin: 0;
}
.ll-skin-nigran .ui-datepicker th {
	padding: 15px 0;
	color: #9fd9f1;
	font-size: 8px;
	font-weight: 700;
	text-shadow: 0 0 2px #45c4f8;
	text-transform: uppercase;
	border: none;
	border-top: 0 none;
}
.ll-skin-nigran .ui-datepicker th span {
    font-size: 12px !important;
    font-weight: 500 !important;
}
.ll-skin-nigran .ui-datepicker td {
	border: none;
	padding: 0; 
}

.ll-skin-nigran .ui-datepicker td a::before {
    -webkit-transition: all 0.7s ease;
    transition: all 0.7s ease;        
    opacity: 0;
}
.ll-skin-nigran .ui-datepicker td a.ord {
    background-color: #8cdd88 !important;
    position: relative !important;
} 
.ll-skin-nigran .ui-datepicker td a.ord::before {
    background: #f8f8f8 none repeat scroll 0 0;
    border-radius: 99px;
    color: #363636;
    content: attr(data-content);
    font-size: 9px;
    height: 15px;
    left: -8px;
    padding: 1px;
    position: absolute;
    top: -6px;
    width: 15px;
    z-index: 99;
    opacity: 1;
}
.ll-skin-nigran .ui-datepicker td span {
    font-weight: 500 !important;
}
.ll-skin-nigran .ui-state-highlight, 
.ll-skin-nigran .ui-widget-content .ui-state-highlight, 
.ll-skin-nigran .ui-widget-header .ui-state-highlight {
    background: transparent !important;
}
/* Date available */
.ll-skin-nigran td .ui-state-default {
	background-color: rgba(255, 255, 255, 0.1) !important;
    border: 1px solid rgba(255, 255, 255, 0.5) !important;
	border-radius: 2px;
	text-align: center;
	padding: 4px 0;
	margin: 2px;
	font-weight: normal;
	color: #fff !important;
    font-weight: 700;
    font-size: 12px !important;
}
/* Date unavailable */
.ll-skin-nigran .ui-state-disabled .ui-state-default {
    background-color: transparent !important;
    border: 1px solid transparent !important;
    font-weight: 400 !important;
    opacity: 0.4;
}
/* Date selected */
.ll-skin-nigran .ui-state-highlight a.ui-state-default {
    background-color: #4c88a6 !important;
    border: 1px solid #fff !important;
    border-radius: 2px;
    font-weight: bold !important;
}
ui-state-highlight

/* Date hower */
.ll-skin-nigran a:hover {
    border: 1px solid rgba(255, 255, 255, 1) !important;    
	background-color: rgba(255, 255, 255, 0.3) !important;
}



/* Content */
.content-wrap {
	position: relative;
}
.content-wrap section {
	display: none;
    float: left;
}
.content-wrap section.content-current {
	display: block;
}


/* Login Signup common */
.login-footer {
    border-top: 1px solid #dfe0e6;
    padding-top: 0;
}
.signup-footer {
    border-top: 1px solid #dfe0e6;
    margin-top: 20px;
    padding-top: 0;
}
.agree-line {
    padding-bottom: 20px;
}
.agree-line small {
    font-size: 11px;
    float: right;
    color: #888;
}
.login-link,
.signup-link {
    float: right;
    font-size: 18px;
    margin: 0 12px;
    padding: 7px 14px;
    width: auto;
}
.login-link {
    margin-right: 160px;
}
.login-link form,
.signup-link form {
    float: right;
}
button.no-btn {
    background-color: transparent;
    border-radius: 0;
    color: #6bb034;
    font-size: 18px;
    font-weight: 500;
    padding: 0 5px;
}
button.no-btn:hover {
    background-color: transparent;
}
.signup-link {
    margin: 0;
    padding: 7px 0;
}
.signup-link button.no-btn {
    padding: 0;
    padding-left: 10px;
}
button.login {
    color: #fff;
    border: 0 none;
    border-radius: 3px;
    background-color: #2d96cb;
    float: none;
    margin: 0 auto;
    font-size: 18px;
    padding: 20px 70px;
    width: auto;    
}
button.login:hover {
    background-color: #2886b6;  
}


/* Login tab */
.sm-middle {
    max-width: 450px;
    float: none;
    margin: 0 auto;
}
.sm-middle input {
    padding: 18px;
}
button.fp-link {
    color: #086ea2 !important;
    float: left !important;
    font-size: 14px !important;
    padding: 0 !important;
}


/* Forgotten password tab */
#FPass p {
    float: left;
    font-size: 14px;
    text-align: left;
    width: 100%;
}
#FPass h3 {
    text-align: left;
}



img.field-loading {
    bottom: 12px;
    height: 25px;
    position: absolute;
    right: 80px;
    width: 25px;
    z-index: 99;
}
img.field-loading.sub {
    bottom: 18px; 
    right: 10px;
}

form.regular {
    float: left;
    display: block;
    opacity: 1;
    padding: 0;
    position: relative;
    -webkit-transition: all 0.15s ease-out 0s;
    -moz-transition: all 0.15s ease-out 0s;
    -ms-transition: all 0.15s ease-out 0s;
    -o-transition: all 0.15s ease-out 0s;
    transition: all 0.15s ease-out 0s;   
    width: 100%;    
}

form.regular.hide {
    opacity: 0;
    max-height: 0;
}
form.regular label {
    font-size: 14px;
    float: left;
    width: 100%;
}
form.regular input[type="text"],
form.regular input[type="email"],
form.regular input[type="password"],
form.regular select,
form.regular textarea {
     -webkit-appearance: none;
    border: 1px solid #dfe0e6;
    border-radius: 2px !important;
    -webkit-box-shadow: none !important;
	-moz-box-shadow: none !important;
	box-shadow: none !important;
    float: left;
    font-size: 14px;
    font-weight: 400;
    padding: 12px;
    width: 100%;
}
form.regular input[type="checkbox"], 
form.regular input[type="radio"] {
    margin: 12px 0;
}
form.regular textarea {
    border: 1px solid #dfe0e6;
    border-radius: 2px;
    font-family: "Open Sans",sans-serif;
    font-size: 12px;
}
form.regular input[type="radio"] {
    float: left;  
}
input:-moz-read-only { /* For Firefox */
    border: 1px solid #dfe0e6; !important;
    background-color: #edf2f9;
    cursor: default;
    &:focus {
        outline: none;
    }
}
input:read-only {
    border: 1px solid #dfe0e6; !important;
    background-color: #edf2f9;
    cursor: default;
    &:focus {
        outline: none;
    }
} 
button[disabled], 
html input[disabled],
textarea[disabled] {
    border: 1px solid #edf2f9 !important;
    background-color: #edf2f9; 
}


label.payment {
    width: auto !important;
    float: left !important;
}

table.summary {
    display: block;
    float: left;
    font-size: 12px;
    margin: 20px 0 0;
    width: 100%;
}
table.summary tr {
    float: left;
    width: 100%;
    padding: 4px 0;
}
table.summary tr.total {
    border-top: 1px dashed #e8e8e8;
    font-size: 20px;
    margin-bottom: 30px;
} 
table.summary td {
    float: left;
    width: 50%;
}
td.SumVal {
    text-align: right;
}


.wtb-link {
    font-size: 14px;
}

.billing-tab.hide,
.delivery-tab.hide {
    position: absolute;
    opacity: 0;
    z-index: -999;
    width: 0;
    height: 0;
}
.btn-error {
    background-color: #fdf5f5;
    border-color: #fdf5f5;
    color: #d50000;  
}
.payment-option {
    float: left; 
    width: 100%;  
}
.payment-option h4 {
    float: left; 
    font-size: 16px; 
    padding: 6px 0
}
.payment-option img.logo {
    float: right; 
    height: 35px; 
    padding: 6px;
    width: auto;
}
ul.options {
    display: block;
    float: left;
    margin: 0;
    padding: 0;
    width: 100%;  
}
ul.options li {
    width: 100%;
    float: left;
}
ul.options li img {
    float: left;
    height: auto;
    margin: 4px 12px;
    max-height: 26px;
    max-width: 85px;
    width: 100%;
}
.field-third {
    width: 33.3%;
    float: left;
    padding: 0;
}
.field-third.middle {
    padding: 0 10px;
}
#payment .hide {
    visibility: hidden;
    position: absolute;
    width: 0;
    height: 0;
}
.paymentLogos {
    display: block;
    float: right;
    width: auto;
}
.paymentLogos img {
    float: left;
    height: 25px;
    margin-left: 25px;
    margin-top: 0;
    width: auto;
}

/* Voucher */
.voucher-row {
    margin-top: 15px; 
    border-top: 1px dashed #e8e8e8; 
    padding-top: 15px
}
.voucher {
    margin: 0;
}
.voucher .input-group-addon {
    font-size: 18px;
    padding: 16px 22px;   
    border-radius: 2px 0 0 2px;
}
.voucher input.form-control {
    border: 1px solid #dfe0e6 !important;
    font-weight: bold !important;
    padding-left: 125px !important;
    padding-right: 60px !important;
}
.voucher i.entypo-check {
    color: #7db034;
    font-size: 22px;
    position: absolute;
    right: 5px;
    top: 8px;
    z-index: 999;
    display: none;
}

.__total.reduced {
    font-size: 16px;
    color: #c70000;
    text-decoration: line-through;
    margin-right: 25px;
}


/* Category Slide */
.noResoults {
    color: #c6cedf;
    font-size: 62px;
    font-weight: 200;
    line-height: 64px;
    padding-bottom: 20px;
    padding-top: 100px;
}

/* ----------- Footer ----------- */
#footer {
    background-color: #2d96cb;
    color: #fff;
    display: inline;
    width: 100%;    
    float: left;    
    font-weight: 600;
    overflow: hidden;
    padding: 0;
}
#footer span {
    float: left;
    font-size: 10px;
    margin-left: 15px;
    padding: 11px 0;
}
#footer a {
    color: #fff;
}
#footer ul {
    float: right;
    font-size: 11px;
    margin: 0;
    padding: 6px 0;
    text-transform: uppercase;
}
#footer ul li {
    float: left;
    padding: 4px 16px;
}


/* Polyfiller Shim hack */
.datalist-polyfill {
    z-index: 999999 !important;
}


/*  ---------  MEDIA QUERIES ---------  */


/* 1360 */
@media screen and (max-width: 1360px) {
    .grid__item {
        width: 25%;
    }  
}

/* 1260 */
@media screen and (max-width: 1260px) { 
    .filters ul li a {
        padding: 10px 12px;
    }
    /* Hide drop-down back Filters */
    .item-filters {
        display: none;
    }
}


/*  1200  */
@media screen and (max-width: 1200px) { 
    .signup label {
        width: 100px;
    }
    .signup-field {
        padding-left: 100px;
    }
    .grid__item {
        width: 33.33%;
    }      

}


/*  1100  */
@media screen and (max-width: 1100px) { 
    #screen {
        padding: 130px 20px 40px;
    }
    .single {
        padding: 20px;
    }
    
    /* old */
    .signup label {
        float: left;
        padding: 0;
        position: relative;
        text-align: left;
        width: 100%;
    }
    .signup-field {padding-left: 0px;}
    .signup .require {display: none;}
    .login h2 {margin: 0 0 37px 0 !important }
    .signup label.req:after {top: 0;}

    h2 {font-size: 32px; line-height: 38px;}
}

/* 1030px */
@media screen and (max-width: 1030px) { 
    #footer ul li {padding: 0 8px;}
    
    
}


/* 950px */
@media screen and (max-width: 950px) { 
    body {
        padding: 0;
    }
    #header {
        height: auto;
        margin-top: 60px;
        padding: 0;
    }
    #footer {
        padding: 0;
    }
    #header .logo {
        display: none;
    }
    #header .mainmenu {
        display: none;
    }    
    .filters {
        background-color: transparent;
        padding: 0 25px;
    }
    .filters ul {
        display: none;
    }
    .filters .item-filters {
        display: block;
        padding: 0
    }  
    .cart-header-mobile {
        display: block;
    }
    .cart-header-mobile .mob-button {
        display: block;
    }
    #closeCart {
        display: block;
    }
    .mobilnav {
        display: block;
    }
    
    /* Mobile Grid Layout */
    .owl-carousel {
        display: block !important;
    }    
    .fixedHeight {
        height: auto;
    }  
    .grid__item {
        width: 25%;
    }     
}


/*  950  */
@media screen and (max-width: 950px) { 
    form.login {
        width: 100%
    }
    form.signup {
        width: 100%
    }
    form.signup fieldset {
        border-left: 0; 
        border-top: 1px dashed #e8e8e8
    }
}

/*  795  */
@media screen and (max-width: 795px) { 
    .grid__item {
        width: 33.3%;
    }
}

/*  755  */
@media screen and (max-width: 755px) { 
    form.login {
        width: 50%
    }
    form.signup {
        width: 50%
    }
    form.signup fieldset {
        border-left: 1px dashed #e8e8e8; 
        border-top: 0
    }
    button.login {
        padding: 20px 40px
    }
    .col-3 {
        width: 100%; 
        padding: 30px 0
    }
}


/* 700 */
@media screen and (max-width: 700px) { 
    .single .sright {width: 100%; padding: 0}
    .single .sleft {width: 100%;}
    .sleft a.image-link {float: left;max-width: 40%;}
    .sleft .price-wrap {
        float: left;
        padding: 20px;
        width: 60%;
    }
    .addSingle {
        float: left;
        margin: 0 20px;
    }
    .single h1 {
        font-size: 24px;
    }
}


/* 850px */
@media screen and (max-width: 850px) { 
    .span_1_of_5 {
        width: 23.8%
    }
    .main-popup h3 {
        font-size: 20px;
    }
    #company_input.selected, #pcode_input.selected {
        padding: 0 15px;
    }
    .input-group .group-submit {
        position: relative;
        margin: 10px 0;
        border-radius: 2px;
        padding: 10px 45px !important;
        float: right;
    }
    .fixpad {
        padding: 15px !important;
    }
    .input-group-addon {
        display: none;
    }
    .fs-controls {
        display: none
    }  
    .main-popup .form-group {
        margin: 100px 0;
    }
}


/*  645  */
@media screen and (max-width: 645px) { 
    .padding-left, .padding-right {
        padding: 0;
    }
    #footer {
        position: relative;
        transform: translate(0,0);
    }
    /* old */
    .home-bg {
        margin-bottom: 0;
    }
    li.col-2 {
        width: 100%;
    }    
    #footer ul {
        width: 100%; 
        padding: 20px 0;
    }
    #footer ul li {
        width: 100%;
        text-align: center;
        padding: 10px;
        font-size: 14px;
    } 
    #footer span {
        float: left;
        font-size: 10px;
        margin: 0;
        padding: 11px 0;
        text-align: center;
        width: 100%;
    }
    section.blue {
        padding: 20px;
    }
    section.blue .col {
        width: 50%;
        float: left;
    }
    section.white {
        padding: 20px;
    }
    /* Login & Registration */
    form.regular {
        max-height: none
    }
    .half {
        width: 100%
    }
    .fpadr {
        padding-right: 0
    }
    .fpadl {
        padding-left: 0; 
        padding-top: 10px
    }
    #bAddress {
        height: auto
    }
    section.blue .col:nth-child(3):after {
        content: ""  
    } 
    .main-popup .column {
        padding: 28px 40px
    }
    .main-popup img {
        max-width: 80px
    } 
    .main-popup .border {
        border-right: 0 none;
        border-bottom: 2px dashed rgba(255, 255, 255, 0.3);
    }    
    .ll-skin-nigran .ui-widget {
        max-width: 360px;
        width: 100%;
    }  
    .main-popup h3 {
        margin: 20px 0 10px;
    }
    .grid__item {
        width: 50%;
    }  
}


/* 610 */
@media screen and (max-width: 600px) { 
    .col .price-info {
        display: none
    }
    .col .gfv {
        display: none
    }
}

/* 600 */
@media screen and (max-width: 600px) { 
    #screen {
        padding: 120px 5px 20px
    }
    #screen h1 {
        font-size: 26px
    }
}


/*  570  */
@media screen and (max-width: 570px) { 
    form.login {
        width: 100%
    }
    form.signup {
        width: 100%
    }
    form.signup fieldset {
        border-left: 0; 
        border-top: 1px dashed #e8e8e8
    }
}


/*  530  */
@media screen and (max-width: 530px) { 
    form.regular {
        padding: 5px;
    }
    .cart-header h2 {
        text-align: left;
    }  
}


/* 500 */
@media screen and (max-width: 500px) { 
    #cart .cart-item .label {
        max-width: 115px;
    }
    .main-popup .column {
        padding: 40px;
    }
    .main-popup .column span {
        display: none;
    }    
}


/* 450 */
@media screen and (max-width: 450px) {
    section.blue .col {
        width: 100%;
    }
    section.blue .col:after {
        content: "";    
    }
    .cart-header-mobile .logo img {
        margin: 5px 0 5px 5px;
    }      
    .grid__item .col-footer {
        margin-top: 0;
    }
    .grid__item .col-footer .add {
        width: 48%;
    }    
    .grid__item .col-footer .info {
        width: 48%;
    }    
}


/* 420 */
@media screen and (max-width: 420px) { 
    .single .sright {
        width: 100%; 
        padding: 0;     
    }
    .single .sleft {
        width: 100%;
        margin-top: 20px;
    }
    .sleft a.image-link {
        float: left;
        max-width: 100%;
    }
    .sleft .price-wrap {
        padding: 0;
        width: auto;
    }    
    .addSingle {
        float: right !important;
        margin: 0;
    }   
    a.close-btn {
        top: 8px;
        right: 8px;
    }
}