/*
Theme Name: Elevage de Céran
Theme URI: http://www.elevagedeceran.com
Description: Thème réalisé pour le site de l'Elevage de Céran.
Version: 1.0
Author: 6tem9
Author URI: http://www.6tem9.com

elevageCeran v1.0
http://www.elevagedeceran.com

This theme was designed and built by 6tem9.
*/

/*	Normalisation
--------------------------------------------------------------------------- */ 

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td, img { margin: 0; padding: 0; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; }
ol, ul { list-style: none; }
address, caption, cite, code, dfn, em, strong, th, var { font-style: normal; font-weight: normal; }
table { border-collapse: collapse; border-spacing: 0; }
fieldset, img { border: 0; }
caption, th { text-align: left; }
q:before, q:after { content: ''; }

/*	HTML & Body
--------------------------------------------------------------------------- */ 

html { text-align : center; background-image: url('images/htmlFond.png'); }

body {
background: url('images/htmlFond.png');
font: 13px Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Verdana, sans-serif;
}

div#conteneur { 
width : 940px; 
margin : 10px auto;
text-align : left;
background: url('images/bodyFond.png') no-repeat top right;
}

div.spacer { clear: both; }

/*	Polices
--------------------------------------------------------------------------- */

/* ----- titres   */

h1, h2, h3, h4, h5, h6 { color: #ffe9ca; font-weight: bold }

h1 { font-size: 150%; }
h2 { font-size: 130%; }
h3 { font-size: 120%; }

h2 {
padding: 0 0 5px 60px;
background: url('images/puceTitre.png') no-repeat;
color: #000;
border-bottom: 1px dashed Silver;
margin: 0 0 5px 0;
}

h2.titreOrigine {
margin: 0 20px 5px 20px;
}

h3 {
font-weight: bold;
font-style: italic;
color: #000;
font-size: 12px;
margin-bottom: 5px;
}

h3 a {
font-size: 140%;
color: #ef6100;
font-style: normal;
}

h4 {
font-size: 14px;
margin: 6px 0;
padding: 0;
color: #3E3E3E;
padding: 5px 0 5px 10px;
border-top: 1px solid #ef6100;
border-bottom: 1px solid #ef6100;
text-align: left;
background-color: #F8F8F8;
}

div#header h1 { display: none; }
div#headerSub h2 { color: #ffe9ca; font-size: 100%;	letter-spacing: 2px; background: none; padding: 0; margin: 0; border: none; }

/* ----- paragraphe   */

p { color: #000; margin-bottom: 10px; line-height: 23px; text-align: justify; }

p.resume { margin: 10px 0; font-size: 12px; }
.explication p { font-size: 14px; }
#footer p { color: #fff; text-align: center; }

strong { font-weight: bold; }

div#presentation p:first-letter { font-size: 16px; font-weight: bold; }

p.age { line-height: 22px; font-weight: bold; font-size: 13px; }

.explication p,p.explication { font-size: 14px; margin-top: 10px; }

p.legende { float: right; font-size: 13px; margin: 8px 0 0 30px; padding: 10px; border: 1px solid #E6E6E6; background-color: #FAFAFA; color: #7C7C7C; }

span.categorieCheval { float: left; font-size: 11px; color: Silver; }

span.nombreMedia { float: right; font-size: 11px; }

span.zoom { font-size: 12px; color: Silver; }

/* ----- liens   */

a:link, a:visited { font-weight: bold; text-decoration: none; color: #fff; }
a:hover, a:active { color: #ef6100; text-decoration: underline; }

.contentBottomLien a {
color: #000;
font-size: 13px;
padding: 0 20px 5px 60px;
background: url('images/puceTitre.png') no-repeat;
}

div#navMain a { font-size: 14px; }

div#navMain a:link,div#navMain a:visited,div#navMain a:active,
div#footer a:link,div#footer a:visited,div#footer a:active {
padding-right: 8px;
margin-right: 5px;
border-right: 1px solid #ef6100;
}


div#navMain a.last,div#footer a.last { padding: 0; margin: 0; border: 0; }

a.lienContact { margin: 0 50px 0 0; }

a.lienVideo { margin: 0; }

.content a, .miniFiche a { line-height: 22px; color: #ef6100; }

span.categorieCheval a { font-size: 11px; color: Silver; }

.content li {
padding: 0 0 0 20px;
list-style: disc;
list-style-position:inside;
line-height: 23px;
margin: 3px 0;
}

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

div#header { width : 940px; height: 100px; background: url('images/transparent.gif'); }
div#headerLogo { float: left; width : 341px; height: 100px; }
div#headerContent { float: right; width : 550px; text-align: right;	background-color: transparent; }
div#headerSub {	width : 100%; padding: 0; background: url('images/transparent.gif'); }

div#description { float: left; width : 300px; }
div#navMain { float: right; width : 600px; text-align: right; color: #fff; }

div#blocSearch {
float: right;
width: 280px;
height: 30px;
background: url('images/fondSearch.png') no-repeat;
padding-top: 5px;
}

div#blocSearch #s {
width: 230px;
margin: 0 0 0 10px;
border: 1px solid transparent;
color: #fff;
font-size: 12px;
font-weight: bold;
}

input.champSearch { background-color: transparent; }
input.btonSearch { margin: 0 3px 0 0; vertical-align: middle; }

/*	Presentation
--------------------------------------------------------------------------- */ 

div#presentation { width: 100%; margin-top: 5px; }
div#presentationTop { width: 100%; height: 15px; background: url('images/presentationTop.png') no-repeat bottom; }
div#presentationContent { padding : 0 20px;	background-image: url('images/presentationFond.png'); }
div#presentationBottom { width: 100%; height: 15px;	background: url('images/presentationBottom.png') no-repeat top; }
img.presentation { float: right; margin-left: 10px; }

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

div.contentMain,div.contentMainOrigine { width: 100%; margin-top: 5px; background-color: #fff; }
div.contentTop { width: 100%; height: 15px; background: url('images/contentTop.png') no-repeat bottom; }
div.content { padding : 0 20px; background-color: #fff; }
div.contentBottom,div.contentBottomLien { width: 100%; height: 15px; background: url('images/contentBottom.png') no-repeat bottom; }
div.contentBottomLien {	height: 30px; text-align: right; }

div.miniFiche {
width: 440px;
float: left;
margin: 5px;
background-color: #fff;
padding-bottom: 6px;
border-bottom: 1px dashed Silver;
}

div.pageContentLeft { float: left; width: 480px; }
div.pageContentRight { float: right; width: 400px; }

div.ongletOrigine {
float: left;
width: 20px;
height: 120px;
margin-top: 10px;
background: url('images/ongletOrigine.png');
}

div.proprietaire { font-weight: bold; margin-top: 10px; }

table.origineTable { margin: 10px 0 10px 50px; }
table.origineTable td.celluleParent { background: url('images/fondCelluleParent.png') center no-repeat; width: 150px; }
table.origineTable td.celluleGrandPere { background: url('images/fondCelluleGrandPere.png') center left no-repeat; height: 30px; padding-left: 40px; }
table.origineTable td.celluleGrandMere { background: url('images/fondCelluleGrandMere.png') center left no-repeat; height: 30px; padding-left: 40px; }
table.origineTable td span { line-height: normal; padding: 5px 10px; font-weight: bold; background-color: #FF7F00; color: #fff; }
table.origineTable td span.femelle { background-color: #7E0000; }

table.genealogie,table.genealogie2 { margin: 20px 0 10px 0; }
table.genealogie td,table.genealogie2 td { width: 340px; height: 35px; padding: 5px 0; }
table.genealogie td.derniereGeneration,table.genealogie2 td.derniereGeneration { width: 680px; }
table.genealogie td.departGeneration,table.genealogie2 td.departGeneration { background: url('images/fondDepartGeneration.png') no-repeat; }
table.genealogie td.lienGeneration,table.genealogie2 td.lienGeneration { background: url('images/fondLienGeneration.png') no-repeat; }
table.genealogie td.lienGenerationV,table.genealogie2 td.lienGenerationV { background: url('images/fondLienGenerationV.png') no-repeat; }
table.genealogie td.lienGenerationH,table.genealogie2 td.lienGenerationH { background: url('images/fondLienGenerationH.png') no-repeat; }
table.genealogie td span,table.genealogie2 td span { line-height: normal; padding: 5px 10px; font-weight: bold; background-color: #FF7F00; color: #fff; }
table.genealogie td span.femelle,table.genealogie2 td span.femelle { background-color: #7E0000; }
table.genealogie a,table.genealogie2 a { color: #fff; text-decoration: underline; }

span.legendeMale, span.legendeFemelle { line-height: normal; padding: 3px 4px; font-weight: bold; background-color: #FF7F00; color: #fff; }
span.legendeFemelle { background-color: #7E0000; }

div.ficheContact, div.ficheContactLast { float: left; width: 280px; margin: 10px 10px 0 0; }
div.ficheContactLast { margin: 10px 0 0 0; }

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

div#footer {
width: 100%;
height: 22px;
padding : 3px 0 3px 0;
margin: 10px 0 0 0;
text-align: center;
background: url(images/footerFond.png) no-repeat top;
}

div#footerSub { width: 100%; height: 91px; background: url('images/footerSubFond.png') no-repeat top; }

/*	Images
--------------------------------------------------------------------------- */ 

img.alignMiddle { vertical-align: middle; }

img.iconeMail,img.iconeZoom { vertical-align: middle; margin-right: 4px; }
img.iconeInfo { float: left; margin: -5px 4px 0 0; }
img.iconeVideo { vertical-align: bottom; }

img.thumbnail { float: right; margin-left: 15px; }

img.vignetteListe { float: right; margin-left: 15px; height: 180px; }

img.photosElevage { float: left; margin: 0 12px; width: 200px; }

img.photoContact { float: left; margin-right: 10px; }

/* FORMULAIRE CONTACT
-------------------------------------------------------------- */

#formulaireContact { margin-top: 0px; float: left; width: 450px; }

#contactForm p { margin: 25px 0 10px 0; }

#contactForm label {
width: 140px;
display: inline;
float: left;
text-align: right;
padding: 8px 10px 0 0;
font-weight: bold;
}
	
#contactForm textarea {
background-color: #eeeeee;
width: 284px;
max-width: 300px;
height: 234px;
padding: 8px;
border: none;
font-size: 12px;
color: #000;
/*resize:none;*/
}

.champForm {
width: 293px;
height: 27px;
background: url('images/champForm.png') no-repeat right top;
border: none;
font-size: 12px;
color: #000;
padding: 8px 0 0 7px;
vertical-align: middle;
}

#contactForm div.error {
float: left;
margin-left: 150px;
color: #FF7F00;
font-size: 11px;
width: 300px;
}

input:focus { border: 0px solid black; }
input.error { background: url('images/champFormError.png') no-repeat; }
#contactForm textarea.error { background-color: #dcdcdc; }

#chargementMail { vertical-align: top; margin: 0 0 0 15px; padding-top: 6px; }

div#result {
width: 200px;
height: 20px;
margin-left: 150px;
color: #FF7F00;
font-size: 12px;
font-weight: bold;
}

div.loaderVignette { background: url('images/loaderContact.gif') no-repeat center center; }

/*	SLIDER
--------------------------------------------------------------------------- */ 

div.slideFondInfo {
margin: 0 auto;
padding: 4px 10px 0 10px;
background:url('images/slideFondInfo.png') no-repeat;	 	
width: 340px;	
height: 21px;				
}

div.slideFondInfo span.nombrePhoto {
float: left;
color: #fff;
font-weight: bold;
}

div.slideFondInfo span.zoom {
float: right;
color: #fff;
}

div.scrollable {
position: relative;
overflow: hidden;	 	
width: 400px;	
height: 327px;	
background:url('images/slideFond.png') no-repeat;
margin-bottom: 4px;
}

div.scrollable div.items {	
width: 20000em;	
position: absolute;
clear: both;
margin-left: 0;
}

div.scrollable div.items div {
float: left;
width: 380px;
height: 307px;
padding: 0;
background:url('images/slideFondItem.png');
margin: 10px;	
}

div.scrollable div.items div a { padding: 0; margin: 0; line-height: 0; }
img.imgSlide { width: 185px; height: 148px; padding: 0; margin: 0 6px 8px 0; }
img.imgSlidePair { width: 185px; height: 148px; padding: 0; margin: 0 0 8px 0; }
img.imgSlideVide { width: 185px; height: 148px; padding: 0; margin: 0 6px 8px 0; }
img.imgSlideVidePair { width: 185px; height: 148px; padding: 0; margin: 0 0 8px 0; }
img.imgSlideSolo { width: 380px; height: 307px; padding: 0; margin: 0; }

a.prev, a.prevPage {
display: block;
float: left;
width: 150px;
height: 19px;
background: url('images/slideNavLeft.png') no-repeat left 4px;
margin: 0;
cursor: pointer;
font-weight: bold;
padding-left: 25px;
}
/*a.prev:hover, a.prevPage:hover { background-position: 0px -15px; }*/

a.next, a.nextPage {
display: block;
float: right;
width: 150px;
height: 19px;
background: url('images/slideNavRight.png') no-repeat right 4px;
margin: 0;
cursor: pointer;
text-align: right;
font-weight: bold;
padding-right: 25px;
}
/*a.next:hover, a.nextPage:hover { background-position:right -11px; }*/

.disabled { visibility:hidden !important; }

span.navi { width:358px; height:14px; text-align: center; }

span.navi a {
width: 10px;
height: 10px;
float: left;
margin: 2px;
background: url('images/slideNav.png') 0 0 no-repeat;     
cursor:pointer;	
}

span.navi a:hover { background-position: 0 -10px; }
span.navi a.active { background-position: 0 -20px; } 	

/*	TABS
--------------------------------------------------------------------------- */ 

/*.ui-tabs { zoom: 1; }*/
.ui-tabs .ui-tabs-nav { list-style: none; margin: 0 20px 10px 20px; height: 32px; border-bottom: 3px solid #ef6100; }

.ui-tabs .ui-tabs-nav li {
float: left;
height: 35px;
margin: 0 10px;
background: url('images/ongletTabFond.png') no-repeat right top;
}

.ui-tabs .ui-tabs-nav li.ui-tabs-selected { background: url('images/ongletTabFond.png') no-repeat right bottom; }

.ui-tabs .ui-tabs-nav li a {
float: left;
text-decoration: none;
height: 28px;
padding: 7px 15px 0 15px;
color: #7E7E7E;
font-size: 14px;
background: url('images/ongletTabLienFond.png') no-repeat left top;
}

.ui-tabs .ui-tabs-nav li a:hover { text-decoration: underline; }
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a:hover { text-decoration: none; }

.ui-tabs .ui-tabs-nav li.ui-tabs-selected a { background: url('images/ongletTabLienFond.png') no-repeat left bottom; color: #262626; }

.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; }
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
.ui-tabs .ui-tabs-panel { display: block; border-width: 0; background: none; }
.ui-tabs .ui-tabs-hide { display: none !important; }