@charset "utf-8";
/*
Theme Name: yuu
Author: Le Pivot
Version: 1.0
*/

/* --------------------------------------------------
	fonts
-------------------------------------------------- */
@font-face {
	font-family: "FLOPDesignFont";
	src: url("Font/FLOPDesignFont.eot");
	src: url("Font/FLOPDesignFont.eot?#iefix") format("embedded-opentype"),
	url("Font/FLOPDesignFont.woff") format("woff"),
	url("Font/FLOPDesignFont.ttf") format("truetype");
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: "RNSBaruta";
	src: url("Font/RNS-B.eot");
	src: url("Font/RNS-B.eot?#iefix") format("embedded-opentype"),
	url("Font/RNS-B.woff") format("woff"),
	url("Font/RNS-B.ttf") format("truetype");
	font-weight: normal;
	font-style: normal;
}

/* --------------------------------------------------
	Basic Design
-------------------------------------------------- */

body {
	font-family:"FLOPDesignFont","Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif; color:#fff; background-color:#7f899c;
	font-size:1.0rem; line-height:1.4em; letter-spacing: 0; 
	margin: 0;
	padding: 0;
	}



img {
	margin: 0;
	padding: 0;
}

img a:hover {opacity: 0.5 ;}
img a:active {opacity: 1.0 ;}

h2{font-family:"RNSBaruta", "Helvetica Neue", Arial; color:#FFF; font-size:3rem; margin: 0; padding: 2rem 0 0 0;}
h3{font-family:"RNSBaruta", "Helvetica Neue", Arial; color:#FFF; font-size:1.25rem; margin: 0; padding: 0.65rem 0 0.65rem 0;}
h4{color:#FFF; font-size:1rem; margin: 0; padding: 0.25rem 0 0 0;}

.break{margin:5rem 0;}
.breakX{margin:25rem 0;}
.short-break{margin:2rem 0;}
.naming{margin:10rem 0 0 0;}
.stockstatus{font-family:"RNSBaruta", "Helvetica Neue", Arial; color:#fff; font-size:1rem; margin: 0; padding: 0 0 2rem 0;}
.blink {
	-webkit-animation: blink 1s ease infinite;
	animation: blink 1s ease infinite;
}
@-webkit-keyframes blink {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
@keyframes blink {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
.frenchy{font-family: "Quicksand", sans-serif;}
.backtohome{font-family:"RNSBaruta", "Helvetica Neue", Arial; color:#fff; font-size:1rem; margin: 0; padding: 0;}

#footer {
font-family: 'Quicksand', sans-serif; margin: 0; padding: 5rem 0 5rem 0;
}
/*----------
#818c9e Old
#7d8b9f
#828b9b
#808b9d

7d8b9f
818c9e
818c9e

7e8b9f
7e889a

7f899c
-----------*/

#page-wrapper{
	background-color:#7f899c;
	width:100%;
	padding:0;
	margin:0; 
	text-align: left;
}

#page-wrapper a {color:#fff; text-decoration:none;}
#page-wrapper a:hover {color:#fdbaed;}
#page-wrapper a:active {color:#fd6edb;}

#page-wrapper ul {list-style: none; padding:0 0 0 0.6rem;}

#page-wrapper hr {color:#fff; height:2px; margin:0.2rem 0; padding:0;}

.table {color:#fff;}


/* --------------------------------------------------
  Selected Text
-------------------------------------------------- */

::selection {
	color:#fff;
	background:#e8b9a9; /* Safari */
}

::-moz-selection {
	color:#fff;
	background:#e8b9a9; /* Firefox */
}

/* --------------------------------------------------
  Map
-------------------------------------------------- */
.map a img{
	transition: all 0.4s;
}
.map a:hover img{
	transform: translate(0, -1.0rem);
}
.map a:active img{
	transform: scale(1.05,1.05);
	transform: translate(0, -1.8rem);
}



/* --------------------------------------------- */
/* Responsive Design 320-360-576-768-1200 -------*/
/* --------------------------------------------- */

/* ------------------------------------ */
/* Small devices (iphone, 360px and up) */
/* ------------------------------------ */
	#page-wrapper{padding:0 2%;}
/* ------------------------------------ */
/* Small devices (iphone, 576px and up) */
/* ------------------------------------ */
@media (min-width: 576px) {
	#page-wrapper{padding:0 2%;}
}
/* ------------------------------------ */
/* Midium devices (iPad, 768px and up)  */
/* ------------------------------------ */
@media (min-width: 768px) {
	#page-wrapper{padding:0 10%;}
}
/* --------------------------------------------------- */
/* Extra large devices (large desktops, 1200px and up) */
/* --------------------------------------------------- */
@media (min-width: 1200px) {
	#page-wrapper{padding:0 16%;}
}

.flip{transform: scale(-1, 1);}