﻿@charset "utf-8";

html, body {
    /*height: 100%;*/
}

body {
    /*font-family: 'Jost', sans-serif;*/
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 400;
    font-size: 15px;
    color: #414042;
    background-color: #fff;
    margin: 0px;
    padding: 0px;
    background: url(/images/bottom_bg.png) bottom repeat-x #fff;
    /*height: 100vh;*/
}

h1, h2, h3, h4 {
    font-family: 'Jost', sans-serif;
    color: #414042;
    /*margin: 0 0 15px 0;*/
    font-weight: 600;
}

p 
{
    margin: 0 0 10px 0;
    
}
a:link, a:visited {
    color: #bf5f75;
    text-decoration: none;
}

a:hover {
    color: #9e1f63;
    text-decoration: underline;
}

a:active {
    color: #bf5f75;
}
a:focus
{
    outline:0;
}

a img 
{
    border:0px;
    vertical-align:middle;
}

input, textarea, select {
    border:1px solid #4c4f4f;
	background-color: #fff;
	color:#4c4f4f;
	padding:2px;
}
input[type=checkbox], input[type=radio] {
    border: 0;
    float: left;
    margin-right: 10px;
    margin-top: 4px;
}

    input[type=button], input[type=submit], .btn {
        background-color: #27aae0;
        border: 1px solid #1c75bb;
        border-radius: 0px !important;
        color: #fff !important;
        cursor: pointer;
        font-size: 125%;
        font-weight: 700;
        padding: 4px 18px 4px;
        text-align: left;
        font-family: 'Jost', sans-serif;
        text-transform: lowercase;
    }

        input[type=button]:hover, input[type=submit]:hover, input[type=button]:focus, input[type=submit]:focus, .btn:hover {
            background-color: #66c2e7;
            color: #fff !important;
        }

input[type=button].btnGreen, input[type=submit].btnGreen {
    border: 1px solid #009344;
    color: #FFF;
    background-color: #8dc53e;
    position: relative;
    font-family: 'Jost', sans-serif;
}

    input[type=button].btnGreen:hover, input[type=submit].btnGreen:hover, input[type=button].btnGreen:focus, input[type=submit].btnGreen:focus {
        background-color: #afd778;
        color: #fff;
    }

.arrow_box {
    position: relative;
}
.arrow_box:after {
	left: 95%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(108, 189, 69, 0);
	border-left-color: #8dc53e;
	border-width: 24px;
	margin-top: -24px;
}

.btnQuote {
    width: 95%;
}

input[type=image]
{
   border:none;
   background-color:transparent;
   vertical-align:middle;
}


/*####################################*/
#ctl01 
{
    height:100%;
}
.frame {
    position: relative;
    min-height: 100vh;
}
#logo {
    float: left;
    margin: 25px 0 10px 0;
}
.menu_div {
    border: 1px dashed #7c7e81;
    width: 100%;
    padding: 10px 15px;
}
.navbar-default {
    background-color: #414042;
    padding: 5px;
    box-shadow: 0px 6px 12px #888888;
}
.navbar {
    border: none;
    margin-bottom: 0px;
    min-height: 0px;
    position: relative;

}
.navbar-collapse {
    border-top: none;
    box-shadow: none;
    overflow-x: visible;
    padding-left: 0px;
    padding-right: 0px;
}

.navbar-default .navbar-toggle {
    border: none;
}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    background-color: transparent;
    padding: 0;
}

.navbar-toggle {
    background-color: transparent;
    border-radius: 0px;
    margin-bottom: 0px;
    margin-right: 0px;
    margin-top: 0px;
    padding: 0;
}

.navbar-default .navbar-toggle .icon-bar {
    background-color: #fff;
    width: 30px;
    height: 3px;
}
.navbar-default .navbar-toggle:hover .icon-bar, .navbar-default .navbar-toggle:focus .icon-bar {
    background-color: #fff;
}
.main_content {
    margin: auto;
    position: relative;
    padding-bottom: 23rem;
}

.footer_buffer 
{
    clear:both;
    height:140px;
}
.footer 
{
    width:100%;
    position:absolute;
    left:0;
    bottom:0;
    }
.footer_content {
    padding: 15px 0px 0px 0px;
    color: #414042;
    margin-top: auto;
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 23rem;
}

.footer h1 {
	color:#8dc53e !important;
}

.footer a 
{
    color:#fff !important;
}
.footer a:hover 
{
    color:#8dc53e !important;
}

div.menu
{
    overflow:auto;
    display:inline-block;
}

div.menu ul
{
    list-style: none;
    margin: 0px;
    padding: 0px;
    width: auto;
}

div.menu ul li 
{
    float:left;
}
div.menu ul li a, div.menu ul li a:visited, a.menu_link {
    color: #ffffff !important;
    display: block;
    font-size: 95%;
    font-weight: 300;
    padding: 0 12px;
    line-height: 100%;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
    font-family: 'Jost', sans-serif;
}

div.menu ul li a.selected {
    color: #8dc53e;
}
    div.menu ul li a:hover {
        color: #8dc53e !important;
    }

    div.menu ul li a:active {
        color: #8dc53e !important;
        text-decoration: none;
    }

div.menu ul li img.horizontal-separator
{
    /*float:right;
    height:10px;*/
}

div.menu ul li {
    border-right: 1px solid #fff;
}
div.menu ul li:last-child {
    border-right: none;
}
div.menu ul li:first-child a {
    padding-left: 0;
}
div.menu ul li:last-child a {
    padding-right: 0;
}

.horizontal-separator 
{
    margin:0px 10px 0 0;
    vertical-align:middle;
}

#page_title {
    /*text-transform: lowercase;*/
}

.breadcrumbs {
    /*text-transform: lowercase;*/
    color: #8dc53e;
    font-size: 95%;
    margin-top: 15px;
}
.breadcrumbs a {
    color: #4C4F4F;
}
.breadcrumbs a:hover {
    color: #8dc53e;
}

.contentDiv img, .category_intro img {
    max-width: 100%;
    height: auto;
}

.block 
{
   display:block;
}
.font_rounded 
{
	/*font-family: 'Nunito', sans-serif;*/
}
.big 
{
   font-size:140%;
}
.bigger {
    font-size: 200%;
}
.biggest {
    font-size: 250%;
}
.large {
    font-size: 300%;
}
/*.small 
{
   font-size:0.9em;
}*/
.smaller
{
   font-size:0.8em;
}
.smallest 
{
   font-size:0.7em;
}
.float_l 
{
    float:left;
}
.float_r 
{
    float:right;
}
.overflow 
{
    overflow:auto;
}
.clear 
{
    clear:both;    
}
.clear_l
{
    clear:left;    
}
.clear_r
{
    clear:right;    
}

.category_box, .home_box 
{
    margin-bottom: 10px;
    margin-top: 20px;
    text-align: center;
}/*
.category_box div, .product_box > a > div:first-child
{
    width:210px;
    height:235px; 
}*/ 
.category_box img, .product_box img
{
    width: 100%;
    height: auto;
    max-width: 210px; 
    max-height: 235px; 
}
.category_box h2, .product_box h3, .home_box h2  {
    color: #4c4f4f !important;
    font-size: 150%;
    margin-bottom: 6px;
    margin-top: 10px;
    /*text-transform: lowercase;*/
}

.product_list  
{
}

.product_box 
{
    /*width:210px; 
    float:left;
    margin-right:40px;
    margin-bottom:40px;*/
    text-align:center;
    margin-top: 20px;
}

/*.row.product_list {
    display: flex;
    flex-wrap: wrap;
}
.row.product_list > [class*='col-'] {
    display: flex;
    flex-direction: column;
}*/

.category_box a:hover, .product_box a:hover, .category_box a:hover h2, .product_box a:hover h3, .home_box a:hover, .home_box a:hover h2, .home_box a:hover h3 
{
	color: #9e1f63 !important;
    text-decoration: none;
}

.portlet_div_l {
    height: 20px;
}

.product_image {
    background: #fff url(/images/product_bg.png) bottom repeat-x;
    display: block;
    min-height: 235px;
}
.product_desc {
    min-height: 90px;
    padding: 0 5px;
}

/*    
.product_image img 
{
    max-width:210px; 
    max-height:235px; 
}*/
.imgMain {
    /*height:340px;*/
    position: relative;
    /*width: 380px;*/
}

.imgMain img {
    max-width: 100%;
}


/*.product_images 
{
    width:400px; 
    float:left;
    margin-right:60px;
}
.product_details 
{
    width:500px; 
    float:left;
}*/

.product_images h1 {
    /*text-transform: lowercase;*/
}

.product_details h2
{
    border-top:1px solid #4c4f4f;
    padding-top:10px;
    color: #4c4f4f !important;
    font-size: 145%;
    margin-bottom: 10px;
    margin-top: 15px;
    padding-top: 15px;
}
.product_details h2:first-child {
    border-top: none;
    /*padding-top: 0px;
    margin-top: 0px;*/
}
.product_price 
{
    clear: both;
    font-size:1.2em;
    margin-bottom:5px;
    padding-left:40%;
}

.cartContents {
    float: right;
    width: 180px;
    text-transform: lowercase;
    background-color: #4c4f4f;
    padding: 8px 18px;
    color: #fff;
    font-size: 16px;
    font-family: 'Jost', sans-serif;
}
.cartContents a, .cartMessage a
{
    color:#fff !important;
}
.cartEmpty 
{
    display:none;
}
.order_summary, .os_checkout
{
    clear:both;
    margin-bottom:10px;
    border-collapse:collapse;
    width:100%;
    font-size:1.2em;
}
.order_qty {
    max-width: 58px;
    text-align: center;
}

.order_summary th, .os_checkout th {
    border-bottom: 1px solid #cacaca;
    font-size: 0.8em;
}
.order_summary td, .os_checkout td {
    border-bottom: 1px solid #cacaca;
    vertical-align: top;
}
    .order_summary td h4, .os_checkout td h4 {
        margin-bottom: 0;
    }

.cartMessage 
{
    position:absolute;
    top:45px;
    right:0px;
    display:none;
}
.cartMessage img.bubble_point
{
    position:absolute;
    top:-14px;
    left: 50%;
    margin-left: -10px;
}

.cartLoginBox 
{
    float:left;
    width:45%;
    margin:0 10px 0 10px;
    text-align:left;
}
.checkoutFormNarrow
{
    width:60%;
}
.checkoutForm label.auto
{
    width:auto;
}

.checkoutForm input[type=submit]
{
    clear:both;
    float:right;
    margin-bottom: 15px;
}
.checkoutForm input[type=submit].float_l
{
    float:left;
}

.validationSummary 
{
    color:#2b73d7;
    text-align:left;
    clear:both;
}

.requiredField 
{
    margin-top:5px;
    color:#2b73d7;
    float:left;
}
.address_item 
{
    border: 1px solid #cacaca;
    display: inline-block;
    margin-bottom: 15px;
    padding: 15px;
    text-align: left;
    width: 100%;

}

.address_item h3 {
    margin-top: 0;
}
.rbList 
{
    padding:0;
    margin:0;

}
.rbList li
{
    float:left;
    width:50%;
    list-style-type:none;
    padding:0;
    margin:0;
    
}
.rbList li label
{
    clear:none;
    
}

.address_item .rbList li 
{
    width:100%;
}

.address_item label
{
    width:100%;
    
}

.address_item input[type=text], .address_item input[type=password], .address_item textarea
{
    float:left;
    margin-bottom:5px;
    width:95%;
}

.address_item .rbList li label
{
    width:90%;
    
}

.home_content 
{
    clear:both;
    }
    
.text_white, a.text_white {color:#fff;}
.text_green, a.text_green {color:#8dc53e;}
.text_grey, a.text_grey {color:#8c8e9a;}

.text-green, a.text-green   { color: #8dc53e; }
.text-pink, a.text-pink     { color: #bf5f75; }
.text-orange, a.text-orange { color: #F8931D; }
.text-blue, a.text-blue     { color: #01ACF1; }

.bg-green   { background-color: #8dc53e; color: #ffffff; }
.bg-pink    { background-color: #bf5f75; color: #ffffff; }
.bg-yellow  { background-color: #e6b121; color: #ffffff; }
.bg-orange  { background-color: #F8931D; color: #ffffff; }
.bg-blue    { background-color: #01ACF1; color: #ffffff; }
.bg-gradient {
    background: rgb(121,127,129);
    background: linear-gradient(90deg, rgba(121,127,129,1) 0%, rgba(177,180,182,1) 100%);
}

.site_icons 
{
    bottom: 0;
    position: absolute;
    text-align: center;
    width: 100%;
    z-index: 10000000;
    background: rgba(255, 255, 255, 0.75) none repeat scroll 0 0;
}
.site_icons img
{
    margin-top: 15px;
    margin-bottom: 8px;
    width: 43px;
    height: auto;
}
.site_icons h2 {
    color: #4c4f4f;
}
.site_icons a:hover {
    text-decoration: none;
    width: 100%;
}

.site_icons .col-xs-3:first-child a:hover h2 { color: #8dc53e; }
.site_icons .col-xs-3:nth-child(2) a:hover h2 { color: #EC008D; }
.site_icons .col-xs-3:nth-child(3) a:hover h2 { color: #F8931D; }
.site_icons .col-xs-3:last-child a:hover h2 { color: #01ACF1; }

.green_box {
    font-family: 'Jost', sans-serif;
    padding: 2px 5px 3px 8px;
    background-color: #bf5f75;
    background-image: url(/images/fade_small.png);
    background-repeat: repeat-x;
    /*border:3px solid #8dc53e;*/
    color: #fff !important;
}
.green_box a 
{
    color:#fff !important;
}

.Dgreen_box 
{
    padding:2px 5px 2px 5px ;
    background-color:#8dc53e;
    background-image:url(/images/fade_small.png);
    background-repeat:repeat-x;
    border:3px solid #8dc53e;
    color:#fff;
}
.grey_box {
    font-family: 'Jost', sans-serif;
    padding: 2px 5px 2px 5px;
    background-color: #4c4f4f;
    background-image: url(/images/fade_small.png);
    background-repeat: repeat-x;
    border: 3px solid #4c4f4f;
    color: #fff;
}
a.grey_box, .grey_box a
{
    color:#fff !important;
}

.bgAlphaGreen
{
    background-color:rgba(197, 218, 87,0.95);
}

.bgAlphaDGreen
{
    background-color:rgba(108, 189, 69,0.95);
}

.bgAlphaGrey
{
    background-color:rgba(154, 165, 175,0.95);
}

.jumbotron h1, .jumbotron .h1 {
    margin-top: 8px;
}

.container .jumbotron {
    padding-bottom: 0;
}

.header_toolbox {
    float: right;
    position: relative;
    width: 360px;
    z-index: 30000;
}

.header_search {
    float: right;
    position: relative;
    z-index: 30000;
    background-color: #4c4f4f;
    padding: 4px 4px 4px;
    border-right: 2px solid #bf5f75;
}
    .header_search .sField {
        padding: 4px;
        font-family: 'Jost', sans-serif;
    }
    .header_search .btn {
        padding: 4px 8px 6px;
        line-height: 100%;
        float: right;
    }

.login-box {
    background-color: #4c4f4f;
    border-right: 2px solid #bf5f75;
    padding: 8px 13px 8px;
    font-size: 16px;
    font-family: 'Jost', sans-serif;
    display: inline-block;
    text-transform: lowercase;
    width: 180px;
}

#loginLink 
{
    cursor:pointer;
}

input.loginButton{
    /*width: 100%;*/
    text-align: center;
    margin-top: 10px;
}

.basketLink  
{
    font-weight:bold;
}


.noBgImg 
{
    background-image:none;    
}
.colourOption 
{
    display:inline-block;
    width:32%;
    padding:3px 0 3px 0;
}
a.colourOption:link , a.colourOption:hover 
{
    vertical-align:middle;
    text-decoration:none;
	color: #8c8e9a !important;
}

.purchase_table .colourOption {
    width: 100%;
}

.colourSwatch 
{
    display:inline-block;
    width:25px;
    height:25px;
    vertical-align:middle;
    margin-right:10px;
    background-image:url(/images/swatch.png);
}
.eduction_menu 
{
    width:460px;
    height:460px;
    position:relative;
    float:left;
    margin-top:20px;
    cursor:pointer;
}
#schoolLink, #parentLink 
 
{
    position:absolute;
    left:0;
    bottom:0;
    width:444px;
    cursor:pointer;
}
#schoolMenu, #parentMenu
{
    display:none;
}

div.educationMenu ul
{
    list-style: none;
    margin: 0px 0px 40px 0px;
    padding: 0px;
    width: auto;
}
div.educationMenu ul li a, div.educationMenu ul li a:visited
{
    color: #fff;
    padding: 0px 0px 0px 0px;
    text-decoration: none;
    white-space: nowrap;
    display:block;
    font-size:1.4em;
}

div.educationMenu ul li a.selected {
    color: #fff;
}
div.educationMenu ul li a:hover
{
    color: #fff;
    text-decoration: underline;
}
div.educationMenu ul li a:active
{
    color: #fff;
    text-decoration: none;
}
.linkSelected 
{
    color: #4b9c24;
}
.border_top 
{
    border-top:1px solid #cacaca;
}
tr.border_top
{
    border-top:0;
}
tr.border_top td
{
    border-top:1px solid #cacaca;
    padding-top: 5px;
}
.border_bottom 
{
    border-bottom:1px solid #cacaca;
    overflow:auto;
}


.padding_bottom 
{
    padding-bottom:10px;    
    overflow:auto;
}
.panelLoading input {background-color:Gray;}


.loading 
{
    background-color:rgba(255,255,255,0.5);
    text-align:center;
}

.loading_login
{
    width:312px;
    height:100px;
    position:absolute;
    z-index:100001;
}

.loading_login .loading_image
{
    margin-top:45px;
}

.loading_overlay
{
    width:100%;
    height:100%;
    position:fixed;
    z-index:100001;
    left:0;
    top:0;

}

.loading_overlay .loading_image
{
    margin-top:150px;
}

.school_box 
{
    border-top:1px solid #ccc;
    overflow:auto;
    /*padding-top:10px;*/
    padding: 10px 0;
}

.school_image 
{
    float:left;
    width:210px;
    margin-right:40px;
    display:block;
}
.school_image img
{
    max-width:210px;
    max-height:100px;
}

.school_details 
{
    float:left;
    display:block;
}

.find_form 
{
    display: inline-block;
    position: relative;
    width: 100%;
    /*margin-top: 20px;*/
}

.fmsTitle {
    border-bottom: 2px dashed #8dc53e;
    height: 0.62em;
    margin-bottom: 1.4em;
    text-align: center;
    color: #414042 !important;
    text-transform: uppercase;
}
    .fmsTitle:first-line {
        background-color: white;
    }
.schoolLoginButton 
{
    background-color: #CACACA;
    clear: both;
    display: inline-block;
    font-family: 'Jost', sans-serif;
    font-size: 3em;
    padding: 0.3em 1em;
    text-align: center;
    margin-top: 20px;
    }
    
.find_form label
{
    display:inline-block;
    width: 40%;
}
.find_form div.leftCol 
{
    padding-bottom: 10px;
}
.find_form div.rightCol 
{
    padding-bottom: 10px;
}

.find_form input[type=text]
{
    width: 60%;
    font-size:1em;
}
.find_form select
{
    width: 60%;
    font-size: 1em;
}

.find_form input[type=submit] 
{
    width:100%;
    margin-top:10px;
    text-align: center;
    font-family: 'Jost', sans-serif;
    /*text-transform: lowercase;*/
}

.form label
{
    display:inline-block;
    /*width: 40%;*/
    float:left;
    clear:left;
    margin-bottom:5px;
}

label {
    display: unset;
}

.optGroups option 
{
    padding-left:12px !important;    
}
.optGroups option.optGroup
{
    padding-left:3px !important;    
    font-weight:bold !important;
}

.optGroups option[disabled=disabled]
{
    background-color:#ececec;
    padding-left:3px !important;    
    font-weight:bold !important;
}
.validationSummary {
    clear: both;
    color: #bf5f75 !important;
    padding: 20px;
}

.validationItem 
{
    display:inline-block;
    float:left;
    margin-right:5px;
    color:#eb008b;
}

.message 
{
        color:#2b73d7;
}
.margin_bottom 
{
    margin-bottom:10px;
}
.margin_top
{
    margin-top:10px;
}

.overlay 
{
    position:fixed;
    left:0px;
    top:0px;
    text-align:center;
    padding-top:200px;
    width:100%;
    height:100%;
    background-color:#fff;
    /* for IE */
    filter:alpha(opacity=80);
    /* CSS3 standard */
    opacity:0.8;
    z-index:35000;
}

.overlayContent 
{
    padding:20px;
    border:5px solid #4c4f4f;
    position:fixed;
    left: 50%;
    top: 5%;
    width: 40%;
    margin-left:-20%;
    margin-top:0;
    z-index:45001;
    background-color:#fff;
}

#capsMessage 
{
    position:absolute;
    left:-1000px;
    top:-1000px;    
    display:none;
    width:120px;
    z-index:10001;
}

input.quantity{
    width:53px;
    text-align: center;
    margin-right: 10px;
}

.purchase_table
{
    margin-bottom:10px;
}

.purchase_table td
{
    vertical-align:top;
}

    .purchase_table td.col1 { width:15%; }
    .purchase_table td.col2 { width:30%; }
    .purchase_table td.col3 { width:15%; }
    .purchase_table td.col4 { width:10%; }
    .purchase_table td.col5 { width:20%; }
    .purchase_table td.col6 { width:10%; }

.portlet_div 
{
    float:left;
}
.bold 
{
    font-weight:bold;
}

.az 
{
    display: inline-block;
    margin-top: 10px;
    padding: 0;
    }

.az li 
{
    float:left;
    list-style-type:none;    
    padding:0px;
    margin-right:20px;
}
.az li:last-child {
    margin-right: 0;
}
.topImage 
{
    margin: 0 auto;
    width: 960px;
    position: relative;
    z-index: 1000;
    }
    .topImage img 
    {
        position: absolute;
        top: 0;
        z-index: 2000;
    }
    
/*#menu {position:absolute; top:57px; left:0; width:100%; display:none;}
dock styling...*/
/*...centre the dock...*/
#menu div.jqDockWrap {margin:0 auto;}
/*...set the cursor...*/
#menu div.jqDock {cursor:pointer; }
/*#menu .jqDockItem { margin-right: 1.5px !important;}*/
    #menu {background-image:url(/images/white_opaque.png);
    top:-115px;
    left:0;
    position:absolute;
    width:100%;
    height:75px;
    padding:0px 0 42px;
    text-align:center;
    display:none;}
    
.signup_inputbox {
    font-size: 0.8em;
    height: 22px;
    margin: 0 0 8px;
    padding: 0 0 0 2px;
    width: 50%;
    font-family: Arial,Helvetica,sans-serif !important; 
}
.signup_label {
    border: 0 none;
    float: left;
    font-size: 0.8em;
    margin: 5px 0 2px;
    width: 25%;
}

.signup_checkbox input
{
}

.signup_checkbox label
{
    font-size: 0.8em;
}

.signup_checkbox input, .signup_checkbox textarea, .signup_checkbox select { font-family: Arial,Helvetica,sans-serif !important; }

.margRightBtn { margin-right: 235px; }

.errorText { color: #EB008B; font-size: 0.8em; font-weight: bold; float: left; }
.text_red { color: #EB008B; }
.signup_updatingbox { color: #8dc53e; font-weight: bold; }

.bag_image_logo { /*width: 100%;*/ max-width: 100% !important; max-height: 100% !important; }

.fw-img { width: 100%; }
.noPad {
    padding: 0 !important;
}

.padTop0em      { padding-top: 0em; }
.padTop03em     { padding-top: 0.3em;}
.padTop05em     { padding-top: 0.5em;}
.padTop1em      { padding-top: 1em;}
.padTop15em     { padding-top: 1.5em;}
.padTop2em      { padding-top: 2em;}
.padTop25em     { padding-top: 2.5em;}
.padTop3em      { padding-top: 3em;}
.padTop35em     { padding-top: 3.5em;}
.padTop4em      { padding-top: 4em;}

.padLeft0em     { padding-left: 0em;}
.padLeft05em    { padding-left: 0.5em;}
.padLeft1em     { padding-left: 1em;}
.padLeft15em    { padding-left: 1.5em;}
.padLeft2em     { padding-left: 2em;}
.padLeft25em    { padding-left: 2.5em;}
.padLeft3em     { padding-left: 3em;}
.padLeft35em    { padding-left: 3.5em;}
.padLeft9em     { padding-left: 7.5em;}

.padRight0em    { padding-right: 0;}
.padRight05em   { padding-right: 0.5em;}
.padRight1em    { padding-right: 1em;}
.padRight15em   { padding-right: 1.5em;}
.padRight2em    { padding-right: 2em;}
.padRight25em   { padding-right: 2.5em;}
.padRight3em    { padding-right: 3em;}
.padRight35em   { padding-right: 3.5em;}

.padBottom0em   { padding-bottom: 0; }
.padBottom03em  { padding-bottom: 0.3em; }
.padBottom05em  { padding-bottom: 0.5em; }
.padBottom1em   { padding-bottom: 1em; }
.padBottom15em  { padding-bottom: 1.5em; }
.padBottom2em   { padding-bottom: 2em; }
.padBottom25em  { padding-bottom: 2.5em; }
.padBottom3em   { padding-bottom: 3em; }
.padBottom35em  { padding-bottom: 3.5em; }
.padBottom4em   { padding-bottom: 4em; }
.padBottom5em   { padding-bottom: 5em; }

.margTop0em     { margin-top: 0em;}
.margTop05em    { margin-top: 0.5em;}
.margTop1em     { margin-top: 1em;}
.margTop15em    { margin-top: 1.5em;}
.margTop2em     { margin-top: 2em;}
.margTop25em    { margin-top: 2.5em;}
.margTop3em     { margin-top: 3em;}
.margTop35em    { margin-top: 3.5em;}
.margTop4em     { margin-top: 4em;}
.margTop5em     { margin-top: 5em;}
.margTop-8em    { margin-top: -8em;}
.margTop22px    { margin-top:22px;}

.margBottom0em  { margin-bottom: 0 !important;}
.margBottom05em { margin-bottom: 0.5em;}
.margBottom1em  { margin-bottom: 1em;}
.margBottom15em { margin-bottom: 1.5em;}
.margBottom2em  { margin-bottom: 2em;}
.margBottom25em { margin-bottom: 2.5em;}
.margBottom3em  { margin-bottom: 3em;}
.margBottom35em { margin-bottom: 3.5em;}

.margLeft0em    { margin-left: 0 !important; }
.margLeft05em   { margin-left: 0.5em; }
.margLeft1em    { margin-left: 1em; }
.margLeft15em   { margin-left: 1.5em; }
.margLeft2em    { margin-left: 2em; }
.margLeft25em   { margin-left: 2.5em; }
.margLeft3em    { margin-left: 3em; }
.margLeft35em   { margin-left: 3.5em; }

.margRight0em   { margin-right: 0 !important; }
.margRight05em  { margin-right: 0.5em; }
.margRight1em   { margin-right: 1em; }
.margRight15em  { margin-right: 1.5em; }
.margRight2em   { margin-right: 2em; }
.margRight25em  { margin-right: 2.5em; }
.margRight3em   { margin-right: 3em; }
.margRight35em  { margin-right: 3.5em; }

.bar {
    height: 13px;
}

.small-bar {
    height: 4px;
    width:130px;
    margin:auto;
    margin-top: 2em;
    margin-bottom: 2em;
}

.checkbox-wrapper{
    float: right;
}

.checkbox-wrapper input[type=checkbox] { display:none; } /* to hide the checkbox itself */
.checkbox-wrapper input[type=checkbox] + label:before {
    font-family: FontAwesome;
    display: inline-block;
}

.checkbox-wrapper input[type=checkbox] + label:before { content: "\f096"; color: black } /* unchecked icon */
.checkbox-wrapper input[type=checkbox] + label:before { letter-spacing: 10px; } /* space between checkbox and label */

.checkbox-wrapper input[type=checkbox]:checked + label:before { content: "\f046"; color: green} /* checked icon */
.checkbox-wrapper input[type=checkbox]:checked + label:before { letter-spacing: 5px; } /* allow space for check mark */



.control {
  display: block;
  position: relative;
  padding-left: 30px;
  margin-bottom: 15px;
  cursor: pointer;
  font-size: 18px;
  float: right;
}
.control input {
  position: absolute;
  z-index: -1;
  opacity: 0;
}
.control__indicator {
    position: absolute;
    top: 2px;
    left: 0;
    height: 25px;
    width: 25px;

    border: solid 1px #4c4f4f;
    border-radius: 3px;
}

.control:hover input ~ .control__indicator{
  background: #e8e8e8;
}
.control__indicator:after {
  content: '';
  position: absolute;
  display: none;
}
.control input:checked ~ .control__indicator:after {
  display: block;
}
.control--checkbox .control__indicator:after {
    left: 8px;
    top: 2px;
    width: 9px;
    height: 17px;
    border: solid #81bd37;
    border-width: 0 4px 4px 0;
    transform: rotate(45deg);
}
.control--checkbox input:disabled ~ .control__indicator:after {
  border-color: #4c4f4f ;
}

@media (max-width: 1200px) {
    .header_wrap .navbar-header {
        float: none;
    }
    .header_wrap .navbar-left, .navbar-right {
        float: none !important;
    }
    .header_wrap .navbar-toggle {
        display: block;
    }
    .header_wrap .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset;
        overflow: hidden;
    }
    .header_wrap .navbar-fixed-top {
        border-width: 0 0 1px;
        top: 0;
    }
    .header_wrap .navbar-collapse {
        border: none;
        box-shadow: none;
    }
    .header_wrap .navbar-collapse.collapse {
        display: none !important;
        overflow: hidden;
        border: none;
        box-shadow: none;
    }
    .header_wrap .navbar-nav {
        float: none !important;
        margin: 7.5px 0 !important;
        /*width: 100%;*/
        overflow: hidden;
    }
        .header_wrap .navbar {
        clear: both;
    }
    .header_wrap .menu_div {
        clear: both;
        margin: 0px 0;
    }
    .nav > li {
        border-right: medium none !important;
    }
    .navbar-nav > li {
        float: none !important;
    }
    div.menu ul li:first-child a {
        padding-left: 12px;
    }
    .navbar-nav > li > a {
        padding-bottom: 10px;
        padding-top: 10px;
    }
    div.menu ul li a, div.menu ul li a:visited, a.menu_link {
        line-height: 160% !important;
        font-size: 130% !important;
    }
    .header_wrap .collapse.in {
        display: block !important;
    }
    .navbar-nav .open .dropdown-menu {
        background-color: transparent;
        border: 0 none;
        box-shadow: none;
        float: none;
        margin-top: 0;
        position: static;
        text-align: center;
        width: auto;
    }
    .navbar-default .navbar-toggle .icon-bar {
        border-radius: 0;
        display: block;
    }
    .address_item {
        width: 48.8%;
    }
    .checkoutForm .address_item {
        width: 100%;
    }
}

@media only screen and (min-width : 991px) and (max-width : 1200px) {
    .overlayContent {
        left: 41%;
        width: 55%;
    }
}

@media only screen and (min-width : 768px) and (max-width : 991px) {
    .category_box h2, .product_box h3, .home_box h2 {
        font-size: 125%;
        margin-bottom: 0;
    }
    .home_box span {
        font-size: 90%;
        padding: 0;
    }
    .address_item {
        width: 48%;
    }
    .overlayContent {
        left: 35%;
        width: 70%;
    }
}

@media only screen and (max-width : 767px) {
    .coloured-bar .col-xs-3 {
        padding-left: 3px;
        padding-right: 3px;
    }
    .coloured-bar .col-xs-3:first-child {
        padding-left: 15px;
    }
    .coloured-bar .col-xs-3:last-child {
        padding-right: 15px;
    }
    .site_icons h2 {
        font-size: 1.2em;
    }
    .home_box:nth-of-type(odd) {
        clear: left;
    }
    #logo {
        margin: 0px 0 15px;
        position: relative;
        /*z-index: 5000;*/
    }
    .address_item {
        width: 48%;
    }
    .overlayContent {
        left: 35%;
        width: 70%;
    }
    .az{
	    display: inline-block !important;
    }
    .vertical-align {
        display: flex;
        align-items: center;
    }
    .main_content {
        padding-bottom: unset;
    }
    .footer_content {
        height: auto;
        bottom: auto;
        position: relative;
    }
}

@media only screen and (max-width : 573px) {
    #logo {
        margin: 30px auto 20px;
        width: 75%;
        float: none;
        clear: both;
        display: inline-block;
    }
    .header_toolbox {
        width: 100%;
    }
    .cartContents, .login-box {
        width: 50%;
    }
        /*.header_toolbox {
        position: absolute;
        right: 15px;
    }*/
        .header_wrap .navbar {
        clear: both;
    }
    .header_wrap .menu_div {
        clear: both;
        margin: 0px 0;
    }
    .address_item {
        width: 100%;
        margin-right: 0;
    }
    .overlayContent 
    {
        left: 20%;
        width: 100%;
        margin-left:-20%;
        font-size: 80%;
        top: 0%;
    }
    .overlayContent h1 {
        font-size: 130%;
    }

    .overlayContent input[type=button], .overlayContent input[type=submit]  {
        font-size: 100%;
    }

    .arrow_box::after {
        left: 87%;
    }

    .btnQuote {
        width: 87%;
    }

    .site_icons {
        bottom: -57%;
    }
    .footer_content {
        margin-top: 3%;
    }
    .footer_content_home {
        margin-top: 23%;
    }
}

@media only screen and (max-width : 520px) {
    .site_icons img {
        width: 37px;
    }
    .site_icons h2 {
        display: none;
    }
    .site_icons {
        bottom: -36%;
    }
    .footer_content_home {
        margin-top: 15%;
    }
}

@media only screen and (max-width : 420px) {
    .home_box {
        width: 100%;
    }
    #footer a.text-green, #footer a.text-blue, #footer a.text-orange, #footer a.text-pink {
        display: inline-block;
        font-size: 108%;
        margin-top: 12px;
    }
}

/* SIDE CATEGORY MENU */
.side_cat {
    padding: 0;
    list-style: none;
    margin-bottom: 15px;
}

.side_cat > li:first-child {
    margin-top: 15px;
}
.side_cat > li {
    margin-top: 8px;
    float: none;
}

.side_cat > li > a {
    font-size: 150%;
    font-weight: 500;
    /*text-transform: lowercase;*/
    line-height: normal;
    padding: 0;
    font-family: 'Jost', sans-serif;
}

.side_cat > li > ul {
    padding: 0;
    list-style: none;
}

.side_cat > li > ul > li > a {
    color: #4c4f4f;
}

/* banner */
#full-width-slider {
  width: 100%;
}

.fullWidth {
  max-width: 1400px;
  margin: 0 auto 24px;
}



#full-width-slider .bannerLink {
    background-color: rgba(76, 79, 79, 0.85);
    bottom: 0;
    left: 0;
    padding: 20px;
    position: absolute;
    top: 0;
    width: 31%;
}

#full-width-slider .bannerLink > span {
    bottom: 20px;
    color: #fff;
    font-size: 180%;
    font-weight: 400;
    left: 20px;
    line-height: 120%;
    position: absolute;
    font-family: 'Jost', sans-serif;
}

#full-width-slider .bannerLink:hover {
    color: #fff;
    text-decoration: none;
}

#full-width-slider .rsContent {
    height: auto;
}

ul.cardSelection {
    list-style:none;
    padding:0;
    margin:-5px 0 0 0;
}
ul.cardSelection li {
    display:inline-block;
    width: 22%;
    margin: 0 15px 15px 0;
    /* border: solid 1px #e8e8e8; */
    border-radius: 5px;
}

ul.cardSelection li img {
    max-width:100%;
}
ul.cardSelection li label {
    max-width:100%;
    cursor: pointer;
    display: block;
    margin-bottom: 0;
    text-align: center;
}

ul.cardSelection li label img{
    pointer-events: none; /*fix for IE image label*/
}


ul.cardSelection li input[type=radio] {
    display:none;
}

ul.cardSelection li > input + label > img{ /* IMAGE STYLES */
  cursor:pointer;
  border:4px solid transparent;

  -webkit-user-select: none;
-moz-user-select: none;
-o-user-select: none;
-ms-user-select: none;
    user-select: none;
}	

ul.cardSelection li > input:checked + label > img{ /* (RADIO CHECKED) IMAGE STYLES */
    border:2px solid #8dc53e;
    border-radius: 5px;
}

.table-wrapper{
    padding: 30px;
    background: #eaeaea;
    border-radius: 5px;
}

.productToggle > div{
    /* width: 24%; */
    display: inline-block;
    margin-bottom: 30px;
    border-radius: 5px;
    border: solid 1px #4c4f4f;
    margin-right: 5px;
    overflow: hidden;
}

.productToggle > div > div{
    background: #fff;
}

.productToggle h4{
    background: #1f1f1f;
    color: #fff ;
    padding: 15px;
    margin: 0;
    text-align: center;
    font-size: 16px;
}

.productToggleTable{
    margin: 0px 15px 30px 15px;
    background: #fff;
    border-radius: 5px;
    width: 100%;
}

.productToggleTable > tbody{
    padding: 20px;
    display: block;
}

.productToggleTable th{
    padding-bottom: 10px;
}

.ddlPrintColour{
    max-width: -webkit-fit-content;
    max-width: -moz-fit-content;
    max-width: fit-content;
}

@media only screen and (min-width: 1200px) {
    #full-width-slider {
        height: 210px !important;
        width: 100% !important;
    }
    #full-width-slider img.rsImg {
        margin-top: 0px !important;
        margin-left: 0px !important;
        width: 100% !important;
        height: auto !important;
    }
}

@media only screen and (min-width: 991px) and (max-width: 1199px) {
    #full-width-slider {
        height: 272px !important;
        width: 100% !important;
    }
    #full-width-slider .bannerLink > span {
        font-size: 150%;
    }
}

@media only screen and (min-width: 767px) and (max-width: 990px) {
    #full-width-slider {
        height: 210px !important;
        width: 100% !important;
    }
    #full-width-slider .bannerLink > span {
        font-size: 115%;
    }
    .find_form label, .find_form input[type="text"], .find_form select {
        width: 100%;
    }
}

@media only screen and (max-width: 766px) {
    .bannerWrap {
        margin-left: -15px;
        margin-right: -15px;
    }
    #full-width-slider {
        min-height: 130px !important;
        width: 100% !important;
    }
    #full-width-slider .bannerLink {
        width: 44%;
    }
    #full-width-slider .bannerLink > span {
        font-size: 130%;
        bottom: 15px;
        left: 15px;
    }
    #full-width-slider.royalSlider {
        height: auto;
    }
}

@media only screen and (max-width: 580px) 
{
    .order_summary tr th, .os_checkout tr th { display: none !important; }
    .order_summary tbody, .order_summary tr, .os_checkout tbody, .os_checkout tr {
        clear: both !important;
        display: block !important;
        float: left !important;
        width: 100% !important;
    }
    .order_summary td, .os_checkout td { border-top: none !important; }

    .order_summary td:first-child::before { content:"Description"; }
    .order_summary td:nth-child(2)::before { content:"Price"; }
    .order_summary td:nth-child(3)::before { content:"Quantity"; }
    .order_summary td:nth-child(4)::before { content:"VAT"; }
    .order_summary td:nth-child(5)::before { content:"Total"; }
    .order_summary td:nth-child(6)::before { content:"Status"; }

    .order_summary tr:last-child td:first-child, .order_summary tr:last-child td:nth-child(2), .order_summary tr:last-child td:nth-child(3), .order_summary tr:last-child td:nth-child(6) {
        display: none;
    }
    .order_summary tr:last-child td:nth-child(4)::before { content:"VAT Sub total\A Delivery VAT\A VAT total"; white-space:pre; }
    .order_summary tr:last-child td:nth-child(5)::before { content:"Sub total\A Delivery\A Grand total"; white-space:pre; }

    .order_summary td:before, .os_checkout td:before {
        background: none repeat scroll 0 0 rgb(191, 95, 117);
        /*border-bottom: 1px solid #fff;*/
        border-right: 1px solid rgb(191, 95, 117);
        box-sizing: border-box;
        color: #fff;
        display: block;
        font-weight: bold;
        height: 100%;
        left: 0;
        padding: 20px 10px;
        position: absolute;
        text-align: left;
        top: 0;
        width: 40%;
        font-size: 85%;
    }

    .order_summary td, .os_checkout td {
        box-sizing: border-box;
        display: block;
        padding: 20px 20px 20px 45% !important;
        position: relative;
        width: 100%;
    }

    .os_checkout td:first-child { content:""; display: none; }
    .os_checkout td:nth-child(2)::before { content:"Description"; }
    .os_checkout td:nth-child(3)::before { content:"Price"; }
    .os_checkout td:nth-child(4)::before { content:"Quantity"; }
    .os_checkout td:nth-child(5)::before { content:"VAT"; }
    .os_checkout td:nth-child(6)::before { content:"Total"; }

    .os_checkout tr:last-child td:first-child, .os_checkout tr:last-child td:nth-child(2) { display: none; }
    .os_checkout tr:last-child td:nth-child(3)::before { content:"Delivery Sub total"; }
    .os_checkout tr:last-child td:nth-child(4)::before { content:"Quantity total"; }
    .os_checkout tr:last-child td:nth-child(5)::before { content:"VAT Sub total\A Delivery VAT\A VAT total"; white-space:pre; }
    .os_checkout tr:last-child td:nth-child(6)::before { content:"Sub total\A Delivery\A Grand total"; white-space:pre; }

    input[type="button"], input[type="submit"] {
        margin-bottom: 10px;
        /*width: 100%;*/
    }
}

@media only screen and (max-width: 400px) {
    .find_form label, .find_form input[type="text"], .find_form select {
        width: 100%;
    }
}

.navbar-inverse {
    background-color: #fff;
}

#mfPreviewBar { display: none; }

.pagination > td > table > tbody > tr {
    display: inline;
}
.pagination > td {
    border-top: 0px !important;
    padding: 0 !important;
    line-height: 100% !important;
}
.pagination > td > table > tbody > tr > td > a, .pagination > td > table > tbody > tr > td > span {
    background-color: #fff;
    border: 1px solid #ddd;
    float: left;
    line-height: 1.42857;
    margin-left: -1px;
    padding: 6px 12px;
    position: relative;
    text-decoration: none;
}
.pagination > td > table > tbody > tr > td:first-child > a, .pagination > td > table > tbody > tr > td:first-child > span {
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px;
    margin-left: 0;
}
.pagination > td > table > tbody > tr > td:last-child > a, .pagination > td > table > tbody > tr > td:last-child > span {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
}
.pagination > td > table > tbody > tr > td > a:hover, .pagination > td > table > tbody > tr > td > span:hover, .pagination > td > table > tbody > tr > td > a:focus, .pagination > td > table > tbody > tr > td > span:focus {
    background-color: #eee;
    border-color: #ddd;
    color: #23527c;
}

.leaversLogo {
    border: 1px solid #4c4f4f;
    border-radius: 25px 25px 0 25px;
    position:relative;
    margin-bottom: 1em;
    padding-bottom: 5px;
    text-align: center;
}

.leaversLogo.selected, .leaversLogo.selected-back {
    border: 1px solid #8dc53e;
}

.leaversLogo div img, .leaversLogo div {
    border-radius:25px;
}

.leaversLogo .logoNumber {
    position:absolute;
    bottom:-1px;
    right:-1px;
    background-color:#4c4f4f;
    border-top-left-radius:28px;
    width:28px;
    height:28px;
    text-align:center;
    padding:6px 0 0 3px;
    color:#fff;
}

.leaversLogo.selected .logoNumber,.leaversLogo.selected-back .logoNumber {
    background-color:#8dc53e;
}

.leaversLogos label input {
    float:none;
    margin-right:0;
}

.leaversLogos label{
    display: block;
}

.zoomHover {
    cursor:zoom-in;
}

.input-group[class*="col-"] {
    float: left;
}

.form-control-label {
    margin-top: 5px;
}

.grey-box {
    background-color: #e7e7e9;
    color: red;
    font-size: 20px;
    max-width: 65%;
    padding-bottom: 5px;
    padding-left: 18px;
    padding-top: 5px;
}

ul.no_bullet {
list-style-type: none;
padding: 0;
margin: 0;
}

li.green-arrow {
    background: rgba(0, 0, 0, 0) url(/images/green-arrow-tick.png) no-repeat scroll left center;
    padding-left: 18px;
}

.btn-primary{
    background: #81bd37;
    color: #ffffff;
    font-weight: 700;
    border: none;
    border-radius: 5px;
    padding: 8px 15px;
    border: solid 1px #81bd37!important;
}

.btn-primary:hover{
    background: #fff;
    color: #81bd37!important;
    border: solid 1px #81bd37!important;
}

.btn-green {
    background: #8dc541 none repeat scroll 0 0;
    border-radius: 28px;
    color: #ffffff;
    font-family: Arial;
    font-size: 16px;
    font-weight: bold;
    max-width: 160px;
    padding: 10px 20px;
    text-decoration: none;
}
a.btn-green {
    color: #ffffff;
}

.btn-green:hover {
  background: #8dc541;
  text-decoration: none;
}

.borderbottomgreen {border-bottom:13px solid #8dc53e!important; margin-bottom:10px;}
.border-top-dash {
    border-top: 1px dashed #8dc53e;
}
.border-right {
    border-right: 1px dotted #a7a9ac;
}

.quickquotetext{padding-top: 8px;}
.textbold {font-weight:bold!important;}

.rsLink {
    background: rgba(0, 0, 0, 0) url("blank.gif") repeat scroll 0 0;
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 20;
}

.text_green{ color: #8dc53e; }
.signup_updatingbox { color: #01ACF1; font-weight: bold; }

.reqQuoteMain
{
    background-color:#ffffff; /*'#f3f9eb;*/
    /*color:#6f9c30;*/
    padding:5px;
    padding-bottom:25px;
}

    .reqQuoteMain h1 {
        font-family: 'Jost', sans-serif;
        font-size: 3em;
        font-weight: bold;
    }

    .reqQuoteMain body {
        font-family: 'Jost', sans-serif;
        font-size: medium;
    }

.reqQuoteMain .signup_inputbox {
    font-family: Arial,Helvetica,sans-serif !important;
    font-size: 0.9em;
    height: 22px;
    margin: 0 0 8px;
    padding: 0 0 0 2px;
    width: 40%;
}

.reqQuoteMain .signup_checkbox {
    font-family: Arial,Helvetica,sans-serif !important;
    font-size: 1.0em;
}

.reqQuoteMain .signup_label {
    border: 0 none;
    float: left;
    font-size: 0.9em;
    margin: 5px 15px 2px;
    width: 25%;
}

.reqQuoteMain .margRightBtn {
    margin-right: 180px;
}

.reqQuoteMain .marTopMinus{
    margin-top: -43px;
}
.reqQuoteMain .whiteborder{
    border: 1px solid white !important;
}
.reqQuoteMain .left {float:left;}

.text_right {
    text-align:right;
    padding-right:25px;
}

.font5 {
    font-size:5em !important;
}

.center{text-align:center;}

.text-green{
    color: #8dc53e!important;
    font-weight: 700;
}

h2.step-header{
    color: #4c4f4f!important;
    font-weight: 400;
    font-size: 26px;
    margin-bottom: 30px;
    font-family: 'Jost', sans-serif;
}

h2.step-header .text-green{
    font-weight: 400!important;
}

.leavers-panel p{
    font-size: 16px;
}

.leavers-panel p strong{
    font-weight: 400;
    font-family: 'Jost', sans-serif;
}

.leavers-panel::after{
    content: "";
    width: 100%;
    height: 1px;
    border-bottom: solid 1px #e8e8e8;
    margin: 30px 0;
    display: block;
}

.preview-image{
    padding: 0;
}