<commit_before><!DOCTYPE html>
<html>
<head>
  <title>CSS 4 Life</title>
  <meta charset="UTF-8">
  <meta name="description" content="CSS Tricks">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" type="text/css" href="stylesheets/normalize.css" media="screen">
  <meta name="author" content="<NAME>">

  <style type="text/css">
    @import url(https://fonts.googleapis.com/css?family=Roboto:400,100,300,500,700);

    body {
      padding: 0;
      margin: 0;
      font-family: 'Roboto', sans-serif;
      text-align: center;
      background: #f1f1f1;
    }

    h2 {
      font-size: 2.8em;
      font-weight: 100;
      color: rgba(0,0,0,0.54);
      padding: 0;
      margin-top: 100px;
    }

    .wraper > h2:first-of-type {
      margin-top: 50px;
    }

    .wraper > p:first-child {
      font-weight: 300;
      color: rgba(0,0,0, .8);
      padding-top: 30px;
    }

    .wraper {
      width: 80%;
      margin: 0 auto;
    }

    a {
      text-decoration: none;
      color: #000;
      font-weight: 400;
    }

    a:hover {
      text-decoration: underline;
    }

    /* RECTANGULO FLOATING */

    .rectangulo {
      width: 100px;
      height: 100px;
      border-radius: 5px;
      background: #03a9f4;
      margin: 0 auto;
      box-shadow: 0 1px 3px rgba(0,0,0, 0.3);
      transition: 0.5s ease;
      -webkit-transition: 0.5s ease;
      -o-transition: 0.5s ease;
      -moz-transition: 0.5s ease;
    }

    .rectangulo:hover {
      box-shadow: 0 8px 20px rgba(0,0,0, 0.3);
      cursor: pointer;
    }

    /* CIRCULO A RECTANGULO */

    .contenedor {
      width: 200px;
      height: 200px;
      border-radius: 5px;
      margin: 0 auto;
      box-shadow: 0 1px 3px rgba(0,0,0, 0.3);
      background: #fff;
      padding: 2px;
    }

    .circulo {
      width: 50%;
      height: 50%;
      border-radius: 50%;
      background: #03a9f4;
      margin: 0 auto;
      position: relative;
      top: 25%;
      transition: 0.5s ease;
      -webkit-transition: 0.5s ease;
      -o-transition: 0.5s ease;
      -moz-transition: 0.5s ease;
    }

    .contenedor:hover .circulo {
      width: 200px;
      height: 200px;
      border-radius: 5px;
      top: 0;
    }

    .hora {
      font-size: 2em;
      padding: 0;
      color: #fff;
      position: absolute;
      margin: 20px 0 0 20px;
      z-index: 100;
      opacity: 0;
      transition: 0.9s ease;
      -webkit-transition: 0.9s ease;
      -o-transition: 0.9s ease;
      -moz-transition: 0.9s ease;
    }

    .contenedor:hover .hora {
      opacity: 1;
    }

    /* CUADRADO SOBRE CUADRADO */

    .contenedor2 {
      width: 32%;
      margin: 0 auto;
      margin-top: 50px;
    }

    .cuadrado1 {
      width: 150px;
      height: 150px;
      position: relative;
      display: inline-block;
      margin-right: 5%;
      z-index: 200;
      animation: superponer 4s infinite;
        -webkit-animation: superponer 4s infinite;
        -moz-animation: superponer 4s infinite;
        -o-animation: superponer 4s infinite;
    }

    .cuadrado2 {
      width: 150px;
      height: 150px;
      position: relative;<commit_msg>Width 35%<commit_after><!DOCTYPE html>
<html>
<head>
  <title>CSS 4 Life</title>
  <meta charset="UTF-8">
  <meta name="description" content="CSS Tricks">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" type="text/css" href="stylesheets/normalize.css" media="screen">
  <meta name="author" content="<NAME>">

  <style type="text/css">
    @import url(https://fonts.googleapis.com/css?family=Roboto:400,100,300,500,700);

    body {
      padding: 0;
      margin: 0;
      font-family: 'Roboto', sans-serif;
      text-align: center;
      background: #f1f1f1;
    }

    h2 {
      font-size: 2.8em;
      font-weight: 100;
      color: rgba(0,0,0,0.54);
      padding: 0;
      margin-top: 100px;
    }

    .wraper > h2:first-of-type {
      margin-top: 50px;
    }

    .wraper > p:first-child {
      font-weight: 300;
      color: rgba(0,0,0, .8);
      padding-top: 30px;
    }

    .wraper {
      width: 80%;
      margin: 0 auto;
    }

    a {
      text-decoration: none;
      color: #000;
      font-weight: 400;
    }

    a:hover {
      text-decoration: underline;
    }

    /* RECTANGULO FLOATING */

    .rectangulo {
      width: 100px;
      height: 100px;
      border-radius: 5px;
      background: #03a9f4;
      margin: 0 auto;
      box-shadow: 0 1px 3px rgba(0,0,0, 0.3);
      transition: 0.5s ease;
      -webkit-transition: 0.5s ease;
      -o-transition: 0.5s ease;
      -moz-transition: 0.5s ease;
    }

    .rectangulo:hover {
      box-shadow: 0 8px 20px rgba(0,0,0, 0.3);
      cursor: pointer;
    }

    /* CIRCULO A RECTANGULO */

    .contenedor {
      width: 200px;
      height: 200px;
      border-radius: 5px;
      margin: 0 auto;
      box-shadow: 0 1px 3px rgba(0,0,0, 0.3);
      background: #fff;
      padding: 2px;
    }

    .circulo {
      width: 50%;
      height: 50%;
      border-radius: 50%;
      background: #03a9f4;
      margin: 0 auto;
      position: relative;
      top: 25%;
      transition: 0.5s ease;
      -webkit-transition: 0.5s ease;
      -o-transition: 0.5s ease;
      -moz-transition: 0.5s ease;
    }

    .contenedor:hover .circulo {
      width: 200px;
      height: 200px;
      border-radius: 5px;
      top: 0;
    }

    .hora {
      font-size: 2em;
      padding: 0;
      color: #fff;
      position: absolute;
      margin: 20px 0 0 20px;
      z-index: 100;
      opacity: 0;
      transition: 0.9s ease;
      -webkit-transition: 0.9s ease;
      -o-transition: 0.9s ease;
      -moz-transition: 0.9s ease;
    }

    .contenedor:hover .hora {
      opacity: 1;
    }

    /* CUADRADO SOBRE CUADRADO */

    .contenedor2 {
      width: 35%;
      margin: 0 auto;
      margin-top: 50px;
    }

    .cuadrado1 {
      width: 150px;
      height: 150px;
      position: relative;
      display: inline-block;
      margin-right: 5%;
      z-index: 200;
      animation: superponer 4s infinite;
        -webkit-animation: superponer 4s infinite;
        -moz-animation: superponer 4s infinite;
        -o-animation: superponer 4s infinite;
    }

    .cuadrado2 {
      width: 150px;
      height: 150px;
      position: relative;
{'fraction_non_alphanumeric': 0.13733837906023336, 'fraction_numerical': 0.0608640807316304, 'mean_word_length': 1.9096330275229358, 'pattern_counts': {'":': 0, '<': 27, '<?xml version=': 0, '>': 31, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1483246', 'n_tokens_mistral': 2687, 'n_tokens_neox': 2311, 'n_words': 528}