@font-face {
		font-family: 'gothic';
		src: url('../fonts/gothic.eot');
		src: url('../fonts/gothic.woff') format('woff'), url('../fonts/gothic.ttf') format('truetype');
	}
	*{
		margin: 0;
		padding: 0;
		font-family: 'gothic';
	}

	img{
		border: none;
	}

	a{
		cursor:pointer;
	}

	body{
		background-color: #47a8ec;
		font-size: 16px;
	}
	
	.imgFloat{
		float: left;
	}
	
	.corner{
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
	}
	
	.bold{
		font-weight: bold;
	}
	
	.clear{
		clear:both;
	}

	.fl{
		float:left;
	}

	.fr{
		float:right;
	}

	.supprimerNouvelle{
		text-decoration: none;
		color:red;
		float:right;
	}

	#blockBg{
		position: fixed;
		background: url(../images/pattern.png);
		top: 250px;
		width: 100%;
		height: 40%;
		border: 15px solid #7dc9ff;
		border-left: none;
		border-right: none;
	}
	#wrapper{
		position: relative;
		z-index: 1;
		margin: 0 auto;
		margin-bottom: 30px;
		width: 1000px;
		transition: all 0.5s ease-in-out;
		-webkit-transition: all 0.5s ease-in-out;
		-moz-transition: all 0.5s ease-in-out;
		-ms-transition: all 0.5s ease-in-out;
		-o-transition: all 0.5s ease-in-out;
	}
	.ui-datepicker-trigger{
		cursor:pointer;
		vertical-align: middle;
		margin-top:-5px;
	}

	header{
		display: block;
		position: relative;
		margin-top: 20px;
		height: 170px;
		width: 100%;
		background-color: white;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		
	}

	#social{
		position: absolute;
		top: 10px;
		right: 10px;
	}

	#social a{
		display: block;
		float: left;
		text-decoration: none;
		text-transform: uppercase;
		color: #000;
		font-size: 0.75em;
		margin-left: 5px;
		line-height: 24px;
		text-align:right;
	}
	
	#connexion{
		position: absolute;
		background-color: #dedede;
		border-top: 5px solid #eee;
		padding: 5px 10px 10px 10px;
		top: 0px;
		left: 490px;
		-webkit-border-bottom-right-radius: 5px;
		-webkit-border-bottom-left-radius: 5px;
		-moz-border-radius-bottomright: 5px;
		-moz-border-radius-bottomleft: 5px;
		border-bottom-right-radius: 5px;
		border-bottom-left-radius: 5px;
		display: none;
	}
	
	#connexion form>p{
		margin-bottom: 5px;
		line-height: 18px;
	}
	
	#connexion label{
		float: left;
		width: 100px;
		text-transform: uppercase;
		font-size: 0.75em;
		
		vertical-align: middle;
	}
	
	#connexion form>input{
		padding: 4px;
		width: 100%;
	}

	#connexion .login_uiInput{
		vertical-align: middle;
	}

	#connexion .login_uiLabel{
		width:auto;
		float:none;
	}
	
	#menu{
		position: absolute;
		bottom: 10px;
		right: 10px;
	}

	#menu a, #adminMenu a{
		text-decoration: none;
		text-transform: uppercase;
		font-size: 0.8125em;
		display: inline-block;
		padding: 15px 5px 0px 5px;
		color: #000;
		font-weight: bold;
	}

	#menu a:hover, #menu a.active, #adminMenu a:hover, #adminMenu a.active{
		background: url(../images/iconMenu.png) top center no-repeat;
		color: #58a6b9 !important;
	}
	
	#content{
		width: 970px;
		padding: 15px;		
		background-color: white;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		margin: 15px 0px 10px 0px;
	}

	#content h2{
		text-transform: uppercase;
		font-size: 1.625em;
		color: #58a6b9;
		font-weight: normal;
		padding: 0px 62px 0px 36px;
		background: url(../images/puceBf.png) center left no-repeat;
		margin-bottom: 10px;
	}
	
	#content h2>span{
		height: 21px;
		width: 61px;
		display: inline-block;
		background: url(../images/puceAf.png) center right no-repeat;
	}
	
	.section{
		margin: 10px 0px 25px 0px;
	}
	
	.section p,li,a{
		font-size: 0.8125em;
	}
	
	.section ul{
		margin-left: 20px;
		max-width: 600px;
	}
	.section ol{
		margin-left: 30px;
		max-width: 700px;
	}
	
	.nouvelle{
		float: left;
		width: 47.5%;
		margin: 0px 20px 20px 0px;
	}
	
	.nouvelle h3{
		font-size: 1.125em;
		width: 100%;
		border-bottom: dotted 2px #eeeeff;
		padding-bottom: 5px;
		margin-bottom: 5px;
	}
	
	.nouvelle p{
		font-size: 0.8125em;
	}
	
	#horaire, #instructeurs{
		width: 450px;
		float: left;
		margin-right: 20px;
	}
	
	#horaire h3{
		font-size: 1.125em;
		width: 100%;
		border-bottom: dotted 2px #eeeeff;
		padding-bottom: 5px;
		margin-bottom: 5px;
	}
	
	.jourHr{
		margin-bottom: 20px;
	}
	
	.contact{
		margin-right: 20px;
		display: inline-block;
	}
	
	.contact h3{
		font-size: 1.125em;
		width: 200px;
		border-bottom: dotted 2px #eeeeff;
		padding-bottom: 5px;
		margin-bottom: 5px;
		color: #58a6b9;
	}
	
	#code div{
		display: none;
		padding: 10px 20px;
	}
	
	.lnkCode{
		display: block;
		padding: 2px 0px 2px 25px;
		background: url(../images/iconMenu.png) left center no-repeat;
	}
	
	.lnkCode:hover{
		color: #58a6b9;
	}
	
	
	.instructeur{
		display: block;
		font-weight: bold;
		font-size: 1em;
		padding: 2px 0px 2px 25px;
		background: url(../images/iconMenu.png) left center no-repeat;
	}
	
	#tabRLCnt>.contentInstruct{
		float: left;
		width: 750px;
		margin-right: 20px;
	}
	
	#instructDesc>div{
		display: none;
	}
	
	.instructeur:hover{
		color: #58a6b9;
	}
	
	#eleves{
		float: left;
		width: 450px;
		margin-right: 20px;
	}
	
	.ceinture{
		width:22.5%; 
		padding: 5px;
		margin: 5px;
		border: 1px solid #eee;
		text-align: center;
		float: left;
		height: 270px;
	}
	
	
	.ceinture img{
		width: 150px;
		margin-bottom: 10px;
		padding-bottom: 10px;
		border-bottom: 1px solid #eee;
	}
	
	#tkwdNav{
		background-color: #636363;
		padding: 10px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		color: #fff;
	}
	#tkwdNav a{
		display: inline-block;
		width: 18.70%;
		text-align: center;
		padding: 3px 0px;
		text-transform: uppercase;
	}
	
	#tkwdNav a:hover, .tabActive{
		background-color: white;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		color: #00738f;
	}
	
	.tabCnt{
		display: none;
	}
	
	#tabDefCnt{
		display: block;
	}
	
	.sectTkwd{
		margin-bottom: 30px;
	}
	
	.sectTkwd h3{
		margin-bottom: 10px;
		color: #58a6b9;
	}
	
	.sectTkwd h4{
		color: #bbb;
		margin-top: 20px;
		margin-bottom: 5px;
	}
	
	.sectTkwdCnt{
		float: left;
		width: 700px;
		margin-right: 30px;
		
	}
	
	.sectTkwd img{
		float: left;
		width: 225px;
	}
	
	
	.termeDef>*{
		display: inline-block;
	}
	
	.termeDef>span{
		font-size: 0.8125em;
		font-weight: bold;
		width: 100px;
	}
	
	.lnkDl{
		display: block;
		width: 425px;
		border-bottom: 1px dotted #aaa;
		padding: 2px 0px 2px 25px;
		background: url(../images/iconMenu.png) left center no-repeat;
		color: #000;
		padding-top: 5px;
		margin-bottom: 5px;
		text-decoration: none;
	}
	
	.lnkDl:hover{
		color: #58a6b9;
		background-color: #eee;
		border-bottom: 1px solid #fff;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
	}

	#connexionContent{
		width:640px;
		margin:25px auto;
		padding:20px;
		border: 1px solid #ccc;
		border-radius:5px;
	}

	#connexionContent h2{
		margin:5px 0 20px;
		border-bottom:1px solid #ccc;
	}

	#connexionContent form{
		width:380px;
		margin:auto;
	}

	#connexionContent p{
		padding:0 0 8px 0;
	}

	#connexionContent label, #connexionContent input{
		font-size:11px;
		vertical-align: middle;
	}

	#connexionContent .login_label{
		width:100px;
		float:left;
		font-weight: bold;
		cursor: pointer;
	}

	#connexionContent .login_input{
		width:175px;
		padding:3px;
	}

	#connexionContent #loginBtn{
		margin-left:100px;
		float:left;
		width:185px;
		padding:3px;
	}

	#connexionContent .login_uiInput{
		margin-left:100px;
	}

	#sessionInfo{
		position:absolute;
		right:10px;
		top:50px;
	}
	
	#sessionInfo form{
		display:inline-block;
		margin-left:5px;
	}

	#sessionInfo form input{
		padding:0 5px;
	}

	#sessionInfo span{
		display:inline-block;
		vertical-align: middle;
	}

	#adminMenu{
		position:absolute;
		right:10px;
		bottom:50px;
	}

	#frmRechMem{
		text-align: center;
	}

	#frmRechMem input[type="submit"]{
		margin-right:10px;
	}

	#tableUser{
		width:100%;
		margin-top:20px;
	}

	#tableUser tr td{
		padding:5px;
	}

	#tableUser tr td a{
		color:black;
		text-decoration: none;
		padding:2px;
		font-size:1em;
	}

	.memberForm p{
		display:inline-block;
		padding:5px;
		vertical-align: top;
	}

	#showMenuButton{
		background:#7dc9ff;
		position:absolute;
		-webkit-border-top-right-radius: 8px;
		-webkit-border-bottom-right-radius: 8px;
		-moz-border-radius-topright: 8px;
		-moz-border-radius-bottomright: 8px;
		border-top-right-radius: 8px;
		border-bottom-right-radius: 8px;
		cursor: pointer;
		transition: all 0.2s ease-in-out;
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-ms-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
	}
	#showMenuButton:hover{
		background: black;
	}
	#showMenu{
		padding:10px 20px 5px;
	}
	.leftSidebar{
		/*background-color:#47a8ec;*/
		background-color:black;
		width:250px;
		height:100%;
		position:fixed;
		z-index:10000;
		transition: all 0.2s ease-in-out;
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-ms-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		overflow:hidden;
		top:0;
		padding:10px 0 0 0;
		left:-250px;
	}
	.leftSidebar h2{
		text-transform: uppercase;
		font-size: 1.625em;
		color: #58a6b9;
		font-weight: normal;
		padding: 0px 0px 0px 36px;
		background: url(../images/puceBfw.png) center left no-repeat;
		margin-bottom: 10px;
		margin-left: 10px;
	}
	.leftSidebar h2>span {
		height: 21px;
		width: 61px;
		display: inline-block;
		background: url(../images/puceAfw.png) center right no-repeat;
	}
	.leftSidebar h3{
		color:#58a6b9;
		padding-left:20px;
		margin-top:30px;
		margin-bottom:5px;
	}
	.leftSidebar h3:first-child{
		margin-top:20px;
	}
	.leftSidebar ul{
		padding: 0px 10px 0px 10px;
	}
	.leftSidebar ul li{
		border-bottom:1px solid #7dc9ff;
	}
	.leftSidebar ul li:hover{
		background-color:#47a8ec;
	}
	.leftSidebar ul li a{
		color:white;
		font-size:1.15em;
		display:block;
		text-decoration: none;
		padding: 10px 0px 10px 20px;
	}
	.leftSidebar #closeLeftSidebar{
		text-decoration:none;
		color:white;
		font-size:1em;
		float:right;
		padding: 0 10px 10px 10px;
		cursor:pointer;
	}
	.leftSidebar.show{
		left:0;
	}

	#wrapper.push{
		left:125px;
	}

	.options{
		display:none;
	}

	.btn{
		padding:5px 10px;
		border: 1px solid #47a8ec;
		border-radius:8px;
		text-decoration: none;
		color:black;
		font-size: 1em;
		margin-right: 10px;
	}
	.btn:hover{
		background-color:#7dc9ff;
	}

	footer{
		width: 100%;
		display: block;
		font-size: 0.75em;
		position: relative;
		padding-top: 10px;
		border-top: 2px dotted #71c1d5;
	}
	
	footer span{
		text-align:right;
		position: absolute;
		right: 0px;
		top: 10px;
	}
	
	@media print{
		#code div,#instructDesc>div, .tabCnt{
			display: block;
		}
	}

	@media (max-width: 1275px){
		#wrapper.push{
			left:250px;
		}
	}