/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
    
    html,
    body,
    div,
    span,
    applet,
    object,
    iframe,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p,
    blockquote,
    pre,
    a,
    abbr,
    acronym,
    address,
    big,
    cite,
    code,
    del,
    dfn,
    em,
    img,
    ins,
    kbd,
    q,
    s,
    samp,
    small,
    strike,
    strong,
    sub,
    sup,
    tt,
    var,
    b,
    u,
    i,
    center,
    dl,
    dt,
    dd,
    ol,
    ul,
    li,
    fieldset,
    form,
    label,
    legend,
    table,
    caption,
    tbody,
    tfoot,
    thead,
    tr,
    th,
    td,
    article,
    aside,
    canvas,
    details,
    embed,
    figure,
    figcaption,
    footer,
    header,
    hgroup,
    menu,
    nav,
    output,
    ruby,
    section,
    summary,
    time,
    mark,
    audio,
    video {
        /*	margin: 0;*/
        /*	padding: 0;*/
        border: 0;
        font-size: 100%;
        font: inherit;
        vertical-align: baseline;
    }
    /* HTML5 display-role reset for older browsers */
    
    article,
    aside,
    details,
    figcaption,
    figure,
    footer,
    header,
    hgroup,
    menu,
    nav,
    section {
        display: block;
    }
    
    body {
        line-height: 1;
    }
    
    ol,
    ul {
        list-style: none;
    }
    
    blockquote,
    q {
        quotes: none;
    }
    
    blockquote:before,
    blockquote:after,
    q:before,
    q:after {
        content: '';
        content: none;
    }
    
    table {
        border-collapse: collapse;
        border-spacing: 0;
    }
    /* ------MY STYLE--------- */
    /*logo font-family: 'Damion', cursive;*/
    /*logo  #b20d33*/
    
    body {
        font-family: 'Roboto', sans-serif;
    }
    
    .burgundy {
        color: #b20d33;
    }
    
    .container {
        clear: both;
        margin: 0 auto;
        max-width: 1020px;
        min-width: inherit;
        display: block;
        background: #fff;
    }
    
    .home_photos_display_or_not {
        display: none;
    }
    
    p {
        font-size: .8em;
        line-height: 1.2;
    }
    
    h1 {
        font-size: 100%;
        font-weight: 600;
    }
    /*need to add a modifier?*/
    
    h2 {
        font-size: 80%;
    }
    
    .top_fold {
        height: 100px;
        padding: 10px;
    }
    .slogan {
        float: left;
        margin: 4.5em 0 0 -3.5em;
        color: #b20d33;
}
    .logo a:link {
        float: left;
        margin-top: .5em;
        font-size: 2.5em;
        color: #b20d33;
        font-family: 'Damion', cursive;
        text-decoration: none;
    }
    
    .logo a:visited {
        color: #b20d33;
    }
    /* MAIN NAV */
    
    .main_nav {
        position: relative;
        clear: both;
        float: left;
        width: 20%;
        margin: 2.2em 0;
        padding: 0 1em;
    }
    
    .main_nav a {
        color: #000;
        font-weight: 600;
    }
    
    .main_nav li {
        display: block;
        margin-bottom: .3em;
    }
    
    .main_nav ul {
        padding: 0;
    }
    
    .main_nav ul .hidden {
        left: 110px;
        top: 0;
        display: none;
        position: absolute;
        margin: 0;
    }
    
    .main_nav ul li:hover .hidden {
        display: block;
    }
    
    .main_nav ul li {
        position: relative;
        display: block;
    }
    
    .hidden li a {
        color: #d0d0d0;
    }
    
    .main_nav .hidden li {
        display: block;
        padding: 5px;
        border-bottom: solid 1px #6d6d6d;
    }
    
    .main_nav .hidden li:hover a:hover {
        text-decoration: none;
    }
    
    .sub_nav {
        width: 33%;
        float: right;
    }
    
    .sub_nav ul {
        margin-bottom: 0;
    }
    
    a:link {
        color: #000;
        text-decoration: none;
    }
    
    a:hover {
        text-decoration: underline;
    }
    
    a:visited {
        color: #000;
    }
    
    a:active {
        color: #d0d0d0;
    }
    
    .top_fold a img {
        width: 24px;
        height: 20px;
    }
    
    li {
        display: inline-block;
    }
    
    li .active,
    .hidden li .active {
        color: #b20d33;
    }
    
    .top_fold {
        padding: 0 2%;
    }
    
    .top_fold li {
        margin-right: 10%;
        font-size: .95em;
    }
    
    #search {
        float: left;
        border-radius: 0;
        margin-left: 3.5em;
        background: none;
        border-bottom: solid 2px #000;
        width: 46%;
        color: #000;
    }
    
    #searchbox {
        margin-top: 10px;
    }
    
    #submit {
        /*        float: left;*/
        /*        margin-left: 10px;*/
        width: 30%;
        padding-top: 10px;
        background: none;
        /*    font-family: 'Roboto', sans-serif;*/
        color: #000;
        font-size: 1em;
    }
    
    h2 {
        margin: 10px 0;
    }
    
    img {
        width: 235px;
    }
    
    .home_photos {
        float: right;
        width: 100%;
    }
    
    .home_photos h1 {
        position: relative;
        top: 80%;
        left: 50%;
    }
    /* SLIDER */
    
    .slider {
        /*    background: #000;*/
        position: relative;
        width: 720px;
        float: left;
        margin: 60px 0;
    }
    
    .slides {
        width: 100%;
        padding: 0;
        height: 420px;
        display: block;
        margin: 0 auto;
        position: relative;
    }
    
    .slides * {
        -ms-user-select: none;
        -moz-user-select: none;
        -khtml-user-select: none;
        -webkit-user-select: none;
        -webkit-touch-callout: none;
    }
    
    .slides input {
        display: none;
    }
    
    .slide-container {
        display: block;
    }
    
    .slide {
        top: 0;
        opacity: 0;
        width: 100%;
        height: 420px;
        display: block;
        position: absolute;
        transform: scale(0);
        transition: all .7s ease-in-out;
    }
    
    .slide img {
        display: block;
        margin: 0 auto;
        width: auto;
        height: 100%;
    }
    
    .nav label {
        width: 200px;
        height: 100%;
        display: none;
        position: absolute;
        opacity: 0;
        z-index: 9;
        cursor: pointer;
        transition: opacity .2s;
        color: #FFF;
        font-size: 156pt;
        text-align: center;
        line-height: 380px;
        background-color: rgba(255, 255, 255, .3);
        text-shadow: 0px 0px 15px rgb(119, 119, 119);
    }
    
    .slide:hover+.nav label {
        opacity: 0.5;
    }
    
    .nav label:hover {
        opacity: 1;
    }
    
    .nav .next {
        right: 0;
    }
    
    input:checked+.slide-container .slide {
        opacity: 1;
        transform: scale(1);
        transition: opacity 1s ease-in-out;
    }
    
    input:checked+.slide-container .nav label {
        display: block;
    }
    
    .nav-dots {
        width: 100%;
        bottom: 9px;
        height: 11px;
        display: block;
        position: absolute;
        text-align: center;
    }
    
    .nav-dots .nav-dot {
        top: -5px;
        width: 11px;
        height: 11px;
        margin: 0 4px;
        position: relative;
        border-radius: 100%;
        display: inline-block;
        background-color: rgba(178, 13, 51, 0.41);
        background-color:  rgb(163, 163, 163);
    }
    
    .nav-dots .nav-dot:hover {
        cursor: pointer;
        background-color: #b20d33;
    }
    
    input#img-1:checked~.nav-dots label#img-dot-1,
    input#img-2:checked~.nav-dots label#img-dot-2,
    input#img-3:checked~.nav-dots label#img-dot-3,
    input#img-4:checked~.nav-dots label#img-dot-4,
    input#img-5:checked~.nav-dots label#img-dot-5,
    input#img-6:checked~.nav-dots label#img-dot-6 {
        background: #b20d33;
    }
    /* END OF SLIDER */
    
    .products {
        position: relative;
        width: 76%;
        float: left;
        margin: 2em 0;
    }
    
    .products ul {
        padding-left: 0;
        margin: 0;
    }
    
    .products figure {
        margin: 0;
        padding: 0;
        position: relative;
        cursor: pointer;
    }
    
    .products figure img {
        display: block;
        position: relative;
        z-index: 10;
    }
    
    .products figure figcaption {
        display: block;
        padding: 25px;
        position: absolute;
        z-index: 5;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    
    .products figure h2 {
        color: #000;
        font-size: 20px;
        font-weight: 700;
        text-align: left;
    }
    
    .products figure p {
        display: block;
        font-size: 12px;
        line-height: 18px;
        margin: 0;
        color: #000;
        text-align: left;
    }
    
    .products figure figcaption {
        width: 90%;
        margin-left: 16.271px;
        top: 0;
        left: 0;
        height: 100%;
        padding: 5px;
        text-align: center;
        backface-visibility: hidden;
        -webkit-transform: rotateY(-180deg);
        -moz-transform: rotateY(-180deg);
        transform: rotateY(-180deg);
        -webkit-transition: all .5s;
        -moz-transition: all .5s;
        transition: all .5s;
    }
    
    .products figure img {
        backface-visibility: hidden;
        -webkit-transition: all .5s;
        -moz-transition: all .5s;
        transition: all .5s;
    }
    
    .products figure:hover img,
    figure.hover img {
        -webkit-transform: rotateY(180deg);
        -moz-transform: rotateY(180deg);
        transform: rotateY(180deg);
    }
    
    .products figure:hover figcaption,
    figure.hover figcaption {
        -webkit-transform: rotateY(0);
        -moz-transform: rotateY(0);
        transform: rotateY(0);
    }
    
    .products li {
        list-style: none;
        display: inline-block;
        margin-right: 5px;
        width: 231px;
    }
    
    .page_indicator {
        color: #b20d33;
    }
    
    .top_info {
        max-height: 143px;
    }
    
    .top_info_left {
        float: left;
        margin-right: 14em;
    }
    
    .top_info_left h2,
    .top_info_right h2 {
        font-weight: 700;
        font-size: 20px;
        line-height: 27px;
    }
    
    .top_info_right h2 {
        margin-bottom: 2px;
    }
    
    .name {
        width: 97%;
        padding-left: 5px;
        border: solid 1px #000;
        height: 25px;
        background: none;
        color: #999;
        text-align: left;
    }
    
    select {
        margin-left: 1%;
        background: none;
        width: 96%;
        border: solid 1px;
        height: 2em;
        margin-top: 3%;
    }
    
    form select,
    form input,
    textarea {
        display: block;
        width: 100%;
        margin-bottom: 10px;
        text-align: left;
    }
    
    form input {
        /*    margin: 0;*/
        border: none;
        height: 2em;
        padding-left: .8em;
        background-color: #000;
        color: #fff;
        text-align: left;
    }
    
    textarea {
        height: 15px;
        padding: 5px;
        width: 187.271px;
        border: none;
        margin: 0;
        border-radius: 0;
    }
    /* FOOTER */
    
    footer {
        clear: both;
        width: 70%;
    }
    
    .social_media {
        clear: both;
        display: block;
        margin-left: 100px;
        text-align: center;
    }
    
    .social_media li {
        display: inline-block;
    }
    
    .social_media a img,
    .address a img {
        float: left;
        width: 1em;
    }
    
    .address {
        width: 100%;
        width: 100%;
        margin: 10px 0 0 220px;
        padding: 5px;
        border-top: solid 1px #000;
        text-align: center;
    }
    
    .address a {
        float: left;
        margin: 1em 0 0 .5em;
    }
    
    .address p {
        margin-top: 1em;
        text-align: center;
    }
    
    .address p:last-child {
        font-size: .25em;
    }
    
    .contact {
        width: 90%;
    }
    
    .contact iframe {
        width: 100%;
    }
    
    .cart_img {
        float: left;
        width: 18%;
    }
    
    .cart_form {
        margin-left: 83px;
        float: left;
        width: 30%;
    }
    
    .cart_form2 {
        float: right;
        width: 30%;
    }
    
    .basket {
        border-bottom: solid 1px #000;
        float: left;
        margin-bottom: 40px;
        padding-bottom: 30px;
    }
    
    .subtotal {
        float: right;
    }
    
    .subtotal li {
        display: block;
        width: 90%;
        padding: 5px;
        text-align: right;
    }
    
    .underline {
        border-bottom: solid 1px #000;
    }
    
    .subtotal a {
        color: #b20d33;
    }
    
    .subtotal a:link {
        text-decoration: none;
    }
    
    .checkout_numbers {
        float: left;
        width: 96%;
        margin: 40px 20px 0 0;
        padding: 10px;
        color: #000;
        border: solid 2px #000;
    }
    
    .checkout_numbers input {
        width: 92%;
        margin-top: 1em;
        margin-right: 0;
/*    padding-right: 11em;*/
}
    
    .checkout_cart_buttom {
        display: block;
        width: 81px;
        padding: 5px 20px;
        background: #000;
        color: #fff !important;
    }
    /* MEDIA QUERY */
    
    @media screen and (max-width: 767px) {
        .main_nav {
            display: none;
        }
        .slider {
            display: none;
        }
        .page_indicator {
            display: none;
        }
        .logo {
            margin: 1.5em 0 1.7em 0;
        }
        .logo a:link {
            margin-left: 1.2em;
        }
        .logo a:link {
            margin-top: 0;
        }
        .sub_nav {
            width: 100%;
        }
        .products {
            padding: 0 5%;
        }
        .products,
        footer {
            width: 92%;
        }
        .address {
            padding: 0;
            margin: 0;
        }
        .social_media {
            padding: 0;
            margin: 1em 0 .2em;
        }
        .home_photos_display_or_not {
            display: block;
            margin: 1em 0;
        }
        .home_photos_display_or_not img {
            width: 100%;
            margin: 1em 0;
        }
        .dropdown {
            margin-top: 7%;
        }
        .dropdown select {
            margin-left: 2.2em;
        }
        select {
            width: 13em;
            font-family: inherit;
            font-size: inherit;
        }
        .top_info_left,
        .top_info_right {
            padding: 0 1.2em 3em;
        }
        .top_info_left input,
        .top_info_right input {
            margin: 1em 0;
            border-radius: 0;
        }
        .top_info_right h2 {
            margin: 0 0 1em;
        }
        #submit {
            padding: 1em;
            font-size: .7em;
        }
        .contact iframe {
            margin-left: 1em;
        }
        .cart_form2 {
            float: none;
            margin: 1em 0 1em 7em;
            width: 30%;
            border-radius: 0;
        }
        .cart_form2 submit {
            margin-left: 0.3em;
            border-radius: 0;
        }
        .checkout_cart_buttom {
            margin: 1em 0 0 10.8em;
        }
        .subtotal .checkout_cart_buttom a:hover {
            text-decoration: none;
        }
        .checkout_numbers {
            margin: 0;
            padding: .5em 0 1.5em;
        }
        .checkout_numbers input,
        .subtotal input {
            margin: 1em 0 0 16em;
            width: 36%;
        }
        .subtotal {
            float: none;
            margin: 0 .5em 1.3em;
        }
        .products figure figcaption {
            position: relative;
            backface-visibility: visible;
            transform: rotateY(0);
            margin-bottom: 2em;
        }
        .products figure figcaption textarea {
            margin-top: 1em;
            border: solid .5px;
        }
        .products figure img {
            width: 60%;
            margin-left: 1.5em;
        }
        .products figure:hover img {
            transform: rotateY(0);
        }
    }
    
    @media screen and (min-width: 768px) and (max-width: 899px) {
        .dropdown {
            display: none;
        }
        .sub_nav {
            width: 40%;
            margin: 0;
        }
        .products {
            width: 75%;
        }
        .slider {
            width: 68%;
        }
        #cart .top_info_left {
/*            margin-right: 75px;*/
        }
        .checkout_cart_buttom {
            margin: 1em 0;
        }
        .checkout_numbers .subtotal input {
            margin-top: 1em;
            padding-right: 11em;
        }
        .top_info_left {
            margin-right: 5em;
        }
        .checkout_numbers {
        width: 89%;
        }
    }
    
    @media screen and (min-width: 768px) and (max-width: 2300px) {
        .dropdown {
            display: none;
        }
           #cart .products {
            width: 70%;
        }
    }