@font-face {
    font-family: 'tufont'; /*a name to be used later*/
    src: url('fonts/Roboto-Regular.ttf'); /*URL to font*/
    font-display: swap;
}
@font-face {
    font-family: 'tufontbold'; /*a name to be used later*/
    src: url('fonts/Roboto-Medium.ttf'); /*URL to font*/
    font-display: swap;
}
body {
  font-family: 'UI Sans Serif', sans-serif;
}
.bg-pre {
  background-color: #282C34;
}
.text-orange {
  color: #fd7e14; /* Replace with the exact orange color code used in your navigation bar's button */
}
.btn-custom-white {
    background-color: #ffffff;
    color: #28a745;
    font-weight: bold;
    border: 1px solid #000000;
    border-radius: 50px;
    padding: 0.5rem 1rem;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.btn-custom-white:hover {
    background-color: #28a745;
    color: #ffffff;
}
.code-container {
    background-color: #282c34; /* Change this to the background color of the Atom Dark theme */
    padding: 10px; /* Adjust padding as needed */
    border-radius: 5px; /* Adjust border-radius as needed */
}
.navbar-nav .nav-item {
border-right: 1px solid rgba(255, 255, 255, 0.5); /* Adjust color and opacity as needed */
}

.navbar-nav .nav-item:last-child {
border-right: none; /* Remove border from the last item */
}
.btn-orange {
  background-color: #ff8800;
  color: white;
}
 .boxit {
   background-color: #ffffff;
   border: 1px solid #dddddd;
   padding: 20px;
   text-align: center;
   margin-bottom: 20px;
 }
 .boxit h5 {
   font-weight: bold;
   color: #28a745;
 }

.pricing-box {
  -webkit-box-shadow: 0px 5px 30px -10px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 5px 30px -10px rgba(0, 0, 0, 0.1);
  padding: 35px 50px;
  border-radius: 20px;
  position: relative;
}

.pricing-box .plan {
  font-size: 34px;
}

.pricing-badge {
  position: absolute;
  top: 0;
  z-index: 999;
  right: 0;
  width: 100%;
  display: block;
  font-size: 15px;
  padding: 0;
  overflow: hidden;
  height: 100px;
}

.pricing-badge .badge {
  float: right;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  right: -67px;
  top: 17px;
  position: relative;
  text-align: center;
  width: 200px;
  font-size: 13px;
  margin: 0;
  padding: 7px 10px;
  font-weight: 500;
  color: #ffffff;
  background: #fb7179;
}
.mb-2, .my-2 {
    margin-bottom: .5rem!important;
}
p {
    line-height: 1.7;
}


.fa-check{
  color: LimeGreen;
}

.fa-times{
  color: Red;
}

.normal1 {
font-size:17px;
}
.big1 {
font-size:24px;
}

.big2 {
font-size:70px;
}

.big3 {
font-size:45px;
}

.big4 {
font-size:26px;
}

.limit400 {
  display: block;
   max-height:200px;

   width: auto;
   height: auto;

}

.output   {
  width: 100%;
  max-height: 400px;
  overflow-y: scroll;
  background-color: #282c34; /* Change this to the background color of the Atom Dark theme */
  padding: 10px; /* Adjust padding as needed */
  border-radius: 5px; /* Adjust border-radius as needed */
}

.border-kalın {
    border-width:3px !important;
}
.border-koyu{
  border-color: #364652;

}

.shortline{ margin-bottom:0px; }

.bg-nav{ background-color: #e1e1e1; }
.bg-ana{ background-color: #2FA900; }
.bg-koyu{ background-color: #364652; }
.navicon {
  display: block;
   max-height:50px;
   width: auto;
   height: auto;

}

.trialbutton {
 font-family: "tufontbold";
}
.tufontbold {
 font-family: "tufontbold";
}
.anasag {
  display: block;
   max-height:200px;

   width: auto;
   height: auto;

}
.anamusteri {
  display: block;
   max-height:600px;

   width: auto;
   height: auto;

}
.kucukresim {
  display: block;
   max-height:100px;

   width: auto;
   height: auto;

}

.ortaresim {
  display: block;
   max-height:400px;

   width: auto;
   height: auto;

}
.minikresim {
  display: block;
   max-height:50px;

   width: auto;
   height: auto;

}

.yesilfont {
color: #2FA900;
}

.grifont {
color: #F1F1F1;
}
.box{
  height: auto;
  width: 100%;
  background-size: cover;
  background-image: url(background.jpg);

}

.cardicon {
    width: auto;
   height: 60px;
}


@media (max-width:767px) {

  .cardicon {
      max-width: 100%;
     height: 40px;
  }
  .boxit {
    width: 100%;
  }

  h1 {
  font-size:28px;
  }
  h2 {
  font-size:22px;
  }
  .anamusteri {
    display: block;
     width:100%;
     max-height: 250px;
     height: auto;

  }
  .anasag {
    display: block;
     max-height:100px;

     width: auto;
     height: auto;

  }
  .showonbig {
    display: none;

  }
  .big1 {
  font-size:18px;
  }

}
