@font-face {
    font-family: 'haettenschweilerregular';
    src: url('../css/fonts/Haeten/hatten.eot');
    src: url('../css/fonts/Haeten/hatten.eot?#iefix') format('embedded-opentype'),
         url('../css/fonts/Haeten/hatten.ttf') format('truetype'),
         url('../css/fonts/Haeten/hatten.svg#haettenschweilerregular') format('svg');
    font-weight: normal;
    font-style: normal;

}


/* Start scroll button */
#scroll_prompt {
    position: fixed;
    left: 50%;
    top: 80%;
    z-index: 1000;
    margin: 0 0 0 -45px;
    width: 80px;
    height: 80px;
}
#scroll_prompt .droplet {
    position: absolute;
    left: 0;
    top: 0;
    width: 80px;
    height: 80px;
}
#scroll_prompt .wrapper {
    width: 110px;
    height: 110px;
    position: absolute;
    left: 0;
    top: 0;
    background: url(../images/sce/scroll-down.gif) no-repeat center 10px;
}
#scroll_prompt .wrapper .shaft {
    display: block;
    width: 100%;
    height: 20px;
    position: relative;
    overflow: hidden;
    top: 85px;
}
#scroll_prompt .wrapper .text {
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    width: 100%;
    height: 40px;
    text-align: center;
    color: #000;
    font-size: 19px;
    line-height: 20px;
    letter-spacing: 1px;
    font-family: 'caviar_dreams';
    text-align: center;
    -webkit-transition: all 150ms ease-out;
    -moz-transition: all 150ms ease-out;
    -ms-transition: all 150ms ease-out;
    -o-transition: all 150ms ease-out;
    transition: all 150ms ease-out;
}
#scroll_prompt:hover .wrapper .text {
    top: -20px
}
#vertical2 #scroll_prompt {
    top: 80%
}
/* End scroll button*/



#VerticalContainer #block1 .flying_loupe {
    position: absolute;
    left: 0;
    width: 100%
}
#VerticalContainer #block1 .flying_loupe .wrapper {
    width: 100%;
    max-width: 1500px;
    margin-left: auto;
    margin-right: auto;
    height: 916px;
    top: -295px;
    position: relative;
    background-position: top center;
    background-image: url(../images/sce/presentation_bg.png);
    background-repeat: no-repeat;
}
#VerticalContainer #block1 .flying_loupe .wrapper .gutter {
    position: relative;
    z-index: 1
}
#VerticalContainer #block1 .flying_loupe .gra {
    display: block;
    width: 460px;
    height: 120px;
    position: absolute;
    left: 15px;
    top: 200px;
    z-index: 10;
}
#VerticalContainer #block1 .flying_loupe ul {
    overflow: hidden;
    height: 500px;
    width: 560px;
    color: white;
    padding: 65px 40px;
    text-align: center;
}
#VerticalContainer #block1 .flying_loupe ul h2{
    font-family: 'caviar_dreams';
    font-size: 58px;
}
#VerticalContainer #block1 .flying_loupe ul p{
    font-family: 'OpenSans-CondensedLight';
    font-size: 23px;
}
#VerticalContainer #block1 .flying_loupe li {
    font-size: 16px;
    color: #fff;
    line-height: 30px;
    text-align: right;
    padding: 30px 0;
    height: 60px;
    position: relative
}
#VerticalContainer #block1 .flying_loupe li strong {
    font-family: 'proxima_nova_rgbold';
    display: block;
    font-size: 34px;
    font-weight: normal
}
#VerticalContainer #block1 .flying_loupe .depth_indicator {
    position: absolute;
    top: 125px;
    min-width: 265px;
    text-align: left;
    font-size: 16px;
    line-height: 45px;
    color: #fff;
    text-shadow: 0 0 40px rgba(13, 13, 13, 0.75);
}
#VerticalContainer #block1 .flying_loupe .depth_indicator .ft,
#VerticalContainer #block1 .flying_loupe .depth_indicator .m {
    font-family: 'haettenschweilerregular';
    display: block;
    font-size: 172px;
    margin-top: 50px;
    letter-spacing: 5px;
}
#VerticalContainer #block1 .flying_loupe .depth_indicator .profondeur {
    font-family: 'OpenSans-CondensedLight';
    font-size: 29px;
}
#VerticalContainer #block1 .flying_loupe .zoom {
    background: url(../images/ver1-stage1-pier.png) no-repeat -454px -118px;
    position: absolute;
    right: -132px;
    top: -18px;
    z-index: 2;
    width: 160px;
    height: 160px;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%
}
#VerticalContainer #block1 .flying_loupe .zoom .window {
    background: url(../images/ico/zoom-loupe.png) no-repeat 0 0;
    width: 140px;
    height: 140px;
    border: #c90a1c 10px solid;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    box-shadow: 0 0 40px rgba(13, 13, 13, 0.75);
    -moz-box-shadow: 0 0 40px rgba(13, 13, 13, 0.75);
    -webkit-box-shadow: 0 0 40px rgba(13, 13, 13, 0.75)
}
#VerticalContainer #block2 {
    height: 1300px;
    overflow: visible;
    top: -290px;
}
#VerticalContainer #block2 .stage2 {
    position: absolute;
    left: 0;
    width: 100%;
    height: 1450px;
}
#VerticalContainer #block2 .stage3 {
    position: absolute;
    left: 50%;
    top: 500px;
    width: 100%;
    margin-left: -470px;
    background: url(../images/text-box-tile-bg.gif) repeat-y 100% 0;
    box-shadow: 0 0 35px rgba(13, 13, 13, 0.25);
    -moz-box-shadow: 0 0 35px rgba(13, 13, 13, 0.25);
    -webkit-box-shadow: 0 0 35px rgba(13, 13, 13, 0.25)
}
#VerticalContainer #block2 article {
    position: relative;
    left: 0;
    top: 0;
    max-width: 460px;
    padding: 50px 320px 26px 160px;
    background-color: #fff
}
#VerticalContainer #block2 article p {
    padding-right: 0
}
#VerticalContainer #block2 .pill {
    border: transparent 8px solid;
    border-radius: 35px;
    border-radius: 35px;
    border-radius: 35px;
    box-shadow: 0 0 50px rgba(13, 13, 13, 0.55);
    -moz-box-shadow: 0 0 50px rgba(13, 13, 13, 0.55);
    -webkit-box-shadow: 0 0 50px rgba(13, 13, 13, 0.5);
    width: 50px;
    height: 212px;
    position: absolute;
    right: 160px;
    top: 36px;
    background: #1d3f6a url(../images/ver1-stage2-water-pier.png) no-repeat -545px -660px
}
#VerticalContainer #block2 .pill .trans {
    width: 50px;
    height: 0;
    position: absolute;
    right: 0;
    bottom: 0;
    background: url(../images/pill-trans.png) no-repeat 0 bottom
}
#VerticalContainer #block2 .pill .border {
    border: #fff 10px solid;
    border-radius: 35px;
    border-radius: 35px;
    border-radius: 35px;
    width: 50px;
    height: 212px;
    position: absolute;
    right: -10px;
    top: -10px
}
#VerticalContainer #block2 .pill .over {
    width: 70px;
    height: 232px;
    position: absolute;
    left: -10px;
    top: -10px;
    background: url(../images/pill-over.png) no-repeat 0 0
}
#VerticalContainer #block2 .pill .legend {
    position: absolute;
    left: 73px;
    top: 105px
}
#VerticalContainer #block2 .pill .legend li {
    font-family: 'proxima_nova_rgbold';
    font-size: 12px;
    color: #1c355d;
    width: 12px;
    text-align: center;
    line-height: 28px
}
#VerticalContainer #block2 .pill .legend li.ca {
    padding-bottom: 1px;
    background: url(../images/ico/legend-border.png) no-repeat 0 bottom
}
#VerticalContainer #block2 .pill .legend .ca .mol {
    position: absolute;
    left: 26px;
    bottom: 34px;
    width: 50px;
    height: 50px;
    overflow: hidden;
    background-color: #f4fbfe;
    box-shadow: 0 0 0 1px #8d9aae inset, 0 10px 10px rgba(13, 13, 13, 0.15);
    -moz-box-shadow: 0 0 0 1px #8d9aae inset, 0 10px 10px rgba(13, 13, 13, 0.15);
    -moz-box-shadow: 0 0 0 1px #8d9aae inset, 0 10px 10px rgba(13, 13, 13, 0.15);
    font-family: 'minion_promedium_cond_caption';
    font-size: 30px;
    line-height: 52px
}
#VerticalContainer #block2 .pill .legend .mol span {
    font-size: 12px;
    font-family: 'proxima_nova_rgbold';
    line-height: 1;
    position: absolute;
    top: 4px;
    right: 4px
}
#VerticalContainer #block2 .pill .legend .mg .mol {
    position: absolute;
    left: 26px;
    top: 34px;
    width: 50px;
    height: 50px;
    overflow: hidden;
    background-color: #eefaec;
    box-shadow: 0 0 0 1px #8d9aae inset, 0 10px 10px rgba(13, 13, 13, 0.25);
    -moz-box-shadow: 0 0 0 1px #8d9aae inset, 0 10px 10px rgba(13, 13, 13, 0.25);
    -moz-box-shadow: 0 0 0 1px #8d9aae inset, 0 10px 10px rgba(13, 13, 13, 0.25);
    font-family: 'minion_promedium_cond_caption';
    font-size: 30px;
    line-height: 52px
}
#VerticalContainer #block3 {
    height: 2710px;
    margin-top: -50px;
    z-index: 100;
    top: -290px;
}

#VerticalContainer #block3:after{
    content: '';
    position: absolute;
    right: 0%;
    height: 100%;
    width: 100%;
    z-index: 100;
    top: -15px;
    background: transparent url(../images/sce/doted_line.png) no-repeat scroll 605px -140px;
    }
    
#VerticalContainer #block3:before{
    content: '';
    position: absolute;
    left: 0;
    top: 846px;
    z-index: 1000;
    width: 100%;
    height: 165px;
    background-image: url(../images/sce/separation_line_gauche.png);
    background-repeat: no-repeat;
    background-position: center 100%;
}
    

#VerticalContainer #block3 .section_title {
    font-size: 36px;
    line-height: 48px;
    color: #666;
    width: 530px;
    margin: 0 auto;
    position: relative;
    position: relative;
    top: -292px;
    text-align: center;
    font-family: 'minion_promedium_cond_caption'
}
#VerticalContainer #block3 .section_title:after {
    content: "";
    width: 115px;
    height: 1px;
    position: absolute;
    left: 50%;
    bottom: -9px;
    margin: 0 0 0 -57px;
    background-color: #ccc
}
#VerticalContainer #block3 .section_title strong {
    font-family: 'proxima_nova_rgbold';
    font-size: 60px;
    line-height: 48px;
    font-weight: normal;
    color: #e22727
}
#VerticalContainer #block3 .section_subtitle {
    color: #666;
    font-family: 'proxima_nova_ltregular';
    font-size: 16px;
    letter-spacing: 3px;
    line-height: 48px;
    position: relative;
    text-align: center;
    text-transform: uppercase;
    top: -45px
}
#VerticalContainer #block3 .bottle {
    position: absolute;
    left: 0;
    top: 100px;
    width: 100%;
    height: 700px;
    z-index: 1
}
#VerticalContainer #block3 .bottle .grad {
    height: 100%;
    width: 574px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPHJhZGlhbEdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNzUlIj4KICAgIDxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiNiNmRjZjEiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSI0MiUiIHN0b3AtY29sb3I9IiNiNmRjZjEiIHN0b3Atb3BhY2l0eT0iMCIvPgogICAgPHN0b3Agb2Zmc2V0PSI0OCUiIHN0b3AtY29sb3I9IiNiNmRjZjEiIHN0b3Atb3BhY2l0eT0iMCIvPgogIDwvcmFkaWFsR3JhZGllbnQ+CiAgPHJlY3QgeD0iLTUwIiB5PSItNTAiIHdpZHRoPSIxMDEiIGhlaWdodD0iMTAxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
    background: -moz-radial-gradient(center, ellipse cover, #b6dcf1 0, rgba(182, 220, 241, 0) 42%, rgba(182, 220, 241, 0) 48%);
    background: -webkit-gradient(radial, center center, 0, center center, 100%, color-stop(0, #b6dcf1), color-stop(42%, rgba(182, 220, 241, 0)), color-stop(48%, rgba(182, 220, 241, 0)));
    background: -webkit-radial-gradient(center, ellipse cover, #b6dcf1 0, rgba(182, 220, 241, 0) 42%, rgba(182, 220, 241, 0) 48%);
    background: -o-radial-gradient(center, ellipse cover, #b6dcf1 0, rgba(182, 220, 241, 0) 42%, rgba(182, 220, 241, 0) 48%);
    background: -ms-radial-gradient(center, ellipse cover, #b6dcf1 0, rgba(182, 220, 241, 0) 42%, rgba(182, 220, 241, 0) 48%);
    background: radial-gradient(ellipse at center, #b6dcf1 0, rgba(182, 220, 241, 0) 42%, rgba(182, 220, 241, 0) 48%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#b6dcf1', endColorstr='#00b6dcf1', GradientType=1)
}
#VerticalContainer #block3 .bottle .bot {
    height: 683px;
    width: 185px;
    position: absolute;
    left: 50%;
    top: 0;
    z-index: 3;
    margin-left: -92px;
    background: url(../images/ver1-block3-bottle.png) no-repeat center center
}
#VerticalContainer #block3 .bottle .awards {
    height: 100%;
    width: 100%;
    margin: 0 auto;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2
}
#VerticalContainer #block1 .stage2 {
    position: absolute;
    left: 0;
    width: 100%;
    height: 4222px;
    top: 780px !important;
    background: url(../images/sce/ici.png),
    url(../images/sce/Rocks_2.jpg), 
    url(../images/sce/Rocks_3.jpg), 
    url(../images/sce/Source_1.jpg), 
    url(../images/sce/Source_2.jpg);
    background-repeat: no-repeat;
    background-position: center 2575px,50% 0px,-268px 1133px,-195px 2236px,0 3227px;
    z-index: 1;
}


#VerticalContainer #block1 .stage3 {
    position: absolute;
    right: 0%;
    width: 100%;
    z-index: 100;
}
.block1{
position: absolute;
    left: 0;
    width: 100%;
    height: 4260px;
    top: 1070px !important;
    background: url(../images/sce/Rocks_2.jpg), 
    url(../images/sce/Rocks_3.jpg),
    url(../images/sce/Source_1.jpg),
    url(../images/sce/Source_2.jpg);
    background-repeat: no-repeat;
    background-position: 50% 0px,-200px 1132px,-195px 2236px,0 3227px;
}
#block1:before { 
    content: '';
    position: absolute;
    right: -190px;
    width: 130%;
    height: 56%;
    z-index: 100 !important;
    
/***EB : This background was disabled because it's Ramadhan background only ****/    
/* background: -moz-linear-gradient(top,  rgba(31,19,73,1) 0%, rgba(31,19,73,0.99) 1%, rgba(0,0,0,0.49) 51%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
/* background: -webkit-linear-gradient(top,  rgba(31,19,73,1) 0%,rgba(31,19,73,0.99) 1%,rgba(0,0,0,0.49) 51%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
/* background: linear-gradient(to bottom,  rgba(31,19,73,1) 0%,rgba(31,19,73,0.99) 1%,rgba(0,0,0,0.49) 51%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
/* filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1f1349', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */

    top: 636px;
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    transform: rotate(-4deg);
}
.promos{
    position: fixed;
    bottom: 0;
    right: 0;
    z-index: 999999;
    visibility: hidden !important;
    display : none !important;
}

#gu_desc {
    position: relative;
    height: 75%;
    width: 100%;
    overflow: hidden;
    top: -125px;
    z-index: 100;
    margin-top: -30px;
    background-color: rgba(128, 128, 128, 0);
}
#gu_desc:after { 
    content: '';
    position: absolute;
    right: 31%;
    width: 10%;
    height: 200%;
    background-color: white;
    top: -86%;
    z-index: 100;
    -webkit-transform: rotate(-95deg);
    -moz-transform: rotate(-95deg);
    transform: rotate(-95deg);
}

#gu_desc p {
    position: relative;
    top: 9%;
    z-index: 1000;
    margin-left: auto;
    padding-top: 205px;
    margin-right: auto;
    text-align: center;
    font: 32px 'OpenSans-CondensedLight';
    font-weight: bold;
    color: #4B4B4B;
    background: url(../images/sce/goute.png);
    background-repeat: no-repeat;
    background-position: center top;
}

#gu_desc:before { 
    content: '';
    position: absolute;
    left: 39%;
    width: 20%;
    height: 200%;
    background-color: rgb(255, 255, 255);
    background-color: #ffffff;
    top: -50%;
    -webkit-transform: rotate(85deg);
    -moz-transform: rotate(85deg);
    transform: rotate(85deg);
}
.composition_gh {
    top: 53%;
    position: absolute;
    right: 5%;
    width: 39%;
    height: 292px;
}

/*EB: start composition css*/
.compositions {
    height: 100%;
    width: 100%;
    margin: 0 auto;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2
}
.compositions .wrapper {
    height: 100%;
    width: 574px;
    margin: 0 auto;
    position: relative
}
.compositions a {
    position: absolute;
    display: block;
    width: 126px;
    height: 126px
}
a.composition1 {
    left: 0px;
    top: 22px
}
a.composition2 {
    right: 60px;
    top: 22px
}
.compositions a .front {
    display: block;
    width: 30px;
    height: 30px;
    text-indent: -1.2em;
    padding: 60px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    background-color: #ffffff;
    color: black;
    font-size: 24px !important;
    font-weight: bold;
    background-repeat: no-repeat;
    box-shadow: #d7dce6 0 0px 10px;
    -webkit-box-shadow: #d7dce6 0 0px 10px;
    -moz-box-shadow: #d7dce6 0 0px 10px;
    backface-visibility: hidden;
    left: 0;
    position: absolute;
    top: 0;
    -webkit-transform: rotateX(0) rotateY(0) translateZ(0);
    -moz-transform: rotateX(0) rotateY(0) translateZ(0);
    -ms-transform: rotateX(0) rotateY(0) translateZ(0);
    -o-transform: rotateX(0) rotateY(0) translateZ(0);
    transform: rotateX(0) rotateY(0) translateZ(0);
    -webkit-transition: all 250ms ease-in-out;
    -moz-transition: all 250ms ease-in-out;
    -ms-transition: all 250ms ease-in-out;
    -o-transition: all 250ms ease-in-out;
    transition: all 250ms ease-in-out;
    z-index: 900;
}
.compositions a:hover .front {
    z-index: 900;
    -webkit-transform: rotateY(180deg) translateZ(0);
    -moz-transform: rotateY(180deg) translateZ(0);
    -ms-transform: rotateY(180deg) translateZ(0);
    -o-transform: rotateY(180deg) translateZ(0);
    transform: rotateY(180deg) translateZ(0)
}
.compositions a .back {
    display: block;
    width: 30px;
    height: 30px;
    padding: 60px;
    text-indent: -1.2em;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    background-color: #c90a1c;
    color: white !important;
    background-repeat: no-repeat;
    box-shadow: #d7dce6 0px 0px 10px;
    -webkit-box-shadow: #d7dce6 0px 0px 10px;
    -moz-box-shadow: #d7dce6 0px 0px 10px;
    backface-visibility: hidden;
    left: 0;
    position: absolute;
    top: 0;
    font-size: 24px !important;
    font-weight: bold;
    -webkit-transform: rotateY(-180deg) translateZ(0);
    -moz-transform: rotateY(-180deg) translateZ(0);
    -ms-transform: rotateY(-180deg) translateZ(0);
    -o-transform: rotateY(-180deg) translateZ(0);
    transform: rotateY(-180deg) translateZ(0);
    -webkit-transition: all 250ms ease-in-out;
    -moz-transition: all 250ms ease-in-out;
    -ms-transition: all 250ms ease-in-out;
    -o-transition: all 250ms ease-in-out;
    transition: all 250ms ease-in-out;
    z-index: 800
}
.compositions a:hover .back {
    z-index: 1000;
    -webkit-transform: rotateX(0) rotateY(0) translateZ(0);
    -moz-transform: rotateX(0) rotateY(0) translateZ(0);
    -ms-transform: rotateX(0) rotateY(0) translateZ(0);
    -o-transform: rotateX(0) rotateY(0) translateZ(0);
    transform: rotateX(0) rotateY(0) translateZ(0)
}
a.composition1 .front {
    background-position: 0 0
}
a.composition2 .front {
    background-position: -200px 0
}
a.composition1 .back {
    background-position: 0 -200px
}
a.composition2 .back {
    background-position: -200px -200px
}
#overlay_block ul.composition_list {
    padding: 0
}
#overlay_block ul.composition_list li {
    list-style: none;
    padding: 38px 0 24px 0;
    min-height: 90px;
    position: relative
}
#overlay_block ul.composition_list li .ico {
    display: block;
    width: 126px;
    height: 126px;
    position: absolute;
    left: -150px;
    top: 0;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    background-color: #135f94;
    background-repeat: no-repeat;
    box-shadow: #d7dce6 0 10px 10px;
    -webkit-box-shadow: #d7dce6 0 10px 10px;
    -moz-box-shadow: #d7dce6 0 10px 10px
}
#overlay_block ul.composition_list li.composition1 .ico {
    background-position: 0 0
}
#overlay_block ul.composition_list li.composition2 .ico {
    background-position: -200px 0
}
#overlay_block ul.composition_list h2 {
    font-size: 24px;
    line-height: 24px;
    padding-bottom: 0
}
/*******end *************/



#gu_composition{
    position: relative;
    height: 990px;
    width: 100%;
    top: -632px;
    margin-top: -30px;
    background-color: rgba(128, 128, 128, 0);
    background: url(../images/sce/labo_bg.jpg);
    background-repeat: no-repeat;
    background-position: 57% 75px;
}
#gu_composition:before { 
    content: '';
    position: absolute;
    left: -14%;
    width: 200%;
    height: 12%;
    background-color: rgb(255, 255, 255);
    background-color: #ffffff;
    top: 91%;
    z-index: 1;
    -webkit-transform: rotate(85deg);
    -moz-transform: rotate(85deg);
    transform: rotate(-4deg);
}
#gu_composition:after { 
    content: '';
    position: absolute;
    left: 0;
    top: 846px;
    width: 100%;
    z-index: 100;
    height: 165px;
    background-image: url(../images/sce/separation_line_droite.png);
    background-repeat: no-repeat;
    background-position: center 100%;
    }

.composition{
    position: absolute;
    background: rgba(181, 15, 13, 0.9);
    top: 10%;
    width: 40%;
    padding: 100px 60px;
    right: 0px;
    height: 700px;
    color: white;
}
.composition h2{
    font: 48px 'caviar_dreams';
    text-align: center;
    width: 100%;
    margin-bottom: 20px;
}
.composition p{
    font: 23px 'OpenSans-CondensedLight';
    line-height: 40px;
    }

#gu_importance{
    background-position: center 75px;
    background-repeat: no-repeat;
    height: 845px;
    position: relative;
    top: 5%;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}
#gu_importance:after { 
    content: '';
    position: absolute;
    left: -14%;
    width: 1898px;
    background: url(../images/sce/femme_bg.jpg);
    background-position: -254px 29px;
    background-repeat: no-repeat;
    height: 995px;
    top: -21%;
    z-index: -1;
    -webkit-transform: rotate(85deg);
    -moz-transform: rotate(85deg);
    transform: rotate(-4deg);
}
#gu_importance h1{
    font: 52px 'caviar_dreams';
    color: #EA2828;
    text-align: center;
    }
#gu_importance h1 .start{
    -webkit-margin-start: 121px;
    -webkit-margin-end: 0;
}
#gu_importance h1 .end{
    -webkit-margin-start: 10px;
    -webkit-margin-end: 70px;
    }
#gu_importance h1 .start1{
    -webkit-margin-start: 96px !important;
    -webkit-margin-end: 0px !important;
}
#gu_importance p{
    font: 25px 'OpenSans-CondensedLight';
    width: 60%;
    line-height: 40px;
    margin-top: 40px;
}
#gu_importance .RedP{
    color: #EA2828 !important;
    margin-left: 15px;
    font-weight: bold;
}

#gu_importance:before {
    content: '';
    position: absolute;
    left: -14%;
    width: 200%;
    background: url(../images/sce/kid_bg.jpg);
    background-position: -9% 15px;
    background-repeat: no-repeat;
    height: 995px;
    top: 88%;
    -webkit-transform: rotate(85deg);
    -moz-transform: rotate(85deg);
    transform: rotate(-4.4deg);
}
#gu_enfants{
    position: relative;
    top: 6%;
    z-index: 100;
    height: 100%;
    background: url(../images/sce/kid.png),
    url(../images/sce/bouteille_kids.png);
    background-position: -5% 0%, 615px 99px;
    background-repeat: no-repeat;
}
.gu_enfants_desc{
    position: absolute;
    right: 0px;
    width: 565px;
}
.gu_enfants_desc h1{
    font: 58px 'caviar_dreams';
    color: white;
}
.gu_enfants_desc h2{
    font: 36px 'OpenSans-CondensedLight';
    color: #C40000;
    margin-top: -10px;
}

.gu_enfants_desc p{
    font: 18px 'OpenSans-CondensedLight';
    color: black;
    width: 75%;
    margin-left: 15%;
    margin-top: 25px;
}

#gu_sports{
    position: relative;
    top: -70%;
    z-index: 100;
    height: 1030px;
    width: 200%;
    background: url(../images/sce/bouteille_sport2.png),url(../images/sce/spot_bg.jpg);
    background-repeat: no-repeat;
    background-position: 21% 35%,-267px 75px;
}
.gu_sports_desc{
    position: absolute;
    left: 55px;
    width: 565px;
    top: 135px;
    z-index: -1;
}
.gu_sports_desc h1{
    font: 66px 'caviar_dreams';
    color: #EA2828;
    text-align: center;
}


.gu_sports_desc p{
    font: 21px 'OpenSans-CondensedLight';
    color: black;
    width: 85%;
    margin-left: 5%;
    margin-top: 25px;
    line-height: 35px;
}

#gu_sports:before {
    content: '';
    position: absolute;
    width: 107%;
    left: -34px;
    background: white;
    background-position: -8% 3px;
    background-repeat: no-repeat;
    height: 161px;
    top: -102px;
    z-index: 1000;
    -webkit-transform: rotate(85deg);
    -moz-transform: rotate(85deg);
    transform: rotate(-3.59deg);
}
#gu_enfants:before {
    content: '';
    position: absolute;
    left: 0;
    top: 530px;
    z-index: 100;
    width: 100%;
    height: 165px;
    background-image: url(../images/sce/separation_line_droite.png);
    background-repeat: no-repeat;
    background-position: -155px -25px;
}

#VerticalContainer #block4 {
    height: 1507px;
    padding: 0 0 480px;
    overflow: hidden;
    top: -430px;
    margin-bottom: -147px;
}
#VerticalContainer #block4 .stage2 {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 613px;
    background: url(../images/ver1-stage4-clouds.png) no-repeat center top
}

#gu_awards{
    position: relative;
    top: -127px;
    right: -4px;
    z-index: 99999;
    height: 840px;
    width: 100%;
}
#separation{
    content: '';
    position: absolute;
    top: -47px;
    right: -15px;
    z-index: 100;
    width: 150%;
    background-position: -8% 3px;
    background-repeat: no-repeat;
    height: 161px;
    background-position: top left;
    -webkit-transform: rotate(85deg);
    -moz-transform: rotate(85deg);
    transform: rotate(-4.4deg);
}


#gu_sports:after {
    content: '';
    position: absolute;
    left: 0;
    top: 920px;
    z-index: 100;
    width: 100%;
    height: 165px;
    background-image: url(../images/sce/separation_line_gauche.png);
    background-repeat: no-repeat;
    background-position: -155px -25px;
}






.cd-img-replace {  
    /* replace text with background images */  
    display: inline-block;  
    overflow: hidden;  
    text-indent: 100%;  white-space: nowrap;

}
.cd-btn {  
    display: inline-block;  
    width: 120px;  
    height: 40px;  
    line-height: 40px;  
    margin-right: 8px;  
    text-align: center;  
    text-transform: uppercase;  
    font-weight: bold;  
    font-size: 1.2rem;  
    font-family: "PT Sans", sans-serif;  
    color: #ffffff;  
    background-color: #685f99;  
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.2);

}
.no-touch .cd-btn:hover {  
    background-color: #756da4;

}
@media only screen and (min-width: 1170px) {  .cd-btn {    width: 190px;    height: 60px;    line-height: 60px;    margin-right: 15px;    font-size: 1.4rem;    letter-spacing: 2px;  }}/* -------------------------------- Main components -------------------------------- */
.cd-product { 
    position: absolute;
    width: 1110px;
    height: 565px !important;
    padding-top: 35px !important;
    top: 66.2%;
    left: 15%;
    z-index: 1000;
    max-width: 1170px;
    margin: 0 auto;

}
 @media only screen and (min-width: 1170px) 
                    {  
     .cd-product {    padding-top: 100px;    height: 100vh;  }  .cd-product.is-product-tour {    height: auto;    padding-bottom: 100px;  }}.cd-product-intro {  padding: 50px 0;  text-align: center;}.cd-product-intro h1 {  margin-bottom: 10px;  font-size: 2.5rem;  font-weight: 700;  font-family: "PT Sans", sans-serif;  color: #ffffff;}.cd-product-intro p {  max-width: 560px;  margin: 0 auto;  padding: 0 0 20px;  font-size: 1.4rem;  line-height: 1.8;}.cd-product-intro::before {  /* never visible - this is used in jQuery to check the current MQ */  content: 'mobile';  display: none;}@media only screen and (min-width: 1170px) {  .cd-product-intro {    /* Force Hardware Acceleration in WebKit */    -webkit-transform: translateZ(0);    -moz-transform: translateZ(0);    -ms-transform: translateZ(0);    -o-transform: translateZ(0);    transform: translateZ(0);    -webkit-backface-visibility: hidden;    backface-visibility: hidden;    position: absolute;    top: 200px;    left: 0;    width: 50%;    padding: 0;    text-align: left;    -webkit-transition: -webkit-transform 0.6s, opacity 0.6s;    -moz-transition: -moz-transform 0.6s, opacity 0.6s;    transition: transform 0.6s, opacity 0.6s;  }  .is-product-tour .cd-product-intro {    opacity: 0;    -webkit-transform: translateX(-50%);    -moz-transform: translateX(-50%);    -ms-transform: translateX(-50%);    -o-transform: translateX(-50%);    transform: translateX(-50%);  }  .cd-product-intro h1 {    font-size: 4rem;  }  .cd-product-intro p {    font-size: 1.6rem;    padding: 10px 0 44px;    margin: 0;  }  .cd-product-intro::before {    /* never visible - this is used in jQuery to check the current MQ */    content: 'desktop';  }}.no-csstransforms3d #cd-start {  /* remove start button if CSS 3D Transforms are not supported */  display: none;}.cd-product-mockup {  width: 90%;  /* set here the max-width for the mockup */  max-width: 450px;  margin: 0 auto 50px;  position: relative;}.cd-product-mockup img {  display: block;  position: relative;  /* Firefox bug - 3D CSS transform, jagged edges */  outline: 1px solid transparent;}@media only screen and (min-width: 1170px) {  .cd-product-mockup {    margin-bottom: 0;    /* Force Hardware Acceleration in WebKit */    -webkit-transform: translateZ(0);    -moz-transform: translateZ(0);    -ms-transform: translateZ(0);    -o-transform: translateZ(0);    transform: translateZ(0);    -webkit-backface-visibility: hidden;    backface-visibility: hidden;    -webkit-transform-style: preserve-3d;    -moz-transform-style: preserve-3d;    -ms-transform-style: preserve-3d;    -o-transform-style: preserve-3d;    transform-style: preserve-3d;    -webkit-transform-origin: center top;    -moz-transform-origin: center top;    -ms-transform-origin: center top;    -o-transform-origin: center top;    transform-origin: center top;    -webkit-transform: rotateX(-60deg) rotateZ(-40deg) translateX(50px) translateY(300px);    -moz-transform: rotateX(-60deg) rotateZ(-40deg) translateX(50px) translateY(300px);    -ms-transform: rotateX(-60deg) rotateZ(-40deg) translateX(50px) translateY(300px);    -o-transform: rotateX(-60deg) rotateZ(-40deg) translateX(50px) translateY(300px);    transform: rotateX(-60deg) rotateZ(-40deg) translateX(50px) translateY(300px);    -webkit-transition: -webkit-transform 0.6s;    -moz-transition: -moz-transform 0.6s;    transition: transform 0.6s;  }  .cd-product-mockup::before {    /* mockup shadow */    display: block;    content: '';    position: absolute;    top: 0;    left: 0;    width: 0;    /* play with these values to create a realistic shadow */    height: 45%;    box-shadow: 0px 0px 30px 225px rgba(0, 0, 0, 0.1);    -webkit-transform: translateZ(-100px) translateY(480px);    -moz-transform: translateZ(-100px) translateY(480px);    -ms-transform: translateZ(-100px) translateY(480px);    -o-transform: translateZ(-100px) translateY(480px);    transform: translateZ(-100px) translateY(480px);    -webkit-transition: -webkit-transform 0.6s;    -moz-transition: -moz-transform 0.6s;    transition: transform 0.6s;  }  .is-product-tour .cd-product-mockup {    -webkit-transform: translateX(0);    -moz-transform: translateX(0);    -ms-transform: translateX(0);    -o-transform: translateX(0);    transform: translateX(0);  }  .is-product-tour .cd-product-mockup::before {    -webkit-transform: translateZ(-100px) translateX(226px) translateY(216px);    -moz-transform: translateZ(-100px) translateX(226px) translateY(216px);    -ms-transform: translateZ(-100px) translateX(226px) translateY(216px);    -o-transform: translateZ(-100px) translateX(226px) translateY(216px);    transform: translateZ(-100px) translateX(226px) translateY(216px);  }}.no-csstransforms3d .cd-product:after {  content: "";  display: table;  clear: both;}.no-csstransforms3d .cd-product-mockup {  float: right;}.no-csstransforms3d .cd-product-mockup::before {  display: none;}.cd-3d-right-side, .cd-3d-bottom-side {  display: none;}@media only screen and (min-width: 1170px) {  .cd-3d-right-side, .cd-3d-bottom-side {    display: block;    position: absolute;    left: 0;    background-image: url(../img/cd-app-image.png);    /* Firefox bug - 3D CSS transform, jagged edges */    outline: 1px solid transparent;  }  .cd-3d-right-side::after, .cd-3d-bottom-side::after {    /* darken the right/bottom sides */    content: '';    display: block;    position: absolute;    top: 0;    left: 0;    width: 100%;    height: 100%;    background-color: rgba(0, 0, 0, 0.2);  }}@media only screen and (min-width: 1170px) {  .cd-3d-right-side {    top: -1px;    width: 10px;    height: 100%;    background-size: auto 100%;    -webkit-transform-origin: left center;    -moz-transform-origin: left center;    -ms-transform-origin: left center;    -o-transform-origin: left center;    transform-origin: left center;    -webkit-transform: translateZ(-1px) translateY(1px) rotateY(-90deg);    -moz-transform: translateZ(-1px) translateY(1px) rotateY(-90deg);    -ms-transform: translateZ(-1px) translateY(1px) rotateY(-90deg);    -o-transform: translateZ(-1px) translateY(1px) rotateY(-90deg);    transform: translateZ(-1px) translateY(1px) rotateY(-90deg);  }  .cd-3d-bottom-side {    bottom: 0;    width: 100%;    height: 10px;    background-position: bottom center;    background-size: 100% auto;    -webkit-transform-origin: center bottom;    -moz-transform-origin: center bottom;    -ms-transform-origin: center bottom;    -o-transform-origin: center bottom;    transform-origin: center bottom;    -webkit-transform: translateZ(-1px) rotateX(-90deg);    -moz-transform: translateZ(-1px) rotateX(-90deg);    -ms-transform: translateZ(-1px) rotateX(-90deg);    -o-transform: translateZ(-1px) rotateX(-90deg);    transform: translateZ(-1px) rotateX(-90deg);  }  .cd-3d-bottom-side::after {    background-color: rgba(0, 0, 0, 0.4);  }}.no-csstransforms3d .cd-3d-right-side, .no-csstransforms3d .cd-3d-bottom-side {  display: none;}.cd-close-product-tour {  /* close icon - product tour */  display: none;}@media only screen and (min-width: 1170px) {  .cd-close-product-tour {    display: block;    position: absolute;    top: 40px;    right: 0;    height: 40px;    width: 40px;    opacity: 0;    visibility: hidden;  }  .no-touch .cd-close-product-tour:hover {    opacity: .8;  }  .cd-close-product-tour::after, .cd-close-product-tour::before {    /* these are used to create the 'X' icon */    content: '';    height: 40px;    width: 2px;    position: absolute;    left: 50%;    top: 50%;    background-color: #ffffff;  }  .cd-close-product-tour::after {    -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);    -moz-transform: translateX(-50%) translateY(-50%) rotate(45deg);    -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg);    -o-transform: translateX(-50%) translateY(-50%) rotate(45deg);    transform: translateX(-50%) translateY(-50%) rotate(45deg);  }  .cd-close-product-tour::before {    -webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg);    -moz-transform: translateX(-50%) translateY(-50%) rotate(-45deg);    -ms-transform: translateX(-50%) translateY(-50%) rotate(-45deg);    -o-transform: translateX(-50%) translateY(-50%) rotate(-45deg);    transform: translateX(-50%) translateY(-50%) rotate(-45deg);  }  .cd-close-product-tour.is-visible {    visibility: visible;    opacity: 1;  }}.cd-single-point {  position: absolute;  border-radius: 50%;}.cd-single-point > a {    position: relative;
    display: block;
    width: 30px;
    height: 30px;
    border-radius: inherit;
    background: #fff;
    box-shadow: 0 0 10px rgb(218, 144, 189), inset 0 1px 0 rgba(255, 255, 255, 0.3);
    z-index: 1000;
    -webkit-transition: background-color 0.3s;
    -moz-transition: background-color 0.3s;
    transition: background-color 0.3s;}.cd-single-point > a::after, .cd-single-point > a:before {  /* rotating plus icon */  content: '';  position: absolute;  left: 50%;  top: 50%;  bottom: auto;  right: auto;  -webkit-transform: translateX(-50%) translateY(-50%);  -moz-transform: translateX(-50%) translateY(-50%);  -ms-transform: translateX(-50%) translateY(-50%);  -o-transform: translateX(-50%) translateY(-50%);  transform: translateX(-50%) translateY(-50%);  background-color: #c40000;  -webkit-transition: -webkit-transform 0.3s;  -moz-transition: -moz-transform 0.3s;  transition: transform 0.3s;}.cd-single-point > a::after {    height: 4px;
    width: 12px}.cd-single-point > a::before {    height: 12px;
    width: 4px}.cd-single-point::after {  /* this is used to create the pulse animation */  content: '';  position: absolute;  z-index: 100;  width: 100%;  height: 100%;  top: 0;  left: 0;  border-radius: inherit;  background-color: transparent;  -webkit-animation: cd-pulse 2s infinite;  -moz-animation: cd-pulse 2s infinite;  animation: cd-pulse 2s infinite;}.cd-single-point:nth-of-type(1) {    top: 14px;
    right: 85px;
    position: absolute;}.cd-single-point:nth-of-type(2) {    top: 233px;
    right: 80px;}.cd-single-point:nth-of-type(3) {    top: 417px;
    right: 45px;}.cd-single-point.is-open > a {  background-color: #685f99;}.cd-single-point.is-open > a::after, .cd-single-point.is-open > a::before {  -webkit-transform: translateX(-50%) translateY(-50%) rotate(135deg);  -moz-transform: translateX(-50%) translateY(-50%) rotate(135deg);  -ms-transform: translateX(-50%) translateY(-50%) rotate(135deg);  -o-transform: translateX(-50%) translateY(-50%) rotate(135deg);  transform: translateX(-50%) translateY(-50%) rotate(135deg);}.cd-single-point.is-open::after {  /* remove pulse effect */  display: none;}.cd-single-point.is-open .cd-more-info {  visibility: visible;  opacity: 1;  -webkit-transform: scale(1);  -moz-transform: scale(1);  -ms-transform: scale(1);  -o-transform: scale(1);  transform: scale(1);  -webkit-transition: opacity 0.3s 0s, visibility 0s 0s, -webkit-transform 0.3s 0s, top 0.3s 0s, bottom 0.3s 0s, left 0.3s 0s, right 0.3s 0s;  -moz-transition: opacity 0.3s 0s, visibility 0s 0s, -moz-transform 0.3s 0s, top 0.3s 0s, bottom 0.3s 0s, left 0.3s 0s, right 0.3s 0s;  transition: opacity 0.3s 0s, visibility 0s 0s, transform 0.3s 0s, top 0.3s 0s, bottom 0.3s 0s, left 0.3s 0s, right 0.3s 0s;}.cd-single-point.visited > a {  background-color: #feafdf;}.cd-single-point.visited::after {  /* pulse effect no more active on visited elements */  display: none;}@media only screen and (min-width: 480px) {  .cd-single-point.is-open .cd-more-info.cd-left {    right: 140%;  }  .cd-single-point.is-open .cd-more-info.cd-right {    left: 140%;  }  .cd-single-point.is-open .cd-more-info.cd-top {    bottom: 140%;  }  .cd-single-point.is-open .cd-more-info.cd-bottom {    top: 140%;  }}@media only screen and (min-width: 1170px) {  .cd-single-point {    -webkit-transform: scale(0);    -moz-transform: scale(0);    -ms-transform: scale(0);    -o-transform: scale(0);    transform: scale(0);  }  .cd-single-point::after {    -webkit-animation: none;    -moz-animation: none;    animation: none;  }  .points-enlarged .cd-single-point {    -webkit-transform: scale(1);    -moz-transform: scale(1);    -ms-transform: scale(1);    -o-transform: scale(1);    transform: scale(1);    -webkit-animation: cd-bounce 0.4s;    -moz-animation: cd-bounce 0.4s;    animation: cd-bounce 0.4s;  }  .points-pulsing .cd-single-point::after {    -webkit-animation: cd-pulse 2s infinite;    -moz-animation: cd-pulse 2s infinite;    animation: cd-pulse 2s infinite;  }}.no-csstransforms3d .cd-single-point {  -webkit-transform: scale(1);  -moz-transform: scale(1);  -ms-transform: scale(1);  -o-transform: scale(1);  transform: scale(1);}@-webkit-keyframes cd-bounce {  0% {    -webkit-transform: scale(0);  }  60% {    -webkit-transform: scale(1.2);  }  100% {    -webkit-transform: scale(1);  }}@-moz-keyframes cd-bounce {  0% {    -moz-transform: scale(0);  }  60% {    -moz-transform: scale(1.2);  }  100% {    -moz-transform: scale(1);  }}@keyframes cd-bounce {  0% {    -webkit-transform: scale(0);    -moz-transform: scale(0);    -ms-transform: scale(0);    -o-transform: scale(0);    transform: scale(0);  }  60% {    -webkit-transform: scale(1.2);    -moz-transform: scale(1.2);    -ms-transform: scale(1.2);    -o-transform: scale(1.2);    transform: scale(1.2);  }  100% {    -webkit-transform: scale(1);    -moz-transform: scale(1);    -ms-transform: scale(1);    -o-transform: scale(1);    transform: scale(1);  }}@-webkit-keyframes cd-pulse {  0% {    -webkit-transform: scale(1);    box-shadow: inset 0 0 1px 1px rgba(234, 74, 85, 0.8);  }  50% {    box-shadow: inset 0 0 1px 1px rgba(234, 74, 85, 0.8);  }  100% {    -webkit-transform: scale(1.6);    box-shadow: inset 0 0 1px 1px rgba(234, 74, 85, 0);  }}@-moz-keyframes cd-pulse {  0% {    -moz-transform: scale(1);    box-shadow: inset 0 0 1px 1px rgba(234, 74, 85, 0.8);  }  50% {    box-shadow: inset 0 0 1px 1px rgba(234, 74, 85, 0.8);  }  100% {    -moz-transform: scale(1.6);    box-shadow: inset 0 0 1px 1px rgba(234, 74, 85, 0);  }}@keyframes cd-pulse {  0% {    -webkit-transform: scale(1);    -moz-transform: scale(1);    -ms-transform: scale(1);    -o-transform: scale(1);    transform: scale(1);    box-shadow: inset 0 0 1px 1px rgba(234, 74, 85, 0.8);  }  50% {    box-shadow: inset 0 0 1px 1px rgba(234, 74, 85, 0.8);  }  100% {    -webkit-transform: scale(1.6);    -moz-transform: scale(1.6);    -ms-transform: scale(1.6);    -o-transform: scale(1.6);    transform: scale(1.6);    box-shadow: inset 0 0 1px 1px rgba(234, 74, 85, 0);  }}.cd-single-point .cd-more-info {  position: fixed;  top: 0;  left: 0;  z-index: 3;  width: 100%;  height: 100%;  overflow-y: auto;  -webkit-overflow-scrolling: touch;  text-align: left;  line-height: 1.5;  background-color: rgba(255, 255, 255, 0.95);  padding: 2em 1em 1em;  visibility: hidden;  opacity: 0;  -webkit-transform: scale(0.8);  -moz-transform: scale(0.8);  -ms-transform: scale(0.8);  -o-transform: scale(0.8);  transform: scale(0.8);  -webkit-transition: opacity 0.3s 0s, visibility 0s 0.3s, -webkit-transform 0.3s 0s, top 0.3s 0s, bottom 0.3s 0s, left 0.3s 0s, right 0.3s 0s;  -moz-transition: opacity 0.3s 0s, visibility 0s 0.3s, -moz-transform 0.3s 0s, top 0.3s 0s, bottom 0.3s 0s, left 0.3s 0s, right 0.3s 0s;  transition: opacity 0.3s 0s, visibility 0s 0.3s, transform 0.3s 0s, top 0.3s 0s, bottom 0.3s 0s, left 0.3s 0s, right 0.3s 0s;}.cd-single-point .cd-more-info::before {  /* triangle next to the interest point description - hidden on mobile */  content: '';  position: absolute;  height: 0;  width: 0;  display: none;  border: 8px solid transparent;}.cd-single-point .cd-more-info h2 {  font-size: 2.2rem;  font-family: "PT Sans", sans-serif;  font-weight: bold;  margin-bottom: .6em;}.cd-single-point .cd-more-info p {  color: #3d385a;}@media only screen and (min-width: 480px) {  .cd-single-point .cd-more-info {    position: absolute;    width: 235px;
    height: 185px;    padding: 4em;    overflow-y: visible;    line-height: 1.4;    border-radius: .25em;    box-shadow: 0 0 20px rgba(61, 56, 90, 0.3);  }  .cd-single-point .cd-more-info::before {    display: block;  }  .cd-single-point .cd-more-info.cd-left, .cd-single-point .cd-more-info.cd-right {    top: 50%;    bottom: auto;    -webkit-transform: translateY(-50%);    -moz-transform: translateY(-50%);    -ms-transform: translateY(-50%);    -o-transform: translateY(-50%);    transform: translateY(-50%);  }  .cd-single-point .cd-more-info.cd-left::before, .cd-single-point .cd-more-info.cd-right::before {    top: 50%;    bottom: auto;    -webkit-transform: translateY(-50%);    -moz-transform: translateY(-50%);    -ms-transform: translateY(-50%);    -o-transform: translateY(-50%);    transform: translateY(-50%);  }  .cd-single-point .cd-more-info.cd-left {    right: 160%;    left: auto;  }  .cd-single-point .cd-more-info.cd-left::before {    border-left-color: rgba(255, 255, 255, 0.95);    left: 100%;  }  .cd-single-point .cd-more-info.cd-right {    left: 160%;  }  .cd-single-point .cd-more-info.cd-right::before {    border-right-color: rgba(255, 255, 255, 0.95);    right: 100%;  }  .cd-single-point .cd-more-info.cd-top, .cd-single-point .cd-more-info.cd-bottom {    left: 50%;    right: auto;    -webkit-transform: translateX(-50%);    -moz-transform: translateX(-50%);    -ms-transform: translateX(-50%);    -o-transform: translateX(-50%);    transform: translateX(-50%);  }  .cd-single-point .cd-more-info.cd-top::before, .cd-single-point .cd-more-info.cd-bottom::before {    left: 50%;    right: auto;    -webkit-transform: translateX(-50%);    -moz-transform: translateX(-50%);    -ms-transform: translateX(-50%);    -o-transform: translateX(-50%);    transform: translateX(-50%);  }  .cd-single-point .cd-more-info.cd-top {    bottom: 160%;    top: auto;  }  .cd-single-point .cd-more-info.cd-top::before {    border-top-color: rgba(255, 255, 255, 0.95);    top: 100%;  }  .cd-single-point .cd-more-info.cd-bottom {    top: 160%;  }  .cd-single-point .cd-more-info.cd-bottom::before {    border-bottom-color: rgba(255, 255, 255, 0.95);    bottom: 100%;  }  .cd-single-point .cd-more-info h2 {    margin-bottom: 0;  }  .cd-single-point .cd-more-info p {    font-size: 1.1rem;
    font-family: 'OpenSans-CondensedLight';  }}.cd-close-info {  /* close the interest point description - only on mobile */  position: fixed;  top: 0;  right: 0;  height: 44px;  width: 44px;}.cd-close-info::after, .cd-close-info:before {  content: '';  position: absolute;  left: 50%;  top: 50%;  bottom: auto;  right: auto;  background-color: #ea4a55;  -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);  -moz-transform: translateX(-50%) translateY(-50%) rotate(45deg);  -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg);  -o-transform: translateX(-50%) translateY(-50%) rotate(45deg);  transform: translateX(-50%) translateY(-50%) rotate(45deg);  -webkit-transition-property: transform 0.2s;  -moz-transition-property: transform 0.2s;  transition-property: transform 0.2s;}.cd-close-info::after {  height: 2px;  width: 16px;}.cd-close-info::before {  height: 16px;  width: 2px;}@media only screen and (min-width: 480px) {  .cd-close-info {    display: none;  }}ol, ul {	list-style: none;}blockquote, q {	quotes: none;}blockquote:before, blockquote:after,q:before, q:after {	content: '';	content: none;}

#gu_video {
    position: relative;
    top: -127px;
    right: 0;
    z-index: 1000;
    height: 550px;
    width: 100%;
    max-width: 1500px;
    border-top: 8px solid #ff9ddb;
}


#gu_awards:before {
    content: '';
    position: absolute;
    left: -15%;
    top: 865px;
    z-index: 1000;
    width: 150%;
    height: 165px;
    /*background-image: url(../images/sce/separation_line_droite.png);*/
    background-repeat: no-repeat;
    background-position: center 100%;
}

#gu_awards:after {
    content: '';
    position: absolute;
    left: -15%;
    top: 1388px;
    z-index: 999;
    width: 150%;
    height: 165px;
    background-image: url(../images/sce/separation_line_gauche.png);
    background-repeat: no-repeat;
    background-position: center 100%;
}

#VerticalContainer #block4:after {
    content: '';
    position: absolute;
    left: -15%;
    height: 100%;
    width: 200%;
    z-index: 1;
    top: 30px;
    background: url(../images/sce/awards_bg_rep.jpg);
    background-repeat: repeat-x;
    background-position: top left;
    -webkit-transform: rotate(85deg);
    -moz-transform: rotate(85deg);
    transform: rotate(-4.4deg);
}
#gu_video:before {
    content: '';
    position: absolute;
    left: -5%;
    width: 200%;
    right: 0;
    top: 590px;
    z-index: 1000;
    padding-top: 100px;
    height: 687px;
    background: url(../images/sce/news_bg.jpg);
    background-repeat: no-repeat;
    background-position: -280px -85px;
    -webkit-transform: rotate(85deg);
    -moz-transform: rotate(85deg);
    transform: rotate(-4.4deg);
}

#gu_news {
    position: relative;
    right: 0;
    top: 15px;
    padding-top: 100px;
    height: 687px;
    width: 100%;
    z-index: 1000;
    max-width: 1500px;
}

#gu_news:before {
    content: '';
    position: absolute;
    left: -52%;
    top: 660px;
    z-index: 1000;
    width: 200%;
    height: 165px;
    background-image: url(../images/sce/nos_produits_line.png);
    background-repeat: no-repeat;
    background-position: center 100%;
}

.News_section_title {
    position: absolute;
    top: -110px;
    left: 35%;
}



.news_container {
    width: 85%;
    margin-left: auto;
    margin-right: auto;
    height: 470px;
    top: 34px;
    position: relative;
    background: rgba(240, 234, 224, 0.75);
}

#gu_product {
width: 100%;
height: 600px;
background: url(../images/sce/green_1.png),
            url(../images/sce/green_2.png),
            url(../images/sce/green_3.png),
            url(../images/sce/produit_bg_rep.jpg);
    background-repeat: no-repeat,no-repeat,no-repeat,repeat-x;
    background-position: 1105px -45px,-220px 385px,-10px 132px,1px 1px;
    top: -105px;
    padding-top: 145px;
    position: relative;
}

#VerticalContainer #block5 {
    height: 882px;
    padding: 0 0;
    overflow: hidden;
    margin-bottom: -315px;
    background: url(../images/sce/footer_bg.jpg);
    background-repeat: no-repeat;
    background-position: 50% 7px;
    top: -290px;
}
#gu_contact {
    width: 100%;
    height: 780px;
    position: relative;
    background: url(../images/sce/contact_line.png);
    background-repeat: no-repeat;
    background-position: 50% 0px;
}

#VerticalContainer #gu_product .stage2 {
    width: 620px;
    height: 760px;
    position: absolute;
    left: 50%;
    bottom: -136px;
    margin: 0 0 0 -321px;
    -webkit-perspective: 700px;
    -moz-perspective: 700px;
    perspective: 700px;
    -webkit-perspective-origin: 400px;
    -moz-perspective-origin: 400px;
    perspective-origin: 400px;
}






.bottle ul {
    position: relative;
    display: inline-block;
    margin: 0;
    padding: 0;
    list-style: none;
    cursor: default;
    background: url(../images/sce/sport2.png);
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-repeat: no-repeat;
    background-position: 50px 191px;
}

.bottle li {
    position: relative;
    display: block;
    float: left;
    margin: 0px -25px !important;
    min-height: 200px;
    cursor: pointer;
}

.bottle li a {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	outline: none;
	border-radius: 50%;
	background-color: #fff;
	background-color: rgba(255, 255, 255, 0.3);
	text-indent: -999em; /* make the text accessible to screen readers */
	cursor: pointer;
	position: absolute;
}

.bottle li a:focus {
	outline: none;
}
.related {
	text-align: center;
	font-size: 1.25em;
	padding: 3em 0;
	overflow: hidden;
}

.related a {
	display: inline-block;
	text-align: left;
	margin: 20px auto;
	padding: 10px 20px;
	opacity: 0.8;
	color: #777;
	-webkit-transition: opacity 0.3s;
	transition: opacity 0.3s;
	-webkit-backface-visibility: hidden;
}

.related a:hover,
.related a:active {
	opacity: 1;
}

.related a img {
	max-width: 100%;
}

.related a h3 {
	font-weight: 300;
	margin: 0;
	padding: 0.3em 0;
}


.wrap > div {
    float: left;
    overflow: hidden;
    padding: 225px 0px 8em;
    height: 400px;
    top: 22%;
    position: absolute;
    width: 100%;
    text-align: center;
}

.wrap > div h2 {
	text-transform: uppercase;
	letter-spacing: 1px;
	margin: 0;
	padding: 4em 0 5em;
	font-size: 0.85em;
	color: #c44d48;
}

.bottle:nth-child(4n),
.bottle:nth-child(4n-3) {
}

/* Tooltip */


li#bottle1-05ls {
    background: url(../images/sce/0.5Lsport2.png);
    background-repeat: no-repeat;
    background-position: top center;
    z-index: 999;
    -webkit-transition: border-color 0.3s ease;
    transition: border-color 0.3s ease;
    height: 288px;
    width: 190px;
    top: -75px;
    margin: 0px -25px;
}
li#bottle1-033ls {
    background: url(../images/sce/0.33Ls.png);
    background-repeat: no-repeat;
    background-position: top center;
    z-index: 999;
    -webkit-transition: border-color 0.3s ease;
    transition: border-color 0.3s ease;
    height: 288px;
    width: 190px;
    margin: 0px -25px;
    top: -50px;
}

li#bottle1-2l {
    background: url(../images/sce/2L.png);
    background-repeat: no-repeat;
    background-position: top center;
    z-index: 999;
    -webkit-transition: border-color 0.3s ease;
    transition: border-color 0.3s ease;
    height: 483px;
    width: 190px;
    top: -170px;
    margin: 0px -65px;
}

li#bottle1-15l {
    background: url(../images/sce/1.5L.png);
    background-repeat: no-repeat;
    background-position: top center;
    z-index: 999;
    -webkit-transition: border-color 0.3s ease;
    transition: border-color 0.3s ease;
    height: 440px;
    width: 190px;
    top: -149px;
    margin: 0px -37px;
}
li#bottle1-1l {
    background: url(../images/sce/1L.png);
    background-repeat: no-repeat;
    background-position: top center;
    z-index: 999;
    -webkit-transition: border-color 0.3s ease;
    transition: border-color 0.3s ease;
    height: 336px;
    width: 190px;
    top: -45px;
    margin: 0px -36px;
}
li#bottle1-05l {
    background: url(../images/sce/0.5L.png);
    background-repeat: no-repeat;
    background-position: top center;
    z-index: 999;
    -webkit-transition: border-color 0.3s ease;
    transition: border-color 0.3s ease;
    height: 318px;
    width: 190px;
    top: -26px;
    margin: 0px -40px;
}
li#bottle1-03l {
    background: url(../images/sce/0.3L.png);
    background-repeat: no-repeat;
    background-position: top center;
    z-index: 999;
    -webkit-transition: border-color 0.3s ease;
    transition: border-color 0.3s ease;
    height: 281px;
    width: 190px;
    top: 12px;
    margin: 0px -35px;
}



.bottle-tooltip li a {
    top: auto;
    bottom: 85%;
    left: 100%;
    visibility: hidden;
    padding: 0 17px;
    width: auto;
    background: transparent;
    height: auto;
    text-indent: 0;
    line-height: 2;
    opacity: 0;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    -webkit-transition: -webkit-transform 0.3s ease, opacity 0.3s ease, visibility 0s 0.3s ease;
    transition: transform 0.3s ease, opacity 0.3s ease, visibility 0s 0.3s ease;
}

/*.bottle-tooltip li a::after { 
	position: absolute;
	left: 50%;
	margin-left: -10px;
	width: 0;
	height: 0;
	border: solid transparent;
	border-width: 10px;
	border-color: transparent;
	border-top-color: #c44d48;
	content: '';
	pointer-events: none;
	top: 99%;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition: opacity 0.3s ease;
	transition: opacity 0.3s ease;
}*/

.no-touch .bottle-tooltip li:hover a,
.bottle-tooltip li.current a {
	z-index: 100;
	visibility: visible;
	opacity: 1;
	-webkit-transform: translateX(-50%) translateY(0%);
	transform: translateX(-50%) translateY(0%);
	-webkit-transition: -webkit-transform 0.3s ease, opacity 0.3s ease;
	transition: transform 0.3s ease, opacity 0.3s ease;
}

.bottle-tooltip li.current {
	border-color: #c44d48;
}

.bottle-tooltip li:hover {
	z-index: 100;
}

.no-touch .bottle-tooltip ul:hover li.current a {
	opacity: 0.2;
}

.bottle-tooltip ul li.current:hover a {
	opacity: 1;
}


.gu_contact_form {
    position: absolute;
    top: 75px;
    width: 625px;
    height: 600px;
    left: 29%;
    background: rgba(231, 225, 215, 0.94);
    box-shadow: 0px 0px 7px #423e3e;
    -webkit-box-shadow: 0px 0px 7px #423e3e;
    -moz-box-shadow: 0px 0px 7px #423e3e;
}
    .gu_contact_form h2 {
        font: 32px 'caviar_dreams';
        text-align: center;
        margin-top: 25px;
        width: 100%;
    }
#contactform {
    width: 93%;
    padding: 21px;
}

    #contactform div span input {
    transition: background 0.4s;
    background-color: rgb(255, 255, 255);
    width: 80%;
    padding: 5px 1px;
    font-family: 'OpenSans-CondensedLight';
    font-size: 20px;
    background-color: white !important;
    }

.gu_contact_address{
    position: absolute;
    bottom: 27px;
    left: 35%;
    background-image: url(../images/sce/ArrowLeft.png),url(../images/sce/ArrowRight.png);
    padding: 4px 34px;
    background-repeat: no-repeat;
    background-position: left,right;
    padding: 5px 25px;
}

    .gu_contact_address p {
    background: white;
    padding: 5px 5px;
    margin: -2px;
    font: 12px arial;
    height: 54px;
    text-align: center;
    line-height: 19px;
    }
#copyrights {
    height: 34px;
    background-color: #151515;
    color: white;
    text-align: center;
    padding-top: 10px;
}

input[type="button"], input[type="submit"] {
    -webkit-appearance: none;
    background-color: #ff3d55;
    color: white;
    font: 25px 'caviar_dreams';
    padding: 7px 22px;
    border-width: 0px;
    position: absolute;
    right: 18px;
    cursor: pointer;
}

textarea {
    resize: none !important;
}




/**EB : start composition css****/
#navs {
    position: absolute;
    z-index: 1000;
    left: 230px;
    bottom: 66px;
    width: 66px;
    height: 47px;
    line-height: 40px;
    list-style-type: none;
    margin: 0;
    padding: 0;
    text-align: center;
    color: #fff;
    cursor: pointer;
}


#navs:after {
    position: absolute;
    left: 90px;
    top: 0px;
    width: 66px;
    height: 66px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    background: url(../images/sce/plus.png);
    background-repeat: no-repeat;
    background-position: center center;
}

#navs>li.one {
    transition: all .6s;
    -webkit-transition: all .6s;
    -moz-transition: .6s;
    position: absolute;
    left: 0;
    top: 0;
    width: 66px;
    height: 66px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    background: url(../images/sce/composition_chimique.png);
    background-repeat: no-repeat;
    background-position: -496px 0px;
}
#navs>li.two {
    transition: all .6s;
    -webkit-transition: all .6s;
    -moz-transition: .6s;
    position: absolute;
    left: 0;
    top: 0;
    width: 66px;
    height: 66px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    background: url(../images/sce/composition_chimique.png);
    background-repeat: no-repeat;
    background-position: -298px 0px;
}
#navs>li.three {
    transition: all .6s;
    -webkit-transition: all .6s;
    -moz-transition: .6s;
    position: absolute;
    left: 0;
    top: 0;
    width: 66px;
    height: 66px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    background: url(../images/sce/composition_chimique.png);
    background-repeat: no-repeat;
    background-position: -100px 0px;
}
#navs>li.four {
    transition: all .6s;
    -webkit-transition: all .6s;
    -moz-transition: .6s;
    position: absolute;
    left: 0;
    top: 0;
    width: 66px;
    height: 66px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    background: url(../images/sce/composition_chimique.png);
    background-repeat: no-repeat;
    background-position: 0px 0px;
}
#navs>li.five {
    transition: all .6s;
    -webkit-transition: all .6s;
    -moz-transition: .6s;
    position: absolute;
    left: 0;
    top: 0;
    width: 66px;
    height: 66px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    background: url(../images/sce/composition_chimique.png);
    background-repeat: no-repeat;
    background-position: -199px 0px;
}
#navs>li.six {
    transition: all .6s;
    -webkit-transition: all .6s;
    -moz-transition: .6s;
    position: absolute;
    left: 0;
    top: 0;
    width: 66px;
    height: 66px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    background: url(../images/sce/composition_chimique.png);
    background-repeat: no-repeat;
    background-position: -396px 0px;
}
#navs>li.seven {
    transition: all .6s;
    -webkit-transition: all .6s;
    -moz-transition: .6s;
    position: absolute;
    left: 0;
    top: 0;
    width: 66px;
    height: 66px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    background: url(../images/sce/composition_chimique.png);
    background-repeat: no-repeat;
    background-position: -595px 0px;
}
#navs>li.eight {
    transition: all .6s;
    -webkit-transition: all .6s;
    -moz-transition: .6s;
    position: absolute;
    left: 0;
    top: 0;
    width: 66px;
    height: 66px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    background: url(../images/sce/composition_chimique.png);
    background-repeat: no-repeat;
    background-position: -794px 0px;
}
#navs>li.nine {
    transition: all .6s;
    -webkit-transition: all .6s;
    -moz-transition: .6s;
    position: absolute;
    left: 0;
    top: 0;
    width: 66px;
    height: 66px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    background: url(../images/sce/composition_chimique.png);
    background-repeat: no-repeat;
    background-position: -894px 0px;
}
#navs>li.ten {
    transition: all .6s;
    -webkit-transition: all .6s;
    -moz-transition: .6s;
    position: absolute;
    left: 0;
    top: 0;
    width: 66px;
    height: 66px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    background: url(../images/sce/composition_chimique.png);
    background-repeat: no-repeat;
    background-position: -695px 0px;
}

#navs:after {
  content: attr(data-close);
  z-index: 1;
  border-radius: 50%;
  -webkit-border-radius: 50%;
}

#navs.active:after { content: attr(data-open); }

#navs a {
  width: 40px;
  height: 40px;
  display: inline-block;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  text-decoration: none;
  color: #fff;
  font-size: 0.8em;
}
.bottle_composition {
    position: absolute;
    width: 60px;
    height: 208px;
    left: 236px;
    top: 108px;
}


/**EB : Start bodycontent css*/

#bodycontent {
    width: 75%;
    left: 8%;
    right: 10%;
    padding: 1% 5%;
    height: auto;
    position: relative;
    float: left;
    font: 13px/20px arial, helvetica, sans-serif;
}





.start-video {
    position: absolute;
    top: 50%;
    padding: 12px;
    left: 50%;
    opacity: .3;
    cursor: pointer;
    transition: all 0.3s;
}

.start-video:hover
{
    opacity: 1;
    -webkit-filter: brightness (1);
}

div.thumbnail_container
{
    width: 100%;
    height: 730px;
    overflow: hidden;
    background-color: #000;
}

img.thumbnail
{
    margin-top: 0;
    opacity: 0.5;
    width: 100%;
    height: 100%;
}
















/**#slider {
    z-index: 1000;
    width: 100%;
    top: 243px;
    position: absolute;
}

.prev {
    width: 39px;
    height: 87px;
    background: url(../images/sce/prev.png);
    background-repeat: no-repeat;
    position: absolute;
    left: 55px;
    top: 295px;
}
.next {
    width: 39px;
    height: 87px;
    background: url(../images/sce/next.png);
    background-repeat: no-repeat;
    position: absolute;
    top: 295px;
    right: 55px;
}

.aw_image {
    width: 383px;
    position: absolute;
    left: 10%;
    top: 140px;
}
.slider_desc {
    position: absolute;
    right: 15%;
    top: 100px;
    font-size: 32px;
    width: 530px;
    color: white;
    text-shadow: 0px 0px 4px black;
}

.trophet {
    position: absolute;
    right: 22%;
    top: 255px;
    font-size: 32px;
    width: 530px;
    color: white;
    text-shadow: 0px 0px 4px black;
}***/




.deco {
	pointer-events: none;
}

.deco--title {
position: absolute;
    top: 0px;
    width: 100%;
    height: 100%;
    background: url(../img/deco.svg) no-repeat center top;
    background-size: 100%;
}

.slideshow {
	position: relative;
	width: 100%;
	margin: 10vh 0 5em;
}

.slide {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column-reverse;
	flex-direction: column-reverse;
	-webkit-align-items: center;
	align-items: center;
	width: 100%;
	text-align: center;
}

.js .slide {
	position: absolute;
	z-index: 1000;
	top: 0;
	left: 0;
	visibility: hidden;
	pointer-events: none;
}

.slide.slide--current {
	position: relative;
	visibility: visible;
}

.deco--circle {
	position: absolute;
	top: 0;
	border-radius: 50%;
	background: #fff;
}

.deco--circle-left {
	right: calc(150% - 140px);
}

.deco--circle-right {
	left: calc(150% - 140px);
}

.deco--circle,
.slide__inner {
    width: 450px;
    height: 450px;
}

.slide__item {
	position: relative;
	width: 100%;
}

.no-js .slide__item {
	display: none;
}

.slide__inner {
	position: relative;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
	margin: 0 auto;
	padding: 20px;
	pointer-events: auto;
}

.deco--expander {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -225px 0 0 -225px;
    border-radius: 50%;
    background: #fff;
}

.slide__title {
    position: relative;
    text-indent: 4px;
    letter-spacing: 4px;
    text-transform: uppercase;
    color: #c40000;
    font-weight: bold;
}

.slide__title--preview {
	font-size: 1.05em;
	margin: 2em 0 0 0;
	padding: 0;
	opacity: 0;
	text-align: center;
}

.slide__title--main {
	font-size: 2.5em;
	line-height: 1;
	margin: 0 0 0.25em;
	color: #464653;
}

.slide--current .slide__title--preview {
	opacity: 1;
}

.slide--open .slide__title--main {
	opacity: 1;
}

.slide__price {
	font-weight: bold;
	display: inline-block;
	color: #464653;
}

.slide__price--large {
	font-size: 1.3em;
	vertical-align: middle;
}

.slide__img {
	position: relative;
	display: block;
	margin: 0 auto;
}

.slide__img--small {
	max-height: 80%;
}

.slide__img--large {
	height: 50vh;
	max-height: 400px;
	margin: 0 auto 3em;
}

.action {
	font-size: 1.5em;
	line-height: 54px;
	width: 50px;
	height: 50px;
	margin: 0;
	padding: 0;
	text-align: center;
	border: none;
	background: none;
}

.action:focus {
	outline: none;
}

.action--open {
	position: absolute;
	right: 0;
	bottom: 0;
	margin: 0 40px 40px 0;
	color: #fff;
	border-radius: 50%;
	background: #c40001;
	-webkit-transition: -webkit-transform 0.1s, background 0.1s, opacity 0.1s;
	transition: transform 0.1s, background 0.1s, opacity 0.1s;
	-webkit-transition-delay: 0.1s;
	transition-delay: 0.1s;
}

.action--open:focus,
.action--open:hover {
	background: #464653;
	-webkit-transform: scale3d(1.0865, 1.0865, 1);
	transform: scale3d(1.0865, 1.0865, 1);
}

.slide--open .action--open {
	opacity: 0;
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
	-webkit-transform: scale3d(0.3, 0.3, 1);
	transform: scale3d(0.3, 0.3, 1);
}

.action--close {
    position: fixed;
    z-index: 9999;
    top: 120px;
    right: 150px;
    color: #c40001;
    -webkit-transition: -webkit-transform 0.1s, opacity 0.1s, color 0.1s;
    transition: transform 0.1s, opacity 0.1s, color 0.1s;
}

.action--close:focus,
.action--close:hover {
	color: #464653;
}

.slide--open ~ .action--close {
	opacity: 1;
	-webkit-transform: scale3d(1, 1, 1);
	transform: scale3d(1, 1, 1);
	-webkit-transition-delay: 0.5s, 0.5s, 0s;
	transition-delay: 0.5s, 0.5s, 0s;
}

.action--close,
.slide--close ~ .action--close {
	opacity: 0;
	-webkit-transform: scale3d(0.3, 0.3, 1);
	transform: scale3d(0.3, 0.3, 1);
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}

.js .slide__content {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	pointer-events: none;
	opacity: 0;
}

.js .slide--open .slide__content {
	pointer-events: auto;
	opacity: 1;
}

.slide__content-scroller {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
	padding: 2em;
	position: relative;
}

.js .slide__content-scroller {
	position: fixed;
	min-height: 100vh;
	width: 100vw;
}

.slide__description {
	font-size: 1em;
	font-weight: bold;
	margin: 0.25em auto 3em;
	text-indent: 4px;
	letter-spacing: 4px;
	text-transform: uppercase;
	color: #acacb3;
}

.button {
	font-weight: bold;
	margin: 0 1em;
	padding: 0.5em 1em;
	color: #fff;
	border: none;
	border-radius: 2px;
	background: #c40001;
}

.button:focus,
.button:hover {
	outline: none;
	background: #464653;
}

.navbutton {
	position: absolute;
	z-index: 1;
	top: 50%;
	left: 50%;
	width: 100px;
	height: 30px;
	margin: 0;
	margin: -50px 0 0 0;
	padding: 0;
	border: none;
	background: none;
}

.navbutton__line {
	-webkit-transition: stroke 0.2s;
	transition: stroke 0.2s;
}

.navbutton:focus {
	outline: none;
}

.navbutton:hover .navbutton__line {
	stroke: #464653;
}

.navbutton--next {
	-webkit-transform: translate3d(220px,-125px,0);
	transform: translate3d(220px,-125px,0);
    top: 72%;
    left: 75%;
    height:87px;
    width: 39px;
    background-image: url(../images/sce/next.png);
    background-repeat: no-repeat;
    cursor: pointer;
}

.navbutton--prev {
	-webkit-transform: translate3d(-100%, 0, 0) translate3d(-220px,137px,0);
	transform: translate3d(-100%, 0, 0) translate3d(-220px,137px,0);
    top: 25%;
    left: 25%;
    height:87px;
    width: 39px;
    background-image: url(../images/sce/prev.png);
    background-repeat: no-repeat;
    cursor: pointer;
} /* +12 of difference */

/* Helper classes */

.lockscroll {
	position: fixed;
	overflow-y: scroll;
	height: 100vh;
}

.noscroll {
	overflow: hidden;
	height: 100vh;
	position: fixed;
}

.noscroll .deco--expander {
	display: none;
}

.scrollable {
	overflow: hidden;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
	background: #fff;
}

.scrollable .slide__content-scroller {
	position: relative;
}

#gu_awards .container {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
    top: 240px;
}
div.fa.fa-plus{
    background: url(../images/sce/plus2.png);
    background-repeat: no-repeat;
    background-position: 2px 2px;
    cursor: pointer;
}
div.fa.fa-close {
    background: url(../images/sce/plus2.png);
    background-repeat: no-repeat;
    background-position: 2px 2px;
    cursor: pointer;
    height: 50px;
    width: 50px;
    transform: rotate(45deg);
}