@media (min-width: 576px) {
    /* styles for browsers larger than 576px; */
    .container, .not-found {
        width: 100% !important;
    }
}
@media (min-width: 960px) {
    /* styles for browsers larger than 960px; */
    .container, .not-found {
        width: 900px !important;
    }
}
@media (min-width: 1440px) {
    /* styles for browsers larger than 1440px; */
    .container, .not-found {
        width: 900px !important;
    }
}
@media (min-width: 2000px) {
    /* for sumo sized (mac) screens */
    .container, .not-found {
        width: 900px !important;
    }
}
@media only screen and (max-device-width: 480px) {
    /* styles for mobile browsers smaller than 480px; (iPhone) */
    .container, .not-found {
        width: 100% !important;
    }
}
@media only screen and (device-width: 768px) {
    /* default iPad screens */
    .container, .not-found {
        width: 100% !important;
    }
}
/* different techniques for iPad screening */
@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
  /* For portrait layouts only */
    .container, .not-found {
        width: 100% !important;
    }
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
  /* For landscape layouts only */
    .container, .not-found {
        width: 900px !important;
    }
}

body {
  background-color: #E3D9C9;
}

div.container {
  background-color: #E3D9C9;
  margin: auto;
  width: 900px;
  height: 800px;
}

img.not-found {
  border-radius: 25px;
  border-width: 2px;
  border-color: #B2966C;
  border-style: solid;
}

div.msg {
    text-align: center;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 1.3rem;
  }

h3 {
  color: #866C46;
}

a:link, a:visited {
  background-color: #866C46;
  color: white;
  padding: 14px 25px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  border-radius: 15px;
}

a:hover, a:active {
  background-color: #AB8C5E;
}