﻿.basicModal { background-color:#FFF; width:94%; height:95%; left:3%; top:3%; position:fixed; z-index:97; display:none; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; }
.basicModalContent { padding:15px; overflow-x: hidden; overflow-y: auto; position: relative; width: 100%; height: 100%; }
.basicModalClose { color: #9E9E9E;  font-size:40px; position:absolute !important; right:10px; top:1px; overflow:hidden; z-index:300; cursor:pointer; opacity:0.5;  font-family:"Helvetica Neue", Helvetica, Arial, sans-serif !important;  }
.basicModalClose:hover { opacity:1; }
.basicModalBg { top:0; width:100%; height:100%; background-color:#000; opacity:0.7; position:fixed; z-index:97; display:none; cursor:pointer; }	
	
/* ความกว้าง ไม่ต่ำกว่า  400px */
@media screen and (min-width: 400px)
{
	.basicModal { width:80%; left:10%; }
}

/* ความกว้าง ไม่ต่ำกว่า 700px */
@media screen and (min-width: 700px)
{
	.basicModal { width:70%; left:15%; }
	.basicModalClose { right:8px; top:0px; }
}

/* ความกว้าง ไม่ต่ำกว่า 1000px */
@media screen and (min-width: 1000px)
{
	.basicModal { top:5%; font-size:0.8em; height:auto;/*75% */ }
}

/* ความกว้าง ไม่ต่ำกว่า  1600px */
@media screen and (min-width: 1600px)
{
	.basicModal { width:50%; left:25%; font-size:1em; }
	.basicModalClose { right:10px; }
	.basicModalContent { padding:20px; }
}