/***********************************************************************************************/
 .foo {
    height: 100vh;
    width: 100vw;
    }

    *,
    *:before,
    *:after {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }

    body, html {
        height: 100%;
        background-image: url('../img/fondoicefi.jpg');
    }
    .container {
        width: 92%;
        height: 100%;
        z-index: 110;
    }
    .iestilo {
        width: 100%;
        margin: 5% auto 0 auto;
        max-width: auto;
    }
    /* bloque color */
    .iestilo .slider {
        width: 100%;
        height: 100px;
        background-color: #333333;
    }
    h2,h1,h3,h4{
        color: #B30032;
        font-family: 'Sans-Serif','Arial';
    }

    p {
        margin-top: 3;
        margin-bottom: 0;
        text-align: justify;
        font-family: 'Sans-Serif','Arial';
    }

    div.b {
        line-height: 10.9;
    }
    a:link, a:visited, a:hover, a:active {
        color: #FFFFFF;
        text-decoration: none;
    }
    .ir-arriba {
        padding:0px;
        display:inline-block;
        background:#B30031;
        color:#fff;
        position: fixed;
        font-size:10px;
        bottom:0px;
        right:0px;
        display:none;
        cursor:pointer;
        z-index:100;
    }

    .botonregresar {
        padding:0px;
        display:inline-block;
        background:#B30031;
        color:#fff;
        position: fixed;
        opacity: 0.5;
        font-size:10px;
        top:0px;
        left:0px;
        cursor:pointer;
        z-index:100;
    }

    [class^="icon-"], [class*=" icon-"] {
        font-family: 'Sans-Serif','Arial';
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;

        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
    .icon-arrow-up2:before {
        content: url("img/scroll.png");
    }


        .iestilo ul li:hover {
            cursor: pointer;
            background-color: #8B9AA7;
            list-style:none;
        }
        .iestilo ul {
            list-style-type: none;
            line-height: 10px;
            list-style:none;
        }
        .iestilo ul li {
                font-family: 'Sans-Serif','Arial';
                font-size: .7rem;
                font-weight: 400;
                color: #FFFFFF;
                padding: 5px;
                position: relative;
                list-style:none;
        }

        .iestilo ul li:hover {
            cursor: pointer;
            background-color: #8B9AA7;
            list-style:none;
        }
        .iestilo ul li:hover ul {
            display: block;
            margin-top: 0px;
            position: fixed;
            list-style:none;
            background-color: #D9D9D9;
        }
        .iestilo ul li:hover ul li {
            display: block;
            list-style:none;
            background-color: #D9D9D9;
        }
        .iestilo ul li:hover ul li span {
            float: right;
            list-style:none;
            color: #f9f9f9;
            background-color: #D9D9D9;
            padding: 2px 0px;
            text-align: center;
            font-size: .8rem;
            border-radius: 3px;
        }
        .iestilo ul li:hover ul li:hover {
            list-style:none;
            background-color: #D9D9D9;
        }
        .iestilo ul li:hover ul li:hover span {
            list-style:none;
            background-color: #D9D9D9;
        }


/***********************************************************************************************/


    @media only screen and (max-width: 600px) {
       table {
           width:100%;
            border-collapse: collapse;
            border-spacing: 0px;
            font-family: Sans-Serif;
       }
       thead {
           display: none;
       }
       tr:nth-of-type(2n) {
           background-color: inherit;
       }
       tr td:first-child {
           background: #f0f0f0;
           font-weight:bold;
           font-size:1.3em;
       }
       tbody td {
           display: block;
           text-align:center;
       }
       tbody td:before {
           content: attr(data-th);
           display: block;
           text-align:center;
       }
        .iestilo ul li:hover ul {
            display: block;
            margin-top: 5px;
            width: auto;
            left: 0;
            position: relative;
            background-color: #EE204E;
        }
        .boton_2 img{
            width: 260px; height: 180px;
        }
    }

    @-webkit-keyframes fadeIn {
      from {opacity: 0;}
      to {opacity: 1;}
    }

    @keyframes fadeIn {
      from {opacity: 0;}
      to {opacity:1 ;}
    }