/* ---------------------------------------- */
/* ----- >>> Layout: Tablet --------------- */
/* ---------------------------------------- */

@media (max-width: 1024px) and (min-width: 800px) {

}
@media (max-width: 800px) and (min-width: 640px) {

}

/* ---------------------------------------- */
/* ----- >>> Layout: Mobile --------------- */
/* ---------------------------------------- */

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

	.setWrapper {
		width:-webkit-calc(100% - 32px);
		   width:-moz-calc(100% - 32px);
			 width:-o-calc(100% - 32px);
				width:calc(100% - 32px);
	}

	.setWrapper.setFLL {
		width: 100%;
	}


/* ---------------------------------------- */
/* ----- >>> Styles ----------------------- */
/* ---------------------------------------- */

	h1{ font-size: 32px; }
	h2{ font-size: 24px; }
	h3{ font-size: 16px; max-width: 80%;}
	p { font-size: 13px; letter-spacing: 0.025em; }

/* ---------------------------------------- */
/* ----- >>> Navegation ------------------- */
/* ---------------------------------------- */

	header .setBND{
		width: 160px;
		height: 32px;
		margin: 16px;
	}

	nav li {
		margin: 36px 0;
	}

	nav li a {
		font-size: 16px;
	}
	
	footer ul,
	footer small {
		margin: 16px 0 0 0;
	}

	footer ul {
		float: left;
		margin-bottom: 16px;
	}

	footer ul > li {
		margin-left: 0;
	}

	footer ul > li:nth-child(1),
	footer ul > li:nth-child(3) {
		width: 25%;
	}

	footer ul > li:nth-child(2),
	footer ul > li:nth-child(4) {
		width: 75%;
	}


/* ---------------------------------------- */
/* ----- >>> Section: Home ---------------- */
/* ---------------------------------------- */

	.setSlide .setItem > p {
		letter-spacing: 0.1em;
		font-size: 32px;
	}

/* ---------------------------------------- */
/* ----- >>> Section: Quienes Somos ------- */
/* ---------------------------------------- */

	article {
		margin: 96px auto 48px auto;
	}

	.setColumns > div .setMRG > p {
		max-width: 100%;
		letter-spacing: 0.025em;
		margin: 0 0 6px 0;
		font-size: 12px;
	}

	.setColumns > div .setMRG > p:first-of-type {
		margin: 24px 0 48px 0;
	}

	.setColumns > div .setMRG > p > em {
		font-size: 24px;
	}

	.setColumns .setMask.setSML {
		width: 100%;
		margin: 0;
	}

/* ---------------------------------------- */
/* ----- >>> Section: Proyectos ----------- */
/* ---------------------------------------- */

	.setHDG {
		margin: 128px auto 64px auto;
		text-align: center;
		font-size: 21px;
	}

	.setFLL .setHDG {
		margin-bottom: 24px;
	}

	.setHDG > span {
		display: none;
	}


	main  { 
		width:-webkit-calc(100% - 32px);
		   width:-moz-calc(100% - 32px);
			 width:-o-calc(100% - 32px);
				width:calc(100% - 32px);
		margin: 0  16px;
	}
	aside { width: 100%; margin-bottom: 0;}

	.setTitle.isMb { display: block; }
	.setTitle.isDk { display: none;  }

	.setDetails {
		padding-bottom: 18px;
		margin: 32px auto;
	}

	.setDetails ul {
		width: 100%;
		margin: 0 0 18px 0;
		overflow: hidden;
		border: none;
		padding: 0;
	}

	.setDetails p > span {
		width: auto;
		display: inline-block;
		font-size: 16px;
	}

	.setDetails ul > li { 
		border-bottom: 1px solid rgba(0,0,0,0.25);
	}

	.setDetails ul > li:nth-child(1),
	.setDetails ul > li:nth-child(2),
	.setDetails ul > li:nth-child(3),
	.setDetails ul > li:nth-child(4) { width: 100%; }

	.setDetails ul > li > p > span {
		width: 40%;
	}

	.setDetails p,
	.setDetails p > span {
		font-size: 13px;
		margin: 6px auto;
	}

	.setDetails p > span {
		color: #333333;
	}

	.setGallery > li {
		margin-bottom: 16px;
	}

	aside > dl {
		width: 100%;
		position: relative;
		padding-top: 54px;
	}

	aside > dl > dt {
		width:-webkit-calc(50% - 16px);
		   width:-moz-calc(50% - 16px);
			 width:-o-calc(50% - 16px);
				width:calc(50% - 16px);
		text-decoration: none;
		position: absolute;
		font-size: 21px;
		color: #C6C6C5;
		float: left;
		top: 0;
	}

	aside > dl > dt:first-child {
		background: url(../assets/SVG/IMG_DPD.svg) no-repeat center right 24px / 12px 12px;
		text-decoration: underline;
		text-align: left;
		color: #3C3C3B;
		left: 16px;
	}

	aside > dl > dt.isOpen {
		background-image: url(../assets/SVG/IMG_CRS.svg);
	}

	aside dt:last-child {
		right: 0;
	}

	aside > dl > dd {
		width: 100%;
		margin: 0 0 32px 0;
		background: #F5F5F5;
		display: none;
		float: left;
	}

	aside dd li {
		border-bottom: 1px solid rgba(177,177,177,0.5);
		text-align: center;
	}

	aside > dl > dd > ul > li.isCurrent {
		background: #D9D9D9;
		padding: 0;
		margin: 0;
	}

	.setTitle > p > em {
		line-height: 1.1em;
	} 


/* ---------------------------------------- */
/* ----- >>> Section: Servicios ----------- */
/* ---------------------------------------- */

	.setClients,
	.setServices {
		width: 100%;
		margin: 32px auto;
		overflow: hidden;
	}

	.setColumns > div:first-child .setServices { margin-bottom: 0; }
	.setColumns > div:last-child  .setServices { margin-top: 0; }

	.setServices > li {
		margin: 6px auto;
		font-size: 18px;
	}

	.setClients > li {
		width: 50%;
	}

/* ---------------------------------------- */
/* ----- >>> Section: Contacto ------------ */
/* ---------------------------------------- */

	.setInfo > ul > li {
		margin: 32px auto;
	}

	.setInfo > ul > li:before {
		bottom: -24px;
	}

/* ---------------------------------------- */
/* ----- >>> General ---------------------- */
/* ---------------------------------------- */

	.setColumns {
		display: block;
	}

	.setColumns > div,
	.setColumns .setMask {
		width: 100%;
	}

	.setColumns .setMask {
		width: 100%;
		margin: 0;
	}

	.setColumns > div .setIMG {
		padding-bottom: 80%;
	}

	.setColumns .setMRG {
		width: 100%;
	}


/* ---------------------------------------- */
/* ----- >>> Menu Animation --------------- */
/* ---------------------------------------- */

	.setMenu {
		right: 16px;
		top: 24px;
	}

}

@media (max-width: 320px) and (min-width: 0) {

	aside > dl > dt:first-child {
		background-position: center right 0px;
	}

}