body {
    background-color: #2c222d;
    background-image: url(world.png);
    color: white;
    font-family: 'Quicksand', sans-serif;
    font-size: 18px;
}

.menu {
    padding: 10px;
    text-align: center;
    color: white;
    background-color: #181b1f;
    border-radius: 15px;
    width: 39%;
    margin: auto;
}

.header {
    margin-top: 30px;
    padding: 0px 0px;
}

.button {
    border-radius: 15px;
    text-align: center;
    color: #c3c5cb;
    background-color: #181b1f;
    padding: 10px;
    align-content: right;
    font-size: 18px;
}

.button:hover, .button:focus, .button:active {
    color: white !important;

}

#create-token, #support-creator, #withdraw-contributions {
    padding: 3%;
    text-align: left;
    color: white;
    background-color: #181b1f;
    border-radius: 15px;
    width: 50%;
    margin: auto;
}

.inputs {
    background-color: #222429;
    padding: 20px;
    text-align: left;
    border-radius: 15px;
    margin: 10px 0;
}

input {
    float: right;
    background-color: #222429;
    text-align: right;
    border: 0;
}

input:focus {
    outline: none;
}

.submit {
    margin: auto;
    border: none;
    border-radius: 15px;
    padding: 10px 30px;
    width: 100%;
}

.header-button {
    background-color: #181b1f;
    border: 0;
    text-decoration: none;
    color: #c3c5cb;
    padding: 10px;
    border-radius: 15px;
}

a:hover, a:focus {
    text-decoration: none;
    color: white;
    background-color: #222429;
}

.menu a.clicked {
    text-decoration: none;
    color: white;
    background-color: #222429;
}

.rating-stars ul {
    list-style-type:none;
    padding:0;
    /* float: right; */
    -webkit-moz-user-select:none;
  }
  .rating-stars ul > li.star {
    display:inline-block;
  }
  
  /* Idle State of the stars */
  .rating-stars ul > li.star > i.fa {
    font-size:2.5em; /* Change the size of the stars */
    color:#ccc; /* Color on idle state */
  }
  
  /* Hover state of the stars */
  .rating-stars ul > li.star.hover > i.fa {
    color:#FFCC36;
  }
  
  /* Selected state of the stars */
  .rating-stars ul > li.star.selected > i.fa {
    color:#FF912C;
  }
  
  /* Modal Content */
  .modal-content {
    background-color: #fefefe;
    margin: auto;
    padding: 20px;
    border: 1px solid #888;
    width: 80%;
  }
  
  /* The Close Button */
  .close {
    color: #aaaaaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
  }
  
  .close:hover,
  .close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
  }
  
  @media screen and (max-width: 700px) {
    body {
        font-size: 12px !important;
    }
    .menu {
        width: 70% !important;
        margin: 0;
        position: fixed !important;
        bottom: 20px !important;
    }
    .header {
        width: 90% !important;
        margin: auto !important;
    }
    .header-button {
        padding: 10px;

        display: inline-block !important;
    }
    #create-escrow, #release-escrow, #refund-buyer {
        padding: 3%;
        text-align: left;
        color: white;
        background-color: #181b1f;
        border-radius: 15px;
        width: 100% !important;
        margin: auto;
    }
    .button {
        font-size: 12px !important;
        float: right;
        margin: 20px 0;
    }
    }