@font-face {
       font-family: 'robot';
       src: url(font/RobotoCondensed-Regular.ttf);
   }

   html {
       scroll-behavior: smooth;
   }

   body {
       font-family: robot;
       margin: 0;
   }

   section {
       margin: 0px;
   }

   .key_feature {
       height: 250px;
       border: 1px solid lightgray;
       padding: 10px;
       border-radius: 25px;
       margin-top: 10px;
       font-family: 'mukta';
       font-size: 16px;
       color: dimgrey;
   }

   .key_feature_title {
       font-family: 'robot';
       font-size: 28px;
       padding: 20px;

   }

   .key_feature:hover {
       background-color: #6666FF;
       color: white;
       box-shadow: 0.8px 1px 0.9px 1px gray;

   }

   h1 {
       color: white;
       font-family: 'robot';
       font-size: 28px;
       padding: 20px;
       margin-top: -20px;
       text-shadow: 2px 2px 4px #000000;
   }

   .contact_mail {
       font-size: 16px;
       padding: 0px;
   }

   .header-section {
       box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
       max-width: 100%;
       object-fit: fill;
       padding: 0;
   }

   .logo {
       height: 100px;
       padding: 20px;
   }

   .logo-title {
       margin-top: -20px;
       padding-left: 10px;
       font-size: 20px;
       font-family: robot;
       color: blue;
       text-shadow: 1px 1px red;

   }

   .menu {
       font-size: 18px;
       padding: 10px 0;
   }

   .menu-item {
       padding: 10px 15px;
       color: #333;
       text-decoration: none;
       transition: color 0.3s ease-in-out;
   }

   .menu-item:hover {
       color: #007bff;
       /* Change to your preferred hover color */
   }

   .menu a.hover {
       color: cornflowerblue;
   }

   .menu div {
       border-right: 2px;
       border-right-color: gray;
   }

   .header {
       font-size: 16px;
       color: cornflowerblue;
   }

   .banner {
       max-width: 100%;
       height: 350px;
       overflow: hidden;
       position: relative;
       background-color: antiquewhite;
   }

   .banner img {
       position: absolute;
       width: 100%;
       height: 100%;
       object-fit: cover;
       object-position: bottom;
   }

   .about_us {
       width: 100%;
       height: auto;
       margin-top: 50px;
   }

   .about_img {
       padding: 10px;
   }

   .descr {
       font-family: 'mukta';
       font-size: 16px;
       color: dimgrey;
   }

   .features {
       margin-top: 50px;
   }

   .features div img {
       height: 250px;
   }

   .features div a:hover {
       width: 10%;
       height: 10%;
   }

   .features .ai:hover {
       opacity: 0.5;
   }

   .features .fi:hover {
       opacity: 0.5;
   }

   .features .pi:hover {
       opacity: 0.5;
   }

   .features .vi:hover {
       opacity: 0.5;
   }

   .acc_overlay {

       position: absolute;
       bottom: 0;
       left: 15;
       right: 15;
       background-color: #008CBA;
       overflow: hidden;
       width: 91%;
       height: 0;
       transition: .5s ease;
   }

   .col-md-3:hover .acc_overlay {
       height: 100%;
       width: auto;
       opacity: 0.8;
   }

   .facility_overlay {

       position: absolute;
       bottom: 0;
       left: 15;
       right: 15;
       background-color: #008CBA;
       overflow: hidden;
       width: 91%;
       height: 0;
       transition: .5s ease;
   }

   .col-md-3:hover .facility_overlay {
       height: 100%;
       width: auto;
       opacity: 0.8;
   }


   .park_overlay {

       position: absolute;
       bottom: 0;
       left: 15;
       right: 15;
       background-color: #008CBA;
       overflow: hidden;
       width: 91%;
       height: 0;
       transition: .5s ease;
   }

   .col-md-3:hover .park_overlay {
       height: 100%;
       width: auto;
       opacity: 0.8;
   }


   .visitor_overlay {

       position: absolute;
       bottom: 0;
       left: 15;
       right: 15;
       background-color: #008CBA;
       overflow: hidden;
       width: 91%;
       height: 0;
       transition: .5s ease;
   }

   .col-md-3:hover .visitor_overlay {
       height: 100%;
       width: auto;
       opacity: 0.8;
   }

   .text {
       color: white;
       width: 100%;
       position: absolute;
       top: 40%;
       left: 50%;
       padding-left: 50px;
       -webkit-transform: translate(-50%, -50%);
       -ms-transform: translate(-50%, -50%);
       transform: translate(-50%, -50%);
       text-align: left;
   }

   .how_work {
       margin-top: 30px;
       height: 450px;
   }

   .work_title {
       color: darkgoldenrod;
       font-size: 28px;
       font-family: 'mukta';
   }

   .d-feature {
       padding-top: 10px;
       padding-bottom: 10px;
   }

   .app_title {
       color: darkgoldenrod;
       font-size: 16px;
       padding: 5px;
   }

   .app_descr {
       color: grey;
       font-family: 'mukta';
       font-size: 14px;
       padding: 5px;
   }

   .app_img {}

   .plans {

       margin-top: 50px;
       width: 100%;
       height: auto;
       float: left;
   }

   .p {
       padding: 0px;
       width: auto;
       height: auto;
       border: 2px solid whitesmoke;
       border-radius: 25px;
       margin-bottom: 20px;
       margin-top: 25px;
   }

   .p:hover {
       box-shadow: 0.5px 0.5px 1px 1px gold;

   }

   .p .p_header {
       border-radius: 25px;
       background-color: blue;
       color: white;
       margin-top: 0px;
       padding: 20px;
       text-align: center;
       font-size: 18px;
       font-display: block;
       text-decoration-style: solid;
   }

   .p_footer {
       background-color: goldenrod;
       color: white;
       border-radius: 25px;
       color: white;
       margin-top: 0px;
       padding: 20px;
       text-align: center;
       font-size: 18px;

   }

   .p_footer:hover {
       background-color: darkgoldenrod;
       color: white;
   }

   .classification {
       padding: 10px;
       font-size: 14px;
       font-family: 'mukta';
   }

   .footer {
       margin-top: 50px;
       float: left;
       background-color: dimgrey;
       color: goldenrod;
       width: 100%;
       padding: 50px;
       font-family: 'mukta';
   }