.popin {
	border : 5px solid white;
	width : 50%;
	box-shadow: 8px 8px 15px grey;
	border-radius: 20px;
	margin:auto;
	position : fixed;
	top : 150px;
	left:50%;
	background-color: blue;
	min-height: 150px;
	min-width: 150px;
	z-index: 999999;
}

.popin .popin_top {
	height : 35px;
	text-align : right;
}

.popin .popin_top > .button {
	display : inline-block;
	width : 32px;
	height : 32px;
	background-repeat: no-repeat;
	margin : 10px;
	cursor:pointer;
}

.popin_overlay, .popin_container {
	height : 100%;
	width:100%;
	position:fixed;
}

.popin_overlay {
	opacity : 0.5;
	background-color : #000000;
	z-index: 99998;
}

.popin .close_button {
    color: grey;
    font-family: sans-serif;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    text-shadow: 0 1px 0 #fff;
}

.popin .popin_title {
    color: white;
    font-family: decade;
    font-size: 20px;
    text-decoration: none;
    text-shadow: 2px 2px 0 black;	
}


.popin .popin_content {
    color: white;    
    max-height: 800px;
    overflow: auto;
}


@media only screen and (max-width:640px){
	.popin {
		width : 90%;
		height : auto;
		left : auto;		
		position : fixed;
		z-index: 9999;		
	}
	
	.popin_container .popin.navigation {
		top : 0px;
	}
}