/*

Theme Name: BCU EDUCA
Theme URI: http://triciclo.com.uy/
Author: Triciclo
Author URI: http://triciclo.com.uy/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 7.3
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: bcueduca
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

*/

/*****************************
  Typography
*****************************/

@font-face {
    font-family: 'Gotham-Book';
    src: url('fonts/gotham/Gotham-Book.woff2') format('woff2'),
        url('fonts/gotham/Gotham-Book.woff') format('woff');
    /*font-weight: 600;*/
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Gotham-Light';
    src: url('fonts/gotham/Gotham-Light.woff2') format('woff2'),
        url('fonts/gotham/Gotham-Light.woff') format('woff');
    /*font-weight: 600;*/
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Anton';
    src: url('fonts/anton/Anton-Regular.woff2') format('woff2'),
        url('fonts/anton/Anton-Regular.woff') format('woff');
    /*font-weight: 600;*/
    font-weight: normal;
    font-style: normal;
}


*{
    margin: 0;
    padding: 0;
}

body{
    /*background-color: #e1e1e1; */
    background-color: #f7f0eb;
    /*background-image: url('images/panel.png');*/
    /*border: 30px solid #eee;*/
    height: 100vh;
    font-family: 'Anton';
    font-size: 0.9rem;
}

.font-textos{
    font-family: 'Gotham-Book';
    font-size: 1.2rem;
}

.mySwiper .btn{
    font-family: 'Gotham-Book';
    font-size: 1rem;
}

.signature {
    position: absolute;
    bottom: 20px;
    left: 20px;
}

.signature a {
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    color: #0cb9d8;
    text-decoration: none;
}

.box-area {
    width: 100%;
    /*height: 80vh;*/
    display: flex;
    justify-content: center;
    align-items: center;
    /*background-color: black;*/
}

.box {
    width: 50vw;
    height: 70vh;
    margin-right: 2px;
    overflow: hidden;
    /*border-radius: 20px;*/
    position: relative;
    transition: all linear 0.6s;
    margin-bottom: -70px;
}
.box:hover {
filter: grayscale(100%);
}

.box:last-child{
    margin-right: 0;
}

.box::before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    /*background: rgba(0, 0, 0, 0.3);*/
}

.box img {
    width: 100%;
    height: 80%;
    object-fit: cover;
}

.box i{
    width: 40px;
    /*height: 40px;*/
    border-radius: 50%;
    text-align: center;
    line-height: 40px;
    /*background: #fff;*/
    position: absolute;
    top: 5vh;
    left: 10px;
    font-size: 20px;
}

.box:nth-child(1) i{
    color: #ff5200;
}
.box:nth-child(2) i{
    color: #ca470a;
}
.box:nth-child(3) i{
    color: #00d9ff;
}
.box:nth-child(4) i{
    color: #0077ff;
}

.box h2 {
    position: absolute;
    top: 3.5vh;
    left: 60px;
    font-family: 'Poppins', sans-serif;
    font-size: 25px;
    color: #f6f6f6;
    font-weight: 600;
    opacity: 0;
    transition: all linear 0.3s;
}

.box p {
    position: absolute;
    top: 10vh;
    left: 60px;
    font-family: 'Poppins', sans-serif;
    font-size: 15px;
    font-weight: 400;
    color: #f6f6f6;
    opacity: 0;
    transition: all linear 0.3s;
}

.box.active h2{
    opacity: 1;
}

.box.active p{
    opacity: 1;
}

.box.active{
    width: 100vw;
    transition: all linear 0.3s;
}

.active_button{
    /*width: 100vw;*/
    /*opacity: 0.5;*/
    background: black!important;
    transition: all linear 0.3s;
}




/*menu*/


.menu{
    /*
    position: absolute; 
    z-index:11000; 
    right: 50vw; 
    top: 53px;
    width: 70px;
    */
    cursor: pointer;

    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 4%;
    margin-top: 30px;
}

.menu_lang{
    position: absolute; 
    z-index:11000; 
    right: 100px; 
    top: 60px;
    width: 100px;
    cursor: pointer;
}

.cerrar_menu{
    position: absolute; 
    right:65px; 
    width: 40px;
    top: 63px;
    cursor: pointer;
}

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  /*background-color: #333;*/
}

li {
  /*float: left;*/
}

li a {
    font-size: 40px;
  display: block;
  color: #666;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none!important;
  border-radius: 5px;
}

li a:hover:not(.active) {
    color: white;
    /*background-color: #e1e1e1;
    border-radius: 5px;
    text-decoration: overline!important;*/
}

.active_item {
  background-color: #04AA6D;
}

.logo{
  padding: 30px;
}

ul.topnav {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #333;
}

ul.topnav li {float: left;}

ul.topnav li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

ul.topnav li a:hover:not(.active) {background-color: #111;}

ul.topnav li a.active {background-color: #04AA6D;}

ul.topnav li.right {float: right;}

footer{
    /*
    color: #fffff!important;
    padding:0px 0 150px 0;
    margin-top: 50px;
    */
}

.footer_ini{
    color:#1a1a1a; 
    font-size: 14px;
}

.footer{
    /*padding: 250px 0 600px 0;*/
    padding-top: 200px;
    color:#ffffff; 
    font-size: 14px;
    height: 500px;
    background-color:#1c1c1c;
}

.line_hidden{
    display: none;
}
.image_hidden{
    display: none;
}

.navbar-expand-lg .navbar-collapse {
  display: contents!important;
}

/*Triciclo*/

.loader { 
  width: 100%; height: 100%; background: white; position: fixed; top: 0px; left: 0px; z-index: 1; 
}
.loader .inner { 
  width: 100%; height: 100%; background: url('images/loader.gif') center center no-repeat; 
}

.inicio{
    height:50vh;
}

.title_big_sec{
    line-height: 70px;
    font-family: 'Gotham-Light';
}
.text_card{
    /*line-height: px;*/
    font-family: 'Gotham-Light';
    font-size: 1.6rem;
}

.title_big{
    margin-top: 5vh;
    margin-top: 0vh; 
    font-size: 180px;
}
.title_big1{
    margin-top: 2vh;
    margin-top: 0vh; 
    font-size: 180px;
}
.title_big2{
    margin-top: 2vh;
    margin-top: 0vh; 
    font-size: 180px;
}

.text-card{
    font-family: Anton!important; 
    font-size: 80px; 
    color: white;
}
.text-card.small{
    font-family: Anton!important; 
    font-size: 50px; 
    color: white;
}
.text-card.small2{
    font-family: Anton!important; 
    font-size: 40px; 
    color: white;
}

.line {
  width: 100%;
  max-width: 800px;
  height: 8px;
  margin: 0 0 10px 0;
  position: relative;
  display: inline-block;
  background-color: rgba(255,255,255,1);
}

.title_theme_big{
    margin-top: 2vh;
    margin-top: 0vh; 
    font-size: 180px!important;
}
.title_theme_small{
    margin-top: 2vh;
    margin-top: 0vh; 
    font-size: 180px!important;
}

    .boxed-border{
        border-radius:25px; 
        padding:20px;
    }

.boxed-card{
    border: 3px solid #fff; 
    width:100%; ; 
    padding:30px;

    background-color: rgb(10, 145, 215);
    z-index: 1;
    transform: rotate(-3.00023deg);
    translate: none;
    rotate: none;
    scale: none;

}

.boxed-card2{
    border: 3px solid #fff; 
    width:100%; ; 
    padding:30px;

    background-color: #F85F25;
    z-index: 1;
    transform: rotate(-3.00023deg);
    translate: none;
    rotate: none;
    scale: none;

}


/* Not great browser support :(
html {
  scroll-behavior: smooth;
} 
*/
nav {
    position: fixed;
    border-radius: 15px;
    top: 10px;
    right: 40%;
    background: black;
    padding: 0px 10px;
    width: 436px;
    left: 30%;
    z-index: 1000;
}

nav a {
  color: white;
  font-size: 1.3em;
  line-height: 1.7;
  text-decoration: none;
}
nav a:hover {
  text-decoration: underline;
}

nav a.active {
  color: red;
}

.navbar-nav {
    margin: 0 auto !important;
    margin-top: 200px!important;
}

/*Tarjetas****************************/
.spacer {
  height: 100vh;
}

.cards {
  position: relative;
}

.custom-card {
  position: relative;
  width: 30%;
  height: 80%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 50px;
  border-radius: 30px;
  box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.2);
}

/*Tarjetas****************************/



h1, h2 {
  font-weight: 400;
  max-width: none;
}

.comparisonSection {
  position: relative;
  padding-bottom: 56.25%; /* to maintain aspect ratio (responsive!) */
}
.comparisonImage {
  width: 100%;
  height: 100%;
}
.afterImage {
  position: absolute;
  overflow: hidden;
  top: 0;
  transform: translate(100%, 0px);
}
.afterImage img {
  transform: translate(-100%, 0px);
}
.comparisonImage img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
}


.line-1{
  height: 450px;
  background-color: #DE3948;
}




/* Video Youtube **********************************************/
.tablet_wrapper {
  width: 100%;
  border: 2.125rem solid #444;
  border-radius: 3.75rem;
  justify-content: center;
  align-items: center;
  /*margin-bottom: 5rem;*/
  display: flex;
  position: relative;
  overflow: hidden;
  margin: 50px 0px 50px 0px;
}











.scroller {
  height: 100vh;
}

.orange {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  height: 100vh;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: #F85F25;
}

.text {
  color: #fff;
}

.black {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  height: 100vh;
  -webkit-justify-content: space-around;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: #FBC503;
}

.black2 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  height: 100vh;
  -webkit-justify-content: space-around;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: #39C09B;
}

.black3 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  height: 100vh;
  -webkit-justify-content: space-around;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: #F36F9A;
}

.black4 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  height: 100vh;
  -webkit-justify-content: space-around;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: #6376A2;
}

.black5 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  height: 100vh;
  -webkit-justify-content: space-around;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: #F76025;
}

.black6 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  height: 100vh;
  -webkit-justify-content: space-around;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: #9A79DE;
}

.blue1 {
  padding:70vh 0;
  /*background-color: #212529;*/
}


.text-wrap {
  position: relative;
  overflow: hidden;
  /*width: 450px;*/
  width: 55%;
  height: 80vh;
}


/* Tema 1 ************************************************/
.panel-text {
  position: absolute;
  /*left: 0%;
  top: 0%;
  right: 0%;*/
  bottom: 0%;
  /*z-index: 1;*/
  width: 80%;
  height: 100%;
  font-size: 15px;
  /*text-transform: uppercase;*/
  font-weight: 900;
  /*text-align:center;*/
  border-radius: 25px;
  /*background-color: #070707;*/
  left: 10vw;
  
  transform:translateY(100%);
  opacity: 0;
}

.panel-text.blue-text {
  color: blue;
}

.panel-text.red-text {
  color: red;
}

.panel-text.purple-text {
  color: purple;
}

.panel-text.orange-text {
  color: orange;
}
/* Tema 1 ************************************************/

/* Tema 2 ************************************************/
.panel-text2 {
  position: absolute;
  /*left: 0%;
  top: 0%;
  right: 0%;*/
  bottom: 0%;
  z-index: 1;
  width: 80%;
  height: 100%;
  font-size: 15px;
  /*text-transform: uppercase;*/
  font-weight: 900;
  text-align:center;
  border-radius: 25px;
  /*background-color: #070707;*/
  left: 10vw;
  
  transform:translateY(100%);
  opacity: 0;
}

.panel-text2.blue-text {
  color: blue;
}

.panel-text2.red-text {
  color: red;
}

.panel-text2.purple-text {
  color: purple;
}

.panel-text2.orange-text {
  color: orange;
}
/* Tema 2 ************************************************/

/* Tema 3 ************************************************/
.panel-text3 {
  position: absolute;
  /*left: 0%;
  top: 0%;
  right: 0%;*/
  bottom: 0%;
  z-index: 1;
  width: 80%;
  height: 100%;
  font-size: 15px;
  /*text-transform: uppercase;*/
  font-weight: 900;
  text-align:center;
  border-radius: 25px;
  /*background-color: #070707;*/
  left: 10vw;
  
  transform:translateY(100%);
  opacity: 0;
}

.panel-text3.blue-text {
  color: blue;
}

.panel-text3.red-text {
  color: red;
}

.panel-text3.purple-text {
  color: purple;
}

.panel-text3.orange-text {
  color: orange;
}
/* Tema 3 ************************************************/

/* Tema 4 ************************************************/
.panel-text4 {
  position: absolute;
  /*left: 0%;
  top: 0%;
  right: 0%;*/
  bottom: 0%;
  z-index: 1;
  width: 80%;
  height: 100%;
  font-size: 15px;
  /*text-transform: uppercase;*/
  font-weight: 900;
  text-align:center;
  border-radius: 25px;
  /*background-color: #070707;*/
  left: 10vw;
  
  transform:translateY(100%);
  opacity: 0;
}

.panel-text4.blue-text {
  color: blue;
}

.panel-text4.red-text {
  color: red;
}

.panel-text4.purple-text {
  color: purple;
}

.panel-text4.orange-text {
  color: orange;
}
/* Tema 4 ************************************************/

/* Tema 5 ************************************************/
.panel-text5 {
  position: absolute;
  /*left: 0%;
  top: 0%;
  right: 0%;*/
  bottom: 0%;
  z-index: 1;
  width: 80%;
  height: 100%;
  font-size: 15px;
  /*text-transform: uppercase;*/
  font-weight: 900;
  text-align:center;
  border-radius: 25px;
  /*background-color: #070707;*/
  left: 10vw;
  
  transform:translateY(100%);
  opacity: 0;
}

.panel-text5.blue-text {
  color: blue;
}

.panel-text5.red-text {
  color: red;
}

.panel-text5.purple-text {
  color: purple;
}

.panel-text5.orange-text {
  color: orange;
}
/* Tema 5 ************************************************/

/* Tips ************************************************/
.panel-text6 {
  position: absolute;
  /*left: 0%;
  top: 0%;
  right: 0%;*/
  bottom: 0%;
  z-index: 1;
  width: 80%;
  height: 100%;
  font-size: 15px;
  /*text-transform: uppercase;*/
  font-weight: 900;
  text-align:center;
  border-radius: 25px;
  /*background-color: #070707;*/
  left: 10vw;
  
  transform:translateY(100%);
  opacity: 0;
}

.panel-text6.blue-text {
  color: blue;
}

.panel-text6.red-text {
  color: red;
}

.panel-text6.purple-text {
  color: purple;
}

.panel-text6.orange-text {
  color: orange;
}
/* Tips ************************************************/

.p-wrap {
  /*  
  position: relative;
  overflow: hidden;
  width: 450px;
  height: 80vh;
  */

    position: relative;
    overflow: hidden;
    width: 50%;
    height: auto;

}

.panel {
  position: absolute;
  left: 0%;
  top: 0%;
  right: 0%;
  bottom: 0%;
  z-index: 1;
  width: 100%;
  height: 100%;
  /*background-image: url("../images/5ed12171d9d512cb2feead83_5.jpg");*/
  background-position: 50% 50%;
  background-size: cover;
  background-repeat: no-repeat;
}
.panel2 {
  position: absolute;
  left: 0%;
  top: 0%;
  right: 0%;
  bottom: 0%;
  z-index: 1;
  width: 100%;
  height: 100%;
  background-image: url("../images/5ed12171d9d512cb2feead83_5.jpg");
  background-position: 50% 50%;
  background-size: cover;
  background-repeat: no-repeat;
}
.panel3 {
  position: absolute;
  left: 0%;
  top: 0%;
  right: 0%;
  bottom: 0%;
  z-index: 1;
  width: 100%;
  height: 100%;
  background-image: url("../images/5ed12171d9d512cb2feead83_5.jpg");
  background-position: 50% 50%;
  background-size: cover;
  background-repeat: no-repeat;
}
.panel4 {
  position: absolute;
  left: 0%;
  top: 0%;
  right: 0%;
  bottom: 0%;
  z-index: 1;
  width: 100%;
  height: 100%;
  background-image: url("../images/5ed12171d9d512cb2feead83_5.jpg");
  background-position: 50% 50%;
  background-size: cover;
  background-repeat: no-repeat;
}
.panel5 {
  position: absolute;
  left: 0%;
  top: 0%;
  right: 0%;
  bottom: 0%;
  z-index: 1;
  width: 100%;
  height: 100%;
  background-image: url("../images/5ed12171d9d512cb2feead83_5.jpg");
  background-position: 50% 50%;
  background-size: cover;
  background-repeat: no-repeat;
}
.panel6 {
  position: absolute;
  left: 0%;
  top: 0%;
  right: 0%;
  bottom: 0%;
  z-index: 1;
  width: 100%;
  height: 100%;
  background-image: url("../images/5ed12171d9d512cb2feead83_5.jpg");
  background-position: 50% 50%;
  background-size: cover;
  background-repeat: no-repeat;
}
.panel._2 {
  z-index: 1;
  background-image: url("../images/5f5a5b3515c4dd0c2c455925_110642301_938622823267359_7859124022958180678_n201.jpg");
}

.panel.blue {
  z-index: auto;
}

.panel.red {
  z-index: auto;
  background-color: red;
  background-image: none;
}

.panel.orange {
  z-index: auto;
  background-color: #cf5d00;
  background-image: none;
}

.panel.purple {
  z-index: auto;
  background-color: #808;
  background-image: none;
}




/*Presupuesto*/
    swiper-container {
      width: 100%;
      height: 100%;
    }

    swiper-slide {
      text-align: left;
      font-size: 18px;
      /*background: #fff;*/
      display: flex;
      justify-content: center;
      align-items: center;
    }

    swiper-slide img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .mb-5, .my-5 {
      margin-bottom: 0rem !important;
    }

  .btn-primary {
      color: #fff;
      background-color: #39C09B;
      border-color: #39C09B;
      margin: 1px;
  }

  .btn-primary:hover {
      color: #fff;
      background-color: #00B285;
      border-color: #00B285;
  }
  .btn-primary:focus {
      color: #fff;
      background-color: #00B285;
      border-color: #00B285;
  }

    /*Gráfico*/

    .highcharts-figure,
    .highcharts-data-table table {
        min-width: 320px;
        max-width: 800px;
        margin: 1em auto;
    }

    .highcharts-data-table table {
        font-family: Verdana, sans-serif;
        border-collapse: collapse;
        border: 1px solid #ebebeb;
        margin: 10px auto;
        text-align: center;
        width: 100%;
        max-width: 500px;
    }

    .highcharts-data-table caption {
        padding: 1em 0;
        font-size: 1.2em;
        color: #555;
    }

    .highcharts-data-table th {
        font-weight: 600;
        padding: 0.5em;
    }

    .highcharts-data-table td,
    .highcharts-data-table th,
    .highcharts-data-table caption {
        padding: 0.5em;
    }

    .highcharts-data-table thead tr,
    .highcharts-data-table tr:nth-child(even) {
        background: #f8f8f8;
    }

    .highcharts-data-table tr:hover {
        background: #f1f7ff;
    }

    input[type="number"] {
        min-width: 50px;
    }

    /*Helper****************************************************/

    #main-content {
      text-align: center;
      height: 800px;
      margin-bottom: 800px;
      margin-top: -22px;
    }

    #main-footer {
      text-align: center;
      height: 800px;
      color: white;
      width: 100%;
      position: fixed;
      left: 0;
      bottom: 0;
      z-index: -1;
    }
    .tips{
        padding: 100px; 
        background-color: #444444; 
        color: #ffffff;
    }
    a.boton_handler{
        margin-top: 10px;
        font-family: Gotham-Book!important; 
        font-size: 15px; 
        color: black;
        font-weight: 600;
    }

    h1, h2, p, li {
        max-width: none!important;
    }

    .text-heightlight{
        font-size: 80px; 
        color: #444; 
        text-transform: uppercase;
    }

    .white{
        color: white;
    }
    .card-header {
        padding: 0;
        margin-bottom: 0;
        background-color: rgba(0, 0, 0, .03);
        border-bottom: 0;
    }

    .list-group-item {
        position: relative;
        display: block;
        padding: 0.75rem 1.25rem;
        /*background-color: #39C09B;*/
        border: 1px solid rgba(0, 0, 0, .125);
    }
  .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
      background: #e900c0!important;
      position: absolute;
      left: 0px;
      top: 0px;
      width: 100%;
      height: 20px!important;
      transform: scale(0);
      transform-origin: left top;
  }


    .color4:hover, .color4:focus {
      background-color: #8AA60D;
      border-color: #8AA60D;
    }
    .service:hover, .service:focus {
      background-color: #aebe16;
      border-color: #aebe16;
      color: white;
    }
    .service {
      border: 1px solid #e3e5e5;
        border-top-color: rgb(227, 229, 229);
        border-right-color: rgb(227, 229, 229);
        border-bottom-color: rgb(227, 229, 229);
        border-left-color: rgb(227, 229, 229);
      padding-top: 50px;
      padding-bottom: 50px;
      text-align: center;
      color: #d82c2e;
      margin-left: -1px;
      -webkit-transition: all 0.3s ease-in, 1s;
      -moz-transition: all 0.3s ease-in, 1s;
      -o-transition: all 0.3s ease-in, 1s;
      -ms-transition: all 0.3s ease-in, 1s;
      transition: all 0.3s ease-in, 1s;
    }

    #verGrafico{
      /*display: none;*/
    }

    @media only screen and (max-width:991px) {  
      
      .personaje{
        display: none;
      }

    } 










/* Back To Top */
.back-to-top a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: fixed;
  bottom: 50px;
  right: 40px;
  width: 40px;
  height: 40px;
  margin: 0px;
  color: #ffffff;
  font-size: 16px;
  background: #212529;
  border-radius: 50px;
  -webkit-box-shadow: 0px 6px 10px 0px rgba(28, 26, 31, 0.08);
          box-shadow: 0px 6px 10px 0px rgba(28, 26, 31, 0.08);
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  z-index: 999; }
  .back-to-top a:hover {
    background: #1c1a1f;
    color: #ffffff; }
  .back-to-top a:focus {
    background: #1c1a1f;
    color: #ffffff; }


/*Media*/
@media screen and (max-width: 600px) {
  ul.topnav1 li.right, 
  ul.topnav1 li {float: none;}
}



/*
.boxed {
  background-color: deeppink;


  animation-name: rotateAnimation;
  animation-duration: 1ms;
  animation-direction: alternate;
  animation-timeline: scroll(block nearest);

}

@keyframes rotateAnimation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(80deg);
  }
}
*/


.boxed{
    color: white; 
    border-radius:30px; 
    border:3px solid white; 
    margin: 250px 50px 0 50px; 
    padding: 150px 0 150px 0;

    /*height:100px;*/
    -webkit-animation-name: animation;
    -webkit-animation-duration: 5s;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;    
    -webkit-animation-play-state: running;
    
    animation-name: animation;
    animation-duration: 5s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;    
    animation-play-state: running;
    background-color: #f00;
}

@-webkit-keyframes animation {
  0% { background: #D68BE6; translate: 0px 0; }
  50% { background: #39C09B; }
  100% { background: #F36F9A; translate: 0px 0; }
}

@keyframes animation {
  0% { background: #D68BE6; translate: 0px 0; }
  50% { background: #39C09B; }
  100% { background: #F36F9A; translate: 0px 0; }
}

.boxed2{
    color: black ; 
    border-radius:30px; 
    border:3px solid #444444; 
    margin: 70vh 50px 0 50px; 
    padding: 150px 0 150px 0;
    /*margin-top: 30%;*/
}

.boxed-footer{
    padding: 250px 100px;
}

.icon-menu{
    animation: icon-menu 2.8s ;
}
@keyframes icon-menu {
  from {
    transform: translatey(-100px);
  }

  to {
    transform: translatey(0px);
  }
}



.title_big_sec1{
    animation: title_big_sec1 1.8s ;
}
@keyframes title_big_sec1 {
  from {
    transform: translateX(-400px);
  }

  to {
    transform: translatey(0px);
  }
}



.title_big_sec{
    animation: title_big_sec 1.8s ;
}
@keyframes title_big_sec {
  from {
    transform: translateX(400px);
  }

  to {
    transform: translatey(0px);
  }
}




.prueba{
   

}



.prueba2{

}





@media only screen and (max-width:991px) {  /*Media Triciclo*******************************/
    body{

        border: 0px solid #eee;
    }
    .inicio{
        height:30vh;
    }
    .box-area {
        width: 100%;
        height: auto;
        display: block;    
        justify-content: contents;
        align-items: center;
        /*background-color: black;*/
    }
    .box {
        width: 100vw;
        height: auto;
        margin-right: 2px;
        overflow: hidden;
        /*border-radius: 20px;*/
        position: relative;
        transition: all linear 0.6s;
    }
    .box.active h2 {
      opacity: 1;
    }
    .box.active h2 {
      opacity: 1;
    }
    .box h2 {
      opacity: 1;
    }
    .box p {
      opacity: 1;
    }
    li {
      float: none;
    }
    li a {
      border-radius: 0px;
    }
    li a:hover:not(.active) {
        border-radius: 0px;
    }
    .menu{
        /*top: 12%;*/
        /*right: 40%;*/
        /*margin-top: 70px;*/
        text-align: center;
            width: 10%;
    }

    .menu_lang{
        /*top: 12%;*/
        right: 40%;
        margin-top: -50px;
        text-align: center;
    }    

    .cerrar_menu {
        position: absolute;
        right: 40%;
        width: 40px;
        top: 123px;
    }

    .box {
        margin-bottom: 0px;
    }

    .navbar-nav {
        margin-top: 70px;
    }

    .logo{
      text-align: center;
    }
    .navbar-expand-lg .navbar-collapse {
      display: flex ; !important;
    }

    .footer{
        /*
        padding-top: 60px;
        height: auto;
        text-align: center;
        */
    }
    .footer_ini{
        padding-top: 60px;
        height: auto;
        text-align: center;
    }
    
    .line_hidden{
        display: block;
    }
    .texto_side{
        display: none;
    }
    .title_big{
        font-size: 80px;
        margin-top: 0vh;

    }

    .boxed{
        color: white; 
        border-radius:0px; 
        border:0px solid white; 
        margin: 10px; 
        padding: 0px;

    }
    
    .boxed2{
        color: black ; 
        border-radius:0px; 
        border:0px solid #444444; 
        margin: 140vh 10px; 
        padding: 0px;
        /*margin-top: 100vh;*/
    }



    .title_theme_big{
        margin-top: 2vh;
        margin-top: 0vh; 
        font-size: 60px!important;
    }
    .title_theme_small{
        margin-top: 2vh;
        margin-top: 0vh; 
        font-size: 60px!important;
    }
    .boxed-footer{
        padding: 20px;
    }

    .p-wrap {
        display: none;
    }

    .text-wrap {
        width: 100%;
        height: 100%!important;
    }

    .text-card{
        font-size: 40px; 
    }

    .panel-text {
        position: absolute;
        bottom: 0%;
        z-index: 1;
        /* width: 80%; */
        height: 100%;
        /* font-size: 15px; */
        /* text-transform: uppercase; */
        font-weight: 900;
        /* text-align: center; */
        border-radius: 25px;
        /* background-color: #070707; */
        /* left: 10vw; */
        transform: translateY(100%);
        opacity: 0;
    }

    .boxed-card{
        height: 100%;
        border: 3px solid #fff; 
        width:100%; ; 
        padding:20px;
    }
    .mujer, .hombre{
        display: none;
    }
    .text-heightlight{
        font-size: 40px; 
    }

    .text_card{
        font-size: 1.0rem;
    }

    .tips{
        padding: 20px; 
    }


}