/*
  [CSS Index - style]
  
  ---
  
  Template Cober
  Author:  Cober
*/

/*
  1. Reset
  2. Content
    . Logo Anim
    . Slider
    . Cards
    . Footer
    . Contact
  3. Responsive

*/

/*1. Reset*/
*{
  list-style: none;
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
}
iframe{
  display: none;
}

html, body, main, header, footer{
  overflow-x: hidden!important;
}

body, html{
  height: 100%;
}

.menu-item{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  overflow: hidden;
  padding: 0 .5rem;
}

/*. Content*/

.seccion_demain{
  height: 100%;
}
.page-footer{
 position:fixed;
 left:0;
 bottom:0;
 height:40px;
 width:100%;
 background:#999;
 z-index: 2;
}

.rgba-black-light,
.rgba-black-light:after {
    background-color: rgba(0, 0, 0, .5)
}

.rgba-black-light_2,
.rgba-black-light_2:after {
    background-color: rgba(0, 0, 0, .45)
}

.content {
  color: #000;
  font-weight: 100;
  text-align: left;
}

.conten-show {
  display: block;
  position: fixed;
  width: 105vw;
  top:0;
  z-index: 9998;
}

/* Animation Logo */
@font-face { font-family:"Century Gothic";font-variant:normal;font-style:italic;font-weight:bold;src:url("#FontID0") format(svg)}
.fnt0 {font-style:italic;font-weight:bold;font-size:1388.61px;font-family:'Century Gothic'}
.str0 {stroke:#8BC6FF;stroke-width:30; stroke-miterlimit:22.9256}
.str1 {stroke:#FF99A0;stroke-width:30; stroke-miterlimit:22.9256}
.str2 {stroke:#FE0000;stroke-width:30; stroke-miterlimit:22.9256}
.str3 {stroke:#3635FF;stroke-width:30; stroke-miterlimit:22.9256}

.fil0 {fill:transparent;transition: fill 1s ease;}
.fil1 {fill:transparent;transition: fill 1s ease;}
.fil2 {fill:transparent;transition: fill 1s ease;}
.fil3 {fill:transparent;transition: fill 1s ease;}

.anim, .anim svg {
  position: relative;
  width: 100%;
  height: 100%;
}

/* Slider */

.slide img.m-auto{
  height: 100%;
}

.slick-prev::before, .slick-next::before {
    opacity: .75;
    color: black;
}
.slick-prev {
    left: -25px;
}
.slick-next {
    right: -25px;
}

.slick-comunicaciones{
  width:90%;
  margin:0px auto;
}
.slick-slide{
  margin:10px;
}
.slick-slide img{
  cursor: pointer;
  width:100%;
  border: 2px solid #fff;
}
.carrr h3,
.carrr p{
  font-weight: 500;
  text-shadow: 2px 2px #000;
}

/* Cards */

.carousel-multi-item .controls-top {
  margin-bottom: 1.2rem;
}

.carousel-multi-item{
  margin-bottom: 0;
}

.carousel-item .container_flip{
  margin-bottom: 1rem;
}

.carousel-item .container_flip .card{
  height: 400px;
}
.cate_3 .container_flip .card{
  height: 420px;
}
.cate_5 .container_flip .card{
  height: 430px;
}

.product_title{
  color: #000;
  font-weight: 400;
  font-size: 1.2rem;
}

.trasera {
  font-size: 12px;
}

.card-wrapper .card{
  height: 100%;
}

/*.card-wrapper{
  min-height: 500px!important;
}

.card-wrapper .face{
  min-height: 50%!important;
}

.card-wrapper *{
  font-size: 14px;
}

.card-wrapper .card {
    -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0), 0 0 0 0 rgba(0, 0, 0, 0);
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0), 0 0 0 0 rgba(0, 0, 0, 0);
    border: 0;
    font-weight: 400;
}

.card-wrapper_2  {
    min-height: 500px!important;
}

.card-body_flip {
  color: #000!important;
  font-size: 14px;
}

.card-body_flip a{
  display: block;
}

.card_flip {
  height: 100%;
}

*/

/* Contact */

.md-form input[type=date]:focus:not([readonly]),
.md-form input[type=datetime-local]:focus:not([readonly]),
.md-form input[type=email]:focus:not([readonly]),
.md-form input[type=number]:focus:not([readonly]),
.md-form input[type=password]:focus:not([readonly]),
.md-form input[type=search-md]:focus:not([readonly]),
.md-form input[type=search]:focus:not([readonly]),
.md-form input[type=tel]:focus:not([readonly]),
.md-form input[type=text]:focus:not([readonly]),
.md-form input[type=time]:focus:not([readonly]),
.md-form input[type=url]:focus:not([readonly]),
.md-form textarea.md-textarea:focus:not([readonly]) {
    -webkit-box-shadow: 0 1px 0 0 green;
    box-shadow: 0 1px 0 0 green;
    border-bottom: 1px solid green
}

.md-form input[type=date]:focus:not([readonly])+label,
.md-form input[type=datetime-local]:focus:not([readonly])+label,
.md-form input[type=email]:focus:not([readonly])+label,
.md-form input[type=number]:focus:not([readonly])+label,
.md-form input[type=password]:focus:not([readonly])+label,
.md-form input[type=search-md]:focus:not([readonly])+label,
.md-form input[type=search]:focus:not([readonly])+label,
.md-form input[type=tel]:focus:not([readonly])+label,
.md-form input[type=text]:focus:not([readonly])+label,
.md-form input[type=time]:focus:not([readonly])+label,
.md-form input[type=url]:focus:not([readonly])+label,
.md-form textarea.md-textarea:focus:not([readonly])+label {
    color: green
}

/*. Responsive*/

@media (min-width:360px) { /*sm*/
  .carousel-item .container_flip .card{
    height: 400px;
  }
  .menu-sm{
    height: 25vh; 
    width: 100%;
  }
  .home-sm{
    height: 50vh; 
    width: 100%;
  }
}

@media (min-width:768px) { /*md*/
  .carousel-item .container_flip .card{
    height: 450px;
  }
  .menu-md{
    height: 25vh; 
    width: 100%;
  }
  .home-md{
    height: 50vh;
    width: 100%;
  }
}

@media (min-width:992px) { /*lg*/
  html{
    overflow-y: hidden!important;
  }
  .carousel-item .container_flip .card{
    height: 400px;
  }
  .menu-lg{
    height: 45vh; 
    width: 100%;
  }
  .home-lg{
    height: 90vh; 
    width: 100%;
  }
  .slider{
    height: 10vh;
  }
}

@media (min-width:1200px) { /*xl*/
  .menu-xl{
    height: 100%; 
    width: 100%;
  }
}