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

/* DEFAULT DEFINITION */
html { margin:0; padding:0; }
body { margin:0; padding:0; font:85% "Trebuchet MS", Lucida, Arial, Geneva, Verdana, "Lucida Grande", Tahoma, Helvetica, sans-serif;
; color:#333; background:url(images/bg.png) left top repeat-x; }
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; }
.alignright { float:right; }
mark { background:none; }

/* LAYOUT */
#container { display:block; width:1000px; padding:0; margin:0 auto; }
header { display:inline-block; display:block; padding:0; margin:0; width:1000px; height:136px; }
header:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
#main { display:inline-block; display:block; padding:0; margin:0; background:url(images/dot_grey.png) 760px 0 repeat-y #fff; }
#main:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
#content { float:left; width:740px; 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; }
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; }

/* REFERENCES */
#filter { display:none; list-style-type:none; margin:0; clear:both; padding:10px 0 10px 15px; }
#filter:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
#filter li { line-height:1.2em; margin:0 8px 0 0; padding:0 8px 0 0; }
#filter a { color:#0066aa; text-decoration: none; }
#filter .current a, #filter a:hover { text-decoration: underline; }
#filter li.current a { color:#333; }
#portfolio { float: left; list-style:none; margin:0; padding:10px 0 0 0; }
#portfolio li { border:1px solid #d9d9d9; float:left; width:334px; padding:10px; margin:0 10px 10px 0; position:relative; cursor:pointer; }
#portfolio a { display: block; width:100%; }
#portfolio a:hover { text-decoration:none; }
#portfolio img { display:block; height:113px; padding-bottom:5px; }
#portfolio dl { position:relative; left:0; top:0px; width:324px; height:53px; overflow:hidden; padding:30px 5px; margin:0; color:#333; font-size:0.85em; display:block; background:#dedede; cursor:pointer; }
#portfolio dt { float:left; width:90px; padding:0 10px 0 0; margin:0; font-size:1.2em; clear:both; text-align:right; font-weight:bold; }
#portfolio dd { float:left; width:224px; padding:0; margin:0; }
#portfolio p { padding:5px; margin:0; text-align:right; background:#fff; }
#portfolio p a { display:block; color:#0066aa; background:#fff; }
#portfolio p a:hover { text-decoration:underline; }

#aPropos, #whatWeDo, #realisations, #whoWeAre { display:block; clear:both; padding:0 0 60px 0; margin:0; }
#whatWeDo:after, #realisations:after, #whoWeAre: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 { 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:528px; }
#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:528px; }
#commentform input#submit { color:#000; cursor:pointer; font-size:1em; height:auto; margin:20px 0 0 0; padding:6px; text-align:center;  width:auto; }

/* 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; }
#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:1000px; margin:0 auto; padding:0; }

/* HASJS */
body.hasJS { background-attachment:fixed; }
* html body.hasJS { background-attachment:scroll; }
.hasJS header { position:fixed; top:0; z-index:10; background:url(/wp-content/themes/mahi-mahi/images/bg.png) left top repeat-x #fff; }
.hasJS #main { position:relative; top:136px; z-index:1; }
.hasJS #portfolio dl { position:absolute; left:-999em; top:10px; width:324px; height:63px; overflow:hidden; padding:25px 5px; margin:0; color:#333; font-size:0.85em; display:block; background:#dedede; cursor:pointer; }
.hasJS #filter { display:block; }
.hasJS #filter li { border-right: 1px solid #d9d9d9; float:left; }
.hasJS #filter li.last { border:none; margin: 0; padding: 0; }
.hasJS footer { top:136px; }

/* 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 only screen and (orientation:portrait){
	 .ios header, .ios #container, .ios #content, .ios aside { clear:both !important; float:none !important; display:block !important; width:98% !important; min-width:0 !important; max-width:auto !important; }
	 .ios #skipLinks { display:none; } 
	 .ios #main { background:none; }
	 .ios #content, .ios aside { width:100% !important; }
	.ios h1 { float:none; margin:0 auto; }
	.ios #filter { display:none; }
	.ios nav { padding:15px 0 0 0; }
	.ios nav li { font-size:x-small; margin:0 0 0 0.5em; padding:0 0 0 0.5em; } 
	.ios #portfolio li { border-bottom: 1px solid #d9d9d9; margin:0 0.5em 0.5em 0; padding:0 0 0.5em 0; width:95%; }
	.ios #portfolio img { display:block; height:7em; margin:0.5em auto; width:21em; }
	.ios #portfolio a { text-align:right; width:98%; }
	.ios #portfolio a:hover { text-decoration: none; }
	.ios #portfolio dl { color: #333; }
	.ios #portfolio dt { float:left; padding:0 0.5em 0 0; font-weight:bold; width:30%; }
	.ios #portfolio dd { float:left; width:65%; }
	.ios #portfolio p a { color: #0066aa; }
	.ios #portfolio p a:hover { text-decoration: underline; }
	.ios #portfolio dl { background:none; left:0; height:auto; position:static; width:95%; padding:0.5em; }
	.ios #contact dt { width:15%; }
	.ios #contact dd { width:80%; }
	.ios #whoWeAre dl { width:50%; }
	
	 .ipad { overflow-x:hidden; }
	 .ipad header, .ipad #container, .ipad #content, .ipad aside { clear:both !important; float:none !important; display:block !important; width:98% !important; min-width:0 !important; max-width:auto !important; }
	 .ipad #skipLinks { display:none; } 
	 .ipad #main { background:none; }
	 .ipad #content, .ipad aside { width:100% !important; }
	.ipad h1 { float:none; margin:0 auto; }
	.ipad nav { padding:15px 0 0 0; }
	.ipad nav ul { text-align:center; }
	.ipad nav li { font-size:medium; margin:0 0 0 0.5em; padding:0 0 0 0.5em; } 
	.ipad #portfolio li { border-bottom: 1px solid #d9d9d9; margin:0 0.5em 0.5em 0; padding:0 0 0.5em 0; height:230px; overflow:hidden; }
	.ipad #portfolio img { display:block; height:7em; margin:0.5em auto; width:21em; }
	.ipad #portfolio a { text-align:right; width:98%; }
	.ipad #portfolio a:hover { text-decoration: none; }
	.ipad #portfolio dl { color: #333; }
	.ipad #portfolio dt { float:left; padding:0 0.5em 0 0; font-weight:bold; width:30%; }
	.ipad #portfolio dd { float:left; width:65%; }
	.ipad #portfolio p a { color: #0066aa; }
	.ipad #portfolio p a:hover { text-decoration: underline; }
	.ipad #portfolio dl { background:none; left:0; height:auto; position:static; width:95%; padding:0.5em; }
	.ipad #contact dt { width:10%; }
	.ipad #contact dd { width:80%; }
	.ipad #whoWeAre dl { width:50%; }
	.ios footer p { width:auto; }
}

@media only screen and (orientation:landscape){
	.ios #skipLinks { display:none; } 
	.ios header, .ios #container, .ios #content, .ios aside { clear:both !important; float:none !important; display:block !important; width:98% !important; min-width:0 !important; max-width:auto !important; }
	.ios #content, .ios aside { width:100% !important; }
	.ios #main { background:none; }
	.ios { overflow-x:hidden; }
	.ios h1 { float:none; margin:0 auto; }
	.ios #filter { display:none; }
	.ios nav { padding:15px 0 0 0; }
	.ios nav ul { text-align:center; }
	.ios nav li { display:inline; float:none; font-size:small; margin:0 0 0 0.5em; padding:0 0 0 0.5em; } 
	.ios #portfolio li { border-bottom: 1px solid #d9d9d9; margin:0 0.5em 0.5em 0; padding:0 0 0.5em 0; width:95%; }
	.ios #portfolio img { display:block; height:8em; margin:0.5em auto; width:25em; }
	.ios #portfolio a { text-align:right; width:98%; }
	.ios #portfolio a:hover { text-decoration: none; }
	.ios #portfolio dl { color: #333; }
	.ios #portfolio dt { float:left; padding:0 0.5em 0 0; font-weight:bold; width:30%; }
	.ios #portfolio dd { float:left; width:65%; }
	.ios #portfolio p a { color: #0066aa; }
	.ios #portfolio p a:hover { text-decoration: underline; }
	.ios #portfolio dl { background:none; left:0; height:auto; position:static; width:95%; padding:0.5em; }
	.ios #contact dt { width:15%; }
	.ios #contact dd { width:80%; }
	.ios #whoWeAre dl { width:50%; }
	.ios footer p { 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%; }
}