body {
    font: 14px/1.5 helvetica-neue, helvetica, arial, san-serif;
    padding:10px;
}

h1 {
    margin-top:0;
}

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

#image-list {
    list-style:none;
    margin:0;
    padding:0;
}

#buttons {
    margin-top: 1%;
    padding-bottom: 5%;
    margin-left: 14.5%;
}

#btn {
    border: solid 1px #88b9a3;
    background-color: #fcfdfd;
    min-width: 75px;
    height: 30px;
    -webkit-border-radius: 20px;  border-radius: 20px;
    line-height: 27px;
    text-align: center;
    font-family: Arial;
    color: #9bbbc4;
    padding-left: 16px;
    padding-right: 16px;
    margin-left: 57%;
    position: relative;
    top: -3px;

}

#addNewButton {
    border: solid 1px #9bbbc4;
    background-color: #e9f2f4;
    width: 150px;
    height: 30px;
    color: #9bbbc4;
    font-family: Arial;
    font-size: 16px;
    text-align: center;
    line-height: 24px;

    padding: 1px;
    -webkit-border-radius: 100px;  border-radius: 100px;
}

#addNew {
    border: solid 1px #9bbbc4;
    background-color: #e9f2f4;
    width: 30px;
    height: 30px;
    color: #9bbbc4;
    font-family: Arial;
    font-size: 24px;
    text-align: center;
    line-height: 24px;

    padding: 1px;
    -webkit-border-radius: 100px;  border-radius: 100px;
}

#addNewButton:focus {
    outline: none;
}

#notice {
    margin-left: 36.5%;
    color: #99bac3;
    font-size: 13px;
    margin-top: 5px;
}

#addNew:hover, #btn:hover, #addNewButton:hover {
    background-color: #7ed5ae;
    border: solid 1px #88b9a3;
    color: white;
    cursor: pointer;
}

#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;
}

.file_bg {
    width: 400px;
    height: 100px;
    padding-left: 10px;
    margin-top: 10px;
    line-height: 40px;
    color: #768496;
    margin-left: 13%;
}

.loading_start p {
    position: relative;
    top: -23px;
}

#number {
    font-size: 26px;
    font-weight: bold;
    color: #545f6e;
}

.loading_done {
    background-color: #00ad5f;
    height: 15px;
    width: 10px;
    border: solid 1px #367056;
    color: white;
    -webkit-border-radius: 10px;  border-radius: 10px;
    margin-left: 21%;
    padding-left: 10px;
}
.loading_start {
    background-color: #cfe0e4;
    width: 310px;
    height: 20px;
    border: solid 1px #99bac3;
    color: #6c97a3;
    -webkit-border-radius: 10px;  border-radius: 10px;
    margin-left: 21%;
    padding-left: 10px;
}

#button_remove {
    background-image: url('../img/remove.png');
    background-repeat: no-repeat;
    width: 14px;
    height: 14px;
    float: right;
    position: relative;
    top: -19px;
    left: 25px;
}

#button_remove:hover {
    background-image: url('../img/remove_hover.png');
    background-repeat: no-repeat;
    width: 14px;
    height: 14px;
    cursor: pointer;
}

#button_link {
    background-image: url('../img/link.png');
    background-repeat: no-repeat;
    width: 13px;
    height: 13px;
    float: right;
    position: relative;
    top: -19px;
    left: 25px;
}

#button_link:hover {
    background-image: url('../img/link_hover.png');
    background-repeat: no-repeat;
    width: 13px;
    height: 13px;
    cursor: pointer;
}

#browse {
    background-color: lightblue;
    width: 75px;
    height: 40px;
    color: #fff;
    font-weight: bold;
    font-size: 16px;
    border: solid 0px #fff;
    margin-left: 15px; margin-right: 5px; margin-top: 10px;

}

#headerText {
    margin-left: 35%;
    font-size: 24px;
    color: #818ea0;
}

#error {
    width: 500px;
    height: 50px;
    background-color: darkred;
    font-weight: bold;
    color: white;
    line-height: 50px;
    padding-left: 10px;
    display: none;
}

#myImages {
    padding: 10px;
    background-color: black;
}
.preview {
    width: 75px;
    height: 75px;
    max-width: 75px;
    max-height: 75px;
    float: left;
    margin-right: 10px;
}

.linkBox {
    width: 400px;
    height: 40px;
    background-color: red;
    padding-left: 10px;
    margin-top: 10px;
    line-height: 40px;
    color: white;
    margin-left: 15px;
}

.inputBox {
background-color: darkred;
border: solid 0px darkred;
padding-left: 15px;
padding-right: 15px;
padding-top: 5px;
padding-bottom: 5px;
float: right;
margin-right: 10px;
position: relative;
top: 5px;
color: white;
opacity: 0.9;
}

.inputBox:focus {
    outline: none;
}

.inputBox:hover {
    opacity: 1.0;
}

#close {
    width: 25px;
    height: 25px;
    background-color: #545f6e;
    position: relative;
    left: 96%;
    margin-top: -5px;
    -webkit-border-radius: 25px;  border-radius: 25px;
    font-family: Arial;
    font-size: 16px;
    font-weight: bold;
    color: #8895a7;
    text-align: center;
    line-height: 25px;
}

#loading {
    position: relative;
    top: 2px;
}



#close:hover {
    cursor: pointer;
    background-color: #323e4e;
    cursor: pointer;
}

#addNew:focus, #btn:focus {
    outline: none;
}

#justModal {
    min-height: 100px;
    display: none;
-webkit-box-shadow:  0px 15px 35px 0px #484848;

        box-shadow:  0px 15px 35px 0px #484848;

}