/* ---------------------------------------------------
------------------------------------------------------
-22222222222----2222222222----------0000000000--------
-222----22222---222---22222-------000000000000--------
--------22222---------22222------000-------000--------
------22222---------22222-------000-------000---------
----22222---------22222--------000-------000----------
--22222---------22222---------000-------000-----------
-22222---------22222---------000-------000------------
2222222222222-2222222222222-000000000000-------=======
222222222222--222222222222--0000000000--------- | | |
-----------------------------------------------=======  
220power.com Version 3.0
------------------------------------------------------

In case you're wondering:

The carousel and hover popups came from 
jqueryfordesigners.com

The Audio Player is jPlayer with jQuery
www.happyworm.com/jquery/jplayer/

The rest is just custom php/mysql with a dash of 
a "wing and a prayer". Feel free to borrow or 
use any code. Just don't rip the graphics.

Questions or comments to webmaster@220power.com

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

/* reset this bad boy */
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:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}
/*--------------------*/

.clear { clear: both; }

a { outline: none; text-decoration: none; color: #40b1c9; }

a img { display: block; }

a.big_link { 
  color: #fff; 
  display: inline-block;
  padding: 10px; margin-top: 5px;
  background-color: #40b1c9;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px; }
a:hover.big_link{ background-color: #666; }

body { border-top: 10px solid #40b1c9; font-family: Helvetica, Verdana, sans-serif; } 

hr {
  border: none;
  height: 20px;
}
#wrapper {
  margin: 0 auto;
  width: 960px; 
}

img.img_left{ 
  border: 2px solid #ccc;
  margin: 0px 15px 0px 0px;
  float: left; 
}

/* text items */

h1 { font-size: 24px; color: #40b1c9; margin-bottom: 15px; }
h1.sigh { color: #ffa800; }
h2 { font-size: 20px; font-weight: normal; color: #474747; }
h2.date_header {  
  color: #fff; background-color: #40b1c9; 
  font-size: 14px; font-weight: bold; 
  text-transform: uppercase; text-align: center;
  padding: 2px 0px 0px 0px; margin: 0px 0px 10px 0px;
}
#col_sidebar h2 {   text-transform: uppercase; color: #40b1c9; }
#col_sidebar h2 { 
  padding-top: 6px; margin-left: 6px;
  font-size: 18px;
  }
#col_sidebar h2.jumbo { 
  padding-top: 28px; margin-left: 0px;
  font-size: 22px;
  font-weight: 700;
  }
#col_sidebar .sidebar_box h2 { margin: 0px 0px 10px 0px; }
h3.fancy_display { 
  font-weight: normal;
  font-size: 18px;
  color: #444; 
  display: block;
  padding: 8px; margin: 15px 0px 10px 0px;
  background-color: #eee;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px; }

p { font-size: 14px; color: #2b2b2b; }
p.jumbo { font-size: 22px; }
span.jumbo { font-size: 22px; }
#col_sidebar p, #col_content p, #video_box p{ line-height: 1.5em; margin-bottom: 12px; }
#col_sidebar p { margin: 0px 20px 10px 0px; }
#col_sidebar .subscribe p{
  color: #fff; font-size: 12px;
  margin: 4px 205px 0px 6px;
  padding-bottom: 10px;
}

.sidebar_box p { color: #f7f7f7; line-height: 1.5em; margin-bottom: 12px; }
#col_sidebar .podcast_item h2 { font-size: 16px; color: #fff; text-transform: none; margin-bottom: 10px; padding: 0; }
#col_sidebar .podcast_item p  { font-size: 12px; color: #fff; text-transform: none; margin-bottom: 10px;}


#col_content ul { list-style: disc; margin-left: 20px; margin-top: 10px;}
#col_content ul li { margin-bottom: 15px;}

/* Main Navigation */

#header ul { 
  display: block; float: right; 
  position: relative;  
  margin-right: 15px; 
  margin-top: 22px; }
  
#header ul li { 
  position: relative;
  display: inline;
  text-transform: uppercase; 
  letter-spacing: 2px; 
  font-size: 16px; }

#header ul li a { 
  color: #fff; text-decoration: none; 
  border-bottom: 1px solid #40b1c9;
  padding-bottom: 5px;
  margin-left: 20px;
}
#header ul li a:hover { border-bottom: 5px solid #40b1c9; }

#header li ul {
	position: absolute;
	padding-top: 14px;
    left:  0px;
	top: 0;
	display: none; }

#header li ul li { 
  display: block;
  text-transform: uppercase; 
  letter-spacing: 2px; 
  font-size: 12px; }

#header li ul li a {
  background-color: #40b1c9;
  display: block;
  width: 120px;
  color: #fff; text-decoration: none; 
  border: 1px solid #40b1c9;
  padding: 5px;
  margin-bottom: 5px;
} #header li ul li a:hover { border: 1px solid #40b1c9; background-color: #2d7a8a; }

#header li:hover ul { display: block; }

 


/* main header, lives sitewide    */
/* -------------------------------*/

#header { position: relative; height: 247px; }
#header h2#home a {
  display:block; text-indent:-5000px;
  position: absolute;
  height: 247px; width: 446px; 
  margin-top: 0px; margin-left: 16px;
  background: url('/images/Logo-220-2.png');
}
#content_header { 
  width: 960px; height: 26px;
  background: url('/images/colors/default/3D_bar_default.png');
}
#content_frame { width: 960px; background-color: #fff; padding-bottom: 45px; }


#subpage_nav {
  width: 100%; height: 55px;
  background: url('/images/Header_Subpage.jpg');
}

#subpage_nav.photo-view { height: 35px; }

#subpage_nav span.bookend {  
  padding: 8px 8px 0px 8px;
  font-size: 22px; 
  color: #40b1c9;
  text-transform: uppercase;
}
 
#subpage_nav span.bookend.right { float: right; }
#subpage_nav span.bookend.left  { float: left; }

#subpage_nav ul { 
  position: relative;
  display: block;
  margin: 0 auto; top: 18px;
  text-align: center;
  background-color: #40b1c9;  
  padding: 6px; 
 
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

#subpage_nav ul.subnav_about  { width: 530px; }
#subpage_nav ul.subnav_life   { width: 420px; }
#subpage_nav ul.subnav_events { width: 570px; }
#subpage_nav ul.subnav_media  { width: 360px; }
#subpage_nav ul.subnav_media  { width: 360px; }
#subpage_nav ul.subnav_store  { width: 575px; }

#subpage_nav ul li { 
  padding: 0px 10px 0px 15px;
  font-size: 14px; 
  display: inline; 
  text-transform: uppercase;
}

#subpage_nav a { padding-top: 12px; text-decoration: none; color: #252525 }
#subpage_nav a.current { color: #fff; background: url('/images/Sub_Indicator.png') top center no-repeat; }
#subpage_nav a:hover   { color: #fff; }

#header .form_output { 
  position: absolute;
  padding: 10px;
  width: 600px;
  top: 150px; 
  left: 180px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
} 
#header .form_output.success{ background: #cbffe2; }
#header .form_output.fail{ background: #ffcccc; }

.form_output p {
  font-size: 18px; color: #444;
  margin: 0; padding: 0;
  text-align: center;
} .form_output p span { font-size: 22px; margin-right: 4px; }



/* page scaffold structures       */
/* -------------------------------*/

#col_content           { float: left;  }
#col_content.full      { float: none; width: 640px; margin: 0 auto;padding-top: 30px; }
#col_content.full form { border: 1px solid #ccc; background: #ebebeb;}

#col_content.news      { width: 525px; }
#col_content.media     { width: 595px; margin: 30px 20px 0px 30px; }
#col_content.video     { width: 700px; margin: 30px 0px  0px 30px; }
#col_content.about     { width: 550px; margin: 30px 30px 0px 40px; }
#col_content.life      { width: 550px; margin: 30px 30px 0px 40px; }
#col_content.events    { width: 550px; margin: 30px 30px 0px 40px; }
#col_content.events-single  { width: 400px; margin: 30px 20px 0px 40px; }
#col_content.my220   { width: 550px; margin: 30px 30px 0px 40px; }
#col_content.store   { margin: 30px 0px 0px 40px; }
#col_content.store_item   { width: 540px; margin: 30px 30px 0px 40px; }


#col_content.my220account   { float: right; width: 650px; margin: 30px 30px 0px 0px; }


#col_sidebar { float: right; }
#col_sidebar.pg_home   { width: 435px; }
#col_sidebar.pg_media  { width: 300px; margin: 20px 0px 0px 0px; }
#col_sidebar.pg_watch  { width: 205px; margin: 30px 0px 0px 0px; }
#col_sidebar.pg_about  { width: 315px; margin: 30px 0px 0px 0px; }
#col_sidebar.pg_life   { width: 315px; margin: 30px 0px 0px 0px; }
#col_sidebar.pg_events { width: 315px; margin: 30px 0px 0px 0px; }
#col_sidebar.pg_events-single { width: 500px; margin: 30px 0px 0px 0px; }
#col_sidebar.pg_store  { width: 345px; margin: 30px 0px 0px 0px; }


#col_sidebar.pg_my220account { 
  float: left; width: 200px; 
  margin: 30px 30px 0px 0px; 
 
}


.content_wrap { margin: 30px 30px 0px 30px; }

/* Interior items                */
/* -------------------------------*/

.sidebar_box {
  background-color: #353535;
  padding: 15px 15px 15px 15px;
  margin-top: 15px; margin-bottom: 35px;
  
  -webkit-border-top-left-radius: 8px;
  -webkit-border-bottom-left-radius: 8px;
  -moz-border-radius-topleft: 8px;
  -moz-border-radius-bottomleft: 8px;
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
}

.latest_videos .video_thumb_wrap {
  float: left; margin: 10px 10px 5px 0px;
  height: 220px;
}

#col_sidebar .latest_videos .video_thumb_wrap p{
 

  margin: 10px 0px 5px 0px;
  width: 204px;
}
.latest_videos img { border: 2px solid #40B1C9; }

/* Footer, lives site wide        */
/* -------------------------------*/

#footer {
  position: relative;
  margin: 0 auto;
  width: 960px; height: 155px;
  border-top: 8px solid #40b1c9;
  background: #0d0d0d url('/images/Back_Footer.jpg') no-repeat;
  padding-top: 75px;  
 
}

#footer p { font-size: 12px; color: #767676; text-align: center; }
#footer a { color: #40b1c9; text-decoration: none; }
#footer a:hover { color: #e8e8e8; }

/* footer nav links */

#footer li { float: left; height: 43px; }
#footer li a {
  display: block;
  height: 43px; 
  text-indent: -5000px; overflow: hidden;
  background-position: top;
  margin-right: 20px;
  }
#footer li a:hover { background-position: bottom; }
#footer_nav {
  width: 331px;
  margin: 0 auto;
  margin-top: 25px; 
  list-style: none; }

li a#footer_twitter  { width: 97px; background: url(/images/Link_Twitter.jpg) no-repeat; }
li a#footer_facebook { width: 97px; background: url(/images/Link_Facebook.jpg) no-repeat; }
li a#footer_vimeo    { width: 97px; background: url(/images/Link_Vimeo.jpg) no-repeat;   margin-right: 0px;}
 
#col_content p.attention { 
  background: #eee;
  border: 1px solid #ccc;
  padding: 10px;

  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
}

/* form output */
.form_out { background-color: #40B1C9; border: 1px solid #666; padding: 15px; margin-bottom: 20px; }
.form_out span { font-size: 18px; margin-right: 4px; }
#col_content .form_out p{ font-size: 16px; line-height: normal; padding: 0; margin: 0; color: #fff; }