@charset "utf-8";

/*
Theme Name: min2rien
Theme URI: http://www.min2rien.fr/
Description: Métiers de l'Informatique Réunis en Réseau Inter-Etablissement du Nord
Version: 3.0
Author: <a href="http://cri.univ-lille1.fr" target="_blank">DSI Université Lille 1</a> - David Darras
Tags: white, black, red, flexible-width
 
Creation Theme by David Darras
 
*/

html, body {
    height:100%;
}

body {
    font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;
    background-color: #F5F5F5;
}

header#brand {
    display:none;
}

#contenu {
    padding-bottom: 50px;   
    background-color: #FFF;
    border-left:1px solid #CCC;
    border-right:1px solid #CCC;
}

h1, h2, h3 {
    color: #A1122A;
}

a.resume {
    position:relative;
    color:#3076B9;
    text-decoration:none;
    border:0px;
    border:none;
}
 
a.resume:hover{
    text-decoration:none;
    border:0px;
    border:none;
}
 
a.resume p{
    display: none;
    width:400px;
}
 
a.resume:hover p{
    display:block;
    line-height:16px;
    color:#666666;
    text-align: justify;
    font-weight:400;
}


/************************/
/****** NAVIGATION ******/
/************************/

.navbar {
    border-radius:0;
    margin-bottom:0;
    background-color: #2F2F2F;
}

.navbar-default .navbar-nav > li > a {
    padding-top: 15px;
    padding-bottom: 15px;
    color: #FFF;
    font-weight: 600;
    font-size:16px;
}

.navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus {
    background: rgba(0,0,0,0.5);
}

#main-menu.nav-up {
    transform: translateY(-100%);
    
}

#main-menu {
    transition: .2s ease-in-out;
	border-bottom:3px solid #A1122A;
}

.affix {
    top:0px;
    width:100%;
    z-index:100000;
}

.navbar-brand {
    width:145px;
    padding-top:8px;
}

#nav-icon {
    width: 50px;
    height: 45px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    cursor: pointer;
}

#nav-icon span {
    display: block;
    position: absolute;
    height: 4px;
    width:30px;
    background: #F5F5F5;
    border-radius: 15px;
    opacity: 1;
    left: 10px;
    -webkit-transition: .25s;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}

.navbar #nav-icon.collapsed span {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    width:30px;
    left:10px;
}

/* Icon 3 */

#nav-icon.collapsed span:nth-child(2) {
    top: 10px;
}

#nav-icon span:nth-child(3),#nav-icon span:nth-child(4) {
    top: 19px;
}

#nav-icon.collapsed span:nth-child(5) {
    top: 28px;
}

#nav-icon span:nth-child(2) {
    top: 19px;
    width: 0%;
    left: 50%;
}

#nav-icon span:nth-child(3) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}

#nav-icon span:nth-child(4) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

#nav-icon span:nth-child(5) {
    top: 19px;
    width: 0%;
    left: 50%;
}

/************************/
/******* MAIN BAR *******/
/************************/

#main h3 {
    font-size:18px;
}

#main article p {
    font-size:14px;
}

/************************/
/****** ACTUALITES ******/
/************************/

h3 + .info-actu {
    color: #777777;
    margin-top:-10px;
    display:block;
    font-size:0.8em;
}

.actualites article:first-child h3 {
    margin-top: 20px;
}

.actualites h3 {
    margin-top: 5px;
}

.actualites article {
    border-bottom: 2px solid #DDD;
    padding-bottom: 20px;
}

.actualites article:last-of-type {    
    padding-bottom:20px;       
    border-bottom: 0;
}

.actualites article p:last-of-type {    
    margin-bottom:0;
}

.tags-actu {
    display:block;
    text-align:right;
    font-size:0.8em;
    color: #777777;
}

.wp-pagenavi {
    clear: both;
}

.wp-pagenavi a, .wp-pagenavi span {
    text-decoration: none;
    border: 1px solid #BFBFBF;
    padding: 3px 5px;
    margin: 2px;
}

.wp-pagenavi a:hover, .wp-pagenavi span.current {
    border-color: #000;
}

.wp-pagenavi span.current {
    font-weight: bold;
}

.miniature-article {
    float:left; 
    padding-right:10px; 
}

#main.actualites > article {
	overflow:auto;
}

/************************/
/***** INSCRIPTION ******/
/************************/

#inscriptions {    
    background: #F5F5F5;
    border:1px solid #DDD;
    padding-bottom:20px;
    margin-bottom:10px;
    border-radius: 0 0 20px 20px;
}

#inscriptions h3 {
    font-size:16px;    
}

.inscr-closed, .inscr-opened {
    margin-top: 10px;
    text-align:center;
}

.inscr-opened + h3, .inscr-closed + h3 {
    margin-top:40px;
}

.inscr-opened a {
    color:#FFF;
    padding-left: 5px;
    padding-right: 5px;
}

.inscr-closed span {
    background-color: #A1122A;
    color:#FFF;
    cursor:initial;
    vertical-align: middle;
    cursor:not-allowed;
}

.inscr-closed span:hover, .inscr-closed span:focus, .inscr-closed span:active, 
.inscr-closed span:focus:active, .inscr-closed span:hover:active {
    background-color: #A1122A;
    color:#FFF;
}

/************************/
/********* PDB **********/
/************************/

body .pdb-list span.textarea {
    max-height: 100%;
}

.glyphicon {
    font: auto;
}
/************************/
/***** FIL TWITTER ******/
/************************/

#twitter h3 {
    font-size:18px;    
}

#twitter .juiz_last_tweet_inside .juiz_last_tweet_tweetlist {
    border:0;
    background: none;
    padding:0;
    box-shadow:none;
    border-radius:none;
}

#twitter .juiz_last_tweet_inside .juiz_last_tweet_tweetlist::after {
    display:none;
}    

#twitter .juiz_last_tweet_follow_us {
    height:35px;
}


/************************/
/******** FOOTER ********/
/************************/

footer.footer {
    padding: 0;
    background-image:url('images/footer3.png');
    background-position:right bottom;
}

footer #footer-infos {
    background:rgba(0,0,0,0.7);
}

footer #footer-copyright {
    padding:7px 0;
    text-align:center;
    color: #FFF;
    background-color:#A1122A;
}

#footer-infos a{
    color: #FFF;
}

#footer-infos a:hover{
    color: #FFF;
    text-decoration:underline;
}

#footer-partenaires {
    margin: 30px auto 0 auto;
}

#footer-partenaires ul {
    width: 320px;
    padding-left:0px;
    margin: 0 auto; 
    list-style: none;  
    overflow:auto;
}

#footer-partenaires li {
    float:left;
    width:110px;
    margin-left:40px;
}

#footer-partenaires h4 {
    text-align:center;
    color: #FFF;
}

#footer-menu {
    list-style:none;
    text-align:center;
    margin-right:10px;
    margin-top:30px;
    margin-bottom:0;
    padding-bottom:5px;
    padding-left:0px;
    clear:both;
}

#footer-menu li{
    display:inline;
    border-right: 1px solid #FFF;
    padding-right:10px;
    margin-right:6px;
}

#footer-menu li:last-child{
    border-right: 0;
    margin-right:0;
    padding-right:0;
}

#footer-icons{
    width:176px;
    margin: 0 auto;
    padding-top:20px;
}

.twitter:hover .fa-twitter, .envelope:hover .fa-envelope, .rss:hover .fa-rss {
    color: #FFF;
    transition-duration: 0.3s;
}

.twitter:hover .fa-circle, .envelope:hover .fa-circle {
    color:#00aced;
    transition-duration: 0.3s;
}

.fa-twitter, .fa-envelope, .fa-rss {
    color: #000;
}

.envelope:hover .fa-circle {
    color: #A1122A;
    transition-duration: 0.3s;
}

.rss:hover .fa-circle {
    color: #E67E22;
    transition-duration: 0.3s;
}

/************************/
/**** MEDIA QUERIES *****/
/************************/

@media screen and (min-width: 603px) {
    #footer-partenaires ul {
        width: 480px;
    }

    #footer-partenaires li {
        width:110px
    }

    #footer-menu {
        text-align:right;
    }
}

@media screen and (min-width: 926px) {
    
    .navbar-nav>li {
        float: none;
        display: inline-block;
    }

    .navbar-nav {
        float: none;
        text-align: center;
    }
    
    .dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
        color: #A1122A;
    }

    ul.nav li.dropdown:hover ul.dropdown-menu { 
        display: block; 
    }
}

@media screen and (min-width: 773px) {
    
	#inscriptions {    
		margin-bottom:40px;
	}

	aside#colAnnexe {
		float:right;
	}
	
	.navbar-brand {
        display:none;
    }
    
    #logo h1 {
        font-family: "Century Gothic"; 
        font-size:1.8em; 
        line-height:1em; 
        font-weight:normal;
        color:#000;
        padding:20px 30px;
        margin:0;
    }

    #logo h1 span.rouge {
        color:#bf3c42;
    }

    #logo h1 span.gris {
        color:#9c9b9e;
    }

    header#brand {
        background-color:#FFF;
        display:block;
    }

    header #logo {
        background-image: url('images/logo.png');
        /*background-position:20px 10px; a remettre lorrsque 10 ans passé*/
        background-repeat:no-repeat;
        height:165px;
        padding-left: 345px;
        padding-top:28px;
    }   
}

@media screen and (min-width: 783px) {
  .admin-bar .affix {
    top: 32px;
  }
}

@media (min-width: 926px) {
    a:hover.dropdown-toggle span.caret {
        border-bottom: 4px dashed;
        border-bottom: 4px solid #FFF;
        border-right: 4px solid transparent;
        border-left: 4px solid transparent;
        border-top:0;
    }
    
    .navbar-default .navbar-nav > li > a {
        padding-top: 30px;
        padding-bottom: 30px;
    }
}

@media screen and (min-width: 1091px) {    
    header#brand {
        background-image: url('images/header.png');
        background-position: top right;
        background-repeat:no-repeat;
    }
}

@media screen and (min-width: 1107px) {
    .affix #mineur {  
        opacity: 0.8;    
        top:17px;
        -webkit-animation-name: bounceInRight;
        animation-name: bounceInRight;
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
        -webkit-animation-fill-mode: both;
        animation-fill-mode: both;
    }
    
    #mineur {
        background-image:url('images/mineur.png');  
        background-repeat:no-repeat;
        position:absolute;
        width: 157px;
        height:80px; 
        right:0px;
        top:18px;
        opacity:0;
        -webkit-transition: .5s ease-in-out;
        -moz-transition: .5s ease-in-out;
        -o-transition: .5s ease-in-out;
        transition: .5s ease-in-out;     
    }

    @-webkit-keyframes bounceInRight {
        from, 60%, 75%, 90%, to {
          -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
          animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
        }

        from {
          opacity: 0;
          -webkit-transform: translate3d(3000px, 0, 0);
          transform: translate3d(3000px, 0, 0);
        }

        60% {
          opacity: 0.8;
          -webkit-transform: translate3d(-25px, 0, 0);
          transform: translate3d(-25px, 0, 0);
        }

        75% {
          -webkit-transform: translate3d(10px, 0, 0);
          transform: translate3d(10px, 0, 0);
        }

        90% {
          -webkit-transform: translate3d(-5px, 0, 0);
          transform: translate3d(-5px, 0, 0);
        }

        to {
          -webkit-transform: none;
          transform: none;
        }
    }

    @keyframes bounceInRight {
        from, 60%, 75%, 90%, to {
          -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
          animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
        }

        from {
          opacity: 0;
          -webkit-transform: translate3d(3000px, 0, 0);
          transform: translate3d(3000px, 0, 0);
        }

        60% {
          opacity: 0.8;
          -webkit-transform: translate3d(-25px, 0, 0);
          transform: translate3d(-25px, 0, 0);
        }

        75% {
          -webkit-transform: translate3d(10px, 0, 0);
          transform: translate3d(10px, 0, 0);
        }

        90% {
          -webkit-transform: translate3d(-5px, 0, 0);
          transform: translate3d(-5px, 0, 0);
        }

        to {
          -webkit-transform: none;
          transform: none;
        }
    }

}
