/* @override http:// */
/*-------------------------------------------------------------------------------------
[Master Stylesheet]

Project:	DesignRL
Version:	1.0
Created by:	DesignRL

------------------------------------------------------

[Table of Contents]

	1. Main 
	2. Header
	3. Menu
	4. Content
	5. Footer
	6. Menu Listing

------------------------------------------------------

[fonts]

	body: Arial, Helvetica, sans-serif;
	font-size: 14px;
	
[Colors]

	orange: #e77615;
	blue: #1772c8;

--------------------------------------------------------------------------------------*/


/* ==================== MAIN ==================== */

/* Universal --------- */
* { margin:0px; }
body { padding:0 0 10px 0; background:#9a9b96 url(../images/bg-stretch-40x300.jpg) repeat-x 0 0; font-family:Helvetica, Arial, sans-serif; color:#333333; font-size:0.9em; }
iframe { overflow:hidden; }
img { border:none; text-decoration:none; }
p { padding:10px 0; }
h3 { color:#1772c8; font-size:1.2em; line-height:1.2em; padding:10px 0; }
h4 { font-weight:100; font-size:1.2em; line-height:1.2em; color:#333333; padding:10px 0; }

/* Elements --------- */
.clear { clear:left; height:0px; font-size:0px; line-height:0px; }
.ttl { padding:10px 20px 18px 20px; background:#e5f5ff url(../images/ttl-shadow-900x8.gif) no-repeat center bottom; color:#E5F5FF; }

/* Box --------- */
.box { width:220px; background:url(../images/box-bottom-220x26.gif) no-repeat 0 bottom; padding-bottom:26px; margin-bottom:20px; font-size:0.9em; line-height:1.3em; }
.box div.stretch { background:url(../images/box-stretch-220x50.gif) repeat-y 0 0; }
.box div.top { background:url(../images/box-top-220x5.gif) no-repeat 0 0; padding:17px 15px 15px 15px; }
.box h4 { color:#1772c8; font-size:1.1em; padding:0px; font-weight:700; }
/**/
.box ul { padding:0px; list-style:none; }
.box ul li { padding:6px 0 0 0; }
.box ul li strong { color:#e77615; }

/* Box home --------- */
.home-box div.box { width:299px; background:url(../images/box-bottom-299x26.gif) no-repeat 0 bottom; padding-bottom:26px; margin-bottom:10px; font-size:0.9em; line-height:1.3em; }
.home-box div.box div.stretch { background:url(../images/box-stretch-299x50.gif) repeat-y 0 0; }
.home-box div.box div.top { background:url(../images/box-top-299x5.gif) no-repeat 0 0; padding:17px 15px 15px 15px; }
.box h4 { color:#1772c8; font-size:1.1em; padding:0px; font-weight:700; }

/* upper right button --------- */
#more-work { position:absolute; width:100%; text-align:right; }


/* ==================== HEADER ==================== */

/* wrappers --------- */
#top { background:url(../images/bg-clouds-1406x300.jpg) no-repeat center 0; height:300px; }
#hdr { width:900px; height:163px; margin:0 auto; position:relative; }
#wrapper { background:#ece8d3 url(../images/bg-tan-stretch-40x50.jpg) repeat-x 0 0; }
#content { width:900px; margin:0 auto; }
#content div.content-wrap { background-color:#FFFFFF; margin:-137px 0 0 0; float:left; position:relative; }
/**/
.body { width:860px; margin:0 auto; }
.body-content { width:600px; float:left; padding:20px 10px 0 10px; font-size:1.0em; line-height:1.2em; }
.body-right { width:220px; float:left; padding:30px 10px 0 10px; }
/**/
.body a { color:#e77615; font-weight:700; text-decoration:none; }
.body a:hover { text-decoration:underline; }

/* logo --------- */
h1.logo { width:310px; float:left; padding:35px 0 0 0; position:absolute; left:0px; }
h1.logo a { display:block; width:310px; height:100px; }
h1.logo a span { display:none; }

/* menu --------- */
.menu { width:900px; float:left; padding:107px 0 0 0; }
.menu ul { list-style:none; float:right; }
.menu li { float:left; }
.menu li a { display:block; background-image:url(../images/menu-399x126.jpg); background-repeat:no-repeat; height:42px; }
.menu li a span { display:none; }
/**/
.menu li.menuHome a { background-position:0 0; width:89px; }
.menu li.menuWork a { background-position:-89px 0; width:95px; }
.menu li.menuAbout a { background-position:-184px 0; width:97px; }
.menu li.menuContact a { background-position:-281px 0; width:118px; }
/**/
.menu li.menuHome a:hover { background-position:0 -42px; }
.menu li.menuWork a:hover { background-position:-89px -42px; }
.menu li.menuAbout a:hover { background-position:-184px -42px; }
.menu li.menuContact a:hover { background-position:-281px -42px; }
/**/
.menu li.menuHome a.active { background-position:0 -84px; }
.menu li.menuWork a.active { background-position:-89px -84px; }
.menu li.menuAbout a.active { background-position:-184px -84px; }
.menu li.menuContact a.active { background-position:-281px -84px; }




/* ==================== HOME ==================== */

/* slider --------- */
.slider { width:901px; height:332px; text-align:center; padding:10px 0 0 0; }

/**/
.buttons{padding:5px;}
.buttons span{color:#0080FF;padding:0 5px;cursor:pointer;font:10px Verdana}
.buttons span.active, .buttons span:hover{ background-position:0 -45px; }
.buttons span small { display:none; }
/* Sample 8*/
.sample { background:url(../images/slide-bg-821x332.jpg) no-repeat center 0; width:901px; height:332px; }
#box8{ position:absolute; }
#box8 div{ width:821px; float:left; }
#box8 .buttons{ text-align:left }
#box8 .next{ float:right }

/* ********************************** */

.mask1{ position:relative; width:821px; height:332px; overflow:hidden; float:left; }
/**/
.prev-btn, .next-btn { width:22px; float:left; padding:140px 0 0 0; }
.prev-btn { padding-left:9px; padding-right:9px; }
.next-btn { padding-left:9px; padding-right:8px; }
.prev-btn span, .next-btn span { background-position:0 0; background-repeat:no-repeat; display:block; width:22px; height:45px; }
.prev-btn span { background-image:url(../images/slide-btn-1-22x45.gif); }
.next-btn span { background-image:url(../images/slide-btn-2-22x45.gif); }

/* home body --------- */
.home { padding:30px 36px 0 36px; }
.home-box { float:left; }
.home-welcome { width:500px; float:left; padding:0 0 0 30px; }
.home-welcome p { background:url(../images/home-img-500x102.jpg) no-repeat 0 0; padding:115px 0 0 0; margin:5px 0 0 0; }
.home-welcome a { color:#1772c8; }



/* ==================== FOOTER ==================== */

/* main --------- */
#footer { background:#9a9b96; border-top:1px solid #FFFFFF; }
#footer div.ftr-shadow { background:url(../images/footer-bg-900x30.gif) no-repeat 0 0; width:900px; margin:0 auto; }

/* contact --------- */
#footer div.contact-info { width:313px; height:160px; float:left; background:url(../images/ftr-contact-358x174.gif) no-repeat 0 14px; color:#FFFFFF; font-weight:100; padding:28px 0 0 45px; font-size:16px; }
#footer div.contact-info span { margin-right:5px; }
#footer div.contact-info a { margin-left:5px; color:#FFFFFF; }

/* resources --------- */
#footer div.resources { width:517px; float:left; color:#cdcdcb; font-size:.9em; padding:40px 0 0 25px; }
#footer div.resources a { color:#cdcdcb; text-decoration:none; }
#footer div.resources a:hover { text-decoration:underline; }
#footer div.resources ul { width:152px; float:left; padding:10px 0 15px 20px; }
#footer div.resources ul li { padding:5px 0; }
/**/
#footer div.resources div.copyright { clear:left; background:url(../images/ftr-divider-405x1.gif) no-repeat right 0; text-align:right; padding:10px 0 0 0; }



/* ==================== PORTFOLIO ==================== */

/* portfolio listing --------- */
.portfolio { background:url(../images/portfolio-bg-855x492.gif) no-repeat 0 0; width:817px; height:216px; display:block; margin:30px auto; padding:14px 19px 16px 19px; text-decoration:none; }
.portfolio:hover { background:url(../images/portfolio-bg-855x492.gif) no-repeat 0 -246px; }
.portfolio img { float:left; }
.portfolio span.p-div { padding-left:565px; display:block; }
.portfolio span.p-hdr { color:#1772c8; font-size:1.5em; padding:3px 0 0 0; display:block; font-weight:700; }
.portfolio span.p-skills { display:block; color:#666666; font-size:.8em; border-bottom:1px solid #e0e0c5; padding:4px 0 5px 0; display:block; }
.portfolio:hover span.p-skills { border-bottom:1px solid #b8cfe5;}
.portfolio span.p-desc { color:#333333; font-size:.9em; line-height:1.2em; border-top:1px solid #FFFFFF; padding:5px 0 0 0; display:block; }
/**/
.gallery { display:none; }



/* ==================== ABOUT ==================== */

.hdr-about { background:url(../images/img-specialties-860x185.jpg) no-repeat 0 0; width:860px; height:185px; text-align:center; }
.hdr-about span{ display:none; margin:50px 0 0 0; }



/* ==================== CONTACT ==================== */

#EmailForm { padding:20px 0 20px 50px; }
#EmailForm tr { vertical-align:top; }
#EmailForm td { padding:8px 5px; vertical-align:top; }
#EmailForm label { display:block; text-align:right; color:#1772c8; font-size:1.2em; padding:7px 0 0 0; }
#EmailForm td.required { background:url(../images/required-43x14.gif) no-repeat right 15px; width:346px; }
#EmailForm td small { display:none; }
#EmailForm td input, #EmailForm td textarea { border:none; padding:0px; font-family:Helvetica, Arial, sans-serif; font-size:1.0em; background:none !important; width:250px; }
#EmailForm td textarea { height:100px; }
#EmailForm td span { background-color:#f9f9f1; background-image:url(../images/icons-form-15x161.gif); background-repeat:no-repeat; border:1px solid #d4d2cb; display:block; padding:7px 7px 7px 30px; width:260px; }
#EmailForm td span.icon-name { background-position:5px 8px; }
#EmailForm td span.icon-email { background-position:5px -42px; }
#EmailForm td span.icon-phone { background-position:5px -91px; }
#EmailForm td span.icon-msg { background-position:5px -138px; }
#EmailForm td span.icon-none { background:none; border:none; padding:0px; }
#EmailForm td span.icon-none label { display:inline; }
#EmailForm td span.icon-none input { width:auto; }
#EmailForm td.btn { text-align:right; padding-right:50px; }
#EmailForm td.btn input { width:104px; height:45px; }
/**/
.errors { background-color:#EEE; border:1px solid #DDD; padding:10px; }
.errors strong { color:#990000; }