1#@!#!123s

: / home3 / encodto1 / sankalpstudycircle.com / sankalp /
Filename : style.css
back
/**************************************

Template Name: Muliyo | Multipurpose Coming Soon HTML Template
Template URL: http://html.affixtheme.com/html/Muliyo
Description:  Multipurpose Coming Soon HTML Template
Author: AffixTheme
Author URL: https://themeforest.net/user/affixtheme
Version: 1.1 

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


**************************************/
/*=======================================================================
1. Typography
=========================================================================*/
html {
  height: 100%;
}
body {
  font-size: 16px;
  font-family: 'Open Sans', sans-serif;
  font-weight: 400;
  height: 100%;
  line-height: 1.8;
  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: 'Raleway', 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: 52px;
  line-height: 76px;
}
@media only screen and (max-width: 1439px) {
  h1 {
    font-size: 46px;
    line-height: 70px;
  }
}
@media only screen and (max-width: 1199px) {
  h1 {
    font-size: 40px;
    line-height: 62px;
  }
}
@media only screen and (max-width: 991px) {
  h1 {
    font-size: 36px;
    line-height: 56px;
  }
}
@media only screen and (max-width: 767px) {
  h1 {
    font-size: 32px;
    line-height: 50px;
  }
}
@media only screen and (max-width: 575px) {
  h1 {
    font-size: 28px;
    line-height: 44px;
  }
}
@media only screen and (max-width: 479px) {
  h1 {
    font-size: 26px;
    line-height: 40px;
  }
}
h2 {
  font-size: 26px;
}
@media only screen and (max-width: 1199px) {
  h2 {
    font-size: 24px;
  }
}
@media only screen and (max-width: 991px) {
  h2 {
    font-size: 22px;
  }
}
@media only screen and (max-width: 767px) {
  h2 {
    font-size: 20px;
  }
}
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;
  }
}
/*=======================================================================
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;
}
.full-width.container-fluid {
  padding-left: 0;
  padding-right: 0;
}
body .wrapper {
  position: relative;
  z-index: 1;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease-in-out;
}
body.loaded .wrapper {
  opacity: 1;
  visibility: visible;
}
/*========================================================================
3. Preloader Style
=========================================================================*/
.pace.pace-inactive {
  display: none;
}
.pace {
  -webkit-pointer-events: none;
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  z-index: 2000;
  position: fixed;
  background-color: #ffffff;
  height: 100%;
  width: 100%;
  margin: auto;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.pace .pace-activity {
  z-index: 100;
  position: absolute;
  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;
  text-align: center;
  top: 50%;
  left: 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
  -ms-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
}
.pace .pace-progress {
  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;
  text-align: center;
  z-index: 2000;
  position: absolute;
  top: 50%;
  left: 50%;
  height: 80px;
  width: 80px;
  border-radius: 50%;
  line-height: 80px;
  -webkit-transform: translate3d(0, 0, 0) translateY(-50%) translateX(-50%) !important;
  -ms-transform: translate3d(0, 0, 0) translateY(-50%) translateX(-50%) !important;
  transform: translate3d(0, 0, 0) translateY(-50%) translateX(-50%) !important;
}
.pace .pace-progress:after {
  content: "";
  animation: rotateZ 1.5s infinite linear;
  border-top: 8px solid #707070;
  border-bottom: 8px solid #707070;
  border-left: 1px solid #707070;
  border-right: 1px solid #707070;
  height: 80px;
  border-radius: 50%;
  width: 80px;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 999999;
}
.pace .pace-progress:before {
  content: attr(data-progress-text);
  text-align: center;
  color: #000;
  font-size: 18px;
  font-weight: 700;
  display: block;
  z-index: 999;
  position: absolute;
}
@keyframes rotateZ {
  to {
    transform: rotateZ(360deg);
  }
}
/*========================================================================
4. Subscribe Form Style
=========================================================================*/
.modal .modal-dialog {
  max-width: 660px;
  padding: 0 15px;
}
.modal .modal-dialog .modal-content {
  border-radius: 5px;
  border: none;
  background-color: #ffffff;
  box-shadow: 0 0 59px 0 rgba(0, 0, 0, 0.1);
}
.modal .modal-dialog .modal-content .modal-header {
  border-bottom: none;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 22;
  padding: 0;
}
.modal .modal-dialog .modal-content .modal-header button {
  font-size: 40px;
  font-weight: 300;
  margin-right: 0;
  padding: 15px 20px;
  line-height: 1;
  background-color: transparent;
  border: 0;
  transition: all 0.3s ease-in-out;
}
.modal .modal-dialog .modal-content .modal-header button:focus {
  outline: none;
}
.modal .modal-dialog .modal-content .modal-header button:hover {
  color: #f11e47;
}
.modal .modal-dialog .modal-content .modal-body {
  padding: 90px 110px;
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .modal .modal-dialog .modal-content .modal-body {
    padding: 70px 80px;
  }
}
@media only screen and (max-width: 575px) {
  .modal .modal-dialog .modal-content .modal-body {
    padding: 50px;
  }
}
@media only screen and (max-width: 479px) {
  .modal .modal-dialog .modal-content .modal-body {
    padding: 30px 15px;
  }
}
.modal .modal-dialog .modal-content .modal-body .notify-icon {
  display: inline-block;
  width: 15vw;
  margin-bottom: 40px;
  background: transparent;
  position: relative;
  transform-origin: 50% 0;
  animation: iconAnimate 3s ease-in-out forwards;
}
.modal .modal-dialog .modal-content .modal-body .item-title {
  font-size: 40px;
  font-weight: 600;
  color: #000;
  margin-bottom: 12px;
}
@media only screen and (max-width: 1199px) {
  .modal .modal-dialog .modal-content .modal-body .item-title {
    font-size: 36px;
  }
}
@media only screen and (max-width: 991px) {
  .modal .modal-dialog .modal-content .modal-body .item-title {
    font-size: 30px;
  }
}
@media only screen and (max-width: 767px) {
  .modal .modal-dialog .modal-content .modal-body .item-title {
    font-size: 28px;
  }
}
@media only screen and (max-width: 575px) {
  .modal .modal-dialog .modal-content .modal-body .item-title {
    font-size: 26px;
  }
}
@media only screen and (max-width: 479px) {
  .modal .modal-dialog .modal-content .modal-body .item-title {
    font-size: 24px;
  }
}
.modal .modal-dialog .modal-content .modal-body p {
  color: #000;
  line-height: 30px;
  margin-bottom: 40px;
}
.modal .modal-dialog .modal-content .modal-body .subscribe-form {
  position: relative;
  z-index: 1;
}
.modal .modal-dialog .modal-content .modal-body .subscribe-form .input-group .item-icon {
  position: absolute;
  top: 20px;
  left: 25px;
  line-height: 1;
  z-index: 5;
  color: #949494;
}
@media only screen and (max-width: 575px) {
  .modal .modal-dialog .modal-content .modal-body .subscribe-form .input-group .item-icon {
    top: 16px;
  }
}
.modal .modal-dialog .modal-content .modal-body .subscribe-form .input-group .item-icon:focus {
  outline: none;
}
.modal .modal-dialog .modal-content .modal-body .subscribe-form .input-group .form-control {
  margin-bottom: 15px;
  border: 1px solid #bcbcbc;
  height: 55px;
  width: 100%;
  background-color: transparent;
  font-size: 17px;
  color: #111111;
  padding: 10px 10px 10px 55px;
  border-radius: 45px;
}
@media only screen and (max-width: 575px) {
  .modal .modal-dialog .modal-content .modal-body .subscribe-form .input-group .form-control {
    height: 50px;
  }
}
.modal .modal-dialog .modal-content .modal-body .subscribe-form .input-group .form-control:focus {
  outline: none;
  box-shadow: none;
  z-index: 0;
}
.modal .modal-dialog .modal-content .modal-body .subscribe-form .input-group input::-webkit-input-placeholder {
  color: #7e7e7e;
  font-weight: 300;
}
.modal .modal-dialog .modal-content .modal-body .subscribe-form .input-group input::-moz-placeholder {
  color: #7e7e7e;
  font-weight: 300;
}
.modal .modal-dialog .modal-content .modal-body .subscribe-form .input-group input:-moz-placeholder {
  color: #7e7e7e;
  font-weight: 300;
}
.modal .modal-dialog .modal-content .modal-body .subscribe-form .input-group input:-ms-input-placeholder {
  color: #7e7e7e;
  font-weight: 300;
}
.modal .modal-dialog .modal-content .modal-body .subscribe-form .input-group .input-group-addon {
  display: block;
  width: 100%;
}
.modal .modal-dialog .modal-content .modal-body .subscribe-form .input-group .input-group-addon button {
  cursor: pointer;
  display: inline-block;
  font-size: 24px;
  font-weight: 600;
  color: #ffffff;
  border: 0;
  box-shadow: none;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 5px 40px 7px;
  width: 100%;
  font-family: 'Open Sans', sans-serif;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 575px) {
  .modal .modal-dialog .modal-content .modal-body .subscribe-form .input-group .input-group-addon button {
    font-size: 20px;
    padding: 6px 40px 8px;
  }
}
.modal .modal-dialog .modal-content .modal-body .subscribe-form .input-group .input-group-addon button:focus {
  outline: none;
}
.modal .modal-dialog .modal-content .modal-body .subscribe-form .input-group .input-group-addon button:hover {
  background-color: #d60c34;
}
.modal .modal-dialog .modal-content .modal-body .subscribe-form .form-result {
  display: block;
  padding: 0.78rem 1.25rem;
  margin-top: 15px;
  margin-bottom: 0;
  width: 100%;
  border-radius: 45px;
}
@media only screen and (max-width: 575px) {
  .modal .modal-dialog .modal-content .modal-body .subscribe-form .form-result {
    font-size: 14px;
    padding: 0.6rem;
  }
}
.modal-backdrop {
  z-index: -1;
}
@keyframes iconAnimate {
  0% {
    transform: rotate(0deg);
  }
  30% {
    transform: rotate(-30deg);
  }
  70% {
    transform: rotate(20deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
/*========================================================================
5. Sidebar Content Style
=========================================================================*/
body .fxt-page-content {
  background-color: #fff;
  height: 100%;
  min-width: 50vw;
  overflow-y: scroll;
  box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.1);
  position: absolute;
  z-index: 5;
  top: 0;
  left: 100%;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  body .fxt-page-content {
    position: relative;
    left: inherit;
    min-width: 100vw;
    max-height: inherit;
  }
}
body .fxt-page-content .content-heading .content-title {
  font-weight: 700;
  padding: 5px 10px 3px 0;
  display: inline-block;
  position: relative;
  z-index: 1;
}
body .fxt-page-content .content-heading .content-title:before {
  content: "";
  background-color: rgba(241, 30, 71, 0.1);
  height: 100%;
  width: 70%;
  top: 0;
  right: 0;
  position: absolute;
  z-index: -1;
}
body .fxt-about-wrap {
  overflow: hidden;
  padding: 80px 65px 83px;
}
@media only screen and (max-width: 1439px) {
  body .fxt-about-wrap {
    padding: 80px 60px 83px;
  }
}
@media only screen and (max-width: 991px) {
  body .fxt-about-wrap {
    padding: 70px 50px 73px;
  }
}
@media only screen and (max-width: 767px) {
  body .fxt-about-wrap {
    padding: 60px 40px 63px;
  }
}
@media only screen and (max-width: 575px) {
  body .fxt-about-wrap {
    padding: 50px 30px 53px;
  }
}
body .fxt-about-wrap .content-heading {
  margin-bottom: 0;
}
body .fxt-about-wrap .content-heading .content-paragraph {
  margin-bottom: 0;
}
body .fxt-project-wrap {
  overflow: hidden;
  background-color: #f8f8f8;
  padding: 80px 0 0;
}
@media only screen and (max-width: 991px) {
  body .fxt-project-wrap {
    padding: 70px 0 0;
  }
}
@media only screen and (max-width: 767px) {
  body .fxt-project-wrap {
    padding: 60px 0 0;
  }
}
@media only screen and (max-width: 575px) {
  body .fxt-project-wrap {
    padding: 50px 0 0;
  }
}
body .fxt-project-wrap .content-heading {
  padding: 0 65px;
  margin-bottom: 45px;
}
@media only screen and (max-width: 1439px) {
  body .fxt-project-wrap .content-heading {
    padding: 0 60px;
  }
}
@media only screen and (max-width: 991px) {
  body .fxt-project-wrap .content-heading {
    padding: 0 50px;
  }
}
@media only screen and (max-width: 767px) {
  body .fxt-project-wrap .content-heading {
    padding: 0 40px;
  }
}
@media only screen and (max-width: 575px) {
  body .fxt-project-wrap .content-heading {
    padding: 0 30px;
  }
}
@media only screen and (max-width: 767px) {
  body .fxt-project-wrap .content-heading {
    margin-bottom: 35px;
  }
}
body .fxt-project-box {
  transition: all 0.3s ease-in-out;
  overflow: hidden;
}
body .fxt-project-box .popup-triger {
  position: relative;
  z-index: 1;
  display: block;
  overflow: hidden;
}
body .fxt-project-box .popup-triger:before {
  position: absolute;
  z-index: 0;
  content: "";
  height: 100%;
  width: 100%;
  top: 100%;
  left: 0;
  top: 0;
  opacity: 0;
  visibility: hidden;
  background-color: rgba(0, 0, 0, 0.5);
  transition: cubic-bezier(0, 1, 1, 1) 0.8s;
}
body .fxt-project-box .popup-triger img {
  position: relative;
  z-index: -1;
  transform: scale(1.01);
  transition: cubic-bezier(0, 1, 1, 1) 0.8s;
}
body .fxt-project-box:hover .popup-triger:before {
  opacity: 1;
  visibility: visible;
}
body .fxt-project-box:hover .popup-triger img {
  transform: scale(1.2);
}
body .fxt-contact-wrap {
  overflow: hidden;
  padding: 80px 65px;
}
@media only screen and (max-width: 1439px) {
  body .fxt-contact-wrap {
    padding: 80px 60px;
  }
}
@media only screen and (max-width: 991px) {
  body .fxt-contact-wrap {
    padding: 70px 50px;
  }
}
@media only screen and (max-width: 767px) {
  body .fxt-contact-wrap {
    padding: 60px 40px;
  }
}
@media only screen and (max-width: 575px) {
  body .fxt-contact-wrap {
    padding: 50px 30px;
  }
}
body .fxt-contact-wrap .content-heading {
  margin-bottom: 30px;
}
@media only screen and (max-width: 767px) {
  body .fxt-contact-wrap .content-heading {
    margin-bottom: 20px;
  }
}
body .fxt-address-wrap {
  margin-bottom: 20px;
}
body .fxt-address-wrap .fxt-address-box {
  margin-bottom: 20px;
}
body .fxt-address-wrap .fxt-address-box .item-icon i:before {
  margin-left: 0;
  font-size: 40px;
  color: #f11e47;
}
@media only screen and (max-width: 991px) {
  body .fxt-address-wrap .fxt-address-box .item-icon i:before {
    font-size: 36px;
  }
}
@media only screen and (max-width: 767px) {
  body .fxt-address-wrap .fxt-address-box .item-icon i:before {
    font-size: 30px;
  }
}
body .fxt-address-wrap .fxt-address-box .item-content {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}
body .fxt-address-wrap .fxt-address-box .item-content .item-title {
  font-weight: 700;
  margin-bottom: 0;
}
body .fxt-address-wrap .fxt-address-box .item-content .item-text {
  color: #666666;
}
body .fxt-form-wrap .form-group {
  margin-bottom: 30px;
}
@media only screen and (max-width: 991px) {
  body .fxt-form-wrap .form-group {
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  body .fxt-form-wrap .form-group {
    margin-bottom: 15px;
  }
}
body .fxt-form-wrap .form-group:last-child {
  margin-bottom: 0;
}
body .fxt-form-wrap .form-group .form-control {
  border: 1px solid #dddddd;
  border-radius: 5px;
  background-color: transparent;
  padding: 10px 20px;
  font-size: 15px;
  color: #111;
}
@media only screen and (max-width: 991px) {
  body .fxt-form-wrap .form-group .form-control {
    font-size: 14px;
  }
}
@media only screen and (max-width: 767px) {
  body .fxt-form-wrap .form-group .form-control {
    font-size: 13px;
  }
}
body .fxt-form-wrap .form-group .form-control:focus {
  outline: none;
  box-shadow: none;
}
body .fxt-form-wrap .form-group input {
  height: 50px;
}
@media only screen and (max-width: 991px) {
  body .fxt-form-wrap .form-group input {
    height: 45px;
  }
}
@media only screen and (max-width: 767px) {
  body .fxt-form-wrap .form-group input {
    height: 40px;
  }
}
body .fxt-form-wrap .form-group input.form-control::-webkit-input-placeholder,
body .fxt-form-wrap .form-group textarea.form-control::-webkit-input-placeholder {
  color: #666666;
}
body .fxt-form-wrap .form-group input.form-control::-moz-placeholder,
body .fxt-form-wrap .form-group textarea.form-control::-moz-placeholder {
  color: #666666;
}
body .fxt-form-wrap .form-group input.form-control:-moz-placeholder,
body .fxt-form-wrap .form-group textarea.form-control:-moz-placeholder {
  color: #666666;
}
body .fxt-form-wrap .form-group input.form-control:-ms-input-placeholder,
body .fxt-form-wrap .form-group textarea.form-control:-ms-input-placeholder {
  color: #666666;
}
body .fxt-form-wrap .form-group .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  font-family: 'Roboto', sans-serif;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 991px) {
  body .fxt-form-wrap .form-group .fxt-btn-fill {
    margin-top: 10px;
  }
}
@media only screen and (max-width: 767px) {
  body .fxt-form-wrap .form-group .fxt-btn-fill {
    margin-top: 5px;
    font-size: 14px;
    padding: 11px 30px;
  }
}
@media only screen and (max-width: 575px) {
  body .fxt-form-wrap .form-group .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
  }
}
body .fxt-form-wrap .form-group .fxt-btn-fill:hover {
  background-color: #d60c34;
}
body .fxt-form-wrap .form-group .fxt-btn-fill:focus {
  outline: none;
}
body .fxt-form-wrap .form-response .alert-danger,
body .fxt-form-wrap .form-response .alert.alert-info,
body .fxt-form-wrap .form-response .alert.alert-success {
  margin-bottom: 0;
  padding: 10px 25px;
  border-radius: 45px;
  display: inline-block;
  font-size: 14px;
}
@media only screen and (max-width: 575px) {
  body .fxt-form-wrap .form-response .alert-danger,
  body .fxt-form-wrap .form-response .alert.alert-info,
  body .fxt-form-wrap .form-response .alert.alert-success {
    padding: 9px 25px;
  }
}
body .fxt-form-wrap .form-response .alert-danger p,
body .fxt-form-wrap .form-response .alert.alert-info p,
body .fxt-form-wrap .form-response .alert.alert-success p {
  margin-bottom: 0;
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-page-content {
    left: 50%;
  }
}
body .ofcanvas-triger {
  position: absolute;
  z-index: 2;
  right: 7vw;
  display: block;
  top: 15vh;
  padding: 10px 7px;
  cursor: pointer;
  transition: all 0.8s ease-in-out;
  transition-delay: 0.1s;
}
@media only screen and (max-width: 991px) {
  body .ofcanvas-triger {
    display: none;
  }
}
body .ofcanvas-triger .bar {
  background-color: #fff;
  height: 2px;
  width: 30px;
  display: block;
  margin-bottom: 5px;
  transition: all 0.3s ease-in-out;
  transition-delay: 0.8s;
}
body .ofcanvas-triger .bar:nth-child(2),
body .ofcanvas-triger .bar:nth-child(3) {
  width: 25px;
  margin-left: 5px;
}
body .ofcanvas-triger .bar:last-child {
  margin-bottom: 0;
}
body .ofcanvas-triger.triger-btn-dark .bar {
  background-color: #000;
}
body .ofcanvas-triger.btn-top16 {
  top: 16vh;
}
body .ofcanvas-triger.btn-top15 {
  top: 15vh;
}
body .ofcanvas-triger.btn-top14 {
  top: 14vh;
}
body .ofcanvas-triger.btn-top13 {
  top: 13vh;
}
body .ofcanvas-triger.btn-top12 {
  top: 12vh;
}
body .ofcanvas-triger.btn-top11 {
  top: 11vh;
}
body .ofcanvas-triger.btn-top10 {
  top: 10vh;
}
body .ofcanvas-triger.btn-top9 {
  top: 9vh;
}
body.open-sidebar .ofcanvas-triger {
  transform: translateX(calc(-50vw + 60px));
  transition-delay: 0s;
}
body.open-sidebar .ofcanvas-triger .bar:nth-child(2),
body.open-sidebar .ofcanvas-triger .bar:nth-child(3) {
  opacity: 0;
}
body.open-sidebar .ofcanvas-triger .bar:nth-child(1) {
  -webkit-transform: rotate(45deg) translate(7px, 7px);
  -ms-transform: rotate(45deg) translate(7px, 7px);
  transform: rotate(45deg) translate(7px, 7px);
}
body.open-sidebar .ofcanvas-triger .bar:nth-child(4) {
  -webkit-transform: rotate(-45deg) translate(8px, -8px);
  -ms-transform: rotate(-45deg) translate(8px, -8px);
  transform: rotate(-45deg) translate(8px, -8px);
}
/*========================================================================
6. Demo Layout One
=========================================================================*/
.fxt-template-layout1 {
  display: flex;
  align-items: flex-start;
  min-height: 100vh;
  min-width: 100vw;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout1 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout1 .fxt-main-content {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 100vh;
  min-width: 100vw;
  position: relative;
  z-index: 1;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout1 .fxt-main-content {
    min-width: 100%;
  }
}
.fxt-template-layout1 .fxt-main-content:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.1);
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.fxt-template-layout1 .fxt-main-content .fxt-overlay {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.fxt-template-layout1 .fxt-main-content .fxt-inner-content {
  padding: 65px 15px;
  max-width: 50vw;
  min-height: 100vh;
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout1 .fxt-main-content .fxt-inner-content {
    max-width: inherit;
    min-width: 100%;
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout1 .fxt-main-content .fxt-inner-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout1 .fxt-main-content .fxt-inner-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout1 .fxt-main-content .fxt-logo {
  max-width: 40vw;
  margin-top: 25px;
  margin-bottom: 14vh;
}
.fxt-template-layout1 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 30px;
  margin-bottom: 5px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout1 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout1 .fxt-main-content .fxt-sub-title {
    font-size: 24px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout1 .fxt-main-content .fxt-sub-title {
    font-size: 22px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout1 .fxt-main-content .fxt-sub-title {
    font-size: 20px;
  }
}
.fxt-template-layout1 .fxt-main-content .fxt-main-title {
  color: #fff;
  font-weight: 700;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout1 .fxt-main-content .fxt-main-title {
    width: 95%;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout1 .fxt-main-content .fxt-main-title {
    width: 100%;
  }
}
.fxt-template-layout1 .fxt-main-content .fxt-paragraph {
  color: #d8d8d8;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 70px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout1 .fxt-main-content .fxt-paragraph {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout1 .fxt-main-content .fxt-paragraph {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout1 .fxt-main-content .fxt-paragraph {
    width: 80%;
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout1 .fxt-main-content .fxt-paragraph {
    width: 100%;
    margin-bottom: 30px;
  }
}
.fxt-template-layout1 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout1 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout1 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout1 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout1 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout1 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout1 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout1 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout1 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout1 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout1 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout1 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout1 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout1 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout1 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout1 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout1 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout1 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout1 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout1 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout1 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout1 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout1 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout1 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: #222323;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout1 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout1 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout1 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout1 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout1 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout1 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout1 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout1 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout1 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout1 .fxt-main-content {
    min-width: 50vw;
  }
  body.open-sidebar .fxt-template-layout1 .fxt-main-content .fxt-inner-content {
    max-width: 50vw;
  }
}
/*========================================================================
7. Demo Layout Two
=========================================================================*/
.fxt-template-layout2 {
  display: flex;
  align-items: flex-start;
  min-height: 100vh;
  min-width: 100vw;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout2 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout2 .fxt-main-content {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 100vh;
  min-width: 100vw;
  position: relative;
  z-index: 1;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout2 .fxt-main-content {
    min-width: 100%;
  }
}
.fxt-template-layout2 .fxt-main-content:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.1);
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.fxt-template-layout2 .fxt-main-content .fxt-overlay {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
.fxt-template-layout2 .fxt-main-content .fxt-inner-content {
  padding: 65px 15px;
  max-width: 50vw;
  min-height: 100vh;
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout2 .fxt-main-content .fxt-inner-content {
    max-width: inherit;
    min-width: 100%;
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout2 .fxt-main-content .fxt-inner-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout2 .fxt-main-content .fxt-inner-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout2 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout2 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 46px;
  font-family: 'Raleway', sans-serif;
  letter-spacing: 8px;
  margin-bottom: 25px;
  line-height: 1.4;
  margin-left: 8px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout2 .fxt-main-content .fxt-sub-title {
    font-size: 40px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout2 .fxt-main-content .fxt-sub-title {
    font-size: 36px;
    letter-spacing: 6px;
    line-height: 1.6;
    margin-left: 6px;
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout2 .fxt-main-content .fxt-sub-title {
    font-size: 32px;
    letter-spacing: 4px;
    line-height: 1.5;
    margin-left: 4px;
    margin-bottom: 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout2 .fxt-main-content .fxt-sub-title {
    font-size: 28px;
    letter-spacing: 2px;
    line-height: 1.4;
    margin-left: 2px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout2 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
    line-height: 1.3;
  }
}
.fxt-template-layout2 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout2 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout2 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout2 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout2 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout2 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout2 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout2 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout2 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout2 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout2 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout2 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout2 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout2 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout2 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout2 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout2 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout2 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout2 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout2 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout2 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout2 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout2 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout2 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: #222323;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout2 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout2 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout2 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout2 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout2 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout2 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout2 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout2 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout2 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
.fxt-template-layout2 .fxt-countdown {
  margin-bottom: 70px;
  padding-bottom: 50px;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout2 .fxt-countdown {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout2 .fxt-countdown {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout2 .fxt-countdown {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout2 .fxt-countdown {
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout2 .fxt-countdown {
    margin-bottom: 20px;
  }
}
.fxt-template-layout2 .fxt-countdown .countdown-section {
  display: inline-block;
  min-width: 70px;
  margin-right: 35px;
  padding-right: 35px;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section {
    margin-right: 30px;
    padding-right: 30px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section {
    margin-right: 25px;
    padding-right: 25px;
    min-width: 65px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section {
    margin-right: 20px;
    padding-right: 20px;
    min-width: 60px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section {
    min-width: 55px;
    margin-right: 15px;
    padding-right: 15px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section {
    min-width: 45px;
    margin-right: 10px;
    padding-right: 10px;
  }
}
.fxt-template-layout2 .fxt-countdown .countdown-section > div {
  position: relative;
  z-index: 1;
}
.fxt-template-layout2 .fxt-countdown .countdown-section:before {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 16px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section:before {
    top: 15px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section:before {
    top: 13px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section:before {
    top: 11px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section:before {
    top: 10px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section:before {
    top: 8px;
    right: -3px;
  }
}
.fxt-template-layout2 .fxt-countdown .countdown-section:after {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 38px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section:after {
    top: 43px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section:after {
    top: 38px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section:after {
    top: 32px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section:after {
    top: 28px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section:after {
    top: 23px;
    right: -3px;
  }
}
.fxt-template-layout2 .fxt-countdown .countdown-section:last-child {
  margin-right: 0;
  padding-right: 0;
}
.fxt-template-layout2 .fxt-countdown .countdown-section:last-child:after,
.fxt-template-layout2 .fxt-countdown .countdown-section:last-child:before {
  display: none;
}
.fxt-template-layout2 .fxt-countdown .countdown-section .countdown-number {
  font-size: 60px;
  line-height: 1;
  font-weight: 600;
  color: #ffffff;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section .countdown-number {
    font-size: 56px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section .countdown-number {
    font-size: 48px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section .countdown-number {
    font-size: 42px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section .countdown-number {
    font-size: 36px;
  }
}
.fxt-template-layout2 .fxt-countdown .countdown-section .countdown-unit {
  color: #d8d8d8;
  position: absolute;
  z-index: 1;
  bottom: -50px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 22px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 20px;
    bottom: -45px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 18px;
    bottom: -40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 16px;
    bottom: -35px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout2 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 15px;
    bottom: -30px;
  }
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout2 .fxt-main-content {
    min-width: 50vw;
  }
  body.open-sidebar .fxt-template-layout2 .fxt-main-content .fxt-inner-content {
    max-width: 50vw;
  }
}
/*========================================================================
8. Demo Layout Three
=========================================================================*/
.fxt-template-layout3 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout3 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout3 .fxt-main-content {
  min-height: 100vh;
  min-width: 100vw;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout3 .fxt-main-content {
    min-width: 100%;
  }
}
.fxt-template-layout3 .fxt-main-content .fxt-inner-content {
  padding: 65px 0;
  min-height: 100vh;
  width: 100%;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  background-color: rgba(0, 0, 0, 0.55);
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout3 .fxt-main-content .fxt-inner-content {
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout3 .fxt-main-content .fxt-inner-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout3 .fxt-main-content .fxt-inner-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout3 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout3 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 30px;
  margin-bottom: 5px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout3 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout3 .fxt-main-content .fxt-sub-title {
    font-size: 24px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout3 .fxt-main-content .fxt-sub-title {
    font-size: 22px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout3 .fxt-main-content .fxt-sub-title {
    font-size: 20px;
  }
}
.fxt-template-layout3 .fxt-main-content .fxt-main-title {
  color: #fff;
  font-weight: 700;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout3 .fxt-main-content .fxt-main-title {
    width: 95%;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout3 .fxt-main-content .fxt-main-title {
    width: 100%;
  }
}
.fxt-template-layout3 .fxt-main-content .fxt-paragraph {
  color: #d8d8d8;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 70px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout3 .fxt-main-content .fxt-paragraph {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout3 .fxt-main-content .fxt-paragraph {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout3 .fxt-main-content .fxt-paragraph {
    width: 80%;
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout3 .fxt-main-content .fxt-paragraph {
    width: 100%;
    margin-bottom: 30px;
  }
}
.fxt-template-layout3 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout3 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout3 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout3 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout3 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout3 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout3 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout3 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout3 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout3 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout3 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout3 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout3 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout3 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout3 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout3 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout3 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout3 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout3 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout3 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout3 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout3 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout3 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout3 .fxt-main-content .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: 16px;
  border: 1px solid;
  border-color: #aaaaaa;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: transparent;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout3 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout3 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
  border-color: #3b5998;
}
.fxt-template-layout3 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
  border-color: #00acee;
}
.fxt-template-layout3 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
  border-color: #CC3333;
}
.fxt-template-layout3 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
  border-color: #3f729b;
}
.fxt-template-layout3 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
  border-color: #0077B5;
}
.fxt-template-layout3 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
  border-color: #c4302b;
}
.fxt-template-layout3 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
  border-color: #bd081c;
}
.fxt-template-layout3 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout3 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
  }
}
/*========================================================================
9. Demo Layout Four
=========================================================================*/
.fxt-template-layout4 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout4 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout4 .fxt-main-content {
  min-height: 100vh;
  min-width: 100vw;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout4 .fxt-main-content {
    min-width: 100%;
  }
}
.fxt-template-layout4 .fxt-main-content .fxt-inner-content {
  padding: 65px 0;
  min-height: 100vh;
  width: 100%;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  background-color: rgba(0, 0, 0, 0.55);
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout4 .fxt-main-content .fxt-inner-content {
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout4 .fxt-main-content .fxt-inner-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout4 .fxt-main-content .fxt-inner-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout4 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout4 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 46px;
  font-family: 'Raleway', sans-serif;
  letter-spacing: 8px;
  margin-bottom: 25px;
  line-height: 1.4;
  margin-left: 8px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout4 .fxt-main-content .fxt-sub-title {
    font-size: 40px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout4 .fxt-main-content .fxt-sub-title {
    font-size: 36px;
    letter-spacing: 6px;
    line-height: 1.6;
    margin-left: 6px;
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout4 .fxt-main-content .fxt-sub-title {
    font-size: 32px;
    letter-spacing: 4px;
    line-height: 1.5;
    margin-left: 4px;
    margin-bottom: 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout4 .fxt-main-content .fxt-sub-title {
    font-size: 28px;
    letter-spacing: 2px;
    line-height: 1.4;
    margin-left: 2px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout4 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
    line-height: 1.3;
  }
}
.fxt-template-layout4 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout4 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout4 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout4 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout4 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout4 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout4 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout4 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout4 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout4 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout4 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout4 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout4 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout4 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout4 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout4 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout4 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout4 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout4 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout4 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout4 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout4 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout4 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout4 .fxt-main-content .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: 16px;
  border: 1px solid;
  border-color: #aaaaaa;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: transparent;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout4 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout4 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
  border-color: #3b5998;
}
.fxt-template-layout4 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
  border-color: #00acee;
}
.fxt-template-layout4 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
  border-color: #CC3333;
}
.fxt-template-layout4 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
  border-color: #3f729b;
}
.fxt-template-layout4 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
  border-color: #0077B5;
}
.fxt-template-layout4 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
  border-color: #c4302b;
}
.fxt-template-layout4 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
  border-color: #bd081c;
}
.fxt-template-layout4 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
.fxt-template-layout4 .fxt-countdown {
  margin-bottom: 70px;
  padding-bottom: 50px;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout4 .fxt-countdown {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout4 .fxt-countdown {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout4 .fxt-countdown {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout4 .fxt-countdown {
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout4 .fxt-countdown {
    margin-bottom: 20px;
  }
}
.fxt-template-layout4 .fxt-countdown .countdown-section {
  display: inline-block;
  min-width: 70px;
  margin-right: 35px;
  padding-right: 35px;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section {
    margin-right: 30px;
    padding-right: 30px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section {
    margin-right: 25px;
    padding-right: 25px;
    min-width: 65px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section {
    margin-right: 20px;
    padding-right: 20px;
    min-width: 60px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section {
    min-width: 55px;
    margin-right: 15px;
    padding-right: 15px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section {
    min-width: 45px;
    margin-right: 10px;
    padding-right: 10px;
  }
}
.fxt-template-layout4 .fxt-countdown .countdown-section > div {
  position: relative;
  z-index: 1;
}
.fxt-template-layout4 .fxt-countdown .countdown-section:before {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 16px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section:before {
    top: 15px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section:before {
    top: 13px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section:before {
    top: 11px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section:before {
    top: 10px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section:before {
    top: 8px;
    right: -3px;
  }
}
.fxt-template-layout4 .fxt-countdown .countdown-section:after {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 38px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section:after {
    top: 43px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section:after {
    top: 38px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section:after {
    top: 32px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section:after {
    top: 28px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section:after {
    top: 23px;
    right: -3px;
  }
}
.fxt-template-layout4 .fxt-countdown .countdown-section:last-child {
  margin-right: 0;
  padding-right: 0;
}
.fxt-template-layout4 .fxt-countdown .countdown-section:last-child:after,
.fxt-template-layout4 .fxt-countdown .countdown-section:last-child:before {
  display: none;
}
.fxt-template-layout4 .fxt-countdown .countdown-section .countdown-number {
  font-size: 60px;
  line-height: 1;
  font-weight: 600;
  color: #ffffff;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section .countdown-number {
    font-size: 56px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section .countdown-number {
    font-size: 48px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section .countdown-number {
    font-size: 42px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section .countdown-number {
    font-size: 36px;
  }
}
.fxt-template-layout4 .fxt-countdown .countdown-section .countdown-unit {
  color: #d8d8d8;
  position: absolute;
  z-index: 1;
  bottom: -50px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 22px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 20px;
    bottom: -45px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 18px;
    bottom: -40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 16px;
    bottom: -35px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout4 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 15px;
    bottom: -30px;
  }
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout4 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
  }
}
/*========================================================================
10. Demo Layout Five
=========================================================================*/
.fxt-template-layout5 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout5 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout5 .fxt-video-background {
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  position: fixed;
}
.fxt-template-layout5 .fxt-video-background:before {
  content: "";
  position: absolute;
  z-index: 2;
  background-color: rgba(0, 0, 0, 0.4);
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.fxt-template-layout5 .fxt-video-background .fxt-video {
  height: 100%;
  width: 100%;
  position: absolute;
  z-index: 1;
}
.fxt-template-layout5 .fxt-main-content {
  padding: 65px 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 100vh;
  min-width: 100vw;
  max-width: 100vw;
  position: relative;
  z-index: 1;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout5 .fxt-main-content {
    min-width: 100%;
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout5 .fxt-main-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout5 .fxt-main-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout5 .fxt-main-content:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.2);
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.fxt-template-layout5 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout5 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 30px;
  margin-bottom: 5px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout5 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout5 .fxt-main-content .fxt-sub-title {
    font-size: 24px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout5 .fxt-main-content .fxt-sub-title {
    font-size: 22px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout5 .fxt-main-content .fxt-sub-title {
    font-size: 20px;
  }
}
.fxt-template-layout5 .fxt-main-content .fxt-main-title {
  color: #fff;
  font-weight: 600;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout5 .fxt-main-content .fxt-main-title {
    width: 95%;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout5 .fxt-main-content .fxt-main-title {
    width: 100%;
  }
}
.fxt-template-layout5 .fxt-main-content .fxt-paragraph {
  color: #d8d8d8;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 70px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout5 .fxt-main-content .fxt-paragraph {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout5 .fxt-main-content .fxt-paragraph {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout5 .fxt-main-content .fxt-paragraph {
    width: 80%;
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout5 .fxt-main-content .fxt-paragraph {
    width: 100%;
    margin-bottom: 30px;
  }
}
.fxt-template-layout5 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout5 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout5 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout5 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout5 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout5 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout5 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout5 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout5 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout5 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout5 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout5 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout5 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout5 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout5 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout5 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout5 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout5 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout5 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout5 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout5 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout5 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout5 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout5 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: #1f1f1f;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout5 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout5 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout5 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout5 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout5 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout5 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout5 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout5 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout5 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout5 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
  }
}
/*========================================================================
11. Demo Layout Six
=========================================================================*/
.fxt-template-layout6 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout6 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout6 .fxt-video-background {
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  position: fixed;
}
.fxt-template-layout6 .fxt-video-background:before {
  content: "";
  position: absolute;
  z-index: 2;
  background-color: rgba(0, 0, 0, 0.4);
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.fxt-template-layout6 .fxt-video-background .fxt-video {
  height: 100%;
  width: 100%;
  position: absolute;
  z-index: 1;
}
.fxt-template-layout6 .fxt-main-content {
  padding: 65px 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 100vh;
  min-width: 100vw;
  max-width: 100vw;
  position: relative;
  z-index: 1;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout6 .fxt-main-content {
    min-width: 100%;
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout6 .fxt-main-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout6 .fxt-main-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout6 .fxt-main-content:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.2);
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.fxt-template-layout6 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout6 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 46px;
  font-family: 'Raleway', sans-serif;
  letter-spacing: 8px;
  margin-bottom: 25px;
  line-height: 1.4;
  margin-left: 8px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout6 .fxt-main-content .fxt-sub-title {
    font-size: 40px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout6 .fxt-main-content .fxt-sub-title {
    font-size: 36px;
    letter-spacing: 6px;
    line-height: 1.6;
    margin-left: 6px;
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout6 .fxt-main-content .fxt-sub-title {
    font-size: 32px;
    letter-spacing: 4px;
    line-height: 1.5;
    margin-left: 4px;
    margin-bottom: 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout6 .fxt-main-content .fxt-sub-title {
    font-size: 28px;
    letter-spacing: 2px;
    line-height: 1.4;
    margin-left: 2px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout6 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
    line-height: 1.3;
  }
}
.fxt-template-layout6 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout6 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout6 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout6 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout6 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout6 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout6 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout6 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout6 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout6 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout6 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout6 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout6 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout6 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout6 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout6 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout6 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout6 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout6 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout6 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout6 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout6 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout6 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout6 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: #1f1f1f;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout6 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout6 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout6 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout6 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout6 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout6 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout6 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout6 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout6 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
.fxt-template-layout6 .fxt-countdown {
  margin-bottom: 70px;
  padding-bottom: 50px;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout6 .fxt-countdown {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout6 .fxt-countdown {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout6 .fxt-countdown {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout6 .fxt-countdown {
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout6 .fxt-countdown {
    margin-bottom: 20px;
  }
}
.fxt-template-layout6 .fxt-countdown .countdown-section {
  display: inline-block;
  min-width: 70px;
  margin-right: 35px;
  padding-right: 35px;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section {
    margin-right: 30px;
    padding-right: 30px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section {
    margin-right: 25px;
    padding-right: 25px;
    min-width: 65px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section {
    margin-right: 20px;
    padding-right: 20px;
    min-width: 60px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section {
    min-width: 55px;
    margin-right: 15px;
    padding-right: 15px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section {
    min-width: 45px;
    margin-right: 10px;
    padding-right: 10px;
  }
}
.fxt-template-layout6 .fxt-countdown .countdown-section > div {
  position: relative;
  z-index: 1;
}
.fxt-template-layout6 .fxt-countdown .countdown-section:before {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 16px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section:before {
    top: 15px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section:before {
    top: 13px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section:before {
    top: 11px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section:before {
    top: 10px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section:before {
    top: 8px;
    right: -3px;
  }
}
.fxt-template-layout6 .fxt-countdown .countdown-section:after {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 38px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section:after {
    top: 43px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section:after {
    top: 38px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section:after {
    top: 32px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section:after {
    top: 28px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section:after {
    top: 23px;
    right: -3px;
  }
}
.fxt-template-layout6 .fxt-countdown .countdown-section:last-child {
  margin-right: 0;
  padding-right: 0;
}
.fxt-template-layout6 .fxt-countdown .countdown-section:last-child:after,
.fxt-template-layout6 .fxt-countdown .countdown-section:last-child:before {
  display: none;
}
.fxt-template-layout6 .fxt-countdown .countdown-section .countdown-number {
  font-size: 60px;
  line-height: 1;
  font-weight: 600;
  color: #ffffff;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section .countdown-number {
    font-size: 56px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section .countdown-number {
    font-size: 48px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section .countdown-number {
    font-size: 42px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section .countdown-number {
    font-size: 36px;
  }
}
.fxt-template-layout6 .fxt-countdown .countdown-section .countdown-unit {
  color: #d8d8d8;
  position: absolute;
  z-index: 1;
  bottom: -50px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 22px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 20px;
    bottom: -45px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 18px;
    bottom: -40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 16px;
    bottom: -35px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout6 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 15px;
    bottom: -30px;
  }
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout6 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
  }
}
/*========================================================================
12. Demo Layout Seven
=========================================================================*/
.fxt-template-layout7 {
  display: flex;
  align-items: flex-start;
  min-height: 100vh;
  min-width: 100vw;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout7 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout7 .fxt-main-content {
  min-height: 100vh;
  min-width: 100vw;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout7 .fxt-main-content {
    min-width: 100%;
  }
}
.fxt-template-layout7 .fxt-main-content .fxt-inner-content {
  padding-top: 65px;
  padding-bottom: 65px;
  padding-left: 10vw;
  min-height: 100vh;
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  background-color: rgba(0, 0, 0, 0.55);
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout7 .fxt-main-content .fxt-inner-content {
    padding-left: 5vw;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout7 .fxt-main-content .fxt-inner-content {
    padding: 55px 15px 55px 30px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout7 .fxt-main-content .fxt-inner-content {
    padding: 45px 15px 45px 30px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout7 .fxt-main-content .fxt-inner-content {
    padding: 35px 15px 35px 30px;
  }
}
.fxt-template-layout7 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout7 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 30px;
  margin-bottom: 5px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout7 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout7 .fxt-main-content .fxt-sub-title {
    font-size: 24px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout7 .fxt-main-content .fxt-sub-title {
    font-size: 22px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout7 .fxt-main-content .fxt-sub-title {
    font-size: 20px;
  }
}
.fxt-template-layout7 .fxt-main-content .fxt-main-title {
  color: #fff;
  font-weight: 700;
  width: 90%;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout7 .fxt-main-content .fxt-main-title {
    width: 95%;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout7 .fxt-main-content .fxt-main-title {
    width: 100%;
  }
}
.fxt-template-layout7 .fxt-main-content .fxt-paragraph {
  color: #d8d8d8;
  width: 70%;
  margin-bottom: 70px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout7 .fxt-main-content .fxt-paragraph {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout7 .fxt-main-content .fxt-paragraph {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout7 .fxt-main-content .fxt-paragraph {
    width: 80%;
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout7 .fxt-main-content .fxt-paragraph {
    width: 100%;
    margin-bottom: 30px;
  }
}
.fxt-template-layout7 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout7 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout7 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout7 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout7 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-right: 15px;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout7 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout7 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout7 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout7 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout7 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout7 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout7 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout7 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout7 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout7 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout7 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout7 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout7 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout7 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout7 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout7 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout7 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout7 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: #3c363b;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout7 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout7 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout7 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout7 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout7 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout7 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout7 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout7 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout7 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout7 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
  }
}
/*========================================================================
13. Demo Layout Eight
=========================================================================*/
.fxt-template-layout8 {
  display: flex;
  align-items: flex-start;
  min-height: 100vh;
  min-width: 100vw;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout8 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout8 .fxt-main-content {
  min-height: 100vh;
  min-width: 100vw;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout8 .fxt-main-content {
    min-width: 100%;
  }
}
.fxt-template-layout8 .fxt-main-content .fxt-inner-content {
  padding-top: 65px;
  padding-bottom: 65px;
  padding-left: 10vw;
  min-height: 100vh;
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  background-color: rgba(0, 0, 0, 0.55);
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout8 .fxt-main-content .fxt-inner-content {
    padding-left: 5vw;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout8 .fxt-main-content .fxt-inner-content {
    padding: 55px 15px 55px 30px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout8 .fxt-main-content .fxt-inner-content {
    padding: 45px 15px 45px 30px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout8 .fxt-main-content .fxt-inner-content {
    padding: 35px 15px 35px 30px;
  }
}
.fxt-template-layout8 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout8 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 46px;
  font-family: 'Raleway', sans-serif;
  letter-spacing: 8px;
  margin-bottom: 25px;
  line-height: 1.4;
  margin-left: 8px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout8 .fxt-main-content .fxt-sub-title {
    font-size: 40px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout8 .fxt-main-content .fxt-sub-title {
    font-size: 36px;
    letter-spacing: 6px;
    line-height: 1.6;
    margin-left: 6px;
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout8 .fxt-main-content .fxt-sub-title {
    font-size: 32px;
    letter-spacing: 4px;
    line-height: 1.5;
    margin-left: 4px;
    margin-bottom: 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout8 .fxt-main-content .fxt-sub-title {
    font-size: 28px;
    letter-spacing: 2px;
    line-height: 1.4;
    margin-left: 2px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout8 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
    line-height: 1.3;
  }
}
.fxt-template-layout8 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout8 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout8 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout8 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout8 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-right: 15px;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout8 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout8 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout8 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout8 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout8 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout8 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout8 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout8 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout8 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout8 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout8 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout8 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout8 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout8 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout8 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout8 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout8 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout8 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: #3c363b;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout8 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout8 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout8 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout8 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout8 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout8 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout8 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout8 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout8 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
.fxt-template-layout8 .fxt-countdown {
  margin-bottom: 70px;
  padding-bottom: 50px;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout8 .fxt-countdown {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout8 .fxt-countdown {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout8 .fxt-countdown {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout8 .fxt-countdown {
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout8 .fxt-countdown {
    margin-bottom: 20px;
  }
}
.fxt-template-layout8 .fxt-countdown .countdown-section {
  display: inline-block;
  min-width: 70px;
  margin-right: 35px;
  padding-right: 35px;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section {
    margin-right: 30px;
    padding-right: 30px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section {
    margin-right: 25px;
    padding-right: 25px;
    min-width: 65px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section {
    margin-right: 20px;
    padding-right: 20px;
    min-width: 60px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section {
    min-width: 55px;
    margin-right: 15px;
    padding-right: 15px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section {
    min-width: 45px;
    margin-right: 10px;
    padding-right: 10px;
  }
}
.fxt-template-layout8 .fxt-countdown .countdown-section > div {
  position: relative;
  z-index: 1;
}
.fxt-template-layout8 .fxt-countdown .countdown-section:before {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 16px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section:before {
    top: 15px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section:before {
    top: 13px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section:before {
    top: 11px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section:before {
    top: 10px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section:before {
    top: 8px;
    right: -3px;
  }
}
.fxt-template-layout8 .fxt-countdown .countdown-section:after {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 38px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section:after {
    top: 43px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section:after {
    top: 38px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section:after {
    top: 32px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section:after {
    top: 28px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section:after {
    top: 23px;
    right: -3px;
  }
}
.fxt-template-layout8 .fxt-countdown .countdown-section:last-child {
  margin-right: 0;
  padding-right: 0;
}
.fxt-template-layout8 .fxt-countdown .countdown-section:last-child:after,
.fxt-template-layout8 .fxt-countdown .countdown-section:last-child:before {
  display: none;
}
.fxt-template-layout8 .fxt-countdown .countdown-section .countdown-number {
  font-size: 60px;
  line-height: 1;
  font-weight: 600;
  color: #ffffff;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section .countdown-number {
    font-size: 56px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section .countdown-number {
    font-size: 48px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section .countdown-number {
    font-size: 42px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section .countdown-number {
    font-size: 36px;
  }
}
.fxt-template-layout8 .fxt-countdown .countdown-section .countdown-unit {
  color: #d8d8d8;
  position: absolute;
  z-index: 1;
  bottom: -50px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 22px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 20px;
    bottom: -45px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 18px;
    bottom: -40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 16px;
    bottom: -35px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout8 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 15px;
    bottom: -30px;
  }
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout8 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
  }
}
/*========================================================================
14. Demo Layout Nine
=========================================================================*/
.fxt-template-layout9 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout9 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout9 #particles-js {
  position: absolute;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100%;
  opacity: 0.5;
}
.fxt-template-layout9 .fxt-main-content {
  padding: 65px 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 100vh;
  min-width: 100vw;
  position: relative;
  z-index: 1;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout9 .fxt-main-content {
    min-width: 100%;
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout9 .fxt-main-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout9 .fxt-main-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout9 .fxt-main-content:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.6);
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.fxt-template-layout9 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout9 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 30px;
  margin-bottom: 5px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout9 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout9 .fxt-main-content .fxt-sub-title {
    font-size: 24px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout9 .fxt-main-content .fxt-sub-title {
    font-size: 22px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout9 .fxt-main-content .fxt-sub-title {
    font-size: 20px;
  }
}
.fxt-template-layout9 .fxt-main-content .fxt-main-title {
  color: #fff;
  font-weight: 600;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout9 .fxt-main-content .fxt-main-title {
    width: 95%;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout9 .fxt-main-content .fxt-main-title {
    width: 100%;
  }
}
.fxt-template-layout9 .fxt-main-content .fxt-paragraph {
  color: #d8d8d8;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 70px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout9 .fxt-main-content .fxt-paragraph {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout9 .fxt-main-content .fxt-paragraph {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout9 .fxt-main-content .fxt-paragraph {
    width: 80%;
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout9 .fxt-main-content .fxt-paragraph {
    width: 100%;
    margin-bottom: 30px;
  }
}
.fxt-template-layout9 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout9 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout9 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout9 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout9 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout9 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout9 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout9 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout9 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout9 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout9 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout9 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout9 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout9 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout9 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout9 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout9 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout9 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout9 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout9 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout9 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout9 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout9 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout9 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: #1f1f1f;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout9 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout9 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout9 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout9 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout9 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout9 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout9 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout9 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout9 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout9 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
  }
}
/*========================================================================
15. Demo Layout Ten
=========================================================================*/
.fxt-template-layout10 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout10 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout10 #particles-js {
  position: absolute;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100%;
  opacity: 0.5;
}
.fxt-template-layout10 .fxt-main-content {
  padding: 65px 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 100vh;
  min-width: 100vw;
  position: relative;
  z-index: 1;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout10 .fxt-main-content {
    min-width: 100%;
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout10 .fxt-main-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout10 .fxt-main-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout10 .fxt-main-content:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.6);
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.fxt-template-layout10 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout10 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 46px;
  font-family: 'Raleway', sans-serif;
  letter-spacing: 8px;
  margin-bottom: 25px;
  line-height: 1.4;
  margin-left: 8px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout10 .fxt-main-content .fxt-sub-title {
    font-size: 40px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout10 .fxt-main-content .fxt-sub-title {
    font-size: 36px;
    letter-spacing: 6px;
    line-height: 1.6;
    margin-left: 6px;
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout10 .fxt-main-content .fxt-sub-title {
    font-size: 32px;
    letter-spacing: 4px;
    line-height: 1.5;
    margin-left: 4px;
    margin-bottom: 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout10 .fxt-main-content .fxt-sub-title {
    font-size: 28px;
    letter-spacing: 2px;
    line-height: 1.4;
    margin-left: 2px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout10 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
    line-height: 1.3;
  }
}
.fxt-template-layout10 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout10 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout10 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout10 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout10 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout10 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout10 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout10 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout10 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout10 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout10 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout10 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout10 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout10 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout10 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout10 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout10 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout10 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout10 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout10 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout10 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout10 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout10 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout10 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: #1f1f1f;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout10 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout10 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout10 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout10 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout10 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout10 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout10 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout10 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout10 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
.fxt-template-layout10 .fxt-countdown {
  margin-bottom: 70px;
  padding-bottom: 50px;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout10 .fxt-countdown {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout10 .fxt-countdown {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout10 .fxt-countdown {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout10 .fxt-countdown {
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout10 .fxt-countdown {
    margin-bottom: 20px;
  }
}
.fxt-template-layout10 .fxt-countdown .countdown-section {
  display: inline-block;
  min-width: 70px;
  margin-right: 35px;
  padding-right: 35px;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section {
    margin-right: 30px;
    padding-right: 30px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section {
    margin-right: 25px;
    padding-right: 25px;
    min-width: 65px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section {
    margin-right: 20px;
    padding-right: 20px;
    min-width: 60px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section {
    min-width: 55px;
    margin-right: 15px;
    padding-right: 15px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section {
    min-width: 45px;
    margin-right: 10px;
    padding-right: 10px;
  }
}
.fxt-template-layout10 .fxt-countdown .countdown-section > div {
  position: relative;
  z-index: 1;
}
.fxt-template-layout10 .fxt-countdown .countdown-section:before {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 16px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section:before {
    top: 15px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section:before {
    top: 13px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section:before {
    top: 11px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section:before {
    top: 10px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section:before {
    top: 8px;
    right: -3px;
  }
}
.fxt-template-layout10 .fxt-countdown .countdown-section:after {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 38px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section:after {
    top: 43px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section:after {
    top: 38px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section:after {
    top: 32px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section:after {
    top: 28px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section:after {
    top: 23px;
    right: -3px;
  }
}
.fxt-template-layout10 .fxt-countdown .countdown-section:last-child {
  margin-right: 0;
  padding-right: 0;
}
.fxt-template-layout10 .fxt-countdown .countdown-section:last-child:after,
.fxt-template-layout10 .fxt-countdown .countdown-section:last-child:before {
  display: none;
}
.fxt-template-layout10 .fxt-countdown .countdown-section .countdown-number {
  font-size: 60px;
  line-height: 1;
  font-weight: 600;
  color: #ffffff;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section .countdown-number {
    font-size: 56px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section .countdown-number {
    font-size: 48px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section .countdown-number {
    font-size: 42px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section .countdown-number {
    font-size: 36px;
  }
}
.fxt-template-layout10 .fxt-countdown .countdown-section .countdown-unit {
  color: #d8d8d8;
  position: absolute;
  z-index: 1;
  bottom: -50px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 22px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 20px;
    bottom: -45px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 18px;
    bottom: -40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 16px;
    bottom: -35px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout10 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 15px;
    bottom: -30px;
  }
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout10 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
  }
}
/*========================================================================
16. Demo Layout Eleven
=========================================================================*/
.fxt-template-layout11 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout11 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout11 .particles-js-canvas-el {
  position: absolute;
  z-index: -1;
  left: 0;
  top: 0;
  width: 100vw !important;
  opacity: 0.5;
}
.fxt-template-layout11 .fxt-main-content {
  padding: 65px 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 100vh;
  min-width: 100vw;
  position: relative;
  z-index: 1;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout11 .fxt-main-content {
    min-width: 100%;
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout11 .fxt-main-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout11 .fxt-main-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout11 .fxt-main-content:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.6);
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.fxt-template-layout11 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout11 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 30px;
  margin-bottom: 5px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout11 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout11 .fxt-main-content .fxt-sub-title {
    font-size: 24px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout11 .fxt-main-content .fxt-sub-title {
    font-size: 22px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout11 .fxt-main-content .fxt-sub-title {
    font-size: 20px;
  }
}
.fxt-template-layout11 .fxt-main-content .fxt-main-title {
  color: #fff;
  font-weight: 600;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout11 .fxt-main-content .fxt-main-title {
    width: 95%;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout11 .fxt-main-content .fxt-main-title {
    width: 100%;
  }
}
.fxt-template-layout11 .fxt-main-content .fxt-paragraph {
  color: #d8d8d8;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 70px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout11 .fxt-main-content .fxt-paragraph {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout11 .fxt-main-content .fxt-paragraph {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout11 .fxt-main-content .fxt-paragraph {
    width: 80%;
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout11 .fxt-main-content .fxt-paragraph {
    width: 100%;
    margin-bottom: 30px;
  }
}
.fxt-template-layout11 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout11 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout11 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout11 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout11 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout11 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout11 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout11 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout11 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout11 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout11 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout11 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout11 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout11 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout11 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout11 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout11 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout11 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout11 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout11 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout11 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout11 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout11 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout11 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: #1f1f1f;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout11 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout11 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout11 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout11 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout11 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout11 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout11 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout11 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout11 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout11 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
  }
}
/*========================================================================
17. Demo Layout Twelve
=========================================================================*/
.fxt-template-layout12 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout12 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout12 .particles-js-canvas-el {
  position: absolute;
  z-index: -1;
  left: 0;
  top: 0;
  width: 100vw !important;
  opacity: 0.5;
}
.fxt-template-layout12 .fxt-main-content {
  padding: 65px 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 100vh;
  min-width: 100vw;
  position: relative;
  z-index: 1;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout12 .fxt-main-content {
    min-width: 100%;
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout12 .fxt-main-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout12 .fxt-main-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout12 .fxt-main-content:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.6);
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.fxt-template-layout12 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout12 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 46px;
  font-family: 'Raleway', sans-serif;
  letter-spacing: 8px;
  margin-bottom: 25px;
  line-height: 1.4;
  margin-left: 8px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout12 .fxt-main-content .fxt-sub-title {
    font-size: 40px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout12 .fxt-main-content .fxt-sub-title {
    font-size: 36px;
    letter-spacing: 6px;
    line-height: 1.6;
    margin-left: 6px;
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout12 .fxt-main-content .fxt-sub-title {
    font-size: 32px;
    letter-spacing: 4px;
    line-height: 1.5;
    margin-left: 4px;
    margin-bottom: 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout12 .fxt-main-content .fxt-sub-title {
    font-size: 28px;
    letter-spacing: 2px;
    line-height: 1.4;
    margin-left: 2px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout12 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
    line-height: 1.3;
  }
}
.fxt-template-layout12 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout12 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout12 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout12 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout12 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout12 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout12 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout12 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout12 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout12 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout12 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout12 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout12 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout12 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout12 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout12 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout12 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout12 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout12 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout12 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout12 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout12 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout12 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout12 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: #1f1f1f;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout12 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout12 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout12 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout12 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout12 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout12 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout12 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout12 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout12 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
.fxt-template-layout12 .fxt-countdown {
  margin-bottom: 70px;
  padding-bottom: 50px;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout12 .fxt-countdown {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout12 .fxt-countdown {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout12 .fxt-countdown {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout12 .fxt-countdown {
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout12 .fxt-countdown {
    margin-bottom: 20px;
  }
}
.fxt-template-layout12 .fxt-countdown .countdown-section {
  display: inline-block;
  min-width: 70px;
  margin-right: 35px;
  padding-right: 35px;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section {
    margin-right: 30px;
    padding-right: 30px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section {
    margin-right: 25px;
    padding-right: 25px;
    min-width: 65px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section {
    margin-right: 20px;
    padding-right: 20px;
    min-width: 60px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section {
    min-width: 55px;
    margin-right: 15px;
    padding-right: 15px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section {
    min-width: 45px;
    margin-right: 10px;
    padding-right: 10px;
  }
}
.fxt-template-layout12 .fxt-countdown .countdown-section > div {
  position: relative;
  z-index: 1;
}
.fxt-template-layout12 .fxt-countdown .countdown-section:before {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 16px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section:before {
    top: 15px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section:before {
    top: 13px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section:before {
    top: 11px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section:before {
    top: 10px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section:before {
    top: 8px;
    right: -3px;
  }
}
.fxt-template-layout12 .fxt-countdown .countdown-section:after {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 38px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section:after {
    top: 43px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section:after {
    top: 38px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section:after {
    top: 32px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section:after {
    top: 28px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section:after {
    top: 23px;
    right: -3px;
  }
}
.fxt-template-layout12 .fxt-countdown .countdown-section:last-child {
  margin-right: 0;
  padding-right: 0;
}
.fxt-template-layout12 .fxt-countdown .countdown-section:last-child:after,
.fxt-template-layout12 .fxt-countdown .countdown-section:last-child:before {
  display: none;
}
.fxt-template-layout12 .fxt-countdown .countdown-section .countdown-number {
  font-size: 60px;
  line-height: 1;
  font-weight: 600;
  color: #ffffff;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section .countdown-number {
    font-size: 56px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section .countdown-number {
    font-size: 48px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section .countdown-number {
    font-size: 42px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section .countdown-number {
    font-size: 36px;
  }
}
.fxt-template-layout12 .fxt-countdown .countdown-section .countdown-unit {
  color: #d8d8d8;
  position: absolute;
  z-index: 1;
  bottom: -50px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 22px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 20px;
    bottom: -45px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 18px;
    bottom: -40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 16px;
    bottom: -35px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout12 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 15px;
    bottom: -30px;
  }
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout12 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
  }
}
/*========================================================================
18. Demo Layout Thirteen
=========================================================================*/
.fxt-template-layout13 {
  background-color: #fff;
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout13 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout13 .fxt-main-content {
  min-height: 100vh;
  min-width: 100vw;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout13 .fxt-main-content {
    min-width: 100%;
  }
}
.fxt-template-layout13 .fxt-main-content .fxt-left-content {
  min-height: 100vh;
  display: flex;
  justify-content: center;
  flex-direction: column;
  padding-left: 6vw;
  padding-top: 65px;
  padding-bottom: 65px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout13 .fxt-main-content .fxt-left-content {
    padding: 55px 15px 55px 10vw;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout13 .fxt-main-content .fxt-left-content {
    padding: 45px 15px 45px 5vw;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout13 .fxt-main-content .fxt-left-content {
    padding: 35px 15px 35px 30px;
  }
}
.fxt-template-layout13 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout13 .fxt-main-content .fxt-sub-title {
  color: #f11e47;
  font-size: 30px;
  margin-bottom: 5px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout13 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout13 .fxt-main-content .fxt-sub-title {
    font-size: 24px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout13 .fxt-main-content .fxt-sub-title {
    font-size: 22px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout13 .fxt-main-content .fxt-sub-title {
    font-size: 20px;
  }
}
.fxt-template-layout13 .fxt-main-content .fxt-main-title {
  color: #000;
  font-weight: 600;
  width: 90%;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout13 .fxt-main-content .fxt-main-title {
    width: 95%;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout13 .fxt-main-content .fxt-main-title {
    width: 100%;
  }
}
.fxt-template-layout13 .fxt-main-content .fxt-paragraph {
  color: #666666;
  width: 70%;
  margin-bottom: 70px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout13 .fxt-main-content .fxt-paragraph {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout13 .fxt-main-content .fxt-paragraph {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout13 .fxt-main-content .fxt-paragraph {
    width: 80%;
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout13 .fxt-main-content .fxt-paragraph {
    width: 100%;
    margin-bottom: 30px;
  }
}
.fxt-template-layout13 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout13 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout13 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout13 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout13 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-right: 15px;
  margin-bottom: 10px;
  font-family: 'Roboto', sans-serif;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #dedede;
  color: #000;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout13 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout13 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout13 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
  color: #f1f1f1;
}
.fxt-template-layout13 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout13 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  font-family: 'Roboto', sans-serif;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout13 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout13 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout13 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #dedede;
  color: #000;
}
.fxt-template-layout13 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout13 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout13 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout13 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout13 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout13 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 10px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout13 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout13 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout13 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout13 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #666666;
  background-color: transparent;
  border-radius: 50%;
  border: 1px solid;
  border-color: #dedede;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout13 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout13 .fxt-main-content .fxt-socials li a:hover {
  color: #fff;
}
.fxt-template-layout13 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
  border-color: #3b5998;
}
.fxt-template-layout13 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
  border-color: #00acee;
}
.fxt-template-layout13 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
  border-color: #CC3333;
}
.fxt-template-layout13 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
  border-color: #3f729b;
}
.fxt-template-layout13 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
  border-color: #0077B5;
}
.fxt-template-layout13 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
  border-color: #c4302b;
}
.fxt-template-layout13 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
  border-color: #bd081c;
}
.fxt-template-layout13 .fxt-main-content .fxt-footer p {
  color: #000000;
  font-size: 15px;
}
.fxt-template-layout13 .fxt-main-content .fxt-bg-color {
  overflow: hidden;
  padding: 90px;
  min-height: 100vh;
  background: #6463f1;
  background: linear-gradient(180deg, #6463f1 0%, #6b6af5 100%);
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout13 .fxt-main-content .fxt-bg-color {
    padding: 80px 70px;
    min-height: 100%;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout13 .fxt-main-content .fxt-bg-color {
    padding: 70px 60px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout13 .fxt-main-content .fxt-bg-color {
    padding: 60px 50px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout13 .fxt-main-content .fxt-bg-color {
    padding: 50px 40px;
  }
}
.fxt-template-layout13 .fxt-main-content .fxt-figure {
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout13 .fxt-main-content {
    transform: translateX(-50%);
  }
}
/*========================================================================
19. Demo Layout Fourteen
=========================================================================*/
.fxt-template-layout14 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout14 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout14 .fxt-main-content {
  min-height: 100vh;
  min-width: 100vw;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout14 .fxt-main-content {
    min-width: 100%;
  }
}
.fxt-template-layout14 .fxt-main-content .fxt-left-content {
  min-height: 100vh;
  display: flex;
  justify-content: center;
  flex-direction: column;
  padding-left: 6vw;
  padding-top: 65px;
  padding-bottom: 65px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout14 .fxt-main-content .fxt-left-content {
    padding: 55px 15px 55px 10vw;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout14 .fxt-main-content .fxt-left-content {
    padding: 45px 15px 45px 5vw;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout14 .fxt-main-content .fxt-left-content {
    padding: 35px 15px 35px 30px;
  }
}
.fxt-template-layout14 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout14 .fxt-main-content .fxt-sub-title {
  color: #f11e47;
  font-size: 46px;
  font-family: 'Raleway', sans-serif;
  letter-spacing: 8px;
  margin-bottom: 25px;
  line-height: 1.4;
  margin-left: 8px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout14 .fxt-main-content .fxt-sub-title {
    font-size: 40px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout14 .fxt-main-content .fxt-sub-title {
    font-size: 36px;
    letter-spacing: 6px;
    line-height: 1.6;
    margin-left: 6px;
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout14 .fxt-main-content .fxt-sub-title {
    font-size: 32px;
    letter-spacing: 4px;
    line-height: 1.5;
    margin-left: 4px;
    margin-bottom: 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout14 .fxt-main-content .fxt-sub-title {
    font-size: 28px;
    letter-spacing: 2px;
    line-height: 1.4;
    margin-left: 2px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout14 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
    line-height: 1.3;
  }
}
.fxt-template-layout14 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout14 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout14 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout14 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout14 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-right: 15px;
  margin-bottom: 10px;
  font-family: 'Roboto', sans-serif;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #dedede;
  color: #000;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout14 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout14 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout14 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
  color: #f1f1f1;
}
.fxt-template-layout14 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout14 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  font-family: 'Roboto', sans-serif;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout14 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout14 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout14 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #dedede;
  color: #000;
}
.fxt-template-layout14 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout14 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout14 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout14 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout14 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout14 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 10px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout14 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout14 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout14 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout14 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #666666;
  background-color: transparent;
  border-radius: 50%;
  border: 1px solid;
  border-color: #dedede;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout14 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout14 .fxt-main-content .fxt-socials li a:hover {
  color: #fff;
}
.fxt-template-layout14 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
  border-color: #3b5998;
}
.fxt-template-layout14 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
  border-color: #00acee;
}
.fxt-template-layout14 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
  border-color: #CC3333;
}
.fxt-template-layout14 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
  border-color: #3f729b;
}
.fxt-template-layout14 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
  border-color: #0077B5;
}
.fxt-template-layout14 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
  border-color: #c4302b;
}
.fxt-template-layout14 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
  border-color: #bd081c;
}
.fxt-template-layout14 .fxt-main-content .fxt-footer p {
  color: #000000;
  font-size: 15px;
}
.fxt-template-layout14 .fxt-main-content .fxt-bg-color {
  overflow: hidden;
  padding: 90px;
  min-height: 100vh;
  background: #6463f1;
  background: linear-gradient(180deg, #6463f1 0%, #6b6af5 100%);
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout14 .fxt-main-content .fxt-bg-color {
    padding: 80px 70px;
    min-height: 100%;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout14 .fxt-main-content .fxt-bg-color {
    padding: 70px 60px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout14 .fxt-main-content .fxt-bg-color {
    padding: 60px 50px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout14 .fxt-main-content .fxt-bg-color {
    padding: 50px 40px;
  }
}
.fxt-template-layout14 .fxt-main-content .fxt-figure {
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.fxt-template-layout14 .fxt-countdown {
  margin-bottom: 70px;
  padding-bottom: 50px;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout14 .fxt-countdown {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout14 .fxt-countdown {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout14 .fxt-countdown {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout14 .fxt-countdown {
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout14 .fxt-countdown {
    margin-bottom: 20px;
  }
}
.fxt-template-layout14 .fxt-countdown .countdown-section {
  display: inline-block;
  min-width: 70px;
  margin-right: 35px;
  padding-right: 35px;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section {
    margin-right: 30px;
    padding-right: 30px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section {
    margin-right: 25px;
    padding-right: 25px;
    min-width: 65px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section {
    margin-right: 20px;
    padding-right: 20px;
    min-width: 60px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section {
    min-width: 55px;
    margin-right: 15px;
    padding-right: 15px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section {
    min-width: 45px;
    margin-right: 10px;
    padding-right: 10px;
  }
}
.fxt-template-layout14 .fxt-countdown .countdown-section > div {
  position: relative;
  z-index: 1;
}
.fxt-template-layout14 .fxt-countdown .countdown-section:before {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #000;
  position: absolute;
  z-index: 1;
  top: 16px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section:before {
    top: 15px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section:before {
    top: 13px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section:before {
    top: 11px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section:before {
    top: 10px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section:before {
    top: 8px;
    right: -3px;
  }
}
.fxt-template-layout14 .fxt-countdown .countdown-section:after {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #000;
  position: absolute;
  z-index: 1;
  top: 38px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section:after {
    top: 43px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section:after {
    top: 38px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section:after {
    top: 32px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section:after {
    top: 28px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section:after {
    top: 23px;
    right: -3px;
  }
}
.fxt-template-layout14 .fxt-countdown .countdown-section:last-child {
  margin-right: 0;
  padding-right: 0;
}
.fxt-template-layout14 .fxt-countdown .countdown-section:last-child:after,
.fxt-template-layout14 .fxt-countdown .countdown-section:last-child:before {
  display: none;
}
.fxt-template-layout14 .fxt-countdown .countdown-section .countdown-number {
  font-size: 60px;
  line-height: 1;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section .countdown-number {
    font-size: 56px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section .countdown-number {
    font-size: 48px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section .countdown-number {
    font-size: 42px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section .countdown-number {
    font-size: 36px;
  }
}
.fxt-template-layout14 .fxt-countdown .countdown-section .countdown-unit {
  color: #666666;
  position: absolute;
  z-index: 1;
  bottom: -50px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 22px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 20px;
    bottom: -45px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 18px;
    bottom: -40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 16px;
    bottom: -35px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout14 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 15px;
    bottom: -30px;
  }
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout14 .fxt-main-content {
    transform: translateX(-50%);
  }
}
/*========================================================================
20. Demo Layout Fifteen
=========================================================================*/
.fxt-template-layout15 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout15 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout15 .fxt-main-content {
  padding: 65px 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 100vh;
  min-width: 100vw;
  position: relative;
  z-index: 1;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout15 .fxt-main-content {
    min-width: 100%;
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout15 .fxt-main-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout15 .fxt-main-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout15 .fxt-main-content:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.6);
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.fxt-template-layout15 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout15 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 30px;
  margin-bottom: 5px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout15 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout15 .fxt-main-content .fxt-sub-title {
    font-size: 24px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout15 .fxt-main-content .fxt-sub-title {
    font-size: 22px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout15 .fxt-main-content .fxt-sub-title {
    font-size: 20px;
  }
}
.fxt-template-layout15 .fxt-main-content .fxt-main-title {
  color: #fff;
  font-weight: 600;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout15 .fxt-main-content .fxt-main-title {
    width: 95%;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout15 .fxt-main-content .fxt-main-title {
    width: 100%;
  }
}
.fxt-template-layout15 .fxt-main-content .fxt-paragraph {
  color: #d8d8d8;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 70px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout15 .fxt-main-content .fxt-paragraph {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout15 .fxt-main-content .fxt-paragraph {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout15 .fxt-main-content .fxt-paragraph {
    width: 80%;
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout15 .fxt-main-content .fxt-paragraph {
    width: 100%;
    margin-bottom: 30px;
  }
}
.fxt-template-layout15 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout15 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout15 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout15 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout15 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout15 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout15 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout15 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout15 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout15 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout15 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout15 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout15 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout15 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout15 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout15 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout15 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout15 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout15 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout15 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout15 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout15 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout15 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout15 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: #1f1f1f;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout15 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout15 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout15 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout15 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout15 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout15 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout15 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout15 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout15 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout15 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
  }
}
/*========================================================================
21. Demo Layout Sixteen
=========================================================================*/
.fxt-template-layout16 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout16 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout16 .fxt-main-content {
  padding: 65px 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 100vh;
  min-width: 100vw;
  position: relative;
  z-index: 1;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout16 .fxt-main-content {
    min-width: 100%;
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout16 .fxt-main-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout16 .fxt-main-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout16 .fxt-main-content:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.6);
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.fxt-template-layout16 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout16 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 46px;
  font-family: 'Raleway', sans-serif;
  letter-spacing: 8px;
  margin-bottom: 25px;
  line-height: 1.4;
  margin-left: 8px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout16 .fxt-main-content .fxt-sub-title {
    font-size: 40px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout16 .fxt-main-content .fxt-sub-title {
    font-size: 36px;
    letter-spacing: 6px;
    line-height: 1.6;
    margin-left: 6px;
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout16 .fxt-main-content .fxt-sub-title {
    font-size: 32px;
    letter-spacing: 4px;
    line-height: 1.5;
    margin-left: 4px;
    margin-bottom: 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout16 .fxt-main-content .fxt-sub-title {
    font-size: 28px;
    letter-spacing: 2px;
    line-height: 1.4;
    margin-left: 2px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout16 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
    line-height: 1.3;
  }
}
.fxt-template-layout16 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout16 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout16 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout16 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout16 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout16 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout16 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout16 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout16 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout16 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout16 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout16 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout16 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout16 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout16 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout16 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout16 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout16 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout16 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout16 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout16 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout16 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout16 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout16 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: #1f1f1f;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout16 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout16 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout16 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout16 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout16 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout16 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout16 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout16 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout16 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
.fxt-template-layout16 .fxt-countdown {
  margin-bottom: 70px;
  padding-bottom: 50px;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout16 .fxt-countdown {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout16 .fxt-countdown {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout16 .fxt-countdown {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout16 .fxt-countdown {
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout16 .fxt-countdown {
    margin-bottom: 20px;
  }
}
.fxt-template-layout16 .fxt-countdown .countdown-section {
  display: inline-block;
  min-width: 70px;
  margin-right: 35px;
  padding-right: 35px;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section {
    margin-right: 30px;
    padding-right: 30px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section {
    margin-right: 25px;
    padding-right: 25px;
    min-width: 65px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section {
    margin-right: 20px;
    padding-right: 20px;
    min-width: 60px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section {
    min-width: 55px;
    margin-right: 15px;
    padding-right: 15px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section {
    min-width: 45px;
    margin-right: 10px;
    padding-right: 10px;
  }
}
.fxt-template-layout16 .fxt-countdown .countdown-section > div {
  position: relative;
  z-index: 1;
}
.fxt-template-layout16 .fxt-countdown .countdown-section:before {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 16px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section:before {
    top: 15px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section:before {
    top: 13px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section:before {
    top: 11px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section:before {
    top: 10px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section:before {
    top: 8px;
    right: -3px;
  }
}
.fxt-template-layout16 .fxt-countdown .countdown-section:after {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 38px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section:after {
    top: 43px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section:after {
    top: 38px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section:after {
    top: 32px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section:after {
    top: 28px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section:after {
    top: 23px;
    right: -3px;
  }
}
.fxt-template-layout16 .fxt-countdown .countdown-section:last-child {
  margin-right: 0;
  padding-right: 0;
}
.fxt-template-layout16 .fxt-countdown .countdown-section:last-child:after,
.fxt-template-layout16 .fxt-countdown .countdown-section:last-child:before {
  display: none;
}
.fxt-template-layout16 .fxt-countdown .countdown-section .countdown-number {
  font-size: 60px;
  line-height: 1;
  font-weight: 600;
  color: #ffffff;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section .countdown-number {
    font-size: 56px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section .countdown-number {
    font-size: 48px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section .countdown-number {
    font-size: 42px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section .countdown-number {
    font-size: 36px;
  }
}
.fxt-template-layout16 .fxt-countdown .countdown-section .countdown-unit {
  color: #d8d8d8;
  position: absolute;
  z-index: 1;
  bottom: -50px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 22px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 20px;
    bottom: -45px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 18px;
    bottom: -40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 16px;
    bottom: -35px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout16 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 15px;
    bottom: -30px;
  }
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout16 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
  }
}
/*========================================================================
22. Demo Layout Seventeen
=========================================================================*/
.fxt-template-layout17 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout17 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout17 .starfield {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 0;
  opacity: 0.5;
}
.fxt-template-layout17 .fxt-main-content {
  padding: 65px 0;
  background-color: #000;
  min-height: 100vh;
  min-width: 100vw;
  position: relative;
  z-index: 1;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout17 .fxt-main-content {
    min-width: 100%;
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout17 .fxt-main-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout17 .fxt-main-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout17 .fxt-main-content:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.6);
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.fxt-template-layout17 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout17 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 30px;
  margin-bottom: 5px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout17 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout17 .fxt-main-content .fxt-sub-title {
    font-size: 24px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout17 .fxt-main-content .fxt-sub-title {
    font-size: 22px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout17 .fxt-main-content .fxt-sub-title {
    font-size: 20px;
  }
}
.fxt-template-layout17 .fxt-main-content .fxt-main-title {
  color: #fff;
  font-weight: 600;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout17 .fxt-main-content .fxt-main-title {
    width: 95%;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout17 .fxt-main-content .fxt-main-title {
    width: 100%;
  }
}
.fxt-template-layout17 .fxt-main-content .fxt-paragraph {
  color: #d8d8d8;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 70px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout17 .fxt-main-content .fxt-paragraph {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout17 .fxt-main-content .fxt-paragraph {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout17 .fxt-main-content .fxt-paragraph {
    width: 80%;
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout17 .fxt-main-content .fxt-paragraph {
    width: 100%;
    margin-bottom: 30px;
  }
}
.fxt-template-layout17 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout17 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout17 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout17 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout17 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout17 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout17 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout17 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout17 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout17 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout17 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout17 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout17 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout17 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout17 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout17 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout17 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout17 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout17 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout17 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout17 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout17 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout17 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout17 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: #1f1f1f;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout17 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout17 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout17 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout17 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout17 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout17 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout17 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout17 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout17 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout17 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
  }
}
/*========================================================================
23. Demo Layout Eighteen
=========================================================================*/
.fxt-template-layout18 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout18 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout18 .starfield {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 0;
  opacity: 0.5;
}
.fxt-template-layout18 .fxt-main-content {
  padding: 65px 0;
  background-color: #000;
  min-height: 100vh;
  min-width: 100vw;
  position: relative;
  z-index: 1;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout18 .fxt-main-content {
    min-width: 100%;
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout18 .fxt-main-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout18 .fxt-main-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout18 .fxt-main-content:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.6);
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.fxt-template-layout18 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout18 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 46px;
  font-family: 'Raleway', sans-serif;
  letter-spacing: 8px;
  margin-bottom: 25px;
  line-height: 1.4;
  margin-left: 8px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout18 .fxt-main-content .fxt-sub-title {
    font-size: 40px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout18 .fxt-main-content .fxt-sub-title {
    font-size: 36px;
    letter-spacing: 6px;
    line-height: 1.6;
    margin-left: 6px;
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout18 .fxt-main-content .fxt-sub-title {
    font-size: 32px;
    letter-spacing: 4px;
    line-height: 1.5;
    margin-left: 4px;
    margin-bottom: 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout18 .fxt-main-content .fxt-sub-title {
    font-size: 28px;
    letter-spacing: 2px;
    line-height: 1.4;
    margin-left: 2px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout18 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
    line-height: 1.3;
  }
}
.fxt-template-layout18 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout18 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout18 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout18 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout18 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout18 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout18 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout18 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout18 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout18 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout18 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout18 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout18 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout18 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout18 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout18 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout18 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout18 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout18 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout18 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout18 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout18 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout18 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout18 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: #1f1f1f;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout18 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout18 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout18 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout18 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout18 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout18 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout18 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout18 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout18 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
.fxt-template-layout18 .fxt-countdown {
  margin-bottom: 70px;
  padding-bottom: 50px;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout18 .fxt-countdown {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout18 .fxt-countdown {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout18 .fxt-countdown {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout18 .fxt-countdown {
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout18 .fxt-countdown {
    margin-bottom: 20px;
  }
}
.fxt-template-layout18 .fxt-countdown .countdown-section {
  display: inline-block;
  min-width: 70px;
  margin-right: 35px;
  padding-right: 35px;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section {
    margin-right: 30px;
    padding-right: 30px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section {
    margin-right: 25px;
    padding-right: 25px;
    min-width: 65px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section {
    margin-right: 20px;
    padding-right: 20px;
    min-width: 60px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section {
    min-width: 55px;
    margin-right: 15px;
    padding-right: 15px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section {
    min-width: 45px;
    margin-right: 10px;
    padding-right: 10px;
  }
}
.fxt-template-layout18 .fxt-countdown .countdown-section > div {
  position: relative;
  z-index: 1;
}
.fxt-template-layout18 .fxt-countdown .countdown-section:before {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 16px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section:before {
    top: 15px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section:before {
    top: 13px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section:before {
    top: 11px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section:before {
    top: 10px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section:before {
    top: 8px;
    right: -3px;
  }
}
.fxt-template-layout18 .fxt-countdown .countdown-section:after {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 38px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section:after {
    top: 43px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section:after {
    top: 38px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section:after {
    top: 32px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section:after {
    top: 28px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section:after {
    top: 23px;
    right: -3px;
  }
}
.fxt-template-layout18 .fxt-countdown .countdown-section:last-child {
  margin-right: 0;
  padding-right: 0;
}
.fxt-template-layout18 .fxt-countdown .countdown-section:last-child:after,
.fxt-template-layout18 .fxt-countdown .countdown-section:last-child:before {
  display: none;
}
.fxt-template-layout18 .fxt-countdown .countdown-section .countdown-number {
  font-size: 60px;
  line-height: 1;
  font-weight: 600;
  color: #ffffff;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section .countdown-number {
    font-size: 56px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section .countdown-number {
    font-size: 48px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section .countdown-number {
    font-size: 42px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section .countdown-number {
    font-size: 36px;
  }
}
.fxt-template-layout18 .fxt-countdown .countdown-section .countdown-unit {
  color: #d8d8d8;
  position: absolute;
  z-index: 1;
  bottom: -50px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 22px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 20px;
    bottom: -45px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 18px;
    bottom: -40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 16px;
    bottom: -35px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout18 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 15px;
    bottom: -30px;
  }
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout18 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
  }
}
/*========================================================================
24. Demo Layout Nineteen
=========================================================================*/
.fxt-template-layout19 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout19 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout19 .fxt-main-content {
  min-height: 100vh;
  min-width: 100vw;
  text-align: center;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout19 .fxt-main-content {
    min-width: 100%;
  }
}
.fxt-template-layout19 .fxt-main-content .fxt-right-content {
  padding: 65px 0;
  background-color: #fafafa;
  min-height: 100vh;
  display: flex;
  justify-content: center;
  flex-direction: column;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout19 .fxt-main-content .fxt-right-content {
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout19 .fxt-main-content .fxt-right-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout19 .fxt-main-content .fxt-right-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout19 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
  margin-left: auto;
  margin-right: auto;
}
.fxt-template-layout19 .fxt-main-content .fxt-sub-title {
  color: #f11e47;
  font-size: 30px;
  margin-bottom: 5px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout19 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout19 .fxt-main-content .fxt-sub-title {
    font-size: 24px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout19 .fxt-main-content .fxt-sub-title {
    font-size: 22px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout19 .fxt-main-content .fxt-sub-title {
    font-size: 20px;
  }
}
.fxt-template-layout19 .fxt-main-content .fxt-main-title {
  color: #000;
  font-weight: 700;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout19 .fxt-main-content .fxt-main-title {
    width: 95%;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout19 .fxt-main-content .fxt-main-title {
    width: 100%;
  }
}
.fxt-template-layout19 .fxt-main-content .fxt-paragraph {
  color: #666666;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 70px;
  font-size: 24px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout19 .fxt-main-content .fxt-paragraph {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout19 .fxt-main-content .fxt-paragraph {
    margin-bottom: 50px;
    font-size: 22px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout19 .fxt-main-content .fxt-paragraph {
    width: 80%;
    margin-bottom: 40px;
    font-size: 20px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout19 .fxt-main-content .fxt-paragraph {
    width: 100%;
    margin-bottom: 30px;
    font-size: 18px;
  }
}
.fxt-template-layout19 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout19 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout19 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout19 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout19 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout19 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  font-family: 'Roboto', sans-serif;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #dedede;
  color: #000;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout19 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout19 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout19 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
  color: #f1f1f1;
}
.fxt-template-layout19 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout19 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  font-family: 'Roboto', sans-serif;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout19 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout19 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout19 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #dedede;
  color: #000;
}
.fxt-template-layout19 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout19 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout19 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout19 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout19 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout19 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout19 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout19 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout19 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout19 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #666666;
  background-color: transparent;
  border-radius: 50%;
  border: 1px solid;
  border-color: #dedede;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout19 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout19 .fxt-main-content .fxt-socials li a:hover {
  color: #fff;
}
.fxt-template-layout19 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
  border-color: #3b5998;
}
.fxt-template-layout19 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
  border-color: #00acee;
}
.fxt-template-layout19 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
  border-color: #CC3333;
}
.fxt-template-layout19 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
  border-color: #3f729b;
}
.fxt-template-layout19 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
  border-color: #0077B5;
}
.fxt-template-layout19 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
  border-color: #c4302b;
}
.fxt-template-layout19 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
  border-color: #bd081c;
}
.fxt-template-layout19 .fxt-main-content .fxt-footer p {
  color: #000000;
  font-size: 15px;
}
.fxt-template-layout19 .fxt-main-content .fxt-bg-color {
  overflow: hidden;
  min-height: 100vh;
  background-color: #fff;
  padding: 90px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout19 .fxt-main-content .fxt-bg-color {
    padding: 80px 70px;
    min-height: 100%;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout19 .fxt-main-content .fxt-bg-color {
    padding: 70px 60px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout19 .fxt-main-content .fxt-bg-color {
    padding: 60px 50px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout19 .fxt-main-content .fxt-bg-color {
    padding: 50px 40px;
  }
}
.fxt-template-layout19 .fxt-main-content .fxt-figure {
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout19 .fxt-main-content {
    transform: translateX(-50%);
  }
}
/*========================================================================
25. Demo Layout Twenty
=========================================================================*/
.fxt-template-layout20 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout20 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout20 .fxt-main-content {
  min-height: 100vh;
  min-width: 100vw;
  text-align: center;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout20 .fxt-main-content {
    min-width: 100%;
  }
}
.fxt-template-layout20 .fxt-main-content .fxt-right-content {
  padding: 65px 0;
  background-color: #fafafa;
  min-height: 100vh;
  display: flex;
  justify-content: center;
  flex-direction: column;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout20 .fxt-main-content .fxt-right-content {
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout20 .fxt-main-content .fxt-right-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout20 .fxt-main-content .fxt-right-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout20 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
  margin-left: auto;
  margin-right: auto;
}
.fxt-template-layout20 .fxt-main-content .fxt-sub-title {
  color: #f11e47;
  font-size: 46px;
  font-family: 'Raleway', sans-serif;
  letter-spacing: 8px;
  margin-bottom: 25px;
  line-height: 1.4;
  margin-left: 8px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout20 .fxt-main-content .fxt-sub-title {
    font-size: 40px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout20 .fxt-main-content .fxt-sub-title {
    font-size: 36px;
    letter-spacing: 6px;
    line-height: 1.6;
    margin-left: 6px;
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout20 .fxt-main-content .fxt-sub-title {
    font-size: 32px;
    letter-spacing: 4px;
    line-height: 1.5;
    margin-left: 4px;
    margin-bottom: 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout20 .fxt-main-content .fxt-sub-title {
    font-size: 28px;
    letter-spacing: 2px;
    line-height: 1.4;
    margin-left: 2px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout20 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
    line-height: 1.3;
  }
}
.fxt-template-layout20 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout20 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout20 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout20 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout20 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout20 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  font-family: 'Roboto', sans-serif;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #dedede;
  color: #000;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout20 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout20 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout20 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
  color: #f1f1f1;
}
.fxt-template-layout20 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout20 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  font-family: 'Roboto', sans-serif;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout20 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout20 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout20 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #dedede;
  color: #000;
}
.fxt-template-layout20 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout20 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout20 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout20 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout20 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout20 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout20 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout20 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout20 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout20 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #666666;
  background-color: transparent;
  border-radius: 50%;
  border: 1px solid;
  border-color: #dedede;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout20 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout20 .fxt-main-content .fxt-socials li a:hover {
  color: #fff;
}
.fxt-template-layout20 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
  border-color: #3b5998;
}
.fxt-template-layout20 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
  border-color: #00acee;
}
.fxt-template-layout20 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
  border-color: #CC3333;
}
.fxt-template-layout20 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
  border-color: #3f729b;
}
.fxt-template-layout20 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
  border-color: #0077B5;
}
.fxt-template-layout20 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
  border-color: #c4302b;
}
.fxt-template-layout20 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
  border-color: #bd081c;
}
.fxt-template-layout20 .fxt-main-content .fxt-footer p {
  color: #000000;
  font-size: 15px;
}
.fxt-template-layout20 .fxt-main-content .fxt-bg-color {
  overflow: hidden;
  min-height: 100vh;
  background-color: #fff;
  padding: 90px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout20 .fxt-main-content .fxt-bg-color {
    padding: 80px 70px;
    min-height: 100%;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout20 .fxt-main-content .fxt-bg-color {
    padding: 70px 60px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout20 .fxt-main-content .fxt-bg-color {
    padding: 60px 50px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout20 .fxt-main-content .fxt-bg-color {
    padding: 50px 40px;
  }
}
.fxt-template-layout20 .fxt-main-content .fxt-figure {
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.fxt-template-layout20 .fxt-countdown {
  margin-bottom: 70px;
  padding-bottom: 50px;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout20 .fxt-countdown {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout20 .fxt-countdown {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout20 .fxt-countdown {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout20 .fxt-countdown {
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout20 .fxt-countdown {
    margin-bottom: 20px;
  }
}
.fxt-template-layout20 .fxt-countdown .countdown-section {
  display: inline-block;
  min-width: 70px;
  margin-right: 35px;
  padding-right: 35px;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section {
    margin-right: 30px;
    padding-right: 30px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section {
    margin-right: 25px;
    padding-right: 25px;
    min-width: 65px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section {
    margin-right: 20px;
    padding-right: 20px;
    min-width: 60px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section {
    min-width: 55px;
    margin-right: 15px;
    padding-right: 15px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section {
    min-width: 45px;
    margin-right: 10px;
    padding-right: 10px;
  }
}
.fxt-template-layout20 .fxt-countdown .countdown-section > div {
  position: relative;
  z-index: 1;
}
.fxt-template-layout20 .fxt-countdown .countdown-section:before {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #000;
  position: absolute;
  z-index: 1;
  top: 16px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section:before {
    top: 15px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section:before {
    top: 13px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section:before {
    top: 11px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section:before {
    top: 10px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section:before {
    top: 8px;
    right: -3px;
  }
}
.fxt-template-layout20 .fxt-countdown .countdown-section:after {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #000;
  position: absolute;
  z-index: 1;
  top: 38px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section:after {
    top: 43px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section:after {
    top: 38px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section:after {
    top: 32px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section:after {
    top: 28px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section:after {
    top: 23px;
    right: -3px;
  }
}
.fxt-template-layout20 .fxt-countdown .countdown-section:last-child {
  margin-right: 0;
  padding-right: 0;
}
.fxt-template-layout20 .fxt-countdown .countdown-section:last-child:after,
.fxt-template-layout20 .fxt-countdown .countdown-section:last-child:before {
  display: none;
}
.fxt-template-layout20 .fxt-countdown .countdown-section .countdown-number {
  font-size: 60px;
  line-height: 1;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section .countdown-number {
    font-size: 56px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section .countdown-number {
    font-size: 48px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section .countdown-number {
    font-size: 42px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section .countdown-number {
    font-size: 36px;
  }
}
.fxt-template-layout20 .fxt-countdown .countdown-section .countdown-unit {
  color: #666666;
  position: absolute;
  z-index: 1;
  bottom: -50px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 22px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 20px;
    bottom: -45px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 18px;
    bottom: -40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 16px;
    bottom: -35px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout20 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 15px;
    bottom: -30px;
  }
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout20 .fxt-main-content {
    transform: translateX(-50%);
  }
}
/*========================================================================
26. Demo Layout Twenty One
=========================================================================*/
.fxt-template-layout21 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout21 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout21 .fxt-main-content {
  padding-top: 280px;
  padding-bottom: 280px;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 100vh;
  min-width: 100vw;
  position: relative;
  z-index: 1;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout21 .fxt-main-content {
    min-width: 100%;
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout21 .fxt-main-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout21 .fxt-main-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout21 .fxt-main-content:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.8);
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.fxt-template-layout21 .fxt-main-content .fxt-logo {
  max-width: 40vw;
  position: absolute;
  z-index: 1;
  left: 130px;
  top: 150px;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout21 .fxt-main-content .fxt-logo {
    position: inherit;
    left: inherit;
    top: inherit;
    margin-bottom: 14vh;
    margin-top: 25px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout21 .fxt-main-content .fxt-logo {
    margin-bottom: 12vh;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout21 .fxt-main-content .fxt-logo {
    margin-bottom: 10vh;
    max-width: 40vw;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout21 .fxt-main-content .fxt-logo {
    margin-bottom: 8vh;
  }
}
.fxt-template-layout21 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 30px;
  margin-bottom: 5px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout21 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout21 .fxt-main-content .fxt-sub-title {
    font-size: 24px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout21 .fxt-main-content .fxt-sub-title {
    font-size: 22px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout21 .fxt-main-content .fxt-sub-title {
    font-size: 20px;
  }
}
.fxt-template-layout21 .fxt-main-content .fxt-main-title {
  color: #fff;
  line-height: 1;
  font-size: 60px;
  font-weight: 700;
  margin-bottom: 40px;
  text-align: center;
  min-width: 100%;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout21 .fxt-main-content .fxt-main-title {
    font-size: 52px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout21 .fxt-main-content .fxt-main-title {
    font-size: 48px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout21 .fxt-main-content .fxt-main-title {
    font-size: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout21 .fxt-main-content .fxt-main-title {
    font-size: 36px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout21 .fxt-main-content .fxt-main-title {
    font-size: 34px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout21 .fxt-main-content .fxt-main-title {
    font-size: 32px;
  }
}
.fxt-template-layout21 .fxt-main-content .fxt-main-title b {
  text-align: center;
  right: 0;
  left: 0;
}
.fxt-template-layout21 .fxt-main-content .fxt-main-title b i {
  font-style: unset;
  margin-right: 7px;
}
.fxt-template-layout21 .fxt-main-content .fxt-paragraph {
  color: #d8d8d8;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 70px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout21 .fxt-main-content .fxt-paragraph {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout21 .fxt-main-content .fxt-paragraph {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout21 .fxt-main-content .fxt-paragraph {
    width: 80%;
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout21 .fxt-main-content .fxt-paragraph {
    width: 100%;
    margin-bottom: 30px;
  }
}
.fxt-template-layout21 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout21 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout21 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout21 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout21 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout21 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout21 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout21 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout21 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout21 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout21 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout21 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout21 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout21 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout21 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout21 .fxt-main-content .fxt-socials {
  position: absolute;
  z-index: 1;
  left: 130px;
  bottom: 150px;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout21 .fxt-main-content .fxt-socials {
    position: inherit;
    left: inherit;
    bottom: inherit;
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout21 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout21 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout21 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout21 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout21 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout21 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout21 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: #1f1f1f;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout21 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout21 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout21 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout21 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout21 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout21 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout21 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout21 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout21 .fxt-main-content .fxt-footer {
  position: absolute;
  z-index: 1;
  right: 130px;
  bottom: 150px;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout21 .fxt-main-content .fxt-footer {
    position: inherit;
    right: inherit;
    bottom: inherit;
  }
}
.fxt-template-layout21 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout21 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
    padding-top: 260px;
    padding-bottom: 300px;
  }
  body.open-sidebar .fxt-template-layout21 .fxt-main-content .fxt-logo {
    left: 50%;
    top: 125px;
    transform: translateX(-50%);
    margin: 0 auto;
  }
  body.open-sidebar .fxt-template-layout21 .fxt-main-content .fxt-socials {
    left: 50%;
    bottom: 200px;
    transform: translateX(-50%);
    margin: 0 auto;
  }
  body.open-sidebar .fxt-template-layout21 .fxt-main-content .fxt-footer {
    right: 50%;
    transform: translateX(50%);
    bottom: 100px;
    margin: 0 auto;
  }
}
/*========================================================================
27. Demo Layout Twenty Two
=========================================================================*/
.fxt-template-layout22 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout22 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout22 .fxt-main-content {
  padding-top: 280px;
  padding-bottom: 280px;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 100vh;
  min-width: 100vw;
  position: relative;
  z-index: 1;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout22 .fxt-main-content {
    min-width: 100%;
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout22 .fxt-main-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout22 .fxt-main-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout22 .fxt-main-content:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.8);
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.fxt-template-layout22 .fxt-main-content .fxt-logo {
  max-width: 40vw;
  position: absolute;
  z-index: 1;
  left: 130px;
  top: 150px;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout22 .fxt-main-content .fxt-logo {
    position: inherit;
    left: inherit;
    top: inherit;
    margin-bottom: 14vh;
    margin-top: 25px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout22 .fxt-main-content .fxt-logo {
    margin-bottom: 12vh;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout22 .fxt-main-content .fxt-logo {
    margin-bottom: 10vh;
    max-width: 40vw;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout22 .fxt-main-content .fxt-logo {
    margin-bottom: 8vh;
  }
}
.fxt-template-layout22 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 46px;
  font-family: 'Raleway', sans-serif;
  letter-spacing: 8px;
  margin-bottom: 25px;
  line-height: 1.4;
  margin-left: 8px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout22 .fxt-main-content .fxt-sub-title {
    font-size: 40px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout22 .fxt-main-content .fxt-sub-title {
    font-size: 36px;
    letter-spacing: 6px;
    line-height: 1.6;
    margin-left: 6px;
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout22 .fxt-main-content .fxt-sub-title {
    font-size: 32px;
    letter-spacing: 4px;
    line-height: 1.5;
    margin-left: 4px;
    margin-bottom: 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout22 .fxt-main-content .fxt-sub-title {
    font-size: 28px;
    letter-spacing: 2px;
    line-height: 1.4;
    margin-left: 2px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout22 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
    line-height: 1.3;
  }
}
.fxt-template-layout22 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout22 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout22 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout22 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout22 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout22 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout22 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout22 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout22 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout22 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout22 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout22 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout22 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout22 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout22 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout22 .fxt-main-content .fxt-socials {
  position: absolute;
  z-index: 1;
  left: 130px;
  bottom: 150px;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout22 .fxt-main-content .fxt-socials {
    position: inherit;
    left: inherit;
    bottom: inherit;
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout22 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout22 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout22 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout22 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout22 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout22 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout22 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: #1f1f1f;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout22 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout22 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout22 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout22 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout22 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout22 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout22 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout22 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout22 .fxt-main-content .fxt-footer {
  position: absolute;
  z-index: 1;
  right: 130px;
  bottom: 150px;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout22 .fxt-main-content .fxt-footer {
    position: inherit;
    right: inherit;
    bottom: inherit;
  }
}
.fxt-template-layout22 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
.fxt-template-layout22 .fxt-countdown {
  margin-bottom: 70px;
  padding-bottom: 50px;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout22 .fxt-countdown {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout22 .fxt-countdown {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout22 .fxt-countdown {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout22 .fxt-countdown {
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout22 .fxt-countdown {
    margin-bottom: 20px;
  }
}
.fxt-template-layout22 .fxt-countdown .countdown-section {
  display: inline-block;
  min-width: 70px;
  margin-right: 35px;
  padding-right: 35px;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section {
    margin-right: 30px;
    padding-right: 30px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section {
    margin-right: 25px;
    padding-right: 25px;
    min-width: 65px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section {
    margin-right: 20px;
    padding-right: 20px;
    min-width: 60px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section {
    min-width: 55px;
    margin-right: 15px;
    padding-right: 15px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section {
    min-width: 45px;
    margin-right: 10px;
    padding-right: 10px;
  }
}
.fxt-template-layout22 .fxt-countdown .countdown-section > div {
  position: relative;
  z-index: 1;
}
.fxt-template-layout22 .fxt-countdown .countdown-section:before {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 16px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section:before {
    top: 15px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section:before {
    top: 13px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section:before {
    top: 11px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section:before {
    top: 10px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section:before {
    top: 8px;
    right: -3px;
  }
}
.fxt-template-layout22 .fxt-countdown .countdown-section:after {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 38px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section:after {
    top: 43px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section:after {
    top: 38px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section:after {
    top: 32px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section:after {
    top: 28px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section:after {
    top: 23px;
    right: -3px;
  }
}
.fxt-template-layout22 .fxt-countdown .countdown-section:last-child {
  margin-right: 0;
  padding-right: 0;
}
.fxt-template-layout22 .fxt-countdown .countdown-section:last-child:after,
.fxt-template-layout22 .fxt-countdown .countdown-section:last-child:before {
  display: none;
}
.fxt-template-layout22 .fxt-countdown .countdown-section .countdown-number {
  font-size: 60px;
  line-height: 1;
  font-weight: 600;
  color: #ffffff;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section .countdown-number {
    font-size: 56px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section .countdown-number {
    font-size: 48px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section .countdown-number {
    font-size: 42px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section .countdown-number {
    font-size: 36px;
  }
}
.fxt-template-layout22 .fxt-countdown .countdown-section .countdown-unit {
  color: #d8d8d8;
  position: absolute;
  z-index: 1;
  bottom: -50px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 22px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 20px;
    bottom: -45px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 18px;
    bottom: -40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 16px;
    bottom: -35px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout22 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 15px;
    bottom: -30px;
  }
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout22 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
    padding-top: 260px;
    padding-bottom: 300px;
  }
  body.open-sidebar .fxt-template-layout22 .fxt-main-content .fxt-logo {
    left: 50%;
    top: 125px;
    transform: translateX(-50%);
    margin: 0 auto;
  }
  body.open-sidebar .fxt-template-layout22 .fxt-main-content .fxt-socials {
    left: 50%;
    bottom: 200px;
    transform: translateX(-50%);
    margin: 0 auto;
  }
  body.open-sidebar .fxt-template-layout22 .fxt-main-content .fxt-footer {
    right: 50%;
    transform: translateX(50%);
    bottom: 100px;
    margin: 0 auto;
  }
}
/*========================================================================
28. Demo Layout Twenty Three
=========================================================================*/
.fxt-template-layout23 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout23 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout23 #particles-js {
  position: absolute;
  width: 100vw;
  height: 100%;
  left: 0;
  top: 0;
  opacity: 0.3;
}
.fxt-template-layout23 .fxt-main-content {
  padding: 65px 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 100vh;
  min-width: 100vw;
  position: relative;
  z-index: 1;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout23 .fxt-main-content {
    min-width: 100%;
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout23 .fxt-main-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout23 .fxt-main-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout23 .fxt-main-content:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.6);
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.fxt-template-layout23 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout23 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 30px;
  margin-bottom: 5px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout23 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout23 .fxt-main-content .fxt-sub-title {
    font-size: 24px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout23 .fxt-main-content .fxt-sub-title {
    font-size: 22px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout23 .fxt-main-content .fxt-sub-title {
    font-size: 20px;
  }
}
.fxt-template-layout23 .fxt-main-content .fxt-main-title {
  color: #fff;
  font-weight: 600;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout23 .fxt-main-content .fxt-main-title {
    width: 95%;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout23 .fxt-main-content .fxt-main-title {
    width: 100%;
  }
}
.fxt-template-layout23 .fxt-main-content .fxt-paragraph {
  color: #d8d8d8;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 70px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout23 .fxt-main-content .fxt-paragraph {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout23 .fxt-main-content .fxt-paragraph {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout23 .fxt-main-content .fxt-paragraph {
    width: 80%;
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout23 .fxt-main-content .fxt-paragraph {
    width: 100%;
    margin-bottom: 30px;
  }
}
.fxt-template-layout23 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout23 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout23 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout23 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout23 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout23 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout23 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout23 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout23 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout23 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout23 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout23 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout23 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout23 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout23 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout23 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout23 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout23 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout23 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout23 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout23 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout23 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout23 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout23 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: #1f1f1f;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout23 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout23 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout23 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout23 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout23 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout23 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout23 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout23 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout23 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout23 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
  }
}
/*========================================================================
29. Demo Layout Twenty Four
=========================================================================*/
.fxt-template-layout24 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout24 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout24 #particles-js {
  position: absolute;
  width: 100vw;
  height: 100%;
  left: 0;
  top: 0;
  opacity: 0.5;
}
.fxt-template-layout24 .fxt-main-content {
  padding: 65px 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  min-height: 100vh;
  min-width: 100vw;
  position: relative;
  z-index: 1;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout24 .fxt-main-content {
    min-width: 100%;
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout24 .fxt-main-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout24 .fxt-main-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout24 .fxt-main-content:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.6);
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.fxt-template-layout24 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout24 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 46px;
  font-family: 'Raleway', sans-serif;
  letter-spacing: 8px;
  margin-bottom: 25px;
  line-height: 1.4;
  margin-left: 8px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout24 .fxt-main-content .fxt-sub-title {
    font-size: 40px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout24 .fxt-main-content .fxt-sub-title {
    font-size: 36px;
    letter-spacing: 6px;
    line-height: 1.6;
    margin-left: 6px;
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout24 .fxt-main-content .fxt-sub-title {
    font-size: 32px;
    letter-spacing: 4px;
    line-height: 1.5;
    margin-left: 4px;
    margin-bottom: 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout24 .fxt-main-content .fxt-sub-title {
    font-size: 28px;
    letter-spacing: 2px;
    line-height: 1.4;
    margin-left: 2px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout24 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
    line-height: 1.3;
  }
}
.fxt-template-layout24 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout24 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout24 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout24 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout24 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout24 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout24 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout24 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout24 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout24 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout24 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout24 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout24 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout24 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout24 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout24 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout24 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout24 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout24 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout24 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout24 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout24 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout24 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout24 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: #1f1f1f;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout24 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout24 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout24 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout24 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout24 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout24 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout24 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout24 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout24 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
.fxt-template-layout24 .fxt-countdown {
  margin-bottom: 70px;
  padding-bottom: 50px;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout24 .fxt-countdown {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout24 .fxt-countdown {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout24 .fxt-countdown {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout24 .fxt-countdown {
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout24 .fxt-countdown {
    margin-bottom: 20px;
  }
}
.fxt-template-layout24 .fxt-countdown .countdown-section {
  display: inline-block;
  min-width: 70px;
  margin-right: 35px;
  padding-right: 35px;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section {
    margin-right: 30px;
    padding-right: 30px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section {
    margin-right: 25px;
    padding-right: 25px;
    min-width: 65px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section {
    margin-right: 20px;
    padding-right: 20px;
    min-width: 60px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section {
    min-width: 55px;
    margin-right: 15px;
    padding-right: 15px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section {
    min-width: 45px;
    margin-right: 10px;
    padding-right: 10px;
  }
}
.fxt-template-layout24 .fxt-countdown .countdown-section > div {
  position: relative;
  z-index: 1;
}
.fxt-template-layout24 .fxt-countdown .countdown-section:before {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 16px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section:before {
    top: 15px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section:before {
    top: 13px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section:before {
    top: 11px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section:before {
    top: 10px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section:before {
    top: 8px;
    right: -3px;
  }
}
.fxt-template-layout24 .fxt-countdown .countdown-section:after {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 38px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section:after {
    top: 43px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section:after {
    top: 38px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section:after {
    top: 32px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section:after {
    top: 28px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section:after {
    top: 23px;
    right: -3px;
  }
}
.fxt-template-layout24 .fxt-countdown .countdown-section:last-child {
  margin-right: 0;
  padding-right: 0;
}
.fxt-template-layout24 .fxt-countdown .countdown-section:last-child:after,
.fxt-template-layout24 .fxt-countdown .countdown-section:last-child:before {
  display: none;
}
.fxt-template-layout24 .fxt-countdown .countdown-section .countdown-number {
  font-size: 60px;
  line-height: 1;
  font-weight: 600;
  color: #ffffff;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section .countdown-number {
    font-size: 56px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section .countdown-number {
    font-size: 48px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section .countdown-number {
    font-size: 42px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section .countdown-number {
    font-size: 36px;
  }
}
.fxt-template-layout24 .fxt-countdown .countdown-section .countdown-unit {
  color: #d8d8d8;
  position: absolute;
  z-index: 1;
  bottom: -50px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 22px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 20px;
    bottom: -45px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 18px;
    bottom: -40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 16px;
    bottom: -35px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout24 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 15px;
    bottom: -30px;
  }
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout24 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
  }
}
/*========================================================================
30. Demo Layout Twenty Five
=========================================================================*/
.fxt-template-layout25 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout25 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout25 canvas#canvas {
  width: 100vw;
  position: absolute;
  top: 0;
  left: 0;
  transform: translate3d(0, 0, 0);
  -webkit-backface-visibility: hidden;
  -webkit-perspective: 1000;
  background: #000000;
}
.fxt-template-layout25 .fxt-main-content {
  padding: 65px 0;
  background-color: #000;
  min-height: 100vh;
  min-width: 100vw;
  position: relative;
  z-index: 1;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout25 .fxt-main-content {
    min-width: 100%;
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout25 .fxt-main-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout25 .fxt-main-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout25 .fxt-main-content:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.6);
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.fxt-template-layout25 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout25 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 30px;
  margin-bottom: 5px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout25 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout25 .fxt-main-content .fxt-sub-title {
    font-size: 24px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout25 .fxt-main-content .fxt-sub-title {
    font-size: 22px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout25 .fxt-main-content .fxt-sub-title {
    font-size: 20px;
  }
}
.fxt-template-layout25 .fxt-main-content .fxt-main-title {
  color: #fff;
  font-weight: 600;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout25 .fxt-main-content .fxt-main-title {
    width: 95%;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout25 .fxt-main-content .fxt-main-title {
    width: 100%;
  }
}
.fxt-template-layout25 .fxt-main-content .fxt-paragraph {
  color: #d8d8d8;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 70px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout25 .fxt-main-content .fxt-paragraph {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout25 .fxt-main-content .fxt-paragraph {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout25 .fxt-main-content .fxt-paragraph {
    width: 80%;
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout25 .fxt-main-content .fxt-paragraph {
    width: 100%;
    margin-bottom: 30px;
  }
}
.fxt-template-layout25 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout25 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout25 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout25 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout25 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout25 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout25 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout25 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout25 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout25 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout25 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout25 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout25 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout25 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout25 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout25 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout25 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout25 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout25 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout25 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout25 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout25 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout25 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout25 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: #1f1f1f;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout25 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout25 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout25 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout25 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout25 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout25 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout25 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout25 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout25 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout25 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
  }
}
/*========================================================================
31. Demo Layout Twenty Six
=========================================================================*/
.fxt-template-layout26 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout26 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout26 canvas#canvas {
  width: 100vw;
  position: absolute;
  top: 0;
  left: 0;
  transform: translate3d(0, 0, 0);
  -webkit-backface-visibility: hidden;
  -webkit-perspective: 1000;
  background: #000000;
}
.fxt-template-layout26 .fxt-main-content {
  padding: 65px 0;
  background-color: #000;
  min-height: 100vh;
  min-width: 100vw;
  position: relative;
  z-index: 1;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout26 .fxt-main-content {
    min-width: 100%;
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout26 .fxt-main-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout26 .fxt-main-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout26 .fxt-main-content:before {
  content: "";
  background-color: rgba(0, 0, 0, 0.6);
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: -1;
}
.fxt-template-layout26 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout26 .fxt-main-content .fxt-sub-title {
  color: #fff;
  font-size: 46px;
  font-family: 'Raleway', sans-serif;
  letter-spacing: 8px;
  margin-bottom: 25px;
  line-height: 1.4;
  margin-left: 8px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout26 .fxt-main-content .fxt-sub-title {
    font-size: 40px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout26 .fxt-main-content .fxt-sub-title {
    font-size: 36px;
    letter-spacing: 6px;
    line-height: 1.6;
    margin-left: 6px;
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout26 .fxt-main-content .fxt-sub-title {
    font-size: 32px;
    letter-spacing: 4px;
    line-height: 1.5;
    margin-left: 4px;
    margin-bottom: 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout26 .fxt-main-content .fxt-sub-title {
    font-size: 28px;
    letter-spacing: 2px;
    line-height: 1.4;
    margin-left: 2px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout26 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
    line-height: 1.3;
  }
}
.fxt-template-layout26 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout26 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout26 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout26 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout26 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout26 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f1f1f1;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout26 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout26 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout26 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
}
.fxt-template-layout26 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout26 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout26 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout26 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout26 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #f1f1f1;
}
.fxt-template-layout26 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout26 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout26 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout26 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout26 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout26 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout26 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout26 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout26 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout26 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #ffffff;
  background-color: #1f1f1f;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout26 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout26 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout26 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout26 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout26 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout26 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout26 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout26 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout26 .fxt-main-content .fxt-footer p {
  color: #e3e3e3;
  font-size: 15px;
}
.fxt-template-layout26 .fxt-countdown {
  margin-bottom: 70px;
  padding-bottom: 50px;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout26 .fxt-countdown {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout26 .fxt-countdown {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout26 .fxt-countdown {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout26 .fxt-countdown {
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout26 .fxt-countdown {
    margin-bottom: 20px;
  }
}
.fxt-template-layout26 .fxt-countdown .countdown-section {
  display: inline-block;
  min-width: 70px;
  margin-right: 35px;
  padding-right: 35px;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section {
    margin-right: 30px;
    padding-right: 30px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section {
    margin-right: 25px;
    padding-right: 25px;
    min-width: 65px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section {
    margin-right: 20px;
    padding-right: 20px;
    min-width: 60px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section {
    min-width: 55px;
    margin-right: 15px;
    padding-right: 15px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section {
    min-width: 45px;
    margin-right: 10px;
    padding-right: 10px;
  }
}
.fxt-template-layout26 .fxt-countdown .countdown-section > div {
  position: relative;
  z-index: 1;
}
.fxt-template-layout26 .fxt-countdown .countdown-section:before {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 16px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section:before {
    top: 15px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section:before {
    top: 13px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section:before {
    top: 11px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section:before {
    top: 10px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section:before {
    top: 8px;
    right: -3px;
  }
}
.fxt-template-layout26 .fxt-countdown .countdown-section:after {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #ffffff;
  position: absolute;
  z-index: 1;
  top: 38px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section:after {
    top: 43px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section:after {
    top: 38px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section:after {
    top: 32px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section:after {
    top: 28px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section:after {
    top: 23px;
    right: -3px;
  }
}
.fxt-template-layout26 .fxt-countdown .countdown-section:last-child {
  margin-right: 0;
  padding-right: 0;
}
.fxt-template-layout26 .fxt-countdown .countdown-section:last-child:after,
.fxt-template-layout26 .fxt-countdown .countdown-section:last-child:before {
  display: none;
}
.fxt-template-layout26 .fxt-countdown .countdown-section .countdown-number {
  font-size: 60px;
  line-height: 1;
  font-weight: 600;
  color: #ffffff;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section .countdown-number {
    font-size: 56px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section .countdown-number {
    font-size: 48px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section .countdown-number {
    font-size: 42px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section .countdown-number {
    font-size: 36px;
  }
}
.fxt-template-layout26 .fxt-countdown .countdown-section .countdown-unit {
  color: #d8d8d8;
  position: absolute;
  z-index: 1;
  bottom: -50px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 22px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 20px;
    bottom: -45px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 18px;
    bottom: -40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 16px;
    bottom: -35px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout26 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 15px;
    bottom: -30px;
  }
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout26 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
  }
}
/*========================================================================
32. Demo Layout Twenty Seven
=========================================================================*/
.fxt-template-layout27 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout27 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout27 .fxt-main-content {
  padding: 65px 0;
  background-color: #fff;
  min-height: 100vh;
  min-width: 100vw;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout27 .fxt-main-content {
    min-width: 100%;
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout27 .fxt-main-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout27 .fxt-main-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout27 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout27 .fxt-main-content .fxt-sub-title {
  color: #f11e47;
  font-size: 30px;
  margin-bottom: 5px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout27 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout27 .fxt-main-content .fxt-sub-title {
    font-size: 24px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout27 .fxt-main-content .fxt-sub-title {
    font-size: 22px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout27 .fxt-main-content .fxt-sub-title {
    font-size: 20px;
  }
}
.fxt-template-layout27 .fxt-main-content .fxt-main-title {
  color: #232323;
  font-weight: 600;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout27 .fxt-main-content .fxt-main-title {
    width: 95%;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout27 .fxt-main-content .fxt-main-title {
    width: 100%;
  }
}
.fxt-template-layout27 .fxt-main-content .fxt-paragraph {
  color: #232323;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 70px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout27 .fxt-main-content .fxt-paragraph {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout27 .fxt-main-content .fxt-paragraph {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout27 .fxt-main-content .fxt-paragraph {
    width: 80%;
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout27 .fxt-main-content .fxt-paragraph {
    width: 100%;
    margin-bottom: 30px;
  }
}
.fxt-template-layout27 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout27 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout27 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout27 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout27 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout27 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #e1e1e1;
  color: #232323;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout27 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout27 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout27 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
  color: #f1f1f1;
}
.fxt-template-layout27 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout27 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout27 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout27 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout27 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #e1e1e1;
  color: #232323;
}
.fxt-template-layout27 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout27 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout27 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout27 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout27 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout27 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout27 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout27 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout27 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout27 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #232323;
  background-color: #eeeeee;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout27 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout27 .fxt-main-content .fxt-socials li a:hover {
  color: #fff;
}
.fxt-template-layout27 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout27 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout27 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout27 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout27 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout27 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout27 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout27 .fxt-main-content .fxt-footer p {
  color: #232323;
  font-size: 15px;
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout27 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
  }
}
/*========================================================================
33. Demo Layout Twenty Eight
=========================================================================*/
.fxt-template-layout28 {
  display: flex;
  align-items: flex-start;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout28 {
    display: block;
    min-width: 100%;
  }
}
.fxt-template-layout28 .fxt-main-content {
  padding: 65px 0;
  background-color: #fff;
  min-height: 100vh;
  min-width: 100vw;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  transition: all 0.8s ease-in-out;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout28 .fxt-main-content {
    min-width: 100%;
    padding: 55px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout28 .fxt-main-content {
    padding: 45px 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout28 .fxt-main-content {
    padding: 35px 15px;
  }
}
.fxt-template-layout28 .fxt-main-content .fxt-logo {
  margin-top: 25px;
  margin-bottom: 14vh;
  max-width: 40vw;
}
.fxt-template-layout28 .fxt-main-content .fxt-sub-title {
  color: #f11e47;
  font-size: 46px;
  font-family: 'Raleway', sans-serif;
  letter-spacing: 8px;
  margin-bottom: 25px;
  line-height: 1.4;
  margin-left: 8px;
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout28 .fxt-main-content .fxt-sub-title {
    font-size: 40px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout28 .fxt-main-content .fxt-sub-title {
    font-size: 36px;
    letter-spacing: 6px;
    line-height: 1.6;
    margin-left: 6px;
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout28 .fxt-main-content .fxt-sub-title {
    font-size: 32px;
    letter-spacing: 4px;
    line-height: 1.5;
    margin-left: 4px;
    margin-bottom: 15px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout28 .fxt-main-content .fxt-sub-title {
    font-size: 28px;
    letter-spacing: 2px;
    line-height: 1.4;
    margin-left: 2px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout28 .fxt-main-content .fxt-sub-title {
    font-size: 26px;
    line-height: 1.3;
  }
}
.fxt-template-layout28 .fxt-main-content .fxt-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout28 .fxt-main-content .fxt-buttons {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout28 .fxt-main-content .fxt-buttons {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout28 .fxt-main-content .fxt-buttons {
    margin-bottom: 30px;
  }
}
.fxt-template-layout28 .fxt-main-content .fxt-buttons .fxt-btn {
  margin: 0 7px 12px;
}
.fxt-template-layout28 .fxt-main-content .fxt-btn-ghost {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #e1e1e1;
  color: #232323;
  border-radius: 45px;
  background-color: transparent;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout28 .fxt-main-content .fxt-btn-ghost {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout28 .fxt-main-content .fxt-btn-ghost {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout28 .fxt-main-content .fxt-btn-ghost:hover {
  background-color: #f11e47;
  border-color: #f11e47;
  color: #f1f1f1;
}
.fxt-template-layout28 .fxt-main-content .fxt-btn-ghost:focus {
  outline: none;
}
.fxt-template-layout28 .fxt-main-content .fxt-btn-fill {
  text-align: center;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  font-size: 15px;
  font-weight: 600;
  box-shadow: none;
  outline: none;
  border: 1px solid;
  border-color: #f11e47;
  color: #f1f1f1;
  border-radius: 45px;
  background-color: #f11e47;
  padding: 12px 35px;
  min-width: 180px;
  margin-bottom: 10px;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout28 .fxt-main-content .fxt-btn-fill {
    font-size: 14px;
    padding: 11px 30px;
    min-width: 160px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout28 .fxt-main-content .fxt-btn-fill {
    font-size: 13px;
    padding: 10px 25px;
    min-width: 140px;
  }
}
.fxt-template-layout28 .fxt-main-content .fxt-btn-fill:hover {
  background-color: transparent;
  border-color: #e1e1e1;
  color: #232323;
}
.fxt-template-layout28 .fxt-main-content .fxt-btn-fill:focus {
  outline: none;
}
.fxt-template-layout28 .fxt-main-content .fxt-socials {
  margin-bottom: 70px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout28 .fxt-main-content .fxt-socials {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout28 .fxt-main-content .fxt-socials {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout28 .fxt-main-content .fxt-socials {
    margin-bottom: 40px;
  }
}
.fxt-template-layout28 .fxt-main-content .fxt-socials li {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 8px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout28 .fxt-main-content .fxt-socials li {
    margin-right: 10px;
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout28 .fxt-main-content .fxt-socials li {
    margin-right: 5px;
  }
}
.fxt-template-layout28 .fxt-main-content .fxt-socials li:last-child {
  margin-right: 0;
}
.fxt-template-layout28 .fxt-main-content .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: 16px;
  height: 45px;
  width: 45px;
  color: #232323;
  background-color: #eeeeee;
  border-radius: 50%;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout28 .fxt-main-content .fxt-socials li a {
    font-size: 15px;
    height: 40px;
    width: 40px;
  }
}
.fxt-template-layout28 .fxt-main-content .fxt-socials li a:hover {
  color: #fff;
}
.fxt-template-layout28 .fxt-main-content .fxt-socials li.fxt-facebook a:hover {
  background-color: #3b5998;
}
.fxt-template-layout28 .fxt-main-content .fxt-socials li.fxt-twitter a:hover {
  background-color: #00acee;
}
.fxt-template-layout28 .fxt-main-content .fxt-socials li.fxt-google a:hover {
  background-color: #CC3333;
}
.fxt-template-layout28 .fxt-main-content .fxt-socials li.fxt-instagram a:hover {
  background-color: #3f729b;
}
.fxt-template-layout28 .fxt-main-content .fxt-socials li.fxt-linkedin a:hover {
  background-color: #0077B5;
}
.fxt-template-layout28 .fxt-main-content .fxt-socials li.fxt-youtube a:hover {
  background-color: #c4302b;
}
.fxt-template-layout28 .fxt-main-content .fxt-socials li.fxt-pinterest a:hover {
  background-color: #bd081c;
}
.fxt-template-layout28 .fxt-main-content .fxt-footer p {
  color: #232323;
  font-size: 15px;
}
.fxt-template-layout28 .fxt-countdown {
  margin-bottom: 70px;
  padding-bottom: 50px;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout28 .fxt-countdown {
    margin-bottom: 60px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout28 .fxt-countdown {
    margin-bottom: 50px;
  }
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout28 .fxt-countdown {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout28 .fxt-countdown {
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout28 .fxt-countdown {
    margin-bottom: 20px;
  }
}
.fxt-template-layout28 .fxt-countdown .countdown-section {
  display: inline-block;
  min-width: 70px;
  margin-right: 35px;
  padding-right: 35px;
  position: relative;
  z-index: 1;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section {
    margin-right: 30px;
    padding-right: 30px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section {
    margin-right: 25px;
    padding-right: 25px;
    min-width: 65px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section {
    margin-right: 20px;
    padding-right: 20px;
    min-width: 60px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section {
    min-width: 55px;
    margin-right: 15px;
    padding-right: 15px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section {
    min-width: 45px;
    margin-right: 10px;
    padding-right: 10px;
  }
}
.fxt-template-layout28 .fxt-countdown .countdown-section > div {
  position: relative;
  z-index: 1;
}
.fxt-template-layout28 .fxt-countdown .countdown-section:before {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #000;
  position: absolute;
  z-index: 1;
  top: 16px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section:before {
    top: 15px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section:before {
    top: 13px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section:before {
    top: 11px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section:before {
    top: 10px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section:before {
    top: 8px;
    right: -3px;
  }
}
.fxt-template-layout28 .fxt-countdown .countdown-section:after {
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #000;
  position: absolute;
  z-index: 1;
  top: 38px;
  right: -5px;
}
@media only screen and (max-width: 1855px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section:after {
    top: 43px;
  }
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section:after {
    top: 38px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section:after {
    top: 32px;
    height: 8px;
    width: 8px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section:after {
    top: 28px;
    height: 5px;
    width: 5px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section:after {
    top: 23px;
    right: -3px;
  }
}
.fxt-template-layout28 .fxt-countdown .countdown-section:last-child {
  margin-right: 0;
  padding-right: 0;
}
.fxt-template-layout28 .fxt-countdown .countdown-section:last-child:after,
.fxt-template-layout28 .fxt-countdown .countdown-section:last-child:before {
  display: none;
}
.fxt-template-layout28 .fxt-countdown .countdown-section .countdown-number {
  font-size: 60px;
  line-height: 1;
  font-weight: 600;
  color: #000;
}
@media only screen and (max-width: 1439px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section .countdown-number {
    font-size: 56px;
  }
}
@media only screen and (max-width: 1199px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section .countdown-number {
    font-size: 48px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section .countdown-number {
    font-size: 42px;
  }
}
@media only screen and (max-width: 479px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section .countdown-number {
    font-size: 36px;
  }
}
.fxt-template-layout28 .fxt-countdown .countdown-section .countdown-unit {
  color: #666666;
  position: absolute;
  z-index: 1;
  bottom: -50px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 22px;
}
@media only screen and (max-width: 991px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 20px;
    bottom: -45px;
  }
}
@media only screen and (max-width: 767px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 18px;
    bottom: -40px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 16px;
    bottom: -35px;
  }
}
@media only screen and (max-width: 575px) {
  .fxt-template-layout28 .fxt-countdown .countdown-section .countdown-unit {
    font-size: 15px;
    bottom: -30px;
  }
}
@media only screen and (min-width: 992px) {
  body.open-sidebar .fxt-template-layout28 .fxt-main-content {
    min-width: 50vw;
    max-width: 50vw;
  }
}