/*
Theme Name: Oeil de la photographie
Theme URI: http://www.loeildelaphotographie.com/
Description: Oeil de la photographie
Version: 1.0
Author: Nouma Faten
Author URI: N.I
Text Domain: oeil-photographie
*/
/*==================*
* Default css
*===================*/

@import url('font/genericons/genericons.css');
@import url('font/oeil/style.css');
@import url('css/fonts.css');


* { padding: 0; margin: 0;}
a {text-decoration: none;color: #000;}
body {}

h1 {font-size: 2em;}
h2 {font-size: 1.8em;}
h3 {font-size: 1.5em;}
h4 {font-size: 1.2em;}
.clear {clear: both}
/* Clear Fix */

.clearfix:before,
.clearfix:after { content: " "; display: table;}
.clearfix:after {clear: both;}
.clr,.clear { clear: both;}
footer ul, #header ul { list-style: none;}
h2.legend {
    text-transform: uppercase
}

.bold{ font-weight: bold;}
strong{ font-family: 'clearsansbold'; }

img.aligncenter{ display: block; margin: 0 auto; }
img.alignright { float: right; margin-left: 10px; }
img.alignleft { float: left; margin-right: 10px; }

#content ul, #content ol{ padding-left: 40px; }

#content > .container{ padding: 0; }

/* BG */
.grisbg{ background: #1a1a1a;}
/*=============*
* Grid system
*============ */
/* >>> Grid view */

.grid {} .grid:after,
         .mobileGrid:after {
             content: ".";
             display: block;
             clear: both;
             visibility: hidden;
             line-height: 0;
             height: 0;
         }
.grid > [class^=cell],
.mobileGrid > [class^=cell] {
    float: left;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}
.grid.expanded {
    margin: 0 -4px;
}
.grid.expanded > [class^=cell] {
    padding: 0 4px;
}
.rtl .grid > [class^=cell] {
    float: right;
}
.tableGrid {
    display: table;
    width: 100%;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}
.tableGrid > [class^=cell] {
    float: none;
    display: table-cell;
    vertical-align: top;
}
.cell2 {
    width: 16.6666%;
}
.cell20 {
    width: 20%;
}
.cell3 {
    width: 25%;
}
.cell4 {
    width: 33.3333%;
}
.cell5 {
    width: 41.6666%;
}
.cell6 {
    width: 50%;
}
.cell7 {
    width: 58.3333%;
}
.cell8 {
    width: 66.6666%;
}
.cell9 {
    width: 75%;
}
.cell12 {
    width: 100%;
}
.cellLeft {
    width: 500px;
}
.cellRight {
    width: 390px;
}
.boxContent {
    padding: 32px;
}
/* >>> !Grid view */
/*===========*
* Global
*===========*/

#homeTitle{font-weight: normal;}

.container-fluid {
    width: 100%
}
.container {
    max-width: 1232px;
    margin: 0px auto;
    padding: 16px;
}
.container:before,
.container:after { content: " "; display: table;}
.container:after {clear: both;}
.img-responsive {
    max-width: 100%;
    display: block
}
.border-bottom {
    border-bottom: 1px solid #000
}
.container-content {
    max-width: 1075px;
    margin: 0 auto
}
.site-content {
    padding: 10px 10px 18px;
}
.hidden-mobile {} .hidden-desktop {
                      display: none
                  }
.no-display {
    display: none
}
/*=================*
 * Header
 *=================*/

#header {
    position: relative;
    padding-top: 38px;
}
.header-links {
    max-width: 1075px;
    position: relative;
    text-align: right;
    right: 10px;
    width: 1075px;
}
.border-top {
    border-top: 1px solid #000;
    clear: both;
}
.header-navigation {
    margin: 0 auto;
    padding: 10px 0px;
    max-width: 1075px;
    height: 177px;
    margin-bottom: 20px
}
.search-block {
    padding: 40px 0px 34px 0px; min-height: 150px;
}
.hearder-menu-right {
    float: right;
   
        display: table;
}
ul.header-menu {
    overflow: hidden;
    display: table-cell;
}
ul.header-menu li {
    float: left;

}
ul.header-menu li:last-child,
ul.switch-language li:last-child ,
ul.qts-lang-menu li:last-child {
    margin-right: 0px;
}
ul.switch-language li ,
ul.qts-lang-menu li {
    float: left;
   padding: 0 8px;
  border-right: 1px solid #fff;
}
ul.switch-language li:last-child,
ul.qts-lang-menu li:last-child { 
  border-right: 0px ;
}
ul.switch-language li.active a ,
ul.qts-lang-menu li.current-menu-item a {
    color:#999999;
}
ul.switch-language li img ,
ul.qts-lang-menu li img {
    vertical-align: middle
}
ul.header-menu li a,
ul.switch-language li a ,
ul.qts-lang-menu li a {
    display: block;
    /*line-height: 35px;*/
    color: #fff;
    font-size: 12px;
    text-decoration: none;
    text-transform: uppercase;
    font-family: clearsansregular;
}
ul.header-menu li.active ul{position: relative;overflow:hidden}
ul.header-menu li.active ul li {background: #ffffff;width: 100%;}
ul.header-menu li.active ul li a{color:#000}
ul.header-menu li a{padding: 0px 17px}
ul.header-menu li:last-child a{padding-right: 10px}
ul.header-menu li:last-child i.genericon-collapse {
    -ms-transform: rotate(90deg);
    /* IE 9 */

    -webkit-transform: rotate(90deg);
    /* Chrome, Safari, Opera */

    transform: rotate(90deg);
    vertical-align: middle;
}
ul.switch-language ,
ul.qts-lang-menu {
      display: table-cell;
      padding: 10px 0;
}
.qts_lang_item{
  margin-top: 0px !important;
  margin-bottom: 0px !important;
}
ul.social {
    background-color: #3d3d3d;
    float: right;
    list-style-type: none;
    display: none;
}
ul.social li {
    display: block;
    float: left;
    list-style-type: none;
    margin: 0px 9px 0 9px;
    line-height: 33px;
    max-width: 105px;
}
ul.social li a i.genericon {
    vertical-align: middle;
    font-size: 17px
}
ul.social li a {
    color: #fff;
    text-decoration: none;
    font-size: 14px;
}
ul.social li:last-child a {
    font-family: clearsansregular;
    font-size: 10px;
    text-transform: uppercase;
}
ul.social li:last-child {
    line-height: 10px;
    margin-top: 6px;
}
.navbar {
    background: #000;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}

.headerContainer {
    padding: 0 0px 0px 56px;
    box-sizing: border-box;
}
.padding-tb {
    padding-top: 10px;

}
ul.switcher-language {
    margin: 0px;
    padding: 0px;
}
ul.switcher-language li {
    display: inline-block;
}
ul.switcher-language li a {
    color: #fff;
    font-family: latoregular;
    margin-right: 5px;
    font-size: 0.75em
}
.logo-table{ float:left; padding-bottom: 10px;}

/*===============*
* Sidebar
=================*/

.sidebar {
    clear: both;
    width: 100%;
}
.sidebar-content {
    width: 1200px;
    margin: 0 auto;
}
.rightSide {
    float: right;
    width: 312px;/*200px*/
}
.mainContent {
    margin-right: 370px;/*220px*/
}
/*===============*
* Footer
=================*/

.footer-container {
    padding: 30px 0 0;
}

.footerContainer {
    padding: 0;
}

ul.footer-menu li {
    display: inline-block
}
ul.footer-menu li a {
    color: #fff;
    text-decoration: none;
    border-right: 1px solid #fff;
    padding: 0px 10px;
    font-family: 'clearsansbold';
    font-size: 12px;
    text-transform: uppercase
}

ul.footer-menu li:nth-child(4) a {
    border: none;
}

ul.footer-menu li a:hover {
    text-decoration: underline;
}

.footer-content {
    width: 1200px;
    margin: 0 auto;
    padding: 10px 0px;
}
.footer-bar {
    background: #b3b3b3;
    margin-top: 30px;
    text-align: center;
    padding: 5px 0px
}
/*==============*
* Search bar
*==============*/

#searchbar {
    width: 200px;
    float: left;
    margin: 22px 0 0 185px;
}
#s, .speedSerach .keyword {
    height: 60px;
    width: 100%;
    padding: 2px 2px 0 5px;
    color: #000;
    border: 1px solid #000;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    font-size: 26px;
    -moz-box-sizing: border-box;
    font-family: 'oswaldextralight';
    font-weight: normal;
    padding-left: 20px;
    
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    appearance: none;
    border-radius: 0;
}
.search-box {
    position: relative; width: 300px; /*float: right;*/ margin-left: auto;
}
#searchsubmit {
    /*
    border: none;
    position: absolute;
    right: 9px;
    padding:0px;
    top: 19px;
    height: 26px;
    width: 26px;
    vertical-align: middle;
    background: #fff url("images/search-icon.jpg") no-repeat;
    */
    /**/
    
    border: 1px solid #000;
    position: absolute;
    border-left: none;
    top: 0;
    right: 0;
    padding:0px;
    background: #fff url("images/search-icon.jpg") no-repeat center;
    width: 60px;
    height: 60px;
    vertical-align: middle;    
    
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    appearance: none;
    border-radius: 0;
    
}
/*===============*
* Menu
=================*/

#menu {
    position: relative;
    float: right;
    /*margin: 0 0 0 150px;*/
}
#menu .menu-header,
div.menu {
    font-size: 14px;
    font-weight: bold;
}
#menu .menu-header ul,
div.menu ul {
    list-style: none;
    margin: 0;
}
#menu .menu-header li:hover {}
#menu .menu-header li, div.menu li {float: left; margin: 0 44px 0 0;}
#menu .menu-header,
.menu {
    font-size: 14px;
    font-weight: bold;
}
#menu .menu-header ul,
.menu ul {
    list-style: none;
}
#menu .menu-header li:hover a {
    border-bottom: 5px solid #000;
}
#menu .menu-header li,
.menu li {
    float: left;
    margin: 0 35px 0 0;
      z-index: 999999;
}
#menu .menu-header li:last-child {
    margin-right: 0px
}
#menu a {
    display: block;
    font-family: oswaldextralight;
    font-size: 25px;
    color: #000;
    border-bottom: 5px solid #fff;
    text-transform: uppercase;
    text-decoration: none;
    font-weight: normal;
}
#menu ul ul {
    border-radius: 0px;
    padding: 0;
    position: absolute;
    top: 100%;
    display: none;
}
#menu ul ul li {
    float: none !important;
    background: #f2f2f2;
    position: relative;
    margin: 0px !important;
}
.header-menu ul ul li {
    float: none ;
    background: #f2f2f2;
    position: relative;
}
#menu ul ul li a {
    padding: 15px;
    color: #000;
    font-size: 0.95em;
    border-bottom: 1px solid #000 !important;
    
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

#menu ul ul li a:hover {
    background-color: #1a1a1a;
    color: #fff;
} 

ul.sub-menu li a {
    padding: 15px;
}

#menu ul ul ul {
     position: absolute;
     left: 100%;
     top: 0;
}
#menu ul ul li {
    width: 120px;
    background: #f2f2f2;
    margin: 0px;
}
#menu ul ul ul {
    left: 100%;
    top: 0;
}
#menu ul ul a {
    line-height: 1.2em;
    padding: 10px;
    height: auto;
}
#menu li:hover > a,
#menu ul ul:hover > a { color: #000; border-color: #000; text-shadow: none; }

#menu ul li:hover > ul { display: block; }
/*
#menu ul li.current_page_item:first-child > a,
#menu ul li.current-menu-ancestor:first-child > a,
#menu ul li.current-menu-item:first-child > a,
#menu ul li.current-menu-parent:first-child > a {
    color: #000; border-color: #000; text-shadow: none;
}
*/

.header-menu li ul {border-radius: 0px;
    padding: 0;
    position: absolute;
    top: 34px;
    display: none;}
.header-navigation .showMenu {
    display: none;
    background: url("images/toggle-menu.png")no-repeat center center;
    font-size: 1.2em;
    border: none;
    height: 66px;
    float: right;
    position: absolute;
    width: 50px;
    right: 15px;
}
.header-navigation .navtoogle.active {
    background: url("images/close.png")no-repeat center center;
}
#header .headerContainer{border-bottom: 1px solid #000}
#header .container{ padding: 0; }
.headerBox{ margin-left: 298px; }
/*===================*
* Top  Slider
*===================*/

.slider-container {
    background: #1a1a1a;
    height: 500px;
}
.slider-block h2 {
    text-align: center;
    font-family: serif, sans-serif
}
.slider-block .cell6 {
    text-align: center;
}
.slider-block div.inactive {
    color: #7f7f7f
}
.slider-block .slider {
    padding: 0 60px 30px 60px
}
.slider-block .slider-text {
    font-size: 1.1em;
    padding-bottom: 30px
}
.slider a.slider-link {
    color: #7f7f7f;
    text-decoration: none;
    font-weight: bold;
    font-size: 0.8em;
    text-transform: uppercase;
}
.slider a.slider-link span.genericon-next {
    vertical-align: middle
}
.edition-bloc {
    width: 250px;
    margin: 0 auto;
}
.edition-bloc span.edition-span {
    color: #7f7f7f;
    font-size: 0.7em;
    display: block;
    background-color: #fff;
    position: relative;
    text-transform: uppercase;
    text-align: left;
    top: 13px;
    width: 88px;
    height: 20px;
}
.edition-bloc .edition-box {
    border: 1px solid #b3b3b3;
    padding: 20px 0px;
    font-size: 1.1em;
    text-align: center;
}
.edition-bloc .edition-box .genericon-collapse {
    -ms-transform: rotate(-90deg);
    /* IE 9 */

    -webkit-transform: rotate(-90deg);
    /* Chrome, Safari, Opera */

    transform: rotate(-90deg);
    color: #000;
    font-size: 1.2em;
    vertical-align: middle;
    position: relative;
    right: 20px;
}
.dailynews-slider {
    background: #1a1a1a
}

.rightSide .lineTitle.widthCenter{ width:auto; margin:0 auto 32px;}
.rightSide .photoJour { padding: 2px 30px 20px;}
.rightSide .photoJour .pj-cont{ border-top:none; padding-top:0;}
/*==================*
*  Collapse
*=================*/

#collapse {
    padding: 0px 10px
}
#collapse h3 {
    background-color: #fff;
    padding-right: 23px;
    box-sizing: content-box
}
#collapse .last-cell h3 {
    padding-right: 0px
}
.cell-collapse {
    float: left;
    width: 15%;
}

.cell-collapse p a {
    color: #333;
    font-family: 'clearsansregular';
    font-size: 13px;
}

.cell-collapse p a:hover {
    text-decoration: underline;
}

.cell-collapse.last-cell {
    width: 25%
}
#collapse h3+div {
    display: block
}
.social.footer-social-link {
    background: none;
    display: block
}
ul.social.footer-social-link li a {
    color: #000
}
ul.social.footer-social-link li {
    margin: 0px 10px 0px 0px;
    line-height: 21px
}
ul.social.footer-social-link li:last-child {
    margin: 0px;
    line-height: 10px
}
#collapse h3 span , #collapse h3 {
    border-bottom: 2px solid #e6e6e6;
    color: #000;
    display: block;
    text-transform: uppercase;
    font-family: oswaldregular;
    font-size: 16px;
    font-weight: normal;
    margin: 0;
    padding-bottom: 10px;
    text-decoration: none;
}
#collapse .collapse-cell {}
#collapse h3 + div {
    padding-top: 20px;
    font-family: clearsansregular;
    font-size: 13px;
    padding-top: 20px;
}
/*==================
* Page Content
*==================*/

.right-nav {
    padding: 10px 0px
}
.plusLus h4 span{display: none}
.nav-filter{display: none !important}
.below-recherche{display: none}

#map-canvas{ width: 100%; height:300px;}
.savoir_plus i.icon ,.entete i.icon{float:left;margin-right:10px}
.sp-cont h5, .entete h2{  margin: 5px 0 20px 0;}
.portfolio-item-container i.icon{font-size:22px;float:left;margin-right:10px}

/*================*
* Page Article
*=================*/
.list-tags{float: right;margin-top:-1px}
.list-tags ul li{
    float: left;
    border-right: 1px solid #ccc;
    font-size: 13px;
    padding: 5px 10px;
    text-transform: capitalize;
    font-family: 'clearsansregular';
    color: #ccc;}
.list-tags ul li:last-child{border:none;padding-right:0px}
.icon.icon-1-5x{font-size:1.5em;font-weight:bold}
.single-img img{height:373px ;width:auto; }
.single-img{margin:40px auto 0;}
.single-img span{  color: #999;
    font-family: 'clearsansregular';
    font-size: 12px;display: block}
.page  {font-family: 'clearsansregular'}



/* SWIPER */
.swiper-wrapper{ height: auto; }
.swiper-pagination,  .swiper-pagination1,  .swiper-pagination2 {
  position: absolute;
  text-align: center;
  -webkit-transition: 300ms;
  -moz-transition: 300ms;
  -o-transition: 300ms;
  transition: 300ms;
  -webkit-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
  -o-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
  z-index: 10;
}

.swiper-container-horizontal>.swiper-pagination .swiper-pagination-bullet,
.swiper-container-horizontal>.swiper-pagination1 .swiper-pagination-bullet,
.swiper-container-horizontal>.swiper-pagination2 .swiper-pagination-bullet {
  margin: 0 5px;
}
.loading{ background: url(images/ajax-loader.gif) no-repeat center center; }

#homeTabs .swiper-slide{background-color: #141414;}

.swiper-button-next, .swiper-container-rtl .swiper-button-prev,
.swiper-button-prev, .swiper-container-rtl .swiper-button-next{ background-image: none!important; background-color: #000; text-align: center; opacity: 0.6; width:52px!important; font-size: 24px;  font: normal normal normal 14px/1 oeil;}
.swiper-button-next:before, .swiper-container-rtl .swiper-button-prev:before,
.swiper-button-prev:before, .swiper-container-rtl .swiper-button-next:before{font-size: 24px; color:#FFF; line-height: 46px;}
.swiper-button-next:before, .swiper-container-rtl .swiper-button-prev:before{content: "\43"; }
.swiper-button-prev:before, .swiper-container-rtl .swiper-button-next:before{content: "\45"; }
.swiper-pagination-bullet { width: 10px!important; height: 10px!important; opacity: .5!important; border: 1px solid #999!important;background-color: #FFF!important;}
.swiper-pagination-bullet-active {opacity: 1!important;background: #999!important;}

.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{ display: none; }

#postImgSwiper { padding-bottom: 32px; max-width: 1200px; margin: 0 auto; overflow: visible; position: static; }
#postImgSwiper img{ display: block; height: 373px; width: auto; }
#postImgSwiper .swiper-slide{width: auto;}
#postImgSwiper .swiper-wrapper, #postImgSwiper .swiper-slide{height: auto;}
#postImgSwiper .descrp-item{display: block; max-width:450px;}
#postImgSwiper .swiper-button-next, .swiper-container-rtl .swiper-button-prev{right:0;}
#postImgSwiper .swiper-button-prev, .swiper-container-rtl .swiper-button-next{left:0;}

#oeilDeLecteurs { padding-bottom: 36px; max-width: 1200px; margin: 0 auto; overflow: visible; position: static; }
#oeilDeLecteurs img{ display: block; height: 373px; width: auto; }
#oeilDeLecteurs .swiper-slide{width: auto;}
#oeilDeLecteurs .swiper-slide > a{display: block;}
#oeilDeLecteurs .descrp-item{display: block;}
#oeilDeLecteurs .swiper-button-next, .swiper-container-rtl .swiper-button-prev{right:0;}
#oeilDeLecteurs .swiper-button-prev, .swiper-container-rtl .swiper-button-next{left:0;}

#oeilDeLecteurs .swiper-pagination, #postImgSwiper .swiper-pagination, #dailyNewsSwiper .swiper-pagination1, #magasineSwiper .swiper-pagination2{ display: none; }
#oeilDeLecteurs .swiper-pagination-bullet,
#dailyNewsSwiper .swiper-pagination-bullet,
#magasineSwiper .swiper-pagination-bullet{background-color: #000!important; }


.goLink{ display: block;
  background: url(images/article/lien.png) no-repeat left center;
  padding-left: 18px;
  font-size: 14px;
  color: #999;
  font-weight: normal!important;
  margin-top: 12px;
  line-height: 14px;
  font-family: 'clearsansbold';
    text-transform: uppercase;
    text-decoration: none;
}



#swipebox-bottom-bar, #swipebox-top-bar{ min-height: 50px; background-color: rgba(0,0,0,0.5)!important;  height: auto!important;
    /*
    transform: translate3d(0,50px,0)!important;
    -webkit-transform: translate3d(0,50px,0)!important;*/}

#swipebox-top-bar{ line-height: 23px!important; }

#swipebox-title{ padding: 2px 32px 0; max-width: 1200px; margin: 0 auto; font-size: 13px; }


#featuredImages{ min-height: 200px; transition: height 0.3s ease; }