/* 
Efecto Responsivo - @ecollantes
*/

/*Movil*/
@media only screen and (min-width : 280px) and (max-width : 480px) {
	.base{
		display: block;
	}
	.franja-movil{
		display: block;
	}
	.franja-movil .anclas{ 
		display: block;
	}
	.fijo-movil {
		background: #3C476E;
		position: fixed;
		width: 93%;
		margin-left: -6%;
		padding: 0 4%;
		z-index: 1;
	}
     header {
		background: #3C476E;
		background-size: auto;
		padding: 0 5%;
		min-width: 90%;
		min-height: 100vh;
		width: 90%;
		/* height: 100vh; */
		overflow: hidden;
	} 
	main section.estudio img.especial, header section img {
    	display: none;
	}
	header h1 {
		font-size: 8vw;
		font-style: normal;
		font-weight: bold;
		color: #fff;
	}
	header nav.anclas a, nav.anclas a {
		color: #fff;
		font-size: 5vw;
		font-weight: bold;
		line-height: 8vw;
		text-decoration: none;
		/* padding-right: 8%; */
		display: block;
		padding: 2% 0;
	}
	nav.anclas a.ancla {
    	padding: 2% 0;
	}
	header section.lateral {
		display: none;
	}
	header .menu-movil {
		display: inline-block;
		float: right;
		width: 15%;
		padding: 5% 0 0;
		margin-right: 0%;
	}
	header .menu-movil img{
		width: 100%;
	}
	nav.anclas a span{
		display: none;
	}
	nav.anclas hr{
		border: none;
		width: 112%;
		margin-left: -6%;
		display: block;
		height: 0.1vh;
		background: #fff;
	}
	header .logo {
		padding: 2% 0;
		width: 40%;
		display: inline-block;
	}
	header .logo img{
		width: 100%;
	}
	main section.secadero p {
		font-size: 5vw;
		font-style: italic;
		line-height: 30px;
		color: #3C476A;
		padding-bottom: 1%;
	}
	main section.estudio span{
		font-size: 1.4vw;
		font-weight: bold;
		text-align: right;
		display: block;
		color: #707070;
		padding: 0 5%;
	}
	main section.estudio p, main section.secadero.contacto p {
		font-size: 5vw;
		font-style: italic;
		line-height: 7.4vw;
		color: #3C476A;
		padding-bottom: 1%;
	}
	main section.secadero.contacto p{
		padding: 2% 5% 1% 4%;
	}
	main section.creativo p, main section.secadero.contacto h4, main section.secadero.contacto h4 a, main section.secadero.contacto a.movil {
		font-size: 5.2vw;
		font-style: italic;
		line-height: 10vw;
		color: #3C476A;
		padding-bottom: 1%;
	}
	main section.secadero.contacto h4, main section.secadero.contacto a.movil {
	    padding: 0 5% 1% 4%;
	}
	main section.secadero.contacto a.movil{
		display: block;
	}
	main section.secadero.contacto #mensaje form{
		display: none;
	}
	main section.secadero h3, main section.estudio h3, main section.creativo h3 {
		font-size: 10.9vw;
		font-weight: bold;
		line-height: 7vw;
		color: #3C476A;
		width: 60%;
		/* display: inline-block; */
		vertical-align: top;
		padding: 0.3% 5% 1.3%;
		text-align: center;
	}
	 main section.estudio h3, main section.secadero.contacto h3 {
		font-size: 6.9vw;
		font-weight: bold;
		line-height: 7vw;
		color: #3C476A;
		width: 109%;
		/* display: inline-block; */
		vertical-align: top;
		padding: 0 0 0;
		text-align: center;
		margin-left: -9%;
	}
	main section.secadero .columna, main section.estudio .columna, main section.estudio.creativo .columna, main section.secadero.proyecto .columna {
		width: 93%;
		float: none;
		padding: 5% 1% 0 5%;
	}
	main section.secadero img {
		float: none;
		display: block;
		width: 97%;
		/* position: relative; */
		z-index: 0;
	}
	main section.secadero {
		overflow: hidden;
		padding: 0 0 0 4%;
		background: #fff;
		height: 100vh;
	}
	main section.secadero .ancla img, main section.secadero span, main section.estudio span   {
		display: none;
	}
	main section.estudio .ancla img{
		display: none;
	}
	main section.secadero h2 {
		font-family: 'Mosk Bold 700 normal';
		font-size: 30vw;
		font-weight: bold;
		line-height: 15vW;
		color: rgba(60,71,106,38%);
		margin-left: -11vw;
		padding-bottom: 0;
	}
	main section.estudio h2 {
		font-family: 'Mosk Bold 700 normal';
		font-size: 35vw;
		font-weight: bold;
		line-height: 0;
		color: rgba(60,71,106,38%);
		margin-left: -11vw;
		padding-bottom: 5vw;
	}
	main .franja-movil {
		background: #3C476A;
		margin-left: -9%;
		width: 100%;
		padding-left: 9%;
	}
	main .franja-movil nav a.ancla{
		display: inline-block;
		vertical-align: top;
		padding: 0 0 2%;
		width: 32%;
	}
	main .franja-movil nav a.ancla img {
		display: block;
		margin-top: 0;
		margin-left: 0;
		width: 40%;
		margin: auto;
		margin-top: 2%;
	}
	main section.estudio {
		overflow: hidden;
		padding: 0 0 0 8%;
		background:#fff;
	}
	main section.estudio img {
		float: none;
		display: block;
		width: 109%;
		position: relative;
		margin-left: -9%;
	}
	main section.secadero.proyecto .logo img{
		display: none;
	}
	main section.secadero.proyecto h3 {
		font-size: 3.9vw;
		font-weight: bold;
		line-height: 4vw;
		color: #3C476A;
		width: 106%;
		display: inline-block;
		vertical-align: top;
		padding: 2% 0 3%  1%;
		border-left: none;
		margin-top: 0;
		margin-left: -6%;
		background: #afb3c2;
	}
	main section.secadero.proyecto h3 span{
		display: block;
		color: #afb3c2;
		border-bottom: 1px solid #fff;
    	margin-bottom: 2%;
	}
	main section.secadero.proyecto nav.anclas{
		display: none;
	}
	main section.secadero.proyecto .franja-movil nav.anclas{
		display: block;
	}
	main section.proyecto nav.anclas a {
		color: #fff;
	}
	main section.proyecto section.slider{
		display: none;
	}
	main section.contacto{
		height: auto;
	}
	footer .logo {
		display: inline-block;
		width: 50%;
	}
	footer .logo img {
		width: 100%;
	}
	footer .redes {
		color: #fff;
		font-size: 3em;
		display: inline-block;
		vertical-align: bottom;
		float: right;
		margin-top: 0;
		width: 41%;
	}
	footer .redes a {
		color: #fff;
		text-decoration: none;
		width: 31%;
	}
	footer .redes i {
		padding: 0 1px;
	}
}

/*Tablet*/
@media only screen and (min-width: 480px) and (max-width: 768px)  {
    .base{
		display: block;
	}
	.franja-movil{
		display: block;
	}
	.franja-movil .anclas{ 
		display: block;
	}
	.fijo-movil {
		background: #3C476E;
		position: fixed;
		width: 93%;
		margin-left: -6%;
		padding: 0 4%;
		z-index: 1;
	}
     header {
		background: #3C476E;
		background-size: auto;
		padding: 0 5%;
		min-width: 90%;
		min-height: 100vh;
		width: 90%;
		/* height: 100vh; */
		overflow: hidden;
	} 
	main section.estudio img.especial, header section img {
    	display: none;
	}
	header h1 {
		font-size: 8vw;
		font-style: normal;
		font-weight: bold;
		color: #fff;
	}
	header nav.anclas a, nav.anclas a {
		color: #fff;
		font-size: 5vw;
		font-weight: bold;
		line-height: 8vw;
		text-decoration: none;
		/* padding-right: 8%; */
		display: block;
		padding: 2% 0;
	}
	nav.anclas a.ancla {
    	padding: 2% 0;
	}
	header section.lateral {
		display: none;
	}
	header .menu-movil {
		display: inline-block;
		float: right;
		width: 15%;
		padding: 5% 0 0;
		margin-right: 0%;
	}
	header .menu-movil img{
		width: 100%;
	}
	nav.anclas a span{
		display: none;
	}
	nav.anclas hr{
		border: none;
		width: 112%;
		margin-left: -6%;
		display: block;
		height: 0.1vh;
		background: #fff;
	}
	header .logo {
		padding: 2% 0;
		width: 40%;
		display: inline-block;
	}
	header .logo img{
		width: 100%;
	}
	main section.secadero p {
		font-size: 5vw;
		font-style: italic;
		line-height: 30px;
		color: #3C476A;
		padding-bottom: 1%;
	}
	main section.estudio span{
		font-size: 1.4vw;
		font-weight: bold;
		text-align: right;
		display: block;
		color: #707070;
		padding: 0 5%;
	}
	main section.estudio p, main section.secadero.contacto p {
		font-size: 5vw;
		font-style: italic;
		line-height: 7.4vw;
		color: #3C476A;
		padding-bottom: 1%;
	}
	main section.secadero.contacto p{
		padding: 2% 5% 1% 4%;
	}
	main section.creativo p, main section.secadero.contacto h4, main section.secadero.contacto h4 a, main section.secadero.contacto a.movil {
		font-size: 5.2vw;
		font-style: italic;
		line-height: 10vw;
		color: #3C476A;
		padding-bottom: 1%;
	}
	main section.secadero.contacto h4, main section.secadero.contacto a.movil {
	    padding: 0 5% 1% 4%;
	}
	main section.secadero.contacto a.movil{
		display: block;
	}
	main section.secadero.contacto #mensaje form{
		display: none;
	}
	main section.secadero h3, main section.estudio h3, main section.creativo h3 {
		font-size: 10.9vw;
		font-weight: bold;
		line-height: 7vw;
		color: #3C476A;
		width: 60%;
		/* display: inline-block; */
		vertical-align: top;
		padding: 0.3% 5% 1.3%;
		text-align: center;
	}
	 main section.estudio h3, main section.secadero.contacto h3 {
		font-size: 6.9vw;
		font-weight: bold;
		line-height: 7vw;
		color: #3C476A;
		width: 109%;
		/* display: inline-block; */
		vertical-align: top;
		padding: 0 0 0;
		text-align: center;
		margin-left: -9%;
	}
	main section.secadero .columna, main section.estudio .columna, main section.estudio.creativo .columna, main section.secadero.proyecto .columna {
		width: 93%;
		float: none;
		padding: 5% 1% 0 5%;
	}
	main section.secadero img {
		float: none;
		display: block;
		width: 97%;
		/* position: relative; */
		z-index: 0;
	}
	main section.secadero {
		overflow: hidden;
		padding: 0 0 0 4%;
		background: #fff;
		height: 100vh;
	}
	main section.secadero .ancla img, main section.secadero span, main section.estudio span   {
		display: none;
	}
	main section.estudio .ancla img{
		display: none;
	}
	main section.secadero h2 {
		font-family: 'Mosk Bold 700 normal';
		font-size: 30vw;
		font-weight: bold;
		line-height: 15vW;
		color: rgba(60,71,106,38%);
		margin-left: -11vw;
		padding-bottom: 0;
	}
	main section.estudio h2 {
		font-family: 'Mosk Bold 700 normal';
		font-size: 35vw;
		font-weight: bold;
		line-height: 0;
		color: rgba(60,71,106,38%);
		margin-left: -11vw;
		padding-bottom: 5vw;
	}
	main .franja-movil {
		background: #3C476A;
		margin-left: -9%;
		width: 100%;
		padding-left: 9%;
	}
	main .franja-movil nav a.ancla{
		display: inline-block;
		vertical-align: top;
		padding: 0 0 2%;
		width: 32%;
	}
	main .franja-movil nav a.ancla img {
		display: block;
		margin-top: 0;
		margin-left: 0;
		width: 40%;
		margin: auto;
		margin-top: 2%;
	}
	main section.estudio {
		overflow: hidden;
		padding: 0 0 0 8%;
		background:#fff;
	}
	main section.estudio img {
		float: none;
		display: block;
		width: 109%;
		position: relative;
		margin-left: -9%;
	}
	main section.secadero.proyecto .logo img{
		display: none;
	}
	main section.secadero.proyecto h3 {
		font-size: 3.9vw;
		font-weight: bold;
		line-height: 4vw;
		color: #3C476A;
		width: 106%;
		display: inline-block;
		vertical-align: top;
		padding: 2% 0 3%  1%;
		border-left: none;
		margin-top: 0;
		margin-left: -6%;
		background: #afb3c2;
	}
	main section.secadero.proyecto h3 span{
		display: block;
		color: #afb3c2;
		border-bottom: 1px solid #fff;
    	margin-bottom: 2%;
	}
	main section.secadero.proyecto nav.anclas{
		display: none;
	}
	main section.secadero.proyecto .franja-movil nav.anclas{
		display: block;
	}
	main section.proyecto nav.anclas a {
		color: #fff;
	}
	main section.proyecto section.slider{
		display: none;
	}
	main section.contacto{
		height: auto;
	}
	footer .logo {
		display: inline-block;
		width: 50%;
	}
	footer .logo img {
		width: 100%;
	}
	footer .redes {
		color: #fff;
		font-size: 3em;
		display: inline-block;
		vertical-align: bottom;
		float: right;
		margin-top: 0;
		width: 41%;
	}
	footer .redes a {
		color: #fff;
		text-decoration: none;
		width: 31%;
	}
	footer .redes i {
		padding: 0 1px;
	}
}

/*Pantalla PC*/
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  	header {
		background: #3C476E;
		background-size: auto;
		padding: 0 2% 0 5%;
		min-width: 93%;
		min-height: 100vh;
		width: 93%;
		/* height: 100vh; */
		overflow: hidden;
	}
	header section.lateral a:first-child {
		top: 33.5%;
		right: 3%;
	}
    header section.lateral a {
		-webkit-transform: rotate(-90deg);
		transform: rotate(90deg);
		color: #fff;
		font-size: 13px;
		font-weight: bold;
		display: block;
		position: absolute;
		right: 2.85%;
		top: 50%;
		text-decoration: none;
		text-transform: uppercase;
	}
	header section.imagen {
		display: inline-block;
		float: right;
		margin-top: -7%;
	}
	main section.secadero {
		overflow: hidden;
		padding: 0 0 0 4%;
		background: url(../img/Linea-2.svg) 9% 85% no-repeat #fff;
		height: 100vh;
		background-size: auto 20%;
	}
	main section.secadero .ancla img {
		float: inherit;
		display: inline-block;
		width: auto;
		position: inherit;
		margin-top: 40%;
		margin-left: -20.5%;
		z-index: 9999;
	}
	main section.estudio img.especial {
		display: none;
	}
	main section.estudio .ancla img {
		float: left;
		display: inline-block;
		width: auto;
		position: inherit;
		margin-top: 10%;
		margin-left: -18.5%;
		z-index: 9999;
	}
	main section.estudio {
		overflow: hidden;
		padding: 0 0 0 8%;
		background: url(../img/Linea-2-2.svg) 9% 80% no-repeat #fff;
		background-size: auto 10%;
	}
	main section.creativo {
		overflow: hidden;
		padding: 0 0 0 8%;
		background: #fff;
	}
	main section.proyecto {
		overflow: hidden;
		padding: 0 0 0 2%;
		background: #fff;
		margin-top: 4%;
		height: auto;
	}
	main section.secadero.proyecto .slider img {
		overflow: hidden;
		float: inherit;
		width: 99%;
		position: inherit;
	}
	main section.contacto {
		overflow: hidden;
		padding: 0 0 0 8%;
		background: #fff;
		height: auto;
	}
}

/*Med Pantalla PC*/
@media only screen and (min-width: 1024px) and (max-width: 1300px) {
	header {
		background: #3C476E;
		background-size: auto;
		padding: 0 2% 0 5%;
		min-width: 93%;
		min-height: 100vh;
		width: 93%;
		/* height: 100vh; */
		overflow: hidden;
	}
	header section.lateral a:first-child {
		top: 33.5%;
		right: 3%;
	}
    header section.lateral a {
		-webkit-transform: rotate(-90deg);
		transform: rotate(90deg);
		color: #fff;
		font-size: 13px;
		font-weight: bold;
		display: block;
		position: absolute;
		right: 2.85%;
		top: 50%;
		text-decoration: none;
		text-transform: uppercase;
	}
	header section.imagen {
		display: inline-block;
		float: right;
		margin-top: -7%;
	}
	main section.secadero {
		overflow: hidden;
		padding: 0 0 0 4%;
		background: url(../img/Linea-2.svg) 9% 85% no-repeat #fff;
		height: 100vh;
		background-size: auto 20%;
	}
	main section.secadero .ancla img {
		float: inherit;
		display: inline-block;
		width: auto;
		position: inherit;
		margin-top: 40%;
		margin-left: -20.5%;
		z-index: 9999;
	}
	main section.estudio img.especial {
		display: none;
	}
	main section.estudio .ancla img {
		float: left;
		display: inline-block;
		width: auto;
		position: inherit;
		margin-top: 10%;
		margin-left: -18.5%;
		z-index: 9999;
	}
	main section.estudio {
		overflow: hidden;
		padding: 0 0 0 8%;
		background: url(../img/Linea-2-2.svg) 9% 80% no-repeat #fff;
		background-size: auto 10%;
	}
	main section.creativo {
		overflow: hidden;
		padding: 0 0 0 8%;
		background: #fff;
	}
	main section.proyecto {
		overflow: hidden;
		padding: 0 0 0 2%;
		background: #fff;
		margin-top: 4%;
		height: auto;
	}
	main section.secadero.proyecto .slider img {
		overflow: hidden;
		float: inherit;
		width: 99%;
		position: inherit;
	}
	main section.contacto {
		overflow: hidden;
		padding: 0 0 0 8%;
		background: #fff;
		height: auto;
	}
}
/*Max Pantalla PC*/
@media only screen and (min-width: 1300px) and (max-width: 1700px) {
	header {
		background:#3C476E;
		background-size: auto;
		padding: 0 2% 0 5%;
		min-width: 93%;
		min-height: 100vh;
		width: 93%;
		/* height: 100vh; */
		overflow: hidden;
	}
	header section.lateral a:first-child {
		top: 33.5%;
		right: 3%;
	}
    header section.lateral a {
		-webkit-transform: rotate(-90deg);
		transform: rotate(90deg);
		color: #fff;
		font-size: 13px;
		font-weight: bold;
		display: block;
		position: absolute;
		right: 2.85%;
		top: 50%;
		text-decoration: none;
		text-transform: uppercase;
	}
	header section.imagen {
		display: inline-block;
		float: right;
		margin-top: -7%;
	}
	main section.secadero {
		overflow: hidden;
		padding: 0 0 0 4%;
		background: url(../img/Linea-2.svg) 9% 85% no-repeat #fff;
		height: 100vh;
		background-size: auto 20%;
	}
	main section.secadero .ancla img {
		float: inherit;
		display: inline-block;
		width: auto;
		position: inherit;
		margin-top: 40%;
		margin-left: -20.5%;
		z-index: 9999;
	}
	main section.estudio img.especial {
		display: none;
	}
	main section.estudio .ancla img {
		float: left;
		display: inline-block;
		width: auto;
		position: inherit;
		margin-top: 10%;
		margin-left: -18.5%;
		z-index: 9999;
	}
	main section.estudio {
		overflow: hidden;
		padding: 0 0 0 8%;
		background: url(../img/Linea-2-2.svg) 9% 80% no-repeat #fff;
		background-size: auto 10%;
	}
	main section.creativo {
		overflow: hidden;
		padding: 0 0 0 8%;
		background: #fff;
	}
	main section.proyecto {
		overflow: hidden;
		padding: 0 0 0 2%;
		background: #fff;
		margin-top: 4%;
		height: auto;
	}
	main section.secadero.proyecto .slider img {
		overflow: hidden;
		float: inherit;
		width: 99%;
		position: inherit;
	}
	main section.contacto {
		overflow: hidden;
		padding: 0 0 0 8%;
		background: #fff;
		height: auto;
	}
}
	