/**
 * layout.css
 * css global du site ina.fr mobile
 *
 *
 * @author SDi
 * @date 2013-09-01
 * @media mobile devices
 * @site ina.fr mobile
 *
 */


/* #POLICES
 ****************************************************** */

/* Internet Explorer < 9 */
@font-face {
    font-family:DinWeb-Bold;
    src:url("../polices/DINWeb-Bold.eot");
}

@font-face {
    font-family:DinWeb-Medium;
    src:url("../polices/DINWeb-Medium.eot");
}

@font-face {
    font-family:DinWeb-Light;
    src:url("../polices/DINWeb-Light.eot");
}

/* WOFF pour les autres navigateurs */
@font-face {
    font-family:DinWeb-Bold;
    src:url("../polices/DINWeb-Bold.woff") format("woff");
}

@font-face {
    font-family:DinWeb-Medium;
    src:url("../polices/DINWeb-Medium.woff") format("woff");
}

@font-face {
    font-family:DinWeb-Light;
    src:url("../polices/DINWeb-Light.woff") format("woff");
}


/* #STYLES
 ****************************************************** */

/* bases
 ------------------------------------------------------ */
body {
    color:#444;
    font-family:Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-size:15px;
    line-height:17px;
    -webkit-font-smoothing:antialiased;
    -webkit-text-size-adjust:100%;
}

/* typographie
 ------------------------------------------------------ */
h1  {
    color:#181818;
    font:normal 21px/35px DinWeb-Bold;
    text-transform:uppercase;
}

.h1 {
    background-color: transparent;
    border-bottom: none;
    color: #181818;
    font-family: DinWeb-Medium;
    font-size: 18px;
    font-weight: normal;
    margin-bottom: 15px;
    text-transform: inherit;
}

h2, h3, h4, h5, h6 {
    color:#181818;
    font-family:Georgia, Times, "Times New Roman", serif;
    font-weight:normal;
}

h2 {
    font-size:16px;
    line-height:17px;
}

h4 {
    font-size:21px;
    line-height:21px;
    margin-bottom:8px;
}

p {
    margin:4px 0;
}

h3.titleHome{
    font-family: arial;
    font-weight: bold;
}

/* liens
 ------------------------------------------------------ */
a:active,
a:visited {
    color:#148db8;
}

a:hover {
    color:#148db8;
    text-decoration:none;
}

a:link {
    color:#148db8;
    text-decoration:none;
}

/* formulaires
 ------------------------------------------------------ */
form {
    display:inline-block;
    margin:20px 30px;
}
form.formContact{
    margin: 20px 0 0 0;
    width: 100%;
}
form.formCompte{
    margin: 10px 0 10px 0;
}
form.historique {
    margin: initial;
}

input[type='submit'] {
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
}

input[type='text'],
input[type='password'],
input[type='email'],
input[name='search'],
input[type='search'],
textarea {
    background-color:#fff;
    border:1px solid #c3c3c3;
    font-size:14px;
    height:28px;
    padding:0 4px;
    -webkit-border-radius:3px;
    border-radius:3px;
    -webkit-box-shadow:inset 0 0 2px 1px #c3c3c3;
    box-shadow:inset 0 0 2px 1px #c3c3c3;
}

input[type='text']:focus,
input[type='password']:focus,
input[type='email']:focus,
input[name='search']:focus,
input[type='search']:focus,
textarea:focus {
    border:1px solid #aaa;
}

textarea {
    font:14px/16px Arial, "Helvetica Neue", Helvetica, sans-serif;
    height:100px;
    padding:4px;
    width:290px;
    resize:none;
}

.formContact input,textarea,select {
    background-color: #fff;
    border: 1px solid #c3c3c3;
    font-size: 14px;
    height: 28px;
    padding: 0 4px;
    border-radius: 0;
    box-shadow: none;
    margin-bottom: 10px;
    width: 97%;
}
.formContact input.radioCompte{
    height:20px;
}

.formContact select{
    width:100%;
    color: #8a758a;
    padding-left: 2px;
}
input[type="checkbox"] {
    height: 14px;
    width: auto;
}
input.radioCompte[type="checkbox"]{
    height: 20px;
    width: 20px;
}

.mdpOublie {
    font-size: 12px;
}

.ogp-radio__label {
    display: table-cell;
    font-family: 'DINWeb-Regular', sans-serif;
    font-size: 14px;
    font-weight: 400;
    padding-left: 6px;
    transform: translateY(1px);
    vertical-align: middle;
}

/* messages erreur */
div.ui-state-error,
#captchaError,
#recaptcha_error {
    border:none;
    background-color:transparent;
    color:#cd0a0a !important;
    font-size:11px;
    line-height:12px;
    margin-bottom:4px;
}

input.ui-state-error,
textarea.ui-state-error {
    border:1px solid #c3c3c3;
    background-color:transparent;
    color:inherit;
    font-size:inherhit;
    height:28px;
}

div.ui-state-error p {
    line-height:13px;
    margin:0 30px;
}

div.ui-state-error p:first-of-type {
    margin:10px 30px 0;
}

.ui-icon.ui-icon-alert {
    display:none;
}

/* classes generiques
 ------------------------------------------------------ */
.nofloat,
.clear {
    clear:both;
    float:none;
}

.centeros {
    text-align:center;
}

.centerBtn{
    text-align: -moz-center;
    text-align: -webkit-center;
}

.centerBtn-club{
    text-align: -moz-center;
    text-align: -webkit-center;
    padding: 0 0 10px;
}

.left {
    float:left;
}

.right {
    float:right;
}

.Off {
    display:none;
}

.pleinePage {
    width:none;
}

.hidden {
    display: none !important;
    visibility: hidden !important;
}

.img-responsive {
    display: block;
    max-width: 100%;
}

.absolute-center {
    bottom: 0;
    display: table;
    left: 0;
    margin: auto;
    right: 0;
    top: 0;
}

.margin-top-10 {
    margin-top: 10px !important;
}
.margin-top-20 {
    margin-top: 20px !important;
}
.margin-bottom-20 {
    margin-bottom: 20px;
}
.margin-left-15 {
    margin-left: 15px;
}

.centerDiv{
    margin-left: auto;
    margin-right: auto;
    width: max-content;
}

.padding-left-10 {
    padding-left: 10px;
}
.padding-top-5{
    padding-top: 5px;
}
.padding-msg{
    padding: 10px;
}

/* WEB PRODUCTIONS*/

.wp_img{
    /*margin-top: 10px;*/
}
.wp_title{
    padding: 0 7px 0 7px;
    font-size: 13px;
    text-align: left;
    display: block;
    font-family: arial;
}
/*.hp_rubrique {*/
    /*font-size: 10px;*/
    /*color: darkgrey;*/
    /*height: 11px;*/
    /*margin-bottom: 7px;*/
/*}*/

.hp_rubrique {
background-color: #2792af;
width: -moz-max-content;
width: -webkit-max-content;
width: intrinsic;
height: 10px;
line-height: 1.4;
padding: 0 2px 0 2px;
color: #fff;
text-transform: uppercase;
font-size: 8px;
}
.hp_rubrique-first{
    margin-left: 10px;
    margin-top: 10px;
    text-align: left;
}
.hp_square_rubrique {
    color:#f7921f;
    font-size: 13px;
}

.wp_title a{
    color: #181818;
}
.wp_titlePremium a{
    color: #fff;
}
.wp_separator{
    display: block;
    height: 10px;
    width: 100%;
    border-bottom: 1px solid #dadada;
    margin-bottom: 10px;
}

.wp_separator:last-child{
    border-bottom: none;
    display: table-cell;
}

.wp_separator-home{
    display: block;
    width: 100%;
    border-bottom: 5px solid #dadada;
}

/* ACCUEIL*/
.titleFirst{
    font-size: 18px;
    font-family: Arial;
    padding: 10px 10px 5px 10px;
    text-align: left;
}

.titleFirst a{
    color: #181818;
}

.titleFirstPremium a{
    color: #fff;
}
.descFirst{
    padding: 0 10px 5px 10px;
    text-align: justify;
    font-size: 13px;
}

.descFirst a{
    color: #181818;
}

.descFirstPremium a{
    color: #fff;
}

.descFirst p{
    border-bottom: 1px solid #dadada;
    padding-bottom: 10px;
}

.containerFirst{
    padding-top: 0 !important;
    /*background: linear-gradient(#036f95, #fff);*/
}

a.titleHome{
    color: #181818;
}

.titreRubrique {
    border-top: solid 2px #2b98bf;
    display: block;
    margin-top: 15px;
    padding-top: 15px;
    width: 100%;
    font: normal 16px/21px DinWeb-Medium;
    text-transform: uppercase;
    text-align: center;
}
.titreRubrique.premium {
    border-top: solid 2px #c4ae7f;
    color: #fff;
}
.titreRubrique a{
    color: #181818;
}

.titreRubriquePremium{
    background-color: #c4ae7f;
}
.titreRubriquePremium a{
    color: #ffffff;
}

.titreStatique {
    text-align: center;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 600;
}

.posRelative {
    position: relative;
}

.labelUne {
    background-color:rgba(0,0,0,0.5);
    left:0;
    color:#fff;
    position:absolute;
    text-align:left;
    bottom: 0;
    font-size: 13px;
    padding: 0 5px 0 5px;
}
.ina_article:after{
    content: 'Article';
}
.ina_playlist:after{
    content: 'Playlist';
}
.ina_pack:after{
    content: 'Pack';
}
.ina_evenement:after{
    content: 'Evénement';
}

.contentCreation {
    margin: 15px auto;
    max-width: max-content;
    max-width: -moz-max-content;
}
.hp_title_webCreation{
    background-color: #e5e5e5;
    padding: 10px;
    text-transform: uppercase;
    text-align: center;
    font-size: 12px;
}
.hp_title_webCreation a{
    color: #444;
}

.web_home_content:first-child{
    padding-top: 3px;
}

/* INA PREMIUM */
.itemTitle {
    color: #fff;
    background: #2d2d2d;
    padding: 2px;
    opacity: 0.7;
    text-transform: uppercase;
    font-size: 10px;
    max-width: 137px;
}
.imgPremium{
    padding: 3px;
}

.themePremium{
    overflow: hidden;
    position: relative;
}

.legendePremium{
    position: absolute;
    text-align: center;
    left: 3px;
    bottom: 3px;
}
/* PACK */

.pack-premium{
    text-transform: uppercase;
    background-color: #c4ae7f;
    padding: 5px;
    color: #fff;
    padding: 3px;
    width: -moz-max-content;
    width: -webkit-max-content;
}

.notPremium {
    background-image: linear-gradient(to bottom, #dbc083 0%, #b4a167 100%);
    padding: 5px 10px 5px 10px;
    color: #fff;
}
.notPremium a{
    color:#fff;
    text-decoration: underline;
}

.widthContent{
    width: -moz-max-content;
    width: -webkit-max-content;
}

/* Mon compte mobile */
.close {
    float: right;
    font-size: 19.5px;
    font-weight: bold;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: 0.2;
    filter: alpha(opacity=20);
}
.close:hover,
.close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
    opacity: 0.5;
    filter: alpha(opacity=50);
}
button.close {
    padding: 0;
    cursor: pointer;
    background: transparent;
    border: 0;
    -webkit-appearance: none;
}
.modal-open {
    overflow: hidden;
}
.modal {
    display: none;
    overflow: hidden;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1040;
    -webkit-overflow-scrolling: touch;
    outline: 0;
}
.modal.fade .modal-dialog {
    -webkit-transform: translate(0, -25%);
    -ms-transform: translate(0, -25%);
    -o-transform: translate(0, -25%);
    transform: translate(0, -25%);
    -webkit-transition: -webkit-transform 0.3s ease-out;
    -moz-transition: -moz-transform 0.3s ease-out;
    -o-transition: -o-transform 0.3s ease-out;
    transition: transform 0.3s ease-out;
}
.modal.in .modal-dialog {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
}
.modal-open .modal {
    overflow-x: hidden;
    overflow-y: auto;
}
.modal-dialog {
    position: relative;
    width: auto;
    margin: 10px;
}
.modal-content {
    position: relative;
    background-color: #fff;
    border: 1px solid #999;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 0;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    background-clip: padding-box;
    outline: 0;
}
.modal-backdrop {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    background-color: #000;
}
.modal-backdrop.fade {
    opacity: 0;
    filter: alpha(opacity=0);
}
.modal-backdrop.in {
    opacity: 0.5;
    filter: alpha(opacity=50);
}
.modal-header {
    padding: 15px;
    border-bottom: 1px solid #e5e5e5;
    min-height: 16.25px;
}
.modal-header .close {
    margin-top: -2px;
}
.modal-title {
    margin: 0;
    line-height: 1.25;
}
.modal-body {
    position: relative;
    padding: 15px;
}
.modal-footer {
    padding: 15px;
    text-align: right;
    border-top: 1px solid #e5e5e5;
}
.modal-footer .btn + .btn {
    margin-left: 5px;
    margin-bottom: 0;
}
.modal-footer .btn-group .btn + .btn {
    margin-left: -1px;
}
.modal-footer .btn-block + .btn-block {
    margin-left: 0;
}
.modal-scrollbar-measure {
    position: absolute;
    top: -9999px;
    width: 50px;
    height: 50px;
    overflow: scroll;
}
@media (min-width: 768px) {
    .modal-dialog {
        width: 600px;
        margin: 30px auto;
    }
    .modal-content {
        -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
    }
    .modal-sm {
        width: 300px;
    }
}
@media (min-width: 992px) {
    .modal-lg {
        width: 900px;
    }
}
.tooltip {
    position: absolute;
    z-index: 1070;
    display: block;
    visibility: visible;
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-size: 10px;
    font-weight: normal;
    line-height: 1.4;
    opacity: 0;
    filter: alpha(opacity=0);
}
.tooltip.in {
    opacity: 1;
    filter: alpha(opacity=100);
}
.tooltip.top {
    margin-top: -3px;
    padding: 5px 0;
}
.tooltip.right {
    margin-left: 3px;
    padding: 0 5px;
}
.tooltip.bottom {
    margin-top: 3px;
    padding: 5px 0;
}
.tooltip.left {
    margin-left: -3px;
    padding: 0 5px;
}
.tooltip-inner {
    max-width: 200px;
    padding: 3px 8px;
    color: #fff;
    text-align: center;
    text-decoration: none;
    background-color: #000;
    border-radius: 0;
}
.tooltip-arrow {
    position: absolute;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
}
.tooltip.top .tooltip-arrow {
    bottom: 0;
    left: 50%;
    margin-left: -5px;
    border-width: 5px 5px 0;
    border-top-color: #000;
}
.tooltip.top-left .tooltip-arrow {
    bottom: 0;
    right: 5px;
    margin-bottom: -5px;
    border-width: 5px 5px 0;
    border-top-color: #000;
}
.tooltip.top-right .tooltip-arrow {
    bottom: 0;
    left: 5px;
    margin-bottom: -5px;
    border-width: 5px 5px 0;
    border-top-color: #000;
}
.tooltip.right .tooltip-arrow {
    top: 50%;
    left: 0;
    margin-top: -5px;
    border-width: 5px 5px 5px 0;
    border-right-color: #000;
}
.tooltip.left .tooltip-arrow {
    top: 50%;
    right: 0;
    margin-top: -5px;
    border-width: 5px 0 5px 5px;
    border-left-color: #000;
}
.tooltip.bottom .tooltip-arrow {
    top: 0;
    left: 50%;
    margin-left: -5px;
    border-width: 0 5px 5px;
    border-bottom-color: #000;
}
.tooltip.bottom-left .tooltip-arrow {
    top: 0;
    right: 5px;
    margin-top: -5px;
    border-width: 0 5px 5px;
    border-bottom-color: #000;
}
.tooltip.bottom-right .tooltip-arrow {
    top: 0;
    left: 5px;
    margin-top: -5px;
    border-width: 0 5px 5px;
    border-bottom-color: #000;
}
.popover {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1060;
    display: none;
    max-width: 291px;
    padding: 1px;
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-size: 13px;
    font-weight: normal;
    line-height: 1.25;
    text-align: left;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 0;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    white-space: normal;
}
.popover.top {
    margin-top: -10px;
}
.popover.right {
    margin-left: 10px;
}
.popover.bottom {
    margin-top: 10px;
}
.popover.left {
    margin-left: -10px;
}
.popover-title {
    margin: 0;
    padding: 8px 14px;
    font-size: 13px;
    background-color: #f7f7f7;
    border-bottom: 1px solid #ebebeb;
    border-radius: -1 -1 0 0;
}
.popover-content {
    padding: 9px 14px;
}
.popover > .arrow,
.popover > .arrow:after {
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
}
.popover > .arrow {
    border-width: 11px;
}
.popover > .arrow:after {
    border-width: 10px;
    content: "";
}
.popover.top > .arrow {
    left: 50%;
    margin-left: -11px;
    border-bottom-width: 0;
    border-top-color: #999999;
    border-top-color: rgba(0, 0, 0, 0.25);
    bottom: -11px;
}
.popover.top > .arrow:after {
    content: " ";
    bottom: 1px;
    margin-left: -10px;
    border-bottom-width: 0;
    border-top-color: #fff;
}
.popover.right > .arrow {
    top: 50%;
    left: -11px;
    margin-top: -11px;
    border-left-width: 0;
    border-right-color: #999999;
    border-right-color: rgba(0, 0, 0, 0.25);
}
.popover.right > .arrow:after {
    content: " ";
    left: 1px;
    bottom: -10px;
    border-left-width: 0;
    border-right-color: #fff;
}
.popover.bottom > .arrow {
    left: 50%;
    margin-left: -11px;
    border-top-width: 0;
    border-bottom-color: #999999;
    border-bottom-color: rgba(0, 0, 0, 0.25);
    top: -11px;
}
.popover.bottom > .arrow:after {
    content: " ";
    top: 1px;
    margin-left: -10px;
    border-top-width: 0;
    border-bottom-color: #fff;
}
.popover.left > .arrow {
    top: 50%;
    right: -11px;
    margin-top: -11px;
    border-right-width: 0;
    border-left-color: #999999;
    border-left-color: rgba(0, 0, 0, 0.25);
}
.popover.left > .arrow:after {
    content: " ";
    right: 1px;
    border-right-width: 0;
    border-left-color: #fff;
    bottom: -10px;
}
/* journal anniversaire*/
.jttimeradio{
    position: absolute;
    top: 5px;
    left: 15px;
}
.jttimeradio.page-ja{
    position: relative;
    top: 0;
    left: 0;
}

.jttimeradio .date-form ul {
    margin: 0;
    padding: 70px 0 0;
    text-align: center;
}
.jttimeradio .date-form ul.page-ja {
    margin: 0;
    padding: 10px 0 10px;
    text-align: center;
}
.jttimeradio .date-form ul li {
    display: inline-block;
    padding-right: 5px;
    vertical-align: middle;
}

.jttimeradio .date-form ul li input {
    border: none;
    background-color: #f4f4f4;
    border-radius: 0;
    width: 50px;
    box-shadow: none;
}
#okJVNJtTimeRadio{
    height: 27px;
    background-color: #0682a5;
    width: auto;
    color: #fff;
    text-transform: uppercase;
    font-size: 10px;
}
.btn-consulter {
    background-color: #178eb9;
    padding: 5px;

}
a.btn-consulter{
    color: #fff;
}
.btn-play{
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 0 6px 12px;
    border-color: transparent transparent transparent #ffffff;
    opacity: 0.8;
    position: absolute;
    top: 23px;
    left: 46px;
    cursor: pointer;
}
a.btn--danger{
    background: #ccc;
    padding: 4px;
    color: #fff;
}
.btn-size{
   font-size: 12px;
    text-transform: uppercase;
}
a.btn--action {
    background: #178eb9;
    padding: 4px;
    color: #fff;
    text-transform: uppercase;
}
div.media-body__actions.pull-right{
    float: left;
}
div.alert.alert-warning{
    padding: 15px;
    margin-bottom: 16px;
    border: 1px solid transparent;
    border-radius: 0;
    background-color: #fcf8e3;
    border-color: #faebcc;
    color: #8a6d3b;
}

.birthday-banner__form{
    background: #0b1f26; /* Old browsers */
    background: -moz-linear-gradient(left, #0b1f26 0%, #23657f 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #0b1f26 0%,#23657f 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #0b1f26 0%,#23657f 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0b1f26', endColorstr='#23657f',GradientType=1 );
    height: 155px;
}

.birthday-banner__form .h2--title {
    color: #08addb;
    text-transform: uppercase;
    font-family: 'DINWeb-Bold', sans-serif;
    font-size: 15px;
    padding: 10px;
}
.birthday-banner__form label {
    color: #fff;
    font-family: 'DINWeb-Medium', sans-serif;
    padding: 0 0 0 10px;
}

/* Sliders de la home */
.contentSlider {
    background-color: aliceblue;
}
.slider {
    width: 300px;
    margin-right: auto;
    margin-left: auto;
    margin-top: -5px;
}

.slick-slide {
    /*background: #3a8999;*/
    color: white;
    padding: 40px 0;
    font-size: 30px;
    font-family: "Arial", "Helvetica";
    text-align: center;
    outline: none !important;
}

.slick-prev:before,
.slick-next:before {
    color: black !important;
}

.slick-prev, .slick-next{
    top:75px !important;
}

.slick-dotted.slick-slider{
    margin-bottom: -15px !important;
}

.slick-dots {
    bottom: 20px !important;
}

.sliderPremium .slick-dots li button:before{
    color: #fff !important;
}

.img_slide {
    padding: 0 2px 40px 2px;
}
.desc_slide {
    position: relative;
    display: inline-block;
    background: #ffffff;
    height: auto;
    font-size: 14px;
    width: 276px;
    color: #000;
    text-align: left;
    padding: 10px 0 0 10px;
}
.desc_slidePremium{
    background-color: #2d2d2d;
    color: #fff;
    z-index: 1;
}

.desc_slide_right {
    left:-150px;
    padding:10px 9px 0 10px;
}

.desc_slide_home {
    position: relative;
    display: inline-block;
    height: auto;
    font-size: 14px;
    width: 300px;
    color: #000;
    text-align: left;
    padding: 10px 0 0 0;
}
.desc_slide_home a{
    color: #181818;
    outline: 0;
}

.desc_slide a{
    color: #181818;
}

.desc_slidePremium a{
    color: #fff;
    outline: 0;
}
/* #BOUTONS
 ****************************************************** */
.bouton,
input[type="submit"],
#recaptcha_audio_play_again {
    border:0 none;
    cursor:pointer;
    display:block;
    font:14px/32px 'DinWeb-Bold';
    height:30px;
    margin:10px;
    padding:0 10px;
    position:relative;
    text-align:center;
    text-decoration:none;
    text-transform:uppercase;
    /*max-width:-moz-max-content;*/
    max-width:-webkit-fit-content;
    -webkit-border-radius:3px;
    border-radius:3px;
}
.btn-contact{
    border-radius: 0;
    margin-left: 0;
}
.btn-save-compte{
    margin-right: -3px;
}

/* action */
.action,
a.action,
.action a,
.mobError .btAction {
    background-color:#178eb9;
    color:#fff;
}

/*.action:active,
.mobError .btAction:active,
.action:hover,
.mobError .btAction:hover {
    -webkit-box-shadow:0 1px 2px 0 rgba(0,0,0,0.7), 0 0 3px #094054 inset;
    box-shadow:0 1px 2px 0 rgba(0,0,0,0.7), 0 0 3px #094054 inset;
}*/

/* interface */
.interface,
a.interface,
.interface a,
#recaptcha_audio_play_again {
    background-color:#d6d6d6;
    color:#666;
}

/*.interface:active,
#recaptcha_audio_play_again:active,
.interface:hover,
#recaptcha_audio_play_again:hover {
    -webkit-box-shadow:0 1px 2px 0 rgba(0,0,0,0.7), 0 0 3px #969696 inset;
    box-shadow:0 1px 2px 0 rgba(0,0,0,0.7), 0 0 3px #969696 inset;
}*/


/* #PICTOS CSS3
 ****************************************************** */

/* styles
 ------------------------------------------------------ */
.pAction {
    background: #26aecb;
    background:-webkit-linear-gradient(top, #26aecb 0%,#076f97 100%);
    background:-o-linear-gradient(top, #26aecb 0%, #076f97 100%);
    background:linear-gradient(to bottom, #26aecb 0%, #076f97 100%);
    display:block;
    height:30px;
    width:30px;
    border-radius:3px;
    -webkit-border-radius:3px;
}

.pInterface {
    background:#f6f6f6;
    background:-webkit-linear-gradient(top, #f6f6f6 17%, #aeaeae 100%);
    background:-o-linear-gradient(top, #f6f6f6 17%, #aeaeae 100%);
    background:linear-gradient(to bottom, #f6f6f6 17%, #aeaeae 100%);
    border:2px solid #999;
    display:block;
    height:26px;
    width:26px;
    border-radius:3px;
    -webkit-border-radius:3px;
}

.pAvatar {
    height:47px;
    width:47px;
}

.pBarreOutils {
    background-color:rgba(47, 46, 47, 0.95);
    display:block;
    height:30px;
    width:30px;
}

/* evenements */
/*.pAction:hover,
.pAction:active {
    box-shadow:0 1px 2px 0 rgba(0,0,0,0.7), 0 0 3px #094054 inset;
    -webkit-box-shadow:0 1px 2px 0 rgba(0,0,0,0.7), 0 0 3px #094054 inset;
}

.pInterface:hover,
.pInterface:active {
    box-shadow:0 0 5px #7f7f7f inset;
    -webkit-box-shadow:0 0 5px #7f7f7f inset;
}*/

/* picto menu
 ------------------------------------------------------ */
.pictoMenu:before {
    background:#fff;
    content:'';
    display:block;
    height:3px;
    margin:0 auto;
    position:relative;
    top:8px;
    width:20px;
    border-radius:1px;
    -webkit-border-radius:1px;
    box-shadow:0 5px 0 #fff, 0 10px 0 #fff;
    -webkit-box-shadow:0 6px 0 #fff, 0 12px 0 #fff;
}

/* picto recherche - picto recherche barree
 ------------------------------------------------------ */
.pictoRecherche:before,
.pictoRechercheBarree:before {
    content:'';
    height:12px;
    display:block;
    position:relative;
    top:5px;
    left:5px;
    width:12px;
    border:2px #fff solid;
    border-radius:100%;
    -webkit-border-radius:100%;
}

.pictoRecherche:after,
.pictoRechercheBarree:after,
.pictoRechercheBarree > span:after {
    background:#fff;
    content:'';
    display:block;
    height:8px;
    left:19px;
    position:relative;
    top:1px;
    width:3px;
    transform:rotate(-45deg);
    -webkit-transform:rotate(-45deg);
    -moz-transform:rotate(-45deg);
    -o-transform:rotate(-45deg);
    -ms-transform:rotate(-45deg);
}

.pictoRechercheBarree:after {
    height:28px;
    left:13px;
    top:-23px;
    width:4px;
    transform:rotate(45deg);
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    -ms-transform:rotate(45deg);
}

/* picto fermer
 ------------------------------------------------------ */
.pictoFermer:before,
.pictoFermer:after {
    background:#fff;
    content:'';
    display:block;
    height:3px;
    margin:0 auto;
    position:relative;
    top:13px;
    width:24px;
    transform:rotate(-45deg);
    -webkit-transform:rotate(-45deg);
    -moz-transform:rotate(-45deg);
    -o-transform:rotate(-45deg);
    -ms-transform:rotate(-45deg);
}

.pictoFermer:after {
    top:10px;
    transform:rotate(45deg);
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    -ms-transform:rotate(45deg);
}

.pInterface.pictoFermer:before {
    background:#575756;
    top:12px;
}
.pInterfaceMdp.pictoFermer:before {
    background:#575756;
    top:2px;
    left: -8px;
}

.pInterface.pictoFermer:after {
    background:#575756;
    top:9px;
}
.pInterfaceMdp.pictoFermer:after {
    background:#575756;
    top:-1px;
    left: -8px;
}


/* picto filtre recherche
 ------------------------------------------------------ */
.pictoFiltre:before {
    border-left:4px solid #fff;
    border-right:4px solid #fff;
    content:'';
    display:block;
    height:2px;
    margin:0 auto;
    position:relative;
    top:5px;
    width:8px;
}

.pictoFiltre:after {
    border:2px solid #fff;
    border-top:4px solid #fff;
    color:#fff;
    content:'31';
    display:block;
    font:bold 11px/12px Arial, "Helvetica Neue", Helvetica, sans-serif;
    height:12px;
    margin:0 auto;
    position:relative;
    text-align:center;
    top:5px;
    width:16px;
}

/* picto fleche
 ------------------------------------------------------ */
.pictoFleche:before,
.pictoFleche:after {
    background:#575756;
    content:'';
    display:block;
    height:4px;
    left:2px;
    position:relative;
    top:12px;
    width:13px;
}

/* picto fleche bas */
.fBas:before {
    transform:rotate(45deg) skewX(45deg);
    -webkit-transform:rotate(45deg) skewX(45deg);
    -moz-transform:rotate(45deg) skewX(45deg);
    -o-transform:rotate(45deg) skewX(45deg);
    -ms-transform:rotate(45deg) skewX(45deg);
}

.fBas:after {
    left:11px;
    top:8px;
    transform:rotate(-45deg) skewX(-45deg);
    -webkit-transform:rotate(-45deg) skewX(-45deg);
    -moz-transform:rotate(-45deg) skewX(-45deg);
    -o-transform:rotate(-45deg) skewX(-45deg);
    -ms-transform:rotate(-45deg) skewX(-45deg);
}

/* picto fleche haut */
.fHaut:before {
    top:11px;
    transform:rotate(-45deg) skewX(-45deg);
    -webkit-transform:rotate(-45deg) skewX(-45deg);
    -moz-transform:rotate(-45deg) skewX(-45deg);
    -o-transform:rotate(-45deg) skewX(-45deg);
    -ms-transform:rotate(-45deg) skewX(-45deg);
}

.fHaut:after {
    left:11px;
    top:7px;
    transform:rotate(45deg) skewX(45deg);
    -webkit-transform:rotate(45deg) skewX(45deg);
    -moz-transform:rotate(45deg) skewX(45deg);
    -o-transform:rotate(45deg) skewX(45deg);
    -ms-transform:rotate(45deg) skewX(45deg);
}

/* picto fleche droite */
.fDroite:before {
    left:7px;
    top:7px;
    transform:rotate(45deg) skewX(-45deg);
    -webkit-transform:rotate(45deg) skewX(-45deg);
    -moz-transform:rotate(45deg) skewX(-45deg);
    -o-transform:rotate(45deg) skewX(-45deg);
    -ms-transform:rotate(45deg) skewX(-45deg);
}

.fDroite:after {
    left:7px;
    top:12px;
    transform:rotate(-45deg) skewX(45deg);
    -webkit-transform:rotate(-45deg) skewX(45deg);
    -moz-transform:rotate(-45deg) skewX(45deg);
    -o-transform:rotate(-45deg) skewX(45deg);
    -ms-transform:rotate(-45deg) skewX(45deg);
}

/* picto partager
 ------------------------------------------------------ */
.pictoPartager:before {
    border-left:2px solid #fff;
    border-top:2px solid #fff;
    content:'';
    display:block;
    height:10px;
    left:11px;
    position:relative;
    top:9px;
    width:10px;
    transform:rotate(-45deg) skewX(10deg) skewY(10deg);
    -webkit-transform:rotate(-45deg) skewX(10deg) skewY(10deg);
    -moz-transform:rotate(-45deg) skewX(10deg) skewY(10deg);
    -o-transform:rotate(-45deg) skewX(10deg) skewY(10deg);
    -ms-transform:rotate(-45deg) skewX(10deg) skewY(10deg);
}

.pictoPartager:after {
    background:#fff;
    content:'';
    display:block;
    height:8px;
    left:15px;
    position:relative;
    top:-8px;
    width:8px;
    border-radius:6px;
    -webkit-border-radius:6px;
    box-shadow:-10px 7px 0 #fff, 0 14px 0 #fff;
    -webkit-box-shadow:-10px 7px 0 #fff, 0 14px 0 #fff;
}

/* picto ajouter
 ------------------------------------------------------ */
.pictoAjouter:before,
.pictoAjouter:after {
    background:#fff;
    content:'';
    display:block;
    height:4px;
    margin:0 auto;
    position:relative;
    top:13px;
    width:16px;
}

.pictoAjouter:after {
    height:16px;
    top:3px;
    width:4px;
}

/* picto avatar
 ------------------------------------------------------ */
.pictoAvatar:before,
.pictoAvatar:after {
    background:#fff;
    content:'';
    display:block;
    height:17px;
    margin:0 auto;
    position:relative;
    top:6px;
    width:15px;
    border-radius:17px;
    -webkit-border-radius:17px;
}

.pictoAvatar:after {
    top:7px;
    width:30px;
    border-radius:17px 17px 0 0;
    -webkit-border-radius:12px 12px 0 0;
}


/* #STRUCTURE
 ****************************************************** */

#content, #leftMenu {
    float:left;
}

#content {
    background:#fff;
    display:block;
    width:100%;
    position: absolute;
    height: 100%;
}

#leftMenu {
    background:#353535;
    line-height:1;
    width:250px;
}

#cacheNoirEcran,
#cacheEcran,
#headerRecherche,
#boutonMenuPrincipalFermer,
#champsRecherche {
    display:none;
}

.open-menu {
    overflow-x:hidden;
}

.mm-page {
    background-color:#fff !important;
}

.mm-menu {
    background-color:#2e2e2e;
}

/* Footer */
.footer {
    background-color: #2d2d2d;
    height: 80px;
    position: fixed;
    bottom: 0;
    width: 100%;
}


/* #MENU
 ****************************************************** */

/* cache le menu avant le lancement du js mmenu*/
nav#menu:not(.mm-menu){
    display: none;
}

.menuOn {
    background-color:#2e2e2e;
    padding-bottom:10px;
    position:absolute;
    width:250px;
    z-index:0;
}

/* labels */
.menuLabel {
    background-color:#616161;
    color:#9a9a9a;
    display:inline-block;
    font:12px/22px DinWeb-Medium;
    height:20px;
    margin:0 0 1px 10px;
    padding:0 10px;
    position:relative;
    text-transform:uppercase;
    top:10px;
}


.labFooter {
    background-color:#434343;
}

/* menu Nx */
#menu ul {
    list-style:none;
    margin-bottom:5px;
    padding-top:10px;
    width:250px;
}

#menu li {
    background-color:#616161;
    display:block;
    height:30px;
    margin:0 10px 1px;
    padding:0 10px;
}

#menu li.menuPremium {
    background: #FF7D65;
}


#menu li,
#menu a {
    color:#fff;
    display:block;
    font:14px/33px DinWeb-Bold;
    text-decoration:none;
    text-transform:uppercase;
}

#menu .premium-user {
    background-color: #FF7D65;
    text-align: center;
}

#linkWeb li {
    background: #04739a;
    padding: 15px;
    text-align: center;
    text-transform: uppercase;
    margin-top: 30px;
    border-radius: 5px;
    box-shadow: 6px 6px 12px #aaa;
}
#linkWeb li a{
    color: #ffffff;
}

#linkWeb li:first-child{
    margin-top: 15px;
}



/* menu connecte */
#navConnexion a {
    background-repeat:no-repeat;
    padding-left:25px;
}

#navConnexion .favoris a {
    background-image:url(../images/picto-favoris.png);
    background-position:0 8px;
}

#navConnexion .playlist a {
    background-image:url(../images/picto-playlist.png);
    background-position:0 7px;
}

#navConnexion .connectAccount a {
    background-image:url(../images/picto-connection.png);
    background-position:0 7px;
}
#navConnexion .monCompte a {
    background-image:url(../images/picto-user.png);
    background-position:0 7px;
}

/* menu N2 */
#menu .menuN2 li {
    background-color:#434343;
}

#menu .menuN2 li,
#menu .menuN2 a {
    font:14px/33px DinWeb-Light;
    text-transform:none;
}

#menu .menuN2 .connectAccount a {
    color:#178eb9;
}

#menu #appMobile {
    background-image:url(../images/picto-ios-apple.png),url(../images/picto-android.png);
    background-repeat:no-repeat;
    background-position:165px 4px,right 4px;
    padding-right:55px;
}

#menu #nousSuivre {
    background-image:url(../images/picto-facebook.png),url(../images/picto-twitter.png),url(../images/picto-instagram.png),url(../images/picto-youtube.png);
    background-repeat:no-repeat;
    background-position:100px 5px,130px 5px,160px 5px,right 6px;
    padding-right:55px;
}


/* #HEADER
 ****************************************************** */

/* habillage header
 ------------------------------------------------------ */
#header {
    /*background:#f3f3f3 url(../images/trame-ombre.gif) repeat-x 0 bottom;*/
    height:48px; /* hauteur 155px quand slider deploye */
    margin:0 0 30px 0;
}

#header[style$='155px;'] {
    background:#f3f3f3 url(../images/trame-ombre.gif) repeat-x 0 bottom;
}

#header[style$='155px;'] .interfaceTopHeader {
    background: none;
}

.search-voile {
    background-color: #000;
    bottom: 0;
    left: 0;
    opacity:0.9;
    outline: 0 none;
    overflow-x: auto;
    overflow-y: scroll;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 499;
    display: none;
}

#header[style$='155px;'] ~ .search-voile {
    top: 148px;
}

.logo {
    display:block;
    float:inherit;
    margin:5px auto 0 auto;
    padding-top:5px;
    position:relative;
    width:52px;
    z-index:200;
}

/* interface header
 ------------------------------------------------------ */
.interfaceTopHeader {
    background: url(../images/trame-ombre.png) repeat-x 0 0;
    position:absolute;
    display:block;
    width:100%;
    z-index:500;
}

.boutonMenu {
    cursor:pointer;
    display:block;
    float:left;
    height:30px; width:30px;
    margin:5px 0 0 5px;
    position:relative;
    z-index:200;
}

#boutonOption,
#boutonOption2 {
    margin:0 0 0 5px;
}

.boutonRecherche {
    cursor:pointer;
    display:block;
    float:right;
    margin:5px 5px 0 0;
    position:relative;
    z-index:200;
}

#suggestform {
    display:block;
    height:50px;
    margin:0;
}

.champsRecherche {
    display:block;
    margin:5px auto 0;
    width:70%;
}

.champsRecherche.crossClear {
    background-image:url(../images/picto-close-champs.png);
    background-position: 98.5% center;
    background-repeat: no-repeat;
}

/* header recherche slider
 ------------------------------------------------------ */
#slidercontainer {
    clear:both;
    height: 0;
    overflow: hidden;
    padding: 0;
}

#slidercontainer h2 {
    font-family:DinWeb-Bold;
    font-size:18px;
}

#slidercontainer ul {
    background-color:#fff;
    border-bottom:2px solid #d6d6d6;
    height:50px;
    margin:5px 0 0 0;
}

#slidercontainer li {
    display:inline-block;
}

#slidercontainer .caleSlider {
    padding:0 30px 0 20px;
}

#slider-range.ui-widget-content {
    border:none;
}

#slider-range .ui-slider-range {
    background-color:#148db8;
    height:6px;
    position:absolute;
    top:-4px;
}

#slider-range.ui-corner-all {
    background:none transparent;
    -webkit-border-radius:0;
    border-radius:0;
}

#slider-range .ui-slider-handle {
    background-color:#1e8eb9;
    border:2px solid #d6d6d6;
    cursor:pointer;
    height:24px; width:24px;
    position:absolute;
    top:-16px;
    -webkit-box-shadow:0 2px 2px 0 rgba(0, 0, 0, 0.3);
    box-shadow:0 2px 2px 0 rgba(0, 0, 0, 0.3);
    -webkit-transition:box-shadow 0.2s linear 0s;
    transition:box-shadow 0.2s linear 0s;

}

#slider-range .ui-slider-handle.ui-state-active {
    -webkit-box-shadow:0 1px 2px 0 rgba(0,0,0,0.7), 0 0 3px #094054 inset;
    box-shadow:0 1px 2px 0 rgba(0,0,0,0.7), 0 0 3px #094054 inset;
}

#slidercontainer input {
    background:none transparent;
    border:none;
    font-family:DinWeb-Light;
    font-size:20px;
    padding:0;
    width:50px;
}

#slidercontainer li {
    padding:6px;
}

#slidercontainer li:first-of-type {
    float:left;
}

#slidercontainer li:first-of-type input {
    text-align:left;
}

#slidercontainer li:last-of-type {
    float:right;
}

#slidercontainer li:last-of-type input {
    text-align:right;
}

#slidercontainer input.action {
    background-color:#178eb9;
    font:14px/32px 'DINWeb-Bold';
    height:auto; width:auto;
    margin:0 auto;
    padding:8px 10px 6px;
}

.sliderFiltre {
    position:relative;
    top:-60px;
}


/* #PAGE
 ****************************************************** */

html.mm-opening .mm-page {
    margin: 0 0 0 -70px;
}

html.mm-opening .mm-page {
    left: 320px;
}

html.mm-opened .mm-page {
    box-shadow:none;
}

#page {
    padding-bottom:38px;
}

#main-position {
    position:relative;
}

#container {
    background-color:#fff;
    display:block;
}

h1 + .container,
h1 + .container.anpmRub,
h1 + .container.popVidRub {
    padding-top:10px;
}

/* section une
 ------------------------------------------------------ */
.grandTitre {
    background:none;
    border:none;
    display:block;
    font-size:22px;
    height:35px; width:100%;
    line-height:45px;
    margin-bottom:2px;
    text-align:center;
}

.grandTitrePremium {
    font-size:19px;
    color: #fff;
}

.uneVideo {
    background-color:#000;
}

#une .container {
    text-align:center;
    width:100%;
}

#une + #container h2 {
    font-size: 18px;
    line-height: 19px;
}

.maxPhoto {
    height:auto;
    max-width:620px;
    vertical-align:bottom;
    width:100%;
}

.titreUne {
    background-color:rgba(0,0,0,0.5);
    bottom:0; left:0;
    color:#fff;
    position:absolute;
    text-align:left;
    width:100%;
}

.titreUne h3 {
    color:#fff;
    font-size:18px;
    line-height:24px;
    margin-bottom:0;
    padding:10px;
    overflow: hidden;
    max-height: 65px;
}

.titreUne p {
    color:#fff;
    opacity: 0.75;
    padding:0 10px 10px 10px;
}

.descUne {
    background-color:rgba(0,0,0,0.5);
    padding:0 10px 15px 10px;
    position: relative;
    margin-bottom: 20px;
    text-align:left;
    overflow: hidden;
    max-height: 90px;
}

.descUne a {
    color:#fff;
    opacity: 0.75;
}

/* section container
 ------------------------------------------------------ */
.container-footer {
    position: absolute;
    /*background: #616161;*/
    width: 100%;
    border-top: 8px solid #fff;
    color: #fff;
    font-size: 12px;
}

h1 {
    background-color:#dadada;
    border-bottom:solid 5px #2b98bf;
    display:block;
    margin-top:15px;
    padding-top: 4px;
    text-align:center;
    width:100%;
}

h1 > a.pictoFleche {
    display:block;
    float:right;
    height:28px;
    margin: 0 5px 0 0;
    width:28px;
}

h1 > a.titleRub {
    line-height:34px;
    display: inline-block;
    margin: 0 -28px 0 0;
    color: #181818;
}

.videoContent {
    margin:0 10px 20px;
    position:relative
}

.videoContent:after {
    content:'\0020';
    display:block;
    height:0; width:0;
    overflow:hidden;
    visibility:hidden;
}

.videoContent h3 {
    background-color:#000;
    color:#fff;
    display:inline-block;
    font-family:DinWeb-Light;
    font-size:20px;
    left:5px; top:149px;
    padding:5px 5px 3px 5px;
    position:absolute;
    z-index:30;
}

.videoContent h3 + a{
    top:8px;
}

.videoContent_1 {
    margin:0 -10px;
}

.videoContent_2 {
    position:relative;
    height:230px;
}

.videoContent_2 > div {
    height:169px; width:300px;
    overflow:hidden;
}

.videoContent_2 > a {
    position:relative;
    top:5px;
    z-index:35;
}

.videoContent_2 img {
    position:relative;
    width:300px;
}

.memoires-partagees:before {
    background: url(/extension/inaextension/design/ogpv3/images/cartouche-memoires-partagees.png) no-repeat;
    content: '';
    display: block;
    height: 28px;
    margin: 1px 0 0 1px;
    position: absolute;
    width: 69px;
    z-index: 99;
}

/* rubrique ANPM
 ------------------------------------------------------ */
#rubANPM  a > p {
    color: #444;
}

@media only screen and (min-width: 768px) {
    #rubANPM .videoContent_2 {
        height: 290px;
    }
}


/* #RECHERCHE
 ****************************************************** */

/* tri resultats
 ------------------------------------------------------ */
.navResultats {
    border-bottom:1px solid #e9e9e9;
    margin:0 auto;
    width:300px;
}

.navResultats li {
    display:table-cell;
    padding-right:10px;
    text-align:center;
    width:100px;
}

.navResultats li:last-of-type {
    padding-right:0;
}

.navResultats a {
    border-bottom:7px solid #d6d6d6;
    color:#181818;
    display:block;
    font:16px/20px DinWeb-Bold;
    text-transform:uppercase;
    width:93px;
}

.navResultats .on a {
    border-color:#148db8;
    color:#148db8;
}

.navResultats .niet a,
.navSuggestions .niet a {
    border-color:#f5f5f5;
    color:#b2b2b2;
}

/* compteur */
.countResultats {
    margin:18px auto;
    width:300px;
}

.countResultats li {
    display:block;
    font:19px DinWeb-Bold;
    text-align:center;
}

.countResultats span {
    font-family:DinWeb-light;
}

/* resultats recherche
 ------------------------------------------------------ */
.blocSuggestions {
    border-bottom:1px solid #ccc;
    float:left;
    margin:0 10px 5px 0;
}

.blocSuggestions h2 {
    max-height:36px;
    margin:0;
    overflow:hidden;
}

.blocSuggestions h2 a {
    color:#181818;
}

.blocSuggestions .date,
.blocSuggestions .vues {
    line-height:14px;
    margin:0;
}

.blocSuggestions .date {
    color:#666;
    font-size:13px;
    margin-top:4px;
}

.blocSuggestions .vues {
    color:#666;
    font-size:12px;
    font-weight:bold;
}

.blocSuggestions .date a,
.blocSuggestions .vues a {
    color:#666;
}

.preLoader {
    background:url(../images/newLoader.png) no-repeat 50% 0;
    padding-top:50px;
    text-align:center;
}

.preLoader2 {
    background:url(../images/newLoader.png) no-repeat 50% 0;
    padding-top:50px;
    text-align:center;
}

/* #NOTICE
 ****************************************************** */

/* player
 ------------------------------------------------------ */
video {
    height:auto; width:100%;
    vertical-align:bottom;
}

.uneVideo .annee h3 {
    background-color:#000;
    top:2%; left:1%;
    color:#fff;
    display:inline-block;
    font-family:DinWeb-Light;
    font-size:20px;
    padding:5px 5px 3px 5px;
    position:absolute;
    z-index:30;
    display: none;
}

.inaPlayerAnnee {
    display: none !important;
}

.pushPremium {
    display: none !important;
}
.jw-icon[aria-label="Afficher le code d'export"] /*.jw-icon-inline .jw-button-color.jw-reset*/ {
    display: none !important;

}

/*.jw-icon-cast {*/
    /*display:block !important;*/
/*}*/

/*google-cast-launcher {*/
    /*box-shadow: none !important;*/
    /*display:block !important;*/
/*}*/

.block-infos {
    background-color: #f4f4f4;
    border-radius: 3px;
    color: #2d2d2d;
    font-size: 12px;
    padding: 3px 5px 2px;
    margin-bottom: 10px;
}
.block-infos span:after {
    content: '|';
    padding: 6px;
}
.block-infos span:after {
    content: '|';
    padding: 6px;
}
.block-infos span:last-child:after {
    content:'';
    padding: 0;
}

.ssTitreEmission {
    font-size: 13px;
    font-family: arial;
    color: #148db8;
}


/* contenu notice
 ------------------------------------------------------ */
#container .noticePage:last-of-type {
    padding-bottom:38px;
}

/* titre notice */
.fourteen > h2 {
    font-size:22px;
    line-height:24px;
    margin:10px 0;
}

.labelNotice {
    background: #c3b8b8;
    color: white;
    padding: 3px;
    font-size: 12px;
    font-family: arial;
    text-transform: uppercase;
    float: left;
    line-height: 12px;
    margin: 2px;
}

.picto_fleche_bas {
    cursor:pointer;
    position:absolute;
    right:0; top:10px;
}

/* detail notice */
#noticeDescription {
    display: none;
}

#noticeDescription p.titre {
    text-transform: uppercase;
    margin-top: 10px;
    color: #148db8;
    font-weight: bold;
}
#noticeDescription p.ssTitre {
    font-weight: bold;
    text-transform: capitalize;
}
.notice-video {
    border : 1px solid #c3b8b8;
    margin-bottom: 10px;
    padding: 15px 10px;
    font-size: 14px;
}

.notice-video-premium {
    background-color: #c4ae7f;
    padding: 15px 10px;
}

.notice-video-premium a{
    color: #2d2d2d;
    text-decoration: underline;
}

.container .columns.bordVid {
    border-bottom:1px solid #d3d3d3;
    margin:0;
    width:inherit;
}

/* navigation suggestions - commentaires */
.filtreSuggest {
    padding:10px 0 15px 0;
}

.navSuggestions {
    display: block;
    border-bottom:3px solid #e9e9e9;
    margin:0 auto;
    width:300px;
}

.navSuggestions li {
    display:table-cell;
    padding-left:10px;
    text-align:center;
    width:97%;
    border-bottom:7px solid #148db8;
    color:#148db8;
    display:block;
    font:16px/20px DinWeb-Bold;
    text-transform:uppercase;
}

#infiniteLoader,
.connectComment {
    text-align:center;
}

.connectComment a {
    margin:10px auto;
}

/* ajouter commentaire */
.nouveauCommentaire {
    border-bottom:1px solid #d3d3d3;
    display:inline-block;
}

.nouveauCommentaire form {
    margin:0
}

.nouveauCommentaire input[type="submit"] {
    float:right;
    margin:4px 0 16px;
    padding:2px 10px 0 10px;
}

.nouveauCommentaire .status {
    display:none;
    float:left;
    font-size:11px;
    font-weight:normal;
    line-height:12px;
    padding-top:2px;
}

/* commentaires */
.listeCommentaires li {
    background:url(../images/avatar.svg) no-repeat;
    background-size:47px;
    border-bottom:1px solid #d3d3d3;
    margin:12px 0;
    padding:0 0 12px 60px;
}

.listeCommentaires p:first-of-type {
    font-size:16px;
    margin-bottom:0;
}
.listeCommentaires p:nth-child(2) {
    margin:0;
    color:#666;
    font-size:13px;
}


/* #PLAYLIST
 ****************************************************** */

section[id^="swipe_playlist_"] {
    float:left;
    /*height:280px;*/
    margin:0 10px;
    position:relative;
}

.swiper-container {
    width:300px;
}

.swiper-wrapper {
    height:169px !important;
    overflow:hidden;
}

.swiper-container .title {
    height:34px;
    overflow:hidden;
    padding:2px 0;
    text-align:left;
    width:300px;
}

.swipePlaylist .visuelPlaylist img {
    width:300px;
}

.swiper-slide.swiper-slide-visible {
    height:auto !important;
}

.navPlaylist {
    background:#000 url(../images/bg-navplaylist2.jpg) no-repeat;
    color:#fff;
    height:30px; width:300px;
    line-height:31px;
    text-align:center;
}

.swiper-slide a[data-nav] {
    display: block;
    height: 1px;
    width: 1px;
}


/* #ARTICLE
 ****************************************************** */

.articleIna {
    padding-bottom:38px;
    /*text-align:justify;*/
}

.articleIna > .sixteen.columns.clearfix {
    color:#828487;
    font:bold 15px/17px Arial, "Helvetica Neue", Helvetica, sans-serif;
    padding-bottom:10px;
}

.articleIna h2 {
    font-size:21px;
    line-height:23px;
    margin:15px 0 10px;
}
.articleSuggestion {
    font-size: 20px;
    line-height: 23px;
    margin: 25px 0 10px;
}

.pagineSuggestion{
    text-align: right;
    margin-top: -15px;
}

.articleIna .titrePlaylist {
    margin-top:10px;
}

.container.articleIna .columns {
    margin-left:0;
    margin-right:0;
}

.articleIna section[id^="swipe_playlist_"] {
    margin:0;
    width:100%;
}

.articleIna .swiper-container {
    margin:0;
}


/* #PERSONNALITE #EMISSIONS
 ****************************************************** */

/* liste
 ------------------------------------------------------ */
.gEmission [id^="address-"]:first-of-type,
.gPersonnalite [id^="address-"]:first-of-type {
    display:none;
}

.gEmission .border-box,
.gPersonnalite .border-box {
    padding:10px 0 0;
    text-align:left;
}

.gEmission > .uneVideo > .container,
.gPersonnalite > .uneVideo > .container {
    width:100%;
}

.gEmission h1,
.gPersonnalite h1 {
    font-size:22px;
    line-height:24px;
    margin:10px 0;
    padding:0 5px 8px;
    border-bottom:1px solid #ccc;
    font-family:Georgia, Times, "Times New Roman", serif;
    font-weight:normal;
    text-transform:none;
    text-align:left;
    background:transparent;
    width:auto;
    height:auto;
}

.container.listes {
    padding-bottom:38px;
    width:auto;
}

.lettrePersonnalite {
    background:#f3f3f3;
    display:block;
    font:24px/41px DinWeb-Bold,"Trebuchet MS",Arial,Helvetica,sans-serif;
    height:38px;
    margin:20px 0 10px;
    padding:0 0 0 10px;
}

.lettrePersonnalite:first-of-type {
    margin-top:0;
}

.champsRecherchePlein {
    display:block;
    margin:5px auto 10px;
    width:90%;
}

/* clavier
 ------------------------------------------------------ */
.fondClavierPersonnalite {
    background:#000;
    display:block;
    height:100%; width:100%;
    left:0; top:0;
    position:fixed;
    z-index:998;
}

.clavierPersonnalite {
    display:block;
    margin:10px auto 0;
    text-align:center;
    width:80%;
    z-index:999;
}

.clavierPersonnalite li {
    background:#fff;
    display:inline-block;
    font:3.4em DinWeb-Bold,"Trebuchet MS",Arial,Helvetica,sans-serif;
    height:60px; width:60px;
    margin:0 1px 5px 0;
    overflow:hidden;
    text-align:center;
    vertical-align:bottom;
}

.clavierPersonnalite a {
    background-color:#fff;
    color:#000;
    display:block;
    line-height:69px;
}

.clavierPersonnalite a:active {
    background-color:#148db8;
    color:#fff;
    display:inline-block;
    width:60px;
}

.clavierPersonnalite li:last-of-type {
    background:#484848;
}

.clavierPersonnalite li:last-of-type a {
    background:#484848;
    color:#ddd;
    line-height:58px;
}

.clavierPersonnalite li:last-of-type a:active {
    background:#484848;
    color:#148db8;
    display:inline-block;
    line-height:58px;
}


/* #PAGES STATIQUES (CGU - FAQ MOBILE)
 ****************************************************** */

.border-box {

    text-align:justify;
}

.border-box h2 b {
    font-weight:normal;
}

.titleFaq ul li {
    padding-top: 10px;
}
.titleFaq ul li:last-child {
    padding-bottom: 10px;
}
.titleFaq ul li a {
    color: #181818;
}

.answerFaq {
    padding: 10px;
    background-color: #efe5e5;
    margin-top: 10px;
}

.blocTitle {
    float: left;
    background-color: #efefef;
    padding: inherit;
}
.blocAnswer {
    border-bottom: 1px dashed #ccc;
    padding-bottom: 5px;
}
.contentFaq{
    width:100%;
    padding: 5px;
}

.fa {
    color: #656565;
    font-size: 50px !important;
}

.fa.fa-home {
    color: #656565;
    font-size: 20px !important;
}
.fa.fa-homePremium {
    color: #fff;
    font-size: 20px !important;
}
.fa-modif {
    font-size: 20px !important;
}
.fa-modif-pack {
    font-size: 15px !important;
}

#ssMenuProd .fa.arrow {
    float: right;
    color: #ffffff;
    margin-top: -23px;
}

#ssMenuProd .fa.arrow:before {
    content: "\f104";
    font-size: initial;
}

#ssMenuProd .clique>a>.fa.arrow:before {
    content: "\f107";
}

#menu li .ssMenuWeb li {
    background: #333;
    margin: -1px 10px 0 10px;
}



/* #PAGES ERREUR
 ****************************************************** */

.errorMob img {
    position:relative;
    vertical-align:bottom;
    width:100%;
}

.mobError .btAction {
    margin:20px auto;
}


/* #BARRE OUTILS
 ****************************************************** */

.barrePartagerAjouter {
    background-color:rgba(47,46,47,0.95);
    bottom:0; left:0;
    display:block;
    height:38px; width:100%;
    position:fixed;
    z-index:250;
}

.barrePartagerAjouter ul {
    margin-bottom:0;
    width:100%;
}

.barrePartagerAjouter li {
    display:inline-block;
    float:left;
    line-height:35px;
    margin-bottom:0;
    text-align:center;
    width:50%;
}

.barrePartagerAjouter a {
    color:#fff;
    cursor:pointer;
    display:inline-block;
    padding-left:24px;
    text-decoration:none;
}

.toolBarShare {
    background:url(../images/picto-partage-tr.svg) no-repeat 0 8px;
    background-size:16px 20px;
}

.toolBarAdd {
    background:url(../images/picto-ajouter.svg) no-repeat 0 10px;
    background-size:16px;
}

.barrePartagerAjouter .toolBarBrowse {
    padding-left:0;
}

.toolBarBrowse span span {
    font:20px DinWeb-Medium;
    padding:0 6px 0 0;
}

.toolBarSearch {
    background:url(../images/picto-loupe-blanc.png) no-repeat 0 8px;
}


/* #MON INA
 ****************************************************** */

/* playlists
 ------------------------------------------------------ */
.titrePlaylist h4 {
    font-size:18px;
    overflow:hidden;
    white-space:nowrap;
    width:300px;
    text-overflow:ellipsis;
}

.in-progress:after {
    background-color: #26aecb;
    color: #fff;
    content: 'en cours';
    display: block;
    font-family: arial;
    font-size: 10px;
    height: 20px;
    line-height: 21px;
    position: absolute;
    text-align: center;
    text-transform: uppercase;
    top: 40px;
    width: 60px;
}
.in-progress-2:after {
    background-color: #26aecb;
    color: #fff;
    content: 'en cours';
    display: block;
    font-family: arial;
    font-size: 10px;
    height: 20px;
    line-height: 21px;
    position: absolute;
    text-align: center;
    text-transform: uppercase;
    top: 40px;
    width: 60px;
    left: -109px;
}


/* #POPIN
 ****************************************************** */

/* habillage base
 ------------------------------------------------------ */
.popinContainer {
    display:none;
}

.blocEcranConnexion {
    display:block;
    height:100%; width:100%;
    margin:0 auto;
    position:absolute;
}

.cacheNoirEcran {
    background:#000;
    display:block;
    height:200%; width:110%;
    left:0; top:0;
    position:absolute;
    z-index:900;
    opacity:0.9;
}

.popin {
    background-color:#fff;
    display: none;
    font-size:13px;
    margin:50px auto;
    padding:12px 0 0 0;
    position:relative;
    width:248px;
    z-index:999;
}

.popin .champsInfos {
    width:180px;
}

.popin textarea {
    resize:vertical;
}

.blocTitre {
    border-bottom:1px solid #d1d1d1;
    height:24px;
}

.blocTitre > .titre {
    color:#2d2d2d;
    font-family:'DINWeb-Bold';
    font-size:18px;
    text-align:center;
}

.btFermer {
    /*  background:url(../images/bt-fermer.svg) no-repeat 0 0;
        background-size:30px;*/
    cursor:pointer;
    display:block;
    float:right;
    /*height:30px; width:30px;*/
    margin:-9px 3px 0 -32px;
}
.btFermerMdp {
    /*  background:url(../images/bt-fermer.svg) no-repeat 0 0;
        background-size:30px;*/
    cursor:pointer;
    display:block;
    float:right;
    /*height:30px; width:30px;*/
    margin:-5px 3px 0 -32px;
    height:25px;
    width: 25px;
}

form > .bouton {
    margin:10px auto;
}

.popin label,
.recaptcha_only_if_image,
.recaptcha_only_if_audio,
#recaptcha_widget li {
    font-size:11px;
    font-weight:normal;
    line-height:12px;
}

label.interface {
    font:13px/14px Arial, "Helvetica Neue", Helvetica, sans-serif;
    height:auto;
    margin:0;
    padding:4px 6px 6px 4px;
    text-align:left;
    text-transform:none;
}

label.interface input[type="checkbox"] {
    display:table-cell;
    float:left;
    position:relative;
    top:6px;
}

label.interface span {
    color:#444;
    display:table-cell;
    padding:2px 0 0 4px;
}

label.interface + label {
    margin-top:6px;
}

.popin input[type="submit"] {
    margin:10px auto;
}

/* connexion
 ------------------------------------------------------ */
#formConnexion li {
    margin-bottom:10px;
}

#formConnexion li:nth-child(4) div {
    margin:0 auto;
}

#formConnexion li:nth-child(5) {
    text-align:center;
}

div[for=connexionPersistante] {
    color:#6e6e6e;
    display:inline;
}

#loginForm .bouton.interface {
    max-width:none;
    padding:10px;
}

#loginForm input[type="checkbox"] {
    margin:0;
    top:0;
}

#loginForm .bouton.interface span {
    padding:0 0 0 6px;
}

/* popin confirmation */
.authOk {
    font-size:14px;
    line-height:16px;
    margin:0;
    padding-bottom:14px;
    text-align:center;
}

/* creation de compte
 ------------------------------------------------------ */

/* inscription step 1 */
#formInscription .titre {
    margin:0 0 0 15px;
    text-align:left;
}

#popupInscription {
    margin-top:10px;
}

#popupInscription > p {
    font-weight:bold;
    line-height:16px;
    margin-bottom:10px;
}

#popupInscription li,
#popinMail li {
    margin-bottom:10px;
}

#popupInscription li:nth-child(2) label {
    margin-bottom:4px;
}

.labelCheckbox {
    margin:0;
}

#popupInscription .labelCheckbox li {
    display:table-cell;
}

#popupInscription .labelCheckbox input[type=checkbox] {
    display:block;
    margin-bottom:-3px;
}

#popupInscription .labelCheckbox li:nth-child(2) {
    line-height:14px;
    padding-left:4px;
    padding-top:6px;
}

#popupInscription .validation {
    margin:20px 0 0;
}

#popupInscription .validation div {
    margin:5px auto;
}

/* inscription step 2 */
.bienvenueContent {
    display:inline-block;
    line-height:15px;
    margin:10px 20px;
}

.bienvenueContent p {
    margin:6px 0;
}

.bienvenueContent li a {
    color:#fff;
    margin:10px auto;
}

/* nous suivre
 ------------------------------------------------------ */
ul#popinNousSuivre,
#popinNousSuivre ul {
    display:flex;
    flex-direction:column;
    margin:10px auto;
    padding-bottom:10px;
    width:160px;
}

#popinNousSuivre li {
    display:inline-block;
    font-family:DinWeb-Light;
    height:32px; width:120px;
    margin:10px;
    max-width:none;
    text-align:left;
}

#popinNousSuivre a {
    color:#000;
    display:block;
    font-size:18px;
    line-height:34px;
    padding-left:24px;
    text-transform:none;
}

#popinNousSuivre li:nth-child(1) a {
    background:url(../images/logo-facebook.svg) no-repeat 0 8px;
    background-size:16px;
}

#popinNousSuivre li:nth-child(2) a {
    background:url(../images/logo-twitter.svg) no-repeat 0 8px;
    background-size:16px;
}

#popinNousSuivre li:nth-child(3) a {
    background:url(../images/logo-googleplus.svg) no-repeat 0 8px;
    background-size:16px;
}

#popinNousSuivre li:nth-child(4) a {
    background:url(../images/logo-youtube.svg) no-repeat 0 8px;
    background-size:16px;
}

/* SuivreMenu
 ------------------------------------------------------ */
ul#popinSuivreMenu,
#popinSuivreMenu ul {
    display:flex;
    flex-direction:column;
    margin:10px auto;
    padding-bottom:10px;
    width:160px;
}

#popinSuivreMenu li {
    display:inline-block;
    font-family:DinWeb-Light;
    height:32px; width:120px;
    margin:10px;
    max-width:none;
    text-align:left;
}

#popinSuivreMenu a {
    color:#000;
    display:block;
    font-size:18px;
    line-height:34px;
    padding-left:24px;
    text-transform:none;
}

#popinSuivreMenu li:nth-child(1) a {
    background:url(../images/logo-facebook.svg) no-repeat 0 8px;
    background-size:16px;
}

#popinSuivreMenu li:nth-child(2) a {
    background:url(../images/logo-twitter.svg) no-repeat 0 8px;
    background-size:16px;
}

#popinSuivreMenu li:nth-child(3) a {
    background:url(../images/logo-instagram.svg) no-repeat 0 8px;
    background-size:16px;
}

#popinSuivreMenu li:nth-child(4) a {
    background:url(../images/logo-youtube.svg) no-repeat 0 8px;
    background-size:16px;
}


/* applications mobile
 ------------------------------------------------------ */
#popinAppMobile {
    margin-bottom:0;
}

#popinAppMobile li a {
    display:block;
    height:60px; width:129px;
    margin:0 auto;
}

#popinAppMobile li:nth-child(1) a {
    background:url(../images/app-mob-android.png) no-repeat 0 0;
    margin-top:20px;
}

#popinAppMobile li:nth-child(2) a {
    background:url(../images/app-mob-apple.png) no-repeat 0 0;
}

#popinAppMobile .titre {
    margin:0 0 5px 5px;
    text-align:left;
}

/* partager - ajouter
 ------------------------------------------------------ */

/* ajouter */
.ajouterMob {
    margin:0 auto;
    padding:10px 0 20px;
}

.ajouterMob li {
    text-align:center;
}

.ajouterMob li a {
    margin:20px auto;
    max-width:none;
    width:140px;
}

#popinAjouter .loader {
    padding:20px 0;
    text-align:center;
}

/* partager */
#popinPartager li:nth-child(4) a {
    background:url(../images/picto-mail.svg) no-repeat 0 9px;
    background-size:16px 13px;
}

#popinPartager li:last-of-type {
    margin-bottom:10px;
}

/* captcha
 ------------------------------------------------------ */
#recaptcha_image {
    padding-top:4px;
}

#recaptcha_widget {
    overflow:hidden;
    width:190px;
}

#recaptcha_widget ul {
    display:table;
    margin:0;
    width:100%;
}

#recaptcha_widget li {
    display:table-cell;
    padding:5px 0;
}

#recaptcha_widget li:last-of-type {
    padding-left:28px;
}

#recaptcha_image img  {
    width:188px;
}

#recaptcha_response_field {
    width:180px;
}

#recaptcha_widget .interface,
#recaptcha_audio_play_again {
    font-size:14px;
    line-height:32px;
    margin:0;
}

#recaptcha_audio_play_again {
    left:45px; top:-15px;
    position:relative;
}

#recaptcha_audio_download {
    position:relative;
    top:-25px;
}

.ui-widget-overlay{
    background: #000;
    opacity: 0.9;
}
.ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-front {
    top:80px !important;
}


/* #MEDIA QUERIES
 ****************************************************** */

/* #320 PORTRAIT */
@media only screen and (max-width: 320px) {

    /* titraille */
    h1 {
        height:auto;
        line-height:23px;
        padding:8px 0 4px;
    }

    /* structure */
    .ecranAnime {
        min-height:485px;
    }

    /* page*/
    video {
        padding:10px 0;
    }

    .videoContent_2 {
        height:auto;
        padding-bottom:25px;
        position:relative;
    }

    .videoOption{
        left:270px;
        top:66px;
    }

    .blocSuggestions {
        margin-right:0;
    }

    /* mon ina - playlists */
    section[id^="swipe_playlist_"] {
        margin:0;
    }

    /* popin */
    .popin {
        margin:20px auto;
    }

}


/* #360 PORTRAIT */
@media only screen and (min-width: 360px) and (max-width: 767px) {

    /* titraille */
    /*  h1 {
            height:auto;
            line-height:23px;
            padding:8px 0 4px;
        }*/

    /* structure */
    .ecranAnime {
        min-height:645px;
    }

    /* header */
    .champsRecherche {
        width:73%;
    }

    /* page */
    video {
        padding:10px 0;
    }

    .videoContent_2 {
        height:auto;
        padding-bottom:25px;
        position:relative;
    }

    .blocSuggestions {
        margin-right:0;
    }

    #listPersonnalites .container {
        padding:0 10px;
        width:auto;
    }

    #listPersonnalites .sixteen.columns,
    #listPersonnalites .blocSuggestions {
        width:100%;
    }

    /* clavier personnalite */
    .clavierPersonnalite {
        margin:50px auto 0;
        width:85%;
    }

    .clavierPersonnalite li {
        font-size:3.5em;
        height:70px; width:70px;
    }

    .clavierPersonnalite a {
        line-height:79px;
    }

    .clavierPersonnalite a:active {
        width:70px;
    }

    .clavierPersonnalite li:last-child a,
    .clavierPersonnalite li:last-child a:active {
        line-height:70px;
    }

    /* mon ina - playlists */
    section[id^="swipe_playlist_"] {
        margin:0;
    }

    /* popin */
    .popin {
        margin:20px auto;
    }

}

/* #480 LANDSCAPE */
@media only screen and (min-width: 480px) and (max-width: 767px) and (orientation: landscape) {

    /* structure */
    .ecranAnime {
        min-height:365px;
    }

    /* header */
    .champsRecherche {
        width:80%;
    }

    /* page */
    .container.resultRecherche,
    .container.anpmRub,
    .container.popVidRub,
    .container.articleIna,
    .container.noticePage {
        padding:0 20px;
        width:auto;
    }

    .container.resultRecherche .sixteen.columns,
    .container.anpmRub .sixteen.columns,
    .container.popVidRub .sixteen.columns,
    .container.articleIna .sixteen.columns,
    .container.noticePage .sixteen.columns {
        width:auto;
    }

    .container.noticePage .fourteen.columns {
        width:94%;
    }

    .container.resultRecherche .ten.columns,
    .container.anpmRub .ten.columns,
    .container.popVidRub .ten.columns,
    .container.noticePage .ten.columns {
        max-width:74%;
        width:auto;
    }

    .container.resultRecherche .blocSuggestions,
    .container.anpmRub .blocSuggestions,
    .container.popVidRub .blocSuggestions,
    .container.noticePage .blocSuggestions {
        margin-right:0;
        min-height:82px;
        width:100%;
    }

    .container.noticePage .columns.bordVid {
        border-bottom:none;
    }

    .uneVideo + .container.noticePage {
        border-bottom:1px solid #d3d3d3;
        margin:0 20px;
        padding:0;
    }

    video {
        padding:10px 0;
    }

    .videoContent_2 {
        height:auto;
        padding-bottom:25px;
        position:relative;
    }

    /* clavier personnalite */
    .clavierPersonnalite {
        margin:30px auto 0;
        text-align:left;
        width:96%;
        z-index:999;
    }

    .clavierPersonnalite li {
        font-size:3.4em;
        height:60px; width:60px;
    }

    .clavierPersonnalite a {
        line-height:69px;
    }

    .clavierPersonnalite a:active {
        width:60px;
    }

    .clavierPersonnalite li:last-child a {
        line-height:58px;
    }

    .clavierPersonnalite li:last-child a:active {
        line-height:58px;
    }

    /* commentaires */
    .nouveauCommentaire {
        width:100%;
    }

    .nouveauCommentaire textarea {
        height:70px;
        width:98%;
    }

    /* mon ina - playlists */
    section[id^="swipe_playlist_"] {
        margin:0;
    }

}

/* #640 LANDSCAPE */
@media only screen and (min-width: 640px) and (max-width: 641px) and (orientation: landscape) {

    /* clavier personnalite */
    .clavierPersonnalite {
        margin:30px auto 0;
        text-align:left;
        width:590px;
        z-index:999;
    }

    .clavierPersonnalite li {
        font-size:3.5em;
        height:70px; width:70px;
    }

    .clavierPersonnalite a {
        line-height:79px;
    }

    .clavierPersonnalite a:active {
        width:70px;
    }

    .clavierPersonnalite li:last-child a {
        line-height:68px;
    }

    .clavierPersonnalite li:last-child a:active {
        line-height:68px;
    }

    /* page */
    .gEmission > .uneVideo > .container,
    .gPersonnalite > .uneVideo > .container,
    .gEmission > .container.gtitre,
    .gPersonnalite .container.gtitre    {
        width:620px;
    }

}

/* #768 PORTRAIT */
@media only screen and (min-width: 768px) and (max-width: 959px) {

    /* structure */
    .ecranAnime {
        min-height:1029px;
    }

    .container .sixteen.columns {
        width:inherit;
    }

    .container.noticePage .sixteen.columns {
        margin-left:0;
        margin-right:0;
    }

    /* header */
    .champsRecherche {
        background-position:98% 5px;
        width:87%;
    }

    /* page */
    #une .container,
    .uneVideo > .container,
    .gEmission > .uneVideo > .container,
    .gPersonnalite > .uneVideo > .container {
        width:620px;
    }

    video {
        height:346px; width:620px;
    }

    .blocSuggestions:nth-child(even) {
        margin-right:0;
    }

    .lettrePersonnalite {
        margin:20px auto 10px;
        width:640px;
    }

    .champsRecherchePlein {
        width:640px;
    }

    /* clavier personnalite */
    .clavierPersonnalite {
        margin:40px auto 0;
        width:80%;
        z-index:999;
    }

    .clavierPersonnalite li {
        font-size:4.5em;
        height:130px; width:130px;
    }

    .clavierPersonnalite a {
        line-height:139px;
    }

    .clavierPersonnalite a:active {
        width:130px;
    }

    .clavierPersonnalite li:last-child a {
        line-height:125px;
    }

    .clavierPersonnalite li:last-child a:active {
        line-height:125px;
    }

    /* commentaires */
    .nouveauCommentaire {
        margin:0 auto;
        width:100%;
    }

    .nouveauCommentaire textarea {
        height:55px;
        width:630px;
    }

}

/* #959 LANDSCAPE */
@media only screen and (min-width: 959px) {

    /* structure */
    .ecranAnime {
        min-height:1285px;
    }

    /* recherche */
    .champsRecherche {
        background-position:99% 5px;
        width:90%;
    }

    /* page */
    #une .container,
    .uneVideo > .container,
    .gEmission > .uneVideo > .container,
    .gPersonnalite > .uneVideo > .container {
        width:620px;
    }

    video {
        height:346px; width:620px;
    }

    .container .columns.bordVid {
        margin:0 0 0 10px;
        width:940px;
    }

    .picto_fleche_bas {
        right:10px;
    }

    .lettrePersonnalite {
        margin:20px auto 10px;
        width:960px;
    }

    .champsRecherchePlein {
        width:960px;
    }

    /* clavier personnalite */
    .clavierPersonnalite {
        margin:40px auto 0;
        text-align:left;
        width:80%;
        z-index:999;
    }

    .clavierPersonnalite li {
        font-size:4.5em;
        height:130px; width:130px;
    }

    .clavierPersonnalite a {
        line-height:139px;
    }

    .clavierPersonnalite a:active {
        width:130px;
    }

    .clavierPersonnalite li:last-child a {
        line-height:125px;
    }

    .clavierPersonnalite li:last-child a:active {
        line-height:125px;
    }

    h1 > a {
        margin:3px 5px 0 0;
    }

    /* commentaires */
    .nouveauCommentaire {
        display:block;
        width:100%;
    }

    .ajoutCommentaire {
        display:block;
        margin:0 auto;
        width:630px;
    }

    .nouveauCommentaire textarea {
        height:55px;
        width:620px;
    }

    #commentaires .sixteen.columns {
        margin-left:0;
    }

    /* mon ina - playlists */
    section[id^="swipe_playlist_"] {
        margin:0 6px;
    }

}


/* BANDEAU COOKIES
 ****************************************************** */

.cookies-bar {
    background-color: rgba(214,214,214,0.85);
    border-top: 1px solid #cecece;
    bottom: 0;
    display: none;
    position: fixed;
    width: 100%;
    z-index: 999;
}

.cookies-bar > .conteneur {
    background-color: transparent;
    color: #333;
    display: table;
    font-size: 12px;
    line-height: 13px;
    margin: 0 auto;
    padding: 5px 15px 6px;
    width: auto;
    vertical-align: middle;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.cookies-bar > .conteneur::after {
    clear: both;
}

.cookies-bar > .conteneur:last-of-type {
    padding-top: 0;
    text-align: center;
    display: table;
}

.cookies-bar > .conteneur:last-of-type > div {
    display: table-cell;
}

.cookies-bar > .conteneur > div {
    padding: 0 6px;
}

.cookies-bar > .conteneur > div > .bouton {
    border-radius: 3px;
    cursor: pointer;
    display: block;
    font-weight: normal;
    font: inherit;
    height: auto;
    margin: 0 auto;
    padding: 8px;
    text-transform: none;
    vertical-align: middle;
}

.cookies-bar > .conteneur > div > .btAction {
    background-color: #138bb6;
    border: 1px solid #138bb6;
    color: #fff;
}

.cookies-bar > .conteneur > div > .btLink {
    background-color: transparent;
    border: 1px solid #148db8;
}

.cookies-bar > .conteneur > div > .btAction:hover {
    -webkit-box-shadow:0 1px 2px 0 rgba(0,0,0,0.8);
    box-shadow:0 1px 2px 0 rgba(0,0,0,0.8);
}

.cookies-bar > .conteneur > div > .btLink:hover {
    text-decoration: underline;
}


@media (min-width: 715px) {
    .cookies-bar {
        display: table;
    }
    .cookies-bar > .conteneur:first-of-type {
        display: table-cell;
        padding: 5px 0 6px 15px;
    }
    .cookies-bar > .conteneur:last-of-type {
        display: table-cell;
        padding: 5px 15px 6px 0;
    }
    .cookies-bar > .conteneur > div > .bouton {
        white-space: nowrap;
    }
}


/* #HACKS NAVIGATEURS
 ****************************************************** */

/* internet explorer
 ------------------------------------------------------ */
.ie9 #boutonConnexion,
.ie9 #submitConnexion {
    width:110px;
}

/* safari + chrome
 ------------------------------------------------------ */
@media screen and (-webkit-min-device-pixel-ratio:0) {

    #slidercontainer input.action {
        padding:2px 10px 1px;
    }

    #recaptcha_widget li:first-of-type .bouton {
        width:80px;
    }

    #recaptcha_widget li:last-of-type .bouton {
        width:40px;
    }

    #recaptcha_widget li:last-of-type {
        padding-left:30px;
    }

    .clavierPersonnalite {
        width:90%;
    }

    input#sendComment {
        padding:0 10px;
    }

}

/* Pictos medias
------------------------------------------------------ */
.media-video:before,
.media-audio:before {
    background-repeat: no-repeat;
    content: '';
    float: left;
    height: 28px;
    margin-right: 20px;
    margin-top: 1.2px;
    position: relative;
    width: 28px;
}

.media-video:before {
    background-image: url(../images/picto-video.png);
}

.media-audio:before {
    background-image: url(../images/picto-audio.png);
}

.media-video.premium:before {
    background-image: url(../images/picto-video-premium.png);
}

.media-audio.premium:before {
    background-image: url(../images/picto-audio-premium.png);
}


/* PREMIUM
======================================================== */

/* Bloc raisons
------------------------------------------------------- */
.premium-subscribe__raisons {
    padding-top: 30px;
}

.premium-subscribe__raisons:before {
    content: '4';
    display: block;
    float: left;
    font-family: DinWeb-Bold;
    font-size: 63px;
    line-height: 68px;
}

.premium-subscribe__raisons p {
    line-height: 25px;
    margin-left: 44px;
    text-transform: uppercase;
}

.premium-subscribe__raisons p:first-of-type {
    font-family: DinWeb-Bold;
    font-size: 25px;
}

.premium-subscribe__raisons p:nth-child(2) {
    font-family: DinWeb-Light;
    font-size: 24px;
    letter-spacing: 0.005em;
}

.premium-subscribe__raisons p:last-of-type {
    color: #c4ae7f;
    font-family: DinWeb-Bold;
    font-size: 30px;
    letter-spacing: 0.015em;
    line-height: 30px;
}

/* Bloc argumentaire
------------------------------------------------------- */
.premium-subscribe__arguments {
    /*border-bottom: 2px solid #e5e5e5;*/
    padding-bottom: 20px;
    padding-top: 20px;
}

.premium-subscribe__arguments ol {
    counter-reset: premium;
    list-style-position: outside;
    margin-bottom: 0;
    margin-left: 0;
    margin-top: 0;
}

.premium-subscribe__arguments ol > li {
    counter-increment: premium;
    list-style-type: none;
    margin-bottom: 10px;
    margin-left: 42px;
    text-align: left;
}

.premium-subscribe__arguments ol > li strong {
    font-family: DinWeb-bold;
    font-weight: normal;
}

.premium-subscribe__arguments ol > li:before {
    background-color: #e5e5e5;
    color: #181818;
    content: counter(premium,decimal);
    display: inline-block;
    float: left;
    font-family: DinWeb-Bold;
    font-size: 16px;
    height: 28px;
    line-height: 29px;
    margin-left: -42px;
    margin-right: 10px;
    text-align: center;
    width: 28px;
}

.premium-subscribe__arguments ol > li:nth-child(3),
.premium-subscribe__arguments ol > li:last-child {
    line-height: 28px;
}

@media (min-width: 769px) {
    .premium-subscribe__raisons {
        bottom: 0;
        display: table;
        left: 0;
        margin: auto;
        right: 0;
        top: 0;
    }
    .premium-subscribe__arguments ol > li {
        line-height: 28px;
    }
}

.premium-subscribe__arguments .h2 {
    font-family: DinWeb-Medium;
    font-weight: normal;
    text-transform: uppercase;
}

.btn--block {
    display: block;
    max-width: inherit;
    margin: 10px 0;
}

.btn--block + .btn--block {
    margin-top: 5px;
}

.btn--premium {
    background-color: #c4ae7f;
    color: #fff !important;
}

/* Bloc : Module de mise en avant en 2 options
------------------------------------------------------- */
.block-hightlights{
    background-color: #2d2d2d;
    padding: 0;
    height: auto;
    overflow: hidden;
    width: 300px;
    position: relative;
}
.block-hightlights-content{
    display: block;
    height: 470px;
}
/* Ajout du picto pour le titre de la tétière haut */
.block-hightlights .box-headline {
    display: block;
}
.block-highlights .box-headline {
    background-color: #2d2d2d;
    padding: 15px;
    height: 90px;
}
.block-hightlights .box-headline .title {
    color: #c0c0c0;
    display: block;
    font-size: 23px;
    text-transform: uppercase;
    padding: 15px;
}
.block-hightlights .box-headline .title:after {
    background-image: url("../images/calendrier_blanc.svg");
    display: inline-block;
    content:"";
    height: 23px;
    width: 23px;
    position: absolute;
    right: 0;
    margin-right: 15px;
    top: 10px;
}
.block-hightlights .subhead {
    color: #c0c0c0;
    display: block;
    text-transform: uppercase;
    font-size: 14px;
    text-align: right;
    margin-right: 130px;
    margin-bottom: 13px;
}
/* Ajout du logo partenaire */
.block-hightlights .logo-france-info:after {
    background: url("../images/franceinfo_logo_110xp_web.png");
    background-repeat: no-repeat;
    content: "";
    display: inline-block;
    width: 110px;
    height: 21px;
    position: absolute;
    right: 10px;
    top: 43px;
}
.block-hightlights .subtitle {
    color: #28adc5;
    display: block;
    font-size: 30px;
    padding-bottom: 5px;
    line-height: 35px;
    text-transform: none;
    text-align: center;
    width: 100%;
}
.block-highlights.grid a {
    cursor: pointer;
}

/* Pavé gris anthracite*/
.box-headline.top {
    display: block;
    height: 40px;
    overflow: hidden;
    line-height: 1;
}
.box-headline.bottom {
    display: block;
    overflow: hidden;
    height: 160px;
    vertical-align: middle;
}

/* 2 variantes de textes  */
.block-hightlights .text {
    color: #f4f4f4;
    font-size: 14px;
    line-height: 18px;
    padding-left: 15px;
    padding-right: 15px;
    text-transform: none;
}

.textPassword {
    color: #2d2d2d;
    font-size: 12px;
}

.homeDesc{
    font-size: 12px;
    line-height: initial;
}
.textSmall{
    font-size: small;
}

/* Mon Compte*/
[class$="-ina"]:before,
[class*="-ina "]:before {
    font-family: "ina-icons";
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    /* opacity: .8; */
    /* For safety - reset parent styles, that can break glyph codes*/
    font-variant: normal;
    text-transform: none;
    /* fix buttons height, for twitter bootstrap */
    line-height: 1em;
    /* Animation center compensation - margins should be symmetric */
    /* remove if not needed */
    margin-left: .2em;
    /* you can be more comfortable with increased icons size */
    /* font-size: 120%; */
    /* Uncomment for 3D effect */
    /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
.video-ina:before {
    content: '\e802';
}

.contentCommande{
    display: inline-block;
    padding: 4px 5px 0 10px;
    border: 1px solid rgba(45,45,45,0.4);
    margin-top: 10px;
}

table.monCompteCommande tr{
    border-bottom: 1px dashed #ccc;
}
table.monCompteCommande tr:last-child{
    border-bottom: none;
}
table.monCompteCommande td{
    vertical-align: middle;
    padding: 5px 0 5px 0;
}

.contentTableCompte{
    display: inline-block;
    padding: 5px 0 0 0;
    margin-top: 5px;
    background-color: #f6fcfe;
}
.contentTablePack{
    display: inline-block;
    padding: 5px 0 0 0;
    margin-top: 5px;
    background-color: #fff;
}

.contentTablePack td {
    font-size: 13px;
}

.contentTableCompte:last-child{
    border-bottom: none;
}

.contentTableCompte:first-child{
    margin-top: 5px;
}

.order-picto--ina {
    background: url(../images/logo-ina-25.png) no-repeat;
    display: block;
    height: 25px;
    width: 25px;
}

.order-picto--boutique {
    background: url(../images/logo-boutique-25.png) no-repeat;
    display: block;
    height: 25px;
    width: 25px;
}

.titleCompte {
    font-size: 16px;
    color: #2b98bf;
}
.titleRubriqueCompte{
    text-transform: uppercase;
    text-align: center;
    margin-bottom: 20px;
    font-size: 18px;
    background: #ccc;
    padding: 10px;
}

.status{
    font-size: 12px;
    margin-top: -5px;
    color: #a5a5a5;
    float: right;
}
.tag{
    background: #cbf2fd;
    border: 1px solid #9ae6fb;
    color: #656565;
    display: block;
    width: fit-content;
    margin-bottom: 5px;
    margin-right: 5px;
    padding: 5px;
    text-decoration: none;
    float: left;
}
.tagsinput{
    width: 300px !important;
    min-height: 70px !important;
}
#motsCles_tag{
    width: 114px !important;
}

.contentAllPlaylist{
    display:inline-block;
    padding: 4px 0 4px 4px;
    margin-bottom: 10px;
}

.contentAllLots {
    display:inline-block;
    padding: 4px;
    margin-bottom: 10px;
}
.contentAllLots:nth-child(even){
    padding: 4px;
    background-color: #efefef;
}

/* coordonnées bancaires */
.payment {
    background-image: url(../images/payment-cartes-bancaires.png);
    background-repeat: no-repeat;
    display: inline-block;
    height: 44px;
    width: 55px;
}
.payment + .payment {
    margin-left: 10px;
}
.payment-sm {
    background-image: url(../images/payment-cartes-bancaires-sm.png);
    background-repeat: no-repeat;
    display: inline-block;
    height: 33px;
    width: 55px;
}
.payment-sm + .payment-sm {
    margin-left: 10px;
}
.payment--cbleue {
    background-position: 0 top;
}
.payment--cbleue:hover,
.payment--cbleue.active {
    background-position: 0 bottom;
}
.payment--cbleue.payment-sm:hover,
.payment--cbleue.payment-sm.active {
    background-position: 0 bottom;
}
.payment--visa {
    background-position: -75px top;
}
.payment--visa:hover,
.payment--visa.active {
    background-position: -75px bottom;
}
.payment--visa.payment-sm {
    background-position: -57px top;
}
.payment--visa.payment-sm:hover,
.payment--visa.payment-sm.active {
    background-position: -57px bottom;
}
.payment--mastercard {
    background-position: -150px top;
}
.payment--mastercard:hover,
.payment--mastercard.active {
    background-position: -150px bottom;
}
.payment--mastercard.payment-sm {
    background-position: -112.5px top;
}
.payment--mastercard.payment-sm:hover,
.payment--mastercard.payment-sm.active {
    background-position: -112.5px bottom;
}
.payment--americanexpress {
    background-position: -225px top;
}
.payment--americanexpress:hover,
.payment--americanexpress.active {
    background-position: -225px bottom;
}
.payment--americanexpress.payment-sm {
    background-position: -169.5px top;
}
.payment--americanexpress.payment-sm:hover,
.payment--americanexpress.payment-sm.active {
    background-position: -169.5px bottom;
}
.payment--paypal {
    background-position: -300px top;
}
.payment--paypal:hover,
.payment--paypal.active {
    background-position: -300px bottom;
}
.payment--paypal.payment-sm {
    background-position: -225px top;
}
.payment--paypal.payment-sm:hover,
.payment--paypal.payment-sm.active {
    background-position: -225px bottom;
}

.table__my-account {
    background-color: #f2f2f2;
    width: 100%;
}
/* historique */
.text-center {
    text-align: center;
}
.pagination{
    display: inline-block;
    padding-left: 0;
    margin: 16px 0;
    border-radius: 0;
}


.pagination li {
    display: table-cell;
    font-size: 13px;
    font-weight: 700;
    line-height: 30px;
    padding: 0 10px;
    vertical-align: top;
}
.pagination li a {
    color: #999999;
    padding: 6px 1px;
}
.pagination li:hover a, .pagination li.on a {
    color: #656565;
    cursor: pointer;
}

.pagination > li > a, .pagination > li > span {
    position: relative;
    float: left;
    padding: 6px 12px;
    line-height: 1.25;
    text-decoration: none;
    color: #999999;
    background-color: transparent;
    border: 1px solid transparent;
    margin-left: -1px;
}

.pagination > li:first-child > a, .pagination > li:first-child > span {
    margin-left: 0;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
}

.pagination > li > .pagination__btn:before {
    color: #999999;
    font-family: FontAwesome;
    font-size: 20px;
    font-weight: 400;
    position: absolute;
    top: -1px;
    left: 8px;
}

a.pagination__btn.pagination__btn--next::before{
    left: 11px;
}

.pagination__btn--prev:before {
    content: '\f104';
    left: 6px;
}

.pagination__btn--next:before {
    content: '\f105';
    left: 8px;
}
.pagination > li > .pagination__btn {
    border-radius: 50px !important;
    border: 1px solid #999999;
    display: inline-block;
    height: 12px;
    margin-top: 2px;
    position: relative;
    width: 24px;
}

.pagination li a {
    color: #999999;
    padding: 6px 1px;
}

.pagination > li > .pagination__btn.disabled {
    color: #999999;
}

/* Panel
------------------------------------------------------- */
.panel-account {
    background-color: #f2f2f2;
    border: none;
    box-shadow: none;
    font-family: 'DINWeb-Regular', sans-serif;
    font-size: 14px;
    line-height: 1.25;
}
.panel-account strong {
    font-family: 'DINWeb-Bold', sans-serif;
    font-weight: 400;
}
.panel-account > .panel-heading {
    background-color: #148db8;
    color: white;
    padding: 10px 0 6px 15px;
}
.panel-account > .panel-heading .panel-title {
    font-family: 'DINWeb-Bold', sans-serif;
    font-size: 14px;
    text-transform: uppercase;
}
.panel-account > .panel-heading .label {
    background-color: white;
    border-radius: 0;
    color: #08addb;
    display: none;
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-size: 10px;
    font-weight: 700;
    margin-left: 15px;
    text-transform: uppercase;
    transform: translateY(-1px);
}
.panel-account.premium > .panel-heading {
    background-color: #c4ae7f;
}
.panel-account > .panel-footer {
    background-color: #f2f2f2;
    border: none;
    padding: 0 15px 2.mar0px !important;
}
.panel-account.active {
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.25);
}
.panel-account.active > .panel-heading {
    background-color: #148db8;
}
.panel-account.active > .panel-heading .label {
    display: inline-block;
}
.panel-account.active.premium > .panel-heading {
    background-color: #c4ae7f;
}
.panel-account.active > .panel-body {
    background-color: #f2f2f2;
    color: #000;
}
.panel-account.active > .panel-body .last-soonending {
    display: none;
}
.panel-account.active > .panel-footer:not(.running) {
    display: none;
}
.panel-account.active.soonending > .panel-body .last-soonending {
    display: block;
}
.panel-account.active.soonending > .panel-body .next-active {
    display: none;
}
.panel-account.active.soonending > .panel-footer {
    display: block;
}
.panel-account.active.soonending > .panel-footer.warning {
    color: #b52b27;
}
.panel-account.active.soonending > .panel-footer:not(.warning) {
    display: none;
}
.panel-account.tocome > .panel-body .last-soonending {
    display: none;
}
.panel-account.tocome > .panel-body .next-active {
    display: block;
}
.panel-account.tocome .panel-footer:not(.beginning) {
    display: none;
}
.panel-account.disabled {
    background-color: #e5e5e5;
}
.panel-account.disabled > .panel-heading {
    background-color: #d8d8d8;
    color: #999999;
}
.panel-account.disabled > .panel-heading .label {
    display: none;
}
.panel-account.disabled > .panel-body {
    color: #999999;
}
.panel-account.disabled > .panel-body .last-soonending {
    display: block;
}
.panel-account.disabled > .panel-body .next-active {
    display: none;
}
.panel-account.disabled > .panel-footer {
    background-color: #e5e5e5;
    color: #999999;
}
.panel-account.disabled > .panel-footer:not(.expired) {
    display: none;
}
.panel-account.disabled > .panel-footer.expired {
    color: #656565;
}

/* footer */
.footerSociaux{
    display: -webkit-inline-box;
}
.footerSociaux li{
    padding-left: 15px;
}
.footerSociaux li:first-child{
    text-transform: uppercase;
    color: #fff;
    padding: 3px;
}
.footerMentions{
    background-color: #2d2d2d;
    border-top:	5px solid #2b98bf;
    height: 120px;
}
.footerMentions a{
    color: #999999;
}
.fa-footer {
    font-size: 20px !important;
}

/* club abonnés */

.ClubAbonneSansOffre{
    border: 1px solid #757575;
    padding: 10px;
    background-color: #757575;
    color: #fff;
    text-transform: uppercase;
    margin-top: 20px;
}

.mobileContent{
    padding: 10px;
}