/*  
Theme Name: Ithaa 
Version: 2.1
Description: Avec corrections des vues iPhone et iPad.
Author URI: http://www.agnesfaravel.fr/
Author: Agnès Faravel
*/

/***************************
********* SOMMAIRE *********
****************************

1. RESET
2. POLICES DE CARACTERE
3. GENERALITES
     3.1. Styles de base
     3.2. Typographie
     3.3. Images
4. EN-TÊTE ET BARRE DE MENU
     4.1. En-tête
     4.2. Menu premier niveau
            4.2.1. Menu navigation
            4.2.2. Menu langues
            4.2.3. Menu pages, catégories, etc...
            4.2.4. Menu réseaux sociaux + icône search
     4.3 Menu second niveau
5. LES DIFFERENTS CONTENANTS ET CONTENUS
     5.1. Affichage de type mosaïque (index, archives, etc...)
            5.1.1. La mosaïque
            5.1.2. Pagination
     5.2. Affichage contenu des articles ou pages
            5.2.1. Format et typo
            5.2.2. Listes
            5.2.3. Citations et iframe
            5.2.4. Pied d'article + fonction Share
            5.2.5 Commentaires
            5.2.6. Page de recherche & archives
6. BARRE DE WIDGETS
7. CAROUSEL
8. FOOTER
9. ELEMENTS DIVERS

*****************************
*****************************/


/* 1. RESET */

	html, body, div, span, object, iframe,
	h1, h2, h3, h4, h5, h6, p, blockquote, pre,
	abbr, address, cite, code,
	del, dfn, em, img, ins, kbd, q, samp,
	small, strong, sub, sup, var,
	a, b, i,
	dl, dt, dd, ol, ul, li,
	fieldset, form, label, legend,
	input, textarea, button,
	table, caption, tbody, tfoot, thead, tr, th, td 

{background: transparent;border: 0;font-size: 100%;margin: 0;outline: 0;padding: 0;vertical-align: baseline;}

/* 2. POLICES DE CARACTERE */

@font-face {
font-family: 'FontAwesome';
src: url(fonts/fontawesome-webfont.eot?v=4.2.0);
src: url(fonts/fontawesome-webfont.eot?#iefix&v=4.2.0) format('embedded-opentype'), url(fonts/fontawesome-webfont.woff?v=4.2.0) format('woff'), url(fonts/fontawesome-webfont.ttf?v=4.2.0) format('truetype'), url(fonts/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular) format('svg');
font-weight: normal;
font-style: normal;
}

/* 3. GENERALITES */

/* 3.1. STYLES DE BASE */

body {
background: #fff;
color:#000;
font-size: 14px;
font-family:Times;
margin: 0px;
text-align:justify;
	}

#page {
width:1150px;
text-align: left; 
margin:0 auto ; 
	}

/* 3.2. TYPOGRAPHIE */

h1,h2 {font-weight:normal;text-transform:uppercase;text-align:center;color:#000;}
h1 {font-family:Lato;font-size:11px;}
h1.category a {color:#000;padding:5px;}
h2 {font-family:Times;font-size:17px;margin:0;}
h2.post {margin:15px 150px;padding:15px;border-bottom:1px solid #d6d6d6;}
h2.carousel-title {text-align:center;padding-top:30px;clear:both;}
h2.widget-title {padding-bottom:10px;}
h2.iphone, span.iphone {display:none;}

p{
line-height: 1.5em;
padding: 0 0 1.75em 0;
	}

a, a:visited{color: #000;font-style:normal;text-decoration:none;}	
a:link span.MsoHyperlink{text-decoration:none;}	
a[target=_blank] { text-decoration:none}


/* 3.3. IMAGES */

img {border: none;}
.aligncenter {display: block; margin: 0 auto 15px auto; }
.alignright {float: right; margin: 0 0 15px 0; }
.alignleft {float: left; margin:0 0 15px  0; }
.alignnone {float:none;clear:both;display:block;}
img.size-full{height:auto;width:100%;}		
img.wp-smiley, img.wp-smiley{height:13px;width:auto;vertical-align:-25%;}
	

/* 4. EN-TÊTE ET BARRE DE MENU */

/* 4.1. EN-TETE */

#header{ 
background:#fff;
width:100%;
text-align:center;
font-family:Times;
margin:0px auto;
top:0px;
z-index:999;
	}
	
#header img.logo {height:178px;margin:25px auto 40px;}
#header-mobile {display:none;}
#outer {position:relative;width: 100%;overflow:visible;}
#main{position:relative;width: 100%;overflow:visible;}


/* 4.2. MENU PREMIER NIVEAU */

/* 4.2.1. MENU NAVIGATION */

.nav {position:fixed;left:5%;top:8px;padding:0;display:inline;}
#menu-fix .nav a {padding:0 10px;}
.nav prev span {vertical-align:2px;padding-left:7px;}
.nav next span {vertical-align:2px;padding-right:6px;}
.nav prev:before {content:'\f104';font:normal 20px fontawesome;}
.nav next:after {content:'\f105';font:normal 20px fontawesome;}
.nav a {display:none;}
#menu .nav a {padding:0 10px;}

/* 4.2.2. MENU LANGUES */

ul.ppqtrans_language_chooser {z-index:99999;display:inline;width:100px;}
ul.ppqtrans_language_chooser li {display:inline;}
#menu-fix ul.ppqtrans_language_chooser {border-bottom:none;}
#menu-fix ul.ppqtrans_language_chooser li a {padding:9px 4px;color:#000;}
#menu-fix ul.ppqtrans_language_chooser li a:hover {color:#adadad;}
.ppqtrans_widget_end {display:none;}
ul.ppqtrans_language_chooser li:nth-child(1):after {content: '|';color:#000;font-size:14px;}
ul.ppqtrans_language_chooser li:nth-child(2):after {display:none;}
#menu-fix {
width:100%;
display:inline-block;
background:#eeeeee;
position:fixed;
top:0;left:0;
z-index:99;
text-align:center;
float:center;
}

/* 4.2.3. MENU PAGES, CATEGORIES, ETC... */

#menu-fix,#menu-fix ul {
text-align:center;
z-index:9999;
list-style:none;
font-weight:normal;
font-size:13px;
text-transform:uppercase;
float:center;
width:100%;
margin:0 auto;
height:39px;
padding:0;
border-bottom:1px solid #fff;
}

#menu-fix a,#menu-fix a:visited {
display:inline-block;
text-decoration:none;
border:none;
color:#000;
padding:11px 25px;
float:center;
margin:0;
}

#menu-fix a:hover {
display:inline-block;
text-decoration:none;
border:none;
color:#adadad;
}

#menu-fix li {
float:center;
list-style:none;
text-align:center;
display:inline-block;
padding:0;
}

/* 4.2.4. MENU RESEAUX SOCIAUX + ICONE SEARCH */

#menu-fix social {padding:0 35px;}
#menu-fix social li:after,#menu-fix li li:after {content:none;}
#menu-fix social li span {display:none;}

#menu-fix li a.facebook,#menu-fix li a.twitter,#menu-fix li a.rss,#menu-fix li a.instagram,#menu-fix li a.contact,#menu-fix li a.hellocoton,#menu-fix li a.googleplus,#menu-fix li a.pinterest,#menu-fix li a.youtube{
width:25px;
max-width:25px;
height:25px;
display:inline-block;
border-radius:100%;
transition:all .2s linear;
-moz-transition:all .2s linear;
-webkit-transition:all .2s linear;
-o-transition:all .2s linear;
margin:-5px 1px;
padding:0;
font: normal 18px FontAwesome;
}

#menu-fix social li:after {content:none;}

#menu-fix li a.facebook:hover,#menu-fix li a.facebook:focus,#menu-fix li a.twitter:hover,#menu-fix li a.twitter:focus,#menu-fix li a.rss:hover,#menu-fix li a.rss:focus,#menu-fix li a.instagram:hover,#menu-fix li a.instagram:focus,#menu-fix li a.contact:hover,#menu-fix li a.contact:focus,#menu-fix li a.hellotocon:hover,#menu-fix li a.hellocoton:focus,#menu-fix li a.googleplus:hover,#menu-fix li a.googleplus:focus,#menu-fix li a.pinterest:hover,#menu-fix li a.pinterest:focus,#menu-fix li a.youtube:hover,#menu-fix li a.youtube:focus {
transition:all .2s linear;
-moz-transition:all .4s linear;
-webkit-transition:all .2s linear;
-o-transition:all .2s linear;
}

#menu-fix li a.facebook:before {content:'\f09a';}
#menu-fix li a.twitter:before {content:'\f099';}
#menu-fix li a.instagram:before {content:'\f16d';}
#menu-fix li a.googleplus:before {content:'\f0d5';}
#menu-fix li a.contact:before {content:'\f0e0';font-size:17px;}
#menu-fix li a.pinterest:before {content:'\f0d2';}
#menu-fix li a.youtube:before {content:'\f167';}
#menu-fix li a.facebook:hover:before, #menu-fix li a.twitter:hover:before, #menu-fix li a.instagram:hover:before, #menu-fix li a.googleplus:hover:before, #menu-fix li a.contact:hover:before, #menu-fix li a.pinterest:hover:before, #menu-fix li a.youtube:hover:before {color:#adadad;}

.search:before {content: "\f002";color:#000;font-family:fontawesome;font-size:16px;}
.search:hover:before {color:#adadad;}

/* 4.3 MENU SECOND NIVEAU */

#menu-fix li ul {
position:absolute;
left:-999em;
margin-top:0;
height:auto;
float:left;
font-size:12px;
width:200px;
}

#menu-fix li li {
width:200px;
border-bottom:1px solid #fff;
background:#eeeeee;
}

#menu-fix li li a,#menu-fix li li a:visited {
color:#000;
width:200px;
padding:8px 0;
}

#menu-fix li li a:hover {border-top:none;color:#adadad;}

#menu-fix li:hover ul,#menu-fix li li:hover ul,#menu-fix li li li:hover ul,#menu-fix li.sfhover ul,#menu-fix li li.sfhover ul,#menu-fix li li li.sfhover ul {
left:auto;
margin-left:0px;
}

/* 5. LES DIFFERENTS CONTENANTS ET CONTENUS */

/* 5.1. AFFICHAGE DE TYPE MOSAIQUE (INDEX / ARCHIVES, ETC....) */

/* 5.1.1. LA MOSAIQUE */

#tumblr-style {width:85%;margin:0 auto;}
#sort {width:auto;margin:0 auto;}

.box {
	background:#FFF;
	margin-bottom:20px;
	width:300px;
	float:left;
	overflow:hidden;
	position:relative;
-webkit-transition: all 500ms ease; /*safari and chrome */
	-moz-transition: all 500ms ease; /* firefox */
	-o-transition: all 500ms ease; /* opera */
	transition: all 500ms ease;
text-align:justify;
}

.box img {width:100%; height:auto;}

.box .rollover {
width:280px;
height:500px;
background:rgba(255,255,255,.65);
position:absolute;
top:0;
left:0;
text-align:center;
opacity:0;
padding:10px;
-webkit-transition-duration:450ms;
-webkit-transition-delay:initial;
-webkit-transform:scale(1,1);
-moz-transition-property:initial;
-moz-transition-duration:450ms;
-moz-transition-delay:initial;
-moz-transform:scale(1,1);
transition-duration:450ms;
transition-delay:initial;
transform:scale(1,1);
}

.box .rollover h2, .box .rollover h1 {
-webkit-transition-duration:450ms;
-webkit-transition-delay:initial;
-webkit-transform:scale(0.75,0.75);
-moz-transition-property:initial;
-moz-transition-duration:450ms;
-moz-transition-delay:initial;
-moz-transform:scale(0.75,0.75);
transition-duration:450ms;
transition-delay:initial;
transform:scale(0.75,0.75);
}

.box .rollover a.background {
position:absolute;
top:0;
left:0;
display:block;
width:100%;
height:100%;
z-index:0;
line-height:1;
}

.box h2, .box h1 {
color:#000;
text-transform:uppercase;
text-align:center;
width:80%;
padding:0 10%;
}


.box .rollover h2 {position:absolute;top:50px;}
.box .rollover h1.cat {position:absolute;top:100px;left:0;}
.box .rollover h1.date {position:absolute;top:120px;left:0;}
.box .rollover h1.comm {position:absolute;top:140px;left:0;}

.box:hover .rollover, .box:hover .rollover h2 {
opacity:1;
}

.box:hover .rollover h2, .box:hover .rollover h1 {
-webkit-transform:scale(1,1);
-moz-transform:scale(1,1);
-transform:scale(1,1);
}

/* 5.1.2. PAGINATION */

.wp-pagenavi {padding:10px 0;text-align:center;font:normal 13px Lato;text-transform:uppercase;}

.wp-pagenavi a,.wp-pagenavi span {
color:#000;
margin-right:4px;
text-align:center;
text-decoration:none;
padding:3px 6px;
font-size:13px;
}

.wp-pagenavi a:hover {color:#000;}

.wp-pagenavi span.current {
font-family:Lato;
font-weight:900;
color:#000;
margin-right:4px;
padding:5px 7px;
}

/* 5.2. AFFICHAGE CONTENU DES ARTICLES OU PAGES */

/* 5.2.1. FORMAT ET TYPO */
#content { 
background:#fff;
text-align:justify;
font-family:Times;
padding:0 30px 30px;
width:900px;
margin:0 auto;
	}

#content p{
margin: 0px;
line-height: 18px;
padding: 0px 0px 15px 0px;
text-align:justify;
font-family:Times;
font-size:14px;
	}

#content a  {
	color: #adadad;
	text-decoration: none;
	}
#content a:hover{
	color: #adadad;
	font-style:normal;
	text-decoration:none;
	}	
#content h1.category a {color:#000;}
#content h2 a,#content h2 a:hover {color:#000;}
	

#content h5 {
color: #666;
font-family:Arial, times;
font-size:11px;
font-style: italic;
float:right;
font-weight:normal;
padding:0px 5px 10px 25px;
margin:0px;
width:300px;
	}

/* 5.2.2. LISTES */
#content ol {
	list-style-type: decimal;
	line-height: 18px;
	margin: 0px;
	padding: 0px 0px 10px 30px;
	}
#content ul {
	list-style: none;
	margin: 0px;
	padding: 0px 0px 10px 0px;
	}
	
#content li {
	margin: 0px;
	padding: 0px;
	}
	
#content ul li {
	list-style: none;
	margin: 0px 0px 0px 0px;
	padding: 5px 0px 0px 0px;
	}
	
#content ul li a {
	color: #000;
	text-decoration: none;
	}

#content ul li a:hover{
color: #adadad;
}

/* 5.2.3. CITATIONS + IFRAME */

blockquote{
	margin: 0px 0px 0px 15px;
	padding: 0px 25px 0px 10px;
	font-style: italic;
	color: #666;
	border-left: 1px dotted #adadad;
	}
	
#content blockquote p{
	margin: 0px 0px 20px 0px;
	padding: 0px;
	}

iframe {width:900px; height: 507px;}

/* 5.2.4. PIED D'ARTICLE + FONCTION SHARE */
#post-footer {border-top:1px solid #d6d6d6;padding:15px;margin-bottom:20px;}

#content ul.share {float:left;list-style-type: none;margin-top:-3px;position: relative;text-align:leftt;padding:0;display:block;}
#content ul.share li{display: inline-block;padding:0;margin-top:1px;opacity:1;-webkit-transition: all 500ms ease;-moz-transition: all 500ms ease;-o-transition: all 500ms ease;transition: all 500ms ease;padding-right:3px;}
#content ul.share li:hover {opacity:.5;-webkit-transition: all 500ms ease;-moz-transition: all 500ms ease;-o-transition: all 500ms ease;transition: all 500ms ease;}		


.share li a.facebook:before {
font: normal 18px FontAwesome;
content:'\f09a';
}
.share li a.pinterest:before {
font: normal 18px FontAwesome;
content:'\f0d2';
}
.share li a.twitter:before {
font: normal 18px FontAwesome;
content:'\f099';
}
.share li a.googleplus:before {
font: bold 15px FontAwesome;
content:'\f0d5';
}
.share li a.mail:before {
font: normal 17px FontAwesome;
content:'\f0e0';
}


/* 5.2.5. COMMENTAIRES */
	
#bloc-comment {margin:0 10.87% 30px;}	
a#show-comments span { font-size:14px;}
ol.commentlist {margin:0 0 1em; padding:0; text-indent:0;padding-left:20px;font-size:14px;}
ol.commentlist li { min-height:65px;}
ol.commentlist li.alt { }
ol.commentlist li.bypostauthor {}
ol.commentlist li.byuser {}
ol.commentlist li.comment-author-admin {}
ol.commentlist li.comment, ol.commentlist li.pingback {border-bottom:1px solid #d6d6d6;padding:20px;}
ol.commentlist .vcard { text-transform:uppercase;font-style:normal; }
ol.commentlist .vcard cite.fn { font-style:normal; }
ol.commentlist li.pingback span.says {display:none;}
ol.commentlist li.comment div.vcard,ol.commentlist li.pingback div.vcard {font:normal 11px Lato;}
ol.commentlist li.comment div.vcard cite.fn a.url {}
ol.commentlist li.comment div.vcard img.avatar { border-radius:100%;display:inline;float:left;margin-right:10px;padding:2px;border:1px solid #ececec;background:#fff; }
ol.commentlist li.comment div.vcard img.avatar-32 {}
ol.commentlist li.comment div.vcard img.photo {}
ol.commentlist li.comment div.vcard span.says {display:none;}
ol.commentlist li.comment div.commentmetadata {}
ol.commentlist li.comment div.comment-meta, ol.commentlist li.pingback div.comment-meta { font-size:12px;padding-bottom:15px;}
ol.commentlist li.comment div.comment-meta a, ol.commentlist li.pingback div.comment-meta a { color:#555; }
ol.commentlist li.comment p { font-size:14px; margin:0 0 1em; }
ol.commentlist li.comment ul { font-size:14px; list-style:square; margin:0 0 1em 2em; }
ol.commentlist li.comment div.reply,ol.commentlist li.pingback div.reply { font-size:12px; }
ol.commentlist li.comment div.reply a,ol.commentlist li.pingback div.reply a { font-weight:bold; }
ol.commentlist li.comment ul.children { list-style:none; margin:1em 0 0; text-indent:0; }
ol.commentlist li.comment ul.children li {}
ol.commentlist li.comment ul.children li.alt {}
ol.commentlist li.comment ul.children li.bypostauthor {}
ol.commentlist li.comment ul.children li.byuser {}
ol.commentlist li.comment ul.children li.comment {}
ol.commentlist li.comment ul.children li.comment-author-admin {}
ol.commentlist li.comment ul.children li.depth-2 {padding:0 20px;margin:0 0 .5em .5em;border-bottom:none; }
ol.commentlist li.comment ul.children li.depth-3 {padding:0 20px;margin:0 0 .5em .5em;border-bottom:none; }
ol.commentlist li.comment ul.children li.depth-4 {padding:0 20px;margin:0 0 .5em .5em;border-bottom:none; }
ol.commentlist li.comment ul.children li.depth-5 {padding:0 20px;margin:0 0 .5em .5em;border-bottom:none;}
ol.commentlist li.comment ul.children li.odd {}
ol.commentlist li.even { background:transparent; }
ol.commentlist li.odd { background:transparent; }
ol.commentlist li.parent {padding:20px;}
ol.commentlist li.thread-alt { }
ol.commentlist li.thread-even {}
ol.commentlist li.thread-odd {}	

input[type=submit] {padding:5px 10px;margin-left:5px;font-size:12px;border:none;background:#000;color:#fff;text-transform:uppercase;}
input#searchbtn[type=submit] {padding:5px 10px;margin-left:-25px;font-size:12px;border:none;background:none;color:#fff;text-transform:uppercase;}
input#url {background:#fff;box-shadow: 0 2px 2px #E5E5E5 inset;border:1px solid #d6d6d6;width:33%;}	
input#author {background:#fff;box-shadow: 0 2px 2px #E5E5E5 inset;border:1px solid #d6d6d6;width:33%;}	
input#email {background:#fff;box-shadow: 0 2px 2px #E5E5E5 inset;border:1px solid #d6d6d6;width:33%;}	
textarea#comment {background:#fff;box-shadow: 0 2px 2px #E5E5E5 inset;border:1px solid #d6d6d6;width:70%;}	
input[type=text],input[type=email],textarea {background:#fff;box-shadow: 0 2px 2px #E5E5E5 inset;border:1px solid #d6d6d6;padding:.5em;}	
label {font:normal 11px Lato;text-transform:uppercase;color:#000;min-width:100px;display:inline-block;vertical-align:top;}
label#form {display:block;padding:1em 0;}
input#mc4wp_email {width:100%;}
#content .mc4wp-alert p, ul.widget .mc4wp-alert p{padding-top:1em;text-align:center;}
ul.widget label#form {display:none;}

/* 5.2.6. PAGE DE RECHERCHE & ARCHIVES */

.advanced-search{
display:inline;
}
.advanced-search li{
display:inline;
padding:10px 30px;
color: #666;
	font-size: 12px;
	font-weight:normal;
	font-family:Times;
	font-style:normal;
	margin: -1px 0px 7px 0px;
	text-transform:uppercase;
	}
	

.search li{
display:inline;
padding:10px 25px;
width:180px;
height:30px;
font-size: 15px;
font-family: Times;
line-height:100%;
color:#000;	
	font-style:normal;
	margin: 0px 0px 12px 20px;
	float:left;
	text-align:center;
	}
	
.search li a:hover{
color:#f90acf;	
	}		
	
#archive {width:900px;height:auto;padding:0 20px 20px;}	
.archives {padding: 0 0 40px 0; float: left; width: 350px;text-transform:uppercase;}
#archive.archives ul {margin: 0;}
#archive.archives li {margin: 0; padding: 0;}
#archive.archives li a{ border-left: 1px solid #a69f96; padding: 5px 0 3px 10px; margin: 0 0 0 200px; display: block;}
#archive.archives li.archive-year{float: left;font:bold 75px Helvetica-Light; padding: 5px 0 3px 10px;}
#archive.archives li.archive-year a{color:#000; margin:0 0 -70px 0; border: 0px; padding: 0;}

#content ul.tag {padding:20px 0;}
ul.tag li {display:inline;}


/* 6. BARRE DE WIDGETS */

.grey {width:80%;background:#eeeeee;padding:10px 10%;margin:auto;}

ul.widget {display:inline-block;width:29.33%;padding:10px 2%;vertical-align:top;}
ul.widget img {height:auto;max-width:100%;text-align:center;display:block;margin:auto;} 

/* 7. CAROUSEL */

#carousel {
position:relative;
}

.stepcarousel{
position: relative; 
overflow: scroll; 
width: 1050px; 
height: 300px;
margin:0 auto;
}

.stepcarousel .belt{
position: absolute; 
left: 0;
top: 0;
margin-top:20px;
}

.stepcarousel .panel{
float: left; 
overflow: hidden; 
margin:0 30px; 
width: 225px; 
height:300px;
text-align:center;text-transform:uppercase;
font:normal 11px Lato;
float:center;
}

.panel p {margin:0; padding: 0}
.panel img {width:auto;height:150px;max-width:225px;overflow:hidden;margin:0 auto 20px auto;text-align:center;}
.belt br {display:none;}


/* 8. FOOTER */
#footer {
width:100%;
background:#eeeeee;
padding:0 0 30px;
text-align: center;
clear: both;
font-size:11px;
text-transform:uppercase;
color:#000;
position:relative;
}

/* 9. ELEMENTS DIVERS */

#searchform {
background:#ffffff;
padding:0px;
width:300px;
font-family:times;
color:#adadad;
}

.scrollToTop {
position:fixed;
right:38px;
bottom:38px;
display:none;
color:#000;
background:#eeeeee;
padding:14px 10px;
text-transform:uppercase;
border:2px solid #fff;
}

.scrollToTop:after {content: "\f106";font-family:fontawesome;font-size:16px;padding-left:5px;}

.connect:before {color: #000;display: inline-block;font-style: normal;font-size: 30px;font-weight: normal;font-variant: normal;text-align: center;text-transform: none;padding:10px 25px 0;content:'\f023';font-family:fontawesome;}
.connect {position:fixed;bottom:5px;left:5px;opacity:.5;z-index:9999;}
.connect:hover {opacity:.8;}

.four {width:30%;margin-right:5%;display:inline-block;float:left;}
.four img {width:100%;height:auto;}
.four:nth-child(3) {margin-right:0;}

.wpfblike {padding-top:.75em;}