.accordion {
    /* width: 450px; */
    margin: 0 auto;
    /* overflow: hidden; */
    border-radius: 2px;
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  }
  
  .accordion-header {
    display: flex;
    height:30px;
    margin:0;
    /* justify-content: space-between; */
    /* padding: 0.75rem 1rem; */
    /* width: 100%; */
        border: none;
    outline: none;
    /* border-bottom: 1px solid #54a0ff; */
    background-color:rgb(70, 83, 110);
    color: white;
    cursor: pointer;
    /* font-size:12px; */
    text-align:center;
    padding:0;
    padding-left: 2px; 
    text-decoration: none;
  }
  
  .accordion-header.active {
    background-color:rgb(101, 119, 160);
    color: white;
    font-weight:bold;
  }
  .accordion-header.active i {
    transform: rotate(180deg);
    /* transition: all 0.3s ease-in-out; */
  }
  
  .accordion-body {
    padding: 0 1rem;
    background-color:rgb(101, 119, 160);
    color: white;
    max-height: 0;
    overflow: hidden;
    /* transition: all 0.3s ease-in-out; */
  }
  
  .accordion-body.active {
    max-height: 45rem;
    /* padding: 1rem; */

  }
  body{

    background-color:
    rgb(33, 39, 41);
    color:white;
    }
    .jobcat{
      font-size:17px;
      font-weight:bold;
      color: rgb(218, 198, 21);
      
    }
    table{
       /* background: white; */
        /* color: black; */
        font-weight: 0;
        width: 100%;
        text-decoration: none;
     }
     .smallbutton{
        font-size:14px; 
        padding:1px;
        margin-left:2px;
    }
    
    
    tr{
      width: 100%;
    }
    
    th {
      font-size:14px;
      text-align:center;
      /* background-color:#a5d8fa; */
      color:white;
    }
    td {
      color: white;
      /* text-decoration: none; */
      border: 1px solid rgba(29, 148, 156,.5);

      margin-left:2px;
      margin-right:2px;
    }
    
    .cat{
      text-align:center;
    }
    .cat:hover{
      background-color:blue;
      color:white;
    }
    
    .cost{
      border:1px solid black;
      border-radius:10%;
      width:80px;
      text-align:right;
      margin-left:5px;
      font-size:18px;
      background-color:rgb(199, 220, 252);
    }
    .curv_input{
      border-radius:10px;
      background-color:rgb(199, 220, 252);
    }
    .category_header{

    text-align:center;
    color:rgb(255, 230, 0);
    background-color:black;
    font-size:18px;
    }

  .clickbutton { 
      border: white; 
      cursor: pointer; 
      box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.6);
      transition: box-shadow 0.3s ease; 
      padding:2px;
  } 
  
  .clickbutton:hover { 
      border:none;
  } 
  .clickbutton:active{
    /* background-color: #3e8e41; */
    box-shadow: 0 2px #666;
    transform: translateY(3px);
  }

  /* onecard is in index */
  .onecard{
    /* background-color:rgb(253, 240, 163); */
    background-color:black;
    border:RGB(248,220,7) solid 1px;
  }
  .onecard :active{
    transform: translateY(2px);
  }
  .onecard :hover{
    /* background-color:rgb(214, 219, 221); */
    background-color:rgb(26, 18, 133);
  }

  .screenshot_card{
    /* background-color:rgb(253, 240, 163); */
    background-color:black;
    color:black;
    border:RGB(248,220,7) solid 1px;
  }

  .russo-one-regular {
    font-family: "Russo One", serif;
    font-weight: 400;
    font-style: normal;
    font-size: 20px;
  }