@media handheld, only screen and (max-width: 620px) {

    .hidemobile{
        display: none;
    }

    .h-logo{
        position: relative;
        margin-bottom: 0px;
    }
    
    .flex{
        diaplay: block;
    }
    
    .grid{
        margin:0px;
        padding:0px;
    }
    #nav-mob{
        display: inline-block;
        position: absolute;
        right: 10px;
        top: 5px;
        font-size: 24px;
        cursor: pointer;
    }
    
    #nav-panel{
        display: none;
        padding-top: 30px;
        /*min-height: 100vh;*/
    }
    #nav-panel h2{
        padding-top:10px;
        padding-bottom:10px;
    }
    #main-content {
        padding: 0px 10px 120px 10px;
    }
    
    #sp-box{
        display: block;
    }
    
    #left-panel {
        flex: inherit;
        display: block;
        /*position: fixed;*/
        top:0px;
        left: 0px;
        width:100%;
        min-height: auto;
        background-color: #282828;
    }
  
    #right-panel {
        flex: inherit;
        display: block;
        width: 100%;
        position: relative;
        padding-top: 0px;
        
    }
    
    #inscriBox .grid img {
        width:100%;
    }
    
    input[type='submit']{
        width:100%;
    }
    
    #s2_left {
        width: 100%;
        float: inherit;
        margin-right: 0px;
        margin-left: 0px;
        padding: 0px;
    }
    #s2_left dt {
        display: inline-block;
        width: 30%;
        float: inherit;
        padding-bottom: 20px;
    }
    #s2_left dd {
        display: inline-block;
        width: 60%;
        float: inherit;
        padding-bottom: 20px;
    }
    #s2_right {
        width: 100%;
        float: inherit;
        padding: 10px;
        margin-bottom: 30px;
    }
    #s2_left ul.infoListBox {
        margin-left:0px;
        width:100%; 

    }
    #main-content{
        position: relative;
    }
/* ---------------------------- LIMIT ADVANCED*/
	.limitObs{
		width:100%;
        margin-bottom: 20px;
	}	
	.numPage{
		padding-right: 0px;
		text-align: right;
		display:block;
		font-size:0.9em;
	}
    .limitObs td{
        width: 100%;
        text-align: left;
    }
    .limitObs #pagination{
        position: absolute;
        top: 10px;
        right: 10px;
    }
	/* --------------------------- ADVANCED VIEW */
	.barreEspece{
		width:100%;	
	}
	.espece{
		padding-left:0px;
		/*width:100%;*/
	}
	.listEspece{
		width:100%;	
	}
	.listEspece .showMap{
		width:20px;
		height:20px;
		display: inline-block;
		margin-right: 5px;
	}
	.obsText {
    padding-right: 0px;
    vertical-align: top;
		width:80%;
		min-height: 28px;
	}
	.obsText, .photographe{
		padding-top:0px;
	}

	.obspictbox{
		/* display:none; */
	}
    .obspictbox img{
        width:20px;
        height: 20px;
        margin: 0px 5px;
    }
	.obspictboxmob{
		display: inline;
	}
	
	.obsText.picto{
		padding-left:5px;
		/*display:none;*/
		width:100%;
		text-align: right;
	}
	
	
	.listEspece tbody td{
		float: left; 
	}
	.photographe{
		padding-left:0px;
		width:80%;
		text-align: right;
	}
	.photographe .obsText{
		width:100%;
		padding-left: 28px;
	}
	.obsdate{
		width:20%;
		float:right;
	}    
    
    #t_user {
        width: 100%;
        margin: 12px auto;
        border-collapse: collapse;
        border-left: 0px solid #777;
    }

    #t_user td {
        padding-left: 0px;
    }
    .dashLine {
        /* background-image: none;*/

    }    
    .listEspece tr:last-child {
        background-image: none;
    }
    /* ------------- GALLERIE */
	#galBox {
    	margin-left: 0px;
        text-align: center;
        position: relative;
	}
    #galBox .numPage form{
        position: absolute;
        top: 0px;
        right: 10px;
    }
	#galBox .mini {
		width:29%;
		/* height:100px; */
        margin:5px;
	}

	#galBox .limitObs{
		width:100%;
	}
	#galBox .limitObs td{
		width:100%;
		display: block;
        text-align: left;
	}
	#galBox .limitObs .numPage{
		text-align: right;
	}
	#galBox .limitObs .numPage.npes{
		text-align: left;
	}
	#galBox .limitObs select{
		width:auto;
	}
	.slbCaption{
		font-size: 0.94em!important;
	}

    .mini img {
        width:100%;
    }    
    .mini img:hover {
        transform: inherit;
    }
    .btnvote{
        display: none;
    }
    
    .sl-wrapper .sl-image .sl-caption {
        bottom: -100px !important;
 
    }
    
/* ----- LIST ESPECE */
	#listEspeceBox {
		padding:0px;
		margin:0px;
		width:100%;
	}
	#listEspeceBox ul{
		margin:5px 0px;
		padding-left:0px;
	}
	#listEspeceBox ul li{
		display: block;
		width:100%;
		float:inherit;
		margin:0px 0px 10px 0px;
	}
	
	#listEspeceBox ul li p{
		margin-bottom:0px;
		margin-left:60px;
	}
	#listEspeceBox span{
		width:40px;
	}
	.limitMem{
		width:100%;
	}
	/* ---- MEMBRE LIST */
	.membrepad a {
		display: block;
		width:100%;
		margin-bottom: 10px;
	}
	.col-10-12.mobile-col-1-2{
		width:70% !important;
	}
	.col-2-12.mobile-col-1-2{
		width:30% !important;
	}
	    
    .membrepad strong::after {
      content: "\A";
      white-space: pre;
      /*display: block;*/
    }    
    
    #inscriBox table {
        width: 100%;
        margin: 10px auto;
    } 
    
     #messageBoxPanel .col_small {
        width: 100%;
        margin-right: 0px;
        padding: 10px;
        float: inherit;
    }
    
    #msgDispBox {
        width: 100%;
        padding: 0px;
        border-radius: 8px;
        float: inherit;
        margin-bottom: 20px;
        position: static;
    }    
    .especeFiche{
        padding: 0px;
    }
    .mini2 li {
        width: 70px;
    }
    .mini2 li img{
        width: 70px;
    }
}