@media screen and (min-width:0\0) { 
  .splash {
    display:block !important;
    background-color:rgba(255,0,0,0.8);
    width:100%;
    height:auto;
    padding:20px;
    color:white;
    text-align:center;
    margin-bottom:20px
  }

}
/* 
Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
  body {
    width:100%;
    max-width:100%
  }
.container {
padding: 0 !important;
margin: 0 !important;
  width:auto;
max-width: 100%;
  }
}

/* Smartphones (landscape) ----------- */
@media only screen 
and (min-width : 321px) {
.container {
padding: 0 !important;
margin: 0 !important;
  width:auto;
max-width: 100%;
  }
    body {
    width:100%;
    max-width:100%
  }
}

/* Smartphones (portrait) ----------- */
@media only screen 
and (max-width : 320px) {
.container {
padding: 0 !important;
margin: 0 !important;
  width:auto;
max-width: 100%;
  }
    body {
    width:100%;
    max-width:100%
  }
}

/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
/* Styles */
}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */
}

/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
/* Styles */
}

/* Desktops and laptops ----------- */
@media only screen 
and (min-width : 1224px) {
.container {
    margin:0 40px!important;
      width:auto;
  }
}

/* Large screens ----------- */
@media only screen 
and (min-width : 1824px) {
.container {
    margin:0 40px!important;
      width:auto;
  }
}

/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
/* Styles */
}