/* Generic CSS used for the slider demo */
body
        {
        background:#f4edc8;
        color:#333;
        font-size:11px;
        font-family: verdana,arial,sans-serif;
        color:#545454;
        padding:0;
        margin:0;
        border:0;
        }
h1
        {
        font-weight:lighter;
        font-family:georgia, times new roman, times, georgia, palatino, serif;
        text-align:center;
        margin-top:0.6em;
        color:#111;
        font-size:2em;
        }
h2
        {
        font-weight:lighter;
        font-family:verdana,arial,sans-serif;
        text-align:center;
        margin:1em 0;
        color:#333;
        text-transform:uppercase;
        letter-spacing:1px;
        font-size:1.2em;
        }
/* get rid of those system borders being generated for A tags */
a:active {
    outline:none;
}

:focus {
    -moz-outline-style:none;
}
.contenedor1
	{
	background:#f3f0e7;
	position:absolute;
	margin: 40px;
	box-shadow: -5px 5px 5px #999;
	border-radius: 30px;
	overflow: show;
	z-index:1;
	}
.contenedor2
	{
		position:relative;
	}
	
.lienzo
	{
		background:#f3f0e7;
		float:left;
		margin:25px;
		margin-right:150px;
		border:1px dashed #901420;
		overflow: show;
	}
.imgTop{
	background:#ff0000;
	position:absolute;
	top:40px;
	left:40px;
	border:0px solid #f3f0e7;
	z-index:20;
	pointer-events:none;

}
.svgClass{
	position:absolute;
	top:26px;
	left:26px;
	z-index:10;
}
.herramientas
	{
		border-left: 2px solid #901420; 
		position:absolute;
		right:0px;
		bottom:0px;
		margin-bottom:25px;
		width:130px;
		height:545px

	}
	
.boton
	{
		position:relative;
		
	}
.boton2
	{
		position:absolute;
		bottom:0px;
		right:0px;
		width:150px;
	}
.boton2 ul
	{

		list-style-type: none;
		padding: 0px;
		margin-left: 50px;
	}
.boton2 li
	{
		margin: 10px 0px 0px 0px;
		padding: 0px;
		background:#f4edc8;
		line-height: 0px;
		border-radius: 15px 0px 0px 18px;
	}
.boton2 img
	{
		width:35px;
		height:36px;
		padding: 0px;
		transition: all 0.2s linear;
		-webkit-transition: all 0.2s linear; 
		-moz-transition: all 0.2s linear; 
	}
.boton2 img:hover
{
	opacity:0.5;
	-moz-transform: scale(1.1);
	-webkit-transform:scale(1.1);
	transition: all 0.2s linear;
	-webkit-transition: all 0.2s linear; 
	-moz-transition: all 0.2s linear; 
}
.boton2 img:active
{
	opacity:1;
	-moz-transform: scale(1.1);
	-webkit-transform:scale(1.1);
	-moz-transition: all 0.2s linear; 
}
.info
	{
	position:absolute;
	background-color:#000000;
	height:100%;
	width:100%;
	opacity:0.4;
	display: none;
	overflow:show;
	z-index:30;	
	}
.info2
{
	background-color:#f3f0e7;
	position:absolute;
	left:50%;
	top:50%;
	width:300px;

	font-size:11px;
	font-family: verdana,arial,sans-serif;
	color:#711316;
	padding:20px 30px 30px 30px;
	margin-left:-150px;
	margin-top:-250px;
	display :none;
	box-shadow: 0px 0px 1000px 22px #000;
	border-radius: 30px;
	z-index: 35;
}

.ejemplo {
	
}
.ejemplo img{
	width: 300px;
	border:1px dashed #901420;
	text-align:center;
}
.ejemplo p{
	font-size:10px;
	font-family: verdana,arial,sans-serif;
	color:#901420;
	padding:0;
}
.botonVentana{
	height: 25px;
	border: 2px solid #901420;
	border-radius:10px;
	background-color: #f4edc8;
	font-size:11px;
	font-family: verdana,arial,sans-serif;
	color:#901420;
	margin-top:10px;
	transition: all 0.2s linear;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear; 
}
.botonVentana:hover{
	opacity:0.5;
	-moz-transform: scale(1.1);
	-webkit-transform:scale(1.1);
	transition: all 0.2s linear;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear; 	
}
.botonVentana:active{
	opacity:1;
	-moz-transform: scale(1.1);
	-webkit-transform:scale(1.1);
}
.zoom {
	background-color: #f4edc8;
	border: 2px solid #901420;
	border-radius:10px 0px 0px 10px;
	font-size:13px;
	font-family: verdana,arial,sans-serif;
	color:#901420;
	width:30px;
	height:30px;
	transition: all 0.2s linear;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear; 
	padding:0px;
	margin:0px;
	
}
.zoom:hover {
	opacity:0.5;
	-moz-transform: scale(1.1);
	-webkit-transform:scale(1.1);
	transition: all 0.2s linear;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear; 	
}
.zoom2 {
	background-color: #f4edc8;
	border: 2px solid #901420;
	border-radius:0px 10px 10px 0px;
	font-size:13px;
	font-family: verdana,arial,sans-serif;
	width:30px;
	height:30px;
	padding:0px;
	margin:0px;
	transition: all 0.2s linear;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear; 
}
.zoom2:hover {
	opacity:0.5;
	-moz-transform: scale(1.1);
	-webkit-transform:scale(1.1);
	transition: all 0.2s linear;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear; 
}
.Paleta {
	border: 1px solid #901420;
	border-radius:10px;
	width:30px;
	height:30px;
	font-size:30px;
	font-family: verdana,arial,sans-serif;
	font-weight:bold;
	text-align:center;
	color:#ff0000;
	line-height:90%;
	margin:1px;
	padding:0px;
	transition: all 0.2s linear;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear; 	
}
.Paleta:hover {
	border: 1px solid #ff0000;
	-moz-transform: scale(1.1);
	-webkit-transform:scale(1.1);
	transition: all 0.2s linear;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear; 
}
.Paleta2{
	border:4px solid #901420;
	border-radius:10px;
	background-color:#f4edc8;
	height:30px;
	width:70px
}

.Paleta3{
	border: 1px solid #901420;
	border-radius:10px;
	background-color:#ffffff;
	width:70px;
	height:30px;
	margin:1px;
	padding:0px;
	transition: all 0.2s linear;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear; 	
}
.Paleta3:hover {
	border: 1px solid #ff0000;
	-moz-transform: scale(1.1);
	-webkit-transform:scale(1.1);
	transition: all 0.2s linear;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear; 
}

.PaletaF {
	border: 1px solid #901420;
	/*border-radius:10px;*/
	line-height: 2px;
	width:30px;
	height:8px;
	margin:10px 0px 0px 0px;;
	padding:0px;
	transition: all 0.2s linear;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear; 	
}
.PaletaF:hover {
	border: 1px solid #ff0000;
	-moz-transform: scale(1.1);
	-webkit-transform:scale(1.1);
	transition: all 0.2s linear;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear; 
}
.PaletaFA {
	border: 0px solid #ff0000;
	background-color: #ffffff;
	line-height: 0px;
	width:140px;
	height:8px;
	margin:8px 0px 0px 0px;;
	padding:0px;
	transition: all 0.2s linear;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear; 	
}
.PaletaFA:hover {
	border: 1px solid #ff0000;
	transition: all 0.2s linear;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear; 
}
.conSelColor{
	position:absolute;
	top:0px;
	left:820px;
	top:-470px;
	z-index:20;
	cursor: pointer;
}
.conSelFilete{
	position:absolute;
	left:660px;
	top:-245px;
	z-index:20;
	cursor: pointer;
}
.conSelFilAnc{
	position:absolute;
	left:500px;
	top:-215px;
	z-index:20;
	cursor: pointer;
}
.conSelSim{
	position:absolute;
	left:337px;
	top:-325px;
	z-index:20;
	box-shadow: -1px 0px 5px #000;
	border-radius:0px 0px 10px 10px;
	border: 1px solid #901420;
	cursor: pointer;
}
.conEdiText{
	position:absolute;
	left:174px;
	top:-395px;
	width:140px;
	z-index:20;
	box-shadow: -1px 0px 5px #000;
	border-radius:0px 0px 10px 10px;
	border: 1px solid #901420;
	cursor: pointer;
}
.selColor {
	width:140px;
	height:455px;
	background-color: #f3f0e7;
	border: 1px solid #901420;
	line-height:100%;
	border-radius:0px 0px 0px 0px;
    margin:0px;
	padding:5px;
	box-shadow: -1px 0px 5px #000;
}
.pestana{
	width:152px;
	height:15px;
	background-color:#901420;
	border-radius:0px 0px 10px 10px;
    margin-top:0px;
	font-size:10px;
	font-weight:bold;
	font-family: verdana,arial,sans-serif;
	color:#f4edc8;
	text-align:center;
	padding-top:8px;
	padding-bottom:4px;
	box-shadow: -1px 1px 5px #000;
}
.pestana:hover{
	color:#ffffff;
}
.cerrar{
	float:right;
	width:18px;
	height:16px;
	background-color:#901420;
	border-radius:8px;
	text-align:center;
	color: #F4EDC8;
	padding-top:1px;
	margin-right:5px;
	z-index:20;
	cursor: pointer;

}
.cerrar:hover{
	float:right;
	background-color:#ee0000;
	color: #ffffff;

}
#text-controls {
	display:none;
	background-color:#f3f0e7;
	border-radius: 20px;
	position:absolute;
	top:50%;
	left:50%;
	width:260px;
	height:205px;
	z-index:20;
	margin-top: -50px;
	margin-left: -150px;
	text-align: center;
	box-shadow: -4px 4px 20px #000;
}
#text-controls textarea {margin-top: 10px;height:65px;width: 200px;padding:10px;border:none;border-radius:20px; }
#text-controls button { margin-top: 20px; }
#text-controls legend { margin-top: 20px;margin-left:20px;display: block; }
#triCol {
	position: absolute;
	bottom:72px;
	left:65px;
	width: 90px;
	border-radius:0px,0px,10px,10px;
	z-index:20;
}
#triCol input {
	background-color:#650f14;
	font-size: 12px;
	text-align:right;
	color: #fff;
	border: 0px;
	padding: 4px;
	width: 70px;
}
#tricol input:focus {
	border-color:  #f3f0e7;
	color: #f3f0e7;
	outline: 0;
}
#triCol .color-triangle {
	border-radius:0px,0px,10px,10px;
	box-shadow: -1px 0px 5px #000;
}
#imageTemp{ 
	position: absolute;
	top: 1px;
	left: 1px;
	margin:25px;
}
#imageTop{ 
	position: absolute;
	top: 1px;
	left: 1px;
	margin:25px;
}