/*-----------------------------------------------------------
[ Table of contents // Redwerks ]
-----------------------------------------------------------*/

/*

01 Global Resets
-----------------------------------------------------------
02 Global Layout
-----------------------------------------------------------
03 Navigation
-----------------------------------------------------------
04 Global Classes
-----------------------------------------------------------
05 Home Page
-----------------------------------------------------------

*/

/*--[ 01 Global Resets ]--
-----------------------------------------------------------
-----------------------------------------------------------*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td
	{
    margin:0; 
    padding:0; 
    border:0; 
    outline:0; 
    font-size:100%; 
    vertical-align:baseline; 
    background:transparent;
	}

body
	{
    line-height:1;
	}

ol, ul
	{
    list-style:none;
	}

blockquote, q
	{
    quotes:none;
	}

blockquote:before, blockquote:after,
q:before, q:after
	{
    content:'';
	}

:focus
	{
    outline:0;
	}

ins
	{
    text-decoration:none;
	}

del
	{
    text-decoration:line-through;
	}

table
	{
    border-collapse:collapse; 
    border-spacing:0;
	}

/*--[ 02 Global Layout ]--
-----------------------------------------------------------
-----------------------------------------------------------*/

body, html
	{
    width:100%; 
    min-height:100%; 
    height:auto !important; 
    height:100%; 
    background:#FFF url(../images/img-body-repeatx.gif) 0 0 repeat-x;
    }

body
	{
    font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	line-height:21px;
	color:#777;
	}

#cloak
	{
    width:100%; 
    min-height:100%; 
    height:auto !important; 
    height:100%;
	}

#package
	{
    position:relative; 
    width:1000px; 
    min-height:100%; 
    height:auto !important; 
    height:100%; 
    margin:0; 
    margin-bottom:-120px;
	}

#head
	{
    position:relative; 
    top:0; 
    left:0; 
    width:1000px; 
    height:481px; 
	}

#head-center
	{
    position:absolute;
    top:80px;
    left:0;
    width:997px;
    height:402px;
	}

.banner-img, .banner-video
	{
    position:relative;
    float:left;
    display:inline;
    width:799px;
    height:399px;
    margin-top:1px;
	}
	
.banner-video
	{
    width:480px;
    height:379px;
    margin:10px 0px 0px 10px;
	}
	
#package-body
	{
    position:relative; 
    width:1000px; 
    min-height:470px; 
    height:auto !important; 
    margin:0;
	}

.logo
	{
    position:absolute; 
    top:25px; 
    left:40px; 
    padding:0; 
    margin:0;
	}

#footer, .push
	{
    clear:both; 
    position:relative; 
    width:980px; 
    height:120px;
	}

#footer
	{
    background:transparent;
	}

#footer p
	{
    margin:0 0 0 160px;
	}

/*--[ 03 Navigation ]--
-----------------------------------------------------------
-----------------------------------------------------------*/

#side-menu
	{
    position:relative;
    float:right;
    display:inline;
    width:151px;
    height:187px;
    margin:43px 0 0 0;
	}

#side-menu a
	{
    width:151px;
    float:left;
	display:block;
	background:transparent;
	}

#navigation
	{
    position:relative;
    width:161px;
    height:401px;
    float:left;
    display:inline;
    padding:0;
    z-index:100;
	}
	
#navigation div, #navigation a 
	{
	width:161px;
	float:left;
	display:block;
	padding:0;
	background:transparent;
	}	
	
#navigation a:hover, #side-menu a:hover
	{
    background:#E6E6E6;
	}

.web-usability #navigation a#web-usability,
.web-usability #navigation a#web-usability:hover,
.content-development #navigation a#content-development,
.content-development #navigation a#content-development:hover,
.creative #navigation a#creative,
.creative #navigation a#creative:hover,
.seo-searchability #navigation a#SEO-searchability,
.seo-searchability #navigation a#SEO-searchability:hover,
.web-programming #navigation a#web-programming,
.web-programming #navigation a#web-programming:hover,
.why-redwerks #side-menu a#why-redwerks,
.why-redwerks #side-menu a#why-redwerks:hover,
.pricing #side-menu a#pricing,
.pricing #side-menu a#pricing:hover,
.about #side-menu a#about,
.about #side-menu a#about:hover,
.email-marketing #navigation a#email-marketing,
.email-marketing #navigation a#email-marketing:hover,
.blogs #navigation a#blogs,
.blogs #navigation a#blogs:hover,
.contact #side-menu a#contact,
.contact #side-menu a#contact:hover
	{
    background:#F1F1F1;
    }

/*--[ 04 Global Classes ]--
-----------------------------------------------------------
-----------------------------------------------------------*/

a, a:link, a:active
	{
	font-size:11px;
    text-decoration:none;
    color:#DA2F3D;
	}
	
a:hover
	{
    text-decoration:underline;
	}

.information-box
	{
    position:relative;
    width:790px;
    min-height:285px;
    height:auto !important;
    height:100%;
    margin:30px 0px 0px 160px;
	}
	
.information
	{
    position:relative;
    width:565px;
    min-height:285px;
    height:auto !important;
    height:100%;
    float:left;
    display:inline;
	}

.information img.heading
	{
	float:left;
    padding:0 0 25px 0;
	}

.information p
	{
    clear:left;
    margin:0;
    padding:0;
	}
	
.bullets
	{
    padding-left:25px;
	}

.bullets li
	{ 
    list-style-type:disc; 
    list-style-position:outside;
    padding-bottom:5px;
	}

.information p span, .bullets li span
	{
    color:#000;
	}

/*--[ 05 Home Page ]--
-----------------------------------------------------------
-----------------------------------------------------------*/

#home-footer
	{
	position:relative;
	width:840px;
	height:134px;
	margin:15px 0px 0px 155px;
	}
	
#home-footer #team-photo
	{
    float:left;
    display:inline;
	}	
	
#home-footer #play-video
	{
    float:right;
    display:inline;
	}	
	
/*--[ 09 Slider ]--
-----------------------------------------------------------
-----------------------------------------------------------*/

.stepcarousel
	{
	position:relative; /*leave this value alone*/
	border:none;
	overflow:scroll;   /*leave this value alone*/
	width:799px; 	   /*Width of Carousel Viewer itself*/
	height:399px; 	   /*Height should enough to fit largest content's height*/
	margin:10px 0px 0px 0px;
	}

.stepcarousel .belt
	{
	position:absolute; /*leave this value alone*/
	left:0;
	top:0;
	}

.stepcarousel .panel
	{
	float:left;        /*leave this value alone*/
	overflow:hidden;   /*clip content that go outside dimensions of holding panel DIV*/
	margin:0px 10px 0px 10px;       /*margin around each panel*/
	width:789px;       /*Width of each panel holding each content. If removed, widths should be 					     individually defined on each content DIV then. */
	height:379px;
	}

.stepcarousel .panel img
	{
    border-bottom:1px solid #DDD;
	}

.slider-navigation
	{
    position:absolute;
    bottom:0px;
    left:170px;
    width:789px;
    height:25px;
    line-height:25px;
	}
	
.slider-navigation a.previous
	{
	width:100px;
    float:left;
    display:inline;
    color:#000;
    text-align:left;
	}	
	
.slider-navigation a.next
	{
	width:100px;
    float:right;
    display:inline;
    color:#000;
    text-align:right;
	}	
	
.slider-navigation .current-panel
	{
	text-align:center;
    margin:0 auto;
	}	

/*--[ 10 Tray ]--
-----------------------------------------------------------
-----------------------------------------------------------*/

.slide 
	{
	
	}

.slide .inner 
	{
	position:absolute;
	top:0; left:0;
	width:100%;
	height:70px;
	color:#FFF;
	padding:6px;
	background-color:#000;
	filter:alpha(opacity=85);
	opacity: 0.85;
	-moz-opacity:0.85;
	display: none;
	z-index:200;
	}

#cloak .open_close
	{
	position: absolute;
	top:6px; left:800px;
	}

a#open_tray
	{
	width:85px;
	text-align:center;
	text-decoration:none;
	background: #000;
	color:#FFF;
    z-index:500;
    -moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border: 1px solid #444;
	}

a#open_tray:hover
	{
    color:#FFF;
    z-index:500;
    background: #DA2F3D;
    -moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border: 1px solid #DA2F3D;
	}

#close_tray
	{
    z-index: 500;
	}

.inner .inner_col
	{
	position:relative;
	font-size:11px;
    list-style:none;
    margin-left:50px;
    float:left;
    display:inline;
	}

.inner .inner_col h1
	{
   font-weight:bold;
	}
	
.closer { margin-left:15px !important; }

.inner_col li
	{
	list-style:none;
    display:block;
	}