body{
      background-image: url('../images/back1.png'); 
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      position: relative;
      font-family: 'Oswald', sans-serif;
      padding-left: 3%;
      padding-right: 3%;
    }
    #links {
       text-decoration: none;
    }
    #ponente{
      width: 70%;
      padding: 30px;
      display: block;
      margin-left: auto;
      margin-right: auto;
      border-radius: 50%;
    }

    #datos{
      padding-left: 10%;
    }

    #autor{
      font-size: 13px; 
      color: #737675; 
      padding-left: 0%;
    }
    #tabla{
      padding-top: 6%;
    }

    #img1{
      width: 100%;
      padding-bottom: 1%;
    }
    #texto{
      padding-left: 5%;
      font-size: 1.2em;
      text-align: justify;
    }
    .section {
      clear: both;
      padding: 0px;
      margin: 0px;
    }

    #logo1{
      width: 90%;
      margin-left: auto;
      margin-right: auto;
      display: block;
      padding-top: 1.5%;  
    }
    
     #logo2{
      width: 90%;
      margin-left: auto;
      margin-right: auto;
      display: block;
      padding-left: 11%;
    }

    #logo3{
      padding-top: 15.5%;
      width: 90%;
      margin-left: auto;
      margin-right: auto;
      display: block;
      padding-left: 17%;
    }
    
    #logo4{
      width: 50%;
      margin-left: auto;
      margin-right: auto;
      display: block;
    }
    #logo5{
      width: 70%; 
      margin-left: auto;
      margin-right: auto;
      padding: 6%;
      display: block;
    }
    hr { 
      display: block; 
      margin-before: 0.5em; 
      margin-after: 0.5em; 
      margin-start: auto; 
      margin-end: auto; 
      overflow: hidden; 
      border-style: inset; 
      background-color: green;
      border: none;
      height: 2px;}

    a{
        color:green;
      }

    #titulos{
      color: green;
      font-size: 25px;
      padding-left: 5%;
    }
    #subtitulos{
      color: green;
      font-size: 17px;
      padding-left: 5%;
    }

    /*  COLUMN SETUP  */
    .col {
      display: block;
      float:left;
      margin: 0% 0 % 0%;
    }
    .col:first-child { margin-left: 0; }

    /*  GROUPING  */
    .group:before,
    .group:after {
      content:"";
      display:table;
    }
    .group:after {
      clear:both;
    }
    .group {
        zoom:1; /* For IE 6/7 */
    }

    /*  GRID OF THREE  */
    .span_3_of_3 {
      width: 100%;
    }
    .span_2_of_3 {
      width: 66.1%;
    }
    .span_1_of_3 {
      width: 32.2%;
    }

    /*  GRID OF FOUR  */
    .span_4_of_4 {
      width: 100%;
    }
    .span_3_of_4 {
      width: 68%;
      padding: .2%;
    }
    .span_2_of_4 {
      width: 46%;
      padding: 1%;
    }
    .span_1_of_4 {
      width: 25%;
    }

    @media only screen and (max-width: 480px) {
      .col { margin: 1% 0 1% 0%;}
      .span_3_of_3, .span_2_of_3, .span_1_of_3 { width: 100%; }
      .span_1_of_4,.span_2_of_4 ,.span_3_of_4 ,.span_4_of_4 {width: 100%;}
      #logo2,#logo3{
        padding-left: 0%;
      }

      #one { 
        float: none;
        width:auto;
      }

      #ponente {
        width: 80%;
        padding: 30px;
        display: block;
        margin-left: auto;
        margin-right: auto;
      }
    }

    @media only screen and (max-width: 768px) {
      .col { margin: 1% 0 1% 0%;}
      .span_3_of_3, .span_2_of_3, .span_1_of_3 { width: 90%; }
      .span_1_of_4,.span_2_of_4 ,.span_3_of_4 ,.span_4_of_4 {width: 90%;}
      #logo2,#logo3{
        padding-left: 0%;
      }

      #one { 
        float: none;
        width:auto;
      }

      #ponente {
        width: 80%;
        padding: 30px;
        display: block;
        margin-left: auto;
        margin-right: auto;
      }
      #map{
        width:600px; 
        height:450;
      }
      .contacto{
        padding-left: 5%;
      }
    }

    @media only screen and (max-width: 1024px) {
      .col { margin: 1% 0 1% 0%;}
      .span_3_of_3, .span_2_of_3, .span_1_of_3 { width: 90%; }
      .span_1_of_4,.span_2_of_4 ,.span_3_of_4 ,.span_4_of_4 {width: 90%;}
      #logo2,#logo3{
        padding-left: 0%;
      }

      #one { 
        float: none;
        width:auto;
      }

      #ponente {
        width: 80%;
        padding: 30px;
        display: block;
        margin-left: auto;
        margin-right: auto;
      }
      #map{
        width:600px; 
        height:450;
      }
      .contacto{
        padding-left: 5%;
      }
    }