.page__content img {
  display: block;
  max-width: 100%;
  margin: 5px 0
}

#file_input {
  display: none;
}

a:hover { text-decoration: none; }

.lang {
	font-family: "Karla", sans-serif
}


button:focus {outline:0;}


button.grey {

    background: linear-gradient(219.05deg, #b5b4b4 0%, #929191 100%);
    font-size: 16px;
    line-height: 19px;
    color: #fff;
    width: auto;
    border: 0;
    border-radius: 28px;
    cursor: pointer;
    padding: 15px 35px;
    font-family: "Karla", sans-serif
}

button.clear {

    background: linear-gradient(219.05deg, #ffffff 0%, #f3f3f3 100%);
    font-size: 16px;
    line-height: 19px;
    color: #fff;
    width: auto;
    border: 0;
    border-radius: 28px;
    cursor: pointer;
    padding: 15px 35px;
    font-family: "Karla", sans-serif
}


.btn-group-toggle .btn:not(:disabled):not(.disabled).active, .btn-group-toggle .btn:not(:disabled):not(.disabled):active, .show>.btn.dropdown-toggle {
	
	color: rgb(240, 239, 239);
	background-color: #ff3e47;
	border-color: #ffffff;
	border-radius:20px !important;

	min-width: 8em;


}

/* non selected btn css */
.btn-group-toggle .btn {

	color: rgb(97, 96, 96);
	background-color: #ffffff;
	border-color: #ffffff;
	border-radius:20px !important;

	min-width: 8em;

}


.language-list {
	
	border:0px;
	outline:0px;

	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: url("{% static 'images/static/arrow_select.png' %}") right / 10px no-repeat #fff;
	padding-right: 20px;
}

table {
  border-collapse: separate;
  border-spacing: 0;
}

tr td{
  padding-left: 10px !important;
  padding-right: 5px !important;
  padding-top: 5px !important;
  padding-bottom: 5px !important;
 margin: 0 !important;
}



table tr td:first-child {
	border-left: solid #e9e9e9;
	border-left-width: thin;
}


table td {
border-right: solid #e9e9e9;
border-right-width: thin;
}

table tr:first-child td {
border-top: solid #e9e9e9;
border-top-width: thin;

}
table tr:last-child td {
border-bottom: solid #e9e9e9;
border-bottom-width: thin;
}

/* top-left border-radius */
table tr:first-child td:first-child {
border-top-left-radius: 10px;
}

/* top-right border-radius */
table tr:first-child td:last-child {
border-top-right-radius: 10px;
}

/* bottom-left border-radius */
table tr:last-child td:first-child {
border-bottom-left-radius: 10px;
}

/* bottom-right border-radius */
table tr:last-child td:last-child {
border-bottom-right-radius: 10px;
}

tr:hover{
	background:#f8f7f7;
}

table.coloredheader tr:first-child{
    background:#f8f7f7;
}


table.noborder tr:first-child td {
	border-top: 0px solid;
  
}
table.noborder tr:last-child td {
border-bottom: 0px solid;
}

table.noborder tr td:first-child {
	border-left: 0px solid;
}

table.noborder tr td:last-child {
	border-right: 0px solid;
}

.nav-tabs {
	border: 0;
}

.nav-tabs .nav-link {
	background-color:#FFFFFF;
	border-bottom:#FFFFFF;
	border: 0;
  }

.nav-tabs .nav-link.active {
  background-color:#FFFFFF;
  border-bottom:#FFFFFF;
  font-weight: bold;
  border: 0;
  text-decoration: none;

}


.tab-pane.active .tab-pane-header {

  background-color:#f2f3f3;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
}

.tab-pane-header {
	padding: 5px !important;
}

.card, .card-header, .card-body, .card-footer{
    border-radius:25px !important;
    border-color:rgb(184, 184, 184);
    padding-top:15px;
    padding-bottom:15px;
    padding-right:15px;
    padding-left:15px;
    background-color: #FFFFFF;
}


.alert {
  border-radius:25px !important;
  border-color:rgb(184, 184, 184);
  padding-top:15px;
  padding-bottom:15px;
  padding-right:15px;
  padding-left:15px;
}

input[type='file']{
  border-radius:25px !important;
  border-color:#ECECEC;
  font-size:15px;
}


textarea {
  border-radius:25px !important;

}


.slider {
  width: 90%; /* Full-width */
  height: 25px; /* Specified height */
  background: #474747; /* Grey background */
}


input[type=range].grey {
  background: rgb(150, 150, 150);
}




/* for safari */
.row:before,
.row:after {
	display: none !important;
}

.import_file_input {
	display: none;
}

.import_file_input {
	display: none;
}

.helpbubble {

	position: relative;
	/* les .helpbubble deviennent référents */
	border-bottom: none !important;
	cursor: inherit !important;
	text-decoration: none !important;


}

.helpbubble:hover::after,
.helpbubble:focus::after {

	content: attr(aria-label);
	position: absolute;
	top: -3em;
	left: 50%;
	transform: translateX(-50%);
	z-index: 1;
	white-space: nowrap;
	background-color: grey;
	color: white;
	padding-right: 10px;
	padding-left: 10px;
	padding-top: 5px;
	padding-bottom: 5px;
	border-radius: 25px;
}

.loader span {
	display: inline-block;
	width: 10px;
	height: 10px;
	border-radius: 100%;
	background-color: #ff3e47;
	margin: 35px 5px;
	opacity: 0;
}

.loader span:nth-child(1) {
	animation: opacitychange 1s ease-in-out infinite;
}

.loader span:nth-child(2) {
	animation: opacitychange 1s ease-in-out 0.33s infinite;
}

.loader span:nth-child(3) {
	animation: opacitychange 1s ease-in-out 0.66s infinite;
}

@keyframes opacitychange {

	0%,
	100% {
		opacity: 0;
	}

	60% {
		opacity: 1;
	}
}


#text_rightclick_menuitems {
	list-style: none;
	margin: 0px;
	margin-top: 4px;

	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 3px;
	font-size: 8px;
	color: #333333;

}


#text_rightclick_menu {
	display: none;
	position: fixed;
	border: 1px solid #B2B2B2;
	width: 250px;
	background: #F9F9F9;
	z-index: 9;
	border-radius: 10px;

}

#text_rightclick_menuitems :hover {
	color: white;
	background: #999999;
}

#textfile_rightclick_menuitems {
	list-style: none;
	margin: 0px;
	margin-top: 4px;

	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 3px;
	font-size: 8px;
	color: #333333;

}


#textfile_rightclick_menu {
	display: none;
	position: fixed;
	border: 1px solid #B2B2B2;
	width: 200px;
	background: #F9F9F9;
	z-index: 9;
	border-radius: 10px;

}

#textfile_rightclick_menuitems :hover {
	color: white;
	background: #999999;
}

.nobull {
	list-style-type: none;
}

.pane {
	display: inline-block;
	overflow-y: auto;
	overflow-x: auto;
	width: 100%;
	max-height: 385px;
}

textarea {
	caret-color: #ff3e47;
}

/* id # text */
#text {
	caret-color: #ff3e47;
	white-space: pre-wrap;
	display: inline-block;
	width: 100%;
	/*border: 1px solid #B2B2B2;*/
	border: 0px solid #FFFFFF;

	background-color: #FFFFFF;
	color: #444444;
	font-size: 16px;
	font-family: "Karla", sans-serif;
	border-radius: 20px;

	padding-top: 15px;
	padding-bottom: 15px;
	padding-left: 18px;
	padding-right: 18px;

}

/* class highlight */
.highlight {
	color: #e6313a;

}

code {
	white-space: pre-wrap;
	display: inline;
	font-size: 16px;
	font-family: "Karla", sans-serif;
	color: #6b6a6a;
}

pre {
	white-space: pre-wrap;
	display: inline;
	font-size: 16px;
	font-family: "Karla", sans-serif;
	color: #6b6a6a;
}



.custom-input {
	position: relative;
	width: 100%;
}

.custom-input-input {
	width: 100%;
	border: 1px solid #ccc;
	border-radius: 100px;
	padding: 10px 100px 10px 20px;
	line-height: 1;
	box-sizing: border-box;
	outline: none;
}

.custom-input-button-left {
	position: absolute;
	right: 33px;
	top: 10px;
	bottom: 3px;
	border: 0;
	background: transparent !;
	color: #fff;
	outline: none;
	margin: 0;
	padding: 0 10px;
	border-radius: 100px;
	z-index: 2;
}


.custom-input-button-right {
	position: absolute;
	right: 3px;
	top: 10px;
	bottom: 3px;
	border: 0;
	background: transparent !;
	color: #fff;
	outline: none;
	margin: 0;
	padding: 0 10px;
	border-radius: 100px;
	z-index: 2;
}

input[readonly] {
	background-color: #f2f3f3;
}

img.rounded-corners {
	border-radius: 4px;
  }