@import url("./fonts.css");

/****************

HTML BASICS 
NB: les modifs pour les pages de cours (titres, boites dédiées...) sont définies dans le css course.css

*************************************/

html {
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	font-size: 16px;
}

body {
	margin: 0;
	font-family: "Gotham", sans-serif;
	font-size: 1rem;
	line-height: 1.72222;
	font-weight: 400;
	color: #303434;
}

h1, .h1 {
    font-size: 40px;
    line-height: 45px;
    color: #ff867d;
    font-weight: 700;
}

h2, .h2  {
    font-size: 30px;
    line-height: 35px;
    color: #ff867d;
	font-weight: 700;
}

h3, .h3  {
    font-size: 25px;
    line-height: 30px;
    color: #ff867d;
	font-weight: 500;
}

h4, .h4  {
    font-size: 20px;
    line-height: 25px;
    color: #ff867d;
	font-weight: 500;
}

p  {
    font-size: 16px;
    line-height: 26px;
    color: #303434;
}

a{
	color: #ef3d7f;
}

a:hover{
	color : #ff867d;
}

/****************

Les couleurs

*************************************/

.gris_1 {
	color : #f5f5f3;
}
.gris_2 {
	color : #efefe7;
}
.gris_3 {
	color : #deded7;
}
.gris_4 {
	color : #b3b2b2;
}
.gris_5 {
	color : #646363;
}

.violet_1 {
	color : #ff867d;
}
.violet_2 {
	color : #a03189;
}
.violet_3 {
	color : #da4290;
}

.bleu_1 {
	color : #ef3d7f;
}
.bleu_2 {
	color : #1275bb;
}
.bleu_3 {
	color : #28367f;
}
.bleu_4 {
	color : #ff867d;
}

.vert_1 {
	color : #afca0b;
}
.vert_2 {
	color : #009640;
}
.vert_3 {
	color : #009a93;
}

.rouge_1 {
	color : #e50046;
}
.rouge_2 {
	color : #aa1346;
}

.orange_1 {
	color : #f9b000;
}
.orange_2 {
	color : #ef7d00;
}

.bg-gris_1 {
	background-color : #f5f5f3;
}
.bg-gris_2 {
	background-color : #efefe7;
}
.bg-gris_3 {
	background-color : #deded7;
}
.bg-gris_4 {
	background-color : #b3b2b2;
}
.bg-gris_5 {
	background-color : #646363;
}

.bg-violet_1 {
	background-color : #5e2a7e;
}
.bg-violet_2 {
	background-color : #a03189;
}
.bg-violet_3 {
	background-color : #da4290;
}

.bg-bleu_1 {
	background-color : #ef3d7f;
}
.bg-bleu_2 {
	background-color : #1275bb;
}
.bg-bleu_3 {
	background-color : #28367f;
}
.bg-bleu_4 {
	background-color : #ff867d;
}

.bg-vert_1 {
	background-color : #afca0b;
}
.bg-vert_2 {
	background-color : #009640;
}
.bg-vert_3 {
	background-color : #009a93;
}

.bg-rouge_1 {
	background-color : #e50046;
}
.bg-rouge_2 {
	background-color : #aa1346;
}

.bg-orange_1 {
	background-color : #f9b000;
}
.bg-orange_2 {
	background-color : #ef7d00;
}

/****************

HEADER & NAVBAR

*************************************/


.nav li a {
	padding: 15px 10px;
}
.navbar-default {
	background: #ef3d7f;
	border: none;
}

.navbar{
	margin-bottom: 15px;
}
#breadcrumb-bar{
	padding-top: 10px;
	background-color: #fff;
}
.navbar-default .navbar-brand {
  color: #FFF;
}
.navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus {
  color: #ededed;
}
.navbar-default .navbar-text {
  color: #FFF;
}
.navbar-default .navbar-nav > li > a {
  color: #FFF;
  font-size:1.125rem;
}
.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
	color: #FFF;
	background: #ff867d;
}

.dropdown-menu {
	color: #FFF;
}

.navbar-default .navbar-nav > li > .dropdown-menu {
  background: #ef3d7f;
}
.navbar-default .navbar-nav > li > .dropdown-menu > li > a{
  color: #FFF!important;
  padding: 5px;
}
.navbar-default .navbar-nav > li > .dropdown-menu > li{
    border: none;
}
.navbar-default .navbar-nav > li > .dropdown-menu > li > a:hover,
.navbar-default .navbar-nav > li > .dropdown-menu > li > a:focus{
  color: #FFF!important;
  background-color: #ff867d;
}

#login-block > div > ul > li > a {
	padding:0px;
	margin:0px;	
}

.user-header a, .user-header p {
  color: #FFF;
}
.user-header a:hover, .user-header a:focus{
  color: #FFF;
}
.navbar-default .navbar-nav > li > .dropdown-menu > li > .divider {
  background-color: #0099c0;
}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
color: #FFF;
background: #ff867d;
}
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
color: #FFF;
background: #ff867d;
}
.navbar-default .navbar-toggle {
  border-color: #FFF;
}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
  background-color: #ff867d;
}
.navbar-default .navbar-toggle .icon-bar {
  background-color: #FFF;
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
  border-color: #ff867d;
}
.navbar-default .navbar-link {
  color: #FFF;
}
.navbar-default .navbar-link:hover {
  color: #ededed;
}
.badge{
    background-color: #ff867d;
}
@media (max-width: 767px) {
  .navbar-default .navbar-nav .open .dropdown-menu > li > a {
    color: #FFF;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #ededed;
    background-color: #6D0019;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #ededed;
    background-color: #0099c0;
  }
}
.breadcrumb{
	display:none;
  background: #f5f5f3;
  color: #000;
  border-radius: 0px;
}
.nav li a:hover{
    background: transparent;
}

/*

HOMEPAGE
***************************/

#login-block {
	margin-bottom: 0;
}

@media (min-width: 768px) {
	#login-container {
		min-width:100%;
		position:absolute;
		top:0;
		left:0;
	}
	#login-container .col-sm-4 {
		padding-right:0;
		padding-left:30px;
	}
}

/*
USER PORTAL + accessibility
*********************/

.grid-courses .items .category {
	top: 25px;
	right: 0px;
	background-color: #5e2a7e;
	padding: 5px 10px;
    font-size: 18px;
	text-transform: none;
	height: 40px;
	line-height: 1.666;
}

.fa-xs {
    font-size: .6em;
}

.view-options a {
	padding:15px!important;
}

/****************

COURSE HOME INTRO


*************************************/

.c_section {
	padding: 1rem;
    border: 1px solid #b3b2b2;
	border-radius: 1rem;
	margin-bottom: 2rem;
}

.c_section.disabled {
	color:#777;
	opacity: 0.65;
}
	

.c_section_header {
	padding-top: .8rem;
    padding-bottom: .8rem;
}

.c_section_header ul {
	margin-bottom: 0;
}


.c_section_list {
    padding-top: 0;
    padding-bottom: 0;
    margin-top: 0;
    margin-bottom: 0;
}

.c_section_list ul {
	margin-bottom: 0;
}
.c_section_item {
	padding-top: 1.5rem;
	padding-bottom: 1.5rem;
	padding-left: 1.5rem;
	font-size: 1.313rem;
	margin: 0;
}

.c_section_item h3 {
	font-size: 1.313rem;
	margin: 0;
}

.c_section_item small {
	font-size: 75%;
}

.c_section_legend {
	font-size:0.9rem;
	padding-top: .5rem;
}

.c_section_item:hover {
	background-color:#f5f5f3;	
}

.c_section_item_no_hover {
	border:none;
}

.c_section_item_no_hover:hover {
	background-color:#FFF;	
}

.c_section_item.disabled:hover {
	background-color: #f5f5f3;	
}

.c_section_list .disabled,
.c_section_list .disabled:hover {
	cursor: not-allowed;
}
.c_section_list a.disabled,
.c_section_list a.disabled:hover {
	cursor: not-allowed!important;
}

.c_section_item_doc {
    border-bottom: 0;
    padding-top: 1.15rem;
    padding-bottom: 1.15rem;
    padding-left: 1.15rem;
    font-size: 1.2rem;
    margin: 0;
}

.c_section_item_doc:hover {
	background-color:#f5f5f3;	
}

.items-hotcourse.disabled,
.items-hotcourse.disabled:hover {
	cursor: not-allowed;
	opacity: 0.4;
}

a.disabled,
a.disabled:hover {
	cursor: not-allowed!important;
	pointer-events: none;
}


.course-intro .btn-link {
	font-size: inherit;
	padding-left: 0;
}

/****************

FOOTER

*************************************/

footer {
    font-size: 14px;
}
.footer {
	background-color: #e9eeea;
}

footer a, footer a:focus, footer a:hover, footer i, footer h4 {
    color:#303434;
}

footer h4 {
	margin: 2rem 0;
}

/****************
Pannels
********************/

#profile .panel {		
	border-radius: 0px;
	box-shadow: none;
}

#profile.panel-group .panel {
    margin-bottom: 0;
	border-radius: 0px;
}

#profile_block.panel-default>.panel-heading {
    color: #000;
    background-color: transparent;
    border: none;
	font-weight:500;
	font-size: 1.125rem;
	border-radius: 0px;
}

#profile_block.panel-default>.panel-heading+.panel-collapse>.panel-body {
    border: none;
}

#profile_block.panel-default {
    border: none;
}

#user_image_block.panel, #profile .panel {	
	border: none;
	background-color: transparent;
}

#profile.panel-group .panel {
	border: none;
	background-color: transparent;
}

#profile_block .panel-heading {
	display:none;
}

#user_image_block .panel-default, #profile .panel-default {
    border: none;
}

#user_image_block .panel-default .list-group-item, #profile .panel-default .list-group-item {
	background-color: transparent;
}

#user_image_block .panel-default a, .panel-default a:hover, #profile .panel-default a, .panel-default a:hover, #profile h3 {
	color: #303434;
}


/********
SCORM item LP 

*******************/

.actions_lp {
	padding-top:20px;
}

.progress-bar-success {
    background-color: #afca0b;
}

#scorm-info .progress, #scorm-info .progress-bar {
    height: 10px;
	line-height:50px;
}

#scorm-info .progress-text {
    color: #b3b2b2;
	margin-bottom:5px;
}

.image-avatar img {
	/*border-radius:100%!important;
	width:75px!important;*/
	margin:20px auto 40px 0;
}

.media-body, .media-left, .media-right {
    vertical-align: middle;
}

#scorm-info {
	padding: 0px;
	background:#f5f5f3!important;
	border:none;
}

#scorm-info .description-autor p {
    font-size: 1rem;
    line-height: 1.25rem;
    color: #000;
}

#scorm-info h3 {
	font-weight:600;
}

#panel-scorm {
	padding: 20px;
}

#scorm-info hr {
    width: 100%;
    border:none;
    margin:0;
}

#btn-menu-relative {
	background:#f5f5f3!important;
	border:none;
	padding: 0 0 20px 0;
}

#learning_path_toc {
	background:#deded7!important;
	border:none;
}

.icon-toolbar .fa {
    line-height: 32.5px;
    background-color: #FFF;
	border:2px solid #000;
    font-size: 15px;
    color: #000;
}

.icon-toolbar .fa:hover, .icon-toolbar .fa:focus {
    background-color: #FFF;
	color: #000;
	box-shadow : inset 2px 2px 5px rgba(0,0,0,.125);
}

.image-avatar {
	padding:0px;
}

.scorm-title {
	padding: 0px 0px 10px 5px;
	color: #000;
}

.scorm_item_section .section{
	color: #000;
	font-size:1.2rem;
	background:#deded7!important;
	padding:10px 20px;
	border:none;
	border-top:1px solid #FFF;
}

.scorm_item_section .section.level_1{
	padding:10px 20px 10px 40px;
	font-size:1.1rem;
}
.scorm_item_section .section.level_2{
	padding:10px 20px 10px 60px;
	font-size:1.1rem;
}

.scorm_item_normal {
	border:none;
	padding:10px 0px 10px 20px;
}

.level_0 {
	margin: 0px;
	padding:0px;
	padding-left:25px;
}

.level_1 {
	margin: 0px;
	padding:0px;
	padding-left:25px;
}

.level_2 {
	margin: 0px;
	padding:0px;
	padding-left:45px;
}

.level_3 {
	margin: 0px;
	padding:0px;
	padding-left:65px;
}

.scorm_item_normal.scorm_completed, .scorm_item_normal.scorm_failed, .scorm_item_normal.not_attempt {
	background:none;
}

.scorm_item_normal.scorm_highlight {
	background-color:#f5f5f3;
}

.scorm_current .item {
	background: url("./images/puce_bleu.svg") no-repeat 0px center;
	background-size: 16px 16px;
}
.scorm_completed .item {
	background: url("./images/puce_vert.svg") no-repeat 0px center;
	background-size: 16px 16px;
}

.scorm_highlight .item, .scorm_highlight.scorm_completed .item {
	background: url("./images/puce_bleu.svg") no-repeat 0px center;
	background-size: 16px 16px;
}

.scorm_failed .item, .scorm_highlight.scorm_failed .item {
	background: url("./images/puce_orange.svg") no-repeat 0px center;
	background-size: 16px 16px;
}

.scorm_not_attempted .item {
    background: url("./images/puce-vide_blanc.svg") no-repeat 0px center;
	background-size: 16px 16px;
}

.scorm_completed .item.level_1, .scorm_current .item.level_1, .scorm_highlight .item.level_1, .scorm_failed .item.level_1, .scorm_not_attempted .item.level_1 {
	background-position: 0px;
}
.scorm_completed .item.level_2, .scorm_current .item.level_2, .scorm_highlight .item.level_2, .scorm_failed .item.level_2, .scorm_not_attempted .item.level_2 {
	background-position: 20px;
}
.scorm_completed .item.level_3, .scorm_current .item.level_3, .scorm_highlight .item.level_3, .scorm_failed .item.level_3, .scorm_not_attempted .item.level_3 {
	background-position: 40px;
}

.scorm_item_normal a.items-list {
	color: #000;
}

.scorm_item_normal a, .scorm_completed .item a {
	color: #000; 
}

.scorm_item_normal a:hover, .scorm_completed .item a:hover, .scorm_item_normal a:focus, .scorm_completed .item a:focus {
	text-decoration: underline; 
}

.scorm_item_normal.scorm_highlight a {
	color: #000;
	font-weight:bold;
}


/****************
Bootstrap
********************/

.row-flex {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-items: stretch;
}

.row .no-gutters {
  margin-right: 0;
  margin-left: 0;
}

.row .no-gutters > [class*="col-"] {
  padding-right: 0;
  padding-left: 0;
}

.btn {
	font-size: 1rem;
	border-radius:100px;
}

.btn-lg,
.btn-group-lg > .btn {
  padding: 10px 16px;
  font-size: 20px;
  line-height: 1.5;
}

.text-primary {
	color: #ef3d7f;
}
a.text-primary:hover,
a.text-primary:focus {
	color: #FFF!important;
	color: #ff867d;
}

.bg-primary {
	color: #FFF!important;
	background-color: #ef3d7f;
}
a.bg-primary:hover,
a.bg-primary:focus {
	color: #FFF!important;
	background-color: #ff867d;
}

.btn-primary {
	color: #FFF!important;
	background-color: #ef3d7f;
	border-color: #ef3d7f;
}
.btn-primary:focus,
.btn-primary.focus {
	color: #FFF!important;
	background-color: #ff867d;
	border-color: #ff867d;
}
.btn-primary:hover {
	color: #FFF!important;
	background-color: #ff867d;
	border-color: #ff867d;
}
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
	color: #FFF!important;
	background-color: #ff867d;
	background-image: none;
	border-color: #ff867d;
}
.btn-primary:active:hover,
.btn-primary.active:hover,
.open > .dropdown-toggle.btn-primary:hover,
.btn-primary:active:focus,
.btn-primary.active:focus,
.open > .dropdown-toggle.btn-primary:focus,
.btn-primary:active.focus,
.btn-primary.active.focus,
.open > .dropdown-toggle.btn-primary.focus {
	color: #FFF!important;
	background-color: #ff867d;
	border-color: #ff867d;
}
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled.focus,
.btn-primary[disabled].focus,
fieldset[disabled] .btn-primary.focus {
	background-color: #ef3d7f;
	border-color: #ef3d7f;
}
.btn-primary .badge {
	color: #ef3d7f;
	background-color: #FFF!important;
}

.text-secondary {
	color: #deded7;
}
a.text-secondary:hover,
a.text-secondary:focus {
	color: #000!important;
	color: #deded7;
}

.bg-secondary {
	color: #000!important;
	background-color: #efefe7;
}
a.bg-secondary:hover,
a.bg-secondary:focus {
	color: #000!important;
	background-color: #deded7;
}

.btn-secondary {
	color: #000!important;
	background-color: #efefe7;
	border-color: #efefe7;
}
.btn-secondary:focus,
.btn-secondary.focus {
	color: #000!important;
	background-color: #deded7;
	border-color: #deded7;
}
.btn-secondary:hover {
	color: #000!important;
	background-color: #deded7;
	border-color: #deded7;
}
.btn-secondary:active,
.btn-secondary.active,
.open > .dropdown-toggle.btn-secondary {
	color: #000!important;
	background-color: #deded7;
	background-image: none;
	border-color: #deded7;
}
.btn-secondary:active:hover,
.btn-secondary.active:hover,
.open > .dropdown-toggle.btn-secondary:hover,
.btn-secondary:active:focus,
.btn-secondary.active:focus,
.open > .dropdown-toggle.btn-secondary:focus,
.btn-secondary:active.focus,
.btn-secondary.active.focus,
.open > .dropdown-toggle.btn-secondary.focus {
	color: #000!important;
	background-color: #deded7;
	border-color: #deded7;
}
.btn-secondary.disabled:hover,
.btn-secondary[disabled]:hover,
fieldset[disabled] .btn-secondary:hover,
.btn-secondary.disabled:focus,
.btn-secondary[disabled]:focus,
fieldset[disabled] .btn-secondary:focus,
.btn-secondary.disabled.focus,
.btn-secondary[disabled].focus,
fieldset[disabled] .btn-secondary.focus {
	background-color: #efefe7;
	border-color: #efefe7;
}
.btn-secondary .badge {
	color: #deded7;
	background-color: #000!important;
}