/*
Theme name: Online Office
Author: Online office
*/

/*
    color definitions
    Text colour: #222222
    Blue borders: #1993a8
    Theme dark blue: #34445e
    Theme green: #4ca275
    Contact cards bg: #eeeeee

*/

p {
    margin: 0;
    padding: 0;
}
html {
    background: #ffffff;
    background-image: linear-gradient(270deg, rgb(230, 233, 233) 0%, rgb(216, 221, 221) 100%);
    -webkit-font-smoothing: antialiased;
    
}
  
  .html{
      margin-top: 0px !important;	
  }
  
  
  body {
      background: #ffffff;
      box-shadow: 0 0 2px rgba(0, 0, 0, 0.06);
      color: #222222;
      font-family: 'Open Sans';
      font-style: normal;
      font-size: 13px;
      line-height: 1.5;
      margin: 0 auto;
      margin-top: 0px !important;
      
  }
  
  h1, h2, h3, h4, h5, h6 {
      color: #222222;
      font-weight: 600;
      line-height: 1.3;
  }
  
  a {
      color: #4ca275;
  }
  
  a:hover {
      color: #000000;
      text-decoration: none;
  }
  
  b, strong {
      font-weight: 600;
  }
  hr {
      background-color: #1993a8;
  }
  samp {
      display: none;
  }
  
  ul>li {
      list-style: none;
  }
  .bullet-list-green {
      padding: 0px;
  }
  .bullet-list-green li::before {
      content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
      color: #4ca275; /* Change the color */
      font-weight: bold; /* If you want it to be bold */
      display: inline-block; /* Needed to add space between the bullet and the text */
      width: 1em; /* Also needed for space (tweak if needed) */
      margin-left: 0px; /* Also needed for space (tweak if needed) */
  }

  .oo-bg-green {
      background-color: #4ca275;
  }
  .oo-bg-blue {
      background-color: #34445e;
  }
  .oo-fg-green  {
      color: #4ca275;
  }
  .oo-fg-blue {
    color: #34445e;
  }
  .oo-fg-red {
    color: #fd3f01;
  }
  .oo-fg-white {
      color: #ffffff;
  }
  .oo-border-bottom-light-blue {
      border-bottom: 1px #1993a8 solid;
  }
  .oo-text-l {
      font-size: 16px;
  }
  /* nothing meaningfull to put here for now
  .oo-heading {
  }
  */
  h1.oo-heading {
      font-size: 18px;
  }
  h2.oo-heading {
      font-size: 18px;
  }
  h3.oo-heading {
      font-size: 16px;
  }
  h4.oo-heading {
      font-size: 14px;
  }
  h5.oo-heading {
      font-size: 13px;
      font-weight: 400;
  }
  h6.oo-heading {
      font-size: 13px;
      font-weight: 400;
  }
  
  .btn-primary:focus {
      box-shadow: none;
  }
  
  .btn-primary:not(:disabled):not(.disabled):active:focus {
      box-shadow: none;
  }
  /*======
      Services page
      ======
  */
  .services-step-icon-lg {
      width: 64px;
      height: 64px;
  }
  .services-step-icon-sm {
      width: 40px;
      height: 40px;
  }
  .service-step-label-sm {
      font-size: 8px;
  }
  .service-step-label-lg {
      font-size: 13px;
  }
  /*======
      Payments page
      ======
  */
  #payments-main-image {
      /* that would force up to 2.5:1 ratio as the image is 760px wide at lg and above */
      max-height: 285px; 
      object-fit: cover;
  }
  /*======
      Nav-bar
      ======*/
  
  header {
      
      color: #000000;
      background-color: #ffffff;
  }
  
  header h6 {
      font-size: 14px;
      letter-spacing: 4px;
  }
  
  .btn-success:not(:disabled):not(.disabled):active:focus, .btn-success.focus, .btn-success:focus {
      box-shadow: none;
  }
  
  nav {
      background-color: #ffffff !important;
      -webkit-box-shadow: 0 4px 4px -2px rgba(0, 0, 0, 0.1607843137254902);
      -moz-box-shadow: 0 4px 4px -2px rgba(0, 0, 0, 0.1607843137254902);
      box-shadow: 0 4px 4px -2px rgba(0, 0, 0, 0.1607843137254902);
  }
  
  header .fa {
      font-size: 20px;
      margin-left: 15px;
  }
  
  .nav-item:hover {
      background-color:  #EBFFDF !important;
  }
  
  .nav-item:hover a{
      color: #34445E !important;
  }
  
  .nav-item a{
      color: #ffffff !important;
      padding: 15px 3px 15px 5px;
      font-weight: bold;
  }
  
  
  
  .navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .active>.nav-link {
      font-weight: 600;
      color: #000000;
  }
  
  .navbar-dark .navbar-nav .nav-link {
      
      font-size: 10px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 1px;
      padding: 15px 25px;
      background-color: #4ca275;
      color: #ffffff !important;
  }
  
  .navbar-nav {
      justify-content: center;
      width: 100%;
  }
  
  .navbar {
      padding: 0;
  }
  
  .navbar-nav .nav-item {
      border-right: 1px solid #cccccc;
  }
  
  .navbar-nav .nav-item:last-child {
      border-right: 0;
  }
  
  .fa-facebook-official {
      color: #4867aa;
  }
  
  .fa-twitter {
      color: #1da1f2;
  }
  
  .fa-pinterest {
      color: #bd081b;
  }
  
  .fa-youtube {
      color: #ff0000;
  }
  
  .sticky-top {
      transition: all 0.25s ease-in;
  }
  
  /* style for when sitcky is applied */
  
  .stuck .sticky-top {
      background-color: #ffffff !important;
  }
  
  .jumbotron {
      width: 90%;
      height: 275px;
      margin-right: auto;
      margin-left: auto;
      position: relative;
      background-image: url(FINAL/main_new.jpeg);
      background-repeat: no-repeat;
      background-position: center;
        background-size: contain;
      margin-bottom: 0;
      /*background-color: #f7ffed;*/
       background-color: #ffffff;
  }
  
  .jumbotron h1, .jumbotron h2, .jumbotron h4 {
      color: #ffffff;
      text-transform: uppercase;
  }
  
  .jumbotron h4 {
      font-size: 16px;
      background: #000000;
      display: inline;
      letter-spacing: 5px;
      padding: 15px 40px;
  }
  
  .jumbotron a {
      margin-top: 60px;
  }
  
  .jumbotron .btn-success, .jumbotron .btn-success:not(:disabled):not(.disabled):active {
      color: #000000;
      font-size: 18px;
      font-weight: 600;
      border-radius: 100px;
      padding: 8px 35px;
      background-color: #b4dc2d;
      border-color: #b4dc2d;
      border: 2px solid #b4dc2d;
  }
  
  .jumbotron .btn-success:hover {
      color: #ffffff;
      background-color: transparent;
      border: 2px solid #b4dc2d;
  }
  
  .jumbotron h2 {
      font-size: 22px;
      margin-top: 0;
      font-weight: 500;
      padding-bottom: 30px;
  }
  
  .jumbotron h1 {
      font-size: 51px;
      font-weight: 700;
      text-transform: uppercase;
  }
  
  .content {
      position: relative;
      text-align: center;
  }
  
  .gradient {
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
  }
  
  .thumbnail {
      background-color: #f5f5f5;
      height: 320px;
      border: none;
      border-radius: 0px;
      text-align: center;
  }
  
  /*=============================
       section-2 Styles
  =============================*/
  
  .section-2 {
      width: 100%;
      height: auto;
  }
  
  .section-2 {
      padding-top: 15px;
      
  }
  
  .section-2 .fa {
      color: #c2c2c2;
      font-size: 30px;
      text-align: center;
  }
  
  .section-2 h3 {
      font-size: 34px;
      text-transform: uppercase;
      margin-top: -10px;
      font-weight: 600;
  }
  
  
  .section-2 .box-1, .section-2 .box-2, .section-2 .box-3 {
      padding-left: 20px;
      padding-right: 20px;
  }
  
  .section-2 p a {
      position: absolute;
      bottom: -46px;
      right: -38px;
  }
  
  .section-2 .box {
      /*
      box-shadow: 0 0 25px rgba(0, 0, 0, .15) !important;
      */
      padding: 20px 20px;
      background-color:#eeeeee;
      height: 180px;
  }
  
  .section-2 .box img{
      width: 75px !important;
      height: 75px !important;
  }
  
  /*=============================
       section-3 Styles
  =============================*/
  
  /*=============================
       section-4 Styles
  =============================*/
  
  .section-4 {
      width: 100%;
      height: auto;
      padding-top: 20px;
      border-bottom: 1px solid #e5e5e5;
  }
  
  
/* FIXME for removal  
  .section-4 .box-1 h2 {
      color: #000000;
      font-size: 28px;
      font-weight: 400;
      padding-bottom: 10px;
  }
*/
  .section-4 h3 span {
      display: block;
  }
  
  .section-4 .heading .btn-success {
      color: #ffffff;
      padding: 12px 35px;
      letter-spacing: 1px;
      border-radius: 0;
      background-color: #b4dc2d;
      border-color: #b4dc2d;
      text-transform: uppercase;
  }
  
  .section-4 .btn-success {
      color: #ffffff;
      font-size: 18px;
      padding: 5px 20px;
      background-color: #b4dc2d;
      border-color: #b4dc2d;
      border-radius: 100px;
  }
  
  .section-4 .btn-success:hover, .btn-success:not(:disabled):not(.disabled):active {
      background-color: #000000;
      border-color: #000000;
  }
  
  .section-4 .heading .btn-success:hover {
      color: #ffffff;
      background-color: #000000;
      border: 1px solid #000000;
  }
  
  .section-4 figure figcaption p {
      font-size: 16px;
      color: #000000;
      font-weight: 300;
      line-height: 27px;
  }
  
  .section-4 .box-1 img {
      width: 100%;
      height: 522px;
      object-fit: contain;
      max-width: 730px;
      margin-bottom: 10px;
  }
  
  .section-4 .box-2 figure, .section-4 .box-4 figure, .section-4 .box-6 figure {
      margin: 0 0 55px;
  }

  .section-4 h5 {
      font-size: 16px;
      font-weight: 300;
      padding-bottom: 30px;
      padding-right: 40px;
      line-height: 25px;
  }
  
  /*=============================
       Section-5 Styles
  =============================*/
  
  .section-5 {
      width: 100%;
      height: auto;
      padding-top: 75px;
  }
  
  .section-5 h3 {
      color: #737373;
      font-size: 38px;
      line-height: 60px;
      padding-bottom: 40px;
      margin-top: -13px;
  }
  
  .section-5 h5 {
      font-size: 16px;
      font-weight: 400;
  }
  
  .section-5 h3 span {
      display: block;
  }
  
  .section-5 .btn-success {
      color: #ffffff;
      padding: 12px 35px;
      letter-spacing: 1px;
      border-radius: 0;
      background-color: #b4dc2d;
      border-color: #b4dc2d;
      text-transform: uppercase;
  }
  
  .section-5 .btn-success:hover {
      color: #ffffff;
      background-color: #000000;
      border: 1px solid #000000;
  }
  
  .section-5 hr {
      padding-bottom: 60px;
  }
  
  .section-5 .more-button {
      text-align: center;
      padding-top: 75px;
  }
  
  .section-5 .btn-primary {
      color: #dddddd;
      background-color: transparent;
      border-color: #b2b2b2;
      border: 2px solid #b2b2b2;
      font-weight: 700;
      font-size: 14px;
      border-radius: 100px;
      padding: 14px 30px;
      text-transform: uppercase;
      margin: 10px;
  }
  
  .section-5 .btn-primary:hover {
      color: #ffffff;
      background: #000000;
      border: 2px solid #000000;
  }
  
  .section-5 .btn-primary:not(:disabled):not(.disabled):active {
      color: #ffffff;
      background-color: #000000;
      border-color: #000000;
  }
  
  .section-5 .box {
      position: relative;
      padding: 0;
  }
  
  .section-5 .img-fluid {
      display: block;
      width: 100%;
      object-fit: cover;
      height: 400px;
  }
  
  .section-5 .box:hover .overlay {
      opacity: 1;
  }
  
  .section-5 .text span {
      display: block;
  }
  
  .section-5 .overlay {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      height: 100%;
      width: 100%;
      opacity: 0;
      transition: .5s ease;
      background: -moz-linear-gradient(-45deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.7) 100%);
      background: -webkit-linear-gradient(-45deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.7) 100%);
      background: linear-gradient(135deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.7) 100%);
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3000000', endColorstr='#b3000000', GradientType=1);
      display: flex;
      align-items: center;
      justify-content: center;
  }
  
  .section-5 .overlay img {
      width: 20%;
      right: 0;
      bottom: 0;
      background: #000000;
      position: absolute;
  }
  
  .section-5 .text {
      color: #ffffff;
      font-size: 16px;
      font-weight: 400;
      letter-spacing: 0.5px;
      position: absolute;
      bottom: 8%;
      left: 10%;
  }
  
  .section-5 h4 {
      font-size: 18px;
      color: #ffffff;
      font-weight: 500;
      line-height: 28px;
      text-align: center;
      text-transform: uppercase;
  }
  
  .section-5 h4 span {
      display: block;
  }
  
  .section-5 .other1 .overlay img {
      width: 15%;
  }
  
  .section-5 .modal {
      z-index: 99999;
  }
  
  .section-5 .modal-backdrop.show {
      opacity: .8;
  }
  
  .section-5 .modal-backdrop {
      z-index: 9999;
  }
  
  /*==============================
        Section-6 Styles
  ==============================*/
  
  .section-6 {
      width: 100%;
      height: auto;
      color: #000000;
      padding: 100px 0;
  }
  
  .section-6 .main {
      border: 1px solid #c4c4c4;
      padding: 60px 0;
  }
  
  .section-6 form {
      float: left;
  }
  
  .section-6 .heading h3 {
      color: #4c4c4c;
      font-size: 38px;
      font-weight: 500;
      line-height: 67px;
      padding-right: 18px;
      text-align: right;
  }
  
  .section-6 .form-control {
      margin-bottom: 19px;
      font-size: 14px;
      border-radius: 0;
      font-style: italic;
      padding: 10px 10px;
  }
  
  .section-6 .input-group {
      padding: 7px 0;
  }
  
  .section-6 .btn-info {
      width: 170px;
      height: 56px;
      text-align: center;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      color: #ffffff;
      font-size: 19px;
      border-radius: 0;
      font-weight: 500;
      border: none;
      background: #000000;
  }
  
  .section-6 .btn-info:not(:disabled):not(.disabled):active, .section-3 .btn-info:hover {
      color: #000000;
      background-color: transparent;
      border: 1px solid #000000;
  }
  
  .section-6 .btn-info:hover {
      color: #ffffff;
      background-color: #b4dc2d;
      border: 1px solid #b4dc2d;
  }
  
  .section-6 input {
      font-size: 12px;
      width: 290px;
      height: 56px;
      padding: 0 18px;
      border: none;
      color: #000000;
      background: #ffffff;
      border: 1px solid #d2d2d2;
  }
  
  .btn-info:focus, .btn-info:not(:disabled):not(.disabled):active:focus {
      box-shadow: none;
  }
  
  .section-6 textarea {
      resize: none;
  }
  
  .section-6 ::-webkit-input-placeholder {
      /* Chrome/Opera/Safari */
      color: #cacaca;
      font-weight: 300;
      font-size: 13px;
      text-transform: uppercase;
      font-style: italic;
      font-family: 'Montserrat', sans-serif;
  }
  
  .section-6 ::-moz-placeholder {
      /* Firefox 19+ */
      color: #cacaca;
      font-weight: 300;
      font-size: 13px;
      text-transform: uppercase;
      font-style: italic;
      font-family: 'Montserrat', sans-serif;
  }
  
  .section-6 :-ms-input-placeholder {
      /* IE 10+ */
      color: #cacaca;
      font-weight: 300;
      font-size: 13px;
      text-transform: uppercase;
      font-style: italic;
      font-family: 'Montserrat', sans-serif;
  }
  
  .section-6 ::placeholder {
      color: #cacaca;
      font-weight: 300;
      font-size: 13px;
      text-transform: uppercase;
      font-style: italic;
      font-family: 'Montserrat', sans-serif;
  }
  
  /*==============================
        //footer Styles //
  ==============================*/
  
  .page-footer {
      border-top: 1px solid #cccccc;
  }
  
  .page-footer .box-1 {
      border-right: 1px solid #cccccc;
      padding-top: 75px;
      padding-bottom: 80px;
  }
  
  .page-footer .box-2, .page-footer .box-3, .page-footer .box-4 {
      padding-top: 15px;
  }
  
  .footer-copyright {
      position: relative;
      background-image: url("../images/footer-bg.jpg");
      background-repeat: no-repeat;
      background-position: top;
      background-size: cover;
  }
  
  .footer-copyright p {
      font-size: 16px;
      font-weight: 300;
      color: #ffffff;
      position: relative;
      text-transform: uppercase;
      padding: 40px 0;
      margin-bottom: 0;
  }
  
  .footer-copyright p a {
      color: #8dc63f;
  }

  .footer-img{
      margin-bottom: 10px;
      margin-right: 10px;
      width: 100px !important;
      height: 90px !important;
  }
  
  .page-footer h5 {
      font-size: 13px;
      font-weight: 600;
      text-transform: uppercase;
  }
  
  .page-footer ul>li a {
      text-transform: uppercase;
  }
  
  /*===============================
             About-Page
  ===============================*/
  
  #about-us {
      border-bottom: 1px solid gray;
      padding-top: 60px;
      padding-bottom: 60px;
      background-color: #ffffff;
  }
  
  #about-us h3 {
      color: #737373;
      font-size: 33px;
      padding-bottom: 30px;
      text-transform: capitalize;
      font-weight: 600;
  }
  
  #about-us p {
      margin: 0;
      color: #8d8d8d;
      font-size: 16px;
      line-height: 25px;
      letter-spacing: 0.5px;
      text-align: left;
      font-weight: 400;
      margin-bottom: 200px;
  }
  
  #about-us .image {
      float: left;
      width: 478px;
      height: 394px;
      shape-margin: 20px;
      margin-right: 50px;
      margin-bottom: 52px;
  }
  
  #about-us .thumbnail {
      padding: 0;
      border: none;
      border-radius: 0;
      object-fit: cover;
  }
  
  #about-us p {
      margin: 0;
      color: #969696;
      font-size: 15px;
      line-height: 25px;
      letter-spacing: 0.5px;
      text-align: left;
      font-weight: 400;
      margin-bottom: 200px;
  }
  
  #about-us .image {
      float: left;
      width: 547px;
      height: 458px;
      shape-margin: 20px;
      margin-right: 50px;
      margin-bottom: 40px;
  }
  
  #about-us .thumbnail {
      padding: 0;
      border: none;
      border-radius: 0;
      object-fit: cover;
  }
  
  /*=============================
          Contact-Page
  =============================*/
  
  #contact {
      padding-top: 0;
      padding-bottom: 200px;
      text-align: left;
      border-bottom: 1px solid #b2b2b2;
  }
  
  #contact h3 {
      color: #737373;
      font-size: 33px;
      padding-bottom: 15px;
      text-transform: capitalize;
      font-weight: 600;
  }
  
  .py-5 {
      width: 755px;
  }
  
  #contact input {
      height: 58px;
  }
  
  #contact p {
      font-size: 16px;
      text-align: left;
      line-height: 36px;
      color: rgba(0, 0, 1, 0.54);
  }
  
  #contact .text-left {
      padding-bottom: 10px;
  }
  
  #contact select {
      width: 100%;
      height: 52px;
      color: #d3d0d0;
      font-size: 12px;
      padding: 0 8px;
      cursor: pointer;
      margin-bottom: 10px;
  }
  
  #contact .btn-primary {
      color: #ffffff;
      font-size: 14px;
      padding: 15px 50px;
      font-weight: 600;
      background-color: #000000;
      border-color: #000000;
      border-radius: 0;
      text-transform: uppercase;
  }
  
  #contact .btn-primary:hover {
      background-color: #b4dc2d;
      border-color: #b4dc2d;
  }
  
  #contact .form-group {
      padding: 0;
      margin-bottom: 0;
  }
  
  #contact .form-control {
      border-radius: 0;
      margin-bottom: 25px;
      border: 1px solid #909090;
  }
  
  #contact input {
      height: 63px;
      border-radius: 0;
      margin-bottom: 16px;
      border: 1px solid #acacac;
  }
  
  textarea.form-control {
      height: auto;
      margin-bottom: 15px;
      padding: 20px 13px;
  }
  
  #contact ::-webkit-input-placeholder {
      /* Chrome/Opera/Safari */
      color: #c2c2c2;
      font-style: italic;
      font-size: 13px;
      font-weight: 200;
  }
  
  #contact ::-moz-placeholder {
      /* Firefox 19+ */
      color: #c2c2c2;
      font-style: italic;
      font-weight: 200;
      font-size: 13px;
  }
  
  #contact ::-ms-input-placeholder {
      /* IE 10+ */
      color: #c2c2c2;
      font-style: italic;
      font-weight: 200;
      font-size: 13px;
  }
  
  #contact ::-moz-placeholder {
      /* Firefox 18- */
      color: #c2c2c2;
      font-weight: 200;
      font-style: italic;
      font-size: 13px;
  }
  
  #contact form {
      text-align: center;
  }
  
  #contact .form-control:focus {
      background-color: transparent;
      border-color: #acacac;
      box-shadow: none;
  }
  
  /*=============================
       Portfolio Styles
  =============================*/
  
  .portfolio {
      width: 100%;
      height: auto;
      padding-top: 30px;
      padding-bottom: 100px;
  }
  
  .portfolio h3 {
      color: #737373;
      font-size: 33px;
      padding-bottom: 40px;
      text-transform: capitalize;
      font-weight: 600;
  }
  
  .portfolio .btn-success {
      color: #ffffff;
      padding: 12px 35px;
      letter-spacing: 1px;
      border-radius: 0;
      background-color: #b4dc2d;
      border-color: #b4dc2d;
      text-transform: uppercase;
  }
  
  .portfolio .btn-success:hover {
      color: #000000;
      background-color: transparent;
      border: 1px solid #000000;
  }
  
  .portfolio hr {
      padding-bottom: 60px;
  }
  
  .portfolio .more-button {
      text-align: center;
      padding-top: 75px;
  }
  
  .portfolio .btn-primary {
      color: #dddddd;
      background-color: transparent;
      border-color: #b2b2b2;
      border: 2px solid #b2b2b2;
      font-weight: 700;
      font-size: 14px;
      border-radius: 100px;
      padding: 14px 30px;
      text-transform: uppercase;
      margin: 10px;
  }
  
  .portfolio .btn-primary:hover {
      color: #ffffff;
      background: #000000;
      border: 2px solid #000000;
  }
  
  .portfolio .btn-primary:not(:disabled):not(.disabled):active {
      color: #ffffff;
      background-color: #000000;
      border-color: #000000;
  }
  
  .portfolio .box {
      position: relative;
      padding: 0;
  }
  
  .portfolio .img-fluid {
      display: block;
      width: 100%;
      object-fit: cover;
      height: 400px;
  }
  
  .portfolio .box:hover .overlay {
      opacity: 1;
  }
  
  .portfolio .text span {
      display: block;
  }
  
  .portfolio .overlay {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      height: 100%;
      width: 100%;
      opacity: 0;
      transition: .5s ease;
      background: -moz-linear-gradient(-45deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.7) 100%);
      background: -webkit-linear-gradient(-45deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.7) 100%);
      background: linear-gradient(135deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.7) 100%);
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3000000', endColorstr='#b3000000', GradientType=1);
      display: flex;
      align-items: center;
      justify-content: center;
  }
  
  .portfolio .overlay img {
      width: 20%;
      right: 0;
      bottom: 0;
      background: #000000;
      position: absolute;
  }
  
  .portfolio .text {
      color: #ffffff;
      font-size: 16px;
      font-weight: 400;
      letter-spacing: 0.5px;
      position: absolute;
      bottom: 8%;
      left: 10%;
  }
  
  .portfolio h4 {
      font-size: 18px;
      color: #ffffff;
      font-weight: 500;
      line-height: 28px;
      text-align: center;
      text-transform: uppercase;
  }
  
  .portfolio h4 span {
      display: block;
  }
  
  .portfolio .other1 .overlay img {
      width: 15%;
  }
  
  .portfolio .modal {
      z-index: 99999;
  }
  
  .portfolio .modal-backdrop.show {
      opacity: .8;
  }
  
  .portfolio .modal-backdrop {
      z-index: 9999;
  }
  
  .portfolio button {
      background-color: transparent;
      color: #000000;
      font-family: Sans-serif;
      font-size: 14px;
      height: 50px;
      text-transform: uppercase;
      width: 150px;
      font-weight: 500;
      line-height: 35px;
      text-align: center;
      border: 0;
      border-radius: 0;
      transition: all 0.3s ease 0s;
      border: 1px solid #c5c5c5;
  }
  
  .portfolio button:hover {
      background-color: #000000;
  }
  
  .portfolio .btn-secondary:focus, .btn-secondary:not(:disabled):not(.disabled):active:focus {
      box-shadow: none;
  }
  
  .btn-secondary:not(:disabled):not(.disabled):active {
      background-color: #000000;
      border-color: #000000;
  }
  
  .portfolio .load-more {
      text-align: center;
      padding-top: 50px;
  }
  
  /*=============================
       Blog Styles
  =============================*/
  
  .blog {
      width: 100%;
      height: auto;
      padding-top: 30px;
      padding-bottom: 100px;
      border-bottom: 1px solid #e5e5e5;
  }
  
  .blog h3 {
      color: #737373;
      font-size: 33px;
      padding-bottom: 40px;
      text-transform: capitalize;
      font-weight: 600;
  }
  
  .blog hr {
      padding-bottom: 40px;
  }
  
  .blog .box-1 h2 {
      color: #000000;
      font-size: 28px;
      font-weight: 400;
      padding-bottom: 10px;
  }
  
  .blog figure figcaption p {
      font-size: 16px;
      color: #000000;
      font-weight: 300;
      line-height: 27px;
  }
  
  .blog .box-1 img {
      width: 100%;
      height: 580px;
      object-fit: cover;
      margin-bottom: 20px;
  }
  
  .blog .box-2 img, .blog .box-6 img, .blog .box-4 img {
      width: 100%;
      height: 258px;
      object-fit: cover;
      padding-left: 30px;
  }
  
  .blog .box-2 figure, .blog .box-4 figure, .blog .box-6 figure {
      margin: 0 0 55px;
  }
  
  .blog h4 {
      font-size: 24px;
      font-weight: 400;
      padding-bottom: 10px;
  }
  
  .blog h5 {
      font-size: 16px;
      font-weight: 300;
      padding-bottom: 30px;
      padding-right: 40px;
      line-height: 25px;
  }
  
  .blog .bt {
      padding-top: 50px;
  }
  
  .blog .bt ul {
      list-style-type: none;
      margin: 0;
      padding: 0;
      text-align: center;
  }
  
  .blog .bt ul li {
      background: transparent;
      border: 1px solid #d4d4d4;
      display: inline-flex;
      text-align: center;
      border-radius: 100px;
      margin-right: 5px;
  }
  
  .blog .bt .active {
      background-color: #b4dc2d;
      border: 1px solid #b4dc2d;
      color: #ffffff;
      border-radius: 100px;
  }
  
  .blog .btn-success {
      color: #ffffff;
      font-size: 18px;
      padding: 5px 20px;
      background-color: #b4dc2d;
      border-color: #b4dc2d;
      border-radius: 100px;
  }
  
  .blog .btn-success:hover {
      color: #ffffff;
      background-color: #000000;
      border-color: #000000;
  }
  
  .blog .bt a:hover {
      background-color: #b4dc2d;
      border: 1px solid #b4dc2d;
      color: #ffffff;
      border-radius: 100px;
  }
  
  .blog .bt ul li a {
      width: 37px;
      height: 37px;
      color: #ffffff;
      margin: 0 auto;
      font-size: 16px;
      background-color: #363636;
      border-radius: 100px;
      padding: 7px 0;
      font-weight: 600;
      text-decoration: none;
  }
  
  /*==============================
          Blog_single-page
  ==============================*/
  
  /* ==== blog-single ==== */
  
  #blog-single {
      width: 100%;
      height: auto;
      padding-bottom: 100px;
      border-bottom: 1px solid #b2b2b2;
  }
  
  #blog-single .heading-1 h3 {
      color: #737373;
      font-size: 33px;
      padding-bottom: 40px;
      text-transform: capitalize;
      font-weight: 600;
  }
  
  #blog-single .heading {
      text-align: center;
  }
  
  #blog-single .heading h2 {
      color: #000000;
      font-size: 40px;
      line-height: 49px;
      font-weight: 400;
      padding-bottom: 30px;
  }
  
  #blog-single .section4 .card-deck {
      margin-left: -30px;
      margin-right: -30px;
  }
  
  #blog-single .section4 h2 {
      font-size: 50px;
      margin-top: 30px;
      margin-bottom: 80px;
      font-weight: 200;
      color: #2e2c39;
      text-align: center;
      text-transform: uppercase;
  }
  
  #blog-single .section4 h2.background {
      position: relative;
      z-index: 1;
  }
  
  #blog-single .section4 h2.background:before {
      border-top: 1px solid #666666;
      content: "";
      margin: 0 auto;
      /* this centers the line to the full width specified */
      position: absolute;
      /* positioning must be absolute here, and relative positioning must be applied to the parent */
      top: 50%;
      left: 0;
      right: 0;
      bottom: 0;
      width: 100%;
      z-index: -1;
  }
  
  #blog-single .section4 h2.background span {
      /* to hide the lines from behind the text, you have to set the background color the same as the container */
      background: #ffffff;
      padding: 0 15px;
  }
  
  #blog-single .box p {
      margin: 0;
      color: #636363;
      font-size: 17px;
      line-height: 30px;
      text-align: justify;
      word-spacing: -1px;
      margin-top: -7px;
      padding-bottom: 40px;
      font-weight: 400;
      font-family: 'Montserrat', sans-serif;
  }
  
  #blog-single .box a {
      color: #ed1c24;
      border-bottom: 1px solid #ed1c24;
  }
  
  .social-buttons .inner-text span:first-child {
      color: #000000;
      font-weight: 600;
  }
  
  .social-buttons .inner-text span:last-child {
      color: #737373;
      font-weight: 500;
      border-bottom: 1px solid gray;
  }
  
  #blog-single h4 {
      font-size: 28px;
      font-style: italic;
      text-align: left;
      color: #222222;
      line-height: 47px;
      font-family: 'Montserrat', sans-serif;
  }
  
  #blog-single .inner-text a {
      color: #737373;
      font-weight: 400;
      font-family: 'Montserrat', sans-serif;
  }
  
  #blog-single .inner-text a:hover, #blog-single .inner-text a:focus {
      text-decoration: none;
      border-bottom: 1px solid #fc4733;
      color: #fc4733;
  }
  
  #blog-single .qutation {
      width: 59%;
      text-align: center;
      padding: 73px 0;
      margin: 0 auto;
  }
  
  .social-buttons {
      border: 1px solid #c2c2c2;
      margin-top: 0;
      margin-bottom: 40px;
  }
  
  .social-buttons h3 {
      color: #737373;
      font-size: 17px;
      font-weight: 200;
      text-align: left;
      margin-left: 20px;
      padding: 47px 20px;
      font-family: 'Montserrat', sans-serif;
  }
  
  #blog_single .heading {
      font-size: 45px;
      padding-top: 60px;
  }
  
  #blog_single .heading h2 {
      font-size: 33px;
  }
  
  /*-- social buttons --*/
  
  .mbm_social {
      padding: 0;
      font-size: 0;
      float: right;
      background: #ffffff;
      margin: 43px 25px;
      text-align: center;
  }
  
  .mbm_social li {
      display: inline-block;
      margin: 0 16px 0 0;
  }
  
  .mbm_social a {
      position: relative;
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      color: #ffffff;
      -webkit-box-align: center;
      -webkit-align-items: center;
      -ms-flex-align: center;
      align-items: center;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
      -ms-flex-pack: center;
      justify-content: center;
      margin: 0 px;
      width: 116px;
      height: 31px;
      text-decoration: none;
      text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
      -webkit-transition: all .15s ease;
      transition: all .15s ease;
      z-index: 2;
      font-family: "Montserrat", sans-serif;
      text-transform: uppercase;
      -webkit-backface-visibility: hidden;
      backface-visibility: hidden;
      border-radius: 5px;
  }
  
  .mbm_social a:hover {
      color: #ffffff;
  }
  
  .mbm_social a:hover .tooltip {
      display: block;
      visibility: visible;
      opacity: 1;
      -webkit-transform: translate(0, -33px);
      transform: translate(0, -33px);
  }
  
  .mbm_social a:active {
      box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5) inset;
  }
  
  .mbm_social .tooltip {
      opacity: 0;
      position: absolute;
      top: 2px;
      left: 50%;
      z-index: 1;
      -webkit-transition: all .15s ease;
      transition: all .15s ease;
      -webkit-backface-visibility: hidden;
      backface-visibility: hidden;
  }
  
  .mbm_social .tooltip span {
      font-size: 10px;
      font-weight: bold;
      left: -50%;
      line-height: 1;
      padding: 6px 8px 5px;
      position: relative;
      text-transform: uppercase;
      z-index: 1;
  }
  
  .mbm_social .tooltip span:after {
      position: absolute;
      content: " ";
      width: 0;
      height: 0;
      top: 100%;
      left: 50%;
      margin-left: -8px;
      border: 8px solid transparent;
  }
  
  .mbm_social .social-twitter {
      background: #00abdc;
      border-radius: 5px;
      background: -webkit-linear-gradient(#00abdc, #00abdc);
      background: linear-gradient(#00abdc, #00abdc);
      border-bottom: 1px solid #00abdc;
  }
  
  .mbm_social .social-twitter:hover {
      color: #ffffff;
      text-shadow: 0px 1px 0px #00abdc;
  }
  
  .mbm_social .social-twitter span {
      background: #00abdc;
      background: -webkit-linear-gradient(#00abdc, #00abdc);
      background: linear-gradient(#00abdc, #00abdc);
      color: #ffffff;
  }
  
  .mbm_social .social-twitter span:after {
      border-top-color: #00abdc;
  }
  
  .mbm_social .social-facebook {
      background: #325c94;
      border-radius: 5px;
      background: -webkit-linear-gradient(#4562a0, #385693);
      background: linear-gradient(#4562a0, #385693);
      border-bottom: 1px solid #2f487c;
  }
  
  .mbm_social .social-facebook:hover {
      color: #ffffff;
      text-shadow: 0px 1px 0px #2f487c;
  }
  
  .mbm_social .social-facebook span {
      background: #3b5a9b;
      background: -webkit-linear-gradient(#5873aa, #3b5a9b);
      background: linear-gradient(#5873aa, #3b5a9b);
      color: #ffffff;
  }
  
  .mbm_social .social-facebook span:after {
      border-top-color: #325c94;
  }
  
  .mbm_social .social-google-plus {
      background: #cb2027;
      background: -webkit-linear-gradient(#cb2027, #cb2027);
      background: linear-gradient(#cb2027, #cb2027);
      border-bottom: 1px solid #cb2027;
  }
  
  .mbm_social .social-google-plus:hover {
      color: #ffffff;
      text-shadow: 0px 1px 0px #ea4335;
  }
  
  .mbm_social .social-google-plus span {
      background: #cb2027;
      background: -webkit-linear-gradient(#cb2027, #cb2027);
      background: linear-gradient(#cb2027, #cb2027);
      color: #ffffff;
  }
  
  .mbm_social .social-google-plus span:after {
      border-top-color: #cb2027;
  }
  
  .mbm_social i {
      position: relative;
      top: 1px;
      font-size: 14px;
  }
  
  .mbm_social small {
      font-size: 14px;
      margin: 0 0 0 16px;
  }
  
  /*== contact form ==*/
  
  #blog-single .img-thumbnail {
      border-radius: 0;
      padding: 0;
      border: none;
  }
  
  #blog-single .image {
      width: 100%;
      height: 365px;
      object-fit: cover;
      shape-margin: 20px;
      margin: 40px 0;
  }
  
  .mbm_social {
      background-color: transparent;
  }
  
  /*---- Section4-Styles ----*/
  
  .section4 {
      width: 100%;
      height: auto;
      padding-bottom: 100px;
  }
  
  .section4 .card {
      text-align: center;
      border: none;
  }
  
  .section4 .card .card-text {
      color: #363636;
      font-size: 23px;
      font-weight: 500;
  }
  
  .section4 .card .text-muted {
      color: #b8b8b8;
      font-size: 13px;
      font-weight: 400;
  }
  
  .section4 .btn {
      padding: 8px 20px;
      border-radius: 0;
      border: none;
      background: -moz-linear-gradient(-45deg, rgba(157, 196, 51, 0.8) 0%, rgba(51, 209, 210, 0.8) 100%);
      background: -webkit-linear-gradient(-45deg, rgba(157, 196, 51, 0.8) 0%, rgba(51, 209, 210, 0.8) 100%);
      background: linear-gradient(135deg, rgba(157, 196, 51, 0.8) 0%, rgba(51, 209, 210, 0.8) 100%);
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc9dc433', endColorstr='#cc33d1d2', GradientType=1);
  }
  
  .section4 .card-deck .card {
      margin-left: 40px;
      margin-right: 40px;
  }
  
  .section4 .card {
      border-top-left-radius: 0;
      border-top-right-radius: 0;
      -moz-transition: all 0.5s;
      -webkit-transition: all 0.5s;
      transition: all 0.5s;
  }
  
  .section4 .card .card-body a {
      color: #363636;
  }
  
  .section4 .card-deck {
      margin-left: -25px;
      margin-right: -25px;
  }
  
  .section4 .card:hover {
      -moz-box-shadow: 0 0 15px 1px #afafaf;
      -webkit-box-shadow: 0 0 15px 1px #afafaf;
      box-shadow: 0 0 15px 1px #afafaf;
  }
  
  /*=============================
       Services Styles
  =============================*/
  
  .services {
      width: 100%;
      height: auto;
      padding-top: 15px;
      padding-bottom: 100px;
  }
  
  .services h2 {
      color: #737373;
      font-size: 33px;
      padding-bottom: 50px;
      text-transform: capitalize;
      font-weight: 600;
  }
  
  .services .fa {
      color: #c2c2c2;
      font-size: 30px;
      float: right;
  }
  
  .services h3 {
      font-size: 34px;
      text-transform: uppercase;
      margin-top: -10px;
      font-weight: 600;
      padding-bottom: 10px;
  }
  
  .services p {
      color: #848484;
      line-height: 30px;
      font-size: 16px;
      font-weight: 400;
  }
  
  .services .box-1, .services .box-2, .services .box-3 {
      padding-left: 30px;
      padding-right: 30px;
  }
  
  .services p a {
      position: absolute;
      bottom: -46px;
      right: -38px;
  }
  
  .services .box {
      box-shadow: 0 0 25px rgba(0, 0, 0, .15) !important;
      padding: 60px 20px;
      margin-bottom: 50px;
  }
  
  .header-first-row {
      background-color: #EBFFDF;
      max-width: 100%;
  }
  
  @media(max-width:1300px) {
      .jumbotron {
          background-size: cover !important;
          width: 90%;
      }
  }
  @media(max-width:1024px) {
      .contact-cards {
          max-width: 33% !important;
      }
      .navbar-dark .navbar-nav .nav-link, .navbar-dark .navbar-nav .active>.nav-link {
          padding: 10px 10px;
      }
      .services-thumb.figure-img{
          width: 380px !important; 
      }
      
      .jumbotron {
          background-size: cover !important;
          width: 90%;
      }
      header .fa {
          font-size: 18px;
          margin-left: 10px;
      }
      .jumbotron {
          height: 320px;
      }
      .jumbotron h4 {
          font-size: 14px;
          letter-spacing: 2px;
          padding: 12px 30px;
      }
      .jumbotron h1 {
          font-size: 44px;
      }
      .jumbotron a {
          margin-top: 50px;
      }
      .jumbotron h2 {
          font-size: 18px;
          padding-bottom: 25px;
      }
      .jumbotron .btn-success, .btn-success:not(:disabled):not(.disabled):active {
          font-size: 14px;
      }
      .section-2 h3 {
          font-size: 28px;
          margin-top: -9px;
      }
      .section-2 .fa {
          font-size: 25px;
      }
      .section-2 p {
          font-size: 14px;
      }
      .section-2 .box {
          padding: 10px 5px;
          height: 130px;
      }
      .section-2 p a {
          bottom: -37px;
          right: -28px;
      }
      .section-3 h2 {
          font-size: 32px;
          line-height: 40px;
          margin-top: 0;
          padding-bottom: 0;
      }
      .section-3 ul>li {
          font-size: 18px;
      }
      .section-3 ul .fa {
          font-size: 20px;
      }
      .section-3 figure .out-sideimg {
          height: 550px;
      }
      .section-3 figure .inner-img {
          width: 350px;
          height: 286px;
      }
      .section-4 h3 {
          font-size: 32px;
          line-height: 40px;
          padding-bottom: 40px;
          margin-top: 0;
      }
      .section-4 .heading .btn-success {
          font-size: 12px;
          padding: 10px 30px;
      }
      .section-4 .box-1 img {
          height: 470px;
      }
      #contact-img{
          width: 380px !important;
      }
      .section-4 .box-1 h2 {
          font-size: 22px;
          padding-bottom: 5px;
      }
      .section-4 figure figcaption p {
          font-size: 14px;
          line-height: 25px;
      }
      .section-4 .btn-success {
          font-size: 14px;
          padding: 5px 18px;
      }
      .section-4 .box-2 img, .section-4 .box-4 img, .section-4 .box-6 img {
          height: 243px;
          padding-left: 0;
      }
      .section-4 .box-2 figure, .section-4 .box-4 figure {
          margin: 0 0 20px;
      }
      /* FIXME FOR REMOVAL
      .section-4 {
          padding-top: 50px;
          padding-bottom: 50px;
      }
      */
      .section-2 {
          padding-top: 30px;
          padding-bottom: 60px;
      }
      .section-3 {
          padding-bottom: 50px;
      }
      .section-5 h3 {
          font-size: 32px;
          line-height: 40px;
          padding-bottom: 30px;
          margin-top: 0;
      }
      .section-5 .btn-success {
          font-size: 12px;
          padding: 10px 30px;
      }
      .section-5 {
          padding-top: 50px;
      }
      .section-5 .img-fluid {
          height: 250px;
      }
      .section-6 {
          padding: 50px 0;
      }
      .section-6 .heading h3 {
          font-size: 24px;
          line-height: 51px;
          padding-right: 0;
          text-align: center;
      }
      .section-6 .btn-info {
          font-size: 14px;
          height: 45px;
          width: 125px;
      }
      .section-6 input {
          height: 45px;
      }
      .section-6 .main {
          padding: 20px 0;
      }
      .page-footer .box-1 {
          padding-top: 50px;
          padding-bottom: 50px;
      }
      .page-footer .box-2, .page-footer .box-3, .page-footer .box-4 {
          padding-top: 50px;
      }
      .page-footer h5 {
          font-size: 13px;
      }
      .footer-copyright p {
          padding: 25px 0;
          font-size: 12px;
          letter-spacing: 0.5px;
      }
      #about-us {
          padding-top: 30px;
      }
      #about-us .image {
          width: 400px;
          height: 330px;
      }
      #about-us p {
          font-size: 12px;
          margin-bottom: 30px;
      }
      #about-us h3 {
          font-size: 28px;
          padding-bottom: 25px;
      }
      #contact h3 {
          font-size: 26px;
      }
      #contact p {
          font-size: 12px;
          letter-spacing: 0.5px;
          line-height: 25px;
          padding-bottom: 0;
      }
      #contact input {
          height: 55px;
      }
      #contact .btn-primary {
          font-size: 12px;
          letter-spacing: 0.5px;
      }
      #contact {
          padding-bottom: 100px;
      }
      .py-5 {
          width: 100%;
          padding-top: 1rem !important;
      }
      .portfolio h3 {
          font-size: 32px;
          line-height: 40px;
          padding-bottom: 30px;
          margin-top: 0;
      }
      .portfolio .btn-success {
          font-size: 12px;
          padding: 10px 30px;
      }
      .portfolio {
          padding-top: 50px;
      }
      .portfolio .img-fluid {
          height: 250px;
      }
      .blog h3 {
          font-size: 32px;
          line-height: 40px;
          padding-bottom: 40px;
          margin-top: 0;
      }
      .blog .heading .btn-success {
          font-size: 12px;
          padding: 10px 30px;
      }
      .blog .box-1 img {
          height: 515px;
      }
      .blog .box-1 h2 {
          font-size: 22px;
          padding-bottom: 5px;
      }
      .blog h4 {
          font-size: 22px;
          padding-bottom: 5px;
      }
      .blog figure figcaption p {
          font-size: 14px;
          line-height: 25px;
      }
      .blog h5 {
          font-size: 14px;
          padding-bottom: 10px;
      }
      .blog .btn-success {
          font-size: 14px;
          padding: 5px 18px;
      }
      .blog .box-2 img, .blog .box-4 img, .blog .box-6 img {
          height: 243px;
          padding-left: 0;
      }
      .blog .box-2 figure, .blog .box-4 figure {
          margin: 0 0 20px;
      }
      .blog {
          padding-top: 50px;
          padding-bottom: 50px;
      }
      #blog-single .heading h2 {
          font-size: 18px;
          padding-bottom: 0;
      }
      .mbm_social li {
          display: inline-block;
          margin: 0 5px 0 0;
      }
      .mbm_social a {
          width: 85px;
          height: 27px;
      }
      .mbm_social small {
          font-size: 12px;
          margin: 0 0 0 8px;
      }
      .mbm_social i {
          font-size: 12px;
      }
      .social-buttons h3 {
          font-size: 12px;
          font-weight: 400;
          padding: 45px 0;
          padding: 30px 25px;
      }
      #blog-single .heading-1 h3 {
          font-size: 22px;
          padding-bottom: 0;
      }
      #blog-single .box p {
          margin: 0;
          font-size: 14px;
          line-height: 25px;
          word-spacing: 0;
          margin-top: 0;
          padding-bottom: 25px;
      }
      #blog-single .section4 h2 {
          font-size: 30px;
      }
      #blog-single .section4 h2 {
          margin-bottom: 40px;
      }
      .mbm_social {
          margin: 30px 25px;
      }
      .section4 .card .card-text {
          font-size: 16px;
      }
      .section4 .card .card-body a {
          font-size: 14px;
      }
      #blog-single .image {
          margin: 20px 0;
          height: 200px;
      }
      .section4 .card-deck .card {
          margin-left: 10px;
          margin-right: 10px;
      }
      .section4 .btn {
          padding: 5px 12px;
      }
      .more-blog {
          padding-bottom: 0;
      }
      .services h3 {
          font-size: 26px;
          margin-top: -8px;
      }
      .services .fa {
          font-size: 25px;
      }
      .services .box {
          padding: 40px 20px;
      }
      .services p {
          color: #848484;
          line-height: 25px;
          font-size: 14px;
      }
  }
  
  @media(max-width:768px) {
      .figure1{
          margin-bottom: 1rem !important;
      }
      .image_about{
          width: 100% !important;
          height: 150px !important;
          margin-bottom: 10px;
      }
      .services-table{
          width: 100%;
      }
      .list-unstyled li{
          display: inherit !important;
      }
      .list-unstyled .payment-li{
          display: inline-flex !important;
      }
      .navbar-brand {
          margin-left: -15px;
      }
      
      .payment-div{
          width: 100% !important;
      }
      .figure-img{
          width: 100% !important;
      }
      .nav-link-dis-text-change span{
          display: none;
      }
      .nav-link-dis-text-change:after{
          content: 'имоти';
      }
      .home-middle-column{
      margin-top: 0px !important;
  }
      .contact-cards {
          max-width: 33% !important;
          font-size: 8px;
           padding-left: 20px !important;
            padding-right: 20px !important;
      }
      .jumbotron h1 {
          font-size: 36px;
      }
      .jumbotron h2 {
          font-size: 16px;
          padding-bottom: 20px;
      }
      .jumbotron h4 {
          font-size: 12px;
          padding: 12px 20px;
      }
      .jumbotron {
          background-image: url(FINAL/SNIMKI/mobile_cloud.jpg);
          background-size: cover !important;
          width: 100%;
      }
      .jumbotron a {
          margin-top: 35px;
      }
      .jumbotron .btn-success, .btn-success:not(:disabled):not(.disabled):active {
          padding: 8px 30px;
      }
      .section-2 .fa {
          padding-bottom: 20px;
      }
      .section-2 h3 {
          font-size: 22px;
          margin-top: 0;
      }
      .section-2 .box-1, .section-2 .box-2, .section-2 .box-3 {
          padding-bottom: 12px;
      }
      .section-2 {
          padding-top: 20px;
          padding-bottom: 20px;
      }
      
      .section-3 figure .inner-img {
          width: 50%;
          height: 300px;
          left: 0;
      }
      .section-3 figure .out-sideimg {
          height: 300px;
          width: 50%;
          float: right;
      }
      .section-3 h2 span {
          display: inline;
      }
      .section-3 h2 {
          font-size: 26px;
          line-height: 40px;
          margin-top: 0;
      }
      .section-4 h3 {
          font-size: 25px;
          line-height: 35px;
          padding-bottom: 20px;
      }
      /* FIXME for removal
      .section-4 {
          padding-top: 0px;
          padding-bottom: 30px;
      }
      */
      /*
      .section-4 .box-1 img {
          height: 250px;
      }*/
      .blog h3 {
          font-size: 25px;
          line-height: 35px;
          padding-bottom: 20px;
      }
      .blog {
          padding-top: 30px;
          padding-bottom: 30px;
      }
      .blog .box-1 img {
          height: 250px;
      }
      .section-5 {
          padding-top: 30px;
      }
      .section-5 h3 {
          font-size: 24px;
          line-height: 35px;
          padding-bottom: 20px;
      }
      .section-5 .img-fluid {
          height: 200px;
      }
      .section-6 input {
          width: 100%;
          height: 45px;
          margin-bottom: 10px;
      }
      .section-6 form {
          float: none;
      }
      .section-6 .btn-info {
          width: 100%;
      }
      .section-6 {
          padding: 30px 0;
      }
      .page-footer .box-1 {
          padding-top: 20px;
          padding-bottom: 20px;
      }
      .page-footer .box-2, .page-footer .box-3, .page-footer .box-4 {
          padding-top: 0;
      }
      .page-footer h5 {
          font-size: 14px;
          margin-bottom: 0.5rem !important;
      }
      .page-footer .box-1 {
          border-right: 0;
      }
      #about-us .image {
          width: 100%;
          height: 250px;
          margin-bottom: 25px;
      }
      #about-us p {
          font-size: 12px;
          margin-bottom: 0;
      }
      #about-us {
          padding-top: 20px;
      }
      #about-us h3 {
          font-size: 24px;
      }
      #contact p {
          line-height: 20px;
      }
      #contact {
          padding-bottom: 70px;
      }
      #contact input {
          height: 40px;
      }
      #contact .form-control {
          margin-bottom: 10px;
      }
      .portfolio {
          padding-top: 30px;
      }
      .portfolio h3 {
          font-size: 24px;
          line-height: 35px;
          padding-bottom: 20px;
      }
      .portfolio .img-fluid {
          height: 200px;
      }
      .mbm_social {
          float: none;
          margin: 0;
          margin-bottom: 0;
          text-align: right;
      }
      .social-buttons h3 {
          margin-right: 0;
          margin-left: 0;
          padding: 0;
          padding-bottom: 0;
      }
      .social-buttons {
          padding: 20px;
      }
      #blog-single .box p {
          margin: 0;
          font-size: 12px;
          line-height: 20px;
          margin-top: 0;
      }
      #blog-single .heading h2 {
          font-size: 16px;
          line-height: 28px;
          padding-bottom: 0;
      }
      #blog-single .section4 h2 {
          font: 24px sans-serif;
          margin-top: 25px;
          margin-bottom: 34px;
      }
      .social-buttons {
          margin-top: 20px;
          margin-bottom: 20px;
      }
      #blog-single .section4 .card-deck {
          margin-left: -15px;
          margin-right: -15px;
      }
      .social-buttons .inner-text {
          padding-top: 5px;
      }
      .section4 .btn {
          padding: 5px 12px;
          font-size: 13px;
      }
      .services h2 {
          font-size: 24px;
          padding-bottom: 20px;
      }
      .services {
          padding-top: 0;
      }
      .services h3 {
          font-size: 20px;
          margin-top: -5px;
      }
      .services .fa {
          font-size: 20px;
      }
      .services p {
          font-size: 12px;
      }
      .services h3 {
          padding-bottom: 0;
      }
      .nav-link-dis {
          font-size: 8px !important;
          padding: 11px 10px !important;
      }
      .navbar-office {
          flex-direction: row;
      }
      .section-2 .box img {
             width: 60px !important;
          height: 60px !important;
      }
      .figure-img.img-contacts {
          width: 100% !important;
      }
      .column-3-home{
      margin-top: 0px  !important; 
      
      }
      .home-middle-column{
          margin-top: 0px !important;
      }
      .section-2-reserve{
          margin-bottom: 40px !important;
      }
  
  }
  @media(max-width:575px) {
      .navbar-dark .navbar-nav .nav-link {
          background-color: #34445e;
      }
      .section-4 h5 {
          padding-right: 0px !important;
      }
  }	
  @media(max-width:425px) {
      
      .figure-img.img-contacts {
          width: 100% !important;
      }
      .navbar-dark .navbar-toggler {
          position: absolute;
          right: 20px;
          top: -65px;
      }
      header .box-1 {
          text-align: left !important;
      }
      .jumbotron {
          background-image: url(FINAL/SNIMKI/mobile_cloud.jpg);
          background-size: cover !important;
          width: 100%;
      }
      .navbar-expand-sm>.container {
          padding: 0 0;
      }
      .navbar-nav .nav-item {
          border-right: none;
      }
     
      .navbar-dark .navbar-toggler {
          color: #000000;
          border-color: rgba(255, 255, 255, 0.1);
          
      }
      .navbar-toggler {
          padding: .15rem .25rem;
      }
      header {
          text-align: center;
      }
      /*
      .text-left, .text-right {
          display: none;
      }*/
      .jumbotron h2 {
          font-size: 12px;
          letter-spacing: 0.5px;
          padding-bottom: 20px;
      }
      .jumbotron h1 {
          font-size: 30px;
      }
      .jumbotron .btn-success, .btn-success:not(:disabled):not(.disabled):active {
          padding: 5px 15px;
          font-size: 12px;
      }
      .jumbotron h4 {
          font-size: 12px;
          padding: 3px 6px;
          letter-spacing: 3px;
      }
      .jumbotron {
          height: 300px;
      }
      .jumbotron a {
          margin-top: 20px;
      }
      .jumbotron h2 {
          padding-bottom: 10px;
      }
      .section-2 p a {
          bottom: -20px;
          right: -10px;
      }
      .section-5 h3 {
          font-size: 21px;
          line-height: 25px;
      }
      .section-5 .img-fluid {
          height: 250px;
      }
      .portfolio h3 {
          font-size: 21px;
          line-height: 25px;
      }
      .portfolio .img-fluid {
          height: 250px;
      }
      .section-3 h2 {
          font-size: 21px;
          line-height: 40px;
      }
      .section-5 .btn-success, .section-4 .heading .btn-success {
          margin-bottom: 20px;
      }
      .section-3 ul>li {
          font-size: 16px;
      }
      .section-3 figure .out-sideimg, .section-3 figure .inner-img, .section-4 .box-2 img, .section-4 .box-4 img, .section-4 .box-6 img {
          height: 200px;
          width: 100%;
          object-fit: cover;
      }
      .blog .heading .btn-success {
          margin-bottom: 20px;
      }
      .blog .box-2 img, .blog .box-4 img, .blog .box-6 img {
          height: 200px;
          width: 100%;
          object-fit: cover;
      }
      .blog h3 {
          font-size: 21px;
          line-height: 25px;
      }
      .blog .box-1 img, .blog .box-2 img, .blog .box-3 img {
          padding-left: 0;
      }
      .blog .box-5, .blog .box-3 {
          padding-bottom: 30px;
      }
      .blog .box-1 figure, .blog .box-4 figure {
          margin: 0 0 30px;
      }
      .blog .box-1 h2 {
          font-size: 18px;
          padding-bottom: 0;
      }
      .blog h4 {
          font-size: 18px;
          padding-bottom: 0;
      }
      .blog h5 {
          font-size: 12px;
          font-weight: 400;
      }
      .blog figure figcaption p {
          font-size: 12px;
          font-weight: 400;
      }
      .blog .btn-success {
          font-size: 12px;
          padding: 5px 15px;
      }
      .section-4 h3 {
          font-size: 21px;
          line-height: 25px;
      }
      .section-4 .box-1 img, .section-4 .box-2 img, .section-4 .box-3 img {
          padding-left: 0;
      }
      .section-4 .box-5, .section-4 .box-3 {
          padding-bottom: 30px;
      }
      .section-4 .box-1 figure, .section-4 .box-4 figure {
          margin: 0 0 0;
      }
      .section-4 .box-1 h2 {
          font-size: 18px;
          padding-bottom: 0;
      }
      .section-4 h4 {
          font-size: 18px;
          padding-bottom: 0;
      }
      .section-4 h5 {
          font-size: 12px;
          font-weight: 400;
      }
      .section-4 figure figcaption p {
          font-size: 12px;
          font-weight: 400;
      }
      .section-4 .btn-success {
          font-size: 12px;
          padding: 5px 15px;
      }
      .section-6 .heading h3 {
          font-size: 22px;
      }
      .section-6 .btn-info {
          font-size: 12px;
      }
      .section-2 p {
          font-size: 12px;
          font-weight: 400;
          letter-spacing: 0.5px;
      }
      .section-2 h3 {
          font-size: 18px;
      }
      .section-2 {
          padding-top: 0;
          padding-bottom: 0;
      }
      .jumbotron h1 {
          font-size: 26px;
      }
      .page-footer img {
          width: 30%;
      }
      .section-3 h2 {
          font-size: 21px;
          line-height: 30px;
      }
      .section-3 h2 span {
          display: block;
      }
      .section-3 ul>li a {
          font-weight: 400;
      }
      .section-6 ::placeholder {
          font-size: 12px;
      }
      .section-6 :-moz-placeholder {
          font-size: 12px;
      }
      .section-6 :-ms-input-placeholder {
          font-size: 12px;
      }
      .section-6 ::-webkit-input-placeholder {
          font-size: 12px;
      }
      .footer-copyright p {
          padding: 14px 0;
          font-size: 11px;
      }
      #contact .btn-primary {
          padding: 10px 30px;
      }
      #contact {
          padding-bottom: 30px;
      }
      #contact h3 {
          font-size: 22px;
          padding-bottom: 10px;
      }
      .social-buttons h3 {
          text-align: center;
      }
      .mbm_social {
          text-align: center;
          padding: 6px 0;
      }
      #blog-single .box p {
          padding-bottom: 10px;
      }
      #blog-single .heading-1 h3 {
          font-size: 20px;
      }
      .navbar-expand-sm>.container, .navbar-expand-sm>.container-fluid {
          padding-right: 15px;
          padding-left: 15px;
      }
      header .navbar-brand img {
          width: 20%;
      }
      .navbar-nav {
          padding: 0 0;
      }
      .services .fa {
          font-size: 25px;
          float: left;
          padding-bottom: 25px;
      }
      .services .box {
          padding: 20px 20px;
          margin-bottom: 25px;
      }
      
      .nav-link-dis {
          font-size: 6px !important;
          padding: 11px 10px !important;
      }
      .navbar-office {
          flex-direction: row;
      }
  }
  
  @media (max-width: 375px) {
      .section-6 .heading h3 {
          font-size: 18px;
      }
      #about-us h3 {
          font-size: 21px;
      }
      .services h2 {
          font-size: 20px;
      }
      .services h3 {
          font-size: 18px;
          margin-top: 0;
      }
      .jumbotron {
          background-image: url(FINAL/SNIMKI/mobile_cloud.jpg);
          background-size: cover !important;
          max-width: 100%;
      }
      .services {
          padding-bottom: 50px;
      }
      .nav-link-dis {
          font-size: 4px !important;
          padding: 10px 10px !important;
      }
      .navbar-office {
          flex-direction: row !important;
      }
  }
  
  @media (max-width: 320px) {
      .jumbotron h1 {
          font-size: 23px;
      }
      .jumbotron {
          background-image: url(FINAL/SNIMKI/mobile_cloud.jpg);
          background-size: cover !important;
          width: 100%;
      }
      
      .nav-link-dis {
          font-size: 6px;
          padding: 10px 10px;
      }
      .navbar-office {
          flex-direction: row !important;
      }
  }
  
  .nav-link-dis {
      font-size: 11px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 1px;
      padding: 15px 15px;
      color: #ffffff !important;
      display: inline-block;
   
  }
  
  
  .nav-item1{
      width:20%;
      text-align: center;
  }
  
  .section-7{
      background-color: #D4E5DF;
  }
  .unorderedlist li{
      list-style: circle;
  }
  
  .navbar-brand{
      padding-top: 0px;
      padding-bottom: 0px;
  }
  .btn{
      font-size: 10px;
      margin: 12px ;
      padding: 7px 15px;
      color: #ffffff;
      background-color: #4ba277;
      
  }
  .services-icons{
      margin-top: 10px;
      margin-bottom: 3px !important;
      width: 90px !important;
      height: 90px !important;
  }
  .figure{
      display: block !important;
  }
  
  .figure1 img{
      margin-bottom: 0px !important;
  }
  .image_about{
      margin-right: 10px;
      margin-top: 7px;
  }
  .img-contacts{
      height: 430px;
      object-fit: cover;
      width: 730px;
  }
  .section-4-custom{
      background-color:#eeeeee;
  }
  p{
      margin-bottom: 0px !important;
      margin-top: 0px;
  }
  .service-card{
      margin-bottom: 20px !important;
      font-size: 14px;
  }
  
  .service-com-icon{
      background-color: #ffffff !important;
  }
  .figure-post img{
      width: 100%;
      height: 426px !important;
      object-fit: cover !important;
      margin-bottom: 10px;
  }
  .read-link{
      font-weight: 400;
      text-align: center;
      white-space: nowrap;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      border: 1px solid transparent;
      font-size: 13px;
      padding: .375rem .75rem !important;
      line-height: 1.5;
      border-radius: .25rem;
      display: block;
      width: 127px;
      margin: 10px;
  }
  .rpwwt-widget h3{
      display: none;
  }
  
  .rpwwt-widget ul li img {
      margin-top: 0.4em !important;
  }
  
  .section-4-reserve{
      padding-top: 0px !important;
  }
  
  .section-2-reserve{
      margin-bottom: -25px ;
  }
  
  .rpwwt-widget ul li {
     
      margin: 0 !important;
  }
  .oo-widget .rpwwt-widget ul {
    margin: 0;
  }

  .office-bio{
       margin-top: 42px !important;
  
  }
  .online-office-hr{
      width: 30px; 
      float: left; 
      margin-top: 0px;
  }
  .office-last-column{
      margin-top: 46px; 
      min-height: 540px;
  }
  .office-title-section{
      background-color: #34445e; 
      color: #ffffff; 
      padding: 6px;
  }
  .office-li{
      display: inline-flex;
  }
  .list-unstyled{
      margin-bottom:0px !important;
  }
  .services-thumb{
      width: 555px !important; 
      margin-top: -2px !important; 
      margin-bottom: 17px !important; 
      height: 190px !important; 
      object-fit: cover !important;
  }
  .service-card span{
      color: #4ca275; 
      font-weight: bold; 
      font-size: 22px;
  }
  
  .services-section-3{
      height: 250px;
  }
  .services-section-title{
      background-color: #34445e; 
      font-size: 14px; 
      color: #ffffff; 
      padding: 8px;
  }
  
  td{
      width: auto;
      height: auto;
  }

  .calendly{
      min-width: 320px; 
      height: 660px;
  }
  .terms-block {
    font-size: 11px;
  }

  .services-section-text{
      width: 270px;
      padding-left: 20px;
  }
  .services-section-text-single{
      font-size: 15px;
      padding-left: 30px;
  }
  
  .navbar-dark .navbar-toggler-icon {
      background-image: url(FINAL/burgerIcon.png);
      width: 40px;
      height: 40px;
  }
  .column-3-home{
      margin-top: 46px; 
      min-height: 540px;
  }
  .services-card{
      text-align: center;
      height: 170px;
  }
  .section-4-custom .contact-cards .box{
      background-color: #ffffff !important;
  }
  
  .figure-custom{
      margin-bottom:0px !important;
  }
  
  .contact-icon{
      width: 25px !important;
      height: 25px !important;
  }
  
  .btn.home-btn{
      margin: 0px !important;
      margin-bottom: 5px !important;
  }
  .payment-div{
      font-size: 12px;
      color: #34445e;
      margin-top: 5px;
  }
  .section-4 .box-2 .payment-img{
      width: 120px;
      height: 90px; 
      padding-left: 0px;
  }
  .section-4 .box-1 .figure-img{
      height: 336px; 
      object-fit: cover;
  }