/* -------------------------------------------------------

	Description: Ferret

------------------------------------------------------- */



body {
	font-family: 'Oxygen', sans-serif;
	margin: 0 auto;
	padding: 0;
	max-width: 962px;
	border: 16px solid white;
}




/* ---- Header ---- */

header {
	width: 88.89%;
	margin: 0 auto;
}




div {
  	background-color: fff;
  	width: 100%;
  	padding: 0;
   	border: 0;
    	margin: 0;
}


.address {
  	width: 55%;
    	padding: 0 0 0 5.55%;
	float: left;
}

.info {
  	width: 28%;
	float: right;
}



.boutique {
 	display: inline-block;
  	width: 56%;
	float: left;
}

.map {
 	display: inline-block;
  	width: 44%;
   	margin: 0;
    	padding: 0;
}


iframe {
    padding: 0;
    margin: 0;
}



ul {
	list-style: none;
   	margin: 0;
    	padding: 0;
	text-align: right;
	margin: 10px 0 0 0px;

}

li {
    display: inline;
        margin-left: 0.86em;
}




li a {
 	display: inline-block;
	text-align: right;
    	padding: 0 0 0 0px;
	font-family: 'Oxygen', sans-serif;
	color: #a19f9f;
	font-size: 1em; 
	letter-spacing: 0.6px;
	text-decoration: none;
	font-weight: 300;
}

li a:link {
	opacity:2;
	filter:alpha(opacity=2); /* For IE8 and earlier */
	}


li a:hover {
	opacity:1;
	filter:alpha(opacity=0.6); /* For IE8 and earlier */
	-webkit-transition: all 0.6s ease reverse forwards;
	-moz-transition: all 0.6s ease;
	-ms-transition: all 0.6s ease;
	-o-transition: all 0.6s ease;
	transition: all 0.6s ease;
    text-decoration: none;
}





a:link {
    color: #a19f9f;
    text-decoration: none;
}

a:hover {
    color: #000;
    text-decoration: none;
}



strong { 
	font-weight: bold; 
}



h1,
h2,
h3,
h4,
h8,
h12 {
	color: #000;
	line-height: 1.28em;
	margin-bottom: 14px;
	margin: 0 0 0 0;
}



h1 {
	font-family: 'Oxygen', sans-serif;
	color: #a19f9f;
	font-size: 1.1em; 
	letter-spacing: 0.7px;
	text-decoration: none;
   	display: inline;
	text-align: right;
	font-weight: 300;
}


h2 {
	font-family: 'Oxygen', sans-serif;
	color: #5c5c5c;
	text-align: left;
	font-size: 1.9em; 
	letter-spacing: 1.9px;
	font-weight: 300;
}


h12 {
	font-family: 'Oxygen', sans-serif;
	color: #5c5c5c;
	text-align: left;
	font-size: 1em; 
	letter-spacing: 0.7px;
	font-weight: 300;
}

h4 {
 	display: inline-block;
	text-align: right;
    	padding: 0 0 8px 0;
	font-family: 'Oxygen', sans-serif;
	color: #000;
	font-size: 1em; 
	letter-spacing: 0.6px;
	text-decoration: solid 1px 000;
	border-bottom: solid 1px;
	font-weight: 300;
}


h3 {
	font-family: 'Oxygen', sans-serif;
	color: #5c5c5c;
	font-size: 0.96em; 
	text-align: left;
	letter-spacing: 1.28px;
	line-height: 1.48em;
	font-weight: 300;
}





h8 {
	text-align: left;
    	padding: 0 0 0 0;
	font-family: 'Oxygen', sans-serif;
	color: #c3c3c3;
	font-size: 0.8em; 
	letter-spacing: 1px;
	text-decoration: solid 0px;
	font-weight: 300;
}








/* Responsive Images */

img, img.scale-with-grid { outline: 0; max-width: 100%; height: auto; width: auto; }

a:link img {
	opacity:2;
	filter:alpha(opacity=2); /* For IE8 and earlier */
	}

a:hover img {
	opacity:0.6;
	filter:alpha(opacity=0.6); /* For IE8 and earlier */
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
}






/* ---- More ---- */



/* ---- Slider Fade —— */


.slider {
  max-width: 900px;
  height: 328px;
  margin: 0px auto;
  position: relative;
}
.slide1,.slide2,.slide3,.slide4,.slide5 {
  position: absolute;
  width: 100%;
  height: 100%;
}
.slide1 {
  background: url(rolex-1.jpg)no-repeat center;
      background-size: cover;
    animation: fade 32s infinite;
-webkit-animation: fade 32s infinite;
} 
.slide2 {
  background: url(decouvrir-rolex-chez-ferret-joaillier.jpg)no-repeat center;
      background-size: cover;
    animation: fade2 32s infinite;
-webkit-animation: fade2 32s infinite;
}
.slide3 {
    background: url(celeb-1.jpg)no-repeat center;
      background-size: cover;
    animation: fade3 32s infinite;
-webkit-animation: fade3 32s infinite;
}
.slide4 {
    background: url(celeb-2.jpg)no-repeat center;
      background-size: cover;
    animation: fade4 32s infinite;
-webkit-animation: fade4 32s infinite;
}

.slide5 {
    background: url(celeb-3.jpg)no-repeat center;
      background-size: cover;
    animation: fade5 32s infinite;
-webkit-animation: fade5 32s infinite;
}


@keyframes fade
{
  0%   {opacity:1}
  20% { opacity: 0}
  40% { opacity: 0}
  60% { opacity: 0}
  80% { opacity: 0}
  100% { opacity: 1}
}
@keyframes fade2
{
  0%   {opacity:0}
  20% { opacity: 1}
  40% { opacity: 0}
  60% { opacity: 0}
  80% { opacity: 0}
  100% { opacity: 0}
}
@keyframes fade3
{
  0%   {opacity:0}
  20% { opacity: 0}
  40% { opacity: 1}
  60% { opacity: 0}
  80% { opacity: 0}
  100% { opacity: 0}
}
@keyframes fade4
{
  0%   {opacity:0}
  20% { opacity: 0}
  40% { opacity: 0}
  60% { opacity: 1}
  80% { opacity: 0}
  100% { opacity: 0}
}

@keyframes fade5
{
  0%   {opacity:0}
  20% { opacity: 0}
  40% { opacity: 0}
  60% { opacity: 0}
  80% { opacity: 1}
  100% { opacity: 0}
}


