CSS para ventana modal

index.html

<!--HTML para la ventana modal-->
<div class="modal">
    	<div class="inner-modal">
    		<div class="head">
    			
    		</div>
    		<div class="content">
    			
    		</div>
    		<div class="action">
    			<button class="uibutton ok" style="float:right">Aceptar</button>
    			<!-- <button class="uibutton" style="float:right">Cancelar</button> -->
    		</div>
    	</div>
    </div>
    <div id="theMask"></div>

modal.css

.modal{
	border:10px solid rgb(82,82,82);
	border:10px solid rgba(82,82,82,.7);
	border-radius: 8px;
	-webkit-border-radius:8px;
	-moz-border-radius:8px;
	-o-border-radius:8px;
	behavior:url('PIE.htc');
	z-index:10000;
	position:fixed;
	top:100px;
	display: none;
}

.modal .inner-modal{
	background:#FFF !important;
	position:relative;
	width:500px;
	min-height: 300px;
}

.modal .inner-modal .head{
	background-color: #6D84B4;
	border: 1px solid #3B5998;
	border-bottom: 0;
	color: white;
	font-size: 14px;
	font-weight: bold;
	padding:10px;
}

.modal .inner-modal .content{
	padding:10px;
}


.modal .inner-modal .action{
	position:absolute;
	bottom:10px;
	width:98%;
	border-top:1px #eee solid;
	padding:10px 5px 5px 5px;
}

#theMask{
	z-index:900;
	position:absolute;
	left:0;
	top:0;
	background-color:rgba(150,150,150,.3);
	width: 100%;
	height: 100%;
	behavior:url('PIE.htc');
	display: none;
}

.uibutton{
	position: relative;
	z-index: 1;
	overflow: visible;
	display: inline-block;
	padding: 0.3em 0.6em 0.375em;
	border: 1px solid #999;
	border-bottom-color: #888;
	margin: 0;
	text-decoration: none;
	text-align: center;
	font: bold 11px/normal 'lucida grande', tahoma, verdana, arial, sans-serif;
	white-space: nowrap;
	cursor: pointer;
	color: #333;
	background-color: #eee;
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f5f6f6), to(#e4e4e3));
	background-image: -moz-linear-gradient(#f5f6f6, #e4e4e3);
	background-image: -o-linear-gradient(#f5f6f6, #e4e4e3);
	background-image: linear-gradient(#f5f6f6, #e4e4e3);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f5f6f6', EndColorStr='#e4e4e3');
	-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #fff;
	-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #fff;
	box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #fff;
	zoom: 1;
}

.uibutton.ok{
	border-color: #29447E #29447E #1A356E;
	color: #fff;
	background-color: #5B74A8;
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#637bad), to(#5872a7));
	background-image: -moz-linear-gradient(#637bad, #5872a7);
	background-image: -o-linear-gradient(#637bad, #5872a7);
	background-image: linear-gradient(#637bad, #5872a7);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#637bad', EndColorStr='#5872a7');
	-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #8a9cc2;
	-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #8a9cc2;
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 1px 0 #8a9cc2;
}