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

PetPawlitics StyleSheet

--  Stone Flow, Inc.
Created: 5/12/2008

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


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

Basic HTML Styles

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

body 
{
    background-color: #9c9771;
    font-size: 12px;
    font-family: "trebuchet ms", arial, sans-serif, tahoma;
    color: #333;
    line-height: 18px;
    text-align: center;
}

p
{
    margin-bottom: 0px;
    text-align: left;
    width: 266px;
    max-width: 320px;
    margin-top: 0px;
}

a
{
    color: #FFF;
    text-decoration: none;
}

a:hover
{
    text-decoration: underline;
}

img
{
    border-style: none;
    border-color: inherit;
    border-width: 0;
    text-align: center;
}

img.top
{
    padding-top: 15px;
}

ol 
{
    font-weight: bold;
}

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

Containers and Wrappers

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

#outer
{
    position: relative;
    width: 800px;
    margin: 0 auto;
    top: -15px;
    background: #9c9771 url('../SiteAssets/BG_Top_800x95_5.jpg') no-repeat; 
    text-align: center;
    left: 0px;
}

.navwrapper /* The whole upper nav section */
{
    width: 800px;
    height: 55px;
}

.navhome /* The part on the left where the logo is */
{
    line-height: 50px;
    height: 50px;
    width: 250px;
    float: left;
}

.nav2 /* The part on the right where the links are */
{
    padding: 25px 0px 0px 0px;
    width: 495px;
    float: right;
    font-size: 14px;
    font-weight: bold;
    text-align: left;
    z-index: 10000;
    _padding: 20px 0px 0px 0px;
}

#content /* The main container that holds everything between the header and the footer */
{
    position: relative;
    width: 730px;
    padding: 0px 30px 13px 40px;
    top: 40px;
    _top: 0px; /* IE 6 top */
    background: #FFF url('../SiteAssets/BG_Main_800x2.jpg') repeat-y;
    text-align: center;
    min-height: 350px;
    left: 0px;
}

#content a
{
    color: #ff7800;
}

#content a.white
{
    color: #fff;
}


#content h5
{
    font-size: 14px;
    color: #002A54;
}

#content .upper /* assigned to the upper column divs to put the dashed line at the bottom */
{
    border-bottom: dashed 1px #CCC;
}

#content .lower /* assigned to the bottom column div to give it a little breathing room */
{
    margin: 13px 0px 13px 0px;
}

#content .tease /* assigned to the teaser div to give it a little breathing room */
{
    padding-bottom: 10px;
    border-bottom: dashed 1px #CCC;
}

#content .content1-col /* for a page section that is the entire width of the content div */ 
{
    width: 100%;
    text-align: center;
}

#content .content1-col-polls /* for a page section that is the entire width of the content div */ 
{
    position: relative;
    top: 55px;
    #top: 0px;
    width: 50%;
    text-align: left;
    background-color: #9c9771;
    margin: 0 auto;
    margin-bottom: 50px;
}

#content .content1-col-polls input
{
    height: 25px;
}

#content .content1-col-vote /* for a page section that is the entire width of the content div */ 
{
    width: 100%;
    _width: 700px;
    text-align: left;
    _padding-left: 20px;
}

#content .content1-col-Preem /* for a page section that is the entire width of the content div */ 
{
    width: 100%;
    _width: 700px;
    text-align: left;
    background-image: url('../ProfileAssets/Preem_BG2.jpg');
    background-repeat: no-repeat;
    min-height: 350px;
    padding-left: 20px;
}

#content .content1-col-Preem .text /* for a page section that is the entire width of the content div */ 
{
    position: absolute;
    width: 400px;
    top: 250px;
}

#content .content1-col-Preem .button /* for a page section that is the entire width of the content div */ 
{
    position: absolute;
    top: 150px;
    left: 225px;
}

#content .content1-col-Preem2 /* for a page section that is the entire width of the content div */ 
{
    width: 100%;
    _width: 700px;
    text-align: left;
    background-image: url('../ProfileAssets/Preem_BG.jpg');
    background-repeat: no-repeat;
    min-height: 350px;
    padding-left: 20px;
}

#content .content1-col-Preem2 .text /* for a page section that is the entire width of the content div */ 
{
    position: absolute;
    width: 400px;
    top: 250px;
}

#content .content1-col-Preem2 .button /* for a page section that is the entire width of the content div */ 
{
    position: absolute;
    top: 150px;
    left: 225px;
}


#content .content1-col-Tigger /* for a page section that is the entire width of the content div */ 
{
    width: 100%;
    _width: 700px;
    text-align: left;
    background-image: url('../ProfileAssets/Tigger_BG.jpg');
    background-repeat: no-repeat;
    min-height: 350px;
    padding-left: 20px;
}

#content .content1-col-USresults /* for a page section that is the entire width of the content div */ 
{
    position: relative;
    width: 100%;
    _width: 700px;
    text-align: right;
    background-image: url('../StandingsAssets/US_Standings_BG.jpg');
    background-repeat: no-repeat;
    background-position: top center;
    min-height: 250px;
    padding-left: 20px;
    _height: 250px;
}

#content .content1-col-USresults .map /* for a page section that is the entire width of the content div */ 
{
    position: relative;
    top: 35px;
    margin-right: 100px;
}

#content .content1-col-USresults2 /* for a page section that is the entire width of the content div */ 
{
    position: relative;
    width: 100%;
    _width: 700px;
    text-align: right;
    background-image: url('../StandingsAssets/US_Standings_BG_6-30-08.jpg');
    background-repeat: no-repeat;
    background-position: top center;
    height: 300px;
    padding-left: 20px;
}

#content .content1-col-USresults2 .map /* for a page section that is the entire width of the content div */ 
{
    position: relative;
    top: 35px;
    _margin-top: 35px;
    margin-right: 100px;
}


#content .content1-col-DetailedStats /* for a page section that is the entire width of the content div */ 
{
    position: relative;
    width: 100%;
    _width: 700px;
    text-align: center;
    background-image: url('../StandingsAssets/DetailedStats_BG.jpg');
    background-repeat: no-repeat;
    background-position: top center;
    min-height: 325px;
    padding-left: 20px;
    _height: 325px;
}

#content .content1-col-DetailedStats .Details /* for a page section that is the entire width of the content div */ 
{
    position: relative;
    top: 75px;
}

#content .content1-col-Tigger .text /* for a page section that is the entire width of the content div */ 
{
    position: absolute;
    width: 400px;
    top: 250px;
}

#content .content1-col-Tigger a /* for a page section that is the entire width of the content div */ 
{
    color: #990D0D;
}

#content .content1-col-Tigger .button /* for a page section that is the entire width of the content div */ 
{
    position: absolute;
    top: 150px;
    left: 225px;
}

#content .content2-col /* for a page section that is 2 columns, the entire width of the content div */
{
    width: 100%;
    margin: 5px 0px 13px 0px;
    padding: 0px;
    overflow: hidden;
    text-align: center;
}

#content .content2-col .left /* the left half of a 2 column section with orange background */
{
    width: 49%;
    min-height: 250px;
    float: left;
    text-align: right;
    border: 0;
    padding: 13px 0px 13px 0px;
    background: #FFF url('../SiteAssets/Orange_BG.jpg') no-repeat;
}

#content .content2-col .leftVote /* the left half of a 2 column section with orange background on vote page */
{
    width: 350px;
    min-height: 125px;
    float: left;
    text-align: left;
    border: 0;
    padding: 13px 0px 13px 15px;
    background: #FFF url('../VoteAssets/Orange_BG_short.jpg') no-repeat;
}

#content .content2-col .leftResults /* the left half of a 2 column section with orange background on vote page */
{
    width: 350px;
    height: 225px;
    float: left;
    text-align: center;
    border: 0;
    padding: 13px 0px 13px 15px;
    background: #FFF url('../StandingsAssets/VoteDog_BG.png') no-repeat;
}

#content .content2-col .leftResults .stuff /* the left half of a 2 column section with orange background on vote page */
{
    position: relative;
    left: 140px;
    top: 15px;
    text-align: left;
}

#content .content2-col .left .first /* If you need to subsect the left side.  example: home page - the section with Preem's photo/title */
{
    float: left;
    width: 33%;
    min-height: 144px;
    padding: 0px 5px 0px 0px;
    line-height: 18px;
    text-align: left;
    height: 186px;
}

#content .content2-col .left .second /* If you need to subsect the left side.  example: home page - the section with Top 6 Dogs logo */
{
    float: right;
    width: 56%;
    min-height: 144px;
    padding: 0px 15px 0px 0px;
    _padding: 0px 10px 0px 0px; /* IE 6 padding */
}

#content .content2-col .right /* the right half of a 2 column section with red background */
{
    width: 49%;
    min-height: 250px;
    float: right;
    text-align: left;
    border: 0;
    padding: 13px 0px 13px 0px;
    background: #FFF url('../SiteAssets/Red_BG.jpg') no-repeat;
}

#content .content2-col .rightVote /* the right half of a 2 column section with red background */
{
    width: 350px;
    min-height: 125px;
    float: left;
    text-align: left;
    border: 0;
    padding: 97px 0px 13px 15px;
    background: #FFF url('../VoteAssets/Red_BG_short.jpg') no-repeat;
}

#content .content2-col .rightResults /* the right half of a 2 column section with red background */
{
    width: 350px;
    min-height: 225px;
    float: left;
    text-align: center;
    border: 0;
    padding: 97px 0px 13px 15px;
    background: #FFF url('../StandingsAssets/VoteCat_BG.png') no-repeat;
}

#content .content2-col .rightResults .stuff /* the left half of a 2 column section with orange background on vote page */
{
    position: relative;
    left: 70px;
    top: -70px;
    text-align: left;
}

#content .content2-col .right .first /* If you need to subsect the right side.  example: home page - the section with Top 6 Cats logo */
{
    float: left;
    width: 57%;
    min-height: 144px;
    padding: 0px 0px 0px 10px;
}

#content .content2-col .right .second /* If you need to subsect the right side.  example: home page - the section with Tigger's photo/title */
{
    float: right;
    width: 34%;
    height: 186px;
    padding: 0px 0px 0px 0px;
    line-height: 18px;
    text-align: right;
    margin-left: 0px;
    margin-right: 0px;
}

#content .content2-col .leftsub /* Left side of a 2 column section with tan background */ 
{
    width: 50%;
    height: 203px;
    float: left;
    text-align: center;
    padding: 15px 0 0 0;
    background: #FFF url('../SiteAssets/tan_BG.jpg') no-repeat;
}

#content .content2-col .leftsublower /* Left side of a 2 column section with tan background */ 
{
    border-top: dashed 1px #CCC;
    width: 94%;
    height: 96px;
    float: left;
    text-align: center;
    padding: 15px 0 0 0;
    margin-right: 10px;
    padding-left: 10px;
}

#content .content2-col .leftsub input
{
    height: 22px;
}

#content .content2-col .ppleft input
{
    height: 22px;
}

#content .content1-col input
{
    height: 22px;
}

#content .content2-col .rightsub /* Only used for the Results section on the home page */
{
    width: 49%;
    height: 206px;
    float: right;
    text-align: left;
    border: 0;
    padding: 13px 0px 13px 0px;
    font-size: 11px;
    color: #FFF;
    background: #FFF url('../SiteAssets/Results.jpg') no-repeat;
}

#content .content2-col .pp /* for a page section that is 2 columns, the entire width of the content div */
{
    width: 100%;
    margin: 5px 0px 13px 0px;
    padding: 0px;
    overflow: hidden;
    text-align: center;
}

#content .content2-col .ppleft /* Left side of Pet-Polls Upper Div */ 
{
    border-right: dashed 1px #CCC;
    width: 41%;
    height: 350px;
    float: left;
    text-align: center;
    padding: 0px 30px 0 15px;
    /*background: #FFF url('../SiteAssets/tan_BG.jpg') no-repeat;*/
}

#content .content2-col .ppright /* Right side of Pet-Polls Uppder Div */
{
    border-style: none;
    border-color: inherit;
    border-width: 0;
    width: 50%;
    height: 350px;
    float: right;
    text-align: center;
    padding: 0px 0px 13px 5px;
    background-repeat: no-repeat;
    margin-left: 0px;
}

.date /* This div holds the countdown date script on the home page */
{
    position: relative;
    width: 205px;
    top: 110px;
    left: 50px;
}

#content .content3-col /* for a page section that is 3 columns, the entire width of the content div */
{
    width: 100%;
    margin: 0px 0px 13px 0px;
    border-bottom: dashed 1px #CCC;
    overflow: hidden;
    height:100%
}

#content .content3-col .left /* the left part of a 3 column section */
{
    width: 32%;
    float: left;
    text-align: justify;
    border: 0;
    margin: 0px 20px 0px 0px;
}

#content .content3-col .mid /* the middle part of a 3 column section */
{
    width: 30%;
    float: left;
    text-align: justify;
    border: 0;
    margin: 0px 20px 0px 0px;
}

#content .content3-col .right /* the right part of a 3 column section */
{
    width: 32%;
    float: right;
    text-align: justify;
    border: 0;
}

#content .media /* this is the main container for a FurrUm page.  Sits inside of the content div. */
{
    width: 740px;
    height: 444px;
    background: #FFF url('../FurrUmAssets/BG/Main_BG_740x444.jpg') no-repeat;
    margin-left: -7px; /* FF and IE 7 margin */
    _margin-right: -7px; /* IE 6 margin */
    padding: 0px 0px 35px 0px;
}

#content .media a
{
    color: #fff;
}

#content .media .mediamenu /* this is the menu section of a FurrUm page. */
{
    position: relative;
    top: 14px;
    left: 7px;
    width: 175px;
    height: 420px;
    float: left;
    overflow: auto;
    text-align: left;
    color: #fff;
    padding-left: 5px;
}

#content .media .menuitem /* this positions a menu item */ 
{
    padding: 4px;
    margin-top: 10px;
}

#content .media .active /* This is a placeholder for the actively playing state in the menu */
{
    background-color: Silver;
}

#content .media .mediamenu .thumb /* This gives the thumbnail images a little breathing room */
{
    padding: 0px 0px 0px 0px; /* was 0px 0px 10px 0px */
}

#content .media .mediamenu .title /* text style for menu item title */
{
    font-size: 11px;
    line-height: 10px;
}

#content .media .mediamenu .sub /* text style for menu item subtitle */
{
    font-size: 9px;
    font-weight: bold;
    color: #002140;
}

#content .media .mediacontent /* This is the box on the right where the media displays */
{
    position: relative;
    top: 13px;
    left: 14px;
    width: 515px;
    height: 421px;
    float: left;
    overflow: auto;
    text-align: left;
    color: #333;
    padding: 0px 0px 0px 20px;
}

#content .media .mediacontent-inside-scoop /* This is the box on the right where the media displays */
{
    position: relative;
    background-image: url("assets\FurrUmAssets\BG\InsideScoop_BG.jpg");
    top: 12px;
    left: 14px;
    width: 515px;
    height: 401px;
    float: left;
    overflow: auto;
    text-align: left;
    color: #333;
    padding: 20px 0px 0px 20px;
}

#content .media .mediacontent .header /* The title text in the media display section */
{
    font-size: 21px;
    font-weight: normal;
    line-height: 30px;
    color: #01213F;
}

#content .media .mediacontent .subheader /* Subheader in the media display section */
{
    font-size: 12px;
    font-weight: bold;
    color: #01213F;
}

.video
{
    margin-left: 45px;
    }
    
#content .content60-40 /* for a page section that is 2 columns, with a 60/40 split */
{
    width: 100%;
    margin: 0px 0px 13px 0px;
    padding: 0px;
    overflow: hidden;
    text-align: center;
}

#content .content60-40 .content60 /* the left half of a 2 column section with orange background */
{
    border-style: none;
    border-color: inherit;
    border-width: 0;
    width: 57%;
    min-height: 250px;
    float: left;
    text-align: left;
    padding: 0px 0px 0px 0px;
    margin: 0 13px 0 13px;
}

#content .content60-40 .content60 p
{
    padding-bottom: 13px;
    width: 100%;
    #width: 90%;
    text-align: justify;
}

#content .content60-40 .content60 .visit /* the left half of a 2 column section with orange background */
{
    width: 350px;
    height: 80px;
    text-align: center;
    background-image: url(assets/AboutAssets/VisitHWAC_big_bg.jpg);
    font-size: 2em;
    line-height: 80px;
}

#content .content60-40 .content60 .visit a /* the left half of a 2 column section with orange background */
{
    color: #fff;
}

#content .content60-40 .content40 /* the right half of a 2 column section with red background */
{
    width: 37%;
    min-height: 250px;
    float: right;
    text-align: left;
    border: 0;
    padding: 0px 0px 0px 0px;
    position: absolute;
    top: 0px;
    left: 490px;
}

.photo
{
    background-color: #9A956D;
    width: 236px;
    padding: 8px;
    text-align: center;
}

.photo2
{
    background-color: #9A956D;
    width: 236px;
    padding: 15px 7px 15px 7px;
    text-align: center;
}

.bluebg
{
    background-color: #004081;
    color: #fff;
    height: 295px;
    width: 252px;
    margin-bottom: 2px;
}

.bluebgtall
{
    background-color: #004081;
    color: #fff;
    height: 305px;
    width: 252px;
    margin-bottom: 2px;
}

.bluebg .pic
{   
    padding-left: 20px;
    float: left;
}

.bluebg .petinfo
{
    padding-left: 10px;
    float: left;
}

.bluebg .header
{   
    font-size: 30px;
    line-height: 32px;
}


.photogallery
{
    float: right;
    text-align: left;
    width: 350px;
    margin: 35px 0px 0px 0px;
    min-height: 350px;
}

.photogallery td
{
    background-color: #9A956D;
    padding: 3px;
    width: 85px;
    height: 63px;
    text-align: center;
}

.bluebgtall td
{
    background-color: #FFF;
    padding: 3px;
    width: 85px;
    height: 63px;
    text-align: center;
}

#clock
{
    background-image: url("assets/StandingsAssets/Clock_BG.png");
    width: 200px;
    }

#bottom /* positions all the crap below the main content sections */
{
    position: relative;
    width: 800px;
    bottom: 0px;
    text-align: center;
    margin: 5px 12px 0px 15px; /* FF margin */
    #margin: 5px 12px 0px 4px; /* IE margin */
    _margin: 0px 12px 0px 4px;
    left: 0px;
}

#inner-footer /* This is the blue footer area */
{
    position: relative;
    background-color: #2e4a5f;
    color: #FFF;
    line-height: 50px;
    font-size: 15px;
    text-align: center;
    width: 777px;
}

#inner-footer .HWAC /* Just because classes are fun */
{
    font-size: 17px;
}

#outer-footer /* This is the footer below the blue area */
{
    color: #FFF;
    line-height: 15px;
    font-size: 12px;
    text-align: center;
    padding: 15px 0px 0px 45px; /* FF Padding */
    #padding: 15px 0px 0px 0px; /* IE Padding */
    width: 86%;
    height: 66px;
}

#outer-footer .small /* The small disclaimer text at the bottom */
{
    color: #FFF;
    line-height: 10px;
    font-size: 9px;
}

/* Form Fields for Voting Page */
#tbCatVotes
{
    width: 20px;
}

#tbDogVotes
{
    width: 20px;
}

input
{
    font-size: 12px;
    font-family: "trebuchet ms", arial, sans-serif, tahoma;
    color: #333;
    line-height: 13px;
    height: 13px;
}

select
{
    font-size: 12px;
    font-family: "trebuchet ms", arial, sans-serif, tahoma;
    color: #333;
    line-height: 13px;
    height: 20px;
}

#dlStateVotes
{
    width: 100%;
    border: 0;
    font-weight: bold;
}


#dlStateVotes h3
{
    color: #00284f;
}


#dlStateVotes td {
	padding: 3px 3px 3px 3px;
	color: #666;
	margin: 0px;
}

#dlStateVotes .US_Header
{
    font-weight: bold;
    color: #fff;
}

#dlStateVotes .darkorange
{
    background-color: #d7582b;
    color: #fff;
}

#dlStateVotes .darkred
{
    background-color: #990000;
    color: #fff;
}

#dlStateVotes .lightorange
{
    background-color: #f7ded5;
    color: #666;
}

#dlStateVotes .lightred
{
    background-color: #ebcccc;
    color: #666;
}


#dlStateVotes .darkgray
{
    background-color: #5c768f;
    color: #fff;
}

#dlStateVotes .column1
{
    width: 33%;
}

#dlStateVotes .right-border
{
    border-right: solid 2px #e6eaef;
}


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

#dlCountryVotes
{
    width: 100%;
    border: 0;
    font-weight: bold;
}


#dlCountryVotes h3
{
    color: #00284f;
}


#dlCountryVotes td {
	padding: 3px 3px 3px 3px;
	color: #666;
	margin: 0px;
}

#dlCountryVotes .US_Header
{
    font-weight: bold;
    color: #fff;
}

#dlCountryVotes .darkorange
{
    background-color: #d7582b;
    color: #fff;
}

#dlCountryVotes .darkred
{
    background-color: #990000;
    color: #fff;
}

#dlCountryVotes .lightorange
{
    background-color: #f7ded5;
    color: #666;
}

#dlCountryVotes .lightred
{
    background-color: #ebcccc;
    color: #666;
}


#dlCountryVotes .darkgray
{
    background-color: #5c768f;
    color: #fff;
}

#dlCountryVotes .column1
{
    width: 33%;
}

#dlCountryVotes .right-border
{
    border-right: solid 2px #e6eaef;
}