/* Styles for Creative Design: worped.com*/


/* -------------- CSS Reset -------------- */

html {    
    color: #7A6F6F;
    font: 13px/20px Tahoma, Arial,Helvetica,sans-serif !important;
}

body { background: url("/img/bg.jpg") repeat scroll bottom #e5e5e5;
}

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, p, blockquote, th, td {
    margin: 0;
    padding: 0;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
fieldset, img {
    border: 0 none;
}
img, input, a {
    outline: 0 none;
}
address, caption, cite, code, dfn, em, strong, th, var, optgroup, label {
    font-family: inherit;
    font-style: inherit;
    font-weight: inherit;
}
strong {
    font-weight: bold;
}
ul, ol, li {
    list-style-type: none;
}
ul li, ol li, li {
    float: left;
}
a {
    color: #E17471;
    cursor: pointer;
    text-decoration: none;
}
a:hover {
    color: #904947;
    cursor: pointer;
    text-decoration: none;
}
caption, th {
    text-align: left;
}
h1, h2 {
    font: bold 15px/20px Arial,Helvetica,sans-serif;
    margin: 0 0 10px;
    padding: 0 0 2px;
    width: auto;
}
h3, h4, h5, h6 {
    font: bold 13px/17px Arial,Helvetica,sans-serif;
    width: auto;
}


abbr, acronym {
    border: 0 none;
    font-variant: normal;
}
legend {
    color: #000000;
}
input, button, textarea, select, optgroup, option {
    font-family: inherit;
    font-size: inherit;
    font-style: inherit;
    font-weight: inherit;
}
input, button, textarea, select {
}
.clearboth {
    clear: both;
}
.clearnone {
    clear: none;
}

.fullheight {
    height: 1%;
    margin: 0 0 14px;
}

.fullheight:after {
    clear: both;
    content: ".";
    display: block;
    font-size: 0;
    height: 0;
    visibility: hidden;
}


/* -------------- Content styling -------------- */


.container {
	margin: 10px auto 0 auto;
	width: 820px;
	background-color:transparent;
	background-image:url(img/main_bg.png);
	background-position:0 -14px;}

.container-inner {
	background-color:#FFFFFF;
	margin:0 12px 0 14px;
	padding:15px;
	width:774px;
}	

/* -------------- header -------------- */
	
header {
	float:left;
	height:auto;
	margin:0;
	width:774px;
	padding: 0 0 15px 0;}	
	
header .logo {
	float:left;
	height:auto;
	margin:0; 
	border: 1px solid #1px solid #F5D9D8; 
	width: 170px;	}

header nav {
	float:left;
	margin:0 0 0 14px;
	width:565px;
	border: 1px solid #D6D6D6;
	padding: 10px;
	background-color:#f3f3f3;}

nav li {
	padding: 0 4px;
	margin: 0 12px 0 0;
	line-height: 14px;
	float: left;
	width: auto;}	
	
nav li a {color: #7A6F6F;}	
	

	

/* -------------- side -------------- */

aside {	
	float:left;
	height:auto;
	margin:0;	
	width: 170px;
	/*border: 1px solid #eccccb;*/ 
	background-color:#FFFFFF;}
	
aside nav {}

aside nav li {
border:1px solid #D6D6D6;
height:auto;
margin:0 0 15px;
padding:5px}		

aside nav li a img:hover  { text-decoration:none;}


/* -------------- main -------------- */

.home .main {
margin:0;
width:753px;}

.main {
	float:left;
	margin:0 0 0 14px;
	padding:10px;
	width:565px;
	background-color:#ffffff;
	border: 1px solid #D6D6D6;}
	
.main .welcome {
	position:absolute;
	margin:-15px 0 0 -23px;}	

.main .top {
	float:left;
	margin:2px 0 20px 2px;
	width:100%;}	
	
.main .maincontent {
    background-color: #E5E5E5;
    border: 1px solid #D6D6D6;
    float: left;
    height: auto;
    margin: 0 0 12px;
    padding: 8px 11px;
    width: 345px;}	
	
.main .maintext h2 {/*width: 446px;*/ white-space: normal;}

.main .maincontent h3 a {color: #7A6F6F}	

.home .main .maincontent h2 a {color: #7A6F6F;}


	
.main .maincontent.margin { margin-right:13px;}	

.main .maincontent.marginbot { margin-bottom:5px;}	

.main .maincontent.clear {
	float: left;
	clear:left;}	

.main .exampleslink {
	margin: 12px 0 0 0; float: right;}

.main .content {
	background-color:#e5e5e5;
	border:1px solid #D6D6D6;
	float:left;
	margin:0 0 20px 0;
	width:100%;}
	
.main .examplebg {
	background-image:url(img/example-bg.png);
	background-repeat:no-repeat;
	float:left;
	height:115px;
	width:555px;}
	
.main .content .mainimage {
	float:left;
	height:82px;
	margin:15px 0 0 15px;
	width:536px;}	

.main .content .maintext {
	float:left;
	margin:0;
	padding: 17px;
	width:545px;}
	
.main.mainpage .maintext {padding: 0 17px 17px 17px;}
	
.main .content .maintext p { margin: 0 0 10px 0; }	

.main .content .maintext h3 { margin: 0 0 10px 0; }	
	
.main .examplebgfull {
	background-repeat:no-repeat;
	float:left;
	height:auto;
	width:555px;}	
	
.main .content .fullimage {
	float:left;
	height:auto;
	margin:10px 0 0 10px;
	width:536px; border: 5px solid #ffffff;}
	
.main .content .maintext .maintextopen,
.main .content .maintext .maintextdetails {
	cursor:pointer;
	float:left;
	padding:0;}

.main .content .maintext ul {
	list-style-type:none;
	padding:0;
	margin: 0;}

.main .content .maintext ul li {
	clear:left;
	float:left;
	margin:0;
	width:auto;}

.main .content .maintext ul.skills {
	margin: 10px 0 0 0;}

.main .content .maintext ul.skills li {
	float:left;
	margin: 0 0 10px 0;
	width: 200px;}

.main .content .maintext div.narrow {width: 300px;}
	
.main .content .viewmore {/*position:absolute; margin:127px 0 0 462px;*/ float:right; margin: -7px 15px 0 0; }
	
	
/* -------------- footer -------------- */	

footer {
clear:left;
height:50px;
margin:10px 0 0;
padding:10px 0 10px 10px;
width:auto;}

footer nav {
	clear:both;
	float:left;
	margin:10px 0 0 0;
	width:auto;}	


footer nav li {
	padding: 0;
	margin: 0 15px 0 0;
	line-height: 14px;
	float: left;}
	
footer .logo {
	height: auto; float: right;}	



/* -------------- contact page -------------- */

#contact-wrapper div {
	clear:both;
	margin:10px 0; border: none; }
	
#contact-wrapper label {
	display:block;
	float:none;
	font-size:14px;
	width:auto;
	margin:0 0 3px 0;}
	
form#contactform input {
	border-color:#B7B7B7 #E8E8E8 #E8E8E8 #B7B7B7;
	border-style:solid;
	border-width:1px;
	padding:3px;
	font-size:13px;
	color:#333333;}
	
form#contactform textarea {
	font-size:100%;
	padding:6px 5px 7px 5px;
	border-color:#B7B7B7 #E8E8E8 #E8E8E8 #B7B7B7;
	border-style:solid;
	border-width:1px;
	width:320px;}
	
#contactform input.submit { background-color:#333333; color:#FFFFFF;}	

p.error { color:#e94844;}

.designdirectory {float: left; margin: 40px 0 0 0; font-size: 8px; font-weight: normal;}

.advert .top { }

.advert .top h1, .advert .top h3 { color:#e17471;}

.advert .top h3 { color:#e17471;}

.advert .top span { color:#918787;}

.advert .top .example {float: right;}


/* -------------- Social network widgets styling -------------- */
		
.twtr-ft { display:none;}

.twtr-doc {width:560px;}

.twtr-hd, .twtr-bd, .twtr-tweet-wrap { padding:0;}
;hover
.addthis {}


/* -------------- rotating gallery -------------- */


.home .gallery {
	margin:0 0 10px 0;
	width:772px;
	float: left;
	height: 300px; overflow:hidden;
}	

.main .content .photoexamples {
	margin:0 0 10px 0;
	width:496px; padding: 39px;
	float: left;
}

.main   .content   .photoexamples   li {
	float: left;
	margin: 0 15px 15px 0;
	width: 150px;
	background-image: url(img/photoexample-bg.jpg);
	height: 150px;}
	
.main .content .photoexamples a {height: 130px; width: 130px; overflow:hidden;}	
	
.main .content .photoexamples img {
	margin: 10px 0 0 11px;
	width: 130px;
	height: 130px; overflow:hidden;}
	
.main .content .photoexamples li.more {
	width: 130px;
	padding: 10px;
	height: 130px;}

.mini-slideshow {
	position:relative;
}

.mini-slideshow a#prev-sld, .mini-slideshow a#next-sld {
background-color: #FFFFFF;
    color: #7A6F6F;
    display: block;
    font: bold 16px arial;
    height: 17px;
    left: 294px;
    padding: 10px;
    position: absolute;
    top: 255px;
    width: 83px;
    z-index: 99;	
}

.mini-slideshow a#next-sld {left: 400px;
    width: 49px;}
	
.mini-slideshow a#prev-sld:hover, .mini-slideshow a#next-sld:hover {background-color: #eeeeee;}	

.mini-slideshow ol {
	width:233px;
	background-color:#ffffff;
	height: 64px;
    position: relative;
    width: 53px;
}