google-fonts-cli/lp/css/lp.css

a quick way to add a google font to your project

 /*http://coolors.co/app/2b193d-2c365e-484d6d-4b8f8c-c5979d */

html, 
body {
    color: #222;
}

header {
    background: #fff;
    padding: 60px 20px 20px 20px;
    width: 100%;
}

h3 {
  color: #757575;
  font-family: Lato, sans-serif;
  font-size: 26px;
  font-weight: 400;
  line-height: 34px;
  text-align: left;
}

h3 small {
  color: #999;
  display: block;
  font-size: 18px;
  line-height: 24px;
  opacity: .92;
}

.font-table {
    display: table;
    margin-left: 50px;
    /*width: 100%;*/
}

/* for 'wireframing' */
/*.font-table * {
    border: solid thin #959595;
}*/

.font-table .row {
    box-sizing: border-box;
    display: table;
    min-height: 120px;
    padding: 15px 25px 20px 40px;
}

.font-table .row.first {
  margin-top: 25px;
}

.font-table .row .cell {
  box-sizing: border-box;
  display: table-cell;
  height: 165px;
  text-align: center;
  vertical-align: middle;
}

.font-table .row .font {
    color: #666;
    opacity: .86;
    text-align: left;
    width: 165px;
}

.font-table .row .font a {
    color: #484D6D;
    display: block;
    font-size: 24px;
    text-decoration: none;
}

.font-table .row .font small {
    color: #959595;
    font-family: Lato, sans-serif;
    font-size: 15px;
    margin: 10px;
}

.font-table .row .example {
    font-size: 52px;
    min-width: 220px;
    padding: 30px 15px 60px 40px;
}

.text-lobster {
    font-family: Lobster, cursive;
}
.text-lato {
    font-family: Lato, sans-serif;
}
.text-center {
  text-align: center;
}

.container {
    /*padding: 100px;*/
    /*text-align: center;*/
}


.container article {
  margin-left: 110px
}



.boots-flat-button {
  background: #fff;
  border: 0;
  border-radius: 10em;
  border: solid 3px #c5979d;
  box-shadow: 1px 1px 0 #ddd,
              -1px -1px 0 #ddd,
              1px -1px 1px #ddd,
              -1px 1px 1px #ddd;
  box-sizing: border-box;
  color: #c5979d;

  cursor: pointer;
  font-family: Lobster, cursive;
  font-size: 32px;
  height: 85px;
  line-height: 60px;
  overflow: hidden;
  padding: 8px 32px 24px 32px;
  text-align: center;
  text-decoration: none;
  text-shadow: 1px 1px 0 #f4f4f4,
              -1px -1px 0 #f4f4f4,
              1px -1px 0 #f4f4f4,
              -1px 1px 1px #f4f4f4;
  transition: background .3s cubic-bezier(0.31, 0.13, 0.36, 1);

  width: 100%;
  max-width: 800px;
}
.boots-flat-button:hover {
  background: #c5979d;
  color: #fff;
  text-shadow: 1px 1px 0 #c5979d,
              -1px -1px 0 #c5979d,
              1px -1px 0 #c5979d,
              -1px 1px 1px #c5979d;
  transition: background .4s cubic-bezier(0.31, 0.13, 0.36, 1);
}
.boots-flat-button:focus {
    box-shadow: 1px 1px 2px #ddd,
                -1px -1px 2px #ddd,
                1px -1px 2px #ddd,
                -1px 1px 2px #ddd;
    outline: none;
}


.u-pad-left {
  padding-left: 15px;
}