/* @override Credits */
/*
Date : 19.03.2010
Auteur : Adrien Heury
Projet : Coyote city
Logiciel : CSS Edit 2.6 - iMac
Commentaire : Pour cibler une version de internet-explorer : #IE6, IE7, #IE8

                        
                          oooo$$$$$$$$$$$$oooo
                      oo$$$$$$$$$$$$$$$$$$$$$$$$o
                   oo$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$o         o$   $$ o$
   o $ oo        o$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$o       $$ $$ $$o$
oo $ $ "$      o$$$$$$$$$    $$$$$$$$$$$$$    $$$$$$$$$o       $$$o$$o$
"$$$$$$o$     o$$$$$$$$$      $$$$$$$$$$$      $$$$$$$$$$o    $$$$$$$$
  $$$$$$$    $$$$$$$$$$$      $$$$$$$$$$$      $$$$$$$$$$$$$$$$$$$$$$$
  $$$$$$$$$$$$$$$$$$$$$$$    $$$$$$$$$$$$$    $$$$$$$$$$$$$$  """$$$
   "$$$""""$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$     "$$$
    $$$   o$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$     "$$$o
   o$$"   $$$$$$$$$$$    HAVE FUN WITH MY CSS    $$$$$$$$$$$$       $$$o
   $$$    $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$" "$$$$$$ooooo$$$$o
  o$$$oooo$$$$$  $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$   o$$$$$$$$$$$$$$$$$
  $$$$$$$$"$$$$   $$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$$     $$$$""""""""
 """"       $$$$    "$$$$$$$$$$$$$$$$$$$$$$$$$$$$"      o$$$
            "$$$o     """$$$$$$$$$$$$$$$$$$"$$"         $$$
              $$$o          "$$""$$$$$$""""           o$$$
               $$$$o                                o$$$"
                "$$$$o      o$$$$$$o"$$$$o        o$$$$
                  "$$$$$oo     ""$$$$o$$$$$o   o$$$$""
                     ""$$$$$oooo  "$$$o$$$$$$$$$"""
                        ""$$$$$$$oo $$$$$$$$$$
                                """"$$$$$$$$$$$
                                    $$$$$$$$$$$$
                                     $$$$$$$$$$"
                                      "$$$""*/

/*[Table of contents]
-------------------------------------------------------------------*/
/*[Color codes]
-------------------------------------------------------------------*/
/*[Typography]
-------------------------------------------------------------------*/

@import url("reset.css");
@import url("grid.css");
@import url("typography.css");
@import url("wysiwyg.css");

body {
	background: #fff;
}

body.home {
	background: url(../images/bkg.jpg) repeat-x 0 0;
}

body .container {
	position: relative;
}

a {
	color: #41bdda;
}

a:hover {
	color: #2c2c2c;
}

/* referencement */
.ref {
	position: absolute;
	top: -10000px;
	left: -10000px;
}

/* @group Header */

.header {
	position: relative;
	margin: 20px 0 0 0;
	padding: 0;
	height: 40px;
	z-index: 50000;
}

/* @group Logo */

h1 {
	margin: 0;
	padding: 0;
	position: absolute;
	top: 0;
	left: 0;
}

h1 a {
	background: url(../images/sprite.png) no-repeat 0 0;
	height: 40px;
	width: 190px;
	display: block;
}

h1 a:hover {
	background-position: 0 -40px;
}

h1 a span {
	display: none;
}

/* @end */

/* @group Goodies */

.linkGoodies {
	background: url(../images/sprite.png) no-repeat 0 -80px;
	display: block;
	height: 40px;
	width: 190px;
	position: absolute;
	top: 0;
	left: 280px;
}

.linkGoodies:hover {
	background-position: 0 -120px;
}

.linkGoodies span {
	display: none;
}

/* @end */

/* @group Menu */

.menu {
	margin: 0;
	padding: 0;
	list-style: none;
	position: absolute;
	top: 10px;
	right: 100px;
	width: 320px;
	height: 20px;
}

.menu li {
	margin: 0;
	padding: 0;
	display: block;
	float: left;
}

.menu li a {
	margin: 0;
	padding: 0;
	display: block;
	float: left;
	background: url(../images/sprite.png) no-repeat 0 -160px;
	height: 20px;
}

.menu li a span {
	display: none;
}

.menu li.portfolio a {
	background-position: 0 -180px;
	width: 110px;
	cursor: default;
}

.menu li.portfolio ul li ul li a {
	cursor: pointer !important;
}

.menu li.portfolio a:hover, .menu li.portfolio .liensDeroulants a.select {
	background-position: 0 -160px;
}

.menu li.bio a {
	background-position: -110px -180px;
	width: 95px;
}

.menu li.bio a:hover, .menu li.bio a.select {
	background-position: -110px -160px;
}

.menu li.blog a {
	background-position: -208px -180px;
	width: 50px;
}

.menu li.blog a:hover, .menu li.blog a.select {
	background-position: -208px -160px;
}

.menu li.contact a {
	background-position: -260px -180px;
	width: 60px;
}

.menu li.contact a:hover, .menu li.contact a.select {
	background-position: -260px -160px;
}

/* @group Deroulant */

ul.liensDeroulants {
	list-style: none;
	float: left;
	padding: 0;
	margin: 0;
	position: relative;
	z-index: 50000;
}

ul.liensDeroulants li:hover a {
	background-position: 0 -180px;
}

ul.liensDeroulants .mDeroulantContenu {
	display: none;
	position: absolute;
	z-index: 50000;
	top: 15px;
	left: 0;
	width: 261px;
	padding: 10px;
	background: #39b4d1;
	-moz-border-radius: 4px;
	-khtml-border-radius: 4px;
	-webkit-border-radius: 4px;
}

#IE6 ul.liensDeroulants .mDeroulantContenu {
	width: 280px;
}

ul.liensDeroulants .mDeroulantContenu strong {
	color: #fff;
	display: block;
	margin: 0 0 10px 0;
	padding: 5px;
	background: #20a1be;
	-moz-border-radius: 4px;
	-khtml-border-radius: 4px;
	-webkit-border-radius: 4px;
}

ul.liensDeroulants .mDeroulantContenu .col2 {
	border-left: 1px solid #7cd1e6;
	padding-left: 10px;
}

ul.liensDeroulants .mDeroulantContenu ul {
	margin: 0;
	padding: 0;
	list-style: none;
	background: none;
}

ul.liensDeroulants .mDeroulantContenu ul li a {
	display: block;
	background: none;
	color: #fff;
	text-decoration: none;
	margin-left: 5px;
	width: 120px;
}

ul.liensDeroulants .mDeroulantContenu ul li a:hover {
	text-decoration: underline;
	color: #fff;
}

ul.liensDeroulants .mDeroulantContenu ul li a span {
	display: block;
}

/* @end */

/* @end */

/* @end */

/* @group Sous Header */

.sousHeader {
	border-top: 1px solid #f1f1f1;
	border-bottom: 1px solid #f1f1f1;
	margin: 20px 0;
	padding: 20px 0;
	z-index: 0;
}

.sousHeader h2 {
	margin: 0;
	padding: 0;
	font-size: 15px;
	font-weight: normal;
	font-style: italic;
	color: #2c2c2c;
}

.sousHeader ul {
	margin: 0;
	padding: 0;
	list-style: none;
	position: absolute;
	top: 78px;
	left: 280px;
}

#IE6 .sousHeader ul {
	top: 97px;
}

#IE7 .sousHeader ul {
	top: 97px;
}

.sousHeader ul li {
	display: block;
	float: left;
}

.sousHeader ul li a {
	padding: 0 20px 0 0;
	margin: 0;
}

.sousHeader ul li a.select {
	color: #2c2c2c;
	text-decoration: none;
}

/* @end */

/* @group Home */

.home a {
	text-decoration: none;
}

/* Temporaire */
.home a.suspension {
	cursor: default;
	z-index: -10;
}

/* @end */

/* @group Contenu */

.contenu {
	z-index: 0;
}

.contenu h3 {
	font-size: 18px;
	color: #333;
	font-weight: bold;
	margin: 0 0 10px 0;
	padding: 0;
}

.contenu h4 {
	font-size: 13px;
	color: #333;
	font-weight: bold;
	margin: 0 0 5px 0;
	padding: 0;
}

.contenu p {
	color: #737373;
	margin: 0;
	padding: 0 0 10px 0;
}

.contenu ul {
	margin: -10px 0 20px 20px;
	padding: 0;
	color: #737373;
	list-style: square;
}

.contenu ul li {
	font-size: 11px;
	line-height: 14px;
}

/* @end */

/* @group Goodies */

body.goodies {
	overflow: hidden;
	padding: 0;
}

body.goodies .header {
	display: none;
}

body.goodies img {
	margin: 0 0 10px 0;
}

body.goodies a.download {
	display: block;
	float: right;
	padding: 0 10px 0 0;
	height: 30px;
	text-decoration: none;
}

body.goodies a.download span {
	background:url(../images/sprite.png) no-repeat -268px -200px;
	padding: 0 0 0 10px;
}

/* @end */

/* @group Diaporama */

#gallery {position:relative; width:850px; margin:0; padding:0; border:0; z-index: 0;}
#images {border:0; height:567px; background:#eef5f6; margin-bottom:10px }
#image {position:relative; width:850px; height:567px; border:0; background:#FFF url(../images/loading.gif) center center no-repeat}
#image img {position:absolute; top:10px; left:0}

#thumbwrapper {margin-top:10px; padding:5px 0; width:850px; height:100px; border:0; background:#FFF}
#thumbarea {position:relative; overflow:hidden; height:100px; width:850px; }
#thumbs {position:absolute; list-style:none; margin-left:5px; height:100px; width:10000px; border-right:5px solid #FFF}
#thumbs li {float:left; margin-right:5px; cursor:pointer}
.imgnav {position:absolute; height:375px; width:20%; z-index:100; height:375px; width:20%; z-index:100; outline:none; cursor:pointer}

#previmg {left:-60px; top:250px; background:url(../images/sprite.png) no-repeat 0 -260px; height: 28px; width: 50px; display: block}
#previmg:hover {opacity:1;background-position: 0 -288px}
#nextimg {right:-60px; top:250px; background:url(../images/sprite.png) no-repeat -50px -260px; height: 28px; width: 50px; display: block}
#nextimg:hover {opacity:1; background-position: -50px -288px}

.nav {height: 15px; margin: 10px 0 0 0}

.linkInfo {display:block; width: 26px; height: 20px; background:url(../images/sprite.png) no-repeat 0 -200px; float: right; margin: 2px 10px 0 0 }
.linkInfo:hover {background-position: 0 -220px}
.linkInfo span {display: none}

.linkThumb {display:block; width: 20px; height: 20px; background:url(../images/sprite.png) no-repeat -34px -200px; float: right; margin: 0 0 0 0}
.linkThumb:hover {background-position: -34px -220px}
.linkThumb span {display: none}

.linkBig {display:block; width: 29px; height: 20px; background:url(../images/sprite.png) no-repeat -58px -200px; float: right; margin: 0 0 0 0}
.linkBig:hover {background-position: -58px -220px}
.linkBig span {display: none}

.infoPhoto {
	background: #fff;
	position: absolute;
	top: 190px;
	left: 305px;
	z-index: 5000;
	width: 200px;
	height: 170px;
	overflow: hidden;
	padding: 20px;
	-moz-border-radius: 4px;
	-khtml-border-radius: 4px;
	-webkit-border-radius: 4px;
}

.infoPhoto .infos {
	font-size: 11px;
	font-style: italic;
	display: block;
	margin: 10px 0 0 0;
}

.fineArt .infoPhoto {
	top: 180px;
	left: 205px;
	width: 400px;
	height: 250px;
}

.spas .infoPhoto {
	height: 260px;
}

.abu .infoPhoto {
	height: 210px;
}


.aiglons .infoPhoto {
	width: 250px;
	left: 265px;
}

.morgane .infoPhoto {
	height: 190px;
}

.wine .infoPhoto {
	height: 250px;
}

.infoPhoto .close {
	background: url(../images/sprite.png) no-repeat -106px -260px;
	display: block;
	width: 30px;
	height: 30px;
	position: absolute;
	top: 10px;
	right: 20px;
}

.infoPhoto .close:hover {
	background-position: -106px -287px;
}

.infoPhoto .close span {
	display: none;
}

/* @end */

/* @group Blog */

.blog .sidebar {
	padding-right: 20px;
}

.blog .sidebar p {
	margin: 0;
}

.right {
	text-align: right;
}

.separation {
	border-bottom: 1px solid #41bdda;
	margin: 20px 0;
	padding: 0 0;
}

/* @end */

/* @group Bio */

.divApparait {
	border: 1px solid #eee;
	padding: 10px 10px 0 10px;
	margin: 0 0 10px 0;
}

#bouton {
	text-decoration: none;
	font-size: 11px;
	padding: 0 0 0 10px;
	background: url(../images/down.png) no-repeat 0 -3px;
}

#bouton.affiche {
	background: url(../images/down.png) no-repeat 0 6px;
}

/* @end */

.footer {
	font-size: 10px;
	color: #999;
	margin: 10px 0;
	padding: 10px 0;
	border-top: 1px solid #f1f1f1;
}

.footer .handmade {
	float: right;
	color: #999;
	text-decoration: none;
}

.footer .handmade:hover {
	color: #555;
}