/*
Wordpress Layout NAME: Rella Version 1
DESCRIPTION: Custom Layout for Rella by DaddyDesign.com
VERSION: 1
AUTHOR: Daddy Design
AUTHOR URI: http://www.daddydesign.com/
*/

/* General Settings */
*{ margin: 0; padding: 0; }

html, body { height:100%; }

img { border: 0; }

body{
background: url('images/bg.png') no-repeat top left #fff;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 13px;
font-variant: normal;
color: #a8a8a8;
}

p { margin-bottom: 15px; line-height:16px; }

a{ color: #a8a8a8; text-decoration: none; outline: none; }
a:hover{ text-decoration: underline; }

h1 {
font-size: 17px;
font-weight: normal;
color: #a8a8a8;
margin-bottom: 15px;
}

/* Container */
#container{ 
width: 100%; 
position: relative;
}

/* Social */
#social{ width: 100%; height: 35px; position: relative; }
#social img{ float: right; }
a.last_social{ padding: 0 8px 0 0; display: block; }

/* Container Inner */
#container_inner{
width: 900px;
margin: 0 auto;
padding: 0 50px;
position: relative;
z-index: 1;
}

/* Header */
#header{
width: 900px;
float: left;
margin: 30px 0 10px;
}

.logo{ width: 210px; height: 145px; float: left; }
.menu{ width: 660px; float: right; }
.menu li, .menu li.home, .menu li.about, .menu li.services, .menu li.work, .menu li.login, .menu li.contact {
float: left; 
list-style: none; 
display: inline; 
font-size: 13px;
text-transform: uppercase;
border-right: 1px solid #ccc;
padding: 0 10px;
margin-top: 55px;
}
.menu li.home{ color: #be2326; }
.menu li.about{ color: #0cb3df; }
.menu li.services{ color: #f26128; }
.menu li.work{ color: #fdb813; }
.menu li.login{ color: #72c263; }
.menu li.contact{ color: #3d3c7d; border: 0; }

.menu li a:hover{ text-decoration: none; }
.menu li.home a:hover{ color: #be2326; }
.menu li.about a:hover{ color: #0cb3df; }
.menu li.services a:hover{ color: #f26128; }
.menu li.work a:hover{ color: #fdb813; }
.menu li.login a:hover{ color: #72c263; }
.menu li.contact a:hover{ color: #3d3c7d; }

/* Content */
#content{
width: 650px;
float: left;
padding: 0 0 230px 250px;
}
#content object{ z-index: -1; }

/* Demo Reel */
.demo_reel { position: relative; }

.demo_reel_title { 
width: auto;
float: left;
position: absolute;
color: #fff;
font-size: 9pt;
text-decoration: none;
top: 20px;
left: -20px;
}
	
.demo_reel_title_mid { 
font-size: 9px;
text-align: center;
padding: 8px 12px;
background-color: #be2326;
}
		
.demo_reel_title_btm { 
width: 20px;
height: 15px;
background: transparent url(images/tooltip_btm_red.png) no-repeat top left;
}

/* Tabs */
ul.idTabs{ width: 650px; float: left; margin-bottom: 20px; }
ul.idTabs li{
float: left; 
list-style: none; 
display: inline; 
font-size: 17px;
text-transform: uppercase;
padding: 0 20px 0 0;
}

.tab_section{ width: 650px; float: left; }
.tab_section p{ width: 650px; }
.tab_section ul, .tab_section  ol{ width: 635px; padding: 0 0 0 15px; }
.tab_section ul li, .tab_section  ol li{ margin: 0 0 15px 0; }

/* About */
.about_section{ width: 650px; float: left; }
.about_section ul.idTabs li a:hover, .about_section ul.idTabs li a.selected{ color: #0cb3df; text-decoration: none; }

.about_section .tab_section ul li, .about_section .tab_section ol li{ color: #0cb3df; }
.about_section .tab_section ul li span, .about_section .tab_section ol li span{ color: #a8a8a8; }

/* Services */
.services_section{ width: 650px; float: left; }
.services_section ul.idTabs li a:hover, .services_section ul.idTabs li a.selected{ color: #f26128; text-decoration: none; }

.services_section .tab_section ul li, .services_section .tab_section ol li{ width: 250px; float: left; color: #f26128; margin: 0 0 10px 0; padding: 0 10px 0 0; }
.services_section .tab_section ul li span, .services_section .tab_section ol li span{ color: #a8a8a8; }

/* Work */
.work_header{ width: 650px; float: left; margin-bottom: 20px; }

ul.work_menu{ width: 650px; float: left; margin-bottom: 5px; }
ul.work_menu li{
float: left; 
list-style: none; 
display: inline; 
font-size: 17px;
text-transform: uppercase;
padding: 0 20px 0 0;
color: #fdb813;
}
ul.work_menu li a:hover{ color: #fdb813; text-decoration: none; }

ul.work_sub_menu{ width: 650px; float: left; }
ul.work_sub_menu li{
float: left; 
list-style: none; 
display: inline; 
font-size: 10px;
border-right: 1px solid #ccc;
padding: 0 5px;
color: #fdb813;
}
ul.work_sub_menu li.first{ padding: 0 5px 0 0; }
ul.work_sub_menu li.last{ border: 0; padding: 0 0 0 5px; }
ul.work_sub_menu li a:hover{ color: #fdb813; text-decoration: none; }

.thumb{ width: 130px; height: 130px; float: left; }
.thumb img{ width: 130px; height: 130px; }

/* Work Section ToolTip Overlay for thumbs */
.toolTip { position: relative; }

.toolTipWrapper { 
width: 100%;
position: absolute;
display: none;
color: #FFF;
font-size: 9pt;
text-decoration: none;
}
	
.toolTipMid { 
font-size: 9px;
text-align: center;
padding: 8px 12px;
background-color: #fdb813;
}
		
.toolTipBtm { 
height: 15px;
background: transparent url(images/tooltip_btm.png) no-repeat top left;
}

/* Testimonials */
ul.testimonials_list{ width: 635px; padding: 0 0 0 15px; }
ul.testimonials_list li{ width: 250px; float: left; margin: 0 0 10px 0; color: #fdb813; padding: 0 10px 0 0; }
ul.testimonials_list li a:hover{ color: #fdb813; text-decoration: none; }

a.back_button{ float: left; font-size: 10px; }
a:hover.back_button{ color: #fdb813; text-decoration: none; }

.testimonial{ width: 100%; float: left; }
.testimonial h1{ margin: 0 0 5px 0; }

/* Client Login */
a.client_page_link{ color: #72c263; }

.client_login_list_section{ width: 100%; float: left; }
.client_login_list_section h1{ color: #72c263; text-transform: uppercase; }

ul.client_login_list{ width: 635px; padding: 0 0 0 15px; }
ul.client_login_list li{ width: 250px; float: left; margin: 0 0 10px 0; color: #72c263; padding: 0 10px 0 0; }
ul.client_login_list li a:hover{ color: #72c263; text-decoration: none; }

a.client_back_button{ float: left; font-size: 10px; margin-bottom: 20px; }
a:hover.client_back_button{ color: #72c263; text-decoration: none; }

.client_section{ width: 100%; float: left; }
.client_section h1{ color: #72c263; }

/* Fixes WP Password form */
.client_section form br{ display: none; }

.client_section form label{ font-weight: bold; text-transform: uppercase; color: #72c263; }

.client_section form input{ 
height: auto;
background-color: #72c263; 
border: 0;
padding: 5px;
margin: 0 2px;
cursor: pointer;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #fff;
text-transform: uppercase;
}

.client_section form label input{ 
width: 185px;
padding: 6px;
cursor: text;
text-transform: none;
}

/* Footer */
#footer{ 
width: 100%; 
position: fixed; 
z-index: 9;
bottom: 0;
}

#footer_info{
width: 100%;
float: left;
position: absolute;
bottom: 0;
background: #fff;
}

.company_info{
width: 680px;
float: left;
border-bottom: 1px solid #ccc;
padding: 7px 10px;
font-size: 11px;
}
.company_info p{ line-height: normal; margin: 0; display: inline; }

span.rella_name{ text-transform: uppercase; }
span.rella_name_red{ text-transform: uppercase; color: #bc1f25; }
span.rella_name_blue{ text-transform: uppercase; color: #0cb3df; }
span.rella_name_orange{ text-transform: uppercase; color: #f26128; }
span.rella_name_yellow{ text-transform: uppercase; color: #fdb813; }
span.rella_name_green{ text-transform: uppercase; color: #72c263; }
span.rella_name_navy{ text-transform: uppercase; color: #3d3c7d; }

span.credits{
width: 670px;
float: left;
clear: left;
font-size: 9px;
padding: 7px 10px 10px;
}

.logo_footer{
width: 310px;
height: 230px;
position: absolute;
bottom: 0;
right: 0;
z-index: 9;
}
