/*
ProFolio vcard
Copyrights- istoredesigns.com - PremiumFreebies.eu
made by: Oussama Afellad

July - 2011
*/

@import "reset.css";

/*----------------------------------General Styles----------------------------------*/
body
{
	font-size: 11px;
	font-family: "Lucida Grande", Verdana, sans-serif;
	background: #e2e2e2 url(../images/vcard/wrapper.jpg) center;
}
a
{
	color: #6aa2c5;
	text-decoration: none;
}
a:hover {text-decoration: underline;}

p
{
	padding: 0px 0px 10px 0;
	color: #555;
	text-shadow: 1px 1px 2px #fff;
	line-height: 16px;
}
p.error {color: #ff0000;}
p.ok	{color: #6aa2c5;}
p img
{
	background: #eee;
	border: 5px solid #e6e6e6;
	float: left;
	margin: 0 10px 10px 0;
}
hr
{
	height: 2px;
	border: none;
	background: url(../images/vcard/hr.gif) repeat-x;
	margin: 0 30px;
}
hr.spacer
{
	clear: both;
	height: 25px;
	background: none;
}
input
{
	font-family: Arial;
	padding: 8px 0 8px 5px;
	margin: 0 0 10px 0;
	width: 450px;
	background: #fff;
	border: 1px solid #dbdbdb;
	color: #999;
	font-size: 13px;
	display: block;
	border-radius: 3px;
}
textarea
{
	font-family: Arial;
	padding: 8px 0 8px 5px;
	margin: 0 0 10px 0;
	width: 450px;
	background: #fff;
	border: 1px solid #dbdbdb;
	color: #999;
	font-size: 13px;
	display: block;
	height: 45px;
	resize: none;
	border-radius:3px;
}
.clear {clear: both;}
.clearpx {height: 1px;}
.spacer {height: 15px;}
.small
{
	position: absolute;
	font-size: 11px;
	color: #777;
	padding-top: 4px
}
.small a
{
	color: #777;
	text-decoration: none;
}
.pagetitle {display: none;}
.nopadding {padding: 0;}

/*----------------------------------Header----------------------------------*/
#header
{
	margin: 30px 30px 0 30px;
	height: 100px;
}
#header #logo
{
	float: left;
	text-indent: -9999px;
	background: url(../images/vcard/logo.png);
	margin: 7px 0 0 20px;
	width: 300px;
	height: 80px;
}
#header ul#menu
{
	float: right;
	height: 45px;
	margin: 14px 20px 0 0;
	padding: 0 10px 0 0;
	border-radius: 3px;
}
#header ul#menu li
{
	float: left;
	padding: 16px 0 0 10px;
	font-weight: bold;
	font-size: 13px;
	text-transform: uppercase;
	color: #999;
	text-shadow: 1px 1px 2px #fff;
	list-style: none;
}
#header ul#menu li a
{
	color: #999;
	text-decoration: none;
}
#header ul#menu li a:hover
{
	color: #555;
	border-bottom: 2px solid #e3e3e3;
}
#header ul#menu li.selected a {color: #555;}


/*----------------------------------Content----------------------------------*/
#content
{
	position: relative;
	margin: 25px 30px 0 50px;
	height: 390px;
	overflow: hidden
}
#scroller
{
	position: relative;
	height: 390px;
}
#scroller .contentitem
{
	width: 710px;
	height: 390px;
	float: left;
	display: none;
	margin-right: 30px;
}
#scroller_middle
{
	position: relative;
	height: 390px;
}
#scroller_middle .contentitem
{
	width: 500px;
	height: 390px;
	float: right;
	display: none;
	margin-right: 30px;
}


/*----------------------------------Items----------------------------------*/
#wrapper
{
	min-width: 800px;
	min-height: 650px;
}
#vcard
{
	display: none;
	z-index: 2;
	position: relative;
	margin: auto;
	width: 800px;
	height: 600px;
	background: url(../images/vcard/wrapper.png); 
	/*
	// interesting stuff!
	box-shadow: 0 0 10px #000;
	*/
}
.main
{
	float: right;
	overflow: auto;
	width: 480px;
	height: 100%;
	margin-right: 0px;
	padding-right: 10px;
	background: url(../images/vcard/sidebar.png) repeat-y;
	padding-left: 40px;
}
.main h1
{
	color: #555;
	font-size: 23px;
	font-weight: normal;
	margin-top: 10px;
	margin-bottom: 10px;
	text-shadow: 1px 1px 2px #fff;
}
.main h2
{
	color: #555;
	font-size: 16px;
	font-weight: normal;
	margin-top: 10px;
	margin-bottom: 10px;
	text-shadow: 1px 1px 2px #fff;
}
.main h3
{
	color: #555;
	font-size: 10px;
	font-weight: normal;
	text-shadow: 1px 1px 2px #fff;
	margin-top: 10px;
	margin-bottom: 10px;
}
.main ul li
{
	color: #555;
	text-shadow: 1px 1px 2px #fff;
	list-style: square inside;
	line-height: 16px;
}
.main ul.networks li
{
	float: left;
	width: 200px;
	height: 38px;
	padding: 15px 25px 15px 0;
	list-style: none;
	cursor: pointer;
}
.main ul.networks li a {text-decoration: none;}
.main ul.networks li .background
{
	width: 210px;
	height: 42px;
	background: url(../images/vcard/networksbg.png);
	position: absolute;
	display:none;
}
.main ul.networks li .content
{
	position: absolute;
	display: block;
	z-index: 2;
	margin: 6px 0 0 0;
}
.main ul.networks li img
{
	float: left;
	padding-right: 8px;
	width: 32px;
	height: 32px;
	border: 0;
}
.main ul.networks li .title {float: left;}
.main ul.networks li .title .sname
{
	color: #555;
	font-size: 15px;
	text-shadow: 1px 1px 2px #fff;
	height: 7px;
	font-weight: bold;
}
.main ul.networks li .title .surl
{
	clear: both;
	color: #777;
	font-size: 11px;
	margin: 0;
	padding: 0;
	text-shadow: 1px 1px 2px #fff;
}

.sidebar
{
	float: left;
	overflow: auto;
	margin: 0px;
	width: 170px;
	height: 390px;
}
.sidebar h2
{
	color: #555;
	font-size: 16px;
	font-weight: normal;
	text-shadow: 1px 1px 2px #fff; 
	margin-bottom: 10px;
}

.sidebar ul.menu {margin-bottom: 20px;}
.sidebar ul.menu li
{
	padding: 0px 0px 10px 0;
	font-weight: bold;
	font-size: 11px;
	color: #999;
	text-shadow: 1px 1px 2px #fff;
	list-style: none;
}
.sidebar ul.menu li a
{
	color: #999;
	text-decoration: none;
}
.sidebar ul.menu li a:hover
{
	color: #555;
	border-bottom: 2px solid #e3e3e3;
}
.sidebar ul.menu li.selected a {color: #555;}

.button, button
{
	padding: 6px 8px;
	border: 1px solid #09a0ff;
	background: url(../images/vcard/button.gif) repeat-x;
	color: #fff;
	text-shadow: 1px 1px 1px #1069a1;
	text-transform: uppercase;
	font-size: 9px;
	font-weight: bold;
	text-decoration: none;
	border-radius: 3px;
}
.button:hover, button:hover
{
	border-color: #1e8dff;
	text-shadow: 1px 1px 1px #3284ff;
}

/*----------------------------------Work----------------------------------*/
/*
#workmask{width:710px;height:185px;position:relative;margin-top:25px;overflow:hidden}
#workscroller{width:710px;position:absolute;margin-top:0}
.work-item-preview {display:block;background:url(../images/vcard/bg-fade.png) no-repeat center center;}
ul.work{margin-top:0}
ul.work a{color:#4d4d4d}
ul.work li{padding:0;position:relative;float:left;display:block;list-style:none;width:225px;height:85px;margin:0 15px 15px 0;background:url(../images/vcard/workbg.png);overflow:hidden}
ul.work li a{text-decoration:none}
ul.work li.last{margin:0 0 15px 0}
ul.work li .worktitle{font-family:Verdana;position:relative;margin:-55px 0 0 0;margin:0 0 0 0;padding:10px 7px 7px 7px;width:211px;height:14px;border-top:1px solid #ccc;border-bottom:1px solid #ccc;background:#dedede;font-weight:bold;font-size:13px;text-transform:uppercase;list-style:none}
ul.work li img{width:225px;height:85px;overflow:hidden}
ul.navigation{float:right;margin:5px 0 0 0}
ul.navigation li{float:left;margin-left:5px;padding:3px 5px 3px 6px;background:#ddd;color:#777;font-weight:bold;text-shadow:1px 1px 1px #fff;border-right:1px solid #fff;border-bottom:1px solid #fff;-moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; list-style:none; cursor:pointer}
ul.navigation li.active{background:#ccc;color:#555;text-shadow:1px 1px 1px #eee;border:none;padding:3px 6px 4px 6px}
ul.navigation li:hover{background:#ccc;border:none;padding:3px 6px 4px 6px}
*/