/*CONTENIDO WEB*/
section {
	position:relative;
	float:left;
	width:980px;
	padding:0;
	margin-top:2%;
	margin-bottom:2%;
	margin-left:calc((100vw - 1000px) / 2);
	margin-left:calc((100vw - 1000px) / 2);
	padding:10px;
	background-color:#fff;
	/*-webkit-box-shadow: 0px 0px 3px 2px rgba(0,0,0,0.55);
-moz-box-shadow: 0px 0px 3px 2px rgba(0,0,0,0.55);
box-shadow: 0px 0px 3px 2px rgba(0,0,0,0.55);^*/
	font-family: "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
	color:#000;
}
section a
{
	text-decoration:none;
	color:#000;
}
section a:hover
{
	text-decoration:underline;
}
.section div 
{
	width:100%;
	margin:0;
	padding:0;
}
.titulo img
{
	top:0;
	left:0;
	width:300px;
	margin-left: calc((100% - 300px) / 2);
	margin-right: calc((100% - 300px) / 2);
}
.introduccion, .mywork
{
	margin:0 0 20px 0;
	position:relative;
	float:left;
}
.datos, .sinopsis, .mywork article
{
	width:100%;
	position:relative;
	float:left;
	clear:both;
	margin-top:20px;
}
.datos img
{
	position:relative;
	float:left;
	width:300px;
	margin-right:10px;
	-webkit-box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.55);
-moz-box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.55);
box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.55);
}
.datos p
{
	position:relative;
	float:left;
	font-size:15px;
	line-height:150%;
	margin-top:55px;
}

.sinopsis h1, .mywork article h1
{
	font-size:20px;
	line-height:150%;
	margin-bottom:5px;
}
.sinopsis p, .mywork article p, .mywork article ol
{
	font-size:16px;
	line-height:150%;
	text-align:justify;
	-webkit-hyphens: auto;
  	-ms-hyphens: auto;
  	hyphens: auto;
}
.mywork article ol
{
	margin-top:15px;
}
.mywork article ol li
{
	font-weight:bold;
	margin:5px 0 5px 20px;
}
.mywork article ol li p, .mywork article ul li
{
	font-weight:normal;
}

.mw_pauta img
{
	position:relative;
	float:right;
	width:330px;
	margin-left:10px;
	border:#000 solid 1px;
}
.proyectos {
	position:relative;
	float:left;
	width:100%;
	height:200px;
	margin:20px 0 20px 0;
	padding:0;
	display: flex;
	justify-content: center;
	align-items: center;
	background-image: linear-gradient(rgba(194,161,178, 0.5), rgba(194,161,178, 0.5)), url('../img/bobina.jpg');
	background-repeat:no-repeat;
	background-position: center;
	background-size:cover;
}
.proyectos h1{
	width:50%px;
	font-size:1.6em;
	letter-spacing: 2px;
	font-weight: bold;
	color: rgba(0,0,0,1);
	text-shadow: #FFF 1px 1px 0;
	text-align:center;
}
.proyectos h1 span{
	font-size:1.8em;
	letter-spacing: 3px;
}
#lili,#osos,#trasnos {
   position: relative;
   width:815px;
   height:570px;
   float: left;
   margin-top:40px;
   margin-left: calc((100% - 835px) / 2);
   margin-right: calc((100% - 835px) / 2);
   box-shadow: 0 0 15px 5px rgba(0, 0, 0, 0.2);
   -webkit-box-shadow: 0 0 15px 5px rgba(0, 0, 0, 0.2);
   -moz-box-shadow: 0 0 15px 5px rgba(0, 0, 0, 0.2);
   z-index:98;
   padding:20px;
   font-family: "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
	-webkit-hyphens: auto;
  	-ms-hyphens: auto;
  	hyphens: auto;
	text-align:justify;
	font-size:16px;
	line-height:150%;
	background-repeat:no-repeat;
	background-size:100%;
}
#lili{
	background-image: linear-gradient(rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.3)),url(../img/lili1.jpg);
	color:#000;
	transform: rotate(2deg);
}
#osos{
	background-image: linear-gradient(rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.3)),url(../img/osos2.jpg);
	color:#000;
	transform: rotate(-2deg);
}
#trasnos{
	background-image: linear-gradient(rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.3)),url(../img/trasgos1.jpg);
	color:#000;
	transform: rotate(2deg);
}
#lili img,#osos img,#trasnos img{
    width: 200px;
	height: 200px;
	position:relative;
	float:right;
	border:#000 solid 1px;
}
#lili:hover,#osos:hover,#trasnos:hover {
		transform: rotate(0);
}
#lili h3,#osos h3,#trasnos h3
{
	text-align:center;
	padding:5px;
	margin:10px;
	font-size:24px;
	font-family: "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
}
#lili a
{
	text-decoration:none;
	color:#000;
}
#osos a,#trasnos a
{
	text-decoration:none;
	color:#000;
}
#lili a:hover,#osos a:hover,#trasnos a:hover
{
	text-decoration:underline;
}
.estado_ok, .estado_wip
{
	position:relative;
	float:left;
	padding:7px;
	font-size:18px;
	font-family: "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
}
.estado_ok
{
	border:#97334D solid 1px;
	color:#97334D;
}
.estado_wip
{
	border:#0066CC solid 1px;
	color:#0066CC;
}
.interes
{
	position:relative;
	float:left;
	width:800px;
	margin-top:4%;
	margin-left:calc((100% - 800px)/2);
	margin-bottom:80px;
	margin-right:calc((100% - 800px)/2);
}
.interes img
{
	width:38%;
	margin:1%;
	float:left;
}
.interes p
{
	width:58%;
	margin:1%;
	float:left;
	font-size:16px;
	font-family: "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
	color:#414141;
}
.interes p span
{
	color:#C2A1B2;
	margin-right:5px;
	-webkit-hyphens: auto;
  	-ms-hyphens: auto;
  	hyphens: auto;
}
.interes p a
{
	color:#414141;
	text-decoration:none;
}
.interes p a:hover
{
	text-decoration:underline;
}
@media screen and (max-width:1000px ) {
section {
	width:96%;
	margin-left:0;
	margin-left:0;
	padding:2%;
}
#lili,#osos,#trasnos {
   width:600px;
   height:420px;
   margin-left: calc((100% - 600px) / 2);
   margin-right: calc((100% - 600px) / 2);
}

}
@media screen and (max-width:800px ) {
	section {
		margin-top:50px;
	}
	.datos img	{
		width:240px;
		margin-right:5px;
	}
	.datos p {
	margin-top:30px;
	}
	.estado_ok, .estado_wip
	{
		margin:0 0 3px 0;
	}
	.interes
	{
		width:90%;
		margin:4% 5% 80px 5%;
	}
	.interes p
	{
		font-size:15px;
	}
}
@media screen and (max-width:700px ) {
	#lili,#osos,#trasnos {
	   width:470px;
	   height:330px;
	   margin-left: calc((100% - 470px) / 2);
	   margin-right: calc((100% - 470px) / 2);
	   font-size:14px;
	   padding:10px;
	}
	#lili img,#osos img,#trasnos img{
		display:none;
	}
	#lili h3,#osos h3,#trasnos h3
	{
		padding:0;
		margin:0;
		font-size:18px;
	}
}
@media screen and (max-width:500px ) {
	.datos img	{
		width:90%;
		margin:1% 4.9%;
	}
	.datos p
	{
		margin-top:10px;
	}
	.estado_ok, .estado_wip
	{
		padding:4px;
		margin:0;
	}
	#lili,#osos,#trasnos {
	   width:calc(100% - 35px);
	   height:auto;
	   margin-left: 10px;
	   margin-right: 10px;
	   font-size:14px;
	   padding:10px;
	   transform: rotate(0);
	   background:none;
	   color:#000;
	}
	#lili img,#osos img,#trasnos img{
		display:block;
		clear:both;
		width:200px;
		height:200px;
		position:relative;
		float:right;
		margin-right:calc((100% - 222px) / 2);
		margin-left:calc((100% - 222px) / 2);
		margin-top:10px;
		margin-bottom:10px;
	}
	.estado_ok, .estado_wip,#lili p,#osos p,#trasnos p
	{
		clear:both;
	}
	#lili h3,#osos h3,#trasnos h3{
		display:none;
	}
	.interes img
	{
		width:98%;
		margin:1%;
		float:left;
	}
	.interes p
	{
		width:98%;
		margin:1%;
	}
}