/* -------------------------

 ------------------------- */
* {
    box-sizing: border-box;
    margin: 0; 
    padding: 0;
}

body { 
    font-family: 'Lato', sans-serif;
    font-size: 18px;
    background-color: #fbfbfb;
}

h1, h2, h3, h4, h5, h6 {
    text-align: center;
    margin-bottom: 0;
}

.text-marino{
    color: #190e8f;
}

.btn-nnya{
    color:#fff;
    background-color:#f17267;
    border-color:#f17267
}

.btn-danger:hover{
    color:#fff;
    background-color:#f17267;
    border-color:#f17267
}

.icondown{
    position: absolute;
    z-index: 99;
    bottom: 3%;
    left: 49%;
    color: white;
    animation: btnSaltando 1s ease infinite;
    -webkit-animation: btnSaltando 1s ease infinite;
}
@keyframes btnSaltando{
      0% { transform: translateY(20px); -webkit-transform: translateY(20px); -moz-transform: translateY(20px); -ms-transform: translateY(20px); -o-transform: translateY(20px); }
     25% { transform: translateY(0px); -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); }
    100% { transform: translateY(20px); -webkit-transform: translateY(20px); -moz-transform: translateY(20px); -ms-transform: translateY(20px); -o-transform: translateY(20px); }
}

/* - - - - - - - - - 
    MENU 
 - - - - - - - - - */
.mobile-menu{
    display: none;
}
.desktop-menu{
    position: absolute;
    left: 0;
    top: 0;
    width: 100px;
    height: auto;
    z-index: 100;
    color: #fff;
    background-color: black;
}
.offcanvas-header{
    margin: 0 auto;
}

.bg-dark{
    background-color: #000 !important;
}

ul {
    position: fixed;
    z-index: 1;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    height: 630px;
    width: 100px;
    padding: 0;
    text-align: center;
   }
  
   .icon {
    color: #fff;
    font-size: 32px;
    display: block;
  }
  
  ul .icon:hover {
    opacity: 0.5;
  }

  #menu{
      background-color: rgba(0, 0, 0, 0.6);
  }
  #menu .icon {
    margin: 30px auto;
    transition: all .5s ease-out !important;
    -webkit-transition: all .5s ease-out;
    -moz-transition: all .5s ease-out;
    -o-transition: all .5s ease-out;
  }
  
  a {
    text-decoration: none;
  }



	/* Violentometro
	* --------------------------------------- */
	#bgverde{
		background: -webkit-gradient(linear, top center, bottom center, from(#81f52f), to(#c2f311));
		background: -webkit-linear-gradient(#81f52f, #c2f311);
		background: linear-gradient(#81f52f,#c2f311);
	}

	#bgamarillo{
		background: -webkit-gradient(linear, top left, bottom left, from(#c2f311), to(#fe7d04));
		background: -webkit-linear-gradient(#c2f311, #fe7d04);
		background: linear-gradient(#c2f311,#fe7d04);
	}

    #bgnaranja{
		background: -webkit-gradient(linear, top left, bottom left, from(#fe7d04), to(#fe7d04));
		background: -webkit-linear-gradient(#fe7d04, #fe7d04);
		background: linear-gradient(#fe7d04,#fe7d04);
	}

    #bgrojo{
		background: -webkit-gradient(linear, top left, bottom left, from(#fe7d04), to(#670001));
		background: -webkit-linear-gradient(#fe7d04, #670001);
		background: linear-gradient(#fe7d04,#670001);
	}
  
    #menu_violentometro {
        position: fixed;
        display: block;
        width: 100%;
        background-color:#d10034;
        top: 0;
        margin: 0;
        z-index: 9;
    }
    .menu_violentometro {
        width: 100%;
        background-color:#d10034;
        z-index: 9;
        margin: 0;
        padding: 10px;
        color: #fff !important;
        text-shadow: 1px 1px 4px #202020;
    }

    #violentometro a, 
    #violentometro p, 
    #violentometro h1, 
    #violentometro h2, 
    #violentometro h3, 
    #violentometro span{
        color: #fff;
        text-shadow: 1px 1px 4px black;
    }

    #violentometro #fp-nav ul li a span, 
    #violentometro .fp-slidesNav ul li a span {
        background: #fff !important;
    }
    .text-vertical{
        transform: rotate(180deg);
        writing-mode: vertical-lr;
        text-align: center;
        color: #fff;
        font-style: italic;
        text-shadow: 1px 1px 4px black;
    }
    

/* Niñas, niños y adolescentes
 * --------------------------------------- */
#menu_nnya {
    position: fixed;
    display: block;
    width: 100%;
    background-color:#E6665B;
    top: 0;
    margin: 0;
    z-index: 9;
  }
.menu_nnya {
    width: 100%;
    background-color:#E6665B;
    z-index: 9;
    margin: 0;
    padding: 10px;
    color: #fff !important;
}
.nnya-bgcolor{
    background-color: #E6665B;
}
.nnya-color{
    color: #E6665B;
}

/* No es parte del trabajo
 * --------------------------------------- */
.menu_npt {
    width: 100%;
    background-color:#29A37A;
    z-index: 9;
    margin: 0;
    padding: 10px;
    color: #fff !important;
}

.modales_npt  .modal-content{
    background-color: rgb(41 163 122 / 100%) !important;
    color: #fff !important;
}
.modales_npt  .modal-header{
    color: #fff;
    font-weight: 400;
}
.modales_npt  .modal-title {
    font-weight: bold;
}


/* 
 * --------------------------------------- */
 #fp-nav ul li a span, .fp-slidesNav ul li a span {
    background: #f17268 !important;
}


#fp-nav.fp-right {
    right: 50px !important;
}

  .menu-links {
    @include span(1 of 3);
    &:last-child {
      @include last;
    }
        background-color: green;
        height: 100%;
  } 


/* Feminismo
 * --------------------------------------- */  
#feminismo p{
    text-align: justify;
}
#menu_feminismo{
    background-color: #064165;
    color: #fff !important;
}
.fem-bgcolor{
    background-color: #064165;
}
.fem-color{
    color: #064165;
}
.fem-border{
    border: 1px solid #064165 !important;
}
.fem-bordert{
    border-top: 1px solid #064165 !important;
}
.card-footer, .card-footer a{
    background-color: #fff;
    color: orange !important;
}

.modales_fem  .modal-content{
    /* background-color: rgb(6, 65, 101, 0.8) !important; */
    color: #064165 !important;
}
.modales_fem  .modal-header{
    color: #064165;
    font-weight: 400;
}
.modales_fem  .modal-title {
    font-weight: bold;
}
.modales_fem .modal-header {
    color: #fff !important;
    background-color: #064165;
}

/* Ni una Menos
 * --------------------------------------- */
#bg-num{
    background-color: #fff !important;
}
#menu_num{
    background-color: #087599;
    color: #fff !important;
}
.num-bgcolor{
    background-color: #087599;
}
.num-color{
    color: #087599;
}
.num-border{
    border: 1px solid #087599 !important;
}
.num-bordert{
    border-top: 1px solid #087599 !important;
}
.card-footer, .card-footer a{
    background-color: #fff;
    color: orange !important;
}

/* -------------------------
  Media Querys
 ------------------------- */
@media (max-width: 575.98px){ 
    .desktop-menu{
        display: none;
    }
 }

 /* Medium devices (tablets, 768px and up) */
 @media (max-width: 767.98px) { 

 }

 /* Large devices (desktops, 992px and up) */
 @media (max-width: 991.98px) { 

 }

 /* X-Large devices (large desktops, 1200px and up) */
 @media (max-width: 1199.98px) { 

 }

 /* XX-Large devices (larger desktops, 1400px and up) */
 @media (max-width: 1399.98px) { 

}