@charset "UTF-8";

body{padding-top:70px; }
body .adminHeader{background-color: inherit;}

input, button, select, textarea{font-size:inherit !important;}

input[type='text'], input[type='password'], textarea, select{color:#000; border:1px solid #ccc; padding:3px; margin:0;}
input[type='text']:focus, input[type='password']:focus, textarea:focus{border-color:#777;}

/*input, button, select, textarea{font-size: inherit;}*/
select{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none; /* remove default arrow */
	padding-right:25px !important;
	padding-left:7px;
	background: #fff url(../images/arrow-down-dark.gif) no-repeat 98% 50%;/* add custom arrow */
}


/* admin headers */
.adminHeader{position:fixed; top:0; width:100%; z-index:20; border-bottom: 1px solid rgba(255, 255, 255, .3); box-shadow:0 1px 2px rgba(0,0,0,.2);}
.adminHeader a:not(.button){padding:5px 15px;}
.adminHeader>a.button{margin-top:-10px; vertical-align: middle;}
.adminHeader a#saveChangesBut, .adminHeader a.reset, .adminHeader a.saveAs, .adminHeader a#test_css, form#siteDesign a.reset, form#siteDesign a.saveAs{display:none;}
.adminHeader a#menu{display:inline-block;}
.adminHeader h1{margin:0; padding:0; display:inline-block; margin-right:15px;}

#adminNav{
	display:none;
	clear:both;
}
#adminNav a span{color:#888;}
#adminNav a:hover span{color:#fff;}
#adminNav a{display:block; padding-left:60px; text-decoration:none;}
#imgMenu{margin-right:20px;}

/* admin forms for styles and site info */
#prefContainer input, #prefContainer textarea, #prefContainer select{width:100%;}
#prefContainer form{padding:10px;}
#prefContainer .note, #prefContainer .error, #prefContainer.success{padding-right:35px; font-size:smaller; box-shadow:none;}
form.inner, div.likeForm{max-width:670px; min-width:380px;}
form.inner >div{ margin-top:20px; padding-bottom:100px;}
div.halfContainer{float:left; width:50%; min-width:400px;}
div.third, div.quart, div.twothird{float:left; padding:10px 1%;}
div.third{width:32%;clear:both;}
div.twothird{width:64%;}
div.quart{width:48%;}

/* admin containers */
#adminContainer{padding:20px; clear:both;}
#structureContainer{padding:20px 0 150px 20px;}
#structureContainer{/*overflow-x:hidden; */display:inline-block;}
/* dim the background when a modal opens */
.background input[type="text"]{opacity:.5;}

/* uls and li for manage structure and manage content sections/file lists */
li{position:relative;overflow:visible;}
ul.structure li ul li{margin-left:50px;}
ul.structure li, li.section li{padding:5px 72px 5px 5px;}
ul.structure li a, ul.structure li span.empty{opacity:0; margin-left:15px; padding:3px; white-space:nowrap;}
ul.structure li a.anchor{margin-left:0; padding:0;}
ul.structure:hover{background-color:rgba(190, 190, 190, .3);}
ul.structure:hover li{background-color: rgba(255, 255, 255, .5);}
ul.structure li:hover{background-color:rgba(190, 190, 190, .3);}
ul.structure li.saved{background-color:rgba(160, 160, 160, .3) !important;}
ul.structure li.saved a.up, ul.structure li.saved a.down{opacity:1;}
ul.structure li:hover ul li{background-color: rgba(255, 255, 255, .5);}
ul.structure li ul li{padding-right:35px;}
ul.structure li ul li:hover{background-color:rgba(190, 190, 190, .3);}
ul.structure li.selected{background-color:rgba(190, 190, 190, .3) !important;}
ul.structure li.selected>span a{opacity:1 !important;}
ul.structure li.selected>span input[type="text"]{opacity:1; border-color:#000;}
ul.structure li div.preview{
	position:absolute;
	width:auto; height:auto; 
	left:34px; 
	top: 50% ;
	-ms-transform: translate(0, -50%);
	-webkit-transform: translate(0, -50%);
	-moz-transform: translate(0, -50%);
	-o-transform: translate(0, -50%);
	transform: translate(0, -50%);
	display:none; 
	z-index:10;
	cursor: pointer;
}
ul.structure li.saved>div.preview, ul.structure li:hover>div.preview{display:block !important;}
ul.structure li div.preview img{display:block; max-width:100%; margin:0 auto; box-shadow: 0 0 0 1px #000;}

ul li:hover a, ul li:hover span.empty{opacity:1;}
ul li:hover a.link{opacity:.5;}
ul li:hover a.link:hover{opacity:1;}
li:hover ul li a{opacity:.5;}
li ul li:hover a{opacity:1;}

span.empty{font-style: italic; color:#ec6a00;}

li.hidden{background-image:url(../admin/images/hidden-bg.png);}

ul.structure li a.show, ul.structure li a.hide{
	position:absolute;
	z-index:2;
	top:0;
	right:0;
	bottom:0;
	width:68px;
	padding:9px 0 0 0;
	text-align:center;
	margin-left:0;
}
ul.structure li a.show{opacity:.5;}
ul.structure li:hover>a.show{opacity:1;}
ul.structure li a.show{background-color:#25850d; color:#fff; border-bottom:1px solid rgba(255,255,255,.5);}
a.hide{color:#999;}
a.hide:hover{font-style:italic; background:transparent url(../admin/images/hidden-bg.png);}
a.newSub:hover{color:#25850d;}
a.edit:hover{color:#01406b;}
a.delete:hover{color:#bb0808;}
a.disabled{opacity:.5; background:transparent url(../admin/images/hidden-bg.png); cursor:not-allowed;}

a.button.showCreds img{width:10px; margin-right:8px; margin-bottom:-2px;}

ul > li.section > span{margin-bottom:5px;}
ul li input.nameInput{width:350px; border-left:7px solid #000;}
ul li input.imgInput{
	opacity:1; 
	width:242px; /*height:22px;*/
	padding-left:117px;
	cursor:pointer;
	background-color:#fafafa; background-position:0 50%; background-repeat:no-repeat;
}

/*li.hidden.home ul{display:none;}*/
li.home input.nameInput, li.home > a.up, li.home > a.down, li.home > span a.newSub, li.home > span a.delete{display:none;}


input.position{width:20px; text-align:right;}
a.down, a.up{
	position:absolute; 
	margin:0 !important; 
	padding:0 !important; 
	font-style: normal !important; 
	left:-20px; 
	width:20px; height:50%;
	line-height:1px; 
	background-repeat:no-repeat; 
	background-color:rgba(149, 149, 149, 0.5); 
	opacity:0 !important;
}
a.up{top:0; background-image: url('../admin/images/arrowUp.png'); background-position: 50% 0;}
a.down{bottom:0; background-image: url('../admin/images/arrowDown.png'); background-position: 50% 100%;}
a.up:hover, a.down:hover{text-decoration:none; background-color:#000;}
a.up.disabled:hover, a.down.disabled:hover{
	background-color:rgba(149, 149, 149, 0.5);
	background-image:url('../admin/images/hidden-bg.png');
	background-repeat: repeat;
}

li:hover > a.down, li:hover > a.up, li.saved > a.up, li.saved > a.down, li.selected>span a.up, li.selected>span a.down {opacity:1 !important;}
li:hover p > a.down, li:hover p > a.up{opacity:1 !important;}



/* div file containers (manage contents) */
div.txt.admin, div.html.admin{/*height:245px;*/ max-width:650px; padding:5px; border:1px solid #ccc; overflow: auto; cursor:pointer;}

/* highlight actionnable elements with border color on mouse hover */
div.txt.admin:hover, div.html.admin:hover, .button:not(.disabled):hover, button:hover, .button.selected, input:hover, textarea:hover{border-color:#000;}

span.fileTitle, div.fileTitle{display:inline-block; margin-left:10px; font-size:larger; font-weight:bold;}




/* rotate images containers (div.editFile and div.galImgRow) */
div.editFile .captionContainer{margin-top:20px;}
div.editFile a.cancel.disabled, div.editFile a.save.disabled, div.galImgRow a.cancel.disabled, div.galImgRow a.saveRotate.disabled{display:none;}
div.editFile .actions{margin-top:-45px; padding-left:10px;}

span.checkmark{
	display: inline-block;
	border-bottom: 2px solid;
	border-right: 2px solid;
	height: 15px;
	width: 8px;
	transform: rotate(45deg);
}
.checkmark.white{border-color:#fff;}
.checkmark.green{border-color:#25850d;}
a.rotate{
	padding-left:27px; 
	background-image: url(../admin/images/rotate.gif); 
	background-repeat:no-repeat; background-position: 7px 7px;
}
a.cancel::before{
	content:"\000D7";
}
div.imgContainer{
	/*border:1px solid #ddd; 
	background-color:rgba(0, 0, 0, .9);*/
	text-align:center;
}
a.aImg, .html.gal span{
	background-image: url(../admin/images/img-bg.gif);
	background-repeat:no-repeat; 
	background-position:50%;
	background-size:contain;
}
a.aImg{
	cursor:zoom-in;
}
div.editFile a.aImg{display:block; margin:0 auto; width:400px; height:400px;}
div.galImgRow a.aImg{display:inline-block; width:120px; height:120px; vertical-align: super;}
div.editFile a.aImg:hover{text-decoration:none;}

span#en_label, span#de_label{display:inline-block; padding:1px 5px; border:1px solid #ddd; border-bottom:none;}
span#en_label.selected, span#de_label.selected{background-color:#000; color:#fff; text-decoration:underline;}



/* galleries */
.html.gal span{
	display:block; float:left; 
	width:48%; margin-bottom:2%; margin-right:2%;
	padding-bottom:40%;
}
/*.adminGal{margin-top:10px;}*/
.adminGal a.button{/*background-color:transparent;*/ border:none;}
.galImgRow{border-bottom:1px solid #ccc; padding:2px 6px;}

textarea.caption{width: calc( 100% - 8px); /*height:40px; */margin-bottom:4px;}
.imgCaption{margin-top:-23px;}
.imgCaption a.edit{margin-left:167px;}
.imgCaption a.en, .imgCaption a.de, #galDescContainer a.en, #galDescContainer a.de{
	display:inline-block;
	padding:0 5px;
	border:1px solid #ddd;
	border-top-left-radius: 3px; border-top-right-radius: 3px;
	border-bottom:none;
}
.imgCaption a.selected, #galDescContainer a.selected{background-color:#000; color:#fff;}

div.or{
	border-top:1px solid rgba(0, 0, 0, .1); border-bottom:1px solid rgba(255, 255, 255, .1); 
	height:0; 
	margin:10px 0; 
	overflow:hidden;
}

#uploadsContainer div.fileContainer{
	position:relative; 
	float:left; 
	width:20%;
	overflow:hidden;
}
div.selection{
	position:absolute; top:5px; right:5px; 
	z-index:10;
	width:20px; height:20px;
	padding:5px;
	background-color:#fff;
	font-size:20px; line-height:20px; 
	color:#25850d;
	border:2px solid #25850d;
	border-radius: 20px;
	visibility:hidden; 
	text-align: center;
	/*background:#fff url('../admin/images/success.png') no-repeat 50%;*/
}

/* svg fill */
.green{fill:#25850d;}
.white{fill:#ffffff;}

div.fileContainer a.pad{
	display:block;
	position:relative;
	border:5px solid transparent;
	margin-bottom:20px;
	padding-bottom: 65%;
	overflow:hidden;
	background-color:transparent; background-repeat:no-repeat; background-position:50%; background-size:contain;
}
div.fileContainer a.pad.selected, div.fileContainer a.pad.selected:hover{border-color:#25850d; background-color:#25850d;}
div.fileContainer a.pad.selected div.selection{visibility:visible;}
div.fileContainer a.pad:hover{border-color:#bbb; background-color:#bbb;}
div.fileContainer a{display:block;}

div.fileContainer a.pad span.fname{display:block; position:absolute; border:1px solid #ccc; top:0; right:0; left:0;/* bottom:0;*/ background-color:rgba(255, 255, 255, 0.7); padding:2px 5px;}

div.fileContainer a.pad div.txt.admin, div.fileContainer a.pad div.html.admin{margin-right:0;}
a.pad span.galImg{
	display:block;
	float:left;
	width: calc( 50% - 4px );
	padding-bottom:30%;
	background-size: cover;
	background-position: 50%;
	margin:1px;
}


/* fixer div that will hold all modals, #working and #done message divs */
#fixer{
	position:fixed;
	top: -1px; right:0;
	height:1px;
	width:100%;
	text-align:center;
	z-index:100;
}
/* 'working' message div, shown during ajax process */
#working, #done{
	display:none;
	text-align:left;
	position:relative;
	z-index:100;
	border-bottom-left-radius: 3px;
	border-bottom-right-radius: 3px;
	background-color:#ffc;
	border:1px solid #669153;
	color:#555;
	padding:15px 34px 15px 34px;
	max-width: calc( 100vw - 90px );
}
#working{
	background-image:url('../images/progress.svg');
	background-position: 10px center;
	background-repeat: no-repeat;
	padding:10px 15px 10px 44px;
}
#done{opacity: 0;}
#done.success{
	background-color:rgb(214, 255, 204); 
	border:1px solid #8fad6d;
}
#done.error{
	background-color:rgb(255, 214, 204); 
	border:1px solid #6b0303c4;
}

.contentW{
	min-width: 650px;
}

/* modal container, modal and overlay */
.modalContainer{
	position:absolute;
	display:none;
	z-index: 50; 
	top: 0; right:0;
	/*width:100%;*/
	/*height:100%;*/
	/*text-align: right;*/
}
.modal{
	position:relative;
	padding:24px; /*width:550px; margin:0 auto;*/
	padding-right:9px;
	display: inline-block;
	/*min-width:40vw;*/
	/*max-height: calc( 100vh - 48px);*/
	overflow: auto;
	text-align: left;
	border-bottom-left-radius: 5px;
	/*border-bottom-right-radius: 5px;*/
	border-left:1px solid #ccc;
	border-bottom:1px solid #ccc;
	box-shadow:-1px 0 10px rgba(0,0,0,.2);
	-webkit-font-smoothing: subpixel-antialiased;
}
.modal p.msg{margin-top:-27px; padding-top:3px; line-height:22px;}

.closeBut, .closeMessage{
	position:absolute; 
	display:inline-block; 
	top: 0; right:0; 
	line-height:24px;
	width:24px; height:24px; 
	font-size:20px; 
	text-align:center; 
	vertical-align:middle;
	z-index:10;
}
.closeBut{background-color:rgba(0, 0, 0, .8); color:#fff;}
.closeMessage{color:rgba(0,0,0,.5);}
.closeBut:hover, .closeMessage:hover{cursor:pointer; text-decoration: none;}
.closeBut:hover{color:#ccc;}
.closeMessage:hover{color:rgba(0,0,0,1);}

/*.closeBut{position: fixed;}*/

.modal .closeBut{right:unset; margin-left:-26px; display:none;}

.scroller{overflow:auto;}
/* webkit */
.scroller::-webkit-scrollbar{
	width:10px;
	background-color: transparent;
}
.scroller::-webkit-scrollbar-thumb {
	width: 6px; 
}
/* firefox */
.scroller{
	scrollbar-width: thin;
	overflow-x: hidden;/*firefox seems to adds orizontal scrollbar automatically if scrollbar-width is set*/
}


/* various .modalContainer specifics */
#newFile{z-index:30;}
#edit_text, #gallery, #embedMedia{z-index:33;}
#uploadFileInsert{z-index:36;}
#chooseFromUploads{z-index:39;}
/* embed media textarea */
#embedMediaContainer textarea#TeM{width: calc( 100% - 9px ); height:130px; font-family:monospace;}
#adminGalContainer{border: 1px solid #ccc; background-color: rgba(0, 0, 0, 0.05); margin-top:10px;}

div#credsContainer{padding-top:10px; margin-top:30px; border-top:1px solid #ddd;}


/* display user uploads modal */
#chooseFromUploadsModal{
	width: 80vw;
}

/* display uploads specific styles */
#chooseFromUploadsModal div.txt, 
#chooseFromUploadsModal div.html, 
#chooseFromUploadsModal div.audio, 
#chooseFromUploadsModal div.video, 
#chooseFromUploadsModal div.embed{
	margin-top:0; height: calc( 100% - 12px ) !important;
	width:auto;
}

div.modalFooter{clear:both; margin-top:10px; height:auto;}
div.modalFooter a.button, div.modalFooter button{margin-bottom:0 !important;}

div#backTooTop{height:10px; text-align:center; overflow:hidden; opacity:0;}


/** buttons **/
button, .button{display:inline-block; padding:5px 10px; border:1px solid #fff; border-radius:3px; margin:2px 0 2px 10px;background-color:#eee; color:#000;
cursor: pointer;}
button[type=submit], .button.submit{background-color:#3186be; color:#fff;}
button[type=submit].save, .button.submit.save, .button.submit.saveRotate{background-color:#25850d;}
.cancel, button[type=submit].cancel{background-color:#bb0808 !important; color:#fff !important;}
.cancel, button[type=submit], .button.submit{text-shadow:-1px -1px rgb(0, 0, 0);}
.cancel:hover, button[type=submit]:hover, .submit:hover{text-shadow:1px 1px rgb(0, 0, 0);}
.button.disabled, input.disabled, button:disabled, input:disabled{opacity:.3;}
.button.hideModal, .button.specialCancel, button[type=reset]{background:#ddd url(../admin/images/hidden-bg.png);}
.right{float:right; margin-right:0 !important;}
.left{margin-left:0;}
.discret{background-color:#fff;}
.button.big{padding-right:14px; padding-left:14px; font-size:larger;}
a.button:hover{text-decoration:none;}
.remove:hover{color:#bb0808;}
.lowkey{opacity:.5; margin-top:22px; margin-top:22px; font-size:smaller;}
.cross{
	position:absolute;
	top:0; bottom:0; left:0;
	width:31px;
	background-color:#000;
}
.cross:before, .cross:after{
	position: absolute;
	top: calc( 50% - 7px );
	left:14px;
	content:' ';
	height:14px;
	width:2px;
	background-color:#fff;
}
.cross:before{
	transform:rotate(45deg);
}
.cross:after{
	transform:rotate(-45deg);
}
.button.close{position:relative; overflow:hidden; padding-left:41px}

a.openNew, a.openNew:hover{
	display:inline-block; opacity:1; text-decoration:none;
}
.openNew svg{stroke:#888; fill:#fff; width:19px; height:13px;}
.openNew:hover svg{stroke:#000;}

/* results messages (error, success, note) */
.error{background-color:#ff9191; color:#000;}
.success{background-color:#cce9b2; color:#000;}
.note{background-color:#ffc; color:#555;}

.error, .success, .note{padding:2px 35px 2px 10px;/* border-radius:3px;*/ position:relative; overflow: hidden;}

#working, #done, .error, .success, .note{box-shadow:1px 2px 20px rgba(0, 0, 0, .5);}


span.above, span.below{font-size:smaller;}

/* ::before styles */
.above::before { 
	content:"\02191\00a0";
}
.below::before { 
	content:"\02193\00a0";
}
.warning::before { 
    content:"\26A0\00a0";
}
.remove::before{
	content:"\02A02\00a0";
}
.add::before{
	content:"\0002B\00a0";
}
.undo::before{
	content:"\021A9\00a0";
}
.redo::before{
	content:"\021AA\00a0";
}
.help::before{
	content:"@ ";
}
.fav::before{
	content:"\02606\00a0";
}
.download::before{
	content:"\022BB\00a0";
}
.edit::before{
	content:"\270E\00a0";
}
.fichiers::before{
	content:"\029C9\00a0";
}
.upload::before{
	content:"\02912\00a0";
}
a.link{margin-left:0 !important;}




/* images rotation */
.rot90{
	transform-origin: top left;
	transform: rotate(-90deg) translateX(-100%);
}
.rot180{
	transform-origin: top left;
	transform: rotate(-180deg) translateY(-100%) translateX(-100%);
}
.rot270{
	transform-origin: top left;
	transform: rotate(-270deg) translateY(-100%);
}
a.aImg.imgProcessing{opacity:.3;}


/** toolTips **/
span.tip{position:relative;}

/* tooltips appear when span.tip are hovered. */
span.tooltip{
	position:absolute; z-index:10; top:30px; left:0;
	opacity:0;
	width:auto;
	height:auto;
	min-width:85px;
	/*max-width:300px;*/
	/*white-space: nowrap; */
	padding:4px 8px; 
	font-size:11px; font-family: Verdana, Geneva, Tahoma, sans-serif; font-weight:normal; line-height:15px; 
	/*text-align:center; */color:#fff;
	background-color: rgba(0, 0, 0, .8);
	border-radius:2px;
	box-shadow:0 0 2px #fff;
}
/* tootip arrow up */
.tooltip.tUp::after{
	content: " ";
	position: absolute;
	bottom: 100%;  /* At the top of the tooltip */
	left: 10px;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: transparent transparent rgba(0, 0, 0, .8) transparent;
}
/* tootip arrow down */
.tooltip.tDown::after{
	content: " ";
	position: absolute;
	top: 100%; /* At the bottom of the tooltip */
	left: 10px;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: rgba(0, 0, 0, .8) transparent transparent transparent;
}



/* various */
.first{margin-top:0;}

.tags{color:#bbb; font-size:smaller; float:right; position:relative;}
.tags:hover{color:#000;}
.tagTip{
	position:absolute; display:none; bottom:16px; right:0; 
	background-color:#ffc; 
	padding:6px 9px; border:1px solid #aaa; border-radius:3px;
	box-shadow:3px 3px 7px rgba(0, 0, 0, .2);
	z-index:50;
}

.nowrap{white-space:nowrap; display:inline-block; position:relative;}

/* upload progress bar */
div.progress{margin:10px 0; background-color:#eee; border:1px solid #ccc; border-top-color:#999; border-radius: 3px; height:5px; width: calc( 100% - 2px ); overflow:hidden; display:none;}
div.bar{width:0%; background-color:#65baf3; height:10px;}

/* offset anchor a tags 80px down to account for fixed adminHeader */
a:target{
	display: block;
	position: relative;
	top: -80px;
	visibility: hidden;
}

/* for trouble-shooting */
pre{border:1px solid #ccc;}

input, select{color:#000;}