@import url(https://fonts.googleapis.com/css?family=Roboto+Slab:400,700,300);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,700);


/* Global Styles */

html,
body {
    height: 100%;
}
* {
    outline:0 !important;
}
body {    
    font-family: 'Roboto Slab', serif;    
    color: #fdfdfd;
}
img .antimoderate {
    display:inline-block;
}
.img-portfolio {
    margin-bottom: 30px;
}
.img-hover:hover {
    opacity: 0.8;
}
.page-header {
    padding-bottom: 9px;
    margin: 40px 0 50px;
    border-bottom: 1px solid #eee;
}
p {
    font-size: 17px;
}
.btn-default {
    font-family: 'Open Sans', sans-serif;
}
a:hover,
a:focus {
    text-decoration: none;
}
/*======== FREE EBOOK ===========*/
#free-ebook {    
    min-height: 90vh !important;
    background: url(../img/freebies-tu-pagina-web-gratis.jpg) center no-repeat;
    background-size: cover;    
}
#free-ebook .caption {    
    position: absolute;
    right: 15%;    
    left: 10%;
    z-index: 10;
    padding-top: 6%;
    padding-bottom: 8%;
    color: #fdfdfd;
    text-align: left;    
}
#free-ebook .caption img {
    zoom: 85%;
}
#free-ebook h2 {
    margin-top: 5px;
    font-size: 3.5em;
    text-transform: uppercase;
    font-weight: bold;
}
#free-ebook p {
    font-size: 1.5em;
}
#free-ebook .btn-default,
.descargar {
    background: #eeb42d;
    border-radius: 3px;
    color: #fff;
    font-weight: 700;
    padding: 1em 1.5em;
    font-size: 1.8em;
    margin: 1em 0;
    padding-top: .75em;
    padding-bottom: .75em;
    position: relative;
    text-transform: uppercase;
}
#free-ebook .btn-default:after {
    background: url(../img/arrow.png) center center no-repeat;
    background-size: contain;
    content: "";
    padding-top: 43px;
    position: absolute;
    right: -70px;
    top: -10px;
    width: 50px;
}
/* ========= MODAL ========*/
@media (min-width: 768px){
    .modal-dialog {
        width: 600px;
        margin: 30px auto;
    }
}
#myModal {
    color: #484848;
}
.upper-border {
    background: url('../img/pagina-web-gratis-guia-de-marketing-gratis-borde.jpg') repeat left;    
    height: 5px;    
}
#myModal .modal-content {    
    border-radius: 0px;
    padding: 0 15px 0 15px;
}
.modal-title {
    font-size: 1.7em;
    line-height: 30px;
    text-transform: uppercase;
}
#myModal .arrow-modal {
    margin-top: 20px;    
}
#myModal .col-sm-6 {
    padding: 0 0 0 6px;
}
#myModal input[type=text], 
input[type=email] {
    border: 1px solid black;
    width: 100%;
    height: 50px;
    margin-bottom: 10px;
    background-color: rgba(255,255,255,0.3);
    padding-left: 15px;    
    font-size: 17px;
    color: #000;
}
#myModal ::-webkit-input-placeholder {
   color: gray !important;
}
#myModal :-moz-placeholder { /* Firefox 18- */
   color: gray !important;  
}
#myModal ::-moz-placeholder {  /* Firefox 19+ */
   color: gray !important;  
}
#myModal :-ms-input-placeholder {  
   color: gray !important;  
}
#myModal .btn-default {
    background: #1ad8f4;
    border-radius: 3px;
    color: #fff;
    font-weight: 700;
    padding: 1em 1.5em;
    font-size: 1.2em;
    position: relative;
    text-transform: uppercase;
    border: transparent;
}
#myModal .guia {
    /*box-shadow: 5px 5px 5px #888888;*/
    margin-bottom: 30px;
}


/*========== NAVBAR ============*/
.navbar-inverse {
    background-color: transparent;
    border: none;
}
.navbar-inverse .navbar-nav>li>a {
    color: #fdfdfd;
}
.navbar-inverse .navbar-nav>.active>a, 
.navbar-inverse .navbar-nav>.active>a:focus, 
.navbar-inverse .navbar-nav>.active>a:hover {
    color: #fff;
    background-color: rgba(31, 227, 203, 0.95);
}
.navbar-brand {
    padding: 0px 15px;
}
/* ============Home Page Carousel========= */
header.carousel {
    height: 100%;
}
header.carousel .item,
header.carousel .item.active,
header.carousel .carousel-inner {
    height: 100%;
}
header.carousel .fill {
    width: 100%;
    height: 100vh !important;
    background-position: center;
    background-size: cover;
}
.carousel-caption {
    position: absolute;
    right: 15%;    
    left: 5%;
    z-index: 10;
    padding-top: 20px;
    padding-bottom: 10%;
    color: #fff;
    text-align: left;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .6);    
}
.carousel-caption h2 {
    font-size: 4.5em;
    line-height: 60px;
    font-weight: 700;
    font-family: 'Roboto Slab', serif;
    text-transform: uppercase;    
}
.carousel-caption .btn-default {
    height: 60px;
    background-color: #eeb42d;
    color: #fdfdfd;
    border: transparent;
    border-radius: 5px;
    width: 50%; 
    font-size: 20px;
    margin-top: 5px;
    text-transform: uppercase;
}
.carousel-caption .btn-default:after {
    background: url(../img/arrow.png) center center no-repeat;
    background-size: contain;
    content: "";
    padding-top: 450px;
    position: absolute;
    right: 45%;
    top: -10px;
    width: 50px;
}
.carousel-caption .btn-default:hover,
.carousel-caption .btn-default:focus {    
    background-color: #fdfdfd;
    color: #1fe3cb;    
}
.carrito-link {
  color: #fdfdfd;
  text-decoration: underline;
}
.carrito-link:hover,
.carrito-link:focus {
  color: #fff003;
  text-decoration: underline;
}
/*========== INTRO ===========*/
#intro {    
    padding: 0px 15px 20px;
    background: #fdfdfd;
    color: #282627 !important;
}
#intro h1 {
    margin-top: 50px;
    font-size: 4em;
    font-family: 'Roboto Slab', serif;
    text-transform: uppercase;
    font-weight: 700;    
    line-height: 50px;
    color: #3ec3d7;
}
#intro .main-sell {
    color: #908e8f;
    font-size: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #eee;
    margin-bottom: 30px;
}
#intro a {
  color: #3ec3d7;
}
#intro a:hover,
#intro a:focus {
  color: #37a3b3;
}
.logo-freebies-nav {
    float:right; 
    padding-top:12px; 
    zoom:85%;
}
#intro ul {
    list-style: none;    
    padding-left: 20px;
}
#intro .panel-default {
    border-color: transparent;
}
.panel-default>.panel-heading {    
    color: #282627 ;
    background-color: transparent;
    border-color: transparent;
    text-align: center;
    text-transform: uppercase;
}
#intro .panel-default>.panel-heading .fa{
    padding: 5px;
}
#intro .panel-default>.panel-heading h4{
    font-size: 24px;
}
.panel {
    margin-bottom: 20px;
    background-color: transparent;
    border: transparent;
    border-radius: 4px;
    
    font-size: 18px;
}
#intro .btn-default {
    height: 40px;
    background-color: #3ec3d7;
    color: #fdfdfd;
    border: transparent;
    border-radius: 5px;    
    font-size: 16px;
    margin-top: 30px;
    font-weight: bold;
    margin-left: 15%;    
    width: 70%;
}
#intro .btn-default:hover,
#intro .btn-default:focus {    
    background-color: #eeb42d;
    color: #fdfdfd;    
}
#intro .porciento {
    width: 80%;
    padding-top: 3%;
}
#intro .porciento:after {
    background: url(../img/arrow.png) center center no-repeat;
    background-size: contain;
    content: "";
    padding-top: 450px;
    position: absolute;
    right: 10%;
    top: 25px;
    width: 50px;
}
#intro span {
    color: #ff0048;
    font-weight: bold;
}
.close-popup {
    cursor: pointer;
}
/*========== TESTIMONIAL ===========*/
#testimonial {            
    margin-bottom: 150px;        
    color: #282627 !important;
}
#testimonial blockquote {
  font-style: italic;
  margin-top: 15%; 
}
#testimonial h4 {
    margin-left: 15px;
    padding-bottom: 5px;
    border-bottom: 1px solid #fdfdfd;
}
#testimonial .previews {
    margin-bottom: 40px;
    text-align: center;   
}
#testimonial ul {
    list-style: none;    
}
#testimonial ul li {
    display: inline;
}
#testimonial .btn-default {
    height: 80px;
    background-color: #eeb42d;
    color: #fdfdfd;
    border: transparent;
    border-radius: 10px;
    width: 60%;    
    font-size: 20px;
    margin-top: 5px;
    text-transform: uppercase;
    font-weight: bold;    
}
#testimonial .btn-default:hover,
#testimonial .btn-default:focus {    
    background-color: #fdfdfd;
    color: #1fe3cb;    
}
.last-call {    
    text-align: center;
    margin-top: 50px;
}
#testimonial a {
  color: #f16334;
}
#testimonial a:hover,
#testimonial a:focus {
  color: #282627;
}

/*============== CTA =================*/
#cta {
    margin-top: 80px;
    margin-bottom: 60px;    
    padding-top: 40px;
    padding-bottom:  200px;
    color: #282627 !important;
    text-align: center;
}
#cta .btn-default {
    height: 80px;
    background-color: #90d13e;    
    color: #fdfdfd;
    border: 2px solid #fdfdfd;
    border-radius: 5px;    
    font-size: 20px;
    margin-top: 30px;
    font-weight: bold;    
    width: 60%;
}
#cta .btn-default:hover,
#cta .btn-default:focus {    
    background-color: #eeb42d;
    color: #fdfdfd;    
}
/*============ CONTACT ===============*/
#contact {    
    padding: 50px 0 100px;
    background: url('../img/freebie-crear-pagina-web-gratis-4.jpg') no-repeat center;
    background-size: cover;
    min-height: 100vh !important;
    color: #fdfdfd;
}
#contact h2 {
    font-size: 4.5em;
    font-family: 'Roboto Slab', serif;
    text-transform: uppercase;
    font-weight: 700;    
    text-align: right;
    line-height: 60px;
}
input[type=text], 
input[type=email] {
    border: none;
    width: 100%;
    height: 50px;
    margin-bottom: 10px;
    background-color: rgba(255,255,255,0.3);
    padding-left: 15px;    
    font-size: 17px;
    color: #fdfdfd;
}
textarea {
    width: 100%;
    height: 150px;
    background-color: rgba(255,255,255,0.3);
    border: none;
    padding-left: 15px;
    padding-top: 10px;    
    font-size: 17px;
    color: #fdfdfd;
}
::-webkit-input-placeholder {
   color: #fdfdfd;   
}
:-moz-placeholder { /* Firefox 18- */
   color: #fdfdfd;   
}
::-moz-placeholder {  /* Firefox 19+ */
   color: #fdfdfd;   
}
:-ms-input-placeholder {  
   color: #fdfdfd;   
}
#contact .btn-default,
#contact .btn-default:active {
    height: 50px;
    color: #1bcfe1;
    font-size: 20px;
    text-transform: uppercase;
    background-color: #fdfdfd;
    border: none;
    width: 100%;
    margin-right: auto; 
    margin-left: auto;
    margin-top: 10px;
    margin-bottom: 50px;
}
#contact .btn-default:hover,
#contact .btn-default:focus {
    color: #1fe3cb;        
    background-color: #fdfdfd;    
}
/* ============Footer Styles ==========*/
#footer {
    height: 150px !important;
    background-color: #1c181d;
    padding-top: 50px;
    text-align: center;
}
/*====================================*/
.intro {
    margin: 20px auto 80px auto;    
    width: 70%; 
}
/*========== TEMPLATES ===========*/
.navbar-templates {
    background-color: #282627;
}
#templates {    
    padding: 50px 0 170px;    
    color: #282627 !important;
}
#templates h2 {
    font-size: 4.5em;
    font-family: 'Roboto Slab', serif;
    text-transform: uppercase;
    font-weight: 700;    
    text-align: right;
    border-bottom: 1px solid #fdfdfd;
    line-height: 60px;
    color: #3ec3d7;
    letter-spacing: -1px;
}
#templates .row {
    margin: 0px;
}
#templates span {
    color: #3ec3d7;
}
#templates .thumbnails{
    list-style:none;
}
#templates .label-primary {
    background-color: transparent;
}
#templates .thumbnails li{
    margin-left:0 !important;
}
#templates .thumbnail{
    background:none;
    margin-bottom: 1px;
}
#templates .thumbnails{
    padding-left:0px;
}
#templates .thumbnails li img:hover{
    opacity:.5;
    transition:all ease-in .5s;
}
#templates .pics-ul{    
    margin: 10px auto 30px 1.5%;    
    width: 100%;
    padding: 0 !important;
}
#templates .pics-ul li{
    color:#FFF;    
}
#templates .pics-ul li:hover{
    color:#99D4A5 !important;
}
.design-buttons {
    padding-left: 1%;
}
#templates .btn-default {
    height: 40px;
    background-color: #90d13e;
    color: #fdfdfd;
    border: transparent;    
    font-size: 16px;
    margin-top: 5px;
    font-weight: bold;    
    margin-bottom: 15px;
    text-transform: uppercase;
    width: 49%;
}
#templates .btn-default:hover,
#templates .btn-default:focus {    
    background-color: #eeb42d;
    color: #fdfdfd;    
}
#templates .btn-primary {
    height: 40px;
    background-color: #3ec3d7;
    color: #fdfdfd;
    border: transparent;    
    font-size: 16px;
    margin-top: 5px;
    font-weight: bold;    
    margin-bottom: 15px;
    text-transform: uppercase;
    width: 49%;
}
#templates .btn-primary:hover,
#templates .btn-primary:focus {    
    background-color: #eeb42d;
    color: #fdfdfd;    
}
#templates .stars {
    float: right;
    color: #ffc600;
    margin-bottom: 30px;    
}
#templates a {
  color: #282627 !important;;
}
#templates .nav-pills>li.active>a, 
#templates.nav-pills>li.active>a:focus, 
#templates .nav-pills>li.active>a:hover {
   background-color: #1bcfe1;
   color: #fdfdfd !important; 
}
#templates .nav-pills>li>a:hover {
   background-color: rgba(255,255,255,0.5);   
}
.hovereffect { 
  overflow: hidden;
  position: relative;
  text-align: center;
  cursor: default;
  background: rgba(255,255,255,0.8);  
}
.hovereffect .overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  overflow: hidden;
  top: 0;
  left: 0;
  padding: 20%;
}
.hovereffect img {
  display: block;
  position: relative;
  max-width: none;
  width: calc(100% + 20px);
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: translate3d(-10px,0,0);
  transform: translate3d(-10px,0,0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.hovereffect:hover img {
  opacity: 0.4;
  filter: alpha(opacity=40);
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}
.hovereffect a, .hovereffect button {
  color: #FFF !important;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: translate3d(100%,0,0);
  transform: translate3d(100%,0,0);
}
.hovereffect:hover a, .hovereffect:hover button {
  opacity: 1;
  filter: alpha(opacity=100);
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}
.hovereffect .btn-danger {
    width: 90%;
    height: 50px;
    font-size: 16px;    
    background-color: #f16334;
    border: none;    
    border-radius: 10px;
    color: #fdfdfd !important; 
}
#templates .overlay a {
    color: #fdfdfd !important;
}
/*===============PLAN ================*/
#plan {    
    padding: 50px 0 170px;    
    background: #fdfdfd;
    color: #282627 !important;
}
#plan .page-header {
    text-align: right;
    color: #3ec3d7;
}
#plan .intro {
    margin-bottom: 
}
#plan .clickTitle {
    display: none;
}
#plan h2 {
    font-size: 6.5em;
    font-family: 'Roboto Slab', serif;
    text-transform: uppercase;
    font-weight: 700;
    line-height: 55px;    
    border-bottom: 1px solid #fdfdfd;
    letter-spacing: -1px;
}
#plan .span-plan {
    color: #3ec3d7;
    font-weight: bold;
}
#plan .span-plan-pro {
    color: #f42156;
    font-weight: bold;
}
#plan .thumbnail{
    background:none;    
}
#plan .dropdown a {
    color: #000;
    text-align: center;
}
#plan .ahorro {    
    padding: 0em 0.9em .2em 2.5em;
}
#plan .dropdown-menu {
 width: 100%;
}
#plan .dropdown-menu a span{
    font-weight: bold;
}
#plan .btn-default,
#plan .btn-default:active {
    height: 50px;    
    font-size: 17px;
    text-transform: uppercase;
    color: #fdfdfd;
    background-color: #f42156;
    border: none;
    border-radius: 5px;    
    margin-bottom: 15px;
}
#plan .btn-default:hover {
    background-color: #3ec3d7;
}
#plan a {
    color: #fdfdfd;
}
#plan a:active,
#plan a:focus {
    color: #fdfdfd;
    opacity: 1;
}
#plan .strong-plan {
    font-weight: bold;
}
#plan #promocion span {
    border-bottom: 1px solid #fdfdfd;
}

/*============== MAIL ================*/
#mail {    
    padding: 50px 0 170px;    
    background: #fdfdfd;
    color: #282627 !important;
}
#mail h2 {
    font-size: 4.5em;
    font-family: 'Roboto Slab', serif;
    text-transform: uppercase;
    font-weight: 700;
    line-height: 60px;
    text-align: right;
    border-bottom: 1px solid #fdfdfd;
    color: #3ec3d7;
    letter-spacing: -1px;
}
#mail span {
    color: #3ec3d7;
}
#mail input:before {
    background: url(../img/right-arrow.png) center center no-repeat;
    background-size: contain;
    content: "";   
    padding-top: 34%; 
    position: absolute;
    left: 10%;
    top: 35%;
    width: 50px;
}
#mail h3 {
    margin-top: 0px;
    font-size: 14px;
    padding-bottom: 10px;
    line-height: 20px;
}
#mail .thumbnail{
    background:none;    
}
#mail p {
    padding-left: 30px;
}
#mail .mail {
    width: 70%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 80px;
}
#mail .panel-default>.panel-heading {    
    color: #282627;
    background-color: transparent;
    border-color: #ddd;
    text-align: center;
    text-transform: uppercase;
}
#mail .panel-default>.panel-heading .fa{
    padding: 5px;
}
#mail .panel-default>.panel-heading h4{
    font-size: 24px;
}
#mail .panel {
    margin-bottom: 20px;
    background-color: transparent;
    border: 1px solid transparent;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
    box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
    font-size: 18px;
}
#mail input[type=email],
#mail input[type=text] {
    border: 1px solid #e4e4e4;
    width: 100%;
    height: 50px;
    margin-bottom: 10px;
    background-color: #fdfdfd;
    padding-left: 15px;    
    font-size: 17px;
    color: #282627;
}
#mail ::-webkit-input-placeholder {
   color: #bfbfbf !important;
   font-size: 14px;
}
#mail :-moz-placeholder { /* Firefox 18- */
   color: #bfbfbf !important;  
   font-size: 14px;
}
#mail ::-moz-placeholder {  /* Firefox 19+ */
   color: #bfbfbf !important;  
   font-size: 14px;
}
#mail :-ms-input-placeholder {  
   color: #bfbfbf !important;  
   font-size: 14px;
}
#mail .btn-default {
    height: 50px;
    background-color: #3ec3d7;
    color: #fdfdfd;
    border: transparent;
    border-radius: 5px;
    font-size: 16px;
    margin-top: 5px;
    font-weight: bold;
    width: 100%;
    margin-bottom: 15px;
    text-transform: uppercase;
}
#mail .btn-default:hover,
#mail .btn-default:focus {    
    background-color: #eeb42d;
    color: #fdfdfd;    
}
#mail .panel-heading h4 {
    margin-top: 0px;
}
.loader {
  font-size: 3px;
  margin: 15px 10px;  
  width: 1em;
  height: 1em;
  border-radius: 50%;
  position: relative;
  text-indent: -9999em;
  float: left;
  -webkit-animation: load4 1.3s infinite linear;
  animation: load4 1.3s infinite linear;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}
@-webkit-keyframes load4 {
  0%,
  100% {
    box-shadow: 0 -3em 0 0.2em #ffffff, 2em -2em 0 0em #ffffff, 3em 0 0 -1em #ffffff, 2em 2em 0 -1em #ffffff, 0 3em 0 -1em #ffffff, -2em 2em 0 -1em #ffffff, -3em 0 0 -1em #ffffff, -2em -2em 0 0 #ffffff;
}
12.5% {
    box-shadow: 0 -3em 0 0 #ffffff, 2em -2em 0 0.2em #ffffff, 3em 0 0 0 #ffffff, 2em 2em 0 -1em #ffffff, 0 3em 0 -1em #ffffff, -2em 2em 0 -1em #ffffff, -3em 0 0 -1em #ffffff, -2em -2em 0 -1em #ffffff;
}
25% {
    box-shadow: 0 -3em 0 -0.5em #ffffff, 2em -2em 0 0 #ffffff, 3em 0 0 0.2em #ffffff, 2em 2em 0 0 #ffffff, 0 3em 0 -1em #ffffff, -2em 2em 0 -1em #ffffff, -3em 0 0 -1em #ffffff, -2em -2em 0 -1em #ffffff;
}
37.5% {
    box-shadow: 0 -3em 0 -1em #ffffff, 2em -2em 0 -1em #ffffff, 3em 0em 0 0 #ffffff, 2em 2em 0 0.2em #ffffff, 0 3em 0 0em #ffffff, -2em 2em 0 -1em #ffffff, -3em 0em 0 -1em #ffffff, -2em -2em 0 -1em #ffffff;
}
50% {
    box-shadow: 0 -3em 0 -1em #ffffff, 2em -2em 0 -1em #ffffff, 3em 0 0 -1em #ffffff, 2em 2em 0 0em #ffffff, 0 3em 0 0.2em #ffffff, -2em 2em 0 0 #ffffff, -3em 0em 0 -1em #ffffff, -2em -2em 0 -1em #ffffff;
}
62.5% {
    box-shadow: 0 -3em 0 -1em #ffffff, 2em -2em 0 -1em #ffffff, 3em 0 0 -1em #ffffff, 2em 2em 0 -1em #ffffff, 0 3em 0 0 #ffffff, -2em 2em 0 0.2em #ffffff, -3em 0 0 0 #ffffff, -2em -2em 0 -1em #ffffff;
}
75% {
    box-shadow: 0em -3em 0 -1em #ffffff, 2em -2em 0 -1em #ffffff, 3em 0em 0 -1em #ffffff, 2em 2em 0 -1em #ffffff, 0 3em 0 -1em #ffffff, -2em 2em 0 0 #ffffff, -3em 0em 0 0.2em #ffffff, -2em -2em 0 0 #ffffff;
}
87.5% {
    box-shadow: 0em -3em 0 0 #ffffff, 2em -2em 0 -1em #ffffff, 3em 0 0 -1em #ffffff, 2em 2em 0 -1em #ffffff, 0 3em 0 -1em #ffffff, -2em 2em 0 0 #ffffff, -3em 0em 0 0 #ffffff, -2em -2em 0 0.2em #ffffff;
}
}
@keyframes load4 {
  0%,
  100% {
    box-shadow: 0 -3em 0 0.2em #ffffff, 2em -2em 0 0em #ffffff, 3em 0 0 -1em #ffffff, 2em 2em 0 -1em #ffffff, 0 3em 0 -1em #ffffff, -2em 2em 0 -1em #ffffff, -3em 0 0 -1em #ffffff, -2em -2em 0 0 #ffffff;
}
12.5% {
    box-shadow: 0 -3em 0 0 #ffffff, 2em -2em 0 0.2em #ffffff, 3em 0 0 0 #ffffff, 2em 2em 0 -1em #ffffff, 0 3em 0 -1em #ffffff, -2em 2em 0 -1em #ffffff, -3em 0 0 -1em #ffffff, -2em -2em 0 -1em #ffffff;
}
25% {
    box-shadow: 0 -3em 0 -0.5em #ffffff, 2em -2em 0 0 #ffffff, 3em 0 0 0.2em #ffffff, 2em 2em 0 0 #ffffff, 0 3em 0 -1em #ffffff, -2em 2em 0 -1em #ffffff, -3em 0 0 -1em #ffffff, -2em -2em 0 -1em #ffffff;
}
37.5% {
    box-shadow: 0 -3em 0 -1em #ffffff, 2em -2em 0 -1em #ffffff, 3em 0em 0 0 #ffffff, 2em 2em 0 0.2em #ffffff, 0 3em 0 0em #ffffff, -2em 2em 0 -1em #ffffff, -3em 0em 0 -1em #ffffff, -2em -2em 0 -1em #ffffff;
}
50% {
    box-shadow: 0 -3em 0 -1em #ffffff, 2em -2em 0 -1em #ffffff, 3em 0 0 -1em #ffffff, 2em 2em 0 0em #ffffff, 0 3em 0 0.2em #ffffff, -2em 2em 0 0 #ffffff, -3em 0em 0 -1em #ffffff, -2em -2em 0 -1em #ffffff;
}
62.5% {
    box-shadow: 0 -3em 0 -1em #ffffff, 2em -2em 0 -1em #ffffff, 3em 0 0 -1em #ffffff, 2em 2em 0 -1em #ffffff, 0 3em 0 0 #ffffff, -2em 2em 0 0.2em #ffffff, -3em 0 0 0 #ffffff, -2em -2em 0 -1em #ffffff;
}
75% {
    box-shadow: 0em -3em 0 -1em #ffffff, 2em -2em 0 -1em #ffffff, 3em 0em 0 -1em #ffffff, 2em 2em 0 -1em #ffffff, 0 3em 0 -1em #ffffff, -2em 2em 0 0 #ffffff, -3em 0em 0 0.2em #ffffff, -2em -2em 0 0 #ffffff;
}
87.5% {
    box-shadow: 0em -3em 0 0 #ffffff, 2em -2em 0 -1em #ffffff, 3em 0 0 -1em #ffffff, 2em 2em 0 -1em #ffffff, 0 3em 0 -1em #ffffff, -2em 2em 0 0 #ffffff, -3em 0em 0 0 #ffffff, -2em -2em 0 0.2em #ffffff;
}
}
#divDominio {
    margin-left: 5%;
    padding: 5px 0px;
}
/* ============== FAQ ============*/
#success .panel-default>.panel-heading {
    color: #fdfdfd;
    font-weight: bold;
}
/*============== SUCCESS ================*/
#success {    
    padding: 50px 0 170px;
    background: url('../img/freebie-crear-pagina-web-gratis-5.jpg') no-repeat center;
    background-size: cover;    
}
#success h2 {
    font-size: 3.5em;
    line-height: 50px;
    font-family: 'Roboto Slab', serif;
    text-transform: uppercase;
    font-weight: 700;    
    text-align: left;
    border-bottom: 1px solid #fdfdfd;
    margin-top: 60px;
}
#success a {
    color: #00fcff;
}
/*======== CONFIRMAR SUSCRIPCION ==========*/
#confirmar-suscripcion {    
    height: 100vh;
    padding: 50px 0 170px;
    background: url('../img/freebies-tu-pagina-web-gratis.jpg') no-repeat center;
    background-size: cover;    
}
#confirmar-suscripcion h2 {
    font-size: 3.5em;
    line-height: 50px;
    font-family: 'Roboto Slab', serif;
    text-transform: uppercase;
    font-weight: 700;    
    text-align: left;
    border-bottom: 1px solid #fdfdfd;
    margin-top: 60px;
}
#confirmar-suscripcion .page-header {
    margin-bottom: 30px;
}
#confirmar-suscripcion a {
    color: #ffde16;
}

::-moz-selection { 
    background: #00d8ff;
    color: #fdfdfd;
}
::selection { 
    background: #00d8ff; 
    color: #fdfdfd;
}












/* 404 Page Styles */
.error-404 {
    font-size: 100px;
}
/* Pricing Page Styles */
.price {
    display: block;
    font-size: 50px;
    line-height: 50px;
}
.price sup {
    top: -20px;
    left: 2px;
    font-size: 20px;
}
.period {
    display: block;
    font-style: italic;
}
.googlemaps {
   background:transparent; 
   position:relative; 
   width:100%;
   height:300px; /* your iframe height */
   top:300px;  /* your iframe height */
   margin-top:-300px;  /* your iframe height */
}






/*================= MEDIA QUERIES =================*/
/*================= MEDIA QUERIES =================*/
/*================= MEDIA QUERIES =================*/
/*================= MEDIA QUERIES =================*/
/*================= MEDIA QUERIES =================*/
/*================= MEDIA QUERIES =================*/
/*================= MEDIA QUERIES =================*/





@media(max-width:1400px) {
    /*======== FREE EBOOK ===========*/    
    #free-ebook .caption {
        left: 5%;
    }
    #free-ebook .caption img {
        zoom: 80%;
    }
    #free-ebook h2 {
        margin-top: 5px;
        font-size: 3em;        
    }
    #free-ebook p {
        font-size: 1.3em;
    }     
}

@media(max-width:991px) {
    .customer-img,
    .img-related {
        margin-bottom: 30px;
    }
}
@media(max-height:768px) and (min-width: 769px) {
    .modal-title {
        font-size: 1.6em;
    }
    #myModal p {
        font-size: 16px;
    }    
    .modal-dialog {
        width: 600px;
        margin: 10px auto;    
    }
}
@media(max-width:768px) {
    html,
    body {
        max-width: 100% !important;

    }
    /*======== FREE EBOOK ===========*/
    #free-ebook {    
        min-height: 100vh !important;        
        background: url(../img/freebies-tu-pagina-web-gratis.jpg) center no-repeat;
        background-size: cover;        
    }
    #free-ebook .caption {       
        right: 10%;
        left: 5%;       
    }
    #free-ebook .caption img {
        zoom: 60%;
    }
    #free-ebook h2 {
        font-size: 1.7em;
        margin-top: 10%; 
    }
    #free-ebook p {
        font-size: 1.2em;
    }
    #free-ebook .btn-default {        
        font-size: 1.2em;
        padding: 1em 0.75em;        
    }    
    #free-ebook .btn-default:after {        
        visibility: hidden;
    }
    /* ========= MODAL ========*/        
    #myModal .modal-content {            
        padding: 0 5px 0 5px;
    }
    .modal-title {
        font-size: 1.4em;
        line-height: 25px;
    }
    #myModal p {
        font-size: 1.1em;
    }
    #myModal .arrow-modal {
        margin-top: 20px;    
    }
    #myModal input[type=text], 
    input[type=email] {      
        margin-left: 0px;      
    }  
    /* ========= NAVBAR ==========*/
    .navbar {
        margin-bottom: 0px;
    }
    .navbar-inverse {
        background-color: rgba(31, 227, 203, 0.8);
        border: none;    
    }
    .img-portfolio {
        margin-bottom: 15px;
    }
    .page-header {
        margin: 40px 0 30px;
    }
    .page-header img {
        zoom: 50%;
    }
    .navbar-brand {
        zoom: 60%;
        padding-top: 5px;
    }
    .carousel-caption h2 {
        font-size: 35px;
        line-height: 40px;    
        letter-spacing: -3px;
    }
    .carousel-caption p {
        font-size: 16px;
    }
    .carousel-caption .btn-default {
        height: 40px;        
        font-size: 16px;
        margin-top: 5px;
        width: 110%;        
    }
    .carousel-caption .btn-default:after {
       visibility: hidden;
   } 
   .carousel-caption .btn-default .fa {
       visibility: hidden;
   } 

   /*============= BARRA LOGO FREEBIES ==============*/
   .logo-freebies-nav {
    float:right; 
    padding-top:17px; 
    zoom:75%;
}

   /*========== INTRO ===========*/    
   #intro h1 {
    font-size: 40px;   
    line-height: 40px;
}    
#intro .btn-default,
#intro .btn-default:active {    
            
    font-size: 14px;
    height: 50px;
    margin-top: 20px;
}
#intro .porciento {
    padding-top: 15px;
}    
#intro .porciento:after {    
    visibility: hidden;        
}
#intro .panel-heading .fa {
    zoom: 40%;
}
/*===== TESTIMONIAL ========*/
#testimonial h2 {
    font-size: 40px;    
    line-height: 40px;   
}    
#testimonial .btn-default,
#testimonial .btn-default:active {    
    width: 100%;    
    font-size: 14px;
    height: 50px;
    width: 90%;   
}
#testimonial .btn-default .fa {
    visibility: hidden;
}
#testimonial ul {
    list-style: none;    
    padding-left: 0;
}
/*============ CTA ==============*/
#cta {
    width: 90%;    
    margin: 40px auto 60px auto;    
    padding-top: 40px;
    padding-bottom:  100px;    
}
#cta .btn-default {     
    width: 100%;
    font-size: 16px;
}
/*============ CONTACT ===============*/
#contact .row {    
    margin: 0px;
}
#contact h2 {
    font-size: 35px;    
    line-height: 40px;    
}
#contact .col-xs-12 {
    padding: 0px;
}
input[type=text], 
input[type=email] {    
    width: 90%;
    margin-left: 5%;    
}
textarea {
    width: 90%;
    margin-left: 5%;     
}
#contact .btn-default,
#contact .btn-default:active {   
    width: 90%;    
    margin-left: 5%;    
}
#contact .btn-default:hover,
#contact .btn-default:focus {
    color: #1fe3cb;        
    background-color: #fdfdfd;    
}
/*======== CONFIRMAR SUSCRIPCION ==========*/
#confirmar-suscripcion {    
    height: auto;
    padding: 50px 0 170px;    
}
/*========== DESCARGA =============*/
.descargar {    
    font-weight: 700;
    padding: 1em 1.5em;
    font-size: 1em;
    margin: 1em 0;
    padding-top: .75em;
    padding-bottom: .75em;
    position: relative;
    text-transform: uppercase;
}
/*====================================*/
.intro {
    margin: 20px auto 80px auto;    
    width: 100%; 
}
/*========== TEMPLATES ===========*/    
#templates h2 {
    font-size: 40px;
    line-height: 40px;
}
#templates .pics-ul {
  margin: 0px auto 0px auto;
}
#templates .pics-ul li{    
    margin: 0px auto 0px 0%;    
    width: 100%;
    text-align: center;
    padding: 0 !important;
}  
#templates .btn-default,
#templates .btn-default:active {
    height: 40px;        
    font-size: 14px;
    margin-bottom: 10px;   
    width: 100%;
}
#templates .btn-primary,
#templates .btn-primary:active {
    height: 40px;        
    font-size: 14px;
    margin-bottom: 10px;   
    width: 100%;
}
.hovereffect .btn-danger {    
    height: 40px;
    font-size: 14px;    
}
/*===============PLAN ================*/
#plan h2 {
    font-size: 40px;        
    line-height: 40px;     
}
#plan .thumbnail{
    background:none;    
}
#plan .clickTitle {
    margin-top: 15px;
    color: #282627;
    text-align: center;
    font-size: 14px;
    display: block;     
}
#plan .ahorro {
    width: 100%;
    margin-top: 80px;
    padding: 0em 0.9em .2em 0.9em;
}
/*============== MAIL ================*/
#mail h2 {
    font-size: 40px;        
    line-height: 40px;      
}
#mail h3 {
    font-size: 18px;
    padding-bottom: 10px;
}
#mail .thumbnail{
    background:none;    
}
#mail p {
    padding-left: 0px;
}
#mail small {
    font-size: 13px;
}
#mail .mail {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 80px;
}
#mail input[type=email],
#mail input[type=text] {        
    width: 100%;       
    margin:0px;
    font-size: 13px;
}
#mail input:before {
    visibility: hidden;
}
/*============== SUCCESS ================*/    
#success h2 {
    font-size: 40px;        
    letter-spacing: -3px;        
}
#success small {
    font-size: 13px;
}
}
@media (max-width:350px) {
/*======== FREE EBOOK ===========*/
    #free-ebook {    
        min-height: 100vh !important;        
        background: url(../img/freebies-tu-pagina-web-gratis.jpg) center no-repeat;
        background-size: cover;        
    }
    #free-ebook .caption {               
        right: 10%;
        left: 5%;       
    }    
    #free-ebook h2 {
        font-size: 1.4em;
        margin-top: 5%; 
    }
    #free-ebook p {
        font-size: 1.2em;
    }
    #free-ebook .btn-default {        
        font-size: 1em;
        padding: 0.9em 1em;        
    }    
    #free-ebook .btn-default:after {        
        visibility: hidden;
    }
    
}
