/* --------------------------------------------------------
    Main stylesheet
    Site: Dre Baillargeon
    Created by: Stéphanie Léveillé - stef@annotea.com
    Filename: main.css
   -------------------------------------------------------- */
   
/* --------------------------------------------------------
    COLORS
   -------------------------------------------------------- */

* {
	border: 0;
	margin: 0;
	padding: 0;
}

:focus { outline: none;}

body {
	background: url(../images/background.gif) repeat;
	color: #000;
	font: 62.5% Arial, Verdana, Helvetica, Tahoma, sans-serif;
}


p {
	line-height: 1.4em;
	text-align: justify;
	padding: 0 0 1.2em;
}

a, .bleu { color: #00678f; }

hr {
	clear: both;
	color: #00678f;
	background-color: #00678f;
	height: 1px;
	border: 0;
	margin: 0 0 20px 0;
}


#content ul { margin-left: 20px;}

h1#logo { 
	position: absolute;
	top: 50px;
	right: 40px;
}

h1#logo a {
	background: url(../images/logo.gif) no-repeat;
	display: block;
	height: 70px;
	text-indent: -9999px;
	width: 181px;
}


/* structure */

#container { 
	background: #fff url(../images/backContent.gif) 0 156px no-repeat;
	min-height: 600px;
	position: relative;
	width:911px;
}

* html #container { height: 600px; }

#degradeD {
	background: url(../images/degradeRight.png) top right repeat-y;
	margin: 20px auto 0;
	xpadding-bottom: 14px;
	width: 931px;
}

#degradeB {
	background: url(../images/degradeBottom.png) no-repeat;
	height: 20px;
	position: absolute;
	bottom: -20px;
	left: 0;
	width: 933px;
}

#header { 
	height: 157px;
	position: relative;
}

#content {
	xheight: 371px;
	width: 630px;
}

#text {
	font-size: 1.2em;
	padding: 20px 40px 20px 20px;
}

#text span { color: #00678f; }

h1 { 
	color: #00678f;
	font-size: 1.4em;
	font-weight: normal;
	padding: 0 0 1.2em;
}

h2 { 
	color: #00678f;
	font-size: 1.1em;
	font-weight: normal;
	padding: 0 0 1.2em;
}

h3 { 
	color: #00678f;
	font-size: 1em;
	font-weight: normal;
	padding: 0 0 1.2em;
}

#mainContent { min-height: 368px;}

#resultats #mainContent {
	background: url(../images/imgVisite.jpg) right top no-repeat;
}


/*** menu ***/

#main-menu {
	background: #d5e7f0;
	height:26px;
	left: 0;
	list-style: none;
	padding-left: 28px;
	position: absolute;
	top:85px;
	width: 575px;
}

#bottom-menu {
	background: url(../images/backMenuBas.gif) no-repeat;
	height:27px;
	list-style: none;
	padding-left: 167px;
	width: 379px;
	position: absolute;
	bottom:-26px;
	z-index: 50;
}

#main-menu li, #bottom-menu li { 
	float: left;
	display: inline;
	list-style: none; }

#main-menu li a, #bottom-menu li a {
	background-position: top;
	background-repeat: no-repeat;
	display: block;
	float: left;
	height: 26px;
}

#bottom-menu li a { height:27px; }

#main-menu li a:hover, #main-menu li.active a, #bottom-menu li a:hover, #bottom-menu li.active a { background-position: bottom; }

#menu-accueil a {
	background-image: url(../images/mAccueil.gif);
	width: 85px;
}
#menu-clinique a {
	background-image: url(../images/mClinique.gif);
	width: 83px;
}
#menu-orthodontie a {
	background-image: url(../images/mOrthodontie.gif);
	width: 116px;
}
#menu-resultats a {
	background-image: url(../images/mResultats.gif);
	width: 91px;
}
#menu-equipe a {
	background-image: url(../images/mEquipe.gif);
	width: 73px;
}
#menu-contact a {
	background-image: url(../images/mContact.gif);
	width: 92px;
}
#menu-premiere-visite a {
	background-image: url(../images/mPremiereVisite.gif);
	width: 126px;
}

#menu-faq a {
	background-image: url(../images/mFaq.gif);
	width: 59px;
}
#menu-temoignages a {
	background-image: url(../images/mTemoignange.gif);
	width: 94px;
}
#menu-documents a {
	background-image: url(../images/mDocuments.gif);
	width: 93px;
}
#menu-conseils a {
	background-image: url(../images/mConseils.gif);
	width: 86px;
}
#menu-liens-utiles a {
	background-image: url(../images/mLiens.gif);
	width: 98px;
}

#main-menu li a span.linktext, #bottom-menu li a span.linktext { display: none; }

/*** images****/ 

#equipe #mainContent { background: url(../images/imgAcc.jpg) right top no-repeat; }
#clinique #mainContent { background: url(../images/imgClinique.jpg) right top no-repeat; }
#orthodontie #mainContent { background: url(../images/imgOthodontie.jpg) right top no-repeat; }
#premiere-visite #mainContent { background: url(../images/imgVisite.jpg) right top no-repeat; }
#accueil #mainContent { background:url(../images/imgResultats.jpg) right top no-repeat; }
#contact #mainContent { background: url(../images/imgContact.jpg) right top no-repeat; }
#faq #mainContent { background: url(../images/imgFAQ.jpg) right top no-repeat; }
#temoignages #mainContent, #conseils #mainContent { background: url(../images/imgTemoignages.jpg) right top no-repeat; }
#documents #mainContent, #resultats #mainContent { background: url(../images/imgDocuments.jpg) right top no-repeat; }
#liens_utiles #mainContent { background: url(../images/imgLiens.jpg) right top no-repeat; }


/* --------------->>> other <<<---------------*/

a.group1 { text-decoration: none; font-size: 90%; width:150px; text-align: center; }
a.result { text-align: left; width: 405px; }
a.group1 span { padding-top:0; text-decoration: underline; }


table.equipe a { font-size: 100%; line-height: 48px; text-decoration: underline; }
table.equipe span { line-height: 48px;}
table.equipe img { float: left; margin-right:10px; }

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

.clearfix {display: inline-block;}

/* Hides from IE-mac */
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

#copy { position: absolute; right:5px; bottom:-40px;}