@font-face {
    font-family: 'playfair';
    src: url('fonts/playfair-regular-webfont.woff2') format('woff2'),
         url('fonts/playfair-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'playfair';
    src: url('fonts/playfair-black-webfont.woff2') format('woff2'),
         url('fonts/playfair-black-webfont.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

body {font-family: 'Montserrat', Arial, Tahoma, Verdana, serif;position:relative;}

.middlecenter {position: absolute;top:50%;left:50%;transform:translate(-50%,-50%);}
.middle {position: absolute;top:50%;transform:translateY(-50%);}
.desktop {display:inline-block !important;}
.mobile {display:none !important;}
.align-left {text-align:left !important;}
.align-center {text-align:center !important;}
.align-right {text-align:right !important;}

#header {padding:1em 3em;margin:0;text-align:center;width:100%;position:fixed;top:0;left:0;z-index:50;background-color:#fff;}
#header .logo1 {position:absolute;top:6em;left:2em;}
#header .logo1 svg {height:6em;}
#header ul {list-style-type:none;padding:0;margin:0;}
#header ul li {display:inline;line-height:2em;margin:0 2em;padding:0;text-align:center;}
#header ul li img, #header ul li svg {height:2em;}
#header ul li a {padding:0.1em 0.5em;color:#000;text-decoration:none;position:relative;}
#header ul li a:hover, #header ul li a.active {color:#fff;
background: rgb(238,213,151);
background: -moz-linear-gradient(90deg, rgba(238,213,151,1) 0%, rgba(134,114,68,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(238,213,151,1) 0%, rgba(134,114,68,1) 100%);
background: linear-gradient(90deg, rgba(238,213,151,1) 0%, rgba(134,114,68,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#eed597",endColorstr="#867244",GradientType=1);}
#header ul li a.logo svg {height:3em;margin-top:-0.5em;margin-bottom:-0.5em;fill:#000;}
#header ul li a.logo:hover svg {fill:rgb(238,213,151);}
#header ul li a.logo:hover, #header ul li a.icon:hover {background:none;}
#header ul li a span {color:#ad573a;display:block;position:absolute;top:-1.3em;right:-0.5em;font-size:0.8em;}

#menuon {background-color:#c59e70;width:100%;height:100%;z-index:60;position:fixed;top:0;left:0;display:none;}
#menuon .close {z-index:70;position:absolute;top:1em;left:1em;}
#menuon .close img {height:1em;}
#menuon ul {list-style-type:none;position:absolute;top:50%;transform:translateY(-50%);}
#menuon ul li {padding:2em 0;text-align:center;}
#menuon ul li a {text-decoration:none;color:#fff;font-size:1.5em;}

#footer {background-color:#000;padding:2em;color:#fff;}
#footer .logo {float:left;width:33%;text-align:center;}
#footer .logo svg {width:6em;margin-bottom:0.5em;fill:#fff;}
#footer .logo span {font-size:0.6em;}
#footer .logo .wrapper {text-align:center;display:inline-block;}
#footer .logo2 {width:100%;text-align:center;margin:0 0 1em;}
#footer .logo2 svg {width:4em;margin-bottom:-2em;fill:#fff;}
#footer .logo2 span {font-size:0.6em;line-height:1em;}
#footer ul {float:left;list-style-type:none;margin:0;padding:0;font-size:0.8em;width:calc(33% / 2);}
#footer ul li {text-align:center;margin-bottom:0.5em;}
#footer ul li a {color:#fff;text-decoration:none;}
#footer ul li a:hover {color:#999;}
#footer .social {float:left;width:33%;text-align:right;}
#footer .social div {display:inline;margin-left:1em;}
#footer .social img {height:2em;}
#footer .copyright {text-align:center;width:100%;margin-top:1em;}
#footer .copyright2 {text-align:center;width:100%;margin-top:1em;font-size:0.8em;}


@media only screen and (min-device-width: 320px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-width: 414px) and (max-device-width: 736px) and (-webkit-min-device-pixel-ratio: 3),
only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1),
only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 2) {
	body {font-size:0.9em;}
	
	.desktop {display:none !important;}
	.mobile {display:inline-block !important;}

	#header {padding:1em 0;margin:0;}
	#header ul {padding:0;margin:0;}
	#header ul li {margin:0;padding:0;float:left;}
	#header ul li.burger {width:25%;}
	#header ul li.logo2 {width:50%;}
	#header ul li.cart {width:25%;}
	
	#footer {padding:1em;font-size:0.9em;}
	#footer ul {padding:0;margin:0;}
	#footer ul.list {width:75%;}
	#footer ul.list li {text-align:left;width:100%;}
	#footer .social {width:25%;padding-right:1em;}
	#footer .social div {width:100%;display:inline-block;text-align:right;margin:0 0 1.2em 0;}
}