/******************** Universal Styles ***********************/

body{
	background: #a3d2ca;
	margin: 0;
	text-align: center;
}

h1, h2, h3, footer {
	font-family: 'Bitter', serif;
}


/******************** header Styles ***********************/

.header {
	background: #f8f1f1;
	box-shadow: 0px 9px 13px 5px;

}

.profile-img{
	display: block;
	margin: 20px auto;
}

#data {

	font-family: 'Sriracha', cursive;
}

.menu-img {

	width: 90%;
	margin: 0;
	padding: 0;
	
}

.navbar-dark .navbar-nav .nav-link:hover {
	color: #ffc107;
}

/******************** Main Section Styles ***********************/

.main{
	padding: 3.75rem 0 3.75rem 0;
	color: #444444;
	font-family: 'Poppins', sans-serif;
	font-size:1.2rem;
	line-height: 1.5rem;
	text-align: justify;
}



/******************** footer Styles ***********************/
footer {

	padding: 6px 0px 6px 0px;
	background: #d54f;
	color: #ffff;
	text-decoration: right;
	text-align: center;
	
}

/******************** Horizontal Rule Styles ***********************/
.horizontal{
	border: 5px dotted #314e52;
	border-bottom: none;
	background-color: rgba(255, 255, 255, 0.01);
	opacity: 1;
	width: 20%;
	margin: 20px auto 40px auto;
}

/******************** Contact Page Styles *******************************/


.form {
	width: 80%;
	height: 33.25rem;
	border: 2px solid black;
	padding: 50px 10px 40px 10px;
	border-radius: 10px;
	background: #008B8B;
	display:block;
  	margin-left: auto;
  	margin-right: auto;
}

.form #name{
	width: 80%;
	float: right;
}

.form #last_name, #email, #subject{
	width: 80%;
	float: right;
}

#contact-page .form #subject{

	margin-bottom: 20px;

}

#contact-page .form #submit{

	
  	background: #3D94F6;
   	background-image: -webkit-linear-gradient(top, #3D94F6, #1E62D0);
   	background-image: -moz-linear-gradient(top, #3D94F6, #1E62D0);
   	background-image: -ms-linear-gradient(top, #3D94F6, #1E62D0);
   	background-image: -o-linear-gradient(top, #3D94F6, #1E62D0);
   	background-image: -webkit-gradient(to bottom, #3D94F6, #1E62D0);
   	-webkit-border-radius: 20px;
   	-moz-border-radius: 20px;
   	border-radius: 20px;
   	color: #FFFFFF;
   	font-family: 'Poppins', sans-serif;
   	font-size: 20px;
   	font-weight: 100;
   	padding: 11px;
   	-webkit-box-shadow: 1px 1px 20px 0 #000000;
   	-moz-box-shadow: 1px 1px 20px 0 #000000;
   	box-shadow: 1px 1px 20px 0 #000000;
   	text-shadow: 1px 1px 20px #000000;
   	border: solid #337FED 1px;
   	text-decoration: none;
   	display: block;
   	cursor: pointer;
   	text-align: center;
   	margin-left: auto;
  	margin-right: auto;

}

#contact-page .form #submit:hover {
	border: solid #337FED 1px;
   	background: #1E62D0;
   	background-image: -webkit-linear-gradient(top, #1E62D0, #3D94F6);
   	background-image: -moz-linear-gradient(top, #1E62D0, #3D94F6);
   	background-image: -ms-linear-gradient(top, #1E62D0, #3D94F6);
   	background-image: -o-linear-gradient(top, #1E62D0, #3D94F6);
   	background-image: -webkit-gradient(to bottom, #1E62D0, #3D94F6);
   	-webkit-border-radius: 20px;
   	-moz-border-radius: 20px;
   	border-radius: 20px;
   	text-decoration: none;

}

#contact-page .form #message{

	margin: 20px 0px 0px 0px;
	border-radius: 5px;
	background: #F8F8FF;
	width: 100%;
	border: 1px solid black;

}

#contact-page .form input{

	border-radius: 5px;
}

/******************** Experience Page Styles *******************************/

.tabla { 

	box-shadow: 3px 3px white, -1em 0 0.4em #0f1123;
	border-radius: 10px;
	background: white;

 }

/******************** media Styles *******************************/

@media (min-width: 554px) and (max-width: 767px)
{

	

	
}

@media (max-width: 553px)
{

	p { 
		font-size: 12px;
	 }

	 h1 {
	 	font-size: 16px;
	 }

	 h2 {

	 	font-size: 14px;
	 	font-weight: bold;
	 	margin: 15px 0 15px; 0; 
	 }

	 h3 {
	 	font-size: 13px;

	 }

	 #logo-img{

		width: 50%;
	}

	.navbar-toggler {

	display:block;
	margin: auto;
}
}