/* NECSSI V.1.4 (2015-02-07) @author: Nexi Conseils */

/* ==========================================================================
== CSS RECRUTEMENT
========================================================================== */


/*  ---- SOMMAIRE ---------------

#GLOBAL
#MSG
#CANDIDATURES HOME
#LOGIN
#DEPOT CV
#DETAIL CV
#LISTING ANNONCES
#DETAIL ANNONCES
#CREDITS
#ESPACE EMPLOIS / COMPTE
#ENTREPRISES
#MQs

---------------------------------*/



/* ==========================================================================
== GLOBAL
========================================================================== */

@import url("font-awesome.min.css");


/* ==========================================================================
GRID (KNACSS)
========================================================================== */



.grid > * {
   display: block;
   padding: 0;
   margin-left: -15px;
   margin-right: -15px;
   text-align: left;
}

.grid-center > * { text-align: center; }
.grid-right > * { text-align: right; }

.grid > * > * {
   display: inline-block;
   padding-left: 15px;
   padding-right: 15px;
   margin-left: 0;
   vertical-align: top;
   background-clip: content-box;
}


:root .grid {
   font-size: 0;
}

:root .grid > * > * {
   font-size: 16px;
   font-size: 1.6rem;
}

.opera:-o-prefocus,
.grid > * {
   word-spacing: -0.43em;
}

.grid-1 > * { width: 100%; }
.grid-2 > * { width: 50%; }
.grid-3 > * { width: 33.333%; }
.grid-4 > * { width: 25%; }
.grid-5 > * { width: 20%; }
.grid-6 > * { width: 16.667%; }
.grid-8 > * { width: 12.5%; }
.grid-10 > * { width: 10%; }
.grid-12 > * { width: 8.333%; }

.grid-2-1 > *:first-child,
.grid-1-2 > * + * {
   width: 66.666%;
}

.grid-1-2 > *:first-child,
.grid-2-1 > * + * {
   width: 33.333%;
}

.grid-1-3 > *:first-child,
.grid-3-1 > * + * {
   width: 25%;
}

.grid-3-1 > *:first-child,
.grid-1-3 > * + * {
   width: 75%;
}

@media (max-width: 1024px) {
   .grid-5 > *,
   .grid-6 > *,
   .grid-8 > *,
   .grid-10 > *,
   .grid-12 > * {
      width: 33.333%;
   }
}

@media (max-width: 480px) {
   .grid-3 > *,
   .grid-4 > *,
   .grid-5 > *,
   .grid-6 > *,
   .grid-8 > *,
   .grid-10 > *,
   .grid-12 > * {
      width: 50%;
   }
}

@media (max-width: 320px) {
   .grid > * > * {
      width: 100% !important;
   }
}



.badge {
   display: inline-block;
   vertical-align: top;
   font-family: Arial,sans-serif;
   border-radius: 10px;
   text-align: center;
   padding: 3px 4px;
   line-height: 1;
   font-size: 11px; font-size: 1.1rem;
   font-weight: bold;
   white-space: nowrap;
   color: #fff;
}
.badge-primary { background-color: #d20c0c; }




/* ==========================================================================
== MSG
========================================================================== */

.msg-bloc{ padding: 20px; background: white; font-weight: bold;}
.msg-success{border: solid 3px green; color: green;}
.msg-error{border: solid 3px red; color: red;}



/* ==========================================================================
== CANDIDATURES HOME
========================================================================== */

.jobcv-candidatures {
   margin-top: 20px;
   padding: 15px;
   background-color: transparent;
   border: 1px solid #cacaca;
   box-shadow: 0 0 4px -1px #b2b2b2;
}

.jobcv-candidatures-ttl {
   display: block;
   text-align: center;
   font-family: "Raleway-bold", Arial, sans-serif;
   text-transform: uppercase;
   font-size: 16px; font-size: 1.6rem;
   margin-bottom: 15px;
   -webkit-transition: color .3s ease;
   transition: color .3s ease;
   color: #000;
}

.jobcv-candidatures-item {
   color: #000;
   -webkit-transition: color .3s ease;
   transition: color .3s ease;
   line-height: 1.2;
}

.jobcv-candidatures-ttl:hover,
.jobcv-candidatures-ttl:focus,
.jobcv-candidatures-ttl:active,
.jobcv-candidatures-item:hover,
.jobcv-candidatures-item:focus,
.jobcv-candidatures-item:active {
   color: #d20c0c;
}

.jobcv-candidatures-item > img {
   float: left;
   height: auto;
   width: 100px;
   margin-right: 10px;
}
.jobcv-candidatures-item-mini .wrapimg {
  width: 100px;
  float: left;
  text-align: center;
  padding-right: 10px;
}
.jobcv-candidatures-item-mini .wrapimg img {
  float: none;
  height: 45px;
  width: auto;
  max-width: 100%;
  margin-right: 10px; 
}

.jobcv-candidatures-name {
   display: block;
   font-family: "Raleway-bold", Arial, sans-serif;
   font-size: 12px; font-size: 1.2rem;
   vertical-align: top;
   margin-bottom: 2px;
}

.jobcv-candidatures-slogan {
   display: block;
   font-size: 12px; font-size: 1.2rem;
   vertical-align: top;
}



/* ==========================================================================
== LOGIN
========================================================================== */

.joblogin-box {
   margin-top: 25px;
   padding: 15px 50px;
   min-height: 230px;
   background-color: #f5f4f5;
}

.joblogin-ttl {
   margin: -15px -50px 20px -50px;
   padding: 2px 15px 2px 10px;
   background-color: #d20c0c;
   color: #fff;
   text-transform: uppercase;
   font-size: 16px; font-size: 1.6rem;
   font-family: "raleway-bold", Arial, sans-serif;
}
.joblogin-ttl [class^="icon-"] {
   vertical-align: middle;
   font-size: 25px; font-size: 2.5rem;
}

.joblogin-box .mdp-oubli {
   display: block;
   margin-bottom: -10px;
   margin-left: -40px;
   color: #6c6c6c;
}

.joblogin-box > .grid { margin-top: 15px; }
.joblogin-box > .grid.mtop0 { margin-top: 0px; }
.joblogin-box > .grid.mtop5 { margin-top: 5px; }
.joblogin-box label > * { vertical-align: middle; }
.joblogin-box label > *:first-child { text-align: right; }

.joblogin-box input[type="text"],
.joblogin-box input[type="email"],
.joblogin-box input[type="password"] {
   width: 100%;
   border-color: #d3d3d3;
}



/* ==========================================================================
== DEPOT CV
========================================================================== */

.jobcv-depot fieldset { margin-bottom: 20px; }

.jobcv-depot label {
   display: block;
   margin: 0 0 3px 0;
}

.jobcv-depot input[type="text"],
.jobcv-depot input[type="file"],
.jobcv-depot select,
.jobcv-depot textarea {
   width: 100%;
   height: 36px;
   border: 1px solid #e2dfdf;
   background-color: #f7f7f7;
}

.jobcv-depot input[type="file"],
.jobcv-depot textarea {
   margin: 0;
   height: auto;
}

.jobcv-depot-submit {
   padding: 7px 30px;
   background-color: #000;
   color: #fff;
   text-transform: uppercase;
   font-size: 14px; font-size: 1.4rem;
   font-family: inherit;
   -webkit-transition: background-color .1s linear;
   transition: background-color .1s linear;
}
.jobcv-depot-submit:hover,
.jobcv-depot-submit:focus,
.jobcv-depot-submit:active {
   background-color: #d20c0c;
}



/* ==========================================================================
== DETAIL CV
========================================================================== */

.jobcv-detail-img {
   float: left;
   margin-right: 15px;
   margin-bottom: 15px;
   border: 1px solid #e2dfdf;
}

.jobcv-detail-nom {
   overflow: hidden;
   padding: 10px 15px;
   background-color: #f7f7f7;
   font-size: 20px; font-size: 2rem;
}

.jobcv-detail-metier {
   float: right;
   margin-top: 2px;
   color: #d20c0c;
   font-size: 16px; font-size: 1.6rem;
}

[class*="jobcv-detail-bloc-ttl-"] {
   margin-bottom: 5px;
   padding: 10px;
   color: #fff;
   text-transform: uppercase;
   font-size: 14px; font-size: 1.4rem;
   font-family: "raleway-bold", Arial, sans-serif;
}
.jobcv-detail-bloc-ttl-primary { background-color: #d20c0c; }
.jobcv-detail-bloc-ttl-secondary { background-color: #000; }

.jobcv-detail-bloc-item,
.jobcv-detail-bloc-link {
   display: block;
   overflow: hidden;
   margin-top: 3px;
   padding: 5px;
   background-color: #f7f7f7;
   color: #6c6c6c;
   font-size: 14px; font-size: 1.4rem;
}
.jobcv-detail-bloc-item > * + * {
   float: right;
   color: #000;
}

.jobcv-detail-bloc-link {
   padding: 10px;
   color: #000;
   font-size: 16px; font-size: 1.6rem;
}
.jobcv-detail-bloc-link i { font-size: 24px; font-size: 2.4rem; }
.jobcv-detail-bloc-link:hover {
   background-color: #d20c0c;
   color: #fff;
}
.jobcv-detail-bloc-link > * { vertical-align: middle; }



/* ==========================================================================
== LISTING ANNONCES
========================================================================== */

.joblisting-ttl {
   font-size: 16px; font-size: 1.6rem;
   font-family: "raleway", Arial, sans-serif;
   margin-top: 30px;
}
.joblisting-ttl span { color: #d20c0c; }

.joblisting-item {
	padding: 10px;
}
.joblisting-item.premium {
	box-shadow: 0 0 4px -1px #000;
	border: solid 1px #000;
	padding: 20px;
}

.joblisting-item-ttl {
   color: #000;
   font-weight: normal;
   font-size: 16px; font-size: 1.6rem;
   font-family: "raleway-bold", Arial, sans-serif;
}
.joblisting-item-ttl:hover,
.joblisting-item-ttl:focus,
.joblisting-item-ttl:active {
   color: #d20c0c;
}

.joblisting-item-logo {
   display: table-cell;
   vertical-align: middle;
   text-align: center;
   padding-right: 15px;
   width: 100px;
}
.joblisting-item-txt  {
   display: table-cell;
   vertical-align: middle;
}

.joblisting-item-view,
.joblisting-item-date {
   color: #6c6c6c;
}

.joblisting .ttl-primary {
   position: relative;
   margin-bottom: 0;
}


.job-btn-postuler {
   padding: 10px 50px;
   background-color: #000;
   color: #fff;
   text-transform: uppercase;
   font-size: 20px; font-size: 2rem;
   font-weight: bold;
   font-family: inherit;
   -webkit-transition: background-color .1s linear;
   transition: background-color .1s linear;
}
.job-btn-postuler:hover{
   background-color: #d20c0c;
   color: #fff;
}



/* ==========================================================================
== DETAIL ANNONCES
========================================================================== */

.jobdetail {
    margin-top: 20px;
    background-color: #fff;
    box-shadow: 0 0 4px -1px #b2b2b2;
}

/* HEADER */
.jobdetail-header {
    padding: 30px 20px;
    color: #fff;
    background-color: #d20c0c;
}
.jobdetail-dl {
    float: right;
    margin-top: -15px;
    margin-bottom: 20px;
    color: #fff;
}
.jobdetail-dl:hover,
.jobdetail-dl:focus,
.jobdetail-dl:active {
    color: #000;
}

.jobdetail-header-info {
    display: table;
    width: 100%;
}
.jobdetail-header-img,
.jobdetail-header-txt {
    display: table-cell;
    vertical-align: top;
}
.jobdetail-header-img {
    width: 150px;
}
.jobdetail-header-txt {
    padding-left: 30px;
}

.jobdetail-logo {
    border-radius: 10px;
}
.jobdetail-ttl {
    margin-bottom: 15px;
    font-family: "raleway", Arial, sans-serif;
    text-align: left;
    font-size: 2.8rem;
    line-height: 1.2;
}


/* CONTENT */
.jobdetail-content {
    padding: 30px;
    color: #95989a;
}
.jobdetail-ssttl {
    margin-bottom: 0;
    color: #000;
    font-family: "raleway-bold", Arial, sans-serif;
    line-height: 1.1;
    text-align: left;
}

/* CUSTOM */




.jobdetail-blue .jobdetail-header,
.jobdetail-blue .jobcv-detail-bloc-ttl-primary {
    background-color: #013f8c;
}
.jobdetail-blue .jobdetail-ssttl {
    color: #013f8c;
}

.jobdetail-orange .jobdetail-header,
.jobdetail-orange .jobcv-detail-bloc-ttl-primary {
    background-color: #f95000;
}
.jobdetail-orange .jobdetail-ssttl {
    color: #f95000;
}

.jobdetail-vert .jobdetail-header,
.jobdetail-vert .jobcv-detail-bloc-ttl-primary {
    background-color: #4ca54c;
}
.jobdetail-vert .jobdetail-ssttl {
    color: #4ca54c;
}

.jobdetail-noir .jobdetail-header,
.jobdetail-noir .jobcv-detail-bloc-ttl-primary {
    background-color: #36454f;
}
.jobdetail-noir .jobdetail-ssttl {
    color: #36454f;
}

.jobdetail-gris .jobdetail-header,
.jobdetail-gris .jobcv-detail-bloc-ttl-primary {
    background-color: #666;
}

.jobdetail-gris .jobdetail-ssttl {
    color: #666;
}

.jobdetail-violet .jobdetail-header,
.jobdetail-violet .jobcv-detail-bloc-ttl-primary {
    background-color: #d00058;
}
.jobdetail-violet .jobdetail-ssttl {
    color: #d00058;
}

.jobdetail-ciel .jobdetail-header,
.jobdetail-ciel .jobcv-detail-bloc-ttl-primary {
    background-color: #57b2d9;
}
.jobdetail-ciel .jobdetail-ssttl {
    color: #57b2d9;
}

/* ==========================================================================
== CREDITS
========================================================================== */

.credit-achat .champ{
   width: 100%;
   padding: 8px;
   font-size: 18px;
}
.credit-achat .btn{
   width: 100%;
   padding: 10px 10px;
   font-size: 18px;
   font-size: 1.8rem;
   background-color: #000;
   color: #fff;
   text-transform: uppercase;
   font-family: inherit;
   -webkit-transition: background-color .1s linear;
   transition: background-color .1s linear;
}



/* ==========================================================================
== MOTEUR RECHERCHE
========================================================================== */

/* ??? */
.toggle-jobsearch {
   position: absolute;
   top: 0; right: 0;
   height: 47px;
   font-size: 12px; font-size: 1.2rem;
   background-color: #b20a0a;
   color: #fff;
   text-align: center;
   line-height: 40px;
   padding-left: 10px;
}
.toggle-jobsearch i {
   font-size: 24px; font-size: 2.4rem;
}
.toggle-jobsearch.active { color: #000; }


.jobsearch {
   padding: 15px 15px 20px 15px;
   background-color: #dddddd;
   color: #000;
}
.jobsearch.extended {
   background-color: #b20a0a;
   color: #fff;
}
.jobsearch.extended a {
   color: #fff;
}
.jobsearch.extended a:hover { color: #000; }
.jobsearch label {
   display: block;
   margin: 0 0 3px 0;
   font-weight: bold;
}
.jobsearch .job-radios {
	margin-top: 10px;
}
.jobsearch .job-radios label {
	display: inline-block;
  font-weight: normal;
  font-size: 15px;
}
.jobsearch input[type="text"],
.jobsearch select {
   width: 100%;
}
.jobsearch input,
.jobsearch select,
.jobsearch textarea {
   border: 0;
}
.jobsearch-submit {
   padding: 5px 10px;
   background-color: #000;
   color: #fff;
   text-transform: uppercase;
   font-size: 14px; font-size: 1.4rem;
   font-family: inherit;
   -webkit-transition: background-color .1s linear;
   transition: background-color .1s linear;
}
.jobsearch-submit:hover,
.jobsearch-submit:focus,
.jobsearch-submit:active {
   background-color: #d20c0c;
}

.jobsearch #motplus {
   display: none;
   margin-top: 15px;
}
.jobsearch .pluscrit {
   color: #000;
   margin-left: 5px;
   vertical-align: bottom;
}



/* ----------------------------------------
-- VERSION TABS
---------------------------------------- */

.jobsearch-tabbed { position: relative; }
.jobsearch-tabbed-ttl {
   font-family: "Raleway", Arial, sans-serif;
   font-size: 18px; font-size: 1.8rem;
   font-weight: bold;
   text-transform: uppercase;
}


.jobsearch-tabs a {
   display: block;
   text-align: center;
   margin-bottom: 3px;
   padding: 8px 20px;
   background-color: #d20c0c;
   color: #fff;
   font-family: "Raleway", Arial, sans-serif;
   font-size: 14px; font-size: 1.4rem;
   font-weight: bold;
}
.jobsearch-tabs a:hover,
.jobsearch-tabs a.active {
   background-color: #b20a0a;
}

.jobsearch-tabs-item {
   display: none;
}
.jobsearch-tabs-item.active { display: block; }

@media (max-width: 767px) {
   .jobsearch [class^="grid-"] > * {
      width: 100%;
      margin-top: 10px;
   }
   .jobsearch-map { display: none; }


}

@media (min-width: 768px) {

   h1.jobsearch-tabbed-ttl {
      margin-top: 5px;
      float: right;
   }

   .jobsearch-tabs { display: inline-block; }
   .jobsearch-tabs a {
      display: inline-block;
      vertical-align: middle;
      text-align: left;
      font-size: 16px; font-size: 1.6rem;
      margin: 0;
   }



}

/* ----------------------------------------
-- TAGS RECHERCHE
---------------------------------------- */

.joblisting-tags {
   margin-top: 25px;
}

.joblisting-tag {
   display: inline-block;
   margin-top: 5px;
   padding: 5px 5px 5px 10px;
   background-color: #000;
   color: #fff;
   font-size: 14px; font-size: 1.4rem;
}
.joblisting-tag > * { vertical-align: middle; }

.joblisting-tag .joblisting-tag-close { cursor: pointer; }

.mentions-boite {
   border: solid 1px #d20c0c;
   padding: 10px;
   background: #f9f9f9;
   font-size:12px;
}



/* ==========================================================================
== ESPACE EMPLOIS / COMPTE
========================================================================== */

.offres-listing{
   border-collapse: collapse;
   width: 100%;
}

.offres-listing, .offres-listing th,
.offres-listing td {
   border: 1px solid #666;
}

.offres-listing th{
   background:  #000;
   color: #fff;
}

.offres-listing th, .offres-listing td {
   padding: 10px;
}
.offres-listing tr:nth-child(even) { background-color: #f2f2f2; }
.offres-listing-statut span,
.offres-listing-annonce span {
   display: block;
   font-size: 11px;
}

.widget-articles a.btn-credit{
   background-color: #f6bd0e;
   color: #000;
   border-radius: 10px;
   float: right;
   font-weight: bold;
   font-size: 1.5rem;
   padding: 10px 8px;
}
.widget-articles a.btn-credit:hover{
   background-color: #000;
   color: #fff;
}
.menu-credits {
   margin: 10px 0;
}
.menu-credits:after {
   content: '';
   display: block;
   clear: both;
}
.menu-credits span{
   display: block;
   font-size: 11px;
}

.bienvenue .bloc-a{
   display: block;
   text-align: center;
   background: #f6f6f6;
   margin: 15px 0;
   padding: 15px;
}
.bienvenue .bloc-a span{
   display: block;
   text-align: center;
   font-size: 40px;
}
.bienvenue .bloc-a span small{
   font-size: 10px;
}

.bienvenue:after {
   content: '';
   display: block;
   clear: both;
}


/* ==========================================================================
== ENTREPRISES
========================================================================== */

.bloc-entreprise-img {
   text-align: center;
   height: 100px;
   margin-bottom: 10px;
   border-bottom: 1px solid #eee;
}
.bloc-entreprise-img a {
   display: inline-block;
   line-height: 90px;
}

.pagination-alphabetique {
	margin-top: 20px;
	text-align: center;
}

.pagination-alphabetique a{
  border: solid 1px #e2e2e2;
  display: inline-block;
  background: #fff;
	width: 23px;
	text-align: center;
	font-size: 20px;
}
.pagination-alphabetique a.active {
	background: #000;
	color: #fff;
}


/* ==========================================================================
== MEDIA QUERIES
========================================================================== */

@media (max-width: 1023px) {
   .job-compte-nav,
   .job-compte-content {
      width: 100%!important;
      margin-bottom: 20px;
   }
   .jobcv-depot fieldset {
      display: block;
      width: 100%;
   }
}

@media (max-width: 767px) {
   .jobcv-candidatures-item {
      width: 100%;
      margin: 5px 0;
   }
   .joblisting-item-postuler.pull-right {
			display: none;
	}
    .jobdetail-header-img {
        display: block;
        width: auto;
        text-align: center;
        margin-bottom: 30px;
    }
    .jobdetail-header-txt {
        display: block;
        text-align: center;
        padding-left: 0;
    }
}