/* semantic.min.css | http://localhost:3000/static/semantic.min.css */

body {
    font-size: 13px;
}

#emptycorner1, #emptycorner2 {
    background-color: #314e5e;
}

#emptycorner1, #appheader {
    height: 80px;
}

#emptycorner2, #appfooter {
    height: 30px;
}

#appsidebar {
    max-width: 55px;
}

/** to stretch due to the sidebar max-width **/
#content {
    flex: 1 0 auto;
}

#appfooter, #sidebar, #headerdivider {
    background-color: #51788d;
}

#sidebar, #appcontent {
    height: 1000px
}

#sidebar-spacer {
    height: 20px;
}

#cloud {
	cursor: pointer;
	user-select: none;
}

#sidebar {
    display: flex;
    align-items: center;
    flex-flow: column;
    padding-top: 35px;
}

#add-label-input {
    width: 75%;
}

#add-modal-input, edit-modal-input {
    width: 100%;
}

#search-string-input {
    width: 75%;
}

.add-form {
    min-width: 100%;
    width: 100%;
}

#add-btn {
    float: right;
}
#wrongshort {
    color: red;
    font-weight: bold;
}

#short {
    width: 15%;
}

#url {
    width: 74%;
}

#headerdivider {
    height: 1px;
}

#appcontent {
    justify-content: center;
}

#headerdivider, #appsidebar, #appcontent, #content, #appheader, #appfooter {
    padding: 0px;
}

#appheader {
    align-items: center;
    justify-content: space-between;
}

#appheaderlogo {
    align-items: center;
    display: flex;
}

#appheadercontrol {
    padding-right: 15px;
}

#contentgrid, #messagegrid {
    justify-content: center;
    width: 70%; /* without it , the input box in quick view doesn't center align */
}

#messagegrid {
    display: block;
}

.search-result {
    height: 772px;
    min-width: 93%;
}

.search-box {
    min-width: 100%;
}

#submitSearch {
    float: right;
}

#searchString {
    float: left;
}

.logo {
    width: 150px;
    height: 48px;
    margin: 15px;
}

.icon-container {
    display: flex;
    justify-content: center;
    margin-bottom: 3.5em
}

.ui.icon.button {
    background: transparent none; 
}

.ui.icon.button:hover {
    background: lightskyblue none; 
}

.btn-container {
    display: flex;
    justify-content: center;
    align-items: center;
}

td {
    /* css-3 */
    word-wrap: break-word;
    padding-left: 0px;
    padding-right: 0px;
}

table {
    overflow-wrap: anywhere;
}

#result-table-container {
    height: 500px;
    overflow-y: scroll;
}

#title {
    display: inline;
    padding-top: 20px;
}

.ui.grid > row {
    padding-left: 30px;
    padding-top: 14px;
    padding-bottom: 14px;
}

.ui.segment {
    border: 2px;
}

.ui.icon.button, .ui.icon.buttons .button {
    padding: 5px;
}

.ui.grid {
    margin: 0px;
}

section {
    padding-left: 14px;
    padding-right: 14px;
    padding-top: 14px;
}

.ownerlabel {
    color: #1678c2;
}

.inEditMode {
    color: lightgray !important;
}

.link-style {
    cursor: pointer;
    color: black;
}

.link-style2 {
    cursor: pointer;
    text-decoration: underline;
}

/** The following is to center align everything except url link*/
.ui.header {
    display: grid;
    justify-content: center;
    margin: 0px;
}


.ui.table {
    text-align: center;
}

#url-data {
    text-align: left;
    word-wrap: anywhere;
}