*{
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}
body{
	/*background: #DDEEFF;*/
	background: #F2F3F4;
	background: url("../img/fondo44.png") repeat center top;
	
	margin: 0 !important;
	padding: 0 !important;	
	/*background-attachment:fixed;*/
			
}

body::-webkit-scrollbar {
    width: 10px;
}

body::-webkit-scrollbar-thumb {
    background: #1B7FFF;
    border-radius: 10px;/**/
}
body::-webkit-scrollbar-track {
    background: #BBBBBB;
    border-left: 1px solid #f2f3f4;
    border-right: 1px solid #f2f3f4;

}

header{
	background: #F2F3F4;
	padding: 20px;

}
nav{
	background: #1B7FFF;
	padding: 14px;
	font-family: calibri;
}
nav ul li{
	list-style: none;
	padding: 6px;
	display: inline-block;
	margin: auto;
	border: 2px solid #1B7FFF;
	margin:0px 30px;
}
nav ul li:hover{
	border-bottom: 2px solid white;

}
nav ul li a{
	text-decoration: none;
	font-size: 18px;
	color: #F2F2F2;

}
nav ul li a:HOVER{
	text-decoration: none;
	font-size: 18px;
	color: #D2D2D2;
}
section{
	/*background: #4fd5f4;
	background: #9D86FD;
	background: #6B9F1B;*/
	background: #BBBBBB;
	/*padding: 10px;*/
}
.fechaseccion{
	padding: 10px;
}
section p{
	color: #f2f2f2;
}

/*Temporal*/

header div {
	
	width:49%;
	display: inline-block;
	vertical-align: middle;
	align-items: center;
	align-content: center;

}
header div ul {
	float: right;
	
}
header div ul li{

	list-style: none;
	padding: 6px;
		margin: auto;
	float: right;
	border: 2px solid #F2F3F4;
}
header div ul li:hover{
	border-bottom: 2px solid #1B7FFF;
}
header div ul li:active{
	border-bottom: 2px solid red;
}
header div ul li a{

	text-decoration: none;
	font-size: 18px;
	color: white;
}

.animaci{
			
			position: relative;
			display: inline-block;
			align-items: center;
			align-content: center;
			top: -20px;
			left: 5px;
			margin-top: -50px;
		
		}

@keyframes cambiar{
    0%{margin-left:0px;opacity: 0.5; }
	100%{margin-left:100px; }
	
}
h2{
	color: #1B7FFF;
	text-align: center;
	margin-bottom: 15px;
	/*text-decoration: #bbbbbb wavy underline;*/
	text-shadow: 5px 5px 2px #fff;
	padding: 10px 0px;
	font-family: calibri;
	   /*text-shadow: -2px 0px 1px #F2F3F4;*/
}
h3{
	font-family: calibri;

}
h4{
	font-family: calibri;

}
/*contenido*/
.content{
	margin-left: 200px;
	margin-right: 200px;
	padding-top: 40px;
}
.card{
	margin: 10px 0px;
	background: white;
	border-radius: 5px;
	padding: 20px;
	line-height: 35px;
	font-family: calibri;

}
.card div{
	/*background: #1B7FFF;*/
	
	display: inline-block;
	overflow: hidden;
	vertical-align: middle;
	align-items: center;
	align-content: center;
}
.card1 img,.card1 span{
	height: 18px;
	vertical-align: middle;
	align-items: center;
	align-content: center;
}

.card img{
	padding: 1px;
}
.card-blank{
	margin: 10px 0px;
	background: white;
	border-radius: 5px;
	padding: 20px;
	line-height: 35px;
	font-family: calibri;

}
.card-blank div{
	width: 180px;
	display: inline-block;
}


.dip img{
	border: 2px solid #BBBBBB;
}
/*educacion*/

.educacion > center > div{
	width: 250px;
	height: 310px;
	background: red;
	margin: 10px;
	padding: 10px;
	border-style: solid;
    border-width: 0 0 10px;
    box-shadow: 0 3px 10px #b1b1b1;
    background: #f6f6f6;
    border-width: 4px 4px 0;
    border-style: solid;
    border-radius: 10px;
    border-color: #f2f3f4;



	box-sizing: border-box;


}
.educacion {
	
}
/*perfil*/

#perfil {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  line-height: 40px;
  font-family: calibri;
}
#perfil b{
	margin-top: 10px;
}
#perfil > div {
  width: 50%;
  background: #1B7FFF;
  padding: 30px;
	box-sizing: border-box;
	
	box-sizing: border-box;
	text-align: center;
}
#perfil img{
	/*box-shadow: 2px 5px 10px #F2F3F4;*/
	opacity: .9;
	cursor: pointer;
}

.fperfil{
	/*border-bottom: 2px solid white;
	border-right: 2px solid white;
	border-top: 2px solid white;
    background: url("../img/fondo6.jpeg") no-repeat !important;
	*/
	
	background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url("../img/fondo6.jpeg") no-repeat !important;


}
.fperfil img{
	 
}
.infoP{
	margin-top: -15px;
}
.greyc{
	background: white !important;
	/* background: linear-gradient(90deg, #FFFFFF, #1B7FFF)  !important;*/
	padding-top: 0px !important;

}
.greyc{
	/*
	border-bottom: 2px solid white;
	border-left: 2px solid white;
	border-top: 2px solid white;
	*/

}

.tgrado{

	
	height: 18px;
	vertical-align: middle;
	align-items: center;
	align-content: center;
}

.aptitudes img{
	width: 92%;
	height: 50%;
}
.aptitudes div{
	width: 200px;
	height: 200px;
	border: 1px solid grey;
	padding: 10px;
	margin: 10px;
	line-height: 20px;
	box-sizing: border-box;

	    margin: 10px;
    padding: 10px;
    border-style: solid;
    border-width: 0 0 10px;
    box-shadow: 0 3px 10px #b1b1b1;
    background: #f6f6f6;
    border-width: 4px 4px 0;
    border-style: solid;
    border-radius: 10px;
    border-color: #f2f3f4;
    box-sizing: border-box;
}
.showmenu{
    	display: none;
    }

    /*FOOTER*/
footer{
	margin-top: 60px;
	
	font-family: "calibri";

}
.footerp p{
	/*background: #F2F3F4;*/
	background: #1B7FFF;
	padding: 10px;
	color: #f2f2f2;
}
.footerContent{
	background: #F2F3F4;
	
	
}
.footerContent h2{
	text-align: center;
}

.footerContent div{
	display: inline-flex;
	/*background: red;*/
	padding: 20PX 10px;
	width: 30%;
}
.footerContent div ul{
	display: block;
	/*background: yellow;*/
	width: 100%;
}
.footerContent div ul h2{
	font-size: 20px;
}

.footerContent div li{
	list-style: none;
	line-height: 35px;
}


.divcontactanos li{
	position: relative;
}
.divcontactanos li span{
    visibility: hidden;
	background:  #1B7FFF;
	color: white;
	padding: 2px 10px;
	border-bottom-right-radius: 10px;
	border-top-right-radius: 10px;
	border-top-left-radius: 10px;
	position: absolute;
	top: -24px;
	
}
.diplomas {
	box-sizing: border-box;
}
.diplomas img{
   
    border: 2px solid #d3d3d3;
    box-sizing: border-box;
    margin: 5px 10px;
    box-sizing: border-box;
    cursor: pointer;
    /*background: url("../img/fondo1.png") repeat center top;*/
        margin: 10px;
    padding: 5px;
    border-style: solid;
    border-width: 0 0 10px;
    box-shadow: 0 3px 10px #b1b1b1;
    background: #f6f6f6;
    border-width: 4px 4px 0;
    border-style: solid;
    border-radius: 10px;
    border-color: #f2f3f4;
    box-sizing: border-box;

}

/*Div cruz perfil*/
.divcruz{
	background: #1b7fff;
	background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url("../img/temp/fondo (1).jpeg") ;
	border-radius: 5px;
     transition-property: all;
  transition-duration: 0.8s;
  transition-timing-function: ease-in;
	padding: 20px;
	margin-top: 10px;
}

.divcruz > div{
	width: 45% ;
	display: inline-flex;
	border-radius: 25px;

	height: 240px;
	padding: 10px;
	box-sizing: border-box;

}
.divcruz > div >div{
	/*background: #1b7fff;*/
	background: rgba(255, 255, 255, .8);
	/*display: flex;*/
	align-items: center;
	width: 100%;
	
}
.divcruz > div >div p{
	line-height: 20px;
}
/*MODALES*/

.modal{
	width: 100%;
	height: 100vh;
	background: rgba(27, 127, 255,1.0);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 101;
	padding: 50px;
	display: none;
	
}
.modal div{
	/*background: red;
	background: url("../img/fondo4.png");*/
	padding: 20px;
	height: 85vh;
	overflow: hidden;
}
.modal div img{
	
	height: 100%;
	    padding: 10px;
    border-style: solid;
    border-width: 0 0 10px;
    box-shadow: 0 3px 10px #d3d3d3;
    background: #f6f6f6;
    border-width: 4px 4px 0;
    border-style: solid;
    border-radius: 10px;
    border-color: #f2f3f4;
    box-sizing: border-box;
}
.btnClose{
	position: absolute;
	top: 10px;
	right: 10px;
	border-radius: 50px;
	border: 2px solid #f2f3f4;	
	padding: 7px;
	background: #D60404;
}
.btn-close{
	display: none;
}
.btnClose:hover{
	background: #073699;
	cursor: pointer;
}

/*objetivos*/
.objetivos1{
	width: 100%;
	background: white;
	border-radius: 5px;
}
.objetivos1 > div{
	min-height: 310px;
	display: inline-flex;
	width: 45%;
	background: #f2f3f4;
	border-radius: 25px;
    margin: 10px;
    box-sizing: border-box;
   
}
.objetivos1 > div > div{	
	background: #1b7fff;
	
	
	margin: 0px;

    background: red;
    margin: 10px;
    padding: 10px;
    border-style: solid;
    border-width: 0 0 10px;
    box-shadow: 0 3px 10px #b1b1b1;
    background: #f6f6f6;
    border-width: 4px 4px 0;
    border-style: solid;
    border-radius: 10px;
    border-color: #f2f3f4;
    box-sizing: border-box;

}
.objetivos1 > div > div p, .objetivos1 > div > div h3{
	opacity: 1;
}

/*hshsgs*/
.card1{
	position: relative;
	/*padding-right: 180px;*/
}
.card1 > center >img{
	
	width: 200px;
	height:150px;
	position: absolute;
	top: 20px;
	right: 20px;
	padding: 20px;
	box-sizing: border-box;
	cursor: pointer;
	
	margin: auto;
}

#fecha a{
	color: yellow;
	  animation: hola 10s infinite linear;
}
@keyframes hola{
  20%{
  	color: red;
  }
  50%{
  	color: green;
  }
  70%{
  	color: pink;
  }
  90%{
  	color: skyblue;
  }
}

.cardv2{
    	background: none;
    }

/*MOVILES*/

@media screen and (max-width: 900px){
	
	.card1{
		padding-right: 10px;
	}
	.card1 > center > img{
		position: relative;
		width: 98%;
	    height:auto;
	    top: 0px; 
        right: 0px;
        padding: 2px 5px;
        padding-top: 10PX;
	}
	.aptitudes img{
		height: 80%;
	}
	.aptitudes div{
	    width: 100%;
	    height: 300px;
	    box-sizing: border-box;
	    margin: 10px 0px;
    }
	.content{
	    margin-left: 10px;
	    margin-right: 10px;
	    padding-top: 40px;

    }
    header {
    	    box-shadow: 0 8px 10px #ccc;
    }
    header li,.animaci{
    	display: none;
    }
    .card-blank div {
    width: 100px;
    
    }
    .showmenu{
    	display: block;
    	border: none;cursor: pointer;
    	/*margin-right: 15px;*/


    }

    .showNav{
    	display: block;

    }

    
    .hideNav{
    	display: none;
    }
    .logi{
    	width: 70px;
    	box-shadow: 0px 0px 5px black;
    	box-sizing: border-box;

    }
    nav ul li{
	
	display: block;
	border: none;
	    
	
    }
    nav ul li:hover{
    	border: none;

    }
    header{
    	position: fixed;
    	width: 100%;
    	top: 0;
    	background: #1B7FFF;
    	padding: 10px;
    	z-index: 100;
    }
    nav ul li a{
    	color: grey;
    	text-transform: uppercase;
        font-weight: bold;
    }
    nav{
    	
    	background:  #040E1B;
    	height: 100vh;
    	width: 100%;
    	position: fixed;
    	top: 61px;
    	line-height: 50px;
    	z-index: 100;
    }
    h2{
    	text-align: center;
    	background: white;
    	border-radius: 5px;
    	box-sizing: border-box;
    }
    #perfil{
    	margin-top: 10px;
    	box-sizing: border-box;
    }
    iframe{
    	margin-top: 10px;
    	box-sizing: border-box;
    }

    #perfil > div {
      width: 100%;
    }
    #perfil img{
    	box-shadow: 0px 40px 30px black;
    }

    header div ul li:hover{
    	background: #2C7FFF;
    }
    .diplomas img{
    	width: 92%;
    	border: 1px solid grey;

    }
    .fechaseccion{
    	margin-top: 60px;
    }
    .content{
    	padding-top: 20px;
    }

    /*footer*/

    .footerContent div{
    	width: 100%;
    	border-bottom: 1px solid grey;
    	box-sizing: border-box;
    }
    
    .footerp p{
    	font-size: 14px;
    }
    main h2{
    	font-size: 20px;
    }
    section p {
    font-size: 15px;
}
    /*Animacion soy un profesional con*/
    .divcruz > div{
    	width: 100%;
    	height: 265px;
    }.divcruz{
    	    padding-top: 0px;
    }

    /*moviles objetivos*/
    .objetivos1 {
    	margin-top: 10px;    	
    }
    .objetivos1 > div{
    	width: 90%;
    	margin-top: 10px;}
    
    
}
@media screen and (max-width: 470px){
	
	/*moviles modal*/
	.modal{
    	padding: 0px;
    }
    .modal div img{
    	height: auto;
    	width: 100%;
    	padding: 8px;
    }

}