/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
body {
    font-family: 'Gotham Rounded Book';
    color: #525d5d;
    background:#fff;
  }
  
  a {
    color: #525d5d;
  }
  
  a:hover {
    color: #aaafaf;
    text-decoration: none;
  }
  
  h1, h2, h3, h4, h5, h6 {
    font-family: 'Gotham Rounded Book';
    color:#525d5d;
  }
  p{color:#525d5d; font-family: 'Gotham Rounded';}
  /*--------------------------------------------------------------
  # Back to top button
  --------------------------------------------------------------*/
  .back-to-top {
    position: fixed;
    display: none;
    right: 15px;
    bottom: 15px;
    z-index: 99999;
    transition: 0.5s;
  }
  
  .back-to-top i {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    width: 40px;
    height: 40px;
    border-radius: 50px;
    /*background: #0d0479;*/
    background: #00b7cd;
    color: #fff;
    transition: all 0.4s;
  }
  
  .back-to-top:hover {
    bottom: 19px;
  }
  
  /*--------------------------------------------------------------
  # Header
  --------------------------------------------------------------*/
  #header {
    transition: all 0.5s;
    z-index: 997;
    padding: 20px 0;
  }
  
  #header .logo {
    font-size: 32px;
    margin: 0;
    padding: 0;
    line-height: 1;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
  }
  
  #header .logo a {
    color: #fff;
  }
  
  #header .logo img {
    max-height: 80px;
  }
  #header .logo img.fixed-logo{display: none;}
  
  #header.header-scrolled, #header.header-inner-pages {
    background: #0e047a;
    /*background: #00b7cd;*/
    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
    /*padding: 12px 0;*/
  }
  #header.header-scrolled .logo img{/*max-height: 60px;*/}
  #header.header-scrolled .logo a, #header.header-inner-pages .logo a {
    color: #493c3e;
  }
  /*.rightMenu{display:none;}*/ /* kowsi*/
  .rightMenu a{display: contents;width:35px;height:35px;color:#fff;border:2px solid #00b7cd;background:#00b7cd;border-radius: 50px;justify-content: center;align-items: center;}
  .rightMenu a:hover{background-color: #aaafaf;  color: #fff;  border-color: #aaafaf;}
  #header.header-scrolled .rightMenu{display:block;}
  
  /*#header .logo img.logosmall{display: none;}*/ /* kowsi*/
  #header.header-scrolled .logo img.logosmall{display: block;}
  @media (max-width: 992px) {
    #header .logo {
      font-size: 28px;
    }
  }
  
  /*--------------------------------------------------------------
  # Navigation Menu
  --------------------------------------------------------------*/
  /* Desktop Navigation */
  .nav-menu ul {
    margin: 0;
    padding: 0;
    list-style: none;
  }
  
  .nav-menu > ul {
    display: flex;
  }
  
  .nav-menu > ul > li {
    position: relative;
    white-space: nowrap;
    padding: 10px 0 10px 25px;
  }
  
  .nav-menu a {
    display: block;
    position: relative;
    color: #fff;
    transition: 0.3s;
    font-size: 15px;
    padding: 0 4px;
    letter-spacing: 0.4px;
    font-family: "Poppins", sans-serif;
  }
  
  .nav-menu > ul > li > a:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    bottom: -6px;
    left: 0;
    background-color: #0d0479;
    visibility: hidden;
    transform: scaleX(0);
    transition: all 0.3s ease-in-out 0s;
  }
  
  .nav-menu a:hover:before, .nav-menu li:hover > a:before, .nav-menu .active > a:before {
    visibility: visible;
    transform: scaleX(1);
  }
  
  .nav-menu .drop-down ul {
    display: block;
    position: absolute;
    left: 0;
    top: calc(100% + 30px);
    z-index: 99;
    opacity: 0;
    visibility: hidden;
    padding: 10px 0;
    background: #fff;
    box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
    transition: 0.3s;
  }
  
  .nav-menu .drop-down:hover > ul {
    opacity: 1;
    top: 100%;
    visibility: visible;
  }
  
  .nav-menu .drop-down li {
    min-width: 180px;
    position: relative;
  }
  
  .nav-menu .drop-down ul a {
    padding: 10px 20px;
    font-size: 14px;
    text-transform: none;
    color: #493c3e;
  }
  
  .nav-menu .drop-down ul a:hover, .nav-menu .drop-down ul .active > a, .nav-menu .drop-down ul li:hover > a {
    color: #0d0479;
  }
  
  .nav-menu .drop-down > a:after {
    content: "\ea99";
    font-family: IcoFont;
    padding-left: 5px;
  }
  
  .nav-menu .drop-down .drop-down ul {
    top: 0;
    left: calc(100% - 30px);
  }
  
  .nav-menu .drop-down .drop-down:hover > ul {
    opacity: 1;
    top: 0;
    left: 100%;
  }
  
  .nav-menu .drop-down .drop-down > a {
    padding-right: 35px;
  }
  
  .nav-menu .drop-down .drop-down > a:after {
    content: "\eaa0";
    font-family: IcoFont;
    position: absolute;
    right: 15px;
  }
  
  .header-scrolled .nav-menu > ul > li > a, .header-inner-pages .nav-menu > ul > li > a {
    color: #493c3e;
  }
  
  @media (max-width: 1366px) {
    .nav-menu .drop-down .drop-down ul {
      left: -90%;
    }
    .nav-menu .drop-down .drop-down:hover > ul {
      left: -100%;
    }
    .nav-menu .drop-down .drop-down > a:after {
      content: "\ea9d";
    }
  }
  
  /* Mobile Navigation */
  .mobile-nav-toggle {
    position: fixed;
    right: 15px;
    top: 15px;
    z-index: 9998;
    border: 0;
    background: none;
    font-size: 24px;
    transition: all 0.4s;
    outline: none !important;
    line-height: 1;
    cursor: pointer;
    text-align: right;
  }
  
  .mobile-nav-toggle i {
    color: #0d0479;
  }
  
  .mobile-nav {
    position: fixed;
    top: 55px;
    right: 15px;
    bottom: 15px;
    left: 15px;
    z-index: 9999;
    overflow-y: auto;
    background: #fff;
    transition: ease-in-out 0.2s;
    opacity: 0;
    visibility: hidden;
    border-radius: 10px;
    padding: 10px 0;
  }
  
  .mobile-nav * {
    margin: 0;
    padding: 0;
    list-style: none;
  }
  
  .mobile-nav a {
    display: block;
    position: relative;
    color: #493c3e;
    padding: 10px 20px;
    font-weight: 500;
    outline: none;
  }
  
  .mobile-nav a:hover, .mobile-nav .active > a, .mobile-nav li:hover > a {
    color: #0d0479;
    text-decoration: none;
  }
  
  .mobile-nav .drop-down > a:after {
    content: "\ea99";
    font-family: IcoFont;
    padding-left: 10px;
    position: absolute;
    right: 15px;
  }
  
  .mobile-nav .active.drop-down > a:after {
    content: "\eaa1";
  }
  
  .mobile-nav .drop-down > a {
    padding-right: 35px;
  }
  
  .mobile-nav .drop-down ul {
    display: none;
    overflow: hidden;
  }
  
  .mobile-nav .drop-down li {
    padding-left: 20px;
  }
  
  .mobile-nav-overly {
    width: 100%;
    height: 100%;
    z-index: 9997;
    top: 0;
    left: 0;
    position: fixed;
    background: rgba(45, 37, 38, 0.6);
    overflow: hidden;
    display: none;
    transition: ease-in-out 0.2s;
  }
  
  .mobile-nav-active {
    overflow: hidden;
  }
  
  .mobile-nav-active .mobile-nav {
    opacity: 1;
    visibility: visible;
  }
  
  .mobile-nav-active .mobile-nav-toggle i {
    color: #fff;
  }
  
  /*--------------------------------------------------------------
  # Hero Section
  --------------------------------------------------------------*/
  #hero {
    width: 100%;
    height:100vh;
    background: url("../img/slider.jpg") top center;
    background-size:cover;
    background-repeat: no-repeat;
    position: relative;
  
  }
  
  #hero:before {
    content: "";
    background: rgba(0, 0, 0, 0.6);
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
  }
  
  #hero .hero-container {
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    
    text-align: center;
    padding: 0 15px;
  }
  
  #hero h3 {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    font-size: 26px;
    padding: 10px 30px;
    margin-bottom: 30px;
    border-radius: 50px;
  }
  
  #hero h1 {
    margin: 100px 10px 10px 10px;
    font-size:24px;
    font-weight: 700;
    line-height: 30px;
    text-transform:capitalize;
    color: #fff;
  }
  #hero h1 span{display: block;}
  #hero h2 {
    color: #eee;
    margin-bottom: 40px;
    font-size: 40px;
    font-weight: 500;
  }
  
  #hero .btn-get-started {
    font-family: "Poppins", sans-serif;
    text-transform: uppercase;
    font-weight: 400;
    font-size: 13px;
    letter-spacing: 1px;
    display: inline-block;
    padding: 8px 30px 9px 30px;
    border-radius: 50px;
    transition: 0.5s;
    border: 2px solid #fff;
    color: #fff;
  }
  
  #hero .btn-get-started:hover {
    background: #0d0479;
    border: 2px solid #0d0479;
  }
  
  
  @media  (max-width:1366px) {
    /*#hero{height: 65vh;} kowsi*/
  /*  #hero{height: 650px;}*/
  }
  @media (max-width: 768px) {
    #hero h3 {
      font-size: 22px;
    }
    #hero h1 {
      font-size: 28px;
      line-height: 36px;
    }
    #hero h2 {
      font-size: 18px;
      line-height: 24px;
      margin-bottom: 30px;
    }
    #hero {
      
    }
    .wizard-form{max-width: 100%;flex: 0 0 100%;}
    #hero {height:70vh;background-size: cover;background-position: -216px 0px !important;}
    #hero .hero-container{}
  }
  
  @media (max-width: 568px) {
    #hero {}
    .rightMenu a{margin-right: 5px !important;margin-bottom: 5px;}
  }
  
  /*--------------------------------------------------------------
  # Sections General
  --------------------------------------------------------------*/
  section {
    padding: 60px 0;
  }
  
  .section-bg {
    background-color: white;
  }
  
  .section-title {
    text-align: center;
    padding-bottom: 30px;
  }
  
  .section-title h2 {
    font-size: 13px;
    letter-spacing: 1px;
    font-weight: 700;
    padding: 8px 20px;
    line-height: 1;
    margin: 0;
    background: #00b7cd;
    color: #fff;
    display: inline-block;
    text-transform: uppercase;
    border-radius: 50px;
  }
  .section-title h2.ratings{font-size: 30px;margin: 15px 0;}
  .section-title h3 {
    margin: 15px 0 0 0;
    font-size: 32px;
    font-weight: 700;
  }
  
  .section-title h3 span {
    color: #525d5d;
  }
  
  .section-title p {
    margin: 15px auto 0 auto;
    font-weight: 600;
  }
  
  @media (min-width: 1024px) {
    .section-title p {
      width: 50%;
    }
  }
  
  /*--------------------------------------------------------------
  # About
  --------------------------------------------------------------*/
  .about .content h3 {
    font-weight: 600;
    font-size: 26px;
  }
  
  .about .content ul {
    list-style: none;
    padding: 0;
  }
  
  /*.about .content ul li {
    padding-left: 28px;
    position: relative;
  }
  
  .about .content ul li + li {
    margin-top: 10px;
  }*/
  
  .about .content ul i {
    position: absolute;
    left: 0;
    top: 2px;
    font-size: 20px;
    color: #0d0479;
    line-height: 1;
  }
  
  .about .content p:last-child {
    margin-bottom: 0;
  }
  
  .about .content .btn-learn-more {
    font-family: "Nunito", sans-serif;
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 1px;
    display: inline-block;
    padding: 12px 32px;
    border-radius: 50px;
    transition: 0.3s;
    line-height: 1;
    color: #0d0479;
    -webkit-animation-delay: 0.8s;
    animation-delay: 0.8s;
    margin-top: 6px;
    border: 2px solid #0d0479;
  }
  
  .about .content .btn-learn-more:hover {
    background: #0d0479;
    color: #fff;
    text-decoration: none;
  }
  
  /*--------------------------------------------------------------
  # Services
  --------------------------------------------------------------*/
  .services {
    padding-bottom: 30px;
  }
  
  .services .icon-box {
    padding: 60px 30px;
    position: relative;
    overflow: hidden;
    background: #fff;
    box-shadow: 2px 0 35px 0 rgba(68, 88, 144, 0.12);
    transition: all 0.3s ease-in-out;
    border-radius: 8px;
    z-index: 1;
    text-align: center;
  }
  
  .services .icon-box::before {
    content: '';
    position: absolute;
    background: #fdeff2;
    right: 0;
    left: 0;
    bottom: 0;
    top: 100%;
    transition: all 0.4s;
    z-index: -1;
  }
  
  .services .icon-box:hover::before {
    background: #0d0479;
    top: 0;
    border-radius: 0px;
  }
  
  .services .icon {
    margin-bottom: 15px;
  }
  
  .services .icon i {
    font-size: 48px;
    line-height: 1;
    color: #0d0479;
    transition: all 0.3s ease-in-out;
  }
  
  .services .title {
    font-weight: 700;
    margin-bottom: 15px;
    font-size: 18px;
  }
  
  .services .title a {
    color: #111;
  }
  
  .services .description {
    font-size: 15px;
    line-height: 28px;
    margin-bottom: 0;
  }
  
  .services .icon-box:hover .title a, .services .icon-box:hover .description {
    color: #fff;
  }
  
  .services .icon-box:hover .icon i {
    color: #fff;
  }
  
  /*--------------------------------------------------------------
  # Features
  --------------------------------------------------------------*/
  .features {
    padding-top: 0;
  }
  
  .features .icon-box {
    display: flex;
    align-items: center;
    padding: 20px;
    transition: ease-in-out 0.3s;
    box-shadow: 2px 0 35px 0 rgba(68, 88, 144, 0.12);
  }
  
  .features .icon-box i {
    font-size: 32px;
    padding-right: 10px;
    line-height: 1;
  }
  
  .features .icon-box h3 {
    font-weight: 700;
    margin: 0;
    padding: 0;
    line-height: 1;
    font-size: 16px;
  }
  
  .features .icon-box h3 a {
    color: #493c3e;
    transition: ease-in-out 0.3s;
  }
  
  .features .icon-box:hover a {
    color: #0d0479;
  }
  
  /*--------------------------------------------------------------
  # Cta
  --------------------------------------------------------------*/
  .cta {
    background: linear-gradient(rgba(2, 2, 2, 0.5), rgba(0, 0, 0, 0.8)), url("../img/cta-bg.jpg") center center;
    background-size: cover;
    padding: 60px 0;
  }
  
  .cta h3 {
    color: #fff;
    font-size: 28px;
    font-weight: 700;
  }
  
  .cta p {
    color: #fff;
  }
  
  .cta .cta-btn {
    font-family: "Nunito", sans-serif;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 16px;
    letter-spacing: 1px;
    display: inline-block;
    padding: 8px 28px;
    border-radius: 25px;
    transition: 0.5s;
    margin-top: 10px;
    border: 2px solid #fff;
    color: #fff;
  }
  
  .cta .cta-btn:hover {
    background: #0d0479;
    border: 2px solid #0d0479;
  }
  
  @media (min-width: 1024px) {
    .cta {
      background-attachment: fixed;
    }
  }
  
  /*--------------------------------------------------------------
  # Portfolio
  --------------------------------------------------------------*/
  .portfolio #portfolio-flters {
    padding: 0;
    margin: 0 auto 25px auto;
    list-style: none;
    text-align: center;
    border-radius: 50px;
  }
  
  .portfolio #portfolio-flters li {
    cursor: pointer;
    display: inline-block;
    padding: 7px 17px 9px 17px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
    color: #444444;
    margin: 0 3px 10px 3px;
    transition: all ease-in-out 0.3s;
    background: #ede9e9;
    border-radius: 50px;
  }
  
  .portfolio #portfolio-flters li:hover, .portfolio #portfolio-flters li.filter-active {
    color: #fff;
    background: #0d0479;
  }
  
  .portfolio #portfolio-flters li:last-child {
    margin-right: 0;
  }
  
  .portfolio .portfolio-item {
    margin-bottom: 30px;
    overflow: hidden;
  }
  
  .portfolio .portfolio-item img {
    position: relative;
    top: 0;
    transition: all 0.6s cubic-bezier(0.645, 0.045, 0.355, 1);
  }
  
  .portfolio .portfolio-item .portfolio-info {
    opacity: 0;
    position: absolute;
    left: 15px;
    right: 15px;
    bottom: -50px;
    z-index: 3;
    transition: all ease-in-out 0.3s;
    background: #00b7cd;
    padding: 15px 20px;
     top: 0px;
  }
  
  .portfolio .portfolio-item .portfolio-info h4 {
    font-size: 18px;
    color: #fff;
    font-weight: 600;
  }
  
  .portfolio .portfolio-item .portfolio-info p {
    color: #fff;
    font-size: 14px;
    margin-bottom: 0;
  }
  
  .portfolio .portfolio-item .portfolio-info .preview-link, .portfolio .portfolio-item .portfolio-info .details-link {
    position: absolute;
    right: 50px;
    font-size: 24px;
    top: calc(50% - 18px);
    color: white;
    transition: ease-in-out 0.3s;
  }
  
  .portfolio .portfolio-item .portfolio-info .preview-link:hover, .portfolio .portfolio-item .portfolio-info .details-link:hover {
    color: #f7c2cc;
  }
  
  .portfolio .portfolio-item .portfolio-info .details-link {
    right: 15px;
  }
  
  .portfolio .portfolio-item:hover img {
    top: -30px;
  }
  
  .portfolio .portfolio-item:hover .portfolio-info {
    opacity: 1;
    bottom: 0;
  }
  
  /*--------------------------------------------------------------
  # Pricing
  --------------------------------------------------------------*/
  .pricing .box {
    padding: 20px;
    background: #f9f9f9;
    text-align: center;
    border-radius: 8px;
    position: relative;
    overflow: hidden;
    border: 2px solid #f9f9f9;
  }
  
  .pricing .box h3 {
    font-weight: 400;
    padding: 15px;
    margin-top: 15px;
    font-size: 20px;
    font-weight: 600;
    color: #493c3e;
  }
  
  .pricing .box h4 {
    font-size: 42px;
    color: #0d0479;
    font-weight: 500;
    font-family: "Open Sans", sans-serif;
    margin-bottom: 20px;
  }
  
  .pricing .box h4 sup {
    font-size: 20px;
    top: -15px;
    left: -3px;
  }
  
  .pricing .box h4 span {
    color: #bababa;
    font-size: 16px;
    font-weight: 300;
  }
  
  .pricing .box ul {
    padding: 0;
    list-style: none;
    color: #493c3e;
    text-align: center;
    line-height: 20px;
    font-size: 14px;
  }
  
  .pricing .box ul li {
    padding-bottom: 16px;
  }
  
  .pricing .box ul i {
    color: #0d0479;
    font-size: 18px;
    padding-right: 4px;
  }
  
  .pricing .box ul .na {
    color: #ccc;
    text-decoration: line-through;
  }
  
  .pricing .box .btn-wrap {
    padding: 15px;
    text-align: center;
  }
  
  .pricing .box .btn-buy {
    display: inline-block;
    padding: 8px 40px 10px 40px;
    border-radius: 50px;
    border: 2px solid #0d0479;
    color: #0d0479;
    font-size: 14px;
    font-weight: 400;
    font-family: "Nunito", sans-serif;
    font-weight: 600;
    transition: 0.3s;
  }
  
  .pricing .box .btn-buy:hover {
    background: #0d0479;
    color: #fff;
  }
  
  .pricing .recommended {
    border-color: #0d0479;
  }
  
  .pricing .recommended .btn-buy {
    background: #0d0479;
    color: #fff;
  }
  
  .pricing .recommended .btn-buy:hover {
    background: #d91e42;
    border-color: #d91e42;
  }
  
  .pricing .recommended-badge {
    position: absolute;
    top: 5px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
    font-size: 13px;
    padding: 3px 25px 6px 25px;
    background: #fce6ea;
    color: #0d0479;
    border-radius: 50px;
  }
  
  /*--------------------------------------------------------------
  # F.A.Q
  --------------------------------------------------------------*/
  .faq {
    padding: 60px 0;
  }
  
  .faq .faq-list {
    padding: 0;
    list-style: none;
  }
  
  .faq .faq-list li {
    padding: 0 0 20px 25px;
  }
  
  .faq .faq-list a {
    display: block;
    position: relative;
    font-family: #0d0479;
    font-size: 18px;
    font-weight: 500;
  }
  
  .faq .faq-list i {
    font-size: 18px;
    position: absolute;
    left: -25px;
    top: 6px;
  }
  
  .faq .faq-list p {
    margin-bottom: 20px;
    font-size: 15px;
  }
  
  .faq .faq-list a.collapse {
    color: #0d0479;
  }
  
  .faq .faq-list a.collapsed {
    color: #343a40;
  }
  
  .faq .faq-list a.collapsed:hover {
    color: #0d0479;
  }
  
  .faq .faq-list a.collapsed i::before {
    content: "\eab2" !important;
  }
  
  /*@media (min-width: 1280px) {
    .faq .container {
      padding: 0 120px;
    }
  }*/
  
  /*--------------------------------------------------------------
  # Team
  --------------------------------------------------------------*/
  .team {
    background: #fff;
    padding: 60px 0;
  }
  
  .team .member {
    margin-bottom: 20px;
    overflow: hidden;
    text-align: center;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
  }
  
  .team .member .member-img {
    position: relative;
    overflow: hidden;
  }
  
  .team .member .social {
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    height: 40px;
    opacity: 0;
    transition: ease-in-out 0.3s;
    text-align: center;
    background: rgba(255, 255, 255, 0.85);
  }
  
  .team .member .social a {
    transition: color 0.3s;
    color: #493c3e;
    margin: 0 10px;
    padding-top: 8px;
    display: inline-block;
  }
  
  .team .member .social a:hover {
    color: #0d0479;
  }
  
  .team .member .social i {
    font-size: 18px;
    margin: 0 2px;
  }
  
  .team .member .member-info {
    padding: 25px 15px;
  }
  
  .team .member .member-info h4 {
    font-weight: 700;
    margin-bottom: 5px;
    font-size: 18px;
    color: #493c3e;
  }
  
  .team .member .member-info span {
    display: block;
    font-size: 13px;
    font-weight: 400;
    color: #aaaaaa;
  }
  
  .team .member .member-info p {
    font-style: italic;
    font-size: 14px;
    line-height: 26px;
    color: #777777;
  }
  
  .team .member:hover .social {
    opacity: 1;
  }
  
  /*--------------------------------------------------------------
  # Contact
  --------------------------------------------------------------*/
  .contact .info {
    width: 100%;
    background: #fff;
    padding: 20px;
  }
  
  .contact .info i {
    font-size: 20px;
    /* color: #0d0479; */
    float: left;
    width: 44px;
    height: 44px;
    /*background: #fdeff2;*/
    background: #00b7cd;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    transition: all 0.3s ease-in-out;
  }
  
  .contact .info h4 {
    padding: 0 0 0 60px;
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 5px;
    color: #493c3e;
  }
  
  .contact .info p {
    padding: 0 0 0 60px;
    margin-bottom: 0;
    font-size: 14px;
    color: #816a6e;
  }
  
  .contact .info .email, .contact .info .phone {
    margin-top: 13px;
  }
  
  .contact .info .email:hover i, .contact .info .address:hover i, .contact .info .phone:hover i {
    /*background: #00b7cd;*/
    background: #aaafaf;
    color: #fff;
  }
  
  .contact .php-email-form {
    width: 100%;
    background: #fff;
    padding: 20px;
  }
  
  .contact .php-email-form .form-group {
    padding-bottom: 8px;
  }
  
  .contact .php-email-form .validate {
    display: none;
    color: red;
    margin: 0 0 15px 0;
    font-weight: 400;
    font-size: 13px;
  }
  
  .contact .php-email-form .error-message {
    display: none;
    color: #fff;
    background: #ed3c0d;
    text-align: left;
    padding: 15px;
    font-weight: 600;
  }
  
  .contact .php-email-form .error-message br + br {
    margin-top: 25px;
  }
  
  .contact .php-email-form .sent-message {
    display: none;
    color: #fff;
    background: #18d26e;
    text-align: center;
    padding: 15px;
    font-weight: 600;
  }
  
  .contact .php-email-form .loading {
    display: none;
    background: #fff;
    text-align: center;
    padding: 15px;
  }
  
  .contact .php-email-form .loading:before {
    content: "";
    display: inline-block;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    margin: 0 10px -6px 0;
    border: 3px solid #18d26e;
    border-top-color: #eee;
    -webkit-animation: animate-loading 1s linear infinite;
    animation: animate-loading 1s linear infinite;
  }
  
  .contact .php-email-form input, .contact .php-email-form textarea {
    border-radius: 0;
    box-shadow: none;
    font-size: 14px;
  }
  
  .contact .php-email-form input:focus, .contact .php-email-form textarea:focus {
    border-color: #0d0479;
  }
  
  .contact .php-email-form input {
    height: 44px;
  }
  
  .contact .php-email-form textarea {
    padding: 10px 12px;
  }
  
  .contact .php-email-form button[type="submit"] {
    background: #00b7cd;
    border: 0;
    padding: 10px 28px;
    color: #fff;
    transition: 0.4s;
    border-radius: 50px;
  }
  
  .contact .php-email-form button[type="submit"]:hover {
    background: #00b7cd;
  }
  
  @-webkit-keyframes animate-loading {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }
  
  @keyframes animate-loading {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }
  
  /*--------------------------------------------------------------
  # Breadcrumbs
  --------------------------------------------------------------*/
  .breadcrumbs {
    padding: 15px 0;
    background:#f1f1f1;
    margin-top:100px;
    border-bottom: 1px solid #e4e4e4;
  }
  
  @media (max-width: 992px) {
    
  }
  
  .breadcrumbs h2 {
    font-size: 26px;
    font-weight: 600;
  }
  
  .breadcrumbs ol {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    padding: 0 0 10px 0;
    margin: 0;
    font-size: 14px;
  }
  
  .breadcrumbs ol li + li {
    padding-left: 10px;
  }
  
  .breadcrumbs ol li + li::before {
    display: inline-block;
    padding-right: 10px;
    color: #655356;
    content: "/";
  }
  
  /*--------------------------------------------------------------
  # Portfolio Details
  --------------------------------------------------------------*/
  .portfolio-details {
    padding-top: 40px;
  }
  
  .portfolio-details .portfolio-details-container {
    position: relative;
  }
  
  .portfolio-details .portfolio-details-carousel {
    position: relative;
    z-index: 1;
  }
  
  .portfolio-details .portfolio-details-carousel .owl-nav, .portfolio-details .portfolio-details-carousel .owl-dots {
    margin-top: 5px;
    text-align: left;
  }
  
  .portfolio-details .portfolio-details-carousel .owl-dot {
    display: inline-block;
    margin: 0 10px 0 0;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: #ddd !important;
  }
  
  .portfolio-details .portfolio-details-carousel .owl-dot.active {
    background-color: #0d0479 !important;
  }
  
  .portfolio-details .portfolio-info {
    padding: 30px;
    position: absolute;
    right: 0;
    bottom: -70px;
    background: #fff;
    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
    z-index: 2;
  }
  
  .portfolio-details .portfolio-info h3 {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #eee;
  }
  
  .portfolio-details .portfolio-info ul {
    list-style: none;
    padding: 0;
    font-size: 15px;
  }
  
  .portfolio-details .portfolio-info ul li + li {
    margin-top: 10px;
  }
  
  .portfolio-details .portfolio-description {
    padding-top: 50px;
  }
  
  .portfolio-details .portfolio-description h2 {
    width: 50%;
    font-size: 26px;
    font-weight: 700;
    margin-bottom: 20px;
  }
  
  .portfolio-details .portfolio-description p {
    padding: 0 0 0 0;
  }
  
  @media (max-width: 768px) {
    .portfolio-details .portfolio-info {
      position: static;
      margin-top: 30px;
    }
  }
  
  /*--------------------------------------------------------------
  # Blog
  --------------------------------------------------------------*/
  .blog {
    padding: 40px 0 20px 0;
  }
  
  .blog .entry {
    padding: 20px;
    margin-bottom: 60px;
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  }
  
  .blog .entry .entry-img {
    max-height: 400px;
    margin: -20px -20px 20px -20px;
    overflow: hidden;
  }
  
  .blog .entry .entry-title {
    font-size: 20px;
    line-height: 26px;
    font-weight: bold;
    padding: 0;
    margin: 0 0 20px 0;
  }
  
  .blog .entry .entry-title a {
    color: #493c3e;
    transition: 0.3s;
  }
  
  .blog .entry .entry-title a:hover {
    color: #0d0479;
  }
  
  .blog .entry .entry-meta {
    color: #9a8487;
  }
  
  .blog .entry .entry-meta ul {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    padding: 0;
    margin: 0;
  }
  
  .blog .entry .entry-meta ul li {
    margin-bottom: 15px;
  }
  
  .blog .entry .entry-meta ul li + li {
    padding-left: 15px;
  }
  
  .blog .entry .entry-meta i {
    font-size: 14px;
    padding-right: 4px;
  }
  
  .blog .entry .entry-meta a {
    color: #9a8487;
    font-size: 14px;
    display: inline-block;
    line-height: 1;
  }
  
  .blog .entry .entry-content p {
    line-height: 24px;
    font-size: 15px;
  }
  
  .blog .entry .entry-content .read-more {
    -moz-text-align-last: right;
    text-align-last: right;
  }
  
  .blog .entry .entry-content .read-more a {
    display: inline-block;
    background: #0d0479;
    color: #fff;
    padding: 5px 20px 7px 20px;
    transition: 0.3s;
    font-size: 14px;
    border-radius: 50px;
  }
  
  .blog .entry .entry-content .read-more a:hover {
    background: #d01d3f;
  }
  
  .blog .entry .entry-content h3 {
    font-size: 22px;
    margin-top: 30px;
    font-weight: bold;
  }
  
  .blog .entry .entry-content blockquote {
    overflow: hidden;
    background-color: #fafafa;
    padding: 60px;
    position: relative;
    text-align: center;
    margin: 20px 0;
  }
  
  .blog .entry .entry-content blockquote p {
    color: #444444;
    line-height: 1.6;
    margin-bottom: 0;
    font-style: italic;
    font-weight: 500;
    font-size: 22px;
  }
  
  .blog .entry .entry-content blockquote .quote-left {
    position: absolute;
    left: 20px;
    top: 20px;
    font-size: 36px;
    color: #e7e7e7;
  }
  
  .blog .entry .entry-content blockquote .quote-right {
    position: absolute;
    right: 20px;
    bottom: 20px;
    font-size: 36px;
    color: #e7e7e7;
  }
  
  .blog .entry .entry-content blockquote::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background-color: #493c3e;
    margin-top: 20px;
    margin-bottom: 20px;
  }
  
  .blog .entry .entry-footer {
    padding-top: 10px;
    border-top: 1px solid #e6e6e6;
  }
  
  .blog .entry .entry-footer i {
    color: #9a8487;
    display: inline;
  }
  
  .blog .entry .entry-footer a {
    color: #c3b6b8;
    transition: 0.3s;
  }
  
  .blog .entry .entry-footer a:hover {
    color: #0d0479;
  }
  
  .blog .entry .entry-footer .cats {
    list-style: none;
    display: inline;
    padding: 0 20px 0 0;
    font-size: 14px;
  }
  
  .blog .entry .entry-footer .cats li {
    display: inline-block;
  }
  
  .blog .entry .entry-footer .tags {
    list-style: none;
    display: inline;
    padding: 0;
    font-size: 14px;
  }
  
  .blog .entry .entry-footer .tags li {
    display: inline-block;
  }
  
  .blog .entry .entry-footer .tags li + li::before {
    padding-right: 6px;
    color: #6c757d;
    content: ",";
  }
  
  .blog .entry .entry-footer .share {
    font-size: 16px;
  }
  
  .blog .entry .entry-footer .share i {
    padding-left: 5px;
  }
  
  .blog .entry-single {
    margin-bottom: 30px;
  }
  
  .blog .entry-single .entry-title {
    font-size: 36px;
    line-height: 42px;
  }
  
  .blog .blog-author {
    padding: 20px;
    margin-bottom: 30px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  }
  
  .blog .blog-author img {
    width: 120px;
  }
  
  .blog .blog-author h4 {
    margin-left: 140px;
    font-weight: 600;
    font-size: 22px;
    margin-bottom: 0px;
    padding: 0;
  }
  
  .blog .blog-author .social-links {
    margin: 0 0 5px 140px;
  }
  
  .blog .blog-author .social-links a {
    color: #b1a0a3;
  }
  
  .blog .blog-author p {
    margin-left: 140px;
    font-style: italic;
    color: #b7b7b7;
  }
  
  .blog .blog-comments {
    margin-bottom: 30px;
  }
  
  .blog .blog-comments .comments-count {
    font-weight: bold;
  }
  
  .blog .blog-comments .comment {
    margin-top: 30px;
    position: relative;
  }
  
  .blog .blog-comments .comment .comment-img {
    width: 50px;
  }
  
  .blog .blog-comments .comment h5 {
    margin-left: 65px;
    font-size: 16px;
    margin-bottom: 2px;
  }
  
  .blog .blog-comments .comment h5 a {
    font-weight: bold;
    color: #444444;
    transition: 0.3s;
  }
  
  .blog .blog-comments .comment h5 a:hover {
    color: #0d0479;
  }
  
  .blog .blog-comments .comment h5 .reply {
    padding-left: 10px;
    color: #493c3e;
  }
  
  .blog .blog-comments .comment time {
    margin-left: 65px;
    display: block;
    font-size: 14px;
    color: #b1a0a3;
    margin-bottom: 5px;
  }
  
  .blog .blog-comments .comment p {
    margin-left: 65px;
  }
  
  .blog .blog-comments .comment.comment-reply {
    padding-left: 40px;
  }
  
  .blog .blog-comments .reply-form {
    margin-top: 30px;
    padding: 30px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  }
  
  .blog .blog-comments .reply-form h4 {
    font-weight: bold;
    font-size: 22px;
  }
  
  .blog .blog-comments .reply-form p {
    font-size: 14px;
  }
  
  .blog .blog-comments .reply-form input {
    border-radius: 0;
    padding: 20px 10px;
    font-size: 14px;
  }
  
  .blog .blog-comments .reply-form input:focus {
    box-shadow: none;
    border-color: #f096a7;
  }
  
  .blog .blog-comments .reply-form textarea {
    border-radius: 0;
    padding: 10px 10px;
    font-size: 14px;
  }
  
  .blog .blog-comments .reply-form textarea:focus {
    box-shadow: none;
    border-color: #f096a7;
  }
  
  .blog .blog-comments .reply-form .form-group {
    margin-bottom: 25px;
  }
  
  .blog .blog-comments .reply-form .btn-primary {
    border-radius: 0;
    padding: 10px 20px;
    border: 0;
    border-radius: 50px;
    background-color: #493c3e;
  }
  
  .blog .blog-comments .reply-form .btn-primary:hover {
    background-color: #0d0479;
  }
  
  .blog .blog-pagination {
    color: #816a6e;
  }
  
  .blog .blog-pagination ul {
    display: flex;
    padding-left: 0;
    list-style: none;
  }
  
  .blog .blog-pagination li {
    border: 1px solid white;
    margin: 0 5px;
    transition: 0.3s;
  }
  
  .blog .blog-pagination li.active {
    background: white;
  }
  
  .blog .blog-pagination li a {
    color: #aaaaaa;
    padding: 7px 16px;
    display: inline-block;
  }
  
  .blog .blog-pagination li.active, .blog .blog-pagination li:hover {
    background: #0d0479;
    border: 1px solid #0d0479;
  }
  
  .blog .blog-pagination li.active a, .blog .blog-pagination li:hover a {
    color: #fff;
  }
  
  .blog .blog-pagination li.disabled {
    background: #fff;
    border: 1px solid white;
  }
  
  .blog .blog-pagination li.disabled i {
    color: #f1f1f1;
    padding: 10px 16px;
    display: inline-block;
  }
  
  .blog .sidebar {
    padding: 30px;
    margin: 0 0 60px 20px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  }
  
  .blog .sidebar .sidebar-title {
    font-size: 20px;
    font-weight: 700;
    padding: 0 0 0 0;
    margin: 0 0 15px 0;
    color: #493c3e;
    position: relative;
  }
  
  .blog .sidebar .sidebar-item {
    margin-bottom: 30px;
  }
  
  .blog .sidebar .search-form form {
    background: #fff;
    border: 1px solid #d3cacb;
    padding: 3px 10px;
    position: relative;
    border-radius: 50px;
  }
  
  .blog .sidebar .search-form form input[type="text"] {
    border: 0;
    padding: 4px;
    width: calc(100% - 42px);
  }
  
  .blog .sidebar .search-form form button {
    position: absolute;
    border-radius: 50px;
    top: 0;
    right: -2px;
    bottom: 0;
    border: 0;
    background: none;
    font-size: 16px;
    padding: 0 20px;
    margin: -1px;
    background: #0d0479;
    color: #fff;
    transition: 0.3s;
  }
  
  .blog .sidebar .search-form form button:hover {
    background: #d01d3f;
  }
  
  .blog .sidebar .categories ul {
    list-style: none;
    padding: 0;
  }
  
  .blog .sidebar .categories ul li + li {
    padding-top: 10px;
  }
  
  .blog .sidebar .categories ul a {
    color: #655356;
  }
  
  .blog .sidebar .categories ul a:hover {
    color: #0d0479;
  }
  
  .blog .sidebar .categories ul a span {
    padding-left: 5px;
    color: #b1a0a3;
    font-size: 14px;
  }
  
  .blog .sidebar .recent-posts .post-item + .post-item {
    margin-top: 15px;
  }
  
  .blog .sidebar .recent-posts img {
    width: 80px;
    float: left;
  }
  
  .blog .sidebar .recent-posts h4 {
    font-size: 15px;
    margin-left: 95px;
    font-weight: bold;
  }
  
  .blog .sidebar .recent-posts h4 a {
    color: #110e0e;
    transition: 0.3s;
  }
  
  .blog .sidebar .recent-posts h4 a:hover {
    color: #0d0479;
  }
  
  .blog .sidebar .recent-posts time {
    display: block;
    margin-left: 95px;
    font-style: italic;
    font-size: 14px;
    color: #b1a0a3;
  }
  
  .blog .sidebar .tags {
    margin-bottom: -10px;
  }
  
  .blog .sidebar .tags ul {
    list-style: none;
    padding: 0;
  }
  
  .blog .sidebar .tags ul li {
    display: inline-block;
  }
  
  .blog .sidebar .tags ul a {
    color: #8e767a;
    font-size: 14px;
    padding: 6px 14px;
    margin: 0 6px 8px 0;
    border: 1px solid #ede9e9;
    display: inline-block;
    border-radius: 50px;
    transition: 0.3s;
  }
  
  .blog .sidebar .tags ul a:hover {
    color: #fff;
    border: 1px solid #0d0479;
    background: #0d0479;
  }
  
  .blog .sidebar .tags ul a span {
    padding-left: 5px;
    color: #dfd8d9;
    font-size: 14px;
  }
  
  /*--------------------------------------------------------------
  # Footer
  --------------------------------------------------------------*/
  #footer {
    /*color: #444444;*/
    color: #fff;
    font-size: 14px;
    /*background: #f6f4f4;*/
    background: #525d5d;
    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
  }
  
  #footer .footer-top {
    padding: 60px 0 30px 0;
    background: #85888c;
  }
  
  #footer .footer-top .footer-contact {
    margin-bottom: 30px;
  }
  
  #footer .footer-top .footer-contact h4 {
    font-size: 22px;
    margin: 0 0 30px 0;
    padding: 2px 0 2px 0;
    line-height: 1;
    font-weight: 700;
  }
  
  #footer .footer-top .footer-contact p {
    font-size: 14px;
    line-height: 24px;
    margin-bottom: 0;
    font-family: "Nunito", sans-serif;
    color: #777777;
  }
  
  #footer .footer-top h4 {
    font-size: 16px;
    font-weight: bold;
    /*color: #444444;*/
    color: #00b7cd;
    position: relative;
    padding-bottom: 12px;
  }
  
  #footer .footer-top .footer-links {
    margin-bottom: 30px;
  }
  
  #footer .footer-top .footer-links ul {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  
  #footer .footer-top .footer-links ul i {
    padding-right: 2px;
    color: #fff;
    font-size: 18px;
    line-height: 1;
  }
  
  #footer .footer-top .footer-links ul li {
    padding: 10px 0;
    display: flex;
    align-items: center;
  }
  
  #footer .footer-top .footer-links ul li:first-child {
    padding-top: 0;
  }
  
  #footer .footer-top .footer-links ul a {
    color: #fff;
    transition: 0.3s;
    font-size: 15px;
    display: inline-block;
    line-height: 1;
  }
  
  #footer .footer-top .footer-links ul a:hover {
    text-decoration: none;
    color: #00b7cd;
  }
  
  #footer .footer-newsletter {
    font-size: 15px;
  }
  
  #footer .footer-newsletter h4 {
    font-size: 16px;
    font-weight: bold;
    /*color: #444444;*/
    color: #00b7cd;
    position: relative;
    padding-bottom: 12px;
  }
  
  #footer .footer-newsletter form {
    margin-top: 30px;
    background: #fff;
    padding: 6px 10px;
    position: relative;
    border-radius: 50px;
    text-align: left;
    border: 1px solid #f7c2cc;
  }
  
  #footer .footer-newsletter form input[type="email"] {
    border: 0;
    padding: 4px 8px;
    width: calc(100% - 100px);
  }
  
  #footer .footer-newsletter form input[type="submit"] {
    position: absolute;
    top: 0;
    right: -2px;
    bottom: 0;
    border: 0;
    background: none;
    font-size: 15px;
    padding: 0 22px;
    background: #0d0479;
    color: #fff;
    transition: 0.3s;
    border-radius: 50px;
    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
  }
  
  #footer .footer-newsletter form input[type="submit"]:hover {
    background: #d01d3f;
  }
  
  #footer .credits {
    padding-top: 5px;
    font-size: 13px;
    color: #444444;
  }
  
  #footer .social-links a {
    font-size: 18px;
    display: inline-block;
    /*background: #0d0479;*/
    background: #00b7cd;
    color: #fff;
    line-height: 1;
    padding: 8px 0;
    margin-right: 4px;
    border-radius: 50%;
    text-align: center;
    width: 36px;
    height: 36px;
    transition: 0.3s;
  }
  
  #footer .social-links a:hover {
    background: #aaafaf;
    color: #fff;
    text-decoration: none;
  }
  
  .services{padding-bottom:80px;}
  .services .icon-box.rating-box{text-align: left;max-width: 100%;flex: 0 0 100%;padding:30px;margin-bottom: 30px;}
  .services .icon-box.rating-box h3{font-size:18px;font-weight:700;display:flex;position: relative;padding-left:40px;align-items: center;margin-bottom: 30px;}
  .services .icon-box.rating-box h3 span.rating-value{width:50px;height:50px;position: absolute;left:-15px;top:-5px;font-size:11px;font-weight:700;color:#fff;display: inline-flex;justify-content: center;align-items: center;
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='iso-8859-1'%3F%3E%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpolygon fill='%2300b7cd' points='512,197.816 325.961,185.585 255.898,9.569 185.835,185.585 0,197.816 142.534,318.842 95.762,502.431 255.898,401.21 416.035,502.431 369.263,318.842'/%3E%3C/svg%3E");}
  .services .icon-box.rating-box::before{background:#00b7cd;}
  .services .icon-box.rating-box .userDetails{border-top: 1px solid #aeaeae;margin: 10px 0 0;padding-top: 10px;}
  .services .icon-box.rating-box .userDetails h3{padding-left: 0;}
  .services .icon-box.rating-box:hover h3 span.rating-value{background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='iso-8859-1'%3F%3E%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpolygon fill='%23fff' points='512,197.816 325.961,185.585 255.898,9.569 185.835,185.585 0,197.816 142.534,318.842 95.762,502.431 255.898,401.21 416.035,502.431 369.263,318.842'/%3E%3C/svg%3E");color:#0d0479;}
  .services .icon-box.rating-box:hover h3{color:#fff;}
  .services .icon-box.rating-box:hover .userDetails p{color:#fff;}
  .services .icon-box.rating-box .description{line-height: 1.2;}
  .graybg{background:#e6e8e8;}
  .portfolio .portfolio-item .portfolio-info{background:#00b7cd;}
  
  .whyservices .block-grid-item {
    text-align: center;
    border: 1px solid #e2eefd;
    padding: 40px 20px;
    transition: all ease-in-out 0.3s;
    background: #fff;
    margin-bottom: 30px;
    min-height:350px;
  }
  
  .whyservices .block-grid-item .promo-icon {
    margin: 0 auto;
    width: 64px;
    height: 64px;
    background: #d9fbff;
    border-radius: 50px;
    border: 1px solid #deebfd;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    transition: ease-in-out 0.3s;
  }
  
  .whyservices .block-grid-item .promo-icon i {
    /*color: #3b8af2;*/
    color: #00b7cd;
    font-size: 28px;
    transition: ease-in-out 0.3s;
  }
  
  .whyservices .block-grid-item h4 {
    font-weight: 700;
    margin-bottom: 15px;
    font-size: 24px;
  }
  
  .whyservices .block-grid-item h4 a {
    color: #222222;
    transition: ease-in-out 0.3s;
  }
  
  .whyservices .block-grid-item p {
    line-height: 24px;
    font-size: 14px;
    margin-bottom: 0;
  }
  
  .colorOptions{display: flex;position: absolute;right: 20px;top:10px;list-style: none;}
  .colorOptions li{width:20px;height: 20px;border-radius: 100%;border:1px solid #fff;list-style: none;margin:0 2px;}
  .colorOptions li.black{background:#000;}
  .colorOptions li.blacks{background:white;}
  .colorOptions li.blue{background:#4a86e8;}
  .colorOptions li.bluee{background:red;}
  .colorOptions li.purple{background:#992d92;}
  
  .colorOptions li.green{background:#59e84a; }
  .colorOptions li.greeen{background:grey; }
  
  
  .auqaWaterPruifer {
    background: linear-gradient(rgba(2, 2, 2, 0.5), rgba(0, 0, 0, 0.8)), url("../img/water-purifier-repair-service.jpg") center center;
    background-size: cover;
    padding: 60px 0;
    background-attachment: fixed;
  }
  .auqaWaterPruifer ul{margin-bottom: 20px;}
  .auqaWaterPruifer ul li{font-style: 16px;color:#fff;font-weight: 400;line-height: 24px;margin-bottom:8px;}
  .auqaWaterPruifer ul li span{font-weight: 700;color:#00b7cd;font-size: 20px;}
  
  .hero-container .form-group{}
  .hero-container .form-group .form-control{border:0;height: 45px;/*border-radius: 0;*/border-right: 1px solid #e4e4e4;border-bottom: 1px solid #e4e4e4;border-left: 1px solid #e4e4e4;border-top: 1px solid #e4e4e4;}
  .hero-container .form-group.btnDiv{border-right: 0;}
  .hero-container .btnDiv .btn{width:40%;background:#00b7cd;height: 45px;border:0;/*border-radius: 0;*/color:#fff;font-size:18px;font-weight: 400;text-align: center;}
  .portfolio-container{justify-content: center;}
  
  .policies-details h3 {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 20px;
  }
  
  .policies-details p {
    font-size: 14px;line-height: 24px;color:#000;margin-bottom: 15px;
  }
  .card-header{position: relative;}
  .card-header h2{font-size: 18px}
  .bookingDetails{display: flex;flex-wrap: wrap;text-align: left;}
  .mainform{text-align: center;display: block;}
  .bookingDetails h4{padding: 0 10px;font-size: 16px;}
  .bookingDetails h4 i{margin-right: 10px;}
  .mainform .btn{margin:30px 0;background:#00b7cd;color:#fff;font-size:18px;font-weight: 400;text-align: center;}
  .mainform .form-group label{text-align: left;display: block;}
  .bookingForm .rightMenu{display: block;}
  .bookingForm  .fixed-top{/* background:#00b7cd;*/ }
  #hero > .hero-container .bookingform .form-group{margin-bottom:20px;position: relative;}
  #hero > .hero-container .bookingform .form-group label.error{position: absolute;width: 100%;left:0;top:100%;display: block;text-align: left;color:darkorange;}
  .mainform .form-group{margin-bottom:25px;position: relative;}
  .mainform .form-group label.error{position: absolute;width: 100%;left:0;top:100%;display: block;text-align: left;color:darkorange;}
  .textarea-box .form-control{min-height:80px;}
  
  /*kowsi28-04-2021*/
  
  .home-circle-small {width: 65px;text-align: center;display: inline-block;font-size: 26px;line-height: 2.5;height: 65px;border: 1px solid #ccc;border-radius: 100%;}
  .center-block {}
  .text-center {text-align: center;}
  .bannerbottomsec:hover {color: #ffffff;text-decoration: none;}
  span.home-circle-small {color: #ffff;}
  a.bannerbottomsec h4 {color: #fff;font-size: 17px;padding: 9px;}
  #header.header-scrolled{background: #525d5d;}
  #header { /*background-color:#0d0479;*/padding: 1px 10px;position: fixed;top: 0;width: 100%;}
  .banner-text{font-weight: 500;}
  /*#hero{margin-top:60px;}*/
   form#bookingform {padding: 10px;margin-bottom:20px; /*width: 1500px;*/} 
  #hero > .hero-container .bookingform .btnDiv{margin-bottom:0;}
  .footer-links strong {color: #00b7cd;font-size: 16px;}
  .footer-links p {color: #fff;}
  div#alert-success {width: 50%;margin-left: 335px;}
  
  .contact iframe{margin:0;padding:0;border:0;width:100%;height: 470px;}
  #fixedbutton {
      height: 0;
      width: 85px;
      position: fixed;
      right: 0;
      top: 40%;
      z-index: 1000;
      transform: rotate(-90deg);
      -webkit-transform: rotate(-90deg);
      -moz-transform: rotate(-90deg);
      -o-transform: rotate(-90deg);
  }
  #fixedbutton a {
      display: block;
      background: #000;
      border-top: 4px solid #000;
      height: 52px;
      padding-top: 5px;
      width: 155px;
      text-align: center;
      color: #fff;
      font-size: 15px;
      font-weight: 600;
      text-decoration: none;
  }
  #faq{min-height: 450px;}
  .sticky-foot {
      margin-left: -51px;
      width: 482px;
      /* background: #00b7cd; */
      position: fixed;
      z-index: 9999;
      display: none;
  }
  .sticky-foot ul {
      width: 100%;
      margin: 4px;
      padding: 0;
      text-align: center;
  }
  .sticky-foot ul li {
      display: inline-block;
      /* border-right: 1px solid #3c3c3c; */
      width: 40%;
      position: relative;
      margin-bottom: 0;
  }
  .sticky-foot ul li a {
      color: #fff;
      text-decoration: none;
      padding: 0px;
      display: block;
      text-align: center;
      font-size: 28px;
      cursor: pointer;
      transition: all .3s ease 0s;
  }
.buttons-mbv{
    background-color: #00b7cd;
    color: white;
    width: 44%;
    text-align: center;
    display: block;
}
.aqua-ch{text-decoration: underline;}
.space-cont{margin-top:0;}

/*@media (max-width: 440px){
#hero h1 {
    font-size: 18px !important;
    margin-top: -60px;
    line-height: 1.2;
    font-weight: 700;
}
}*/
  @media only screen and (max-width:568px) {
  .phone i.icofont-phone {
    text-align: center;
    padding-top: 4%;
}
.space-cont{
    margin-top: -14% !important;
}
section#purifier-service {
    margin-top: -14%;
}
.buttons-mbv{
   background-color: #00b7cd;
    color: white;
    width: 44%;
    text-align: center;
    display: block;
}
  .portfolio .portfolio-item .portfolio-info3{
  padding: 21px 20px !important;
  }
  .colorOptions{
  top: 20px !important;
  }
  
  .portfolio .portfolio-item .portfolio-info1{
  padding: 20px 20px !important;
  }
  .colorOptions{
  top: 20px !important;
  }
  
  .portfolio .portfolio-item .portfolio-info2{
  padding: 18px 20px !important;
  }
  .colorOptions{
  top: 20px !important;
  }
  
  .portfolio .portfolio-item .portfolio-info{
  padding: 18px 20px !important;
  }
  .colorOptions{
  top: 20px !important;
  }
  
  section#contact {
    margin-top: -47px;
}
section#faq-section {
    margin-top: -47px;
}
section#portfolio-details {
margin-top: -47px;
}
      
  .cremb3{margin-top: 9% !important;}
  div#alert-success {width: 100%;margin-left: 1px;}
  .top3 {
    margin-top: -8% !important;
}
section#bookingform {
    padding: 0px;
}
.abtpad {
    margin-left: 0px !important;
}

  .hero-container .btnDiv .btn{width: 100% !important;height: 30px;padding-top: 2%;}
  .hero-container .form-group .form-control{height: 40px !important;}

    #header .logo img {max-height: 74px;}
      #hero{height:100vh;}
    #sticky-foot{display: block;width: 100%;margin-left: 0px;}
  #header .container{display: block !important;text-align: center;}
  #header .container a.logo{display:inline-block;text-align: center;/*margin:0 auto 15px;*/}
  #header.header-scrolled .logo img.logosmall{display: inline-block;}
  #header .container div.rightMenu{display:inline-block; text-align: center;margin-left: 72%;margin-top: -36px;box-sizing:border-box;}
  #header .container div.rightMenu a{}
  .center-block{display:block;}
  .sticky-foot{display: block;bottom: 0;}
  .whyservices .block-grid-item{min-height: auto;}

  #hero .hero-container{padding:30px 0;}
   #hero h1{font-size: 16px !important;line-height: 1.2;font-weight: 700;} 
  .social-links {margin-bottom: 40px;}
  #header{padding: 0px 10px;}
  img.img-fluid.logosmall {margin-top: -1%;}
  
  .bt-fon{width: 369px;padding-left: 3%;}
  }
  
  @media only screen and (max-width:568px){.hero-container .btnDiv .btn {
      width: 100 !important;
      height: 40px !important;
      padding-top: 2%;
  }
  .row justify-content-center.fo-bok{padding-left: 0%;}
  }
  @media only screen and (max-width:568px){.fo-bok {padding-left: 12% !important;}}
  @media only screen and (max-width:568px){.bok-cl {padding-right: 2% !important;}}
  
  @media only screen and (max-width:568px){.fo-in {margin-left: -20%;width:330px !important;}
  .col-12.col-sm-12.col-md-12.col-lg-3.form-group.btnDiv.bt-fon {
        margin-left: -16% !important;
  }
  .col-12.col-sm-12.col-md-4.col-lg-3.form-group {
    margin-top: -4%;
  }
  .col-12.col-sm-12.col-md-12.col-lg-3.form-group.btnDiv.bt-fon {
    margin-top: -4%;
  }
  .col-12.col-sm-12.col-md-8.col-lg-8 {
    margin-top: -7%;
    margin-left: -5%;
  }}
  
  @media only screen and (max-width:415px){
  #header .logo img{max-height: 45px;}
  }
  @media only screen and (max-width:768px){
  .back-to-top i {margin: 19px -15px 10px 10px;}
  }
  
  /*30-04-2021 kowsi*/
  .repair-container{justify-content: center;}
  .table td, .table th{border-top: transparent;}
  .table thead th{border-bottom: transparent;}
  .pb-4, .py-4 {padding-bottom: 1.0rem!important;}
  .repair-servicetable table{background:#fff;box-shadow: 0 5px 5px rgba(0,0,0,0.5);}
  .repair-servicetable table thead{background:#525d5d;}
  .repair-servicetable table thead th{font-size: 15px;color:#fff;}
  .repair-servicetable table tbody td{font-size: 15px;color:#525d5d;}
  .repair-servicetable table tbody tr:nth-of-type(even){background:#e8e6e6;}
  .secondsec{text-align: left;}
  .buynow-btn i {color: #64e936; padding-top: 4px; padding-right: 4px;}
  .buynow-btn .nocoloroption {color: #64e936; padding-top: 4px; padding-right: 4px;}
  .buynow-btn a {/*color: #ffff;font-size: 20px;border-radius: 5px;  background: #525d5d;  padding: 8px;*/}
  .buynow-btn {float: right;}
  .buynow-btn a:hover {color: #fff;}
  .faq h3 {font-size: 20px;font-weight: 700;margin-bottom: 20px;}
  .faq p {font-size: 16px;line-height: 24px;color: #000;margin-bottom: 15px;font-weight: 500;}
  li.li-terms {padding: 10px;}
  .faq-subheading{text-align: left; margin-bottom: 30px;}
  .timeslate{font-size: 15px;}
  .li-roservice-areas{list-style: none;}
  
  /*  */
  .abclr{
      background-color: #11b463;
      border: none;
      color: white;
      margin-right: 5%;
      border-radius: 5px;
      /* width: 50%; */
  }
  .abtpad{
    margin-left: 2px;
  }
  
  
  /*  */
  .portfolio .portfolio-item .portfolio-info1 {
    opacity: 0;
    position: absolute;
    left: 15px;
    right: 15px;
    bottom: -50px;
    z-index: 3;
    transition: all ease-in-out 0.3s;
    background: #00b7cd;
    padding: 16px 20px;
     top: 0px;
  }
  
  .portfolio .portfolio-item .portfolio-info1 h4 {
    font-size: 18px;
    color: #fff;
    font-weight: 600;
  }
  
  .portfolio .portfolio-item .portfolio-info1 p {
    color: #fff;
    font-size: 14px;
    margin-bottom: -3px;
  }
  
  .portfolio .portfolio-item .portfolio-info1 .preview-link, .portfolio .portfolio-item .portfolio-info1 .details-link {
    position: absolute;
    right: 50px;
    font-size: 24px;
    top: calc(50% - 18px);
    color: white;
    transition: ease-in-out 0.3s;
  }
  
  .portfolio .portfolio-item .portfolio-info1 .preview-link:hover, .portfolio .portfolio-item .portfolio-info1 .details-link:hover {
    color: #f7c2cc;
  }
  
  .portfolio .portfolio-item .portfolio-info1 .details-link {
    right: 15px;
  }
  
  .portfolio .portfolio-item:hover img {
    top: -30px;
  }
  
  .portfolio .portfolio-item:hover .portfolio-info1 {
    opacity: 1;
    bottom: 0;
  }
  .portfolio-details .portfolio-info1 {
    padding: 30px;
    position: absolute;
    right: 0;
    bottom: -70px;
    background: #fff;
    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
    z-index: 2;
  }
  
  .portfolio-details .portfolio-info1 h3 {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #eee;
  }
  
  .portfolio-details .portfolio-info1 ul {
    list-style: none;
    padding: 0;
    font-size: 15px;
  }
  
  .portfolio-details .portfolio-info1 ul li + li {
    margin-top: 10px;
  }
  @media (max-width: 768px) {
    .portfolio-details .portfolio-info1 {
      position: static;
      margin-top: 30px;
    }
  .portfolio .portfolio-item:hover .portfolio-info {
      opacity: 1;
      bottom: 0;
  }
  .portfolio .portfolio-item:hover img {
      top: -30px;
  }
  }
  
  /*  */
  .portfolio .portfolio-item .portfolio-info3 {
    opacity: 0;
    position: absolute;
    left: 15px;
    right: 15px;
    bottom: -50px;
    z-index: 3;
    transition: all ease-in-out 0.3s;
    background: #00b7cd;
    padding: 17px 20px;
    top: 0px;
  }
  
  .portfolio .portfolio-item .portfolio-info3 h4 {
    font-size: 18px;
    color: #fff;
    font-weight: 600;
  }
  
  .portfolio .portfolio-item .portfolio-info3 p {
    color: #fff;
    font-size: 14px;
    margin-bottom: -3px;
  }
  
  .portfolio .portfolio-item .portfolio-info3 .preview-link, .portfolio .portfolio-item .portfolio-info3 .details-link {
    position: absolute;
    right: 50px;
    font-size: 24px;
    top: calc(50% - 18px);
    color: white;
    transition: ease-in-out 0.3s;
  }
  
  .portfolio .portfolio-item .portfolio-info3 .preview-link:hover, .portfolio .portfolio-item .portfolio-info3 .details-link:hover {
    color: #f7c2cc;
  }
  
  .portfolio .portfolio-item .portfolio-info3 .details-link {
    right: 15px;
  }
  
  .portfolio .portfolio-item:hover img {
    top: -30px;
  }
  
  .portfolio .portfolio-item:hover .portfolio-info3 {
    opacity: 1;
    bottom: 0;
  }
  .portfolio-details .portfolio-info3 {
    padding: 30px;
    position: absolute;
    right: 0;
    bottom: -70px;
    background: #fff;
    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
    z-index: 2;
  }
  
  .portfolio-details .portfolio-info3 h3 {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #eee;
  }
  
  .portfolio-details .portfolio-info3 ul {
    list-style: none;
    padding: 0;
    font-size: 15px;
  }
  
  .portfolio-details .portfolio-info3 ul li + li {
    margin-top: 10px;
  }
  @media (max-width: 768px) {
    .portfolio-details .portfolio-info3 {
      position: static;
      margin-top: 30px;
    }
  .portfolio .portfolio-item:hover .portfolio-info {
      opacity: 1;
      bottom: 0;
  }
  .portfolio .portfolio-item:hover img {
      top: -30px;
  }
  }
  
  /*  */
  .portfolio .portfolio-item .portfolio-info2 {
    opacity: 0;
    position: absolute;
    left: 15px;
    right: 15px;
    bottom: -50px;
    z-index: 3;
    transition: all ease-in-out 0.3s;
    background: #00b7cd;
    padding: 14px 20px;
     top: 0px;
  }
  
  .portfolio .portfolio-item .portfolio-info2 h4 {
    font-size: 18px;
    color: #fff;
    font-weight: 600;
  }
  
  .portfolio .portfolio-item .portfolio-info2 p {
    color: #fff;
    font-size: 14px;
    margin-bottom: -3px;
  }
  
  .portfolio .portfolio-item .portfolio-info2 .preview-link, .portfolio .portfolio-item .portfolio-info2 .details-link {
    position: absolute;
    right: 50px;
    font-size: 24px;
    top: calc(50% - 18px);
    color: white;
    transition: ease-in-out 0.3s;
  }
  
  .portfolio .portfolio-item .portfolio-info2 .preview-link:hover, .portfolio .portfolio-item .portfolio-info2 .details-link:hover {
    color: #f7c2cc;
  }
  
  .portfolio .portfolio-item .portfolio-info2 .details-link {
    right: 15px;
  }
  
  .portfolio .portfolio-item:hover img {
    top: -30px;
  }
  
  .portfolio .portfolio-item:hover .portfolio-info2 {
    opacity: 1;
    bottom: 0;
  }
  .portfolio-details .portfolio-info2 {
    padding: 30px;
    position: absolute;
    right: 0;
    bottom: -70px;
    background: #fff;
    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
    z-index: 2;
  }
  
  .portfolio-details .portfolio-info2 h3 {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #eee;
  }
  
  .portfolio-details .portfolio-info2 ul {
    list-style: none;
    padding: 0;
    font-size: 15px;
  }
  
  .portfolio-details .portfolio-info2 ul li + li {
    margin-top: 10px;
  }
  @media (max-width: 768px) {
    .portfolio-details .portfolio-info2 {
      position: static;
      margin-top: 30px;
    }
  }
  
  
  .buynow-btn1 i {color: #64e936; padding-top: 4px; padding-right: 4px;}
  .buynow-btn1 a {color: #ffff;font-size: 20px;border-radius: 5px;background: #525d5d;padding: 8px;}
  .buynow-btn1 {float: right;padding-bottom: 6px;}
  .buynow-btn1 a:hover {color: #ffff;}
  
  .buynow-btn2 i {color: #64e936; padding-top: 4px; padding-right: 4px;}
  .buynow-btn2 a {color: #ffff;font-size: 20px;border-radius: 5px;background: #525d5d;padding: 8px;}
  .buynow-btn2 {float: right;padding-bottom: 6px;}
  .buynow-btn2 a:hover {color: #ffff;}
  
  .fo-bok{
    padding-left: 22%;
  }
  .fo-bok1{
    padding-top: 0%;
  }
  .bok-cl{
    color: #fff;
    width: 100%;
    font-size: 14px;
  }
  .terma{
    color: #2cddf3;
  }
  .fo-in{
    width: 340px;
  }
  .bt-fon{width: 30px;}
  
  
  /* Layout helpers
  ----------------------------------*/
  
  ul#ui-id-1 {
      overflow-y: scroll;
      height: 300px;
  }
  .ui-helper-hidden {
      display: none;
  }
  .ui-helper-hidden-accessible {
      border: 0;
      clip: rect(0 0 0 0);
      height: 1px;
      margin: -1px;
      overflow: hidden;
      padding: 0;
      position: absolute;
      width: 1px;
  }
  .ui-helper-reset {
      margin: 0;
      padding: 0;
      border: 0;
      outline: 0;
      line-height: 1.3;
      text-decoration: none;
      font-size: 100%;
      list-style: none;
  }
  .ui-helper-clearfix:before,
  .ui-helper-clearfix:after {
      content: "";
      display: table;
      border-collapse: collapse;
  }
  .ui-helper-clearfix:after {
      clear: both;
  }
  .ui-helper-zfix {
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      position: absolute;
      opacity: 0;
      filter:Alpha(Opacity=0); /* support: IE8 */
  }
  
  .ui-front {
      z-index: 100;
  }
  
  
  /* Interaction Cues
  ----------------------------------*/
  .ui-state-disabled {
      cursor: default !important;
      pointer-events: none;
  }
  
  
  /* Icons
  ----------------------------------*/
  .ui-icon {
      display: inline-block;
      vertical-align: middle;
      margin-top: -.25em;
      position: relative;
      text-indent: -99999px;
      overflow: hidden;
      background-repeat: no-repeat;
  }
  
  .ui-widget-icon-block {
      left: 50%;
      margin-left: -8px;
      display: block;
  }
  
  /* Misc visuals
  ----------------------------------*/
  
  /* Overlays */
  .ui-widget-overlay {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
  }
  .ui-accordion .ui-accordion-header {
      display: block;
      cursor: pointer;
      position: relative;
      margin: 2px 0 0 0;
      padding: .5em .5em .5em .7em;
      font-size: 100%;
  }
  .ui-accordion .ui-accordion-content {
      padding: 1em 2.2em;
      border-top: 0;
      overflow: auto;
  }
  .ui-autocomplete {
      position: absolute;
      top: 0;
      left: 0;
      cursor: default;
  }
  .ui-menu {
      list-style: none;
      padding: 0;
      margin: 0;
      display: block;
      outline: 0;
  }
  .ui-menu .ui-menu {
      position: absolute;
  }
  .ui-menu .ui-menu-item {
      margin: 0;
      cursor: pointer;
      /* support: IE10, see #8844 */
      list-style-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
  }
  .ui-menu .ui-menu-item-wrapper {
      position: relative;
      padding: 3px 1em 3px .4em;
  }
  .ui-menu .ui-menu-divider {
      margin: 5px 0;
      height: 0;
      font-size: 0;
      line-height: 0;
      border-width: 1px 0 0 0;
  }
  .ui-menu .ui-state-focus,
  .ui-menu .ui-state-active {
      margin: -1px;
  }
  
  /* icon support */
  .ui-menu-icons {
      position: relative;
  }
  .ui-menu-icons .ui-menu-item-wrapper {
      padding-left: 2em;
  }
  
  /* left-aligned */
  .ui-menu .ui-icon {
      position: absolute;
      top: 0;
      bottom: 0;
      left: .2em;
      margin: auto 0;
  }
  
  /* right-aligned */
  .ui-menu .ui-menu-icon {
      left: auto;
      right: 0;
  }
  .ui-button {
      padding: .4em 1em;
      display: inline-block;
      position: relative;
      line-height: normal;
      margin-right: .1em;
      cursor: pointer;
      vertical-align: middle;
      text-align: center;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
  
      /* Support: IE <= 11 */
      overflow: visible;
  }
  
  .ui-button,
  .ui-button:link,
  .ui-button:visited,
  .ui-button:hover,
  .ui-button:active {
      text-decoration: none;
  }
  
  /* to make room for the icon, a width needs to be set here */
  .ui-button-icon-only {
      width: 2em;
      box-sizing: border-box;
      text-indent: -9999px;
      white-space: nowrap;
  }
  
  /* no icon support for input elements */
  input.ui-button.ui-button-icon-only {
      text-indent: 0;
  }
  
  /* button icon element(s) */
  .ui-button-icon-only .ui-icon {
      position: absolute;
      top: 50%;
      left: 50%;
      margin-top: -8px;
      margin-left: -8px;
  }
  
  .ui-button.ui-icon-notext .ui-icon {
      padding: 0;
      width: 2.1em;
      height: 2.1em;
      text-indent: -9999px;
      white-space: nowrap;
  
  }
  
  input.ui-button.ui-icon-notext .ui-icon {
      width: auto;
      height: auto;
      text-indent: 0;
      white-space: normal;
      padding: .4em 1em;
  }
  
  /* workarounds */
  /* Support: Firefox 5 - 40 */
  input.ui-button::-moz-focus-inner,
  button.ui-button::-moz-focus-inner {
      border: 0;
      padding: 0;
  }
  .ui-controlgroup {
      vertical-align: middle;
      display: inline-block;
  }
  .ui-controlgroup > .ui-controlgroup-item {
      float: left;
      margin-left: 0;
      margin-right: 0;
  }
  .ui-controlgroup > .ui-controlgroup-item:focus,
  .ui-controlgroup > .ui-controlgroup-item.ui-visual-focus {
      z-index: 9999;
  }
  .ui-controlgroup-vertical > .ui-controlgroup-item {
      display: block;
      float: none;
      width: 100%;
      margin-top: 0;
      margin-bottom: 0;
      text-align: left;
  }
  .ui-controlgroup-vertical .ui-controlgroup-item {
      box-sizing: border-box;
  }
  .ui-controlgroup .ui-controlgroup-label {
      padding: .4em 1em;
  }
  .ui-controlgroup .ui-controlgroup-label span {
      font-size: 80%;
  }
  .ui-controlgroup-horizontal .ui-controlgroup-label + .ui-controlgroup-item {
      border-left: none;
  }
  .ui-controlgroup-vertical .ui-controlgroup-label + .ui-controlgroup-item {
      border-top: none;
  }
  .ui-controlgroup-horizontal .ui-controlgroup-label.ui-widget-content {
      border-right: none;
  }
  .ui-controlgroup-vertical .ui-controlgroup-label.ui-widget-content {
      border-bottom: none;
  }
  
  /* Spinner specific style fixes */
  .ui-controlgroup-vertical .ui-spinner-input {
  
      /* Support: IE8 only, Android < 4.4 only */
      width: 75%;
      width: calc( 100% - 2.4em );
  }
  .ui-controlgroup-vertical .ui-spinner .ui-spinner-up {
      border-top-style: solid;
  }
  
  .ui-checkboxradio-label .ui-icon-background {
      box-shadow: inset 1px 1px 1px #ccc;
      border-radius: .12em;
      border: none;
  }
  .ui-checkboxradio-radio-label .ui-icon-background {
      width: 16px;
      height: 16px;
      border-radius: 1em;
      overflow: visible;
      border: none;
  }
  .ui-checkboxradio-radio-label.ui-checkboxradio-checked .ui-icon,
  .ui-checkboxradio-radio-label.ui-checkboxradio-checked:hover .ui-icon {
      background-image: none;
      width: 8px;
      height: 8px;
      border-width: 4px;
      border-style: solid;
  }
  .ui-checkboxradio-disabled {
      pointer-events: none;
  }
  .ui-datepicker {
      width: 17em;
      padding: .2em .2em 0;
      display: none;
  }
  .ui-datepicker .ui-datepicker-header {
      position: relative;
      padding: .2em 0;
  }
  .ui-datepicker .ui-datepicker-prev,
  .ui-datepicker .ui-datepicker-next {
      position: absolute;
      top: 2px;
      width: 1.8em;
      height: 1.8em;
  }
  .ui-datepicker .ui-datepicker-prev-hover,
  .ui-datepicker .ui-datepicker-next-hover {
      top: 1px;
  }
  .ui-datepicker .ui-datepicker-prev {
      left: 2px;
  }
  .ui-datepicker .ui-datepicker-next {
      right: 2px;
  }
  .ui-datepicker .ui-datepicker-prev-hover {
      left: 1px;
  }
  .ui-datepicker .ui-datepicker-next-hover {
      right: 1px;
  }
  .ui-datepicker .ui-datepicker-prev span,
  .ui-datepicker .ui-datepicker-next span {
      display: block;
      position: absolute;
      left: 50%;
      margin-left: -8px;
      top: 50%;
      margin-top: -8px;
  }
  .ui-datepicker .ui-datepicker-title {
      margin: 0 2.3em;
      line-height: 1.8em;
      text-align: center;
  }
  .ui-datepicker .ui-datepicker-title select {
      font-size: 1em;
      margin: 1px 0;
  }
  .ui-datepicker select.ui-datepicker-month,
  .ui-datepicker select.ui-datepicker-year {
      width: 45%;
  }
  .ui-datepicker table {
      width: 100%;
      font-size: .9em;
      border-collapse: collapse;
      margin: 0 0 .4em;
  }
  .ui-datepicker th {
      padding: .7em .3em;
      text-align: center;
      font-weight: bold;
      border: 0;
  }
  .ui-datepicker td {
      border: 0;
      padding: 1px;
  }
  .ui-datepicker td span,
  .ui-datepicker td a {
      display: block;
      padding: .2em;
      text-align: right;
      text-decoration: none;
  }
  .ui-datepicker .ui-datepicker-buttonpane {
      background-image: none;
      margin: .7em 0 0 0;
      padding: 0 .2em;
      border-left: 0;
      border-right: 0;
      border-bottom: 0;
  }
  .ui-datepicker .ui-datepicker-buttonpane button {
      float: right;
      margin: .5em .2em .4em;
      cursor: pointer;
      padding: .2em .6em .3em .6em;
      width: auto;
      overflow: visible;
  }
  .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
      float: left;
  }
  
  /* with multiple calendars */
  .ui-datepicker.ui-datepicker-multi {
      width: auto;
  }
  .ui-datepicker-multi .ui-datepicker-group {
      float: left;
  }
  .ui-datepicker-multi .ui-datepicker-group table {
      width: 95%;
      margin: 0 auto .4em;
  }
  .ui-datepicker-multi-2 .ui-datepicker-group {
      width: 50%;
  }
  .ui-datepicker-multi-3 .ui-datepicker-group {
      width: 33.3%;
  }
  .ui-datepicker-multi-4 .ui-datepicker-group {
      width: 25%;
  }
  .ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
  .ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
      border-left-width: 0;
  }
  .ui-datepicker-multi .ui-datepicker-buttonpane {
      clear: left;
  }
  .ui-datepicker-row-break {
      clear: both;
      width: 100%;
      font-size: 0;
  }
  
  /* RTL support */
  .ui-datepicker-rtl {
      direction: rtl;
  }
  .ui-datepicker-rtl .ui-datepicker-prev {
      right: 2px;
      left: auto;
  }
  .ui-datepicker-rtl .ui-datepicker-next {
      left: 2px;
      right: auto;
  }
  .ui-datepicker-rtl .ui-datepicker-prev:hover {
      right: 1px;
      left: auto;
  }
  .ui-datepicker-rtl .ui-datepicker-next:hover {
      left: 1px;
      right: auto;
  }
  .ui-datepicker-rtl .ui-datepicker-buttonpane {
      clear: right;
  }
  .ui-datepicker-rtl .ui-datepicker-buttonpane button {
      float: left;
  }
  .ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
  .ui-datepicker-rtl .ui-datepicker-group {
      float: right;
  }
  .ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
  .ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
      border-right-width: 0;
      border-left-width: 1px;
  }
  
  /* Icons */
  .ui-datepicker .ui-icon {
      display: block;
      text-indent: -99999px;
      overflow: hidden;
      background-repeat: no-repeat;
      left: .5em;
      top: .3em;
  }
  .ui-dialog {
      position: absolute;
      top: 0;
      left: 0;
      padding: .2em;
      outline: 0;
  }
  .ui-dialog .ui-dialog-titlebar {
      padding: .4em 1em;
      position: relative;
  }
  .ui-dialog .ui-dialog-title {
      float: left;
      margin: .1em 0;
      white-space: nowrap;
      width: 90%;
      overflow: hidden;
      text-overflow: ellipsis;
  }
  .ui-dialog .ui-dialog-titlebar-close {
      position: absolute;
      right: .3em;
      top: 50%;
      width: 20px;
      margin: -10px 0 0 0;
      padding: 1px;
      height: 20px;
  }
  .ui-dialog .ui-dialog-content {
      position: relative;
      border: 0;
      padding: .5em 1em;
      background: none;
      overflow: auto;
  }
  .ui-dialog .ui-dialog-buttonpane {
      text-align: left;
      border-width: 1px 0 0 0;
      background-image: none;
      margin-top: .5em;
      padding: .3em 1em .5em .4em;
  }
  .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
      float: right;
  }
  .ui-dialog .ui-dialog-buttonpane button {
      margin: .5em .4em .5em 0;
      cursor: pointer;
  }
  .ui-dialog .ui-resizable-n {
      height: 2px;
      top: 0;
  }
  .ui-dialog .ui-resizable-e {
      width: 2px;
      right: 0;
  }
  .ui-dialog .ui-resizable-s {
      height: 2px;
      bottom: 0;
  }
  .ui-dialog .ui-resizable-w {
      width: 2px;
      left: 0;
  }
  .ui-dialog .ui-resizable-se,
  .ui-dialog .ui-resizable-sw,
  .ui-dialog .ui-resizable-ne,
  .ui-dialog .ui-resizable-nw {
      width: 7px;
      height: 7px;
  }
  .ui-dialog .ui-resizable-se {
      right: 0;
      bottom: 0;
  }
  .ui-dialog .ui-resizable-sw {
      left: 0;
      bottom: 0;
  }
  .ui-dialog .ui-resizable-ne {
      right: 0;
      top: 0;
  }
  .ui-dialog .ui-resizable-nw {
      left: 0;
      top: 0;
  }
  .ui-draggable .ui-dialog-titlebar {
      cursor: move;
  }
  .ui-draggable-handle {
      -ms-touch-action: none;
      touch-action: none;
  }
  .ui-resizable {
      position: relative;
  }
  .ui-resizable-handle {
      position: absolute;
      font-size: 0.1px;
      display: block;
      -ms-touch-action: none;
      touch-action: none;
  }
  .ui-resizable-disabled .ui-resizable-handle,
  .ui-resizable-autohide .ui-resizable-handle {
      display: none;
  }
  .ui-resizable-n {
      cursor: n-resize;
      height: 7px;
      width: 100%;
      top: -5px;
      left: 0;
  }
  .ui-resizable-s {
      cursor: s-resize;
      height: 7px;
      width: 100%;
      bottom: -5px;
      left: 0;
  }
  .ui-resizable-e {
      cursor: e-resize;
      width: 7px;
      right: -5px;
      top: 0;
      height: 100%;
  }
  .ui-resizable-w {
      cursor: w-resize;
      width: 7px;
      left: -5px;
      top: 0;
      height: 100%;
  }
  .ui-resizable-se {
      cursor: se-resize;
      width: 12px;
      height: 12px;
      right: 1px;
      bottom: 1px;
  }
  .ui-resizable-sw {
      cursor: sw-resize;
      width: 9px;
      height: 9px;
      left: -5px;
      bottom: -5px;
  }
  .ui-resizable-nw {
      cursor: nw-resize;
      width: 9px;
      height: 9px;
      left: -5px;
      top: -5px;
  }
  .ui-resizable-ne {
      cursor: ne-resize;
      width: 9px;
      height: 9px;
      right: -5px;
      top: -5px;
  }
  .ui-progressbar {
      height: 2em;
      text-align: left;
      overflow: hidden;
  }
  .ui-progressbar .ui-progressbar-value {
      margin: -1px;
      height: 100%;
  }
  .ui-progressbar .ui-progressbar-overlay {
      background: url("data:image/gif;base64,R0lGODlhKAAoAIABAAAAAP///yH/C05FVFNDQVBFMi4wAwEAAAAh+QQJAQABACwAAAAAKAAoAAACkYwNqXrdC52DS06a7MFZI+4FHBCKoDeWKXqymPqGqxvJrXZbMx7Ttc+w9XgU2FB3lOyQRWET2IFGiU9m1frDVpxZZc6bfHwv4c1YXP6k1Vdy292Fb6UkuvFtXpvWSzA+HycXJHUXiGYIiMg2R6W459gnWGfHNdjIqDWVqemH2ekpObkpOlppWUqZiqr6edqqWQAAIfkECQEAAQAsAAAAACgAKAAAApSMgZnGfaqcg1E2uuzDmmHUBR8Qil95hiPKqWn3aqtLsS18y7G1SzNeowWBENtQd+T1JktP05nzPTdJZlR6vUxNWWjV+vUWhWNkWFwxl9VpZRedYcflIOLafaa28XdsH/ynlcc1uPVDZxQIR0K25+cICCmoqCe5mGhZOfeYSUh5yJcJyrkZWWpaR8doJ2o4NYq62lAAACH5BAkBAAEALAAAAAAoACgAAAKVDI4Yy22ZnINRNqosw0Bv7i1gyHUkFj7oSaWlu3ovC8GxNso5fluz3qLVhBVeT/Lz7ZTHyxL5dDalQWPVOsQWtRnuwXaFTj9jVVh8pma9JjZ4zYSj5ZOyma7uuolffh+IR5aW97cHuBUXKGKXlKjn+DiHWMcYJah4N0lYCMlJOXipGRr5qdgoSTrqWSq6WFl2ypoaUAAAIfkECQEAAQAsAAAAACgAKAAAApaEb6HLgd/iO7FNWtcFWe+ufODGjRfoiJ2akShbueb0wtI50zm02pbvwfWEMWBQ1zKGlLIhskiEPm9R6vRXxV4ZzWT2yHOGpWMyorblKlNp8HmHEb/lCXjcW7bmtXP8Xt229OVWR1fod2eWqNfHuMjXCPkIGNileOiImVmCOEmoSfn3yXlJWmoHGhqp6ilYuWYpmTqKUgAAIfkECQEAAQAsAAAAACgAKAAAApiEH6kb58biQ3FNWtMFWW3eNVcojuFGfqnZqSebuS06w5V80/X02pKe8zFwP6EFWOT1lDFk8rGERh1TTNOocQ61Hm4Xm2VexUHpzjymViHrFbiELsefVrn6XKfnt2Q9G/+Xdie499XHd2g4h7ioOGhXGJboGAnXSBnoBwKYyfioubZJ2Hn0RuRZaflZOil56Zp6iioKSXpUAAAh+QQJAQABACwAAAAAKAAoAAACkoQRqRvnxuI7kU1a1UU5bd5tnSeOZXhmn5lWK3qNTWvRdQxP8qvaC+/yaYQzXO7BMvaUEmJRd3TsiMAgswmNYrSgZdYrTX6tSHGZO73ezuAw2uxuQ+BbeZfMxsexY35+/Qe4J1inV0g4x3WHuMhIl2jXOKT2Q+VU5fgoSUI52VfZyfkJGkha6jmY+aaYdirq+lQAACH5BAkBAAEALAAAAAAoACgAAAKWBIKpYe0L3YNKToqswUlvznigd4wiR4KhZrKt9Upqip61i9E3vMvxRdHlbEFiEXfk9YARYxOZZD6VQ2pUunBmtRXo1Lf8hMVVcNl8JafV38aM2/Fu5V16Bn63r6xt97j09+MXSFi4BniGFae3hzbH9+hYBzkpuUh5aZmHuanZOZgIuvbGiNeomCnaxxap2upaCZsq+1kAACH5BAkBAAEALAAAAAAoACgAAAKXjI8By5zf4kOxTVrXNVlv1X0d8IGZGKLnNpYtm8Lr9cqVeuOSvfOW79D9aDHizNhDJidFZhNydEahOaDH6nomtJjp1tutKoNWkvA6JqfRVLHU/QUfau9l2x7G54d1fl995xcIGAdXqMfBNadoYrhH+Mg2KBlpVpbluCiXmMnZ2Sh4GBqJ+ckIOqqJ6LmKSllZmsoq6wpQAAAh+QQJAQABACwAAAAAKAAoAAAClYx/oLvoxuJDkU1a1YUZbJ59nSd2ZXhWqbRa2/gF8Gu2DY3iqs7yrq+xBYEkYvFSM8aSSObE+ZgRl1BHFZNr7pRCavZ5BW2142hY3AN/zWtsmf12p9XxxFl2lpLn1rseztfXZjdIWIf2s5dItwjYKBgo9yg5pHgzJXTEeGlZuenpyPmpGQoKOWkYmSpaSnqKileI2FAAACH5BAkBAAEALAAAAAAoACgAAAKVjB+gu+jG4kORTVrVhRlsnn2dJ3ZleFaptFrb+CXmO9OozeL5VfP99HvAWhpiUdcwkpBH3825AwYdU8xTqlLGhtCosArKMpvfa1mMRae9VvWZfeB2XfPkeLmm18lUcBj+p5dnN8jXZ3YIGEhYuOUn45aoCDkp16hl5IjYJvjWKcnoGQpqyPlpOhr3aElaqrq56Bq7VAAAOw==");
      height: 100%;
      filter: alpha(opacity=25); /* support: IE8 */
      opacity: 0.25;
  }
  .ui-progressbar-indeterminate .ui-progressbar-value {
      background-image: none;
  }
  .ui-selectable {
      -ms-touch-action: none;
      touch-action: none;
  }
  .ui-selectable-helper {
      position: absolute;
      z-index: 100;
      border: 1px dotted black;
  }
  .ui-selectmenu-menu {
      padding: 0;
      margin: 0;
      position: absolute;
      top: 0;
      left: 0;
      display: none;
  }
  .ui-selectmenu-menu .ui-menu {
      overflow: auto;
      overflow-x: hidden;
      padding-bottom: 1px;
  }
  .ui-selectmenu-menu .ui-menu .ui-selectmenu-optgroup {
      font-size: 1em;
      font-weight: bold;
      line-height: 1.5;
      padding: 2px 0.4em;
      margin: 0.5em 0 0 0;
      height: auto;
      border: 0;
  }
  .ui-selectmenu-open {
      display: block;
  }
  .ui-selectmenu-text {
      display: block;
      margin-right: 20px;
      overflow: hidden;
      text-overflow: ellipsis;
  }
  .ui-selectmenu-button.ui-button {
      text-align: left;
      white-space: nowrap;
      width: 14em;
  }
  .ui-selectmenu-icon.ui-icon {
      float: right;
      margin-top: 0;
  }
  .ui-slider {
      position: relative;
      text-align: left;
  }
  .ui-slider .ui-slider-handle {
      position: absolute;
      z-index: 2;
      width: 1.2em;
      height: 1.2em;
      cursor: default;
      -ms-touch-action: none;
      touch-action: none;
  }
  .ui-slider .ui-slider-range {
      position: absolute;
      z-index: 1;
      font-size: .7em;
      display: block;
      border: 0;
      background-position: 0 0;
  }
  
  /* support: IE8 - See #6727 */
  .ui-slider.ui-state-disabled .ui-slider-handle,
  .ui-slider.ui-state-disabled .ui-slider-range {
      filter: inherit;
  }
  
  .ui-slider-horizontal {
      height: .8em;
  }
  .ui-slider-horizontal .ui-slider-handle {
      top: -.3em;
      margin-left: -.6em;
  }
  .ui-slider-horizontal .ui-slider-range {
      top: 0;
      height: 100%;
  }
  .ui-slider-horizontal .ui-slider-range-min {
      left: 0;
  }
  .ui-slider-horizontal .ui-slider-range-max {
      right: 0;
  }
  
  .ui-slider-vertical {
      width: .8em;
      height: 100px;
  }
  .ui-slider-vertical .ui-slider-handle {
      left: -.3em;
      margin-left: 0;
      margin-bottom: -.6em;
  }
  .ui-slider-vertical .ui-slider-range {
      left: 0;
      width: 100%;
  }
  .ui-slider-vertical .ui-slider-range-min {
      bottom: 0;
  }
  .ui-slider-vertical .ui-slider-range-max {
      top: 0;
  }
  .ui-sortable-handle {
      -ms-touch-action: none;
      touch-action: none;
  }
  .ui-spinner {
      position: relative;
      display: inline-block;
      overflow: hidden;
      padding: 0;
      vertical-align: middle;
  }
  .ui-spinner-input {
      border: none;
      background: none;
      color: inherit;
      padding: .222em 0;
      margin: .2em 0;
      vertical-align: middle;
      margin-left: .4em;
      margin-right: 2em;
  }
  .ui-spinner-button {
      width: 1.6em;
      height: 50%;
      font-size: .5em;
      padding: 0;
      margin: 0;
      text-align: center;
      position: absolute;
      cursor: default;
      display: block;
      overflow: hidden;
      right: 0;
  }
  /* more specificity required here to override default borders */
  .ui-spinner a.ui-spinner-button {
      border-top-style: none;
      border-bottom-style: none;
      border-right-style: none;
  }
  .ui-spinner-up {
      top: 0;
  }
  .ui-spinner-down {
      bottom: 0;
  }
  .ui-tabs {
      position: relative;/* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
      padding: .2em;
  }
  .ui-tabs .ui-tabs-nav {
      margin: 0;
      padding: .2em .2em 0;
  }
  .ui-tabs .ui-tabs-nav li {
      list-style: none;
      float: left;
      position: relative;
      top: 0;
      margin: 1px .2em 0 0;
      border-bottom-width: 0;
      padding: 0;
      white-space: nowrap;
  }
  .ui-tabs .ui-tabs-nav .ui-tabs-anchor {
      float: left;
      padding: .5em 1em;
      text-decoration: none;
  }
  .ui-tabs .ui-tabs-nav li.ui-tabs-active {
      margin-bottom: -1px;
      padding-bottom: 1px;
  }
  .ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor,
  .ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor,
  .ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor {
      cursor: text;
  }
  .ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor {
      cursor: pointer;
  }
  .ui-tabs .ui-tabs-panel {
      display: block;
      border-width: 0;
      padding: 1em 1.4em;
      background: none;
  }
  .ui-tooltip {
      padding: 8px;
      position: absolute;
      z-index: 9999;
      max-width: 300px;
  }
  body .ui-tooltip {
      border-width: 2px;
  }
  /* Component containers
  ----------------------------------*/
  .ui-widget {
      font-family: Arial,Helvetica,sans-serif;
      font-size: 1em;
  }
  .ui-widget .ui-widget {
      font-size: 1em;
  }
  .ui-widget input,
  .ui-widget select,
  .ui-widget textarea,
  .ui-widget button {
      font-family: Arial,Helvetica,sans-serif;
      font-size: 1em;
  }
  .ui-widget.ui-widget-content {
      border: 1px solid #c5c5c5;
  }
  .ui-widget-content {
      border: 1px solid #dddddd;
      background: #ffffff;
      color: #333333;
  }
  .ui-widget-content a {
      color: #333333;
  }
  .ui-widget-header {
      border: 1px solid #dddddd;
      background: #e9e9e9;
      color: #333333;
      font-weight: bold;
  }
  .ui-widget-header a {
      color: #333333;
  }
  
  /* Interaction states
  ----------------------------------*/
  .ui-state-default,
  .ui-widget-content .ui-state-default,
  .ui-widget-header .ui-state-default,
  .ui-button,
  
  /* We use html here because we need a greater specificity to make sure disabled
  works properly when clicked or hovered */
  html .ui-button.ui-state-disabled:hover,
  html .ui-button.ui-state-disabled:active {
      border: 1px solid #c5c5c5;
      background: #f6f6f6;
      font-weight: normal;
      color: #454545;
  }
  .ui-state-default a,
  .ui-state-default a:link,
  .ui-state-default a:visited,
  a.ui-button,
  a:link.ui-button,
  a:visited.ui-button,
  .ui-button {
      color: #454545;
      text-decoration: none;
  }
  .ui-state-hover,
  .ui-widget-content .ui-state-hover,
  .ui-widget-header .ui-state-hover,
  .ui-state-focus,
  .ui-widget-content .ui-state-focus,
  .ui-widget-header .ui-state-focus,
  .ui-button:hover,
  .ui-button:focus {
      border: 1px solid #cccccc;
      background: #ededed;
      font-weight: normal;
      color: #2b2b2b;
  }
  .ui-state-hover a,
  .ui-state-hover a:hover,
  .ui-state-hover a:link,
  .ui-state-hover a:visited,
  .ui-state-focus a,
  .ui-state-focus a:hover,
  .ui-state-focus a:link,
  .ui-state-focus a:visited,
  a.ui-button:hover,
  a.ui-button:focus {
      color: #2b2b2b;
      text-decoration: none;
  }
  
  .ui-visual-focus {
      box-shadow: 0 0 3px 1px rgb(94, 158, 214);
  }
  .ui-state-active,
  .ui-widget-content .ui-state-active,
  .ui-widget-header .ui-state-active,
  a.ui-button:active,
  .ui-button:active,
  .ui-button.ui-state-active:hover {
      border: 1px solid #003eff;
      background: #007fff;
      font-weight: normal;
      color: #ffffff;
  }
  .ui-icon-background,
  .ui-state-active .ui-icon-background {
      border: #003eff;
      background-color: #ffffff;
  }
  .ui-state-active a,
  .ui-state-active a:link,
  .ui-state-active a:visited {
      color: #ffffff;
      text-decoration: none;
  }
  
  /* Interaction Cues
  ----------------------------------*/
  .ui-state-highlight,
  .ui-widget-content .ui-state-highlight,
  .ui-widget-header .ui-state-highlight {
      border: 1px solid #dad55e;
      background: #fffa90;
      color: #777620;
  }
  .ui-state-checked {
      border: 1px solid #dad55e;
      background: #fffa90;
  }
  .ui-state-highlight a,
  .ui-widget-content .ui-state-highlight a,
  .ui-widget-header .ui-state-highlight a {
      color: #777620;
  }
  .ui-state-error,
  .ui-widget-content .ui-state-error,
  .ui-widget-header .ui-state-error {
      border: 1px solid #f1a899;
      background: #fddfdf;
      color: #5f3f3f;
  }
  .ui-state-error a,
  .ui-widget-content .ui-state-error a,
  .ui-widget-header .ui-state-error a {
      color: #5f3f3f;
  }
  .ui-state-error-text,
  .ui-widget-content .ui-state-error-text,
  .ui-widget-header .ui-state-error-text {
      color: #5f3f3f;
  }
  .ui-priority-primary,
  .ui-widget-content .ui-priority-primary,
  .ui-widget-header .ui-priority-primary {
      font-weight: bold;
  }
  .ui-priority-secondary,
  .ui-widget-content .ui-priority-secondary,
  .ui-widget-header .ui-priority-secondary {
      opacity: .7;
      filter:Alpha(Opacity=70); /* support: IE8 */
      font-weight: normal;
  }
  .ui-state-disabled,
  .ui-widget-content .ui-state-disabled,
  .ui-widget-header .ui-state-disabled {
      opacity: .35;
      filter:Alpha(Opacity=35); /* support: IE8 */
      background-image: none;
  }
  .ui-state-disabled .ui-icon {
      filter:Alpha(Opacity=35); /* support: IE8 - See #6059 */
  }
  
  /* Icons
  ----------------------------------*/
  
  /* states and images */
  .ui-icon {
      width: 16px;
      height: 16px;
  }
  .ui-icon,
  .ui-widget-content .ui-icon {
      background-image: url("images/ui-icons_444444_256x240.png");
  }
  .ui-widget-header .ui-icon {
      background-image: url("images/ui-icons_444444_256x240.png");
  }
  .ui-state-hover .ui-icon,
  .ui-state-focus .ui-icon,
  .ui-button:hover .ui-icon,
  .ui-button:focus .ui-icon {
      background-image: url("images/ui-icons_555555_256x240.png");
  }
  .ui-state-active .ui-icon,
  .ui-button:active .ui-icon {
      background-image: url("images/ui-icons_ffffff_256x240.png");
  }
  .ui-state-highlight .ui-icon,
  .ui-button .ui-state-highlight.ui-icon {
      background-image: url("images/ui-icons_777620_256x240.png");
  }
  .ui-state-error .ui-icon,
  .ui-state-error-text .ui-icon {
      background-image: url("images/ui-icons_cc0000_256x240.png");
  }
  .ui-button .ui-icon {
      background-image: url("images/ui-icons_777777_256x240.png");
  }
  
  /* positioning */
  .ui-icon-blank { background-position: 16px 16px; }
  .ui-icon-caret-1-n { background-position: 0 0; }
  .ui-icon-caret-1-ne { background-position: -16px 0; }
  .ui-icon-caret-1-e { background-position: -32px 0; }
  .ui-icon-caret-1-se { background-position: -48px 0; }
  .ui-icon-caret-1-s { background-position: -65px 0; }
  .ui-icon-caret-1-sw { background-position: -80px 0; }
  .ui-icon-caret-1-w { background-position: -96px 0; }
  .ui-icon-caret-1-nw { background-position: -112px 0; }
  .ui-icon-caret-2-n-s { background-position: -128px 0; }
  .ui-icon-caret-2-e-w { background-position: -144px 0; }
  .ui-icon-triangle-1-n { background-position: 0 -16px; }
  .ui-icon-triangle-1-ne { background-position: -16px -16px; }
  .ui-icon-triangle-1-e { background-position: -32px -16px; }
  .ui-icon-triangle-1-se { background-position: -48px -16px; }
  .ui-icon-triangle-1-s { background-position: -65px -16px; }
  .ui-icon-triangle-1-sw { background-position: -80px -16px; }
  .ui-icon-triangle-1-w { background-position: -96px -16px; }
  .ui-icon-triangle-1-nw { background-position: -112px -16px; }
  .ui-icon-triangle-2-n-s { background-position: -128px -16px; }
  .ui-icon-triangle-2-e-w { background-position: -144px -16px; }
  .ui-icon-arrow-1-n { background-position: 0 -32px; }
  .ui-icon-arrow-1-ne { background-position: -16px -32px; }
  .ui-icon-arrow-1-e { background-position: -32px -32px; }
  .ui-icon-arrow-1-se { background-position: -48px -32px; }
  .ui-icon-arrow-1-s { background-position: -65px -32px; }
  .ui-icon-arrow-1-sw { background-position: -80px -32px; }
  .ui-icon-arrow-1-w { background-position: -96px -32px; }
  .ui-icon-arrow-1-nw { background-position: -112px -32px; }
  .ui-icon-arrow-2-n-s { background-position: -128px -32px; }
  .ui-icon-arrow-2-ne-sw { background-position: -144px -32px; }
  .ui-icon-arrow-2-e-w { background-position: -160px -32px; }
  .ui-icon-arrow-2-se-nw { background-position: -176px -32px; }
  .ui-icon-arrowstop-1-n { background-position: -192px -32px; }
  .ui-icon-arrowstop-1-e { background-position: -208px -32px; }
  .ui-icon-arrowstop-1-s { background-position: -224px -32px; }
  .ui-icon-arrowstop-1-w { background-position: -240px -32px; }
  .ui-icon-arrowthick-1-n { background-position: 1px -48px; }
  .ui-icon-arrowthick-1-ne { background-position: -16px -48px; }
  .ui-icon-arrowthick-1-e { background-position: -32px -48px; }
  .ui-icon-arrowthick-1-se { background-position: -48px -48px; }
  .ui-icon-arrowthick-1-s { background-position: -64px -48px; }
  .ui-icon-arrowthick-1-sw { background-position: -80px -48px; }
  .ui-icon-arrowthick-1-w { background-position: -96px -48px; }
  .ui-icon-arrowthick-1-nw { background-position: -112px -48px; }
  .ui-icon-arrowthick-2-n-s { background-position: -128px -48px; }
  .ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; }
  .ui-icon-arrowthick-2-e-w { background-position: -160px -48px; }
  .ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; }
  .ui-icon-arrowthickstop-1-n { background-position: -192px -48px; }
  .ui-icon-arrowthickstop-1-e { background-position: -208px -48px; }
  .ui-icon-arrowthickstop-1-s { background-position: -224px -48px; }
  .ui-icon-arrowthickstop-1-w { background-position: -240px -48px; }
  .ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; }
  .ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; }
  .ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; }
  .ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; }
  .ui-icon-arrowreturn-1-w { background-position: -64px -64px; }
  .ui-icon-arrowreturn-1-n { background-position: -80px -64px; }
  .ui-icon-arrowreturn-1-e { background-position: -96px -64px; }
  .ui-icon-arrowreturn-1-s { background-position: -112px -64px; }
  .ui-icon-arrowrefresh-1-w { background-position: -128px -64px; }
  .ui-icon-arrowrefresh-1-n { background-position: -144px -64px; }
  .ui-icon-arrowrefresh-1-e { background-position: -160px -64px; }
  .ui-icon-arrowrefresh-1-s { background-position: -176px -64px; }
  .ui-icon-arrow-4 { background-position: 0 -80px; }
  .ui-icon-arrow-4-diag { background-position: -16px -80px; }
  .ui-icon-extlink { background-position: -32px -80px; }
  .ui-icon-newwin { background-position: -48px -80px; }
  .ui-icon-refresh { background-position: -64px -80px; }
  .ui-icon-shuffle { background-position: -80px -80px; }
  .ui-icon-transfer-e-w { background-position: -96px -80px; }
  .ui-icon-transferthick-e-w { background-position: -112px -80px; }
  .ui-icon-folder-collapsed { background-position: 0 -96px; }
  .ui-icon-folder-open { background-position: -16px -96px; }
  .ui-icon-document { background-position: -32px -96px; }
  .ui-icon-document-b { background-position: -48px -96px; }
  .ui-icon-note { background-position: -64px -96px; }
  .ui-icon-mail-closed { background-position: -80px -96px; }
  .ui-icon-mail-open { background-position: -96px -96px; }
  .ui-icon-suitcase { background-position: -112px -96px; }
  .ui-icon-comment { background-position: -128px -96px; }
  .ui-icon-person { background-position: -144px -96px; }
  .ui-icon-print { background-position: -160px -96px; }
  .ui-icon-trash { background-position: -176px -96px; }
  .ui-icon-locked { background-position: -192px -96px; }
  .ui-icon-unlocked { background-position: -208px -96px; }
  .ui-icon-bookmark { background-position: -224px -96px; }
  .ui-icon-tag { background-position: -240px -96px; }
  .ui-icon-home { background-position: 0 -112px; }
  .ui-icon-flag { background-position: -16px -112px; }
  .ui-icon-calendar { background-position: -32px -112px; }
  .ui-icon-cart { background-position: -48px -112px; }
  .ui-icon-pencil { background-position: -64px -112px; }
  .ui-icon-clock { background-position: -80px -112px; }
  .ui-icon-disk { background-position: -96px -112px; }
  .ui-icon-calculator { background-position: -112px -112px; }
  .ui-icon-zoomin { background-position: -128px -112px; }
  .ui-icon-zoomout { background-position: -144px -112px; }
  .ui-icon-search { background-position: -160px -112px; }
  .ui-icon-wrench { background-position: -176px -112px; }
  .ui-icon-gear { background-position: -192px -112px; }
  .ui-icon-heart { background-position: -208px -112px; }
  .ui-icon-star { background-position: -224px -112px; }
  .ui-icon-link { background-position: -240px -112px; }
  .ui-icon-cancel { background-position: 0 -128px; }
  .ui-icon-plus { background-position: -16px -128px; }
  .ui-icon-plusthick { background-position: -32px -128px; }
  .ui-icon-minus { background-position: -48px -128px; }
  .ui-icon-minusthick { background-position: -64px -128px; }
  .ui-icon-close { background-position: -80px -128px; }
  .ui-icon-closethick { background-position: -96px -128px; }
  .ui-icon-key { background-position: -112px -128px; }
  .ui-icon-lightbulb { background-position: -128px -128px; }
  .ui-icon-scissors { background-position: -144px -128px; }
  .ui-icon-clipboard { background-position: -160px -128px; }
  .ui-icon-copy { background-position: -176px -128px; }
  .ui-icon-contact { background-position: -192px -128px; }
  .ui-icon-image { background-position: -208px -128px; }
  .ui-icon-video { background-position: -224px -128px; }
  .ui-icon-script { background-position: -240px -128px; }
  .ui-icon-alert { background-position: 0 -144px; }
  .ui-icon-info { background-position: -16px -144px; }
  .ui-icon-notice { background-position: -32px -144px; }
  .ui-icon-help { background-position: -48px -144px; }
  .ui-icon-check { background-position: -64px -144px; }
  .ui-icon-bullet { background-position: -80px -144px; }
  .ui-icon-radio-on { background-position: -96px -144px; }
  .ui-icon-radio-off { background-position: -112px -144px; }
  .ui-icon-pin-w { background-position: -128px -144px; }
  .ui-icon-pin-s { background-position: -144px -144px; }
  .ui-icon-play { background-position: 0 -160px; }
  .ui-icon-pause { background-position: -16px -160px; }
  .ui-icon-seek-next { background-position: -32px -160px; }
  .ui-icon-seek-prev { background-position: -48px -160px; }
  .ui-icon-seek-end { background-position: -64px -160px; }
  .ui-icon-seek-start { background-position: -80px -160px; }
  /* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */
  .ui-icon-seek-first { background-position: -80px -160px; }
  .ui-icon-stop { background-position: -96px -160px; }
  .ui-icon-eject { background-position: -112px -160px; }
  .ui-icon-volume-off { background-position: -128px -160px; }
  .ui-icon-volume-on { background-position: -144px -160px; }
  .ui-icon-power { background-position: 0 -176px; }
  .ui-icon-signal-diag { background-position: -16px -176px; }
  .ui-icon-signal { background-position: -32px -176px; }
  .ui-icon-battery-0 { background-position: -48px -176px; }
  .ui-icon-battery-1 { background-position: -64px -176px; }
  .ui-icon-battery-2 { background-position: -80px -176px; }
  .ui-icon-battery-3 { background-position: -96px -176px; }
  .ui-icon-circle-plus { background-position: 0 -192px; }
  .ui-icon-circle-minus { background-position: -16px -192px; }
  .ui-icon-circle-close { background-position: -32px -192px; }
  .ui-icon-circle-triangle-e { background-position: -48px -192px; }
  .ui-icon-circle-triangle-s { background-position: -64px -192px; }
  .ui-icon-circle-triangle-w { background-position: -80px -192px; }
  .ui-icon-circle-triangle-n { background-position: -96px -192px; }
  .ui-icon-circle-arrow-e { background-position: -112px -192px; }
  .ui-icon-circle-arrow-s { background-position: -128px -192px; }
  .ui-icon-circle-arrow-w { background-position: -144px -192px; }
  .ui-icon-circle-arrow-n { background-position: -160px -192px; }
  .ui-icon-circle-zoomin { background-position: -176px -192px; }
  .ui-icon-circle-zoomout { background-position: -192px -192px; }
  .ui-icon-circle-check { background-position: -208px -192px; }
  .ui-icon-circlesmall-plus { background-position: 0 -208px; }
  .ui-icon-circlesmall-minus { background-position: -16px -208px; }
  .ui-icon-circlesmall-close { background-position: -32px -208px; }
  .ui-icon-squaresmall-plus { background-position: -48px -208px; }
  .ui-icon-squaresmall-minus { background-position: -64px -208px; }
  .ui-icon-squaresmall-close { background-position: -80px -208px; }
  .ui-icon-grip-dotted-vertical { background-position: 0 -224px; }
  .ui-icon-grip-dotted-horizontal { background-position: -16px -224px; }
  .ui-icon-grip-solid-vertical { background-position: -32px -224px; }
  .ui-icon-grip-solid-horizontal { background-position: -48px -224px; }
  .ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; }
  .ui-icon-grip-diagonal-se { background-position: -80px -224px; }
  
  
  /* Misc visuals
  ----------------------------------*/
  
  /* Corner radius */
  .ui-corner-all,
  .ui-corner-top,
  .ui-corner-left,
  .ui-corner-tl {
      border-top-left-radius: 3px;
  }
  .ui-corner-all,
  .ui-corner-top,
  .ui-corner-right,
  .ui-corner-tr {
      border-top-right-radius: 3px;
  }
  .ui-corner-all,
  .ui-corner-bottom,
  .ui-corner-left,
  .ui-corner-bl {
      border-bottom-left-radius: 3px;
  }
  .ui-corner-all,
  .ui-corner-bottom,
  .ui-corner-right,
  .ui-corner-br {
      border-bottom-right-radius: 3px;
  }
  
  /* Overlays */
  .ui-widget-overlay {
      background: #aaaaaa;
      opacity: .3;
      filter: Alpha(Opacity=30); /* support: IE8 */
  }
  .ui-widget-shadow {
      -webkit-box-shadow: 0px 0px 5px #666666;
      box-shadow: 0px 0px 5px #666666;
  }
  .fn-clk{width: 340px;}
  section#contact {
      padding: 0px;
  }
  .clo{
      color: #ffff;
      }
.top3 {
      margin-top: 3%;
  }
  .cremb3{
      margin-top: 6%;
  }
  del {
    color: #595959;
}

@media (max-width: 360px){
.col-12.col-sm-12.col-md-4.col-lg-3.form-group {
    margin-top: -3%;
}
.abtpad {
    margin-left: -10px;
}

}
@media (max-width: 320px){
.sticky-foot {
    margin-left: -49px;
    width: 467px;
}
}
/*@media (max-width: 720px){
.col-12.col-sm-12.col-md-4.col-lg-3.form-group {
    margin-top: -3%;
}

#hero h1 {
    font-size: 19px !important;
    margin-top: 30%;
    line-height: 1.2;
    font-weight: 700;
}

.hero-container .btnDiv .btn {
    width: 330px !important;
    height: 40px !important;
    padding-top: 2%;
}
.col-12.col-sm-12.col-md-12.col-lg-3.form-group.btnDiv.bt-fon {
    margin-left: -3% !important;
}
.fo-in {
    margin-left: -14%;
    width: 330px !important;
}
.bok-cl {
    padding-right: 7% !important;
}
.col-12.col-sm-12.col-md-12.col-lg-3.form-group.btnDiv.bt-fon {
    margin-top: -3%;
}
.col-12.col-sm-12.col-md-12.col-lg-3.form-group.btnDiv.bt-fon {
    margin-left: -11% !important;
}
.col-12.col-sm-12.col-md-8.col-lg-8 {
    margin-top: -5%;
    }
    .hero-container .form-group .form-control {
    height: 40px !important;
}
#hero {
    height: 90vh;
}
}

#hero h1 {
    font-size: 19px !important;
    margin-top: 25%;
    line-height: 1.2;
    font-weight: 700;
}
#header .logo img {
    max-height: 40px;
}
.hero-container .btnDiv .btn {
    width: 300px !important;
    height: 40px !important;
    padding-top: 2%;
}
.col-12.col-sm-12.col-md-12.col-lg-3.form-group.btnDiv.bt-fon {
    margin-left: -3% !important;
}
.fo-in {
    margin-left: -14%;
    width: 300px !important;
}
.bok-cl {
    padding-right: 7% !important;
}
.col-12.col-sm-12.col-md-12.col-lg-3.form-group.btnDiv.bt-fon {
    margin-top: -3%;
}
.col-12.col-sm-12.col-md-12.col-lg-3.form-group.btnDiv.bt-fon {
    margin-left: -11% !important;
}
.col-12.col-sm-12.col-md-8.col-lg-8 {
    margin-top: -5%;
    }
    .hero-container .form-group .form-control {
    height: 40px !important;
}
#hero {
    height: 115vh;
}
}*/
.from-books{
    width: 40%;
    display: initial;
}
.btnDiv {
display: block;
margin: 0 auto;
}
@media only screen and (max-width: 568px){
.from-books {
    width: 100% !important;
}
.rit-nav1{display: none;}
a.rit-nav2{display: none;}
i.icofont-whatsapp {
    display: block !important;
}
i.icofont-phone {
    display: block !important;
}
a.btn.transparent-btn.mr-4 {
    display: inline-flex;
    width: 35px;
    height: 35px;
    color: #fff;
    border: 2px solid #00b7cd;
    background: #00b7cd;
    border-radius: 50px;
    justify-content: center;
    align-items: center;
}
.rit-nav3{display: none;}

}

.rit-nav1{color:#00b7cd;font-size: 18px;font-weight: bolder;}
.rit-nav3{color:#fff;}
a.rit-nav2{color:#fff;font-size: 20px;
    font-weight: bolder;
    /*font-family: cursive;*/}
.rit-nav2{color:#fff;font-size: 18px;font-weight: bolder;}
.rit-nav2:hover {
    color: #f9fafb;
}
.phone i.icofont-phone {
    /*display: none;*/
}
.rightMenu i.icofont-whatsapp {
    display: none;
}
.rightMenu i.icofont-phone {
    display: none;
}
.shop {
     font-size: 20px;
    border-radius: 5px;
    background: #525d5d;
    padding: 8px;}
.shop1 {color:#fff;
font-family: 'Gotham Rounded Book';    
    padding: 4px;}
.contactme{width: 100%;}
.modal-open .modal.popupMsg.show{justify-content:center;align-items:center;display:flex!important;}
.modal-open .modal-backdrop{background:#00b7cd;}
.popupMsg .modal-body{text-align:center;}
.popupMsg .modal-body span{display:inline-flex;width:40px;height:40px;justify-content:center;align-items:center;background:#00b7cd;color:#fff;font-size:20px;}
.popupMsg .modal-body h1{text-align:center;font-size:40px;color:#000;font-weight:bold;margin-bottom:15px;}
.popupMsg .modal-body p{font-size:20px;color:#000;text-align:center;font-weight:700;margin-bottom:15px;}
.popupMsg .modal-content{text-align:center;}
.popupMsg .modal-content .btn{display:inline-block;padding:0 20px;min-height:40px;background:#00b7cd;border-radius:0;border:0;line-height:40px;text-align:center;color:#fff;font-size:18px;margin:10px auto 15px;}