@font-face {
	font-display: swap;
	font-family: 'Rochester';
	font-style: normal;
	font-weight: 400;
	src: url('font/rochester-v22-latin-regular.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'Roboto Slab';
	font-style: normal;
	font-weight: 300;
	src: url('font/roboto-slab-v34-latin-300.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'Oswald';
	font-style: normal;
	font-weight: 200;
	src: url('font/oswald-v53-latin-200.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'Oswald';
	font-style: normal;
	font-weight: 400;
	src: url('font/oswald-v53-latin-regular.woff2') format('woff2');
}
@font-face {
	font-display: swap;
	font-family: 'Oswald';
	font-style: normal;
	font-weight: 600;
	src: url('font/oswald-v53-latin-600.woff2') format('woff2');
}



body{
	background-image: url(img/flowers.png);
	margin: 0;
	font: 18px/26px "Roboto Slab", sans-serif;
	color: #444
}
html,body{
	height: 100%;
}
img{
	border: none;
}
div.imgLens{
	cursor:none;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.7);
	background-color: #fff;
	display: none;
}
div.imgLensInner{
	/*background-image: url(img/imglens.png);*/
}
a{
	color: #333;
	text-decoration: none;
}
a.hl{
	text-shadow: 0 0 5px rgba(0, 0, 0, 0.57);
}

p{
	margin-top: 10px;
	margin-bottom: 15px;
}
ul,li{
	padding: 0;
	margin: 0;
	list-style: none;
}
#site{
	width: 920px;
	/*min-height: 100%;*/
	margin: 0 auto;
	
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin-bottom: -60px;
	padding-bottom: 60px;
}
header{
	height: 220px;
	border-radius: 10px;
	margin-bottom: 15px;
	background: url(img/bg_header.png) repeat-x;
}
#logo{
	display: none;
	height: 176px;
	width: 176px;
	left: 50%;
	margin-left: -88px;
	border-radius: 50%;
	position: absolute;
	z-index: 200;
	text-align: center;
	margin-top: 25px;
	
}
#logo img{
	height: 70px;
	width: auto;
	margin-top: 40px;
}
nav{
	width: 100%;
	padding-top: 35px;
	
	
}
nav ul{
	list-style: none;
	display: block;
	width: 90%;
	margin: 0 5%;
	height: 100px;
}
nav li{
	padding: 0;
	margin: 0;
	display: block;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
	width: 170px;
	height: 170px;
	border-radius:50%;
	background-color: #fff;
}
nav li:first-child{
	background-color: #444;
}
nav li:not(.roundabout-in-focus):hover{
	box-shadow: 0 0 3px 5px rgb(255, 255, 255);
}

nav ul a{
	display: block;
	z-index: 260;
	width: 100%;
	height: 100%;
	border-radius:50%;
	overflow: hidden;
}

nav ul img{
	display: block;
	margin: 0 auto;
	width: auto;
	width: 100%;
	height: 100%;
}

nav li.roundabout-in-focus {
    background: url(img/logoNormal.png) no-repeat center center;
    background-size: 200px 200px;
    margin-top: -15px;
}

html.csstransforms3d nav li.roundabout-in-focus{
	background: url(img/logoReverse.png) no-repeat center center;
	background-size: 200px 200px;
	margin-top: 0px;
	
	-webkit-transform: scale(1) translateY(-25px) rotateY(180deg);
	-webkit-transition: -webkit-transform 1s ease-in-out;
	-moz-transform: scale(1) translateY(-25px) rotateY(180deg);
	-moz-transition: -moz-transform 1s ease-in-out;
	-ms-transform: scale(1) scaleX(-1) translateY(-25px);
	-ms-transition: -ms-transform 1s ease-in-out;
	-o-transform: scale(1) translateY(-25px) rotateY(180deg);
	-o-transition: -o-transform 1s ease-in-out;
	transform: scale(1) translateY(-25px) rotateY(180deg);
	transition: transform 1s ease-in-out;
}

nav li.roundabout-in-focus img{
	-webkit-transition: margin 0s ease-in-out 0.5s;
	-moz-transition: margin 0s ease-in-out 0.5s;
	-ms-transition: margin 0s ease-in-out 0.5s;
	-o-transition: margin 0s ease-in-out 0.5s;
	transition: margin 0s ease-in-out 0.5s;
	
	margin-top: -200px;
}


nav li:not(.roundabout-in-focus){
	-webkit-backface-visibility: visible;
	-webkit-transition: -webkit-transform 0.2s ease-in-out 0s;
	-webkit-transform: scale(.6) translateY(0px);
	-moz-backface-visibility: visible;
	-moz-transition: -moz-transform 0.2s ease-in-out 0s;
	-moz-transform: scale(.6) translateY(0px);
	-ms-backface-visibility: visible;
	-ms-transition: -ms-transform 0.2s ease-in-out 0s;
	-ms-transform: scale(.6) translateY(0px);
	-o-backface-visibility: visible;
	-o-transition: -o-transform 0.2s ease-in-out 0s;
	-o-transform: scale(.6) translateY(0px);
	backface-visibility: visible;
	transition: transform 0.2s ease-in-out 0s;
	transform: scale(.6) translateY(0px);
}


/* SECTION ITEM */

section{
	background: #eee;
	background-image: url(img/handmadepaper.png);
	border-radius: 10px;

	-webkit-transition: opacity 600ms ease-out;
	-moz-transition: opacity 600ms ease-out;
	-ms-transition: opacity 600ms ease-out;
	-o-transition: opacity 600ms ease-out;
	transition: opacity 600ms ease-out;
}
section::after,
#main::after{
	content: '';
	display: block;
	clear: both;
}
section.main{
	/* cuts float background */
	overflow: hidden;
}
section h1{
	margin: 0;
	font: normal 28px Oswald;
}
section h1.homepage {
	font: 32px/32px 'Rochester';
}
section h2{
	margin: 10px 0 0;
	font: normal 20px/24px Oswald;
}
section .price{
	font: 24px Oswald;
	text-transform: uppercase;
}
section .disp{
	float: left;
	height: 100%;
}
section #picture{	
	float: left;
	padding: 0 0 1020px;
	border-radius: 10px 0 0 10px;
	width: 410px;
	min-height: 380px;
	text-align: center;
	
	/* Float background fix */
	
	margin-bottom: -1000px;
	background: url(img/load.gif) no-repeat center 180px  #fff;
}
section .info{
	float: left;
	width: 410px;
	height: 100%;
	padding: 25px 25px 55px;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
/* SECTION TEXT */

section.text ul#pics,
section.text #picture{
	display: none;
}
section.text .btns{
	display: none;
}
section.text .info{
	float: left;
	width: 100%;
	padding-bottom: 25px;
}

section.img .info{
	width: 510px;
	padding-bottom: 1000px;
	margin-bottom: -1000px;
	background: url(img/bg_info.png) repeat-y right;
}
section.img .disp{
	float: right;
}
section.img #picture{
	border-radius: 0 10px 10px 0;
	display: block;
}

/* CLOSED / OPEN */

section.closed{
	/*-webkit-transform: translateZ(-1000px);
	transform: translateZ(-5000px);
	*/
	opacity: 0;
}
.loading{
	display: none;
	width: 140px;
	height: 95px;
	padding-top: 45px;
	border-radius: 50%;
	position: absolute;
	left: 50%;
	top: 360px;
	margin-left: -70px;
	text-align: center;
	font: 24px/32px 'Oswald';
	color: #444;
	background-color: #fff;
	-moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
	text-transform: uppercase;
}

/* SECTION PAYMENT */

#submain{
	margin-top: 15px;
	display: none;
}
section.shop{
	padding: 20px;
	height: auto;
	margin-top: 1px;
}
section.shop h1{
	margin-bottom: 10px;
}

section.shop .item{
	margin-top: 10px;
}
section.shop .img{
	display: inline-block;
	height: 40px;
	width: 45px;
	margin-right: 29px;
	text-align: top;
	margin-left: -70px;
}
div.item .img img{
	height: 100%;
	vertical-align: middle;
	border-radius: 15px;
	-moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
div.item .price{
font: 18px/26px "Oswald";
	float: right;
	margin-top: 8px;
	text-transform: uppercase;
}
div.item span.btn{
	width: 250px;
	display: inline-block;
}
section.shop span.right{
	width: auto;
	float: right;
}
section.shop .total span.right{
	margin-top: -9px;
}
section.shop .total{
	margin-top: 25px;
}
section.shop #ordertotal{
	margin-top: 0;
}
section.shop.proceed,
section.shop.send,
section.address{
	display: none;
}
section.shop.send{
	margin-top: 15px;
}
section.address .select{
	width: 190px;
	display: inline-block;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
	padding: 4px 20px 6px;
	border-radius: 12px;
	margin-bottom: 10px;
	cursor: pointer;
	background-color: #fff;
}
section.address .select:focus,
section.address .select:hover{
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
	background: url(img/bg_buttonHover.png) repeat-x #cdcdcd;
}
section.address .select.active{
	background: #454545;
	background: url(img/bg_buttonActive.png) repeat-x #454545;
}
section.address .select.active select{
	color: #fff;
}
section.address .select.active option{
	color: #fff;
	background: #454545;
}
section.address .select select{
	outline: none;
	border: none;
	background: url(img/select.svg) no-repeat right center transparent;
	width: 100%;
	-webkit-appearance: initial;
	font: 20px/26px "Roboto Slab";
}
input,textarea{
	box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.3);
	background-color: #fff;
	padding: 6px 20px 8px 20px;
	border-radius: 12px;
	text-shadow: none;
	font: 20px/26px "Roboto Slab";
	margin: 1px 0 10px;
	border: none;
	outline: none;
	width: 192px;
	height: 28px;
}
textarea{
	height: 120px;
	width: 397px;
}
input:focus,
textarea:focus{
	box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.3), 0 0 10px rgba(0, 0, 0, 0.3);
}
input:nth-child(2){
	width: 150px;
	margin-left: 15px;
}
.validate input.error,
.validate textarea.error{
	background-color: #fef1f1;
	box-shadow: inset 0 0 6px rgba(255, 24, 24, 0.6);
}
.validate .select.error{
	background-color: #fef1f1;
	box-shadow: 0 0 10px rgba(255, 24, 24, 0.6);
}
div.item.last{
	margin-bottom: -8px;
}

input.placeholder,
textarea.placeholder{
	color: #777;
}

button.btn{
	margin-right:1px;
	box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
	border-radius: 12px;
	text-shadow: none;
	font: 18px/26px "Roboto Slab";
	border: none;
	cursor: pointer;
	background-color: #fff;
	padding: 6px 14px 8px;
}
button.btn:hover{
	background: url(img/bg_buttonHover.png) repeat-x #cdcdcd;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}
button.btn.active,
button.btn:active{
	background: url(img/bg_buttonActive.png) repeat-x #454545;
	color: #fff;
}
button.btn[disabled="disabled"]{
	opacity: .5;
	cursor:default;
}
button.btn[disabled="disabled"]:hover{
	box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
	background: #fff;
}
button.btn.buy,
button.btn.back{
	margin-left: 1px;
	border-radius: 10px 0 0 10px;
}
button.next,
button.share{
	margin-left: -4px;
	border-radius: 0 10px 10px 0;
}

button.btn.buy{
	padding-right: 8px;
}
button.btn img{
	vertical-align:middle;
	margin-right: 5px;
}
button.btn.share{
	width: 60px;
	padding-left: 0;
	padding-right: 0;
}
button.btn.back,
button.btn.next{


}
div.zoompart{
	width: 530px;
	display: inline-block;
}
button.btn.zoom{
	width: 50px;
	border-radius: 0 10px 10px 0;
}
button.btn.zoom:hover+span.zoominfo{
	opacity: 1;
} 
div.btns{
	height: 40px;
	clear: both;
	float: left;
	margin-left: 0px;
	margin-top: -65px;
	width: 940px;
}
span.zoominfo,
span.likes{
	position: relative;
	left: -23px;
	top: 0px;
	height: 56px;
	display: inline-block;
	background: url(img/likes_right.png) no-repeat right, url(img/likes_left.png) no-repeat left;
	padding-left: 30px;
	padding-right: 18px;
	margin-right: -22px;
}
span.zoominfo span,
span#fb_likes{
	background: url(img/likes_mid.png) repeat-x;
	height: 43px;
	padding-top: 13px;
	display: inline-block;
	padding-right: 5px;
}
span.zoominfo{
	opacity: 0;
	left: -20px;
}

/* PIC TABS */
ul#pics, 
ul#pics li{
	list-style: none;
	padding: 0;
	margin: 0;
	margin-bottom: 1px;
}
ul#pics{
	float: left;
	z-index: 9;
	left: 410px;
	top: 0px;
	padding-top: 15px;
	background: url(img/bg_pics.png) repeat-y;
	width: 100px;
	height: 100%;
	
	/* Float background fix */
	padding-bottom: 1010px;
	margin-bottom: -1000px;
}
ul#pics li{
	background-color: #fff;
	border-radius: 0 10px 10px 0;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	width: 100px;
}
ul#pics li:hover{
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}
ul#pics a{
	display: block;
	position: relative;
	background: url(img/bg_pics.png) repeat-y;
}
ul#pics img{
	margin-left: 12px;
	margin-top: 5px;
	max-height: 75px;
	max-width: 75px;
}
ul#pics li a::before{
	content: '';
	position: absolute;
	z-index: 10;
	height: 120%;
	margin-left: -10px;
	border-left: 10px solid #fff;	
	width: 103px;
	margin-top: -10%;
}
ul#pics li.active a::before{
	content: '';
	position: absolute;
	z-index: 10;
	margin-top: -8px;
	border: none;
	width: 103px;
	height: 100%;
	background: url(img/picstab_top.png) no-repeat 0 top;
	box-shadow: none;
	margin-left: -10px;
}
ul#pics li.active a::after{
	content: '';
	position: absolute;
	z-index: 11;
	width: 103px;
	height: 100%;
	background: url(img/picstab_btm.png) no-repeat 0 bottom;
	margin-top: 8px;
	left: 0;
	margin-left: -10px;
}






/* LIST */

#itemList {
	margin-left: -25px;
	margin-right: -25px;
	vertical-align: top;
}
#itemList div.item .img{
	display: inline-block;
	height: 100px;
	width: 100px;
	margin-bottom: 10px;
}
#itemList div.item{
	width: 184px;
	display: inline-block;
	vertical-align: top;
	margin-top: 20px;
	margin-bottom: 0px;
	text-align: center;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 20px;
	padding: 10px 25px;
}
#itemList a:nth-of-type(5n+1) div.item{
	border-radius: 0 20px 20px 0;
}
#itemList a:nth-of-type(5n) div.item{
	border-radius: 20px 0 0 20px;
}
#itemList div.item:hover{
	background: #fff;
	-moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
#itemList div.item:hover .img img{
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
	
}

#itemList div.item .title{
}
#itemList div.item .price{
	float: none;
}
#itemList div.item div{
	display: inline-block;
}
#itemList div.item div span{
	display: block;
}

/* HOME */
div.carousel-frame{
	margin-left: -25px;
	margin-right: -25px;
	-moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
	background: #444;
}
.carousel-pagination {
	text-align: center;
	margin-top: 25px;
}
.carousel-pagination li {
	display:inline-block;
	width: 15px;
	height: 15px;
	border-radius: 50%;
	margin-right:15px;
	cursor:pointer;
	background:#fff;
	-moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}
.carousel-pagination .carousel-pagination-active {
	background:#444;
}


/* FOOTER */
footer{
	width: 930px;
	margin: 0 auto;
}
footer ul,
footer div.center{
	background: url(img/bg_footer.png) repeat-x;
	border-radius: 10px 10px 0;
	float: left;
	margin: 15px 5px 0;
	width: 160px;
	padding: 14px 25px 15px;
	min-height: 300px;
}
footer li a{
	display: block;
	color: #fff;
	margin-bottom: 20px;
	margin-top: 6px;
	line-height: 14px;
}
footer a:hover,
footer ul.copyright a:hover{
 	color: #fff;
}
footer ul.copyright li{
	color: #aaa;
	margin-bottom: 25px;
	text-align: right;
}
footer ul.copyright a{
	color: #aaa;
}
footer div.center{
	width: 430px;
	text-align: center;
	color: #bbb;
}
footer .heart{
	font: 22px Arial;
}


/* BLOG ROLL SNIPPETS */

section.blog{
	margin: 0 0px 0px -30px;
	max-width: 950px;
	background: none;
}
section.blog article{
	background-color: #eee;
	background-image: url(img/handmadepaper.png);
	border-radius: 10px;
	width: 445px;
	-moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.7);
	-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.7);
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.7);
	float: left;
	margin-left: 30px;
	margin-top: 15px;
	margin-bottom: 15px;
	overflow: hidden;
}
section.blog article p{
	margin: 5px 25px 0;
}
section.blog article div.img:before{
	content: 'Read this article';
	opacity: 1;
	display: block;
	padding-top: 27px;
	margin-bottom: -66px;
	height: 56px;
	padding-left: 50px;
	-webkit-transition: margin 0.3s ease-out 0s;
	transition: margin 0.3s ease-out 0s;
	background: url(img/readon.png) 0 18px / 46px 46px no-repeat;
	margin-left: 25px;
}
section.blog article h1{
	padding-top: 25px;
	padding-right: 25px;
	padding-left: 25px;
}
section.blog article img{
	display: block;
	margin-top: 0px;
	box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
	
	-webkit-transition: margin 0.3s ease-out 0s;
	transition: margin 0.3s ease-out 0s;
}
section.blog article a:hover img{
	margin-top: 60px;
	margin-bottom: -60px;
}
section.blog article a:hover p:after{
	opacity: 1;
}

div#morePosts{
	width: 120px;
	height: 120px;
	border-radius: 60px;
	background: url(img/moreposts.png) 14px 14px / 104px 93px no-repeat #fff;
	margin-left: 192px;
	margin-top: 25px;
	margin-bottom: 25px;
	cursor: pointer;
	float: left;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.7);
}
div#morePosts.end{
	background-image: none;
	cursor: default;
}
div#morePosts span{
	text-align: center;
	display: block;
	padding-top: 35px;
	line-height: 24px;
	text-shadow: 0 0 5px rgba(0, 0, 0, 0.57);
}
div#morePosts.end span{
	padding-top: 20px;
}

section.post~section.blog div#morePosts
{
	margin-left: 60px;
	margin-top: 20px;
}

/* BLOG ROLL HEADER*/

#blogHeader{
	text-align: center;
	color: #fff;
	text-shadow: 0 0 5px rgba(0, 0, 0, 0.57);
	margin-bottom: 10px;
	margin-top: 15px;
}
#blogHeader h1{
	font: 55px Oswald;
	font-weight: normal;
	margin: 0;
	padding: 0;
}
#blogHeader h1:before,
#blogHeader h1:after{
	background: url(img/blogheadleft.png) no-repeat;
	background-size: 69px 20px;
	content: '';
	display: inline-block;
	width: 69px;
	height: 20px;
	position: relative;
	top: 16px;
	margin-right: 10px;
}
#blogHeader h1:after{
	background-image: url(img/blogheadright.png);
	margin-left: 10px;
	margin-right: 0;
}
#blogHeader h2{
	font: 22px "Roboto Slab";
	font-weight: normal;
	margin: -12px 0 0;
	padding: 0;
}

/* BLOG SIDEBAR */

section.post~section.blog{
	width: 220px;
	float: right;
	margin-top: 0;
	margin-left: 0;
}
section.post~section.blog article{
	width: 205px;
	margin-left: 15px;
	margin-top: 0;
}
section.post~section.blog article h1{
	line-height: 26px;
	padding-top: 20px;
	padding-bottom: 0;
	font-size: 22px;
}
section.post~section.blog article p{
	display: none;
}
section.post~section.blog article img{
	width: 205px;
	height: auto;
}
section.post~section.blog article div.img:before{
	content: 'Read this';
}
	
/* FULL BLOG POST */

section.post{
	width: 700px;
	float: left;
}
section.post ul#pics{
	display: none;
}
section.post .btns{
	display: none;
}
section.post .info{
	width: auto;
}
section.post #picture{
	padding: 0;
	margin: 0 20px 10px 0;
	max-width: 390px;
	min-height: 0;
	display: none;
}
section.post img{
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.7);
}
section.post img{
	max-width: 100%;
}
section.post #picture div{
	line-height: 0;
}
section.post .info{
	float: none;
}
section.post p{
	font-family: "sauna";
}
section.post div.author{
	text-align: right;
}
section.post .intext{
	width: 390px;
}
section.post .intext.r{
	float: right;
	margin: 15px -25px 0 25px;
}
section.post .intext.l{
	float: left;
	margin: 10px 25px 0 -25px;
}
section.post .intext.c{
	margin: 15px -25px 0;
	text-align: center;
	width: auto;
}
section.post .intext span{
	display: block;
}
section.post .intext.l span{
	margin-left: 25px;
}


/* COMMENTS */
section.comments{
	display: none;
}
section.post~section.comments{
	display: block;
	float: left;
	width: 650px;
	margin-top: 15px;
	padding: 25px;
	margin-bottom: 15px;
}

/* SUBSCRIBE BAR */
section.subscribe{
	display: none;
}
section.blog~section.subscribe{
	display: block;
	clear: both;
}
section.subscribe h1{
	padding-top: 15px;
	margin-left: 25px;
	width: 445px;
	display: block;
}
section.subscribe p{
	padding-bottom: 15px;
	margin-right: 25px;
	margin-left: 25px;
	width: 445px;
	display: block;
	margin-bottom: 0;
}
section.subscribe ul{
	float:right;
	list-style: none;
	padding: 25px 0 0;
	margin: 0;
}
section.subscribe li{
	display: inline;
	margin-right: 25px;
}
section.subscribe a:hover img{
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.7);
	border-radius: 26px;
}