/* Smartphones (portrait and landscape) ----------- */
@media only screen
and (min-width : 320px)
and (max-width : 480px) {
 #headvideo, #mylightbox {display: none;}
 #navbar {text-align: center;}
 #nav ul {padding: 0px !important}
 #header {background-attachment: scroll;}
 #logostatus {margin: 0 auto; padding-bottom: 20px; width: 150px; height: auto;}
 #box1 p {text-align: center; padding-top: 30px;}
 #statusbutton {width: 100%;}
 #box1_2 img { max-width: 100%;}
 #box1_2 {padding-top: 0px; padding-left: 50px; padding-right: 50px; padding-bottom: 50px;}
  #citbig {background-image: url("/img/1111.jpg"); height: auto; padding-top: 100px; padding-bottom: 100px; text-align: left; padding-left: 20px; padding-right: 20px;}
 #citbig p {font-size: 1.5em !important;padding: 0px; text-align: left;}
 #citbig h4 {font-size: 1em !important; opacity: 0.5; padding: 0px; text-align: left;}
   #citparallax {height: auto; padding-top: 100px; padding-bottom: 100px; background-image: url("/img/1111.jpg");}
  #marraparallax {display: none;}
   #citparallax {height: auto; padding-top: 100px; padding-bottom: 100px; background-image: url("/img/1111.jpg");}
  #marraparallax {display: none;}
  #txtparallax {margin: 0px !important; font-size: 1.5em !important; text-align: left; padding-left: 20px; padding-right: 20px;}
 #txtparallax h4 {opacity: 0.5; padding: 0px; text-align: left;}
 .linkfooter img {max-width: 80px;}
 #links {height: auto; padding-top:30px; padding-bottom: 30px;}
 .datasquare h1 { font-size: 0.8em;}
 .datasquare h2 { font-size: 0.8em;}
 .overlayicon{ width: 140px; height: 60px; margin-top: -30px;}
 .spotify, .itunes {width: 40px; height: 40px; display: none;}
 .coveralbum img {opacity: 1;}
 .coveroverlay {background-color: transparent; opacity: 1;}
 .instadesktop {display: none;}
 .crediti {display: none;}
 .copydesktop {display: none;}
 #footer {text-align: center; padding-left: 0px;}
 #bigvideo {background-size: auto !important; background-attachment: scroll !important;}
 #wrapper {overflow-x: hidden;}
}

@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px)
and (orientation : landscape) {


 #headvideo, #mylightbox {display: none;}
 #navbar {text-align: center;}
 #nav ul {padding: 0px !important}
 #header {background-attachment: scroll;}
 #logostatus {margin: 0 auto; padding-bottom: 20px; width: 150px; height: auto;}
 #box1 p {text-align: center; padding-top: 30px;}
 #statusbutton {width: 100%;}
 #box1_2 img { max-width: 100%;}
 #box1_2 {padding-top: 0px; padding-left: 50px; padding-right: 50px; padding-bottom: 50px;}
  #citbig {background-image: url("/img/1111.jpg"); height: auto; padding-top: 100px; padding-bottom: 100px; text-align: left; padding-left: 20px; padding-right: 20px;}
 #citbig p {font-size: 1.5em !important;padding: 0px; text-align: left;}
 #citbig h4 {font-size: 1em !important; opacity: 0.5; padding: 0px; text-align: left;}
   #citparallax {height: auto; padding-top: 100px; padding-bottom: 100px; background-image: url("/img/1111.jpg");}
  #marraparallax {display: none;}
   #citparallax {height: auto; padding-top: 100px; padding-bottom: 100px; background-image: url("/img/1111.jpg");}
  #marraparallax {display: none;}
  #txtparallax {margin: 0px !important; font-size: 1.5em !important; text-align: left; padding-left: 20px; padding-right: 20px;}
 #txtparallax h4 {opacity: 0.5; padding: 0px; text-align: left;}
 .linkfooter img {max-width: 80px;}
 #links {height: auto; padding-top:30px; padding-bottom: 30px;}
 .datasquare h1 { font-size: 0.8em;}
 .datasquare h2 { font-size: 0.8em;}
 .overlayicon{ width: 140px; height: 60px; margin-top: -30px;}
 .spotify, .itunes {width: 40px; height: 40px; display: none;}
 .coveralbum img {opacity: 1;}
 .coveroverlay {background-color: transparent; opacity: 1;}
 .instadesktop {display: none;}
 .crediti {display: none;}
 .copydesktop {display: none;}
 #footer {text-align: center; padding-left: 0px;}
 #bigvideo {background-size: auto !important; background-attachment: scroll !important;}
 #wrapper {overflow-x: hidden;}
 #socialnav {display: none;}

}

@media only screen
and (min-width : 481px) {
 .instamobile {display: none;}
}

@media only screen
and (min-width : 481px)
and (max-width : 900px) {
 #box1 p {text-align: center; padding-top: 30px;}
 #statusbutton {width: 100%;}
 #box1_2 img { max-width: 100%;}
 #box1_2 {padding-top: 0px; padding-left: 50px; padding-right: 50px; padding-bottom: 50px;}
 #logostatus {margin: 0 auto; padding-bottom: 20px;}
}

@media only screen
and (min-width : 220px)
and (max-width : 560px) {
#socialnav {display: none !important;}
    #nav li {padding-left: 7px !important; padding-right: 7px !important;}
}

/* Smartphones (landscape) ----------- */
@media only screen
and (min-device-width : 321px) {
/* Styles */
}

/* Smartphones (portrait) ----------- */
@media only screen
and (max-width : 320px)
and (orientation : landscape){
/* Styles */
}

/* iPads (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
 #headvideo, #mylightbox {display: none;}
 #header {background-attachment: scroll;}
 #citbig p {font-size: 1.8em !important; padding: 0px;}
 #citbig {background-image: url("/img/1111.jpg"); height: auto; padding-top: 100px; padding-bottom: 100px;}
  #bigvideo {background-size: auto !important; background-attachment: scroll !important;}
}

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

  #headvideo, #mylightbox {display: none;}
 .location {font-size: 1rem;}
 .data h1 {font-size: 5rem;}
  #bigvideo {background-size: auto !important; background-attachment: scroll !important;}
}

/* iPads (portrait) ----------- */
@media only screen
and (min-width : 768px)
and (max-width : 1024px)
and (orientation : portrait) {
  #headvideo, #mylightbox {display: none;}
  #citparallax {height: auto; padding-top: 100px; padding-bottom: 100px; background-image: url("/img/1111.jpg");}
  #marraparallax {display: none;}
  #txtparallax {margin: 0px !important;}
 #bigvideo {background-size: auto !important; background-attachment: scroll !important;}
}

/* Desktops and laptops ----------- */
@media only screen
and (min-width : 1224px) {

}

/* CUSTOM ----------- */
@media only screen
and (min-width : 320px) and (max-width : 700px) {
 #frase1 {margin-left: 0px !important; text-align: center !important;}
 #headvideo, #mylightbox {display: none;}
 .overlay--overlay {display: none;}
}

/* Large screens ----------- */
@media only screen
and (min-width : 1600px) {

#header {max-width: 1600px; background-attachment: scroll;}
#navbar {width: 1600px;}
}

}
