* { margin: 0; padding: 0; outline: none; }

html
{
	overflow: -moz-scrollbars-vertical;
}

body
{
	font-size: 62.5%;
	text-align: center;
	background: #424242 url('/images/backgrounds/body.png') repeat-x top;
}

body, input, textarea, select
{
	font-family: "Arial", sans-serif;
}

.Inner
{
	position: relative;
	width: 820px;
	margin: 0 auto 0 auto;
	text-align: left;
}

.Clear:after
{
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.Clear
{
    display: inline-block;
}

html[xmlns] .Clear
{
    display: block;
}

* html .Clear
{
    height: 1%;
}

.Error
{
	color: #CC0000;
}


/* Header
--------------------------------------------------------------------------------------- */

#Outer-Header
{
	background: url('/images/backgrounds/header.png') no-repeat center 6px;
}

#Header
{
    height: 140px;
}

#Header h1
{
	width: 179px;
	height: 50px;
	padding: 31px 0 0 0;
}

#Header h1 a
{
	display: block;
	height: 50px;
	background: url('/images/logos/firehoop-masthead.png') no-repeat 0 0;
	text-indent: -9000px;
	overflow: hidden;
}

#Header em
{
    position: absolute;
    top: 59px;
    right: 0;
    width: 480px;
    height: 21px;
    background: url('/images/backgrounds/contact.png') no-repeat 0 0;
    text-indent: -9000px;
    overflow: hidden;
}

#Header #Navigation
{
	float: left;
	display: inline;
	width: 820px;
}

#Header #Navigation ul#Root
{
	float: left;
	display: inline;
	margin: 18px 0 0 0;
	padding: 0 1px 0 0;
	background: url('/images/backgrounds/nav-end.png') no-repeat top right;
	list-style: none;
}

#Header #Navigation ul#Root li, 
#Header #Navigation ul#Root li a
{
	float: left;
	display: inline;
	height: 41px;
}

#Header #Navigation ul#Root li a
{
	background-repeat: no-repeat;
	background-position: 0 0;
	text-indent: -9000px;
	overflow: hidden;
}

#Header #Navigation ul#Root li#Nav-Home, 
#Header #Navigation ul#Root li#Nav-Home a
{
	width: 74px;
}

#Header #Navigation ul#Root li#Nav-Home a
{
	background-image: url('/images/backgrounds/nav/home.png');
}

#Header #Navigation ul#Root li#Nav-Websites, 
#Header #Navigation ul#Root li#Nav-Websites a
{
	width: 95px;
}

#Header #Navigation ul#Root li#Nav-Websites a
{
	background-image: url('/images/backgrounds/nav/websites.png');
}

#Header #Navigation ul#Root li#Nav-Development, 
#Header #Navigation ul#Root li#Nav-Development a
{
	width: 121px;
}

#Header #Navigation ul#Root li#Nav-Development a
{
	background-image: url('/images/backgrounds/nav/development.png');
}

#Header #Navigation ul#Root li#Nav-Clients, 
#Header #Navigation ul#Root li#Nav-Clients a
{
	width: 77px;
}

#Header #Navigation ul#Root li#Nav-Clients a
{
	background-image: url('/images/backgrounds/nav/clients.png');
}

#Header #Navigation ul#Root li#Nav-Thoughts, 
#Header #Navigation ul#Root li#Nav-Thoughts a
{
	width: 94px;
}

#Header #Navigation ul#Root li#Nav-Thoughts a
{
	background-image: url('/images/backgrounds/nav/thoughts.png');
}

#Header #Navigation ul#Root li#Nav-Jobs, 
#Header #Navigation ul#Root li#Nav-Jobs a
{
	width: 64px;
}

#Header #Navigation ul#Root li#Nav-Jobs a
{
	background-image: url('/images/backgrounds/nav/jobs.png');
}

#Header #Navigation ul#Root li#Nav-Contact, 
#Header #Navigation ul#Root li#Nav-Contact a
{
	width: 82px;
}

#Header #Navigation ul#Root li#Nav-Contact a
{
	background-image: url('/images/backgrounds/nav/contact.png');
}

#Header #Navigation ul#Root li#Nav-Mapping, 
#Header #Navigation ul#Root li#Nav-Mapping a
{
	width: 133px;
}

#Header #Navigation ul#Root li#Nav-Mapping a
{
	background-image: url('/images/backgrounds/nav/mapping.png');
}

#Outer-Header #Header #Navigation ul#Root li a:hover
{
	background-position: 0 -41px;
}

#Outer-SubNav
{
    height: 38px;
    background: #FFF url('/images/backgrounds/subnav.png') repeat-x bottom;
}

#Outer-SubNav ul
{
    list-style: none;
}

#Outer-SubNav ul li
{
    margin: 5px 0 0 0;
    font-size: 1.3em;
}

#Outer-SubNav ul li, 
#Outer-SubNav ul li a, 
#Outer-SubNav ul li a span
{
    float: left;
    display: inline;
}

#Outer-SubNav ul li a
{
    color: #7AAB3F;
    text-decoration: none;
}

#Outer-SubNav ul li a:hover
{
    color: #648C33;
}

#Outer-SubNav ul li a span
{
    padding: 7px 14px 10px 14px;
    cursor: pointer;
}

#Outer-SubNav ul li.Current a
{
    background: url('/images/backgrounds/tab-active.gif') no-repeat top left;
    color: #648C33;
}

#Outer-SubNav ul li.Current a span
{
    background: url('/images/backgrounds/tab-active-end.gif') no-repeat top right;
}


/* Content
--------------------------------------------------------------------------------------- */

#Outer-Content
{
	background: #FFF;
}

#Content
{
	padding: 37px 0 35px 0;
}

#Content h3
{
    margin: 20px 0 0 0;
    border: solid #A6D75F;
    border-width: 0 0 1px 0;
    font-size: 1.6em;
    color: #519332;
    font-weight: normal;
}

#Content p
{
    margin: 15px 0 0 0;
    font-size: 1.3em;
    color: #696969;
    line-height: 1.6em;
}

#Content .Message
{
    padding: 10px 10px 10px 32px;
}

#Content .Message p
{
    margin: 0;
	font-size: 1.2em;
}

#Content .Error
{	
	background: #FFEAEA url('/images/icons/error.png') no-repeat 12px 12px;
}

#Content .Error p
{	
	color: #CC0000;
}

#Content .Success
{
	background: #E7F5D4 url('/images/icons/success.png') no-repeat 12px 12px;
}

#Content .Success p
{
	color: #3E7416;
}

#Content ul, #Content ol
{
    margin: 5px 0 0 35px;
}

#Content ul
{
    margin-left: 15px;
    list-style: none;
}

#Content li
{
    margin: 10px 0 0 0;
    font-size: 1.3em;
    color: #696969;
    line-height: 1.6em;
}

#Content li li
{
    font-size: 1em;
}

#Content ul li
{
    padding: 0 0 0 15px;
    background: url('/images/icons/bullet.png') no-repeat 0 0.6em;
}

#Content ol.Central li
{
    margin-right: 200px;
}

#Content p a, #Content li a
{
    border: solid #A6D75F;
    border-width: 0 0 1px 0;
    color: #519332;
    text-decoration: none;
}

#Content p a:hover, #Content li a:hover
{
    border-color: #89BD4A;
}

/* ------ Case Study Browser ------ */

#Content .Browser-Wrapper
{
    float: right;
    display: inline;
    width: 360px;
    margin: 0 0 0 65px;
}

#Content .Browser-Wrapper .Instruction
{
    display: block;
    font-size: 1.1em;
    color: #CCC;
}

#Content .Browser-Wrapper .Browser
{
    float: left;
    display: inline;
    width: 360px;
    margin: 7px 0 0 0;
    padding: 0 0 5px 0;
    background: #E4F3CD;
}

#Content .Browser-Wrapper .Browser .Panels
{
    float: left;
    display: inline;
    width: 348px;
    height: 251px;
    margin: 5px 0 0 5px;
    border: solid 1px #BEE18A;
    background: #FFF;
    overflow: hidden;
}

#Content .Browser-Wrapper .Show-3 .Panels
{
    height: 188px;
}

#Content .Browser-Wrapper .Browser ul
{
    float: left;
    display: inline;
    width: 348px;
    margin: 0;
    background: #FFF;
    list-style: none;
}

#Content .Browser-Wrapper .Browser ul li
{
    margin: 0;
    padding: 0 0 2px 0;
    border: solid #D9EDBA;
    border-width: 0 0 1px 0;
    background: none;
    font-size: 1em;
}

#Content .Browser-Wrapper .Browser ul li, 
#Content .Browser-Wrapper .Browser ul li a
{
    float: left;
    display: inline;
    width: 348px;
}

#Content .Browser-Wrapper .Browser ul li a
{
    border: none;
}

#Content .Browser-Wrapper .Browser ul li a:hover
{
    background: #F0F8E4;
}

#Content .Browser-Wrapper .Browser ul li.Last
{
    padding-bottom: 0;
    border: none;
}

#Content .Browser-Wrapper .Browser ul li img
{
    float: left;
    display: inline;
    margin: 2px 10px 0 2px;
    border: none;
}

#Content .Browser-Wrapper .Browser ul li strong
{
    display: block;
    margin: 5px 0 0 0;
    font-size: 1.3em;
    color: #89BD4A;
}

#Content .Browser-Wrapper .Browser ul li small
{
    display: block;
    margin: 3px 0 0 0;
    font-size: 1.1em;
    color: #999;
}

#Content .Browser-Wrapper .Nav
{
    float: right;
    display: inline;
}

#Content .Browser-Wrapper .Nav a
{
    float: left;
    display: inline;
    width: 33px;
    height: 30px;
    text-indent: -9000px;
    overflow: hidden;
    background: no-repeat 0 0;
}

#Content .Browser-Wrapper .Nav .Nav-Left
{
    background-image: url('/images/backgrounds/browser-left.png');
}

#Content .Browser-Wrapper .Nav .Nav-Right
{
    background-image: url('/images/backgrounds/browser-right.png');
}

#Outer-Content #Content .Browser-Wrapper .Nav a:hover
{
    background-position: 0 -30px;
}

/* ------ Entries ------ */

#Content #Entry
{
    float: left;
    display: inline;
    width: 490px;
}

#Outer-Content #Content div.Gallery
{
    width: 493px;
}

#Content #Entry h3
{
    float: left;
    display: inline;
    padding: 5px 7px;
    border: none;
    background: #8CC932;
    color: #FFF;
}

#Content #Entry .Date
{
    float: left;
    display: inline;
    padding: 5px 7px;
    background: #ECF7D7;
    color: #87B627;
    font-size: 1.1em;
    text-align: right;
}

#Content #Entry .Promo-Article
{
    float: left;
    display: inline;
    margin: 15px 12px 0 0;
    padding: 5px;
    background: #E7F4CC;
}

#Content #Entry .Promo-Article img
{
    padding: 1px;
    border: solid 1px #B1DC5B;
    background: #FFF;
}

#Content #Entries
{
    float: right;
    display: inline;
    width: 265px;
    margin: 70px 0 0 0;
    padding: 0 0 20px 25px;
    border: solid #E4E4E4;
    border-width: 0 0 0 1px;
}

#Outer-Content #Content .Caption
{
    margin-top: 92px;
}

#Content #Entries h3
{
    border: none;
}

#Content #Entries ol
{
    margin: 0;
    list-style: none;
}

#Content #Entries ol li
{
    margin: 15px 0 0 0;
    padding: 0;
    background: none;
    font-size: 1.2em;
    color: #858585;
}

#Content #Entries ol li .Author
{
    float: left;
    display: inline;
    width: 40px;
    margin: 0 10px 0 0;
}

#Content #Entries ol li .Author img
{
    padding: 1px;
    border: solid 1px #CDE692;
}

#Content #Entries ol li .Body
{
    float: left;
    display: inline;
    width: 200px;
}

#Content #Entries ol li .Body strong
{
    display: block;
    margin: 2px 0 0 0;
    font-weight: normal;
}

#Content #Entries ol li .Body small
{
    display: block;
    margin: 5px 0 0 0;
    font-size: 0.9em;
    line-height: 1.4em;
}

#Content #Entries ol li .Body em
{
    display: block;
    margin: 5px 0 0 0;
    font-size: 0.8em;
    font-style: normal;
}

#Content #Entries ol li .Body em a
{
    padding: 2px 5px;
    border: none;
    background: #EFEFEF;
    color: #B1B1B1;
    text-decoration: none;
}

#Content #Entries ol li .Body em a:hover
{
    color: #787878;
}

/* ------ Player ------ */

#Content .Player-Wrapper
{
	margin: 20px 0 0 0;
	padding: 8px;
	background: #F4F4F4;
}

#Content .Player-Wrapper .Player
{
    border: solid 1px #FFF;
    background: #FFF;
}

#Content .Player-Wrapper .Player p
{
    margin: 0;
    padding: 10px;
    font-size: 1.1em;
}


/* ------ Footnote ------ */

#Content .Footnote
{
    margin: 20px 0 0 0;
    border: solid #CCC;
    border-width: 1px 0 0 0;
}

#Content .Footnote p
{
    margin-top: 5px;
    font-size: 1em;
    color: #999;
}

/* ------ Buttons ------ */

#Content .ButtonWrapper .Button
{
	float: left;
	display: inline;
	background: no-repeat right 0;
	font-size: 1.2em;
	color: #3E7416;
	font-weight: bold;
	text-decoration: none;
	cursor: pointer;
}

#Content .ButtonWrapper .SmallButton
{
	font-size: 1.1em;
}

#Content .ButtonWrapper .Button span
{
	display: block;
	margin: 0 2px 0 0;
	padding: 7px 10px 6px 28px;
	background: no-repeat 0 0;
}

#Content .ButtonWrapper .Button:hover
{
	background-position: right -28px;
}

#Content .ButtonWrapper .Button:hover span
{
	background-position: 0 -28px;
}

#Content .ButtonWrapper .Button:active
{
	background-position: right -56px;
}

#Content .ButtonWrapper .Button:active span 
{
	padding: 8px 9px 5px 29px;
	background-position: 0 -56px;
}

#Content .ButtonWrapper .SmallButton span
{
	padding: 7px 8px 7px 10px;
	font-weight: normal;
}

#Content .ButtonWrapper .SmallButton:active
{
	background-position: right -56px;
	color: #3E7416;
}

#Content .ButtonWrapper .SmallButton:active span
{
	padding: 8px 8px 6px 10px;
}

#Content .ButtonWrapper .Add
{
	background-image: url('../images/buttons/add-end.png');
}

#Content .ButtonWrapper .Add span
{
	background-image: url('../images/buttons/add.png');
}

#Content .ButtonWrapper .Confirm
{
	background-image: url('../images/buttons/confirm-end.png');
}

#Content .ButtonWrapper .Confirm span
{
	background-image: url('../images/buttons/confirm.png');
}

#Content .ButtonWrapper .Go
{
	background-image: url('../images/buttons/smallbutton-green-end.png');
}

#Content .ButtonWrapper .Go span
{
	background-image: url('../images/buttons/smallbutton-green.png');
}

#Content .ButtonWrapper .Stop
{
	background-image: url('../images/buttons/smallbutton-red-end.png');
}

#Content .ButtonWrapper .Stop span
{
	background-image: url('../images/buttons/smallbutton-red.png');
	color: #D95D5D;
}

#Content .ButtonWrapper .Stop:hover span, 
#Content .ButtonWrapper .Stop:active span
{
	color: #D95D5D;
}

/* ------ Image Gallery ------ */

#Content ul.Gallery
{
    margin: 20px 0 0 0;
    padding: 0;
    background: #E4E4E4;
    list-style: none;
}

#Content ul.Gallery li, 
#Content ul.Gallery li a, 
#Content ul.Gallery li a img
{
    float: left;
    display: inline;
}

#Content ul.Gallery li
{
    margin: 10px 0 0 10px;
    padding: 0;
    background: none;
}

#Content ul.Gallery li a
{
    margin: 0;
    padding: 0;
    border: solid 3px #FFF;
}

#Content ul.Gallery li img
{
    border: none;
}


/* Footer
--------------------------------------------------------------------------------------- */

#Outer-Footer
{
	background: url('/images/backgrounds/footer.png') repeat-x top;
}

#Footer
{
	padding: 55px 0 40px 0;
	background: url('/images/logos/firehoop-footer.png') no-repeat right 43px;
}

#Footer hr
{
	display: none;
}

#Footer .Info
{
	font-size: 1.1em;
	color: #999;
}

#Footer .Info .Links
{
    padding-left: 10px;
}

#Footer .Info .Links span
{
    display: none;
}

#Footer .Info .Links a
{
    padding: 0 5px 0 5px;
    color: #787878;
    text-decoration: none;
}

#Footer .Info .Links a:hover
{
    color: #999;
}