/* proprietes du corps du text */
body {
        background: url(images/bgd-wrapper-right.jpg) top left; 
        font-family: Arial, Verdana, Sans-serif; font-size: 12pt; color: #FFFFFF;
							scrollbar-face-color: #30375C;
							scrollbar-highlight-color: #5462A0;
							scrollbar-shadow-color: #000000;
							scrollbar-3dlight-color: #474747;
							scrollbar-arrow-color: #000000;
							scrollbar-track-color: #000000;
							scrollbar-darkshadow-color: #000000;
}
body {behavior: url(csshover.htc);}

i{font-size: 10pt;}
b{text-transform: uppercase; font-family: Verdana, Arial, Serif; font-weight: 600; color: #F79A46; text-align: left; font-size: 10pt;}

/* text box for search or feedback */          
input {color:#F2EFEC; font-weight: 600; text-align: left; font-size: 11pt; font-style: italic; background-color:#1A1827; border-left: 1px solid #8C9CBB; border-right: 1px solid #442950; border-top: 1px solid #8080C0; border-bottom: 1px solid #442950;} /* submit buttons Text, background and borders */ 
input.radio {color:#A0C6FE; background-color:#000000; border-left: 0px; border-right: 0px; border-top: 0px; border-bottom: 0px;} /* submit radio buttons */ 
select {color:#A0C6FE; font-size: 12pt; background-color:#1A1827; border-left: 1px solid #FFFFFF; border-right: 1px solid #442950; border-top: 1px solid #FFFFFF; border-bottom: 1px solid #442950;} /* select option in scroll down menus Text, background and borders */ 
textarea {color:#F2EFEC; font-weight: 600; text-align: left; font-size: 11pt; font-style: italic; background-color:#1A1827;} 


/* proprietes des liens */
a {text-decoration: none; color:#A6A6FF;}
a:hover {text-decoration: none; color:#FF8080;}
a:visited {text-decoration: none; color:#FFBC9B; }

.headermenu{ font-weight: 600; text-align: left; font-size: 11pt; font-style: none; }
.headermenu a {text-decoration: none; color:#F2EFEC; font-style: italic;}
.headermenu a:hover {color:#FFBC9B; font-style: none;}

.popmenu{ text-transform: uppercase; font-weight: 800; text-align: left; font-size: 11pt; color: #FFFFFF; font-style: italic; }
.popmenu a {text-decoration: none; color:#FFFFFF;}
.popmenu a:hover {color:#FF0080; font-style: italic;}
.popmenu a:visited {text-decoration: none; color:#FFFFFF; font-style: none;}

/* menu background position for the different buttons in the header*/
                                                                                                        /* menu background position        size of the showing window  position of the window */
#navigation-trashzen a { position: absolute; text-indent: -9999px; background: transparent url(images/bgd-nav-menu.jpg) no-repeat 0px 0px; width: 270px; height: 116px; top: 0px; left: 0px; }
#navigation-trashzen a:hover { background: transparent url(images/bgd-nav-menu.jpg) no-repeat 0px -118px; }
#navigation-trashzen-logo a { position: absolute; text-indent: -9999px; background: transparent url(images/bgd-nav-logo.png) no-repeat 0px 0px; width: 270px; height: 117px; top: 0px; left: 0px; }
#navigation-trashzen-logo a:hover { background: transparent url(images/bgd-nav-logo.png) no-repeat 0px -118px; }
#navigation-trialstutorial a { position: absolute; text-indent: -9999px; background: transparent url(images/bgd-nav-trialstutorial.jpg) no-repeat 0px 0px; width: 166px; height: 115px; top: 21px; left: 559px; }
#navigation-trialstutorial a:hover { background: transparent url(images/bgd-nav-trialstutorial.jpg) no-repeat 0px -115px; }
#navigation-trash a { position: absolute; text-indent: -9999px; background: transparent url(images/bgd-nav-trash.jpg) no-repeat 1px 0px; width: 154px; height: 114px; top: 156px; left: 383px; }
#navigation-trash a:hover { background: transparent url(images/bgd-nav-trash.jpg) no-repeat 1px -115px; }
#navigation-videos a { position: absolute; text-indent: -9999px; background: transparent url(images/bgd-nav-videos.jpg) no-repeat 0px 0px; width: 207px; height: 93px; top: 123px; left: 14px; }
#navigation-videos a:hover { background: transparent url(images/bgd-nav-videos.jpg) no-repeat 0px -93px; }
#navigation-rondelle a { position: absolute; text-indent: -9999px; background: transparent url(images/bgd-nav-rond.jpg) no-repeat 0px 0px; width: 78px; height: 70px; top: 170px; left: 803px; }
#navigation-rondelle a:hover { background: transparent url(images/bgd-nav-rond.jpg) no-repeat 0px -70px; }
#navigation-freewheel a { position: absolute; text-indent: -9999px; background: transparent url(images/bgd-nav-freewheel.jpg) no-repeat 0px 0px; width: 215px; height: 123px; top: 27px; left: 278px; }
#navigation-freewheel a:hover { background: transparent url(images/bgd-nav-freewheel.jpg) no-repeat 0px -123px; }
#navigation-pedals a { position: absolute; text-indent: -9999px; background: transparent url(images/bgd-nav-pedals.jpg) no-repeat 0px -1px; width: 246px; height: 244px; top: 244px; left: 653px; }
#navigation-pedals a:hover { background: transparent url(images/bgd-nav-pedals.jpg) no-repeat 0px -246px; }

a#leftmenu-tshirt {display: block; height: 340px; width: 125px; background-image: url(images/banner-css-left-bottom120a.gif); 
background-position: 0px 0px;} 
a#leftmenu-tshirt:hover {background-position: 125px 0px;}

a#menu-reflective {display: block; height: 406px; width: 420px; background-image: url(images/trashzen-tshirt-reflective-spotlight.jpg); 
background-position: 0px 0px;} 
a#menu-reflective:hover {background-position: 420px 0px;}

/* proprietes des images */
img {border: 0px; padding:2px 2px 2px 2px;}
img.contour {
border-left: 1px solid #0000A0;
border-right: 1px solid #0000A0;
border-top: 1px solid #7979FF;
border-bottom: 1px solid #000040;
}
span {font-family: Arial, Verdana, Serif; font-weight: 600; text-align: left;} /* change text attributes over selected text */ 
        
.video {
        font-size: 10pt; font-style: italic; font-weight: 400; color: #D6ECFE;
	    padding-top:5px; padding-right:10px; padding-left:5px; padding-bottom:10px;
        border-left: 1px solid #C1C1FF; border-right: 1px solid #0000A0;
        border-top: 1px solid #7979FF; border-bottom: 1px solid #000059;
        }
         
.disclaimer {font-family: Arial, Serif; font-weight: 600; font-size: 12px; color:#434732; text-align: center;}

.promo {font-weight: 400; font-size: 12px; color:#B39E62;} /* promo and copyright text in footer */ 

p { margin:5px 65px 3px 20px;}	 /* donne une marge gauche et droite aux paragraphes */ 
         
p.tutorialsteps {
        color:#F9B373; border-top:1px solid #FFBC9B;
		width: 700px;
        text-align: center;
        padding-top:5px; padding-bottom:5px; 
		}
        
p.onestep {
        color:#E8F3FF; border:0px solid #3C3C00;
        float: left;
		width: 210px;
		padding-right:4px;
        padding-bottom:4px;
        padding-left:2px;
        margin:0px 0px 0px 0px; 
        text-align: justify;
        background: url(images/bgd-p-onestep.png) no-repeat bottom center;
		}
                
p.image {
        float: left;
		width: auto;
        padding: 0px 2px 0px 2px;
        margin: 0px 0px 0px 0px;
		}   
        
p.rightimage {
        float: right;
		width: auto;
		padding: 0px 0px 4px 2px;
        margin: 0px 25px 0px 0px;
        text-align: center;
		}
        
p.leftimage {
        float: left;
		width: auto;
		padding: 0px 4px 2px 0px;
        margin: 0px 5px 0px 0px;
        text-align: center;
		}
        
p.centerimage {
        float: right;
        margin-right:70px;
		width: auto;
		padding: 0px -65px 2px 2px;
        text-align: center;
		}
       
        /* text box for other-video link */ 
p.video {
       	width: 600px;
        padding: 0px 0px 0px 0px;
        margin: 0px 0px 0px 90px;
        text-align: left;
        font-size: 10pt; font-style: italic; font-weight: 400; color: #D6ECFE;
        border-left: 0px solid #78674E; border-right: 0px solid #3D3427;
        border-top: 0px solid #594D39; border-bottom: 0px solid #221E15;
		}
        
p.news-scroll {
        width: 114px; height: 220px; overflow: auto; 
        margin: 10px 0px 0px 0px;
        padding: 5px 2px 0px 2px;
        border: 1px solid #969696; 
        background: #000000;
        font-size: 10pt; font-style: italic; font-weight: 400; color: #D6ECFE;
        } 
        	
/* en dessous la structure des pages definies par les blocs principaux */
			
        /* bloc tout en haut de page avec image du pedalier dans 0tzheader-and-leftcolumn*/
	#header {
        position: absolute; top:6px; left:0px;
        background: transparent url(images/bgd-header-fixe.jpg) no-repeat 0 0; width: 970px; height: 500px;
       	border:0px solid #8080C0;
		}
    
    #header-insertion {
        position: absolute; top:2px; left:215px;
		margin-top:0x;
        margin-right:0px;
		width:600px;
		border:0px solid #8080C0;
        text-align: center;
		}  
    
    #header-search {
        position: absolute; top:0px; left:709px;
		margin-top:0x;
        margin-right:0px;
		width:200px;
		border:0px solid #8080C0;
        text-align: center;
		}

          /* seulement pour les pages d'animation dans 0tzheaderanimation-and-leftcolumn*/
    #headeranimation {
        position: absolute; top:6px; left:0px;
        width: 970px; height: 300px;
       	border:0px solid #8080C0;
        background: url(images/bgd-header-animation.png) no-repeat 136px 85px;
		}
        
          /* seulement pour les pages de videos dans 0tzheadervideo-and-leftcolumn*/
    #headervideo {
        position: absolute; top:6px; left:0px;
        width: 970px; height: 300px;
       	border:0px solid #8080C0;
        background: url(images/bgd-header-video.png) no-repeat 166px 80px;
		}
                            
            /* colonne de gauche pour les boutons du menu */
    #leftmenu {
        position: absolute; top:200px; left:25px;
        width:125px;
        margin-top:0px;
		text-align: center;
        border:0px solid #FF0080;
		} 
          
    #leftcontent {
        position: absolute; top:506px; left:0px;
        width:136px;
        margin-top:0px;
        margin-left:-12px;
		text-align: center;
        border:0px solid #FF0080;
		}    
             
			/* colonne de droite pour les pubs adsense */
	#rightcontent {
        position: absolute; top:480px; left:840px;
        margin-right:0px;
        margin-top:0px;
		width:120px;
		border:0px solid #FF0080;
		background: transparent;
        text-align: center;
		}
    #rightcontentanimation {
        position: absolute; top:100px; left:840px;
        margin-right:0px;
        margin-top:0px;
		width:120px;
		border:0px solid #FF0080;
		background: transparent;
        text-align: center;
		}
		
		    /* decale la colonne pub pour la homepage plus etroite */ 
	#rightcontenthome {
		float: right;
        margin-left: -230px;
        margin-top:30px;
		width:120px;
		border:0px solid #FF0080;
		background: none;
        text-align: center;
		}          

        	/* colonne du milieu le contenu */
	#centercontent {
        position: absolute; top:280px; left:145px;
        width: 700px;
 		margin-top:-10px;
        margin-left:10px;
        text-align: justify;
        border:0px solid #FF0080;
		}
                       
        /* seulement pour les homepages fr et uk */
	#centercontenthome {
        position: absolute; top:280px; left:105px;
        width: 700px;
 		margin-top:-10px;
        margin-left:10px;
        text-align: justify;
        border:0px solid #FF0080;
		}          
        
	#centercontentnowhere {
        position: absolute; top:280px; left:105px;
        width: 820px;
 		margin-top:-10px;
        margin-left:10px;
        text-align: justify;
        border:0px solid #FF0080;
		}          

		 	/* seulement pour les pages videos */
    #centercontentvideo {
        position: absolute; top:240px; left:161px;
		background: url(images/bgd-centercontent-video.png) no-repeat -10px 35px;
		width:680px;
		border: 0px solid #800080;
        text-align: center;
        font-style: italic; font-size: 10pt;
		}
               
        	/* seulement pour les pages d'animation gif */
    #centercontentanimation {
		position: absolute; top:240px; left:161px;
        background: url(images/bgd-centercontent-animation.png) no-repeat 20px 0px;
		width:680px;
		border:0px solid #800080;
        text-align: center;
        font-style: italic; font-size: 10pt;
		}
    #specs {
        position: absolute; left:125px; top:280px;
		width:560px;
		border:1px solid #8080C0;
        text-align: left;
		}
    #hoverbox {
        position: absolute; left:660px; top:280px;
		width:120px;
		border:1px solid #8080C0;
        text-align: center;
		}
                	     /* bloc tout en bas de page avec la chaine */ 
	#footer {
        float: right;
        margin-right:70px;
        margin-top:20px;
        padding:0px 0px 0px 0px;
		background: url(images/bgd-footer-chain.jpg) no-repeat bottom;
		border:0px solid #8080C0;
        text-align: center; width: 560px;
		}     	    
        /* seulement pour les pages de rider profiles dans 0tzheaderprofile-and-leftcolumn*/

                     /* boites intro et footer dans les sections tutorial */ 
    #intro {
	    padding:10px 20px 10px 60px;
      	width: 570px;
		text-align: left;
		}          

    a#insertion-warning {
        display: block; width: 180px; height: 281px; background-image: url(images/insertion-warning.png); 
        background-position: 0px 0px;} 
    a#insertion-warning:hover {background-position: 181px 0px;}
        
    #insertion-warning {  
	    position:fixed;
	    bottom:-10px;
	    left:-18px;
	    width: 180px; 
	    height: 281px; 
	    }                   


/* =Hoverbox Code
----------------------------------------------------------------------*/

.hoverbox {	cursor: default;	list-style: none; }
.hoverbox a {	cursor: default; }
.hoverbox a .preview {	display: none; }
.hoverbox a:hover .preview { display: block;	position: absolute;	top: -0px;	left: -45px;	z-index: 1; }
.hoverbox img { background: #353359; border-color: #aaa #ccc #ddd #bbb; border-style: solid; border-width: 1px;
color: inherit;
padding: 2px;
vertical-align: top;
width: 100px;
height: 87px; } /* thumbnail */

.hoverbox ul {}
.hoverbox li { 	background: #3D3971; border-color: #ddd #bbb #aaa #ccc; border-style: solid; border-width: 1px;
color: inherit;
display: inline;
float: left;
margin: 3px;
padding: 5px;
position: relative; }

.hoverbox .preview { border-color: #8080FF; width: 400px; height: 350px; } /* preview zoom */

/* =Internet Explorer Fixes for hoverbox et marges decalees
----------------------------------------------------------------------*/

.hoverbox a
{position: relative;}

.hoverbox a:hover {	display: block;	font-size: 100%; z-index: 1; }

.hoverbox a:hover .preview { top: 80px; left: -120px;}

.hoverbox li {position: static; }


/* =hoverboxtshirts T-shirt colours selection gallery
----------------------------------------------------------------------*/

.hoverboxtshirts {	cursor: default;	list-style: none; }
.hoverboxtshirts a {	cursor: default; }
.hoverboxtshirts a .preview {	display: none; }
.hoverboxtshirts a:hover .preview { display: block;	position: absolute;	top: -0px;	left: -45px;	z-index: 1; }
.hoverboxtshirts img { background: #353359; border-color: #aaa #ccc #ddd #bbb; border-style: solid; border-width: 1px;
color: inherit;
padding: 2px;
vertical-align: top;
width: 100px;
height: 120px; } /* thumbnail */

.hoverboxtshirts li { 	background: #000000; border-color: #ddd #bbb #aaa #ccc; border-style: solid; border-width: 1px;
color: inherit;
display: inline;
float: left;
margin: 3px;
padding: 5px;
position: relative; }

.hoverboxtshirts .preview { border-color: #8080FF; width: 260px; height: 270px; } /* preview zoom */

/* =Internet Explorer Fixes for hoverboxtshirts et marges decalees
----------------------------------------------------------------------*/

.hoverboxtshirts a
{position: relative;}

.hoverboxtshirts a:hover {	display: block;	font-size: 100%; z-index: 1; }

.hoverboxtshirts a:hover .preview { top: 80px; left: -120px;}

.hoverboxtshirts li {position: static; }