*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

body { font-family: 'Montserrat', sans-serif; font-size: 16px; margin: 0; padding: 0; background: #f5f5f5; color:rgba(0,0,0,.8)}

h1 { font-weight: 400; color: #008c97; font-size: 1.75em; }

header { background: #fff; position: fixed; width: 100%; top: 0; z-index: 999; -webkit-box-shadow: 0 0 60px 0 rgba(0,0,0,.2); box-shadow: 0 0 60px 0 rgba(0,0,0,.2); border-bottom: 1px solid rgba(0,0,0,.2); }
    header:after { content: ""; display: block; clear: both; }

.logOutContainer { text-align: right; padding-right: 1em; }
    .logOutContainer a { display: inline-block; font-weight: 700; color: #008c97; text-decoration: none; padding: 1em; }

.relative { position: relative; }

.appContainer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.centerTextOuterContainer { display: table; height: 100%; width: 100%; }
.centerTextContainer { display: table-cell; vertical-align: middle; }

.loginContainer { padding: 0 2em; margin: 0 auto; max-width: 400px;  }

.formContainer { position: relative; }

input[type="button"], input[type="submit"], .btn { background: #008c97; text-align: center; text-decoration: none; border: 0; display: block; width: 100%; color: #fff; text-transform: uppercase; padding: 1em 1.5em; font-family: 'Montserrat', sans-serif; font-weight: 700; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

button, input[type="submit"], input[type="button"], select, input[type="date"] { -webkit-appearance: none; }

/****  floating-Lable style start ***
.floating-label { position: relative; margin-bottom: 10px; }
.floating-input:focus, .floating-select:focus { outline: none; } 

label { color: #999; position: absolute; pointer-events: none; left: 10px; top: 50%; margin-top: -10px; transition: 0.2s ease all; -moz-transition: 0.2s ease all; -webkit-transition: 0.2s ease all; text-transform: none; font-weight: 400; }

.floating-input:focus ~ label, .floating-input:not(:placeholder-shown) ~ label, .activeLabel { top: 10px; font-size: .8em; color: #008c97; margin-top: 0; text-transform: uppercase; font-weight: 700; }
.floating-select:focus ~ label, .floating-select:not([value=""]):valid ~ label { top: 10px; font-size: .8em; color: #008c97; margin-top: 0; text-transform: uppercase; font-weight: 700; }

.evaluationQuestLabels {  font-size: 1em; margin-top: 0; font-weight: 400; margin-bottom: .5em; display: block; }

.floating-input:focus ~ .bar:before, .floating-input:focus ~ .bar:after, .floating-select:focus ~ .bar:before, .floating-select:focus ~ .bar:after { width: 50%; }
.floating-textarea { min-height: 30px; max-height: 260px; overflow: hidden; overflow-x: hidden; }
*/

/* Floating Labels */

.floating-label { display: block; position: relative; margin-bottom: 10px; }

    .floating-label label, .floating-label > span { position: absolute; left: 10px; top: 0.4em; cursor: text; font-size: 75%; font-weight: 400; opacity: 1; -webkit-transition: all .2s; transition: all .2s; }
    .floating-label select { -webkit-appearance: none; -moz-appearance: none; appearance: none; }
    .floating-label textarea { width: 100%; }
    .floating-label input:not([type="submit"]), .floating-label select, .floating-label textarea { width: 100%; padding: 24px 10px 10px; background:#fff; border: 1px solid #ccc; font-size: 1em; font-size: inherit; font-family: 'Montserrat', sans-serif; }
    
    .floating-label input::-webkit-input-placeholder, .floating-label select::-webkit-input-placeholder, .floating-label textarea::-webkit-input-placeholder { opacity: 1; -webkit-transition: all .2s; transition: all .2s; }
    .floating-label input::-moz-placeholder, .floating-label select::-moz-placeholder, .floating-label textarea::-moz-placeholder { opacity: 1; transition: all .2s; }
    .floating-label input:-ms-input-placeholder, .floating-label select:-ms-input-placeholder, .floating-label textarea:-ms-input-placeholder { opacity: 1; transition: all .2s; }
    .floating-label input::placeholder, .floating-label select::placeholder, .floating-label textarea::placeholder { opacity: 1; -webkit-transition: all .2s; transition: all .2s; }

    .floating-label input:placeholder-shown:not(:focus)::-webkit-input-placeholder, .floating-label select:placeholder-shown:not(:focus)::-webkit-input-placeholder, .floating-label textarea:placeholder-shown:not(:focus)::-webkit-input-placeholder { opacity: 0; }
    .floating-label input:placeholder-shown:not(:focus)::-moz-placeholder, .floating-label select:placeholder-shown:not(:focus)::-moz-placeholder, .floating-label textarea:placeholder-shown:not(:focus)::-moz-placeholder { opacity: 0; }
    .floating-label input:placeholder-shown:not(:focus):-ms-input-placeholder, .floating-label select:placeholder-shown:not(:focus):-ms-input-placeholder, .floating-label textarea:placeholder-shown:not(:focus):-ms-input-placeholder { opacity: 0; }
    .floating-label input:placeholder-shown:not(:focus)::placeholder, .floating-label select:placeholder-shown:not(:focus)::placeholder, .floating-label textarea:placeholder-shown:not(:focus)::placeholder { opacity: 0; }
    .floating-label input:placeholder-shown:not(:focus) + *, .floating-label select:placeholder-shown:not(:focus) + *, .floating-label textarea:placeholder-shown:not(:focus) + * { font-size: 100%; opacity: .5; top: 18px; left: 10px; pointer-events: none; }
    .floating-label input:focus, .floating-label select:focus, .floating-label textarea:focus { outline: none; border-color: #008c97; }
    .floating-label input:focus + label, .floating-label.read-only input:focus + label { color: #008c97; }
    .floating-label select { padding: 24px 10px 6px 6px; background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23333' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat right 0.5em bottom 0.25em; background-size: 8px 10px; }

/* Login */

.loginSecondary { margin-top: 2em; font-size: .8em; text-align: center; }
    .loginSecondary a { color: rgba(0,0,0,.5); text-decoration: none; }
        .loginSecondary a:hover { color: rgba(0,0,0,.8); text-decoration: none; }

/* General */

.mainContainer, .offlineContainer { padding: 75px .5em .5em .5em; }

p { line-height: 1.8em; }

.floatRight { float: right; }

.center { text-align:center;}

.left { text-align:left;}


fieldset { border-top: 1px solid #ccc; border-bottom: 0; border-left: 0; border-right: 0; margin: 1em 0; padding: 1em 0;}
    fieldset legend { text-transform:uppercase; font-weight: 700;}

.dashBtn-Big { display: block; padding: 2em 1em; background: #e35b00; color: #fff; text-decoration: none; text-align: center; border-radius: 7px; -moz-border-radius: 7px; }
    .dashBtn-Big img {width: 50px; height: auto; display:inline-block; text-align:center;}
    .dashBtn-Big span { display:block;}
    .dashBtn-Big span.title { font-size: 2.5em; font-weight: 700; position:relative; display:inline-block; text-transform:uppercase; }
        .dashBtn-Big span.title:before { width: 30px; height: 1px; background:#fff; content:""; display:block; position:absolute; left:-40px; top: 50%;}
        .dashBtn-Big span.title:after { width: 30px; height: 1px; background: #fff; content: ""; display: block; position: absolute; right: -40px; top: 50%; }

.dashBtn-Small { display: block; padding: 2em 1em; background: #008c97; color: #fff; text-decoration: none; text-align: center; border-radius: 7px; -moz-border-radius: 7px; }
    .dashBtn-Small img { width: 50px; height: auto; display: inline-block; text-align: center; }
    .dashBtn-Small span { display: block; }
        .dashBtn-Small span.title { font-size: 1em; font-weight: 700; position: relative; display: inline-block; text-transform: uppercase; margin-top: 1em; }
            

.clearAfter:after { content:""; display:block; clear:both;}
.width50 { width: 48%; float:left;}
.width50:nth-child(2) { width: 48%; float: right; }

.marginBot1em { margin-bottom: 1em;}

.QueueTitle { font-size: .8em; border-bottom: 1px solid #ccc; color:#999; padding-bottom: 1.2em; margin-bottom: 1.2em; margin-top: 2em;}

.questionContainer { margin: 0 0 1em;}

.textareaComments{ height:150px;}

.evaluationThankYou, .note { display: none; }

.invalid{ 
    border-color:red!important;
}

.siteEvalHistory { border-bottom: 1px solid #ccc; padding: 0 0 1em 0; margin: 0 0 1em 0; }
    .siteEvalHistory span { display:block; font-size: .8em;}

.login span{ color:#008c97; padding-top:1em; text-align: center; display:block;}

.errors{ color:red; padding-top:1em; text-align: left; display:block;}

.logout{ margin-top:0.5em;}

#lnkIos, #lnkAndroid {display:block; max-width: 310px; color:#fff; background:#008c97; padding: .5em; text-decoration: none; border-radius: 5px; -moz-border-radius: 5px; margin: 0 auto;}

.k-datepicker{ 
    width: 100%;
    
}

/* KENDO DATE PICKERS */
.k-datepicker {
    font-family: 'Open Sans', sans-serif;
    font-size: 1em;
    max-width: 650px;
    width: 100%;
    left: 0px !important;
    padding: 0px 0px 0px 0px !important;
}

    .k-datepicker input[type="text"] {
        padding: inherit;
        height: 3.5em;
        border: #c0c0c0;
    }

/* KENDO DATE TIME PICKERS */
.k-datetimepicker {
    font-family: 'Open Sans', sans-serif;
    font-size: 1em;
    max-width: 650px;
    width: 100%;
}

    .k-datetimepicker input[type="text"] {
        padding: inherit;
        height: 3.5em;
        border: #c0c0c0;
    }

.k-picker-wrap{

    border-width:0px !important;
    padding-right: 1.25em !important;
}

.k-i-calendar{
    background: transparent url(../lib/Default/sprite.png) no-repeat 0 50%;
    display: inline-block;
    width: 16px;
    height: 16px;
    vertical-align: middle;
    margin-right: 3px;
}

.datePicker{
    font-size:1em !important;
}

.imagePreview {
	width: 100%;
}

.removeImageBtn {
	width: 50% !important;
	padding: 0.5em !important;
	margin: 0.5em 0px !important;	
}

#gallery{
	text-align: center;
}

.galleryImage{
	width: 30% !important;
	margin: 0.3em !important;
}
