/* Load the necessary CSS */
@import url('reset.css');
@import url('960.css');

	/* Set the base typography */
body,
#nav-supp li li,
input, select, textarea, button { font-family: "obliqua-1","obliqua-2", sans-serif; }
#nav-main,
#nav-supp,
#content h1,
#content h2,
#content h3,
#content h4,
#content h5,
#content label,
#content div.button input { font-family: "ronnia-condensed-1", "ronnia-condensed-2", Tahoma, Arial, sans-serif; }

	/* Global block formatting */
.container { position: relative; }
#page { background: transparent url(../images/site/bg-body.jpg) repeat-x center top; }
#header { height: 100px; border-top: 5px solid #2f0315; border-bottom: 1px solid #333; background: rgba(255, 255, 255, 0.5); }
.no-rgba #header { background: #fff; }
#header #logo {
	display: block; width: 272px; height: 74px; padding: 13px 0 0 10px;
	background: transparent url(../images/site/logo.png) no-repeat 10px 13px;
	text-indent: -9999px;
}
#illustration { background: transparent url(../images/site/bg-illustration-home.jpg) no-repeat center top; }
#illustration-shadow {
	height: 399px; 
	background: transparent url(../images/site/bg-illustration.png) repeat-x center bottom; }

body#about #illustration { background-image: url(../images/site/bg-illustration-about.jpg); }
body#blog #illustration { background-image: url(../images/site/bg-illustration-blog.jpg); }
body#portfolio #illustration { background-image: url(../images/site/bg-illustration-portfolio.jpg); }
body#contact_us #illustration { background-image: url(../images/site/bg-illustration-contact.jpg); }

#content {
	padding: 35px 0 20px;
	background: #54102a url(../images/site/bg-content.png) repeat-x center top; }

#footer { padding: 20px 0 0; background: #1b1b1b url(../images/site/bg-footer.png) repeat-x center top; color: #fff7dc; }
#footer .container { background: transparent url(../images/site/bg-footer-character.png) no-repeat 660px 98px; }
#footer h5 { font-size: 13px; line-height: 20px; font-weight: bold; }
#footer p { font-size: 14px; line-height: 20px; margin-bottom: 20px; }
#footer a { color: #eb2b8b; }

	/* Navigation: Main */
#nav-main { position: absolute; right: 10px; top: 67px; }
#nav-main h4 { display: none; }
#nav-main li { float: left; list-style: none; }
#nav-main li a {
	float: left; height: 28px; line-height: 25px;
	padding: 0 10px; margin-right: 5px; border-bottom: none; border-bottom: 5px solid rgba(235, 43, 139, 0);
	font-size: 20px; font-weight: 500; color: rgb(111,111,111); color: rgba(51, 51, 51, 0.5);
	-webkit-transition: all 0.3s linear; }
#nav-main li.active a { border-bottom: 5px solid rgb(235, 43, 139); border-bottom-color: rgba(235, 43, 139, 1); 
                        color: rgb(51, 51, 51); color: rgba(51, 51, 51, 1); }
#nav-main li a:hover { border-bottom: 5px solid rgb(235, 43, 139); border-bottom-color: rgba(235, 43, 139, 1); 
                       color: rgb(51, 51, 51); color: rgba(51, 51, 51, 1); text-decoration: none; }

/*
.no-rgba #nav-main li a { color: #aaa; border-bottom: none; }
.no-rgba #nav-main li.active a,
.no-rgba #nav-main li a:hover { border-bottom: 5px solid #eb2b8b; color: #333; }
*/

	/* Navigation: Supp */
#nav-supp h4 { display: none; }
#content #nav-supp ul { margin-left: 0; }
#content #nav-supp li { list-style: none; }
#content #nav-supp li a { display: block; font-size: 24px; line-height: 40px; font-weight: 700; }
#content #nav-supp li ul { margin: 0 0 20px; }
#content #nav-supp li li a,
#content #nav-supp li.active li a { margin: 0 0 0; padding: 0; border-bottom: none; line-height: 20px; font-size: 13px; font-weight: normal; }
#content #nav-supp li.active li.active a { color: #fff; }

	/* Main typography */
#content { color: #fff7dc; text-shadow: 1px 1px 0 rgba(21, 0, 9, 0.8); }

#content h1,
#content h2,
#content h3,
#content h4,
#content h5 { text-shadow: 2px 2px 0 rgba(21, 0, 9, 0.8); }

html.wf-ronniacondensed1ronniacondensed2-n4-active #content h1,
html.wf-ronniacondensed1ronniacondensed2-n4-active #content h2,
html.wf-ronniacondensed1ronniacondensed2-n4-active #content h3,
html.wf-ronniacondensed1ronniacondensed2-n4-active #content h4,
html.wf-ronniacondensed1ronniacondensed2-n4-active #content h5 { font-weight: 700; }

#content h1 { font-size: 48px; line-height: 60px; margin-bottom: 15px; padding-bottom: 4px; border-bottom: 1px solid #c7af73; }
#content h2 { font-size: 36px; line-height: 40px; }
#content h3 { font-size: 26px; line-height: 40px; }
#content h4 { font-size: 17px; line-height: 20px; }
#content h5 { font-size: 14px; line-height: 20px; }

#content p,
#content li { font-size: 14px; line-height: 20px; }

#content p,
#content ul,
#content ol,
#content dl { margin-bottom: 20px; }

#content ul,
#content ol { margin-left: 30px; }
#content ul ul,
#content ul ol,
#content ol ul,
#content ol ol { margin-bottom: 0; }

#content blockquote { margin-bottom: 20px; border-left: 5px solid #666; padding: 10px; background: #fff7dc; }

#content blockquote p,
#content blockquote ul,
#content blockquote ol { margin-bottom: 0; color: #333; text-shadow: none; }

#content a { font-weight: bold; color: #c7af73; }

#content img { display: block; border: 5px solid #fff; margin-bottom: 20px; }

	/* General form stylage */
#content form div { margin-bottom: 10px; }
#content form div.text label,
#content form div.multitext label { display: block; font-size: 20px; line-height: 40px; font-weight: 700; }
#content form div.text input,
#content form div.multitext textarea {
	width: 320px; padding: 7px 5px; border: 5px solid #fff; background: #e5d99d url(../images/site/bg-body.jpg) repeat left top;
	font-size: 26px; line-height: 1; color: rgba(0, 0, 0, 0.8); }
.no-rgba #content form div.text input,
.no-rgba #content form div.multitext textarea { color: rgb(0, 0, 0); }
#content form div.multitext textarea { height: 120px; line-height: 20px; font-size: 16px; }
#content form div.text input:focus,
#content form div.multitext textarea:focus { -webkit-box-shadow: inset 2px 2px 5px #1b1b1b; }

#content form div.button { margin-top: 20px; }
#content form div.button input {
	height: 40px; border: 1px solid #150009; padding: 0 19px; vertical-align: middle;
	background: #360519; 
	-webkit-border-radius: 9px; -moz-border-radius: 9px; -ms-border-radius: 9px; border-radius: 9px;
	font-size: 20px; color: #fff; font-weight: 700; cursor: pointer; } 
#content form div.button input:hover { border-color: #251019; border-top-color: #84405a; border-left-color: #84405a; }
#content form div.button input:active { border-color: #84405a; border-top-color: #251019; border-left-color: #251019; }

	/* Page styles: Home */
body#home #content-main p:first-child { font-size: 16px; font-weight: bold; }

body#home .recent-list {  }
body#home .recent-list .recent-item { position: relative; }
body#home .recent-list .recent-item a { text-decoration: none; }

body#home #content-portfolio .recent-item h4 {
	position: absolute; left: 5px; top: 150px; width: 210px; text-align: center;
	line-height: 30px; color: #1b1b1b; text-shadow: none; }
	
body#home #content-portfolio .recent-item img { border-bottom-width: 30px; }

body#home #content-blog .recent-item a { color: #fff7dc; font-weight: normal; }
body#home #content-blog .recent-item strong { font-size: 12px; color: #fff; }

	/* Page styles: About */
body#about #content-main p:first-child { font-size: 16px; font-weight: bold; }

	/* Page styles: Blog */
body#blog #content #blog-list .blog-item { margin-bottom: 40px; }
body#blog #content #blog-list p a { color: #fff; }

body#blog #content p.date { text-align: right; }

	/* Page styles: Portfolio */
body#portfolio #content-portfolio .item { position: relative; }
body#portfolio #content-portfolio .item a { text-decoration: none; }
body#portfolio #content-portfolio .item h4 {
	position: absolute; left: 5px; top: 150px; width: 210px; text-align: center;
	font-size: 14px ; line-height: 30px; color: #1b1b1b; text-shadow: none; }
	
html.wf-ronniacondensed1ronniacondensed2-n4-active body#portfolio #content-portfolio .item h4 { font-size: 17px ; }
	
body#portfolio #content-portfolio .item img { border-bottom-width: 30px; }

	/* Misc Styles */
.error-box { 
	margin-bottom: 20px; border: 5px solid #900; padding: 5px 10px; background: #fee; 
	color: #900; font-weight: bold; text-shadow: none; }
.success-box { 
	margin-bottom: 20px; border: 5px solid #060; padding: 5px 10px; background: #efe; 
	color: #060; font-weight: bold; text-shadow: none; }
#content .error-box p,
#content .error-box ul,
#content .success-box p,
#content .success-box ul { margin-bottom: 0; }
#content .success-box a { color: #090; }