
header .navbar {margin-bottom: 0; }

.brand-left { padding: 20px 10px;}
.brand-left p { margin: 0; font-weight: bold; font-size:12px; }
.brand-left img {width: 50px;}


.brand-right {padding: 20px 10px;}
.brand-right ul{list-style-type: none; padding-left: 0}
.brand-right ul li{display: block;float: left;padding-left: 10px}
.brand-right ul li .img-poste{width: 65px}
.brand-right ul li .img-ems{width: 180px}

.title {font-size: 76px; font-family: "Baloo"; text-transform: uppercase; line-height: 1.2; text-align: center; margin: 0;}
.title-subtitle {text-align: center !important; color: #0356ec; font-size: 20px; font-family: "Myriad Pro", serif; line-height: 1.2; text-align: left; text-shadow: 0 1px 0 rgba(34, 31, 32, 0.7); margin-top: -15px; }


/* CAROUSSEL */
.caroussel-body {border-top: 4px solid #f5e438;border-bottom: 3px solid #f5e438;}
.carousel-caption { right: 20%; left: 20%; top: 30%; }
.carousel-control .glyphicon-chevron-right, .carousel-control .icon-next { color: yellow; background-color: #323232; border-radius: 3px; }
.carousel-control .glyphicon-chevron-left, .carousel-control .icon-next { color: yellow; background-color: #323232; border-radius: 3px; }


/* MENU */
.menu {border-top: 4px solid #323232;}
.menu .navbar .container-fluid {padding-left: 10%; padding-right: 10%;}
.menu .navbar .navbar-toggle { border-color: #ddd; background-color: #323232;}
.menu .navbar .navbar-toggle .icon-bar {background: #fff;}
.menu .navbar ul { /*display: flex;justify-content: center;*/}
.menu .navbar ul li { width: 250px;background-color: #323232;margin: -5px 10px 0 10px;text-align: center;}
.menu .navbar ul li a {color: #fff;font-size: 1.8rem;}
.menu .navbar ul li.active {border-bottom: 4px solid #f5e438;background-color: #323232;}
.menu .navbar ul li.active a{border-bottom: 4px solid #f5e438;background-color: #323232;}
.menu .navbar ul li a:hover {color: #f5e438;background-color: #323232;}


/* CONTENT MAIN */
.main{}

.main-left{margin-top: 10px;}
.main-left .senegal{margin-top: 50px; margin-bottom: 50px;}
.main-left div.media-body-top{vertical-align: bottom;font-weight: bold;}
.main-left .main-item{margin: 20px 0 20px 35px}
.main-left .main-item .main-item-body{margin-bottom: 50px;}
.main-left .main-item .media{background-color: #fefce1;}
.main-left .main-item .media .media-heading{padding: 5px 0;font-size: 22px; color: #0356ec;}
.main-left .main-item .media .media-heading a{text-decoration: none;}
.main-left .main-item p{padding: 10px 0;font-size: 18px;}

.main-right{margin-top: 10px;}
.main-right div.media-body-top{vertical-align: bottom;}
.main-right .main-item{margin: 20px 0 20px 35px}
.main-right .main-item .main-item-body{margin-bottom: 50px;}
.main-right .main-item .media{background-color: #fefce1;}
.main-right .main-item .media .media-heading{padding: 5px 0;font-size: 22px; color: #0356ec;}
.main-right .main-item .media .media-heading a{text-decoration: none;}
.main-right .main-item p{padding: 10px 0;font-size: 18px;}



/* COLOR LINE */
.media-body .color-line .green {border-top: 3px solid green;}
.media-body .color-line .yellow {border-top: 3px solid yellow;}
.media-body .color-line .red {border-top: 3px solid red;}

/* HELP */
#help { border-top: 4px solid #f5e438;  padding-top: 30px;}
.help {margin-bottom: 50px;}
.help .video iframe {border: 1px solid #323232;margin-top: 50px;}


/* FOOTER */
.footer {background-color: #323232;border-top: 4px solid #f5e438; border-bottom: 5px solid #f5e438;padding: 30px;}
.footer img {width: 280px;margin-bottom: 30px;}
.footer .copy {color: #ffffff;font-weight: bold;font-size: 16px;}

/* MEDIA QUERIES */
/* On screens that are 992px or less, set the background color to blue */
@media screen and (max-width: 1200px) {
    .brand-right ul li .img-poste{width: 50px}
    .brand-right ul li .img-ems{width: 150px}
    .menu .navbar ul li { width: 220px;background-color: #323232;margin: -5px 10px 0 10px;text-align: center;}
}

/* On screens that are 992px or less, set the background color to blue */
@media screen and (max-width: 992px) {
    .brand-right ul li .img-poste{width: 100%;margin-top: 25px;}
    .brand-right ul li .img-ems{width: 100%}
    .brand-right ul{display: flex;justify-content: center;}
    .caroussel-body .carousel-caption h3 {font-size: 15px;}
    .menu .navbar .container-fluid {padding-left: 0; padding-right: 0;}
    .menu .navbar ul li { width: 200px;background-color: #323232;margin: -5px 10px 0 10px;text-align: center;}
    .menu .navbar ul li a {color: #fff;font-size: 1.6rem;}
}


/* On screens that are 768px or less, set the background color to olive */
@media screen and (max-width: 768px) {
    .carousel-caption {right: 20%;left: 20%;top: 20%;}
    .menu .navbar ul li { width: auto;border-bottom: 1px solid #f5e438;}
}


/* On screens that are 600px or less, set the background color to olive */
@media screen and (max-width: 600px) {
    .carousel-caption {right: 20%;left: 20%;top: 5%;}
    .main-left .main-item .media .media-heading {font-size: 18px; }
    .main-right .main-item .media .media-heading {font-size: 18px; }
}

/* On screens that are 480px or less, set the background color to olive */
@media screen and (max-width: 480px) {
    .carousel-caption {right: 20%; left: 20%; top: -20%;}
    .title {font-size: 55px;}
    .caroussel-body .carousel-caption h3 {font-size: 10px;}
    .main div.media-body-top h3{font-size: 16px;}
    .help .video iframe {width: 300px; height: 180px; }
}
