@import url('https://fonts.googleapis.com/css?family=Ropa+Sans');

html,button, .default-font,body, div, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video,input,a {
   font-family: 'Ropa Sans', sans-serif;
}



:root {
  --main-bg-color: #009136;
  --main-color:#009136;
  --second-color:#f19e33;
    --btn-a-color:#fff;
    --text-color:#fff;
}

.input
{
	font-size:18px;
}




input[type=text]{
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 5px;
    box-sizing: border-box;
}

input[type=text]:focus{
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid var(--main-color);
    border-radius: 5px;
    box-sizing: border-box;
    outline: none;

}



select{

    font-size:18px;
    overflow: hidden;
}


select.soflow, select#soflow-color {
    -webkit-appearance: button;
    -webkit-border-radius: 2px;
    -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
    -webkit-padding-end: 20px;
    -webkit-padding-start: 2px;
    -webkit-user-select: none;
    background-image: url(../img/15xvbd5.png), -webkit-linear-gradient(#FAFAFA, #F4F4F4 40%, #E5E5E5);
    background-position: 97% center;
    background-repeat: no-repeat;
    border: 1px solid #AAA;
    color: #555;
    overflow: hidden;
    padding: 5px 10px;
    text-overflow: ellipsis;
    white-space: nowrap;

}


.header_page
{
	line-height: 26px;
    display: block;
    font-weight: normal;
    background:var(--main-bg-color);
    border-bottom: 1px solid #e8e8e8;
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0;
	font-size:17px;
}

.header_title
{
    margin:5px 15px;
    color:var(--text-color);
}

.form_content
{
	border: 0.1px solid #e8e8e8;
	padding: 15px;
    height: auto;
}

.form_footer
{
	border: 0.1px solid #e8e8e8;
	padding: 15px;
	background:var(--main-bg-color);
}



.sub_header
{
	
}

.title
{
	font-size: 150%;
	font-weight:bold;
	
}

.title_desc
{
	font-size:15px
}

.bouton
{
    font-family: 'Ropa Sans', sans-serif;
}

.primary_background
{
	background:var(--main-color);
}

.secondary_background
{
	background:var(--second-color);
}

.annuler_btn
{
    background:#e8501e;
}


.valider_btn
{
    background:#27ae60;
}


.success_lib
{
    color: #27ae60;
}

.error_lib
{
    color:#e74c3c;
}

.warning_lib
{
    color :#f39c12;
}

.succes_bg
{
    background:#27ae60;
}


.error_bg
{
    background:#e74c3c;
}


.btn_clavier > a :hover
{
	border: 1px solid #ccc;
}



.primary_background > a :hover
{
	background:var(--second-color);
	color:#fff;
	font-size:18px;
	text-align:center;
}

.primary_background > button :hover
{
	background:var(--second-color);
	color:#fff;
	font-size:18px;
	text-align:center;
}

.btn:hover
{
    background:var(--second-color);
    color:#fff;
    font-size:18px;
    text-align:center;
}





.wblien, .wblienHorsZTR
{
    color:#fff;
}

.primary_background > a
{
    color:#fff;
}

.primary_background > button
{
    color:#fff;
}



.btn-valider
{
	background:#FFCA07;
}

.btn-annuler
{

}



.primary_color
{
	color:var(--main-color);
}

.secondary_color
{
	color:var(--main-color);
}


.btn_clavier_chiffre 
{
	color:#E9523F;
}

.btn_clavier_lettre
{
	color:#009238;
}



.left
{
		text-align:left;
	font-weight:bold;
}


.right
{
	text-align:right;
}


.alert_box
{
    border-radius: 5px;
}

.alert-icon {
    font-size: 40px;
    text-align: center;
}

.lib_alert_box
{
    font-size: 15px;
    text-align: center;
}