/**
 * @CSS DOCUMENT
 * @ 1.10.2014 - Alex Vlad
*/
/**----------------- 
 * GLOBAL RESET 
-----------------**/
*, html, body, iframe, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h5, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td, audio, video { margin:0; padding:0; outline: 0;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, img { display:block; }
table { border-collapse:collapse; border-spacing:0; }
table td { vertical-align: top; }
iframe, fieldset, img, a img { border:0 none; }
address, caption, cite, code, dfn, th, var { font-style:normal; font-weight:normal; } 
caption, th { text-align:left; }
h1, h2, h3, h5, h5, h6 { font-size:100%; }
blockquote:before, blockquote:after, q:before, q:after { content:''; content:none;}

strong, b { font-weight: bold; }
em, i { font-style: italic; }
nav ul { list-style:none }
ol, ul, li { list-style:none; }

html>body * a { position:relative; }  /* Gets links displaying over a PNG background, html>body n'est pas compris par IE6 */
a { outline:none; } /* Gets rid of Firefox's dotted borders */

hr { display:block; height:1px; border:0; border-top:1px solid #000000; margin:1em 0; padding:0; }
input, select { vertical-align:middle; }
/**------------------------------
 * GENERAL CLASSES and SETTINGS
--------------------------------**/
a { color: #C60C30; text-decoration: none; }
h1 { color: #616365; font-size: 1.6em; font-weight: normal; margin: 5px 0; }
h2 { color: #616365; font-size: 1.3em; font-weight: normal; margin: 10px 0; }

/** ICONS **/
.icon { color: #616365; font-size: 1.2em; display: inline-block; line-height: 1.1em; margin-right: 4px; }
.icon-ok-circled { color: #119E12; }
.icon-cancel-circled { color: #D81010; }
.icon-disabled { color: #bababa; }
.icon-published { color: #119E12; }
.btn-icon .icon-handshake { color: #C60C30; }
.icon-toggle-on { color: #119E12; }
.icon-toggle-off { color: #C60C30; -webkit-transform: rotate(-180deg); -ms-transform: rotate(-180deg); transform: rotate(-180deg); }

.status .btn { background-color: transparent; display: inline-block; margin: 0 4px; padding: 0; height: 18px; line-height: 18px; width: 18px; text-decoration: none; }
.btn { background: #F0F0F0; border: 1px solid #E4E4E4; color: #616365; border-radius: 4px; font-weight: bold; }
.btn { cursor: pointer; display: inline-block; font-size: 14px; line-height: 1.3em; margin-bottom: 0; padding: 4px 12px; text-align: center; vertical-align: top; }
a.btn { text-decoration: none; }	
.btn-search-plus { background-color: #f0f0f0; border: 1px solid #e4e4e4; line-height: 1.5em; }
.btn-info-family .icon { color: #0080c8 }
.btn-send-email .icon { color: #0080c8 }
.status-canceled { color: #C60C30 }

.clear-float { clear: both; }
.clear-fix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.clear-fix { zoom: 1; } /** IE 5.5/6/7 */ 
/**--------------
 * HEADER 
--------------**/
body { background-color: #FBFBFB; font-size: 15px; font-family: Helvetica, Arial, sans-serif; }
.login #global { margin: 10% 0 5%; }
.site #global { border: 1px solid #eee; background-color: #fff; margin: 0 auto; padding: 0 1%; max-width: 1600px; }
#header { border-bottom: 1px solid #E6E6E6; margin-bottom: 35px; padding-top: 1px; min-height: 100px; position: relative; z-index: 10; }
#header #logo { display: block; margin: 10px 0 15px; width: 20%; max-width: 270px; }
#header #logo.logo-servicefamille { max-width: 150px; }
#header #logo img { min-width: 100px; width: 100%; }
.ctn-client { padding: 10px 0; position: absolute; right: 0; top: 15px; }
.ctn-client a { padding: 0 5px; text-decoration: none; text-transform: lowercase; }
.ctn-client .lang { border-left: 1px solid #cecece; border-right: 1px solid #cecece; margin-left: 5px; }
.ctn-client .client-name { font-size: 1.1em; float: left; }
.ctn-client .icon { font-size: 0.9em; }

/** MENU **/
#menu { font-size: 1.1em; }
#menu li { background-color: #f0f0f0; border: 1px solid #e6e6e6; border-left: 0; float: left; margin-bottom: -1px; }
#menu li.first-child, #menu li:first-child { border-left: 1px solid #e6e6e6; }
#menu li .link-menu { border: 1px solid #ffffff; border-bottom: 0; display: block; color: #616365; padding: 8px 14px; text-align: center; text-decoration: none; }
#menu li.active { background: #ffffff; border-bottom-color: #fff; }
.toggle-menu { background-color: #F0F0F0; border: 1px solid #e6e6e6; border-bottom: 0; display: none; padding: 8px 12px; width: 17px; }
#menu .smenu { display: none; position: absolute; margin-top: 2px; left: 0; }
#menu li.active .smenu { display: block; }
#menu li .smenu li { background-color: #fff; border:0; }
#menu li .smenu a { display: block; font-size: 0.9em; padding: 5px 16px; }
/** FOLDER NAV**/
.nav { padding: 5px 0; }
.nav li { padding: 3px 0 3px 15px; position: relative; }
.nav li a { display: block; font-size: 0.8em; text-decoration: none; }
.nav li .sub-nav { padding: 3px 0 0 13px; display: none; }
.nav li .sub-nav li { padding-left: 0; }
.nav li ul.active { display: block; }
.nav li .icon-plus-squared, .nav li .icon-minus-squared { cursor: pointer; font-size: 1em; position: absolute; left: 0; top: 2px; } 
/** BREADCRUMBS **/
.breadcrumbs { border-bottom: 1px dotted #CECECE; margin-bottom: 10px; padding-bottom: 12px; }
.breadcrumbs li { display: inline-block; margin-right: -3px; }
.breadcrumbs li .icon { font-size: 1.1em; margin-left: 5px; }
/**---------------
 * MAIN CONTENT
----------------**/
/** LOGIN **/
#ctn-login { background-color: #fff; border: 1px solid #cfcfcf; margin: 0 auto; padding: 10px 20px 20px; max-width: 1000px; width: auto; }
.login #ctn-login { box-shadow: 0 1px 5px rgba(0,0,0,0.3); border-radius: 8px; max-width: 270px; }
#ctn-login #logo { display: block; margin: 10px 0 20px; }

/** MESSAGES**/
.ctn-msg { margin: 10px 0; }
.ctn-msg .error { background-color: #FFD6D3; border: 1px solid #C60C30; color: #C60C30; margin: 1px 0; }
.ctn-msg .success { background-color: #DFF9D4; border: 1px solid #59AF5C; color: #59AF5C; margin: 1px 0; }
.ctn-msg .info { background-color: #F3F6F8; border: 1px solid #BBD4E1; color: #337AD9; margin: 1px 0; padding: 5px; }
.ctn-msg p { padding: 2px 5px; }

/** SEARCH **/
.ctn-search { height: 35px; padding: 5px; }
.ctn-search .select-limit { float: right; }
#search-form input, #search-form select { float: left; margin-right: 10px; }
#search-form select { min-width: 80px; }
#search-form .btn { float: left; margin-right: 10px; }

/** CONTENT **/
#main { min-height: 200px; margin-top: 20px; position: relative; }
#main .sidebar { background-color: #f0f0f0; border: 1px solid #E6E6E6; margin-top: 12px; }
#main #sidebar-left { float: left; width: 24.8%; margin-right: 3%; }
.sidebar .wrapper { border: 1px solid #fff; height: 100%; padding: 5px 12px; }
.sidebar h2 { color: #C60C30; border-bottom: 1px dotted #C60C30; margin: 5px 0; padding-bottom: 2px; }
#content { padding: 15px 0 20px; position: relative; }
#main .content-large { width: 100%; }
#main .content-short { clear: right; float: right; width: 71.5%; }
#content h1 { border-bottom: 1px dotted #cecece; margin: 0 0 10px 0; padding-bottom: 5px; }
#ctn-btns-export { display: inline-block; font-size: 1.6em; }
#ctn-btns-export a { margin-left: 0.3em; }
#ctn-btns-export.ctn-print-item { position: absolute; right: 0; top: 0; z-index: 11; }

.ctn-items { display: block; }
.ctn-items .item { padding: 4px 0; }
.ctn-items .item .icon-doc-inv { color: #AAAAAB; }
/**INFO FACILITY**/
.ctn-infos .line:nth-child(2n) { background-color: #f5f5f5; }
.ctn-infos .line .label { padding-right: 1%; width: 39%; }
.ctn-infos .line .plain-text { display: block; float: left; padding: 6px 0; width: 60%; }
.tab-facility .tbl-horaires { width: 100%; }
.tab-facility .tbl-horaires td, .tab-facility .tbl-horaires th { border-bottom: 1px solid #e5e5e5; }

/** Responsive table**/
.ctn-table { width: 100%; }
.ctn-table .row + .odd { background-color: #f5f5f5; }
.ctn-table .row + .blacklisted { background-color: #FBC5C5; }
.ctn-table .head th { background-color: #f0f0f0; font-weight: bold; padding: 4px; }
.ctn-table .row td, .ctn-table .row th { border-bottom: 1px solid #e5e5e5; padding: 4px 5px; }
.ctn-table .col-actions { width: 200px; }
.ctn-table .col-actions a { display: inline-block; margin: 0 3px; }
.ctn-table .col-actions a:first-child { margin-left: 0; }
.ctn-table .col-actions .icon { margin: 0; }
.ctn-table .head a .icon { margin-left: 4px; }
.ctn-table .blacklisted td { font-style: italic; color: #999; }
.ctn-table .CV .icon { color: #C60C30; }
.ctn-table .Lettre .icon { color: #0D9C18; }
.ctn-table .Certifs .icon { color: #0061C2; }
.ctn-table .Diplomes .icon { color: #FFC410; }

.ctn-table .row-base { cursor: pointer; }
.ctn-table .row-details { display: none; }
.ctn-table .row-canceled { color: #ccc; }
.ctn-table .first-cell { text-align: center; width: 300px; }
.ctn-table .td-actions { cursor: auto; }
.tbl-enfants .td-icon { text-align: center; width: 20px; }
.tbl-enfants .td-date { width: 160px; }
.tbl-enfants .td-info-1 { max-width: 360px; }
.tbl-enfants th { white-space: nowrap; }
.tbl-horaires { border: 1px solid #eee; border-left: 0; margin-bottom: 1em; }
.tbl-horaires td, .tbl-horaires th { border-left: 1px solid #eee; padding: 3px 5px; text-align: center; }
.tbl-horaires td:first-child, .tbl-horaires th:first-child { text-align: left; }

/** PAGINATION **/
.pagination { margin-top: 10px; }
.pagination a, .pagination span { border: 1px solid #e5e5e5; border-right: 0; display: block; float: left; font-size: 1.2em; line-height: 1.2em; padding: 4px 10px; text-decoration: none; }
.pagination .current { background-color: #f5f5f5; color: #616365; }
.pagination .next, .pagination .next-disabled { border-right: 1px solid #e5e5e5; }
.pagination .pag-link { }

/** FOOTER **/
#footer { color: #999999; font-size: 0.8em; padding: 15px 0 10px; }

/** FORM **/
form p { margin-bottom: 5px; }
form fieldset { float: left; margin-right: 2%; width: 43%; }
form .bigger { margin-right: 2%; width: 59%; }
form .smallest { width: 38%; }
form .legend { color: #C60C30; font-size: 1.3em; margin: 0 0 15px; }
form .set-left { float: left; margin-right: 1.5%; min-width: 250px; width: 58%; }
form .set-right { float: right; margin-left: 1.5%; min-width: 250px; width: 39%; }
form .line { clear: both; margin-bottom: 5px; min-height: 30px; position: relative; }
form .line-ckeditor { margin-bottom: 5px; }
form .line-text { padding: 6px 0; }
label, .label { cursor: pointer; display: block; float: left; font-weight: bold; padding: 6px 20px 6px 0; text-align: left; width: 130px; }
.label-delete { width: 90px; padding: 0; }
input[type="text"], input[type="number"], input[type="email"], input[type="password"], textarea { 
	border: 1px solid #e4e4e4; border-radius: 5px; height: 18px; line-height: 1.1em; padding: 6px 10px; width: 188px; 
}
fieldset input[type="text"], fieldset textarea, fieldset select { width: 40%; }
fieldset label, fieldset .label { width: 35%; }
textarea { min-height: 100px; }
select { border: 1px solid #e4e4e4; padding: 0 5px; }
.validation-box { 
	background: red; color: #fff; border-radius: 5px; box-shadow: 0 0 4px #000; display: none; font-size: 12px; position: absolute; right: 0px; text-align: center; top: 0; width: 100px; 
}
input:focus + .validation-box { display: block; }
input:focus:required:invalid { background-color:#FFD8DF; border: 1px solid red; }
input:required:valid { border: 1px solid #e4e4e4; }

button .icon { margin-right: 0; }
#ctn-login label { font-weight: normal; }
form .code-image { margin-bottom: 1.5em; }
.code-image label { width: 100%; }
.code-image img { float: left; margin-right: 5px; }
.code-image input { text-align: center; }
#form-password { margin-bottom: 1em; }

/**SELECT GROUP**/
.select-group { display: inline-block; position: relative; margin: 0 3px 3px 0; }
.select-group .select-text { background-color: #fff; border: 1px solid #e4e4e4; border-radius: 5px; display: block; height: 18px; line-height: 1.1em; padding: 6px 20px 6px 10px; width: 188px; }
.select-group .select-text .icon { position: absolute; top: 0; right: 4px; height: 100%; line-height: 1.8em; }
.select-group .select-text span { display: block; overflow:hidden; text-overflow:ellipsis; white-space: nowrap; height: 100%; width: 100%; }
.select-group select { opacity: 0.001; cursor: pointer; height: 100%; position: absolute; top: 0px; right: 0px; width: 100%; z-index: 1; }

.group-controls { max-width: 400px; }
.group-controls input[type="radio"] { display: none; }
.group-controls .btn { background-color: #f5f5f5; color: #111; border: 1px solid #e4e4e4; width: 20%; }
.group-controls .active { background-color: #23a839; color: #fff; border-color:#1B842B; }
.group-controls .btn:first-of-type { border-radius: 5px 0 0 5px; border-right: none; }
.group-controls .btn:last-of-type { border-radius: 0 5px 5px 0; border-left: none;}

.toggle-field input[type="radio"] { display: none; }
.toggle-field label { background-color: #f2f2f2; color: #111; cursor: pointer; border: 1px solid #e4e4e4; display: block; font-weight: normal; padding: 3px 5px; min-width: 0; max-width: 120px; width: 20%; text-align: center; }
.toggle-field .active { background-color: #23a839; color: #fff; border-color:#1B842B; }
.toggle-field .btn-off.active { background-color: #C0312A; color: #fff; border-color:#9E130C; }
.toggle-field label:first-of-type { border-radius: 3px 0 0 3px; border-right: none; }
.toggle-field label:last-of-type { border-radius: 0 3px 3px 0; border-left: none;}

#orderdate-form { margin: 20px 0; }
#orderdate-form .text-label { float: left; display: block; padding: 5px 7px 5px 0 }
#orderdate-form .field-date { float: left; margin-right: 10px; }

#form-search { position: absolute; right: 0; z-index: 11; }
#form-search input { font-size: 1em; margin-bottom: 4px; vertical-align: top; }
#form-search button { background-color: #F0F0F0; border: 1px solid #E4E4E4; border-radius: 0 6px 6px 0; cursor: pointer; height: 32px; margin-left: -7px; padding: 5px 7px; vertical-align: top; }
#form-search .btn-reset { border-radius: 6px; margin-left: 2px; }
#form-search .ctn-filters { display: inline-block; position: relative; }
#form-search .ctn-search-plus { 
	background-color: #f0f0f0; box-shadow: 0 1px 3px rgba(0,0,0,0.3); border: 1px solid #fff; border-radius: 5px; display: none; position: absolute; top: 110%; right: 0; padding: 4px 8px; width: 267px; z-index: 11;
}
#form-search .ctn-search-plus label { color: #616365; padding: 4px 0; width: 100%; }
#form-search .ctn-search-plus p { clear: both; }
#form-search .ctn-search-plus button { border-radius: 6px; margin-left: 0; }
#form-search .field-date { float: left; width: 100px; }
#form-search #date_start { margin-right: 5px }
#form-search .ctn-checkbox label { float: right; width: 90%; }
#form-search .ctn-checkbox input { float: left; margin-top: 7px; }

#form-login { margin-bottom: 20px; }
#form-login p { margin-bottom: 10px; }
#form-login label { display: none; }
#form-login input[type="text"], #form-login input[type="password"] { width: 92%; }
#form-login .btn { background-color: #999999; border-color: transparent; color: #fff; font-weight: normal; }

#form-candidat .label, #form-candidat label { color: #000; font-weight: bold; padding: 3px 15px 2px 2px; width: 190px; }
#form-candidat .line-long .label { width: 80%; }
#form-candidat span.text { display: inline-block; word-wrap: break-word; padding: 3px 0; max-width: 100%; }
#form-candidat .line { min-height: 25px; font-size: 0.9em; }
#form-candidat .odd { background-color: #F5F5F5; }
#form-candidat textarea { margin: 3px 2px 3px 0; width: 240px; }
#form-candidat input[type="text"] { width: 240px; }
#form-candidat select { width: 260px; }

#form-export { min-width: 300px; }
#form-export .odd { background-color: #F5F5F5; }
#form-export label, #form-export .label { color: #000; font-weight: bold; padding: 3px 15px 2px 2px; }
.form-export-list .label, .form-export-list label { width: 80%; }
.form-export-list input { float: left; margin: 8px; }

#form-edit-facility .tab { float: right; }

/**======================================================
   MOBILES 
====================================================== */
/** TABLETTE */
@media (max-width:960px) {
	#header #logo { margin-bottom: 15px; }
	.cms-admin #global { padding: 0 2%; }
	.menu-active { display: none; }
	#menu { background-color: #f0f0f0; box-shadow: 0 1px 3px rgba(0,0,0,0.3); position:absolute; top:110%; padding: 6px; }
	#menu li:first-child:after { 
		width:0px; height:0px; position:absolute; top:0%; left:12px; content:''; transform:translate(0%, -100%);
		border-left:7px solid transparent; border-right:7px solid transparent; border-bottom:8px solid #F0F0F0;
   }
	#menu li { border-left: 1px solid #E6E6E6; float: none; }
	#menu li .link-menu { border: 0; text-align: left; }
	.toggle-menu { display: block; }
	#menu .smenu { position: static; margin-top: -5px; }

	#main #sidebar-left { width: 24.8%; }
	#main .content-short { width: 71%; }
	.ctn-table .row td:last-child, .ctn-table .row th:last-child { display: none; }
	.ctn-table .col-actions { width: 25%; }

	#form-search { position: static; }
	#form-edit-facility .tab, #form-edit-facility fieldset { float: none; width: 100%; }
}
/** SMARTPHONE */
@media (max-width:680px) {
	#main #sidebar-left { width: 100%; }
	#main .content-short { width: 100%; }
	.tab { padding: 0; width: 100%; }
	form .set-left { width: 99% }
	form .set-right { width: 99% }

	.ctn-table .row td, .ctn-table .row th { display: none; }
	.ctn-table .row td:first-child, .ctn-table .row th:first-child { display: table-cell; }
	.ctn-table .row td:first-child + td, .ctn-table .row th:first-child + th { display: table-cell; }
	.ctn-table .row td:first-child + td + td, .ctn-table .row th:first-child + th + th { display: table-cell; }
	.ctn-table .col-actions { width: 35%; }
}
@media (max-width:480px) {
	.login #global { margin: 25% 0 5%; }
	.site #global { padding: 0 2%; }
	#header #logo { overflow: hidden; width: 80px; }
	.ctn-items .item { margin: 0; width: 100%; }
}