@font-face {
  font-family: "Roboto";
  src: url("Roboto-Light-webfont.woff") format("woff");
  font-style: normal;
  font-weight: 300;
}

@font-face {
  font-family: "Roboto";
  src: url("Roboto-LightItalic-webfont.woff") format("woff");
  font-style: italic;
  font-weight: 300;
}

@font-face {
  font-family: "Roboto";
  src: url("Roboto-Bold-webfont.woff") format("woff");
  font-style: normal;
  font-weight: 700;
}

* {
  box-sizing: border-box;
  margin: 0;
}

body {
  font-family: "Roboto", sans-serif;
  font-weight: 300;
  font-size: 18px;
  line-height: 1.8em;
  color: #5D6063;
  background: #D6E9FE;
}

h1 {
  font-size: 40px;
}

h2 {
  font-size: 30px;
}

.container > * + * {
  /*margin-top: 20px;*/
}

section {
  height:100VH;
  /*padding-top: 40px;*/
  /*padding-bottom: 40px;*/
}

.one {
  background-color: #D6E9FE;
}


.container {
  margin-left: auto;
  margin-right: auto;
  /*padding-left: 15px;*/
  /*padding-right: 15px;*/
  width: 100%;
  height:100%;
  display:flex;
  justify-content:center;
  align-items:center;
}

@media screen and (min-width: 576px) {
  .container {
    max-width: 540px;
  }
}

@media screen and (min-width: 768px) {
  .container {
    max-width: 720px;
  }
}

@media screen and (min-width: 992px) {
  .container {
    max-width: 960px;
  }
}

@media screen and (min-width: 1200px) {
  .container {
    max-width: 1140px;
  }
}