/* 
 * Global custom CSS stylesheet (global.css)
*/

html,
body {
    width: 100%;
    height: 100%;
    margin: 0;
}

body {
    background: #fff;
    overflow-x: hidden;
    /* fixes negative margin creating horizontal scrollbar on full-width .ui.grid */
    /*font-family: droid_serifregular, arial;*/
}

a img {
    border: none;
}

h1,
h2,
h3,
h4,
h5 {
    /*
	color:#3B3B3B;
	font-family: Verdana, Arial, sans-serif;
	font-weight:700;
	margin:0.25em 0 0.75em 0;
	*/
}

/* Visibility */

@media only screen and (min-width: 767px) {
    .hide-on-mobile {
        display: inline-block !important;
    }
    .hide-on-desktop {
        display: none !important;
    }
}

@media only screen and (min-width: 1058px) {
    .hide-on-mobile {
        display: inline-block !important;
    }
    .hide-on-tablet {
        display: inline-block !important;
    }
    .hide-on-desktop {
        display: none !important;
    }
}

@media only screen and (max-width: 1058px) {
    .hide-on-mobile {
        display: inline-block !important;
    }
    .hide-on-tablet {
        display: none !important;
    }
    .hide-on-desktop {
        display: none !important;
    }
}

@media only screen and (max-width: 767px) {
    .hide-on-mobile {
        display: none !important;
    }
    .hide-on-tablet {
        display: none !important;
    }
    .hide-on-desktop {
        display: inline-block !important;
    }
}

/* Visibility */

@media only screen and (min-width: 767px) {
    .show-on-mobile {
        display: none !important;
    }
    .show-on-desktop {
        display: inline-block !important;
    }
}

@media only screen and (min-width: 1058px) {
    .show-on-mobile {
        display: none !important;
    }
    .show-on-tablet {
        display: none !important;
    }
    .show-on-desktop {
        display: inline-block !important;
    }
}

@media only screen and (max-width: 1058px) {
    .show-on-mobile {
        display: none !important;
    }
    .show-on-tablet {
        display: inline-block !important;
    }
    .show-on-desktop {
        display: inline-block !important;
    }
}

@media only screen and (max-width: 767px) {
    .show-on-mobile {
        display: inline-block !important;
    }
    .show-on-tablet {
        display: inline-block !important;
    }
    .show-on-desktop {
        display: none !important;
    }
}

/* BLOCK Visibility */

@media only screen and (min-width: 767px) {
    .hide-on-mobile-block {
        display: block !important;
    }
    .hide-on-desktop-block {
        display: none !important;
    }
}

@media only screen and (min-width: 1058px) {
    .hide-on-mobile-block {
        display: block !important;
    }
    .hide-on-tablet-block {
        display: block !important;
    }
    .hide-on-desktop-block {
        display: none !important;
    }
}

@media only screen and (max-width: 1058px) {
    .hide-on-mobile-block {
        display: block !important;
    }
    .hide-on-tablet-block {
        display: none !important;
    }
    .hide-on-desktop-block {
        display: none !important;
    }
}

@media only screen and (max-width: 767px) {
    .hide-on-mobile-block {
        display: none !important;
    }
    .hide-on-tablet-block {
        display: none !important;
    }
    .hide-on-desktop-block {
        display: block !important;
    }
}

/* Visibility */

@media only screen and (min-width: 767px) {
    .show-on-mobile-block {
        display: none !important;
    }
    .show-on-desktop-block {
        display: block !important;
    }
}

@media only screen and (min-width: 1058px) {
    .show-on-mobile-block {
        display: none !important;
    }
    .show-on-tablet-block {
        display: none !important;
    }
    .show-on-desktop-block {
        display: block !important;
    }
}

@media only screen and (max-width: 1058px) {
    .show-on-mobile-block {
        display: none !important;
    }
    .show-on-tablet-block {
        display: block !important;
    }
    .show-on-desktop-block {
        display: block !important;
    }
}

@media only screen and (max-width: 767px) {
    .show-on-mobile-block {
        display: block !important;
    }
    .show-on-tablet-block {
        display: block !important;
    }
    .show-on-desktop-block {
        display: none !important;
    }
}

.text-center {
    text-align: center !important;
}

.text-white {
    color: #fff !important;
}

.text-yellow {
    color: #f6b911 !important;
}

.home-hero {
    background: url('/images/2.jpg') top no-repeat;
    background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -webkit-background-size: cover;
}

.home-hero-title {
    color: #fff;
    text-align: center;
    text-shadow: 0px 1px 1px rgba(0, 0, 0, 1);
}

.home-hero .ui.segment {
    color: #000 !important;
    font-size: 1.2em;
    /*font-weight: bold;*/
    /*text-align: justify;*/
}

.home-hero .ui.segment p,
.home-hero .ui.segment .ui.button {
    opacity: 1 !important;
}

.home-hero .home-hero-form {
    width: 100%;
    max-width: 512px;
    margin: 0 auto;
    background: rgba(33, 33, 33, 0.77);
    text-align: center;
    border-radius: 1em;
}

.home-hero .home-hero-form .form {
    margin-bottom: 1em;
}

ul.success,
ul.error {
    list-style-type: none;
    display: inline-block;
    clear: right;
}

.clearfix {
    clear: both;
}

.container {
    width: 970px;
    padding: 0px;
    margin: 0 auto 0 auto;
}

hr {
    background: #ddd;
    color: #ddd;
    clear: both;
    float: none;
    width: 100%;
    height: 1px;
    margin: 0 0 1.45em;
    border: none;
}

hr.space {
    background: #fff;
    color: #fff;
    visibility: hidden;
    height: 10px;
}

.box-shadow-top-inset {
    box-shadow: inset 0px 3px 3px -3px #666 !important;
    margin-top: 0 !important;
}

/* extend semantic-ui */

.ui.menu.squared {
    border-radius: 0;
}

.ui.menu.padded .item {
    line-height: 2.3;
}

.ui.menu.padded .item>i.dropdown.icon {
    margin-top: 0.7em;
}

.item a:hover {
    text-decoration: none;
}

/* override semantic-ui */

a.ui.disabled.step,
.ui.steps a.disabled.step,
a.ui.active.step,
.ui.steps a.active.step {
    cursor: pointer;
    text-decoration: none;
}

.ui .popup {
    z-index: 9999 !important;
}

abbr {
    border-bottom: 1px dotted #000;
    cursor: help;
}

.manageRow .ui.button {
    font-weight: normal;
    margin-bottom: 5px;
    text-transform: none;
}

.ui.overflow.selection.dropdown .menu {
    top: 100%;
    max-height: 312px;
    overflow-x: visible;
    overflow-y: visible;
}

#AjaxResponder {
    background-color: #fff;
    border: 1px solid #DDD;
    box-shadow: 5px 5px 15px -3px #93918A;
    border-radius: 7px;
    moz-border-radius: 7px;
    webkit-border-radius: 7px;
    top: 50%;
    left: 50%;
    /*margin-top:-15px;
	margin-left:-75px;*/
    color: #555555;
    padding: 0.7em;
    position: fixed;
    text-align: center;
    z-index: 1002;
}

#AjaxResponder img {
    vertical-align: middle;
}

/*.container { background-color:#FFF; }*/

.mainContainer {
    width: 970px;
    padding: 3em 0 0 0;
    margin: 5em auto 0 auto;
}

/*-border-radius:15px; -moz-border-radius:15px; -webkit-border-radius:15px; }*/

.fakecaps {
    font-size: smaller;
    text-transform: uppercase;
    color: #003770;
}

#top-menu-container {
    background: #0A69B2;
    /* url(/images/cubilt-logo.png) 1em -2.1em no-repeat;*/
    clear: both;
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 999;
}

ul#top-menu {
    list-style-type: none;
    position: relative;
    right: 0;
    padding: 0;
    margin: 0.5em 3em;
}

ul#top-menu li {
    /*background:#888; */
    border-radius: 0;
    color: #eee;
    float: right;
    margin: 0.5em 0 1em 0.5em;
    padding: 0.3em 1em;
    position: relative;
    right: 0;
    top: 0;
}

ul#top-menu li:hover {
    /*padding:0.5em 1em;*/
}

ul#top-menu li a {
    /*color:#eee;*/
    text-decoration: none;
}

#footer {
    background: #F2F2F2;
    border-top: 1px solid #e4e4e4;
    border-bottom: 1px solid #e4e4e4;
    bottom: 0;
    margin: 2.5em auto 0 auto;
    padding: 8px 0 7px 0;
    text-align: center;
    width: 100%;
}

a {
    color: inherit;
    text-decoration: none;
}

#footer a {
    margin: auto 2em;
}

#footer.home {
    margin-top: 0;
}

a:hover {
    color: inherit;
    text-decoration: underline;
}

.footer-hr {
    margin-top: 3em;
}

#logo-wrap {
    padding: 1em 0 3em 0;
}

.home-page #logo-wrap {
    padding: 6em 0 10em 0;
}

#home-splash-text {
    font-family: droid_serifregular, Arial, sans-serif;
    font-size: 2.6em;
    line-height: 1.2em;
    margin-bottom: 8em;
}

#home-splash-text p {
    margin-bottom: 0.4em;
}

button.call-to-action {
    background: transparent url(/images/bg/button-call-to-action.png) no-repeat;
    height: 77px;
    border: none;
    font-family: droid_serifbold, Arial, sans-serif;
    font-size: 0.8em;
    color: #FFF;
    text-align: center;
    cursor: pointer;
}

.home-page button.call-to-action {
    font-size: 0.6em;
}

button.call-to-action,
.find-out-more {
    width: 407px;
}

.find-out-more {
    font-family: droid_serifregular, Arial, sans-serif;
    font-size: 0.4em;
    text-align: center;
    margin-top: -0.3em;
}

.find-out-more a {
    text-decoration: none;
}

.full-width {
    position: absolute;
    left: 0;
    width: 100%;
}

.home-features {
    font-size: 1.4em;
}

.home-features h3 {
    margin-bottom: 0.25em;
}

.home-features.blurb {
    padding-top: 2.25em;
}

.home-features.img {
    text-align: center;
}

.home-features.img,
.home-features.blurb {
    margin-top: 2em;
    margin-bottom: 2em;
}

.ui.image.feature {
    max-height: 500px;
}

.upload-form {
    background: #DDD;
    border: 5px solid #777;
    display: block;
    padding: 2em;
    clear: both;
}

.upload-form label {
    font-size: 2em;
}

.upload-field {
    font-size: 1.5em;
    margin-left: 1em;
    float: right;
}

#upload-frame {
    width: 100%;
    height: 400px;
}

ul.filelist,
ul.filelist li {
    list-style-type: none;
    padding: 0.25em 0 0.25em 0;
}

#filename {
    width: 280px;
}

.lighter {
    color: rgba(0, 0, 0, 0.5);
}

/* pricing page */

.pricing-option {
    border: 1px solid #BBB;
    padding: 1em;
    text-align: center;
}

.pricing-option.secondary {
    padding-top: 2em;
}

.pricing-option h1 {}

.pricing-option h2 {
    margin-bottom: 0;
    line-height: 1em;
}

.pricing-option h3 {
    color: #999;
    font-size: 1.2em;
    font-weight: normal;
    line-height: 1em;
}

.pricing-option i.icon {
    margin: 0;
}

.pricing-option p {}

.pricing-option button {
    background: #6EBA10;
    border-radius: 5px;
    padding: 0.5em 1em;
    border: none;
    font-family: RockwellStdBold, Arial, sans-serif;
    font-size: 1.2em;
    font-weight: normal;
    color: #FFF;
    text-align: center;
    cursor: pointer;
    width: 70%;
}

/* control panel */

#addLabel,
#addFolder,
#addGroup,
#addProject,
.manageFile {
    background: #FFF;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #ddd;
    box-shadow: 3px 3px 3px #dddddd;
    padding: 0.5em 1em;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 999;
}

#addGroup input,
#addProject input,
#addFolder input,
#addLabel input {
    font-size: 1.3em;
}

.manageFile {
    display: inline-block;
    position: relative;
    z-index: 998;
}

.file-container {
    padding: 0em 0.5em 1em 0.5em;
}

.uploadForm {
    /* padding:0.5em 0; */
}

.label-list {
    background: #000;
    border-radius: 4px;
    color: #fff;
    font-size: small;
    opacity: 0.7;
    padding: 0.5em 1em;
    position: absolute;
    right: 0;
    top: 3.25em;
    z-index: 999;
}

/*
#notices {
	background-color:#ddd;
	border:1px solid #999;
	display:none;
	font-size:0.75em;
	max-height:450px; _height:450px;
	overflow-x:hidden;
	overflow-y:scroll;
	padding:10px;
	position:absolute;
	right:0;
	top:3.8em;
	width:225px;
	z-index:1000;
}
#notices a {
	color:#36B;
	text-decoration:underline;
}
#notices .noticePersonal {
	background:#fff; color:#333; border:1px solid #ddd; padding:10px;
	z-index:1000;
}
*/

.user-details-notices {
    clear: both;
    max-height: 450px;
    _height: 450px;
    overflow: scroll;
}

.inlineEditor {
    position: relative;
}

.inlineEditorMouseOver {
    /*background-color:#ffc;
	-moz-border-radius:3px;
	color:#000;*/
}

.inlineEditorLink {
    background-color: #F9EC00;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    display: inline;
    padding: 3px 10px;
    position: absolute;
    bottom: -10px;
}

.inlineEditorLink a {
    text-decoration: none;
}

.selectize-input {
    min-height: 37px;
}

.selectize-control.multi .selectize-input>div,
.comm-row .selectize-input .item,
.comm-row .selectize-input span,
.comm-row .selectize-input input span {
    background: none repeat scroll 0 0 #f2f2f2;
    border: 0 solid #d0d0d0;
    color: #303030;
    cursor: pointer;
    margin: 0 3px 3px 0;
    padding: 2px 6px;
}

/*    background-image: linear-gradient(to bottom, #5BBC72, #53BB6C);*/

.selectize-control.multi .selectize-input [data-value],
.comm-row .selectize-input .item,
.comm-row .selectize-input span,
.comm-row .selectize-input input span {
    background-color: #b2e567;
    background-image: linear-gradient(to bottom, #eee, #eee);
    background-repeat: repeat-x;
    border-radius: 3px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
    color: #555;
    /*font-family: "Helvetica Neue",Helvetica,Arial, sans-serif;*/
    font-size: 1.1em;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.1);
}

#form-include .ui.grid:first-child {
    margin-top: 1rem;
}

#form-include .ui.grid>.column {
    margin-bottom: 0rem;
    margin-top: 0rem;
}

.comm-row.ui.grid:first-child {
    margin-top: 0rem;
}

.comm-row.ui.grid>.column {
    margin-bottom: 0;
    margin-top: 0rem;
}

.comm-row.ui.grid>.column>textarea {
    margin-bottom: 2em;
}

.left-menu .ui.label .icon {
    margin: 0;
}

#notices .item,
#notices .item a {
    color: #000
}

#notices .item.dismiss-all {
    text-align: right;
    padding-top: 1.4em;
    padding-bottom: 0.6em;
    font-weight: bold;
}

.ui.yellow.buttons .button,
.ui.yellow.button,
.ui.yellow.labels .label,
.ui.yellow.label,
i.inverted.bordered.yellow.icon,
i.inverted.circular.yellow.icon {
    color: #333 !important;
}

.ui.yellow.buttons .button:hover,
.ui.yellow.button:hover,
.ui.yellow.labels .label:hover,
.ui.yellow.label:hover,
.ui.yellow.labels a.label:hover,
a.ui.yellow.label:hover,
a.ui.yellow.labels .label:hover {
    color: #000 !important;
}

.scrollbox {
    max-height: 5.5em;
    overflow-y: scroll;
    overflow-x: hidden;
}

#apply-changes {
    backface-visibility: hidden;
    bottom: 0;
    display: none;
    left: 0;
    position: fixed;
    width: 100%;
    z-index: 998;
}

/* must be in front of apply-changes */

.dropdown.active.visible {
    z-index: 999;
}

.ui.grid>.column.compact:not(.row),
.ui.grid>.row>.column.compact {
    padding-left: 0;
}

.ui.grid>.column.compact:not(.row)+.column.compact:not(.row),
.ui.grid>.row>.column.compact+.column.compact {
    padding-left: 1rem;
    padding-right: 0;
}

.ui.grid>.column.space-bottom:not(.row),
.ui.grid>.row>.column.space-bottom {
    margin-bottom: 3rem;
}

@media only screen and (max-width: 1058px) {
    .home-hero-wrapper {
        padding-bottom: 100%;
        min-height: 100vh;
    }
}