/* Medium */

@media (min-width: 767px) and (max-width: 959px) {
    .tablet-hidden,
    .phone-hidden {
        display: none;
    }

    /* Top header */
    #content-top-header {
        display: block !important;
        float: none !important;
        clear: none !important;
        width: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        border: 0;
    }

    #content-top-header .content {
        float: right;
        margin-right: 20px;
    }

    div#content-top-header ul#social-networks {
        display: none;
    }

    #mobile-sub-top-header {
        background-color: #fff;
        display: block;
        width: 100%;
        padding: 5px 0;
        text-align: center;
    }

    #mobile-sub-top-header a + a {
        font-family: 'Maven Pro', sans-serif;
        font-size: 40px;
        font-weight: bold;
        color: #a1be2e;
    }

    #btn-show-nav{
        display: block;
        float: left;
        margin: 10px 20px 0 20px;
        width: 30px;
        height: 30px;
        background: transparent url(../images/mobile_nav_button.png) no-repeat 0 0;
    }
    
        /* nav part */
    nav {
        position: absolute;
        left: -100%;
        z-index: 1000;
        height: inherit;
    }

    nav.show {
        left: 0%;
        -webkit-transition: all .2s ease-in;
        transition: all .2s ease-in
    }

    nav.show.sub-menu {
        left: -70%;
        -webkit-transition: all .2s ease-in;
        transition: all .2s ease-in
    }

    nav ul {
        width: 100% !important;
        left: 0;
        margin: 0;
    }

    nav ul > li {
        display: block !important;
        height: 50px;
        padding: 0px;
        border-bottom: 1px solid #fff;
    }
    
    nav > ul > li > a {
        height: inherit;
        padding: 20px 0;
    }

    nav > ul > li:hover {
        background-color: #faf8f8;
    }
    
    nav > ul > li:hover > a {
        color: #221d57;
    }

    nav li span {
        display: inline-block ;
        width: 80%;
        font-size: 19px;
        text-align: left;
    }

    nav li span:first-child + span {
        text-align: left;
    } 

    nav li span:first-child + span br {
        display: none;
    }

    nav .sub-menu {
        top: 0px;
        width: 70%;
        margin-left: 100%;
    }

    nav .sub-menu.close {
        left: -45%;
        z-index: -1;
        -webkit-transition: all .2s ease-in;
        transition: all .2s ease-in
    }

    nav .sub-menu ul {
        width: 100%;
        margin-top: 20px;
    }

    nav .sub-menu ul > li {
        width: 100%;
        margin-bottom: 0;
    }

    nav .sub-menu .content-sub-menu {
        width: 85%;
    }

    main {

    }
    
    /**** Header *****************/
    #site > header {
        
    }

    main,
    #site #main-content,
    #site #right-column {
        width: auto!important;
        float: none;
    }

    main,
    #site > #image-header > header {
       padding: 0 15px;
    }

    #image-header {
        background: #fff!important;
    }
    
    #site > #image-header > header {
            height: 80px;
        background: #fff!important;
    }

    .slider-container .item.half-cover .content {
        background-color: rgba( 255, 255, 255, 0.80 ) !important;
    }

    /***** Homepage content ******/
    .three-col-container + .three-col-container +.three-col-container {
        clear: left !important;
    }

    .three-col-container + .three-col-container +.three-col-container > * {
        float: left;
    }

    .phd_homepage .bloc.video,
    .phd_homepage .bloc.agenda {
        width: 45% !important;
    }

    /***** footer ******/

    footer section {
        text-align: center;
    }


}

/* Small */

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

    main,
    #site > #image-header > header {
        padding: 0 15px;
    }

    .tablet-hidden,
    .phone-hidden {
        display: none;
    }

    .play-button {
        left: 45%;
        top: 40%;
    }

    /* Top header */
    #content-top-header {
        display: block !important;
        float: none !important;
        clear: none !important;
        width: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        border: 0;
    }

    #content-top-header .content {
        float: right;
        margin-right: 20px;
    }

    div#content-top-header ul#social-networks {
        display: none;
    }

    #mobile-sub-top-header {
        background-color: #fff;
        display: block;
        width: 100%;
        padding: 5px 0;
        text-align: center;
    }

    #mobile-sub-top-header a + a {
        font-family: 'Maven Pro', sans-serif;
        font-size: 17px;
        font-weight: bold;
        color: #a1be2e;
    }

    #btn-show-nav{
        display: block;
        float: left;
        margin: 10px 20px 0 20px;
        width: 30px;
        height: 30px;
        background: transparent url(../images/mobile_nav_button.png) no-repeat 0 0;
    }
    
        /* nav part */
    nav {
        position: absolute;
        left: -100%;
        z-index: 1000;
        height: inherit;
    }

    nav.show {
        left: 0%;
        -webkit-transition: all .2s ease-in;
        transition: all .2s ease-in
    }

    nav.show.sub-menu {
        left: -70%;
        -webkit-transition: all .2s ease-in;
        transition: all .2s ease-in
    }

    nav ul {
        width: 100% !important;
        left: 0;
        margin: 0;
    }

    nav ul > li {
        display: block !important;
        height: 50px;
        padding: 0px;
        border-bottom: 1px solid #fff;
    }
    
    nav > ul > li > a {
        height: inherit;
        padding: 20px 0;
    }

    nav > ul > li:hover {
        background-color: #faf8f8;
    }
    
    nav > ul > li:hover > a {
        color: #221d57;
    }

    nav li span {
        display: inline-block ;
        width: 80%;
        font-size: 19px;
        text-align: left;
    }

    nav li span:first-child + span {
        text-align: left;
    } 

    nav li span:first-child + span br {
        display: none;
    }

    nav .sub-menu {
        top: 0px;
        width: 70%;
        margin-left: 100%;
    }

    nav .sub-menu.close {
        left: -45%;
        z-index: -1;
        -webkit-transition: all .2s ease-in;
        transition: all .2s ease-in
    }

    nav .sub-menu ul {
        width: 100%;
        margin-top: 20px;
    }

    nav .sub-menu ul > li {
        width: 100%;
        margin-bottom: 0;
    }

    nav .sub-menu .content-sub-menu {
        width: 85%;
    }
    
    /**** Header *****************/
    #site > header {
        
    }

    #site #main-content,
    #site #right-column {
        width: auto;
        float: none;
    }
    
    #image-header {
        background: #fff!important;
    }
    
    #site > #image-header > header {
            height: 80px;
        background: #fff!important;
    }
    
    
    /***** Slider REsponsive ****/
    slider-container .item.half-cover {
        position: relative;
    }
    
    .slider-container .item.half-cover .content {
        position: absolute;
         width:315px;
        height: 100%;
        top:0;
        left:0;
        z-index:920;
        padding-top:30px;
        padding-left:15px;
        padding-right:15px;
        background-color: rgba( 255, 255, 255, 0.80 ) !important;
    }
    
    /***** footer ******/

    footer section {
        text-align: center;
    }
    
}


/* Tiny */

@media (max-width: 480px) {

    .w960p {
        width: auto;
        float: none;
    }

    main,
    #site > #image-header > header {
        padding: 0 15px;
    }

    .tablet-hidden,
    .phone-hidden {
        display: none;
    }

    .play-button {
        left: 45%;
        top: 40%;
    }

    /* Top header */
    #content-top-header {
        display: block !important;
        float: none !important;
        clear: none !important;
        width: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        border: 0;
    }

    #content-top-header .content {
        float: right;
        margin-right: 20px;
    }

    div#content-top-header ul#social-networks {
        display: none;
    }

    #mobile-sub-top-header {
        background-color: #fff;
        display: block;
        width: 100%;
        padding: 5px 0;
        text-align: center;
    }

    #mobile-sub-top-header a + a {
        font-family: 'Maven Pro', sans-serif;
        font-size: 20px;
        font-weight: bold;
        color: #a1be2e;
    }

    #btn-show-nav{
        display: block;
        float: left;
        margin: 10px 20px 0 20px;
        width: 30px;
        height: 30px;
        background: transparent url(../images/mobile_nav_button.png) no-repeat 0 0;
    }
    
        /* nav part */
    nav {
        position: absolute;
        left: -100%;
        z-index: 1000;
        height: inherit;
    }

    nav.show {
        left: 0%;
        -webkit-transition: all .2s ease-in;
        transition: all .2s ease-in
    }

    nav.show.sub-menu {
        left: -70%;
        -webkit-transition: all .2s ease-in;
        transition: all .2s ease-in
    }

    nav ul {
        width: 100% !important;
        left: 0;
        margin: 0;
    }

    nav ul > li {
        display: block !important;
        height: 50px;
        padding: 0px;
        border-bottom: 1px solid #fff;
    }
    
    nav > ul > li > a {
        height: inherit;
        padding: 20px 0;
    }

    nav > ul > li:hover {
        background-color: #faf8f8;
    }
    
    nav > ul > li:hover > a {
        color: #221d57;
    }

    nav li span {
        display: inline-block ;
        width: 80%;
        font-size: 19px;
        text-align: left;
    }

    nav li span:first-child + span {
        text-align: left;
    } 

    nav li span:first-child + span br {
        display: none;
    }

    nav .sub-menu {
        top: 0px;
        width: 70%;
        margin-left: 100%;
    }

    nav .sub-menu.close {
        left: -45%;
        z-index: -1;
        -webkit-transition: all .2s ease-in;
        transition: all .2s ease-in
    }

    nav .sub-menu ul {
        width: 100%;
        margin-top: 20px;
    }

    nav .sub-menu ul > li {
        width: 100%;
        margin-bottom: 0;
    }

    nav .sub-menu .content-sub-menu {
        width: 85%;
    }
    
    /**** Header *****************/
    #site > header {
        
    }

    #site #main-content,
    #site #right-column {
        width: auto;
        float: none;
    }
    
    #image-header {
        background: #fff!important;
    }
    
    #site > #image-header > header {
            height: 80px;
        background: #fff!important;
    }
    
    
    /***** Slider REsponsive ****/
    slider-container .item.half-cover {
        position: relative;
    }
    
    .slider-container .item.half-cover .content {
        position: absolute;
         width:315px;
        height: 100%;
        top:0;
        left:0;
        z-index:920;
        padding-top:30px;
        padding-left:15px;
        padding-right:15px;
        background-color: rgba( 255, 255, 255, 0.80 ) !important;
    }
    
    /***** footer ******/

    footer section {
        text-align: center;
    }

}