
/* ------ BASE ------ */

button.Li_no:active, button.Li_no:focus, a.Li_no:active, a.Li_no:focus { outline: none; }
body {
	padding-top: 80px;
	background: #ffffff;
	font-family: 'Roboto', Arial, sans-serif; /*100..900*/
	/*font-family: "Lato", sans-serif;*/
	/*font-family: "Barlow Condensed", Arial, sans-serif;*/ /*300..800*/
	/*font-family: Arial, sans-serif;*/
	}
a:link, a:visited { text-decoration: underline; color: #000000; }
a:hover {  }
.H1_Txt a:link, .H1_Txt a:visited, .H2_Txt a:link, .H2_Txt a:visited, .H3_Txt a:link, .H3_Txt a:visited, .H4_Txt a:link, .H4_Txt a:visited, a.li_base:link, a.li_base:visited { font-weight: 600; text-decoration: none; color: #f55216; border-bottom: solid 1px #ff6b35; transition: all 500ms ease; }
.H1_Txt a:hover, .H2_Txt a:hover, .H3_Txt a:hover, .H4_Txt a:hover, a.li_base:hover { color: #793d37; border-bottom: solid 1px #ff6b35; }

a.li_bas:link, a.li_bas:visited { /*display: inline-block;*/ line-height: 24px; font-weight: 400; text-decoration: none; color: #888888; border-bottom: solid 1px #333333; transition: all 500ms ease; /*margin-bottom: 3px;*/ }
a.li_bas:hover { color: #ff6b35; border-bottom: solid 1px #000000; }
a.li_bas2:link, a.li_bas2:visited { font-weight: 600; text-decoration: none; color: #ff6b35; border-bottom: solid 1px #333333; transition: all 500ms ease; }
a.li_bas2:hover { color: #ff6b00; border-bottom: solid 1px #ff6b35; }
/*.Bas_Imp { font-size: 18px; }*/
.Bas_Imp { color: #ff6b35; font-family: "Barlow Condensed", Arial, sans-serif; font-size: 18px; font-weight: 800; text-transform: uppercase; }
.fa_bas { color: #666666; }
blockquote { border-color: #00c9a8; }

.SNSG { height: 40px; width: 140px; margin: 20px 0 0 0; }
a.li_sns:link, a.li_sns:visited { display: block; float: left; height: 36px; width: 36px; background-color: #111111; color: #666666; border-radius: 6px; font-size: 20px; margin: 0 5px 0 0; text-align: center; line-height: 36px; transition: all 500ms ease; }
a.li_sns:hover { background-color: #ff6b35; color: #ffffff; }

a.li_snsb:link, a.li_snsb:visited { display: block; float: left; height: 70px; width: 70px; margin: 0; padding: 6px; transition: all 500ms ease; }
a.li_snsbp:link, a.li_snsbp:visited { height: 50px; width: 50px; }
a.li_snsb:hover { background-color: #272618; }
a.li_snsb2:hover { background-color: #cc9900; }

/* BT_Top */
#top-link-block.affix-top { position: absolute; /* allows it to "slide" up into view */ bottom: -82px; right: 10px; }
#top-link-block.affix { position: fixed; /* keeps it on the bottom once in view */ bottom: 18px; right: 10px; }
#top-link-block button.BT_Top { border: solid 1px #666666; padding: 8px 11px 6px 11px; background: #111111; color: #888888; border-radius: 6px; text-shadow: none; transition: all 1000ms ease; }
#top-link-block button.BT_Top:hover { border: solid 1px #ffffff; background: #ff6b35; color: #ffffff; text-shadow: 0 1px 3px #000000; }

/* Log */
#top-link-log.affix-top { position: absolute; /* allows it to "slide" up into view */ top: 98px; right: 0; }
#top-link-log.affix { position: fixed; /* keeps it on the bottom once in view */ top: 88px; right: 0; }
#top-link-log { z-index: 200; }
.CS_Log { /*float: right;*/ /*margin-top: 70px;*/ /*padding: 10px;*/ /*background: red;*/ text-align: right; }
.CS_LogI { background: #ff6b35; border: solid 1px #000000; color: #ffffff; font-size: 14px; font-weight: 900; border-right: none; padding: 10px 20px; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; -moz-box-shadow: 3px 3px 3px #333333; -webkit-box-shadow: 3px 3px 3px #333333; box-shadow: 3px 3px 3px #333333; /*font-family: "Barlow Condensed", Arial, sans-serif;*/ text-transform: uppercase; }

.Txt300 { font-weight: 300; } .Txt400 { font-weight: 400; } .Txt700 { font-weight: 700; } .Txt900 { font-weight: 900; }
.ClearB { clear: both; } /* AKA .clearfix */
/*.TotalB { position: relative; }*/ /* Pour Menu spé défile */
.img-recen { margin: 0 auto; }
.DNone { display: none; }

/* POKE
 Jaune : Base : #ffcb05
 Bleu : Base : #316ab2 | foncé : #1d2c5e
 Rouge ligue : #ed1c24 | 
 Gris ligue : #d1d2d4
 */
/* NET
	Bleu || Base : #3f99d6 | + foncé : #2288cc | artisan : #0159a1
	Gris || très clair : #f3f3f3 | clair : #e6e6e6 | foncé : #888888
	Spot palette : bleu foncé : #00669f | bleu très clair: #d3f4ff | marron : #6e3a00
	Cube Palette : vert canard : #007265 (#e6f7f5 #daf5f2) | jaune : #eee8a9
*/
/*
blanc : #edecdc #f6edd9
Vert base : #8CA484
Cube palette base #8CA484 | vert #4f5800 | violet #9999cc
Shades #8ca484 #6b8263 #4b6245 #2e4328 #12260c
Neighbor Palette #8ca484 #838907 #545422 #272618

violet base #9999cc
Spot Palette #9999cc foncé #656696 | clair #efedff | brun #5c4400
________________

Base : #2d1853 | Entre 2 : #968ba7
Spot : #2d1853 #5e4585 #fbeaff #00c9a8
Skip Gradient : #2d1853 #38edd2 #00b49b #007e68
natural : #2d1853 #9c89b3 #2d1853 #fffade
Discreet : #2d1853 #9c89b3 #fef7ff #e8d5b5
Matching : #2d1853 #4b4453 #b0a8b9 #004839 #007a68

Twisted Spot : #ff6b35 #244875 #e0f1ff #677798
Natural : #ff6b35 #b88572 #fff6f0 #ede9d0
Grey Friends : #ff6b35 #55433c #bda69e
Neighbor : #ff6b35 #a2746e #793d37 #301e1b
Discreet : #ff6b35 #b88572 #fff4eb #3a001e

#ff6b35 : 255, 107, 53 | #ffa348 : 255, 163, 72 | #b88572 : 184, 133, 114 | #55433c : 85, 67, 60 | #793d37 : 121, 61, 55 | #301e1b : 48, 30, 27 | #3a001e : 58, 0, 30 | #fff6f0 : 255, 246, 240 |
#ffa348 #ff6b35 #f55216
Site IA #ff6b00 #402a1a #291a0f #542a0c
 */

/* ------ MENU ------ */
.navbar-fixed-top { border-width: 0; }
.navbar_act { /*border-bottom: solid 2px #000000;*/ background: #ffffff; /*background-image: linear-gradient(-225deg, #ffffff 80%, #ff6b35 80%);*/ }
/*.navbar_act:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 80px; background-image: linear-gradient(-225deg, transparent 80%, #ff6b35 80%); z-index: 0; }*/
.navbar_cont { /*background-image: linear-gradient(-235deg, #ffffff 87%, #ff6b35 89%);*/ }
a.navbar_logo:link, a.navbar_logo:visited { height: 80px; line-height: 80px; padding: 0; margin: 0; text-decoration: none; /*text-transform: uppercase;*/ font-weight: 500; color: #ffffff; font-family: "Barlow Condensed", Arial, sans-serif; font-size: 32px; text-shadow: none; transition: all 500ms ease; }
a.navbar_logo:hover { color: #efedff; }
a.navbar_logo img { float: left; height: 40px; margin: 20px 10px 20px 0; color: #ffffff; }
a.navbar_logo img:hover { color: #efedff; }
a.navbar_logo span.navbar_logoT { float: left; color: #000000; font-family: "Barlow Condensed", Arial, sans-serif; font-size: 22px; font-weight: 700; text-transform: uppercase; }
.navbar-default .navbar-brand:hover { color: #efedff; }

.navbar_nav { margin: 14px 0 0 0; }
.navbar_act ul.nav { /*width: 850px;*/ /*margin: 25px 0 0 0;*/ }
.navbar_act ul.nav li a { padding: 12px 10px; margin: 3px 0; font-family: "Barlow Condensed", Arial, sans-serif; line-height: 20px; font-size: 18px; color: #000000; /*background: #dddddd;*/ text-decoration: none; text-shadow: none; text-transform: uppercase; transition: all 500ms ease; font-weight: 600; letter-spacing: 0.5px; }
.navbar_act ul.nav li a:hover { color: #793d37; /*background: #eeeeee;*/ }
.navbar_act ul.nav li.menu_cat a { padding: 5px 10px; line-height: 15px; }
.navbar_act ul.nav li.active a { /*color: #b88572;*/ }
.navbar_act ul.nav li.active a, .navbar_act ul.nav li.active a:hover, .navbar_act ul.nav li.active a:focus { background: #000000;background-image: linear-gradient(-45deg, #cccccc 0%, #333333 100%); color: #ffffff; border-radius: 6px; /*background-image: linear-gradient(-225deg, #ff6b35 10%, #ffffff 10%, #ffffff 90%, #ff6b35 90%);*/ -webkit-box-shadow: none; box-shadow: none; }

.navbar_act ul.nav li span.MenuSep { display: block; width: 60px; height: 50px; /*background-color: #656696;*/ }

.navbar-default .navbar-toggle { border-color: #ffffff; background-color: #ff6b35; }
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus { border-color: #ff6b35; background-color: #ffa348; }
.navbar-default .navbar-toggle .icon-bar { background-color: #ffffff; }
.navbar-default .navbar-toggle:hover .icon-bar { background-color: #ff6b35; }
.navbar-toggle { margin-top: 22px; }

.navbar_check { display: block; position: absolute; right: 0; bottom: 7px; }

.link-71 { text-decoration: none; position: relative; transition: 0.4s; }
.link-71::before { content: ""; position: absolute; width: 0; height: 4px; bottom: 0; left: 50%; background-color: #ff6b35; transition: all 0.4s; }
.link-71:hover::before { width: 100%; left: 0; }


/*.link-71 { text-decoration: none; transition: 0.4s; position: relative; }
.link-71::before { content: ""; position: absolute; width: 0; height: 4px; background-color: #00c9a8; bottom: 0; left: 0; transition: width 0.4s; }
.link-71:hover::before { width: 100%; }*/
/*
.link-71 { color: #ffffff; font-size: 20px; text-decoration: none; padding: 10px 20px; margin: 0 5px; position: relative; display: inline-block; }
.link-71::before, .link-71::after { content: ""; position: absolute; display: block; border: 0px solid transparent; width: 0%; height: 0%; transition: all 0.3s ease; }
.link-71::after { top: 0; left: 0; border-top: 2px solid transparent; border-left: 2px solid transparent; }
.link-71::before { right: 0; bottom: 0; border-bottom: 2px solid transparent; border-right: 2px solid transparent; }
.link-71:hover::before, .link-71:hover::after { width: 10px; height: 10px; border-color: #00c9a8; }


*/
.fade-effect{
    visibility: hidden;

    &:not(.fade-effect-actived) {
        transition: none;
    }
}

@keyframes fade{
    0%{
        opacity: 0;
        visibility: hidden;
        transform: scale(0);
    }
    100%{
        opacity: 1;
        visibility: visible;
        transform: scale(1);
    }
}
@keyframes fade-top-active{
    0%{
        transform: translateY(-10%);
        opacity: 0;
    }
    100%{
        transform: translateY(0%);
        opacity: 1;
    }
}
@keyframes fade-right-active{
    0%{
        transform: translateX(10%);
        opacity: 0;
    }
    100%{
        transform: translateX(0%);
        opacity: 1;
    }
}
@keyframes fade-bottom-active{
    0%{
        transform: translateY(10%);
        opacity: 0;
    }
    100%{
        transform: translateY(0%);
        opacity: 1;
    }
}
@keyframes fade-left-active{
    0%{
        transform: translateX(-10%);
        opacity: 0;
    }
    100%{
        transform: translateX(0%);
        opacity: 1;
    }
}
