<style>
    * {
        box-sizing: border-box;
    }

    body {
        margin:0;
        padding:0; /* remove top and left whitespace */
        background-color: #000;
        position: relative;
    }
    canvas {
        display: block;
        outline: 0px;
        margin-bottom: 1.5em;
        width: 100%;
        height: 100%;
    }
    /*canvas:focus {
        outline:0;
        }  remove blue outline around canvas */
    #canvasIn {
        position: fixed;
        margin: 0px auto 0px auto; padding: 0px;
        width: 100%; height: 100%;
        z-index: -1;
    }

    .row:after {
        content: "";
        clear: both;
        display: block;
        z-index: 4;
    }
    [class*="col-"] {
        float: left;
        padding: 15px;
        z-index: 4;
        padding-right: 32px;

    }
    html {
        font-family: 'Offside', sans-serif;
        font-size: 100%;
        padding-right: 32px;
    }
    h1{
        font-size: 170%;
        font-family: 'Offside', sans-serif;
    }

    h2{
        font-size: 115%;
        font-family: 'Offside', sans-serif;
    }
    h3{
        font-size: 170%;
        font-family: 'Offside', sans-serif;
        color: #29E0A7;
    }
    h4{
        font-size: 120%;
        font-family: 'Offside', sans-serif;
        color: #29E0A7;
    }

    .header{
        /*background-color: #9933cc;*/
        color: #EE296D;
        padding: 15px;
        text-align: left;
        z-index: 4;
    }

    .menuPrincipal{
        /*background-color: #000;*/
        color: #000;
        padding: 15px;
        text-align: left;
        z-index: 4;
    }

    a.linkMenu:link{
        font-family: 'Offside', sans-serif;
        font-style: normal;
        color: #EE296D;
        text-decoration: none;
    }
    a.linkMenu:visited{
        color: #EE296D;
        text-decoration: none;
    }

    a.linkMenu:hover{
        color: #29E0A7;
        text-decoration: none;
    }
    a.linkMenu:active{
        color: #29E0A7;
        text-decoration: none;
    }

    .footer {
        position: fixed;
        bottom: 0;
        right: 0;
        width: 100%;
        background-color: #0099cc;
        color: #ffffff;
        text-align: center;
        font-size: 12px;
        padding: 8px;
        z-index: 5;
    }

    /* For mobile phones: */
    [class*="col-"] {
        width: 100%;
    }

    .col-Contenido{
            font-family: 'Roboto', sans-serif;
            color: #ffffff;
            z-index: 4;

    }
    #contenidoItalica{
       font-family: 'Roboto', sans-serif;
       font-style: italic;
    }

    #contenidoItalicaResaltado{
       font-family: 'Roboto', sans-serif;
       font-style: italic;
       color: #29E0A7;
    }
    #contenidoResaltado{
       font-family: 'Roboto', sans-serif;
       font-style: italic;
       color: #29E0A7;
    }

    img{
        max-width: 100%;
        height: auto;
    }

    a:link{
            color: #29E0A7;
            text-decoration: none;
            font-family: 'Roboto', sans-serif;
            font-style: italic;
    }
    a:visited{
            color: #29E0A7;
            text-decoration: none;
    }
    a:hover{
            color: #EE296D;
            text-decoration: none;
    }
    a:active{
            color: #EE296D;
            text-decoration: none;
    }

    ul {
        list-style: none; /* Remove list bullets */
        padding: 0;
        margin: 0;
    }

    li {
        padding-left: 16px;
        padding-right: 32px;
    }

    li:before {
        content: "~  "; /* Insert content that looks like bullets */
        color: #EE296D; /* Or a color you prefer */
    }

        /*color: #0099cc;  Or a color you prefer */

    @media only screen and (min-width: 600px) {
        /* For tablets: */
        .col-m-1 {width: 8.33%;}
        .col-m-2 {width: 16.66%;}
        .col-m-3 {width: 25%;}
        .col-m-4 {width: 33.33%;}
        .col-m-5 {width: 41.66%;}
        .col-m-6 {width: 60%;}
        .col-m-7 {width: 58.33%;}
        .col-m-8 {width: 66.66%;}
        .col-m-9 {width: 75%;}
        .col-m-10 {width: 83.33%;}
        .col-m-11 {width: 91.66%;}
        .col-m-12 {width: 100%;}
        .col-Contenido{
            width: 80%;
            margin-left: 10%;
            z-index: 4;

        }
        .menuPrincipal {
            text-align: center;
            z-index: 4;
        }
        .header {
        text-align: center;
        z-index: 4;
    }
    }
    @media only screen and (min-width: 768px) {
        /* For desktop: */
        .col-1 {width: 8.33%;}
        .col-2 {width: 16.66%;}
        .col-3 {width: 25%;}
        .col-4 {width: 33.33%;}
        .col-5 {width: 41.66%;}
        .col-6 {width: 50%;}
        .col-7 {width: 58.33%;}
        .col-8 {width: 66.66%;}
        .col-9 {width: 75%;}
        .col-10 {width: 83.33%;}
        .col-11 {width: 91.66%;}
        .col-12 {width: 100%;}
        .col-Contenido{
            width: 65%;
            margin-left: 17.5%;
            z-index: 4;
        }
        .menuPrincipal {
            text-align: center;
            z-index: 4;
        }
        .header {
            text-align: center;
            z-index: 4;
        }
    }

    /*@media only screen and (orientation: portrait) {
        body {
            background-color: lightblue;
        }*/
    }

    .videoWrapper {
        position: relative;
        padding-bottom: 56.25%;
        padding-top: 25px;
        height: 0;
    }
    .videoWrapper iframe,
    .videoWrapper object, {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }


    .js-video {
      height: 0;
      padding-top: 25px;
      padding-bottom: 67.5%;
      margin-bottom: 10px;
      position: relative;
      overflow: hidden;
    }

    .js-video.widescreen {
      padding-bottom: 56.34%;
    }

    .js-video.vimeo {
      padding-top: 0;
    }

    .js-video embed, .js-video iframe, .js-video object, .js-video video {
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      position: absolute;
    }

    .videoyoutube {
    position:relative;
    padding-bottom:56.25%;
    padding-top:30px;
    height:0;
    overflow:hidden;
}

    .videoyoutube iframe, .video-container object, .video-container embed {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

</style>
