popbox.css

/**
*.@css written for the popup box
* @author saurabh kumar <saurabh.nitc10@gmail.com>
* @copyright Copyright (c) 2012,saurabh kumar
* @license http://www.gnu.org/licenses/gpl.html GNU General Public License 
*/
body {
	text-align:center;
	background:#f7f7f7;
	font-family:georgia;
	font-size:22px;
	text-shadow:1px 1px 1px #FFF;
	margin:200px;
}
a {
	color:#999; text-decoration:none;
}
label{
	display: block;
}
form {
	margin: 25px;
	text-align:left;
}
form input[type=text]{
	padding:5px;
	width:90%;
	border:solid 1px #CCC;
}
form textarea {
	padding:5px;
	width:90%;
	border:solid 1px #CCC;
	height:100px;
}

.box {
	width:350px;
}

footer {
	font-size:12px;
}
form a, footer a { color:#40738d; }
.popbox {
	margin:0px auto;
	text-align:center;
	position:relative;
}

.collapse { position:relative; }

open {
	background:#DDD;
	border:solid 1px #FFF;
	border-radius:5px;
	box-shadow: 0px 0px 5px #CCC;
	background:-webkit-gradient(linear,left top,left bottom,from(#f4f4f4),to(#e8e8e8));
	background:-moz-linear-gradient(top,#f4f4f4,#e8e8e8);
	background:linear-gradient(top,#f4f4f4,#e8e8e8);
	padding:8px;
}

.box {
	display:block;
	display:none;
	background:#FFF;
	border:solid 1px #BBBBBB;
	border-radius:5px;
	box-shadow:0px 0px 15px #999;
	position:absolute;
}

.box a.close {
	color:red;
	font-size:12px;
	font-family:arial;
	text-decoration:underline;
}

.arrow {
	width: 0;
	height: 0;
	border-left: 11px solid transparent;
	border-right: 11px solid transparent;
	border-bottom: 11px solid #FFF;
	position:absolute;
	left:1px;
	top:-10px;
	z-index:1001;
}

.arrow-border {
	width: 0;
	height: 0;
	border-left: 11px solid transparent;
	border-right: 11px solid transparent;
	border-bottom: 11px solid #BBBBBB;
	position:absolute;
	top:-12px;
	z-index:1000;
}