*{

   margin:0; padding:0;
   /*text-transform: capitalize;*/

   font-family: 'Raleway', sans-serif!important;
}

*::selection{
   background-color: #be9c79;
   color:#fff;
}

::-webkit-scrollbar{
   height: .5rem;
   width: 1rem;
}

::-webkit-scrollbar-track{
   background-color: transparent;
}

::-webkit-scrollbar-thumb{
   background-color: var(--main-color);
}

html{
   font-size: 75%;
   overflow-x: hidden;
   scroll-behavior: smooth;
   scroll-padding-top: 6.5rem;
}

/* navbar */

#nav-img{
   width: 500px;
}

.navbar {
   box-shadow: #070707;
   background: url(../images/nav-bg.png);
}
.nav-item{
   margin-right: 50px;
   font-size: 14px;
}

.navbar .navbar-nav .nav-link {
   color: #131313;
   font-size: 1.2em;
}

.navbar .navbar-nav .nav-link:hover {
   color: #336699;
}

.navbar{
   box-shadow: 0px 16px 12px rgb(0, 0, 0, 0.08);
}


/* carousel */

.about{
   display: flex;
   align-items: center;
   flex-wrap: wrap;
   /*gap:4rem;*/
}

.about .content{
   flex:1 1 40rem;
}

.about .content h3{
   font-size: 3.5rem;
   font-weight: 300;
   line-height: 50px;
   word-spacing: 8px;
   color:#333;
   font-family: 'Roboto Flex', sans-serif;
   text-align: center;
   padding-top: 50px;
   padding-bottom: 50px;
}

/* work */

.work{
   background-color: #f2f8f6;
}

.counter {
   font-family: 'Anton', sans-serif!important;
	font-size: 60px;
   text-align: center;
   color: #336699;
   font-weight: 400;
   letter-spacing: 2px;
}

.mb-60 {
   margin-bottom: 50px;
   margin-top: 50px;
}

.services-inner {
   border: 1px solid #8fb9be;
   background-color: #ffffff;
   border-radius: 8px;
   margin-left: 80px;
   margin-right: 80px;
   transition: .3s;
}

.our-services-text {
   padding-right: 10px;
}

.our-services-text {
   overflow: hidden;
   padding: 25px 0 25px;
}

.our-services-text h2 {
   font-family: 'Impact', sans-serif;
   color: #336699;
   font-size: 60px;
   font-weight: 400;
   letter-spacing: 0.5px;
   position: relative;
   text-transform: uppercase;
   text-align: center;
}

.our-services-wrapper:hover .services-inner {
   background: #fff none repeat scroll 0 0;
   border: 2px solid transparent;
   box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.2);
}

.our-services-text p {
   margin-bottom: 0;
   font-size: 30px;
   font-weight: 400;
   line-height: 22px;
   color: rgb(48, 48, 48);
   margin-bottom: 15px;
   text-align: center;
   font-family: 'Roboto Flex', sans-serif;
}

.display-2{ font-weight: bold;}
/* reduction */

.reduction{
   padding-top: 70px;
   padding-bottom: 70px;
}

.column {
   float: left;
   width: 50%;
 }

#working{
   background: #e2f8dc;
   align-items: center;
}

#working h3{
   font-family: 'Roboto Flex', sans-serif;
   font-size: 60px;
   font-weight: 500;
   padding-left: 100px;
   margin-bottom: 25px;
   background-color: #ccc;
}

#working p{
   text-align: left;
   padding-left: 50px;
   padding-right: 50px;
   font-size: 2.2em;
   line-height: 45px;
   font-family: 'Roboto Flex', sans-serif;
   font-weight: 300;
}

/* footer */

.footer{
   background: #cccccc;
   padding: 0 0 30px 0;
   color: #333;
   font-size: 14px;
}

.footer .footer-top{
   background: #cccccc;
   border-top: 1px solid #b0b0b0;
   border-bottom: 1px solid #b0b0b0;
   padding: 60px 0 30px 0;
}

.footer .footer-top .footer-info{
   margin-bottom: 30px;
}

.footer .footer-top .footer-info h3{
   font-family: 'Roboto Flex', sans-serif;
   font-size: 36px;
   margin: 0 0 20px 0;
   padding: 2px 0 2px 0;
   line-height: 1;
   font-weight: 500;
   text-align: left;
}

.footer .footer-top .footer-info p{
   font-size: 22px;
   line-height: 35px;
   margin-bottom: 0;
   font-family: 'Roboto Flex', sans-serif;
   color: #333;
   text-align: left;
}

.footer .footer-top h4{
   font-size: 25px;
   font-weight: bold;
   color: #333;
   text-transform: uppercase;
   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 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: #333;
   transition: 0.3s;
   display: inline-block;
   line-height: 1;
   text-decoration: none;
   font-size: 20px;
}

   .footer .footer-top .footer-links ul a:hover{
      color: #336699;
   }


   .footer .copyright{
      text-align: center;
      padding-top: 30px;
   }

   .footer .credits{
      padding-top: 10px;
      text-align: center;
      font-size: 13px;
      color: #333;
   }

.cage1{ background-color: #f4f4f4; padding: 16px; margin-top: 32px;}
.cage2{ background-color: #eee; padding: 16px; margin-top: 32px;}
.cage3{ padding: 16px; margin-top: 32px;
   background: rgb(0,212,255);
   background: linear-gradient(285deg, rgba(0,212,255,1) 0%, rgba(0,212,255,1) 35%, rgba(255,255,255,1) 35%);
}

.cage4{ padding: 16px; margin-top: 32px;
   background: rgb(0,212,255);
   background: linear-gradient(75deg, rgba(0,212,255,1) 0%, rgba(0,212,255,1) 35%, rgba(255,255,255,1) 35%);
}

.card-bg-color{ background-color:#ff6d00; display: flex; border-radius: 16px 16px 0 0; padding: 16px; justify-content: center;}

.card-bg-color2{ background-color: #7e1402; }

.m48{margin-top: 60px;}

.card-bg-color img{ width:75%;}

.nav-link {
   display: block;
   padding: 0.5rem 1rem;
   color: #333!important;
   text-decoration: none;
   transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
}

.itemList{  padding: 10px 20px; border: 1px solid #fd7e14; background-color: #ffecb5; border-radius: 8px;}

.itemHelp{ list-style: none; border-radius: 8px; box-shadow: #4f5050 ;
   padding: 10px  20px; font-size: 1.5rem; line-height: 2.0rem; background-color: #ffecb5; margin-bottom: 10px; border: 1px solid #333; }

.p1{ padding-top: 80px; padding-bottom: 80px;}

@media (max-width:768px){

   .mobileText{
      text-align: center;
   }

   #nav-img{
      width: 300px;

   }

   .about .content h3{
      font-size: 20px;
      font-weight: 400;
      letter-spacing: 1px;
      line-height:35px;
      word-spacing: 5px;
      color:rgb(0, 0, 0);
      font-family: 'Roboto Flex', sans-serif;
      text-align: center;
   }

   .navbar{
      border-bottom: 1px solid #bbcac9;
      text-align: left;
   }

   #navigation{
      color: #000000;
      border-bottom: 1px solid #bbcac9;
  }

   .nav-item{
      margin-right: 1px;
   }

   .services-inner {
      border: 2px solid #cccccc;
      background-color: #ffffff;
      margin-left: 70px;
      margin-right: 70px;
      transition: .3s;
   }

   .our-services-text p {
      margin-bottom: 0;
      font-size: 30px;
      font-weight: 400;
      line-height: 35px;
      color: rgb(48, 48, 48);
      margin-bottom: 15px;
      text-align: center;
      font-family: 'Roboto Flex', sans-serif;
   }

   .reduction{
      padding-top: 0;
      padding-bottom: 0;
   }
   
   #working{
      background: #e2f8dc;
      margin-top: 0;
      margin-bottom: 20px;
      align-items: center;
   }
   
   #working h3{
      font-family: 'Roboto Flex', sans-serif;
      font-size: 40px;
      font-weight: 500;
      padding-left: 0;
      text-align: center;
      margin-top: 20px;
      margin-bottom: 25px;
   }
   
   #working p{
      text-align: left;
      padding-left: 0;
      text-align: center;
      font-size: 20px;
      line-height: 40px;
      font-family: 'Roboto Flex', sans-serif;
      font-weight: 300;
      margin-bottom: 25px;
   }
   
   .column {
      width: 100%;
      margin-bottom: 30px;
    }

   .footer .footer-top .footer-info{
      text-align: center;
   }

   .footer .footer-top .footer-info h3{
      font-size: 40px;
      text-align: center;
   }
   
   .footer .footer-top .footer-info p{
      font-size: 20px;
      line-height: 35px;
      margin-bottom: 0;
      font-family: 'Roboto Flex', sans-serif;
      color: #333;
      text-align: center;
   }
   
   .footer .footer-top h4{
      font-size: 25px;
      text-align: center;
   }

   .footer-links ul li a{
      text-align: center;
      align-items: center;
   }

}