/*
Theme Name: Mahi-Mahi
Theme URI: http://mahi-mahi.fr/
Description: Theme - MahiMahi Agency website
Version: 0.3
Author: Alexandre Cougard, Xavier Cailly, Olivier Mourlevat
Author URI: http://mahi-mahi.fr/
*/

/* DEFAULT DEFINITION */
html { margin:0; padding:0; }
body { background:#fff; color:#333; margin:0; padding:0; font:85% "Trebuchet MS", Lucida, Arial, Geneva, Verdana, "Lucida Grande", Tahoma, Helvetica, sans-serif; }
img, table, td, fieldset, form, legend, h1, h2, h3, h4, h5, h6, p { margin:0; padding:0; border:0; }
section, article, aside, header, footer, nav, dialog, figure, time { margin:0; padding:0; border:0; }
table { border-collapse:collapse; }
a { outline:none; text-decoration:none; color:#0066aa; }
a:hover { text-decoration:underline; }
abbr { border:none; }
button { border:0; border:none; background:transparent; overflow:visible; padding:0; margin:0; cursor:pointer; }
hr { clear:both; display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }
.clearfix { display:block; }
.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
.alignleft { float:left; margin:0 12px 12px 0; }
.alignright { float:right; margin:0 0 12px 12px; }
img.alignleft, img.alignright { display:block; }
mark { background:none; }

/* LAYOUT */
#container { display:block; width:960px; padding:0; margin:0 auto; }

.top-nav{background:#d9d9d9;color:white;display:block;height:10px;margin:0;padding:0;position:relative;z-index:2}
.top-nav-message{background:#c0c0c0;font-size:0.9em;padding: .25em 0 .75em 0;text-align:center;z-index:10}

header { display:block; padding:0; margin:0; width:100%; height:136px; left:0; position:fixed; top:0; z-index:10; background:url(images/bg.png) left top repeat-x #fff fixed; background-position: 0 22px; }
header:after, #header:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
#header { display:block; margin:0 auto; padding:0; width:960px; zoom:1; }
#main { display:inline-block; display:block; padding:0; margin:0; background:url(images/dot_grey.png) 720px 0 repeat-y; position:relative; top:136px; z-index:1; }
#main:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
#content { float:left; width:700px; padding:0 1.5em 0 0; padding:0; }
#content section { display:block; padding:0; margin:0; }
#content section:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
#content section#a-propos { margin:0 0 5px 0; padding:0 0 3em 0; }
aside { float:right; width:220px; padding:0; margin:0; }
footer { display:block; position:relative; padding:10px 0; margin:0; background:#d9d9d9; top:136px; }
h1, h2 { display:block; padding:0 10px 5px 0; margin:0 0 10px 0; border-bottom: 1px solid #d9d9d9; clear:both; }
.search h2 { border:none; }
h2 a { font-size:0.85em; }
h3 { display:block; padding:10px 0; margin:0; font-size:1.2em; clear:both; }
p { display:block; padding:5px 0; margin:0; clear:both; }
article { display:block; padding:10px 0; margin:0; clear:both; border-bottom: 1px solid #d9d9d9; }
#a-propos h2 { margin:0 0 20px 0; }

header h1 { display:block; float:left; width:200px; height:75px; padding:0; margin:0; background:url(images/logo-mahi-mahi.png) left top no-repeat; text-indent:-999em; }
header h1 a { display:block; width:200px; height:75px; }
header h1 img { display:none; }
#skipLinks { float:right; clear:none; padding:30px 10px 0 0; margin:0; }
#skipLinks ul { list-style-type:none; padding:0; margin:0; }
#skipLinks li { border-right:1px solid #333; float: left; line-height:1.25em; margin:0 10px 0 0; padding:0 10px 0 0; font-size:0.9em; }
#skipLinks .last { border:none; margin: 0; padding:0; }
nav { display:block; clear:both; padding:10px 0 0 0; margin:0; }
nav ul { list-style-type:none; padding:0; margin:0; }
nav li { border-left:1px solid #333; float:left; margin:0 0 0 10px; padding:0 0 0 10px; line-height:1.25em; font-size:1.25em; }
nav li:first-child { border:none; margin:0; padding:0; }
nav a.current { color:#333; text-decoration:none; }

/* SINGLE */

.single img { height:auto; margin:.5em 0 0 0; max-width:100%; }

/* REFERENCES */
#portfolio { float: left; list-style:none; margin:0; padding:10px 0 0 0; }
#portfolio li { border:1px solid #d9d9d9; padding:10px; margin:0 0 10px 0; zoom:1; }
#portfolio img { display:block; float:left; margin:0; padding:0; }
#portfolio dl { display:block; padding:1em 0 0 0; margin:0; color:#333; font-size:.9em; }
#portfolio dt, #portfolio dd { display:block; float:left; padding:0 1em .5em 0; margin:0; font-weight:bold; text-align:right; width:7em; }
#portfolio dd { font-weight:normal; padding:0 0 .5em 0; text-align:left; width:20em; }
#portfolio dd a { white-space: pre; white-space: pre-wrap; white-space: pre-line; white-space: -pre-wrap; white-space: -o-pre-wrap; white-space: -moz-pre-wrap; white-space: -hp-pre-wrap; word-wrap: break-word; }

#aPropos, #whatWeDo, #realisations, #whoWeAre { display:block; clear:both; padding:0 0 60px 0; margin:0; }
#whatWeDo:after, #realisations:after, #whoWeAre:after, #portfolio li:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
#whoWeAre ul { list-style-type:none; padding:20px 0 0 0; margin:0; }
#whoWeAre li { display:block; padding:15px 0; margin:0; clear:both; border-bottom:1px dotted #d9d9d9; }
#whoWeAre li:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
#whoWeAre div { display:block; float:left; width:80px; padding:0; margin:0; }
#whoWeAre strong  { display:block; padding:0 0 5px 0; margin:0; }
#whoWeAre dl { float:left; padding:0; margin:0; }
#whoWeAre dt, #whoWeAre dd { float:left; padding:0 5px 0 0; margin:0; }
#whoWeAre dt { font-weight:bold; }
#whoWeAre p { display:inline; clear:none; }
.backToTop, #whoWeAre p.backToTop, .seeAll { display:block; clear:both; padding:10px 0; margin:0; text-align:right; }

/* COMMENT FORM */
#commentform p { margin:0; padding:0; }
#commentform { clear:both; display:block; padding:0 0 15px 0; margin:0; width:100%; zoom:1; }
#commentform:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
* html #commentform { height:1%; }
#commentform label { color:#666; cursor:pointer; display:block; font:normal 1em Arial, Verdana, sans-serif; margin:0; padding:0 0 5px 0; }
#commentform input { background:#edecec; border:1px solid #ccc; color:#000; font:normal 1em Arial, Verdana, sans-serif; height:30px; margin:0 0 10px 0; padding:4px 10px 0 10px; width:95%; }
#commentform textarea { background:#edecec; border:1px solid #ccc; color:#000; float:left; font:normal 1em Arial, Verdana, sans-serif; height:76px; margin:0; padding:4px 10px 0 10px; width:95%; }
#commentform input#submit { color:#000; cursor:pointer; font-size:1em; height:auto; margin:20px 0 0 0; padding:6px; text-align:center;  width:auto; }
#commentform label.error { display:none; }
#commentform .error { border-color:red; }

/* ERROR MESSAGE */
#errorMsg { background:url(images/bg_alert_msg.png) 10px 28px no-repeat #ffbaba; border:1px solid #d63301; color:#d8000c; margin:10px 0; padding:15px 10px 15px 50px; display:none; zoom:1; }
#usermessagea { display:none; }
* html #errorMsg  { height:1%; }
#errorMsg label { display:block; clear:both; padding:0; color:#d8000c; }
#errorMsg a { color:#d8000c; text-decoration:underline; }
#errorMsg  p { padding:0 0 5px 0; font-weight:bold; }

/* CONTACT */
#contact dl { padding:0; margin:0; }
#contact dt { float:left; width:45px; padding:0 5px 0 0; margin:0; clear:both; font-weight:bold; text-align:right; }
#contact dd { float:left; width:170px; padding:0; margin:0;}
#contact p strong, .street-address { display:block; }

/* SEARCH */
#search label { display:block; clear:both; position:absolute; left:-999em; }
#search #s { float:left; width:120px; height:18px; -webkit-appearance:textfield; }
#search #searchsubmit { float:left; border:none; padding:3px; margin:0.5em 0 0 1em; background:#c0c0c0; cursor:pointer; }

#contact, #search, #partners { display:block; clear:both; padding:15px 0; margin:0; }
#contact { padding:0 0 15px 0; }
#contact:after, #search:after, #partners:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }

/* NEWS */
#news ul, #news-articles ul { list-style-type: square; margin:0; padding:0 0 0 15px; }

/* FOOTER */
footer p { width:960px; margin:0 auto; padding:0; }

/* IE6 TRICKS */
body.ie6 { background-attachment:scroll; }
.ie6 header { position:static; }
.ie6 #main { height:1%; top:0; }
.ie6 footer { top:0; }
.ie6 #portfolio li{ margin-right:5px; }
.ie6 .clearfix, .ie6 ul#filter, .ie6 #content section, .ie6 #portfolio p a, .ie6 #aPropos, .ie6 #whatWeDo, .ie6 #references, .ie6 #whoWeAre, .ie6 #whoWeAre li, .ie6 #contact, .ie6 #search, .ie6 #partners  { height:1%; }

/* IE7 TRICKS */
.ie7 .clearfix, .ie7 header , .ie7 #main, .ie7 #content section, .ie7 nav, .ie7 ul#filter, .ie7 #aPropos, .ie7 #whatWeDo, .ie7 #references, .ie7 #whoWeAre, .ie7 #whoWeAre li, .ie7 #contact, .ie7 #search, .ie7 #partners  { zoom:1; }

/* MEDIA QUERIES */
@media (max-width: 767px) {
	body { -ms-text-size-adjust: none; -webkit-text-size-adjust: none; }
	#header, #container { width:93%; overflow:hidden; min-width:280px; }
	header { position:absolute; background-attachment:scroll; }
	header h1 { float:none; margin:0 auto; }
	#nav { text-align:center; }
	#nav li { float:none; display:inline-block; font-size:.7em; margin:0 0 0 .2em; padding:0 0 0 .4em; }
	#content, aside { border:none; float:none; margin:0; padding:0; width:100%; }	
	#portfolio img { display:block; float:none; margin:0 auto; height:auto; max-width:100%; }
	#portfolio dl { text-align:left; }
	#portfolio dt { float:left; text-align:right; padding:0 1% 0 0; width:25%; }
	#portfolio dd { float:left; width:74%; }
	#portfolio p a { text-align:left; padding:0 0 0 26%; }
	.single img { height:auto; margin:.5em 0 0 0; max-width:100%; }
	footer { background:#d9d9d9; width:100%; }
	footer p { text-align:center; width:auto; }
	.js footer { top:auto; }
	#skipLinks { display:none; }
}

@media (min-width: 768px) and (max-width: 1024px) {
	body { -ms-text-size-adjust: none; -webkit-text-size-adjust: none; }
	header { position:absolute; background-attachment:scroll; }
	#header, #container { width: 712px; }
	#nav { text-align:center; }
	#nav li { float:none; display:inline-block; }
	#content, aside { border:none; float:none; width:100%; }
	#portfolio img { height:auto; max-width:100%; }
	#portfolio dd { width:19em; }
	.single img { height:auto; margin:.5em 0 0 0; max-width:100%; }
	footer { background:#d9d9d9; width:100%; }
	footer p { text-align:center; width:auto; }
}

@media screen and (min-device-width : 800px) and (max-device-width : 1280px) {
	body { -ms-text-size-adjust: none; -webkit-text-size-adjust: none; }
	header { position:absolute; background-attachment:scroll; }
	#header, #container { width: 712px; }
	#nav { text-align:center; }
	#nav li { float:none; display:inline-block; }
	#content, aside { border:none; float:none; width:100%; }
	#portfolio img { height:auto; max-width:100%; }
	#portfolio dd { width:19em; }
	.single img { height:auto; margin:.5em 0 0 0; max-width:100%; }
	footer { background:#d9d9d9; width:100%; }
	footer p { text-align:center; width:auto; }	
}

/* PRINT */
@media print {
	#skipLinks, #nav, ul#filter, .backToTop, #footer { display:none; }
	h1 img { display:block; }
	#header { position:relative; top:0; }
	#main { top:0; }
	#references { page-break-after:always; }
	#sidebar { float:none; width:740px; clear:both; }
	#contact { position:relative; top:0; width:100%; }
}
