@import "base.css";

/* Transversal Nav
---------------------- */
#sections li {height: 35px;}

#sections .observatory a {background: url('i/sections.png') 0 0 no-repeat;}
#sections .observatory strong a,
#sections .observatory a:hover {background-position: 0 -65px;}
#sections .newspaper a {background: url('i/sections.png') -326px 0 no-repeat;}
#sections .newspaper strong a,
#sections .newspaper a:hover {background-position: -326px -65px;}
#sections .foundation a {background: url('i/sections.png') -653px 0 no-repeat;}
#sections .foundation strong a,
#sections .foundation a:hover {background-position: -653px -65px;}

/* Breadcrumbs
---------------------- */
#breadcrumbs {padding: 0.6em 0 0.4em 0; color: #999; font-size: 0.9em; margin: 0 20px 10px 29px; border-bottom: dotted 1px #000;}
#breadcrumbs a {color: #999;}
#breadcrumbs a:hover {text-decoration: underline;}

/* Layout
---------------------- */
#wrapper {background: url('i/3cols.gif') 0 0 repeat-y; margin: 0 9px;}
#wrapper-dac {background: url('i/0cols.gif') 0 0 repeat-y; margin: 0 9px;}
#wrapper.by2 {background-image: url('i/2cols.gif');}

#content {width: 500px; float: left; margin-left: 260px; margin-right: 10px; display: inline; padding-top: 1em;}
#content-dac {width: 700px; float: left; margin-left: 140px; margin-right: 60px; display: inline; padding-top: 1em;}
#content-portail {width: 700px; float: left; margin-left: 260px; margin-right: 10px; display: inline; padding-top: 1em;}
.by2 #content {width: 700px;}
#related {width: 180px; margin-left: 20px; float: left; display: inline;}
#sideBar {width: 200px; margin-left: -950px; float: left;}
/*#wrapper-dac  #dac-image1 {background:  url('../../../../dac-boreale/mada-logo.png') no-repeat;}
#wrapper-dac  #dac-image2 {background:  url('../dac-boreale/mada-ministere.png')0 0 no-repeat;} */

/* Content
---------------------- */
.cs1 .content h2 {color: #e20b00;}
.cs2 .content h2 {color: #ffa000;}
.cs3 .content h2 {color: #8ab801;}

.cs1 .content a:hover {color: #e20b00;}
.cs2 .content a:hover {color: #ffa000;}
.cs3 .content a:hover {color: #8ab801;}

.content .color1 {color: #e20b00;}
.content .color2 {color: #ffa000;}
.content .color3 {color: #8ab801;}

.plus {font-size: 1.1em;}
.plus a {padding: 0 0 0 23px; background-position: 0 0.3em; background-repeat: no-repeat; text-decoration: none; color: #000;}
.plus a:hover {text-decoration: underline;}
.cs1 .plus a {background-image: url('i/plus-1.gif');}
.cs2 .plus a {background-image: url('i/plus-2.gif');}
.cs3 .plus a {background-image: url('i/plus-3.gif');}

.nav ul li {list-style: none; margin: 0;}
.nav ul li a {padding: 0 0 0 12px; background-position: 0 0.4em; background-repeat: no-repeat; color: #000; text-decoration: none;}
.nav ul ul li a {padding: 0 0 0 12px; background-position: 0 0.4em; background-repeat: no-repeat;}
.nav ul li a:hover {text-decoration: underline;}
.nav ul ul {margin: 0 0 0 2em;}
.cs1 .nav a {background-image: url('i/nav-a-2.gif');}
.cs2 .nav a {background-image: url('i/nav-b-2.gif');}
.cs3 .nav a {background-image: url('i/nav-c-2.gif');}
.cs1 .nav ul ul li a,
.cs2 .nav ul ul li a,
.cs3 .nav ul ul li a {background-image: url('i/nav-3.gif');}
.cs1 .nav a:hover {color: #e20b00;}
.cs2 .nav a:hover {color: #ffa000;}
.cs3 .nav a:hover {color: #8ab801;}

/* Inset
---------------------- */
.inset {background: #f1f0ea; margin-left: -10px; margin-right: -10px; clear: both; padding: 10px 10px;}

/* Table
---------------------- */
.inset table {/*margin: 0 -10px;*/ margin-top: 1em;}
table {border: solid 1px #e4e1d6; margin-bottom: 1em; font-size: 0.95em;}
th {vertical-align: top; text-align: left; border: solid 1px #e4e1d6; padding: 5px 10px 5px 10px; font-size: 1.15em; text-shadow: 0 0 0 #fff; line-height: 1.2;}
.cs1 th {background: #e4271d url('i/th-1.gif') 0 0 repeat; color: #fff;}
.cs2 th {background: #ffb944 url('i/th-2.gif') 0 0 repeat;}
.cs3 th {background: #a8d21d url('i/th-3.gif') 0 0 repeat;}
td {vertical-align: top; border: solid 1px #e4e1d6; padding: 4px 10px;}
.even td {background: #fff;}
.cellRight {text-align: right;}
th small {font-size: 0.8em;}
td strong {font-weight: normal; font-size: 1.15em;}

/* Forms
---------------------- */
.form {padding-top: 109px; background-image: url('i/misc/formulaire.png'); background-position: 0 0; background-repeat: no-repeat;}
.soft {color: #776351;}
.structured {padding-bottom: 1em;}
.structured .buttons {float: right;}
.buttons input {border: none; background: none; padding: 0 0 0 24px; font-weight: bold; color: #776351; background-position: 0 0.4em; background-repeat: no-repeat; cursor: pointer; margin-left: 20px; text-align: left;}
.buttons input:hover {color: #000;}


.buttons2 input {width: 250px; height:22px; border: none; background: #776351 url('i/more.gif') -0.10em 0.65em no-repeat;  padding: 0 0 0px 20px; font-size: 0.95em; 
color: #fff;  cursor: pointer; }
.buttons2 input:hover {text-decoration:underline;}



.cs1 .buttons input {background-image: url('i/plus-1.gif');}
.cs2 .buttons input {background-image: url('i/plus-2.gif');}
.cs3 .buttons input {background-image: url('i/plus-3.gif');}

/*.structured label {display: block; margin-bottom: 0.35em;}*/
.structured label {display: block; margin-bottom: 3px;}
.structured label span {display: block; float: left; width: 215px; margin-right: 10px; text-align: right;}
.structured label .champ {display: block;float: left; width: 200px; margin-left: 10px; text-align: left; color:#FFF; font-weight:bold; }
.structured label input {width: 200px; border: solid 1px #e4e1d6; color: #333; padding: 1px 2px;}
.structured label select {width: 232px; border: solid 1px #e4e1d6; color: #333;}
.structured label textarea {width: 226px; border: solid 1px #e4e1d6; color: #333; padding: 1px 2px;}
.structured .date input {width: 90px; text-align: right;}
.structured .login input {width: 120px;}
.structured button {float: right; font-weight: bold; color: #776351; margin-right: 10px; background-position: 0 0.4em; background-repeat: no-repeat; padding: 0 0 0 24px;}

.cs1 .structured button {background-image: url('i/plus-1.gif');}
.cs2 .structured button {background-image: url('i/plus-2.gif');}
.cs3 .structured button {background-image: url('i/plus-3.gif');}
.structured button:hover {color: #000;}

.structured_newsletter label input {width: 196px; border: solid 1px #e4e1d6; color: #333; padding: 1px 2px;}
.structured_newsletter label { float: left;display: block; margin-bottom: 3px;}
#img_newsletter {float: right;  width: 100px; height: 151px ;  background: url('i/newsletter_inscription.gif') no-repeat; }
#img_newsletter_all {float: left; width: 79px; height: 119px ;  background: url('i/newsletter_inscription.png') no-repeat; }
#img_newsletter_all .titre1 {padding-top: 30px;  text-align:center; font-size:17px; font-family: Calibri; color:#ed680a;}
#img_newsletter_all .titre2 {padding-top: 30px;  text-align:center; font-size:17px; font-family: Calibri; color:#23bfef;}
.news_break {float: left; width: 25px; height: 119px;}
.scripted .loginForm p {display: inline;}
.scripted .loginForm button {vertical-align: top; margin-top: 1px;}


/* Misc
---------------------- */
.separator {display: block; margin: 1.2em 0; border-bottom: dotted 1px #000; clear: both; position: relative;}
.separator a {display: block; text-decoration: none; overflow: hidden; width: 21px; height: 22px; text-indent: -9999px; background-position: 0 0; background-repeat: no-repeat; float: right;}
.cs1 .separator a {background-image: url('i/up-1.gif');}
.cs2 .separator a {background-image: url('i/up-2.gif');}
.cs3 .separator a {background-image: url('i/up-3.gif');}

/* Related
---------------------- */
#related .block {margin-bottom: 0.8em;}
#related .block p,
#related .block ul,
#related .block ol,
#related .block blockquote {margin-bottom: 0.8em;}
#related p.title {font-size: 1.2em; margin-bottom: 0.4em; color: #776351;}
#related .ctype1 p.title {color: #e10b00;}
#related .ctype2 p.title {color: #ffa000;}
#related .ctype3 p.title {color: #9c0;}
#related .block4 {margin-top: 4px;}

/* SideBar
---------------------- */
#sideBar .block {padding: 4px 0; border-top: dotted 1px #000; border-bottom: dotted 1px #000; margin-bottom: 1.2em;}
#sideBar .block3 {padding: 4px 0; border: dotted 1px #000; background-color:#fff; box-shadow:5px 5px 5px #bbbbbb; color:#503f2f; top: 0px; margin: 1.2em 0;}
#sideBar .block p,
#sideBar .block ul,
#sideBar .block ol,
#sideBar .block blockquote {margin-bottom: 0.8em;}
#sideBar .block2 {position: absolute; top: 200px; right: 14px; width: 200px; height: 50px; border: dotted 1px #000; background-color:#fff; box-shadow:5px 5px 5px #bbbbbb; color:#503f2f; }
#sideBar  #block2-titre{margin-top: 5px; margin-left: 15px; }
#sideBar p.title {font-size: 1.2em; margin-bottom: 0.4em; color: #776351;}
#sideBar div.title {z-index:100; position:absolute; width: 200px; font-size: 1.2em; margin-top: 7px; margin-left: 5px; color: #fff;  }
#sideBar div.title2 {z-index:100;  position:absolute; width: 90px; font-size: 0.9em;  margin-top: 42px; margin-left: 5px; color: #473524; }
#sideBar .ctype1 p.title {color: #e10b00;}
#sideBar .ctype2 p.title {color: #ffa000;}
#sideBar .ctype3 p.title {color: #9c0;}



/* Nav
---------------------- */
#navigation {margin-bottom: 1em;}
#navigation li {position: relative;}
#navigation li ul {position: relative; z-index:2000;}
#navigation a {display: block; background-position: 0 0.25em; background-repeat: no-repeat; padding: 1px 10px 1px 16px; color: #5c4c3d;}
.cs1 #navigation a {background-image: url('i/nav-a-1.gif');}
.cs2 #navigation a {background-image: url('i/nav-b-1.gif');}
.cs3 #navigation a {background-image: url('i/nav-c-1.gif');}
#navigation li:hover a,
#navigation li.hover a {background-position: -299px 0.25em;}
#navigation ul ul {position: absolute; left: -9999px; top: -9999px; width: 260px; background: #e7e6dd; border: solid 1px #ccc9ba;}
#navigation ul ul a {color: #000; padding: 1px 10px 1px 29px; background-position: 19px 0.65em; background-repeat: no-repeat;}
.cs1 #navigation ul ul a {background-image: url('i/nav-a-2.gif');}
.cs2 #navigation ul ul a {background-image: url('i/nav-b-2.gif');}
.cs3 #navigation ul ul a {background-image: url('i/nav-c-2.gif');}
#navigation ul li:hover ul a,
#navigation ul li.hover ul a {background-position: 19px 0.65em;}
#navigation ul ul ul a {background-position: 0 0.65em; background-repeat: no-repeat;}
.cs1 #navigation ul ul ul a {background-image: url('i/nav-a-3.gif');}
.cs2 #navigation ul ul ul a {background-image: url('i/nav-b-3.gif');}
.cs3 #navigation ul ul ul a {background-image: url('i/nav-c-3.gif');}
#navigation ul li:hover ul ul a,
#navigation ul li.hover ul ul a {background-position: 0 0.65em;}
#navigation ul ul ul a:hover,
#navigation ul ul li:hover ul a:hover,
#navigation ul ul li.hover ul a:hover {background-position: -300px 0.65em;}
#navigation ul ul li:hover a,
#navigation ul ul li.hover a {background-color: #f1f0ea; background-position: 19px 0.65em;}
#navigation ul ul li:hover ul a,
#navigation ul ul li.hover ul a {color: #000; background-color: #e7e6dd; background-position: 0 0.65em;}
#navigation ul ul li:hover ul a:hover,
#navigation ul ul li.hover ul a:hover {color: #e10b00; background-color: #f1f0ea;}
#navigation ul ul li {border-top: dotted 1px #96917a;}
#navigation ul ul li:first-child {border-top: none;}
#navigation ul li:hover ul,
#navigation ul li.hover ul {left: 200px; top: 0;}
#navigation ul li:hover ul ul,
#navigation ul li.hover ul ul {left: -9999px; top: -9999px;}
#navigation ul li ul li:hover ul,
#navigation ul li ul li.hover ul {left: 260px; top: -1px;}

#page.cs1 #navigation a:hover {color: #e20b00;}
#page.cs2 #navigation a:hover {color: #ffa000;}
#page.cs3 #navigation a:hover {color: #8ab801;}

/* Floats
---------------------- */
.separator:after,
.structured label:after,
.structured:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}