/* General */
body {font-family: 'Montserrat', sans-serif; background: #fdfdfd;}
.container {width: 95%; margin: 0 auto;}
img {max-width: 100%; height: auto;}
section {padding: 100px 0 0;}

/* Header*/
header {background: #fff;}
.logo img {width:50%;height:auto;}

/* Nav */
.flex-nav {display: flex; justify-content: space-between;align-items: center}
.menu {padding: 10px 0;}
.menu a {text-decoration: none; font-size: 11px; text-transform: uppercase; color: #696969;letter-spacing: 3px;border-radius: 20px;}
.menu a:hover {color: #666;}
.menu ul {text-align: center;}
.menu li {display: inline-block; padding: 0px 10px;}

/* Banner */
.flex-banner {display: flex; justify-content:center;align-items: center;}
.banner {text-align: center; position: relative;}
.portada {background: url(../images/img-portada.png) no-repeat; height: 750px; width: 100%;margin: 0px auto; background-size: cover;}
.portada img {width:60%;height:auto;}
.portada h1 {color: #fff; font-weight: 400; text-transform: uppercase; font-size: 20px; letter-spacing: 4px; padding: 10px 0 0 0;}

/* About me */
.flex-about {display: flex; flex-direction: row;}
.about-me {padding: 0px;}
.profile {width: 45%; background: url(../images/img_about.jpg) no-repeat; height:auto;margin: 0px auto;background-size: cover;}
.about {background:#f4f4f4;padding: 90px 0 60px 100px; width: 60%; box-sizing: border-box; text-align: left;}
.about-title h4 {margin: 0; padding: 22px 25px 24px 25px; font-weight: 300; font-size: 26px; color: #4b4e53; border-left: #4b4e53 2px solid;}
.about h5 {font-size: 23px;line-height: 45px;margin: 40px 0 15px 0;font-weight: 300; color: #4b4e53;text-transform: uppercase;}
.content-about p {font-size: 14px; color: #666; width: 85%;line-height: 30px;margin-bottom: 60px;}
.bold {font-weight: 600;}
.about-cv {position: relative;padding-left: 65px;}
.about-icon {position: absolute; top: 5px;left: 0;color: #4b4e53;font-size: 35px;padding: 0 0px 0 15px;}
.about-link {padding: 18px 0px 18px 27px;border-left: 1px solid #7e8082;}
.about-link a {text-decoration: none; font-size: 15px;color: #4b4e53;}

/* Servicios */
.flex-service {display: flex; justify-content: space-between;}
.service-a {width: 40%;box-sizing: border-box;padding-left: 90px;}
.service-b {width: 60%;box-sizing: border-box;}
.service-section {padding: 120px 0 100px 0;}
.flex-service-b {display: flex; flex-direction: row;}
.items {margin-top: 0px;}
.items ul {display: flex; justify-content: space-between; flex-wrap: wrap; width: 90%; }
.items li {display: flex; justify-content: space-between; width: 48%;padding-bottom: 50px;}
.items h5 {text-transform: uppercase;color: #4b4e53; font-weight: 700;font-size: 18px;}
.items p {font-size: 14px; color: #666;line-height: 25px;}
.box-i i {width: 90px; height: 90px; color: #4b4e53; text-align: center; margin-right:20px; font-size: 50px;}

/* Parallax */
.parlx-section {padding: 0px;}

/* Trabajos */
.trabajo-a {width: 40%;box-sizing: border-box;padding-left: 96px;}
.trabajo-section {padding: 100px 0 40px 0;}

/* Contacto */
.flex-contact {display: flex; justify-content: space-between;}
.contacto-a {width: 40%;box-sizing: border-box;padding-left: 90px;}
.contacto-b {width: 60%;box-sizing: border-box;}
.contacto-section {padding: 100px 0 30px 0;}
.contacto-link {padding: 18px 0px 18px 27px;border-left: 1px solid #c1c1c1;}
.items-c {margin-top: 0px;}
.items-c ul {display: flex; justify-content: space-between; flex-wrap: wrap; width: 90%; }
.items-c li {display: flex; justify-content: flex-start; width: 48%;padding-bottom: 50px;}
.items-c h5 {text-transform: uppercase;color: #4b4e53; font-weight: 700;font-size: 15px;}
.items-c p {font-size: 14px; color: #666;line-height: 25px;}
.box-i-c i {width: 70px; height: 70px; color: #4b4e53; text-align: center; margin-right:15px; font-size: 25px; line-height: 70px;}

/* footer */
footer {background: #222222; padding: 50px 0px; text-align:center;}
footer p, footer a {color: #a4a4a4; text-transform: uppercase; font-size: 12px; letter-spacing: 1px;}
footer a {text-decoration: none;}
footer a:hover {color: #fff;}

@media screen and (max-width: 960px) {

	/* Banner */
	.portada {height: 550px;}
	.portada img {width:55%;height:auto;}
	.portada h1 {font-size: 18px;}
	/* About me */
	.flex-about {display: flex; flex-direction: column; }
	.profile {position: relative; height: 550px; width: 100%}
	.about {padding: 90px; width: 100%;}
	.about-icon {padding: 0 0px;}
	.about-cv {padding-left: 60px;}
	.content-about p {text-align:justify;width: 100%;}
	/* Servicios */
	.flex-service {display: flex; flex-direction: column; }
	.service-a {padding-left: 66px;}
	.service-b {padding: 60px 0px 60px 60px; width: 100%;}
	.service-section {padding: 100px 0 0 0;}
	/* Trabajo */
	.trabajo-a {padding-left: 66px;}
	/* Contacto */
	.flex-contact {display: flex; flex-direction: column;}
	.contacto-b {padding: 60px 40px 40px 70px; width: 100%;box-sizing: border-box;}
	.contacto-section {padding: 100px 0 0 ;}
	.contacto-link {padding: 18px 0px 18px 30px;}
	.items-c ul {width: 100%;}
	.box-i-c i {margin-right: 10px;}
	
	}

@media screen and (max-width: 640px){

	section {padding: 75px 0 0;}
	/* menu */
	.flex-nav {display: block;}
	.menu li {padding: 0px 10px 5px 0px;}
	/* Banner */
	.profile {height: 450px;}
	.portada img {width:50%;height:auto;}
	.portada h1 { font-size: 13px;}
	/* About me */
	.about {padding: 70px 40px; width: 100%;}
	.about-title h4 {font-size: 24px;}
	.about h5 {font-size: 21px;}
	/* Servicios */
	.service-a {padding-left: 40px;}
	.service-b {padding: 60px 0px 60px 50px;}
	.items h5 {padding-bottom: 7px;}
	.items li {width: 100%;}
	/* Trabajo */
	.trabajo-a {padding-left: 44px;}
	/* Contacto */ 
	.contacto-a {padding-left: 70px;}
	.contacto-b {padding: 60px 33px 40px 33px; }
	.items-c li {padding-bottom: 30px; width: 100%;}
	/* Footer */
	footer {padding: 50px 30px;}

	}

	@media screen and (max-width: 480px) {
	/*Servicios*/
	.service-b {padding: 60px 33px 60px 33px;}
	.items h5 {padding-bottom: 7px;}
	/*Trabajo*/
	.trabajo-a {padding-left: 25px;}
	/*Contacto*/
	.contacto-a {padding-left: 50px;}
	}