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

*{margin:0;
		padding: 0;}

body{
	background-image:url("../img/fondonegro.jpg");
    background-repeat:
	 repeat-y;


}

@font-face {
    font-family:fontello;
	src: url("../fonts/fontello.eot");
	src: url("../fonts/fontello.svg");
	src: url("../fonts/fontello.ttf");
    src: url("../fonts/fontello.woff");
}


			
 


.contenedor{padding:5PX;
	        width:10%;
			height:300px;
			min-width:320px;
			background-color:#CFB53B;
			border-radius:50%;
            margin-left:35%;
            margin-top:20%;
	        position:relative;
            
	
}





		.tapa{   background-image:url(../img/fototapa2.png);
				 width:100%;
		   		 height:100%;
				 left:340px;
				 position:absolute;
			     border-radius:50%;
		         z-index:10;
			     -moz-animation:5s retirada infinite;
                 -webkit-animation:5s retirada infinite;}
                 @-moz-keyframes retirada{0%{
                 left:0px;}
	             }

                 @-webkit-keyframes retirada{0%{
                 left:0px;}
	
}






.contenedor h1 {text-align: center;
                position: absolute;
                margin-top: 30%;
                margin-left: 20%;

}



.contenedor h3  {text-align: center;
                 position:absolute;
	             color:aliceblue;
	             margin-top: 55%;
                 margin-left:20%;}


.contenedor1 h1{text-align: center;
	
	font-family: 'Open Sans Condensed', sans-serif;
	font-size:2em;
	margin-top:2px;}


.contenedor1 {     width:90%;
                 height:auto;
	            float:left;
				height:auto;
                display: inline-block;
				min-width:250px;
				background-color:red;
				
				margin-left:20%;
				margin-top:40px;
                margin-bottom:40px;
	           z-index:3000;
    background-color: rgb(0, 0, 0, 0.01); 
}	


.contenedor2{   margin:0;
			    padding:0;
	       		width:100%;
				height:auto;
				min-width: 320px;
				background-color: #CFB53B;
				border:2px solid #CFB53B;
				margin-left:0%;
				margin-top:15%;
	            text-align: center;
		        z-index:-200;
	           
}

.contenedor2 h1{ font-size:1.3em;}




   .animacion{width:100%;
height:649px;}


   .animacion2{width:100%;
height:715px;

 box-shadow: 5px -10px 5px #000 ;
    float:left;}




.foto1{width: 50%;
		height:auto;
	    max-width: 500px;
}

.foto2{width: 100%;
		height:auto;
	   max-width: 1900px;
	    margin-top: 1px;
}

css javascript

.h4{display: block; }
.experienciaoculto{
    width:100%;
    height: auto;
    padding: 20px;
    margin: 3px;
	display: none;
}


h2{
    color: white;
    position: relative;
    margin: 10px auto;
    width: 300px;
}
	.cerrar  {width:60px;
            width:60px;
            height:20px;
            float: right;
             color:palevioletred;
            font-size:0.9em;
            font-weight: bold;
            display: none;
            cursor: pointer;
            background-color:black;
            text-align: center;
            vertical-align: center;
            border-radius:70%;
            float:right;
        }
	
	#cerrado{
    position: relative;
    top: 45px;
}
		
.label.enlinea {display:inline;}
.enlinea{
    width: auto;
    font-weight: normal;
    font-size: 12px;
}
[type="checkbox"]{
    width: auto;
    margin-top: 5px;
}
section{
    width: 64%;
    float: left;
    margin: 3%;
}
aside{
    width: 24%;
    float: right;
    margin: 3%;
}
.animation{width:100%;
height:500px;}

iframe{width:100%;
         height:500px; }

.span piedeimagen{font-size:1.5em;}




.competenciasoculto, .experienciaoculto, .formacionoculto, .idiomasoculto, .portfoliooculto, .contactooculto {
    width: 70%;
    height: auto;
    padding: 20px;
    margin: 3px;
	min-width:320px;
	 border:2px solid #CFB53B;
	display:none;
	float:left;

	margin-left:20%;
	margin-top: 10%;
	z-index:2000;
        box-shadow: 5px -10px 5px #000 ;
    float:left;
    }


.experienciaoculto{
        background-image:url("../img/fondoblanco4.jpg");
    background-repeat: repeat-x
        repeat-y;
        
        
}
        
	    .competenciasoculto {background-image:url("../img/competencias2.jpg");
    background-repeat: repeat-x
	 repeat-y;
}


  .formacionoculto {background-image:url("../img/formacion2.jpg");
    background-repeat: repeat-x
	 repeat-y;
}

  .idiomasoculto {background-image:url("../img/multicolor.jpg");
    background-repeat: repeat-x
	 repeat-y;
}

  .contactooculto {background-image:url("../img/fondo-claro.jpg");
    background-repeat:repeat-x
	repeat-y;
}

      .portfoliooculto {background-image:url("../img/fondoblanco2.jpeg");
    background-repeat: repeat-x repeat-y;
}




.competenciasoculto h1, .experienciaoculto h1, .formacionoculto h1, .idiomasoculto h1, .portfoliooculto h1, .contactooculto {color:#000000; font-weight:500;  text-align:center;
    
}

.competenciasoculto h3, .formacionoculto h3, .portfoliooculto h3, .idiomasoculto h3, .contactooculto h3 {font-size:1.4em;color:#000000;}



.competenciasoculto h4, .idiomasoculto h4, .formacionoculto h4, .experienciaoculto h4, .portfoliooculto h4, .contactooculto h4 {font-size:1.6em; color:#0000ff; font-weight: 500; text-align: left; }


    
.competenciasoculto p, .experienciaoculto p, .formacionoculto, .idiomasoculto p, .portfoliooculto p, .contactooculto p, .piedeimagen {color:#000000;
;font-size:1.6em;text-align:left; }



   




.competenciaspequeno, .experienciapequeno, .formacionpequeno, .idiomaspequeno, .portfoliopequeno, .contactopequeno {
	width: 400px;
    height:400px;
   margin-top: 15px;
    margin-bottom:15px;
    margin-left: 15px;
    margin-right: 15px;
    min-width:300px;
    padding:20px;
	background-color:powderblue;
	border:2px black;
	display:inline-block;

 box-shadow: 5px -10px 5px #000 ;
    float:left; }
	
	
.competenciaspequeno p, .experienciapequeno p, .formacioonpequeno p, .idiomaspequeno p, .portfoliopequeno p, .contactopequenop { text-align:center; }

.competenciaspequeno, .experienciapequeno, .formacioonpequeno, .idiomaspequeno, .portfoliopequeno, .contactopequeno { text-align:center; }

.competenciaspequeno h1, .experienciapequeno h1, .formacionpequeno h1, .idiomaspequeno h1, .portfoliopequeno h1, contactopequeno h1  {text-align:center;
	font-size:2em;
	color:#000000;

}	
}





@media screen and (min-width: 300px) and (max-width: 768px){
    
    
.contenedor{padding:5PX;
	        width:10%;
			height:300px;
			min-width:320px;
			background-color:#CFB53B;
			border-radius:50%;
            margin-left:20%;
            margin-top:20%;
	        position:relative;
            
	
}

  
    
    
.contenedor1 {     width:100%;
                 height:auto;
	            float:left;
				height:auto;
                display: inline-block;
				min-width:250px;
				background-color:red;
				
				margin-left:0%;
				margin-top:40px;
                margin-bottom:40px;
	           z-index:3000;
    background-color: rgb(0, 0, 0, 0.01); 
}	

    
    
    
  
.competenciaspequeno, .experienciapequeno, .formacionpequeno, .idiomaspequeno, .portfoliopequeno, .contactopequeno {
	width: 400px;
    height:400px;
   margin-top: 15px;
    margin-bottom:15px;
    
    margin-right: 15px;
    min-width:300px;
    padding:20px;
	background-color:powderblue;
	border:2px black;
	display:inline-block;
 box-shadow: 5px -10px 5px #000 ;
    float:left; }

	
}

  
	
	


.icon-user{font-family:fontello;
               color:
                  #CFB53B;
                font-size:2em;
                margin-right:10px;
                   clear:both;
                       float:left;}

.icon-book{font-family:fontello;
               color:white;
                font-size:3em;
                margin-right:10px;
                   clear:both;
                       float:left;}

.icon-book-open {font-family:fontello;
               color:#CFB53B;
;
                font-size:3em;
                margin-right:10px;
                   clear:both;
                       float:left;}   

.icon-cog, .icon-phone, .icon-mail, .icon-facebook-official, .icon-linkedin {font-family:fontello;
               color:#CFB53B;
                font-size:2.5em;
                margin-right:10px;
                   clear:both;
                       float:left;}


.competenciasoculto h1, .experienciaoculto h1, .formacionoculto h1, .idiomasoculto h1, .portfoliooculto h1, .contactooculto{color:#000000; font-weight:500;text-align:center;
    
}

.competenciasoculto h3, .formacionoculto h3, .portfoliooculto h3, .idiomasoculto h3, .contactooculto h3 {font-size:1.4em;color:#000000;}



.competenciasoculto h4, .idiomasoculto h4, .formacionoculto h4, .experienciaoculto h4, .portfoliooculto h4, .contactooculto h4 {font-size:1.3em; color:#6501f6; font-weight: 500; text-align: left; }


.competenciasoculto p, .experienciaoculto p, .formacionoculto, .idiomasoculto p, .portfoliooculto p, .contactooculto p, .piedeimagen {color:#000000;
;font-size:1.6em;text-align:left; }







}

.trabajos{ 
	        width:100%;
			height:300px;
	position: relative;
	       
        	}

}

.portfolio{ width:100%;
			height:auto;
	        
            margin-left:0px;
    }
           
    
    .portfolio img{align-content: center;
	           width:100%;
	           height:auto;
	           
                  
}








@media only screen and (max-width:768px) and (min-width:300px){

.contenedor2 h1{ font-size:1.3em;text-align: center;} 
.contenedor{ overflow:hidden;
	       
	        width:10%;
			height:300px;
			min-width: 320px;
            padding: 10%;
			background-color:#CFB53B;
			border-radius:50%;
            margin-left:15%;
            margin-top:20%;
	        position:relative;
    
	
	
}
    
.contenedor1 {     width:100%;
                 height:auto;
	            float:left;
				height:auto;
                display: inline-block;
				
				
				
				margin-left:5%;
				margin-top:40px;
                margin-bottom:40px;
	           z-index:3000;
    background-color: rgb(0, 0, 0, 0.01); 
}	

    
    
    
    
    
    
    
.portfolio{ width:100%;
			height:auto;
	        
            margin-left:0px;
    }
           
    
    .portfolio img{align-content: center;
	           width:100%;
	           height:auto;
	           
                  
}
.contenedor h1 {text-align:center;
	              color:slategray;
	              margin-top:20%;
                    margin-left:10%;}
	              
.contenedor h3 {text-align:center;
	              color:white;
	              margin-top:50%;
                  margin-left:10%;}
	              
	
	
   

    .competenciasoculto, .experienciaoculto, .formacionoculto, .idiomasoculto, .portfoliooculto, .contactooculto {
    width: 95%;
    height: auto;
    margin: 3px;
	margin-left:2%;
    border:2px solid #CFB53B;
	display:none;
	float:left:0px;
	margin-top: 5%;
    z-index:2000;
    }
   
	

.contenedor2{   margin:0;
			    padding:5%;
	       		width:100%;
				height:auto;
				min-width: 320px;
				background-color: #CFB53B;
				border:2px solid #CFB53B;
				margin-left:0%;
				margin-top:15%;
	            text-align: right;47
		        z-index:-200;
	           
}

.contenedor2 h1{ font-size:1.3em;}



	
	
	
.texto{       
			   padding-top:20px;
			   padding-left:20px;
		       width:100%;
			   min-width:300px;
              
	           max-width:400px;
	           float:right;
	          
    }
    
    iframe{width:100%;
        height:180px;
    }
    
    .animacion{width:100%;
height:216px;}
    
      .animacion2{width:100%;
height:230px;}
    
}