html, body { height:100%; margin:0; color: #000; background: #7b974a; 
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-smoothing: antialiased;}
/* 
https://www.w3schools.com/cssref/css3_pr_box-sizing.asp
*:before, *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
} 
*/


/* BODY */
.navigation { 
background:#000;   
color:#fff;
} 
.header { 
background:coral;   
} 
.footer { 
background:coral;   
} 
.main_container { 
/*background:#ccc;  */
/*height:1000px;*/
/*margin-left:3%;
margin-right:3%; */
} 
/* SECTIONS */
.section_1 { 
background: bisque;
margin-left:3%;
margin-right:3%; 
} 
.section_2 { 
background: cornsilk;
margin-left:3%;
margin-right:3%; 
} 
.section_3 { 
/*background: gold;*/
background: #fbecae;
margin-left:3%;
margin-right:3%; 
} 
.section_4 { 
background: aliceblue;
margin-left:3%;
margin-right:3%; 
} 
.section_5 { 
background: cornflowerblue;
margin-left:3%;
margin-right:3%; 
} 

/* BOX STYLES */
.box_style_1 { 
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 0px 3px 6px #8c8b8b;
        box-shadow: 0px 3px 6px #8c8b8b; 
}


/* BOX STYLES TITLES */
.box_style_title_1 {
    line-height: 26px;
	text-align: center;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    -webkit-box-shadow: 0px 0px 2px 2px #795548;
            box-shadow: 0px 0px 2px 2px #795548;
    margin-bottom: 5px;
    background: -webkit-gradient(linear, left top, left bottom, from(#ededce),color-stop(38%, #ac7b41),to(#80613e));
    background: -webkit-linear-gradient(top, #ededce 0%,#ac7b41 38%,#80613e 100%);
    background: -o-linear-gradient(top, #ededce 0%,#ac7b41 38%,#80613e 100%);
    background: linear-gradient(to bottom, #ededce 0%,#ac7b41 38%,#80613e 100%);
    /* background: linear-gradient(to bottom, #af9360 0%,#ac7b41 50%,#8e6431 100%); */
	
    color: #fff;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.box_style_title_1 a{ 
    cursor: pointer;
	color:#fff;
	text-decoration: none;
	font-size: 1em;
    text-shadow: #111 2px 2px 5px;
	opacity: 1;
    -webkit-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease; 
}
.box_style_title_1 a:hover{ 
	opacity: 0.8;
    -webkit-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}

/* DEBUG */
.debug_0 { border: inherit; }
.debug_1 { border: 1px solid white; } 
.debug_2 { border: 1px solid #01ff01; } 
.debug_3 { border: 1px solid red; } 
.debug_4{ border: 2px solid #ff00e3; }

/* ///////////// DISPOSITIONS ///////////// */

/* LES MARGES FONT DE L'ESPACE VERS L'EXTERIEUR DU CONTENU */
/* MARGES */
.margin_0{ margin:0;}
.margin_5px{ margin:5px;}
.margin_10px{ margin:10px;}
.margin_20px{ margin:20px;}
.margin_auto{ margin:auto;}
.margin_auto_important{ margin:auto!important;}
/* MARGES DROITE */
.margin_right_0{ margin-right:0;}
.margin_right_5px{ margin-right:5px;}
.margin_right_10px{ margin-right:10px;}
.margin_right_20px{ margin-right:20px;}
.margin_right_auto{ margin-right:auto;}
/* MARGES GAUCHE */
.margin_left_0{ margin-left:0;}
.margin_left_5px{ margin-left:5px;}
.margin_left_10px{ margin-left:10px;}
.margin_left_20px{ margin-left:20px;}
.margin_left_auto{ margin-left:auto;}
/* MARGES HAUT */
.margin_top_0{ margin-top:0;}
.margin_top_5px{ margin-top:5px;}
.margin_top_10px{ margin-top:10px;}
.margin_top_20px{ margin-top:20px;}
.margin_top_auto{ margin-top:auto;}
/* MARGES BAS */
.margin_bottom_0{ margin-bottom:0;}
.margin_bottom_5px{ margin-bottom:5px;}
.margin_bottom_10px{ margin-bottom:10px;}
.margin_bottom_20px{ margin-bottom:20px;}
.margin_bottom_auto{ margin-bottom:auto;}

/* LES PADDINGS FONT DE L'ESPACE VERS L'INTERIEUR DU CONTENU ( A EVITER AU POSSIBLE GOURMAND EN RESSOURCES ) */
/* PADDING */
.padding_0{ padding:0;}
.padding_5px{ padding:5px;}
.padding_10px{ padding:10px;}
.padding_20px{ padding:20px;}
/* PADDING DROITE */
.padding_right_0{ padding-right:0;}
.padding_right_5px{ padding-right:5px;}
.padding_right_10px{ padding-right:10px;}
.padding_right_20px{ padding-right:20px;}
/* PADDING GAUCHE */
.padding_left_0{ padding-left:0;}
.padding_left_5px{ padding-left:5px;}
.padding_left_10px{ padding-left:10px;}
.padding_left_20px{ padding-left:20px;}
/* PADDING HAUT */
.padding_top_0{ padding-top:0;}
.padding_top_5px{ padding-top:5px;}
.padding_top_10px{ padding-top:10px;}
.padding_top_20px{ padding-top:20px;}
/* PADDING BAS */
.padding_bottom_0{ padding-bottom:0;}
.padding_bottom_5px{ padding-bottom:5px;}
.padding_bottom_10px{ padding-bottom:10px;}
.padding_bottom_20px{ padding-bottom:20px;}

/* LARGEUR 100% ( CASSE LES LIGNE FLEX ) */
.width_100_pourcent{width: 100%;}

/* LARGEURS NAXIMALES */
.max_width_5px{max-width: 5px;}
.max_width_10px{max-width: 10px;}
.max_width_50px{max-width: 50px;}
.max_width_100px{max-width: 100px;}
.max_width_150px{max-width: 150px;}
.max_width_200px{max-width: 200px;}
.max_width_250px{max-width: 250px;}
.max_width_300px{max-width: 300px;}
.max_width_350px{max-width: 350px;}
.max_width_400px{max-width: 400px;}
.max_width_450px{max-width: 450px;}
.max_width_500px{max-width: 500px;}

/* LARGEURS NAXIMALES EN POURCENTAGE */
.max_width_10pourcent{max-width: 10%;}
.max_width_50pourcent{max-width: 50%;}
.max_width_100pourcent{max-width: 100%;}

/* LARGEURS MINIMALES */
.min_width_50px{min-width: 50px;}
.min_width_100px{min-width: 100px;}
.min_width_200px{min-width: 200px;}

/* HAUTEURS MINIMALES */
.min_height_5px{min-height: 5px;}
.min_height_10px{min-height: 10px;}
.min_height_50px{min-height: 50px;}
.min_height_100px{min-height: 100px;}
.min_height_150px{min-height: 150px;}
.min_height_200px{min-height: 200px;}
.min_height_250px{min-height: 250px;}
.min_height_300px{min-height: 300px;}
.min_height_350px{min-height: 350px;}
.min_height_400px{min-height: 400px;}
.min_height_450px{min-height: 450px;}
.min_height_500px{min-height: 500px;}

/* HAUTEURS */
.height_inherit{height: inherit;}
.height_inherit_important{height: inherit!important;}
.height_0px{height: 0px;}
.height_5px{height: 5px;}
.height_10px{height: 10px;}
.height_50px{height: 50px;}
.height_100px{height: 100px;}
.height_150px{height: 150px;}
.height_200px{height: 200px;}
.height_250px{height: 250px;}
.height_300px{height: 300px;}
.height_350px{height: 350px;}
.height_400px{height: 400px;}
.height_450px{height: 450px;}
.height_500px{height: 500px;}



/* ///////////// DECORATIONS ///////////// */

/* COULEURS DE FOND */
.fond_1{ background: #fbecae; }
.fond_2{ background: #ffffcc; }
.fond_3{ background: #fff; }
.fond_4{ background: #ccc; }
.fond_5{ background: #ffffd7; }


/* COULEURS DE FOND GRADIENT */
.gradient_1{ 
background: #af9360; /* Fallback */
background: -webkit-gradient(linear, left top, left bottom, from(#af9360),color-stop(50%, #ac7b41),to(#8e6431));
background: -webkit-linear-gradient(top, #af9360 0%,#ac7b41 50%,#8e6431 100%);
background: -o-linear-gradient(top, #af9360 0%,#ac7b41 50%,#8e6431 100%);
background: linear-gradient(to bottom, #af9360 0%,#ac7b41 50%,#8e6431 100%); 
}
.gradient_2{ 
background: #ededce; /* Fallback */
background: -webkit-gradient(linear, left top, left bottom, from(#ededce),color-stop(38%, #ac7b41),to(#80613e));
background: -webkit-linear-gradient(top, #ededce 0%,#ac7b41 38%,#80613e 100%);
background: -o-linear-gradient(top, #ededce 0%,#ac7b41 38%,#80613e 100%);
background: linear-gradient(to bottom, #ededce 0%,#ac7b41 38%,#80613e 100%);
}
.gradient_3{ 
background: #ededce; /* Fallback */
background: -webkit-gradient(linear, left top, left bottom, from(#ededce),color-stop(38%, #ac8b4d),to(#ac7b41));
background: -webkit-linear-gradient(top, #ededce 0%,#ac8b4d 38%,#ac7b41 100%);
background: -o-linear-gradient(top, #ededce 0%,#ac8b4d 38%,#ac7b41 100%);
background: linear-gradient(to bottom, #ededce 0%,#ac8b4d 38%,#ac7b41 100%);
}
.gradient_4{ 
background: #f2d490; /* Fallback */
background: -webkit-gradient(linear, left top, left bottom, from(#f2d490), to(#ac8b4d));
background: -webkit-linear-gradient(top, #f2d490, #ac8b4d);
background: -o-linear-gradient(top, #f2d490, #ac8b4d);
background: linear-gradient(to bottom, #f2d490, #ac8b4d);
}
.gradient_5{ 
background: #f0e858; /* Fallback */
background: -webkit-gradient(linear, left top, left bottom, from(#f0e858), to(#857d0c));
background: -webkit-linear-gradient(top, #f0e858, #857d0c);
background: -o-linear-gradient(top, #f0e858, #857d0c);
background: linear-gradient(to bottom, #f0e858, #857d0c);
}
.gradient_6{ 
background: #9c7240; /* Fallback */
background: -webkit-gradient(linear, left top, left bottom, from(#c2a271), color-stop(0%, #fefefe), color-stop(46%, #916b3f), to(#9c7240));
background: -webkit-linear-gradient(top, #c2a271 0%, #fefefe 0%, #916b3f 46%, #9c7240 100%);
background: -o-linear-gradient(top, #c2a271 0%, #fefefe 0%, #916b3f 46%, #9c7240 100%);
background: linear-gradient(180deg, #c2a271 0%, #fefefe 0%, #916b3f 46%, #9c7240 100%);
}

/* COULEURS DE BOX OMBRES EXTERIEURES */
.box_shadow_centre_1{ 
-webkit-box-shadow: 0px 3px 6px #4a4a4a;
box-shadow: 0px 3px 6px #4a4a4a;
}
.box_shadow_droite_1 {
-webkit-box-shadow: 2px 3px 6px #4a4a4a;
box-shadow: 2px 3px 6px #4a4a4a;
}
.box_shadow_gauche_1 {
    -webkit-box-shadow: -2px 3px 6px #4a4a4a;
    box-shadow: -2px 3px 6px #4a4a4a;
}
.box_shadow_all_1 {
-webkit-box-shadow: 0px 0px 16px 0px #4a4a4a;
box-shadow: 0px 0px 16px 0px #4a4a4a;
}
/* couleurs ombres plus legeres */
.box_shadow_centre_2{ 
-webkit-box-shadow: 0px 3px 6px #8c8b8b;
box-shadow: 0px 3px 6px #8c8b8b;
}
.box_shadow_droite_2 {
-webkit-box-shadow: 2px 3px 6px #8c8b8b;
box-shadow: 2px 3px 6px #8c8b8b;
}
.box_shadow_gauche_2 {
    -webkit-box-shadow: -2px 3px 6px #8c8b8b;
    box-shadow: -2px 3px 6px #8c8b8b;
}
.box_shadow_all_2 {
-webkit-box-shadow: 0px 0px 16px 0px #8c8b8b;
box-shadow: 0px 0px 16px 0px #8c8b8b;
}

/* COULEURS DE BOX OMBRES INTERIEURES */
.box_shadow_inset_centre_1{ 
-webkit-box-shadow: inset 0px 3px 6px #4a4a4a;
box-shadow: inset 0px 3px 6px #4a4a4a;
}
.box_shadow_inset_droite_1 {
-webkit-box-shadow: inset -2px 3px 6px #4a4a4a;
box-shadow: inset -2px 3px 6px #4a4a4a;
}
.box_shadow_inset_gauche_1 {
    -webkit-box-shadow: inset 2px 3px 6px #4a4a4a;
    box-shadow: inset 2px 3px 6px #4a4a4a;
}
.box_shadow_inset_all_1{ 
-webkit-box-shadow: inset 0px 0px 16px 0px #000000;
box-shadow: inset 0px 0px 16px 0px #000000;
}
/* couleurs ombres plus legeres */
.box_shadow_inset_centre_2{ 
-webkit-box-shadow: inset 0px 3px 6px #8c8b8b;
box-shadow: inset 0px 3px 6px #8c8b8b;
}
.box_shadow_inset_droite_2 {
-webkit-box-shadow: inset -2px 3px 6px #8c8b8b;
box-shadow: inset -2px 3px 6px #8c8b8b;
}
.box_shadow_inset_gauche_2 {
    -webkit-box-shadow: inset 2px 3px 6px #8c8b8b;
    box-shadow: inset 2px 3px 6px #8c8b8b;
}
.box_shadow_inset_all_2{ 
-webkit-box-shadow: inset 0px 0px 16px 0px #515151;
box-shadow: inset 0px 0px 16px 0px #515151;
}

/* COULEURS OMBRES CENTRE GRANDES SURFACES */
.box_shadow_surface_1 {
-webkit-box-shadow: 0 13px 14px #291c14;
box-shadow: 0 13px 14px #291c14;
}
.box_shadow_surface_2 {
-webkit-box-shadow: 0 13px 14px #999;
box-shadow: 0 13px 14px #999;
}
.box_shadow_surface_3 {
-webkit-box-shadow: 0 13px 14px #ddd;
box-shadow: 0 13px 14px #ddd;
}
.box_shadow_surface_4{ 
-webkit-box-shadow: 0 13px 14px #c5ab84;
box-shadow: 0 13px 14px #c5ab84;
}

/* BORDURES RONDES */
.border_radius_5px { -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
.border_radius_10px { -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; }
.border_radius_15px { -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; }
.border_radius_20px { -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; }
.border_radius_25px { -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px; }
.border_radius_30px { -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; }
/* BORDS RONDS HAUT DROITE ET GAUCHE */
.border_top_right_and_left_radius_5px { -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; }
.border_top_right_and_left_radius_10px { -webkit-border-top-left-radius: 10px; -webkit-border-top-right-radius: 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; border-top-left-radius: 10px; border-top-right-radius: 10px; }
.border_top_right_and_left_radius_15px { -webkit-border-top-left-radius: 15px; -webkit-border-top-right-radius: 15px; -moz-border-radius-topleft: 15px; -moz-border-radius-topright: 15px; border-top-left-radius: 15px; border-top-right-radius: 15px; }
.border_top_right_and_left_radius_20px { -webkit-border-top-left-radius: 20px; -webkit-border-top-right-radius: 20px; -moz-border-radius-topleft: 20px; -moz-border-radius-topright: 20px; border-top-left-radius: 20px; border-top-right-radius: 20px; }
.border_top_right_and_left_radius_25px { -webkit-border-top-left-radius: 25px; -webkit-border-top-right-radius: 25px; -moz-border-radius-topleft: 25px; -moz-border-radius-topright: 25px; border-top-left-radius: 25px; border-top-right-radius: 25px; }
.border_top_right_and_left_radius_30px { -webkit-border-top-left-radius: 30px; -webkit-border-top-right-radius: 30px; -moz-border-radius-topleft: 30px; -moz-border-radius-topright: 30px; border-top-left-radius: 30px; border-top-right-radius: 30px; }
/* BORDS RONDS BAS DROITE ET GAUCHE */
.border_bottom_right_and_left_radius_5px { -webkit-border-bottom-left-radius: 5px; -webkit-border-bottom-right-radius: 5px; -moz-border-radius-bottomleft: 5px; -moz-border-radius-bottomright: 5px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; }
.border_bottom_right_and_left_radius_10px { -webkit-border-bottom-left-radius: 10px; -webkit-border-bottom-right-radius: 10px; -moz-border-radius-bottomleft: 10px; -moz-border-radius-bottomright: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; }
.border_bottom_right_and_left_radius_15px { -webkit-border-bottom-left-radius: 15px; -webkit-border-bottom-right-radius: 15px; -moz-border-radius-bottomleft: 15px; -moz-border-radius-bottomright: 15px; border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; }
.border_bottom_right_and_left_radius_20px { -webkit-border-bottom-left-radius: 20px; -webkit-border-bottom-right-radius: 20px; -moz-border-radius-bottomleft: 20px; -moz-border-radius-bottomright: 20px; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; }
.border_bottom_right_and_left_radius_25px { -webkit-border-bottom-left-radius: 25px; -webkit-border-bottom-right-radius: 25px; -moz-border-radius-bottomleft: 25px; -moz-border-radius-bottomright: 25px; border-bottom-left-radius: 25px; border-bottom-right-radius: 25px; }
.border_bottom_right_and_left_radius_30px { -webkit-border-bottom-left-radius: 30px; -webkit-border-bottom-right-radius: 30px; -moz-border-radius-bottomleft: 30px; -moz-border-radius-bottomright: 30px; border-bottom-left-radius: 30px; border-bottom-right-radius: 30px; }
/* BORD ROND HAUT DROITE */
.border_top_right_radius_5px { -webkit-border-top-right-radius: 5px; -moz-border-radius-topright: 5px; border-top-right-radius: 5px; }
.border_top_right_radius_10px { -webkit-border-top-right-radius: 10px; -moz-border-radius-topright: 10px; border-top-right-radius: 10px; }
.border_top_right_radius_15px { -webkit-border-top-right-radius: 15px; -moz-border-radius-topright: 15px; border-top-right-radius: 15px; }
.border_top_right_radius_20px { -webkit-border-top-right-radius: 20px; -moz-border-radius-topright: 20px; border-top-right-radius: 20px; }
.border_top_right_radius_25px { -webkit-border-top-right-radius: 25px; -moz-border-radius-topright: 25px; border-top-right-radius: 25px; }
.border_top_right_radius_30px { -webkit-border-top-right-radius: 30px; -moz-border-radius-topright: 30px; border-top-right-radius: 30px; }
/* BORD ROND HAUT GAUCHE */
.border_top_left_radius_5px { -webkit-border-top-left-radius: 5px; -moz-border-radius-topleft: 5px; border-top-left-radius: 5px; }
.border_top_left_radius_10px { -webkit-border-top-left-radius: 10px; -moz-border-radius-topleft: 10px; border-top-left-radius: 10px; }
.border_top_left_radius_15px { -webkit-border-top-left-radius: 15px; -moz-border-radius-topleft: 15px; border-top-left-radius: 15px; }
.border_top_left_radius_20px { -webkit-border-top-left-radius: 20px; -moz-border-radius-topleft: 20px; border-top-left-radius: 20px; }
.border_top_left_radius_25px { -webkit-border-top-left-radius: 25px; -moz-border-radius-topleft: 25px; border-top-left-radius: 25px; }
.border_top_left_radius_30px { -webkit-border-top-left-radius: 30px; -moz-border-radius-topleft: 30px; border-top-left-radius: 30px; }
/* BORD ROND BAS DROITE */
.border_bottom_right_radius_5px { -webkit-border-bottom-right-radius: 5px; -moz-border-radius-bottomright: 5px; border-bottom-right-radius: 5px; }
.border_bottom_right_radius_10px { -webkit-border-bottom-right-radius: 10px; -moz-border-radius-bottomright: 10px; border-bottom-right-radius: 10px; }
.border_bottom_right_radius_15px { -webkit-border-bottom-right-radius: 15px; -moz-border-radius-bottomright: 15px; border-bottom-right-radius: 15px; }
.border_bottom_right_radius_20px { -webkit-border-bottom-right-radius: 20px; -moz-border-radius-bottomright: 20px; border-bottom-right-radius: 20px; }
.border_bottom_right_radius_25px { -webkit-border-bottom-right-radius: 25px; -moz-border-radius-bottomright: 25px; border-bottom-right-radius: 25px; }
.border_bottom_right_radius_30px { -webkit-border-bottom-right-radius: 30px; -moz-border-radius-bottomright: 30px; border-bottom-right-radius: 30px; }
/* BORD ROND BAS GAUCHE */
.border_bottom_left_radius_5px { -webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomleft: 5px; border-bottom-left-radius: 5px; }
.border_bottom_left_radius_10px { -webkit-border-bottom-left-radius: 10px; -moz-border-radius-bottomleft: 10px; border-bottom-left-radius: 10px; }
.border_bottom_left_radius_15px { -webkit-border-bottom-left-radius: 15px; -moz-border-radius-bottomleft: 15px; border-bottom-left-radius: 15px; }
.border_bottom_left_radius_20px { -webkit-border-bottom-left-radius: 20px; -moz-border-radius-bottomleft: 20px; border-bottom-left-radius: 20px; }
.border_bottom_left_radius_25px { -webkit-border-bottom-left-radius: 25px; -moz-border-radius-bottomleft: 25px; border-bottom-left-radius: 25px; }
.border_bottom_left_radius_30px { -webkit-border-bottom-left-radius: 30px; -moz-border-radius-bottomleft: 30px; border-bottom-left-radius: 30px; }

/* ///////////// POLICES ///////////// */
/* ALIGNEMENT HORIZONTAL */
.text_align_center { text-align:center; }
.text_align_right { text-align:right; }
.text_align_left{ text-align:left; }
/* TAILLE DE POLICES */
.font_size_1em { font-size: 1em; } /* De base */
.font_size_1_2em { font-size: 1.2em; }
.font_size_1_3em { font-size: 1.3em; }
.font_size_1_4em { font-size: 1.4em; }
.font_size_1_5em { font-size: 1.5em; }
.font_size_1_6em { font-size: 1.6em; }
.font_size_1_7em { font-size: 1.7em; }
.font_size_1_8em { font-size: 1.8em; }
.font_size_2em { font-size: 2em; }
.font_size_2_5em { font-size: 2.5em; }
/* TEXTE TROP LONG (Cache ce qui depasse) */
.texte_trop_long {  
	white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
}

/* ///////////// MODELS DE BOX ///////////// */

/* BOX TITRE 0 */
.model_box_titre_mini_0 {
    line-height: 26px;
	text-align: center;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    -webkit-box-shadow: 0px 0px 2px 2px #795548;
            box-shadow: 0px 0px 2px 2px #795548;
    margin-bottom: 5px;
    color: #fff;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.model_box_titre_0 {
    line-height: 26px;
	text-align: center;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    -webkit-box-shadow: 0px 0px 2px 2px #795548;
            box-shadow: 0px 0px 2px 2px #795548;
    margin-bottom: 5px;
    color: #fff;
	font-size: 1.3em;
	font-weight: bold;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
/* BOX TITRE 1 */
.model_box_titre_mini_1 {
    line-height: 26px;
	text-align: center;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    -webkit-box-shadow: 0px 0px 2px 2px #795548;
            box-shadow: 0px 0px 2px 2px #795548;
    margin-bottom: 5px;
background: #af9360; /* Fallback */
background: -webkit-gradient(linear, left top, left bottom, from(#af9360),color-stop(50%, #ac7b41),to(#8e6431));
background: -webkit-linear-gradient(top, #af9360 0%,#ac7b41 50%,#8e6431 100%);
background: -o-linear-gradient(top, #af9360 0%,#ac7b41 50%,#8e6431 100%);
background: linear-gradient(to bottom, #af9360 0%,#ac7b41 50%,#8e6431 100%);
    color: #fff;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.model_box_titre_1 {
    line-height: 26px;
	text-align: center;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    -webkit-box-shadow: 0px 0px 2px 2px #795548;
            box-shadow: 0px 0px 2px 2px #795548;
    margin-bottom: 5px;
background: #af9360; /* Fallback */
background: -webkit-gradient(linear, left top, left bottom, from(#af9360),color-stop(50%, #ac7b41),to(#8e6431));
background: -webkit-linear-gradient(top, #af9360 0%,#ac7b41 50%,#8e6431 100%);
background: -o-linear-gradient(top, #af9360 0%,#ac7b41 50%,#8e6431 100%);
background: linear-gradient(to bottom, #af9360 0%,#ac7b41 50%,#8e6431 100%);
    color: #fff;
	font-size: 1.3em;
	font-weight: bold;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
/* BOX TITRE 2 */
.model_box_titre_mini_2 {
    line-height: 26px;
	text-align: center;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    -webkit-box-shadow: 0px 0px 2px 2px #795548;
            box-shadow: 0px 0px 2px 2px #795548;
    margin-bottom: 5px;
    background: -webkit-gradient(linear, left top, left bottom, from(#ededce),color-stop(38%, #ac7b41),to(#80613e));
    background: -webkit-linear-gradient(top, #ededce 0%,#ac7b41 38%,#80613e 100%);
    background: -o-linear-gradient(top, #ededce 0%,#ac7b41 38%,#80613e 100%);
    background: linear-gradient(to bottom, #ededce 0%,#ac7b41 38%,#80613e 100%);
    color: #fff;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.model_box_titre_2 {
    line-height: 26px;
	text-align: center;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    -webkit-box-shadow: 0px 0px 2px 2px #795548;
            box-shadow: 0px 0px 2px 2px #795548;
    margin-bottom: 5px;
    background: -webkit-gradient(linear, left top, left bottom, from(#ededce),color-stop(38%, #ac7b41),to(#80613e));
    background: -webkit-linear-gradient(top, #ededce 0%,#ac7b41 38%,#80613e 100%);
    background: -o-linear-gradient(top, #ededce 0%,#ac7b41 38%,#80613e 100%);
    background: linear-gradient(to bottom, #ededce 0%,#ac7b41 38%,#80613e 100%);
    color: #fff;
	font-size: 1.3em;
	font-weight: bold;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
/* BOX TITRE 3 */
.model_box_titre_mini_3 {
    line-height: 26px;
	text-align: center;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    -webkit-box-shadow: 0px 0px 2px 2px #795548;
            box-shadow: 0px 0px 2px 2px #795548;
    margin-bottom: 5px;
background: #ededce; /* Fallback */
background: -webkit-gradient(linear, left top, left bottom, from(#ededce),color-stop(38%, #ac8b4d),to(#ac7b41));
background: -webkit-linear-gradient(top, #ededce 0%,#ac8b4d 38%,#ac7b41 100%);
background: -o-linear-gradient(top, #ededce 0%,#ac8b4d 38%,#ac7b41 100%);
background: linear-gradient(to bottom, #ededce 0%,#ac8b4d 38%,#ac7b41 100%);
    color: #fff;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.model_box_titre_3 {
    line-height: 26px;
	text-align: center;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    -webkit-box-shadow: 0px 0px 2px 2px #795548;
            box-shadow: 0px 0px 2px 2px #795548;
    margin-bottom: 5px;
background: #ededce; /* Fallback */
background: -webkit-gradient(linear, left top, left bottom, from(#ededce),color-stop(38%, #ac8b4d),to(#ac7b41));
background: -webkit-linear-gradient(top, #ededce 0%,#ac8b4d 38%,#ac7b41 100%);
background: -o-linear-gradient(top, #ededce 0%,#ac8b4d 38%,#ac7b41 100%);
background: linear-gradient(to bottom, #ededce 0%,#ac8b4d 38%,#ac7b41 100%);
    color: #fff;
	font-size: 1.3em;
	font-weight: bold;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

/* BOX TITRE 4 */
.model_box_titre_mini_4 {
    line-height: 26px;
	text-align: center;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    -webkit-box-shadow: 0px 0px 2px 2px #795548;
            box-shadow: 0px 0px 2px 2px #795548;
    margin-bottom: 5px;
background: #f2d490; /* Fallback */
background: -webkit-gradient(linear, left top, left bottom, from(#f2d490), to(#ac8b4d));
background: -webkit-linear-gradient(top, #f2d490, #ac8b4d);
background: -o-linear-gradient(top, #f2d490, #ac8b4d);
background: linear-gradient(to bottom, #f2d490, #ac8b4d);
    color: #fff;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.model_box_titre_4 {
    line-height: 26px;
	text-align: center;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    -webkit-box-shadow: 0px 0px 2px 2px #795548;
            box-shadow: 0px 0px 2px 2px #795548;
    margin-bottom: 5px;
background: #f2d490; /* Fallback */
background: -webkit-gradient(linear, left top, left bottom, from(#f2d490), to(#ac8b4d));
background: -webkit-linear-gradient(top, #f2d490, #ac8b4d);
background: -o-linear-gradient(top, #f2d490, #ac8b4d);
background: linear-gradient(to bottom, #f2d490, #ac8b4d);
    color: #fff;
	font-size: 1.3em;
	font-weight: bold;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
/* BOX TITRE 5 */
.model_box_titre_mini_5 {
    line-height: 26px;
	text-align: center;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    -webkit-box-shadow: 0px 0px 2px 2px #795548;
            box-shadow: 0px 0px 2px 2px #795548;
    margin-bottom: 5px;
background: #f0e858; /* Fallback */
background: -webkit-gradient(linear, left top, left bottom, from(#f0e858), to(#857d0c));
background: -webkit-linear-gradient(top, #f0e858, #857d0c);
background: -o-linear-gradient(top, #f0e858, #857d0c);
background: linear-gradient(to bottom, #f0e858, #857d0c);
    color: #fff;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.model_box_titre_5 {
    line-height: 26px;
	text-align: center;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    -webkit-box-shadow: 0px 0px 2px 2px #795548;
            box-shadow: 0px 0px 2px 2px #795548;
    margin-bottom: 5px;
background: #f0e858; /* Fallback */
background: -webkit-gradient(linear, left top, left bottom, from(#f0e858), to(#857d0c));
background: -webkit-linear-gradient(top, #f0e858, #857d0c);
background: -o-linear-gradient(top, #f0e858, #857d0c);
background: linear-gradient(to bottom, #f0e858, #857d0c);
    color: #fff;
	font-size: 1.3em;
	font-weight: bold;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
/* BOX TITRE 6 */
.model_box_titre_mini_6 {
    line-height: 26px;
	text-align: center;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    -webkit-box-shadow: 0px 0px 2px 2px #795548;
            box-shadow: 0px 0px 2px 2px #795548;
    margin-bottom: 5px;
background: #9c7240; /* Fallback */
background: -webkit-gradient(linear, left top, left bottom, from(#c2a271), color-stop(0%, #fefefe), color-stop(46%, #916b3f), to(#9c7240));
background: -webkit-linear-gradient(top, #c2a271 0%, #fefefe 0%, #916b3f 46%, #9c7240 100%);
background: -o-linear-gradient(top, #c2a271 0%, #fefefe 0%, #916b3f 46%, #9c7240 100%);
background: linear-gradient(180deg, #c2a271 0%, #fefefe 0%, #916b3f 46%, #9c7240 100%);
    color: #fff;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.model_box_titre_6 {
    line-height: 26px;
	text-align: center;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    -webkit-box-shadow: 0px 0px 2px 2px #795548;
            box-shadow: 0px 0px 2px 2px #795548;
    margin-bottom: 5px;
background: #9c7240; /* Fallback */
background: -webkit-gradient(linear, left top, left bottom, from(#c2a271), color-stop(0%, #fefefe), color-stop(46%, #916b3f), to(#9c7240));
background: -webkit-linear-gradient(top, #c2a271 0%, #fefefe 0%, #916b3f 46%, #9c7240 100%);
background: -o-linear-gradient(top, #c2a271 0%, #fefefe 0%, #916b3f 46%, #9c7240 100%);
background: linear-gradient(180deg, #c2a271 0%, #fefefe 0%, #916b3f 46%, #9c7240 100%);
    color: #fff;
	font-size: 1.3em;
	font-weight: bold;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}


/* BOX CONTENEUR 1 */
.model_box_conteneur_1 {
	background: #fbecae;
    margin-left: 3%;
    margin-right: 3%;
}
/* BOX CONTENEUR 2 */
.model_box_conteneur_2 {
	background: #ffffcc;
	margin: 10px;
	-webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    -webkit-box-shadow: 0px 3px 6px #8c8b8b;
    box-shadow: 0px 3px 6px #8c8b8b;
}
/* BOX CONTENEUR 3 */
.model_box_conteneur_3 {
	background: #fff;
	/* width: 133px; */
    width: 140px;
    height: 100%;
	margin: 10px;
    -webkit-box-shadow: 0px 3px 6px #4a4a4a;
	box-shadow: 0px 3px 6px #4a4a4a;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

/* BOX MINI START */
.model_box_mini {
	/*background: #fff;*/
	/* text-align: center; */
width: 133px;
    /*width: 140px;*/
    height: 100%;
	margin: 10px;
    -webkit-box-shadow: 0px 3px 6px #4a4a4a;
	box-shadow: 0px 3px 6px #4a4a4a;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}
.model_box_mini_titre {
	 margin-bottom: 5px;
	line-height: 26px;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
	color: #fff;
	text-shadow: 2px 2px 4px #774200;	
    background: #9c7240; /*FallBack*/
	background: -webkit-gradient(linear, left top, left bottom, from(#ededce),color-stop(38%, #ac7b41),to(#80613e));
    background: -webkit-linear-gradient(top, #ededce 0%,#ac7b41 38%,#80613e 100%);
    background: -o-linear-gradient(top, #ededce 0%,#ac7b41 38%,#80613e 100%);
    background: linear-gradient(to bottom, #ededce 0%,#ac8b4d 38%,#ac7b41 100%);
    -webkit-box-shadow: 0px 0px 2px 2px #795548;
    box-shadow: 0px 0px 2px 2px #795548;	
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.model_box_mini_image {
    height: 100px;
    text-align: center;
}
.model_box_mini_separation {
    margin-left: 5px;
    margin-right: 5px;
    margin-bottom: 5px;
    border: 1px;
    border-style: inset;
}
.model_box_mini_icons {
	text-align: center;
}
.model_box_mini_boutton {
	margin: 5px;
    color: #fff;
    text-align: center;
    line-height: 26px;
    outline: none;
    cursor: pointer;
    background: #ac8b4d;
    background: -webkit-gradient(linear, left top, left bottom, from(#f2d490), to(#ac8b4d));
    background: -webkit-linear-gradient(top, #f2d490, #ac8b4d);
    background: -o-linear-gradient(top, #f2d490, #ac8b4d);
    background: linear-gradient(to bottom, #f2d490, #ac8b4d);
    -webkit-box-shadow: inset 0px 0px 6px #8c8b8b;
	border: inset 1px #ccc;
    /*border-style: inset;*/
    box-shadow: inset 0px 0px 6px #8c8b8b;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
.model_box_mini_boutton:hover {
	background: -webkit-gradient(linear, left bottom, left top, from(#f2d490), to(#ac8b4d));
    background: -webkit-linear-gradient(bottom, #f2d490, #ac8b4d);
    background: -o-linear-gradient(bottom, #f2d490, #ac8b4d);
    background: linear-gradient(to top, #f2d490, #ac8b4d);
}

.model_box_mini_boutton:focus + .model_box_mini_hidepanel {
	opacity:1; 
	visibility: visible;  
	/*height: 91%; */
    /*height: 337px;*/
	height: 356px;
    /* min-height: 100%; */
    /* min-height: auto; */
    /*height: auto;*/
    overflow-x: auto;
	/*transition: all 1s cubic-bezier(0.18, 0.89, 0.32, 1.28);
	will-change: transform, opacity;*/
	transition: height 1s cubic-bezier(0.18, 0.89, 0.32, 1.28);
}
.model_box_mini_hidepanel {
	opacity:0;
	visibility: hidden;  
	height:0px;
	position:fixed;
	left:0;
	right:0;
	bottom:0;
	color: #7c594c;
	background: #ffffcc;
	/*background: -moz-linear-gradient(top, #ffffcc 0%, #ffffed 8%, #ffffcc 39%, #f2ecc4 100%);
	background: -webkit-linear-gradient(top, #ffffcc 0%,#ffffed 8%,#ffffcc 39%,#f2ecc4 100%);
	background: linear-gradient(to bottom, #ffffcc 0%,#ffffed 8%,#ffffcc 39%,#f2ecc4 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffcc', endColorstr='#f2ecc4',GradientType=0 );*/
	box-shadow: 0px 0px 10px 5px #8c8b8b;
    /* box-shadow: inset 0px 6px 10px #8c8b8b; */
	-webkit-border-top-left-radius: 20px;
	-webkit-border-top-right-radius: 20px;
	-moz-border-radius-topleft: 20px;
	-moz-border-radius-topright: 20px;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
	
	/* a voir si améliore perf https://css-tricks.com/almanac/properties/w/will-change/ */ 
	will-change: transform, opacity;
	
	transition: all .5s ease-in-out;
	
	overflow-y: overlay;
}

.model_box_mini_hidepanel_flex_parent {display:flex; flex-flow: row wrap;     
	margin-right: 5px;
    margin-left: 5px; 
}
.model_box_mini_hidepanel_colonne_titre_1 {
	color: #fff;
	font-size: 1.4em; 
	font-weight: bold;
	text-align: center;
	margin-top: 5px;
	margin: 15px;
	/*text-shadow: 2px 2px 4px #2b2929!important;*/
	
/*text-shadow: 2px 2px 4px #dbc189;*/
	
	background: #a7a76d; /*FallBack */
	/*background: -webkit-linear-gradient(45deg,#a58c7c 0,#bfa37b 20%,#ceb48e 51%,#bfa37b 81%,#a58c7c 100%);
	background: -o-linear-gradient(45deg,#a58c7c 0,#bfa37b 20%,#ceb48e 51%,#bfa37b 81%,#a58c7c 100%);
	background: linear-gradient(45deg,#a58c7c 0,#bfa37b 20%,#ceb48e 51%,#bfa37b 81%,#a58c7c 100%);*/
	/* test
	background: linear-gradient(45deg,#ac7f44 0,#ac894b 20%,#c8b686 51%,#ac8a4c 81%,#ac7d42 100%);
	*/
    background: -webkit-gradient(linear, left top, left bottom, from(#ededce),color-stop(38%, #ac8b4d),to(#ac7b41));    
	background: -webkit-linear-gradient(top, #ededce 0%,#ac8b4d 38%,#ac7b41 100%);    
	background: -o-linear-gradient(top, #ededce 0%,#ac8b4d 38%,#ac7b41 100%);    
	background: linear-gradient(to bottom, #ededce 0%,#ac8b4d 38%,#ac7b41 100%);	
    box-shadow: 0 13px 14px #999;
    box-shadow: 2px 3px 6px #4a4a4a;
	/*-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;*/
	-webkit-border-top-left-radius: 15px;
	-webkit-border-top-right-radius: 15px;
	-moz-border-radius-topleft: 15px;
	-moz-border-radius-topright: 15px;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
} 
.model_box_mini_hidepanel_image_responsive_centre {display:block;margin:auto;max-width:100%;}	

.model_box_mini_hidepanel_colonne_1 {columns: 100px 1; flex: auto;}
.model_box_mini_hidepanel_colonne_2 {columns: 100px 2; /*background:#8080ff; text-align: right; */ 
	margin: 5px;
    margin-right: 20px;
    margin-left: 20px;
	font-weight: bold;
	line-height: 24px;
}

/* a voir */
.model_flex_margin_test {
	background: #8080ff;
    margin: 10px;
    margin-top: 0;
    /* max-width: 20%; */
    border-radius: 10px;}
	
.colonne-2-fond-test {
	background: #fbecae;
    margin: 10px;
    border-radius: 15px;}	
/* a voir fin */	

.model_box_mini_hidepanel_any {line-height: 28px;}
/*.flex_auto {flex:auto;}*/
.model_box_mini_hidepanel_ligne_vide_20px {height:20px;}

/* Progress Bars 
https://css-tricks.com/html5-progress-element/
https://stackoverflow.com/questions/33964214/show-a-progress-bars-value-number-like-55-on-the-bar-by-using-css
http://jsfiddle.net/tnJM6/
*/
.progress-bar {
  /*position:relative;*/
}
.progress-bar:after {
  content: attr(value)'%';
  position: absolute;
  top:0;
  left:5px; 
  color:#fff;
  font-weight: bold;
  text-shadow: 1px 1px 2px #000;
  line-height: 20px;
}
progress:not(value) {
	/* Add your styles here. As part of this walkthrough we will focus only on determinate progress bars. */
}
progress[value] {
	-moz-appearance:none; 
    -webkit-appearance:none; 
    appearance:none;
	border: none; 
	width: 100%; height: 20px;
	background:#f5f5f5;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	/*-webkit-box-shadow: 0 2px 4px #8c8b8b inset;
	box-shadow: 0 2px 4px #8c8b8b inset;*/
	color: royalblue; /* for IE background color */
	position: relative;
}
progress[value]::-webkit-progress-bar{
    /*height: 20px;*/
	background:#f5f5f5;
	/*-webkit-box-shadow: 0 2px 4px #8c8b8b inset;
	box-shadow: 0 2px 4px #8c8b8b inset;*/
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;	
}
progress[value]::-webkit-progress-value {
	background: #FFF -webkit-gradient(linear, left top, right top, from(#FF9800), to(#00ffd2));
	background: #FFF -webkit-linear-gradient(left, #FF9800, #00ffd2);
	background: #FFF -o-linear-gradient(left, #FF9800, #00ffd2);
	background: #FFF linear-gradient(to right, #FF9800, #00ffd2);
	/*-webkit-box-shadow: inset 0 -2px 4px #4c4c4c, 0 2px 5px 0px #424242;
	box-shadow: inset 0 -2px 4px #4c4c4c, 0 2px 5px 0px #424242;*/
	height: 20px;
}

progress[value]::-moz-progress-bar {
    height: 19px;
	background:#f5f5f5;
	-webkit-box-shadow: 0 2px 4px #8c8b8b inset;
	box-shadow: 0 2px 4px #8c8b8b inset;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
progress[value]::-moz-progress-value {
	background: #FFF -webkit-gradient(linear, left top, right top, from(#FF9800), to(#00ffd2));
	background: #FFF -webkit-linear-gradient(left, #FF9800, #00ffd2);
	background: #FFF -o-linear-gradient(left, #FF9800, #00ffd2);
	background: #FFF linear-gradient(to right, #FF9800, #00ffd2);
	-webkit-box-shadow: inset 0 -2px 4px #4c4c4c, 0 2px 5px 0px #424242;
	box-shadow: inset 0 -2px 4px #4c4c4c, 0 2px 5px 0px #424242;
	height: 20px;	
}

/* BOX MINI END */


/* MODEL DE BOX TAILLE MOYEN */
.model_box_moyen {
    height: 100%;
	margin: 10px;
    /*-webkit-box-shadow: 0px 3px 6px #4a4a4a;
	box-shadow: 0px 3px 6px #4a4a4a;*/
	-webkit-box-shadow: 0 0px 7px #b1935a;
	box-shadow: 0 0px 7px #b1935a;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}
.model_box_moyen_titre {
	line-height: 26px;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    -webkit-box-shadow: 0px 0px 2px 2px #795548;
    box-shadow: 0px -1px 3px #795548;
    text-shadow: 2px 2px 4px #774200;
    margin-bottom: 5px;
    background: #f2d490;
    background: -webkit-gradient(linear, left top, left bottom, from(#f2d490), to(#ac8b4d));
    background: -webkit-linear-gradient(top, #f2d490, #ac8b4d);
    background: -o-linear-gradient(top, #f2d490, #ac8b4d);
    background: linear-gradient(to bottom, #f2d490, #dcbd7b);
    color: #fff;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}


/* FLEX BOX MODELS */
.flex_line_break {width: 100%;}


/* Modèle de FlexBox combinés avec des colonnes CSS(columns) */
.model_flex_conteneur_colonnes {display:flex; flex-flow:row wrap;}
.model_1_colonne {columns: 100px 1; flex:auto;}
.model_2_colonne {columns: 100px 2;}


/* MODEL SEARCH BOX */
.model_menu_deroulant {
	background:#fff;
    cursor: pointer;
    min-width: 300px;
   max-width: 100%; 
    font-size: 1.2em;
	/* divise en 3 partie
	font-size: 1.3em; */
    padding-left: 10px;
    /* margin-top: 10px; */
    /* box-shadow: 0px 3px 6px #808284; */
    /* box-shadow: inset 0px 0px 6px #4a4a4a; */
    box-shadow: inset 0px 0px 4px #4a4a4a;
    /* border-radius: 10px; */
    outline: none;
    /* border-left: 0; */
}
.model_menu_deroulant_1 {
	background:#fff;
    cursor: pointer;
    /*min-width: 200px;*/
   max-width: 100%; 
    padding-left: 10px;
    /* margin-top: 10px; */
    /* box-shadow: 0px 3px 6px #808284; */
    /* box-shadow: inset 0px 0px 6px #4a4a4a; */
    box-shadow: inset 0px 0px 4px #4a4a4a;
    /* border-radius: 10px; */
    outline: none;
    /* border-left: 0; */
}
.model_2_colonne_test {
    columns: 300px 2;
}
.model_3_colonne_test {
    columns: 300px 3;
}
.search_area_test {
margin: 10px;
    margin-bottom: 0;
    padding: 10px;
    background: #ccc;
    background: #ffffcc;
    border-radius: 10px;
    /* color: white; */
    /* text-shadow: 2px 2px 4px #4a4a4a; */
    box-shadow: 0px 3px 6px #4a4a4a;
    box-shadow: inset 0px 2px 6px #4a4a4a;
    /* font-size: 1.2em; */
}
.model_search_box {
flex: auto;
    /*background: #fbecae;*/
	background: #ffffd7;
    font-weight: bold;
    color: #584122;
    line-height: 25px;
    padding: 5px;
    margin: 5px;
	-webkit-box-shadow: 0 0px 7px #b1935a;
	box-shadow: 0 0px 7px #b1935a;
    /*box-shadow: 0 1px 3px #4a4a4a;*/
    max-width: 300px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
.model_search_box_title {
    line-height: 26px;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    -webkit-box-shadow: 0px 0px 2px 2px #795548;
    box-shadow: 0px -1px 3px #795548;
    text-shadow: 2px 2px 4px #774200;
    margin-bottom: 5px;
    background: #f2d490;
    background: -webkit-gradient(linear, left top, left bottom, from(#f2d490), to(#ac8b4d));
    background: -webkit-linear-gradient(top, #f2d490, #ac8b4d);
    background: -o-linear-gradient(top, #f2d490, #ac8b4d);
    background: linear-gradient(to bottom, #f2d490, #dcbd7b);
    color: #fff;
    /* font-size: 1.3em; */
    /* font-weight: bold; */
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

/* MODEL FENETRE MEMOIRE */

#recherche_avance_fenetre_1 {
display: none;
}

.model_box_titre_4_test {
    line-height: 26px;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    -webkit-box-shadow: 0px 0px 2px 2px #795548;
    box-shadow: 0px -1px 3px #795548;
    text-shadow: 2px 2px 4px #774200;
    margin-bottom: 5px;
    background: #f2d490;
    background: -webkit-gradient(linear, left top, left bottom, from(#f2d490), to(#ac8b4d));
    background: -webkit-linear-gradient(top, #f2d490, #ac8b4d);
    background: -o-linear-gradient(top, #f2d490, #ac8b4d);
    background: linear-gradient(to bottom, #f2d490, #ac8b4d);
    color: #fff;
    font-size: 1.3em;
    font-weight: bold;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
.model_boutton_1_test {
    margin: 5px;
    color: #fff;
	text-shadow: 2px 2px 4px #774200;
    text-align: center;
    line-height: 26px;
    outline: none;
    cursor: pointer;
    border: solid 3px #ac8044;
    border-style: groove;
    background: #ac8b4d;
    background: -webkit-gradient(linear, left top, left bottom, from(#f2d490), to(#ac8b4d));
    background: -webkit-linear-gradient(top, #f2d490, #ac8b4d);
    background: -o-linear-gradient(top, #f2d490, #ac8b4d);
    background: linear-gradient(to bottom, #f2d490, #ac8b4d);
    -webkit-box-shadow: inset 0px 0px 6px #8c8b8b;
    box-shadow: inset 0px 0px 6px #8c8b8b;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
	-webkit-transition: background 0.3s ease-in-out;
-moz-transition: background 0.3s ease-in-out;
-o-transition: background 0.3s ease-in-out;
transition: background 0.3s ease-in-out;  
}
.model_boutton_1_test:hover {
    background: -webkit-gradient(linear, left bottom, left top, from(#f2d490), to(#ac8b4d));
    background: -webkit-linear-gradient(bottom, #f2d490, #ac8b4d);
    background: -o-linear-gradient(bottom, #f2d490, #ac8b4d);
    background: linear-gradient(to top, #f2d490, #ac8b4d);
}



/* MODEL D'ONGLETS TABS */
.tab-btns {
display:inline-flex;
flex-flow:row wrap; 
}

.tab-btns .a_tab_active {
    /* font-weight: bold; */
    /*color: #fff;*/
    /*color: #000;*/
   	
	background: #fff;
	    color: #9f7340;
	/*color: #000;*/
	/*color: #4a4a4a;*/
	font-weight: bold; 
	text-shadow: 0px 1px 3px #af9360;
    /*text-shadow: 1px 2px 2px #e2c482;*/
    font-size: 1.2em;	
	box-shadow: 0px -1px 2px #4a4a4a;
	
	/* ou
	box-shadow: inset 0px 4px 6px #c2a271;
	*/
	
    border: 0;	
    /* border-left: 0; */
    /* border-right: 0; */

    /* border: 3px #b48a54; */
    /* border-style: inset; */
    /* border-bottom: 0; */
    /* border-top: 0; */
    
    /* text-shadow: 2px 2px 4px #774200; */
/*text-shadow: 0px 3px 6px #774200;*/
    
    /* background: linear-gradient(to bottom, #ededce 0%,#ac7b41 38%,#ffffff 100%); */
}

.a_tab {
	flex: auto;	
    padding: 10px;
    background: #cc8;
    background: linear-gradient(to bottom, #ededce 0%,#ac7b41 38%,#80613e 100%);
    /* width: 50px; */
    color: #ffffff;
    text-shadow: 2px 2px 4px #774200;
    text-align: center;
    text-decoration: none;
    /* outline: none; */
    cursor: pointer;
    -webkit-border-top-left-radius: 6px;
    -webkit-border-top-right-radius: 6px;
    -moz-border-radius-topleft: 6px;
    -moz-border-radius-topright: 6px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    /*border: 3px #b48a54;*/
	border: 2px #b48a54;
    border-style: outset;
    border-bottom: 0;
}
.a_tab:hover {
opacity:0.9;
}

.tab-contents {
  padding:10px;
  color:#000;
  background:#fff;
  background: -webkit-linear-gradient(272deg, #ffffff 1%,#ffffcc 28%,#fbecae 79%);
  background: -o-linear-gradient(272deg, #ffffff 1%,#ffffcc 28%,#fbecae 79%);
  background: linear-gradient(178deg, #ffffff 1%,#ffffcc 28%,#fbecae 79%);
     /*border: solid 1px #b6975a; */
    /* border-style: ridge; */
    /* border-top: 0; */
  box-shadow: 0px 1px 3px #4a4a4a;
                       /*height:100%;*/
-webkit-border-top-left-radius: 3px;
-webkit-border-top-right-radius: 3px;
-moz-border-radius-topleft: 3px;
-moz-border-radius-topright: 3px;
border-top-left-radius: 3px;
border-top-right-radius: 3px; 
}



/* MODEL ICON CHECKBOX (SELECTIONABLES) */

input[type=checkbox].hide-checkbox {
  display: none;   
}

.hide-checkbox + label {
  display: inline-block;
  margin-right: 0px!important;
  cursor:pointer;
  padding:10px;
  /*margin: 10px;*/
    margin: auto;
  outline:none;
  box-shadow: 1px 1px 0px 0px #000;
  border-radius: 100%; 
  /*background-color: #ffffcc;*/
  background-color: #fff;
/*color: #fff;*/
  color: #000;
-webkit-transition: background-color 0.3s ease-in-out;
-moz-transition: background-color 0.3s ease-in-out;
-o-transition: background-color 0.3s ease-in-out;
transition: background-color 0.3s ease-in-out;  
  /*object-fit: none;
  object-position: 0 0;*/
  /*width: 16px;
  height: 16px;*/
/*display: block;
float: left;
width: 50px;
padding: 2px 0;*/
/*text-align: center;*/
/*font-family: 'Oswald', sans-serif;*/
}
 
.hide-checkbox:checked + label {
/*display: inline-block;*/
    /*background-color: #e74c3c; */
background-color: #2ecc71;
}

.hide-checkbox + label:hover {
opacity:0.8;
}

.sp-mid-1 {display:inline-block; vertical-align:middle; overflow: hidden;} 




/* BOUTTON 1 */
.model_boutton_1 {
	/*margin: 5px;*/
	margin-left: 1em;
    margin-right: 1em;
	color:#fff;
    text-align: center;
    line-height: 26px;
	outline: none;
    cursor: pointer;
	background: #ac8b4d; /*FallBack*/
	background: -webkit-gradient(linear, left top, left bottom, from(#f2d490), to(#ac8b4d));
	background: -webkit-linear-gradient(top, #f2d490, #ac8b4d);
	background: -o-linear-gradient(top, #f2d490, #ac8b4d);
	background: linear-gradient(to bottom, #f2d490, #ac8b4d);
	-webkit-box-shadow: inset 0px 0px 6px #8c8b8b;
	box-shadow: inset 0px 0px 6px #8c8b8b;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
.model_boutton_1:hover {
	background: -webkit-gradient(linear, left bottom, left top, from(#f2d490), to(#ac8b4d));
	background: -webkit-linear-gradient(bottom, #f2d490, #ac8b4d);
	background: -o-linear-gradient(bottom, #f2d490, #ac8b4d);
	background: linear-gradient(to top, #f2d490, #ac8b4d);
}
/* BOUTTON 2 */
.model_boutton_2 {
	margin: 5px;
	color:#fff;
    text-align: center;
    line-height: 26px;
	outline: none;
    cursor: pointer;
	background: #b5804c; /*FallBack*/
	background: -webkit-gradient(linear, left top, left bottom, from(#f5c391), to(#b5804c));
	background: -webkit-linear-gradient(top, #f5c391, #b5804c);
	background: -o-linear-gradient(top, #f5c391, #b5804c);
	background: linear-gradient(to bottom, #f5c391, #b5804c);
	-webkit-box-shadow: inset 0px 0px 6px #8c8b8b;
	box-shadow: inset 0px 0px 6px #8c8b8b;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
.model_boutton_2:hover {
	background: -webkit-gradient(linear, left bottom, left top, from(#f5c391), to(#b5804c));
	background: -webkit-linear-gradient(bottom, #f5c391, #b5804c);
	background: -o-linear-gradient(bottom, #f5c391, #b5804c);
	background: linear-gradient(to top, #f5c391, #b5804c);
}
/* BOUTTON 3 */
.model_boutton_3 {
	margin: 5px;
	color:#fff;
    text-align: center;
    line-height: 26px;
	outline: none;
    cursor: pointer;
	background: #857d0c; /*FallBack*/
	background: -webkit-gradient(linear, left top, left bottom, from(#f0e858), to(#857d0c));
	background: -webkit-linear-gradient(top, #f0e858, #857d0c);
	background: -o-linear-gradient(top, #f0e858, #857d0c);
	background: linear-gradient(to bottom, #f0e858, #857d0c);
	-webkit-box-shadow: inset 0px 0px 6px #8c8b8b;
	box-shadow: inset 0px 0px 6px #8c8b8b;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
.model_boutton_3:hover {
	background: -webkit-gradient(linear, left bottom, left top, from(#f0e858), to(#857d0c));
	background: -webkit-linear-gradient(bottom, #f0e858, #857d0c);
	background: -o-linear-gradient(bottom, #f0e858, #857d0c);
	background: linear-gradient(to top, #f0e858, #857d0c);
}
/* BOUTTON 4 */
.model_boutton_4 {
	margin: 5px;
	color:#fff;
    text-align: center;
    line-height: 26px;
	outline: none;
    cursor: pointer;
	background: #770000; /*FallBack*/
	background: -webkit-gradient(linear, left top, left bottom, from(#fc0000), to(#770000));
	background: -webkit-linear-gradient(top, #fc0000, #770000);
	background: -o-linear-gradient(top, #fc0000, #770000);
	background: linear-gradient(to bottom, #fc0000, #770000);
	-webkit-box-shadow: inset 0px 0px 6px #8c8b8b;
	box-shadow: inset 0px 0px 6px #8c8b8b;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
.model_boutton_4:hover {
	background: -webkit-gradient(linear, left bottom, left top, from(#fc0000), to(#770000));
	background: -webkit-linear-gradient(bottom, #fc0000, #770000);
	background: -o-linear-gradient(bottom, #fc0000, #770000);
	background: linear-gradient(to top, #fc0000, #770000);
}
/* BOUTTON 5 */
.model_boutton_5 {
	margin: 5px;
	color:#fff;
    text-align: center;
    line-height: 26px;
	outline: none;
    cursor: pointer;
	background: #168400; /*FallBack*/
	background: -webkit-gradient(linear, left top, left bottom, from(#00ff2b), to(#168400));
	background: -webkit-linear-gradient(top, #00ff2b, #168400);
	background: -o-linear-gradient(top, #00ff2b, #168400);
	background: linear-gradient(to bottom, #00ff2b, #168400);
	-webkit-box-shadow: inset 0px 0px 6px #8c8b8b;
	box-shadow: inset 0px 0px 6px #8c8b8b;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
.model_boutton_5:hover {
	background: -webkit-gradient(linear, left bottom, left top, from(#00ff2b), to(#168400));
	background: -webkit-linear-gradient(bottom, #00ff2b, #168400);
	background: -o-linear-gradient(bottom, #00ff2b, #168400);
	background: linear-gradient(to top, #00ff2b, #168400);
}
/* BOUTTON 6 SANS CENTER NI MARGIN ET AJOUT BORDURES */
.model_boutton_6 {
	
	border: solid 4px #be9e5e;
    border-style: outset;
	
	color:#fff;
    line-height: 26px;
	outline: none;
    cursor: pointer;
	background: #168400; /*FallBack*/
	background: -webkit-gradient(linear, left top, left bottom, from(#cede9f), to(#92a65a));
	background: -webkit-linear-gradient(top, #cede9f, #92a65a);
	background: -o-linear-gradient(top, #cede9f, #92a65a);
	background: linear-gradient(to bottom, #cede9f, #92a65a);
	-webkit-box-shadow: inset 0px 0px 6px #8c8b8b;
	box-shadow: inset 0px 0px 6px #8c8b8b;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
.model_boutton_6:hover {
	background: -webkit-linear-gradient(286deg, #cede9f, #92a65a);
	background: -o-linear-gradient(286deg, #cede9f, #92a65a);
	background: linear-gradient(164deg, #cede9f, #92a65a);
}
/* BOUTTON TEST */
.model_boutton_test {
	margin: 5px;
	color:#fff;
    text-align: center;
    line-height: 26px;
	outline: none;
    cursor: pointer;
	background: #ac8b4d; /*FallBack*/
	background: -webkit-gradient(linear, left top, left bottom, from(#f2d490), to(#ac8b4d));
	background: -webkit-linear-gradient(top, #f2d490, #ac8b4d);
	background: -o-linear-gradient(top, #f2d490, #ac8b4d);
	background: linear-gradient(to bottom, #f2d490, #ac8b4d);
	-webkit-box-shadow: inset 0px 0px 6px #8c8b8b;
	box-shadow: inset 0px 0px 6px #8c8b8b;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	/* added */
	text-shadow: 2px 2px 4px #000000;
	border: 2px #857d0c;
    border-style: inset;
}
.model_boutton_test:hover {
	background: -webkit-gradient(linear, left bottom, left top, from(#f2d490), to(#ac8b4d));
	background: -webkit-linear-gradient(bottom, #f2d490, #ac8b4d);
	background: -o-linear-gradient(bottom, #f2d490, #ac8b4d);
	background: linear-gradient(to top, #f2d490, #ac8b4d);
	/* added */
	text-shadow: 0px 0px 4px #000000;
	box-shadow: 0px 2px 4px #8c8b8b;
    border: 2px #857d0c;
    border-style: outset;
}






/* ///////////// DEMO ///////////// */
.demo-box-0{  
/*display: inline-block; */
	color: #fff;
    margin: 15px;
    padding: 10px;
    background: #2d2d2d;
    border-radius: 10px;
    border: solid;
	}
.demo-box-1{  
	display: inline-block;
    margin: 5px;
    padding: 5px;
    color: #000;
	}
.demo-box-2 {
    display: block;
    max-width: 500px;
    margin: 5px;
    padding: 5px;
    color: #000;
    font-weight: bold;
	}
.demo-box-url {
    display: inline-block;
    margin: 15px;
    padding: 20px;
    background: #4a4a4a; 
    border-radius: 10px;
    border: solid;
	}	
.demo-box-url  h2, h3 {margin:0;}		
.demo-box-url a {
	color: #39f;
    text-decoration: none;
    margin-left: 10px;
    font-size: 1.3em;
	}	
.demo-box-url a:hover{color: #00b4ff;}	

.demo-box-3 {
    display: block;
    max-width: 500px;
    margin: 5px;
    padding: 5px;
    /* color: #000; */
    /* font-weight: bold; */
}
.demo-box-4-mini {
    display: block;
    max-width: 250px;
    margin: 5px;
    padding: 15px;
    color: #000;
    font-weight: bold;
}
.demo-box-4 {
    display: block;
    max-width: 500px;
    margin: 5px;
    padding: 15px;
    color: #000;
    font-weight: bold;
}

/* Couleurs de fond de démo */
.demo-box-fond1 {background:#2cb6d3;}
.demo-box-fond2{background: #ffb0b0;}
.demo-box-fond3 {background:#8080ff;}

.demo-box-responsive_1 {
    display: block;
    max-width: 100%;
    margin: 5px;
    padding: 5px;
	background:#fff;
    /*color: #000;
    font-weight: bold;*/
}
.demo-box-responsive_2 {
    display: block;
    max-width: 50%;
    margin: 5px;
    padding: 5px;
	background:#fff;
}
.demo-box-responsive_3 {
    display: block;
    max-width: 20%;
    margin: 5px;
    padding: 5px;
	background:#fff;
}
.demo-box-responsive_4 {
    display: block;
    max-width: 10%;
    margin: 5px;
    padding: 5px;
	background:#fff;
}

xmp {
	white-space: pre-wrap; /*css3*/
    white-space: moz-pre-wrap; /*firefox*/
    white-space: -pre-wrap; /*opera 4-6*/
    white-space: -o-pre-wrap; /*opera 7*/
    word-wrap: break-word; /*internet explorer*/
	background: black;
    color: #4CAF50;
	max-width: 600px;
    padding: 10px;
    margin: 0;
    border-radius: 5px;
    border: solid 1px #fff;
    border-style: ridge;

}


/* DEMO MESS */
/* div[class^='.off2'], div[class*='.off2'] */
/* > * */
/*.main_container >.off1 * div{*/
/*.main_containerdiv,[class^='.off1'], div[class*='.off1']*/
/* div[class^='.off1'], div[class*='.off1'] div > div{ */
/* div[class^='.off1'], div[class*='.off1']>div{ */
div[class^='.off1'], div[class*='.off1'] * > div{
    -webkit-box-shadow: none!important;
    -moz-box-shadow: none!important;
    box-shadow: none!important;
}
/*div[class^='.off2'], div[class*='.off2']{*/
div[class^='.off2'], div[class*='.off2'] * > div{
    -webkit-text-shadow: none!important;
    -moz-text-shadow: none!important;
    text-shadow: none!important;
}
div[class^='.off3'], div[class*='.off3'] * > div{
    -webkit-border-radius: 0!important;
    -moz-border-radius: 0!important;
    border-radius: 0!important;
}
div[class^='.off4'], div[class*='.off4'] * > div{
/*background: #ededce!important;*/
background: inherit;
color:#000;
}
div[class^='.off5'], div[class*='.off5'] * > div{
display: inherit!important;
}
/*div[class^='.off6'], div[class*='.off6'] * > div{*/
*[class*='.off6'] div {
/*border: inherit;*/
border:none!important;
}
/*
.on1 {
    background: #ccc; 
    width: 200px;
    height: 20px;
    margin: 10px; 
    padding:5px;
    border: solid 1px #000;
    -webkit-box-shadow: 0px 3px 6px #4a4a4a;
    box-shadow: 0px 3px 6px #4a4a4a;
      transition: all .5s ease-in-out;
} 
.on2 {
    background: #ccc; 
    width: 200px;
    height: 20px;
    margin: 10px; 
    padding:5px;
    border: solid 1px #000;
    color: #fff;
    text-shadow: 2px 2px 4px #000;
    transition: all .5s ease-in-out;
} 
.on3 {
    background: #ccc; 
    width: 200px;
    height: 20px;
    margin: 10px; 
    padding:5px;
    border: solid 1px #000;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    transition: all .5s ease-in-out;
} 
.on4 {
    background: #ccc; 
    width: 200px;
    height: 20px;
    margin: 10px; 
    padding:5px;
    border: solid 1px #000;
    background: #ededce;
    background: -webkit-gradient(linear, left top, left bottom, from(#ededce),color-stop(38%, #ac7b41),to(#80613e));
    background: -webkit-linear-gradient(top, #ededce 0%,#ac7b41 38%,#80613e 100%);
    background: -o-linear-gradient(top, #ededce 0%,#ac7b41 38%,#80613e 100%);
    background: linear-gradient(to bottom, #ededce 0%,#ac7b41 38%,#80613e 100%);
    transition: all .5s ease-in-out;
} 
.on5 {
  display:flex;
  flex-flow: row wrap;
    background: #cc1; 
    width: 200px;
    height: 20px;
    margin: 10px; 
    padding:5px;
    border: solid 1px #000;
    transition: all .5s ease-in-out;
} 
.on6 {
    border: 1px solid white;
    width: 200px;
    height: 20px;
    margin: 10px; 
    padding:5px;
    transition: all .5s ease-in-out;
} 
*/
a {
  /*color: #fff;*/
}

.btn {
  /*padding: 40px 30px 30px 30px;*/
  padding:5px;
  margin: 0 1px 0 0;
  text-decoration: none;
  text-align: center;
  color: #7f8c8d;
  cursor: pointer;
  background: #2c3e50;
  border-bottom: 10px solid #34495e;
  transition-property: border-bottom .5s linear 0s;
  -moz-transition: border-bottom .5s linear 0s;
  -webkit-transition: border-bottom .5s linear 0s;
  -o-transition: border-bottom .5s linear 0s;
  font-size: 1em;
}

.btn:hover {
  /*border-bottom: 10px solid #2ecc71;*/
  color: #2ecc71;
}

.btn.active {
  border-bottom: 10px solid #2ecc71;
  color: #2ecc71;
}

.admin-but {
  /*display:block;
  height:30px;
  width:100px;
  background:pink;
  cursor:pointer;*/
}
.admin-hide {
  /*display:none!important;*/
  opacity:0;
  position:fixed; 
  top:-100px;
  left:0;
  /*padding:5px;*/
  border: solid 2px #fff;
  border-style:inset;
  border-top:0;
  /*background: #2d2d2d;*/
  /*background: #464343;*/
  background: #607D8B;
  /*-webkit-border-bottom-right-radius: 10px;
  -moz-border-radius-bottomright: 10px;
  border-bottom-right-radius: 10px;*/
  /*transition: all .5s ease-in-out;*/
  transition: all .5s ease-in;
}
.admin-show {
  /*display:block;*/
  opacity:1;
  top:0; 
}



.button-group-navigation li {
  display: inline-block;
  list-style: none;
  padding: 0;
  margin: 0;
  zoom: 1;
  background: #7f8c8d;
}

.button-group-navigation li .btn {
  float: left;
  margin-left: -4px;
}

.button-group-navigation>.btn:first-child,
.button-group-navigation li:first-child .btn {
  margin-left: 0;
  -webkit-border-top-left-radius: 3px;
  -webkit-border-bottom-left-radius: 3px;
  -moz-border-radius-topleft: 3px;
  -moz-border-radius-bottomleft: 3px;
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
}

.button-group-navigation>.btn:last-child,
.button-group-navigation li:last-child>.btn {
  margin-right: 0;
  -webkit-border-top-right-radius: 3px;
  -webkit-border-bottom-right-radius: 3px;
  -moz-border-radius-topright: 3px;
  -moz-border-radius-bottomright: 3px;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}

.push_button {
	position: relative;
	width:220px;
	height:40px;
	text-align:center;
	color:#FFF;
	text-decoration:none;
	line-height:43px;
	font-family:'Oswald', Helvetica;
	display: block;
	margin: 30px;
}
.push_button:before {
	background:#f0f0f0;
	background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#D0D0D0), to(#f0f0f0));
	
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	
	-webkit-box-shadow:0 1px 2px rgba(0, 0, 0, .5) inset, 0 1px 0 #FFF; 
	-moz-box-shadow:0 1px 2px rgba(0, 0, 0, .5) inset, 0 1px 0 #FFF; 
	box-shadow:0 1px 2px rgba(0, 0, 0, .5) inset, 0 1px 0 #FFF;
	
	position: absolute;
	content: "";
	left: -6px; right: -6px;
	top: -6px; bottom: -10px;
	z-index: -1;
}

.push_button:active {
	-webkit-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset;
	top:5px;
}
.push_button:active:before{
	top: -11px;
	bottom: -5px;
	content: "";
}

.red {
	text-shadow:-1px -1px 0 #A84155;
	background: #D25068;
	border:1px solid #D25068;
	
	background-image:-webkit-linear-gradient(top, #F66C7B, #D25068);
	background-image:-moz-linear-gradient(top, #F66C7B, #D25068);
	background-image:-ms-linear-gradient(top, #F66C7B, #D25068);
	background-image:-o-linear-gradient(top, #F66C7B, #D25068);
	background-image:linear-gradient(to bottom, #F66C7B, #D25068);
	
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	
	-webkit-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #AD4257, 0 4px 2px rgba(0, 0, 0, .5);
	-moz-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #AD4257, 0 4px 2px rgba(0, 0, 0, .5);
	box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #AD4257, 0 4px 2px rgba(0, 0, 0, .5);
}

.red:hover {
	background: #F66C7B;
	background-image:-webkit-linear-gradient(top, #D25068, #F66C7B);
	background-image:-moz-linear-gradient(top, #D25068, #F66C7B);
	background-image:-ms-linear-gradient(top, #D25068, #F66C7B);
	background-image:-o-linear-gradient(top, #D25068, #F66C7B);
	background-image:linear-gradient(top, #D25068, #F66C7B);
}

.blue {
	text-shadow:-1px -1px 0 #2C7982;
	background: #3EACBA;
	border:1px solid #379AA4;
	background-image:-webkit-linear-gradient(top, #48C6D4, #3EACBA);
	background-image:-moz-linear-gradient(top, #48C6D4, #3EACBA);
	background-image:-ms-linear-gradient(top, #48C6D4, #3EACBA);
	background-image:-o-linear-gradient(top, #48C6D4, #3EACBA);
	background-image:linear-gradient(top, #48C6D4, #3EACBA);
	
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	
	-webkit-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #338A94, 0 4px 2px rgba(0, 0, 0, .5);
	-moz-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #338A94, 0 4px 2px rgba(0, 0, 0, .5);
	box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #338A94, 0 4px 2px rgba(0, 0, 0, .5);
}

.blue:hover {
	background: #48C6D4;
	background-image:-webkit-linear-gradient(top, #3EACBA, #48C6D4);
	background-image:-moz-linear-gradient(top, #3EACBA, #48C6D4);
	background-image:-ms-linear-gradient(top, #3EACBA, #48C6D4);
	background-image:-o-linear-gradient(top, #3EACBA, #48C6D4);
	background-image:linear-gradient(top, #3EACBA, #48C6D4);
}	






/* scrollbar */
/*
::-webkit-scrollbar {
    width: 12px;
}
::-webkit-scrollbar-thumb {
    -webkit-border-top-left-radius: 20px;
    -webkit-border-bottom-left-radius: 20px;
    -moz-border-radius-topleft: 20px;
    -moz-border-radius-bottomleft: 20px;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
	background: #ab7a41;
    box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}
::-webkit-scrollbar-thumb:hover {
    background: #bfa37b;
}
::-webkit-scrollbar-track:hover {
    background: white;
}
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px #000;
}
*/
/* SPRITE 1 */
.sp { background: url('../dog3/sprites/sprite-1.png') no-repeat top left;} 		/* Main sprite */
.sp.sp-mid {display:inline-block; vertical-align:middle; overflow: hidden; margin-right: 5px;} 	/* Inline align middle */
.sp.ball-16 { background-position: 0px 0px; width: 16px; height: 16px;  } 
.sp.ball-24 { background-position: -26px 0px; width: 24px; height: 24px;  } 
.sp.ball-32 { background-position: -60px 0px; width: 32px; height: 32px;  } 
.sp.ball-64 { background-position: -102px 0px; width: 64px; height: 64px;  } 
.sp.collar-16 { background-position: -176px 0px; width: 16px; height: 16px;  } 
.sp.collar-24 { background-position: -202px 0px; width: 24px; height: 24px;  } 
.sp.collar-32 { background-position: -236px 0px; width: 32px; height: 32px;  } 
.sp.collar-64 { background-position: -278px 0px; width: 64px; height: 64px;  } 
.sp.family-16 { background-position: -352px 0px; width: 16px; height: 16px;  } 
.sp.family-24 { background-position: -378px 0px; width: 24px; height: 24px;  } 
.sp.family-32 { background-position: -412px 0px; width: 32px; height: 32px;  } 
.sp.family-64 { background-position: -454px 0px; width: 64px; height: 64px;  } 
.sp.pet-shop-16 { background-position: -528px 0px; width: 16px; height: 16px;  } 
.sp.pet-shop-24 { background-position: -554px 0px; width: 24px; height: 24px;  } 
.sp.pet-shop-32 { background-position: -588px 0px; width: 32px; height: 32px;  } 
.sp.pet-shop-64 { background-position: -630px 0px; width: 64px; height: 64px;  }