/*------------------RESET-------------------------------------- */
@import url(http://fonts.googleapis.com/css?family=Roboto:400,300,400italic,300italic);
@-o-viewport {width: device-width;}
@-ms-viewport {width: device-width;}
@viewport { width: device-width;}
html, body{min-height: 100%;height: 100%;} 
img,audio,video,canvas { max-width: 100%;}
ul{list-style:none;}
*,*:before,*:after{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing:border-box;padding:0;margin:0;font-family: 'Roboto', sans-serif;font-weight: 300;}
/* Tipografía */
a{color: #5f8fcb;text-decoration:none;}
a:focus,a:hover {color: #243e90;}
h1{font-size:23px;}
h2{font-size:17px;font-weight: bold;}
/*MENÜ SUPERIOR*/
#MenSup{width:100%;background-color:#252e3d;height:40px;}
.MenSupCont{height:40px;}
.MenSupCont,#content{max-width: 1140px;width:92%;margin:0px auto;position: relative;display: table;clear: both;}
.MenSupCont span a{color: rgb(206, 206, 206);float: right;display: block;height: 25px;font-size: 11px;margin-top: 7px;padding: 6px 50px;background: url("../Images/assetspot.png") no-repeat 191px 0px;}
/*Contenedor Total*/
#content{min-height: 96%;margin-bottom: -94px;padding-bottom: 90px;}
/*Header Principal*/
.Header{min-height: 100px;width: 100%;display: table;position: relative;background: url("../Images/SoftwareITPro.png") no-repeat right bottom 14px;}
.LogoSpot,.MenuPrin,.RedSoc{width: 14%;/* height: 100%; */float: left;}
.LogoSpot img{margin: 25px auto 0;width:150px;display:block;}
/*Menú Principal*/
.MenuPrin{width: 70%;}
.MenuPrin .MenuResp{opacity:0;position: absolute;z-index: -1;}
.MenuPrin ul{text-align:right;display: block;height: 100%;float: right;width: 95%;margin: 25px auto;}
.MenuPrin ul li{float:left;width: 20%;}
.MenuPrin ul li a{float:left; text-align: center;}
.MenuPrin ul li:nth-child(2) a{background-position:0 -40px;}
.MenuPrin ul li:nth-child(3) a{background-position:0 -83px;}
.MenuPrin ul li:nth-child(4) a{background-position:0 -126px;}
.MenuPrin ul li:nth-child(5) a{background-position:0 -169px;}
.MenuPrin ul li a.selected{font-weight:bold;}
.MenuPrin ul li a{padding: 15px 0px;width: 100%;display:block;text-align: center;font-size: 14px;font-family: 'Questrial';
	text-shadow: none;
	-webkit-transition: color 0.3s;
	-moz-transition: color 0.3s;
	transition: color 0.3s;
	position: relative;
	display: inline-block;
	color: #007CC3;
}

.MenuPrin ul li a::before,
.MenuPrin ul li a::after {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	background: #007CC3;
	content: '';
	opacity: 0;
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	-moz-transition: opacity 0.3s, -moz-transform 0.3s;
	transition: opacity 0.3s, transform 0.3s;
	-webkit-transform: translateY(-10px);
	-moz-transform: translateY(-10px);
	transform: translateY(-10px);
}

.MenuPrin ul li a::before {
	top: 0;
	-webkit-transform: translateY(-10px);
	-moz-transform: translateY(-10px);
	transform: translateY(-10px);
}

.MenuPrin ul li a::after {
	bottom: 0;
	-webkit-transform: translateY(10px);
	-moz-transform: translateY(10px);
	transform: translateY(10px);
}

.MenuPrin ul li a.selected::before,
.MenuPrin ul li a.selected::after
{
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}
.MenuPrin ul li a:hover::before,
.MenuPrin ul li a:focus::before,
.MenuPrin ul li a:hover::after,
.MenuPrin ul li a:focus::after {
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}



.MenuSpot{width:100%;background: #e8e4ea;display: none;padding: 10px;text-align:center;}
/*REDES SOCIALES*/
.RedSoc{width: 16%;}
.RedSoc ul {margin:auto;display:table;margin-top: 30px;float: right;}
.RedSoc ul li{background: url("../Images/assetspot.png")  no-repeat 0 -96px;height: 32px;width: 32px;float:left;margin: 0 2px;}
.RedSoc ul li a{width:100%;height:100%;display:block;position: relative;}
.RedSoc ul li.Twit{background-position:0 -26px;}
.RedSoc ul li.Yout{background-position:0 -61px;}
.RedSoc ul li.Inde{background-position:0 -131px;}
.RedSoc li a span{display:none\0/;/*ie8*/*display:none;/*ie7*/width:80px;height:auto;padding:5px;left: 50%;margin-left: -38px;font-style: italic;
font-size: 11px;color: #fff;text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);text-align: center;border: 2px solid #fff;background: rgba(0, 103, 147, 0.9);text-indent: 0px;
border-radius: 20px;position: absolute;pointer-events: none;bottom: 0px;opacity: 0;box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.RedSoc li a:hover span{opacity: 0.9;bottom: -30px;}
/*Contenedor Principal*/
.ContSpot{width:100%;min-height:300px;background: #e8e4ea;margin-bottom: 30px;padding-bottom: 50px;}
/*BannerPrincipal-Contáctanos*/
.HeadSpot{max-width: 1020px;padding: 20px 0;margin: auto;position: relative;}
.HeadSpot ul{max-width: 360px;width: 100%;position: absolute;top: 31px;/* left: 10px; */z-index: 1;}
.HeadSpot ul li{position: relative;float: left;height: 15px;width: 45%;}
.HeadSpot ul li.PreFre{display:none;}
.HeadSpot ul li.Soport{width:25%;border-right: 1px solid white;}
.HeadSpot ul li.Contac{width:30%;}
.HeadSpot ul li a{font-size: 12px;color: white;margin:auto;width:100%;text-align: right;padding: 0 5px;text-shadow: 1px 1px rgba(0,0,0,0.8);display: block;}
.HeadSpot ul li span{font-weight:normal;}
.HeadSpot ul li span:hover{background:#7dbbe6;}
.HeadSpot ul li:before{content:"";width: 26px;height: 25px;position: absolute;top: -6px;background: url("../Images/contact.png") no-repeat 0px;}
.HeadSpot ul li.Soport:before{background-position: -28px;left: 5px;}
.HeadSpot ul li.Contac:before{background-position: -53px;left: 5px;}

/*BannerPrincipal-Banner*/
.BannerSpot{height:100px;position: relative;z-index: 0;box-shadow: 1px 1px 5px -1px;}
.BannerSpot img{width:100%;height:100%;}
/*BannerPrincipal-Titulo*/
.TituloSpot{position:absolute;bottom: 10px;right: 30px;font-size:25px;cursor:default;}
.TituloSpot h1{color: #fff;font-size: 23px;-webkit-transition: all 0.1s linear;
-moz-transition: all 0.1s linear;
-o-transition: all 0.1s linear;
-ms-transition: all 0.3s linear;
transition: all 0.3s linear;
-webkit-animation: all 0.3s linear backwards;-moz-animation: all 0.3s linear backwards;-ms-animation: all 0.3s linear backwards;	animation: all 0.3s linear backwards;}
.TituloSpot h1 span.neg{font-weight:800;}
.TituloSpot h1 span.reg{font-size:12px;vertical-align:super;}
.TituloSpot h1:hover{text-shadow: 0px 0px 10px #fff, 0px -5px 5px rgba(0,0,0,0.9);}
/*Contenedor de COntenido*/
.ContenedorSpot{max-width: 1020px;min-height: 350px; background:white;margin: auto;box-shadow: 1px 1px 6px -2px;border-radius: 10px;position: relative;font-size: 14px;color: #6a6a6a;}
.LateralSpot{
-webkit-animation-duration: 0.5s;
	-webkit-animation-timing-function: ease;
	-webkit-animation-fill-mode: both;
	
	-moz-animation-duration: 0.5s;
	-moz-animation-timing-function: ease;
	-moz-animation-fill-mode: both;
	
	-o-animation-duration: 0.5s;
	-o-animation-timing-function: ease;
	-o-animation-fill-mode: both;
	
	-ms-animation-duration: 0.5s;
	-ms-animation-timing-function: ease;
	-ms-animation-fill-mode: both;
	
	animation-duration: 0.5s;
	animation-timing-function: ease;
	animation-fill-mode: both;
	-webkit-animation-name: fadeIn;
	-moz-animation-name: fadeIn;
	-ms-animation-name: fadeIn;
	-o-animation-name: fadeIn;
	animation-name: fadeIn;}
/*COntenedor Lateral*/
.LateralSpot{width: 100%;float: right;padding: 20px 115px 0 30px;position: relative;}
/*Menu lateral General*/
.MenuLatSpot{position:absolute;right:0;top: 0;bottom: 0;height: 220px;margin: auto;box-shadow: -2px 2px 8px -3px;border-radius: 5px 0 0 5px;overflow: hidden;}
.MenuLatSpot ul li{width:100%;position: relative;height: 20%;font-size: 12px;
	-webkit-transition: all 0.1s linear;
	-moz-transition: all 0.1s linear;
	-o-transition: all 0.1s linear;
	-ms-transition: all 0.3s linear;
}
/*Menu lateral Subsitio Nosotros*/
.MenuLatSpot ul{width: 100px;height:100%;}
.MenuLatSpot ul li.Nos{background: #F68E1E;}
.MenuLatSpot ul li.Val{background: #00A1E1;}
.MenuLatSpot ul li.MyV{background:#00BBB4;}
.MenuLatSpot ul li.Fil{background:#5A76B9;}
.MenuLatSpot ul li.Ali{background: #8E919A;}
.MenuLatSpot ul li.Nos:hover{background: #F58102;}
.MenuLatSpot ul li.Val:hover{background: #3678BD;}
.MenuLatSpot ul li.MyV:hover{background:#0099AF;}
.MenuLatSpot ul li.Fil:hover{background:#3355A9;}
.MenuLatSpot ul li.Ali:hover{background: #7D7F8A;}
.MenuLatSpot ul li a{color:white;text-align:center;position: absolute;display: block;margin: auto;top: 0;bottom: 0;right: 0;left: 0;padding-top: 15px;}
.MenuLatSpot ul li.MyV a{padding-top:5px;}
.MenuLatSpot ul li a span{font-size:12px;clear: both;display: block;}
/*Menu lateral Subsitio Servicios*/
.MenuLatSpot ul.LatServ li{height:20%;background:#1F73B2;}
.MenuLatSpot ul.LatServ li.pro{display:none;}
.MenuLatSpot ul.LatServ li a{height: 100%;padding: 8px 0;color:white;text-align:center;display: block;}
.MenuLatSpot ul.LatServ li.pro a,.MenuLatSpot ul.LatServ li.sta a{padding-top:14px}
.MenuLatSpot ul.LatServ li.fab{background:#22a5a7;}
.MenuLatSpot ul.LatServ li.por{background:#249ed6;}
.MenuLatSpot ul.LatServ li.sta{background:#f4cf50;}
.MenuLatSpot ul.LatServ li.ges{background:#6eb46f;}
.MenuLatSpot ul.LatServ li.inf{background:#7476b2;}
.MenuLatSpot ul.LatServ li:hover{background:black;}
/*Slider Principal Spot*/
.NuePro{width:100%;height: 100%;}
.NuePro li{width:33%;float:left;position: relative;height: 100%;}
.NuePro li.p-kyc,.NuePro li.p-fx{background:url("../Images/SliderSpot/cont/1-fondo.png");}
.NuePro li.p-fx{background-position:190px 0;float:right;}
.NuePro li img{display:block;margin: 35px auto;max-width: 90px;}
.NuePro li p{text-align:center;padding: 10px;font-size: 13px;position: absolute;bottom: 0;height: 55%;}
.NuePro li .ligpr{position:absolute;bottom:26px;width: 100%;margin: auto;display: block;left: 0;right: 0;text-align: center;}
/*Menú Footer*/
.MenuFooter{width: 100%;}
.MenuFooter > ul{width: 52%;font-size: 13px;display: table;padding-bottom:20px;float:left;}
.MenuFooter > ul > li{width: 25%;float:left;border-right: 1px solid #727476;padding: 0 8px;min-height: 105px;}
.MenuFooter > ul > li span a{font-weight: bold;}
.MenuFooter > ul > li:last-child{border:none;}
.MenuFooter > ul > li ul{font-size: 12px;}
.twtr{width: 48%;float: left;position: relative;}
.twtr #twitter-widget-0{width: 82%!important;float:right;height: 85px;}
.twtr img{position: absolute;box-shadow: 2px 0px 4px 0px;left: 5px;width: 15%;}
/*Footer*/
.Footer{background:#e2e1e9;width: 100%;margin-bottom: 0;position: relative;}
.Footer p{max-width:1140px;margin:auto;text-align: center;font-size: 11px;padding: 20px 0px;color: #3F3F3F;}
/***DISEÑO RESPONSIVO**/
@media screen and (max-width: 750px) {*{-webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    transition: all 0.3s linear;}
.LogoSpot{width:25%;}
.MenuPrin{width: 100%;overflow: hidden;margin: 0 auto 10px;}
.MenuPrin ul{margin: 0 auto;float: none;}
.RedSoc{position: absolute;right: 5px;top: 30px;height: auto;width: 200px;}
.RedSoc ul{margin:0 auto;}
.RedSoc li a span{display:none;}
#content {width:100%;}
.HeadSpot,.ContenedorSpot{width: 98%;}
.ContenedorSpot{background:white!important;display: table;}
.MenuFooter > ul,.twtr{width: 99%;}
.twtr{padding-bottom:15px;}
.Footer p{padding-left:10px;}
/*Slider*/
.AnunciosPrincipal{padding:5px!important;}
.SpotMejora,.grid{width:50%!important;}
/*Tabs*/
.LateralSpot{width: 100%;padding: 10px 110px 0 10px;}
/*Clientes*/
.tp-grid{margin:0!important;}
}
/*Casos de Exito*/
.CasEx{width:100%;padding: 0 10px 0px 10px;}
.CasEx h2{color: #666;box-shadow: 0px 1px 0px #aaa;padding: 20px 0 10px 0;font-size: 20px;font-weight: 300;}
.CasEx ul{width:90%;margin: 80px auto 0;display: table;}
.CasEx ul li{width: 22%;min-width: 160px;background: #F8F8FA;float: left;margin: 0 1.5% 10px;height: 140px;padding: 10px;box-shadow: 1px 1px 5px;}
.CasEx ul li a{display:block;width:100%;height:100%;background:#353567;}
.CasEx ul li.c2 a{background:#F3921D;}
.CasEx ul li.c3 a{background:#6451A2;}
.CasEx ul li.c4 a{background:#5578BA;}
.CasEx ul li span{color:white;text-align:center;display:block;font-size:18px}
.CasEx ul li span.caso{padding: 15px 0 10px 0;font-size:13px;margin-bottom: 16px;}
/*Caso1*/
.CasExi{max-width:100%;margin:auto;padding:20px;background:white;text-align: justify;}
.CasExi h1{font-size:20px;color:#5f8fcb;margin-bottom:10px;}
.CasExi h2{margin: 20px 0 0;font-size: 20px;}
/*Alianzas*/
#Alianzas #Saga,#Alianzas #Trujillo{display:none;}
#Saga, #Trujillo{width: 300px;height: 400px;background:white;overflow: hidden;overflow-y: auto;text-align: justify;padding: 10px;}
#Saga h2,#Trujillo h2{
    font-size: 20px;  color: #5f8fcb;  margin-bottom: 10px;
    font-weight: 300;
    text-align: center;
}
@media screen and (max-width: 620px) {
	.SpotMejora,.grid{width: 100%!important;}

}
@media screen and (max-width: 480px) {	
	
	.Header{width:98%;margin:auto;}
.LogoSpot,.MenuPrin,.MenuPrin ul li{width:100%;}.MenuPrin{-webkit-perspective: 800px;
	-moz-perspective: 800px;
	-o-perspective: 800px;
	-ms-perspective: 800px;
	perspective: 800px;margin-top: 35px;}
.MenuResp ~ ul{height:0;overflow:hidden;}
.MenuResp ~ ul li{height:20%;}
.MenuSpot{display:block;-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform-origin: 50% 0%;
	-moz-transform-origin: 50% 0%;
	-o-transform-origin: 50% 0%;
	-ms-transform-origin: 50% 0%;
	transform-origin: 50% 0%;
	-webkit-transition: -webkit-transform .1s;
	-moz-transition: -moz-transform .1s;
	-o-transition: -o-transform .1s;
	-ms-transition: -ms-transform .1s;
	transition: transform .1s;}
.MenuSpot:active {
	-webkit-transform: rotateX(60deg);
	-moz-transform: rotateX(60deg);
	-o-transform: rotateX(60deg);
	-ms-transform: rotateX(60deg);
	transform: rotateX(60deg);}
input.MenuResp:checked ~ ul{max-height:500px;height: 200px;}
.TituloSpot{width: 87%;text-align:right;right: 0px;left: 0;margin: auto;}
.TituloSpot h1{font-size:18px;}
.MenuFooter > ul{width:100%;}
.MenuFooter > ul > li{width:50%;}
.MenuFooter > ul > li:nth-child(2){border:none;}
.RedSoc{top:90px;left:0;right:0;margin:auto;}
.NuePro li p{font-size:13px}
.FaSo img{content:url("../Images/SliderSpot/cont/2-m.png");}
.ImPo img{content:url("../Images/SliderSpot/cont/3-m.png");}
.St img{content:url("../Images/SliderSpot/cont/4-m.png");}
.GeDo img{content:url("../Images/SliderSpot/cont/5-m.png");}
.SeIn img{content:url("../Images/SliderSpot/cont/6-m.png");}


}

/*******Nosotros*******/
.PropValor{width:100%;height: 125px;}
.PropValor img{min-width:300px;width:100%;max-width:600px;margin:10px auto;display:block;}
.PropValor h3{width:20%}
/*Subsitio Staffing*/
.Staff li{padding: 15px 5px 15px 50px;position: relative;}
.Staff li:before{content:"";position:absolute;top:0;left:0;width: 44px;height: 44px;background: url("../Images/iconos.png") no-repeat -125px -49px;}
.Staff li:nth-child(2):before{background-position:-125px -97px;}
.Staff li:nth-child(3):before{background-position:-125px -145px;}
.Staff li:nth-child(4):before{background-position:-125px -193px;}
.Staff li:nth-child(5):before{background-position:-125px -242px;}
.SloganStafg{padding: 0px 0 0 30px;font-weight: 100;display: block;font-size: 30px;position:relative;margin-bottom:20px;}
.SloganStafg:before{content:"";width: 28px;height: 25px;background: url(../Images/iconos.png) no-repeat -135px -21px;position:absolute;left:0;top:0;}
.SubSlog{text-align:center;margin-top:5px}
/*Nuestros Valores*/
ul.NV li{ width: 50%;float:left;height:90px; position: relative; padding: 20px 0 20px 70px;}
ul.NV li h2{display:block;font-size: 13px;color: #5f8fcb;font-weight: bold;}
ul.NV li p{font-size:12px;}
ul.NV li:before{display:block;content:"";width: 65px;height: 65px;position:absolute;left:0;top: 0;margin: auto;bottom: 0;
background: url("../Images/iconos.png") no-repeat -1px -23px;-webkit-animation-duration: 0.5s;
	-webkit-animation-timing-function: ease;
	-webkit-animation-fill-mode: both;
	
	-moz-animation-duration: 0.5s;
	-moz-animation-timing-function: ease;
	-moz-animation-fill-mode: both;
	
	-o-animation-duration: 0.5s;
	-o-animation-timing-function: ease;
	-o-animation-fill-mode: both;
	
	-ms-animation-duration: 0.5s;
	-ms-animation-timing-function: ease;
	-ms-animation-fill-mode: both;
	
	animation-duration: 0.5s;
	animation-timing-function: ease;
	animation-fill-mode: both;}
	ul.NV li:hover:before{
	-webkit-animation-name: pulse;
	-moz-animation-name: fadeInLeft;
	-ms-animation-name: fadeInLeft;
	-o-animation-name: fadeInLeft;
	animation-name: fadeInLeft;
	}
ul.NV li:nth-child(2):before{background-position:-1px -229px;}
ul.NV li:nth-child(3):before{background-position:-1px -92px;}
ul.NV li:nth-child(4):before{background-position:-1px -297px;}
ul.NV li:nth-child(5):before{background-position:-1px -160px;}
ul.NV li:nth-child(6):before{background-position:-1px -366px;}
/*Implementación de Portales*/
ul.IP{padding-top:30px;}
ul.IP li{padding-left:45px;position:relative;margin-bottom:10px;}
ul.IP li:before {content: "";bottom: 0;margin: auto;position: absolute;top: 0;left: 0;width: 32px;height: 32px;background: url("../Images/iconos.png") no-repeat -185px -23px;}
ul.IP li:nth-child(2):before {background-position:-185px -61px;}
ul.IP li:nth-child(3):before {background-position:-185px -101px;}
ul.IP li:nth-child(4):before {background-position:-185px -141px;}
ul.IP li:nth-child(5):before {background-position:-185px -182px;}
ul.IP li:last-child{margin-top:20px;}
/*Nuestra FIlosifía*/
.NF{margin-top: 120px;}
.NF p{letter-spacing:1px;color: black;line-height:20px;text-shadow: 1px 1px 3px rgba(0,0,0,.2);   - See more at: http://fedesilva.com/blog/2011/06/efectos-de-texto-con-css3-y-text-shadow#sthash.a6sWW3Zc.dpuf;font-weight: bold;} 
/*Misión y Visión*/
.MV{margin-top:30px;}
.MV h2{margin:5px 0; color:#65b8b1;font-weight: bold;}
.MV p{margin-bottom:20px;}
/*Aviso de Privacidad*/
.AvPriv{padding:20px;}
.AvPriv h2{font-weight:bold;color:#F7941E;padding-bottom:15px;}
.AvPriv b{font-weight:bold;}
.AvPriv p{padding-bottom:15px}
/*Formulario Spot*/
.ifrdir{width:98%;height: 97%;display:block;margin:5px auto;}
.FormSpot #ContactSpot span,.FormSpot .DatCont span{text-align:left;}
.FormSpot .DatCont span.neg{font-weight:bold;}
.FormSpot #ContactSpot{width: 55%;float:left;padding: 10px;}
.FormSpot #ContactSpot p{padding:5px;font-size: 13px;}
.FormSpot input,.FormSpot textarea{border-radius:3px; border:none!important;box-shadow:0px 0px 5px -1px;padding: 3px 5px;

-webkit-transition: all 0.3s linear;
	-moz-transition: all 0.3s linear;
	-o-transition: all 0.3s linear;
	-ms-transition: all 0.3s linear;
	transition: all 0.3s linear;}
.FormSpot input:hover,.FormSpot textarea:hover{box-shadow:0px 0px 2px -2px;}
.FormSpot input:focus,.FormSpot textarea:focus,.FormSpot input:active,.FormSpot textarea:active{position:relative;border:1px solid red;}
.FormSpot #mesaje{width:95%!important;height: 125px!important;}
.FormSpot input[type="submit"]{
	margin:auto;
	display:block;
    width: 30%;
	padding: 8px 5px;    
    /* Styles */
    
	background: #e1962f;
    color: white;
    text-shadow: 0 1px 0 rgba(0,0,0,0.3);
    font-size: 16px;
    font-weight: bold;}
.FormSpot .DatCont {float:left;width: 45%;padding: 10px;}
.FormSpot .DatCont p{font-size:13px;}
.FormSpot .DatCont p strong{padding: 9px 0 3px;display:block;font-weight: bold;}
.FormSpot .DatCont .to_map img{width:80%;display:block;margin:auto;}
a.hiddenanchor {display: none;}
/** Ccontenedor de COntacto y Mapa **/
#wrapper{position: relative;max-width: 640px;margin:auto;color:#474747;}
#Contact{background: #ebebec url("../Images/contacto.png") no-repeat center;}
#Map,#Contact{position: absolute;
	width: 100%;	
	max-width: 640px;height: 380px;
	border: 1px solid rgba(147, 184, 189,0.8);
	-webkit-box-shadow: 0pt 2px 5px rgba(105, 108, 109,  0.7),	0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset;
	   -moz-box-shadow: 0pt 2px 5px rgba(105, 108, 109,  0.7),	0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset;
	        box-shadow: 0pt 2px 5px rgba(105, 108, 109,  0.7),	0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset;
	-webkit-box-shadow: 5px;
	-moz-border-radius: 5px;
		 border-radius: 5px;
}
#Map{	
	z-index: 21;
	opacity: 0;
}
#Contact{
	z-index: 22;
}
.MenEnviado img{display:block;margin:50px auto;}
.MenEnviado h3{display:block;font-weight;margin: auto;text-align: center;color: #DE8D2D;font-size: 25px;}
.MenEnviado p{text-align:center;font-size: 20px;margin: 68px auto;padding: 0 30px;font-weight: bold;}
.MenEnviado span{position:absolute;bottom:5px;right:5px;font-size:15px}
#tomap:target ~ #wrapper #Map,
#tocontact:target ~ #wrapper #Contact{
	z-index: 22;
	-webkit-animation-name: fadeInDown;

	-moz-animation-name: fadeInLeft;
	-ms-animation-name: fadeInLeft;
	-o-animation-name: fadeInLeft;
	animation-name: fadeInLeft;
	-webkit-animation-delay: .1s;
	-moz-animation-delay: .1s;
	-o-animation-delay: .1s;
	-ms-animation-delay: .1s;
	animation-delay: .1s;
}
.to_contact{position:absolute;top:0;left: 5px;bottom:0;margin:auto;display: block;height: 36px;width: 36px;padding: 4px;box-sizing: initial;background: #ebebec  url("../Images/NavegaSpot.png") no-repeat 4px 4px;;box-shadow: 1px 0px 11px rgba(99,162,237,2);border-radius: 50%;color: transparent;}
.to_contact:hover{color:transparent;background-size: 185px;width: 45px;height: 45px;background-position: 5px 5px;}
#tomap:target ~ #wrapper #Contact,
#tocontact:target ~ #wrapper #Map{
	-webkit-animation-name: fadeOutUp;
	-moz-animation-name: fadeOutLeft;
	-ms-animation-name: fadeOutLeft;
	-o-animation-name: fadeOutLeft;
	animation-name: fadeOutLeft;
}
/*Animación, solo falta el animation-name*/
.animate{
	-webkit-animation-duration: 0.5s;
	-webkit-animation-timing-function: ease;
	-webkit-animation-fill-mode: both;
	
	-moz-animation-duration: 0.5s;
	-moz-animation-timing-function: ease;
	-moz-animation-fill-mode: both;
	
	-o-animation-duration: 0.5s;
	-o-animation-timing-function: ease;
	-o-animation-fill-mode: both;
	
	-ms-animation-duration: 0.5s;
	-ms-animation-timing-function: ease;
	-ms-animation-fill-mode: both;
	
	animation-duration: 0.5s;
	animation-timing-function: ease;
	animation-fill-mode: both;
}
/*Productos*/
.ch-grid {
	margin: 0;
	padding: 0;
	list-style: none;
	display: block;
	text-align: center;
	width: 100%;
}

.ch-grid:after,
.ch-item:before {
	content: '';
    display: table;
}

.ch-grid:after {
	clear: both;
}

.ch-grid li {
	width: 295px;
	height: 350px;
	display: inline-block;
	margin: 0 10px;
}
.ch-item {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	position: relative;
	cursor: default;
	-webkit-perspective: 900px;
	-moz-perspective: 900px;
	-o-perspective: 900px;
	-ms-perspective: 900px;
	perspective: 900px;
}
.ch-info{
	position: absolute;
	width: 100%;
	height: 100%;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	transform-style: preserve-3d;
}
.ch-info > div {
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	background-position: center center;
	-webkit-transition: all 0.4s linear;
	-moz-transition: all 0.4s linear;
	-o-transition: all 0.4s linear;
	-ms-transition: all 0.4s linear;
	transition: all 0.4s linear;
	-webkit-transform-origin: 50% 0%;
	-moz-transform-origin: 50% 0%;
	-o-transform-origin: 50% 0%;
	-ms-transform-origin: 50% 0%;
	transform-origin: 50% 0%;
	background: #687EB7;
}

.ch-info .ch-info-front {
	box-shadow: 0 0 3px 1px rgba(0,0,0,0.3);
}

.ch-info .ch-info-back {
	-webkit-transform: translate3d(0,0,-220px) rotate3d(1,0,0,90deg);
	-moz-transform: translate3d(0,0,-220px) rotate3d(1,0,0,90deg);
	-o-transform: translate3d(0,0,-220px) rotate3d(1,0,0,90deg);
	-ms-transform: translate3d(0,0,-220px) rotate3d(1,0,0,90deg);
	transform: translate3d(0,0,-220px) rotate3d(1,0,0,90deg);
	background:  class="ch-grid";
	opacity: 0;
}

.ch-info h3 {
	color: #fff;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 2px;
	font-size: 15px;
	margin: 0 15px;
	padding: 100px 0 0 0;
	height: 110px;
	text-shadow: 
		0 0 1px #fff, 
		0 1px 2px rgba(0,0,0,0.3);
}

.ch-info p {
	color: #fff;
	padding: 10px 5px;
	font-style: italic;
	margin: 30px;
	font-size: 14px;
	letter-spacing: 1px;
	border-top: 1px solid white;
}

.ch-info p a {
	display: block;
	color: white;
	font-style: normal;
	font-weight: 700;
	text-transform: uppercase;
	font-size: 12px;
	letter-spacing: 1px;
	padding-top: 4px;
	font-family: 'Open Sans', Arial, sans-serif;
}

.ch-info p a:hover {
	color: #fff222;
	color: rgba(255,242,34, 0.8);
}

.ch-item:hover .ch-info-front {
	-webkit-transform: translate3d(0,280px,0) rotate3d(1,0,0,-90deg);
	-moz-transform: translate3d(0,280px,0) rotate3d(1,0,0,-90deg);
	-o-transform: translate3d(0,280px,0) rotate3d(1,0,0,-90deg);
	-ms-transform: translate3d(0,280px,0) rotate3d(1,0,0,-90deg);
	transform: translate3d(0,280px,0) rotate3d(1,0,0,-90deg);
	opacity: 0;
}

.ch-item:hover .ch-info-back {
	-webkit-transform: rotate3d(1,0,0,0deg);
	-moz-transform: rotate3d(1,0,0,0deg);
	-o-transform: rotate3d(1,0,0,0deg);
	-ms-transform: rotate3d(1,0,0,0deg);
	transform: rotate3d(1,0,0,0deg);
	opacity: 1;
}