@charset "utf-8";
/************************************
**	@site: Skimbee Studios
**	@author: Rocco Augusto
**	@url: 	http://www.skimbee.com
*************************************/

body { padding:0; margin:0; height:100%; width:100%; font-family:Arial, Helvetica, sans-serif; font-size:14px; background:url(/images/bg_green.jpg) repeat center; overflow:hidden; color:#666;  }
h2 { font-size:18px; font-weight:normal; margin:10px 0; text-indent:-9999em; }
a { color:#fff; text-decoration:none; }
a:hover, #navigation a.on, h2 { color:#81994D; }
a:active, a:focus, button:active, button:focus { outline:none; }
a span { visibility:hidden; }
small { font-size:11px; }

.hidden { display:none; }
.fail { width:100%; height:100%; background:#000; z-index:9999; position:absolute; top:0; left:0; color:#fff; }
.fail a { text-decoration:underline; }
.fail h1, .fail p { width:400px; margin:0 auto; }
.fail h1 { margin-top:100px; margin-bottom:10px; text-align:center; }
.fail p { text-align:justify; }

/*** WRAPPER ***/
#wrapper { width:100%; height:550px; margin:0 auto; padding:0; overflow:hidden; clear:both; position:relative; }

/*** HEADER ***/
#header { position:absolute; bottom:0; left:0; width:100%; background:url(/images/bg_footer.png); height:65px; margin:0; padding:0; z-index:100; }
#header .themes { float:right; list-style:none; margin:25px 25px 0 0; padding:0; }
#header .themes li { float:left; width:25px; height: 25px; margin:5px; }
#header .themes li a { display:block; height:25px; }
#header .themes li a:hover { cursor:pointer; }
#header .themes .selected { outline:2px solid #657672; }
#header .themes .pink { background:#E787AC; }
#header .themes .green { background:#81994D; }
#header .themes .blue { background:#6CB0B1; }
#header .themes .orange { background:#E97F03; }
#header h1 { background:url(/images/asset_header.png) 0 0 no-repeat; height:29px; width:247px; margin:25px 0 0 25px; font-size:12px; }
#header h1 a { display:block; line-height:29px; width:249px; }

/*** NAVIGATION ***/
#navigation { width: 834px; margin:0 auto; padding:0 33px; }
#navigation ul {  float:right; position:relative; width:237px; height:37px; margin:0; padding:5px 17px 5px 20px; list-style:none; background:url(/images/bg_navigation.png) no-repeat top left; font-size:14px; }
#navigation li { float:left; margin:0px 8px; line-height:22px; }
#navigation a { display:block; line-height:22px; }

/*** CONTENT ***/
#content { min-width:4500px; height:300px; position:absolute; }
#home, #about, #services, #contact, #work { width:900px; float:left; margin-top:20px; }
.page { position:relative; margin:0 auto; width:834px; height:500px; background:url(/images/bg_content.png) no-repeat; }
.page p { line-height:20px; text-align:justify; font-size:16px }
.page a { color: #81994D; }
.page a:hover { text-decoration:underline; }
.page img { border:3px double #9FA64C; }
.development, .zen-cart, .contact-text, .contact-form, .roccstar, .kill9 { width:360px; padding:5px; }
.development, .contact-text, .kill9 { float:left; position:relative; margin:40px 0 0 40px; }
.development h2 { width:180px; height:20px; background:url(/images/header_web-development.png) 0 0 no-repeat; }
.zen-cart, .contact-form, .roccstar { float:right; position:relative; margin:40px 40px 0 0; }
.zen-cart h2 { width:206px; height:15px; margin-bottom:15px; background:url(/images/header_zen-cart.png) no-repeat 0 0; }
.roccstar h2 { width:194px; height:16px; background:url(/images/header_roccstar.png) no-repeat 0 0; }
.kill9 h2 { width:110px; height:19px; margin-bottom:8px; background:url(/images/header_kill9.png) 0 0 no-repeat; }
.contact-text h2 { width:100px; height:15px; margin-bottom:15px; background:url(/images/header_contact-us.png) no-repeat 0 0; }
.contact-form ul { margin:0; padding:0; list-style:none; }
.contact-form li { float:left; position:relative; width:170px; margin:5px 4px; }
.contact-form li.full, .contact-form li.message { width:350px; margin:5px 4px; }
.contact-form li.message { font-style:italic; text-align:center; color:#9FA64C;  }
.contact-form fieldset { padding:0; margin:10px 0 0 0; border:none; }
.contact-form label { font-size:16px; line-height:20px; display:block; margin:2px 0; color:#81994D; }
.contact-form input, .contact-form select  { width:165px; border:1px solid #9FA64C; padding:2px; color: #666; }
.contact-form input { padding:3px 2px; }
.contact-form select { width:170px; }
.contact-form textarea { width:340px; height:120px; border:1px solid #9FA64C; padding:3px; color: #666; }
.contact-form button { background:#9FA64C; border:none; width:169px; height:30px; color:#fff; margin:0 2px; }
.contact-form button:hover { cursor:pointer; background:#657672; }
.contact-form input.error, .contact-form textarea.error { border:1px solid #900; background:#FCF; }
.contact-form .disabled, .contact-form .disabled:hover { background:#666; color:#FFF; }

/*** GREEN THEME ***/
#green { background:url(/images/bg_green.jpg) repeat center; }
#green a:hover, #green #navigation a.on, #green h2 { color:#81994D; }
#green #header h1 { background:url(/images/asset_header.png) 0 0 no-repeat; }
#green .page img { border:3px double #9FA64C; }
#green .page a { color: #81994D; }
#green .development h2 { background:url(/images/header_web-development.png) no-repeat 0 0; }
#green .zen-cart h2 { background:url(/images/header_zen-cart.png) no-repeat 0 0; }
#green .contact-text h2 {  background:url(/images/header_contact-us.png) no-repeat 0 0; }
#green .roccstar h2 { width:194px; height:16px; background:url(/images/header_roccstar.png) no-repeat 0 0; }
#green .kill9 h2 { width:110px; height:19px; margin-bottom:8px; background:url(/images/header_kill9.png) 0 0 no-repeat; }
#green .contact-form li.message { color:#9FA64C;  }
#green .contact-form label { color:#81994D; }
#green .contact-form input, #green .contact-form select  { border:1px solid #9FA64C; }
#green .contact-form textarea { border:1px solid #9FA64C; }
#green .contact-form button { background:#9FA64C; }
#green .contact-form button:hover { background:#657672; }
#green #header .themes .selected { outline:2px solid #657672; }

/*** BLUE THEME ***/
#blue { background:url(/images/bg_blue.jpg) repeat center; }
#blue a:hover, #blue #navigation a.on, #blue h2 { color:#6CB0B1; }
#blue #header h1 { background:url(/images/asset_header.png) 0 -29px no-repeat; }
#blue .page img { border:3px double #00CCFF; }
#blue .page a { color: #6CB0B1; }
#blue .development h2 { background:url(/images/header_web-development.png) no-repeat 0 -20px; }
#blue .zen-cart h2 { background:url(/images/header_zen-cart.png) no-repeat 0 -15px; }
#blue .contact-text h2 {  background:url(/images/header_contact-us.png) no-repeat 0 -15px; }
#blue .roccstar h2 { width:194px; height:16px; background:url(/images/header_roccstar.png) no-repeat 0 -17px; }
#blue .kill9 h2 { width:110px; height:19px; margin-bottom:8px; background:url(/images/header_kill9.png) 0 -19px no-repeat; }
#blue .contact-form li.message { color:#00CCFF;  }
#blue .contact-form label { color:#27606A; }
#blue .contact-form input, #blue .contact-form select  { border:1px solid #00CCFF; }
#blue .contact-form textarea { border:1px solid #00CCFF; }
#blue .contact-form button { background:#00CCFF; }
#blue .contact-form button:hover { background:#00CCFF; }
#blue #header .themes .selected { outline:2px solid #27606A; }


/*** PINK THEME ***/
#pink { background:url(/images/bg_pink.jpg) repeat center; }
#pink a:hover, #pink #navigation a.on, #pink h2 { color:#E787AC; }
#pink #header h1 { background:url(/images/asset_header.png) 0 -58px no-repeat; }
#pink .page img { border:3px double #CB4265; }
#pink .page a { color: #E787AC; }
#pink .development h2 { background:url(/images/header_web-development.png) no-repeat 0 -41px; }
#pink .zen-cart h2 { background:url(/images/header_zen-cart.png) no-repeat 0 -30px; }
#pink .contact-text h2 {  background:url(/images/header_contact-us.png) no-repeat 0 -30px; }
#pink .roccstar h2 { width:194px; height:16px; background:url(/images/header_roccstar.png) no-repeat 0 -34px; }
#pink .kill9 h2 { width:110px; height:19px; margin-bottom:8px; background:url(/images/header_kill9.png) 0 -38px no-repeat; }
#pink .contact-form li.message { color:#CB4265;  }
#pink .contact-form label { color:#E787AC; }
#pink .contact-form input, #pink .contact-form select  { border:1px solid #CB4265; }
#pink .contact-form textarea { border:1px solid #CB4265; }
#pink .contact-form button { background:#CB4265; }
#pink .contact-form button:hover { background:#639FB8; }
#pink #header .themes .selected { outline:2px solid #639FB8; }

/*** ORANGE THEME ***/
#orange { background:url(/images/bg_orange.jpg) repeat center; }
#orange a:hover, #orange #navigation a.on, #orange h2 { color:#E97F03; }
#orange #header h1 { background:url(/images/asset_header.png) 0 -87px no-repeat; }
#orange .page img { border:3px double #F78E01; }
#orange .page a { color: #E97F03; }
#orange .development h2 { background:url(/images/header_web-development.png) no-repeat 0 -62px; }
#orange .zen-cart h2 { background:url(/images/header_zen-cart.png) no-repeat 0 -45px; }
#orange .contact-text h2 {  background:url(/images/header_contact-us.png) no-repeat 0 -45px; }
#orange .roccstar h2 { width:194px; height:16px; background:url(/images/header_roccstar.png) no-repeat 0 -51px; }
#orange .kill9 h2 { width:110px; height:19px; margin-bottom:8px; background:url(/images/header_kill9.png) 0 -58px no-repeat; }
#orange .contact-form li.message { color:#F78E01;  }
#orange .contact-form label { color:#E97F03; }
#orange .contact-form input, #orange .contact-form select  { border:1px solid #F78E01; }
#orange .contact-form textarea { border:1px solid #F78E01; }
#orange .contact-form button { background:#F78E01; }
#orange .contact-form button:hover { background:#C7A36D; }
#orange #header .themes .selected { outline:2px solid #C7A36D; }