/**
 * ========================================
 * CONSUMIDOR
 * ========================================
 */
 /*
 1.- Demo
 2.- Call To Action 
 3.- Registro
 */


/**
 * ========================================
 * MOBILE FIRST and globals
 * ========================================
 */
body { 
  background-image: url("../images/bg2.jpg"); 
  background-size: cover;
  background-attachment: fixed;
  background-repeat: no-repeat;
}

/* DEMO */
.screens {
  position: fixed;
  left: -10%;
  top: 50%;
  z-index: 10;
  margin-top: -100px;
  width: auto;
  height: auto;
  margin-left: 0;
}

.section {
  height: 631px;
}
.holder {
  display: none;
}
.wrap .box,
.wrap {
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}
.box h1 {
  font-size: 20px;
  font-weight: 600;
}
.box p {
  font-size: 14px;
}


/* Lista con íconos */
ul.dash-list {
  list-style: none;
  margin-left: -20px;
}
li.dash-list-item {
  height: auto;
}
li.dash-list-item p {
  padding-top: 5px;
  padding-left: 46px;
}
.dash-preview {
  width: 100%;
  min-width: 300px;
  max-width: 600px;
}
.dash-full {
  display: block;
}
.bg-8 {
  min-height: 631px;
  height: 100%;
}


/* DOTS MENU SIDER */
.dots-menu {
  position: fixed;
  top: 300px;
  left: -18px;
  visibility: hidden;
  z-index: 1000;
  list-style: none;
}
.dots-menu li {
  height: 12px;
  width: 12px;
  list-style: none;
  margin-bottom: 10px;
}
.dots-menu a {
  height: 12px;
  width: 12px;
  border: 1px solid black;
  border-radius: 50%;
  list-style: none;
  margin-bottom: 5px;
  display: block;
}
.dots-menu a.active {
  background-color: black;
}
.dots-menu li a:hover,
.dots-menu li a:focus {
  overflow: hidden;
  background-color: #30aee5;
  -webkit-transition: background 0.3s ease;
  transition: background 0.3s ease;
}

/* Contact xs space */
.registro_xs {
  margin-left: 33.33333333%;
}


/* Call to action */
.call-to {
  background-image: url("../images/call-to-client.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center top;
  color: white;
  height: auto;
  width: 100%;
  z-index: 2000;
}
.call-back {
  background-color: rgba(48, 174, 229, 0.8);
  padding: 20px;
  height: inherit;
}

/* Regístrate */
.registrate {
  background-color: white;
}


/* Desktop */
@media ( min-width: 768px ) {
  /* DEMO */
    .phone-back {
      background: url(../images/hand-mockup.png) top no-repeat;
      width: 800px;
      height: 1000px;
      background-size: 100%;
      position: fixed;
      margin-left: -309px;
      top: 53%;
      margin-top: -270px;
      left: 50%;
    }
    .screens {
      position: fixed;
      left: 50%;
      top: 53%;
      overflow: hidden;
      z-index: 10;
      margin-top: -192px;
      width: 232px;
      height: 407px;
      margin-left: 170px;
      border-radius: 3px;
    }

    .section {
      min-height: 631px;
      padding-top: 140px;
    }
    .holder {
      display: none;
    }

    .wrap .box,
    .wrap {
        -webkit-transition: 0.5s;
        -o-transition: 0.5s;
        transition: 0.5s;
    }
    .box {
        font-family: 'Roboto', sans-serif;
        text-align: left;
        line-height: 26px;
        font-weight: 400;
        font-style: normal;
        color: #111;
        font-size: 15px;
        padding-left: 40px;
    }
    .box h1 {
      font-size: 50px;
      font-weight: 300;
    }
    .box p { margin: 15px 0 }

    /*buttons*/

    .appstore {
        background: url(../images/appstore.png);
        height: 21px;
        width: 17px;
        margin-top: 2px;
        float: left;
    }
    /*.appstore-button:hover .appstore { background: url(../images/appstore2.png) }*/
    .playstore {
        background: url(../images/playstore.png);
        height: 20px;
        width: 17px;
        margin-top: 2px;
        float: left;
    }
    /*.playstore-button:hover .playstore { background: url(../images/playstore2.png) }*/
    .simple-button {
        font-size: 16px;
        font-family: 'Raleway', sans-serif;
        font-weight: 700;
        border-radius: 4px;
        color: #ffffff;
        min-width: 130px;
        margin-right: 10px;
        text-decoration: none;
        padding: 12px 25px;
        margin-top: 25px;
        float: left;
        -webkit-transition: 0.3s;
        -o-transition: 0.3s;
        transition: 0.3s;
        background: #30AEE5 ;
    }
    .simple-button:hover {
        color: #fff;
        background: #2669DF;
    }

    /* Contact xs space */
    .registro_xs {
      margin-left: 0;
    }

}


/* Desktop 1300px and more */
@media ( min-width: 1300px ) {
  /* DEMO */
    /* Backgrounds de secciones */
    body { 
    background-image: url("../images/bg2.jpg"); 
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
    }

    .phone-back {
      background: url(../images/hand-mockup.png) top no-repeat;
      width: 800px;
      height: 1000px;
      background-size: 100%;
      position: fixed;
      margin-left: -209px;
      top: 53%;
      margin-top: -270px;
      left: 50%;
    }
    .screens {
      position: fixed;
      left: 50%;
      top: 53%;
      overflow: hidden;
      z-index: 10;
      margin-top: -192px;
      width: 232px;
      height: 407px;
      margin-left: 270px;
      border-radius: 3px;
    }
    .dots-menu ul li {
      list-style: none;
    }
    .dots-menu {
      position: fixed;
      top: 300px;
      left: 20px;
      visibility: hidden;
    }
    .section {
      height: 631px;
      padding-top: 150px;
    }
    .holder {
      display: none;
    }

    .wrap .box,
    .wrap {
        -webkit-transition: 0.5s;
        -o-transition: 0.5s;
        transition: 0.5s;
    }
    .box {
        font-family: 'Roboto', sans-serif;
        text-align: left;
        line-height: 26px;
        font-weight: 400;
        font-style: normal;
        color: #111;
        font-size: 15px;
        padding-left: 40px;
    }
    .box h1 {
      font-size: 50px;
      font-weight: 300;
    }
    .box p { margin: 15px 0 }

    /*buttons*/

    .appstore {
        background: url(../images/appstore.png);
        height: 21px;
        width: 17px;
        margin-top: 2px;
        float: left;
    }
    /*.appstore-button:hover .appstore { background: url(../images/appstore2.png) }*/
    .playstore {
        background: url(../images/playstore.png);
        height: 20px;
        width: 17px;
        margin-top: 2px;
        float: left;
    }
    /*.playstore-button:hover .playstore { background: url(../images/playstore2.png) }*/
    .simple-button {
        font-size: 16px;
        font-family: 'Raleway', sans-serif;
        font-weight: 700;
        border-radius: 4px;
        color: #ffffff;
        min-width: 130px;
        margin-right: 10px;
        text-decoration: none;
        padding: 12px 25px;
        margin-top: 25px;
        float: left;
        -webkit-transition: 0.3s;
        -o-transition: 0.3s;
        transition: 0.3s;
        background: #30AEE5 ;
    }
    .simple-button:hover {
        color: #fff;
        background: #2669DF;
    }




    /* Call to action */
    .call-to {
      height: 200px;
      width: 100%;
      z-index: 250;
    }
    .call-back {
      background-color: rgba(48, 174, 229, 0.8);
      padding: 10px;
      height: inherit;
    }

    /* Regístrate */
    .registrate {
      background-color: white;
    }

    /* Contact xs space */
    .registro_xs {
      margin-left: 0;
    }
    
}