/*For Prealoder*/
/**************************************

Template Name: Xmee | Login and Register Form Html Templates
Template URL: http://html.affixtheme.com/html/xmee
Description: Creative & Exclusive Login Registration Template
Author: AffixTheme
Author URL: https://themeforest.net/user/affixtheme
Version: 2.1 

======================================  
        Table Of Contents
======================================
1. Typography
2. Template Default Style
3. Template Animation
4. Demo Layout One
5. Demo Layout Two
6. Demo Layout Three
7. Demo Layout Four
8. Demo Layout Five
9. Demo Layout Six
10. Demo Layout Seven
11. Demo Layout Eight
12. Demo Layout Nine
13. Demo Layout Ten
14. Demo Layout Eleven
15. Demo Layout Twelve
16. Demo Layout Thirteen
17. Demo Layout Fourteen
18. Demo Layout Fifteen
19. Demo Layout Sixteen
20. Demo Layout Seventeen
21. Demo Layout Eighteen
22. Demo Layout Nineteen
23. Demo Layout Twenty
24. Demo Layout Twenty One
25. Demo Layout Twenty Two
26. Demo Layout Twenty Three
27. Demo Layout Twenty Four
28. Demo Layout Twenty Five
29. Demo Layout Twenty Six
30. Demo Layout Twenty Seven
31. Demo Layout Twenty Eight
32. Demo Layout Twenty Nine
33. Demo Layout Thirty
34. Demo Layout Thirty One
35. Demo Layout Thirty Two
36. Demo Layout Thirty Three
37. Demo Layout Thirty Four
38. Demo Layout Thirty Five
39. Demo Layout Thirty Six

**************************************/
/*=======================================================================
1. Typography
=========================================================================*/
html {
  height: 100%;
}
body {
  font-size: 16px;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  height: 100%;
  line-height: 1.7;
  vertical-align: baseline;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  color: #646464;
  background-color: #fff;
}
p {
  margin: 0 0 20px 0;
  color: #646464;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 400;
  font-family: 'Roboto', sans-serif;
  margin: 0 0 20px 0;
  color: #111;
}
h1,
h2 {
  line-height: 1.2;
}
h3,
h4,
h5,
h6 {
  line-height: 1.4;
}
h1 {
  font-size: 36px;
}
@media only screen and (max-width: 1199px) {
  h1 {
    font-size: 34px;
  }
}
@media only screen and (max-width: 991px) {
  h1 {
    font-size: 32px;
  }
}
@media only screen and (max-width: 767px) {
  h1 {
    font-size: 30px;
  }
}
h2 {
  font-size: 28px;
}
@media only screen and (max-width: 1199px) {
  h2 {
    font-size: 26px;
  }
}
@media only screen and (max-width: 991px) {
  h2 {
    font-size: 24px;
  }
}
@media only screen and (max-width: 767px) {
  h2 {
    font-size: 22px;
  }
}
h3 {
  font-size: 22px;
}
@media only screen and (max-width: 991px) {
  h3 {
    font-size: 20px;
  }
}
@media only screen and (max-width: 767px) {
  h3 {
    font-size: 18px;
  }
}
h4 {
  font-size: 20px;
}
@media only screen and (max-width: 991px) {
  h4 {
    font-size: 18px;
  }
}
@media only screen and (max-width: 767px) {
  h4 {
    font-size: 16px;
  }
}
h5 {
  font-size: 18px;
}
@media only screen and (max-width: 991px) {
  h5 {
    font-size: 16px;
  }
}
/*=======================================================================
2. Template Default Style
=========================================================================*/
a {
  text-decoration: none;
}
a:active,
a:hover,
a:focus {
  text-decoration: none;
}
a:active,
a:hover,
a:focus {
  outline: 0 none;
}
img {
  max-width: 100%;
  height: auto;
}
ul {
  list-style: outside none none;
  margin: 0;
  padding: 0;
}
.fxt-content-between {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
@media only screen and (max-width: 767px) {
  .fxt-none-767 {
    display: none !important;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-none-991 {
    display: none !important;
  }
}
/*Preloader Styles Start*/
.preloader {
  position: fixed;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  background-color: #fff;
  z-index: 999999;
}
.preloader .inner {
  width: 99px;
  height: 99px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}
.preloader .inner > div {
  border-radius: 50%;
  position: absolute;
  -webkit-animation-name: circle_rotate;
  animation-name: circle_rotate;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear cubic-bezier(0.075, 0.82, 0.165, 1);
  animation-timing-function: linear cubic-bezier(0.075, 0.82, 0.165, 1);
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}
.preloader .inner .line1 {
  width: 100%;
  height: 100%;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  border-top: 6px solid #740eaf;
  border-left: 6px solid rgba(116, 14, 175, 0);
  border-right: 6px solid rgba(116, 14, 175, 0);
  border-bottom: 6px solid rgba(116, 14, 175, 0);
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
}
.preloader .inner .line2 {
  width: 70%;
  height: 70%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  border-top: 6px solid #9726d8;
  border-left: 6px solid rgba(151, 38, 216, 0);
  border-right: 6px solid rgba(151, 38, 216, 0);
  border-bottom: 6px solid rgba(151, 38, 216, 0);
  -webkit-animation-delay: 0.25s;
  animation-delay: 0.25s;
}
.preloader .inner .line3 {
  width: 40%;
  height: 40%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  border-top: 6px solid #be70eb;
  border-left: 6px solid rgba(190, 112, 235, 0);
  border-right: 6px solid rgba(190, 112, 235, 0);
  border-bottom: 6px solid rgba(190, 112, 235, 0);
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s;
}
@-webkit-keyframes circle_rotate {
  50%,
  100% {
    -webkit-transform: rotate(405deg);
    transform: rotate(405deg);
  }
}
@keyframes circle_rotate {
  50%,
  100% {
    -webkit-transform: rotate(405deg);
    transform: rotate(405deg);
  }
}
/*Preloader Styles End*/
/*========================================================================
3. Template Animation
=========================================================================*/
.fxt-template-animation {
  position: relative;
  z-index: 1;
  width: 100%;
  opacity: 0;
  overflow: hidden;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.fxt-template-animation .fxt-opacity {
  opacity: 0;
}
.fxt-template-animation .fxt-transformY-50 {
  opacity: 0;
  -webkit-transform: translateY(50px);
  -ms-transform: translateY(50px);
  transform: translateY(50px);
}
.fxt-template-animation .fxt-transformX-L-50 {
  opacity: 0;
  -webkit-transform: translateX(-50px);
  -ms-transform: translateX(-50px);
  transform: translateX(-50px);
}
.fxt-template-animation .fxt-transformX-R-50 {
  opacity: 0;
  -webkit-transform: translateX(50px);
  -ms-transform: translateX(50px);
  transform: translateX(50px);
}
.loaded.fxt-template-animation {
  opacity: 1;
}
.loaded.fxt-template-animation .fxt-opacity {
  opacity: 1;
  -webkit-transition: all 1.3s cubic-bezier(0.075, 0.82, 0.165, 1);
  -o-transition: all 1.3s cubic-bezier(0.075, 0.82, 0.165, 1);
  transition: all 1.3s cubic-bezier(0.075, 0.82, 0.165, 1);
}
.loaded.fxt-template-animation .fxt-transformY-50 {
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  opacity: 1;
  -webkit-transition: all 1.3s cubic-bezier(0.075, 0.82, 0.165, 1);
  -o-transition: all 1.3s cubic-bezier(0.075, 0.82, 0.165, 1);
  transition: all 1.3s cubic-bezier(0.075, 0.82, 0.165, 1);
}
.loaded.fxt-template-animation .fxt-transformX-L-50 {
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
  opacity: 1;
  -webkit-transition: all 1.3s cubic-bezier(0.075, 0.82, 0.165, 1);
  -o-transition: all 1.3s cubic-bezier(0.075, 0.82, 0.165, 1);
  transition: all 1.3s cubic-bezier(0.075, 0.82, 0.165, 1);
}
.loaded.fxt-template-animation .fxt-transformX-R-50 {
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
  opacity: 1;
  -webkit-transition: all 1.3s cubic-bezier(0.075, 0.82, 0.165, 1);
  -o-transition: all 1.3s cubic-bezier(0.075, 0.82, 0.165, 1);
  transition: all 1.3s cubic-bezier(0.075, 0.82, 0.165, 1);
}
.loaded.fxt-template-animation .fxt-transition-delay-1 {
  -webkit-transition-delay: 0.1s;
  -o-transition-delay: 0.1s;
  transition-delay: 0.1s;
}
.loaded.fxt-template-animation .fxt-transition-delay-2 {
  -webkit-transition-delay: 0.2s;
  -o-transition-delay: 0.2s;
  transition-delay: 0.2s;
}
.loaded.fxt-template-animation .fxt-transition-delay-3 {
  -webkit-transition-delay: 0.3s;
  -o-transition-delay: 0.3s;
  transition-delay: 0.3s;
}
.loaded.fxt-template-animation .fxt-transition-delay-4 {
  -webkit-transition-delay: 0.4s;
  -o-transition-delay: 0.4s;
  transition-delay: 0.4s;
}
.loaded.fxt-template-animation .fxt-transition-delay-5 {
  -webkit-transition-delay: 0.5s;
  -o-transition-delay: 0.5s;
  transition-delay: 0.5s;
}
.loaded.fxt-template-animation .fxt-transition-delay-6 {
  -webkit-transition-delay: 0.6s;
  -o-transition-delay: 0.6s;
  transition-delay: 0.6s;
}
.loaded.fxt-template-animation .fxt-transition-delay-7 {
  -webkit-transition-delay: 0.7s;
  -o-transition-delay: 0.7s;
  transition-delay: 0.7s;
}
.loaded.fxt-template-animation .fxt-transition-delay-8 {
  -webkit-transition-delay: 0.8s;
  -o-transition-delay: 0.8s;
  transition-delay: 0.8s;
}
.loaded.fxt-template-animation .fxt-transition-delay-9 {
  -webkit-transition-delay: 0.9s;
  -o-transition-delay: 0.9s;
  transition-delay: 0.9s;
}
.loaded.fxt-template-animation .fxt-transition-delay-10 {
  -webkit-transition-delay: 1s;
  -o-transition-delay: 1s;
  transition-delay: 1s;
}
.loaded.fxt-template-animation .fxt-transition-delay-11 {
  -webkit-transition-delay: 1.1s;
  -o-transition-delay: 1.1s;
  transition-delay: 1.1s;
}
.loaded.fxt-template-animation .fxt-transition-delay-12 {
  -webkit-transition-delay: 1.2s;
  -o-transition-delay: 1.2s;
  transition-delay: 1.2s;
}
.loaded.fxt-template-animation .fxt-transition-delay-13 {
  -webkit-transition-delay: 1.3s;
  -o-transition-delay: 1.3s;
  transition-delay: 1.3s;
}
.loaded.fxt-template-animation .fxt-transition-delay-14 {
  -webkit-transition-delay: 1.4s;
  -o-transition-delay: 1.4s;
  transition-delay: 1.4s;
}
.loaded.fxt-template-animation .fxt-transition-delay-15 {
  -webkit-transition-delay: 1.5s;
  -o-transition-delay: 1.5s;
  transition-delay: 1.5s;
}
.loaded.fxt-template-animation .fxt-transition-delay-16 {
  -webkit-transition-delay: 1.6s;
  -o-transition-delay: 1.6s;
  transition-delay: 1.6s;
}
.loaded.fxt-template-animation .fxt-transition-delay-17 {
  -webkit-transition-delay: 1.7s;
  -o-transition-delay: 1.7s;
  transition-delay: 1.7s;
}
.loaded.fxt-template-animation .fxt-transition-delay-18 {
  -webkit-transition-delay: 1.8s;
  -o-transition-delay: 1.8s;
  transition-delay: 1.8s;
}
.loaded.fxt-template-animation .fxt-transition-delay-19 {
  -webkit-transition-delay: 1.9s;
  -o-transition-delay: 1.9s;
  transition-delay: 1.9s;
}
.loaded.fxt-template-animation .fxt-transition-delay-20 {
  -webkit-transition-delay: 2s;
  -o-transition-delay: 2s;
  transition-delay: 2s;
}
/*========================================================================
8. Demo Layout Five
=========================================================================*/
.fxt-template-layout5 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.fxt-template-layout5 .fxt-intro {
  max-width: 500px;
  width: 100%;
  padding: 30px;
}
.fxt-template-layout5 .fxt-intro .sub-title {
  font-weight: 300;
  font-size: 40px;
  color: #fff;
  line-height: 1.5;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout5 .fxt-intro .sub-title {
    font-size: 30px;
  }
}
.fxt-template-layout5 .fxt-intro h1 {
  font-size: 88px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 25px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout5 .fxt-intro h1 {
    font-size: 60px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout5 .fxt-intro h1 {
    font-size: 50px;
  }
}
.fxt-template-layout5 .fxt-intro p {
  color: #fff;
}
.fxt-template-layout5 .fxt-content-between {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.fxt-template-layout5 .fxt-bg-color {
  position: relative;
  max-width: 530px;
  background-color: #ffffff;
  min-height: 100vh;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 50px;
}
.fxt-template-layout5 .fxt-bg-img {
  min-height: 100vh;
  width: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.fxt-template-layout5 .fxt-header {
  text-align: center;
}
.fxt-template-layout5 .fxt-form {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  margin-bottom: 40px;
}
.fxt-template-layout5 .fxt-form .fxt-otp-logo {
  margin-bottom: 20px;
  display: block;
}
.fxt-template-layout5 .fxt-form h2 {
  font-weight: 700;
  margin-bottom: 25px;
}
.fxt-template-layout5 .fxt-form p {
  margin-bottom: 30px;
  font-size: 17px;
}
.fxt-template-layout5 .fxt-form p span {
  display: block;
}
.fxt-template-layout5 .fxt-form .fxt-otp-label {
  margin-bottom: 15px;
  font-size: 18px;
  font-weight: 500;
}
.fxt-template-layout5 .fxt-form .form-group {
  position: relative;
  z-index: 1;
  margin-bottom: 30px;
}
.fxt-template-layout5 .fxt-form .form-group i {
  position: absolute;
  z-index: 1;
  left: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
.fxt-template-layout5 .fxt-form .form-group [class^="flaticon-"]:before,
.fxt-template-layout5 .fxt-form .form-group [class*=" flaticon-"]:before,
.fxt-template-layout5 .fxt-form .form-group [class^="flaticon-"]:after,
.fxt-template-layout5 .fxt-form .form-group [class*=" flaticon-"]:after {
  margin-left: 0;
  font-size: 17px;
  color: #a1a1a1;
}
.fxt-template-layout5 .fxt-form .form-control {
  min-height: 40px;
  -webkit-box-shadow: none;
  box-shadow: none;
  border: 0;
  border-bottom: 1px solid #e7e7e7;
  padding: 10px 10px 10px 30px;
  color: #111111;
}
.fxt-template-layout5 .fxt-form input::-webkit-input-placeholder {
  color: #a1a1a1;
  font-size: 15px;
  font-weight: 300;
}
.fxt-template-layout5 .fxt-form input::-moz-placeholder {
  color: #a1a1a1;
  font-size: 15px;
  font-weight: 300;
}
.fxt-template-layout5 .fxt-form input:-moz-placeholder {
  color: #a1a1a1;
  font-size: 15px;
  font-weight: 300;
}
.fxt-template-layout5 .fxt-form input:-ms-input-placeholder {
  color: #a1a1a1;
  font-size: 15px;
  font-weight: 300;
}
.fxt-template-layout5 .fxt-form .fxt-form-row {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 25px;
}
.fxt-template-layout5 .fxt-form .fxt-form-row .fxt-form-col {
  margin-right: 10px;
  flex-basis: 0;
  flex-grow: 1;
  padding: 10px;
  text-align: center;
}
.fxt-template-layout5 .fxt-form .fxt-form-row .fxt-form-col:last-child {
  margin-right: 0;
}
.fxt-template-layout5 .fxt-form .fxt-form-btn {
  margin-bottom: 10px;
}
.fxt-template-layout5 .fxt-form .fxt-resend-wrap {
  color: #999898;
  margin-bottom: 10px;
  display: inline-flex;
  flex-wrap: wrap;
}
.fxt-template-layout5 .fxt-form .fxt-btn-resend {
  margin-left: 3px;
  box-shadow: none;
  border: 0;
  background-color: transparent;
  cursor: pointer;
  padding: 0;
  color: #63bbff;
  text-decoration: underline;
  transition: all 0.3s ease-in-out;
}
.fxt-template-layout5 .fxt-form .fxt-btn-resend:focus {
  outline: none;
}
.fxt-template-layout5 .fxt-form .fxt-btn-resend:hover {
  color: #000000;
}
.fxt-template-layout5 .fxt-form .text-or {
  margin-left: 3px;
  color: #000000;
}
.fxt-template-layout5 .fxt-logo {
  display: block;
  margin-top: 50px;
  margin-bottom: 50px;
  margin-left: auto;
  margin-right: auto;
  max-width: 40vw;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout5 .fxt-logo {
    margin-top: 30px;
  }
}
.fxt-template-layout5 .fxt-page-switcher {
  position: absolute;
  left: -115px;
  top: 100px;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 25px;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout5 .fxt-page-switcher {
    position: inherit;
    left: inherit;
    top: inherit;
    -webkit-box-orient: inherit;
    -webkit-box-direction: inherit;
    -ms-flex-direction: inherit;
    flex-direction: inherit;
    margin-bottom: 30px;
  }
}
.fxt-template-layout5 .fxt-page-switcher .switcher-text {
  color: #fff;
  font-size: 18px;
  padding: 10px 30px 10px 20px;
  border-radius: 45px 0 0 45px;
  width: 100%;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.fxt-template-layout5 .fxt-page-switcher .switcher-text.active {
  color: #000;
  background-color: #fff;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout5 .fxt-page-switcher .switcher-text.switcher-text1,
  .fxt-template-layout5 .fxt-page-switcher .switcher-text.switcher-text2 {
    background-color: #eaeaea;
    color: #000;
    padding: 6px 30px 6px 20px;
    font-size: 16px;
  }
  .fxt-template-layout5 .fxt-page-switcher .switcher-text.switcher-text1.active,
  .fxt-template-layout5 .fxt-page-switcher .switcher-text.switcher-text2.active {
    color: #0e9d88;
    background-color: #e4e4e4;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout5 .fxt-page-switcher .switcher-text.switcher-text1 {
    border-radius: 45px 0 0 45px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout5 .fxt-page-switcher .switcher-text.switcher-text2 {
    border-radius: 0 45px 45px 0;
  }
}
.fxt-template-layout5 .fxt-btn-fill {
  font-family: 'Roboto', sans-serif;
  cursor: pointer;
  display: inline-block;
  font-size: 17px;
  font-weight: 500;
  -webkit-box-shadow: none;
  box-shadow: none;
  outline: none;
  border: 0;
  color: #fff;
  border-radius: 45px;
  background-color: #f6b22d;
  padding: 10px 36px;
  margin-bottom: 10px;
  margin-right: 10px;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.fxt-template-layout5 .fxt-btn-fill:hover {
  background-color: #ed693f;
  border-color: #ed693f;
}
.fxt-template-layout5 .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout5 .switcher-text3 {
  position: absolute;
  right: 0;
  top: 0;
  padding: 2px 0;
  color: #9f9f9f;
  font-size: 15px;
  margin-top: 5px;
  display: block;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.fxt-template-layout5 .switcher-text3:last-child {
  margin-right: 0;
}
.fxt-template-layout5 .switcher-text3:hover {
  color: #666;
}
.fxt-template-layout5 .switcher-text3.active {
  color: #666;
}
.fxt-template-layout5 ul.fxt-socials {
  text-align: center;
  margin-bottom: 30px;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout5 ul.fxt-socials {
    margin-bottom: 10px;
  }
}
.fxt-template-layout5 ul.fxt-socials li {
  display: inline-block;
  margin-right: 4px;
  margin-bottom: 5px;
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout5 ul.fxt-socials li {
    margin-right: 2px;
  }
}
.fxt-template-layout5 ul.fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout5 ul.fxt-socials li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-size: 14px;
  height: 40px;
  width: 40px;
  color: #ffffff;
  border-radius: 50%;
  border: 1px solid;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.fxt-template-layout5 ul.fxt-socials li.fxt-facebook a {
  background-color: #ed693f;
  border-color: #ed693f;
}
.fxt-template-layout5 ul.fxt-socials li.fxt-facebook a:hover {
  background-color: transparent;
  color: #ed693f;
}
.fxt-template-layout5 ul.fxt-socials li.fxt-twitter a {
  background-color: #00acee;
  border-color: #00acee;
}
.fxt-template-layout5 ul.fxt-socials li.fxt-twitter a:hover {
  background-color: transparent;
  color: #00acee;
}
.fxt-template-layout5 ul.fxt-socials li.fxt-google a {
  background-color: #CC3333;
  border-color: #CC3333;
}
.fxt-template-layout5 ul.fxt-socials li.fxt-google a:hover {
  background-color: transparent;
  color: #CC3333;
}
.fxt-template-layout5 ul.fxt-socials li.fxt-instagram a {
  background-color: #3f729b;
  border-color: #3f729b;
}
.fxt-template-layout5 ul.fxt-socials li.fxt-instagram a:hover {
  background-color: transparent;
  color: #3f729b;
}
.fxt-template-layout5 ul.fxt-socials li.fxt-linkedin a {
  background-color: #0077B5;
  border-color: #0077B5;
}
.fxt-template-layout5 ul.fxt-socials li.fxt-linkedin a:hover {
  background-color: transparent;
  color: #0077B5;
}
.fxt-template-layout5 ul.fxt-socials li.fxt-pinterest a {
  background-color: #bd081c;
  border-color: #bd081c;
}
.fxt-template-layout5 ul.fxt-socials li.fxt-pinterest a:hover {
  background-color: transparent;
  color: #bd081c;
}
.fxt-template-layout5 .checkbox {
  padding-left: 5px;
  margin-bottom: 10px;
}
.fxt-template-layout5 .checkbox label {
  padding-left: 20px;
  color: #a4a4a4;
  margin-bottom: 0;
  font-size: 15px;
  position: relative;
}
.fxt-template-layout5 .checkbox label:before {
  content: "";
  position: absolute;
  width: 16px;
  height: 16px;
  top: 4px;
  left: 0;
  margin-left: -5px;
  border: 1px solid;
  border-color: #dcdcdc;
  border-radius: 3px;
  background-color: #fff;
  -webkit-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
  -o-transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
  transition: border 0.15s ease-in-out, color 0.15s ease-in-out;
}
.fxt-template-layout5 .checkbox label:after {
  position: absolute;
  margin-left: -20px;
  padding-left: 3px;
  font-size: 10px;
  color: #555555;
}
.fxt-template-layout5 .checkbox input[type="checkbox"] {
  display: none;
}
.fxt-template-layout5 .checkbox input[type="checkbox"]:checked + label::after {
  font-family: 'Font Awesome 5 Free';
  content: "\f00c";
  font-weight: 900;
  color: #ffffff;
  left: 15px;
  top: 4px;
}
.fxt-template-layout5 .checkbox input[type="checkbox"]:checked + label::before {
  background-color: #0e9d88;
  border-color: #0e9d88;
}
.fxt-template-layout5 .fxt-footer {
  text-align: center;
}


.fxt-btn-fillp {
  font-family: 'Roboto', sans-serif;
  cursor: pointer;
  display: inline-block;
  font-size: 17px;
  font-weight: 500;
  -webkit-box-shadow: none;
  box-shadow: none;
  outline: none;
  border: 0;
  color: #141514;
  border-radius: 45px;
  background-color: #aeb0ad;
  padding: 10px 36px;
  margin-bottom: 10px;
  margin-right: 10px;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.fxt-btn-fillp:hover {
  background-color: #aeb0ad;
  border-color: #aeb0ad;
}
.fxt-btn-fillp:focus {
  outline: none;
}

.fxt-btn-fills {
  font-family: 'Roboto', sans-serif;
  cursor: pointer;
  display: inline-block;
  font-size: 17px;
  font-weight: 500;
  -webkit-box-shadow: none;
  box-shadow: none;
  outline: none;
  border: 0;
  color: #fff;
  border-radius: 45px;
  background-color: #f6b22d;
  padding: 10px 36px;
  margin-bottom: 10px;
  margin-right: 10px;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.fxt-btn-fills:hover {
  background-color: #ed693f;
  border-color: #ed693f;
}
.fxt-btn-fills:focus {
  outline: none;
}


.language-selector {
  position: fixed;
  bottom: 20px; /* Ajustez selon votre préférence */
  left: 20px; /* Ajustez selon votre préférence */
  z-index: 999; /* Assure que l'élément reste au-dessus du contenu de la page */
}

/* Styles pour le sélecteur de langue */
.language-selector select {
  padding: 8px 12px;
  font-size: 16px;
  border: 2px solid #ccc;
  border-radius: 5px;
  background-color: #fff;
  color: #333;
  appearance: none; /* Supprime les styles par défaut du navigateur */
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}