@import url("reset.css");
@import url("font.css");

/*-------------COLOR----------------

pink : #f02586;
magenta: #b21dac;
brown: #a77f5b;
blue: #006fb7;
gray: #868686;

----------------------------------*/
/*------common style-------------*/

body {background:#fff;margin:0px;padding:0px;font-family:"Anton", "Impact", Helvetica, Arial, Sans-serif!important;text-align: left !important;}

a { text-decoration: none; }

a:hover {text-decoration: none; }

::selection {/* Safari */ }

::-moz-selection {/* Firefox */ }

section {display: block; }

.clear{width:100%;clear:both; display: block;overflow: hidden;visibility: hidden;}  

.pink{background-color:#f02586;}
.magenta{background-color:#b21dac;}
.brown{background-color:#a77f5b;}
.blue{background-color:#006fb7;}
.gray{background-color: #868686;}

.text-pink{color:#f02586 !important;}
.text-magenta{color:#b21dac!important;}
.text-brown{color:#a77f5b !important;}
.text-blue{color:#006fb7 !important;}
.text-gray{color:#868686 !important;}

.no-r-margin{margin-right: 0px !important;}

#header, #footer{line-height: initial;}

div.container, div.slider-container{width: 1400px; height: auto;margin: 0 auto;}

div.opacity{position: fixed; height: 100%;width: 100%;background: url(../img/bkg/bkg_opacity.png) repeat; z-index: 101;top: 0;left: 0;}

div.slider-container{position: relative;}

section[role="content"] header,section#page-content #page-info .container {padding-top: 10px;}

section[role="content"] header .container,  section#main-content .container,#page-info .container{width: 1000px;}

/*-----Content style----------*/

section[role="content"]{width:100%; background: url(../img/bkg/slider-bkg.png ) repeat-x ;margin-top: 52px;position: relative;height: 595px	;}

section[role="content"] header {min-width:1000px;overflow: hidden;height:98px; background:none ;position:relative;z-index: 10;}

section[role="content"] header h1{background: #000; width: 980px; height: 48px; color: #fff;font-size: 40px; text-align: left;text-transform: capitalize; line-height: 58px;padding-left: 20px;padding-top:10px;position:relative;z-index: 10;}

section[role="content"] header h1 a{display: block;background: url("../img/sprites/sprite-text.png") 0 -200px ;width:380px; height: 35px;}

section[role="content"] header h2 {font-size: 30px;margin-top: 13px;text-align: center;text-transform: uppercase;width: 333.3px;float: left;height: 28px;position:relative;z-index: 10; }

section[role="content"] header h2 a {display:block;height: 35px; width:190px; background: url("../img/sprites/sprite-text.png"); margin: 0 auto;}

section[role="content"] header h2.loverdose-caption a{background-position: 0px -1px; }

section[role="content"] header h2.loverdose-caption a:hover,section[role="content"] header h2.loverdose-caption a.active{background-position: 0px -33px;}

section[role="content"] header h2.fuel-caption a{background-position: 0px -67px}

section[role="content"] header h2.fuel-caption a:hover,section[role="content"] header h2.fuel-caption a.active{background-position: 0px -100px}

section[role="content"] header h2.brave-caption a {background-position: 0px -134px}

section[role="content"] header h2.brave-caption a:hover,section[role="content"] header h2.brave-caption a.active{background-position: 0px -167px !important;}

section#main-content figure.Perfume{float: left;margin-top: 82px; position: relative;text-align:left!important;}

section#main-content figure.Perfume img {opacity: 0;}

section#main-content figure.Perfume img.hover { position: absolute; top: 0; left: 0px; }

section#main-content .perfume-video iframe{overflow: visible;}

section#page-info{margin-bottom: 100px;}

/*--------------------------------------------------*/
/*--------------------page-------------------------*/

section#page-content{margin-top: 700px;}

.line{width: 1000px; height: 22px;z-index: 10;position: relative;}

.line2{;z-index: 102!important;width: 1000px!important;height: 22px;z-index: 10;position: absolute;top: 0;left: 0;}

.line a{width: 22px; height: 22px;display:block;float: right;margin: 0!important;}

.page-bg{width: 712px;height: 970px;float: right;z-index: 1;margin-bottom: 40px;position: absolute;right: 0;display: none;top: 0px;}

.page-article {width: 900px;padding: 50px;z-index: 102;position: absolute;background-color:#fff;}

.page-article.special {width: 1000px;padding: 0px;padding-top:22px;overflow: hidden;height: 678px;}

.page-article iframe{width: 100%; height: 678px;}

.page-article article{float: left;width: 458px;} 

.page-article article h4{font-size: 40px; text-transform: uppercase;margin-bottom: 20px;}

.page-article article p.text{font-size: 14px; font-family: 'Oswald', sans-serif !important; color: #000;width: 390px;padding-top: 20px; padding-bottom: 20px;text-align: justify !important;display: none; }

.page-article article p{display: none;}

.page-article article a{font-size: 20px;text-transform: uppercase; margin-top: 10px; font-weight: normal;display: block; }

.page-article div.seprator-line { width: 390px; height: 2px;}

.page-article div.seprator-videoline { width: 890px; height: 2px;margin-bottom: 35px;}

.page-article div.videotitle { font-size: 30px;font-family: arial Helvetica, Sans-serif;text-transform: uppercase;font-weight: bold; }

.page-article figure img{width: 430px; height: 550px;}

#page-info div.perfume-info{width: 640px; height: 363px; float: left;position: relative;z-index: 2;}

#page-info div.perfume-info figure{margin:0 auto;width: 330px; }  

#page-info div.perfume-video{width: 640px; height: 360px; z-index: 10;position: relative;}

section#page-content #page-gallery .container{width: 1400px;margin:0 auto;}

#page-gallery ul.gallery-group{margin-left:26px;-webkit-font-smoothing: antialiased;}

.gallery-group li{float: left;width: 442px; height: 226px;margin-right: 7px; margin-bottom: 7px;position: relative;}

.gallery-group li a{display: block;height: 100%;overflow: hidden;position: relative;margin-left: 6px;}

.gallery-group li a img {  width: auto; height: 100%; position: relative;}

.gallery-group li .box{position: absolute;bottom: 2px;left: 2px;right: 2px;height: 42px;width: auto;background: url(../img/bkg/bkg_header_second.png) repeat top left;
color: #ffffff;font-size: 15px;font-style: normal;text-transform: uppercase;-webkit-transition: height 0.25s ease-in-out;-moz-transition: height 0.25s ease-in-out;
-o-transition: height 0.25s ease-in-out;-ms-transition: height 0.25s ease-in-out;transition: height 0.25s ease-in-out;}

.gallery-group li a .box span{margin: 9px 0 0 15px;display: block;text-align:left;-webkit-transition: margin-top 0.25s ease-in-out;-moz-transition: margin-top 0.25s ease-in-out;
-o-transition: margin-top 0.25s ease-in-out;-ms-transition: margin-top 0.25s ease-in-out;transition: margin-top 0.25s ease-in-out;}

.gallery-group li a .box:visited,
.gallery-group li a span:visited{
 height: 42px;
}

.gallery-group li a .box:visited,
.gallery-group li a span:active,
.gallery-group li a .box:hover,
.gallery-group li a:hover .box{
  height: 56px;
}

.gallery-group li .box span:hover{ margin-top: 16px;-webkit-transition: margin-top 0.25s ease-in-out;-moz-transition: margin-top 0.25s ease-in-out;-o-transition: margin-top 0.25s ease-in-out; -ms-transition: margin-top 0.25s ease-in-out;
  transition: margin-top 0.25s ease-in-out;}

.gallery-group li .box:hover{-webkit-transition: height 0.25s ease-in-out;-moz-transition: height 0.25s ease-in-out;-o-transition: height 0.25s ease-in-out;-ms-transition: height 0.25s ease-in-out;
transition: height 0.25s ease-in-out;}

.gallery-group li a:hover .box span { margin-top: 16px;-webkit-transition: margin-top 0.25s ease-in-out; -moz-transition: margin-top 0.25s ease-in-out; -o-transition: margin-top 0.25s ease-in-out;
  -ms-transition: margin-top 0.25s ease-in-out;transition: margin-top 0.25s ease-in-out;}

/*---------------loverdose page--------------------*/
.loverdose .line{background:#b21dac;}

section.loverdose .line{background: #eed6ce;}

/* loverdose tattoo blocks */
.loverdose.tattoo .line,
.loverdose.visuel .line,
.loverdose.advertising .line,
.loverdose.film .line,
.loverdose.making .line{background:#000000;}
article.page-article.loverdose.tattoo,
article.page-article.loverdose.advertising{background: #eed6ce; height: 600px;}
article.page-article.loverdose.film,
article.page-article.loverdose.making{background: #eed6ce; height: auto;}

.loverdose .line a{background: url(../img/loverdose-tattoo-close.png); }

.loverdose .page-bg{background:url(../img/loverdose-bg.png) no-repeat;}

.loverdose #page-info div.perfume-info{margin-bottom: 40px;}

.loverdose #page-info div.perfume-info figure div.perfume-img {background: url(../img/loverdose.png);width: 330px; height: 411px;margin-top: -20px;}

.loverdose #page-info div.perfume-info figcaption h3{background: url(../img/loverdose-caption.png); width: 640px; height: 130px;}

.loverdose header h2 {}

section[role="content"].loverdose header h2.loverdose-caption a{background-position: 0px -33px;}

section[role="content"] header h2.loverdose-caption a.normal{background-position: 0px -1px;}

.loverdose.page-article article img{margin-left: -120px;margin-bottom: 70px;}

.loverdose.page-article article h4{color: #b21dac; width: 390px;font-weight: normal; }

.loverdose.page-article article a{color: #b21dac; }

.loverdose.page-article div.seprator-line {  background: #b21dac;}

.loverdose.page-article div.seprator-videoline { background: #b21dac;}

.loverdose.page-article div.videotitle { color:#b21dac; }

.loverdose.tattoo.page-article article h4{color: #000000; width: 390px;font-weight: normal; }

.loverdose.tattoo.page-article article a{color: #000000; }

.loverdose.tattoo.page-article div.seprator-line {  background: #000000;}

.loverdose.tattoo.page-article div.seprator-videoline { background: #000000;}

.loverdose.tattoo.page-article div.videotitle { color:#000000; }

/*-----------------fuel page-----------------------*/

.fuel-for-life .line{background:#a77f5b;}

.fuel-for-life .line a{background: url(../img/fuel-close.png); }

.fuel-for-life .page-bg{background:url(../img/fuel-bg.png) no-repeat;height: 968px;}

.fuel-for-life #page-info div.perfume-info{margin-top: 25px;}

.fuel-for-life #page-info div.perfume-info figcaption h3{text-indent: -999px;background:url(../img/fuel-caption.png) no-repeat; width:312px; height:34px;margin: 0 auto }

.fuel-for-life #page-info div.perfume-info figure div.perfume-img {background: url(../img/fuel2.png) no-repeat;width: 172px; height: 385px;margin: 30px auto 0px;}

.fuel-for-life #page-info div.perfume-info figure {margin: 0 auto;width: 360px;}

.fuel-for-life #page-info div.perfume-video{top: 20px;} 

section[role="content"].fuel-for-life header h2.fuel-caption a{background-position: 0px -100px; }

section[role="content"] header h2.fuel-caption a.normal{background-position: 0px -67px;}

.fuel-for-life.page-article article img{margin-bottom: 85px;}

.fuel-for-life.page-article article h4{color: #a77f5b; width: 390px;font-weight: normal; }

.fuel-for-life.page-article article p{color: #000; }

.fuel-for-life.page-article article a{color: #a77f5b; }

.fuel-for-life.page-article div.seprator-line {  background: #a77f5b;}

.fuel-for-life.page-article div.seprator-videoline { background: #a77f5b;}

.fuel-for-life.page-article div.videotitle { color:#a77f5b; }

/*---------------brave page----------------------*/

.only-the-brave .line{background:#000000;}

.only-the-brave .line a{background: url(../img/brave-close.png); }

.only-the-brave .page-bg{background:url(../img/brave-bg.png) no-repeat;}

.only-the-brave #page-info div.perfume-info{margin-bottom: 30px;}

.only-the-brave #page-info div.perfume-info figcaption h3{background: url(../img/brave-caption.png) no-repeat; width:640px; height:173px;}

.only-the-brave #page-info div.perfume-info figure {width: 480px;}

.only-the-brave #page-info div.perfume-info figure div.perfume-img {background: url(../img/brave2.png);width: 473px; height: 296px; margin: -1px 0 0 3px;}

.only-the-brave #page-info div.perfume-video{top: 30px;} 

section[role="content"].only-the-brave header h2.brave-caption a{background-position: 0px -167px;}

section[role="content"] header h2.brave-caption a.normal{background-position: 0px -134px;}

.only-the-brave.page-article article img{margin-bottom: 80px;}

.only-the-brave.page-article article h4{color: #d0d0d0; width: 390px;font-weight: normal; }

.only-the-brave.page-article article a{color: #006fb7; }

.only-the-brave.page-article.position article a{display: none;}

.only-the-brave.page-article div.seprator-line {  background: #d0d0d0;}

.only-the-brave.page-article div.seprator-videoline { background: #006fb7;}

.only-the-brave.page-article div.videotitle { color:#006fb7; }


/*--------------------gallery-page-------------------------*/

.gallery-page[role='content'] {height:1470px;} 

.gallery-page #page-content{margin-top: 0px;}

.gallery-page .page-article iframe{width: 100%; height: 678px;}

@media only screen and  (max-width: 1400px){
	section#page-content #page-gallery .container {width: 1245px;}
	#page-gallery ul.gallery-group {margin-left: 0px;}
	.gallery-group li {width: 415px;margin-right: 0px;}
}

@media only screen and (min-width: 830px) and (max-width: 1260px) {
	section#page-content #page-gallery .container {width: 830px;}

}

/*(max-width: 1000px)(devices and browsers) */

@media only screen and (max-width: 830px) {
section#page-content #page-gallery .container {width: 415px;}
}

@media only screen and (max-width: 1540px){

section[role="content"].fuel-for-life header h2.brave-caption a,
section[role="content"].loverdose header h2.brave-caption a {background-position: 0px -245px;}
}

/******************** Royal Slider ***********************/

#full-width-slider {
  width: 100%;
  height: 678px!important;
}
.coloredBlock {
  padding: 12px;
  background: rgba(255,0,0,0.6);
  color: #FFF;
   width: 200px;
   left: 20%;
   top: 5%;
}
.infoBlock {
  position: absolute;
  top: 30px;
  right: 30px;
  left: auto;
  max-width: 25%;
  padding-bottom: 0;
  background: #FFF;
  background: rgba(255, 255, 255, 0.8);
  overflow: hidden;
  padding: 20px;
}
.infoBlockLeftBlack {
  color: #FFF;
  background: #000;
  background: rgba(0,0,0,0.75);
  left: 30px;
  right: auto;
}
.infoBlock h4 {
  font-size: 20px;
  line-height: 1.2;
  margin: 0;
  padding-bottom: 3px;
}
.infoBlock p {
  font-size: 14px;
  margin: 4px 0 0;
}
.infoBlock a {
  color: #FFF;
  text-decoration: underline;
}
.photosBy {
  position: absolute;
  line-height: 24px;
  font-size: 12px;
  background: #FFF;
  color: #000;
  padding: 0px 10px;
  position: absolute;
  left: 12px;
  bottom: 12px;
  top: auto;
  border-radius: 2px;
  z-index: 25; 
} 
.photosBy a {
  color: #000;
}
.fullWidth {
  max-width: 1400px;
  margin: 0 auto 24px;
}

@media screen and (min-width:960px) and (min-height:660px) {
  .heroSlider .rsOverflow,
  .royalSlider.heroSlider {
      height: 520px !important;
  }
}

@media screen and (min-width:960px) and (min-height:1000px) {
    .heroSlider .rsOverflow,
    .royalSlider.heroSlider {
        height: 660px !important;
    }
}
@media screen and (min-width: 0px) and (max-width: 800px) {
  .royalSlider.heroSlider,
  .royalSlider.heroSlider .rsOverflow {
    height: 300px !important;
  }
  .infoBlock {
    padding: 10px;
    height: 100%;
    max-height: 100%;
    min-width: 40%;
    left: 0;
    top: 0;
    right: auto;
    font-size: 12px;
  }
  .infoBlock h3 {
     font-size: 14px;
     line-height: 17px;
  }
}