@import url(reset.css);
@import 'https://fonts.googleapis.com/css?family=Lato:400,700,300';
@import url(toastgrid.css);
body {
  font-family: "Lato", Helvetica, sans-serif;
}

.header {
  padding: 33px 0;
  margin-bottom: 66px;
  font-size: 1.2em;
}

.header .headwrap {
  margin: 0 132px;
}

.container {
  margin: 0 66px;
}

.circle {
  border-radius: 50%;
  width: 233px;
  height: 233px;
  background: #ff8f1c;
  margin: auto;
  margin-bottom: 66px;
}

.circle .smaller {
  font-size: 3em;
  padding-top: 90px;
}

.circle .larger {
  font-size: 6em;
  padding-top: 60px;
}

.circle p {
  font-size: 3.6em;
  font-weight: bold;
  padding-top: 80px;
}

.grid {
  text-align: center;
}

.title {
  margin-bottom: 20px;
}

.dark {
  background-color: #333;
  color: white;
}

.security .accent {
  background-color: #ff8f1c;
}

.security .bonus {
  background-color: #2980B9;
}

.security button {
  margin-top: 20px;
  margin-right: 10px;
  background-color: #666;
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
}

.security ul {
  padding: 66px 0;
  margin: 0 66px;
}

.security ul li {
  padding: 30px;
  margin-top: 30px;
  background-color: #666;
}

.security ul li p {
  font-weight: lighter;
  line-height: 1.5em;
  padding-top: 10px;
}

.security ul a {
  text-decoration: none;
  color: white;
}