*{border:0;margin:0;padding:0;}

body
{
	background-image: url(../img/wood6.jpg);
}

#containerbox {
	height: 100%;
	width: 100%;
	overflow: hidden;
}

#facebooklogo {
	position: absolute;
	top: 15px;
	right: 15px;
	z-index:151;
}

#emaildiv {
	position: absolute;
	top: 60px;
	right: 10px;
	z-index:150;
}

#credit  {
	position: absolute;
	bottom: 1%;
	left: 1%;
	z-index:2;
	font: normal 16px monospace;
}

.linkformat {
	text-decoration: none;
	color:white;
}

#coffeecup
{	
	position: absolute;
	top: 0%;
	left: 0%;
	z-index: 100;
}


/* Small Screens ----------- */
@media only screen 
and (max-width : 1224px) {
.postcard {
    	width:240px;
	height: 160px;
	border: solid white 9px;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
  }
}


/* Medium Screens ----------- */
@media only screen 
and (min-width : 1224px) 
and (max-width : 1624px){
.postcard {
    	width: 270px;
	height: 180px;
	border: solid white 10px;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
  }
}



/* Large screens ----------- */
@media only screen 
and (min-width : 1624px) {
.postcard {
    	width:315px;
	height: 210px;
	border: solid white 12px;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
  }
}



#paper
{	position: absolute;
	top: 2%;
	left: 5%;
	z-index:22;
	transform:rotate(+3deg);
	-ms-transform:rotate(+3deg); 
	-moz-transform:rotate(+3deg); 
	-webkit-transform:rotate(+3deg); 
	-o-transform:rotate(+3deg); 

}

#updatesticky
{	position: absolute;
	top: 1%;
	left: 43%;
	z-index:99;
	transform:rotate(-9deg);
	-ms-transform:rotate(-9deg); 
	-moz-transform:rotate(-9deg); 
	-webkit-transform:rotate(-9deg); 
	-o-transform:rotate(-9deg); 

}

#map {
	position: absolute;
	left: 30%;		/* Left value */
	top: 5%;		/* Top value */
	transform:rotate(+25deg);
	-ms-transform:rotate(+25deg); 
	-moz-transform:rotate(+25deg); 
	-webkit-transform:rotate(+25deg); 
	-o-transform:rotate(+25deg); 
	z-index: 15;
	}

#map:hover {
	z-index: 3000;
	width: 330px;
	height: 220px;
	-moz-box-shadow:    15px 15px 4px #3A3131;
 	-webkit-box-shadow: 15px 15px 4px #3A3131;
	box-shadow:         15px 15px 4px #3A3131;
	}

#alfa {
	position: absolute;
	left: 60%;		/* Left value */
	top: 7%;		/* Top value */
	transform:rotate(+25deg);
	-ms-transform:rotate(+25deg); 
	-moz-transform:rotate(+25deg); 
	-webkit-transform:rotate(+25deg); 
	-o-transform:rotate(+25deg); 
	z-index: 9;
	}

#alfa:hover {
	z-index: 3000;
	width: 330px;
	height: 220px;
	-moz-box-shadow:    15px 15px 4px #3A3131;
 	-webkit-box-shadow: 15px 15px 4px #3A3131;
	box-shadow:         15px 15px 4px #3A3131;
	}

#india {
	position: absolute;
	left: 30%;		/* Left value */
	top: 48%;		/* Top value */
	transform:rotate(+15deg);
	-ms-transform:rotate(+15deg); 
	-moz-transform:rotate(+15deg); 
	-webkit-transform:rotate(+15deg); 
	-o-transform:rotate(+15deg); 
	z-index: 29;
	}

#india:hover {
	z-index: 3000;
	width: 330px;
	height: 220px;
	-moz-box-shadow:    15px 15px 4px #3A3131;
 	-webkit-box-shadow: 15px 15px 4px #3A3131;
	box-shadow:         15px 15px 4px #3A3131;
	}

#vietnam {
	position: absolute;
	left: 60%;		/* Left value */
	top: 65%;		/* Top value */
	transform:rotate(-7deg);
	-ms-transform:rotate(-7deg); 
	-moz-transform:rotate(-7deg); 
	-webkit-transform:rotate(-7deg); 
	-o-transform:rotate(-7deg); 
	z-index: 19;
	}

#vietnam:hover {
	z-index: 3000;
	width: 330px;
	height: 220px;
	-moz-box-shadow:    15px 15px 4px #3A3131;
 	-webkit-box-shadow: 15px 15px 4px #3A3131;
	box-shadow:         15px 15px 4px #3A3131;
	} 

#laos {
	position: absolute;
	left: 49%;		/* Left value */
	top: 30%;		/* Top value */
	transform:rotate(-4deg);
	-ms-transform:rotate(-4deg); 
	-moz-transform:rotate(-4deg); 
	-webkit-transform:rotate(-4deg); 
	-o-transform:rotate(-4deg); 
	z-index: 20;
	}

#laos:hover {
	z-index: 3000;
	width: 330px;
	height: 220px;
	-moz-box-shadow:    15px 15px 4px #3A3131;
 	-webkit-box-shadow: 15px 15px 4px #3A3131;
	box-shadow:         15px 15px 4px #3A3131;
	}


#cambodia {
	position: absolute;
	left: 40%;		/* Left value */
	top: 65%;		/* Top value */
	transform:rotate(-10deg);
	-ms-transform:rotate(-10deg); 
	-moz-transform:rotate(-10deg); 
	-webkit-transform:rotate(-10deg); 
	-o-transform:rotate(-10deg); 
	z-index: 17;
	}

#cambodia:hover {
	z-index: 3000;
	width: 330px;
	height: 220px;
	-moz-box-shadow:    15px 15px 4px #3A3131;
 	-webkit-box-shadow: 15px 15px 4px #3A3131;
	box-shadow:         15px 15px 4px #3A3131;
	}

#thailand {
	position: absolute;
	left: 8%;		/* Left value */
	top: 5%;		/* Top value */
	transform:rotate(-7deg);
	-ms-transform:rotate(-7deg); 
	-moz-transform:rotate(-7deg); 
	-webkit-transform:rotate(-7deg); 
	-o-transform:rotate(-7deg); 
	z-index: 18;
	}

#thailand:hover {
	z-index: 3000;
	width: 330px;
	height: 220px;
	-moz-box-shadow:    15px 15px 4px #3A3131;
 	-webkit-box-shadow: 15px 15px 4px #3A3131;
	box-shadow:         15px 15px 4px #3A3131;
	}

#malaysia {
	position: absolute;
	left: 50%;		/* Left value */
	top: 15%;		/* Top value */
	transform:rotate(-56deg);
	-ms-transform:rotate(-56deg); 
	-moz-transform:rotate(-56deg); 
	-webkit-transform:rotate(-56deg); 
	-o-transform:rotate(-56deg); 
	z-index: 16;
	}

#malaysia:hover {
	z-index: 3000;
	width: 330px;
	height: 220px;
	-moz-box-shadow:    15px 15px 4px #3A3131;
 	-webkit-box-shadow: 15px 15px 4px #3A3131;
	box-shadow:         15px 15px 4px #3A3131;
	}
#singapore {
	position: absolute;
	left: 4%;		/* Left value */
	top: 25%;		/* Top value */
	transform:rotate(+3deg);
	-ms-transform:rotate(+3deg); 
	-moz-transform:rotate(+3deg); 
	-webkit-transform:rotate(+3deg); 
	-o-transform:rotate(+3deg); 
	z-index: 15;
	}

#singapore:hover {
	z-index: 3000;
	width: 330px;
	height: 220px;
	-moz-box-shadow:    15px 15px 4px #3A3131;
 	-webkit-box-shadow: 15px 15px 4px #3A3131;
	box-shadow:         15px 15px 4px #3A3131;
	}

#uae {
	position: absolute;
	left: 70%;		/* Left value */
	top: 40%;		/* Top value */
	transform:rotate(-67deg);
	-ms-transform:rotate(-67deg); 
	-moz-transform:rotate(-67deg); 
	-webkit-transform:rotate(-67deg); 
	-o-transform:rotate(-67deg); 
	z-index: 20;
	}

#uae:hover {
	z-index: 3000;
	width: 330px;
	height: 220px;
	-moz-box-shadow:    15px 15px 4px #3A3131;
 	-webkit-box-shadow: 15px 15px 4px #3A3131;
	box-shadow:         15px 15px 4px #3A3131;
	}

#oman {
	position: absolute;
	left: 17%;		/* Left value */
	top: 58%;		/* Top value */
	transform:rotate(-94deg);
	-ms-transform:rotate(-94deg); 
	-moz-transform:rotate(-94deg); 
	-webkit-transform:rotate(-94deg); 
	-o-transform:rotate(-94deg); 
	z-index: 33;
	}

#oman:hover {
	z-index: 3000;
	width: 330px;
	height: 220px;
	-moz-box-shadow:    15px 15px 4px #3A3131;
 	-webkit-box-shadow: 15px 15px 4px #3A3131;
	box-shadow:         15px 15px 4px #3A3131;
	}

#iran {
	position: absolute;
	left: 2%;		/* Left value */
	top: 60%;		/* Top value */
	transform:rotate(+10deg);
	-ms-transform:rotate(+10deg); 
	-moz-transform:rotate(+10deg); 
	-webkit-transform:rotate(+10deg); 
	-o-transform:rotate(+10deg); 
	z-index: 31;
	}

#iran:hover {
	z-index: 3000;
	width: 330px;
	height: 220px;
	-moz-box-shadow:    15px 15px 4px #3A3131;
 	-webkit-box-shadow: 15px 15px 4px #3A3131;
	box-shadow:         15px 15px 4px #3A3131;
	}

#romania {
	position: absolute;
	left: 13%;		/* Left value */
	top: 45%;		/* Top value */
	transform:rotate(-11deg);
	-ms-transform:rotate(-11deg); 
	-moz-transform:rotate(-11deg); 
	-webkit-transform:rotate(-11deg); 
	-o-transform:rotate(-11deg); 
	z-index: 35;
	}

#romania:hover {
	z-index: 3000;
	width: 330px;
	height: 220px;
	-moz-box-shadow:    15px 15px 4px #3A3131;
 	-webkit-box-shadow: 15px 15px 4px #3A3131;
	box-shadow:         15px 15px 4px #3A3131;
	}

#turkey {
	position: absolute;
	left: 29%;		/* Left value */
	top: 28%;		/* Top value */
	transform:rotate(-3deg);
	-ms-transform:rotate(-3deg); 
	-moz-transform:rotate(-3deg); 
	-webkit-transform:rotate(-3deg); 
	-o-transform:rotate(-3deg); 
	z-index: 33;
	}

#turkey:hover {
	z-index: 3000;
	width: 330px;
	height: 220px;
	-moz-box-shadow:    15px 15px 4px #3A3131;
 	-webkit-box-shadow: 15px 15px 4px #3A3131;
	box-shadow:         15px 15px 4px #3A3131;
	}

#austria {
	position: absolute;
	left: 75%;		/* Left value */
	top: 65%;		/* Top value */
	transform:rotate(+17deg);
	-ms-transform:rotate(+17deg); 
	-moz-transform:rotate(+17deg); 
	-webkit-transform:rotate(+17deg); 
	-o-transform:rotate(+17deg); 
	z-index: 35;
	}

#austria:hover {
	z-index: 3000;
	width: 330px;
	height: 220px;
	-moz-box-shadow:    15px 15px 4px #3A3131;
 	-webkit-box-shadow: 15px 15px 4px #3A3131;
	box-shadow:         15px 15px 4px #3A3131;
	}

#germany {
	position: absolute;
	left: 75%;		/* Left value */
	top: 20%;		/* Top value */
	transform:rotate(+17deg);
	-ms-transform:rotate(+17deg); 
	-moz-transform:rotate(+17deg); 
	-webkit-transform:rotate(+17deg); 
	-o-transform:rotate(+17deg); 
	z-index: 19;
	}

#germany:hover {
	z-index: 3000;
	width: 330px;
	height: 220px;
	-moz-box-shadow:    15px 15px 4px #3A3131;
 	-webkit-box-shadow: 15px 15px 4px #3A3131;
	box-shadow:         15px 15px 4px #3A3131;
	}

#paris {
	position: absolute;
	left: 54%;		/* Left value */
	top: 50%;		/* Top value */
	transform:rotate(-1deg);
	-ms-transform:rotate(-1deg); 
	-moz-transform:rotate(-1deg); 
	-webkit-transform:rotate(-1deg); 
	-o-transform:rotate(-1deg); 
	z-index: 45;
	}

#paris:hover {
	z-index: 3000;
	width: 330px;
	height: 220px;
	-moz-box-shadow:    15px 15px 4px #3A3131;
 	-webkit-box-shadow: 15px 15px 4px #3A3131;
	box-shadow:         15px 15px 4px #3A3131;
	}