/* html5doctor.com Reset v1.6.1 (http://html5doctor.com/html-5-reset-stylesheet/) - http://cssreset.com */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,input,textarea,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent; box-sizing: border-box;}
body{line-height:1}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
nav ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}
a,label[for],button,select{cursor:pointer;}
ins{background-color:transparent;color:#000;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
table{border-collapse:collapse;border-spacing:0}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
input,select,textarea,button,a{font-family:inherit;color:inherit;font-size:inherit}
input,select{vertical-align:middle;height:2.8em}

* {
	margin: 			0;
	padding:			0;
	border: 			0;
	box-sizing: 		border-box;
}

:root {
    --form-header-bg:   #2e2e2e;
    --form-header-text: #fff;
    --form-color1:      #18b8e9;
}

.hide 		{	display:	none!important		}
.tcenter 	{	text-align:	center!important;	}
.tleft		{	text-align:	left!important;		}
.tright		{	text-align:	right!important;	}

.s10		{	font-size:	1rem!important;	}
.s11		{	font-size:	1.1rem!important;	}
.s12		{	font-size:	1.2rem!important;	}
.s13		{	font-size:	1.3rem!important;	}
.s14		{	font-size:	1.4rem!important;	}
.s15		{	font-size:	1.5rem!important;	}
.s16		{	font-size:	1.6rem!important;	}
.s17		{	font-size:	1.7rem!important;	}
.s18		{	font-size:	1.8rem!important;	}
.s19		{	font-size:	1.9rem!important;	}
.s20		{	font-size:	2rem!important;	    }

.pad05      {   padding:    .5em!important       }
.pad1       {   padding:    1em!important       }
.pad2       {   padding:    2em!important       }

.w10p { width: 10%; }
.w20p { width: 20%; }
.w25p { width: 25%; }
.w30p { width: 30%; }
.w33p { width: 33%; }
.w40p { width: 40%; }
.w50p { width: 50%; }
.w60p { width: 60%; }
.w66p { width: 66%; }
.w70p { width: 70%; }
.w75p { width: 75%; }
.w77p { width: 77%; }
.w80p { width: 80%; }
.w90p { width: 90%; }
.w100p { width: 100%; }

/* BODY */
html {
	height:       		100%;
}

h1,h2,h3,h4,h5,h6 { font-weight: normal; color: #444; }
h1 { font-size: 3.4em; }
h2 { font-size: 3.0em; }
h3 { font-size: 2.6em; }
h4 { font-size: 2.2em; }
h5 { font-size: 1.8em; }
h6 { font-size: 1.3em; }

h1.title,h2.title,h3.title,h4.title,h5.title,h6.title {
    margin:         0 0 .3em 0;
    padding:        .5em;
    border-bottom:  1px solid #ccc;
}

ul{ list-style-type: none; }

a { text-decoration: none; }

input.hidden { opacity: 0;}

select {
    color:          #333;
    line-height:    1em;
    font-size:      inherit;
    font-family:    inherit;
    border:         0;
    border-radius:  0;
	background: 	none;
    -webkit-appearance:     none;
    appearance:             none;
}


/**********************************************************/
/**** ANIMATIONS ******************************************/
/**********************************************************/

@-webkit-keyframes fadein {
	0%		{ opacity:	0; }
	100% 	{ opacity:	1; }
}
@keyframes fadein {
	0%		{ opacity:	0; }
	100% 	{ opacity:	1; }
}
@-webkit-keyframes fadeout {
	0%		{ opacity:	1; }
	100% 	{ opacity:	0; }
}
@keyframes fadeout {
	0%		{ opacity:	1; }
	100% 	{ opacity:	0; }
}

@-webkit-keyframes menuSlideIn {
	0%		{ -webkit-transform:	translateX(-100%); }
	100% 	{ -webkit-transform:	translateX(0); }
}
@keyframes menuSlideIn {
	0%		{ transform:	translateX(-100%); }
	100% 	{ transform:	translateX(0); }
}
@-webkit-keyframes menuSlideOut {
	0%		{ -webkit-transform:	translateX(0%); }
	100% 	{ -webkit-transform:	translateX(-100%); }
}
@keyframes menuSlideOut {
	0%		{ transform:	translateX(0%); }
	100% 	{ transform:	translateX(-100%); }
}

/**********************************************************/
/**** MAIN ************************************************/
/**********************************************************/
body {
	width:        		100%;
	height:       		100%;
	font-family:		Arial, Helvetica, sans-serif;
	font-size:			16px;
    background-color:          #eee;
    -webkit-font-smoothing:    antialiased;
	-webkit-text-size-adjust:  none;
	-ms-text-size-adjust:      none;
	text-size-adjust: 		   none;
}
@media (min-width:1px)  { body { font-size: 5vw } }
@media (min-width:500px){ body { font-size: 3vw } }
@media (min-width:710px){ body { font-size: 2.2vw } }
@media (min-width:1000px){ body { font-size: 1em } }



#header, #main {
	display: 			inline-block;
    width:              100%;
}
#main {
    padding-top:        3.6em;
}

/**********************************************************/
/**** BOUTONS *********************************************/
/**********************************************************/
a.button,
button.button,
input[type='submit'].button {
    display: 			inline-table;
    width: 				100%;
    color: 				#ffffff;
    cursor:				pointer;
    text-decoration: 	none;
    text-transform:  	uppercase;
    text-align:         center;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-user-select: 	none;
    -moz-user-select: 		none;
    -ms-user-select: 		none;
    user-select: 			none;
}

a.button, button.button {
    position:       relative;
	width:			auto;
    height:         auto;
    color: 			#666;
}
a.button,
button.button,
.row span label[for],
.segments a {
	background-color:		rgba(0,0,0,0);
}
a.button:hover,
button.button:hover,
.row span label[for]:hover,
.segments a:hover {
	background-color:		rgba(0,0,0,.05);
}

a.button[class*='icon-']::before,
button[class*='icon-']::before {
	content: 			'';
	display: 			table-cell;
	top: 				0;
	left: 				0;
	width: 				3.6em;
	height: 			3.6em;
	background-repeat: 	no-repeat;
	background-position: center center;
    border-right:       1px solid #18b8e9;
}

a.button > span,
button.button > span {
	display: 			table-cell;
	padding:			1em 1.5em;
	vertical-align:		top;
	font-size: 			1em;
}
a.button > span,
button.button > span,
input[type='submit'].button {
	color:              #09a9e3;
}

.button.redButton > span, button.button.redButton > span { color: red; }
.button.greenButton > span, button.button.greenButton > span { color: darkgreen; }


a.button.rounded,
button.button.rounded,
input[type='submit'].button.rounded {
	background-color:		#09a9e3;
	-webkit-border-radius: 	5em;
	border-radius: 			5em;
}
a.button.bubble,
button.button.bubble,
input[type='submit'].button.bubble {
	-webkit-border-radius: 	5em;
	border-radius: 			5em;
	box-shadow: 			inset 0 0 0 .1em #09a9e3;
	overflow: 				hidden;
}
a.button.bubble:hover,
button.button.bubble:hover,
input[type='submit'].button.rounded:hover {
	background-color:		rgba(0,0,0,0);
}

a.button.rounded > span,
button.button.rounded > span,
input[type='submit'].button.rounded > span {
	color:					#fff!important;
}

a.button.bubble:hover,
button.button.bubble:hover,
input[type='submit'].button.bubble:hover {
	background-color:		#09a9e3;
}
a.button.bubble:hover > span,
button.button.bubble:hover > span,
input[type='submit'].button.bubble:hover > span {
	color:		#fff;
}

.button.rounded.redButton, button.button.rounded.redButton { background-color: red!important; }
.button.rounded.greenButton, button.button.rounded.greenButton { background-color: darkgreen!important; }

/**********************************************************/
/**** BUTTONS LIST ****************************************/
/**********************************************************/


/**********************************************************/
/**** GRID LIST *****************************************/
/**********************************************************/

.content-grid {
    display:        flex;
    flex-direction: row;
    align-content:  flex-start;
}
.content-grid .grid-cell {
    display:        flex;
    flex-direction: row;
    align-items:    center;
}

/**********************************************************/
/**** FORM ************************************************/
/**********************************************************/
.content-form {
    display:            flex;
    flex-direction:     row;
    width:              100%;
    margin-bottom:      1em;
}
.content-form-col {
    display:            flex;
    flex-direction:     row;
}
.content-form-col.vtop      { justify-content: flex-start;  }
.content-form-col.vmiddle   { justify-content: center;      }
.content-form-col.vbottom   { justify-content: flex-end;    }

.content-form label,
.content-form input,
.content-form select,
.content-form textarea {
    padding:            .7em;
}
.content-form input.text,
.content-form select.text,
.content-form textarea.text {
    color:              inherit;
    background:         rgba(0,0,0,.04);
    outline:            0;
    border:             0;
    border-bottom:      .15em solid var(--form-color1);
}
.content-form input.text:focus,
.content-form select.text:focus,
.content-form textarea.text:focus,
.content-form input.text:active,
.content-form select.text:active,
.content-form textarea.text:active {
    outline-color:      var(--form-color1);
    outline-width:      1px;
    outline-style:      auto;
    background:			rgba(0,0,0,.08);
}





/**********************************************************/
/*** 	LIBRARY AVAILABLE AT
/***	admin/medias/images/icons/
/**********************************************************/

.icon-add::before {
	background-image:	url(../images/icons_custom/icon_add.png);
}
.icon-delete::before {
    background-image:	url(../images/icons/white/close.png);
}
.icon-cancel::before {
	background-image:	url(../images/icons_custom/icon_cancel.png);
}
.icon-list::before {
	background-image:	url(../images/icons/white/list.png);
}
.icon-prev::before {
	background-image:	url(../images/icons/white/arrow-left2.png);
}
.icon-next::before {
	background-image:	url(../images/icons/white/arrow-right2.png);
}
.icon-valid::before {
    background-image:	url(../images/icons_custom/icon_tick.png);
}
.icon-search::before {
	background-image:	url(../images/icons/white/search.png);
}
.icon-filter::before {
	background-image:	url(../images/icons/white/filter2.png);
}

.icon-zoomin::before {
	background-image:	url(../images/icons/white/zoom-in.png);
}
.icon-zoomout::before {
	background-image:	url(../images/icons/white/zoom-out.png);
}

.icon-stat::before {
	background-image:	url(../images/icons/white/stats.png);
}
.icon-pie::before {
	background-image:	url(../images/icons/white/pie.png);
}
/*
.icon-upload::before {
	background-image:	url(../images/icons/white/cloud-upload.png);
}*/
.icon-upload::before {
    background-image:	url(../images/icons_custom/icon_download.png);
}
.icon-mobile::before {
	background-image:	url(../images/icons/white/mobile.png);
}
.icon-tablet::before {
	background-image:	url(../images/icons/white/tablet.png);
}
.icon-desktop::before {
	background-image:	url(../images/icons/white/screen.png);
}
.icon-tv::before {
	background-image:	url(../images/icons/white/tv.png);
}

.icon-location::before {
	background-image:	url(../images/icons/white/location.png);
}
.icon-lock::before {
	background-image:	url(../images/icons/white/lock.png);
}
.icon-link::before {
	background-image:	url(../images/icons/white/link.png);
}
.icon-web::before {
	background-image:	url(../images/icons/white/earth.png);
}
.icon-email::before {
	background-image:	url(../images/icons/white/mail4.png);
}
.icon-folder::before {
	background-image:	url(../images/icons/white/folder-open.png);
}
.icon-image::before {
	background-image:	url(../images/icons/white/image2.png);
}
.icon-info::before {
	background-image:	url(../images/icons/white/info.png);
}
.icon-key::before {
	background-image:	url(../images/icons/white/key2.png);
}
.icon-overview::before {
	background-image:	url(../images/icons/white/eye2.png);
}

.icon-pdf::before {
	background-image:	url(../images/icons/white/file-pdf.png);
}

.icon-social-fb::before {
	background-image:	url(../images/icons/white/facebook.png);
}
.icon-social-tw::before {
	background-image:	url(../images/icons/white/twitter.png);
}
.icon-social-vimeo::before {
	background-image:	url(../images/icons/white/vimeo.png);
}
.icon-social-gp::before {
	background-image:	url(../images/icons/white/google-plus.png);
}
.icon-social-yt::before {
	background-image:	url(../images/icons/white/youtube.png);
}






/**********************************************************/
/**** CONTENT *********************************************/
/**********************************************************/
#content {
	padding:		    .5em;
}

#content .content-block {
	display: 			block;
    margin-bottom:      1em;
    width:              100%;
    background:         #fff;
}
#content > div:last-child {
    margin-bottom:      0;
}

#content > div p {
    padding-bottom:     .5em;
}







/**********************************************************/
/**** PROMPT ***********************************************/
/**********************************************************/

#prompt {
    position:       fixed;
    z-index:        99;
    bottom:         3em;
    right:          .5em;
    width:          40em;
	max-width: 		320px;
    -webkit-transition: -webkit-transform 100ms ease-in-out;
    transition:         transform 100ms ease-in-out;
    -webkit-transform:  translateX(105%);
    transform:          translateX(105%);
}
#prompt.show {
    -webkit-transform:  translateX(1.2em);
    transform:          translateX(1.2em);
}
#prompt.hide {
	display:		none;
}
#prompt > span {
    display:        inline-block;
    width:          100%;
    padding:        1.4em 1em;
    font-size:      1.8em;
    color:          #fff;
    background:     #333;
    background:     rgba(0,0,0,.7);
	border-radius: 	.3em;
}
#prompt > span.valid {
    background:     #218b0a;
    background:     rgba(50, 140, 30, .95);
}
#prompt > span.error {
    background:     #400;
    background:     rgba(180,0,0,.7);
}



/**********************************************************/
/**** RESPONSIVE ******************************************/
/**********************************************************/
@media (max-width: 500px) {
    .content-form.fullwidth {
        flex-direction:     column;
    }
    .content-form.fullwidth .content-form-col {
        width:              100%;
    }
}
@media (min-width: 54em) {
    #header {
        position:   fixed;
        top:        0;
        left:       0;
        z-index:    999;
    }
    #main {
        display:    table;
        width:      100%;
        height:     100%;
    }
    #menu, #article {
        display:    table-cell;
        position:   static;
        padding-top:5em;
    }
    #article {
        -webkit-transition:  none;
        transition:          none;
    }

}

@media (min-width: 1200px) {
    #content {
		margin:			0 auto;
		width:			1150px;
	}
}
