@charset "utf-8";
/* CSS Document */


@font-face {
    font-family: "surf";
    src: url("includes/OratorStd.otf");
    font-weight: normal;
}

@font-face {
	font-family: 'andale';
	src: url('includes/AndaleMono.eot'),
            url('includes/AndaleMono.eot?#iefix') format('embedded-opentype')\9
}


@media screen and (min-width:300px) and (max-width:800px) {
    .item_menu{
            padding-top:10px;
    }
}


html, body {
  height: 100%;
  width: 100%;
  padding: 0;
  margin: 0;
  font-family:surf,andale;
}


#menu a,
#idioma a{
	border:none;
	text-decoration:none;
	color:white;
}

a{
	border:none;
	text-decoration:none;
	/*color:brown;*/
	color:#44b0a7;
}

a img{
	border:none;
}

.verde{
	color:#44b0a7;
}

.letra{
	font-size:12px;	
}

.musica{
	font-size:15px;	
	overflow-x:hidden;
	overflow-y:auto;
	height:410px;
	letter-spacing:-2px;
}

#background-image-inicio {
	background: url("img/SURF&SUN.png") no-repeat top center; 
  	-webkit-background-size: 100% 100%;
  	-moz-background-size: 100% 100%;
  	-o-background-size: 100% 100%;
  	background-size: 100% 100%;
	height:840px;
	width:1155px;
	position:relative;
	margin: 0 auto;
/*	position: absolute;
	top: 50%;
	left: 50%;
	margin-top:-420px;
	margin-left:-550px;*/
}

#background-image-colaboradores {
	background: url("img/colaboradores.png") no-repeat top center; 
  	-webkit-background-size: 100% 100%;
  	-moz-background-size: 100% 100%;
  	-o-background-size: 100% 100%;
  	background-size: 100% 100%;
	height:840px;
	width:1155px;
	position:relative;
	margin: 0 auto;
	/*position: absolute;
	top: 50%;
	left: 50%;
	margin-top:-420px;
	margin-left:-550px;*/
}

#menu{
	background-color: #000000;
    color: #FFFFFF;
   /* height: 28px;*/
    margin-left: 92px;
    margin-top: 85px;
    position: absolute;
   /* width: 380px;*/
	display:table-cell;
	vertical-align:middle;
	font-size:20px;
}

#menu .selected{
	background-color:#55d3c8;	
}

#idioma{
	background-color: #000000;
    color: #FFFFFF;
    margin-left: 980px;
    margin-top: 85px;
    position: absolute;
	display:table-cell;
	vertical-align:middle;
	font-size:17px;
}

#redes_sociales{
	color: #FFFFFF;
	right: 94px;
	top: 30px;
	position: absolute;
}

.item_menu{
    /*line-height:25px;*/
    padding-left:10px;
    padding-right:10px;
    padding-top: 6px;
    float:left;
    display:table-cell;
    vertical-align: middle;
    position:relative;
    /*#position:absolute;*/
    /*#top: 50%;*/
}

#content{
    height: 430px;
    width: 858px;
    left: 50%;
    top: 50%;
    margin-left: -434px;
    margin-top: -160px;
    position: absolute;
}

#content h3{
    font-size: 25px;
    font-weight: normal;
    letter-spacing: -2px;
    margin:2px;
    letter-spacing: -1px\9
    /*word-spacing: -4px;*/
}

#content_colaboradores {
    height: 637px;
    left: 50%;
    position: absolute;
    top: 50%;
    width: 1063px;
	margin-left: -521px;
    margin-top: -268px;
    position: absolute;
	overflow-x:hidden;
	overflow-y:auto;
}

#content_colaboradores h1{
	font-size: 29px;
    font-weight: normal;
    letter-spacing: -2px;
    /*word-spacing: -4px;*/
	margin:2px;
}

#acciones{
	font-size:13px;
	font-weight:bold;
	margin-top:5px;
	line-height: 23px;
}

#etiqueta_surfandsun{
    background-color: #000000;
    color: #FFFFFF;
    display: table-cell;
    font-size: 18px;
    line-height: 15px;
    padding: 7px 5px 3px;
    word-spacing: -10px;
}

.lyric{
	background-color:black;
	width:100%;
	height:140px;
	/*float:right;	*/
	display:none;
	font-size:12px;
	color:white;
	overflow-x:hidden;
	overflow-y:auto;
	font-variant:small-caps;
	margin:10px;
}

.colaborador{
	margin:5px;
	font-size:13px;
	width:32%;
	display:inline-block;
	float:left;
}

.colaborador_info{
	padding-left:10px;	
	letter-spacing: -3px; 
	letter-spacing: -0px\9
}

.colaborador_img{
	width:100px;
	height:100px;
	float: left;	
	margin-right:10px;
}

.colaborador_todo{
	margin:13px;
	font-size:13px;
	width:100%;
}

.colaborador_todo_info{
	float: right;
    font-size: 13px;
    margin-right: 30px;
    width: 740px;
	letter-spacing: -1px;
	letter-spacing: -0px\9
}

.colaborador_todo_img{
	position:absolute;
	bottom:5%;
}

.etiqueta_negra{
	background-color: #000000;
    color: #FFFFFF;
    font-size: 20px;
    /*line-height: 18px;*/
    padding: 5px;
}

#play1,#play2,#play3,#play4{
	margin-top:4px;
	cursor:pointer;
	float:left;	
}

.audiojs{
	display:none;
}


.imagen-colaborador{
	
	background-size:100px auto;
	background-position:center; 
	width:100px;
	height:100px;
	float:left;
	margin:5px; 
	background-repeat:no-repeat; 
	/*background-color:#feebd5; 
	border:solid 1px #feebd5;	*/
}



/*body{
	background: url("<? echo $img[$random]; ?>") no-repeat top center; 
  	-webkit-background-size: 100% 100%;
  	-moz-background-size: 100% 100%;
  	-o-background-size: 100% 100%;
  	background-size: 100% 100%;*/
	/*background:url("<? echo $img[$random]; ?>") no-repeat 50% 20% fixed;
    margin: 0 auto;
	height:100%;
}*/