/* site wide styles */
@-ms-viewport {
  width: device-width;
}
* {
  box-sizing: border-box;
}
body {
  background-color: #ffffff;
  font-family: 'Open Sans', Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 1.25;
  max-width: 1000px;
  margin:0 auto;
}
.center {
  margin: 0 auto;
}
.flexbox {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
img {
  width: 100%;
}
.text-center {
  text-align: center;
}

/*______________________________ colors _______________________________*/
.red {
  color: #cc0000;
}
.grey {
  color: #333333;
}

/*______________________________ headlines & paragraphs _______________________________*/
h1 {
  font-size: 2.625em; /* 42px */
  font-weight: 600;
  line-height: 1.15;
}
h2 {
  font-size: 1.875em; /* 32px */
  font-weight: 300;
}
h3 {
  font-size: 1.75em; /* 28px */
  font-weight: 300;
}
p {
  font-size: 1.125em; /* 18px */
  text-align: left;
  margin-top: 0.938em; /* 15px */
}
.boldme {
  font-weight: 700;
}
@media screen and (min-width: 440px) {
  h1 {
    font-size: 3.75em; /* 60px */
    font-weight: 600;
  }
  h2 {
    font-size: 2.625em; /* 42px */
    font-weight: 300;
  }
  h3 {
    font-size: 1.875em; /* 32px */
    font-weight: 300;
  }
  p {
    font-size: 1.125em; /* 18px */
    text-align: left;
    margin-top: 0.938em; /* 15px */
  }
}
/*______________________________ header _______________________________*/
header {
  /*visibility: hidden;*/
}
header figure.logo {
  margin-bottom: 1.375em; /* 22px */
  max-width: 9.75em; /* 156px */
  padding-top: 1.625em; /* 26px */
  width: 90%;
}

/*______________________________ main _______________________________*/
main {
  position: relative;
}
.sticky-container {
  background-color: #00477d;
  display: none;
  float: left;
  margin-top: 20.5em;
  padding: 0.75em 0 1.5em 0;
  transition: all 0.5s;
  width: 5em; /* 103px */
  z-index: 100;
}
.sticky-container:hover {
  background-color: #013359;
}
.sticky-container figcaption {
  color: #ffffff;
  line-height: 1.25;
}
.sticky-container figure img {
  width: 3.75em; /* 60px */
}
@media screen and (min-width: 1080px) {
  .sticky-container {
    display: block;
    position: -webkit-sticky;
    position: sticky;
    top: 60px;
  }
}
/*______________________________ message-one _______________________________*/
.message-one-container {
  /*visibility: hidden;*/
  margin-top: 0.938em; /* 15px */
}
.message-one-text-container {
  max-width: 80em; /* 1280px */
  width: 90%;
}
.video-one {
  margin-top: 0.938em; /* 15px */
  max-width: 36.25em; /* 580px; */
}
.video-one img {
  width:80%;
}
@media (min-width: 800px) {
  .video-one {
    padding-bottom: 6em;
  }
  .video-one img {
  width:100%;
  }
  .message-one-container {
    background-image: url('../img/polyleft.png'), url('../img/polyright.png');
    background-size: contain, contain;
    background-position: left bottom, right bottom;
    background-repeat: no-repeat, no-repeat;
  }
}

/*______________________________ message-two _______________________________*/
.message-two-container img {
  display: block;
}
.bg-color {
  background-color: #e7e7e8;
}
.message-two-icon-container {
  padding-bottom: 3.938em; /* 63px */
  padding-top: 1.688em; /* 27px */
  max-width: 80em; /* 1280px; */
  width: 90%;
}
.red-circle {
  background-color: #cc0000;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  color: #ffffff;
  font-size: 2.625em; /* 42px */
  height: 2.143em; /* 90px */
  padding-top: 0.4em;
  width: 2.143em; /* 90px */
}
.message-two-icon-container .flexbox-child {
  margin-top: 2em; /* 32px */
  text-align: center;
  width: 45%;
}
.message-two-icon-container .flexbox-child:last-child {
  width: 100%;
}
@media screen and (min-width: 800px) {
  .message-two-container {
    margin-top: -4em;
    position: relative;
  }
  .message-two-icon-container .flexbox-child {
    width: 18%;
  }
  .message-two-icon-container .flexbox-child:last-child {
    width: 18%;
  }
}

/*______________________________ message-three _______________________________*/
.message-three-container {
  margin: 1.823em 0; /* 29px */
  max-width: 80em; /* 1280px; */
  width: 90%;
}
.message-three-container .flexbox {
  margin-top: 1.823em; /* 29px */
  max-width: 600px;
}
.message-three-container figure {
  width: 45%;
}
.message-three-container img {
  max-width: 20.25em; /* 324px */
}
.message-three-container a {
  color: #333333;
  font-weight: 700;
  text-decoration: none;
}
.message-three-container a:hover {
  text-decoration: underline;
  color: #717172;
}
/*______________________________ message-four _______________________________*/
.angle-top {
  background: #f2f2f2;
  position: relative;
  z-index: 1;
  margin-top: 120px;
}
.angle-top:before {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  background: inherit;
  content: '';
  display: block;
  height: 10%;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: -1;
  -webkit-transform: skewY(-4deg);
  transform: skewY(-4deg);
  -webkit-transform-origin: 0 0;
  transform-origin: 0 0;
}
@media screen and (min-width: 800px) {
  .angle-top:before {
    height: 30%;
  }
  .angle-top:before {
    -webkit-transform: skewY(-3deg);
    transform: skewY(-3deg);
  }
}
.message-four-container {
  background-color: #f2f2f2;
  padding-bottom: 4em;
}
.message-four-content-container {
  max-width: 80em; /* 1280px */
  width: 90%;
}
.message-four-content-container p {
  max-width: 480px;
  margin-top: 0.938em; /* 15px */
}
.message-four-container figure {
  width: 100%;
}
.message-four-container figure {
  margin-top: 1.563em; /* 25px */
}
.message-four-container img {
  display: block;
  /* max-width: 25.688em;  411px */
  max-width: 19.688em; /* 315px */
}
.message-four-container figure:last-child {
  margin-top: 2.625em; /* 42px */
}
.message-four-container figcaption {
  margin-top: 1.823em; /* 29px */
  max-width: 350px;
}
.message-four-container figcaption a {
  display: block;
  text-decoration: none;
  margin-top: 0.938em; /* 15px */
  width: 11.25em; /* 180px; */
}
.message-four-container button {
  background-color: #cc0000;
  border: 0;
  border-radius: 0;
  color: #ffffff;
  cursor: pointer;
  font-size: 1.125em; /* 18px; */
  font-weight: 600;
  height: 3.125em; /* 50px */
  transition: all 0.5s;
  width: 100%;
}
.message-four-container button:hover {
  background-color: #f2f2f2;
  border: 2px solid #cc0000;
  color: #cc0000;
  transition: all 0.5s;
}
@media screen and (min-width: 760px) {
  .message-four-container figure {
    width: 45%;
  }
  .message-four-container figure:last-child {
    margin-top: 1.563em; /* 25px */
  }
}

/*______________________________ message-five _______________________________*/
.message-five-container {
  border-bottom: 0.5em solid #e7e7e8;
  padding: 6em 0; /* 55px 0 */
  max-width: 80em; /* 1280px */
  width: 90%;
}
.message-five-container .flexbox {
  align-items: center;
  margin-top: 0.938em; /* 15px */
  max-width: 540px;
}
.message-five-container .flexbox figure {
  text-align: center;
  width: 15%;
}
.message-five-container .flexbox figure:nth-child(3) {
  text-align: center;
  width: 8%;
}
.icon-av-test {
  max-width: 6.25em; /* 100px */
}
.icon-av-comparative {
  max-width: 6.25em; /* 100px */
}
.icon-pc {
  max-width: 2.125em; /* 34px */
}
.icon-amazon {
  max-width: 7.938em; /* 127px */
}
.icon-av-product {
  max-width: 6.75em; /* 108px */
}

/*______________________________ message-six _______________________________*/
.message-six-container {
  background-color: #f2f2f2;
  padding-top: 1.875em; /* 30px */
  position: relative;
}
.message-six-content-container {
  max-width: 80em; /* 1280px */
  width: 90%;
}
.message-six-content-container .flexbox-child:first-child {
  background-image: url('../img/quote.png');
  background-repeat: no-repeat;
  padding-bottom: 3.75em; /* 60px */
}
.message-six-content-container .flexbox-child:first-child p {
  margin-top: 2.5em;
}
.message-six-content-container .flexbox-child:last-child {
  display: none;
}
.message-six-content-container p:last-child {
  font-style: italic;
}
@media (min-width: 800px) {
  .message-six-content-container {
    flex-wrap: nowrap;
    justify-content: space-between;
  }
  .message-six-content-container .flexbox-child:first-child {
    width: 50%;
  }
  .message-six-content-container .flexbox-child:last-child {
    background-image: url('../img/teachercreature_v3.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    display: block;
    margin-top: -7.2em;
    position: relative;
    width: 50%;
  }
}

/*______________________________ message-seven ______________________________*/
.message-seven-container {
  background-color: #00477d;
}
.message-seven-content-container {
  color: #ffffff;
  flex-wrap: nowrap;
  max-width: 78.75rem; /* 1260px */
  padding: 1.625em 0; /* 26px */
  max-width: 1080px;
  width: 90%;
}
.message-seven-content-container p {
  margin-top: 0;
}
.message-seven-container .flexbox div {
  width: 60%;
}
.message-seven-container .flexbox div:last-child {
  text-align: right;
  width: 35%;
}
.message-seven-content-container button {
  background-color: #00477d;
  border: 2px solid #fff;
  color: #fff;
  cursor: pointer;
  font-size: 1.125em; /* 18px */
  height: 2.778em; /* 50px */
  max-width: 10em; /* 180px */
  text-decoration: none;
  transition-duration: 0.4s;
  -webkit-transition-duration: 0.4s; /* Safari */
  width: 100%;
}
.message-seven-content-container button:hover {
  background-color: #ffffff;
  border: 2px solid #00477d;
  color: #00477d;
}
@media screen and (min-width: 1080px) {
  .message-seven-content-container p {
    margin-top: 0.75em; /* 8px */
  }
}
@media screen and (min-width: 480px) {
  .message-seven-container .flexbox div {
    width: 60%;
  }
  .message-seven-container .flexbox div:last-child {
    text-align: right;
    width: 40%;
  }
}
/*______________________________ footer _______________________________*/
footer {
  background-color: #333333;
}
.footer-content-container {
  color: #ffffff;
  font-size: 0.875em; /* 14px */
  max-width: 90em; /* 1260px */
  padding: 4em 0; /* 28px 0 */
  width: 90%;
}
footer nav a {
  color: #ffffff;
  margin: 0 4%; /* 0 20px */
  text-decoration: none;
}
footer .flexbox-child-one {
  flex-wrap: nowrap;
}
footer .flexbox-child-two {
  flex-wrap: nowrap;
}
footer .flexbox-child-two p {
  text-align: left;
  width: 70%;
}
footer .flexbox-child-two figure {
  text-align: right;
  width: 25%;
}
footer .social-container {
  margin-top: 1.929em; /* 27px */
  margin-bottom: 3em; /* 42px */
}
footer .social-container figure {
  display: inline-block;
}
.avtest-logo {
  display: inline-block;
  padding: 5px;
  width: 90px;
}
footer .social-img {
  padding: 0.625em 0.625em 0; /* 10px */
  width: 48px;
}
footer .facebook {
  padding: 0.625em 0.625em 0; /* 10px */
  width: 2.25em; /* 36px */
}
footer p {
  font-size: 0.875em; /* 14px */
  line-height: 1.75;
}
@media screen and (min-width: 800px) {
  .footer-content-container {
    align-items: flex-end;
    display: flex;
    justify-content: space-between;
  }
  footer .flexbox-child-one {
    text-align: left;
    width: 40%;
  }
  footer .flexbox-child-two {
    align-items: flex-end;
    flex-wrap: nowrap;
    width: 55%;
  }
  footer .social-container {
    margin-bottom: 0;
  }
  footer .flexbox-child-two {
    width: 100%;
  }
  footer .flexbox-child-two p {
    text-align: right;
    width: 80%;
  }
  footer .flexbox-child-two figure {
    width: 15%;
  }
  footer nav a:first-child {
    margin-left: 0;
  }
}
