/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/


/* 
    Created on : 21 oct. 2019, 13:39:28
    Author     : RKALANDA
*/

:root {
    --blue-1: #0B2641;
    --blue-2: #144372;
    --blue-3: #1F69B3;
    --blue-4: #418FDE;
    --blue-5: #82B5E9;
    --blue-6: #D4E5F7;
    --blue-7: #E9F2FB;
    --orange-1: #42130A;
    --orange-2: #8B2715;
    --orange-3: #CD3A1F;
    --orange-4: #E56A54;
    --orange-5: #EFA497;
    --orange-6: #F8D8D3;
    --orange-7: #FCECE9;
    --gray-1: #262626;
    --gray-2: #4D4D4D;
    --gray-3: #737373;
    --gray-4: #999999;
    --gray-5: #BFBFBF;
    --gray-6: #E6E6E6;
    --gray-7: #F2F2F2;
}

body {
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    margin-bottom: 0px;
    padding-bottom: 0px;
    font-weight: 300;
}

.hr {
    margin: 5px 0px;
    border-bottom: 1px var(--gray-3) dotted;
    background-color: transparent;
}

.font-thin {
    font-weight: 100;
}

.font-light {
    font-weight: 300;
}

.font-bold {
    font-weight: 700;
}

footer {
    margin-top: 100px;
}

input[type="text"],
textarea {
    outline: none;
    box-shadow: none !important;
    border: 1px solid var(--gray-4) !important;
}

.col-form-label,
label {
    font-weight: 500;
}


.form-check-label {
    font-weight: 300;
}

.help-block {
    color: var(--orange-4);
}

.breadcrumb {
    padding: 5px;
    font-size: 14px;
    border-bottom: 1px #c7d6ee solid;
}

.input-group-addon {
    background: #F5F5F5;
    width: 30px;
    border: 1px #CCCCCC solid;
    border-radius: 5px 0px 0px 5px;
    text-align: center;
    margin: auto;
    padding: 6px;
    border-right: none;
    font-family: sans-serif, 'Open Sans';
}

.input-group-addon {
    padding-left: 20px;
    padding-right: 30px;
}


/* Aligne les labels des dates au même niveau que les champs de type input  */

.form-group legend {
    margin-top: 0px;
    padding-top: 0px;
}

.custom-checkbox {
    min-height: 1rem;
    padding-left: 0;
    margin-right: 0;
    cursor: pointer;
}

.custom-checkbox .custom-control-indicator {
    content: "";
    display: inline-block;
    position: relative;
    width: 30px;
    height: 10px;
    background-color: #818181;
    border-radius: 15px;
    margin-right: 10px;
    -webkit-transition: background .3s ease;
    transition: background .3s ease;
    vertical-align: middle;
    margin: 0 16px;
    box-shadow: none;
}

.custom-checkbox .custom-control-indicator:after {
    content: "";
    position: absolute;
    display: inline-block;
    width: 18px;
    height: 18px;
    background-color: #f1f1f1;
    border-radius: 21px;
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4);
    left: -2px;
    top: -4px;
    -webkit-transition: left .3s ease, background .3s ease, box-shadow .1s ease;
    transition: left .3s ease, background .3s ease, box-shadow .1s ease;
}

.custom-checkbox .custom-control-input:checked~.custom-control-indicator {
    background-color: var(--blue-5);
    background-image: none;
    box-shadow: none !important;
}

.custom-checkbox .custom-control-input:checked~.custom-control-indicator:after {
    background-color: var(--primary);
    left: 15px;
}

.custom-checkbox .custom-control-input:focus~.custom-control-indicator {
    box-shadow: none !important;
}

.chosen-container-single .chosen-single {
    height: 37px;
    border-radius: 3px;
    border: 1px solid #CCCCCC;
}

.chosen-container-single .chosen-single span {
    padding: 5px;
}

.chosen-container-single .chosen-single div b {
    margin-top: 2px;
}

.chosen-container-active .chosen-single,
.chosen-container-active.chosen-with-drop .chosen-single {
    border-color: #ccc;
    border-color: rgba(82, 168, 236, .8);
    outline: 0;
    outline: thin dotted \9;
    -moz-box-shadow: 0 0 8px rgba(82, 168, 236, .6);
    box-shadow: 0 0 8px rgba(82, 168, 236, .6)
}

.vich-image img {
    width: 120px;
    height: auto;
    margin-right: 20px;
    margin-top: 20px;
}


body{
  background-color: #f1f1f1;
}
.main-timeline-section{
  position: relative; 
  width: 100%;  
  margin:auto; 
  height:300px;
}
.main-timeline-section .timeline-start,
.main-timeline-section .timeline-end{
  position: absolute;
  background:#F2635F;
  border-radius:100px;
  top:50%;
  transform: translateY(-50%);
  width:30px;
  height:30px;
}
.main-timeline-section .timeline-end{
  right:0px;
}
.main-timeline-section .conference-center-line{
  position: absolute;
  width:100%;
  height:5px;
  top:50%;
  transform: translateY(-50%);
  background:#F2635F;
}
.timeline-article{
    width: 20%;
    position: relative;
    min-height: 300px;
    float:right;
}
.timeline-article .content-date{
    position: absolute;
    top: 35%;
    left: -30px; 
    font-size:18px;
}
.timeline-article .meta-date{
    position: absolute;
    top: 50%;
    left: 0px;
    transform: translateY(-50%); 
    width:20px;
    height:20px;
    border-radius: 100%;
    background:#fff;
    border:1px solid #F2635F;
}
.timeline-article .content-box{
  box-shadow: 2px 2px 4px 0px #c1c1c1;
  border:1px solid #F2635F;
  border-radius: 5px;
  background-color: #fff;
  width: 180px;
  position: absolute;
  top: 60%;
  left: -80px; 
  padding:10px;
}
.timeline-article-top .content-box:before{
  content: " ";
  position:absolute; 
  left:50%;
  transform: translateX(-50%);
  top:-20px;
  border:10px solid transparent;
  border-bottom-color: #F2635F;
}
.timeline-article-bottom .content-date{
  top: 59%;
}
.timeline-article-bottom .content-box{
  top: 0%;
}
.timeline-article-bottom .content-box:before{
  content: " ";
  position:absolute; 
  left:50%;
  transform: translateX(-50%);
  bottom:-20px;
  border:10px solid transparent;
  border-top-color:#F2635F;
}

label.required:after {
    content: " *";
    color: var(--orange-4);
}


@media (max-width:460px){
  body{
    display: none;
  }
}