/* 
    Document   : Style CSS
    Author     : Kevan Stuart
    Description:
        L'Mad Collections css file
*/

/*
    Reset5 © 2011 opensource.736cs.com MIT 
*/
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,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,audio,canvas,details,figcaption,figure,footer,header,hgroup,mark,menu,meter,nav,output,progress,section,summary,time,video{border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;margin:0;padding:0;}body{line-height:1;}article,aside,dialog,figure,footer,header,hgroup,nav,section,blockquote{display:block;}nav ul{list-style:none;}ol{list-style:decimal;}ul{list-style:disc;}ul ul{list-style:circle;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:none;}ins{text-decoration:underline;}del{text-decoration:line-through;}mark{background:none;}abbr[title],dfn[title]{border-bottom:1px dotted #000;cursor:help;}table{border-collapse:collapse;border-spacing:0;}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0;}input[type=submit],input[type=button],button{margin:0!important;padding:0!important;}input,select,a img{vertical-align:middle;}

/* GENERAL STYLES */
html { font-size:100%; font-family:'PT Sans', sans-serif; }
h1 { font-family:'Maven Pro'; font-size:1.5rem; font-weight:normal; }

.page-content { width:94%; margin:0 auto; }
.clearfix:after { visibility:hidden; display:block; font-size:0; content:" "; clear:both; height:0; }

/* HEADER STYLES */
header { margin:4% 0 0;  }
header a.logo { width:218px; height:113px; display:block; margin:0 auto; }
header nav { margin:4% 0 0; }
header nav ul { margin:0 auto; width:100%; background:#222; }
header nav ul li { margin:0 auto; display:block; }
header nav ul li:last-child a { border-bottom:0; }
header nav ul li a { padding:12px 2%; margin:0 auto; display:block; color:#fff; text-decoration:none; width:92%; border-bottom:1px solid #fff; }
header nav li.active a { background:#fff; color:#222; width:96%; padding-top:13px; margin-top:-1px;}

p.like { background:#fff; border-top:1px solid #222; padding:10px 0; display:none; }
a.back { background:#222; color:#fff; padding:10px 15px; display:block; width:100px; text-align:center; text-decoration:none; margin:20px 0 0; }

@media screen and (min-width:48em) {
    header { margin-top:2%; }
    header nav ul { background:#fff; margin-bottom:15px; }
    header nav ul li { width:50%; float:left; }
    header nav ul li a { background:#222; }
}

@media screen and (min-width:64.0625em) {
    header { position:fixed; width:218px; left:3%; top:15px; padding:10px; background:#fff; margin:0; }
    header nav ul { background:#222; margin:0; }
    header nav ul li { width:100%; }
    header nav li.active a { width:98%; }
    p.like { display:block; }
}
/* HEADER STYLES */


/* HOME PAGE */
.main-home { max-width:100%; display:block; margin:0; border-bottom:4px solid #222; }

@media screen and (min-width:48em) {
    .main-home { max-width:98%; margin:0 auto; }
}
/* HOME PAGE */

/* ABOUT STYLES | NEWS STYLES */
.content { width:100%; margin:0; background:url(../images/about.jpg) #fff no-repeat bottom right; padding-bottom:160px; }
.content div { background:#fff; padding:2%; border-bottom:4px solid #000; }
.content p { padding:5px 0; font-size:1rem; line-height:1.4; margin:0 auto; color:#666; }

@media screen and (min-width:64.0625em) {
    .content div { margin:15px 0 0 3%; padding-left:268px; min-height:260px; padding-top:0; }
    .content div h1 { padding:10px 0; }
}
@media screen and (min-width:80.0625em) {
    .content { border-bottom:4px solid #222; padding-bottom:0; min-height:420px; }
    .content div { background:none; border:0; padding-right:360px; }
    .content p { font-size:1.125rem; line-height:1.5; }
}
/* ABOUT STYLES | NEWS STYLES */


/* STORES & CONTACT */
.content .contact { padding:2% 0; }
.content .contact h1 { padding:0 2% 2%; }
.content .contact p { padding-left:2%; color:#333; }
.content .contact a { color:#0000ff; }

ul.social { margin:10px 0; }
ul.social li { width:100%; display:block; height:16px; margin:0 0 10px 0; width:96%; padding:5px 2%; }
ul.social li a { display:block; width:100%; height:16px; overflow:hidden; line-height:14px; text-decoration:none; }
ul.social li a img { float:left;  }
ul.social li a img.twitter { position:relative; top:-16px; }

ul.stores { width:100%; max-width:980px; margin:0 auto; }
ul.stores li { display:block; width:300px; border-bottom:4px solid #222; margin:0 auto; padding-bottom:10px; }
ul.stores li img { display:block; width:300px; }

ul.store-addresses { width:100%; margin:20px 0; max-width:980px; }
ul.store-addresses li { display:block; width:300px; margin:0 0 15px 0; }
ul.store-addresses li h3 { padding-left:2%; font-weight:normal; font-size:1.25rem; font-family:'Maven Pro', sans-serif; }

@media screen and (min-width:41.0625em) {
    ul.stores li { float:left; margin-right:40px; margin-bottom:40px; }
    ul.stores li:nth-child(2) { margin-right:0; }
    ul.stores li:last-child { margin-bottom:0; }
}
@media screen and (min-width:62.3125em) {
    ul.stores li { margin-bottom:20px; }
    ul.stores li:nth-child(2) { margin-right:40px; }
    ul.stores li:nth-child(3) { margin-right:0; }
    
    ul.store-addresses { margin:20px auto; }
    ul.store-addresses li { float:left; margin-right:40px; }
    ul.store-addresses li:nth-child(2) { margin-right:40px; }
    ul.store-addresses li:nth-child(3) { margin-right:0; }
}
@media screen and (min-width:64.0625em) {
    .content.stores { background:none; }
    .content .contact { margin:15px 0 0 3%; padding-left:268px; min-height:260px; padding-top:0; }
    .content .contact h1 { padding:10px 0; }
    
    .content .contact p, ul.social li { padding-left:0; }
    ul.stores, ul.store-addresses { margin:20px 0; }
}
/* STORES & CONTACT */


/* CATEGORY PAGE */
.category { border-bottom:4px solid #222; width:100%; }

.subcategories { padding:2%; }
.subcategories .video { display:none; background:#222; }
.subcategories ul li { width:100%; display:block; margin:4px 0; }
.subcategories ul li a { width:98%; display:block; padding:10px 1%; color:#222; text-decoration:none; background:#f5f5f5; }

@media screen and (min-width:48em) {
    .subcategories { padding-top:0; }
}
@media screen and (min-width:64.0625em) {
    .category { min-height:420px; }
    .subcategories { margin:15px 0 0 3%; padding-left:268px; }
    .subcategories h1 { padding:10px 0; }
    .subcategories .video { display:block; margin-bottom:10px; }
    
    .subcategories ul li { width:50%; float:left; }
    .subcategories ul li a { background:#f5f5f5; width:94%; padding:10px 2%; font-size:1.125rem; }
    .subcategories ul li a:hover { background:#ccc; }
}
/* CATEGORY PAGE */


/* SUBCATEGORY PAGE */
.products { padding:2%; }
.products p { margin-top:5px; }
.products ul li { width:100%; display:block; margin:8px 0; }

.products ul li a.image-link { min-height:75px; }
.products ul li a { width:98%; display:block; padding:5px 1%; color:#222; text-decoration:none; text-align:center; }

@media screen and (min-width:48em) {
    .products { padding-top:0; }
    .products ul li { width:50%; float:left; }
}
@media screen and (min-width:64.0625em) {
    .products { margin:15px 0 0 3%; padding-left:268px; }
    .products h1 { padding:10px 0; }
    
    .products ul li { width:25%; }
    .products ul li a { width:94%; padding:10px 2%; font-size:1.125rem; margin-top:15px; }
    .products ul li a:hover { color:#000; }
}
/* SUBCATEGORY PAGE */


/* PRODUCT PAGE */
.products .product-image { max-width:100%; margin:10px 0; }
.products p.price { font-size:1.5rem; color:#ff0000; margin:10px 0; }
.products p.other-images { width:100%; margin:5px 0 10px; }
.products p.other-images img { max-width:100%; border-bottom:4px solid #222; display:block; }

div.social { border-top:1px solid #222; margin:5px 0; padding:8px 0; max-width:400px; float:left; }

@media screen and (min-width:75.5em) {
    .products .product-image { max-width:850px; float:left; margin-right:40px; }
    .products p { margin:15px 0; }
    .products p.price { font-size:1.825rem; }
    .products p.other-images img { max-width:850px; }
}
/* PRODUCT PAGE */


/* FOOTER STYLES */
footer { color:#fff; width:100%; }
footer ul { width:100%; text-align:center; }
footer ul li { display:inline-block; text-align:center; }
footer ul li a { display:block; color:#222; text-decoration:none; padding:15px 10px; }
footer p.copyright { width:100%; text-align:center; color:#222; font-size:0.75rem; padding:5px 0 10px; }
/* FOOTER STYLES */