header#header {
    position: relative
}

.col-md-4 {
    padding: 0;
}

@media only screen and (max-width: 1024px) {

    body {
        font-size: 100%;
    }

    .container {
        width: 100%;
    }

    .side_menu {
        display: none
    }
	.forum.post_content .content .block_text.allwidth{
		width: 100%!important;
		margin-left:0;
	}

    nav {
        background: none;
        width: auto
    }

    /* PopUp Newsletter */
    #form_newsletter .btn_cnx {
        margin: 0 8px;
        float: left;
    }

    #form_newsletter label {
        margin: 0 8px
    }

    #form_newsletter input[type="text"] {
        margin: 20px 8px;
    }

    .dialog--open .dialog-inner {
        padding: 2.5em 13%;
    }

    /* Home Page */
    .act-inner-content h1 {
        line-height: 1.3;
        font-size: 1.3em;
    }

    .parcours p {
        margin: 18px 40px;
    }

    .parcours ul {
        transform: none;
        top: 0;
    }

    .blocks_cat .parcours {
        top: -56vh;
    }

    .parcours ul li.title {
        margin-left: 10px;
        margin-right: 10px;
    }

    section.dossier_mois > p {
        width: 80%;
        margin: 0 auto;
    }

    /* Stay Connected */
    .sec_conex > div {
        width: 90%
    }

    .footer ul li {
        margin: 0 7%;
    }

    /* Articles */
    /* Numeros */
    .sec_numeros {
        height: calc(100vh - 100px);
    }

    .santejeunes {
        height: 44vw !important;
    }

    .sec_numeros .nopadding > div > div {
        height: 22.2vw;
    }

    #sehati_tv .container {
        overflow: hidden;
        height: calc(100vh - 100px)
    }

    /* Article */
    .post_content {
        top: 0 !important
    }

    .bg-icons {
        top: 144px
    }

    .content_menu {
        top: 100px
    }

    .list-hex-grid div.hex .inner {
        top: 40%;
        position: absolute;
        left: 0;
        right: 0;
        margin: auto;
    }

    .list-hex-grid div.hex p.icon, .list-hex-grid div.hex h3 {
        position: relative;
    }

    .list-hex-grid div.hex h3 {
        z-index: 999999;
        transform: none;
        opacity: 1;
        visibility: visible;
    }

    /* thematiques */
    #thematiques {
        overflow: hidden
    }

}

@media screen and (max-width: 768px) {
    .container {
        top: 0
    }

    #slider_home {
        min-height: 450px;
    }

    .dialog {
        z-index: 999;
    }

    /* Home Page */
    .parcours p {
        margin: 18px 35px;
    }

    .parcours ul li:after {
        width: 80%;
    }

    .parcours ul li:before {
        left: 10%;
    }

    .slice.active:before {
        top: -450px;
        height: calc(450px + 5px);
    }

    .blocks_cat .parcours {
        top: -450px
    }

    /* A propos */
    /*.slice_theme {height: 270px;}*/
    .sec_apropos p {
        width: 95% !important
    }

    #themes_Carousel .carousel-inner > .item {
        display: block !important
    }

    .carousel-control.left, .carousel-control.right {
        display: none
    }

    /* Sehati TV */
    .cd-slider {
        padding-top: 0;
        height: 90%;
    }

    #videos .container {
        overflow: auto;
    }

    .cd-slider {
        overflow-y: inherit;
    }

    /* Outils */
    .strips .strip__inner-text {
        width: 95% !important
    }

}

@media only screen and (max-width: 767px) {

    /* Home Page */
    /*.blocks_cat .slice{    margin: 10px;}*/
    .blocks_cat .slice.active .parcours, .blocks_cat .slice.connection {
        display: none
    }

    .slice:before {
        height: 5px;
    }

    .blocks_cat {
        height: auto;
    }

    .blocks_cat .slice:nth-child(2) {
        border: none;
    }

    .block {
        padding: 10px 20px;
    }

    /* Stay Connected */
    .dialog--open .dialog-inner {
        padding: 2.5em 1.5em;
    }

    #form_newsletter input[type="text"] {
        width: 100%;
        margin: 10px 0;
    }

    .navbar-collapse.collapse, .navbar-default .navbar-brand {
        display: none !important
    }

    .navbar-brand {
        display: none;
    }

    .themes-slider {
        padding: 0 40px;
    }

    /*numeros*/
    .sec_numeros .nopadding > div > div {
        height: 60vw;
    }

}

@media only screen and (max-width: 600px) {

    /* Sehati TV */
    #videos .pic iframe {
        width: 100% !important;
        max-width: 100% !important;
    }

    #videos .poptrox-popup {
        width: 100% !important;
        padding: 10px 10px 10px !important;
    }

    #videos .closer {
        right: 0 !important
    }

    #videos .pic {
        margin-top: 50px;
    }

    #videos .caption {
        top: 0;
        bottom: auto !important;
    }

}

@media only screen and (max-width: 538px) {

    /* Home Page */
    .blocks_cat .slice {
        margin: 10px 0;
        width: 100%;
        float: none;
    }

    .blocks_cat {
        height: auto;
        width: 90%;
        margin: 0 auto;
    }

    .dossier_mois .block .colmarg {
        padding: 30px 50px;
    }

    .dossier_mois .block .colmarg[data-has='image'] {
        padding: 0;
    }

    .footer {
        padding: 20px 10px;
    }

    .act-inner-content h1 {
        font-size: 1.1em;
        line-height: 1.2;
    }

    .act-inner-content h2 {
        font-size: 0.9em;
        line-height: 1.2;
        margin-bottom: 10px
    }

    #ar_related {
        width: 100%;
        height: calc(100vh - 144px);
        overflow: auto;
    }

    /* Stay Connected */
    .sec_conex > div > a {
        padding-top: 90px;
        margin-bottom: 40px;
    }

    /* A propos */
    .sec_apropos p {
        margin: 35px auto;
        width: 88%;
        text-align: justify;
    }

    .themes-slider {
        padding: 0 20px;
    }

    .slice_theme {
        padding: 20px;
    }

    #themes_Carousel .carousel-inner > .item {
        display: block
    }

    .carousel-control.left, .carousel-control.right {
        display: none
    }

    .slice_theme.col-xs-6 {
        width: 100%
    }

}

@media only screen and (max-width: 414px) {

    /* header */
    #header .logo {
        width: 75%;
        margin: 20px 10px;
        height: 60px;
    }

    #Carousel_home .carousel-caption h1 {
        display: none
    }

    /* home */
    #slider_home {
        min-height: 250px;
    }

    section.dossier_mois {
        padding: 30px 0;
    }

    .slice.active:before {
        top: 0;
        height: 5px;
    }

    .act-inner-content {
        bottom: 0
    }

    .footer ul li a {
        font-size: 0.7em;
    }

    .footer ul li {
        margin: 0 5%;
    }

    .footer ul li:nth-child(2) {
        display: none
    }

    .sec_conex > div > a {
        margin-bottom: 0;
        padding: 28px 0;
        padding-left: 80px;
        text-align: left;
        background-size: 70px !important;
        background-position: left !important;
    }

    .sec_conex > div {
        margin-bottom: 0
    }

    #form_newsletter input[type="email"] {
        margin: 10px 0;
        width: 100%;
    }

    /* a propos */
    .sec_apropos p {
        text-align: justify !important
    }

    /* Thématiques */
    .list-hex-grid div.hex {
        height: 180px !important;
    }

    .list-hex-grid {
        overflow: scroll;
        float: none;
    }

    .list-hex-grid div {
        display: block;
        float: none;
    }

    .list-hex-grid div.hex > a {
        z-index: 0
    }

    .theme_content.active .close {
        opacity: .8;
        right: 10%
    }

    /*.theme_infos p.icon, .theme_infos h1{ text-align: left; width: 80%; margin: 0 auto}*/
    #thematiques .container {
        overflow: auto;
    }

    .block.blanc .colmarg {
        padding: 30px 35px
    }

    .list-hex-grid div.hex h3 {
        opacity: 1;
        visibility: visible;
        z-index: 2;
        transform: translateY(0px);
    }

    .hex a:after {
        z-index: 1
    }

    /* Outils */
    .strips .strip__inner-text {
        top: 22vh;
    }

    /* PopUp */
    .dialog__content {
        min-width: 90%;
    }

    /* numeros */
    .santejeunes {
        height: 380px !important;
    }

    .icon-num {
        margin: 15px;
    }

    .double {
        text-align: center;
        height: 70vw !important;
    }

    .double .link_utile {
        display: block;
        float: none
    }

    .double p {
        height: 35%;
        width: 100%
    }

    /* Sehati TV */
    .cd-slider {
        80%
    }

    .sec_numeros h3 {
        margin: 0
    }

    .poptrox-popup .closer {
        right: 0px !important;
    }

    .poptrox-popup iframe {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: auto !important
    }

    .poptrox-popup {
        padding-top: 50px !important;
        width: 100% !important;
    }

    #sehati_tv .container {
        overflow: auto
    }

    .cd-slider {
        padding-top: 20px !important;
    }

    .cd-slider li {
        margin-bottom: 30px !important;
    }

    /* Articles */
    .theme_content {
        top: 100px
    }

    .block .colmarg {
        padding: 55px 40px;
    }

    /* support infos */
    .support .wrap_img {
        max-height: 200px;
    }

    /* Article */
    .bottom_menu .navigation li:nth-child(2) {
        padding: 0 15px;
    }

    .post_content .content > div .section .block_text, .post_content .content > div .section .block_image {
        width: 100%
    }

    .post_content .content > div .section .block_image {
        height: 200px !important;
        opacity: 1
    }

    .post_content .block_image img {
        max-height: 150px;
        max-width: 150px;
    }

    .post_content.active .content_menu {
        top: 100px
    }

    .content_menu .navigation li a span, #fp-nav {
        display: none
    }

    .post_content .content .section {
        position: relative
    }

    .post_content .content .section .block_image {
        background: #e8e8e8 url(../img/bg-top-right.png) no-repeat right 0 !important;
        position: absolute !important;
        top: 0 !important
    }

    .post_content.active .content .section {
        padding-top: 200px;
    }

    .bg-icons {
        visibility: hidden
    }

    .post_content .content .section .block_text {
        padding: 30px 40px;
    }

    .content_menu .navigation li {
        padding: 0 20px;
    }

    .content_menu .theme_title h3 {
        border: none
    }

    .strips .strip__inner-text .heading {
        display: none
    }

}

@media only screen and (max-height: 320px) {

    /* header */
    header#header {
        height: 80px;
    }

    .cd-header-buttons {
        top: 20px;
    }

    #header .logo img {
        width: 40%;
    }

    .container {
        top: 80px;
        height: calc(100% - 80px);
    }

}
