@charset "utf-8";

@viewport {
   width: device-width; /* largeur du viewport */
   zoom: 1; /* zoom initial à 1.0 (et clin d'oeil aux fans d'IE6/7) */
}

:root{
    var-MainColor:#fee715;
    --main-color: #fee715;
}

div.square {
  border: solid 21px var(MainColor);
  border: solid 21px var(--main-color);
  width: 170px;
  height: 170px;
  position: absolute;
  left: 290px;
  top: 29%;
  z-index: 161;
}

@font-face {
	font-family: "RevolvR";
	src: url(../polices/RevolvR.ttf);
    font-weight: normal;
    font-style: normal;
}

@font-face {
	font-family: "HelveticaR";
	src: url(../polices/HelveticaR.otf);
    font-weight: normal;
    font-style: normal;
}

@font-face {
	font-family: "RegulaR";
	src: url(../polices/Regular.ttf);
    font-weight: normal;
    font-style: normal;
}

@font-face {
	font-family: "RegulaR-Bold";
	src: url(../polices/Regular-Bold.ttf);
    font-weight: normal;
    font-style: normal;
}

.Blade {
	font-family: "RevolvR";
}

.RegulaR {
	font-family: "RegulaR";
}

.RegulaR-Bold{
	font-family: "RegulaR-Bold";
}

#email{
    width: auto;
    color: #a2a2a2;
    font-size: 2.5vh;
    text-align: left;
    height: 7vh;
    line-height: 9vh;
    margin-right: 15px;
}

#email:hover{
	color:white;
}

.Classic {
	font-family: "Arial";
}

.Parag {
	font-family: "Open Sans";
		text-align: justify;
}

#icoradio,#navnomradio,#pub{
    vertical-align: middle;
}
#currentSong,#icoradio{
    display: inline-block;
}
#logo,.jp-audio ul li>a,h2{
    text-align: center
}
#coversong,#lastplay,#mosaicradio{
    position: absolute
}
.jp-volume-bar-knob{
    position: absolute;
     right: 0;
     margin-top: -6px;
     z-index: 50
}
.ui-slider-horizontal{
    height: 0;
     border: transparent;
     width: 100%
}

#center,#logo,#nav{
    display: block
}
#playstop,#pub{
    display: inline-block;
     width: 250px;
     left: 0%;
}
#center,#pub{
    height: 275px;
}
#divpub,#playerall{
    background-position: center
}
#divpub,#logoradio,#playerall{
    margin-left: auto;
     margin-right: auto
}


body{
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif, "RevolvR", "HelveticaR", "Open Sans";
     background-color: #101820;
     padding: 0;
     margin: 0;
     width:100%;
	 overflow:hidden;
}


#Page{
	height:100vh;
    width:100vw;
    position:absolute;
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none; /* IE 10 and IE 11 */
    user-select: none; /* Standard syntax */
}

#BackgroundGradient{
    background-image: linear-gradient(to right top, #040608, #0d141b, #131e2a, #142230, #162a3e);
    height:100%;
    width:100%;
    position:absolute;
    z-index:-100;
}

#BackgroundImage{
    background-image: url(https://images.pexels.com/photos/262738/pexels-photo-262738.jpeg?cs=srgb&dl=pexels-pixabay-262738.jpg&fm=jpg);
    height:100vh;
    width:100%;
    position:absolute;
    z-index:-99;
    background-size:cover;
    opacity:0.3;
    filter:blur(5px);
    background-position: bottom;
}


#particles-js
{
    filter: blur(5px);
    width: 100vw;
    height: 100vh;
    z-index: 401;
    position: absolute;
    opacity: 0.5;
}

.count-particles{

    position: absolute;
    top: 48px;
    left: 0;
    width: 80px;
    color: #13E8E9;
    font-size: .8em;
    text-align: left;
    text-indent: 4px;
    line-height: 14px;
    padding-bottom: 2px;
    font-family: Helvetica, Arial, sans-serif;
    font-weight: bold;
  }
  
  .js-count-particles{
    font-size: 1.1em;
  }
  
  #stats,
  .count-particles{
    -webkit-user-select: none;
    margin-top: 5px;
    margin-left: 5px;
  }
  
  #stats{
    border-radius: 3px 3px 0 0;
    overflow: hidden;
  }
  
  .count-particles{
    border-radius: 0 0 3px 3px;
  }
  
  

nav {
border-bottom:solid;
border-bottom-color:var(--main-color);
display:flex;
justify-content:space-between;
height:7vh;
width:100vw;
position:absolute;
z-index:8000;
}

nav ul {
    font-size: 0;
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: center;
}
nav li {
    display: inline-block;
    margin: 0;
    padding: 0;
    position: relative;
    min-width: 15%;
}
nav a {
    margin-top:0.1vh;
	text-transform: uppercase;
    display: block;
    padding: 0 25px;
    text-align: center;
    text-decoration: none;
    -webkit-transition: all .25s ease;
       -moz-transition: all .25s ease;
        -ms-transition: all .25s ease;
         -o-transition: all .25s ease;
            transition: all .25s ease;
	cursor: pointer;

}

ul.nav1 {
    color: var(--main-color);
    font: 2.5vh / 7.5vh sans-sherif;
    font-family:RevolvR;
    letter-spacing:1.3vh;
    margin-top:-0.6vh;
}

ul.nav2 {
    color: white;
    font: 2vh / 7vh sans-sherif;
	font-family: "RegulaR-Bold";
}

nav .dropdown:after {
    content: ' \25bc';
}
nav li:hover a {
    background: var(MainColor);
    background: var(--main-color);
    color: #101820 !important ;
}

#website{
	z-index: 3;
	position:absolute;
	top:50%;
	background-color: #ffffff;
	left: 0;
	width: 100%;
	height: 535px;
	margin : 0 auto;
  margin-top: -267px;
	-webkit-mask-image: linear-gradient(to left, transparent 5%, black 30%);
	 mask-image: linear-gradient(to left, transparent 5%, black 30%);
}

#Programme{
    display: flex;
    justify-content: center;
    align-items: center;
 /*   background-color: #ffffff; */
    position: absolute;
    right: 0;
    left: 0;
    width: 100vw;
    height: 76vh;
    margin-top: 12vh;
    flex-direction: column;

}

#Programme img{
display: block;
    margin: auto;
    width: 100vw;
    height: 93vh;
    object-fit: scale-down;
}

#calendar{
    width: 90vw;
    height: 70vh;
    margin: auto;
    font-size: 2vh;
}

#legend{
    text-align: center;
    width: 90vw;
    height: 4vh;
    margin: auto;
    font-size: 2vh;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
}

.emission{
display: flex;
    align-items: center;
    margin: 1vh 0;
    align-content: center;
    color: white;
}

.carreCouleur {
float: left;
    height: 3vh;
    width: 3vh;
    border: 2px solid white;
    clear: both;
    margin-left: 5px;
    margin-right: 10px;
}

.purple {
  background-color: purple;
}

.green {
  background-color: green;
}

.yellow {
  background-color:yellow;
}

.black {
  background-color:black;
}

.tiltEmission{
    margin: 0;
}

.fc-timegrid-event, .fc-timegrid-more-link {
    font-size:3.5vh;
}

.fc-timegrid-event .fc-event-main {
    padding: 5px 6px 0px;
}

.fc .fc-view-harness {
    border: solid 3px;
    border-color: #fee715;
}

.fc .fc-col-header-cell-cushion {

    font-size: 4vh;
    color: black;
    font-family: 'RegulaR-Bold';
    text-transform: capitalize;
}

.fc .fc-scrollgrid-liquid {
    border: solid;
}

.fc-theme-standard td, .fc-theme-standard th {

    background-color: white;
}

.fc .fc-toolbar.fc-header-toolbar {
    margin-bottom: 0;
}

.prog {
  max-width: 100vw;
  margin: 0 auto;
  overflow: hidden;
}

.progR {
    overflow: hidden;
}

#QuoiSommesNous{
justify-content: center;
    align-items: center;
    height: 86vh;
    margin-top: 7vh;
    text-align: center;
    flex-direction: column;
}

#Quoi1{
color: #ffffff;
    max-width: 70vw;
    font-size: 3.5vh;
    word-wrap: break-word;
    white-space: pre-line;
}

#Quoi2{
color: #fee715;
    max-width: 70vw;
    font-size: 3.5vh;
    word-wrap: break-word;
    white-space: pre-line;
}


#QuiSommesNous{
/*	background-color:#101820; */
    width:100%;
    position:absolute;
    height:100%;
    z-index:800;
}

#membre1{
    height:100%;
    width:100%;
}

#membre2{
    height:100%;
    width:100%;
}


#imgMembre{
    margin-left:60px;
    left: 60px;
    transform: TranslateY(-50%) scale(1.5);
    top: 50%;
    height: auto;
    z-index: 800;
    position: absolute;
}

#divMembre{
    margin-left: 320px;
    margin-right: auto;
    height: 60%;
    width:50%;
    position: relative;
    top: 50%; /* poussé de la moitié de hauteur du référent */
    transform: translateY(-50%);
/*    border-width:1px;
    border-style:dotted;
    border-color:black; */
    display: table;
}

#hoverMember:hover{
    font-weight:bold;
}

#presentationNous{
    margin-left: 420px;
    margin-right: auto;
    height: 60%;
    width:40%;
    position: absolute;
    top: 50%; /* poussé de la moitié de hauteur du référent */
    transform: translateY(-50%);
    /* border-width:1px;
    border-style:dotted;
    border-color:black; */
    display: table;
}

#arrowQui{
 /*   right:350px; */
    width: 100%;
  /*  position: absolute;
    top: 50%;
    transform: translateY(-50%) rotate(-90deg); */
}


#ImageQui{
	display:block;
	margin-left: auto;
	margin-right: auto;
	height:435px;
}

p{
	color: #101820ff;
}

#player{
    width: auto;
}

#playerall{
	position: absolute;
    width: 100%;
	height: 535px;
}
#playercontent{
    position: relative;
     top: 0;
     right: 0;
     bottom: 0;
     left: 0;
     width: 100%;
     height: 480px
}


#encoursdelecture{

}
#currentSong{

     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
     width: 100%;
     color: #ffffff;
    font: 5vh / 8vh sans-sherif;
    font-family: 'Regular-Bold';
}


#icoradio{
	position:absolute;
}
#NoPicture{
  position: absolute;
     background-position: center center;
     width: 200px;
     height: 200px;
     left: 300px;
     top: 60%;
	 transform: translateY(-50%);
/*     border-color: #FFF;
     border-style: solid; */
	 z-index: 200;
}

#YesPicture{
	position: absolute;
     background-position: center center;
     width: 145px;
     height: 145px;
     left: 327px;
     top: 39%;
	 transform: translateY(-50%);
	 z-index: 150;
}


#HideRotate{
	position: absolute;
     background-position: center center;
     width: 150px;
     height: 150px;
     left: 327px;
     top: 38%;
	 transform: translateY(-50%);
	 z-index: 160;
}

#MilieuVinyl{
	position: absolute;
     background-position: center center;
     width: 145px;
     height: 145px;
     left: 327px;
     top: 39%;
	 transform: translateY(-50%);
	 z-index: 161;
}


@-webkit-keyframes rotating {
    from{
        -webkit-transform: rotate(0deg);
    }
    to{
        -webkit-transform: rotate(360deg);
    }
}

.rotating {
    -webkit-animation: rotating 6s linear infinite;
}


#NoPicture1 img{
    max-width: 100%;
     max-height: 100%;
}
     #YesPicture1 img{
         max-width: 100%;
          max-height: 100%;

}
#coversong{
  position:absolute;
     background-position: center center;
     width: 145px;
     height:145px;
     left:327px;
     top: 39%;
     transform: translateY(-50%);
	 z-index: 100;
}
#wrt_covers img{
    max-width: 100%;
    max-height: 100%;
    border-radius: 50%;
}

#wrt_artist{
    color:#fee715;
}

#coversong2{
	position: absolute;
     background-position: center center;
     width: 200px;
     height: 200px;
     left: 300px;
     top: 60%;
	 transform: translateY(-50%); /* tiré de la moitié de sa propre hauteur */
	 z-index: 80;
}
#wrt_covers2 img{
    max-width: 100%;
     max-height: 100%
}

#lecteur{
  position:absolute;
  width:250px;
  height:188px;
  top:59%;
  left:303px;
  transform: translateY(-50%); /* tiré de la moitié de sa propre hauteur */
  z-index: 300;
  box-shadow: grey 3px 3px 2px;
}

#logoBack{
	position:relative;
    width: 100%;
    height: 80px;
	background-color: #101820;
}

#logo{
	margin : 0 auto;
    width: 800px;
     height: 80px;
     background-image: url(../img/header2.png);
	 background-repeat: no-repeat;
}
#center{
	position: relative;
    width: 100%;
	height: 350px;
    /* background-color: var(MainColor);
    background-color: var(--main-color); */

	box-shadow: black 0px 0.1px 10px 0.1px;
	z-index:500;

    background: rgb(254,153,21);
background: -moz-linear-gradient(351deg, rgba(254,153,21,1) 0%, rgba(254,157,21,1) 17%, rgba(254,181,21,1) 35%, rgba(254,231,21,1) 100%);
background: -webkit-linear-gradient(351deg, rgba(254,153,21,1) 0%, rgba(254,157,21,1) 17%, rgba(254,181,21,1) 35%, rgba(254,231,21,1) 100%);
background: linear-gradient(351deg, rgba(254,153,21,1) 0%, rgba(254,157,21,1) 17%, rgba(254,181,21,1) 35%, rgba(254,231,21,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#fe9915",endColorstr="#fee715",GradientType=1);

}

#microphone{
	position:absolute;
	width: 400px;
	height: 535px;
	bottom:0%;
	right: 0%;
	z-index:501;
}

#navBottom{
    align-items: center;
    justify-content: space-between;
    display: flex;
    height: 7vh;
    width: 100vw;
    position: absolute;
    z-index: 999;
    bottom:0;
}

.background-selector{
    margin-right:20px;
}


.background-selector select {
    font-size: 1.5vh;
    cursor: pointer;
}

#CentrerLogoLecture{

    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    position: relative;
    
}

#CentrerTitreLecture{
    width:50vw;
    display: flex;
    flex-direction: column;
}


#playstop{
    width: auto;
    height: auto;
    margin-right:50px;
}

#CoursLecture{
    color: #ffffff;
    font: 4vh / 8vh sans-sherif;
    font-family: 'Regular-Bold';
    font-style: italic;
}

#centerplaystop{
    width: 35vh;
    height: 35vh;
}

#ReCenter{

}

#centervolume{
	width: 100%;
	height:7vh;
	margin: 5 auto;
    bottom:0;
    z-index:50000;
}

#centerbouton{
	position:absolute;
	width: 120px;
	height:50px;
	left: 20px;
}

#logoradio{
    width: 320px;
     height: 222px;
     margin-top: 7%
}
#divpub{
    background-image: url(../img/antiab.png);
     width: 270px;
     height: 250px;
     margin-top: 3%
}
#player,.jp-audio ul>li.volume{
    height: 7vh;
     display: block
}
.jp-audio ul{

    padding: 0;
     margin: 0;
     width: 426px;
	 height: 7vh;
     list-style: none
}
.jp-audio ul>li{
    float: left;
     margin: 0 5px 0 0
}
.jp-audio ul li>a{
    display: block
}
#center,.jp-volume-bar{
    display: inline-block
}
.jp-audio ul li:last-child>a{
    border-right: none
}
.jp-audio ul li a>img{
    opacity: 1
}
#BoutonPlay:hover{
    content: url(/img/playHDJcarre.png);
}
#BoutonPause:hover{
    content: url(/img/pauseHDJcarre.png);
}
.jp-volume-bar{
    margin: 2.8vh 1vh 2.8vh;
     border-radius: 2px;
     padding: 0.3vh;
     overflow: hidden;
    /* background:white; */
     width: 300px;
     height: 1vh;
     cursor: pointer
}
li.social,ul.social{
    padding-right: 0
}

.jp-volume-bar-value{
    width: 0;
     height: 1vh;
}
button{
    border: none;
     outline: 0;
     background: 0 0;
     cursor: pointer;
     opacity: .8
}
button img{
    height: 46px;
     width: auto
}

#volume{
    position: absolute;
    left: 50%; /* Place l'élément au centre horizontal de la page */
    transform: translateX(-50%); /* Compense la moitié de sa propre largeur */
    text-align: center;
}

#social{
     width: 100%;
		 z-index:20;
		 height:50px;
}
.lpallelem,li.social{
    display: inline-block
}
ul.social{
    list-style-type: none;
     margin: 5px 0 0
}
li.social img{
    height: 5vh;
     width: auto;
		 z-index:100;
		 margin-top:3px;
}
li.social a>img{
    opacity: .7
}

#social p{
    position: absolute;
	letter-spacing: 1.5px;
	width:100%;
    height: 50px;
    font-size: 15px;
    top: 15px;
	text-align: center;
 /* Starting position */
 -moz-transform:translateX(100%);
 -webkit-transform:translateX(100%);
 transform:translateX(100%);
 /* Apply animation to this element */
 -moz-animation: scroll-left 35s linear infinite;
 -webkit-animation: scroll-left 35s linear infinite;
 animation: scroll-left 35s linear infinite;
}
/* Move it (define the animation) */
@-moz-keyframes scroll-left {
 0%   { -moz-transform: translateX(100%); }
 100% { -moz-transform: translateX(-100%); }
}
@-webkit-keyframes scroll-left {
 0%   { -webkit-transform: translateX(100%); }
 100% { -webkit-transform: translateX(-100%); }
}
@keyframes scroll-left {
 0%   {
 -moz-transform: translateX(100%); /* Browser bug fix */
 -webkit-transform: translateX(100%); /* Browser bug fix */
 transform: translateX(100%);
 }
 100% {
 -moz-transform: translateX(-100%); /* Browser bug fix */
 -webkit-transform: translateX(-100%); /* Browser bug fix */
 transform: translateX(-100%);
 }
}

#centrersocial{
    width: 35vh;
    z-index: 200;
    display: flex;
    align-items: center;
}

#mute{
    width:7vh;
    height:7vh;
    margin: 0px -2px;
}

#unmute{
    width:7vh;
    height:7vh;
    margin: 0px -2px;
}

#max{
    width:7vh;
    height:7vh;  
    position:absolute;
}

#mosaicradio li img:hover,li.social a>img:hover{
    opacity: 1
}
#mobilemenu{
    visibility: hidden;
     height: 0
}
#lastplay{
	position:absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
    z-index: 500;
     height: 283px;
	 width: 793px;

     background-color: rgba(239, 239, 239, .7);
     max-height: 0;
     overflow-y: hidden;
	 overflow-x: hidden;
     -webkit-transition: max-height .5s ease-in-out;
     -moz-transition: max-height .5s ease-in-out;
     -o-transition: max-height .5s ease-in-out;
     transition: max-height .5s ease-in-out
}
#lastplay.closed,#mosaicradio{
    -webkit-transition: max-height .5s ease-in-out;
     -moz-transition: max-height .5s ease-in-out;
     -o-transition: max-height .5s ease-in-out;
     overflow-y: hidden;
	 overflow-x: hidden;
}
#lastplay.closed{
		position:absolute;
	top: 50%;
	transform: translate(-50%, -50%);
    max-height: 105px;
     transition: max-height .5s ease-in-out
}
.alignlastplay{
    width: 800px;
     margin-left: 0px;
     margin-right: 0px;
     padding: 10px
}
.lpallelem{
    width: 124px;
     height: 60px;
     vertical-align: top;
     background-color: rgba(255, 255, 255, .99);
     padding: 10px;
     text-align: center;
     margin: 3px
}
#mosaicradio,#mosaicradio.mosaicclosed,.alignmosaicradio{
    margin-left: auto;
     margin-right: auto
}
.lpallelem img{
    width:1px;
    opacity:0;
}
.lptitle{
    font-size: 12px
}
.currentSong{
    font-weight: 700;
}
#mosaicradio{
    z-index: 200;
     top: 0;
     height: 496px;
     background-color: rgba(239, 239, 239, .85);
     max-height: 0;
     transition: max-height .5s ease-in-out
}
#mosaicradio.mosaicclosed{
    max-height: 100%;
     overflow-y: hidden;
     -webkit-transition: max-height .5s ease-in-out;
     -moz-transition: max-height .5s ease-in-out;
     -o-transition: max-height .5s ease-in-out;
     transition: max-height .5s ease-in-out;
     cursor: grab;
     cursor: -o-grab;
     cursor: -moz-grab;
     cursor: -webkit-grab
}
#mosaicradio ul{
    list-style-type: none;
     padding-left: 0
}
#mosaicradio li{
    display: inline;
     display: inline-block;
     -webkit-border-radius: 50%;
     -moz-border-radius: 50%;
     border-radius: 50%;
     -khtml-border-radius: 50%;
     border: 5px solid #fff
}
#mosaicradio li img{
    -webkit-border-radius: 50%;
     -moz-border-radius: 50%;
     border-radius: 50%;
     -khtml-border-radius: 50%;
     height: 150px;
     opacity: .8
}
.alignmosaicradio{
    width: 750px;
     padding: 10px;
     text-align: center;
     Line-Height: 10px
}
.alignmosaicradio button{
    padding: 20px
}


#shout{
    position: absolute;
    background-color: #ffffff;
    right: 0;
    width: 100%;
    height: 93vh;
    margin: 0 auto;
    margin-top: 7vh;
    overflow-x: hidden;
    overflow-y: scroll;
    z-index: 1500;
    display: none;
}

.h-captcha{
    margin-left: 82px;
    margin-bottom: 20px;
}

#anchor{
    background-color:#ffffff;
}

#boutonchat{
	position:absolute;
  top: 50%; /* poussé de la moitié de hauteur du référent */
  transform: translateY(-50%);
  font-weight:bold;

}

.NS{
	display:none;
}

#description{
	width: 100%;
	height: 100%;
}

#premieredescription{
	width: 100%;
	height: auto;

}

@keyframes slideInFromLeft {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}

#RectangleQuoi{

}

#RectangleQui{
}



#TitreRectangle1{
	margin: 0 auto;
	width:100%;
	height:80px;
	z-index:1;
	background-color:#101820ff;
border: 2px solid #ffffff;
}


#CadreRectangle1{
	background-color:#ffffff;
	margin: 0 auto;
	margin-right: 35%;
	top:80px;
	width:100%;
	z-index:1;
	height:350px;
border: 2px solid #ffffff;
}

#CadreRectangle2{
	background-color:#ffffff;
	position:absolute;
	margin: 0 auto;
	margin-right: 35%;
	top:80px;
	width:100%;
	z-index:1;
	height:150px;
border: 2px solid #ffffff;
}

#quoi{
	position: absolute;
	margin: 0 auto;
		top: 50%;
	transform: translate(-50%, -50%);
	left: 50%;
	z-index: 5;
	font-size: 40px;
	letter-spacing: 10px;
	white-space: nowrap;
	text-align:center;
	text-indent: 10px;
}

#quoi2{
	position: absolute;
	margin: 0 auto;
	height:80px;
	top: 50%;
	transform: translate(-50%, -41%);
	left: 50%;
	z-index: 5;
	font-size: 40px;
	letter-spacing: 50px;
	white-space: nowrap;
	text-align:center;
	text-indent: 50px;
    color: var(MainColor);
    color: var(--main-color);
}

#quoi2:hover {

}


#DescriptionQuoi{
	margin: 0 auto;
	position: absolute;
	width:100%;
	top: 80px;
	height:150px;
}

#ParagStyle{
	width :80%;
	margin: 0 auto;
	position: absolute;
	margin-top: 20px;
	left: 50%;
	transform: translate(-50%);
	z-index: 5;
	font-size: 1.4em;
}

#ParagStyle2{
	vertical-align:middle;
	z-index: 5;
	font-size: 30px;
	text-align: center;
	white-space: nowrap;
}

#PolaroidSpace{
	height:200px;
	position:absolute;
	width:100%;
	top:290px;

}

.polaroids {
    text-align: center;


}
.polaroids a {


    background: white;
    display: inline-block;
    text-decoration: none;
    font-size: 18px;
    padding: 10px 10px 25px 10px;
    margin: 0 0 27px 30px;
    width: 100px;
    color: #8B8B8B;

    -moz-box-shadow: 0px 1px 5px 0px #656565;
    -webkit-box-shadow: 0px 1px 5px 0px #656565;
    -o-box-shadow: 0px 1px 5px 0px #656565;
    box-shadow: 0px 1px 5px 0px #656565;

    -webkit-transform: rotate(-1deg);
    -moz-transform: rotate(-1deg);
    -o-transform: rotate(-1deg);
    tranform: rotate(-1deg);

    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;

    -moz-opacity: 0.85;
    -khtml-opacity: 0.85;
    opacity: 0.85;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=85);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=85);
    filter:alpha(opacity=85);
}
.polaroids a:hover {
    -moz-opacity: 1;
    -khtml-opacity: 1;
    opacity: 1;
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=100);
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
    filter:alpha(opacity=100);
}
.polaroids a:nth-child(odd) {
    -webkit-transform: rotate(1deg);
    -moz-transform: rotate(1deg);
    -o-transform: rotate(1deg);
    tranform: rotate(1deg);
}
.polaroids a:after {
    content: attr(title);
}
.polaroids img {
	  height:50px;
    border: 1px solid #C9C9C9;

}


li.social img:hover {
  cursor: pointer;
  animation-name: bounce;
  -moz-animation-name: bounce;
}

@keyframes bounce {
	0%, 100%, 20%, 50%, 80% {
		-webkit-transform: translateY(0);
		-ms-transform:     translateY(0);
		transform:         translateY(0)
	}
	40% {
		-webkit-transform: translateY(-30px);
		-ms-transform:     translateY(-30px);
		transform:         translateY(-30px)
	}
	60% {
		-webkit-transform: translateY(-15px);
		-ms-transform:     translateY(-15px);
		transform:         translateY(-15px)
	}
}


#videoDiv {
    position: absolute;
    z-index:-10000000;
}
#videoBlock {width: 640px; height: 368px;  display: flex;  justify-content: center; align-items: center; top: 50%; margin-top: 184px;}