/* extra small, for mobiles */
@media (max-width: 767px) {
    header {
        position: static !important;
    }
    h1 {
        font-size: 200%;
    }
    .offcanvasbody {
        margin-top: 50px;
    }
    .offcanvasbody #header {
        position: fixed;
        top: 0;
        box-shadow: 0 1px 2px rgba(0,0,0,0.2);
    }
    .offcanvasbody .navbar-offcanvas {
        position: fixed !important;
        z-index:1000;
        height: 100% !important;
    }
    #header {
        background: #ee1e26;
    }
    #header .logo {
        margin: 5px 100px;
        text-align: center;
    }
    #header .logo img {
        max-height: 40px;
        width: auto;
    }
    #header .searchbox {
        padding-top: 5px;
        padding-bottom: 5px;
    }
    #header #basketsummary {
        float: left;
        width: 100%;
        text-align: center;
        padding-top: 5px;
        padding-bottom: 10px;
    }
    #header .mobile-menu {
        position: absolute;
        top: 8px;
        left: 0;
        z-index: 2;
    }
    .search {
        width: 100%;
    }
    .mobile-search {
        position: absolute;
        right: 45px;
        top: 8px;
        z-index: 2;
    }
    .mobile-search-container {
        display: none;
        width: 100%;
        position: relative;
        left: 0;
        top: 0;
        z-index: 996;
    }
    .offcanvasbody .mobile-search-container {
        position: fixed;
        box-shadow: 0 1px 2px rgba(0,0,0,0.2);
    }
    .mobile-search a, .mobile-basket a{
        margin: 0 5px;
    }
    .searchbox{
        padding-top: 0;
        padding-bottom: 0;
    }
    .search {
        height: 46px;
        border-bottom: 1px solid #DDD;
    }
    .search .keyword {
        height: 46px;
        font-size: 120%;
    }
    .search .submit {
        top: 10px;
        right: 10px;
    }
    #breadcrumb {
        margin: 5px 0;
        height: auto;
    }
    #breadcrumb span a {
        background: #EEE;
        padding: 5px 10px;
        font-size: 110%;
        border-radius: 8px;
        white-space: nowrap;
    }
    .mobile-basket {
        position: absolute;
        right: 0;
        top: 8px;
        z-index: 2;
    }
    .menu-icon {
        display: block !important;
        opacity: 1;
        background: none;
        border: none;
        z-index: 999;
        margin: 0 5px !important;
        outline: 0;
    }
    .homechangercontainer.homechangercontainer-v2{
        display: block;
    }
    .homechangerbox, .categoryoverlaybox {
        position: relative !important;
        top: auto !important;
        bottom: auto !important;
        left: auto !important;
        right: auto !important;
        padding: 15px;
        max-width: 100%;
        width: 100%;
    }
    .homechangerbox{
        padding-bottom: 40px;
    }
    .homechangercontainer, .categoryoverlay {
        position: relative;
    }
    .homechangerbox_black, .homechangerbox_white {
        background: #FFF;
    }
    .homechangerbox h1, .categoryoverlaybox h1, .categoryoverlaybox h2 {
        font-size: 150%;
        color: #333;
        text-shadow: none;
    }
    .homechangerbox p, .categoryoverlaybox p {
        font-size: 115%;
        color: #333;
        padding: 5px 10px 5px 0;
        text-shadow: none;
    }
    .owl-nav {
        display: none;
    }
    #imagechanger .owl-dots {
        bottom: -4px !important;
    }
    .homechanger-bottom {
        position: relative;
        margin: 15px 0;
    }
    .home-feature-slider {
        list-style: none;
        padding: 0;
        margin: 0;
    }
    .home-features li {
        display: block;
        width: 100%;
        text-align: center;
        margin: 0;
        padding: 0;
        font-size: 100%;
    }
    .hometop-left, .hometop-right{
        padding: 0;
    }
    .hometop-right{
        padding: 15px 0 0;
    }
    #main-body.main-body-home{
        padding: 0 10px;
    }
    .homeright.homerightv2{
        width: 100%;
        margin: 15px 0;
    }
    .homeright.homerightv2 .homepicsright{
        margin: 0;
    }
    .homeright.homerightv2 .homepicsright .hometextbox{
        position: relative;
        bottom: auto;
    }
    .homepicsright h2 {
        font-size: 125%;
        padding: 0 28px;
    }
    .homepicsright p {
        font-size: 85%;
        padding: 0 28px;
    }
    .homepicsright.rectangle h2 {
        font-size: 95%;
    }
    .homepicsright.rectangle {
        margin: 0 0 75px 0;
    }
    .homepicsright.rectangle .hometextbox {
        bottom: -60px;
    }
    .homeright:not(.homerightv2) .homepicsright .inputbutton {
        font-size: 85%;
        padding: 2px 5px !important;
        display: inline;
    }
    .homerightv2 .homepicsright .hometextbox p{
        margin: 0 0 10px;
    }
    #menu-icon, #menu-title {
        display: inline-block;
        opacity: 0.5;
    }
    nav ul, nav:active ul {
        display: none;
    }
    nav li {
        text-align: center;
        width: 100%;
        padding: 10px 0;
        margin: 0;
    }
    nav:hover ul {
        display: block;
    }
    nav:hover #menu-icon, nav:hover #menu-title {
        opacity: 1;
    }
    .tabs a {
        padding: 5px 0;
    }
    .tabs{
        z-index: 998;
    }
    .tabs li{
        background: none;
    }
    .tabs li a {
        border: none;
    }
    .tabs li:hover a, .tabs li.current a {
        border: none;
    }
    .tabs #tabwrap {
        display: none;
    }
    .tabs.normaltabs ul li:hover ul {
        display: none !important;
    }
    #sidebar {
        padding: 0;
    }
    #sidebar .navbox ul li a {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    #footer {
        font-size: 110%;
    }
    #footer ul {
        margin: 0;
        padding: 0;
    }
    #footer .footerbox li {
        list-style: none;
        margin: 0 0 1px 0;
    }
    #footer .footerbox li a {
        background: #F2F2F2;
        padding: 10px 15px;
        margin: 4px 0;
        font-size: 100%;
        color: #333;
    }
    #footer .footerbox li a:hover, #footer .footerbox li a:active {
        background: url("/images/shopnav_arrow.png") no-repeat scroll 97% 50% #ee1e26;
        color: #FFF;
        text-decoration: none;
    }
    #footer .footerbox a {
        display: block;
    }
    #footer .footerbox h5 {
        margin-top: 1em;
    }

    .proddetail-v2 .price .now {
        width: auto !important;
        margin-bottom: 6px;
    }
    .proddetail-v2 .financeavailable {
        width: 100% !important;
    }
    .proddetail-v2 .stocktext {
        max-width: unset;
        float: left;
        width: auto;
        text-align: left;
    }
    .proddetail-v2 .product-cashback .icon, .proddetail-v2 .product-freeproduct .icon {
        width: 65px;
    }
    .proddetail-v2 .product-cashback .icon {
        background-color: #eb1c22 !important;
    }
    .proddetail-v2 .product-cashback .icon {
        width: 100px;
    }
    .proddetail-v2 .product-freeproduct .freeprodimg {
        background-color: #ffffff !important;
    }
    .optionheader {
        padding-left: 80px;
    }
    .optionheader:before {
        width: 65px;
    }
    .totalsection.totallabel:before {
        width: 65px;
    }
    .proddetail-v2 .optiondropdown .productframe .thumb {
        width: 35%;
    }
    .proddetail-v2 .optiondropdown .productframe .name {
        width: 65%;
    }
    .proddetail-v2 .optiondropdown .productframe .qtywrapouter {
        width: 100%;
    }
    .proddetail-v2 .optiondropdown .productframe {
        padding-bottom: 0;
    }
    .inputbutton {
        padding: 10px 15px !important;
        width: 100%;
        display: block;
        margin: 4px 0;
    }
    .biginputbutton {
        padding: 15px !important;
        font-size: 180%;
    }
    .smallbutton {
        font-size: 100% !important;
        line-height: 100% !important;
    }
    #variant1 label, #variant2 label, #variant3 label, .optiongroup label, #swatch label, #variantimage label {
        padding: 10px 20px;
    }
    .prodtabs div {
        /*display: block !important;*/
    }
    .qtywrapouter {
        margin: 10px 0;
    }
    table {
        max-width: 100%;
    }
    .tablecollapse tr {
        display: block;
        clear: both;
        position: relative;
    }
    .tablecollapse td, .tablecollapse th {
        display: block;
        text-align: left;
    }
    td.tdinline {
        display: inline-block;
        width: auto;
    }
    td.basketbuttons {
        position: absolute;
        right: 10px;
        bottom: 10px;
    }
    iframe{
        max-width:100%;
    }
    iframe tr{
        width:100%;
        display: block;
    }
    iframe td{
        width:100%;
        display: block;
    }
    #calendar .owl-nav{
        display: block;
    }
    #calendar td {
        display: block;
        width: 100%;
        max-width: 100%;
        height: auto;
        padding: 7px 5px;
    }
    .productframe {
        height: auto !important;
        padding-bottom: 105px;
    }
    .categoryframe {
        height: auto !important;
    }
    .thumbimagewrap {
        min-height: 0 !important;
    }
    #homefeatured .productfeat, #featured .productfeat {
        height: auto !important;
        min-height: 0 !important;
    }
    #homefeatured .homefeaturedinner{
        padding: 0 25px;
    }
    #homefeatured .homefeaturedinner .owl-nav, .pageblock_imagecarousel .owl-nav{
        display: block;
    }
    .categorybannerheader {
        position: relative;
        left: auto;
        top: auto;
        padding: 0;
        box-shadow: none;
        background: none;
    }
    .thumb1 {
        display: inline-block !important;
    }
    .thumb2 {
        display: none !important;
    }
    .pagecontainer {
        padding: 0;
    }
    .product-code {
        margin: 0;
    }
    .product-code p {
        padding: 0;
    }
    .basketprocess td {
        width: 100%;
    }
    #checkout .delivery-container{
        padding-top: 20px;
    }
    .fullwidth .postcodeanywherebox {
        margin-left: 0;
    }
    #loyalty_form {
        width: 100%;
        float: left;
        text-align: left;
        clear: both;
        border-bottom: 1px solid #CCC;
        padding: 0 0 10px 0;
        margin: 0 0 10px 0;
    }
    .callback .fullwidth .article-text .copy {
        padding: 0;
    }
    .tablink {
        margin: 2px;
        padding: 8px 16px;
        float: none;
    }
    span.tablink {
        box-shadow: none;
        border: 1px solid #CCC;
    }
    .zoomContainer, .zoomPup, .zoomWindow, .zoomLens {
        display: none !important;
    }
    .mobilescrollfix {
       position: absolute;
        width: 100%;
        height: 100%;
    }
    .comparetable tr {
        display: table-row;
    }
    .comparetable td {
        display: table-cell;
    }
    .productfeat label {
        font-size: 100%;
        padding: 8px;
        display: inline-block;
    }
    #productright {
        width: 100%;
        padding: 0;
    }
    #productright .biginputbutton {
        padding: 15px 15px !important;
        margin: 10px 0;
    }
    .proddetail-v2 #productintro {
        padding: 15px 0 0 0;
    }
    .proddetail-v2 #optionswrap, .proddetail-v2 #variantswrap {
        padding: 0;
    }
    .proddetail-v2 #productrightbox .addtobasket {
        padding: 0 0 15px 0;
    }
    .proddetail-v2 #productdescription {
        padding: 15px 0 0 0;
    }
    #productassocwrap, #productdeliverywrap {
        width: 100%;
    }
    .deliveryoption form {
        position: unset;
    }
    .deliveryoption form input {
        width: 100%;
        margin-top: 10px;
    }
    .deliveryoption .submit {
        top: unset;
        bottom: 22px;
        right: 22px;
    }
    .proddetail-v2 ul.tabnav li a {
        padding: 10px;
    }
    .proddetail-v2 .undertabs2 {
        /*border: 0;*/
        padding: 10px;
    }
    #variantswrap select {
        width: 100%;
        padding: 6px;
    }
    .hotspot {
        display: none;
    }
    #mainImageHolder {
        height: auto !important;
    }
    #getthelook #imagechangernext, #getthelook #imagechangerprev {
        top: 40%;
    }
    #getthelook #imagechanger li, #getthelook #nonchanger li {
        padding: 0;
    }
    .pageblock_text.pageblock_right, .pageblock_text.pageblock_left {
        padding: 0;
    }
    /* OFF CANVAS MENU */
    .tabs.offcanvastabs > div > ul > li:hover, .tabs.offcanvastabs > div > ul > li.current{
        background: none;
    }
    .tabs #tabwrap.offcanvasnavwrap{
        display: block !important;
    }
    .tabs .offcanvasnavwrap li {
        margin: 0;
        padding: 10px 0;
    }
    .tabs .offcanvasnavwrap li a.toplevelcat{
        font-weight: bold;
        padding: 15px 0 5px;
        margin: 0;
        border: none;
    }
    .tabs .offcanvasnavwrap li.current a.toplevelcat{
        color: #ee1e26;
        border: none;
    }
    .tabs .offcanvasnavwrap li:hover a.toplevelcat{
        color: #ee1e26;
        border: none;
    }
    .tabs .offcanvasnavwrap li a.toplevelcat.offcanvassubitems, .tabs ul li.brandsdropdowntab a{
        background: transparent url("/images/navarrow.png") no-repeat right center;
    }
    .tabs .offcanvasnavwrap a{
        text-align: left;
    }
    .tabs ul li ul.offcanvasmenusection, .tabs ul li ul.offcanvasmenusection li ul.offcanvassubnav{
        display: block;
        position: relative;
        border: none;
        box-shadow: none;
        top: 0;
        padding: 0;
        background: none;
    }
    .tabs ul li ul.offcanvasmenusection{
        display: none;
    }
    .tabs ul li.brandsdropdowntab ul.offcanvasmenusection{
        display: none;
    }
    .tabs ul li ul.offcanvasmenusection li {
        padding: 0;
        margin: 0;
    }
    .tabs ul li ul.offcanvasmenusection li a {
        font-size: 100%;
        padding: 8px;
        float: left;
        width: 100%;
        color: #333;
    }
    .tabs ul li ul.offcanvasmenusection li a.mainoption{
        border: none;
        padding: 8px;
        background: none;
    }
    .tabs ul li ul.offcanvasmenusection li a.mainoption:hover{
        background: none;
        color: #ee1e26;
    }
    .offcanvas-toggle{
        background: none !important;
    }
    a.closeoffcanvas{
        position: absolute;
        top: 10px;
        right: 10px;
        z-index: 999;
    }
    #jquery-live-search {
        width: 100% !important;
        height: 100%;
        overflow: scroll !important;
        padding-bottom: 100px;
    }
    .offcanvasbody #jquery-live-search {
        position: fixed !important;
        top: 95px !important;
        border: none;
    }
    .blog-list-container{
        padding: 5px;
        margin: 0;
        position: relative !important;
        left: auto !important;
        top: auto !important;
        max-width: none;
    }
    .textfield {
        padding: 8px 12px;
        font-size: 130%;
        width: 100%;
    }
    .textfield.textfieldmedium {
        width: 100%;
    }
    .textfield.textfieldsmall {
        width: 66%;
    }
    .textfield.textfieldxsmall {
        width: 33%;
    }
    .loginprompt #password {
        top: 0;
        margin: 10px 0 10px 25px;
    }
    #prodpics #mainImageHolder .prodimgslide {
        display: none;
    }
    #prodpics #mainImageHolder .prodimgslide:first-child {
        display: block;
    }
    #myaccountheading p {
        margin-top: 20px;
    }
    #newvoucher, #emailbasket {
        width: 100%;
    }
    /*** horizontal filters ***/
    .filter-container-outer {
        padding: 0;
    }
    .filter-container {
        padding: 10px 0 0;
    }
    .filter-container .foldout, .filter-container .foldoutbox {
        padding: 0;
    }
    .filter-box {
        display: block;
        float: none;
    }
    .filter-content {
        position: relative;
        box-shadow: none;
        width: 100%;
    }
    .filternavbox #options {
        clear: both;
        display: block;
        padding-top: 5px;
        float: none;
    }
    /*** horizontal filters end ***/
    .instagram-text-container p {
        width: 100%;
    }
    .instagram-container {
        margin: 0 0 10px 0;
    }
    .instagram-button{
        position: relative;
        bottom: auto;
        right: auto;
        text-align: center;
        top: 0;
    }
    #newsletterbar {
        text-align: center;
    }
    #newsletterbar h4 {
        display: block;
        margin-right: 0;
    }
    #newsletterbar .textfield {
        width: 100%;
        margin: 0;
        padding: 8px 12px 8px 42px;
    }
    #newsletterbar .social {
        text-align: center;
        margin: 10px 0 0 0;
    }
    .stores-nav li {
        width: 100%;
        display: block;
    }
    .stores-nav li a {
        border: 0;
        border-top: 1px solid #f2f2f2;
    }
    .pagewrap {
        margin: 0;
    }
    .textoverlay .overlaytext {
        padding: 5px 10px;
        font-size: 85%;
    }
    #prodlistoptions label {
        width:100%;
        font-size:120%;
    }
    #prodlistoptions #options .textfield {
        padding:5px;
        width:100%;
    }
    #prodlistoptions .left {
        float:none;
    }
    #prodlistoptions .inputbutton {
        font-size:120%;
        width:100%;
    }
    #chat-widget-container {
        z-index:9999999999 !important;
    }
    .paymentbtns #paypal-button,
    .paymentbtns .inputbutton {
        margin: 0 0 8px auto;
        max-width: 100%;
    }
    .paymentbtns #paypal-button {
        margin-top: 8px;
    }
    .ppmessage{
        display: block;
        padding: 10px 0 0 8px;
    }
    .nobannertext h2{
        font-size: 125% !important;
    }
    .categoryoverlaybox a {
        color: #333;
        text-shadow: none;
    }
    .categoryoverlaybox .readmorebutton {
        color: #333;
    }
    .categoryoverlaybox .fulltext .readmorebutton {
        font-size: 120%;
    }
    .categoryoverlay {
        background: none !important;
        min-height: unset;
    }
    .checkout-banner {
        display: none;
    }
    .checkout-button {
        width: 100%;
    }
}
