/*########################################## GENERAL #########################################*/
/*########################################## HEADER  #########################################*/
/*########################################## CONTENT #########################################*/
/*#####################################################################################*/
/*#####################################################################################*/
/*#####################################################################################*/
/*#####################################################################################*/
/*##########################*/
/*##########################*/
/*									RESPONSIVE LAYOUT								   */
/*##########################*/
/*##########################*/
/*#####################################################################################*/
/*#####################################################################################*/
/*#####################################################################################*/
/*#####################################################################################*/
/*==========  Mobile First Method  ==========*/
/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {
/*########################################## GENERAL #########################################*/
/*########################################## HEADER  #########################################*/
/*########################################## CONTENT #########################################*/

#popup{
  position:absolute;
  width:300px;
 
  z-index:50;
  background:#fff;
  left:50%;
  top:75%;
  border-radius:5px;
  padding:30px 30px;
  margin-left:-150px; /* width/2 + padding-left */
  margin-top:-150px; /* height/2 + padding-top */
 
  box-shadow:0 0 10px 0 #000;
}

#close{
  position:absolute;
  background:black;
  color:white;
  z-index:51;
  right:-15px;
  top:-15px;
  border-radius:50%;
  width:30px;
  height:30px;
  line-height:30px;
  text-align:center;
  font-size:8px;
  font-weight:bold;
  font-family:'Arial Black', Arial, sans-serif;
  cursor:pointer;
  box-shadow:0 0 10px 0 #000;
}

}
/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {
/*########################################## GENERAL #########################################*/
/*########################################## HEADER  #########################################*/
/*########################################## CONTENT #########################################*/
}
/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
/*########################################## GENERAL #########################################*/
/*########################################## HEADER  #########################################*/
/*########################################## CONTENT #########################################*/
}
/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
/*########################################## GENERAL #########################################*/
/*########################################## HEADER  #########################################*/
/*########################################## CONTENT #########################################*/

#popup{
  position:absolute;
  width:600px;
 
  z-index:50;
  background:#fff;
  left:50%;
  top:75%;
  border-radius:5px;
  padding:30px 30px;
  margin-left:-320px; /* width/2 + padding-left */
  margin-top:-150px; /* height/2 + padding-top */
 
  box-shadow:0 0 10px 0 #000;
}

#close{
  position:absolute;
  background:black;
  color:white;
  z-index:51;
  right:-15px;
  top:-15px;
  border-radius:50%;
  width:30px;
  height:30px;
  line-height:30px;
  text-align:center;
  font-size:8px;
  font-weight:bold;
  font-family:'Arial Black', Arial, sans-serif;
  cursor:pointer;
  box-shadow:0 0 10px 0 #000;
}

}
/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
/*########################################## GENERAL #########################################*/
/*########################################## HEADER  #########################################*/
/*########################################## CONTENT #########################################*/
}