#upload-wrapper {
    width: 300px;
    margin:auto;
    background: #ececec;
    padding: 20px;
    border: 1px solid #ccc;
}

#image-list {
    list-style:none;
    margin:0;
    padding:0;
}
#image-list li {
    background: #fff;
    border: 1px solid #ccc;
    text-align:center;
    padding:20px;
    margin-bottom:19px;
}
#image-list li img {
    width: 258px;
    vertical-align: middle;
    border:1px solid #474747;
}

/* The message box is shown when the user clicks on the password field */
#msg-admin-password {
    display:none;
    background: #f1f1f1;
    color: #000;
    position: relative;
    padding: 20px;
    margin-top: 10px;
}
  
#msg-admin-password span {
    padding: 10px 35px;
    font-size: 12px;
}
  
  /* Add a green text color and a checkmark when the requirements are right */
.valid {
    color: green;
}
  
.valid:before {
    position: relative;
    left: -5px;
    content: "✔";
}
  
  /* Add a red text color and an "x" icon when the requirements are wrong */
.invalid {
    color: red;
}
  
.invalid:before {
    position: relative;
    left: -5px;
    content: "✖";
}

.btn-gps1{
    position:relative;margin-top:20px;font-size:large;z-index:100;
}
.btn-gps2{
    position:relative;margin-top:20px;margin-right:10px;font-size:large;z-index:100;
}


/* Style the button that is used to open and close the collapsible content */
.collapsible {
    /*background-color: #eee;
    color: #444;*/
    cursor: pointer;
    padding: 5px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
  }
  
  /* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
  .active, .collapsible:hover {
    background-color: rgb(255, 255, 255);
  }
  
  /* Style the collapsible content. Note: hidden by default */
  .collapsible-content {
    padding: 0 5px;
    display: none;
    overflow: hidden;
    background-color: #ffffff;
  }