.preloader {
    width: 100%;
    height: 100%;
    top: 0px;
    position: fixed;
    z-index: 99999;
    background: #fff;
  }

  .preloader .cssload-speeding-wheel {
    position: absolute;
    top: calc(50% - 3.5px);
    left: calc(50% - 3.5px);
  }

  .loader,
  .loader__figure {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }

  .loader {
    overflow: visible;
    padding-top: 2em;
    height: 0;
    width: 2em;
  }

  .loader__figure {
    height: 0;
    width: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 0 solid #1976d2;
    border-radius: 50%;
    -webkit-animation: loader-figure 1.15s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
    -moz-animation: loader-figure 1.15s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
    animation: loader-figure 1.15s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  .loader__label {
    float: left;
    margin-left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    margin: 0.5em 0 0 50%;
    font-size: 0.875em;
    letter-spacing: 0.1em;
    line-height: 1.5em;
    color: #1976d2;
    white-space: nowrap;
    -webkit-animation: loader-label 1.15s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
    -moz-animation: loader-label 1.15s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
    animation: loader-label 1.15s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  @-webkit-keyframes loader-figure {
    0% {
      height: 0;
      width: 0;
      background-color: #1976d2;
    }

    29% {
      background-color: #1976d2;
    }

    30% {
      height: 2em;
      width: 2em;
      background-color: transparent;
      border-width: 1em;
      opacity: 1;
    }

    100% {
      height: 2em;
      width: 2em;
      border-width: 0;
      opacity: 0;
      background-color: transparent;
    }
  }

  @-moz-keyframes loader-figure {
    0% {
      height: 0;
      width: 0;
      background-color: #1976d2;
    }

    29% {
      background-color: #1976d2;
    }

    30% {
      height: 2em;
      width: 2em;
      background-color: transparent;
      border-width: 1em;
      opacity: 1;
    }

    100% {
      height: 2em;
      width: 2em;
      border-width: 0;
      opacity: 0;
      background-color: transparent;
    }
  }

  @keyframes loader-figure {
    0% {
      height: 0;
      width: 0;
      background-color: #1976d2;
    }

    29% {
      background-color: #1976d2;
    }

    30% {
      height: 2em;
      width: 2em;
      background-color: transparent;
      border-width: 1em;
      opacity: 1;
    }

    100% {
      height: 2em;
      width: 2em;
      border-width: 0;
      opacity: 0;
      background-color: transparent;
    }
  }

  @-webkit-keyframes loader-label {
    0% {
      opacity: 0.25;
    }

    30% {
      opacity: 1;
    }

    100% {
      opacity: 0.25;
    }
  }

  @-moz-keyframes loader-label {
    0% {
      opacity: 0.25;
    }

    30% {
      opacity: 1;
    }

    100% {
      opacity: 0.25;
    }
  }

  @keyframes loader-label {
    0% {
      opacity: 0.25;
    }

    30% {
      opacity: 1;
    }

    100% {
      opacity: 0.25;
    }
  }

  /*
Template Name: Wrakit UI Kit
Author: wrappixel
Email: niravjoshi87@gmail.com
File: scss
*/
  /*
Template Name: Wrapkit
Author: wrappixel
Email: niravjoshi87@gmail.com
File: scss
*/
  /*Theme Colors*/
  /*bootstrap Color*/
  /*Light colors*/
  /*Normal Color*/
  /*Extra Variable*/
  /*Gradiant*/
  /******************* 
This is the font import from the google api 
*******************/
  @font-face {
    font-family: 'Calafia-Regular';
    src: url("../../assets/font/Calafia-Regular.eot?#iefix") format("embedded-opentype"), url("../../assets/font/Calafia-Regular.otf") format("opentype"), url("../../assets/font/Calafia-Regular.woff") format("woff"), url("../../assets/font/Calafia-Regular.ttf") format("truetype"), url("../../assets/font/Calafia-Regular.svg#Calafia-Regular") format("svg");
    font-weight: normal;
    font-style: normal;
  }

  /******************* 
Global Styles 
*******************/
  * {
    outline: none;
  }

  body {
    background: #ffffff;
    font-family: "Montserrat", sans-serif;
    margin: 0;
    overflow-x: hidden;
    color: #fff;
    font-weight: 300;
  }

  html {
    position: relative;
    min-height: 100%;
    background: #ffffff;
  }

  a:hover,
  a:focus {
    text-decoration: none;
  }

  a.link {
    color: #0071b3;
  }

  a.link:hover,
  a.link:focus {
    color: #dbd21b;
  }

  a.white-link {
    color: #ffffff;
  }

  a.white-link:hover,
  a.white-link:focus {
    color: #263238;
  }

  .img-responsive {
    width: 100%;
    height: auto;
    display: inline-block;
  }

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

  html body .mdi:before,
  html body .mdi-set {
    line-height: initial;
  }

  /*******************
Headings
*******************/
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    color: #ffffff;
    font-family: "Montserrat", sans-serif;
  }

  h1 {
    line-height: 24px;
    font-size: 24px;
    text-transform: uppercase;
    color: #ffff00;
    font-weight: bold;
  }

  h2 {
    line-height: 22px;
    font-size: 22px;
    text-transform: uppercase;
    font-weight: bold;
  }

  h3 {
    line-height: 18px;
    font-size: 18px;
  }

  h4 {
    line-height: 26px;
    font-size: 21px;
  }

  h5 {
    line-height: 22px;
    font-size: 18px;
    font-weight: 400;
  }

  h6 {
    line-height: 16px;
    font-size: 14px;
    font-weight: 400;
  }

  .display-5 {
    font-size: 3rem;
  }

  .display-6 {
    font-size: 36px;
  }

  .display-7 {
    font-size: 26px;
  }

  .box {
    border-radius: 4px;
    padding: 10px;
  }

  html body .dl {
    display: inline-block;
  }

  html body .db {
    display: block;
  }

  .no-wrap td,
  .no-wrap th {
    white-space: nowrap;
  }

  .circle {
    border-radius: 100%;
  }

  /*******************
Blockquote
*******************/
  html body blockquote {
    border-left: 5px solid #07d79c;
    border: 1px solid rgba(120, 130, 140, 0.13);
    padding: 15px;
  }

  .clear {
    clear: both;
  }

  ol li {
    margin: 5px 0;
  }

  /*******************
Paddings
*******************/
  html body .p-0 {
    padding: 0px;
  }

  html body .p-10 {
    padding: 10px;
  }

  html body .p-15 {
    padding: 15px;
  }

  html body .p-20 {
    padding: 20px;
  }

  html body .p-30 {
    padding: 30px;
  }

  html body .p-40 {
    padding: 40px;
  }

  html body .p-l-0 {
    padding-left: 0px;
  }

  html body .p-l-10 {
    padding-left: 10px;
  }

  html body .p-l-20 {
    padding-left: 20px;
  }

  html body .p-r-0 {
    padding-right: 0px;
  }

  html body .p-r-10 {
    padding-right: 10px;
  }

  html body .p-r-20 {
    padding-right: 20px;
  }

  html body .p-r-30 {
    padding-right: 30px;
  }

  html body .p-r-40 {
    padding-right: 40px;
  }

  html body .p-t-0 {
    padding-top: 0px;
  }

  html body .p-t-10 {
    padding-top: 10px;
  }

  html body .p-t-20 {
    padding-top: 20px;
  }

  html body .p-t-30 {
    padding-top: 30px;
  }

  html body .p-b-0 {
    padding-bottom: 0px;
  }

  html body .p-b-5 {
    padding-bottom: 5px;
  }

  html body .p-b-10 {
    padding-bottom: 10px;
  }

  html body .p-b-20 {
    padding-bottom: 20px;
  }

  html body .p-b-30 {
    padding-bottom: 30px;
  }

  html body .p-b-40 {
    padding-bottom: 40px;
  }


  /*******************
Margin
*******************/
  html body .m-0 {
    margin: 0px;
  }

  html body .m-l-5 {
    margin-left: 5px;
  }

  html body .m-l-10 {
    margin-left: 10px;
  }

  html body .m-l-15 {
    margin-left: 15px;
  }

  html body .m-l-20 {
    margin-left: 20px;
  }

  html body .m-l-30 {
    margin-left: 30px;
  }

  html body .m-l-40 {
    margin-left: 40px;
  }

  html body .m-r-5 {
    margin-right: 5px;
  }

  html body .m-r-10 {
    margin-right: 10px;
  }

  html body .m-r-15 {
    margin-right: 15px;
  }

  html body .m-r-20 {
    margin-right: 20px;
  }

  html body .m-r-30 {
    margin-right: 30px;
  }

  html body .m-r-40 {
    margin-right: 40px;
  }

  html body .m-t-0 {
    margin-top: 0px;
  }

  html body .m-t-5 {
    margin-top: 5px;
  }

  html body .m-t-10 {
    margin-top: 10px;
  }

  html body .m-t-15 {
    margin-top: 15px;
  }

  html body .m-t-20 {
    margin-top: 20px;
  }

  html body .m-t-30 {
    margin-top: 30px;
  }

  html body .m-t-40 {
    margin-top: 40px;
  }

  html body .m-b-0 {
    margin-bottom: 0px;
  }

  html body .m-b-5 {
    margin-bottom: 5px;
  }

  html body .m-b-10 {
    margin-bottom: 10px;
  }

  html body .m-b-15 {
    margin-bottom: 15px;
  }

  html body .m-b-20 {
    margin-bottom: 20px;
  }

  html body .m-b-30 {
    margin-bottom: 30px;
  }

  html body .m-b-40 {
    margin-bottom: 40px;
  }

  /*******************
vertical alignment
*******************/
  html body .vt {
    vertical-align: top;
  }

  html body .vm {
    vertical-align: middle;
  }

  html body .vb {
    vertical-align: bottom;
  }

  /*******************
Opacity
*******************/
  .op-8 {
    opacity: 0.8;
  }

  .op-7 {
    opacity: 0.7;
  }

  .op-5 {
    opacity: 0.5;
  }

  .op-3 {
    opacity: 0.3;
  }

  /*******************
font weight
*******************/
  html body .font-bold {
    font-weight: 700;
  }

  html body .font-semibold {
    font-weight: 600;
  }

  html body .font-normal {
    font-weight: normal;
  }

  html body .font-light {
    font-weight: 300;
  }

  html body .font-medium {
    font-weight: 500;
  }

  html body .font-16 {
    font-size: 16px;
  }

  html body .font-14 {
    font-size: 14px;
  }

  html body .font-13 {
    font-size: 13px;
  }

  html body .font-10 {
    font-size: 10px;
  }

  html body .font-18 {
    font-size: 18px;
  }

  html body .font-20 {
    font-size: 20px;
  }

  html body .font-stylish {
    font-family: "Calafia-Regular";
  }

  /*******************
Border
*******************/
  html body .b-0 {
    border: none !important;
  }

  html body .b-r {
    border-right: 1px solid rgba(120, 130, 140, 0.13);
  }

  html body .b-l {
    border-left: 1px solid rgba(120, 130, 140, 0.13);
  }

  html body .b-b {
    border-bottom: 1px solid rgba(120, 130, 140, 0.13);
  }

  html body .b-t {
    border-top: 1px solid rgba(120, 130, 140, 0.13);
  }

  html body .b-all {
    border: 1px solid rgba(120, 130, 140, 0.13) !important;
  }

  /*******************
Thumb size
*******************/
  .thumb-sm {
    height: 32px;
    width: 32px;
  }

  .thumb-md {
    height: 48px;
    width: 48px;
  }

  .thumb-lg {
    height: 88px;
    width: 88px;
  }

  .hide {
    display: none;
  }

  .img-circle {
    border-radius: 100%;
  }

  .radius {
    border-radius: 4px;
  }

  /*******************
Text Colors
*******************/
  .text-white {
    color: #ffffff !important;
  }

  .text-danger {
    color: #00466a !important;
  }

  .text-muted {
    color: #8d97ad !important;
  }

  .text-warning {
    color: #fd4913 !important;
  }

  .text-success {
    color: #0071b3 !important;
  }

  .text-info {
    color: #0071b3 !important;
  }

  .text-inverse {
    color: #3e4555 !important;
  }

  .text-gris-clair {
    color: #d1d1d1 !important;
  }

  .text-gris-moyen {
    color: #919191 !important;
  }

  .text-black {
    color: #000000 !important;
  }

  .text-success-gradiant {
    background: #0071b3;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
  }

  .text-info-gradiant {
    background: #188ef4;
    background: -webkit-linear-gradient(legacy-direction(to right), #188ef4 0%, #316ce8 100%);
    background: -webkit-gradient(linear, left top, right top, from(#188ef4), to(#316ce8));
    background: -webkit-linear-gradient(left, #188ef4 0%, #316ce8 100%);
    background: -o-linear-gradient(left, #188ef4 0%, #316ce8 100%);
    background: linear-gradient(to right, #188ef4 0%, #316ce8 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
  }

  html body .text-blue {
    color: #02bec9;
  }

  html body .text-purple {
    color: #7460ee;
  }

  html body .text-primary {
    color: #316ce8 !important;
  }

  html body .text-megna {
    color: #1dc8cd;
  }

  html body .text-dark {
    color: #8d97ad;
  }

  html body .text-themecolor {
    color: #07d79c;
  }

  /*******************
Background Colors
*******************/
  .bg-primary {
    background-color: #316ce8 !important;
  }

  .bg-success {
    background-color: #2cdd9b !important;
  }

  .bg-info {
    background-color: #0071b3 !important;
  }

  .bg-warning {
    background-color: #fd4913 !important;
    color: #fff !important;
  }

  .bg-danger {
    background-color: #00466a !important;
  }

  .bg-orange {
    background-color: #ff6a5b !important;
  }

  .bg-yellow {
    background-color: #fed700;
  }

  .bg-facebook {
    background-color: #3b5a9a;
  }

  .bg-twitter {
    background-color: #56adf2;
  }


  .bg-success-gradiant {
    background: #0071b3;
    color: #ffffff;
  }

  .bg-info-gradiant {
    background: #0071b3;
    color: #fff;
  }

  .bg-danger-gradiant {
    background: #00466a;
    color: #fff;
  }

  html body .bg-megna {
    background-color: #1dc8cd;
  }

  html body .bg-theme {
    background-color: #07d79c;
  }

  html body .bg-inverse {
    background-color: #3e4555;
  }

  html body .bg-purple {
    background-color: #7460ee;
  }

  html body .bg-light {
    background-color: #111 !important;
  }

  html body .bg-light-primary {
    background-color: #f1effd;
  }

  html body .bg-light-success {
    background-color: #0071b3;
    color: #ffffff  }

  html body .bg-light-info {
    background-color: #cfecfe;
  }

  html body .bg-light-extra {
    background-color: #ebf3f5;
  }

  html body .bg-light-warning {
    background-color: #fd4913;
  }

  html body .bg-light-danger {
    background-color: #00466a;
  }

  html body .bg-light-inverse {
    background-color: #f6f6f6;
  }

  html body .bg-light {
    background-color: #f5f7fa;
  }

  html body .bg-white {
    background-color: #ffffff;
  }

  html body .bg-dark {
    background-color: #000000 !important;
  }

  /*******************
Rounds
*******************/
  .round {
    line-height: 48px;
    color: #ffffff;
    width: 50px;
    height: 50px;
    display: inline-block;
    font-weight: 400;
    text-align: center;
    border-radius: 100%;
    background: #188ef4;
  }

  .round img {
    border-radius: 100%;
  }

  .round-lg {
    line-height: 65px;
    width: 60px;
    height: 60px;
    font-size: 30px;
  }

  .round.round-info {
    background: #188ef4;
  }

  .round.round-warning {
    background: #fd4913;
  }

  .round.round-danger {
    background: #00466a;
  }

  .round.round-success {
    background: #0071b3;
    color: #ffffff;
  }

  .round.round-primary {
    background: #316ce8;
  }

  /*******************
Labels
*******************/
  .label {
    padding: 3px 15px;
    line-height: 13px;
    color: #ffffff;
    font-weight: 400;
    border-radius: 4px;
    font-size: 75%;
  }

  .label-rounded {
    border-radius: 60px;
  }

  .label-custom {
    background-color: #1dc8cd;
  }

  .label-success {
    background-color: #0071b3;
    color: #ffffff;
  }

  .label-info {
    background-color: #188ef4;
  }

  .label-warning {
    background-color: #fd4913;
  }

  .label-danger {
    background-color: #00466a;
  }

  .label-megna {
    background-color: #1dc8cd;
  }

  .label-primary {
    background-color: #316ce8;
  }

  .label-purple {
    background-color: #7460ee;
  }

  .label-red {
    background-color: #fb3a3a;
  }

  .label-inverse {
    background-color: #3e4555;
  }

  .label-default {
    background-color: #f5f7fa;
  }

  .label-white {
    background-color: #ffffff;
  }

  .label-light-success {
    background-color: #0071b3;
    color: #ffffff;
  }

  .label-light-info {
    background-color: #cfecfe;
    color: #188ef4;
  }

  .label-light-warning {
    background-color: #fd4913;
    color: #fff;
  }

  .label-light-danger {
    background-color: #00466a;
    color: #fff;
  }

  .label-light-megna {
    background-color: #e0f2f4;
    color: #1dc8cd;
  }

  .label-light-primary {
    background-color: #f1effd;
    color: #316ce8;
  }

  .label-light-inverse {
    background-color: #f6f6f6;
    color: #3e4555;
  }

  /*******************
 Badge
******************/
  .badge {
    font-weight: 400;
  }

  .badge-xs {
    font-size: 9px;
  }

  .badge-xs,
  .badge-sm {
    -webkit-transform: translate(0, -2px);
    -ms-transform: translate(0, -2px);
    -o-transform: translate(0, -2px);
    transform: translate(0, -2px);
  }

  .badge-success {
    background-color: #0071b3;
    color: #ffffff;
  }

  .badge-info {
    background-color: #188ef4;
  }

  .badge-primary {
    background-color: #316ce8;
  }

  .badge-warning {
    background-color: #fd4913;
  }

  .badge-danger {
    background-color: #00466a;
  }

  .badge-purple {
    background-color: #7460ee;
  }

  .badge-red {
    background-color: #fb3a3a;
  }

  .badge-inverse {
    background-color: #3e4555;
  }

  /*******************
List-style-none
******************/
  ul.list-style-none {
    margin: 0px;
    padding: 0px;
  }

  ul.list-style-none li {
    list-style: none;
  }

  ul.list-style-none li a {
    color: #8d97ad;
    padding: 8px 0px;
    display: block;
    text-decoration: none;
  }

  ul.list-style-none li a:hover {
    color: #07d79c;
  }

  /*******************
dropdown-item
******************/
  .dropdown-item {
    padding: 8px 1rem;
    padding-right: 30px;
    color: #8d97ad;
  }

  /*******************
Buttons
******************/
  .btn {
    color: #ffffff;
    padding: 10px 25px;
    cursor: pointer;
    -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.14);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.14);
    -webkit-transition: 0s;
    -o-transition: 0s;
    transition: 0s;
    height: auto;
    box-sizing: border-box;
    border-radius: 0.25rem !important;
  }

  .btn:hover {
    color: #ffffff;
  }

  .btn:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
  }

  .btn-link {
    -webkit-box-shadow: none;
    box-shadow: none;
    color: #263238;
    padding: 10px 15px;
  }

  .btn-link .underline {
    border-bottom: 1px solid #263238;
  }

  .btn-link:hover {
    color: #2cdd9b;
  }

  .btn-light {
    color: #263238;
  }

  .btn-light:hover {
    background: #263238;
    color: #ffffff;
    border-color: #263238;
  }

  .btn-lg {
    padding: .75rem 1.5rem;
    font-size: 1.25rem;
  }

  .btn-md {
    padding: 15px 45px;
    font-size: 16px;
  }

  .btn-sm {
    padding: .25rem .5rem;
    font-size: 12px;
  }

  .btn-xs {
    padding: .25rem .5rem;
    font-size: 10px;
  }

  .btn-circle {
    border-radius: 100%;
    width: 40px;
    height: 40px;
    padding: 10px;
  }

  .btn-circle.btn-md {
    padding: 18px 0px;
    width: 60px;
    height: 60px;
    font-size: 20px;
  }

  .btn-circle.btn-sm {
    width: 35px;
    height: 35px;
    padding: 8px 10px;
    font-size: 14px;
  }

  .btn-circle.btn-lg {
    width: 70px;
    height: 70px;
    padding: 24px 15px;
    font-size: 20px;
    line-height: 23px;
  }

  .btn-circle.btn-xl {
    width: 70px;
    height: 70px;
    padding: 14px 15px;
    font-size: 24px;
  }

  .btn-rounded {
    border-radius: 60px;
    -webkit-border-radius: 60px;
  }

  .btn-arrow {
    position: relative;
  }

  .btn-arrow span {
    display: inline-block;
    position: relative;
    -webkit-transition: all 300ms ease-out;
    -o-transition: all 300ms ease-out;
    transition: all 300ms ease-out;
    will-change: transform;
  }

  .btn-arrow:hover span,
  .btn-arrow:focus span {
    -webkit-transform: translate3d(-1rem, 0, 0);
    transform: translate3d(-1rem, 0, 0);
  }

  .btn-arrow i {
    position: absolute;
    width: 1.1em;
    right: 0px;
    right: 0rem;
    opacity: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: all 300ms ease-out;
    -o-transition: all 300ms ease-out;
    transition: all 300ms ease-out;
    will-change: right, opacity;
  }

  .btn-arrow:hover i,
  .btn-arrow:focus i {
    opacity: 1;
    right: -2rem;
  }

  .btn-secondary,
  .btn-secondary.disabled {
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
    background-color: #ffffff;
    color: #8d97ad;
  }

  .btn-secondary:hover,
  .btn-secondary.disabled:hover {
    color: #ffffff !important;
  }

  .btn-secondary.active,
  .btn-secondary:active,
  .btn-secondary:focus,
  .btn-secondary.disabled.active,
  .btn-secondary.disabled:active,
  .btn-secondary.disabled:focus {
    color: #ffffff !important;
    background: #263238;
    border-color: #263238;
  }

  .btn-primary,
  .btn-primary.disabled {
    background: #316ce8;
    border: 1px solid #316ce8;
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
  }

  .btn-primary:hover,
  .btn-primary.disabled:hover {
    background: #345bcb;
    border: 1px solid #345bcb;
  }

  .btn-primary.active,
  .btn-primary:active,
  .btn-primary:focus,
  .btn-primary.disabled.active,
  .btn-primary.disabled:active,
  .btn-primary.disabled:focus {
    background: #345bcb;
  }

  .btn-themecolor,
  .btn-themecolor.disabled {
    background: #07d79c;
    color: #ffffff;
    border: 1px solid #07d79c;
  }

  .btn-themecolor:hover,
  .btn-themecolor.disabled:hover {
    background: #3aba85;
    border: 1px solid #3aba85;
  }

  .btn-themecolor.active,
  .btn-themecolor:active,
  .btn-themecolor:focus,
  .btn-themecolor.disabled.active,
  .btn-themecolor.disabled:active,
  .btn-themecolor.disabled:focus {
    background: #3aba85;
  }

  .btn-success,
  .btn-success.disabled {
    background: #0071b3;
    border: 1px solid #0071b3;
    color: #ffffff !important;
    transition: 0.3s ease;
  }

  .btn-success:hover,
  .btn-success.disabled:hover {
    background: #edb100;
    border: 1px solid #edb100;
    color: #fff  }

  .btn-success.active,
  .btn-success:active,
  .btn-success:focus,
  .btn-success.disabled.active,
  .btn-success.disabled:active,
  .btn-success.disabled:focus {
    background: #edb100;
  }

  .btn-info,
  .btn-info.disabled {
    background: #0071b3;
    border: 1px solid #0071b3;
    color: #fff;
    transition: 0.2s ease-in;
  }

  .btn-info:hover,
  .btn-info.disabled:hover {
    background: #104683;
    border: 1px solid #104683;
    transition: 0.3s ease;
    color: #EEE  }

  .btn-info.active,
  .btn-info:active,
  .btn-info:focus,
  .btn-info.disabled.active,
  .btn-info.disabled:active,
  .btn-info.disabled:focus {
    background: background: #104683;
  }

  .btn-warning,
  .btn-warning.disabled {
    background: #fd4913;
    color: #fff;
    border: 1px solid #fd4913;
  }

  .btn-warning:hover,
  .btn-warning.disabled:hover {
    background: #ff3f06;
    color: #ffffff;
    border: 1px solid #ff3f06;
  }

  .btn-warning.active,
  .btn-warning:active,
  .btn-warning:focus,
  .btn-warning.disabled.active,
  .btn-warning.disabled:active,
  .btn-warning.disabled:focus {
    background: #ff3f06;
    color: #ffffff;
  }

  .btn-danger,
  .btn-danger.disabled {
    background: #00466a;
    border: 1px solid #00466a;
    transition: 0.2s ease-in;
  }

  .btn-danger:hover,
  .btn-danger.disabled:hover {
    background: #00466a;
    border: 1px solid #00466a;
    color: #fff;
  }

  .btn-danger.active,
  .btn-danger:active,
  .btn-danger:focus,
  .btn-danger.disabled.active,
  .btn-danger.disabled:active,
  .btn-danger.disabled:focus {
    background: #00466a;
    border: 1px solid #00466a;
    color: #fff;
  }

  .btn-inverse,
  .btn-inverse.disabled {
    background: #3e4555;
    border: 1px solid #3e4555;
    color: #ffffff;
  }

  .btn-inverse:hover,
  .btn-inverse.disabled:hover {
    background: #232a37;
    color: #ffffff;
    border: 1px solid #232a37;
  }

  .btn-inverse.active,
  .btn-inverse:active,
  .btn-inverse:focus,
  .btn-inverse.disabled.active,
  .btn-inverse.disabled:active,
  .btn-inverse.disabled:focus {
    background: #232a37;
    color: #ffffff;
  }

  .btn-red,
  .btn-red.disabled {
    background: #fb3a3a;
    border: 1px solid #fb3a3a;
    color: #ffffff;
  }

  .btn-red:hover,
  .btn-red.disabled:hover {
    border: 1px solid #d61f1f;
    background: #d61f1f;
  }

  .btn-red.active,
  .btn-red:active,
  .btn-red:focus,
  .btn-red.disabled.active,
  .btn-red.disabled:active,
  .btn-red.disabled:focus {
    background: #d73e6b;
  }

  .btn-success-gradiant {
    background: #0071b3;
    color: #ffffff;
  }

  .btn-success-gradiant:hover {
    background: #edb100;
    color: #fff;
  }

  .btn-success-gradiant.active,
  .btn-success-gradiant:active,
  .btn-success-gradiant:focus {
    -webkit-box-shadow: 0px;
    box-shadow: 0px;
    opacity: 1;
  }

  .btn-danger-gradiant {
    background: #00466a;
    border: 0px;
  }

  .btn-danger-gradiant:hover {
    background: #00466a;
  }

  .btn-danger-gradiant.active,
  .btn-danger-gradiant:active,
  .btn-danger-gradiant:focus {
    -webkit-box-shadow: 0px;
    box-shadow: 0px;
    opacity: 1;
  }

  .btn-info-gradiant {
    background: #188ef4;
    background: -webkit-linear-gradient(legacy-direction(to right), #188ef4 0%, #316ce8 100%);
    background: -webkit-gradient(linear, left top, right top, from(#188ef4), to(#316ce8));
    background: -webkit-linear-gradient(left, #188ef4 0%, #316ce8 100%);
    background: -o-linear-gradient(left, #188ef4 0%, #316ce8 100%);
    background: linear-gradient(to right, #188ef4 0%, #316ce8 100%);
    border: 0px;
  }

  .btn-info-gradiant:hover {
    background: #316ce8;
    background: -webkit-linear-gradient(legacy-direction(to right), #316ce8 0%, #188ef4 100%);
    background: -webkit-gradient(linear, left top, right top, from(#316ce8), to(#188ef4));
    background: -webkit-linear-gradient(left, #316ce8 0%, #188ef4 100%);
    background: -o-linear-gradient(left, #316ce8 0%, #188ef4 100%);
    background: linear-gradient(to right, #316ce8 0%, #188ef4 100%);
  }

  .btn-info-gradiant.active,
  .btn-info-gradiant:active,
  .btn-info-gradiant:focus {
    -webkit-box-shadow: 0px;
    box-shadow: 0px;
    opacity: 1;
  }

  .btn-outline-secondary {
    background-color: #ffffff;
    color: #727b84;
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
  }

  .btn-outline-secondary.active,
  .btn-outline-secondary:active,
  .btn-outline-secondary:focus {
    background: #263238;
  }

  .btn-outline-primary {
    color: #316ce8;
    background-color: #ffffff;
    border-color: #316ce8;
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
  }

  .btn-outline-primary:hover,
  .btn-outline-primary:focus,
  .btn-outline-primary.focus {
    background: #316ce8;
    color: #ffffff;
    border-color: #316ce8;
  }

  .btn-outline-primary.active,
  .btn-outline-primary:active,
  .btn-outline-primary:focus {
    background: #345bcb;
  }

  .btn-outline-success,
  a.btn-outline-success {
    color: #0071b3;
    background-color: transparent;
    border-color: #0071b3;
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
  }

  .btn-outline-success:hover,
  .btn-outline-success:focus,
  .btn-outline-success.focus,
  a.btn-outline-success:hover,
  a.btn-outline-success:focus,
  a.btn-outline-success.focus {
    background: #edb100;
    border-color: #edb100;
    color: #fff;
  }

  .btn-outline-success.active,
  .btn-outline-success:active,
  .btn-outline-success:focus,
  a.btn-outline-success.active,
  a.btn-outline-success:active,
  a.btn-outline-success:focus {
    background: #edb100;
  }

  .btn-outline-info {
    color: #188ef4;
    background-color: transparent;
    border-color: #188ef4;
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
  }

  .btn-outline-info:hover,
  .btn-outline-info:focus,
  .btn-outline-info.focus {
    background: #188ef4;
    border-color: #188ef4;
    color: #ffffff;
  }

  .btn-outline-info.active,
  .btn-outline-info:active,
  .btn-outline-info:focus {
    background: #2c73cb;
  }

  .btn-outline-warning {
    color: #fd4913;
    background-color: transparent;
    border-color: #fd4913;
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
  }

  .btn-outline-warning:hover,
  .btn-outline-warning:focus,
  .btn-outline-warning.focus {
    background: #fd4913;
    border-color: #fd4913;
    color: #fff;
  }

  .btn-outline-warning.active,
  .btn-outline-warning:active,
  .btn-outline-warning:focus {
    background: #ff3f06;
  }

  .btn-outline-danger {
    color: #00466a;
    background-color: transparent;
    border-color: #00466a;
    - transition: 0.2s ease-in;
  }

  .btn-outline-danger:hover,
  .btn-outline-danger:focus,
  .btn-outline-danger.focus {
    background: #00466a;
    border-color: #00466a;
    color: #fff;
  }

  .btn-outline-danger.active,
  .btn-outline-danger:active,
  .btn-outline-danger:focus {
    background: #00466a;
    color: #fff;
  }

  .btn-outline-red {
    color: #fb3a3a;
    background-color: transparent;
    border-color: #fb3a3a;
  }

  .btn-outline-red:hover,
  .btn-outline-red:focus,
  .btn-outline-red.focus {
    background: #fb3a3a;
    border-color: #fb3a3a;
    color: #ffffff;
  }

  .btn-outline-red.active,
  .btn-outline-red:active,
  .btn-outline-red:focus {
    background: #d73e6b;
  }

  .btn-outline-inverse {
    color: #3e4555;
    background-color: transparent;
    border-color: #3e4555;
  }

  .btn-outline-inverse:hover,
  .btn-outline-inverse:focus,
  .btn-outline-inverse.focus {
    background: #3e4555;
    border-color: #3e4555;
    color: #ffffff;
  }

  .btn-outline-light:hover {
    color: #263238 !important;
  }

  .btn-primary.active.focus,
  .btn-primary.active:focus,
  .btn-primary.active:hover,
  .btn-primary.focus:active,
  .btn-primary:active:focus,
  .btn-primary:active:hover,
  .open>.dropdown-toggle.btn-primary.focus,
  .open>.dropdown-toggle.btn-primary:focus,
  .open>.dropdown-toggle.btn-primary:hover,
  .btn-primary.focus,
  .btn-primary:focus {
    background-color: #345bcb;
    border: 1px solid #345bcb;
  }

  .btn-success.active.focus,
  .btn-success.active:focus,
  .btn-success.active:hover,
  .btn-success.focus:active,
  .btn-success:active:focus,
  .btn-success:active:hover,
  .open>.dropdown-toggle.btn-success.focus,
  .open>.dropdown-toggle.btn-success:focus,
  .open>.dropdown-toggle.btn-success:hover,
  .btn-success.focus,
  .btn-success:focus {
    background-color: #0071b3;
    border: 1px solid #0071b3;
  }

  .btn-info.active.focus,
  .btn-info.active:focus,
  .btn-info.active:hover,
  .btn-info.focus:active,
  .btn-info:active:focus,
  .btn-info:active:hover,
  .open>.dropdown-toggle.btn-info.focus,
  .open>.dropdown-toggle.btn-info:focus,
  .open>.dropdown-toggle.btn-info:hover,
  .btn-info.focus,
  .btn-info:focus {
    background-color: #2c73cb;
    border: 1px solid #2c73cb;
  }

  .btn-warning.active.focus,
  .btn-warning.active:focus,
  .btn-warning.active:hover,
  .btn-warning.focus:active,
  .btn-warning:active:focus,
  .btn-warning:active:hover,
  .open>.dropdown-toggle.btn-warning.focus,
  .open>.dropdown-toggle.btn-warning:focus,
  .open>.dropdown-toggle.btn-warning:hover,
  .btn-warning.focus,
  .btn-warning:focus {
    background-color: #ff3f06;
    border: #ff3f06;
  }

  .btn-danger.active.focus,
  .btn-danger.active:focus,
  .btn-danger.active:hover,
  .btn-danger.focus:active,
  .btn-danger:active:focus,
  .btn-danger:active:hover,
  .open>.dropdown-toggle.btn-danger.focus,
  .open>.dropdown-toggle.btn-danger:focus,
  .open>.dropdown-toggle.btn-danger:hover,
  .btn-danger.focus,
  .btn-danger:focus {
    background-color: #00466a;
    border: 1px solid #00466a;
  }

  .btn-inverse:hover,
  .btn-inverse:focus,
  .btn-inverse:active,
  .btn-inverse.active,
  .btn-inverse.focus,
  .btn-inverse:active,
  .btn-inverse:focus,
  .btn-inverse:hover,
  .open>.dropdown-toggle.btn-inverse {
    background-color: #232a37;
    border: 1px solid #232a37;
  }

  .btn-red:hover,
  .btn-red:focus,
  .btn-red:active,
  .btn-red.active,
  .btn-red.focus,
  .btn-red:active,
  .btn-red:focus,
  .btn-red:hover,
  .open>.dropdown-toggle.btn-red {
    background-color: #d61f1f;
    border: 1px solid #d61f1f;
    color: #ffffff;
  }

  .btn span.btn-devider {
    display: inline-block;
    padding-left: 10px;
  }

  /*-------------------*/
  /*On off switch*/
  /*-------------------*/
  .onoffswitch {
    position: relative;
    width: 70px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    margin: 0 auto;
  }

  .onoffswitch-checkbox {
    display: none;
  }

  .onoffswitch-label {
    display: block;
    overflow: hidden;
    cursor: pointer;
    border: 2px solid transparent;
    border-radius: 20px;
  }

  .onoffswitch-inner {
    display: block;
    width: 200%;
    margin-left: -100%;
    -webkit-transition: margin 0.3s ease-in 0s;
    -o-transition: margin 0.3s ease-in 0s;
    transition: margin 0.3s ease-in 0s;
  }

  .onoffswitch-inner:before,
  .onoffswitch-inner:after {
    display: block;
    float: left;
    width: 50%;
    height: 30px;
    padding: 0;
    line-height: 30px;
    font-size: 14px;
    color: white;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  .onoffswitch-inner:before {
    content: "";
    padding-right: 27px;
    background-color: #2cdd9b;
    color: #FFFFFF;
  }

  .onoffswitch-inner:after {
    content: "";
    padding-right: 24px;
    background-color: #3e4555;
    color: #999999;
    text-align: right;
  }

  .onoffswitch-switch {
    display: block;
    width: 23px;
    margin: 6px;
    background: #FFFFFF;
    height: 23px;
    position: absolute;
    top: -1px;
    bottom: 0;
    right: 35px;
    border-radius: 20px;
    -webkit-transition: all 0.3s ease-in 0s;
    -o-transition: all 0.3s ease-in 0s;
    transition: all 0.3s ease-in 0s;
  }

  .onoffswitch-checkbox:checked+.onoffswitch-label .onoffswitch-inner {
    margin-left: 0;
  }

  .onoffswitch-checkbox:checked+.onoffswitch-label .onoffswitch-switch {
    right: 0px;
  }

  /*-------------------*/
  /*Bootstrap 4 hack*/
  /*-------------------*/
  .card-columns {
    -webkit-column-gap: 30px;
    -moz-column-gap: 30px;
    column-gap: 30px;
  }

  .card-columns .card {
    margin-bottom: 30px;
  }

  .invisible {
    visibility: hidden !important;
  }

  .hidden-xs-up {
    display: none !important;
  }

  @media (max-width: 575px) {
    .hidden-xs-down {
      display: none !important;
    }
  }

  @media (min-width: 576px) {
    .hidden-sm-up {
      display: none !important;
    }
  }

  @media (max-width: 767px) {
    .hidden-sm-down {
      display: none !important;
    }
  }

  @media (min-width: 768px) {
    .hidden-md-up {
      display: none !important;
    }
  }

  @media (max-width: 991px) {
    .hidden-md-down {
      display: none !important;
    }
  }

  @media (min-width: 992px) {
    .hidden-lg-up {
      display: none !important;
    }
  }

  @media (max-width: 1199px) {
    .hidden-lg-down {
      display: none !important;
    }
  }

  @media (min-width: 1200px) {
    .hidden-xl-up {
      display: none !important;
    }
  }

  .hidden-xl-down {
    display: none !important;
  }

  /*
Template Name: Wrakit UI Kit
Author: wrappixel
Email: niravjoshi87@gmail.com
File: scss
*/
  /******************* 
Topbar
*******************/
  .topbar {
    top:0;
    padding: 0px;
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
    width: 100%;
    position: fixed;
    z-index: 20;
  }

  .topbar.fixed-header {
    -webkit-box-shadow: 0px 0px 30px rgba(115, 128, 157, 0.1);
    box-shadow: 0px 0px 30px rgba(115, 128, 157, 0.1);
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
    background: #ffffff;
  }

  .topbar.fixed-header .navbar .navbar-brand img {
    height: 50px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translateZ(0) scale(1, 1);
    transform: translateZ(0) scale(1, 1);
  }

  /*******************
Header 6
*******************/
  .header6 .navbar-toggler {
    color: #ffffff;
  }

  .header6 .navbar-brand {
    line-height: 80px;
  }

  .h6-nav-bar {
    padding: 0px;
  }

  .h6-nav-bar .navbar-nav .nav-link {
    padding: 35px 15px;
    color: rgba(255, 255, 255, 0.5);
  }

  .h6-nav-bar .navbar-nav .nav-item:hover .nav-link,
  .h6-nav-bar .navbar-nav .nav-item.active .nav-link {
    color: white;
  }

  .h6-nav-bar .act-buttons .btn {
    margin: 10px 0 10px 10px;
  }

  @media (max-width: 1023px) {
    .h6-nav-bar .navbar-nav .nav-link {
      padding: 15px 15px;
    }

    .h6-nav-bar .act-buttons .btn {
      margin: 10px 0 10px 0px;
    }
  }

  /******************* 
Main & Page wrapper
*******************/
  .page-wrapper {
    padding-top: 0px;
  }

  #main-wrapper {
  }

  /******************* 
container fluid
*******************/
  .container-fluid {
    padding: 0px;
  }

  /******************* 
footer
*******************/
  .footer {
    padding: 20px 0;
    text-align: center;
  }

  /******************* 
Fix-width
*******************/
  .fix-width {
    width: 100%;
    max-width: 1170px;
    margin: 0 auto;
    padding: 0 15px;
  }

  /******************* 
Spacer
*******************/
  .spacer {
    padding: 90px 0;
  }

  .mini-spacer {
    padding: 40px 0;
  }

  /******************* 
Title
*******************/
  .title {
    margin: 20px 0 15px;
  }

  /******************* 
Subtitle
*******************/
  .subtitle {
    color: #8d97ad;
    line-height: 24px;
  }

  /******************* 
card
*******************/
  .card {
    border: 0px;
    margin-bottom: 30px;
    background-color: #eee !important;
    color: #111;
    font-size: 13px;
  }

  .card h5 a {
    color: #00466a !important;
  }

  .card h5 {
    color: #00466a !important;
  }

  .card.card-shadow {
    -webkit-box-shadow: 0px 0px 30px rgba(115, 128, 157, 0.1);
    box-shadow: 0px 0px 30px rgba(115, 128, 157, 0.1);
  }

  .card-group .card {
    border: 1px solid rgba(120, 130, 140, 0.13);
    margin-bottom: 30px;
  }


  /******************* 
Icon space
*******************/
  .icon-space {
    margin: 20px 0;
  }

  .linking {
    color: #0071b3;
  }

  .linking i {
    font-size: 14px;
    margin-left: 10px;
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
  }

  .linking:hover {
    color: #e4df83;
  }

  .linking:hover i {
    margin-left: 15px;
  }

  /******************* 
Listing
*******************/
  .list-block {
    margin: 0px;
    padding: 0px;
  }

  .list-block li {
    list-style: none;
    padding: 10px 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }

  .list-block li i {
    margin-right: 10px;
    -webkit-flex-shrink: 0px;
    -ms-flex-negative: 0px;
    flex-shrink: 0px;
    margin-top: 3px;
  }

  .list-block.with-underline li {
    border-bottom: 1px solid rgba(120, 130, 140, 0.13);
    padding: 15px 0;
  }

  /******************* 
Listing
*******************/
  .img-inline {
    margin: 0px;
    padding: 0px;
  }

  .img-inline li {
    list-style: none;
  }

  .img-inline li.half-width {
    width: 49%;
    display: inline-block;
    vertical-align: top;
  }

  /******************* 
Image shadow
*******************/
  .img-shadow {
    -webkit-box-shadow: 0px 0px 30px rgba(115, 128, 157, 0.3);
    box-shadow: 0px 0px 30px rgba(115, 128, 157, 0.3);
  }

  /******************* 
Image shadow
*******************/
  .icon-round {
    width: 80px;
    line-height: 80px;
    text-align: center;
    border-radius: 100%;
    display: inline-block;
  }

  .no-shrink {
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
  }

  /******************* 
up section
*******************/
  .up {
    z-index: 10;
    position: relative;
  }

  .bt-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 100;
    visibility: hidden;
  }

  /******************* 
both space
*******************/
  .both-space {
    margin: 80px 0;
  }

  /******************* 
Side text content
*******************/
  .side-content {
    padding: 40px 60px;
  }

  /******************* 
background cover
*******************/
  .bg-cover {
    background-size: cover;
    min-height: 200px;
  }

  /******************* 
Owl carousel
*******************/
  .owl-carousel {
    display: block;
    width: 100%;
  }

  .owl-carousel .owl-stage-outer {
    position: relative;
    overflow: hidden;
  }

  .owl-carousel .owl-stage {
    position: relative;
  }

  .owl-carousel .owl-item {
    float: left;
  }

  .owl-carousel .owl-nav.disabled {
    display: none;
  }

  /******************* 
Max width
*******************/
  .max-300 {
    max-width: 300px;
  }

  .max-400 {
    max-width: 400px;
  }

  .max-500 {
    max-width: 500px;
  }

  .max-600 {
    max-width: 600px;
  }

  /******************* 
line sticks
*******************/
  .stick-bottom {
    position: relative;
    margin-bottom: 30px;
  }

  .stick-bottom>span {
    width: 30px;
    height: 2px;
    position: absolute;
    bottom: -7px;
    left: 0px;
    display: inline-block;
  }

  /******************* 
position
*******************/
  .po-absolute {
    position: absolute;
  }

  .po-relative {
    position: relative;
  }

  /*-------------------*/
  /*Bootstrap 4 hack*/
  /*-------------------*/
  .invisible {
    visibility: hidden !important;
  }

  .hidden-xs-up {
    display: none !important;
  }

  @media (max-width: 575px) {
    .hidden-xs-down {
      display: none !important;
    }
  }

  @media (min-width: 576px) {
    .hidden-sm-up {
      display: none !important;
    }
  }

  @media (max-width: 767px) {
    .hidden-sm-down {
      display: none !important;
    }
  }

  @media (min-width: 768px) {
    .hidden-md-up {
      display: none !important;
    }
  }

  @media (max-width: 991px) {
    .hidden-md-down {
      display: none !important;
    }
  }

  @media (min-width: 992px) {
    .hidden-lg-up {
      display: none !important;
    }
  }

  @media (max-width: 1199px) {
    .hidden-lg-down {
      display: none !important;
    }
  }

  @media (min-width: 1200px) {
    .hidden-xl-up {
      display: none !important;
    }
  }

  .hidden-xl-down {
    display: none !important;
  }

  /*************/
  /* Dropdown*/
  /*************/
  .navbar-nav .dropdown-toggle::after {
    display: none;
  }

  .navbar-nav .dropdown-menu.b-none {
    border: 0px;
    -webkit-box-shadow: 0px 0px 30px rgba(115, 128, 157, 0.1);
    box-shadow: 0px 0px 30px rgba(115, 128, 157, 0.1);
  }

  .navbar-nav {
    font-weight: 400;
  }

  .navbar-nav .dropdown-menu.b-none {
    border: 0px;
    -webkit-box-shadow: 0px 0px 30px rgba(115, 128, 157, 0.1);
    box-shadow: 0px 0px 30px rgba(115, 128, 157, 0.1);
  }

  .pre-scroll {
    position: relative;
  }

  .mega-dropdown {
    position: static;
  }

  .mega-dropdown .dropdown-menu {
    width: 100%;
    padding: 30px;
    margin-top: 0px;
    overflow: hidden;
  }

  .mega-dropdown .list-style-none {
    font-size: 14px;
  }

  .mega-dropdown .inside-bg {
    margin: -30px 0 -30px -30px;
  }

  .mega-dropdown .inside-bg-right {
    margin: -30px -30px -30px 0;
  }

  .mega-dropdown .bg-img {
    background-size: cover;
    height: 100%;
    padding: 30px;
  }

  .mega-dropdown h6 {
    margin: 15px 0;
    font-size: 15px;
  }

  /*************/
  /* General Listing*/
  /*************/
  .general-listing {
    padding: 0px;
    margin: 0px;
  }

  .general-listing li {
    list-style: none;
  }

  .general-listing li a {
    color: #8d97ad;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 10px 0;
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
  }

  .general-listing li:hover a {
    color: #07d79c;
    padding-left: 10px;
  }

  .general-listing li i {
    margin-right: 7px;
    vertical-align: middle;
  }

  .general-listing.two-part li {
    width: 49%;
    display: inline-block;
  }

  .general-listing.only-li li {
    padding: 5px 0;
  }

  /*************/
  /* form dark*/
  /*************/
  .form-control-dark {
    background: rgba(120, 130, 140, 0.13);
    color: #ffffff;
    border-color: rgba(120, 130, 140, 0.13);
  }

  .form-control-dark:focus {
    background: rgba(120, 130, 140, 0.13);
    color: #ffffff;
  }

  /*************/
  /* social-round */
  /*************/
  .round-social a {
    width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    display: inline-block;
    border-radius: 100%;
    margin: 0 5px;
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
  }

  .round-social a:hover {
    -webkit-transform: translate3d(0px, -5px, 0px);
    transform: translate3d(0px, -5px, 0px);
  }

  .round-social.light a {
    color: #263238;
    background: #f5f7fa;
  }

  .round-social.light a:hover {
    background: #263238;
    color: #ffffff;
  }

  /*************/
  /* Form Banner */
  /*************/
  .banner {
    position: relative;
    max-height: 700px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center top;
    width: 100%;
    display: table;
  }

  .banner .banner-content {
    display: table-cell;
    vertical-align: middle;
    width: 100%;
  }

  @media (max-width: 992px) {
    .banner {
      height: auto !important;
      padding: 100px 0;
    }
  }

  @media (max-width: 767px) {
    .banner {
      padding: 30px 0;
    }
  }

  .form-control {
    padding: .75rem;
    border: 2px solid rgba(120, 130, 140, 0.13);
  }

  select.form-control:not([size]):not([multiple]) {
    height: calc(2.25rem + 12px);
  }

  /*******************
UI-Elements
******************/
  /*******************
Buttons
******************/
  .button-group .btn {
    margin-bottom: 7px;
  }

  /*******************
Grid page
******************/
  .show-grid {
    margin-bottom: 10px;
    padding: 0 15px;
  }

  .show-grid [class^=col-] {
    padding-top: 10px;
    padding-bottom: 10px;
    border: 1px solid rgba(120, 130, 140, 0.13);
    background-color: #f5f7fa;
  }

  /*******************
list and media
******************/
  .list-group a.list-group-item:hover {
    background: #f5f7fa;
  }

  .list-group-item.active,
  .list-group .list-group-item.active:hover {
    background: #07d79c;
    border-color: #07d79c;
  }

  .list-group-item.disabled {
    color: #8d97ad;
    background: #f5f7fa;
  }

  .media {
    border: 1px solid rgba(120, 130, 140, 0.13);
    margin-bottom: 10px;
    padding: 15px;
  }

  /*******************
Notification page Jquery toaster
******************/
  .alert-rounded {
    border-radius: 60px;
  }

  /*******************
Progress bar
******************/
  .progress.active .progress-bar,
  .progress-bar.active {
    -webkit-animation: progress-bar-stripes 2s linear infinite;
    -o-animation: progress-bar-stripes 2s linear infinite;
    animation: progress-bar-stripes 2s linear infinite;
  }

  .progress-vertical {
    min-height: 250px;
    height: 250px;
    position: relative;
    display: inline-block;
    margin-bottom: 0;
    margin-right: 20px;
  }

  .progress-vertical-bottom {
    min-height: 250px;
    height: 250px;
    position: relative;
    display: inline-block;
    margin-bottom: 0;
    margin-right: 20px;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
  }

  .progress-animated {
    -webkit-animation-duration: 5s;
    -webkit-animation-name: myanimation;
    -webkit-transition: 5s all;
    animation-duration: 5s;
    animation-name: myanimation;
    -o-transition: 5s all;
    transition: 5s all;
  }

  @-webkit-keyframes myanimation {
    from {
      width: 0;
    }
  }

  @keyframes myanimation {
    from {
      width: 0;
    }
  }

  /*******************
Vertical tabs
******************/
  .vtabs {
    display: table;
  }

  .vtabs .tabs-vertical {
    width: 150px;
    border-bottom: 0px;
    border-right: 1px solid rgba(120, 130, 140, 0.13);
    display: table-cell;
    vertical-align: top;
  }

  .vtabs .tabs-vertical li .nav-link {
    color: #263238;
    margin-bottom: 10px;
    border: 0px;
    border-radius: 4px 0 0 4px;
  }

  .vtabs .tab-content {
    display: table-cell;
    padding: 20px;
    vertical-align: top;
  }

  .tabs-vertical li .nav-link.active,
  .tabs-vertical li .nav-link:hover,
  .tabs-vertical li .nav-link.active:focus {
    background: #07d79c;
    border: 0px;
    color: #ffffff;
  }

  /*Custom vertical tab*/
  .customvtab .tabs-vertical li .nav-link.active,
  .customvtab .tabs-vertical li .nav-link:hover,
  .customvtab .tabs-vertical li .nav-link:focus {
    background: #ffffff;
    border: 0px;
    border-right: 2px solid #07d79c;
    margin-right: -1px;
    color: #07d79c;
  }

  .tabcontent-border {
    border: 1px solid #ddd;
    border-top: 0px;
  }

  .customtab2 li a.nav-link {
    border: 0px;
    margin-right: 3px;
    color: #8d97ad;
  }

  .customtab2 li a.nav-link.active {
    background: #07d79c;
    color: #ffffff;
  }

  .customtab2 li a.nav-link:hover {
    color: #ffffff;
    background: #07d79c;
  }

  /*******************
Timeline page
******************/
  .timeline {
    position: relative;
    padding: 20px 0 20px;
    list-style: none;
    max-width: 1200px;
    margin: 0 auto;
  }

  .timeline:before {
    content: " ";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 3px;
    margin-left: -1.5px;
    background-color: #f5f7fa;
  }

  .timeline>li {
    position: relative;
    margin-bottom: 20px;
  }

  .timeline>li:before,
  .timeline>li:after {
    content: " ";
    display: table;
  }

  .timeline>li:after {
    clear: both;
  }

  .timeline>li:before,
  .timeline>li:after {
    content: " ";
    display: table;
  }

  .timeline>li:after {
    clear: both;
  }

  .timeline>li>.timeline-panel {
    float: left;
    position: relative;
    width: 46%;
    padding: 20px;
    border: 1px solid rgba(120, 130, 140, 0.13);
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.05);
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.05);
  }

  .timeline>li>.timeline-panel:before {
    content: " ";
    display: inline-block;
    position: absolute;
    top: 26px;
    right: -8px;
    border-top: 8px solid transparent;
    border-right: 0 solid rgba(120, 130, 140, 0.13);
    border-bottom: 8px solid transparent;
    border-left: 8px solid rgba(120, 130, 140, 0.13);
  }

  .timeline>li>.timeline-panel:after {
    content: " ";
    display: inline-block;
    position: absolute;
    top: 27px;
    right: -7px;
    border-top: 7px solid transparent;
    border-right: 0 solid #ffffff;
    border-bottom: 7px solid transparent;
    border-left: 7px solid #ffffff;
  }

  .timeline>li>.timeline-badge {
    z-index: 10;
    position: absolute;
    top: 16px;
    left: 50%;
    width: 50px;
    height: 50px;
    margin-left: -25px;
    border-radius: 50% 50% 50% 50%;
    text-align: center;
    font-size: 1.4em;
    line-height: 46px;
    color: #fff;
    overflow: hidden;
  }

  .timeline>li.timeline-inverted>.timeline-panel {
    float: right;
  }

  .timeline>li.timeline-inverted>.timeline-panel:before {
    right: auto;
    left: -8px;
    border-right-width: 8px;
    border-left-width: 0;
  }

  .timeline>li.timeline-inverted>.timeline-panel:after {
    right: auto;
    left: -7px;
    border-right-width: 7px;
    border-left-width: 0;
  }

  .timeline-badge.primary {
    background-color: #316ce8;
  }

  .timeline-badge.success {
    background-color: #0071b3;
  }

  .timeline-badge.warning {
    background-color: #fd4913;
  }

  .timeline-badge.danger {
    background-color: #00466a;
  }

  .timeline-badge.info {
    background-color: #188ef4;
  }

  .timeline-title {
    margin-top: 0;
    color: inherit;
    font-weight: 400;
  }

  .timeline-body>p,
  .timeline-body>ul {
    margin-bottom: 0;
  }

  .timeline-body>p+p {
    margin-top: 5px;
  }

  /*============================================================== 
 Ui-bootstrap
 ============================================================== */
  ul.list-icons {
    margin: 0px;
    padding: 0px;
  }

  ul.list-icons li {
    list-style: none;
    line-height: 30px;
    margin: 5px 0;
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
  }

  ul.list-icons li a {
    color: #8d97ad;
  }

  ul.list-icons li a:hover {
    color: #07d79c;
  }

  ul.list-icons li i {
    font-size: 13px;
    padding-right: 8px;
  }

  ul.list-inline li {
    display: inline-block;
  }

  ul.list-inline li:first-child {
    padding-left: 0px;
  }

  ul.list-inline li a {
    color: #8d97ad;
  }

  ul.list-inline li a:hover {
    color: #07d79c;
  }

  ul.two-part {
    margin: 0px;
  }

  ul.two-part li {
    width: 48.8%;
  }

  /*Accordion*/
  html body .accordion .card {
    margin-bottom: 0px;
  }

  #accordion4 .card-header {
    border: 1px solid rgba(120, 130, 140, 0.13);
    background: transparent;
    margin-bottom: 10px;
  }

  #accordion4 .card-header a {
    color: #8d97ad;
  }

  #accordion4 .card-header:hover {
    background-color: #188ef4;
    border: 1px solid #188ef4;
  }

  #accordion4 .card-header:hover a {
    color: #ffffff;
  }

  #accordion4 .card.active .card-header {
    background-color: #188ef4;
    border: 1px solid #188ef4;
  }

  #accordion4 .card.active .card-header a {
    color: #ffffff;
  }

  /*===================== 
Breadcrumb
=====================*/
  .bc-colored .breadcrumb-item,
  .bc-colored .breadcrumb-item a {
    color: #ffffff;
  }

  .bc-colored .breadcrumb-item.active,
  .bc-colored .breadcrumb-item a.active {
    opacity: 0.7;
  }

  .bc-colored .breadcrumb-item+.breadcrumb-item::before {
    color: rgba(255, 255, 255, 0.4);
  }

  .breadcrumb {
    margin-bottom: 0px;
  }

  /*******************
 Card title
*******************/
  .card-title {
    font-size: 18px;
  }

  .card-subtitle {
    color: #8d97ad;
    margin-bottom: 30px;
    font-size: 14px;
  }

  .card-inverse .card-bodyquote .blockquote-footer,
  .card-inverse .card-link,
  .card-inverse .card-subtitle,
  .card-inverse .card-text {
    color: rgba(255, 255, 255, 0.65);
  }

  .card-default .card-header {
    background: #ffffff;
    border-bottom: 0px;
  }

  .card-success {
    background: #0071b3;
    border-color: #0071b3;
  }

  .card-danger {
    background: #00466a;
    border-color: #00466a;
  }

  .card-warning {
    background: #fd4913;
    border-color: #fd4913;
  }

  .card-info {
    background: #188ef4;
    border-color: #188ef4;
  }

  .card-primary {
    background: #316ce8;
    border-color: #316ce8;
  }

  .card-dark {
    background: #3e4555;
    border-color: #3e4555;
  }

  .card-megna {
    background: #1dc8cd;
    border-color: #1dc8cd;
  }

  /*============================================================== 
 Cards page
 ============================================================== */
  .card-columns .card {
    margin-bottom: 20px;
  }

  .collapsing {
    -webkit-transition: height .08s ease;
    -o-transition: height .08s ease;
    transition: height .08s ease;
  }

  .card-info {
    background: #188ef4;
    border-color: #188ef4;
  }

  .card-primary {
    background: #316ce8;
    border-color: #316ce8;
  }

  .card-outline-info {
    border-color: #188ef4;
  }

  .card-outline-info .card-header {
    background: #188ef4;
    border-color: #188ef4;
  }

  .card-outline-inverse {
    border-color: #3e4555;
  }

  .card-outline-inverse .card-header {
    background: #3e4555;
    border-color: #3e4555;
  }

  .card-outline-warning {
    border-color: #fd4913;
  }

  .card-outline-warning .card-header {
    background: #fd4913;
    border-color: #fd4913;
  }

  .card-outline-success {
    border-color: #0071b3;
  }

  .card-outline-success .card-header {
    background: #0071b3;
    border-color: #0071b3;
  }

  .card-outline-danger {
    border-color: #00466a;
  }

  .card-outline-danger .card-header {
    background: #00466a;
    border-color: #00466a;
  }

  .card-outline-primary {
    border-color: #316ce8;
  }

  .card-outline-primary .card-header {
    background: #316ce8;
    border-color: #316ce8;
  }

  /*******************
Custom-select
******************/
  .custom-select {
    background: url(../../assets/images/ui/custom-select.png) right 0.75rem center no-repeat;
    border: 2px solid rgba(120, 130, 140, 0.13);
    height: calc(2.25rem + 12px);
  }

  /*******************
textarea
******************/
  textarea {
    resize: none;
  }

  .form-control-danger,
  .form-control-success,
  .form-control-warning {
    padding-right: 2.25rem;
    background-repeat: no-repeat;
    background-position: center right .5625rem;
    -webkit-background-size: 1.125rem 1.125rem;
    background-size: 1.125rem 1.125rem;
  }

  .has-success .col-form-label,
  .has-success .custom-control,
  .has-success .form-check-label,
  .has-success .form-control-feedback,
  .has-success .form-control-label {
    color: #0071b3;
  }

  .has-success .form-control-success {
    background-image: url(/assets/images/ui/success.svg);
  }

  .has-success .form-control {
    border-color: #0071b3;
  }

  .has-warning .col-form-label,
  .has-warning .custom-control,
  .has-warning .form-check-label,
  .has-warning .form-control-feedback,
  .has-warning .form-control-label {
    color: #fd4913;
  }

  .has-warning .form-control-warning {
    background-image: url(/assets/images/ui/warning.svg);
  }

  .has-warning .form-control {
    border-color: #fd4913;
  }

  .has-danger .col-form-label,
  .has-danger .custom-control,
  .has-danger .form-check-label,
  .has-danger .form-control-feedback,
  .has-danger .form-control-label {
    color: #00466a;
  }

  .has-danger .form-control-danger {
    background-image: url(../../assets/images/ui/danger.svg);
  }

  .has-danger .form-control {
    border-color: #00466a;
  }

  .input-group-addon [type="radio"]:not(:checked),
  .input-group-addon [type="radio"]:checked,
  .input-group-addon [type="checkbox"]:not(:checked),
  .input-group-addon [type="checkbox"]:checked {
    position: initial;
    opacity: 1;
  }

  .input-form .btn {
    padding: 14px 12px;
  }

  .form-control-sm {
    padding: .25rem .5rem;
  }

  /*******************
custom modals
******************/
  .custom-modal .close-btn {
    position: absolute;
    right: 12px;
    top: 10px;
    color: #8d97ad;
    font-size: 25px;
    background: #ffffff;
    width: 20px;
    height: 20px;
    text-align: center;
    display: block;
    border-radius: 100%;
    line-height: 19px;
  }

  .custom-modal .modal-body {
    overflow: hidden;
  }

  .custom-modal .modal-bg-img {
    background-size: cover;
    background-position: center center;
    min-height: 300px;
  }

  .modal1 .modal-bg {
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center top;
    padding: 40px;
  }

  .modal1 .input-group {
    margin-top: -45px;
  }

  .modal2 .modal-bg {
    padding: 30px 30px 30px 15px;
  }

  .modal3 .modal-bg {
    padding: 50px 40px 60px 25px;
  }

  .modal4 .modal-bg {
    padding: 55px 55px 55px 40px;
  }

  /*******************
Overlay headers and thrid dropdown
******************/
  .header-overlay {
    position: absolute;
    width: 100%;
  }

  .dropdown-item.active,
  .dropdown-item:active {
    background-color: #07d79c;
  }

  .dropdown-submenu {
    position: relative;
  }

  .dropdown-submenu .dropdown-item>.ml-auto {
    position: absolute;
    right: 15px;
    top: 10px;
  }

  .dropdown-submenu>.dropdown-menu {
    top: 0;
    left: 100%;
    margin-left: 0;
    border-radius: 0.25rem;
    display: none;
  }

  .dropdown-submenu>.dropdown-menu.menu-right {
    left: auto;
    right: 100%;
  }

  .dropdown-submenu.pull-left {
    float: none;
  }

  .dropdown-submenu.pull-left>.dropdown-menu {
    left: -75%;
  }

  .dropdown-menu .divider {
    background-color: rgba(120, 130, 140, 0.13);
    height: 1px;
    margin: 9px 0;
    overflow: hidden;
  }

  /*******************
common-innerpage-banner
*******************/
  .banner-innerpage {
    padding: 150px 0 100px;
    background-size: cover;
    background-position: center center;
  }

  .banner-innerpage .title {
    color: #ffffff;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 40px;
    line-height: 40px;
  }

  .banner-innerpage .subtitle {
    color: #ffffff;
  }

  @media (max-width: 900px) {
    .static-slider10 .title {
      font-size: 40px;
      line-height: 45px;
    }
  }

  .with-noborder .media {
    border: 0px;
    padding: 0px;
    margin: 50px 0;
  }

  .owl-theme .owl-dots .owl-dot.active span,
  .owl-theme .owl-dots .owl-dot:hover span {
    background: #07d79c;
  }

  /*******************
Footer 4
*******************/
  .footer4 .f4-bottom-bar {
    padding-top: 10px;
    margin-top: 20px;
  }

  .footer4 .f4-bottom-bar a {
    color: #8d97ad;
  }

  .footer4 .f4-bottom-bar a:hover {
    color: #188ef4;
  }

  .footer4 .round-social.light a {
    width: 34px;
    height: 34px;
    line-height: 34px;
  }

  .footer4 .round-social.light a:hover {
    background: #188ef4;
  }

  /*******************
Modal in center
*******************/
  .modal-dialog {
    min-height: calc(100vh - 60px);
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    overflow: auto;
  }

  @media (max-width: 768px) {
    .modal-dialog {
      min-height: calc(100vh - 20px);
    }
  }

  .animated {
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
  }

  /*******************
icons path
*******************/
  @font-face {
    font-family: 'icomoon';
    src: url("fonts/icomoon.ttf?-rdmvgc") format("truetype");
  }

  @font-face {
    font-family: 'simple-line-icons';
    src: url("fonts/Simple-Line-Icons.ttf?-i3a2kk") format("truetype");
  }

  @font-face {
    font-family: 'themify';
    src: url("fonts/themify.ttf") format("truetype");
  }

  @font-face {
    font-family: 'FontAwesome';
    src: url("fonts/fontawesome-webfont.ttf?v=4.7.0") format("truetype");
  }

  /*
Template Name: Wrapkit Ui Kit
Author: Themedesigner
Email: niravjoshi87@gmail.com
File: scss
*/
  /*============================================================== 
 For Laptop & above all (1650px) 
 ============================================================== */
  /*============================================================== 
 For Laptop & above all (1370px) 
 ============================================================== */
  /*-- ============================================================== 
 Small Desktop & above all (1024px) 
 ============================================================== */
  @media (min-width: 1024px) {
    .page-wrapper {
      padding-top: 0px;
    }

    .hover-dropdown .navbar-nav>.dropdown:hover>.dropdown-menu {
      display: block;
      margin-top: 0px;
    }

    .navbar-nav>.dropdown .dropdown-menu {
      min-width: 210px;
      margin-top: 0px;
    }

    .dropdown-submenu:hover>.dropdown-menu {
      display: block;
    }
  }

  @media (max-width: 1023px) {
    .d-flex {
      display: block !important;
    }

    .d-flex.no-block {
      display: -webkit-box !important;
      display: -webkit-flex !important;
      display: -ms-flexbox !important;
      display: flex !important;
    }

    .wrap-feature30-box {
      left: 0;
      right: 0;
      margin: 0 auto;
      top: 50%;
    }

    .wrap-feature31-box .right-image {
      position: relative;
      bottom: -95px;
    }

    .wrap-feature31-box .right-image img {
      width: 100%;
    }

    .wrap-feature34-box .left-image {
      position: relative;
      top: -90px;
    }

    .po-absolute {
      position: relative;
    }

    .topbar {
      position: absolute;
    }

    .topbar.animated {
      -webkit-animation-duration: 0s;
      animation-duration: 0s;
    }

    .topbar.animated.slideInDown {
      -webkit-animation-name: none;
      animation-name: none;
    }

    .h1-nav {
      padding: 10px 0;
    }

    .h1-nav .navbar-nav .nav-item>.nav-link {
      line-height: 30px;
    }

    .h1-nav .navbar-nav .nav-item {
      margin: 0 10px;
    }
  }

  /*-- ============================================================== 
 Ipad & above all(768px) 
 ============================================================== */
  /*-- ============================================================== 
 Phone and below ipad(767px) 
 ============================================================== */
  @media (max-width: 767px) {

    /*This is for the Global*/
    .b-l,
    .b-r {
      border-left: 0px;
      border-right: 0px;
      border-bottom: 1px solid rgba(120, 130, 140, 0.13);
    }

    .img-inline li.half-width {
      width: 100%;
    }

    .both-space {
      margin: 10px 0;
    }

    .side-content {
      padding: 40px 20px;
    }

    .general-listing.two-part li {
      width: 100%;
      display: block;
    }

    /*This is for the feature 12*/
    .wrap-feature-12 .uneven-box {
      margin-top: 0px;
    }

    /*This is for the feature 16*/
    .wrap-feature-16 .with-text {
      margin-left: 0px;
    }

    /*This is for the feature 18*/
    .wrap-feature-18 .icon-position .icon-round {
      top: 157px;
      right: 30px;
    }

    /*This is for the feature 22*/
    .wrap-feature-22 .text-box,
    .wrap-feature23-box .text-box {
      padding: 20px 0px;
    }

    .wrap-feature30-box {
      position: relative;
    }

    .dropdown-submenu>.dropdown-menu.show {
      display: block;
    }
  }

#content_page { background:#fff; }
h1,h2,h3 { letter-spacing:-1px; }
h1 { color:#0071b3; }
h2 { color:#00466a; }
hr {  background-color: #fff;}
.color_site{color:#ffff00 !important; }
.row-reverse { flex-direction: row-reverse !important; }
.upperc { text-transform:uppercase }
.topbar {	position: fixed;}
.topbar.fixed-header {	position: fixed;}
.topbar.relative { position:relative !important; }
.font_size_13 { font-size:13px; }
.font_size_16 { font-size:16px; }
.feature42 {  background-repeat: no-repeat;  background-size: cover;}
.texte_2_slider{	font-size:25px;	font-weight:bold;	color:#fff;	text-transform:uppercase;	text-shadow:1px 1px 1px #000,0px 0px 10px rgba(0,0,0,0.7);}
.feature42 .wrap-feature42-box {  padding: 15% 0;}
.modal-video iframe { display:block; margin:0px auto; max-width:100%; }
.modal-backdrop { z-index:0; }
.modal-open .modal { background:rgba(0,0,0,0.5); }
#content_page{margin-top:109px;}
#content_page.content_page_resa { margin-top:0px; z-index:30; }
.photo_caroussel{width:100%; max-width:960px;}
.text-site { color:#333 !important; font-size:13px; !important; line-height:16px !important; padding-right:10px; padding-left:10px;}
#ui-datepicker-div { z-index:999 !important; }
/* PARTIE POUR AJAX PHOTO */
.photo_ag { display:block; width:100%; height:auto; opacity:0; }
.background { background-position:center center; background-size:cover; opacity:0; }
.background.background_load { background:url(/images/load.gif) center center no-repeat; background-size:auto; }
.w100 { width:100%; }
/*******************
Header 4
*******************/
.header4 {	background: rgba(255,255,255,0.7);}
.h4-topbar { background:#00466a; text-align:right }
.h4-topbar .navbar {	padding: 0;}
.h4-topbar .navbar .hidden-lg-up {	padding: 15px;	color: #ffffff;	font-weight: 500;	font-size: 14px;	text-transform: uppercase;}
.h4-topbar .navbar .navbar-nav .nav-link {	padding:3px 10px;	color: #ffffff;	font-weight: 500;	font-size: 14px;	text-transform: uppercase;}
.h4-topbar .navbar .navbar-nav .nav-item:hover .nav-link, .h4-topbar .navbar .navbar-nav .nav-item.active .nav-link {	border-bottom:3px solid #ffffff; }
.h4-nav-bar .donate-btn a {	font-size: 12px;	font-weight: 500;	padding: 10px 25px;	margin-left: 15px;}
.li_bt_tel { width:auto; max-width:240px;}
.h4-nav-bar .nav-item .nav-link {	display: -webkit-box;	display: -webkit-flex;	display: -ms-flexbox;	display: flex;	padding: 0 25px;}
.dropdown-item { color: #ffffff; } #menu_h li ul { background:#00466a; } #menu_h li ul li { display:block; }
.h4-nav-bar .nav-item .nav-link .text-gris-clair,.h4-nav-bar .nav-item .nav-link .text-gris-moyen { color:#ffffff !important; text-align:left; }
.h4-navbar{background-color:black}
.topbar { box-shadow: 0px 0px 10px rgba(0,0,0,0.5); }
#menu_h { display:block; text-align:right; }
#menu_h li { display:inline-block; }
#header4 { display:block !important; }
#logo { position:absolute; left:50%; top:0; display:block; margin-left:-600px; margin-top:-3px; z-index:999 }
#logo img { width:180px; padding-top:5px; }
.po-relative{background-color:#00466a !important; height:110px;}
.h4-navbar { background:#00466a; }
.photo_plan{width:100%;height:auto}
.drap { display:inline-block; margin-left:25px; margin-top:15px; } 
.drap img { display:block; border-radius:5px;  }
/*************************************/
/* SLIDER ---------------------------*/
/*************************************/
.texte_2_slider { color:#fff; }
.slider8 .slide-content {
	padding: 40px 30px;
	position: relative;
}
.slider8 .slide1 h2 {
	font-size: 18px;
	line-height: 28px;
	color:#fade44;
}
.slider8 .slide1 label, .slider8 .slide1 b {
	-webkit-animation-delay: 0.7s;
	animation-delay: 0.7s;
	line-height: 26px;
}
.slider8 .slide1 .b-r {
	border-bottom: none;
}
.slider8 .slide1 .col-6 {
	-webkit-animation-delay: 1.2s;
	animation-delay: 1.2s;
}
.slider8 h3 {
	font-size: 26px;
}
 @media (max-width: 1280px) {
.slider8 {
	overflow-y: hidden;
}
.slider8 .slide-image {
	height: 550px;
}
}

 @media (max-width: 1100px)
  {

.slider8 .slide-text {
	width: 80% !important;
}
.slider8 .slide-text p {
	color: #ffffff !important;
}
.slider8 .slide-content {
	min-width: 350px;
	right: 12%;
}
.slider8 h2.text-white {
	font-size: 28px;
}
}
 @media (max-width: 992px) {
.slider8 .slide-content {
	min-width: 50px;
	right: auto;
}
}
 @media (max-width: 767px) {
.slider8 .slide-text {
	padding: 0 !important;
	width: 100% !important;
}
.slider8 .slide-content {
	opacity: 0.9;
}
.slider8 .slide-image {
	height: 450px;
}
.slider8 .carousel-indicators {
	bottom: -10px;
}
}
 @media (max-width: 428px) 
 {

.slider8 h3 {
	font-size: 24px;
}
.slider8 .slide-content {
	padding: 30px;
}
}
.slider6 .slide-text {
	bottom: 0;
	top: auto !important;
	-ms-transform: translate(-50%, 0) !important;
	transform: translate(-50%, 0) !important;
	-webkit-transform: translate(-50%, 0) !important;
	-moz-transform: translate(-50%, 0) !important;
}
/* SLDIER 6 */
.slider8 .slider-control span {
	width: 53px;
	height: 53px;
	line-height: 53px;
	border-radius: 50%;
}
.slider6 h2 {
	line-height: 42px;
	font-size: 36px;
}
.slider6 .btn-md {
	border: 1px solid #ffffff;
}
.slider6 .slide-content {
	padding: 40px;
	position: relative;
	opacity: 1;
}
.slider6 .price-tag {
	position: absolute;
	right: -65px;
	top: -65px;
	width: 130px;
	height: 130px;
	padding-top: 37px;
	border-radius: 50%;
}
.slider6 .price-tag span {
	font-weight: 300;
	font-size: 36px;
	line-height: 36px;
}
 @media (max-width: 767px) 
 {
	.slider8 .slider-control span {
		width: 34px;
		height: 34px;
		line-height: 34px;
	}
	.slider6 h2 {
		font-size: 28px;
		line-height: 36px;
	}
	.slider6 .slide-text {
		padding: 0 !important;
		width: 80% !important;
	}
	.slider6 .slide-image {
		 min-height: 300px;
	}
	.slider6 .slide-content {
		padding: 30px;
	}
}
 @media (max-width: 590px) {
.slider6 .price-tag {
	right: 0;
	top: -80px;
	left: 0;
	margin: auto;
	padding-top: 20px;
	width: 100px;
	height: 100px;
}
.slider6 .price-tag span {
	font-size: 30px;
}
.slider6 .price-tag label {
	font-size: 12px;
}
}
 @media (max-width: 428px) {
.slider8 .slider-control span {
	width: 26px;
	height: 26px;
	line-height: 26px;
	font-size: 12px !important;
}
.slider6 .slide-content {
	padding: 30px 20px;
}
.slider6 .slide-image {
	left: -90%;
}
.slider6 h2 {
	font-size: 22px;
	line-height: 30px;
}
.slider6 .btn-md {
	padding-left: 25px;
	padding-right: 25px;
}
}
 @media (max-width: 320px) {
.slider6 .slide-content {
	padding: 30px 15px;
}
.slider6 h2 {
	font-size: 20px;
}
.slider6 .btn-md {
	padding-left: 20px;
	padding-right: 20px;
}
.slider6 .slide-image {
	height: 390px;
}
}
/*************************************/
/* BAS DE PAGE ***********************/
.wrap-feature23-box {
	background-size: cover;
	background-attachment: fixed;
	background-position: left center;
}
.wrap-feature23-box .text-box {
	padding: 30px 20px;
}
/*************************************/
/* FOOTER ---------------------------*/

#rea {
	text-align: center;
	padding-top: 30px;
	border-top: 1px solid #DDD;
}
#rea img {
	margin-right: -40px;
}

.img-ho {
	overflow: hidden;
}
.img-ho img {
	-webkit-transition: 0.1s ease-in;
	-o-transition: 0.1s ease-in;
	transition: 0.1s ease-in;
}
.img-ho img:hover {
	-webkit-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
}
/*******************
Portfolio2
*******************/
.filterby a {
	padding: 10px;
	font-weight: 400;
	color: #8d97ad;
}
.filterby a:hover {
	color: #316ce8;
}
.filterby a:first-child {
	padding-left: 0px;
}
.hidden {
	display: none;
}
 @media (max-width: 767px) {
.filterby a {
	padding: 10px 5px;
}
}
.portfolio-box {
	margin-top: 40px;
}
.portfolio-box .filter .overlay-box {
	margin-bottom: 30px;
	position: relative;
}
.portfolio-box .filter .overlay-box .img-ho {
	overflow: hidden;
	display: block;
}
.portfolio-box .filter .overlay-box .img-ho img {
	-webkit-transition: 0.1s ease-in;
	-o-transition: 0.1s ease-in;
	transition: 0.1s ease-in;
}
.portfolio-box .filter .overlay-box .img-ho:hover img {
	-webkit-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
}
.portfolio-box .filter .overlay-box .port-text {
	-webkit-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
}
.portfolio-box .filter .overlay-box .port-text > div {
	padding: 20px 0 10px 0;
}
.portfolio-box .filter .overlay-box .port-text h5 {
	font-size: 18px;
	font-weight: 500;
	margin-bottom: 0px;
}
.portfolio-box .filter .overlay-box .port-text span {
	color: #8d97ad;
	font-size: 14px;
}
.like-dislike {
	padding: 0px !important;
}
.like-dislike .text-active {
	display: none;
}
.like-dislike.active .text {
	display: none;
}
.like-dislike.active .text-active {
	display: inline-block;
}
/*******************
Portfolio4
*******************/
.portfolio4 .portfolio-box4 {
	margin-top: 60px;
}
.portfolio4 .portfolio-box4 .filter .overlay-box {
	margin-bottom: 30px;
	position: relative;
}
.portfolio4 .portfolio-box4 .filter .overlay-box .overlay {
	position: absolute;
	background: rgba(29, 200, 205, 0.9);
	-webkit-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
	height: 0px;
	width: 100%;
	display: none;
	padding-top: 30%;
}
.portfolio4 .portfolio-box4 .filter .overlay-box .overlay .port-text {
	-webkit-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
	position: absolute;
	top: 0px;
	width: 0px;
	text-align: center;
}
.portfolio4 .portfolio-box4 .filter .overlay-box .overlay .port-text h5 {
	color: #ffffff;
	font-size: 18px;
	font-weight: 500;
	margin-bottom: 0px;
}
.portfolio4 .portfolio-box4 .filter .overlay-box .overlay .port-text span {
	color: #ffffff;
	font-size: 14px;
}
.portfolio4 .portfolio-box4 .filter .overlay-box:hover .overlay {
	display: block;
	top: 0px;
	height: 100%;
}
.portfolio4 .portfolio-box4 .filter .overlay-box:hover .overlay .port-text {
	top: 43%;
	width: 100%;
}
/*******************
projects
*******************/
.img-ho {
	overflow: hidden;
}
.img-ho img {
	-webkit-transition: 0.1s ease-in;
	-o-transition: 0.1s ease-in;
	transition: 0.1s ease-in;
}
.img-ho img:hover {
	-webkit-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
}
/*******************
 TARIF
*******************/
.pricing1 .card {
	-webkit-transition: 0.1s;
	-o-transition: 0.1s;
	transition: 0.1s;
}
.pricing1 .card:hover {
	-ms-transform: scale(1.05);
	transform: scale(1.05);
	-webkit-transform: scale(1.05);
	-webkit-font-smoothing: antialiased;
}
.pricing1 .badge {
	top: -13px;
	position: absolute;
	left: 0;
	right: 0;
	width: 100px;
	margin: 0 auto;
}
.pricing1 .title {
	margin-top: 20px;
	font-weight: 500;
	margin-bottom: 5px;
}
.pricing1 .subtitle {
	font-size: 14px;
}
.pricing1 .pricing {
	margin: 20px 0;
}
.pricing1 .pricing sup {
	font-size: 18px;
	top: -20px;
}
.pricing1 .pricing .display-5 {
	color: #263238;
}
.pricing1 .pricing .yearly {
	display: none;
}
.pricing1 .list-inline {
	margin-top: 30px;
}
.pricing1 .list-inline li {
	padding: 8px 0;
	display: block;
}
.pricing1 .bottom-btn {
	position: relative;
	bottom: 0px;
}

.blog-home2 .date-pos {
	padding: 10px;
	display: inline-block;
	position: absolute;
	right: 10px;
	top: 10px;
	color: #ffffff;
	border-radius: 4px;
	text-align: center;
}
.span_tarifs1 {
	display: block;
	font-size: 18px;
	line-height: 18px;
}
.span_tarifs2 {

	font-size: 12px;

}
/*******************
feature-16
*******************/
	
.wrap-feature-16 [class*=col-] {	padding: 35px;}
.wrap-feature-16 .with-bg {	width: 100%;	min-height: 200px;	background-size: cover;	background-position: center center;}
.wrap-feature-16 .with-text {	max-width: 500px;	margin-left: 80px;}
.wrap-feature-16 { font-size:13px; background:none; color:#111 }
/*******************
Header 13
*******************/
.header13 .h13-nav {
  padding: 15px 0; }
  .header13 .h13-nav .call-info {
    padding-left: 20px;
    border-left: 1px solid rgba(120, 130, 140, 0.13); }
  .header13 .h13-nav .navbar-nav .nav-item .nav-link {
    color: #8d97ad;
    padding: 10px 15px;
    display: block; }
  .header13 .h13-nav .navbar-nav .nav-item:hover .nav-link, .header13 .h13-nav .navbar-nav .nav-item.active .nav-link {
    color: #ff4d7e; }
  .header13 .h13-nav .navbar-nav .nav-item:last-child {
    margin-left: 10px; }

.header13 .h13-topbar {
  border-bottom: 1px solid rgba(120, 130, 140, 0.13); }
  .header13 .h13-topbar .navbar-brand {
    font-size: 14px;
    color: #188ef4;
    padding: 15px 0; }
  .header13 .h13-topbar .navbar {
    padding: 0; }
    .header13 .h13-topbar .navbar .search-box {
      padding: 15px;
      width: 240px; }
    .header13 .h13-topbar .navbar .nav-item .nav-link {
      color: #8d97ad;
      padding: 15px 20px; }
      .header13 .h13-topbar .navbar .nav-item .nav-link:first-child {
        padding-left: 0px; }
    .header13 .h13-topbar .navbar .nav-item:hover .nav-link {
      color: #ff4d7e; }

.feature8 .list-block li {
  font-weight: 400;
  color: #263238;
}


/*modif slider */
.carousel-inner { height:calc(100vh - 140px);  position:relative; min-height:420px; }
.carousel-promenade{ height:calc(100vh - 300px);  position:relative; min-height:300px; }
.carousel-item { height:calc(100%); width:100vw; }

.carousel-item .slide-image { position:absolute; width:100%; height:100%;  }
.carousel-item .slide-image .slide-flex { display: flex; align-items: center; justify-content: center; height:100%; width:100%  }
.carousel-item .slide-image .slide-flex img { height: 100%;    width: 100%;    flex-grow: 0; object-fit: cover; }
#masque_slider
{ 
	position:relative; top:100%; height:100px; left:0; width:100%; margin-top:-100px; background:#999;
	background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 ); /* IE6-9 */
}

/* footer */
.footer5 {	background-color: #00466a; color:#fff; }
.footer5 h4 { color:#0071b3; }
.footer5 .general-listing li a { color:#333; }
.footer5 .display-7 { color:#0071b3; }
.footer5 .display-7 a { color:#fff !important; }
.round-social.light a { background:#FFF; color:#0071b3; }

/*slider modal */
.modal-body .carousel-inner { height:300px; min-height:1px; }
.modal-body .carousel-inner .carousel-item { width:100%; } 
.modal .po-relative{ height:auto;}

/* PARTIE RESEEVATION EN LIGNE */
/*-----------------------------*/

.static-slider10 {
	padding: 10% 0;
	background-size: cover;
	background-position: center center;
	position:relative;
}
.static-slider10 .card { margin-bottom:0px; }
.static-slider10 .text-box .input-icon i {
	top: 17px;
	right: 30px;
}
.overlay { position:absolute; left:0; top:0; z-index:0; height:100%; width:100%; background:rgba(0,0,0,0.5); }
.bt_detail { position:absolute; top:0; right:0; z-index:99; margin-top:10px; margin-right:10px; cursor:pointer; display:block; }
#liste_etape { position:relative; }
#etapes { width:calc(100% - 300px); margin:0px;  float:left;  } 
#recap { position:sticky;  position: -webkit-sticky;   position: -moz-sticky;   position: -ms-sticky;  position: -o-sticky;  display:block; float:right;  top:0px; padding-top:20px; left:100%; margin-left:-280px; width:280px;   }
#critere { display:none;  }
.promenade.active { border:1px solid #ff4d7e; }
#produit { display:none; }
#etape3 { background:#FFF; display:none; }
#compte_client { display:none; }
#etape4 { background:#FFF; display:none; padding-bottom:20px; }
.participant { background:#eee; padding-top:20px; padding-top: 20px;  margin: 0px 0px; margin-bottom:20px; color:#111 } 
.participant .custom-control { float:left; margin-right:20px; }
.wrap-feature3-box .card-body {  padding: 40px; }
.wrap-feature3-box .card-body .icon-space {    padding: 0px 40px 20px 0px; }
#valider_reservation { display:none; }
.wrap-feature9-box .card-body {  padding: 40px 40px 0px;}
.wrap-feature9-box .card-body .icon-space {  padding: 0px 40px 20px 0px; }
.subtitle { line-height:30px; }

#option { display:none; }

#loading { position:fixed; left:0; top:0; width:100vw; height:100vh; z-index:9999999; background:rgba(0,0,0,0.7); display:none; }
.disabled { pointer-events: none; }
#bt_menu_mobile { display:none; }
.object_fit_contain {    display: flex;    align-items: center;    justify-content: center; width:100%; height:calc(100%); align-items: flex-start;  flex-wrap: wrap;  flex-direction: column;}
.object_fit_contain img { object-fit:cover; width:100%; height:100%;  }
#detail_promenade { font-size:13px; color:#fff; }
.prochaine_session { display:block; width:48%; float:left; box-sizing:border-box; padding:15px; background:#00466a; color:#fff; margin:1%; border-radius:4px;  }

/*partie ajouter pour porto aventure */
/*
h1 span {border-bottom: solid 1px #ffff00; padding-bottom:10px}
#menu-promenade{margin-top:10px}
.active-prom{background-color:#edb100 !important; color:#fff}

label { color:#texte_cartouche_circuit; }
#etape3 h2 { color:#000;  }
#etape3 label { color:#000; }
#etape2 h2 { color:#000; }
#etape4 label { color:#000; }
#etape5 h2 { color:#000; } 
/* fin partie ajouter pour porto aventure */
label { color:#333; }
.card label { color:#111; }
#bt_resa_mobile { display:none; }

#text_accueil { z-index:999; }
#contenu_text_acceuil { margin-top: -220px; background:rgba(0,0,0,0.9); border-radius: 15px; padding-top: 25px; }

#paiement { max-width:100%; margin:0px auto 15px auto; width:369px; }

/* zones de texte */
.row_centervertical { -webkit-align-items: center; align-items: center;  }
.wrap-feature35-box:nth-child(even) .row_centervertical { flex-direction: row-reverse; }
.wrap-feature35-box .feature-35-owl .item {  position: relative; }
.wrap-feature35-box .feature-35-owl .item.item100 { display:block; width:100%; }
.wrap-feature35-box .feature-35-owl .item.item100 a { display:block; width:100%; }
.wrap-feature35-box .feature-35-owl .item.item100 a img{ display:block; width:100%; max-width:500px; margin:0px auto; }
.wrap-feature35-box .carrousel_simple .feature-35-owl .item.item100 a img { max-width:100%; }
.wrap-feature35-box .feature-35-owl .item h4 {  position: absolute;  bottom: 20px;  left: 30px;  text-shadow: 1px 1px 1px #000,0px 0px 10px rgba(0,0,0,0.7); color:#fade44; text-transform: uppercase;}
.wrap-feature35-box  .card-white { background:#CCC !important; }
.wrap-feature35-box  div p { margin-bottom:0px; font-size:13px; }
.wrap-feature35-box  div table { width:100% !important; margin-bottom:25px; margin:0px -3px; }
.wrap-feature35-box  table td { padding:5px 0px; font-size:13px; line-height:16px; text-align:center; background:#FFF; border:3px solid #ccc; width:auto !important;  }
.wrap-feature35-box .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span{ background:#0071b3; }
.carrousel_simple { display:block; margin:0px auto; width:980px; max-width:100%; }
.feature30 {  position: relative;}
.wrap-feature30-box {  position: absolute;  top: 20%;  right: 0px;}
.card.card-shadow img { display:block; width:100%; height:auto; }

/*slider accueil */
.slide-text h2 { font-size:35px; letter-spacing: -2px; text-shadow: 1px 1px 1px #000,0px 0px 10px rgba(0,0,0,0.7); color:#fade44; background:none;display:inline-block; width:100%; text-align:center;  }
.slide-text {  bottom:0; top:auto; transform:translate(-50%,0); text-align:center; width:100%; }
.slide-text p { text-align:center; }

/* zone */
.fond_zone_color { background:#f8f9fa; color:#111; }
.fond_zone_color h2 { background:002958 !important; }
	
/* MODAL */
.modal-content { background:#fff !important; }	
.modal-content .modal-body{ color:#111 !important; }

#menu-promenade { margin-top:10px; margin-bottom:-30px; }

/*PARTIE RESA supplémentaire avec maj des options */
#liste_horaire { text-align:center; width:100%; position:relative; z-index:1; padding-top:10px; }
#liste_horaire .btn { margin:0px 7px 0px 0px; font-size:12px; box-shadow:0px 0px 0px rgba(0,0,0,0);  border-radius:0px !important; margin-bottom:-1px; background:#0071b3; color:#FFF; }
#liste_horaire .btn.active { opacity:1;  background:#FFF; font-weight:bold; color:#0071b3; font-size:14px;}
.contenu_heure_session { background:#FFF; position:relative; z-index:5; display:none; padding:10px 25px 15px 25px; }
.contenu_heure_session.active { display:block; }	
.contenu_heure_session .btn-block { margin-top:10px; }
.text_tarif { font-size:15px; }

.sous_option {
  width: 4em;
}

#table_sous_option {
  display:none;
}

.table_formulaire { width:100%; margin-bottom:25px; }
.table_formulaire th { font-size:13px; padding:3px; color:#FFF; background:#0071b3; text-align:center; border:2px solid #FFF; } 
.table_formulaire tr th { width:20%; box-sizing:border-box; }
.table_formulaire tr th:first-child { width:60%; }
.table_formulaire td { font-size:13px; padding:3px; color:#111; background:#eee; text-align:center; border:2px solid #FFF; }
.spinner { width:50px; }
.table_formulaire tfoot tr th { font-size:15px; padding:3px; color:#FFF; background:#00466a; text-align:center; border:2px solid #FFF; font-weight:bolder; } 

.select_depart { padding:10px 20px; border:1px solid #FFF; border-bottom:0px; width:100%; box-sizing:border-box; }
.select_depart h3 { text-align:center; margin:0px; display:block; padding-bottom:10px; }
.select_depart select { width:100%; text-align:center; font-size:15px; padding:3px; line-height:30px; height:30px; box-sizing:border-box;  }

.fieldset { border-top:1px thick #333; width:100% !important; display:block !important;  position:relative; margin-bottom:16px; }
.fieldset legend { background:#eee; color:#0071b3;  font-size:14px; position:relative; margin-bottom:0px; display:block;  }

#recapitulatif { flex-direction:row-reverse; margin-top:0px; }


#ui-datepicker-div { z-index:9999 !important; }

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

@media (max-width: 1200px)
{
	#logo { margin-left:-500px; }
	#etapes { width:100%; }
	#recap { display:none; }
	.slider6 h2 { font-size:25px; line-height:30px; }
	.slider6 .slide-text p { font-size:13px; }
	.slider6 .slide-content { padding:30px; }
	.slider6 .price-tag { width:100px; height:100px; padding-top:15px; }
	.slider6 .price-tag span { font-size:25px; line-height:25px; }
	.slider6 .price-tag label { font-size:13px; margin-bottom:0px; padding-top:15px; }
	.slider6 .slide-text .m-b-40 { margin-bottom:10px !important; }
	.slider6 .slide-text .title { margin:0px 0px 10px 0px; }

}

@media (max-width: 1023px) 
{
	#etape1 .align-self-center{  padding:0px 20px;  }
	h1 { font-size:20px; line-height:20px; }
	h2 { font-size:25px; line-height:25px; }
	h5 { font-size:15px; line-height:15px; }
	
	#etapes #liste_date .btn { padding:10px; font-size:14px;  }
	.btn-total { font-size:14px; }
	#logo img { width:140px; padding-top:5px; }
	.carousel-promenade{ height:calc(100vw / 4 * 3); min-height:0px; max-height:100vh; }
	.wrap-feature3-box .card-body .icon-space { display:none; }
} 

@media (max-width: 991px) 
{
	
	.slider6 h2 { font-size:25px; line-height:30px; }
	.slider6 .slide-text p { font-size:13px; }
	.slider6 .slide-content { padding:20px; }
	.slider6 .price-tag { width:100px; height:100px; padding-top:15px; }
	.slider6 .price-tag span { font-size:25px; line-height:25px; }
	.slider6 .price-tag label { font-size:13px; margin-bottom:0px; padding-top:15px; }
	.slider6 .slide-text .m-b-40 { margin-bottom:10px !important; }
	.slider6 .slide-text .title { margin:0px 0px 10px 0px; }
	
	
	#bt_menu_mobile { display:block; position:absolute; right:50%; margin-right:-360px; transform:translateY(-50%); top:50%; z-index:100;  background:#00466a; height:60px; width:60px; text-align:center; border-radius:50px; -webkit-border-radius:50px;  }
	#bt_menu_mobile a { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); font-size:12px; line-height:15px; color:#fff; }
	.h4-navbar .container { position:relative; }
	#logo { position:absolute; left:0; margin-left:0; width:185px; z-index:999;  }
	.navbar { display:block; }
	#bt_menu_mobile { display:block; }
	.h4-nav-bar  { height:80px; position:relative; top:0; left:0; width:100%; box-sizing:border-box; padding-left:160px;  }
	#h4-info {    position: relative;    display: block;    top:0;  width: auto;  margin-top:14px; text-align:left; z-index:10; }
	#h4-info .navbar-nav { display:block;  width:100%; position:relative;  }
	#h4-info .navbar-nav li { display:inline-block; vertical-align:top; height:57px;   }
	.li_bt_resa { position:absolute; display:block; top:100%; right:0; left:auto; }
	.header4 { height:80px; }
	.h4-topbar { display:none; }
	.h4-navbar { height:80px;  }
	.fixed-header #h4-info .navbar-nav li:first-child { margin-top:-60px; }
	.topbar.fixed-header .header4 .h4-navbar{ background:#111; }
	.h4-nav-bar .donate-btn a { margin-left:0px; }
	
	
	.h4-nav-bar .donate-btn a { display:inline-block; margin-right:-25px; width:250px; }
	.topbar { height:80px; background:#000 }
	
	#logo  img { width:180px; }
	#menu_h { display:none; }
	#content_page { margin-top:80px; }
	.photo_background {height:calc(100vw / 4 * 3);background-position: center center; background-size: cover;}
}

@media (max-width: 900px) 
{
	.static-slider10 .title { font-size:20px; line-height:20px; }
	#etape1 { padding:0px 40px ; }
	.photo_plan{width:100%;height:auto}
	
}

@media (max-width: 767px) 
{
	#liste_date.liste_date_resaok .btn:first-child,#etape2 #liste_date.liste_date_resaok .btn:last-child  { display:none; }
	#liste_date.liste_date_resako .btn:nth-child(4),#etape2 #liste_date.liste_date_resako .btn:nth-child(5)  { display:none; }
	
	#liste_date .btn{padding:10px;}

	.wrap-feature2-box { padding:0px !important; }
	.slide-image{object-fit: cover !important; }
	
	h1 { font-size:16px; line-height:16px; }
	h2 { font-size:20px; line-height:20px; }
	h5 { font-size:13px; line-height:13px; }
	#etape3 h2 { padding:5px 10px; }
	
	/*modif slider */
	.carousel-inner { height:calc((100vw - 250px) / 3 * 2);  min-height:300px; }
	
	#h4-info {  margin-left:-65px; }
	#bt_menu_mobile  { margin-right:0px; right:0; }
	#h4-info .navbar-nav li.li_bt_resa { position:fixed; top:auto; bottom:0; width:100vw; left:0; margin:0px; height:auto;border-radius:0px !important;   }
	#h4-info .navbar-nav li.li_bt_resa a { display:block; width:100%;  margin:0px; }
	
	#contenu_text_acceuil  { margin-top:0px; padding-top:0px; }
	
	
	/*slider accueil */
	.slide-text h2 { font-size:25px; letter-spacing: -2px; display:inline-block; width:100%; text-align:center;  }
	.slide-text { top:auto; bottom:0; transform:translate(0,0); margin-left:0px; left:0; text-align:center; }
	.slide-text p { text-align:center; }
	
	.mini-spacer { padding:20px 0px !important; }
	.text-site {padding-left:20px !important; padding-right:20px !important; text-align:justify }
	#logo img { width:120px; padding-top:5px; }
	
	.prochaine_session { width:48%; }

	
	#recapitulatif { flex-direction: column-reverse; margin-top:0px; }
	
}
@media (max-width: 530px) 
{
	#logo { width:auto; margin-left:10px; }
	.h4-nav-bar .nav-item .nav-link { padding:0px; }
	#h4-info .navbar-nav .li_bt_tel .text-tel { display:none; }
	#h4-info .navbar-nav .li_bt_tel .text-gris-clair { font-size:50px; }
	.li_bt_resa { display:none !important; }
	.h4-nav-bar .donate-btn a { font-size:12px; text-align:center; display:block; padding:10px;  border-radius:0px !important; }
	#h4-info .donate-btn { display:block; width:100%;}
	
	#h4-info .navbar-nav .li_bt_tel { position:absolute; top:0; right:0; margin-right:60px; margin-top:-2px; width:45px !important; } 
	.liste_drap {    position: absolute;    right: 0;    margin-right: 115px;    top:0px; }
	
	/*modif slider */

	#text_accueil { padding:20px 0px; }
	.carousel-inner { height:calc(100vh - 180px);  max-height:250px; }
	
	/*slider accueil */
	.slide-text h2 { font-size:18px; letter-spacing:-1px; margin-bottom:5px;   }
	.slide-text p .btn { padding:5px 10px; font-size:12px; }
	
	.prochaine_session { width:100%; float:none;  margin:1px auto;  }
	
	.prochaine_session { width:100%; margin:0px auto 5px auto; }
	
	#bt_resa_mobile {    display: block;    position: fixed;    left: 0;    bottom: 0;    width: 100%;    z-index: 999;    padding: 10px 0px;    font-size: 13px;     text-transform: uppercase;    border-radius: 0px;} 
	#bt_resa_mobile .btn { border-radius:0px !important; }


	.table_formulaire tr {display:block; border-bottom:4px solid #FFF; }
	.table_formulaire tr th { display:block; width:100% !important; border:0px; border-bottom:1px solid #FFF;   }
	.table_formulaire tr td { display:block; width:100% !important;  border:0px; border-bottom:1px solid #FFF;  }

	
	.table_formulaire tfoot tr th { display:none; border:0px; }
	.table_formulaire tfoot tr th:first-child  { display:block; } 

}
@media (max-width: 500px) 
{
	#etapes #liste_date .btn { padding:8px; font-size:11px;  }
	.slider6 h2 { font-size:20px; line-height:25px; }
	.slider6 .slide-text p { font-size:11px; }
	.slider6 .slide-content { padding:20px; }
	.slider6 .slide-text .m-b-40 { margin-bottom:5px !important; }
	.slider6 .slide-text .title { margin:0px 0px 10px 0px; }
	.slider6 .slide-text .btn { display:block; font-size:10pxpx; text-align:center; padding:10px; } 
}
@media (max-width: 400px) 
{
	.btn-md { font-size:14px; padding:15px; }
}
@media (max-width: 350px) 
{
	#liste_date .btn { padding:5px; font-size:11px;  }
	#etapes .btn { padding:10px 15px; font-size:13px; }
	#etape5 .btn { padding:10px 15px; font-size:13px; }
	.navbar-brand img { max-width:180px; }
	
}



#logo img {width:200px; padding-top:0px; }
.footer5 .general-listing li a {   color: #fff;}
.dropdown-menu{background-color:#002958}


@media (max-width: 1200px)
{
	#logo img { width:200px; padding-top:5px; }

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


} 
@media (max-width: 991px) 
{
	#logo { position:absolute; left:0; margin-left:-0; width:140px; z-index:999;  }
	#logo img {
	width: 112px;
	padding-top: 5px;
}
}
@media (max-width: 900px) 
{
#logo {  margin-left:-30px;}

}
@media (max-width: 767px) 
{
#h4-info {    margin-left: -0;}
	
}
@media (max-width: 580px) 
{
	#logo img { margin: 0 0 0 30px;}

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

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

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

	
}