LeafWeb/WebCms/Content/style.scss

/* Go crazy with your own styles here */
/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */

html {
    position: relative;
    min-height: 100%;
}

body {
    /* Margin bottom by footer height */
    margin-bottom: 60px;
}

body header {
    padding: 15px 0;
}

body.debug header {
    background: repeating-linear-gradient(to right, #990, #090 10px, #333 10px, #333 20px);

    .navbar-brand {
        position: relative;

        &:before {
            content: "\f121";
            font-family: FontAwesome;
            font-style: normal;
            font-weight: normal;
            text-decoration: inherit;
            /*--adjust as necessary--*/
            color: red;
            font-size: 60px;
            padding-right: 0.5em;
            position: absolute;
            top: 10px;
            left: 0;
        }
    }
}

h1 {
	padding: 24px 0 12px 0;
}

p {
	padding: 12px 0;
}

i {
    cursor: default;
}

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    /* Set the fixed height of the footer here */
    height: 60px;
    line-height: 60px; /* Vertically center the text there */
}

.row-no-padding {
  [class*="col-"] {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

.home {
    .dark .row:first-child .column:first-child h1 {
	    padding-top: 0px;
    }

    .blogarchive {
	    padding-top: 20px;
    }
}

.table tfoot td a {

}

.top-buffer { margin-top:20px; }

.detail-actions {
    > a, > form > button {
        margin-top:20px;
        float:left; clear:left
    }
}

.banner-link {
	white-space: normal;
	padding: 20px;
	background: #000000;
	background: rgba(0, 0, 0, .5);
	-moz-border-radius: 10px; 
	border-radius: 10px; /* standards-compliant: (IE) */ 
    
    .glyphicon, .fa {
	    color: #8cc641;
    }
}

a.banner-link:hover {
	text-decoration: none;
	background: rgba(0, 0, 0, 0.6);

    .glyphicon {
	    color: #a8ed4f;
    }
}

$text-shadow: -1px -1px 0 rgba(255, 255, 255, 0.8), 1px 1px 0 rgba(0, 0, 0, 0.4), 5px 5px 10px rgba(0, 0, 0, 0.4);

h1.headline {
    font-size: 2.9em;
    text-align: center;
    text-shadow: $text-shadow;
}

.headline-icon {

    h1:after {
        color: rgba(172, 214, 118, 0.8);
        font-family: "FontAwesome";
        font-size: .8em;
        padding-left: 10px;
        text-shadow: $text-shadow;
    }
    /* https://fontawesome.bootstrapcheatsheets.com/ */
    &.headline-icon-none h1:after {
    }

    &.headline-icon-file h1:after {
        content: "\f15b";
    }

    &.headline-icon-leaf h1:after {
        content: "\f06c";
    }

    &.headline-icon-question h1:after {
        content: "\f059";
    }

    &.headline-icon-stats h1:after {
        content: "\f05a";
    }

    &.headline-icon-user h1:after {
        content: "\f007";
    }

    &.headline-icon-list h1:after {
        content: "\f00b";
    }
}

.status {
    white-space: nowrap;
    cursor: default;

    &:before {
        font-family: "FontAwesome";
        font-size: 1em;
        padding-right: 6px;
    }

    &.status-pending {
        color: #f0ad4e;

        &:before {
            content: "\f017";
        }
    }

    &.status-complete {
        color: #337ab7;

        &:before {
            content: "\f14a";
        }
    }

    &.status-exception {
        color: #a94442;

        &:before {
            content: "\f06a";
        }
    }

    &.status-unresponsive {
        color: #66512c;

        &:before {
            content: "\f059";
        }
    }

    &.status-running, &.status-starting, &.status-finishing {
        color: #3c763d;
    }

    &.status-running:before {
        content: "\f058";
    }

    &.status-starting:before {
        content: "\f01a";
    }

    &.status-finishing:before {
        content: "\f01b";
    }

    &.status-cancelpending:before,
    &.status-cancelling:before {
        content: "\f05e";
    }

    &.status-cancelled {
        color: #ec971f;
    }

    &.status-cancelled:before {
        content: "\f05e";
    }
}

#chart {
	padding-top: 20px;
}

.btn-file {
    position: relative;
    overflow: hidden;

    input[type=file] {
        position: absolute;
        top: 0;
        right: 0;
        min-width: 100%;
        min-height: 100%;
        font-size: 100px;
        text-align: right;
        filter: alpha(opacity=0);
        opacity: 0;
        outline: none;
        background: white;
        cursor: inherit;
        display: block;
    }
}

form .validation-summary-errors ul {
	list-style-type: none;
    li {
        color: #dc3545
    }
}

.autocomplete {
    &-suggestions { border: 1px solid #999; background: #FFF; overflow: auto; }
    &-suggestion { padding: 2px 5px; white-space: nowrap; overflow: hidden; }
    &-selected { background: #F0F0F0; }
    &-suggestions strong { font-weight: normal; color: #3399FF; }
    &-group { padding: 2px 5px; }
    &-group strong { display: block; border-bottom: 1px solid #000; }
}

.toggle {
    width:15px;
}

.dropdown-menu li form .btn-link {
    display: block;
    color: #333333;
    clear: both;
    float: left;
    font-size: 1rem;
    font-weight: normal;
    line-height: 1.42857;
    min-width: 160px;
    padding: 3px 20px;
    text-align: left;
    white-space: nowrap;
    &:focus, &:hover {
      text-decoration: none;
      color: #262626;
      background-color: #f5f5f5;
    }
}

.divider-right {
    border-right: 1px dashed #333;
}

.read{
    overflow: hidden;
    font-size: 16px !important;
    transition: all 0.3s;
    margin-bottom: 10px;
}
.read-less{
    height: 90px!important;
}

code,pre {
    line-height: 1;
}

.alert {
    position: absolute;
    left: 30%;
    top: 15em;
    width: 40%;
    z-index:1;
}

.copyright {
    font-size: .8em;
    color: #777 !important;
    cursor: default;
}

.withshadow{
    text-shadow: 2px 2px 4px #000000;
}

.files td {
    vertical-align: middle;
}

p.caption {
    font-style: italic;
    font-size: smaller;
}