@charset "utf-8";
@import url(http://fonts.googleapis.com/css?family=Lato:400,100,300,900,700);

/* reset */
*,html,body,div,p,h1,h2,h3,ul,li,img {margin: 0;padding: 0;font-size: 100%;vertical-align: baseline;line-height:135%;font-family: Arial, Helvetica, sans-serif;}
html,body{font-size:12px; color:#000; background-color:#fbfbfb; height:100%}
article, aside, dialog, figure, footer, header, hgroup, nav, section {display:block;}
table {border-collapse:separate;border-spacing:0}
caption, th, td {text-align:left;font-weight:normal;float:none !important;}
table, th, td {vertical-align:middle;}
blockquote:before, blockquote:after, q:before, q:after {content:'';}
blockquote, q {quotes:"" "";}
img,a img {border:none}
:focus {outline:0}
li {list-style:none}
form{display:inline;}
p {margin:5px 0}
a{color:#069; text-decoration:underline}
a:hover{}
h1{font-size:14px; font-weight:bold; color:#069; font-variant:normal; line-height:normal;}
h2{font-size:16px; border-bottom:1px solid #ccc; color: #333; padding:0 1px 5px; margin: 10px 0;}
h3 {font-size:18px;font-weight:300;margin:20px 0;}
#page{min-height: 100%;height: auto !important;height: 100%;margin: 0 auto -30px;position:relative;}
#push {height: 35px;}
#login, #motdepasse { width:450px; background:#fff; margin: 100px auto auto; padding:10px 15px 25px; box-shadow: 3px 3px 3px #ccc; border: 1px solid #eee; border-radius: 3px}
#motdepasse { width:500px; padding:20px 25px 35px }
#login ul {width: 400px; margin-left:auto; margin-right:auto}
#login li, #motdepasse li { margin:5px 15px; list-style:none; padding: 5px 2px; }
#login label, #motdepasse label { width: 100px; display:block; float:left; margin-top:2px; }
#login a, #motdepasse a { padding:2px 4px; text-decoration:none }
#login a:hover{color:#fff;background:#39c}

#main{width:930px;margin:10px auto; min-height:600px}
#topnav {color:#fff;padding:10px 40px;background-color: #000; font-weight:700}
#topnav a { color:#9CF; padding:2px 4px; text-decoration:none }
#topnav.utilisateur span {padding-left:3px;margin-left:3px;border-left: 1px solid #333;}
#topnav a:hover { color:#FFF; background:#39C; }
.brdnone {border:none !important}
#topnav .user { background: url(/images/ic-user.png) no-repeat left top; padding-left:18px !important}
#ident{margin-right:10px;}

.act img{margin:0 2px;padding:2px;}
#supprimer{color:#FFF;background-color:#900;margin-left:100px;}
#enregistrer{color:#060}
.active{font-weight:bold;color:#090;}
td.desactive{color:#999}
#user a{color:#333;}
#encode {margin:15px 0;padding:4px;border:1px solid #aaa;background-color:#F2F7E0;height:280px}

#option{font-size:10px}
#option p{}

#message {font-size:13px; text-align:center; background: #fcfcfc; border:1px solid #fdfdfd; margin: 10px auto -50px; padding: 10px 20px; height: 30px; width: 320px; border-radius: 2px; box-shadow: 1px 1px 5px #ccc;  position:relative; z-index:1000; }
#message select{padding:5px; font-size:13px; }

#details{font-family:"Lato"; font-size:11px; position:relative;width:auto;margin:60px auto 0;border-collapse:collapse;table-layout:fixed;border-spacing:0; z-index:1 }
#details td, #details th{width:31px !important; text-align:center;vertical-align:top;padding:0;height:24px;}
#details th.jour{background:#ccc; border-top:2px solid #666; height:1px !important; line-height:1px;}
#details th.jourM{background:#c30;border-top:2px solid #C00;}
#details td.regles{border-bottom:5px solid #FCC;}
#details th.jour a, #details th.jour span{line-height:5px;background-color:#fff; position:relative; padding: 2px; top:-5px; border: 2px solid #666; color:#666; border-radius:5px; box-shadow:0px 0px 5px rgba(0,0,0,0.5);}
#details th.jourM a, #details th.jourM span{border: 2px solid #c00;	color:#c00;}
#details td.bar {text-shadow:1px 1px 1px #FFF; font-weight:300; color:#666; height:220px; vertical-align: bottom;}
#details td.int { font-weight:300; color:#c60; height:45px; padding:0; }
#details td.bar img { margin: auto 0 0; width:100%; border-top:1px solid #999;}
#details td.int img { vertical-align:top; margin:0 0 auto; width:100%; border-bottom:1px solid #C60;}
#details td img.picto {	margin: 3px auto 2px;}
#details a{padding:2px; font-size:12px; text-decoration:none}
#details a:hover{color:#fff; background:#39c}
#details .altV {background: url(/images/fd-degrade-gris.png) no-repeat center bottom;}
#details .jourJ {background: url(/images/fd-degrade-vert.png) no-repeat center bottom; border-right:1px solid #ccc;}
#details .jourR {background: url(/images/fd-degrade-rouge.png) no-repeat center bottom;}
#details .hover {font-weight:700 !important; background: url(/images/fd-degrade-bleu.png) no-repeat center bottom; }
#details .hover img.bar {box-shadow: 1px 1px 2px #aaa;}

.contentWrap{min-height:470px;}
input.suppr{margin-left:100px;color:#C00;}

.ct2{padding:4px;margin:10px;background-color:#FFFDE9;border:1px solid #BBB;}
.pad4 {padding:4px;}
.textFil { font-weight:900; text-transform:uppercase; font-size:20px; color:#eee; text-align:center; margin-bottom:10px; word-spacing: 3px;}
.picto{clear:both}
.picto td{line-height:100%}
.ico{margin:1px 5px;height:25px;width:25px;vertical-align:middle;}
.med { font-size:11px; text-shadow:1px 1px 1px #FFF; background: url(/images/ic-pills.png) no-repeat center top;text-align:center;padding-top:18px;padding-bottom:10px}
.erreur { box-shadow:1px 1px 2px #999;background-image: url(/images/fd-rouge-p80.png);color:#fff; text-align:center}
.bgF7{background: #fbfbfb}
.inFocus { background-color:#FFC !important}
.ombre { box-shadow: 1px 1px 2px #ddd}
.l900 {width:900px}
.fClr3 {color:#333}
.fClr6 {color:#666}
.fClr6 {color:#666}
.fClrC60 {color:#C60}
.fSize14 {font-size:14px}
.fSize16 {font-size:16px}
.fSize18 {font-size:18px}
.fSize24 {font-size:24px}
/****** ui-element ****/

/* Corner radius */
.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { -moz-border-radius-topleft: 4px/*{cornerRadius}*/; -webkit-border-top-left-radius: 4px/*{cornerRadius}*/; -khtml-border-top-left-radius: 4px/*{cornerRadius}*/; border-top-left-radius: 4px/*{cornerRadius}*/; }
.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { -moz-border-radius-topright: 4px/*{cornerRadius}*/; -webkit-border-top-right-radius: 4px/*{cornerRadius}*/; -khtml-border-top-right-radius: 4px/*{cornerRadius}*/; border-top-right-radius: 4px/*{cornerRadius}*/; }
.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { -moz-border-radius-bottomleft: 4px/*{cornerRadius}*/; -webkit-border-bottom-left-radius: 4px/*{cornerRadius}*/; -khtml-border-bottom-left-radius: 4px/*{cornerRadius}*/; border-bottom-left-radius: 4px/*{cornerRadius}*/; }
.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { -moz-border-radius-bottomright: 4px/*{cornerRadius}*/; -webkit-border-bottom-right-radius: 4px/*{cornerRadius}*/; -khtml-border-bottom-right-radius: 4px/*{cornerRadius}*/; border-bottom-right-radius: 4px/*{cornerRadius}*/; }

/****** Tooltip  ******/
.tooltip { display:none; margin-top:-20px; background:#fff; border:1px solid #aaa; padding:10px; font-size:11px; box-shadow: 1px 1px 10px #888; border-radius: 3px; position:relative; z-index:9000; width:190px;}
.tooltip strong {text-align:center;border-bottom:1px solid #333; display:block; padding-bottom:2px; margin:4px 0; font-size:12px; text-transform:uppercase; font-weight:400}
.tooltip center {text-align:center;display:block; margin:0;}
.tooltip b {color:#333; font-style:normal; font-weight: bold}
.tooltip em {color:#F00; font-style:normal; font-weight: bold}
.tooltip::after {content: "\25BC";position:absolute;bottom:-12px;left:47%;font-size:14px;line-height:14px;color:#aaa;text-shadow:1px 1px 1px #666;display:block;}

/****** Cefaly Technology ******/
#powered {word-spacing: 2px;text-align:center;font-size:10px;font-weight:300;width:100%;height:25px;color:#9CF;background-image: url(/images/fd-noir-p80.png);}
#powered p {padding-top:4px;text-transform: uppercase;}

/****** Navigation ******/
.navig{left:0;height:20%; min-height:120px;top:120px;width:55px;background:#000 url(/images/nav-prevr2.png) no-repeat left center;position:absolute;z-index:110000;-moz-opacity:0.2;-khtml-opacity:0.2;opacity:0.2}
.navigR{left:auto; right:0 !important; background-position:right center}
.navig:hover{-moz-opacity:0.5;-khtml-opacity:0.5;opacity:0.5}

/****** Overlay ******/
.simple_overlay {display:none;z-index:10000;width:500px;min-height:500px;padding:15px 0 10px 10px;border:1px solid #fff;box-shadow: 0 0 30px #999;background:#fff; }
.simple_overlay a.close, #alert .close {background:url(/css/images/bt-close.png) no-repeat;position:absolute;right:-15px;top:-15px; height:35px;width:35px;text-decoration:none;}

/****** Cursor ******/
#details tbody, .simple_overlay .close, .navig {cursor:pointer;cursor:hand}

/****** Fonts ******/
body{font-family: Arial, Helvetica, sans-serif}
#menu{font-family:Verdana,Arial,Helvetica,sans-serif}
#topnav, h3, th,.textFil,#powered,.tooltip strong {font-family: 'Lato', 'Lucida Grande', Arial, Helvetica, sans-serif}



@media screen and (max-width: 1380px), (max-height: 850px) {
	#main{min-height:500px}
	#message {padding: 10px 20px; height:auto}
	#listePatients {margin:10px auto auto !important; padding:10px 15px 25px !important;}
    #main { margin-top:0px !important;}
	#afficheResume {height:220px !important; margin-top:50px !important}
	#resume{margin:-210px auto 0 47px !important;}
	#resume td{padding:210px 8px 35px !important;}
	#resume td h3{margin:10px 0 5px !important}
	.med {padding-bottom:1px !important}
	h3.fSize24 { margin:5px 0 !important}
	#listePatients li {margin: 5px 0 !important;padding: 5px 15px !important;}
	.navig{width:48px;-moz-opacity:0.3;-khtml-opacity:0.3;opacity:0.3}
	.simple_overlay {padding:5px 0 5px 10px; top:10px !important}

}
@media screen and (max-width: 1200px), (max-height: 768px) {
	#main{min-height:500px}
	#message {margin: 5px auto -65px; padding: 5px 20px; height:auto}
	#message h1.textFil {margin-bottom:3px}
	#listePatients {margin:10px auto auto !important; padding:10px 15px 25px !important;}
    #main { margin-top:0px !important;}
	#afficheResume {height:220px !important; margin-top:50px !important}
	#resume{margin:-210px auto 0 47px !important;}
	#resume td{padding:210px 8px 35px !important;}
	#resume td h3{margin:10px 0 5px !important}
	.med {padding-bottom:1px !important}
	h3.fSize24 { margin:3px 0 !important}
	#listePatients li {margin: 5px 0 !important;padding: 5px 15px !important;}
	.navig{width:48px;-moz-opacity:0.3;-khtml-opacity:0.3;opacity:0.3}
	.simple_overlay {padding:5px 0 5px 10px; top:10px !important}

}