:root {
    --timeline-color: #2d353c;
	--timeline-text-color: #3d4c5a;
	--event-color: #FFFFFF;
	
	--bd-purple: #4c0bce;
	--bd-violet: #712cf9;
	--bd-accent: #ffe484;
	--bd-violet-rgb: 233,233,233;
	--bd-accent-rgb: 255,228,132;
	--bd-pink-rgb: 214,51,132;
	--bd-teal-rgb: 32,201,151;
	--docsearch-primary-color: var(--bd-violet);
	--docsearch-logo-color: var(--bd-violet);
	
	--avifit-event-color: #FFFFFF;
	--external-event-color: rgba(244, 240, 237, 1);
	--club-event-color: rgba(244, 240, 237, 1);
	--aviron-loisir-event-color-left: rgba(220,220,220,0.8);
	--aviron-loisir-event-color-right: rgba(220,220,220,0.08);
	--tank-a-ramer-event-color: rgba(220,220,220,0.8);
	--comite-event-color: grey;
	--organisation-event-color: orange;
}

body{
	min-height: 100vh;

	/* https://mdbootstrap.com/docs/standard/tools/design/gradients/ */
    /* fallback for old browsers */
    background: #30cfd0;
  
    /* Chrome 10-25, Safari 5.1-6 */
    background: -webkit-linear-gradient(to right, rgba(48,207,208,0.5), rgba(51,8,103,0.5));
  
    /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    background: linear-gradient(to right, rgba(48,207,208,0.5), rgba(51,8,103,0.5))
}

main {
	margin-top: 20px;
}

.bd-navbar {
  padding: .75rem 0;
  background-color: transparent;
  background-image: linear-gradient(to bottom, rgba(106,133,182,1), rgba(186,200,224,0.90));
  box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.15),inset 0 -1px 0 rgba(0,0,0,0.15);
}

.cbp_tmtimeline {
    margin: 0;
    padding: 0;
    list-style: none;
    position: relative
}

.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255,255,255,0.9);
  align-items: center;
  justify-content: center;
  border-radius: 5px;
}

.cbp_tmtimeline:before {
    content: '';
    position: absolute;
    top: -100px;
    bottom: 0;
    width: 5px;
    background: var(--timeline-color);
    left: 20%;
    margin-left: -8px
}

.cbp_tmtimeline>li {
    position: relative
}

.cbp_tmtimeline>li .empty span {
    color: #777
}

.cbp_tmtimeline>li .cbp_tmtime {
    display: block;
    width: 23%;
    padding-right: 70px;
    position: absolute
}

.cbp_tmtimeline>li .cbp_tmtime span {
    display: block;
    color: var(--timeline-text-color);
    text-align: right
}

.cbp_tmtimeline>li .cbp_tmtime span:first-child {
    font-size: 15px;
    font-weight: 700;
}

.cbp_tmtimeline>li .cbp_tmtime span:last-child {
    font-size: 14px;
	font-weight: 400;
}

.cbp_tmtimeline>li .cbp_tmtime span:only-child {
	padding-top: 10px;
}

.cbp_tmtimeline>li .cbp_tmtime span.month {
    font-size: 15px !important;
    text-transform: uppercase;
    font-weight: 700 !important;
    padding-top: 18px;
}

.cbp_tmtimeline>li .cbp_tmlabel {
    margin: 0 0 15px 25%;
    background: var(--event-color);
    border-color: var(--event-color);
    padding: 1.2em;
    position: relative;
    border-radius: 5px
}

.cbp_tmtimeline>li .cbp_tmlabel:after {
    left: -19px;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-right-color: inherit;
    border-width: 10px;
    top: 10px;
}

.secondary-event {
	background-color:rgba(255, 255, 255, 0.4) !important;
	border-color:rgba(255, 255, 255, 0.4)!important;
}

.today-event {
	background-color:rgba(63.1%, 76.9%, 99.2%, 0.4) !important;
	border-color:rgba(63.1%, 76.9%, 99.2%, 0.4) !important;
}

.external-event {
	background-color: var(--external-event-color) !important;
	border-color: var(--external-event-color) !important;
}

.club-event {
	background-color: var(--club-event-color) !important;
	border-color: var(--club-event-color) !important;
}

.avifit-event {
	background-color: var(--avifit-event-color) !important;
	border-color: var(--avifit-event-color) !important;
}

.aviron-loisir-event {
	background: linear-gradient(to right, var(--aviron-loisir-event-color-left), var(--aviron-loisir-event-color-right)) !important;
	border-color: var(--aviron-loisir-event-color-left) !important;
}

.tank-a-ramer-event {
	background-color: var(--tank-a-ramer-event-color) !important;
	border-color: var(--tank-a-ramer-event-color) !important;
}

.comite-event {
	background-color: var(--comite-event-color) !important;
	border-color: var(--comite-event-color) !important;
}

.organisation-event {
	background-color: var(--organisation-event-color) !important;
	border-color: var(--organisation-event-color) !important;
}

.cbp_tmtimeline>li .cbp_tmicon {
    width: 40px;
    height: 40px;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    font-size: 1.4em;
    line-height: 40px;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    color: #fff;
    background: var(--event-color);
    border-radius: 50%;
    box-shadow: 0 0 0 5px var(--timeline-color);
    text-align: center;
    left: 20%;
    top: 0;
    margin: 0 0 0 -25px;
    padding-top: 8px;
}

.cbp_tmtimeline>li .cbp_tmicon:empty {
    width: 20px;
    height: 20px;
    speak: none;
    position: absolute;
    background: var(--event-color);
    border-radius: 50%;
    box-shadow: 0 0 0 5px var(--timeline-color);
    left: 20%;
    top: 0;
    margin: 10px 0 0 -15px
}

.cbp_tmtimeline>li .cbp_tmiconsmonth {
    width: 16px;
    height: 16px;
    speak: none;
    position: absolute;
    background: var(--timeline-color);
    border-radius: 50%;
    left: 20%;
    top: 10px;
    margin: 12px 0 0 -13px
}



@media screen and (max-width: 992px) and (min-width: 768px) {
    .cbp_tmtimeline>li .cbp_tmtime {
        padding-right: 60px
    }
}

@media screen and (max-width: 65.375em) {
    .cbp_tmtimeline>li .cbp_tmtime span:last-child {
        font-size: 12px
    }
}

@media screen and (max-width: 47.2em) {
    .cbp_tmtimeline:before {
        display: none
    }
    .cbp_tmtimeline>li .cbp_tmtime {
        width: 100%;
        position: relative;
        padding: 0 0 20px 0
    }
    .cbp_tmtimeline>li .cbp_tmtime span {
        text-align: left
    }
    .cbp_tmtimeline>li .cbp_tmlabel {
        margin: 0 0 30px 0;
        padding: 1em;
        font-weight: 400;
        font-size: 95%
    }
    .cbp_tmtimeline>li .cbp_tmlabel:after {
        right: auto;
        left: 20px;
        border-right-color: transparent;
        border-bottom-color: inherit;
        top: -19px
    }
    .cbp_tmtimeline>li .cbp_tmicon {
        position: relative;
        float: right;
        left: auto;
        margin: -64px 5px 0 0px
    }
	
	.cbp_tmtimeline>li .cbp_tmicon:empty {
        position: relative;
        float: right;
        left: auto;
        margin: -55px 30px 0 0px;
    }
	
	.cbp_tmtimeline>li .cbp_tmiconsmonth {
       display: none;
    }
}

.bg-green {
    background-color: #50d38a !important;
    color: #fff;
}

.bg-blush {
    background-color: #ff758e !important;
    color: #fff;
}

.bg-orange {
    background-color: #ffc323 !important;
    color: #fff;
}

.bg-info {
    background-color: #2CA8FF !important;
}

.cbp_tmtimeline>li .cbp_tmlabel.month {
    background: var(--event-color) url("./img/april.png") no-repeat center center !important;
	height: 60px;
}

.cbp_tmtimeline>li .cbp_tmlabel.month:after {
	border-right-color: transparent;
	border-bottom-color: transparent;
}