/* Formato Inicial */

* {
	margin:0;
	padding:0;
	border:0;
	box-shadow: 0;
	box-sizing: border-box;
	}



@font-face {
  font-family: 'Ubuntu', ;
  
}

.container {
  padding-right: 10px ;
  padding-left:10px ;
  width:98%;  
  
}

.containerlog {
  position:absolute;
  top:110px;
  padding-right: 10px ;
  padding-left:10px ;
  width:98%;  
  z-index:1;
}

.containerlog2 {
  position:absolute;
  top:110px;
  padding-right: 10px ;
  padding-left:10px ;
  width:98%;  
  z-index:10001;
}


.container-fluid  {
	margin-top:0px;
	margin-bottom:0px;
	margin-left:0px;
	margin-right:0px;
	padding-top:0px;
	padding-bottom:0px;
	padding-left:0px;
	padding-right:0px;
	}

body {
	background:rgb(245,245,245);
    color: rgb(57, 57, 57); 
	font-family: Ubuntu;
	font-size: 18px;
	text-align: center;
	font-weight:light;
    }
	


header {
	margin: 0;
	padding: 0;
	border:0;
	box-shadow: 0;
}

/* footer*/
	footer {
	background: rgb(40,40,40);
	color: rgb(120,120,120);
	text-align: center;
	margin:auto;
	}
	
.dark div{
  
  border-bottom:solid 1px rgb(120,120,120);
  width:100%;
  height:10px;
  
}	
	
@media (min-width: 1280px) {
	
footer .footeralign {
	
	text-align:left;

}	

footer .footeralign2 {
	
	text-align:left;
    
}	

}

@media (max-width: 1279px) {
	
footer .footeralign {
	
	text-align:center;

}	

footer .footeralign2 {
	
	text-align:center;
    
}	

}




footer .footerrow {
	

	
}
	
footer .container3 {
	
	margin:auto;
    width:80%;
}	
	
footer h2 {
	
	color:rgb(248,211,20);
	font-size:30px;
	
}	
	
footer h3 {
	
	color:White;
	font-size:15px;
	
}

footer a, footer p  {
	
	
	color:rgb(200,200,200);
	font-size:15px;
	
	
}


 footer i {
	 
	 color:rgb(200,200,200) !Important;
	 font-size:30px !Important;
	 
 }

 footer i:hover , footer a:hover {
	 
	 color:rgb(248,211,20) !Important;
	 
 }



 
 
	




h2{
	color: white;	
	font-size: calc(1em + 1.25vw);
	font-weight: normal;
	
	}
	
h3{
	color: rgb(57,57,57);	
	font-size: 24px;
	font-weight: normal;
	
	}	
	

h4{
	
color:rgb(57,57,57)	;
font-size: 20px;

	
	
}

h6 {
	
	color : rgb(248,211,20);
	font-size:60px;
	font-weight:bold;
	
}

.container1{


width: : 92%;
border: .5px solid ;
border-radius:5px;
border-color: rgb(220,220,220);
margin-top: 20px;
margin-bottom:20px;
margin-left:20px;
margin-right:20px;
padding-top:20px;
padding-left:20px;
padding-right:20px;
padding-bottom:20px;
-webkit-box-shadow: 0px 3px 10px 3px rgba(50,50,50,0.15); 
box-shadow: 0px 3px 10px 3px rgba(50,50,50,0.15);
margin: auto;
background:rgba(255,255,255,1);
}

.containerlog1{


max-width: 450px;
border: .5px solid ;
border-radius:5px;
border-color: rgb(220,220,220);
margin-top: 20px;
margin-bottom:20px;
margin-left:20px;
margin-right:20px;
padding-top:20px;
padding-left:20px;
padding-right:20px;
padding-bottom:20px;
-webkit-box-shadow: 0px 3px 10px 3px rgba(50,50,50,0.15); 
box-shadow: 0px 3px 10px 3px rgba(50,50,50,0.15);
margin: auto;
background:rgba(255,255,255,.8);
}



.container1gris{

width: : 92%;
border: .5px solid ;
border-radius:5px;
border-color: rgb(220,220,220);
margin-top: 20px;
margin-bottom:20px;
margin-left:20px;
margin-right:20px;
padding-top:20px;
padding-left:20px;
padding-right:20px;
padding-bottom:20px;
-webkit-box-shadow: 0px 3px 10px 3px rgba(50,50,50,0.15); 
box-shadow: 0px 3px 10px 3px rgba(50,50,50,0.15);
margin: auto;
background:rgba(245,245,245,1);

}



.container3{
	
	width:98%;
	margin:auto;
	
	
}

.container4{
	
	width:250px;
	margin:auto;
	
	
}




.btn-lg {
    border:0;
	background: rgb(248,211,20);
	
}


.principal {
	
	position: relative;
	z-index:1;
	
}

@media (min-width: 1280px) {
	
h2 {	
    
	color: white;	
	font-weight: normal;
	font-size: 40px;
	
	
}	
	


.slogan1 {
	
	display:block;
	position: absolute;
    top: 160px;
    left: 60px;
    height: 120px;
    text-align:left;
    z-index:1;
	
}

.slogan1 p {
	color: #ffffff;
	font-size:3vw; 
	padding: 10px 10px 10px 10px;
	margin-left:0px;	
	 
 }
 
 .slogan1 a {
	
	font-size:1.5vW;
	padding: 20px 20px 20px 20px;
	color:white;
	text-decoration:none;
	border: 1px solid white;
	border-radius:10px;
	
}



.slogan3 a {
	
	font-size:3vw;
	padding: 20px 50px 20px 50px;
	color:white;
	background: rgb(248,211,20);
	text-decoration:none;
	border: 1px solid rgb(248,211,20);
	border-radius:50px;
	-webkit-box-shadow: 0px 0px 35px 0px rgba(50,50,50,0.15); 
-moz-box-shadow: 0px 0px 35px 0px rgba(50,50,50,0.15);
box-shadow: 0px 0px 35px 0px rgba(50,50,50,0.15);
	
}

.slogan1 a:hover {
	
	color:rgb(57,57,57);
	border: 1px solid rgb(57,57,57);
	border-radius:10px;
}

.fotoprincipal2 ,  .slogan2 {
	
	display:none;
	
}

.textoprincipal2 {
	
	display:none  !Important;
	margin-left:5px;
}

}


.slogan3 a:hover {
	
	opacity: .8;
	
}

@media (max-width: 1279px) {
	
h2 {	
    
	color: white;	
	font-weight: normal;
	font-size: 20px;
	margin-left:20px;
    margin-right:20px;		
	
}	
	


.slogan2{
	
	display: block;
	position: absolute;
    top: 60px;
    left: 0px;
    height: 50px;
    z-index:1;
	text-align:center;
	
}

.slogan2 p {
	color: #ffffff;
	font-size:5vw;	 
	padding-top: 10px;
	padding-bottom:10px;
	margin:auto;	
	 
 }
 
 
 .slogan2 a {
	
	font-size:20px;
	padding: 20px 50px 20px 50px;
	color:white;
	text-decoration:none;
	border: 1px solid white;
	border-radius:10px;
	
}

.slogan2 a:hover {
	
	color:rgb(57,57,57);
	border: 1px solid rgb(57,57,57);
	border-radius:10px;
}

.slogan3 a {
	
	font-size:3vw;
	padding: 20px 50px 20px 50px;
	color:white;
	background: rgb(248,211,20);
	text-decoration:none;
	border: 1px solid rgb(248,211,20);
	border-radius:50px;
	-webkit-box-shadow: 0px 0px 35px 0px rgba(50,50,50,0.15); 
-moz-box-shadow: 0px 0px 35px 0px rgba(50,50,50,0.15);
box-shadow: 0px 0px 35px 0px rgba(50,50,50,0.15);
}
 
 
 
 

.fotoprincipal1 ,  .slogan1 {
	
	display:none;
	
}

.textoprincipal2 {
	
	display:block;
	
}

.fechamovil {
	
	
	height:50px;
	
}

}


 
 

	 
	 


.fa , .far, .fas, .fab {
	
	color: rgb(80,80,80);
}

.google1, .google1:hover {
	background:red;
	color:white;
	width:250px;
}

.facebook1, .facebook1:hover{
	background:#3b5998;
	color:white;
	width:350px;
	height:50px:
	border-radius:5px;
	
}

.user1{background: white;
width:250px;
	
}

.login1{
	color:white;
	padding: 20px 50px 20px 50px;
	border-radius:50px;
	border:0px !important;
	-webkit-box-shadow: 0px 0px 35px 0px rgba(50,50,50,0.15); 
-moz-box-shadow: 0px 0px 35px 0px rgba(50,50,50,0.15);
box-shadow: 0px 0px 35px 0px rgba(50,50,50,0.15);
}

.login1:hover {background:rgba(248,211,20,.8);}


.table1{

margin:auto;
padding:auto;
	
}

 .td1 {
	width:20px;
	padding-top:10px;
	padding-left:10px;
	padding-right:10px;
	padding-bottom:10px;
	text-align:center;
	
	
}

.td2 {
	width:250px;
	padding-top:10px;
	padding-left:10px;
	padding-right:10px;
	padding-bottom:10px;
}



.alert{


width: : 150px;
border: .5px solid ;
border-radius:15px;
border-color: rgb(120,120,120);
margin:auto;
margin-top:15%;
padding: 30px 20px 20px 30px;
-webkit-box-shadow: 10px 10px 5px -8px rgba(0,0,0,0.50);
-moz-box-shadow: 10px 10px 5px -8px rgba(0,0,0,0.50);
box-shadow: 10px 10px 5px -8px rgba(0,0,0,0.50);

}


.alert .fa-check-circle-o {
	color:green;
	
}

.alert .fa-times-circle-o {
	
	color:red;
	
}





.form-control{
	
	height:40px;
	
	
}


.titulo{
	margin-top:10px;
	margin-bottom:10px;
	margin-left:10px;
	margin-right:10px;
	padding-top:5px;
	padding-bottom:5px;
	padding-left:5px;
	padding-right:5px;
	
	
}


 
 
 .menu{	 
	 	 
	 
	 z-index:50  !important;	 
	
 } 
 
 .foto {
	
	margin-top:10px;
	margin-bottom:10px;
	margin-left:30px;
	margin-right:30px;
	z-index:50 !Important;
    width:150px;
	
}

.imgfoto {max-height:150px; max-width:150px;}


.foto1 {
	
	margin-top:10px;
	margin-bottom:10px;
	margin-left:30px;
	margin-right:30px;
	z-index:50 !Important;	
	
}


 
 
.cuatro a {
	
	color:white !Important;
	
	
} 


 
@media (min-width: 1280px) {
	  
	  
.cuatro {
	 z-index:1 !Important;
	 text-align:left;
	 	 
 }
 
 .ocho{
	 z-index:1 !Important;
	 text-align:right; 
	 
 }
	  	  
 }
 
 @media (max-width: 1279px) {
	  
	  
.cuatro {
	 z-index:1 !Important;
	 text-align:center;	  	 
 }
 
 .ocho{
	 z-index:1 !Important;
	 text-align:center;
	 margin:auto;
	
	 
 }
 
 .foto {
	display: flex;    
    justify-content: center;
	
}
 
	  	  
 }
 
 
 
 
 .loader {
  width: 70px;
  height: 70px;
  border: 10px solid rgb(57,57,57);
  border-top: 10px solid white;
  border-radius: 50%;
  animation-name: girar;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}
@keyframes girar {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
 
 .loader {
    position: fixed;
    left: 50%;
    top: 25%;
	margin-left:-35px;
    z-index: 9999;
    opacity: .8;
}

.slogan5  a {
width:80%;
height:80px;
font-size:20px;
padding-top:25px;
padding-bottom:25px;
padding-left:25px;
padding-right:25px;
background: rgb(248,211,20);
border-radius:50px;
color:white;
-webkit-box-shadow: 0px 0px 35px 0px rgba(50,50,50,0.55); 
-moz-box-shadow: 0px 0px 35px 0px rgba(50,50,50,0.55);
box-shadow: 0px 0px 35px 0px rgba(50,50,50,0.55);	

}

.slogan5 a:hover , .slogan5 a:focus , .slogan5 a:active { 

color:white ; 
text-decoration: none !Important; 
background: rgba(248,211,20,.8)!Important;

}


button .eye {
	
	
	 background:Transparent;
	 border:0;
	 text-decoration:none;
	 
	 
	 
	
	
	
}

 .eye{
	 background:transparent;
	 border:0;
	 text-decoration:none;
	 
	 
	 
	 
 }
 
 
 input[type="date"]:before {
    content: attr(placeholder) !important;
    color: #aaa;
    margin-right: 0.5em;
  }
  input[type="date"]:focus:before,
  input[type="date"]:valid:before {
    content: "";
  }
 
 
 .alerta {
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.5);
        opacity: 0;
        visibility: hidden;
        transform: scale(1.1);
        transition: visibility 0s linear 0.25s, opacity 0.25s 0s, transform 0.25s;
    }
    .alerta-contenido {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-color: white;
        padding: 1rem 1.5rem;
        width: 24rem;
        border-radius: 0.5rem;
		font-size:14px;
    }
    .alerta-cerrar {
        float: right;
        width: 1.5rem;
        line-height: 1.5rem;
        text-align: center;
        cursor: pointer;
        border-radius: 0.25rem;
        background-color: lightgray;
    }
    .alerta-cerrar:hover {
        background-color: darkgrey;
    }
    .alerta-mostrar {
        opacity: 1;
        visibility: visible;
        transform: scale(1.0);
        transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s;
    }
	
	
	.profile {
		
		font-size: 14px;
	    text-align: left;	
		
	}
	
	.profile a {
		
		text-decoration:none;
		color:rgb(80,80,80);
		
	}
	
	
	
	.hotere{
	
	margin: 5px 5px 5px 5px;	
	padding: 5px 10px 5px 10px;
	height:40px;
	border-radius:50px;
}

.hotere3{
	
	background:rgb(240,240,240);
}

.hotere2{
	
	margin: 5px 5px 5px 5px;	
	padding: 5px 5px 5px 5px;
	width:150px;
	height:50px;
}

.login2{
	
	color:white;
	margin: 5px 5px 5px 5px;	
	padding: 5px 10px 5px 10px;
	width:100px;
	border-radius:50px;
	height:40px;
	
	
}

.login2:hover{ background:rgba(248,211,20,.8) !Important;}


.s2 {		
	width:150px;
}

@media (min-width: 1280px) {


.s1 {
	display:block;
	
	
}}

@media (max-width: 1279px) {


.s1 {
	display:none;
	width:120px;
	
}}

	



.header1:after{
  content:"";
  width:100%;
  height:100%;
  position:absolute;
  bottom:0;
  left:0;
  z-index:-1;
 background: linear-gradient(to bottom, rgba(0,0,0,0.12) 40%,rgba(27,32,48,1) 100%);
}
.header1:before{
  content:"";
  width:100%;
  height:200%;
  position:absolute;
  top:0;
  left:0;
    -webkit-backface-visibility: hidden;
    -webkit-transform: translateZ(0); backface-visibility: hidden;
  scale(1.0, 1.0);
    transform: translateZ(0);
  background:#1B2030 url(http://pms.hsol.com.ar/images/foto15.png) 100% 0 ;
  background-size:100%;
  background-attachment:fixed;
  animation: grow 70s  linear 10ms infinite;
  
  z-index:-2
}


@keyframes grow{
  0% { transform: scale(1) translateY(0px)}
  40% { transform: scale(1.2) translateY(-10px)}
}	


button {
	
	button-decoration: none;
}

 a {
		
	text-decoration:none;
	
	
}






.navbar {
	
	
	margin-top: 0px;
	padding-left:20px;
	padding-right:20px;
	margin-bottom:10px;
	border-radius:0px;
}

.navbar-header{
	
	height:90px;
}

.navbar-toggle {
	
	margin-top:30px;
	
}

li { margin-left:5px; margin-right:5px; color;white;}

.navbar .li1 a {color:white !Important;}

.li3 a {border: 1px solid rgb(248,211,20);
border-radius:5px;
color: rgb(248,211,20) !Important;
}

.li3 a:hover {border: 1px solid rgb(248,211,20);
background:rgb(248,211,20) !Important;
border-radius:5px;
color: rgb(255,255,255) !Important;
}

.li1:hover {
	
	background:rgb(248,211,20);
	border-radius: 5px ;
}

.li2:hover{
	
	background:rgb(248,211,20);
	border-radius: 5px ;
	
}


/* Dropdown*/
.dropdown-menu {
	 background: rgba(0,0,0,1);
	 border-radius:0px;
	 
}

.dropdown-toggle {color:white !Important;}

.dropdown-toggle:active, .open .dropdown-toggle {
	background:rgb(248,211,20) !important; 
	color:#ffffff !important;
	border-radius: 5px ;
	}

	
	.dropdown-toggle:hover,
    .dropdown-toggle:active,
    .dropdown-toggle:focus	{
		
	background: rgb(248,211,20) !important; 
	color:#ffffff !important;
	border-radius: 5px ;
	}

.dropdown-menu > li > a {
  color: white;
  font-size:14px;
  padding-top:15px;
  padding-bottom:15px;
  
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  color: #ffffff;
  text-decoration: none;
  background-color: rgb(248,211,20);
  border-radius: 5px ;
}

.dropdown-toggle:hover {
	background:rgb(51,155;255);
	color:white !Important;
	border-radius: 5px ;
}

@media (min-width: 1280px) {
   
  .navbar-inverse .navbar-nav .open .dropdown-menu .divider {
    background-color: rgb(180,180,180);
}

ul {
	padding-top:20px;
	
}

}

@media (max-width: 1279px) {
   
  .navbar-inverse .navbar-nav .open .dropdown-menu .divider {
    background-color: rgb(180,180,180);
}

}

.search {
	
	background:rgb(230,230,230);	
	
}

.nohaydispo {display:none;}





.tabla2 td
{
margin-right:5px ;
margin-left:5px;
margin-top:5px;
margin-bottom:5px;
padding-left:5px;
padding-right:5px;
width:250px !Important;
	
}

.tabla2 a {
	
	color:white !important;
	text-decoration:none;"
	
}

.tabla2 {
text-align:right;	
	
}


.tablahk {
	
	border:1px solid black;
	text-align:center;
}

.tablahk {
	
border:1px solid black;	
	
}


.tablahk td {
	
	border:1px solid black;
	padding-left:10px;
	padding-right:10px;
	min-width:100px;
	
	
}

.nota { width: 450px;}


.tabla4 td {

	
	width:100px;
}

.cancel{
	
	background: firebrick !Important;
	
}

.cancel:hover {
	
	background: darkred !Important ;
	
	
}

.gris {
	
	background: rgb(220,220,200) !Important;
	
}

.red  i , .red  p{color:red; }

.green i {color: green;}

.largo {
	
	text-overflow: ellipsis;
	
}

.menucolor {
	
	color: #E1B80D;
	
}

.menucolor:hover, .menucolor:active , .menucolor:focus {
	
	color: #E1B80D;
	
}

.tabla4 {
	
	margin-left: 5px ;
	margin-right:5px;
	margin-top: 5px;
	margin-bottom: 5px;
	padding-left: 5px ;
    padding-right: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.tabla4 td , .tabla4 tr{
	
	margin-left: 5px ;
	margin-right:5px;
	margin-top: 5px;
	margin-bottom: 5px;
	padding-left: 5px ;
    padding-right: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
	
}

.tablafotofoto {
	
	border: 1px solid rgb(120,120,120) !Important;
	border-radius:5px;
	width:200px !Important;
	text-align:center;	
	margin-left: 5px ;
	margin-right:5px;
	margin-top:5px;
	margin-bottom:5px;
	padding-left: 5px ;
    padding-right:5px;
    padding-top:5px;
    padding-bottom:5px;
}

.tablafotodesc {
	
	
	width:200px !Important;
	text-align:center;	
	margin-left: 5px;
	margin-right: 5px;
	margin-top: 5px;
	margin-bottom: 5px;
	padding-left: 5px ;
    padding-right:5px;
    padding-top: 5px;
    padding-bottom: 5px;
	
}

.tablafotodel { 
width: 40px;
text-align:left;
margin-left: 5px ;
margin-right:5px;
margin-top:5px;
margin-bottom:5px;
padding-left: 5px ;
padding-right:5px;
padding-top:5px;
padding-bottom:5px;

	
}

.tabla4 a{ color: rgb(80,80,80) !Important;}


@media (min-width: 1280px) {
	
.header2{
  position:relative;
  overflow:hidden;
  display:flex;
  flex-wrap: wrap;
  justify-content: right;
  align-items: flex-start;
  align-content: flex-start;
  height:50vw;
  min-height:300px;
  max-height:800px;
  min-width:300px;
  width:100%;
  color:#eee;
}	
	

.parallax {
	
	height:450px;
	background: url(http://www.hsol.com.ar/cartapop/images/food.jpg) 100% 0;
	 background-size:100%;
	background-attachment: fixed; 


}


 
 


.encabezado {
position:retalive;
width:100%;
height:300px;
background: rgb(248,211,20);
background: linear-gradient(0deg, rgba(255,231,40,1) 0%, rgba(248,221,20,1) 100%);
	
}

.encabezado:after {
	 position:absolute;
	 width:100%;
	 height:500px;
	 content:'';
	 background: inherit;
	 top:0;
	 right:0;
	 bottom:0;
	 left:0;
	 transform-origin: top rigth;
	 transform: skewY(8deg);
	 
 }

.blackbox{
	
	background: rgb(6,6,6);
background: linear-gradient(90deg, rgba(6,6,6,1) 0%, rgba(20,58,87,1) 35%, rgba(96,7,58,1) 100%);
	margin-top:0px;
	margin-left:0px;
	height:600px;
	
	
}

.slogan{
	
	background: rgb(6,6,6);
background: linear-gradient(90deg, rgba(6,6,6,1) 0%, rgba(20,58,87,1) 35%, rgba(96,7,58,1) 100%);
	margin-top:0px;
	padding-top:20px;
	padding-bottom:20px;
	padding-right:50px;
	padding-left:20px;	
	text-align:left;
	height:200px;
}

.slogan:after {
	 position:absolute;
	 width:100%;
	 height:400px;
	 content:'';
	 background: inherit;
	 top:550px;
	 right:0;
	 bottom:0;
	 left:0;
	 transform-origin: top rigth;
	 transform: skewY(8deg);
	 z-index:-99;
	 -webkit-box-shadow: 0px 2px 5px 2px rgba(50,50,50,0.15); 
-moz-box-shadow: 0px 2px 5px 2px rgba(50,50,50,0.15);
box-shadow: 0px 2px 5px 2px rgba(50,50,50,0.15);
	 
 }
 
 .blackbox2 {height:50px;}




.slogan h1 {margin-left:50px; color:white;}

.imagen1 {
	
	display:block;
	position: absolute;
    margin-top:140px;
	margin-left:20px; 
    right:-480px;	
    z-index:10001;
	max-width:400px;
}

}


@media (max-width: 1279px) {
	
.header2{
  position:relative;
  height:450px;
  width:100%;
  text-align:center;
}	
	

.parallax {
	
	
	background: url(http://www.hsol.com.ar/cartapop/images/food.jpg) 300% 0;
	 background-size:300%;
	background-attachment: fixed ; 


}



.encabezado {
position:retalive;
width:100%;
height:450px;
background: rgb/248,211,20);
background: linear-gradient(0deg, rgba(255,231,40,1) 0%, rgba(248,211,20,1) 100%);
	
}

.encabezado:after {
	 position:absolute;
	 width:100%;
	 height:550px;
	 content:'';
	 background: inherit;
	 top:0;
	 right:0;
	 bottom:0;
	 left:0;
	 transform-origin: top rigth;
	 transform: skewY(8deg);
	 
 }



.blackbox{
	
	background: rgb(6,6,6);
background: linear-gradient(90deg, rgba(6,6,6,1) 0%, rgba(20,58,87,1) 35%, rgba(96,7,58,1) 100%);
	margin-top:0px;
	margin-left:0px;
	height:630px;
	
	
}

.slogan{
	
	background: rgb(6,6,6);
background: linear-gradient(90deg, rgba(6,6,6,1) 0%, rgba(20,58,87,1) 35%, rgba(96,7,58,1) 100%);
	margin-top:0px;
	padding-top:20px;
	padding-bottom:20px;
	padding-right:50px;
	padding-left:0px;	
	text-align:center;
	
	
}

.slogan:after {
	 position:absolute;
	 width:100%;
	 height:300px;
	 content:'';
	 background: inherit;
	 top:600px;
	 right:0;
	 bottom:0;
	 left:0;
	 transform-origin: top rigth;
	 transform: skewY(8deg);
	 z-index:-99;
	 -webkit-box-shadow: 0px 2px 5px 2px rgba(50,50,50,0.15); 
-moz-box-shadow: 0px 2px 5px 2px rgba(50,50,50,0.15);
box-shadow: 0px 2px 5px 2px rgba(50,50,50,0.15);
	 
 }
 
 .blackbox2 {height:50px;}


.slogan h1 {margin-left: 40px; color:white;}



.imagen1 {
	display:inline;
    max-width:200px;
	display:block;
	position: absolute;
	margin:auto;
    margin-top:260px;
		z-index:10001;
    
	
}

/* Centrar imagen en el medio--*/
.imagencontainer {
	display: flex;    
    justify-content: center;
}



}




.celeste{
	color: turquoise ;
	
}
.rosa{
	
	color: lightpink ;
}
.verde{
	color: lawngreen ;
	
}
.amarillo{
	 color: gold;	
	
}

.violeta{
	color: blueviolet ;
	
}
.naranja{
	
	color: darkorange;
}
.azul{
	color:  steelblue;
	
}
.rojo{
	 color: crimson ;	
	
}

.der{text-align:left;

border-right: 5px solid rgb(248,211,20);
}

.dere{text-align:right;


}


/* Carta Reversible*/
 
.contenedor-cards {
	height: 360px;
	width: 315px;
	margin:auto;
	-webkit-perspective: 800;
	margin-bottom:20px;
}

.carta {
	height: 100%;
	width: 100%;
	position: relative;
	transform-style: preserve-3d;
	transition: 2s;
	justify-content: center;
}

.carta:hover {
	transform: rotateY(180deg);
}

.lado {
	width: 100%;
	height: 100%;
	backface-visibility: hidden;
	position: absolute;
}

.frente {
	background: transparent;
}

.atras {
	background: transparent;
	transform: rotateY(180deg);
}

.contenedor-cards img {
	height:100%;
	width:100%;
}

 /*Fin Carta Reversible*/
 
 
 .header3{
	 
	 width:100%;
	 background:rgb(248,211,20);
 }
 
.contact1 {
	width:80px;
	max-width:80px;
	position: fixed;
	bottom: 10px;
	right: 20px ;
	z-index:100;	
	}	
	
.contact1:hover , .agranda:hover {
	 transition: all 1s;
	 transform: scale(1.1) !Important;
 }
 
 .contact1 {
	 transition: all 1s;
	 transform: scale(1) !Important;
 }
 
 
 
 
 .yellow {color:rgb(248,211,20);}
 
 
 @media (min-width: 992px) {
 
 .gratis{

min-height:400px;
background:rgba(255,255,255,.8);
width: 500px;
border: .5px solid ;
border-radius:5px;
border-color: rgb(255,255,255);
margin-top: 20px;
margin-bottom:20px;
margin-left:20px;
margin-right:20px;
padding-top:20px;
padding-left:20px;
padding-right:20px;
padding-bottom:20px;
-webkit-box-shadow: 0px 3px 10px 3px rgba(50,50,50,0.15); 
box-shadow: 0px 3px 10px 3px rgba(50,50,50,0.15);
margin: auto;
margin-bottom:40px;
}

.premium{

min-height:400px;
width: 500px;
border: .5px solid ;
border-radius:5px;
border-color: rgb(248,211,20);
background:rgb(248,211,20);
color: rgb(57,57,57);
margin-top: 20px;
margin-bottom:20px;
margin-left:20px;
margin-right:20px;
padding-top:20px;
padding-left:20px;
padding-right:20px;
padding-bottom:20px;
-webkit-box-shadow: 0px 3px 10px 3px rgba(50,50,50,0.15); 
box-shadow: 0px 3px 10px 3px rgba(50,50,50,0.15);
margin: auto;
margin-bottom:40px;
}

 }

@media (max-width: 991px) {

.premium , .gratis {max-width:300px;}

.gratis{


min-height:450px;
background:rgba(255,255,255,.8);
border: .5px solid ;
border-radius:5px;
border-color: rgb(255,255,255);
margin-top: 20px;
margin-bottom:20px;
margin-left:20px;
margin-right:20px;
padding-top:20px;
padding-left:20px;
padding-right:20px;
padding-bottom:20px;
-webkit-box-shadow: 0px 3px 10px 3px rgba(50,50,50,0.15); 
box-shadow: 0px 3px 10px 3px rgba(50,50,50,0.15);
margin: auto;
margin-bottom:40px;
}

.premium{



min-height:450px;
border: .5px solid ;
border-radius:5px;
border-color: rgb(248,211,20);
background:rgb(248,211,20);
color: rgb(57,57,57);
margin-top: 20px;
margin-bottom:20px;
margin-left:20px;
margin-right:20px;
padding-top:20px;
padding-left:20px;
padding-right:20px;
padding-bottom:20px;
-webkit-box-shadow: 0px 3px 10px 3px rgba(50,50,50,0.15); 
box-shadow: 0px 3px 10px 3px rgba(50,50,50,0.15);
margin: auto;
margin-bottom:40px;
}



}	



.container0{


width: : 92%;
border: .5px solid ;
border-radius:5px;
border-color: rgb(220,220,220);
margin-top: 20px;
margin-bottom:20px;
margin-left:20px;
margin-right:20px;
padding-top:20px;
padding-left:20px;
padding-right:20px;
padding-bottom:20px;
-webkit-box-shadow: 0px 3px 10px 3px rgba(50,50,50,0.15); 
box-shadow: 0px 3px 10px 3px rgba(50,50,50,0.15);
margin: auto;
background:rgba(255,255,255,.8);
}

.plantitulo {
font-weight:bold;

	
}

.plancosto {
font-weight:bold;
font-size:30px;
}

.planp{
text-align:left;	
}

.plancosto2 {
font-weight:bold;
font-size:20px;
}

.planp2{
text-align:left;	
font-size:14px;
}


.ventajas h3 {color:rgb(248,211,20);}
 
 
 .qr{ border:10px solid rgb(248,211,20);
 border-radius:5px;
 background:white;
 padding:10px;
 margin:5px 5px 5px 5px;
 }
 
 

 .box div {
height: 40px;
width: 40px;
position: absolute;
top: 10%;
left: 10%;
animation: animate 4s linear infinite;
background: rgba(255,255,255,0);
border: 5px solid rgba(255,255,255,.5);
border-radius: 0px;
z-index:1000;
}
.box div:nth-child(1) {
top: 20%;
left: 20%;
animation: animate 8s linear infinite;
}
.box div:nth-child(2) {
top: 26%;
left: 80%;
animation: animate 10s linear infinite;
}
.box div:nth-child(3) {
top: 80%;
left: 85%;
animation: animate 5s linear infinite;
}
.box div:nth-child(4) {
top: 65%;
left: 75%;
animation: animate 7s linear infinite;
}
.box div:nth-child(5) {
top: 90%;
left: 10%;
animation: animate 9s linear infinite;
}
.box div:nth-child(6) {
top: 30%;
left: 63%;
animation: animate 5s linear infinite;
}
.box div:nth-child(7) {
top: 70%;
left: 33%;
animation: animate 8s linear infinite;
}
.box div:nth-child(8) {
top: 75%;
left: 60%;
animation: animate 10s linear infinite;
}
.box div:nth-child(9) {
top: 23%;
left: 50%;
animation: animate 6s linear infinite;
}
.box div:nth-child(10) {
top: 35%;
left: 7%;
animation: animate 10s linear infinite;
}
@keyframes animate {
0% {
transform: scale(0) translateY(0) rotate(50deg);
}
100% {
transform: scale(1.6) translateY(-250px) rotate(360deg);
}
}
 
 
 .encabezadoh2 , .profile h2{color: rgb(248,211,20);}
 
 .pfoto {margin-left:30px;}
 
 .icon {
	 
	margin-top:15px;
    margin-bottom:15px;
	margin-left:5px;
	margin-right:5px;
	padding:10px;
	background:rgb(248,211,20);
	border-radius:100px;
	
	 
	 
 }
 
 .aterminos {color:rgb(120,120,120) !Important; font-size:14px !Important;}
 
 .pdemo {color:white;}
 
 /*Scroll*/
 
 .inline-photo {
  
  opacity: 0;
  transform: translateY(8em) translateX(0em) rotateZ(-0deg);
  transition: transform 3s .25s cubic-bezier(0,1,.3,1),
              opacity 1s .25s ease-out;
  
  will-change: transform, opacity;
}

.inline-photo.is-visible {
  opacity: 1;
  transform: rotateZ(-0deg);
}

header {
  opacity: 0;
  transition: opacity .5s .25s ease-out;
}

header.is-visible {
  opacity: 1;
}

.main-photo {
  transform: scale(.8);
}

.heading {
  transform: translate(-50%, calc(-50% + 1em));
}

.is-visible .main-photo {
  transform: none;
}

.is-visible .heading {
  transform: translate(-50%, -50%);
}

.main-photo,
.heading {
  transition: transform 4s .25s cubic-bezier(0,1,.3,1),
              filter 10s 2s ease-out;
  will-change: transform;
}
/* Fin Scroll */

.imgpres {margin:auto;}

/*Planes*/

.plantitle {
margin-top:0px;
margin-bottom:20px;
margin-left:0px;
margin-right:0px;
padding:10px 10px 10px 10px;
background:rgba(248,211,20,1);
color:rgb(57,57,57);
font-size:calc(.7em + 1vw);
font-weight:bold;
border-radius: 5px 5px 0px 0px ;
}

.planmensaje , .planmin , .planprecio{
font-size:24px;
font-weight:bold;
}

.planfacts {
font-size:16px;
}

.aplanstart , .aplandemo {
	
background:rgb(248,211,20);
color:rgb(57,57,57);
border-radius:50px;
text-decoration:none;
padding:5px 10px 5px 10px;
-webkit-box-shadow: 0px 0px 35px 0px rgba(50,50,50,0.55); 
-moz-box-shadow: 0px 0px 35px 0px rgba(50,50,50,0.55);
box-shadow: 0px 0px 35px 0px rgba(50,50,50,0.55);	
	
}

.aplanstart:hover , .aplandemo:hover {
	
text-decoration:none;
color:rgb(57,57,57);
background:rgba(248,211,20,.8);
}



.plandemo , .planstart { margin:20px 20px 20px 20px;}




/*Fin Planes*/

.inimg {display:inline-block ; margin:5px 5px 5px 5px ; border:1px solid black ;}