#up_frame,#left_frame,#right_frame,#down_frame{
display: none;
justify-content: space-between;
align-items: flex-end;
position: fixed;
z-index:999;
padding: 25px;
background-color: white;
border-radius: 4px;
box-shadow: 2px 3px 10px rgba(0, 0, 0, 0.4);
}
@media (min-width: 769px){
#up_frame.show,#left_frame.show,#right_frame.show,#down_frame.show,#center_frame.show{display: block;}
}
@media (max-width: 768px){
#up_frame.show,#left_frame.show,#right_frame.show,#down_frame.show,#center_frame.show{display: block;text-align: left;}
}
#up_frame{
top: 15px;
left: 50%;
transform: translateX(-50%);
}
#down_frame{
bottom: 15px;
left: 50%;
transform: translateX(-50%);
}
#center_frame{
display: none;
position: fixed;
z-index:999;
background: rgba(0,0,0,.5);
top: 0;
left: 0;
bottom: ;
right: 0;
width:100%;
height:100%;
}
.window-c{
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
padding: 25px;
background-color: white;
border-radius: 4px;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.8);
position: fixed;
z-index:999;
}
.window-c img,.exit_popup .text_popup img{display:block;width:100%!important;height:auto!important;}
#left_frame{
bottom: 15px;
left: 15px;
}
#right_frame{
bottom: 15px;
right: 15px;
}
.window-txt{
margin: 0;padding:0;
}
.window-txt-b,.window-txt-c{
margin: 0;padding:0;
width: 100%;
}
.window-txt,.window-txt p,.window-txt-b,.window-txt-b p{
font-size: 13px;
text-align: left;
color: #000;
}
.window-txt-c,.window-txt-c p{
font-size: 16px;
text-align: left;
color: #000;
}
.window-txt p,.window-txt-b p,.window-txt-c p{
margin: 0;
margin-bottom:10px;
padding:0;
}
.up_frame_close,.down_frame_close,.left_frame_close,.right_frame_close{
border:1px solid #ccc;padding:5px 15px;box-shadow:0 0 5px rgba(0,0,0,.2);background:#fafafa;font-size:13px;color:#888;border-radius:5px;
}
.left_frame_close,.right_frame_close{
display:inline-block;margin-top:20px;
}
.center_frame_close{
position:absolute;top:10px;right:10px;width:20px;height:20px;background:url(/modules/mod_popup/close.png) 2px 2px no-repeat;opacity:0.4
}
.center_frame_close:hover{
opacity:1
}
.exit_popup {display:none;
position:fixed;    
left:0;    
top:0;    
width:100%;    
height:100%;    
z-index:100000;    
}
.popupsye { display:block; }
.exit_popup .overlay {background: rgba(0,0,0,.5);position:fixed;width:100%;height:100%;}
.exit_popup .text_popup {    
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
padding: 25px;
background-color: white;
border-radius: 4px;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.8);
position: fixed;
}
#down_frame .accept,#down_frame .icon,
#up_frame .accept,#up_frame .icon,
#left_frame .accept,#left_frame .icon,
#right_frame .accept,#right_frame .icon{
position:absolute;top:6px;right:6px;width:20px;height:20px;background:url(/modules/mod_popup/close.png) 2px 2px no-repeat;opacity:0.4;cursor:pointer;
}
#down_frame .accept:hover,#down_frame .icon:hover,
#up_frame .accept:hover,#up_frame .icon:hover,
#left_frame .accept:hover,#left_frame .icon:hover,
#right_frame .accept:hover,#right_frame .icon:hover{
opacity:1
}
#down_frame .icon,#up_frame .icon,#left_frame .icon,#right_frame .icon{
display:block;padding:0;border:0;background-color:none;box-shadow:none;margin-top:0;
}
.mr0{
margin-right:0!important;
}
@media (min-width: 1200px){
#up_frame,#down_frame{width:1000px;}
#left_frame,#right_frame{width: 300px;}
.window-txt{;margin-right:120px;}
.window-c,.exit_popup .text_popup{width: 500px;}
.up_frame_close,.down_frame_close{position:absolute;top:30px;right:23px;}
#down_frame .accept,#down_frame .icon,
#up_frame .accept,#up_frame .icon,
#left_frame .accept,#left_frame .icon,
#right_frame .accept,#right_frame .icon{top:6px;right:6px;}
}
@media (min-width: 1025px) and (max-width: 1199px){
#up_frame,#down_frame{width:900px;}
#left_frame,#right_frame{width: 300px;}
.window-txt{;margin-right:120px;}
.window-c,.exit_popup .text_popup{width: 500px;}
.up_frame_close,.down_frame_close{position:absolute;top:30px;right:23px;}
#down_frame .accept,#down_frame .icon,
#up_frame .accept,#up_frame .icon,
#left_frame .accept,#left_frame .icon,
#right_frame .accept,#right_frame .icon{top:6px;right:6px;}
}
@media (min-width: 641px) and (max-width: 1024px){
#up_frame,#down_frame{width:90%;}
#left_frame,#right_frame{width: 300px;}
.window-txt{;margin-right:120px;}
.window-c,.exit_popup .text_popup{width: 450px;}
.up_frame_close,.down_frame_close{position:absolute;top:30px;right:23px;}
#down_frame .accept,#down_frame .icon,
#up_frame .accept,#up_frame .icon,
#left_frame .accept,#left_frame .icon,
#right_frame .accept,#right_frame .icon{top:6px;right:6px;}
}
@media (max-width: 640px){
#up_frame,#down_frame{width:80%;}
#left_frame,#right_frame{width: 80%;left:50%;transform: translateX(-50%);}
.window-c,.exit_popup .text_popup{width: 400px;}
.up_frame_close,.down_frame_close{display:inline-block;margin-top:20px;}
#down_frame .accept,#down_frame .icon,
#up_frame .accept,#up_frame .icon,
#left_frame .accept,#left_frame .icon,
#right_frame .accept,#right_frame .icon{top:6px;right:6px;margin-top:0;}
}
@media (max-width: 480px){
.window-c,.exit_popup .text_popup{width: 320px;}
}
@media (max-width: 375px){
.window-c,.exit_popup .text_popup{width: 240px;}
.window-c h2,.window-c h3,.window-c h4,
.exit_popup .text_popup h2,.exit_popup .text_popup h3,.exit_popup .text_popup h4{
font-size:18px;
}
.window-c,.window-c p,.exit_popup .text_popup,.exit_popup .text_popup p{
font-size:14px;
}
}