* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
html {
	overflow: hidden;
	overflow-y: auto;
}
body {
	overflow: hidden;
	font-size: 16px;
	line-height: 26px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	color: #777777;
	font-weight: 400;
}
body {
	background-image:url(../img/bg-image.jpg);
	background-attachment: scroll;
	background-repeat: no-repeat;
	background-position: top center;
}

html,
button,
input,
select,
textarea {
	font-family: 'Montserrat', Helvetica, sans-serif;
}

footer,
header,
nav,
section {
  display: block;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
p {
  margin: 0;
  margin-bottom: 15px;
}

nav ul,
nav ol {
  list-style: none;
  list-style-image: none;
}
ol, ul,
li > ul,
li > ol {
  margin: 0;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
	font-family: 'Montserrat', Helvetica, sans-serif;
	line-height: 1.3;
	color: #2b2b2b;
}
h1, .h1 {font-size: 38px;}
h2, .h2 {font-size: 24px;}
h3, .h3 {font-size: 20px;}
h4, .h4 {font-size: 18px;}
h5, .h5 {font-size: 16px;}
h6, .h6 {font-size: 16px;}
h1, .h1, h2, .h2, h3, .h3 {font-weight: 700;}
h4, .h4, h5, .h5 {font-weight: 600;}
h6, .h6 {font-weight: 500;}

a {
	color: #333;
	text-decoration: none;
	transition: all 0.4s ease-in-out 0s;
}
a:visited {
	color: #333;
}
a:hover,
a:focus,
a:active {
	text-decoration: none;
	outline: none;
	color: #0072CD;
}

.uppercase {
	text-transform:uppercase;
}
.text-italic {
  font-style: italic;
}
.text-normal {
  font-style: normal;
}
.text-underline {
  font-style: underline;
}

img {
  max-width: 100%;
}
.hidden {
	display: none;
}
.clearfix:before,
.clearfix:after {
	content: " ";
	display: table;
}
.clearfix:after {
	clear: both;
}

.wrapper,
.relative {
  position: relative;
}

.align-row-spacebetween {
    display: flex;
    flex-flow: row;
    align-items: center;
    justify-content: space-around;
}
.align-center-center {
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: center;
}

.transition-3s {
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
}

i.red {
	color:#FF0000;
}

.vh-80 {
    height: 78vh !important;
	max-height: 78vh !important;
}
.vh-90 {
    height: 84vh !important;
	max-height: 84vh !important;
}
.max-vh-80 {
    max-height: 78vh !important;
}

/******************************************************************************
	TO-BAR
*******************************************************************************/
.top-bar {
	background:#000;
	color:#fff;
	padding:15px 10px;
	font-size:20px;
	position:fixed;
	display:block;
	width:100%;
	z-index:999;
}
a.logo {
	color:#fff;
	line-height: 32px;
}
.logo i {
	font-size:26px;
	color:#AA3AD2;
}
.top-bar .fa-stack { font-size: 18px; }
.top-bar i { vertical-align: middle; }
.top-bar .fa-stack-1x {
	font-size:14px;
}

/******************************************************************************
	HOMEPAGE
*******************************************************************************/
#client,
#client-dial {
	background:#fff;
	border-radius:8px;
	padding:15px 20px;
}
.client,
.client-dial {
	overflow-y:auto;
	background:#fff;
	max-height:75vh;
}

.client .list-group-item {
    padding: .15rem .75rem .15rem 0;
}
.client .nav-link {
    display: block;
}
.client .list-group-item {
	border:none;
	margin-bottom:0;
    border-bottom: 1px solid rgba(0,0,0,.125);
}

a.nav-link:hover,
a.nav-link.active {
	color:#A634BB;
}

a.conversation {
	padding:0 10px;
}


.nav-pills .nav-link {
    margin-right:5px;
	padding: .3rem 1rem;
}

.nav-pills .nav-link {
    color: #6c757d;
    border:1px solid #6c757d;
}

.nav-pills .nav-link:hover,
.nav-pills .nav-link.active {
    color: #fff;
    background:#6c757d;
	
}
/******************************************************************************
	PAGE CHAT
*******************************************************************************/
.client a.btn-sm {
    font-size: .875rem;
    line-height: 1.5;
    border-radius: .2rem;
	font-family: 'Montserrat', Helvetica, sans-serif;
}
.client a.btn-outline-danger {
    color: #dc3545;
    border-color: #dc3545;
}
.client a.btn-outline-danger:hover {
    color: #fff;
    border-color: #dc3545;
	background-color:#dc3545;
}

/******************************************************************************
	LOGIN
*******************************************************************************/
.o-hidden {
    overflow: hidden !important;
}
.border-0 {
    border: 0 !important;
}
.shadow-lg {
    -webkit-box-shadow: 0 1rem 3rem rgba(0,0,0,.5) !important;
    box-shadow: 0 1rem 3rem rgba(0,0,0,.5) !important;
}
.p-5 {
    padding: 3rem !important;
}
.form-control::placeholder {
    color: #858796;
    opacity: 1;
}

form.user .form-control-user {
    font-size: .8rem;
    border-radius: 10rem;
    padding: 1.5rem 1rem;
}
form.user .btn-user {
    font-size: .8rem;
    border-radius: 10rem;
    padding: .75rem 1rem;
}
a.btn-primary,
a.btn-primary:hover,
a.btn-primary:focus {
	color:#fff;
}
/******************************************************************************
	DIAL
*******************************************************************************/
#chat {
	overflow:hidden;
}

.bubble1 {
	position: relative;
	float:left;
	width: 80%;
	height: auto;
	padding: 5px 10px 0;
	background: #e2e2e2;
	color:#333;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	margin-bottom:10px;
}

.bubble1:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 0 10px 10px 0;
	border-color: transparent #e2e2e2;
	display: block;
	width: 0;
	z-index: 1;
	left: -9px;
	top: 23%;
}

.bubble2 {
	position: relative;
	float:right;
	width: 80%;
	height: auto;
	padding: 5px 10px 0;
	background: #F5E7FA;
	color:#333;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	margin-bottom:10px;
}

.bubble2:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 0 0 10px 10px;
	border-color: transparent #F5E7FA;
	display: block;
	width: 0;
	z-index: 1;
	right: -9px;
	top: 23%;
}

.bubble1 p, .bubble2 p {
	margin-bottom:8px;
	line-height:1.3;
}

/******************************************************************************
	FOOTER
*******************************************************************************/
#footer {
	position:absolute;
	bottom:0;
	left:20px;
	right:20px;
	z-index:500;
}
#footer.dialogue {
    background: rgba(0,0,0,0);
    border-top: 1px solid #ccc;
    padding: 10px 0;
}
#footer .form-group {
    margin-bottom: 0;
}

#footer .iconefont {
	float: right;
	margin-right: 0px;
	margin-top: -38px;
	position: relative;
	z-index: 2;
	color:#00CE47;
	font-size:16px;
	border:none;
	background:transparent;
}

#footer .fa-stack {
    display: inline-block;
    height: 1em;
    line-height: 1em;
    position: relative;
    vertical-align: middle;
    width: 1.5em;
}
#footer .fa-stack-2x {
    font-size: 1em;
}
#footer .fa-stack-1x {
    font-size: 0.5em;
}

#footer .form-control,
#footer .form-control:focus {
    color: #fff;
    background-color: rgba(0,0,0,0);
    border: 1px solid #ced4da;
    border-radius: 0;
}
#footer .form-control::placeholder {
    color: #555;
    opacity: 0.8;
}

#footer .btn {
    color: #fff;
    background-color: #6A1F84;
    border: 1px solid #ced4da;
    line-height: 1.5;
    border-radius: 0;
}

#footer .btn-outline-secondary {
    color: #fff;
    border-color: #ced4da;
}
#footer .btn-outline-secondary:hover {
    color: #fff;
    background-color: #A939D0;
}



/******************************************************************************
	AJUSTEMENT PADDING / MARGIN / HAUTEUR / LARGEUR
*******************************************************************************/
/** Height et width **/
.fullscreen {
  min-height: 100vh;
  width: 100%;
}
.w-10 {width: 10%;}
.w-25 {width: 25%;}
.w-33 {width: 33.33%;}
.w-50 {width: 50%;}
.w-75 {width: 75%;}
.w-100 {width: 100%;}

.h-10 {height: 10%;}
.h-33 {height: 33.33%;}
.h-25 {height: 25%;}
.h-50 {height: 50%;}
.h-75 {height: 75%;}
.h-100 {height: 100%;}

/** PADDING **/
/** padding top/bottom **/
.p-0 {padding: 0px 0;}
.ptb-5 {padding: 5px 0;}
.ptb-10 {padding: 10px 0;}
.ptb-15 {padding: 15px 0;}
.ptb-20 {padding: 20px 0;}
.ptb-25 {padding: 25px 0;}
.ptb-30 {padding: 30px 0;}
.ptb-35 {padding: 35px 0;}
.ptb-40 {padding: 40px 0;}
.ptb-45 {padding: 45px 0;}
.ptb-50 {padding: 50px 0;}
.ptb-55 {padding: 55px 0;}
.ptb-60 {padding: 60px 0;}
.ptb-65 {padding: 65px 0;}
.ptb-70 {padding: 70px 0;}
.ptb-75 {padding: 75px 0;}
.ptb-80 {padding: 80px 0;}
.ptb-85 {padding: 85px 0;}
.ptb-90 {padding: 90px 0;}
.ptb-95 {padding: 95px 0;}
.ptb-100 {padding: 100px 0;}
.ptb-110 {padding: 110px 0;}
.ptb-120 {padding: 120px 0;}
.ptb-125 {padding: 125px 0;}
.ptb-130 {padding: 130px 0;}
.ptb-135 {padding: 135px 0;}
.ptb-140 {padding: 140px 0;}
.ptb-145 {padding: 145px 0;}
.ptb-150 {padding: 150px 0;}

/** padding left-right **/
.plr-5 {padding: 0 5px;}
.plr-10{padding: 0 10px;}
.plr-20{padding-left:20px; padding-right:20px;}
/** padding top **/
.pt-0 {padding-top: 0!important;}
.pt-5 {padding-top: 5px;}
.pt-10 {padding-top: 10px;}
.pt-15 {padding-top: 15px;}
.pt-20 {padding-top: 20px;}
.pt-25 {padding-top: 25px;}
.pt-30 {padding-top: 30px;}
.pt-35 {padding-top: 35px;}
.pt-40 {padding-top: 40px;}
.pt-45 {padding-top: 45px;}
.pt-50 {padding-top: 50px;}
.pt-55 {padding-top: 55px;}
.pt-60 {padding-top: 60px;}
.pt-65 {padding-top: 65px;}
.pt-70 {padding-top: 70px;}
.pt-75 {padding-top: 75px;}
.pt-80 {padding-top: 80px;}
.pt-85 {padding-top: 85px;}
.pt-90 {padding-top: 90px;}
.pt-95 {padding-top: 95px;}
.pt-100 {padding-top: 100px;}

/** padding bottom **/
.pb-0 {padding-bottom: 0!important}
.pb-5 {padding-bottom: 5px;}
.pb-10 {padding-bottom: 10px;}
.pb-15 {padding-bottom: 15px;}
.pb-20 {padding-bottom: 20px;}
.pb-25 {padding-bottom: 25px;}
.pb-30 {padding-bottom: 35px;}
.pb-35 {padding-bottom: 35px;}
.pb-40 {padding-bottom: 40px;}
.pb-45 {padding-bottom: 45px;}
.pb-50 {padding-bottom: 50px;}
.pb-55 {padding-bottom: 55px;}
.pb-60 {padding-bottom: 60px;}
.pb-65 {padding-bottom: 65px;}
.pb-70 {padding-bottom: 70px;}
.pb-75 {padding-bottom: 75px;}
.pb-80 {padding-bottom: 80px;}
.pb-85 {padding-bottom: 85px;}
.pb-90 {padding-bottom: 90px;}
.pb-95 {padding-bottom: 95px;}
.pb-100 {padding-bottom: 100px;}

/** padding-left **/
.pl-5 {padding-left: 5px;}
.pl-10 {padding-left: 10px;}
.pl-15 {padding-left: 15px;}
.pl-20 {padding-left: 20px;}
.pl-25 {padding-left: 25px;}
.pl-30 {padding-left: 30px;}
.pl-35 {padding-left: 35px;}
.pl-40 {padding-left: 40px;}
.pl-45 {padding-left: 45px;}
.pl-50 {padding-left: 50px;}
.pl-55 {padding-left: 55px;}
.pl-60 {padding-left: 60px;}
.pl-65 {padding-left: 65px;}
.pl-70 {padding-left: 70px;}
.pl-75 {padding-left: 75px;}
.pl-80 {padding-left: 80px;}
.pl-85 {padding-left: 85px;}
.pl-90 {padding-left: 90px;}
.pl-95 {padding-left: 95px;}
.pl-100 {padding-left: 100px;}

/** padding-right **/
.pr-0 {padding-right: 0px!important;}
.pr-5 {padding-right: 5px;}
.pr-10 {padding-right: 10px;}
.pr-15 {padding-right: 15px;}
.pr-20 {padding-right: 20px;}
.pr-25 {padding-right: 25px;}
.pr-30 {padding-right: 30px;}
.pr-35 {padding-right: 35px;}
.pr-40 {padding-right: 40px;}
.pr-45 {padding-right: 45px;}
.pr-50 {padding-right: 50px;}
.pr-55 {padding-right: 55px;}
.pr-60 {padding-right: 60px;}
.pr-65 {padding-right: 65px;}
.pr-70 {padding-right: 70px;}
.pr-75 {padding-right: 75px;}
.pr-80 {padding-right: 80px;}
.pr-85 {padding-right: 85px;}
.pr-90 {padding-right: 90px;}
.pr-95 {padding-right: 95px;}
.pr-100 {padding-right: 100px;}


/** MARGIN **/
/** margin top/bottom **/
.mtb-0 {margin: 0px!important;}
.mtb-5 {margin: 5px 0;}
.mtb-10 {margin: 10px 0;}
.mtb-15 {margin: 15px 0;}
.mtb-20 {margin: 20px 0;}
.mtb-25 {margin: 25px 0;}
.mtb-30 {margin: 30px 0;}
.mtb-35 {margin: 35px 0;}
.mtb-40 {margin: 40px 0;}
.mtb-45 {margin: 45px 0;}
.mtb-50 {margin: 50px 0;}
.mtb-55 {margin: 55px 0;}
.mtb-60 {margin: 60px 0;}
.mtb-65 {margin: 65px 0;}
.mtb-70 {margin: 70px 0;}
.mtb-75 {margin: 75px 0;}
.mtb-80 {margin: 80px 0;}
.mtb-85 {margin: 85px 0;}
.mtb-90 {margin: 90px 0;}
.mtb-95 {margin: 95px 0;}
.mtb-100 {margin: 100px 0;}

/** margin bottom **/
.mb-0 {margin-bottom: 0px!important;}
.mb-5 {margin-bottom: 5px;}
.mb-10 {margin-bottom: 10px;}
.mb-15 {margin-bottom: 15px;}
.mb-20 {margin-bottom: 20px;}
.mb-25 {margin-bottom: 25px;}
.mb-30 {margin-bottom: 30px;}
.mb-35 {margin-bottom: 35px;}
.mb-40 {margin-bottom: 40px;}
.mb-45 {margin-bottom: 45px;}
.mb-50 {margin-bottom: 50px;}
.mb-55 {margin-bottom: 55px;}
.mb-60 {margin-bottom: 60px;}
.mb-65 {margin-bottom: 65px;}
.mb-70 {margin-bottom: 70px;}
.mb-75 {margin-bottom: 75px;}
.mb-80 {margin-bottom: 80px;}
.mb-85 {margin-bottom: 85px;}
.mb-90 {margin-bottom: 90px;}
.mb-95 {margin-bottom: 95px;}
.mb-100 {margin-bottom: 100px;}

/** margin top **/
.mt-0 {margin-top: 0px!important;}
.mt-10 {margin-top: 10px;}
.mt-15 {margin-top: 15px;}
.mt-20 {margin-top: 20px;}
.mt-25 {margin-top: 25px;}
.mt-30 {margin-top: 30px;}
.mt-35 {margin-top: 35px;}
.mt-40 {margin-top: 40px;}
.mt-45 {margin-top: 45px;}
.mt-50 {margin-top: 50px;}
.mt-55 {margin-top: 55px;}
.mt-60 {margin-top: 60px;}
.mt-65 {margin-top: 65px;}
.mt-70 {margin-top: 70px;}
.mt-75 {margin-top: 75px;}
.mt-80 {margin-top: 80px;}
.mt-85 {margin-top: 85px;}
.mt-90 {margin-top: 90px;}
.mt-95 {margin-top: 95px;}
.mt-100 {margin-top: 100px;}
.mt-120 {margin-top: 120px;}

/** margin left **/
.ml-0 {margin-left: 0px!important;}
.ml-10 {margin-left: 10px;}
.ml-15 {margin-left: 15px;}
.ml-20 {margin-left: 20px;}
.ml-25 {margin-left: 25px;}
.ml-30 {margin-left: 30px;}
.ml-35 {margin-left: 35px;}
.ml-40 {margin-left: 40px;}
.ml-45 {margin-left: 45px;}
.ml-50 {margin-left: 50px;}
.ml-55 {margin-left: 55px;}
.ml-60 {margin-left: 60px;}
.ml-65 {margin-left: 65px;}
.ml-70 {margin-left: 70px;}
.ml-75 {margin-left: 75px;}
.ml-80 {margin-left: 80px;}
.ml-85 {margin-left: 85px;}
.ml-90 {margin-left: 90px;}
.ml-95 {margin-left: 95px;}
.ml-100 {margin-left: 100px;}

/** margin right **/
.mr-0 {margin-right: 0px!important;}
.mr-10 {margin-right: 10px;}
.mr-15 {margin-right: 15px;}
.mr-20 {margin-right: 20px;}
.mr-25 {margin-right: 25px;}
.mr-30 {margin-right: 30px;}
.mr-35 {margin-right: 35px;}
.mr-40 {margin-right: 40px;}
.mr-45 {margin-right: 45px;}
.mr-50 {margin-right: 50px;}
.mr-55 {margin-right: 55px;}
.mr-60 {margin-right: 60px;}
.mr-65 {margin-right: 65px;}
.mr-70 {margin-right: 70px;}
.mr-75 {margin-right: 75px;}
.mr-80 {margin-right: 80px;}
.mr-85 {margin-right: 85px;}
.mr-90 {margin-right: 90px;}
.mr-95 {margin-right: 95px;}
.mr-100 {margin-right: 100px;}

/** Section padding **/
.section-padding {padding:0;}
.section-padding-xs {padding: 50px 0;}
.section-padding-sm {padding: 80px 0;}
.section-padding-md {padding: 100px 0;}
.section-padding-lg {padding: 120px 0;}
.section-padding-xlg {padding: 150px 0;}

.section-padding-top-xs {padding-top: 50px;}
.section-padding-top-sm {padding-top: 80px;}
.section-padding-top-md {padding-top: 100px;}
.section-padding-top-lg {padding-top: 120px;}
.section-padding-top-xlg {padding-top: 150px;}

.section-padding-bottom-xs {padding-bottom: 50px;}
.section-padding-bottom-sm {padding-bottom: 80px;}
.section-padding-bottom-md {padding-bottom: 100px;}
.section-padding-bottom-lg {padding-bottom: 120px;}
.section-padding-bottom-xlg {padding-bottom: 150px;}


@media only screen and (min-width: 992px) and (max-width: 1199px) {
	.section-padding-sm {padding: 60px 0;}
	.section-padding-md {padding: 80px 0;}
	.section-padding-lg {padding: 100px 0;}
	.section-padding-xlg {padding: 120px 0;}

	.section-padding-top-sm {padding-top: 60px;}
	.section-padding-top-md {padding-top: 80px;}
	.section-padding-top-lg {padding-top: 100px;}
	.section-padding-top-xlg {padding-top: 120px;}

	.section-padding-bottom-sm {padding-bottom: 60px;}
	.section-padding-bottom-md {padding-bottom: 80px;}
	.section-padding-bottom-lg {padding-bottom: 100px;}
	.section-padding-bottom-xlg {padding-bottom: 120px;}
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
	.section-padding-sm {padding: 60px 0;}
	.section-padding-md {padding: 80px 0;}
	.section-padding-lg {padding: 90px 0;}
	.section-padding-xlg {padding: 110px 0;}

	.section-padding-top-sm {padding-top: 60px;}
	.section-padding-top-md {padding-top: 80px;}
	.section-padding-top-lg {padding-top: 90px;}
	.section-padding-top-xlg {padding-top: 110px;}
  
	.section-padding-bottom-sm {padding-bottom: 60px;}
	.section-padding-bottom-md {padding-bottom: 80px;}
	.section-padding-bottom-lg {padding-bottom: 90px;}
	.section-padding-bottom-xlg {padding-bottom: 110px;}
}

@media only screen and (max-width: 767px) {
	.section-padding-sm {padding: 55px 0;}
	.section-padding-md {padding: 60px 0;}
	.section-padding-lg {padding: 65px 0;}
	.section-padding-xlg {padding: 75px 0;}
	
	.section-padding-top-sm {padding-top: 55px;}
	.section-padding-top-md {padding-top: 60px;}
	.section-padding-top-lg {padding-top: 65px;}
	.section-padding-top-xlg {padding-top: 75px;}

	.section-padding-bottom-sm {padding-bottom: 55px;}
	.section-padding-bottom-md {padding-bottom: 60px;}
	.section-padding-bottom-lg {padding-bottom: 65px;}
	.section-padding-bottom-xlg {padding-bottom: 75px;}  
}

/****************************************************
	RESPONSIVE
****************************************************/
/** Min-Width **/
@media (min-width: 768px) {
	#footer .copyright .list-inline > li {
    display: inline-block;
    padding-right: 5px;
    padding-left: 5px;
	}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
	h1, .h1 {
	font-size: 38px;
	}
	h2, .h2 {
	font-size: 30px;
	}
	h3, .h3 {
	font-size: 24px;
	}
}
@media (min-width: 992px) {

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

}

@media (min-width: 1400px) {

}

/** Max-Width **/
@media (max-width: 1199px) {

}
@media (max-width: 991px) {

}

@media (max-width: 767px) {
	h1, .h1 {
	font-size: 36px;
	}
	h2, .h2 {
	font-size: 28px;
	}
	h3, .h3 {
	font-size: 22px;
	}
	h4, .h4 {
	font-size: 20px;
	}
	
	.button-btn.float-left,
	.button-btn.float-right {
    float: none!important;
    text-align: center;
    display: block;
	}

}

@media (max-width: 576px) {
	h1, .h1 {
	font-size: 30px;
	}
	h2, .h2 {
	font-size: 22px;
	}
	h3, .h3 {
	font-size: 18px;
	}
	h4, .h4 {
	font-size: 16px;
	}
	
}

@media only screen and (max-width: 479px) {
	
}
@media only screen and (max-width: 400px) {
	.stars {
    font-size: 10px;
	}
}

@media only screen and (max-width: 320px) {
	.logo i {
    font-size: 20px;
	}
	.top-bar {
    font-size: 16px;
	}
	.fa-2x {
    font-size: 1.2em;
	}
	
	.max-vh-80 {
    max-height: 74vh !important;
	}
}