@charset "UTF-8";
/*CSS Espace client*/

/*Tags*/
body { /*background: #dbdcdd; */ }

/*Miscellanous*/
.colored { color: #0d8a2d; }

@media (min-width:320px) {
    .offset_label3, em.dblock.offset_label3 {
        margin-left:0px;
    }
    .offset_em {
        margin-left:20px;
    }
    .controls-row label.radio.span1 {
        width: 40px;
        padding-left: 18px;
        margin-left: 20px;
    }
    form .controls-row span.span1 {
        width: 40px;
    }

    .controls-row select.span2 {
        max-width: 100px;
    }


    .nowrapm {
        white-space: normal;
    }

}
@media (min-width:470px) {
    .nowrapm {
        white-space: nowrap;
    }
    .offset_label3, em.dblock.offset_label3 {
        margin-left:140px;
    }
    .offset_em {
        margin-left:20px;
    }
    .controls-row [class*="span"] + .offsetx2 {
        max-width: 250px;
    }
}
@media (min-width:767px) {


    /*Insert*/
    .insert.insert-client { height: 250px; }
    .insert.insert-client h3 { position: absolute; top: 150px; }
    .insert.insert-client a.btn { position: absolute; bottom: 21px; }

    .offset_label3, em.dblock.offset_label3 {
        margin-left:200px;
    }
}
/*Bar*/
#bar ul li a:hover, #bar ul li.colored a { color: #0d8a2d; }

/*General*/
#container { background: #fff; }
#content { padding-top: 0px; }

/*Header*/
#header .banner { height: 124px; border-bottom: 1px solid #dbdcdd; background: #f5f5f5; }

#header .banner img { height: 103px; margin-left: 20px; margin-top: 10px; border: 1px solid #dbdcdd; }

#header .content h1 a { background: #fff url(/images/client/logo-guide-social-pro.png) no-repeat center top; }

#header .content .card { margin-top: 18px; }
#header .content .card * { margin-top: 0; margin-bottom: 0; }
#header .content .card p { font-size: 15px; font-weight: bold; }
#header .content .card ul { margin-top: 9px; }
#header .content .card ul li a { color: #333; }
#header .content .card ul li.active a { text-decoration: none; cursor: default; color: #0d8a2d; }

/*Content*/
.aside { margin-top: 0px; }

/*Menu*/
.menu li {
    list-style: none;
    text-indent: -12px;
}
.menu li a { color: #999; }
.menu li a:hover { color: #333; }
.menu li.active a, .menu li.active { text-decoration: none; font-weight: bold; cursor: default; }


/*Block*/
.block { margin-bottom: 20px; padding: 20px 10px 20px; background: #f5f5f5; }
.block h3 { font-size: 12px; font-weight: normal; text-transform: uppercase; color: #eb7e09; }
.block ul li a { color: #333; }
.block ul li:before { content: '» '; }


/*Footer*/
#subfooter .container { background: #f5f5f5; }
#subfooter .top { margin-bottom: 0; }
#subfooter .top a { display: block; width: 60px; height: 40px; margin: -40px auto 0; text-indent: -9999px; }

/*Colors*/
.color-1 h3 { color: #0d8a2d; }
.color-2 h3 { color: #01469c; }
.color-3 h3 { color: #eb7e09; }

.color-1 a, .color-1 a:hover, .color-1 .colored { color: #0d8a2d; }
.color-2 a, .color-2 a:hover, .color-2 .colored { color: #01469c; }
.color-3 a, .color-3 a:hover, .color-3 .colored { color: #eb7e09; }
/*
.color-1 select:focus, .color-1 textarea:focus, .color-1 input[type="text"]:focus, .color-1 input[type="password"]:focus, .color-1 input[type="datetime"]:focus, .color-1 input[type="datetime-local"]:focus, .color-1 input[type="date"]:focus, .color-1 input[type="month"]:focus, .color-1 input[type="time"]:focus, .color-1 input[type="week"]:focus, .color-1 input[type="number"]:focus, .color-1 input[type="email"]:focus, .color-1 input[type="url"]:focus, .color-1 input[type="search"]:focus, .color-1 input[type="tel"]:focus, .color-1 input[type="color"]:focus, .color-1 .uneditable-input:focus { border-color: #0d8a2d; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px #0d8a2d; -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px #0d8a2d; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px #0d8a2d; outline: 0; }
.color-2 select:focus, .color-2 textarea:focus, .color-2 input[type="text"]:focus, .color-2 input[type="password"]:focus, .color-2 input[type="datetime"]:focus, .color-2 input[type="datetime-local"]:focus, .color-2 input[type="date"]:focus, .color-2 input[type="month"]:focus, .color-2 input[type="time"]:focus, .color-2 input[type="week"]:focus, .color-2 input[type="number"]:focus, .color-2 input[type="email"]:focus, .color-2 input[type="url"]:focus, .color-2 input[type="search"]:focus, .color-2 input[type="tel"]:focus, .color-2 input[type="color"]:focus, .color-2 .uneditable-input:focus { border-color: #01469c; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px #01469c; -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px #01469c; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px #01469c; outline: 0; }
.color-3 select:focus, .color-3 textarea:focus, .color-3 input[type="text"]:focus, .color-3 input[type="password"]:focus, .color-3 input[type="datetime"]:focus, .color-3 input[type="datetime-local"]:focus, .color-3 input[type="date"]:focus, .color-3 input[type="month"]:focus, .color-3 input[type="time"]:focus, .color-3 input[type="week"]:focus, .color-3 input[type="number"]:focus, .color-3 input[type="email"]:focus, .color-3 input[type="url"]:focus, .color-3 input[type="search"]:focus, .color-3 input[type="tel"]:focus, .color-3 input[type="color"]:focus, .color-3 .uneditable-input:focus { border-color: #eb7e09; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px #eb7e09; -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px #eb7e09; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px #eb7e09; outline: 0; }
*/

.color-1 .icon-colored, .nav-tabs > .active > a > [class^="icon-"], .nav-tabs > .active > a > [class*=" icon-"], .nav-pills > .active > a > [class^="icon-"], .nav-pills > .active > a > [class*=" icon-"], .nav-list > .active > a > [class^="icon-"], .nav-list > .active > a > [class*=" icon-"], .navbar-inverse .nav > .active > a > [class^="icon-"], .navbar-inverse .nav > .active > a > [class*=" icon-"], .dropdown-menu > li > a:hover > [class^="icon-"], .dropdown-menu > li > a:hover > [class*=" icon-"], .dropdown-menu > .active > a > [class^="icon-"], .dropdown-menu > .active > a > [class*=" icon-"] { background-image: url("/plugins/bootstrap/img/glyphicons-halflings-green.png"); }
.color-2 .icon-colored, .nav-tabs > .active > a > [class^="icon-"], .nav-tabs > .active > a > [class*=" icon-"], .nav-pills > .active > a > [class^="icon-"], .nav-pills > .active > a > [class*=" icon-"], .nav-list > .active > a > [class^="icon-"], .nav-list > .active > a > [class*=" icon-"], .navbar-inverse .nav > .active > a > [class^="icon-"], .navbar-inverse .nav > .active > a > [class*=" icon-"], .dropdown-menu > li > a:hover > [class^="icon-"], .dropdown-menu > li > a:hover > [class*=" icon-"], .dropdown-menu > .active > a > [class^="icon-"], .dropdown-menu > .active > a > [class*=" icon-"] { background-image: url("/plugins/bootstrap/img/glyphicons-halflings-blue.png"); }
.color-3 .icon-colored, .nav-tabs > .active > a > [class^="icon-"], .nav-tabs > .active > a > [class*=" icon-"], .nav-pills > .active > a > [class^="icon-"], .nav-pills > .active > a > [class*=" icon-"], .nav-list > .active > a > [class^="icon-"], .nav-list > .active > a > [class*=" icon-"], .navbar-inverse .nav > .active > a > [class^="icon-"], .navbar-inverse .nav > .active > a > [class*=" icon-"], .dropdown-menu > li > a:hover > [class^="icon-"], .dropdown-menu > li > a:hover > [class*=" icon-"], .dropdown-menu > .active > a > [class^="icon-"], .dropdown-menu > .active > a > [class*=" icon-"] { background-image: url("/plugins/bootstrap/img/glyphicons-halflings-orange.png"); }
.icon-green, .nav-tabs > .active > a > [class^="icon-"], .nav-tabs > .active > a > [class*=" icon-"], .nav-pills > .active > a > [class^="icon-"], .nav-pills > .active > a > [class*=" icon-"], .nav-list > .active > a > [class^="icon-"], .nav-list > .active > a > [class*=" icon-"], .navbar-inverse .nav > .active > a > [class^="icon-"], .navbar-inverse .nav > .active > a > [class*=" icon-"], .dropdown-menu > li > a:hover > [class^="icon-"], .dropdown-menu > li > a:hover > [class*=" icon-"], .dropdown-menu > .active > a > [class^="icon-"], .dropdown-menu > .active > a > [class*=" icon-"] { background-image: url("/plugins/bootstrap/img/glyphicons-halflings-green.png"); }
.icon-red, .nav-tabs > .active > a > [class^="icon-"], .nav-tabs > .active > a > [class*=" icon-"], .nav-pills > .active > a > [class^="icon-"], .nav-pills > .active > a > [class*=" icon-"], .nav-list > .active > a > [class^="icon-"], .nav-list > .active > a > [class*=" icon-"], .navbar-inverse .nav > .active > a > [class^="icon-"], .navbar-inverse .nav > .active > a > [class*=" icon-"], .dropdown-menu > li > a:hover > [class^="icon-"], .dropdown-menu > li > a:hover > [class*=" icon-"], .dropdown-menu > .active > a > [class^="icon-"], .dropdown-menu > .active > a > [class*=" icon-"] { background-image: url("/plugins/bootstrap/img/glyphicons-halflings-red.png"); }

/*
.color-1 .asterisk { color: #0d8a2d; }
.color-2 .asterisk { color: #01469c; }
.color-3 .asterisk { color: #eb7e09; }
*/

/*.color-1 .btn, .color-2 .btn, .color-3 .btn { color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5); } */
.color-1 .btn, .color-2 .btn, .color-3 .btn { color: #fff; }
.color-1 .btn:hover, .color-1 .btn:active, .color-1 .btn.active, .color-2 .btn:hover, .color-2 .btn:active, .color-2 .btn.active, .color-3 .btn:hover, .color-3 .btn:active, .color-3 .btn.active { color: #fff; }
.color-1 .btn.active, .color-2 .btn.active, .color-3 .btn.active { color: rgba(255, 255, 255, 0.75); }
/*
.color-1 .btn { border-color: #067322 #067322 #598900; background: #0d8a2d; background: -moz-linear-gradient(top, #0d8a2d, #067322); -webkit-gradient(linear, 0 0, 0 100%, from(#0d8a2d), to(#067322)); -webkit-linear-gradient(top, #0d8a2d, #067322); -o-linear-gradient(top, #0d8a2d, #067322); linear-gradient(to bottom, #0d8a2d, #067322); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0d8a2d', endColorstr='#067322', GradientType=0); *background-color: #598900; } */
.color-1 .btn:hover, .color-1 .btn:active, .color-1 .btn.active { background-color: #067322; *background-color: #598900; }

.color-1 .btn.disabled, .color-1 .btn[disabled] { background-color: #A0CAA0; *background-color: #A0CAA0; }

/*
.color-2 .btn { border-color: #01397e #01397e #012d66; background: #01469c; background: -moz-linear-gradient(top, #01469c, #01397e); -webkit-gradient(linear, 0 0, 0 100%, from(#01469c), to(#01397e)); -webkit-linear-gradient(top, #01469c, #01397e); -o-linear-gradient(top, #01469c, #01397e); linear-gradient(to bottom, #01469c, #01397e); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#01469c', endColorstr='#01397e', GradientType=0); *background-color: #012d66; } */
.color-2 .btn:hover, .color-2 .btn:active, .color-2 .btn.active, .color-2 .btn.disabled, .color-2 .btn[disabled] { background-color: #01397e; *background-color: #012d66; }
/*
.color-3 .btn { border-color: #cb6500 #cb6500 #ac4c00; background: #eb7e09; background: -moz-linear-gradient(top, #eb7e09, #cb6500); -webkit-gradient(linear, 0 0, 0 100%, from(#eb7e09), to(#cb6500)); -webkit-linear-gradient(top, #eb7e09, #cb6500); -o-linear-gradient(top, #eb7e09, #cb6500); linear-gradient(to bottom, #eb7e09, #cb6500); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eb7e09', endColorstr='#cb6500', GradientType=0); *background-color: #ac4c00; } */
.color-3 .btn:hover, .color-3 .btn:active, .color-3 .btn.active, .color-3 .btn.disabled, .color-3 .btn[disabled] { background-color: #cb6500; *background-color: #ac4c00; }
/*
.color-1 .btn-red, .color-2 .btn-red, .color-3 .btn-red { border-color: #9d1921 #9d1921 #7f0010; background: #bc3734; background: -moz-linear-gradient(top, #bc3734, #9d1921); -webkit-gradient(linear, 0 0, 0 100%, from(#bc3734), to(#9d1921)); -webkit-linear-gradient(top, #bc3734, #9d1921); -o-linear-gradient(top, #bc3734, #9d1921); linear-gradient(to bottom, #bc3734, #9d1921); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bc3734', endColorstr='#9d1921', GradientType=0); *background-color: #7f0010; } */
.color-1 .btn-red:hover, .color-1 .btn-red:active, .color-1 .btn-red.active, .color-1 .btn-red.disabled, .color-1 .btn-red[disabled],
.color-2 .btn-red:hover, .color-2 .btn-red:active, .color-2 .btn-red.active, .color-2 .btn-red.disabled, .color-2 .btn-red[disabled],
.color-3 .btn-red:hover, .color-3 .btn-red:active, .color-3 .btn-red.active, .color-3 .btn-red.disabled, .color-3 .btn-red[disabled] { background-color: #9d1921; *background-color: #7f0010; }

.color-1 #bar { border-top-color: #0d8a2d; }
.color-2 #bar { border-top-color: #01469c; }
.color-3 #bar { border-top-color: #eb7e09; }

.color-1 #bar ul li a:hover, .color-1 #bar ul li.colored a { color: #0d8a2d; }
.color-2 #bar ul li a:hover, .color-2 #bar ul li.colored a { color: #01469c; }
.color-3 #bar ul li a:hover, .color-3 #bar ul li.colored a { color: #eb7e09; }

.color-1 #header .banner { background: #f5f5f5 url(/images/client/bg-header-green.png) repeat-y; }
.color-2 #header .banner { background: #f5f5f5 url(/images/client/bg-header-blue.png) repeat-y; }
.color-3 #header .banner { background: #f5f5f5 url(/images/client/bg-header-orange.png) repeat-y; }

.color-1 #header .content .card ul li.active a { color: #0d8a2d; }
.color-2 #header .content .card ul li.active a { color: #01469c; }
.color-3 #header .content .card ul li.active a { color: #eb7e09; }

.pagination a, .back a, .steps a { color: #999; }
.pagination a:hover, .back a:hover, .steps a:hover { color: #333; }
.color-1 .pagination .active, .color-1 .steps .active { color: #0d8a2d; }
.color-2 .pagination .active, .color-2 .steps .active { color: #01469c; }
.color-3 .pagination .active, .color-3 .steps .active { color: #eb7e09; }

.color-1 .menu li.active a { color: #0d8a2d; }
.color-2 .menu li.active a { color: #01469c; }
.color-3 .menu li.active a { color: #eb7e09; }

.color-1 .block ul li.active, .color-1 .block ul li.active a { color: #0d8a2d; }
.color-2 .block ul li.active, .color-2 .block ul li.active a { color: #01469c; }
.color-3 .block ul li.active, .color-3 .block ul li.active a { color: #eb7e09; }

.color-1 #subfooter .container { border-top-color: #0d8a2d; }
.color-2 #subfooter .container { border-top-color: #01469c; }
.color-3 #subfooter .container { border-top-color: #eb7e09; }

.color-1 #subfooter .top a { background: url(/images/client/icn-top-green.png); }
.color-2 #subfooter .top a { background: url(/images/client/icn-top-blue.png); }
.color-3 #subfooter .top a { background: url(/images/client/icn-top-orange.png); }

.color-1 #subfooter ul li { color: #0d8a2d; }
.color-2 #subfooter ul li { color: #01469c; }
.color-3 #subfooter ul li { color: #eb7e09; }

.color-1 #subfooter ul li a:hover, .color-1 #subfooter ul li.colored a { color: #0d8a2d; }
.color-2 #subfooter ul li a:hover, .color-2 #subfooter ul li.colored a { color: #01469c; }
.color-3 #subfooter ul li a:hover, .color-3 #subfooter ul li.colored a { color: #eb7e09; }



/*Colors*/
.color-4 h3 { color: #C03830; }

.color-4 a, .color-4 a:hover, .color-4 .colored { color: #C03830; }
/*
.color-4 select:focus, .color-4 textarea:focus, .color-4 input[type="text"]:focus, .color-4 input[type="password"]:focus, .color-4 input[type="datetime"]:focus, .color-4 input[type="datetime-local"]:focus, .color-4 input[type="date"]:focus, .color-4 input[type="month"]:focus, .color-4 input[type="time"]:focus, .color-4 input[type="week"]:focus, .color-4 input[type="number"]:focus, .color-4 input[type="email"]:focus, .color-4 input[type="url"]:focus, .color-4 input[type="search"]:focus, .color-4 input[type="tel"]:focus, .color-4 input[type="color"]:focus, .color-4 .uneditable-input:focus { border-color: #C03830; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px #C03830; -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px #C03830; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px #C03830; outline: 0; }
*/

.color-4 .icon-colored, .nav-tabs > .active > a > [class^="icon-"], .nav-tabs > .active > a > [class*=" icon-"], .nav-pills > .active > a > [class^="icon-"], .nav-pills > .active > a > [class*=" icon-"], .nav-list > .active > a > [class^="icon-"], .nav-list > .active > a > [class*=" icon-"], .navbar-inverse .nav > .active > a > [class^="icon-"], .navbar-inverse .nav > .active > a > [class*=" icon-"], .dropdown-menu > li > a:hover > [class^="icon-"], .dropdown-menu > li > a:hover > [class*=" icon-"], .dropdown-menu > .active > a > [class^="icon-"], .dropdown-menu > .active > a > [class*=" icon-"] { background-image: url("/plugins/bootstrap/img/glyphicons-halflings-red.png"); }

.color-4 .asterisk { color: #C03830; }

.color-4 .btn { color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.5); }
.color-4 .btn:hover, .color-4 .btn:active, .color-4 .btn.active { color: #fff; }
.color-4 .btn.active { color: rgba(255, 255, 255, 0.75); }
/*
.color-4 .btn { border-color: #7E010A #7E010A #891300; background: #C03830; background: -moz-linear-gradient(top, #C03830, #7E010A); -webkit-gradient(linear, 0 0, 0 100%, from(#C03830), to(#7E010A)); -webkit-linear-gradient(top, #C03830, #7E010A); -o-linear-gradient(top, #C03830, #7E010A); linear-gradient(to bottom, #C03830, #7E010A); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#C03830', endColorstr='#7E010A', GradientType=0); *background-color: #891300; }
.color-4 .btn:hover, .color-4 .btn:active, .color-4 .btn.active, .color-4 .btn.disabled, .color-4 .btn[disabled] { background-color: #7E010A; *background-color: #891300; }

.color-4 .btn-red { border-color: #9d1921 #9d1921 #7f0010; background: #bc3734; background: -moz-linear-gradient(top, #bc3734, #9d1921); -webkit-gradient(linear, 0 0, 0 100%, from(#bc3734), to(#9d1921)); -webkit-linear-gradient(top, #bc3734, #9d1921); -o-linear-gradient(top, #bc3734, #9d1921); linear-gradient(to bottom, #bc3734, #9d1921); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bc3734', endColorstr='#9d1921', GradientType=0); *background-color: #7f0010; }
.color-4 .btn-red:hover, .color-4 .btn-red:active, .color-4 .btn-red.active, .color-4 .btn-red.disabled, .color-4 .btn-red[disabled] { background-color: #9d1921; *background-color: #7f0010; }
*/
.color-4 #bar { border-top-color: #C03830; }

.color-4 #bar ul li a:hover, .color-4 #bar ul li.colored a { color: #C03830; }

.color-4 #header .banner { background: #f5f5f5 url(/images/client/bg-header-red.png) repeat-y; }

.color-4 #header .content .card ul li.active a { color: #C03830; }

.color-4 .pagination .active, .color-4 .steps .active { color: #C03830; }

.color-4 .menu li.active a { color: #C03830; }

.color-4 .block ul li.active, .color-4 .block ul li.active a { color: #C03830; }

.color-4 #subfooter .container { border-top-color: #C03830; }

.color-4 #subfooter .top a { background: url(/images/client/icn-top-red.png); }

.color-4 #subfooter ul li { color: #C03830; }

.color-4 #subfooter ul li a:hover, .color-4 #subfooter ul li.colored a { color: #C03830; }


.color-4 .insert .content h4 {
    color: #C03830;
}





/* NAV_CS */

#nav_cs
{
    width: 100%;
    position: static;
    margin: 0;
}

#nav_cs ul,
#nav_cs ol
{
    list-style: none;
    padding: 0;
    margin: 0 0 10px 0;
}

#nav_cs a:hover, #nav_cs a:focus {
    text-decoration: none;
}

#nav_cs > a
{
    display: none;
}

#nav_cs li
{
    position: relative;
    z-index: 99;
}
#nav_cs li a
{
    color: #fff;
    display: block;
}
#nav_cs li a:active
{
    background-color: #067322 !important;
}

#nav_cs span:after
{
    width: 0;
    height: 0;
    border: 0.313em solid transparent; /* 5 */
    border-bottom: none;
    border-top-color: #c3d994;
    content: '';
    vertical-align: middle;
    display: inline-block;
    position: relative;
    right: -0.313em; /* 5 */
}


/* first level */

#nav_cs > ul
{
    height:40px;
    background-color: #0d8a2d;
}
#nav_cs > ul > li
{
    width: 25%;
    height: 100%;
    float: left;
}
/*
#nav_cs > ul > li.menu-duo
{
    width: 33%;
}
*/

#nav_cs > ul > li > a
{
    height: 50%;
    font-size:15px;
    font-weight: bold;
    text-align: center;
    padding:10px;
}
#nav_cs > ul > li:not( :last-child ) > a
{
    border-right: 1px solid #067322;
}
#nav_cs > ul > li:hover > a,
#nav_cs > ul:not( :hover ) > li.active > a
{
    font-weight: bold;
    background-color: #067322;
}


/* second level */

#nav_cs li ul
{
    background-color: #c3d994;
    display: none;
    position: absolute;
    top: 100%;

}
#nav_cs li:hover ul
{
    display: block;
    left: 0;
    right: 0;
}
#nav_cs li:not( :first-child ):hover ul
{
    left: -1px;
}
#nav_cs li ul li#forum_form_conn
{
    padding:5px;
}
#nav_cs li ul a
{
    font-size:15px;
    font-weight: normal;
    color:#067322;

    border-top: 1px solid #0d8a2d;
    padding: 10px;
}
#nav_cs li ul li a:hover,
#nav_cs li ul:not( :hover ) li.active a
{
    color:#fff;
    background-color: #0d8a2d;
}
@media only screen and ( max-width: 979px ) /* 640 */
{
    #nav_cs > ul > li > a, #nav_cs li ul a
    {
        font-size:13px;
    }

}

@media only screen and ( max-width: 767px ) /* 640 */
{
    #nav_cs
    {
        position: relative;
        z-index: 99;
        top: 0;
        left: 100%;
        width: 0;
    }
    #nav_cs > a
    {

        width: 45px;
        height: 45px;
        text-align: left;
        text-indent: -9999px;
        background-color: #0d8a2d;
        position: relative;
        right: 45px;
    }

    /*
    #nav_cs > a:before,
    #nav_cs > a:after
    {
        position: absolute;
        float:right;
        border: 2px solid #fff;
        top: 35%;
        left: 25%;
        right: 25%;
        content: '';
    }
    */

    #nav_cs > a {
        background-image: url('https://pro.guidesocial.be/images/site/menu.png');
    }
    #nav_cs > a:after
    {
        top: 60%;
    }

    #nav_cs:not( :target ) > a:first-of-type,
    #nav_cs:target > a:last-of-type
    {
        display: block;
    }


    /* first level */

    #nav_cs > ul
    {
        height: auto;
        display: none;
        position: absolute;
        left: -250px;
        right: 0;
        width: 250px;
    }
    #nav_cs:target > ul
    {
        display: block;
    }
    #nav_cs > ul > li, #nav_cs > ul > li.menu-duo
    {
        width: 100%;
        float: none;
    }
    #nav_cs > ul > li > a
    {
        height: auto;
        text-align: left;
        padding: 10px 15px; /* 20 (24) */
    }
    #nav_cs > ul > li:not( :last-child ) > a
    {
        border-right: none;
        border-bottom: 1px solid #067322;
    }


    /* second level */

    #nav_cs li ul
    {
        position: static;
        padding: 0 10px;
        margin:0;
    }

}