/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 320px) {
/* Styles */
#icons {
	bottom: 0;
  height: 200px;
  left: 0;
  margin: auto;
  position: absolute;
  top: 0;
  right: 0;
  width: 95%;
	
}

.inline {
	width: 85%;
  text-align: left;
  margin: auto;
}

.inline li {
	padding: 10px 0;
}
	
.inline li:nth-child(1):after { content:"\A"; white-space:pre; padding-right: 0;}
.inline li:nth-child(4):after { content:"\A"; white-space:pre; padding-right: 0;}
.inline li:nth-child(6):after { content:"\A"; white-space:pre; padding-right: 0;}

.show {
 margin-bottom: 30px;
 padding-left: 20px;
}

.top {
 margin: 0px 15px 25px 15px;
}
	
#logo {
	display: none;
}

#text {
	display: table-cell;
	width: 80%;
	text-align: left;
	padding-left: 10px;
}
	
#close {
	display: table-cell;
	width: 15%;  
	padding-top: 0;
  padding-left: 10px;
}

#close img {
	padding-top: 15px;
  position: absolute;
}

}

/* Smartphones (landscape) ----------- */
@media only screen and (min-width : 321px) and (max-width: 480px) {
/* Styles */
#icons {
	bottom: 0;
  height: 200px;
  left: 0;
  margin: auto;
  position: absolute;
  top: 0;
  right: 0;
  width: 95%;
	
}

.inline {
	width: 80%;
  text-align: left;
  margin: auto;
	padding-left: 10%;
}

.inline li {
	padding: 10px 0;
}
	
.inline li:nth-child(1):after { content:"\A"; white-space:pre; padding-right: 0;}
.inline li:nth-child(4):after { content:"\A"; white-space:pre; padding-right: 0;}
.inline li:nth-child(6):after { content:"\A"; white-space:pre; padding-right: 0;}

.show {
 margin-bottom: 30px;
 padding-left: 20px;
}

.top {
 margin-bottom: 30px;
 margin: 0 7% 10% 7%;
}

#logo {
	display: none;
}

#text {
	display: table-cell;
	width: 80%;
	text-align: left;
	padding-left: 10px;
}
	
#close {
	display: table-cell;
	width: 15%;  
	padding-top: 0;
  padding-left: 10px;
}

#close img {
	padding-top: 15px;
  position: absolute;
}
}

/* Smartphones (landscape) ----------- */
@media only screen and (min-width : 481px) and (max-width: 640px) {
/* Styles */
#icons {
	bottom: 0;
  height: 200px;
  left: 0;
  margin: auto;
  position: absolute;
  top: 0;
  right: 0;
  width: 95%;
	
}

.inline {
	width: 60%;
  text-align: left;
  margin: auto;
	padding-left: 20%;
}

.inline li {
	padding: 10px 0;
}
	
.inline li:nth-child(1):after { content:"\A"; white-space:pre; padding-right: 0;}
.inline li:nth-child(4):after { content:"\A"; white-space:pre; padding-right: 0;}
.inline li:nth-child(6):after { content:"\A"; white-space:pre; padding-right: 0;}

.show {
 margin-bottom: 30px;
 padding-left: 20px;
}

.top {
 margin-bottom: 30px;
}

#logo {
	width: 90%;
}

#logo img {
	padding-left: 0px;
}

#text {
	display: table-cell;
	width: 45%;
	text-align: left;
}
	
#close {
	display: table-cell;
	width: 15%;  
	padding-top: 0;
  padding-left: 10px;
}
	
#close img {
	padding-top: 15px;
  position: absolute;
}
}

/* Smartphones (landscape) ----------- */
@media only screen and (min-width : 641px) and (max-width: 768px) {
/* Styles */
.inline li:nth-child(1):after { content:"\A"; white-space:pre; padding-right: 0;}

.show {
 margin-bottom: 30px;
}
	
.logo {
	  padding-right: 20px;
}

.top {
	margin: 0 10px;
	vertical-align: top;
}

#logo {
	width: 90%;
}

#logo img {
	padding-left: 8%;
}

#text {
	display: table-cell;
	width: 40%;
	text-align: left;
}
	
#close {
	display: table-cell;
	width: 15%;  
	padding-top: 0;
  padding-left: 10px;
}
	
#close img {
	padding-top: 15px;
  position: absolute;
}

}

/* Smartphones (landscape) ----------- */
@media only screen and (min-width : 769px) and (max-width: 960px) {
/* Styles */
.logo {
	  padding-right: 20px;
}

.top {
	margin: 0 10px;
	vertical-align: top;
}

#logo img {
	padding-left: 0;
}

#text {
	width: 30%;
}
	
#close {
	width: 20%;  
}

#close img {
	padding-top: 20px;
  position: absolute;
}

}

/* Desktops and laptops ----------- */
@media only screen  and (min-width : 1224px) {
/* Styles */
.show img {
 height: 100%;
}

.top img {
 height: 100%;
}
}

/* Large screens ----------- */
@media only screen  and (min-width : 1824px) {
/* Styles */
.show {
 height: 100%;
}
	
#logo {
	width: 45%;
}
	
#logo img {
	padding-left: 0;
}

.top {
 height: 100%;
}
	
#text {
	width: 17%;
}
	
#close {
	width: 30%;  
}
}

/* iPhone 4 ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {
/* Styles */
#icons {
	bottom: 0;
  height: 350px;
  left: 0;
  margin: auto;
  position: absolute;
  top: 0;
  right: 0;
  width: 55%;
	
}

.inline {
	width: 80%;
  text-align: left;
  margin: auto;
}

.inline li {
	padding: 10px 0;
}
	
.inline li:nth-child(1):after { content:"\A"; white-space:pre; padding-right: 0;}
.inline li:nth-child(4):after { content:"\A"; white-space:pre; padding-right: 0;}
.inline li:nth-child(6):after { content:"\A"; white-space:pre; padding-right: 0;}

.show {
 margin-bottom: 50px;
 padding-left: 30px;
 height: 50px;
}

.top {
 margin: 0px 30px 50px 30px;
 height: 46px;
}
	
#logo {
	display: none;
}

#text {
	display: table-cell;
	width: 80%;
	text-align: left;
	padding-left: 10px;
}
	
#close {
	display: table-cell;
	width: 15%;  
	padding-top: 0;
  padding-left: 10px;
}

#close img {
	padding-top: 15px;
  position: absolute;
}

}