/* General Style */ 
body {
    background:#CCCCCC;
    font-size:100%;
    margin:0em;
    padding:0em;
}

h1 {
    font-size:2.5em;
    line-height:2.5em;
    font-family:Helvetica;
    font-weight:100;
    color:#454040;
    margin:0em;
    padding:0em;
}

h2 {
    font-size:1.563em;
    line-height:1.8em;
    font-family:Helvetica;
    font-weight:100;
    color:#454040;
    margin:0em;
    padding:1.25em;
    text-align:left;
}

p {
    line-height:1.25em;
    font-family:Helvetica;
    font-weight:100;
    color:#454040;
    margin:0em;
    padding:1.25em;
    text-align:justify;
}

ul {
    margin:0px;
    padding:0px;
}

li {
    list-style:square;
    font-family:Helvetica;
    font-weight:100;
    color:#2F2D2C;
    line-height:1.25em;
    margin:0em;
    padding:0em;
    margin:0.313em 0em 0.313em 0em;
}

img {
    width:90%;
    height:auto;
    max-width:100%;
}

a {
    text-decoration: none;
}

hr {
    color:#CCCCCC;
}

/* On Top Bar */
#menubar {
    display:none;
    background:#999999;
    height:auto;
} 
#menubar ul {
    display:block;
    width:2em;
    padding:0.9em;
}
#menubar ul li {
    display:inline;
}
#menubar ul li a.menubutton {
    display:none;
    margin: 1em;
}
/* Header */ 
header {
    display:block;
    background:#CCCCCC;
    text-align:center;
}
header h1 {
    font-size:2.5em;
    color:#454040;
    font-family: "Lithos Pro";
}
header h2 {
    font-size:2em;
    color:#454040;
    font-family: "Tekton Pro";
    text-align: center;
    padding:0em;
}
header img {
    width: 30em;
    margin:0em;
    padding:0em;
}
/* Navigation */ 
nav {
    display:block;
    height:auto;
    background:#999999;
    text-align:center;
}

nav ul {
    display:block;
    padding:1.5em 0em 1.5em 0em;
}
nav ul li {
    display:inline;
    margin:0em 0.188em 0em 0.188em;
}
nav ul li img {
    max-width:10px;
}
nav ul li a {
    color:#454040;
    font-size: 1.125em;
    line-height:2.5em;
    padding:0.563em 0.938em 0.375em 0em;
    transition:background 0.2s;
    -webkit-transition:background 0.2s;
}

nav ul li a:hover {
    background:#999999;
    border-bottom: 0.188em solid #E7590B;
}
nav ul li a.active {
    border-bottom: 0.188em solid #E7590B;
}
/* Content Area */ 
#main {
    display:block;
    width:96%;
    max-width:980px;
    margin:2em auto;
}

#main article.home {
    display:inline-block; 
    width:100%; 
    background:#CCCCCC;
    vertical-align: top;
    margin:0em;
    padding:0em;
    text-align:center;
}

#main article.home h1 {
    font-size:2.5em;
    color:#454040;
    font-family: "Lithos Pro";
}
#main article.home h2 {
    font-size:2em;
    color:#454040;
    font-family: "Tekton Pro";
    text-align: center;
    padding:0em;
}
#main article.home img {
    width: 30em;
}

#main article.home ul {
    display:inline-block;
}

#main article.home ul li {
    display:inline-block;
}

#main article.home ul li img {
    display:inline-block;
    width:6em;
    margin:2em 0.625em 2em 0.625em;
    max-width:100px;
    box-shadow:0px 0px 10px -5px #4c4948;
    border-radius: 5px;
}

#main article.home h2 {
    padding:1em 1.8em 1em 1.8em;
}

#main article.home ul li a:focus { 
    outline:none;
}




#main article.team {
    background:#CCCCCC;
    vertical-align: top;
    margin:3em 0em 0em 6em;
    padding:0em;
    text-align:left;
}

#main article.team div div.leftprofile {
    display:block;
    position:relative;
    width:50%;
    float:left;
}

#main article.team div div.leftprofile p.floatoff {
    clear:left;
    clear:right;
    background:yellow;
    padding:0em;
}

#main article.team div div.rightprofile {
    display:block;
    position:relative;
    width:50%;
    float:right;
}

#main article.team div div.rightprofile p.floatoff {
    clear:left;
    clear:right;
    background:yellow;
    padding:0em;
}

#main article.team div div div.profile {
    display:block;
    position:relative;
}

#main article.team div div div.profile div.picture {
    display:block;
    position:relative;
    float:left;
    width:30%;
    min-width:7em;
}

#main article.team div div div.profile div.text {
    display:block;
    position:relative;
    float:right;
    width:70%;
}

#main article.team div div div.profile div.picture img {
    width:7em; 
    min-width:7em;
    max-width:7em;
    height:7em; 
    min-height:7em;
    max-height:7em;
    margin-right:1em;
    margin-bottom:1em;
}

#main article.team div div div.profile div.text p {
    max-width:15em;
    min-height:5em;
    text-align: left;
    margin:0em 2em 2em 0em;
    padding:0em 0em 0em 0.4em;
    font-family: "Tekton Pro";
    font-size:1em;
    line-height: 1.2em;
    font-size: 1.0em;
    color: #454040;
}

#main article.team div div div.profile div.text h1 {
    max-width:15em;
    text-align: left;
    margin:0em 0em 0.4em 0em;
    font-family: "Tekton Pro";
    font-size:1em;
    font-weight: bold;
    line-height: 1.2em;
    font-size: 1.2em;
    color: #454040;
}


#main article.shophours {
    background:#CCCCCC;
    vertical-align: top;
    margin:3em 0em 0em 6em;
    padding:0em;
    text-align:left;
}

#main article.shophours div.contentleft {
    display:block;
    position:relative;
    width:30%;
    float:left;
}

#main article.shophours div.contentleft p {
    text-align: left;
    margin:0em 0em 2em 0em;
    padding:0em 2em 0em 0em;
    font-family: "Tekton Pro";
    font-size: 1.2em;
    line-height: 1.4em;
    color: #454040;
}

#main article.shophours div.contentleft h1 {
    text-align: left;
    margin:0em 0em 1em 0em;
    font-family: "Tekton Pro";
    font-size: 1.7em;
    font-weight: bold;
    line-height: 1.9em;
    color: #454040;
}

#main article.shophours div.contentright {
    display:block;
    position:relative;
    width:70%;
    float:right;
}

#main article.shophours div div.leftprofile {
    display:block;
    position:relative;
    width:50%;
    float:left;
    margin-bottom:2em;
}

#main article.shophours div div.leftprofile p.floatoff {
    clear:left;
    clear:right;
    background:yellow;
    padding:0em;
}

#main article.shophours div div.rightprofile {
    display:block;
    position:relative;
    width:50%;
    float:right;
    margin-bottom:2em;
}

#main article.shophours div div.rightprofile p.floatoff {
    clear:left;
    clear:right;
    background:yellow;
    padding:0em;
}

#main article.shophours div div div.profile {
    display:block;
    position:relative;
    width:100%;
}

#main article.shophours div div div.profile div.picture {
    display:block;
    position:relative;
    float:left;
    width:40%;
}

#main article.shophours div div div.profile div.text {
    display:block;
    position:relative;
    float:right;
    width:60%;
}

#main article.shophours div div div.profile div.picture img {
    width:7em; 
    min-width:7em;
    max-width:7em;
    margin-right:1em;
    margin-bottom:1em;
}

#main article.shophours div div div.profile div.text p {
    max-width:15em;
    min-height:5em;
    text-align: left;
    margin:0em 0em 2em 0em;
    padding:0em 0em 0em 0.4em;
    font-family: "Tekton Pro";
    font-size: 1.0em;
    line-height: 1.2em;
    color: #454040;
}

#main article.shophours div div div.profile div.text h1 {
    max-width:15em;
    text-align: left;
    margin:0em 0em 0.4em 0em;
    font-family: "Tekton Pro";
    font-size:1em;
    font-weight: bold;
    line-height: 1.2em;
    font-size: 1.2em;
    color: #454040;
}


#main article.philosophy {
    background:#CCCCCC;
    vertical-align: top;
    margin:3em 0em 6em 6em;
    padding:0em;
    text-align:left;
}

#main article.philosophy div p.floatoff {
    clear:left;
    clear:right;
}

#main article.philosophy div div.leftcontent {
    display:block;
    position:relative;
    width:50%;
    float:left;
}

#main article.philosophy div div.rightcontent {
    display:block;
    position:relative;
    width:50%;
    float:right;
}

#main article.philosophy div div.leftcontent img {
    display:block;
    width:15em; 
    min-width:10em;
    max-width:20em;
    margin-left:auto;
    margin-right:auto;
    margin-bottom:1em;
}

#main article.philosophy div div.rightcontent p {
    text-align: left;
    margin:0em 5em 0em 0em;
    padding:0em 0em 0em 0.4em;
    font-family: "Tekton Pro";
    font-size: 1.0em;
    line-height: 1.8em;
    color: #454040;
}

#main article.philosophy div div.rightcontent h1 {
    text-align: left;
    margin:0em 0em 0.4em 0em;
    padding:0em 0em 0em 0em;
    font-family: "Tekton Pro";
    font-size: 1.2em;
    font-weight: bold;
    line-height: 1.2em;
    color: #454040;
}


#main article.privacy {
    background:#CCCCCC;
    vertical-align: top;
    margin:0em 0em 0em 2em;
    padding:0em;
    text-align:left;
}

#main article.privacy header h1 {
    font-size:1.5em;
    line-height:1.7em;
    font-family:Helvetica;
    text-align:center;
}

#main article.privacy h2 {
    font-size:1.125em;
    line-height:1.325em;
    font-family:Helvetica;
    padding:1.25em 0em 0em 2.5em;
}

#main article.privacy p {
    font-family:Helvetica;
    font-size:1em;
    line-height:1.2em;
    padding:0.6em 2em 0em 6em;
    text-align:justify;
}

#main article.privacy li {
    list-style:square;
    font-family:Helvetica;
    font-size: 1em;
    line-height: 1.25em;
    font-weight:100;
    margin:0.6em 0em 0em 8em;
    padding-top:0.75em;
    text-align: left;
}

#main article.privacy a {
    font-family:"Times New Roman";
    font-size: 1em;
    line-height: 1.25em;
    font-weight:100;
    color: #CC6633;
    padding-top:0.75em;
    text-align: left;
}

#main article.privacy footer {
    margin:4em 2em 0em 0em;
    padding:0em;
}

#main article.privacy footer p {
    font-family:Helvetica;
    font-size:1em;
    line-height:1.2em;
    background:#CCCCCC;
    padding:0em;
    text-align:right;
}



#main article.imprint {
    background:#CCCCCC;
    vertical-align: top;
    margin:0em 0em 0em 2em;
    padding:0em;
    text-align:left;
}

#main article.imprint header h1 {
    font-family:Helvetica;
    font-size:1.625em;
    line-height:1.825em;
    text-align:center;
}

#main article.imprint h2 {
    font-family:Helvetica;
    font-size:1.125em;
    line-height:1.325em;
    padding:1.25em 0em 0em 2.5em;
}

#main article.imprint p {
    font-family:Helvetica;
    font-size:1em;
    line-height:1.2em;
    padding:0.6em 2em 0em 6em;
    text-align:justify;
}

#main article.imprint footer {
    margin:4em 2em 0em 0em;
    padding:0em;
}

#main article.imprint footer p {
    font-family:Helvetica;
    font-size:1em;
    line-height:1.2em;
    background:#CCCCCC;
    padding:0em;
    text-align:right;
}


#main article.disclaimer {
    background:#CCCCCC;
    vertical-align: top;
    margin:0em 0em 0em 2em;
    padding:0em;
    text-align:left;
}

#main article.disclaimer header h1 {
    font-size:1.625em;
    line-height:1.825em;
    font-family:Helvetica;
    text-align:center;
}

#main article.disclaimer h2 {
    font-family:Helvetica;
    font-size:1.125em;
    line-height:1.325em;
    padding:1.25em 0em 0em 2.5em;
}

#main article.disclaimer p {
    font-family:Helvetica;
    font-size:1em;
    line-height:1.2em;
    padding:0.6em 2em 0em 6em;
    text-align:justify;
}

#main article.disclaimer footer {
    margin:4em 2em 0em 0em;
    padding:0em;
}

#main article.disclaimer footer p {
    font-family:Helvetica;
    font-size:1em;
    line-height:1.2em;
    background:#CCCCCC;
    padding:0em;
    text-align:right;
}


#main article.contact {
    background:#CCCCCC;
    vertical-align: top;
    margin:0em 0em 0em 2em;
    padding:0em;
    text-align:left;
}

#main article.contact h1 {
    font-family: "Tekton Pro";
    font-size:1.625em;
    font-weight: bold;
    line-height:1.825em;
    text-align:center;
}

#main article.contact h2 {
    font-family: "Tekton Pro";
    font-size:1.500em;
    font-weight:bold;
    line-height:1.525em;
    text-align:center;
}

#main article.contact p {
    text-align:center;
    font-family: "Tekton Pro";
    font-size:1em;
    line-height: 1.2em;
    font-size: 1.0em;
    color: #454040;
}

#main article.contact label {
    font-size:1.2em;
    line-height:1.5em;
    font-family: "Tekton Pro";
    font-weight:normal;
    padding:0em 0em 0em 0em;
    text-align:left;
}

#main article.contact input {
    font-size:1em;
    line-height:1.7em;
    font-family:Helvetica;
    font-weight:normal;
    padding:0em 0em 0em 0em;
    text-align:left;
    width:100%;
    color: #454040;
}

#main article.contact input.button {
    font-size:1em;
    line-height:1em;
    font-family:Helvetica;
    font-weight:normal;
    margin:0em;
    padding:0em;
    text-align:center;
    width:100%;
}

#main article.contact div.button {
    display:block;
    position:relative;
    width:30%;
    margin:0em auto 0em auto;
}

#main article.contact textarea {
    font-size:1em;
    font-family:Helvetica;
    font-weight:normal;
    margin:0em;
    padding:0.25em 0em 0.25em 0em;
    text-align:left;
    width:100%;
    height:10em;
    resize:none;
    color: #454040;
}

#main article.contact img {
    display:block;
    width:10em;
    height:4em;
    margin:1em auto;
}

#main article.contact div.inputline {
    display:block;
    position:relative;
    width:70%;
    margin:1em auto 0em auto;
}

#main article.contact div.inputline p.floatoff {
    clear:left;
    clear:right;
}

#main article.contact div.inputline div.label {
    display:block;
    position:relative;
    margin:0em 0em 0em 0em;
    width:100%;
    background:#AAAAAA;
}

#main article.contact div.inputline div.input {
    display:block;
    position:relative;
    width:100%;
}

#main article.contact form.contactform fieldset {
    border: none;
}



#main article.confirmation {
    background:#CCCCCC;
    vertical-align: top;
    margin:0em 0em 20em 0em;
    padding:0em;
    text-align:left;
}

#main article.confirmation h1 {
    font-family:Helvetica;
    font-size:1.5em;
    line-height:1.7em;
    text-align:center;
}



#main article.links {
    background:#CCCCCC;
    vertical-align: top;
    margin:0em 0em 0em 0em;
    padding:0em;
    text-align:left;
}

#main article.links div.link {
    display:block;
    position:relative;
    width:60%;
    margin:0 auto 1em auto;
}

#main article.links div.link div.picture {
    display:block;
    position:relative;
    float:left;
    width:40%;
    min-width:5em;
    height:5em; 
    margin:auto auto 1em auto;
}

#main article.links div.link div.text {
    display:inline;
    position:relative;
    float:right;
    width:60%;
    height:5em; 
    margin:auto auto 1em auto;
}

#main article.links div.link div.picture img {
    display:block;
    width:5em; 
    min-width:5em;
    max-width:5em;
    height:5em; 
    min-height:5em;
    max-height:5em;
    margin-left:auto;
    margin-right:auto;
    vertical-align:middle;
}

#main article.links div.link div.picture a:focus { 
    outline:none;
}

#main article.links div.link div.text p {
    line-height:5em;
    margin:0;
    padding:0;
}

#main article.links div.link div.text a {
    max-width:15em;
    min-height:5em;
    text-align: left;
    font-family: "Tekton Pro";
    line-height: 1.5em;
    font-size: 1.3em;
    vertical-align:middle;
    color: #454040;
}

#main article.sitemap {
    background:#CCCCCC;
    vertical-align: top;
    margin:0em 0em 0em 2em;
    padding:0em;
    text-align:left;
}

#main article.sitemap h1 {
    font-family: "Tekton Pro";
    font-size:1.625em;
    font-weight: bold;
    line-height:1.825em;
    text-align:center;
}

#main article.sitemap h2 {
    font-family: "Tekton Pro";
    font-size:1.500em;
    font-weight:bold;
    line-height:1.525em;
    text-align:center;
}

#main article.sitemap p {
    text-align:center;
    font-family: "Tekton Pro";
    font-size:1em;
    line-height: 1.2em;
    font-size: 1.0em;
    color: #454040;
}

/* Footer */ 
footer {
    display:block;
    background:#999999;
    text-align:center;
    padding:1.5em 0em 0em 0em;
}

footer p {
    display:block;
    font-size: 0.8em;
    color:#454040;
    text-align:center;
    padding:2em;
}

footer ul {
    display:inline;
    white-space: nowrap;
    width:100%;
    max-width:980px;
    text-align:left;
    margin:4px auto;
}

footer ul li {
    display:inline;
    font-size: 0.8em;
    color:#454040;
}
footer ul li a {
    display:inline;
    color:#454040;
    border-bottom:thin dotted #454040; 
    padding:0em 0.5em 0em 0.5em; 
}
footer ul li p {
    display:inline;
    color:#454040;
    padding:0em;
}
/* Mobile Style */
@media screen and (max-width:950px) {
    body {
            font-size:90%;
    }
}
@media screen and (max-width:950px) {
    #main article.home {
        width:100%;
        display:block;
} 
    #main article.team div div.leftprofile {
        float:none;
        width:100%;
        display:block;
}
    #main article.team div div.rightprofile {
        float:none;
        width:100%;
        display:block;
}
    #main article.shophours div.contentleft {
        width:40%;
}
    #main article.shophours div.contentright {
        width:60%;
}
    #main article.shophours div div.leftprofile {
        float:none;
        width:100%;
        display:block;
}
    #main article.shophours div div.rightprofile {
        float:none;
        width:100%;
        display:block;
}
    #main article.links div.link {
        display:block;
        width:100%;
}
    #menubar {
        display:block;
}
}
@media screen and (min-width:950px) {
    nav.nav {
            display:block !important;
    }	
}
@media screen and (max-width:950px) {
    body {
        font-size:86%;
    }
    #menubar ul li a.menubutton {
        display:block;
        width:3em;
    }	
    nav {
        display:none;
        height:auto;
    }
    nav ul li {
        display:block;
        margin:0.3em 0em 0.3em 0em;
    }
    nav ul li img.separator {
        display:none;
    }
}
@media screen and (max-width:700px) {
    #main article.philosophy {
        margin:2em 0em 0em 2em;
}
    #main article.philosophy div div.leftcontent {
        float:none;
        width:100%;
        display:block;
}
    #main article.philosophy div div.rightcontent {
        float:none;
        width:100%;
        display:block;
}
    #main article.philosophy div div.rightcontent p {
        text-align:justify;
}            

    #main article.philosophy div div.leftcontent img {
        display:inline;
        margin-left:0em;
        margin-right:0em;
}

    #main article.shophours {
        margin:2em 0em 0em 2em;
}
    #main article.shophours div.contentleft {
        float:none;
        width:100%;
        display:block;
}
    #main article.shophours div.contentleft h1 {
        text-align:center;
}
    #main article.shophours div.contentleft p {
        text-align:justify;
}
    #main article.shophours div.contentright {
        float:none;
        width:100%;
        display:block;
}
    #main article.shophours div div.leftprofile {
        float:none;
        width:100%;
        display:block;
}
    #main article.shophours div div.rightprofile {
        float:none;
        width:100%;
        display:block;
}

}
@media screen and (max-width:500px) {
    #main article.team div div.leftprofile div.profile div {
        float:none;
        width:100%;
        display:block;
}
    #main article.team div div.rightprofile div.profile div {
        float:none;
        width:100%;
        display:block;
}
    #main article.team div div div.profile div.text p {
        text-align:justify;
}
    #main article.links div.link {
        display:block;
        width:100%;
}
    #main article.links div.link div.picture {
        float:none;
        width:100%;
        display:block;
        margin-bottom:0em;
}
    #main article.links div.link div.text {
        float:none;
        width:100%;
        height:4em;
        display:block;
        margin-bottom:0em;
}
    #main article.links div.link div.text p {
        text-align: center;
        line-height:4em;
        margin-bottom:0em;
}

}
