@charset "utf-8";
/* CSS Document */

/*-------------------------------------------------------------------
        RESET CSS
-------------------------------------------------------------------*/

* {
    font-family:Arial, Helvetica, sans-serif;
    font-size: 100%;
    border: 0 none;
    outline: 0;
    padding: 0;
    margin: 0;
}

html {
    overflow-y: scroll;
    height: 100%;
}

sup, sub {
    height: 0;
    line-height: 1;
    vertical-align: baseline;
    _vertical-align: bottom;
    position: relative;
    font-size: 10px;
}

sup {
    bottom: 1ex;
}

sub {
    top: .5ex;
}

a { 
    outline: none;
}

.clear {
    clear: both;
    min-height: inherit!important;
}



/*-------------------------------------------------------------------
        WRAPPER ACCUEIL SEULEMENT
-------------------------------------------------------------------*/

.wrapper {

  margin-top: 60px!important;
  margin-bottom: 60px!important;

}

/*-------------------------------------------------------------------
        PANNEAU
-------------------------------------------------------------------*/

#wrapper-panneau-carte {
    width: 100%;
    height: 295px;
	background-color:#1f1f1f;
    margin: 0 auto;
}

#wrapper-panneau-carte span.h1 {
    font-family: 'Shanti', sans-serif;
    font-size: 30px;
	text-transform:uppercase;
    font-weight: normal;
    color: #666;
	padding-top:20px;
	padding-bottom:20px;
    line-height: 38px;
    text-align: center;
	display: block;
}

#wrapper-activites {
	margin: 0 auto;
	width:950px;
}

/*-------------------------------------------------------------------
        TAB ZONE
-------------------------------------------------------------------*/

.tabs {
    display:inline-block;
	text-align:center;
}
 
    /*----- Tab Links -----*/
    /* Clearfix */
    .tab-links:after {
        display:block;
        clear:both;
        content:'';
    }
	    .tab-links {
			width:400px;
			margin:0 auto;
    }
 
    .tab-links li {
		margin-left:10px;
        float:left;
        list-style:none;

    }
 
        .tab-links a {
			padding-bottom:3px;
			margin-right:60px;
            display:inline-block;
			text-transform:uppercase;
			text-decoration:none;
			font-family: 'Shanti', sans-serif;
            font-size:15px;
            font-weight:600;
            color:#4c4c4c;
            transition:all linear 0.15s;
        }
 
        .tab-links a:hover {
			color:#fff;
            text-decoration:none;
        }
 
    li.active a, li.active a:hover {
		color:#fff;
		border-bottom: #CC170E solid 2px
    }
 
    /*----- Content of Tabs -----*/
    .tab-content {
		width:950px;
		font-family: 'Shanti', sans-serif;
		margin-top:30px;
		color:#c6c6c6;
        padding:15px;
    }
	
	.tab-content span.h2{
		font-weight:normal;
		padding-bottom:10px;
		color:#c6c6c6;
		font-size:15px;
		text-transform:uppercase;
		display: block;
    }
 
        .tab {
            display:none;
        }
 
        .tab.active {
            display:block;
        }

	.activite{
		position:relative;
		float:left;
		width:250px;
		height:150px;
		text-align:left;
    }
	
	
	.activite span{
		color:#CC170E;
		font-size:60px;
    }
	
	.activite .detail a{
		width:50px;
		color:#fff;
		float:right;
		text-decoration:none;
		text-transform:uppercase;
		font-size:12px;
		padding:5px;
		background-color:#CC170E;
		margin-right:85px;
		margin-top:-36px;
    }
	
	.activite .detail a:hover{
		color:#000;
		background-color:#fff;
    }

	.nombre{
		height:25px;
		width:100px;
		text-align:right;
		margin-left:-70px;
	}
	
	.nombre-nordique{
		height:25px;
		width:100px;
	}	

	.box{
		position:relative;
		float:left;
		text-align:left;
		width:315px;
		height:150px;
		margin-right:30px;
	}
	
	.box span{
		color:#CC170E;
		font-size:22px;
	}
	
	.box strong{
		color:#666;
		font-size:22px;
	}

	.box small{
		font-size:11px;
		color:#666;
		margin:0 0 0 40px;
	}

	.meter {
		width:220px; 
		height: 25px;
		position: relative;
		margin: -24px 0 0 40px;
	}

	.meter > span {
  		display: block;
  		height: 100%;
  		background-color:#CC170E;
  		position: relative;
  		overflow: hidden;
	}

	.gris {
		background-color:#666!important;
	}