/*@import url(inc/woocommerce.css);*/

*
{
    margin: 0;
    padding: 0;
    min-height: 0;
    outline: none;
}

.wf-loading
{
    visibility: hidden;
}

.wf-active
{
    visibility: visible;
}

html,
body
{
    font: 400 17px "brandon-grotesque", Arial, Helvetica, sans-serif;
    color: #5f604b;
    width: auto;
    height: auto;
    background-image: url(../Images/login-back.png);
    background-repeat: repeat-y;
    background-size: contain;
}

a
{
    color: #D18901;
    text-decoration: none;
}

    a:hover
    {
        color: #4A858F;
    }

    a img
    {
        border: none;
    }

.clearfloat
{
    clear: both;
    height: 0;
    font-size: 1px;
    line-height: 0;
}

h1
{
    font-size: 24px;
    color: #d18901;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
    background: url(img/heading-grey.jpg) center repeat-x;
    margin: 0 0 25px 0;
}

    h1 span
    {
        background: #FFF;
        padding: 0 20px;
    }

h2
{
    font-size: 16px;
    color: #FFF;
    font-weight: 700;
    text-transform: uppercase;
    padding: 0 0 15px 0;
}

    h2.brown
    {
        color: #d18901;
    }

    h2 a
    {
        color: #d18901;
    }

        h2 a:hover
        {
            color: #4A858F;
        }

h3
{
    text-transform: uppercase;
    font-size: 1.6em;
    color: #d98301;
    margin-bottom: 10px;
}

#scroll
{
    width: 57px;
    height: 95px;
    background: url(/scroll.png);
    margin: -47px 0 0 0;
    display: none;
    position: fixed;
    top: 50%;
    left: 20px;
    z-index: 999;
}

#wrapper
{
    padding: 0 0 250px 0;
    overflow: hidden;
}

#logo img
{
    text-indent: -999px;
    position: absolute;
    top: 8px;
    left: 2%;
    overflow: hidden;
    height: 94%;
}

#nav
{
    text-align: center;
    width: 100%;
    height: 95px;
    background: linear-gradient(180deg, rgb(225, 243, 235) 20%, rgb(255, 255, 255) 100%);
    /*border-bottom: 4px solid #c5c8b3;*/
    position: fixed;
    top: -160px;
    left: 0;
    z-index: 998;
    box-shadow: 0px 1px 14px #7d8983;
}

    #nav .wrapper
    {
        width: 98%;
        height: 95px;
        margin: 0 auto;
        position: relative;
    }

#nav-left
{
    position: absolute;
    bottom: 12px;
    left: 169px;
    list-style: none;
}

#nav-right
{
    position: absolute;
    bottom: 12px;
    right: 72px;
    list-style: none;
}

#nav-left li
{
    margin: 0 13px;
    display: inline-block;
    zoom: 1;
    *display: inline;
}

#nav-right li
{
    margin: 0 0 0 40px;
    display: inline-block;
    zoom: 1;
    *display: inline;
}

#nav-left a,
#nav-right a
{
    font-size: 14px;
    color: #5f604b;
    font-weight: 700;
    text-transform: none;
    /*display: block;*/
}

    #nav-left a:hover,
    #nav-right a:hover,
    #nav-left .active a,
    #nav-right .active a
    {
        color: #d98301;
    }

#nav .social-media
{
    position: absolute;
    top: 2px;
    right: 0;
    list-style: none;
}

    #nav .social-media a.facebook
    {
        width: 25px;
        height: 24px;
        background: url(img/social-media-brown.png) -25px 0;
        display: block;
    }

        #nav .social-media a.facebook:hover
        {
            background: url(img/social-media-brown.png) -25px -24px;
        }

    #nav .social-media a.instagram
    {
        width: 24px;
        height: 24px;
        background: url(img/social-media-brown.png) -50px 0;
        display: block;
    }

        #nav .social-media a.instagram:hover
        {
            background: url(img/social-media-brown.png) -50px -24px;
        }

    #nav .social-media a.twitter
    {
        width: 25px;
        height: 24px;
        background: url(img/social-media-brown.png) 0 0;
        display: block;
    }

        #nav .social-media a.twitter:hover
        {
            background: url(img/social-media-brown.png) 0 -24px;
        }

    #nav .social-media li
    {
        margin: 0 0 0 5px;
        float: left;
    }

#nav-mobile
{
    display: none;
    width: 100%;
    height: auto;
    background: #e7e6d4;
    position: fixed;
    top: 0;
    z-index: 998;
}

    #nav-mobile ul
    {
        text-align: center;
        list-style: none;
    }

    #nav-mobile a
    {
        font-size: 14px;
        color: #5f604b;
        font-weight: 700;
        line-height: 70px;
        text-align: center;
        text-transform: uppercase;
        width: 100%;
        height: auto;
        display: block;
    }

    #nav-mobile li
    {
        margin: 0 20px;
        display: inline-block;
        zoom: 1;
        *display: inline;
    }

        #nav-mobile li a
        {
            font-size: 14px;
            color: #5f604b;
            font-weight: 700;
            line-height: 70px;
            text-transform: uppercase;
        }

    #nav-mobile a:hover,
    #nav-mobile .active a
    {
        color: #d98301;
    }

#contact
{
    width: 100%;
    height: auto;
    background: #d18901;
    padding: 20px 0 0 0;
    position: fixed;
    top: -500px;
    left: 0;
    z-index: 999;
}

    #contact .close
    {
        background: #DFAC44;
        padding: 6px 0;
    }

        #contact .close a
        {
            font-size: 12px;
            color: #FFF;
            font-weight: 700;
            text-transform: uppercase;
            text-align: right;
            display: block;
        }

    #contact .content
    {
        width: 730px;
        height: auto;
        margin: 0 auto;
    }

#location
{
    width: 350px;
    height: 260px;
    background: url(img/map.jpg);
    border: 3px solid #FFF;
    display: block;
    float: right;
}

#text
{
    width: 350px;
    height: auto;
    float: left;
}

    #text a
    {
        color: #FFF;
        font-style: italic;
    }

    #text p
    {
        font-size: 15px;
        color: #FFF;
        padding: 0 0 15px 0;
    }

        #text p strong
        {
            font-weight: 700;
            text-transform: uppercase;
        }

    #text .social-media
    {
        padding: 0 0 15px 0;
        list-style: none;
        overflow: hidden;
    }

        #text .social-media a.facebook
        {
            width: 25px;
            height: 24px;
            background: url(img/social-media-white.png) -25px 0;
            display: block;
        }

            #text .social-media a.facebook:hover
            {
                background: url(img/social-media-white.png) -25px -24px;
            }

        #text .social-media a.instagram
        {
            width: 24px;
            height: 24px;
            background: url(img/social-media-white.png) -50px 0;
            display: block;
        }

            #text .social-media a.instagram:hover
            {
                background: url(img/social-media-white.png) -50px -24px;
            }

        #text .social-media a.twitter
        {
            width: 25px;
            height: 24px;
            background: url(img/social-media-white.png) 0 0;
            display: block;
        }

            #text .social-media a.twitter:hover
            {
                background: url(img/social-media-white.png) 0 -24px;
            }

        #text .social-media li
        {
            margin: 0 5px 0 0;
            float: left;
        }

#home
{
    width: 100%;
    height: 700px;
    background: #374B30;
    position: relative;
}

#home-nav
{
    text-align: center;
    width: 100%;
    height: 70px;
    background: #e7e6d4;
    position: absolute;
    bottom: 0;
    left: 0;
    list-style: none;
}

    #home-nav a
    {
        font-size: 14px;
        color: #5f604b;
        font-weight: 700;
        line-height: 70px;
        text-transform: uppercase;
    }

        #home-nav a:hover
        {
            color: #d98301;
        }

    #home-nav li
    {
        margin: 0 20px;
        display: inline-block;
        zoom: 1;
        *display: inline;
    }

#home-logo
{
    width: 357px;
    height: 408px;
    background: url(img/home/logo.png);
    margin: -204px 0 0 -180px;
    position: absolute;
    top: 50%;
    left: 50%;
}

#our-ciders
{
    padding: 156px 0 0 0;
}

    #our-ciders .click-for-details
    {
        width: 155px;
        height: 50px;
        background: url(click-for-details.png);
        border: none;
        margin: -25px 0 0 0;
        padding: 0 !important;
        position: absolute;
        top: 50%;
        right: 20px;
    }

    #our-ciders #our-ciders-nav
    {
        text-align: center;
        padding: 0 0 15px 0;
        list-style: none;
    }

        #our-ciders #our-ciders-nav a
        {
            font-size: 13px;
            color: #5f614b;
            line-height: 25px;
            text-align: center;
            text-transform: uppercase;
            width: 115px;
            height: 25px;
            border: 2px solid #107a4a85;
            display: block;
            font-weight:bold;
            /*    font-size: 13px;
            color: #5f614b;
            line-height: 25px;
            text-align: center;
            text-transform: uppercase;
            width: 115px;
            height: 25px;
            border: 2px solid #cacdb7;
            display: block;*/
        }

            #our-ciders #our-ciders-nav a:hover,
            #our-ciders #our-ciders-nav .active a
            {
                color: #FFF;
                background: #107a4a;
                border: 2px solid #107748;
            }

        #our-ciders #our-ciders-nav li
        {
            margin: 0 1px;
            display: inline-block;
            zoom: 1;
            *display: inline;
        }

#year-round-nav ul
{
    text-align: center;
    width: 940px;
    height: auto;
    margin: 0 auto;
    position: relative;
    list-style: none;
}

    #year-round-nav ul li
    {
        margin: 0 0 -40px 0;
        padding: 0 20px;
        display: inline-block;
        zoom: 1;
        *display: inline;
    }

.details
{
    width: 750px;
    height: auto;
    margin: 0 auto;
    padding: 0 0 0 40px;
    position: relative;
}

    .details .content
    {
        width: 790px;
        min-height: 320px;
        background: #706996;
        padding: 60px 0 0 0;
        position: absolute;
        top: 60px;
        left: 0;
        z-index: 1;
    }

.year-round .details .content,
.seasonal .details .content
{
    width: 770px;
    padding: 20px 20px 0 250px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.specialty .details .content,
.heritage .details .content
{
    width: 770px;
    padding: 20px 20px 20px 200px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.draft .details .content
{
    padding: 40px 20px 20px 300px;
    width: 770px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.draft .details img
{
    padding-top: 100px;
    padding-bottom: 100px;
}

.seasonal .details .reflect canvas,
.specialty .details .reflect canvas
{
    position: relative;
    top: -20px;
}

#draft-nav img
{
    width: 100%;
}

.details .content .box
{
    width: 100px;
    height: auto;
    border-top: 1px solid #FFF;
    border-bottom: 1px solid #FFF;
    margin: 0 0 15px 0;
    padding: 5px 0 0 0;
}

    .details .content .box p
    {
        padding: 0 0 5px 0 !important;
    }

.details .content .availability
{
    list-style: none;
    position: absolute;
    top: 30px;
    right: 60px;
}

    .details .content .availability li
    {
        font-size: 12px;
        color: #FFF;
        text-transform: uppercase;
        margin: 0 0 0 20px;
        padding: 55px 0 0 0;
        float: left;
    }

        .details .content .availability li.bottles
        {
            background: url(img/our-ciders/icon-bottles.png) top no-repeat;
        }

        .details .content .availability li.cans
        {
            background: url(img/our-ciders/icon-cans.png) top no-repeat;
        }

        .details .content .availability li.draft
        {
            background: url(img/our-ciders/icon-draft.png) top no-repeat;
        }

.details .content p
{
    font-size: 14px;
    color: #FFF;
    line-height: 20px;
    padding: 0 0 15px 0;
}

    .details .content p strong
    {
        text-transform: uppercase;
    }

.details .content .jagged-left,
#donate .jagged-left
{
    width: 10px;
    height: 380px;
    background: url(img/jagged-left.png) center;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
}

.details .content .jagged-right,
#donate .jagged-right
{
    width: 10px;
    height: 380px;
    background: url(img/jagged-right.png) center;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
}

.details img
{
    position: relative;
    z-index: 2;
}

.details .image
{
    width: 210px;
    height: auto;
    border-top: 3px solid #fff;
    border-bottom: 3px solid #fff;
    padding: 20px 0;
    display: block;
    position: absolute;
    top: 20px;
    left: 40px;
    z-index: 2;
}

    .details .image img
    {
        margin: 0 auto 20px auto;
        display: block;
    }

    .details .image span.apple
    {
        width: 36px;
        height: 18px;
        background-image: url(img/our-ciders/apple.png);
        background-position: center bottom;
        background-repeat: no-repeat;
        margin: 0 0 0 -18px;
        display: block;
        position: absolute;
        bottom: -9px;
        left: 50%;
    }

    .details .image span.name
    {
        font-size: 24px;
        color: #fff;
        font-weight: 700;
        text-align: center;
        text-transform: uppercase;
        display: block;
    }

    .details .image span.type
    {
        font-size: 24px;
        color: #fff;
        font-weight: 700;
        text-align: center;
        text-transform: uppercase;
        display: block;
    }

.details .next a
{
    text-indent: -999px;
    width: 61px;
    height: 29px;
    background: url(img/our-ciders/next-back.png) top right;
    margin: -15px 0 0 0;
    position: absolute;
    top: 50%;
    right: -70px;
    overflow: hidden;
}

    .details .next a:hover
    {
        background: url(img/our-ciders/next-back.png) bottom right;
    }

.details .prev a
{
    text-indent: -999px;
    width: 61px;
    height: 29px;
    background: url(img/our-ciders/next-back.png) top left;
    margin: -15px 0 0 0;
    position: absolute;
    top: 50%;
    left: -70px;
    overflow: hidden;
}

    .details .prev a:hover
    {
        background: url(img/our-ciders/next-back.png) bottom left;
    }

#panes,
#panes .pane
{
    -webkit-backface-visibility: hidden;
}

.pane .reflect
{
    position: relative;
}

    .pane .reflect span
    {
        width: 100%;
        height: 50px;
        background: url(img/our-ciders/shadow.png) repeat-x;
        display: block;
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: 997;
    }

#seasonal-nav .reflect canvas,
#specialty-nav .reflect canvas
{
    position: relative;
    top: -20px;
}

#seasonal-nav .reflect canvas
{
    top: 0;
}

#seasonal-nav ul,
#specialty-nav ul,
#heritage-nav ul,
#draft-nav ul
{
    text-align: center;
    width: 900px;
    height: auto;
    margin: 0 auto;
    position: relative;
    list-style: none;
}

    #seasonal-nav ul li,
    #specialty-nav ul li,
    #heritage-nav ul li
    {
        /*margin: 0 0 -40px 0;*/
        padding: 0 20px;
        display: inline-block;
        zoom: 1;
        *display: inline;
    }

    #draft-nav ul li
    {
        margin: 0 0 0 0;
        padding: 0 20px;
        display: inline-block;
        zoom: 1;
        *display: inline;
    }

#about-us
{
    padding: 190px 0 0 0;
}

#about .content
{
    width: 640px;
    height: auto;
    margin: 0 auto;
    position: relative;
}

#about
{
    margin-bottom: 80px;
}

    #about .content p
    {
        line-height: 22px;
        text-align: center;
        padding: 0 0 15px 0;
    }

#team
{
    text-align: center;
    width: 980px;
    height: auto;
    margin: 0 auto;
    padding: 25px 0 40px 0;
    list-style: none;
}

    #team li
    {
        width: 218px;
        height: auto;
        margin: 0 10px;
        padding: 0 0 20px 0;
        display: inline-block;
        zoom: 1;
        *display: inline;
    }

        #team li .caption
        {
            background: url(img/caption.png);
            display: none;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            z-index: 990;
        }

            #team li .caption p
            {
                font-size: 14px;
                color: #f5f3e8;
            }

                #team li .caption p strong
                {
                    font-weight: 700;
                    text-transform: uppercase;
                }

            #team li .caption table td
            {
                width: 218px;
                height: 218px;
                vertical-align: middle;
            }

        #team li .image
        {
            width: 218px;
            height: 218px;
            position: relative;
        }

        #team li .jagged-top
        {
            width: 100%;
            height: 10px;
            background: url(img/jagged-top.png) center;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 991;
        }

        #team li .jagged-bottom
        {
            width: 100%;
            height: 10px;
            background: url(img/jagged-bottom.png) center;
            position: absolute;
            bottom: 0;
            left: 0;
            z-index: 991;
        }

        #team li .name
        {
            font-size: 20px;
            color: #bcbead;
            text-transform: lowercase;
            padding: 15px 0 0 0;
        }

#ingredients
{
    background: #d18901;
    padding: 70px 0 40px 0;
    position: relative;
}

    #ingredients .arrow
    {
        width: 85px;
        height: 25px;
        background: url(img/about-us/arrow-white.png);
        margin: 0 0 0 -42px;
        position: absolute;
        top: 0;
        left: 50%;
    }

    #ingredients .click
    {
        width: 143px;
        height: 15px;
        background: url(img/about-us/click.png) left top;
        margin: 0 auto 25px auto;
        display: block;
    }

        #ingredients .click:hover
        {
            background: url(img/about-us/click.png) right top;
        }

    #ingredients .content
    {
        width: 660px;
        height: auto;
        margin: 0 auto;
    }

        #ingredients .content h1
        {
            color: #f9c86b;
            background: url(img/heading-brown.jpg) center repeat-x;
        }

            #ingredients .content h1 span
            {
                background: #d18901;
            }

        #ingredients .content p
        {
            color: #FFF;
            line-height: 22px;
            text-align: center;
            padding: 0 0 15px 0;
        }

#ingredients-list
{
    text-align: center;
    padding: 40px 0 0 0;
    list-style: none;
    overflow: hidden;
}

    #ingredients-list li
    {
        width: 290px;
        height: 200px;
        padding: 0 20px;
        float: left;
    }

        #ingredients-list li img
        {
            margin: 0 auto;
            display: block;
        }

        #ingredients-list li p
        {
            font-size: 15px;
            color: #FFF;
            line-height: 20px;
        }

.cheers
{
    width: 111px;
    height: 56px;
    background: url(img/about-us/process/cheers.png) bottom no-repeat #fff;
    margin: 0 auto;
    padding: 95px 0 0 0;
    position: relative;
    z-index: 6;
}

#process
{
    width: 100%;
    height: auto;
    padding: 70px 0 0 0;
    position: relative;
}

    #process .arrow
    {
        width: 85px;
        height: 25px;
        background: url(img/about-us/arrow-brown.png);
        margin: 0 0 0 -42px;
        position: absolute;
        top: 0;
        left: 50%;
    }

    #process .content
    {
        width: 640px;
        height: auto;
        margin: 0 auto;
    }

    #process .divider
    {
        width: 100%;
        height: 60px;
        background: #d18901;
        position: relative;
        z-index: 6;
    }

        #process .divider .arrow-white,
        #values .arrow
        {
            width: 85px;
            height: 25px;
            background: url(img/about-us/arrow-white.png);
            margin: 0 0 0 -42px;
            position: absolute;
            top: 0;
            left: 50%;
        }

        #process .divider .arrow-brown
        {
            width: 85px;
            height: 25px;
            background: url(img/about-us/arrow-brown.png);
            margin: 0 0 0 -42px;
            position: absolute;
            top: 60px;
            left: 50%;
        }

    #process .mobile
    {
        display: none;
    }

        #process .mobile img
        {
            margin: 0 auto;
            display: block;
        }

        #process .mobile .text
        {
            width: 420px;
            height: auto;
            background: #FFF;
            border: 3px solid #dddfd3;
            margin: 20px auto;
            padding: 20px;
        }

            #process .mobile .text p
            {
                font-size: 12px;
                color: #9c9e8e;
                font-weight: 700;
                text-align: center;
                text-transform: uppercase;
            }

                #process .mobile .text p strong
                {
                    font-size: 16px;
                    color: #d58601;
                }

.step
{
    width: 100%;
    height: auto;
    background: #FFF;
    position: relative;
}

    .step .text
    {
        width: 420px;
        height: auto;
        background: #FFF;
        border: 3px solid #dddfd3;
        margin: 0 0 0 -240px;
        padding: 20px;
        display: none;
        position: absolute;
        top: 200px;
        left: 50%;
        z-index: 10;
    }

    .step p
    {
        font-size: 12px;
        color: #9c9e8e;
        font-weight: 700;
        text-align: center;
        text-transform: uppercase;
    }

        .step p strong
        {
            font-size: 16px;
            color: #d58601;
        }

#step-1
{
    z-index: 1;
}

    #step-1 #apples-wrapper
    {
        width: 100%;
        height: 600px;
    }

    #step-1 #apples
    {
        width: 140px;
        height: 600px;
        margin: 0 0 0 -70px;
        position: relative;
        top: 0;
        left: 50%;
        z-index: 3;
    }

        #step-1 #apples #apples-left
        {
            width: 60px;
            height: 600px;
            background: url(img/about-us/process/step-1/apples.png) top left;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 2;
        }

        #step-1 #apples #apples-right
        {
            width: 71px;
            height: 600px;
            background: url(img/about-us/process/step-1/apples.png) top right;
            position: absolute;
            top: 0;
            right: 0;
            z-index: 2;
        }

    #step-1 #pressing
    {
        width: 241px;
        height: 343px;
        margin: -140px auto 0 auto;
        position: relative;
    }

        #step-1 #pressing #handle-front
        {
            width: 64px;
            height: 54px;
            background: url(img/about-us/process/step-1/handle.png) top left;
            margin: 0 0 -1px -32px;
            position: absolute;
            top: 0;
            left: 50%;
            z-index: 4;
        }

        #step-1 #pressing #handle-back
        {
            width: 64px;
            height: 54px;
            background: url(img/about-us/process/step-1/handle.png) top right;
            margin: 0 0 -1px -32px;
            position: absolute;
            top: 0;
            left: 50%;
            z-index: 1;
        }

        #step-1 #pressing #pressing-front
        {
            width: 241px;
            height: 343px;
            background: url(img/about-us/process/step-1/pressing.png) top left;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 4;
        }

        #step-1 #pressing #pressing-back
        {
            width: 241px;
            height: 343px;
            background: url(img/about-us/process/step-1/pressing.png) top right;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 1;
        }

#step-2
{
    z-index: 2;
}

    #step-2 .drops-wrapper
    {
        width: 100%;
        height: 616px;
    }

    #step-2 .drops
    {
        width: 36px;
        height: 616px;
        background: url(img/about-us/process/step-2/drops.png) repeat;
        margin: 0 0 0 -18px;
        position: relative;
        top: 0;
        left: 50%;
        z-index: 2;
    }

    #step-2 #fermentation
    {
        width: 216px;
        height: 342px;
        margin: -40px auto 0 auto;
        position: relative;
    }

        #step-2 #fermentation #clouds
        {
            width: 470px;
            height: 257px;
            background: url(img/about-us/process/step-2/clouds.png);
            margin: 0 0 0 -235px;
            display: none;
            position: absolute;
            top: -130px;
            left: 50%;
            z-index: 4;
        }

        #step-2 #fermentation #fermentation-front
        {
            width: 216px;
            height: 342px;
            background: url(img/about-us/process/step-2/fermentation.png) top left;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 3;
        }

        #step-2 #fermentation #fermentation-back
        {
            width: 216px;
            height: 342px;
            background: url(img/about-us/process/step-2/fermentation.png) top right;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 1;
        }

#step-3
{
    z-index: 3;
}

    #step-3 .drops-wrapper
    {
        width: 100%;
        height: 430px;
    }

    #step-3 .drops
    {
        width: 18px;
        height: 430px;
        background: url(img/about-us/process/step-4/drops.png) repeat;
        margin: 0 0 0 -10px;
        position: relative;
        top: 0;
        left: 50%;
        z-index: 2;
    }

    #step-3 #clarification
    {
        width: 169px;
        height: 345px;
        margin: -25px auto 0 auto;
        position: relative;
    }

        #step-3 #clarification #clarification-empty
        {
            width: 169px;
            height: 345px;
            background: url(img/about-us/process/step-3/clarification.png) 0 0;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 3;
        }

        #step-3 #clarification #clarification-quarter
        {
            width: 169px;
            height: 345px;
            background: url(img/about-us/process/step-3/clarification.png) -169px 0;
            display: none;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 3;
        }

        #step-3 #clarification #clarification-half
        {
            width: 169px;
            height: 345px;
            background: url(img/about-us/process/step-3/clarification.png) -338px 0;
            display: none;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 3;
        }

        #step-3 #clarification #clarification-full
        {
            width: 169px;
            height: 345px;
            background: url(img/about-us/process/step-3/clarification.png) -507px 0;
            display: none;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 3;
        }

        #step-3 #clarification #clarification-back
        {
            width: 169px;
            height: 345px;
            background: url(img/about-us/process/step-3/clarification.png) -676px 0;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 1;
        }

#step-4
{
    z-index: 4;
}

    #step-4 .drops-wrapper
    {
        width: 100%;
        height: 473px;
    }

    #step-4 .drops
    {
        width: 18px;
        height: 473px;
        background: url(img/about-us/process/step-4/drops.png) repeat;
        margin: 0 0 0 -51px;
        position: relative;
        top: 0;
        left: 50%;
        z-index: 2;
    }

    #step-4 #post-fermentation
    {
        width: 215px;
        height: 334px;
        margin: -80px auto 0 auto;
        position: relative;
    }

        #step-4 #post-fermentation #big-hand
        {
            width: 30px;
            height: 20px;
            background: url(img/about-us/process/step-4/clock.png) bottom left;
            position: absolute;
            top: 170px;
            left: 93px;
            z-index: 4;
        }

        #step-4 #post-fermentation #little-hand
        {
            width: 8px;
            height: 20px;
            background: url(img/about-us/process/step-4/clock.png) top right;
            position: absolute;
            top: 170px;
            left: 104px;
            z-index: 4;
        }

        #step-4 #post-fermentation #post-fermentation-empty
        {
            width: 215px;
            height: 334px;
            background: url(img/about-us/process/step-4/post-fermentation.png) 0 0;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 3;
        }

        #step-4 #post-fermentation #post-fermentation-full
        {
            width: 215px;
            height: 334px;
            background: url(img/about-us/process/step-4/post-fermentation.png) -215px 0;
            display: none;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 3;
        }

        #step-4 #post-fermentation #post-fermentation-back
        {
            width: 215px;
            height: 334px;
            background: url(img/about-us/process/step-4/post-fermentation.png) -430px 0;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 1;
        }

#step-5
{
    z-index: 5;
}

    #step-5 .drops-wrapper
    {
        width: 100%;
        height: 462px;
    }

    #step-5 .drops
    {
        width: 36px;
        height: 462px;
        background: url(img/about-us/process/step-5/drops.png) repeat;
        margin: 0 0 0 -18px;
        position: relative;
        top: 0;
        left: 50%;
        z-index: 1;
    }

    #step-5 #bottle
    {
        width: 116px;
        height: 296px;
        margin: -40px auto 0 auto;
        position: relative;
    }

        #step-5 #bottle #bottle-empty
        {
            width: 116px;
            height: 296px;
            background: url(img/about-us/process/step-5/bottle.png) 0 0 no-repeat #fff;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 2;
        }

        #step-5 #bottle #bottle-quarter
        {
            width: 116px;
            height: 296px;
            background: url(img/about-us/process/step-5/bottle.png) -116px 0 no-repeat #fff;
            display: none;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 2;
        }

        #step-5 #bottle #bottle-half
        {
            width: 116px;
            height: 296px;
            background: url(img/about-us/process/step-5/bottle.png) -232px 0 no-repeat #fff;
            display: none;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 2;
        }

        #step-5 #bottle #bottle-full
        {
            width: 116px;
            height: 296px;
            background: url(img/about-us/process/step-5/bottle.png) -348px 0 no-repeat #fff;
            display: none;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 2;
        }

#find-us
{
    background: #FFF;
    padding: 190px 0 0 0;
    position: relative;
    z-index: 5;
}

    #find-us .slide img
    {
        width: 100%;
    }

    #find-us .content
    {
        width: 640px;
        height: auto;
        margin: 0 auto;
        position: relative;
    }

        #find-us .content p
        {
            line-height: 22px;
            text-align: center;
            padding: 0 0 15px 0;
        }

#slides-wrapper
{
    max-width: 810px;
    border: 7px solid #c4c3b4;
    margin: 40px auto 80px auto;
    position: relative;
}

    #slides-wrapper #banner
    {
        width: 216px;
        height: 140px;
        background: url(img/find-us/banner.png);
        padding: 15px 0 0 0;
        position: absolute;
        top: -16px;
        left: 50px;
        z-index: 991;
    }

        #slides-wrapper #banner #dogs-welcome
        {
            width: 89px;
            height: 17px;
            background: url(img/find-us/dogs-welcome.png);
            margin: 5px auto 0 auto;
        }

        #slides-wrapper #banner .line
        {
            width: 45px;
            height: 1px;
            background: #f5f3e8;
            margin: 10px auto;
        }

        #slides-wrapper #banner p
        {
            font-size: 12px;
            color: #f5f3e8;
            font-weight: 700;
            text-transform: uppercase;
            text-align: center;
        }

    #slides-wrapper #slides .slide
    {
        width: 810px;
        height: 315px;
    }

    #slides-wrapper .bx-pager
    {
        width: 100%;
        height: auto;
        text-align: center;
        position: absolute;
        bottom: -30px;
        left: 0;
    }

        #slides-wrapper .bx-pager .bx-pager-item
        {
            margin: 0 3px;
            display: inline-block;
            zoom: 1;
            *display: inline;
        }

        #slides-wrapper .bx-pager a
        {
            text-indent: -999px;
            width: 12px;
            height: 12px;
            background: url(img/pagination.png) 0 0;
            display: block;
            overflow: hidden;
        }

            #slides-wrapper .bx-pager a:hover,
            #slides-wrapper .bx-pager a.active
            {
                background: url(img/pagination.png) 0 -12px;
            }

#map
{
    width: 550px;
    height: 373px;
    margin: 0 auto;
    position: relative;
}

    #map #state-flag
    {
        width: 0;
        height: 0;
        display: none;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 999999;
    }

        #map #state-flag #flag
        {
            width: 200px;
            height: 30px;
            position: absolute;
            top: 0;
            left: 40%;
        }

        #map #state-flag #left
        {
            font-size: 14px;
            color: #f5f3e8;
            line-height: 30px;
            font-weight: 700;
            text-transform: uppercase;
            width: auto;
            height: 30px;
            background: #d18901;
            padding: 0 10px;
            float: left;
        }

        #map #state-flag #right
        {
            width: 10px;
            height: 30px;
            background: url(img/find-us/flag-right.png);
            float: left;
        }

        #map #state-flag #pole
        {
            width: 2px;
            height: auto;
            background: #d18901;
            position: absolute;
            top: 0;
            bottom: 30%;
            left: 40%;
        }

#select-a-state
{
    width: 120px;
    height: 20px;
    background: url(img/find-us/select-a-state.png);
    margin: 40px auto 0 auto;
}

.state
{
    width: 740px;
    height: auto;
    margin: 40px auto 0 auto;
    display: none;
}

    .state .back-to-map
    {
        background: url(img/heading-grey.jpg) center repeat-x;
    }

        .state .back-to-map a
        {
            width: 260px;
            height: 66px;
            background: url(img/find-us/back-to-map.png) top no-repeat #fff;
            margin: 0 auto;
            display: block;
        }

            .state .back-to-map a:hover
            {
                background: url(img/find-us/back-to-map.png) bottom no-repeat #fff;
            }

    .state .city
    {
        text-align: center;
        display: none;
    }

        .state .city a
        {
            color: #5f614b;
        }

            .state .city a:hover
            {
                color: #4a858f;
            }

        .state .city .location
        {
            width: 140px;
            height: auto;
            padding: 0 20px 30px 20px;
            display: inline-block;
            vertical-align: top;
            zoom: 1;
            *display: inline;
        }

        .state .city p
        {
            font-size: 14px;
            padding: 0 !important;
        }

            .state .city p strong
            {
                font-weight: 700;
                text-transform: uppercase;
            }

    .state .find-us-nav
    {
        text-align: center;
        padding: 0 0 30px 0;
        list-style: none;
    }

        .state .find-us-nav a
        {
            font-size: 13px;
            color: #5f614b;
            text-align: center;
            text-transform: uppercase;
            display: block;
        }

            .state .find-us-nav a:hover,
            .state .find-us-nav .active a
            {
                color: #D18901;
            }

        .state .find-us-nav li
        {
            margin: 5px 8px;
            display: inline-block;
            zoom: 1;
            *display: inline;
            vertical-align: middle;
        }

    .state .headline
    {
        background: url(img/heading-grey.jpg) center repeat-x;
        position: relative;
    }

        .state .headline .icon
        {
            width: 260px;
            height: 82px;
            margin: 0 auto;
        }

        .state .headline .back
        {
            font-size: 11px;
            color: #5f604b;
            font-weight: 700;
            text-transform: uppercase;
            text-align: right;
            margin: -9px 0 0 0;
            display: block;
            position: absolute;
            top: 50%;
            left: 0;
        }

            .state .headline .back:hover
            {
                color: #D18901;
            }

            .state .headline .back span
            {
                background: #FFF;
                padding: 0 10px 0 0;
            }

#state-wa .headline .icon
{
    background: url(img/find-us/states.png) center 0 no-repeat #fff;
}

#state-or .headline .icon
{
    background: url(img/find-us/states.png) center -82px no-repeat #fff;
}

#state-id .headline .icon
{
    background: url(img/find-us/states.png) center -164px no-repeat #fff;
}

#state-ca .headline .icon
{
    background: url(img/find-us/states.png) center -246px no-repeat #fff;
}

#state-nv .headline .icon
{
    background: url(img/find-us/states.png) center -328px no-repeat #fff;
}

#state-mt .headline .icon
{
    background: url(img/find-us/states.png) center -410px no-repeat #fff;
}

#state-ak .headline .icon
{
    background: url(img/find-us/states.png) center -494px no-repeat #fff;
}

#state-wi .headline .icon
{
    background: url(img/find-us/states.png) center -576px no-repeat #fff;
}

.state #select-a-city
{
    width: 109px;
    height: 25px;
    background: url(img/find-us/select-a-city.png);
    margin: 20px auto;
}

#news-events
{
    padding: 190px 0 0 0;
}

    #news-events .content
    {
        width: 730px;
        height: auto;
        margin: 0 auto;
    }

    #news-events #news-nav
    {
        padding: 0 0 15px 0;
        list-style: none;
        float: right;
        overflow: hidden;
    }

        #news-events #news-nav a
        {
            font-size: 12px;
            color: #5f604b;
            font-weight: 700;
            text-transform: uppercase;
            display: block;
        }

            #news-events #news-nav a:hover,
            #news-events #news-nav .active a
            {
                color: #d18901;
            }

        #news-events #news-nav li
        {
            font-size: 12px;
            font-weight: 700;
            margin: 0 0 0 5px;
            float: left;
        }

#older-posts
{
    font-size: 12px;
    color: #5f604b;
    font-weight: 700;
    text-transform: uppercase;
    width: 500px;
    height: auto;
    border-top: 2px solid #d5d7ca;
    padding: 15px 15px 0 0;
    display: block;
    float: right;
}

    #older-posts:hover
    {
        color: #d18901;
    }

#older-newer-posts
{
    width: 500px;
    height: auto;
    border-top: 2px solid #d5d7ca;
    padding: 15px 15px 0 0;
    display: block;
    float: right;
}

    #older-newer-posts .left
    {
        float: left;
    }

    #older-newer-posts .right
    {
        float: right;
    }

    #older-newer-posts a
    {
        font-size: 12px;
        color: #5f604b;
        font-weight: 700;
        text-transform: uppercase;
    }

        #older-newer-posts a:hover
        {
            color: #d18901;
        }

.post-title
{
    width: 130px;
    height: auto;
    border-top: 2px solid #d5d7ca;
    padding: 25px 15px 55px 15px;
    float: left;
}

    .post-title p
    {
        font-size: 12px;
        color: #a7aa8f;
        text-transform: uppercase;
    }

        .post-title p a
        {
            color: #a7aa8f;
        }

.post-content
{
    width: 500px;
    height: auto;
    border-top: 2px solid #d5d7ca;
    padding: 25px 15px 55px 0;
    float: right;
}

    .post-content .alignleft
    {
        margin: 0 15px 15px 0;
        float: left;
    }

    .post-content .alignright
    {
        margin: 0 0 15px 15px;
        float: right;
    }

    .post-content blockquote
    {
        padding: 0 40px;
    }

    .post-content img
    {
        width: auto;
        height: auto;
        max-width: 100%;
    }

    .post-content p
    {
        line-height: 22px;
        padding: 0 0 15px 0;
    }

        .post-content p strong
        {
            font-weight: 700;
        }

    .post-content ol,
    .post-content ul
    {
        margin: 0 0 0 55px;
        padding: 0 0 15px 0;
    }

        .post-content ol li,
        .post-content ul li
        {
            line-height: 22px;
        }

    .post-content .wp-caption
    {
        width: auto !important;
        height: auto;
        max-width: 100%;
    }

        .post-content .wp-caption .wp-caption-text
        {
            padding: 5px 0 0 0;
        }

#distributors
{
    padding: 190px 0 0 0;
}

    #distributors .content
    {
        width: 640px;
        height: auto;
        margin: 0 auto;
        position: relative;
    }

        #distributors .content h2
        {
            color: #5f604b;
            text-align: center;
            padding: 10px 0 15px 0;
        }

        #distributors .content p
        {
            line-height: 22px;
            text-align: center;
            padding: 0 0 15px 0;
        }

#our-vision
{
    padding: 190px 0 0 0;
}

    #our-vision .content
    {
        width: 640px;
        height: auto;
        margin: 0 auto;
        text-align: center;
    }

        #our-vision .content p
        {
            margin-bottom: 30px;
        }

.values-list
{
    list-style-type: none;
}

    .values-list li
    {
        margin-bottom: 30px;
    }

#values
{
    background: #d18901;
    padding: 70px 0 40px 0;
    position: relative;
    margin-top: 80px;
}

    #values h3
    {
        text-align: center;
        color: #fff;
        font-weight: normal;
        margin-bottom: 10px;
    }

    #values p
    {
        margin-bottom: 30px;
    }

    #values .content
    {
        width: 660px;
        height: auto;
        margin: 0 auto;
    }

        #values .content h1,
        #donate .content h1
        {
            color: #f9c86b;
            background: url(img/heading-brown.jpg) center repeat-x;
        }

            #values .content h1 span,
            #donate .content h1 span
            {
                background: #d18901;
            }

        #values .content p
        {
            color: #FFF;
            line-height: 22px;
            text-align: center;
            padding: 0 0 15px 0;
        }

#values-list
{
    text-align: center;
    padding: 40px 0 0 0;
    list-style: none;
    overflow: hidden;
}

    #values-list li
    {
        width: 290px;
        height: 200px;
        padding: 0 20px;
        float: left;
        margin-bottom: 30px;
    }

        #values-list li.last
        {
            margin: 0 auto;
            float: none;
            clear: both;
        }

        #values-list li img
        {
            margin: 0 auto;
            display: block;
        }

        #values-list li p
        {
            font-size: 15px;
            color: #FFF;
            line-height: 20px;
        }

    #values-list .ss-icon
    {
        font-size: 38px;
        color: #fff;
    }

#community-partners
{
    padding-top: 40px;
}

    #community-partners .content,
    #donations .content
    {
        width: 640px;
        height: auto;
        margin: 0 auto;
        padding: 60px 0;
        text-align: center;
    }

    #community-partners img
    {
        margin: 20px;
        display: inline;
    }

#donate
{
    position: relative;
    width: 770px;
    height: auto;
    margin: 0 auto;
    background: #d18901;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 40px 50px 50px 280px;
    color: #fff;
    margin-top: 80px;
    font-size: .8em;
    margin-bottom: 80px;
}

    #donate h3
    {
        margin-bottom: 10px;
        color: #f9c86b;
        font-weight: normal;
    }

    #donate p
    {
        margin-bottom: 20px;
    }

.btn
{
    background: #fff;
    padding: 5px 20px;
    color: #fff;
    text-transform: uppercase;
}

    .btn:hover
    {
        background: #f9c86b;
    }

#donate-flag
{
    right: 60px;
    top: -150px;
    z-index: 997;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

    #donate-flag.top
    {
        top: -10px;
    }

    #donate-flag:hover
    {
        top: 0;
    }

.can
{
    position: absolute;
    left: 50px;
    top: -80px;
    z-index: 9;
}

#footer
{
    width: 100%;
    height: 45px;
    background: #1a1d1c;
    border-top: 4px solid #c0c3af;
    position: fixed;
    bottom: -115px;
    left: 0;
    z-index: 997;
    clear: both;
}

    #footer .wrapper
    {
        width: 90%;
        height: 95px;
        margin: 0 auto;
        position: relative;
    }


#line-left
{
    font-size: 15px;
    color: #2c4f55;
    font-weight: 500;
    text-transform: uppercase;
    position: absolute;
    top: 8px;
    left: 0;
    width: 100%;
}

    #line-left strong
    {
        margin-left: 14%;
    }

    #line-left span
    {
        margin-left: 32%;
    }

    #line-left a
    {
        font-size: 13px;
        color: #c1c4b0;
        font-weight: 500;
        text-transform: lowercase !important;
    }

        #line-left a:hover
        {
            color: #FFF;
        }

#line-right
{
    font-size: 10px;
    color: #2c4f55;
    line-height: 85px;
    font-weight: 500;
    text-transform: uppercase;
    position: absolute;
    top: 5px;
    right: 0;
}

#footer.new #line-right
{
    line-height: normal;
    padding-top: 15px;
}

    #footer.new #line-right .btn
    {
        margin-top: 5px;
        display: block;
        float: left;
        background-color: transparent;
        border: 2px solid #c0c3af;
        color: #c0c3af;
    }

        #footer.new #line-right .btn:hover
        {
            background: #c0c3af;
            color: #2c4f55;
        }

#line-left
{
    line-height: 1.1em;
}

    #line-left a.comm-link
    {
        color: #c0c3af;
    }

        #line-left a.comm-link:hover
        {
            color: #fff;
        }

#line-right a
{
    color: #2c4f55;
}

    #line-right a:hover
    {
        color: #FFF;
    }

#s-icon
{
    width: 48px;
    height: 51px;
    background: url(../Images/s-icon.png);
    margin: 0 0 0 -24px;
    position: absolute;
    top: -23px;
    left: 50%;
}

#tagline
{
    color: #c1c4b0;
    font-family: cursive;
    height: 25px;
    left: 50%;
    margin: -12px 0 0 -117px;
    position: absolute;
    top: 50%;
    width: 302px;
}

.acct
{
    font-size: .8em;
    margin: 15px 12px;
    float: left;
}

    .acct .spacer
    {
        margin: 0 5px;
    }

    .acct img
    {
        position: relative;
        top: 3px;
    }

.input
{
    background-color: #fff;
    border: 1px solid #ccc;
    transition: border 0.2s linear 0s, box-shadow 0.2s linear 0s;
    font-size: 14px;
    height: 18px;
    line-height: 18px;
    box-shadow: none;
    padding: 4px 6px;
}

.btn-success.btn
{
    background: #007D4A;
    border-color: rgb(130, 180, 64);
}

.btn-sm.btn
{
    line-height: 14px;
    margin-top: -1px;
    padding: 5px 10px;
}

.btn
{
    -moz-user-select: none;
    background-image: none;
    border-radius: 4px;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857;
    margin-bottom: 0;
    padding: 6px 12px;
    text-align: center;
    touch-action: manipulation;
    vertical-align: middle;
    white-space: nowrap;
    font-family: calibri;
}

.floater
{
    position: fixed;
    top: 300px;
    right: 1px;
    color: white;
    text-align: center;
    margin: -25px 0 0;
    padding: 7px 17px;
    right: 13px;
    top: 58%;
    border: none;
    z-index: 1000;
    font-weight: bold;
    cursor: pointer;
    -webkit-animation: changecolor 2s infinite;
    animation: changecolor 3s infinite;
    font-size: 15px;
    background-color: #beecc7;
    border-radius: 7px;
    box-shadow: 2px 2px 5px grey;
    font-family: calibri;
}

.hand
{
    position: fixed;
    top: 248px;
    right: 1px;
    color: white;
    text-align: center;
    box-sizing: border-box;
    background-repeat: repeat;
    background-repeat: repeat;
    background-repeat: no-repeat;
    height: 50px;
    margin: -25px 0 0;
    padding: 0;
    right: 54px;
    top: 49%;
    width: 236px;
    border: none;
    z-index: 1000;
    font-weight: bold;
    cursor: pointer;
    width: 53px;
}
/*for two color code 2 */
@keyframes changecolor
{
    0%
    {
        color: #0b5a37;
        opacity: 1;
    }

    25%
    {
        color: #e81a1a;
        opacity: 1;
    }

    50%
    {
        color: #0b5a37;
        opacity: 1;
    }

    75%
    {
        color: #e81a1a;
        opacity: 1;
    }

    100%
    {
        color: #0b5a37;
        opacity: 1;
    }
}

.bounce
{
    -moz-animation: bounce 2s infinite;
    -webkit-animation: bounce 2s infinite;
    animation: bounce 2s infinite;
}

@-moz-keyframes bounce
{
    0%, 20%, 50%, 80%, 100%
    {
        -moz-transform: translateY(0);
        transform: translateY(0);
    }

    40%
    {
        -moz-transform: translateY(-20px);
        transform: translateY(-30px);
    }

    60%
    {
        -moz-transform: translateY(-15px);
        transform: translateY(-15px);
    }
}

@-webkit-keyframes bounce
{
    0%, 20%, 50%, 80%, 100%
    {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    40%
    {
        -webkit-transform: translateY(-20px);
        transform: translateY(-30px);
    }

    60%
    {
        -webkit-transform: translateY(-15px);
        transform: translateY(-15px);
    }
}

@keyframes bounce
{
    0%, 20%, 50%, 80%, 100%
    {
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    40%
    {
        -moz-transform: translateY(-20px);
        -ms-transform: translateY(-20px);
        -webkit-transform: translateY(-20px);
        transform: translateY(-20px);
    }

    60%
    {
        -moz-transform: translateY(-15px);
        -ms-transform: translateY(-15px);
        -webkit-transform: translateY(-15px);
        transform: translateY(-15px);
    }
}

#Australia-nav ul, #Canada-nav ul, #Europe-nav ul, #Gulf-Countries-nav ul, #ROW-nav ul, #North-America-nav ul, #South-Africa-nav ul, #Switzerland-nav ul, #Jordan-nav ul, #ACTD-nav ul, #Thailand-nav ul, #WHO-nav ul {
    text-align: center;
    width: 900px;
    height: auto;
    margin: 0 auto;
    position: relative;
    list-style: none;
}

    #Australia-nav ul li, #Canada-nav ul li, #Europe-nav ul li, #Gulf-Countries-nav ul li, #ROW-nav ul li, #North-America-nav ul li, #South-Africa-nav ul li, #Switzerland-nav ul li, #Jordan-nav ul li,, #ACTD-nav ul li, #Thailand-nav ul li, #WHO-nav ul li{
        /*margin: 0 0 -40px 0;*/
        padding: 0 20px;
        display: inline-block;
        zoom: 1;
        *display: inline;
    }



#Australia-nav li, #Canada-nav li, #Europe-nav li, #Gulf-Countries-nav li, #ROW-nav li, #North-America-nav li, #South-Africa-nav li, #Switzerland-nav li, #Jordan-nav li
{
    width: 100%;
    text-align: justify;
    font-family: calibri;
    line-height: 30px;
}

#pDossier::first-letter
{
    font-size: xx-large;
    font-weight: bold;
}

#line-right
{
    color: #2c4f55;
    font-family: calibri;
    font-size: 14px;
    font-weight: 500;
    line-height: 24px;
    position: absolute;
    right: 0;
    text-transform: uppercase;
    top: 7px;
}

.content
{
    margin: 0px auto;
    width: 900px;
    text-align: justify;
    font-family: calibri;
    line-height: 30px;
}

.pDossier::first-letter
{
    font-size: xx-large;
    font-weight: bold;
}

.contentli
{
    vertical-align: top;
    font-family: calibri;
    line-height: 30px;
    text-align: justify;
    width: 100%;
}

#Europe-nav b
{
    font-family: calibri;
    line-height: 30px;
    text-align: justify;
}

img
{
    border: 1px solid #253143;
}

.section.height
{
    margin-top: -63px;
}

/*code added by ASHWINI*/
#whats_new li
{
    display: inline-block;
    width: 100%;
}

.whats_new_heading
{
    background-color: #007c4b;
    color: white;
    padding: 6px;
    font-size: 22px;
}

.whats_new_heading2
{
    color: #007c4b;
    padding: 13px 4px 7px;
    font-size: 20px;
    border-bottom: 3px #007c4b solid;
}

.whats_new_subpara
{
    padding-left: 17px;
    padding-top: 16px;
    width: 200%;
}

    .whats_new_subpara li
    {
        list-style-type: disc;
        display: list-item !important;
    }

        .whats_new_subpara li ul li
        {
            list-style-type: circle;
            margin-left: 16px;
        }

        .whats_new_subpara li ul
        {
            margin-left: 20px;
            margin-top: 7px;
            width: 139%;
            font-size: 15.5px;
        }

.whats_new_para2
{
    vertical-align: top;
    /*padding-left: 86px;*/
}
/*responsive css*/
#close_icon
{
    float: right;
    margin-right: 15px;
    margin-top: 42px;
}

.mobile_nav
{
    padding-top: 150px;
    display: none;
}

    .mobile_nav ul li a
    {
        width: 100%;
        background-color: #007D4A;
        color: #fff;
        display: inline-block;
        padding: 6px 0px;
    }

    .mobile_nav li
    {
        border-bottom: 1px solid #ccc;
    }

#nav-left, #nav-right
{
    visibility: hidden;
}

#heritage-nav ul, #draft-nav ul
{
    width: 700px;
    margin-left: 20px;
}

#s-icon
{
    left: 45%;
}

#tagline
{
    left: 43%;
}

#line-right
{
    right: 98px !important;
}

#line-left
{
    left: 12px;
}

.blink
{
    animation: blinker 1s linear infinite;
}

@keyframes blinker
{
    50%
    {
        opacity: 0.3;
    }
}

@media screen and (min-width: 980px) /*responsiive of 980×1280*/
{
    #nav-left
    {
        visibility: visible;
        bottom: 12px;
        list-style: outside none none;
        position: absolute;
    }

        #nav-left li a img, #nav-right li a img
        {
            height: 51px;
        }

    .mobile_nav
    {
        visibility: hidden;
    }
    /*#whats_new{
	 margin-top: -310px;

}*/
    #nav-right
    {
        visibility: visible;
        bottom: 20px;
        list-style: outside none none;
        position: absolute;
        right: 4px;
    }

    #close_icon
    {
        visibility: hidden;
    }

    #heritage-nav ul, #draft-nav ul
    {
        margin-left: 35px;
        width: 871px;
    }

    #s-icon
    {
        left: 50%;
    }

    #tagline
    {
        left: 48%;
    }

    #line-right
    {
        right: 30px !important;
    }

    #line-left
    {
        left: 12px;
    }
}

#nav-right li
{
    display: inline-block;
    margin: 0 0 0 32px;
    width: 95px;
}

#nav-left li
{
    display: inline-block;
    margin: 0 4px;
}

.section.height
{
    padding-top: 233px !important;
}

@media screen and (min-width: 1280px)
{ /*responsiive of 1280x600*/
    #nav-left
    {
        visibility: visible;
        bottom: 12px;
        left: 180px;
        list-style: outside none none;
        position: absolute;
    }

    .mobile_nav
    {
        visibility: hidden;
    }

    #nav-right
    {
        visibility: visible;
        bottom: 12px;
        list-style: outside none none;
        position: absolute;
        right: 195px;
    }


    .section.height
    {
        padding-top: 194px !important;
    }

    #close_icon
    {
        visibility: hidden;
    }

    #heritage-nav ul, #draft-nav ul
    {
        margin-left: 200px;
        width: 874px;
    }

    #s-icon
    {
        left: 50%;
    }

    #tagline
    {
        left: 48%;
    }

    #line-right
    {
        right: 20px !important;
    }

    #line-left
    {
        left: 12px;
    }

    #nav-left li
    {
        display: inline-block;
        margin: 0 12px;
        /*width: 109px;*/
    }
}

@media screen and (min-width: 1242px)
{
    #nav-left
    {
        visibility: visible;
        bottom: 12px;
        left: 164px;
        list-style: outside none none;
        position: absolute;
    }

        #nav-left li
        {
            display: inline-block;
            margin: 0 10px;
        }
}

@media screen and (min-width: 1242px)
{
    #nav-left
    {
        visibility: visible;
        bottom: 12px;
        left: 164px;
        list-style: outside none none;
        position: absolute;
    }

        #nav-left li
        {
            display: inline-block;
            margin: 0 10px;
        }
}

@media screen and (max-width: 800px)
{
    #our-ciders
    {
        padding: 238px 0 0 !important;
    }

    .whats_new_para2
    {
        vertical-align: top;
        padding-left: 28px;
    }

    #whats_new li
    {
        display: inline-block;
        width: 40%;
    }

    #whats_new
    {
        margin-left: 28px;
        margin-top: -323px;
    }

    .whats_new_subpara li ul
    {
        width: 172%;
    }

    #Australia-nav ul, #Canada-nav ul, #Europe-nav ul, #Gulf-Countries-nav ul, #ROW-nav ul, #North-America-nav ul, #South-Africa-nav ul, #Switzerland-nav ul, #Jordan-nav ul, #ACTD-nav ul, #Thailand-nav ul,WHO-nav ul
    {
        height: auto;
        list-style: outside none none;
        margin: 0 auto;
        position: relative;
        text-align: center;
        width: 707px;
    }

    #p1 img
    {
        margin-top: 12px !important;
    }

    #Australia-nav ul li, #Canada-nav ul li, #Europe-nav ul li, #Gulf-Countries-nav ul li, #ROW-nav ul li, #North-America-nav ul li, #South-Africa-nav ul li, #Switzerland-nav ul li, #Jordan-nav ul li, #ACTD-nav ul li, #Thailand-nav ul li, #WHO-nav ul li {
        display: inline-block;
        padding: 0 11px;
    }

    #whats_new
    {
        margin-left: 28px;
        margin-top: 0px;
    }
}

.dropbtn
{
    background-color: transparent;
    border: none;
    top: 19px !important;
    position: relative;
    left: -15px;
}

.dropdown
{
    position: relative;
    display: inline-block;
}

.dropdown-content
{
    display: none;
    position: absolute;
    background-color: #f2faf6;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    width: 568px;
    margin-left: -150px;
    margin-top: 18px;
}

.dropdown .dropdown-content a
{
    padding: 12px 16px;
    text-decoration: none;
    display: inline-block !important;
}

.dropdown-content li a:hover
{
    background-color: transparent;
}

.dropdown:hover .dropdown-content
{
    display: block;
}

.dropdown:hover .dropbtn
{
    background-color: transparent;
}
