@media only screen and (max-width: 1199px) {
  body {
    font-size: 0.9em; }
  h4 {
    font-size: 120%;
    padding: 1.7094017% 8%; }
  #popcorn-map {
    height: 400px; }
  .image-products {
    width: 40%;
    margin: 0 40% 0 20%; } }

@media only screen and (max-width: 991px) {
  /* *****RESUSABLE******  */
  h1 {
    font-size: 170%; }
  h2 {
    font-size: 160%; }
  h3 {
    font-size: 120%; }
  h4 {
    font-size: 110%;
    padding: 1.7094017% 5.1282051%; }
  .header-background-wrapper {
    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url("./../../commons/image/carousel_popcorns.png");
    background-size: cover;
    background-position: center;
    height: 100vh;
    max-height: 100vh; }
  .logo-text {
    width: 100%; }
  .logo-lg > img {
    width: 20%;
    margin-right: 40%;
    margin-left: 40%; }
  .image-weaver-logo {
    margin: 7% 35% 0 35%;
    height: 30%; }
  .title-honourable {
    display: none; }
  .header-text {
    width: 70%;
    margin: 0 15%; }
  .product-description p {
    padding-left: 8.3333333%;
    padding-right: 8.3333333%; }
  .image-products {
    width: 40%;
    margin: 0 23% 0 37%; }
  .slider-size {
    height: 400px; }
  .map-box {
    height: 300px; }
  #popcorn-map {
    height: 300px; }
  .contact-box {
    height: 300px;
    width: 50%; } }

@media only screen and (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
  .header-background-wrapper {
    background-attachment: scroll; } }

@media only screen and (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
  .header-background-wrapper {
    background-attachment: scroll; } }

@media only screen and (max-width: 768px) {
  /* *****RESUSABLE******  */
  body {
    font-size: 80%; }
  h1 {
    font-size: 150%; }
  .stars {
    margin: 0 28% 0 32%; }
  .image-products {
    height: 250px;
    width: 30%;
    margin: 0 31% 0 39%; }
  /* */
  .image-weaver-logo {
    margin: 15% 30% 0% 30%; }
  .slider-size {
    height: 350px; }
  .map-box {
    width: 100%; }
  .map-info {
    width: 98%; } }

@media only screen and (max-width: 700px) {
  .image-products {
    width: 30%;
    margin: 0 33% 0 37%; }
  .stars {
    margin: 0 27% 0 33%; } }

@media only screen and (max-width: 600px) {
  .image-products {
    width: 40%;
    margin: 0 26% 0 34%; }
  .col-xms-0 {
    width: 0; }
  .headers-top {
    padding-top: 15%; }
  .col-xms-6 {
    width: 50%; }
  .contact-box {
    display: none; }
  .contact-box-changer {
    display: block; }
  .slider-size {
    height: 300px; }
  .stars {
    width: 70%;
    margin-left: 18.5%;
    margin-right: 11.5%; } }

/* ----------- iPhone 4 and 4S ----------- */
/* Portrait and Landscape */
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) {
  .header-background-wrapper {
    background-attachment: scroll; } }

/* Portrait */
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {
  .header-background-wrapper {
    background-attachment: scroll; } }

/* Landscape */
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {
  .header-background-wrapper {
    background-attachment: scroll; } }

/* ----------- iPhone 5 and 5S ----------- */
/* Portrait and Landscape */
@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) {
  .header-background-wrapper {
    background-attachment: scroll; } }

/* Portrait */
@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {
  .header-background-wrapper {
    background-attachment: scroll; } }

/* Landscape */
@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {
  .header-background-wrapper {
    background-attachment: scroll; } }

/* ----------- iPhone 6 ----------- */
/* Portrait and Landscape */
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) {
  .header-background-wrapper {
    background-attachment: scroll; } }

/* Portrait */
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {
  .header-background-wrapper {
    background-attachment: scroll; } }

/* Landscape */
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {
  .header-background-wrapper {
    background-attachment: scroll; } }

/* ----------- iPhone 6+ ----------- */
/* Portrait and Landscape */
@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (-webkit-min-device-pixel-ratio: 3) {
  .header-background-wrapper {
    background-attachment: scroll; } }

/* Portrait */
@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (-webkit-min-device-pixel-ratio: 3) and (orientation: portrait) {
  .header-background-wrapper {
    background-attachment: scroll; } }

/* Landscape */
@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (-webkit-min-device-pixel-ratio: 3) and (orientation: landscape) {
  .header-background-wrapper {
    background-attachment: scroll; } }

@media only screen and (max-width: 480px) {
  .col-xxs-12 {
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
    padding: 0; }
  .navbar {
    padding-top: 0px;
    padding-bottom: 0px;
    border: none; }
    .navbar .header-text {
      width: 150%;
      position: absolute; }
    .navbar h1 {
      font-size: 110%; }
    .navbar h2:after {
      width: 100%; }
  .headers-top {
    padding-top: 17%; }
  .logo-lg > img {
    width: 40%;
    margin-right: 30%;
    margin-left: 30%; }
  .navbar-brand {
    padding: 5px; }
  .stars {
    width: 70%;
    margin-left: 18.5%;
    margin-right: 11.5%; }
  .popcorn-header {
    height: 100%; }
  .image-products {
    width: 50%;
    margin: 0 20% 0 30%; }
  .slider-size {
    height: 250px; }
  .contact-info {
    margin: auto 5%; }
  .map-box {
    height: 200px; }
  #popcorn-map {
    height: 200px; } }

@media only screen and (max-width: 400px) {
  .image-products {
    margin: 0 25% 0 25%; }
  .carousel-caption {
    position: static;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4); } }

@media only screen and (max-width: 320px) {
  .image-products {
    width: 60%;
    margin: 0 21% 0 19%; }
  .headers-top {
    padding-top: 25%; }
  .stars {
    width: 80%;
    margin-left: 18%;
    margin-right: 2%; } }

@media only screen and (max-width: 260px) {
  .image-products {
    width: 80%;
    margin: 0 8% 0 12%; } }

@media only screen and (max-width: 239px) {
  .image-products {
    width: 80%;
    margin: 0 13% 0 7%; } }