@import url('https://fonts.googleapis.com/icon?family=Material+Icons');

html, body {
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
     line-height: 1.5;
     font-family: "Roboto", sans-serif;
     font-weight: normal;
     color: rgba(0,0,0,0.87);
}

@media all and (min-width: 0) {
  html {
    font-size: 14px;
  }
}
@media all and (min-width: 992px) {
  html {
    font-size: 14.5px;
  }
}
@media all and (min-width: 1200px) {
  html {
    font-size: 15px;
  }
}

/* -----------------------------------
        t. Typography
----------------------------------- */


h1, h2, h3, h4, h5, h6 {
    margin-bottom: 1rem;
    margin-top: 1rem;
}
h1 {
    font-size: 4.2rem;
    line-height: 110%;
    margin: 2.1rem 0 1.68rem 0;
}
h2 {
    font-size: 3.56rem;
    line-height: 110%;
    margin: 1.78rem 0 1.424rem 0;
}
h3 {
    font-size: 2.92rem;
    line-height: 110%;
    margin: 1.46rem 0 1.168rem 0;
}
h4 {
    font-size: 2.28rem;
    line-height: 110%;
    margin: 1.14rem 0 .912rem 0;
}
h5 {
    font-size: 1.64rem;
    line-height: 110%;
    margin: .82rem 0 .656rem 0;
}
h6 {
    font-size: 1rem;
    line-height: 110%;
    margin: .5rem 0 .4rem 0;
}

p {
    /*font-size: 1.6rem;*/
    font-weight: 400;
    letter-spacing: 0.010em;
    line-height: 1.6em;
    margin: 0;
}

.md-display-4 {
    font-size: 112px;
    font-weight: 300;
    letter-spacing: -.01em;
    line-height: 112px;
    margin: 0;
}
.md-display-3 {
    font-size: 56px;
    font-weight: 400;
    letter-spacing: -.005em;
    line-height: 56px;
    margin: 0;
}
.md-display-2 {
    font-size: 45px;
    font-weight: 400;
    line-height: 64px;
    margin: 0;
}
.md-display-1 {
    font-size: 34px;
    font-weight: 400;
    line-height: 40px;
    margin: 0;
}
.md-headline {
    font-size: 24px;
    font-weight: 400;
    line-height: 32px;
    margin: 0;
}
.md-title {
    font-size: 20px;
    font-weight: 500;
    letter-spacing: .005em;
    margin: 0;
}
.md-subhead {
    font-size: 16px;
    line-height: 24px;
    margin: 0;
}
.md-body-1 {
    font-size: 14px;
    line-height: 20px;
    margin:0;
}
.md-body-2 {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: .01em;
    line-height: 24px;
    margin: 0;
}

.md-body-1,
.md-subhead {
    font-weight: 400;
    letter-spacing: .01em;
}
.md-button {
    letter-spacing: .01em;
}
.md-button {
    display: inline-block;
    position: relative;
    cursor: pointer;
    min-height: 36px;
    min-width: 88px;
    line-height: 36px;
    vertical-align: middle;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    text-align: center;
    border-radius: 2px;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    outline: none;
    border: 0;
    padding: 0 6px;
    margin: 6px 8px;
    background: transparent;
    color: currentColor;
    white-space: nowrap;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 14px;
    font-style: inherit;
    font-variant: inherit;
    font-family: inherit;
    text-decoration: none;
    overflow: hidden;
    -webkit-transition: box-shadow .4s cubic-bezier(.25,.8,.25,1),background-color .4s cubic-bezier(.25,.8,.25,1);
    transition: box-shadow .4s cubic-bezier(.25,.8,.25,1),background-color .4s cubic-bezier(.25,.8,.25,1);
}

.md-caption {
    font-size: 12px;
    letter-spacing: .02em;
}


/* -----------------------------------
        a. Anchor
----------------------------------- */
a {
    cursor: pointer;
    text-decoration: none;
    text-shadow: none;
    -webkit-transition: all 200ms ease;
         -o-transition: all 200ms ease;
            transition: all 200ms ease;
}
a:hover,
a:focus,
a:active {
    outline: none;
    text-decoration: none;
}

/* -----------------------------------
        b. Button
----------------------------------- */
.z-depth-1 {
    -webkit-transition: .3s ease-out;
            transition: .3s ease-out;
    -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);
       -moz-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);
            box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);
}
.z-depth-1:hover {
    -webkit-box-shadow: 0 3px 3px 0 rgba(0,0,0,0.14), 0 1px 7px 0 rgba(0,0,0,0.12), 0 3px 1px -1px rgba(0,0,0,0.2);
       -moz-box-shadow: 0 3px 3px 0 rgba(0,0,0,0.14), 0 1px 7px 0 rgba(0,0,0,0.12), 0 3px 1px -1px rgba(0,0,0,0.2);
            box-shadow: 0 3px 3px 0 rgba(0,0,0,0.14), 0 1px 7px 0 rgba(0,0,0,0.12), 0 3px 1px -1px rgba(0,0,0,0.2);
}

.col-lg-1,
.col-lg-10,
.col-lg-11,
.col-lg-12,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-md-1,
.col-md-10,
.col-md-11,
.col-md-12,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-sm-1,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-xs-1,
.col-xs-10,
.col-xs-11,
.col-xs-12,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9,
.container,
.container-fluid {
    padding-right: 16px;
    padding-left: 16px;
}
.row {
  margin-left: -16px;
  margin-right: -16px;
}

.card-1 {
  -webkit-transition: all 0.3s cubic-bezier(.25,.8,.25,1);
       -o-transition: all 0.3s cubic-bezier(.25,.8,.25,1);
          transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
     -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
          box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
}

.card-2 {
  -webkit-transition: all 0.3s cubic-bezier(.25,.8,.25,1);
       -o-transition: all 0.3s cubic-bezier(.25,.8,.25,1);
          transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  -webkit-box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
     -moz-box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
          box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
}

.card-3 {
  -webkit-transition: all 0.3s cubic-bezier(.25,.8,.25,1);
       -o-transition: all 0.3s cubic-bezier(.25,.8,.25,1);
          transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  -webkit-box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
     -moz-box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
          box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}

.card-4 {
  -webkit-transition: all 0.3s cubic-bezier(.25,.8,.25,1);
       -o-transition: all 0.3s cubic-bezier(.25,.8,.25,1);
          transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  -webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
     -moz-box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
          box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
}

.card-5 {
  -webkit-transition: all 0.3s cubic-bezier(.25,.8,.25,1);
       -o-transition: all 0.3s cubic-bezier(.25,.8,.25,1);
          transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  -webkit-box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
     -moz-box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
          box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
}