div[class*="col-"]:first-child {
    padding-left: 10px;
}

.wide div[class*="col-"]:first-child {
    padding-left: 15px;
}

#top {
    background: #e7e7e7;
    color: #333;
    
}

#top > div {
    color: #333;
    padding: 8px;
}

#top > div a,
#logindiv span  {
    text-decoration: none;
    color: #333 !important;
}

#logindiv .cart-summary a.btn {
    padding-left: 7px;
    padding-right: 7px;
}

#logindiv .cart-summary a.btn:hover {
    color: #fff !important;
}

#top .fa,
#top .fab {
    font-size: 13px;
    margin-right: 3px;
}

#top .fa-phone {
    transform: rotate(90deg);
}

#topmenu > a,
#logindiv.my-menu > ul > li > a {
    border-color: #333;
}

#header {
    background: #fff;
    margin-top: 35px;
}

#header > div .search-etc,
#header > div .logo-etc {
    vertical-align: middle;
}

.my-menu ul li:hover > a {
    border-left-width: 1px !important;
}

nav {
    height: 50px;
    background-color: #0061AA;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#0b39a5+0,0061aa+40,0061aa+52,0061aa+52,0061aa+52,0061aa+52,0061aa+63,0b39a5+100 */
background: #0b39a5; /* Old browsers */
background: -moz-linear-gradient(left, #0b39a5 0%, #0061aa 40%, #0061aa 52%, #0061aa 52%, #0061aa 52%, #0061aa 52%, #0061aa 63%, #0b39a5 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #0b39a5 0%,#0061aa 40%,#0061aa 52%,#0061aa 52%,#0061aa 52%,#0061aa 52%,#0061aa 63%,#0b39a5 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #0b39a5 0%,#0061aa 40%,#0061aa 52%,#0061aa 52%,#0061aa 52%,#0061aa 52%,#0061aa 63%,#0b39a5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0b39a5', endColorstr='#0b39a5',GradientType=1 ); /* IE6-9 */
}

nav > div {
    padding: 0 8px;
}

nav .my-menu > ul {
    height: 50px;
    padding: 0;
}

nav .my-menu ul li {
    border-radius: 0 !important;
}

nav .my-menu > ul > li > a {
    position: relative;
    font-size: 16px;
    line-height: 50px;
    height: 50px;
}

.my-menu ul ul.full-width {
    top: 50px;
    margin: 0;
}

.sub-nav {
    background-color: #F9E90D;
    padding: 0 8px;
}

.sub-nav > div {
    max-width: 800px;
    margin: 0 auto;
}

.sub-nav ul {
    list-style: none;
    padding: 7px 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    min-height: 49px;
}

.sub-nav ul > li > a {
    font-size: 16px;
	font-weight: bold;
    color: #0061AA;
    text-decoration: none;
}

.sub-nav ul > li > a:hover {
	color: #333;
}

#main {
    background: #fff;
    padding: 15px 10px 0;
}

.promotext {
    font-size: 15px;
    margin: 0 !important;
    position: absolute;
    left: auto !important;
    right: -7px !important;
    top: -1px !important;
    height: 30px;
    line-height: 30px;
    font-weight: 600;
    color: navy;
	background-color: #F9E90D !important;
    padding: 0 8px 0 0 !important;
    border-radius: 0 !important;
    z-index: 10;
}

.prodetail_box2 .promotext {
    right: auto !important;
    left: -130px !important;
    top: 37px !important;
}

.promotext:before {
    content: '';
    width: 0;
    height: 0;
    border-right: 22px solid #F9E90D;
    border-bottom: 30px solid transparent;
    position: absolute;
    top: 0;
    left: -22px;
}

.promotext:after {
    content: '';
    width: 0;
    height: 0;
    border-top: 6px solid #b4b41b;
    border-right: 5px solid transparent;
    border-left: 2px solid transparent;
    position: absolute;
    right: 1px;
    bottom: -6px;
}

.alt-prod-list {
    margin-right: -200px;
}

.alt-prod-list section.block header {
    background-color: transparent;
    color: #000;
    font-size: 24px;
    font-weight: 700;
    padding: 25px 0 5px;
    border-radius: 0;
    text-align: left;
}

.alt-prod-list .featured-product-list .product-list-item {
    width: 24.222%;
}

.prodetail_image2 {
    width: 35%;
    padding: 10px 0 0;
}

.prodetail_box2 {
    width: 62%;
    padding: 0 200px 0 10px;
    position: relative;
}

.prodetail_box2 > h2 {
    font-weight: 800;
    margin: 5px 0 20px;
}

.prodetail_box2_right {
    position: absolute;
    right: 0;
    top: 0;
}

.prodetail_box2_left ul,
#tabAttachments ul {
    list-style: none;
    padding: 0;
    margin: 20px 0;
}

#tabAttachments ul {
    margin: 0 50px 0 0;
}

.prodetail_box2_left ul li,
#tabAttachments ul li {
    font-size: 14px;
    line-height: 20px;
    margin: 0 0 10px;
    position: relative;
    padding: 0 0 0 20px;
    background: url(/images2/arrow-icon.png) no-repeat scroll left 3px;
    background-size: 16px auto;
    text-align: left;
}

.prodetail_box2 .price-discount {
    height: auto;
}

div.icons {
    position: absolute;
    left: 5px;
    top: 5px;
    margin: 0 !important;
    text-align: left;
}

div.icons > span {
    padding: 0;
    display: block;
    margin: 0 0 5px;
}

.prodiconstrip div.icons {
    position: static;
    margin: 15px 0 0 !important;
}

.prodiconstrip div.icons > span {
    display: inline-block;
    margin: 0 3px 5px 0;
    vertical-align: middle;
}

.product-list-list-view .product-list-item {
    overflow: visible;
    float: left;
}

.product-list-list-view .product-list-item .cboVariant {
    width: 200px;
    margin: 5px 0 0;
}

.product-list-list-view .product-list-item:after,
.product-list-list-view .product-list-item:before {
    display: table;
    content: " ";
}

.product-list-list-view .product-list-item:after {
    clear: both;
}

div.prods-nav {
    width: 235px;
}

div.prods-list {
    margin-left: 255px;
}

section.block header {
    border-radius: 0;
    padding: 14px 10px;
    font-size: 16px;
    background-color: #ccc;
    color: #000 !important;
    font-weight: normal;
}

#navCats section.block .block-content {
    padding: 0px;
    border: #ddd 1px solid;
}

#navCats ul li a {
    padding: 13px 20px;
}

#navCats .block-content div {
    padding: 13px 15px 0;
}

#navCats .product-filter {
    border-bottom: #ddd 1px solid;
}

#navCats .product-filter ul {
    max-height: 364px;
    overflow: auto;
    margin-right: -15px;
    padding: 0 15px 13px 0;
}

.product-filter > ul > li > label {

    margin-left: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-left: 16px;
    padding-right: 4px;
}

#navCats .product-filter:last-of-type {
    border-bottom: 0 none;
}

.overflow-hide {
    overflow: hidden;
}

.breadcrumbs, .breadcrumbs a {
    font-size: 11px;
    font-weight: 600;
}

.breadcrumbs a:not(.btn) {
    text-decoration: none !important;
}

.breadcrumbs a:hover:not(.btn) {
    text-decoration: underline !important;
}

.breadcrumbs {
    color: #666;
}

.breadcrumbs ul li:not(:first-child)::before {
    content: "/\00a0";
    margin: 0 5px 0 0;
}

.breadcrumbs ul li {
    padding: 0 5px;
}

.breadcrumbs ul li:first-child {
    padding-left: 0;
}

@media (max-width: 1199px) and (min-width: 900px) {
.alt-prod-list .featured-product-list .product-list-item {
    width: 32.666% !important;
}
}

@media (max-width: 899px) {
.alt-prod-list .featured-product-list .product-list-item {
    width: 49% !important;
}
}

footer > div {
    max-width: none;
    padding: 0;
}

footer {
    background: #0061AA;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#0b39a5+0,0061aa+40,0061aa+52,0061aa+52,0061aa+52,0061aa+52,0061aa+63,0b39a5+100 */
background: #0b39a5; /* Old browsers */
background: -moz-linear-gradient(left, #0b39a5 0%, #0061aa 40%, #0061aa 52%, #0061aa 52%, #0061aa 52%, #0061aa 52%, #0061aa 63%, #0b39a5 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #0b39a5 0%,#0061aa 40%,#0061aa 52%,#0061aa 52%,#0061aa 52%,#0061aa 52%,#0061aa 63%,#0b39a5 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #0b39a5 0%,#0061aa 40%,#0061aa 52%,#0061aa 52%,#0061aa 52%,#0061aa 52%,#0061aa 63%,#0b39a5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0b39a5', endColorstr='#0b39a5',GradientType=1 ); /* IE6-9 */
}

.footer-top {
    background-color: #F9E90D;
    border-bottom: #0061AA 2px solid;
    padding: 20px 0;
}

.footer-top > div {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 10px;
}

.footer-top .fas,
.footer-top .fa {
    font-size: 46px;
    float: left;
    color: #000;
}

.footer-top img {
    float: left;
    width: 55px;
    height: auto;
}

.icon-text-block {
    float: left;
    width: calc(100% - 65px);
}

.footer-top h3 {
    margin: 0 0 0 15px;
    font-size: 16px;
    color: #222;
}

.footer-top p {
    margin: 3px 0 0 15px;
    font-size: 13px;
    color: rgba(0,0,0,0.6);
}

.sub-nav-footer {
    display: none !important;
}

.middle-footer {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px 10px 25px;
}

.middle-footer h3 {
    margin: 5px 0 16px;
}

.middle-footer p {
    font-size: 14px;
}

.middle-footer div[class*="col-"]:first-child {
    padding-left: 10px;
}

.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li {
    line-height: 25px;
}

.footer-links li a {
    font-size: 14px;
}

.copy-info > div {
    padding: 12px 10px;
    font-size: 13px;
    color: rgba(255,255,255,0.6);
    text-align: right;
    max-width: 1200px;
    margin: 0 auto;
}

.copy-info > div a {
    color: rgba(255,255,255,1);
}

.payment {
    padding: 15px 0;
}

.payment img {
    max-width: 60%;
}

.footer-social p {
    color: #fff;
    margin: 0 0 5px;
}

.footer-social a {
    color: #fff;
    font-size: 28px;
    margin: 0 0 0 5px;
}

.inline-img-holder {
    margin: 3px 0 20px 30px;
}

.pull-left {
    float: left;
}

.pull-right {
    float: right;
}

.articles .pg_nav {
    width: 250px;
    margin-right: 10px;
}

.ul-articles {
    list-style: none;
    padding: 0;
    margin: 0;
    border: #ddd 1px solid;
}

.ul-articles li a {
    display: block;
    font-size: 14px;
    padding: 13px 20px;
    border-bottom: #ddd 1px solid;
    color: #000;
}

.ul-articles li:last-child a {
    border-bottom: 0 none;
}

.ul-articles li a:hover {
    background: rgba(0,0,0,0.05);
}

.articles .search input[type=text] {
    padding: 0 7px;
    height: 36px;
    margin: 0 2px 0 5px;
    width: 190px;
}

.btn-add-to-cart {
    padding: 1px 3px 2px !important;
}

#top .fa,
#top .fab,
.breadcrumbs,
.breadcrumbs a,
.ul-articles li a:hover,
#main-buttons .icon-background,
.product-list-item .price,
.prodetail_box2 .price {
    color: #0061AA;
}

.promotext,
.copy-info,
input.btn-qty-up,
input.btn-qty-down,
#header > div #search button,
.btn {
    background-color: #0061AA;
	
}

.copy-info {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#0b39a5+0,0061aa+40,0061aa+52,0061aa+52,0061aa+52,0061aa+52,0061aa+63,0b39a5+100 */
background: #0b39a5; /* Old browsers */
background: -moz-linear-gradient(left, #0b39a5 0%, #0061aa 40%, #0061aa 52%, #0061aa 52%, #0061aa 52%, #0061aa 52%, #0061aa 63%, #0b39a5 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #0b39a5 0%,#0061aa 40%,#0061aa 52%,#0061aa 52%,#0061aa 52%,#0061aa 52%,#0061aa 63%,#0b39a5 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #0b39a5 0%,#0061aa 40%,#0061aa 52%,#0061aa 52%,#0061aa 52%,#0061aa 52%,#0061aa 63%,#0b39a5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0b39a5', endColorstr='#0b39a5',GradientType=1 ); /* IE6-9 */
}



.btn {
    color: #fff;
}

a.btn, input.btn {
    border: 2px solid #0061AA;
    color: #0061AA !important;
    background-color: transparent;
}

a.btn:hover, input.btn:hover {
    background-color: #0061AA;
    color: #fff !important;
}

input.btn-qty-up,
input.btn-qty-down {
    background-color: #0061AA !important;
	color: #fff !important;
}

.product-list-item input.qty,
.prodetail_box2 input.qty {
    border-color: #0061AA;
}

.nonmember-price-label,
.member-price-label {
    color: #000;
}

.my-menu ul ul.full-width a:hover {
    background-color: #f0f0f0;
}

.sub-cats-2levels h3 a {
    color: #0061AA !important;
}

nav .my-menu ul .subcats a {
    font-size: 16px;
}

.topic-tile,
.service-tile {
    height: 184px;
}

.service-tile h3,
.topic-tile h3 {
    margin-bottom: 10px;
}

.service-tile {
    width: 19%;
}

.service-tile b {
    max-height: 90px;
}

.service-tile:nth-child(3n+1) {
    margin-left: 1%;
}

.service-tile:nth-child(5n+1) {
    margin-left: 0;
}

.contact-wrap {
    position: relative;
}

.contact-wrap p {
    color: #666;
    font-size :14px;
    line-height: 22px;
}

.contact-wrap p a {
    color: #2ea3f2;
}

.contact-wrap .location-btn {
    position: absolute;
    right: 0;
    top: 0;
}

@media (max-width: 767px) {
.sub-nav div {
    margin-left: 30px; 
}

nav, nav .my-menu > ul {
    height: auto;
}

nav .my-menu > ul {
    display: block;
}

#top > div #logindiv {
    margin: 0;
}

.featured-product-list .product-list-item {
    width: 49%;
    margin-left: 0;
}

.featured-product-list .product-list-item:nth-child(n+1) {
    margin-left: 1%;
}

#header {
    position: relative;
    border-bottom: 1px solid #ddd;
    padding: 0;
    margin: 0;
 }

#header .top-btns {
    position: absolute;
    top: 33px;
    right: 20px;
    float: none !important;
    width: auto !important;
    margin: 0 !important;
    text-align: right;
}

#header > div .logo-etc,
#header > div .search-etc {
    float: none;
    width: auto;
    text-align: left !important;
    margin: 0 !important;
}

#header > div .logo-etc a.logo {
    padding: 0; 
    float: none;
    text-align: left;
    margin: 0;
}

.top-btns > a {
    color: #0061AA !important;
    font-size: 18px;
    margin-left: 5px;
}

.logo-etc .logo img {
    width: 200px;
}

#header > div .search-etc {
    padding: 0;
    margin: 0;
}

#header > div .search-etc  #search {
    margin: 10px 0;
}

.my-menu ul ul.full-width,
.product-list-tableitem td.c_unit,
.product-list-tableitem .c_code,
.product-list-tableitem .c_addtoord .btn span,
.footer-top {
    display: none !important;
}

div.choose-account {
    position: relative;
    margin: 0 0 5px;
}

#header > div .search-etc > div {
    margin: 0;
}

.my-menu ul li.xhoveringcartbtn {
    position: relative;
}

.my-menu ul li.xhoveringcartbtn ul {
    position: absolute !important;
    width: 210px;
    right: auto;
    left: 0;
}

nav .my-menu > ul > li > a {
    border-left: 0 none;
}

#main {
    padding-left: 15px;
    padding-right: 15px;
}

.sub-nav ul > li {
    flex: 0 50%;
    margin: 0 0 10px;
}

.sub-nav ul {
    padding: 10px 0 0;
}

.copy-info > div {
    text-align: center;
}

footer .footer-col:last-child {
    width: auto;
}

.footer-links {
    padding: 0 0 30px;
}

.product-list-grid-view .promotext, .featured-product-list .promotext {
    top: 25px;
}

div.prods-nav {
    width: auto;
}

.inline-img-holder {
    margin: 0 0 20px;
}

.inline-img-holder img {
    width: 100%;
}

.prodetail_box2 {
    position: static;
    text-align: left !important;
    padding: 0;
}

.prodetail_box2_right {
    position: static;
}

.prodetail_box2 .prices,
.prodetail_box2 .add-to-ord {
    text-align: left;
}

.prodetail_box2 .promotext {
    right: -5px !important;
    left: auto;
    top: 88px !important;
}

#MPMain_CtlProduct1_pnlProductFields {
    position: relative;
}

.alt-prod-list {
    margin-right: 0;
}
}

#main-buttons span.fa-2x { font-size: 1.5em; }

.branch-details {
    border: 0 none;
    text-align: center;
    margin: 0;
    border-radius: 4px;
    box-shadow: 0px 12px 18px -6px rgba(34,56,101,0.12);
    padding: 112px 30px 65px;
    position: relative;
    min-height: 332px;
}

.branch-logo {
    position: absolute;
    left: 30px;
    right: 30px;
    top: 15px;
    text-align: center;
    max-width: none;
    float: none;
    background: url(images/store-logo.svg) no-repeat scroll center;
    background-size: auto 80px;
    height: 150px;
    text-indent: -9999px;
}

.branchname {
    font-size: 22px;
    line-height: 54px;
    color: #0061aa;
}

.branch-details-button {
    margin: 0;
    position: absolute;
    left: 30px;
    right: 30px;
    bottom: -25px;
    text-align: center;
}

.branch-details-button .btn {
    color: #F9E90D !important;
    border-radius: 26px;
    background-color: #0061AA;
    padding: 0 30px;
    height: 52px;
    line-height: 48px;
    font-weight: 600;
}

.branch-address a {
    color: #0061aa;
}

.postcode-search input[type="text"] {
    height: 36px;
    margin: 0 5px 0 0;
}

.storelist .row {
    display: block;
    margin: 0;
}

.storelist .col-md-4 {
    display: flex;
    flex-wrap: wrap;
    margin-left: -15px;
    margin-right: -15px;
    flex: 1;
    max-width: none;
    padding: 0;
    width: auto;
}

.storelist .col-md-4 > div {
    padding-left: 15px;
    padding-right: 15px;
    width: 100%;
}

.branch-details {
    border: 1px solid rgba(0,0,0,0.1);
    border-radius: 4px;
    margin: 0 0 60px;
}

.branch-details .d-flex {
    padding: 10px 15px;
}

.branch-logo {
    display: flex;
    align-items: center;
    justify-content: center; 
}

.branch-photo {
    width: 40px;
    height: 40px;
    margin: 0 10px 0 0;
    border-radius: 50%;
    overflow: hidden;
    position: relative;
    flex-shrink: 0;
}

.branch-photo img {
    width: auto;
    height: 100%;
    position: absolute;
    top: -9999px;
    right: -9999px;
    bottom: -9999px;
    left: -9999px;
    margin: auto;
}

.branch-address {
    flex: 1;
    font-size: 13px;
    font-weight: 400;
}

.branch-details-button {
    padding: 15px 0 0;
}

@media (min-width: 768px) {
.storelist .col-md-4 > div {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
}
    
.branch-address {
    min-height: 186px;
}
}