.popup	{background: rgba(0,0,0,.7);}
.popup1	{background: rgba(255,255,255,.7);}
.popup,.popup1{
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 9999;
visibility: hidden;
}
.popup:target ,.popup1:target {
visibility: visible;
}

.window,.winfo,.winpo {
/* width: 50%;margin: 5% auto;*/
background: #fff;
border-radius: 10px;
position: relative;
padding: 10px;
box-shadow: 0 0 5px rgba(0,0,0,.4);
text-align: center;
}
.wincas {
width: 65%;
background: #fff;
border-radius: 10px;
position: relative;
padding: 1px 10px 10px 10px;
box-shadow: 0 0 5px rgba(0,0,0,.4);
text-align: center;
margin: 2% auto;
line-height: 0.7;
}
.wwhite {
width: 65%;
background: #fff;
border-radius: 10px;
position: relative;
padding: 1px 10px 10px 10px;
box-shadow: 0 0 30px rgba(0,0,0,.4);
text-align: center;
margin: 2% auto;
line-height: 0.7;
}
.wwhitefull {
width: 98%;
background: #fff;
border-radius: 10px;
position: relative;
padding: 1px 10px 10px 10px;
box-shadow: 0 0 30px rgba(0,0,0,.4);
text-align: center;
margin: 0.8% auto;
line-height: 0.7;
}
.windowpot {
width: 30%;
background: #fff;
border-radius: 5px;
position: relative;
padding: 5px;
box-shadow: 0 0 5px rgba(0,0,0,.4);
text-align: center;
margin: 3% auto;
}
@media all and (orientation:portrait) {
.window,.winfo,.winpo {width: 90%;margin: 50% auto;}
}
@media all and (orientation:landscape) {
.window {width: 60%;margin: 2% auto;}	
.winfo {width: 60%;margin: 10% auto;}	
.winpo {width: 90%;margin: 2% auto;}	
}
.close-button {
width: 30px;
height: 30px;
background: #000;
border-radius: 50%;
border: 3px solid #fff;
display: block;
text-align: center;
color: #fff;
text-decoration: none;
position: absolute;
top: -10px;
right: -10px;
}