body, html {
  height: 100%;
}
.bg {
  /* The image used */
  background-image: url("../img/bg1.png");

  /* Half height */
  height: 60%;

  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.mi-mega-menu{
	width: 800px;
	overflow: hidden;
	padding: 10px;

}

@media(max-width: 500px){
	.mi-mega-menu{width: 300px;}
}


.card.card-cascade.wider {
    -webkit-box-shadow: none;
    box-shadow: none;
    background-color: transparent;
}

.card.card-cascade.wider.reverse .card-body.card-body-cascade {
    z-index: 3;
    margin-top: -1rem;
    -webkit-border-radius: .25rem;
    border-radius: .25rem;
    -webkit-box-shadow: 0 5px 11px 0 rgba(0,0,0,.18), 0 4px 15px 0 rgba(0,0,0,.15);
    box-shadow: 0 5px 11px 0 rgba(0,0,0,.18), 0 4px 15px 0 rgba(0,0,0,.15);
}

.vl {
  border-left: 1px solid;
 
}

.letra-sombra2 {

    font-variant: small-caps;
    letter-spacing: .1em;
    text-shadow: 
      0 -1px 0 #fff, 
      0 1px 0 #2e2e2e, 
      0 2px 0 #2c2c2c, 
      0 3px 0 #2a2a2a, 
      0 4px 0 #282828, 
      0 5px 0 #262626, 
      0 6px 0 #242424, 
      0 7px 0 #222, 
      0 8px 0 #202020, 
      0 9px 0 #1e1e1e, 
      0 22px 30px rgba(0, 0, 0, 0.9);
  }

.menu{
    width: auto;
    height: auto;
    padding: .3rem;
    /*background: #45526e;*/
    border-radius: 0.5rem;
    position: fixed;
    top: 9rem;
    left: 0%;
    /*right: 0%;*/
    color: white;
    text-align: center;
    transition: left 0.7s;
    /*transition: right 0.7s;*/
    z-index: 99;
    font-size: 1rem;
    cursor: pointer;

    /*writing-mode: vertical-lr;
    text-orientation: upright;*/
}

.checkbox:checked ~ .menu {
    left: 30%;
    /*right: 30%;*/
    border-radius: 0rem 0.5rem 0.5rem 0rem;

    /*writing-mode: horizontal-tb;
    text-orientation: mixed;*/
}

.left-panel {
    width: 30%;
    /*height: 100%;*/
    background: transparent;
    position: fixed;
    top: 9rem;
    left: -40%;
    /*right: -30%;*/
    display: flex;
    /*align-items: center;*/
    justify-content: center;
    transition: left 0.4s;
    /*transition: right 0.4s;*/
    z-index: 99;

}

@media (max-width: 767px) {
    .menu{top: 6.7rem;}
    .left-panel {
        top: 6.7rem;
        width: 70%;
        left: -70%;
    }
    .checkbox:checked ~ .menu {
        left: 70%;
        /*right: 30%;*/
        border-radius: 0rem 0.5rem 0.5rem 0rem;

        /*writing-mode: horizontal-tb;
        text-orientation: mixed;*/
    }
}



.checkbox:checked ~ .left-panel {
    left: 0;
    /*right: 0;*/
}

.checkbox {
    display: none;
}