::selection { background-color: #fe01cd; color: white; }
::-moz-selection { background-color: #fe01cd; color: white; }


body {
	background-color:#fff;
	font-size: 10px;	
	margin: 0;
	color: #24015f
}

a, a:active, a:visited {
	color:  #00edc1;
	background-color: transparent;
	font-weight: bold;

}

section .container{
	min-height: 600px; 
}



.bg-gray{
	background-color: #f5f5f5;
}

.bg-blue{
	background-color: #24015f;
}

.bg-blue input[type="text"],
.bg-blue input[type="password"]{
	color: #fff !important;
	border-bottom: 1px solid #8911c0;
}

.bg-green{
	background-color: #00edc1;
}

.padding-large{
	padding: 20px 40px;
}

h1,h2,h3,h4,h5,label, .btn{
	font-family: 'Raleway';
	font-weight: 800;
	/* text-transform: uppercase; */
}

h1{
	color: #00edc1;
	font-size: 4em;
}

h2{
	font-size: 3em;
}
h3, h4{
	font-size: 2em;
}

h2,h3{
	color: #fe01cd
}

h2{
	font-size: 3em;
}

h5{
	font-size: 1.5em;
	text-transform: uppercase;
}

header{
	background-color: #24015f;
	background-image: url("../img/public-header-bg.jpg");
	height: 150px;
}

header nav{
	background: none;
}

header h3{
	position: relative;
	top: -25px;
	left: 50px;
	margin: 0;
}

footer {
	min-height: 170px;
	padding: 30px;
}

footer a,
footer a:link,
footer a:visited{
	color: #fff;
	text-transform: none !important;
}

p{
	font-size: 1.4em;
}

fieldset{
	padding: 30px;
	border-radius: 5px;
	/* background-color: rgba(255,255,255,.2); */
}

input[type="text"],
input[type="number"]{
	/* text-transform: uppercase; */
	font-family: 'Raleway';
	font-weight: 800;
	font-size: 1.2em;
	color: #222

}

input[type="submit"]{
	background-color: #00edc1;
	border: none;
	/* padding: 20px 40px; */
	font-size: 1.3em;
	text-transform: uppercase;
	font-family: 'Raleway';
	font-weight: 800;
}

[type="checkbox"]:not(:checked), [type="checkbox"]:checked {
    position: revert; 
    left: revert;
     opacity: revert;
}


/* plans */

.plan{
	border: 1px solid #8911c0;
	border-radius: 5px;
	margin: 15px;
	padding: 30px;
	height: 280px;
}

.plan h1,
.plan h2{
	color: #fff;
}

.plan h1, .plan h2, .plan h3, .plan h4{
	margin: 2px;
}

.plan h4{
	color: #00edc1
}

a.btn{
	background-color: #00edc1 !important;
	margin: 5px;
	color: #fff;
}

a.btn.big{
	padding: 10px 30px;
    height: auto;
    font-size: 2em;
}

.btn.pink{
	border: 1px solid #8911c0;
	background-color:#8911c0 !important;
}
input[file="file"]{
	width: 0.1px;
	height: 0.1px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	z-index: -1;
}

a.btn, 
a.btn:active, a.btn:visited
a.btn-sm:active, a.btn-sm:visited,
a.btn-md:active, a.btn-md:visited
{
	border: 1px solid #00edc1;
	border-radius: 2px;
	font-size: 12px;

}
/*  */

.benefit{
	background-color: #00edc1;
	border-radius: 5px;
	margin: 15px;
	padding: 15px 30px;
	font-weight: bold;
	min-height: 160px;
}

.benefit h3{
	color:#fff
}

fieldset.access{
	background-color: none  !important;
	border: 1px solid #8911c0;
	color: #fff
}


.access h2{
	margin: 40px 0 0 0;
	
}

.access h3{
	margin:  0 0 40px 0;

	color: #fff
}

#demo p{
	margin: -20px 0 50px 0;
}

#demo fieldset{
	background: white;

}
#descargas h1{
	margin: 30px 0 0 0;
}
#descargas h5{
	margin: -5px 0 0 0;
}
#planes{
	color: #76578d;
	
}
#benefits{}
#register{
	
}

nav{
	background: none !important;
	box-shadow: none;
	text-transform: uppercase;
	font-size: 10px;
}

 .qr img{
	 width: 90%;
	 height: auto;
 }

 .btn, .btn-large {
	background: #8911c0;


 }

.file-field .inputfile {
	background: #8911c0;
    position: absolute;
    top: 0;
    /* right: 0; */
    left: 0;
    /* bottom: 0; */
    width: 100%;
    margin: 0;
    padding: 0;
    font-size: 20px;
    /* cursor: pointer; */
    opacity: .10;
    filter: alpha(opacity=0);
    height: 70%;
}

.file-path-wrapper{
	opacity: 0;
	height:0;
	/* display: none */
}



/* phone */

.phone{
	height: 600px;
	/* background: black; */
	position: relative;
	top: -75px;
	background-image: url("../img/iphone.svg");
	background-repeat: no-repeat;
min-height: 600px;
width: 300px;
/* border: 1px solid red; */
margin: 0 auto;
}
.screen{
	background-color: #fff;
	width: 320px;
	height: 480px;
	position: relative;
	top: 75px;
	left: 20px;
	width: 260px;
	height: 460px;
	text-align: center;
}

.screen .card .card-content{
	padding:10px
}

.screen .row{
	margin:5px 2px;
	border-bottom: 1px solid #eee
}

.screen img{
	width: 100%;
	border-radius: 5px;
	max-height: 100px;
	margin: 4px
}

.screen h2{
	margin: 0;
	position: relative;
	top: 120px;
	color: #fff;
	font-size: 20px;

}

.screen h3{
	text-align: left;
	/* text-transform: uppercase; */
	font-weight: 800;
	font-size: 16px;
	margin: 10px 0 0 0;
	color: #24015f;
}

.screen h4{
	text-align: left;

	text-transform: uppercase;
	font-weight: 800;
	font-size: 16px;
	color: #fe01cd;
	margin: 0
}

.screen p{
	display: block;
	margin: 4px 0 !important;
	text-align: left;
	font-size: .8rem;
	color: #888
}

.screen .product{
	padding: 10px 0;
}

.product-preview{
	background: #eee;
	padding: 10px 0;

}

.errors{
	padding: 10px; color: #8911ff
}

.bg-blue ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	color:#8911ff;
	opacity: 1; /* Firefox */
  }
  
  .bg-blue :-ms-input-placeholder { /* Internet Explorer 10-11 */
	color: #8911ff;
  }
  
  .bg-blue ::-ms-input-placeholder { /* Microsoft Edge */
	color: #8911ff;
  }



  /*  fixes */

  @media only screen and (max-width: 768px) {

	h1{
		font-size: 2rem;
	}
	h3{
		font-size: 1.2rem;
	}
	/* For mobile phones: */
	.padding-large {
	  padding: 10px 0.75rem; !important;
	  
	}
	.phone{
		top: 0;
		margin: 3rem auto;
	}

	.btn, .btn-large, .btn-flat {
		
		padding: 0 1rem;
	}


  }

  @media only screen and (max-width: 380px) {
	.phone{
		background-image: none;
		width: auto;
	}
	.screen{
		width: auto;
		left:0
	}
  }