body {
    font: 11pt/1.5 "Feura Sans", Cantarell, sans-serif;
    margin: 0;
    background-color: #2F2965;
	animation: 100s infinite colorful;
	-webkit-animation: 100s infinite colorful;
}
a { text-decoration: none; color: #4E43C8; }
article a { font-weight: bold; color: #4E43C8;}
p a:hover { text-decoration: underline; }

h1, h2, h3, h4, h5, h6 {
    font-family: "Feura Sans", Cantarell, sans-serif;
    font-weight: normal;
}
hr {
    border: 1px solid rgba(255, 255, 255, 0.1);
    width: 50%;
}
td.play {
	padding-left: 1px;
	margin-left: 1px;
	border: none;
	background: transparent url(/822x314_RMS_Anim_001.gif) no-repeat scroll left center;
	background-size: auto 100%;
}
section.index {
    margin: 0 auto;
    text-align: center;
}
section.index.home {
	animation: 3s fondu;
	-webkit-animation: 3s fondu;
}
section.index figure a,
section.index figure a:hover {
	border: 0;
	box-shadow: 0 0;
}
section.index figure h1 {
    font-weight: normal;
    vertical-align: middle;
    color: #fff;
    font-size: 220%;
    transition: all .3s;
    -webkit-transition: all .3s;
    opacity: 1;
}
section.index.post {
    margin-top: 5px;
}
section.index.post figure h1 {
    font-size: 210%;
    display: inline-block;
}
@media screen and (min-width:750px) {
	body {
		font-size: 13pt;
	}
}
#cassiopeia {
    margin: 0;
    border-radius: 50%;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    border: 0;
    vertical-align: middle;
    width: 50px;
    transition: all .3s;
    -webkit-transition: all .3s;
}
@media screen and (max-width:449px) {
	section.index figure h1 {
		margin: 5px 0 10px;
	}
}
section.index figure h1 small {
    display: block;
    font-size: 40%;
    text-align: left;
    color: rgb(153, 153, 153);
}

section.index figure.emb {
    padding: 0;
    margin: 0 5px;
    display: inline-block;
    transition: all 1.5s;
    -webkit-transition: all 1.5s;
}
@media screen and (min-height:300px) {
	section.index figure.emb,
	section.index.post figure.emb {
		margin-top: 6px;
	}
}
@media screen and (min-height:520px) {
	section.index figure.emb {
		margin-top: 6px;
	}
}
@media screen and (min-height:800px) {
	section.index figure.emb {
		margin-top: 6px;
	}
}

section.index nav a {
	color: rgba(255, 255, 255, 0.45);
	margin: 0 4px;
	font-size: 110%;
	transition: all .2s;
	-webkit-transition: all .2s;
}
section.index nav a:hover {
	color: #fff;
}
/*
.but {
	color: rgba(255, 255, 255, 0.5);
	display: inline-block;
	padding: 4px 12px;
	transition: all .2s;
	-webkit-transition: all .2s;
}
.but.vol {
	font-size: 160%;
}
.but:hover {
	color: #fff;
}

#playbut {
	background-color: rgba(255, 255, 255, 0.2);
	display: inline-block;
	vertical-align: middle;
	line-height: 45px;
	font-size: 150%;
	color: #fff;
	width: 45px;
	height: 45px;
	padding: 0;
	margin: 0 7px 15px;
	border-radius: 2px;
	box-shadow: 0 2px rgba(0, 0, 0, 0.2);
}
#playbut:hover {
	background-color: rgba(255, 255, 255, 0.35);
}
*/
/* animations */

@keyframes fondu {
    0% { opacity: 0; }
    100% { opacity: 1; }
}
@-webkit-keyframes fondu {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

@keyframes colorful {
    0% { background-color: #2F2965; }
    20% { background-color: #652945; }
    40% { background-color: #3F6529; }
    60% { background-color: #296557; }
    80% { background-color: #294265; }
    100% { background-color: #382965; }
}
@-webkit-keyframes colorful {
    0% { background-color: #2F2965; }
    20% { background-color: #652945; }
    40% { background-color: #3F6529; }
    60% { background-color: #296557; }
    80% { background-color: #294265; }
    100% { background-color: #382965; }
}

/* polices */

@font-face {
    font-family: 'Feura Sans';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/feurasans/FeuraSans-Regular.ttf) format('truetype');
}
@font-face {
    font-family: 'Feura Sans';
    font-style: normal;
    font-weight: 700;
    src: url(../fonts/feurasans/FeuraSans-Bold.ttf) format('truetype');
}

/* Look for SHOW HIDE DIV */
.boutondiv {
    color:#ffffff;
    /* font-size:24px; */
    cursor:pointer; } 
.boutondiv:hover {
    text-decoration:underline; 
	color:#ff0000; }
.texte {
    border:1px solid #333333;
    background:#eeeeee;
    padding:10px;
    color:#333333; }
.texte:hover {
    border:1px solid #000000;
    background:#cccccc;
    color:#000000; }

/* Pictograms size */
.pictodif {font-size:25px; } /* Pictograms for broadcast titles */
.pictoerror {font-size:225px; } /* Pictograms for error no flow stream */

/* Effect on covers */
#Cover {	position: relative; }

#CoverPicture{
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	width: 256px;
	height: 256px;
	background-color: rgba(255,255,255,.5);
	box-shadow: 0 0 5px rgba(0,0,0,.2);
	-moz-box-shadow: 0 0 5px rgba(0,0,0,.2);
	-webkit-box-shadow: 0 0 5px rgba(0,0,0,.2);
	animation: rotatePochette 2.8s linear infinite;
	-o-animation: rotatePochette 2.8s linear infinite;
	-moz-animation: rotatePochette 2.8s linear infinite;
	-webkit-animation: rotatePochette 2.8s linear infinite; }
	
#CoverMiniPicture{
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	width: 70px;
	height: 70px;
	background-color: rgba(255,255,255,.5);
	box-shadow: 0 0 5px rgba(0,0,0,.2);
	-moz-box-shadow: 0 0 5px rgba(0,0,0,.2);
	-webkit-box-shadow: 0 0 5px rgba(0,0,0,.2);
	/*animation: rotatePochette 2.8s linear infinite;
	-o-animation: rotatePochette 2.8s linear infinite;
	-moz-animation: rotatePochette 2.8s linear infinite;
	-webkit-animation: rotatePochette 2.8s linear infinite; */ }
	
#CoverDisc {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background: url(../img/disc_mid.png) no-repeat center center; }
	
#CoverMiniDisc {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background: url(../img/disc_mini.png) no-repeat center center; }
	
/* Animation of rotating disc covers */
@keyframes rotatePochette {
	from { transform: rotate(0deg); }
	to { transform: rotate(359deg); }
}
@-o-keyframes rotatePochette {
	from { -o-transform: rotate(0deg); }
	to { -o-transform: rotate(359deg); }
}
@-moz-keyframes rotatePochette {
	from { -moz-transform: rotate(0deg); }
	to {	-moz-transform: rotate(359deg); }
}
@-webkit-keyframes rotatePochette {
	from { -webkit-transform: rotate(0deg); }
	to { -webkit-transform: rotate(359deg); }
}

#zone1 {
    width: 390px;
	position:static;
    //height: 34px;
    border-style: solid;
    border-width: 1px;
    border-color: white;
}
#zone2 {
    width: 49%;
	position:relative;
    top:0px;
	float:left;
    height: 34px;
    //border-style: solid;
    border-width: 1px;
    border-color: white;
}
#zone3 {
    width: 49%;
	position:relative;
    top:0px;
	float:right;
    height: 34px;
    //border-style: solid;
    border-width: 1px;
    border-color: white;
}
#zone {
 //position:absolute;
    //top:34px;
    width: 99%;
    //height: 315px;
    //border-style: solid;
    border-width: 1px;
    border-color: white;
}

/* La couleur de fond prend le pas sur celle de toute la page */
mark
{
    background-color: red;
    color: black;
}
/* For scroll UP page */
button{
  position: relative;
}
.scrollToTop{
    color: #444;
    text-decoration: none;
    position:fixed;
    bottom:5%;
  right: 5%;
  background-color: rgba(50,50,50,0.8);
  color: white;
  display:none;
  border: none;
  padding: 5px;
  cursor: pointer;
}