/* ------------------------------------  Global styles  ------------------------------------ */

.vspace02 { clear: both; height: 2px; }
.vspace05 { clear: both; height: 5px; }
.vspace10 { clear: both; height: 10px; }
.vspace15 { clear: both; height: 15px; }
.vspace20 { clear: both; height: 20px; }
.vspace30 { clear: both; height: 30px; }
.vspace40 { clear: both; height: 40px; }
.vspace50 { clear: both; height: 50px; }

.hspace20 { clear: both; width: 20px; }

button:focus { outline: 0; }

body { background: #c9cbcc; color: black; font-family: 'Tahoma', sans-serif; font-size: 14px; }

/* Top titles on public pages */
h1 { color: #5d6770; font-family: 'effra-bold', sans-serif; font-size: 1.5em; letter-spacing: -0.25px; margin: 0; padding: 30px 0 20px 0; text-rendering: geometricPrecision; }
h2 { color: #5d6770; font-family: 'effra-bold', sans-serif; font-size: 1.5em; letter-spacing: -0.25px; margin: 0; padding: 10px 0 15px 0; text-rendering: geometricPrecision; }
/* Top and subtitles on amdin pages */
h3 { color: #5d6770; font-size: 1.1em; margin: 0; padding: 30px 0 20px 0; font-weight: bold; }
h4 { color: #5d6770; font-size: 1.1em; margin: 0; padding: 10px 0 20px 0; font-weight: bold; }
/* Bold subtitles */
h5 { color: black; font-size: 1.1em; margin: 0; padding: 20px 0 10px 0; font-weight: bold; }
h6 { color: black; font-size: 1.1em; margin: 0; padding: 0 0 10px 0; font-weight: bold; }
/* Generic text highlight */
.gym-hl-red { color: #da242e; }

/* Customize bs - grid margins */
.row { margin-left: 0; margin-right: 0; }

/* Customize bs - form control styles */
.form-control { color: black; border-radius: 2px; padding-left: 8px; }
select.form-control { padding-left: 3px; }
.form-control:active, .form-control:focus {
    border-color: #5d6770;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
}
.form-control.audience {
    display: inline-block;
    height: auto;
    margin: 0 30px 0 4px;
    padding: 4px 12px 5px 4px;
    width: 200px; }
.form-control.popup {
    display: inline-block;
    height: auto;
    margin: 0;
    padding: 4px 12px 5px 4px;
}

.form-inline td { padding-right: 16px; display: inline-block; margin-left: 10px }

@font-face {
    font-family: 'glyphicons-halflings-regular';
    src: url('../fonts/glyphicons-halflings-regular.ttf') format('truetype');
}
/* Customize bs - Links */
a { color: #206099; cursor: pointer; text-decoration: none; }
a:hover { color: #4b88bb; text-decoration: underline; }

/* Customize bs - Top menu buttons */
.btn-group > button {
    background: #f2f4f6;
    border-radius: 2px;
    padding: 4px 8px 5px 11px; 
}
.btn-group.open .dropdown-toggle {
    box-shadow: inset 0 0 0 rgba(0,0,0,.125);
    -webkit-box-shadow: inset 0 0 0 rgba(0,0,0,.125);
}
.btn-group .dropdown-toggle:active, .btn-group.open .dropdown-toggle:active {
    box-shadow: inset 0 0 0 rgba(0,0,0,.125) ;
    -webkit-box-shadow: inset 0 0 0 rgba(0,0,0,.125);
}
#btnNavigateMenuForAdmin { border-radius: 2px 0 0 2px; }

/* Customize bs - Top menu dropdown */
.dropdown-menu { border-radius: 2px; }
.dropdown-menu > li > button { background: transparent; border: 0; padding: 3px 12px 5px; text-align: left; white-space: nowrap; width: 100%; }
.dropdown-menu > li > button:hover { background: rgba(0,0,0,.125); }
.dropdown-menu > li > button:disabled { background: transparent; color: #999; }
.dropdown-menu .divider { height: 1px; margin: 5px 0; }
li.gym-name-usr { color: #5d6770; padding: 3px 12px 5px; white-space: nowrap; }

/* Required for context menu dropdown */
#context-menu > .dropdown-menu { position: relative; }

p { padding-bottom: 10px }

/* Form wrappers */
.gym-form-user {
    background: #eceeee;
    border-radius: 4px;
    padding: 30px 5px;
}
.gym-form-user select { font-size: 1.2em; height: 40px; }

.gym-form-admin {
    background: #eceeee;
    border-radius: 4px;
    padding: 15px 5px 25px;
}

/* Custom errors */
#errorMessageContainer {
    color: #f40009;
    display: block;
    text-align: center;
    width: 100%;
}

/* ------------------------------------  Simple header  ------------------------------------ */

.gym-header-table {
	/* position: fixed; z-index: 3001; */ /* Sticks it */
	background: white;
	box-shadow: 0 2px 3px rgba(0,0,0,.08);
	display: table;
	height: 60px;
	margin: 0 0 20px 0;
	/* min-width: 480px; */
	width: 100%;
}
.gym-header-table > div { display: table-cell; vertical-align: middle; }
.gym-header-table > div:nth-child(1) { background: white; width: 240px; }
.gym-header-table > div:nth-child(2) { background: white; width: auto; }
.gym-header-table > div:nth-child(3) { background: white; width: 240px; }

.gym-logo-cchbc {
	background: white url('../img/kampass_sprite.png') no-repeat 0 0;
	background-size: 500px 500px;
	float: left;
	height: 60px;
	width: 240px;
}
/* Replace CCH logo with Trinity under 380px */
@media ( max-width: 380px ) {
    .gym-logo-cchbc {
	width: 45px;
    }
}

.gym-logo-large {
	background: white url('../img/kampass_sprite.png') no-repeat 0 -60px;
	background-size: 500px 500px;
	height: 60px;
	margin: auto;
	width: 200px;
}
.gym-logo-small {
	background: white url('../img/kampass_sprite.png') no-repeat 0 -120px;
	background-size: 500px 500px;
	float: right;
	height: 30px;
	margin-right: 8px;
	width: 70px;
}
/* Make the TEMOS logo disappear under 460px */
@media ( max-width: 460px ) {
    .gym-logo-small {
	width: 0;
    }
}

.gym-menu-wrap { padding-right: 15px; }

/* -------------------------------------  Containers  ------------------------------------- */

/* Main container centered */
.gym-container {
	/* position: relative; top: 80px; */ /* For sticky header */
	/* min-width: 480px; */
	margin: auto;
}
/* Limit container width for both gym-container */
.gym-container.limitx { max-width: 1500px; }

/* Main container margins */
.gym-block-wrap {
	background: white;
	border-radius: 4px;
	box-shadow: 0 2px 3px rgba(0,0,0,.08);
	margin: 0 10px; 
	padding-bottom: 35px;
}

/* Side padding adjustment */
/* 20 (15+5) pixels on both sides */
@media ( max-width: 991px ) {
	.gym-block-row { padding: 0 5px; }
}
/* 40 (15+25) pixels on both sides */
@media ( min-width: 992px ) {
	.gym-block-row { padding: 0 25px; }
}

.gym-block-divider {
	background-image: repeating-linear-gradient(90deg, #8e9090 1px, white 2px, white 5px);
    clear: both;
	height: 3px;
	line-height: 2px;
	margin: 0;
}

.gym-foot-wrap {
	color: #6c767e;
	font-size: .9em;
	margin: 0 10px; 
	padding: 20px 10px;
    text-align: center;
}
.gym-foot-wrap span {
    color: #a0a6aa;
    padding: 0 10px;
}
/*@media ( min-width: 768px ) {
	.gym-foot-wrap > div:first-child { float: left; }
	.gym-foot-wrap > div:last-child { float: right; }
}*/

.gym-block-head {
	background: #6c767e;
	border-radius: 4px 4px 0 0;
	color: white;
	height: 40px;
	width: 100%;
}
.gym-block-title {
	background: #6c767e;
	color: white;
	font-family: 'effra-regular', sans-serif; font-size: 36px;
	min-height: 80px;
	letter-spacing: -0.25px;
    line-height: 1em;
    padding: 20px 10px 20px 18px;
    text-rendering: geometricPrecision;
	width: 100%;
}

/* Side padding adjustment */
@media ( min-width: 992px ) {
	.gym-block-title { padding-left: 38px; } /* 40-2px for for the first character */
}
@media ( min-width: 992px ) {
	.gym-block-title { background: #6c767e url('../img/kampass_sprite.png') no-repeat right -160px; background-size: 500px 500px; }
}

.gym-head-status {
	float: left;
	padding: 0 20px; 
}
.gym-head-status > span {
	float: left;
	margin: 10px 20px 0 0;
}
.gym-head-status span {
    padding-right: 5px;
}
.gym-head-right { float: right; }

.gym-head-picture {
    width: 160px; height: 80px; float: right;
    background: url('../img/kampass_sprite.png') no-repeat 0 -180px;
    background-size: 500px 500px
}

/* For admin */

.gym-titleside-wrap {
    padding-top: 18px;
    padding-bottom: 18px;
    text-align: right;
}

.gym-popup-display {
    width: 100%;
}
.gym-popup-display td {
    /*border: 1px solid green;*/
    padding: 6px 0 6px 20px;
}
.gym-popup-display td:first-child  {
    width: 28.5%;
}

.gym-popup-form {
    background: #eceeee;
    border-radius: 4px;
    width: 608px;
}
.gym-popup-form td {
    /*border: 1px solid orange;*/
    padding: 4px 0 4px 20px;
}
.gym-popup-form td:first-child  {
    width: 28.5%;
}

/* ----------------------------------  Application buttons & icons   ---------------------------------- */

.gym-btn-primary {
    border: 0;
    border-bottom: #dcdee0 1px solid;
    border-radius: 4px;
    background: #eceeee;
    color: #2d3338;
    font-family: 'Tahoma', sans-serif;
    font-size: 1.25em;
    font-weight: bold;
    height: 40px;
    line-height: 0px;
    margin: 5px 0;
    padding: 18px 40px 20px 30px;
}
.gym-btn-primary .gym-btn-ico:before { font-size: 0.9em; }

.gym-btn-secondary {
    border: 0;
    border-bottom: #dcdee0 1px solid;
    border-radius: 2px;
    background: #eceeee;
    color: #2d3338;
    font-weight: bold;
    margin: 5px 0;
    padding: 5px 25px 5px 20px;
}

.gym-btn-primary:hover,
.gym-btn-secondary:hover {
    background: #dadcde;
    border-bottom-color: #ccced0;
    color: black;
}
.gym-btn-primary .gym-btn-ico:before,
.gym-btn-secondary .gym-btn-ico:before {
    color: rgba(244,0,9,.25);
    font-weight: normal;
    margin-right: 4px;
}
.gym-btn-primary:hover .gym-btn-ico:before,
.gym-btn-secondary:hover .gym-btn-ico:before {
    color: rgba(244,0,9,80);
}

.gym-btn-primary:disabled,
.gym-btn-secondary:disabled,
.gym-btn-primary:disabled:hover,
.gym-btn-secondary:disabled:hover{
    background: #eceeee;
    color: #aab0ba;
    cursor: not-allowed;
}
.gym-btn-primary:disabled .gym-btn-ico:before,
.gym-btn-secondary:disabled .gym-btn-ico:before,
.gym-btn-primary:disabled:hover .gym-btn-ico:before,
.gym-btn-secondary:disabled:hover .gym-btn-ico:before{
    color: rgba(244,0,9,.25);
}


.gym-btn-extra {
    border: 0;
    border-radius: 4px;
    background: #5d6770;
    color: white;
    font-family: 'Tahoma', sans-serif;
    font-size: 1.25em;
    font-weight: bold;
    margin: 5px 0;
    padding: 8px 50px 10px 50px;
}
.gym-btn-extra:hover {
    background: #6c767e;
}

.gym-btn-sidebar {
    border: 0;
    border-radius: 2px;
    background: #5d6770;
    color: white;
    font-weight: bold;
    margin: 5px 0;
    overflow: hidden;
    padding: 5px 5px 5px 5px;
    width: 130px;
}
.gym-btn-sidebar:active,
.gym-btn-sidebar:hover {
    background: #6c767e;
}
.gym-btn-sidebar:active {
    padding: 6px 5px 4px 5px;
}

.gym-btn-devfeature {
    border: 0;
    border-bottom: #fdccce 1px solid;
    border-radius: 2px;
    background: #fee0e2;
    color: #2d3338;
    font-weight: bold;
    margin: 5px 0;
    padding: 5px 20px;
}
.gym-btn-devfeature:hover {
    background: #fcc2c4;
    border-bottom-color: #fbadb0;
    color: black;
}

.gym-btn-ico:before { vertical-align: baseline; }

.gym-ico-lgin:before { content: "\e100"; color: black; font-family: 'kendo-ui'; font-size: 1.1em; line-height: 00px; margin-left: -3px; }
.gym-ico-open:before { content: "\e012"; color: black; font-family: 'kendo-ui'; font-size: .70em; line-height: 10px; margin-left: -3px; }
.gym-ico-home:before { content: "\e212"; color: black; font-family: 'kendo-ui'; font-size: .95em; line-height: 10px; margin-left: -3px; margin-right: 2px; }
.gym-ico-hamb:before { content: "\e0f1"; color: black; font-family: 'kendo-ui'; font-size: .95em; line-height: 10px; margin-left: -3px; }
.gym-ico-user:before { content: "\e219"; color: black; font-family: 'kendo-ui'; font-size: .95em; line-height: 00px; margin-left: -3px; }
.gym-ico-addu:before { content: "\e039 \e319"; color: black; font-family: 'kendo-ui'; font-size: .8em; line-height: 00px; letter-spacing: -2px; }
.gym-ico-okok:before { content: "\e030"; color: black; font-family: 'kendo-ui'; font-size: .95em; line-height: 00px; }
.gym-ico-nono:before { content: "\e031"; color: black; font-family: 'kendo-ui'; font-size: .95em; line-height: 00px; }
.gym-ico-cncl:before { content: "\e038"; color: black; font-family: 'kendo-ui'; font-size: .95em; line-height: 00px; }
.gym-ico-chck:before { content: "\e037"; color: black; font-family: 'kendo-ui'; font-size: 1.1em; line-height: 00px; }
.gym-ico-rprt:before { content: "\e050"; color: black; font-family: 'kendo-ui'; font-size: 1.05em; line-height: 00px; }
.gym-ico-mail:before { content: "\e099"; color: black; font-family: 'kendo-ui'; font-size: 1.0em; line-height: 00px; }
.gym-ico-edit:before { content: "\e20a"; color: black; font-family: 'kendo-ui'; font-size: 1.05em; line-height: 00px; }
.gym-ico-view:before { content: "\e21e"; color: black; font-family: 'kendo-ui'; font-size: 1.0em; line-height: 00px; }
.gym-ico-prnt:before { content: "\e07e"; color: black; font-family: 'kendo-ui'; font-size: 1.0em; line-height: 00px; }
.gym-ico-save:before { content: "\e0bd"; color: black; font-family: 'kendo-ui'; font-size: 1.0em; line-height: 00px; }
.gym-ico-warn:before { content: "\e0fa"; color: black; font-family: 'kendo-ui'; font-size: 1.1em; line-height: 00px; margin-right: 4px; }
.gym-ico-xprt:before { content: "\e075"; color: black; font-family: 'kendo-ui'; font-size: 1.0em; line-height: 00px; }
.gym-ico-tipp:before { content: "\e092"; color: #5d6770; font-family: 'kendo-ui'; font-size: 1.15em; line-height: 00px; margin-right: 2px; }
.gym-ico-filter:before { content: "\e06c"; color: #5d6770; font-family: 'kendo-ui'; font-size: 1.1em; line-height: 00px; letter-spacing: -7px; vertical-align: middle}
.gym-ico-bulk:before { content: "\e0eb"; color: #5d6770; font-family: 'kendo-ui'; font-size: 1.1em; line-height: 00px; letter-spacing: -2px; }
.gym-ico-upload:before { content: "\e0c6"; color: black; font-family: 'kendo-ui'; font-size: 1.0em; line-height: 00px; }
.gym-ico-del:before { content: "\e0c3"; color: black; font-family: 'kendo-ui'; font-size: 1.0em; line-height: 00px; }
.gym-ico-chevron-up:before    { content: "\e001"; font-family: 'kendo-ui'; font-size: 1.0em; line-height: 00px; }
.gym-ico-chevron-down:before  { content: "\e002"; font-family: 'kendo-ui'; font-size: 1.0em; line-height: 00px; }

.gym-ico-inf1, .gym-ico-inf2 { display: block; float: left; height: 20px; width: 20px; }
.gym-ico-inf1:before { content: "\e313"; color: #da242e; font-family: 'kendo-ui'; font-size: 1em; font-weight: normal; line-height: 00px; margin-right: 5px; }
.gym-ico-inf2:before { content: "\e307"; color: #da242e; font-family: 'kendo-ui'; font-size: 1em; font-weight: normal; line-height: 00px; margin-right: 5px; }

.gym-ico-open { background: white; border-radius: 8px; display: inline-block; height: 12px; line-height: 0;	margin-left: 5px; vertical-align: middle; width: 12px; }

.gym-ico-shield {
    display: inline-block;
    float: left;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAVCAIAAADEqSm4AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAPlJREFUeNpi/LN525/NWxlIAcwOdiz/nz3/f+sOSdr+MjCw4JFmVFNBE4FbgE8bW08HIy8PQs/nLz/9QiBsJgaywKi2gdTGyMvLxIAUoQTA8+dQq9RUmZgdbInU9Wf5Kqg2Y0MmRklJYnQC9fw9cBiqB4hA6bIonxGvU4F6/syaB/YVD2taEjRIgBy2nnasOoHJ93fvRIgeUE6LDGNUUwVp+f//PyxT3P5VUglUB9fDWl/9Z9bc/89fQIxmSUtm9vGEBiZcG0jn8+e/eyf9O3seM+OxFedD7MGiDeH75avg1rJEhoHchuoFLNogXgLpfP6cBeYZNAAQYABwhGZQtBfF+gAAAABJRU5ErkJggg==');
    background-repeat: no-repeat;
    background-position-y: 2px;
    width: 18px;
    height: 25px;
}

button.dropdown-toggle:hover .gym-ico-open { background: rgba(244,0,9,.80); color: white; }
button.dropdown-toggle:hover .gym-ico-open:before { color: white; }

.gym-ico-open.chromefix { position: absolute; right: 0; } /* These styles are required to display the icon on Chrome, in incognito mode or when cache is empty and the arrow character doesn't show up. */
.gym-ico-open.chromefix:before { color: white; }

.btn--dash--expand { border: none; background: none }
.gym-ico-chevron-down { color: rgba(244,0,9,.5); }
.gym-ico-chevron-up { color: rgba(244,0,9,.5); }
.btn--dash--expand:hover h3 { color: black; }
.btn--dash--expand:hover h3 span { color: rgba(244,0,9,1); }

div[templated-id="toggledContent"] { display: none }

div.k-upload {background: #efefef; border: #d1d1d1 2px dashed;}
div.k-dropzone em { color:#999999; visibility: visible; display: block; padding-top: 51px; text-align: center; font-size: 0.85em } /* Drag and drop textblock */
.k-upload-status { position: absolute; top: 8px; right: 12px; font-weight: normal; color: #555 !important }


/* ----------------------------------------  My Surveys view  ----------------------------------------- */

/* Format dashboard table rows */
.gym-dashboard-wrap > div { 
    background: #eceeee;
    border-bottom: #dcdee0 1px solid;
    border-top: white 1px solid;
    padding: 5px 5px 6px;
}
.gym-dashboard-wrap > div:first-child { border-top-left-radius: 5px; border-top-right-radius: 5px; }
.gym-dashboard-wrap > div:last-child { border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; }

/* Format dashboard table contents */
.gym-dashboard-wrap > div > div > span,
.gym-dashboard-wrap > div > div > button { 
    background: transparent;
    border: 0;
    font-size: 1.2em;
    padding: 0;
}
@media ( min-width: 768px ) {
    .gym-dashboard-date { float: right; }
}
.gym-dashboard-label { color: #5c666f; }
.gym-dashboard-label > span { padding-right: 8px; }
.gym-dashboard-comp, .gym-dashboard-conf { border-radius: 4px; color: black; min-width: 60px; padding: 0 8px; text-align: center; }
    .gym-dashboard-comp { background: #e0dec0; display: inline-block; margin-right: 40px; }
    .gym-dashboard-conf { background: #f9dea0; display: inline-block; }
@media ( min-width: 1200px ) {
    .gym-dashboard-center { text-align: center; }
}

/*.gym-dashboard-wrap > div:hover { background: #e4e6e8; }*/
.gym-dashboard-wrap > div > div { line-height: 2.5em; }

.gym-dashboard-wrap > div > div > button { color: #206099; text-align: left; }
.gym-dashboard-wrap > div > div > button > .gym-ico-edit:before { color: rgba(244,0,9,.45); }
.gym-dashboard-wrap > div > div > button:hover > .gym-ico-edit:before { color: rgba(244,0,9,.90); }
.gym-dashboard-wrap > div > div > button > .gym-ico-rprt:before { color: rgba(93,103,112,.45); }
.gym-dashboard-wrap > div > div > button:hover > .gym-ico-rprt:before { color: rgba(93,103,112,.90); }
.gym-dashboard-wrap > div > div > button:hover > span:nth-child(2) { color: #4b88bb; text-decoration: underline; }

/* ---------------------------------------  Instructions view  ---------------------------------------- */

@media ( min-width: 992px ) {
	.gym-intro-illustration { background: url('../img/kampass_sprite.png') no-repeat right -240px; background-size: 500px 500px; }
    .gym-intro-lead { font-size: 1.2em; }
}

.gym-intro-well { 
    background: #eceeee;
    border-radius: 4px;
    box-shadow: inset 0 1px 5px rgba(0,0,0,.08);
    padding: 20px;
    vertical-align: top;
    width: 50%;
}
@media ( max-width: 767px ) {
    .gym-intro-well, .gym-intro-spacer { display: block; width: 100%; }
}

.gym-intro-numlist {
    padding-top: 20px;
}
.gym-intro-numlist > div { float: left; }
.gym-intro-numlist > div:first-child { 
    background: #b4b8bc;
    border-radius: 50%;
    color: white;
    font-weight: bold;
    height: 24px;
    line-height: 24px;
    margin-right: 8px;
    margin-top: -3px;
    text-align: center;
    width: 24px;
}
.gym-intro-numlist > h6 {
    margin-bottom: 10px;
}

.gym-intro-figures {
    padding: 0 30px;
}

.gym-intro-fig01 {
    background-color: #eceeee;
    background-position: center 0;
    background-repeat: no-repeat;
    background-size: 290px 210px;
    border-radius: 4px;
    clear: both;
    height: 70px;
    margin: 0 0 10px 0;
    width: 100%;
}
.gym-intro-fig02 {
    background-color: #eceeee;
    background-position: center -70px;
    background-repeat: no-repeat;
    background-size: 290px 210px;
    border-radius: 4px;
    height: 70px;
    margin: 0 0 10px 0;
    width: 100%;
}
.gym-intro-fig03 {
    background-color: #eceeee;
    background-position: center -140px;
    background-repeat: no-repeat;
    background-size: 290px 210px;
    border-radius: 4px;
    height: 70px;
    margin: 0 0 10px 0;
    width: 100%;
}

.gym-intro-fig01, .gym-intro-fig02, .gym-intro-fig03 { background-image: url('../img/kampass_figures_en-GB.png'); }

/* Styles for localizing survey instruction figures
.fig01-bg-BG, .fig02-bg-BG, .fig03-bg-BG,
.fig01-cz-CZ, .fig02-cz-CZ, .fig03-cz-CZ,
.fig01-de-DE, .fig02-de-DE, .fig03-de-DE,
.fig01-el-GR, .fig02-el-GR, .fig03-el-GR,
.fig01-en-GB, .fig02-en-GB, .fig03-en-GB,
.fig01-et-EE, .fig02-et-EE, .fig03-et-EE,
.fig01-hr-HR, .fig02-hr-HR, .fig03-hr-HR,
.fig01-hu-HU, .fig02-hu-HU, .fig03-hu-HU,
.fig01-lt-LT, .fig02-lt-LT, .fig03-lt-LT,
.fig01-lv-LV, .fig02-lv-LV, .fig03-lv-LV,
.fig01-pl-PL, .fig02-pl-PL, .fig03-pl-PL,
.fig01-ro-RO, .fig02-ro-RO, .fig03-ro-RO,
.fig01-ru-RU, .fig02-ru-RU, .fig03-ru-RU,
.fig01-sl-SI, .fig02-sl-SI, .fig03-sl-SI,
.fig01-sr-RS, .fig02-sr-RS, .fig03-sr-RS,
.fig01-uk-UA, .fig02-uk-UA, .fig03-uk-UA,
*/
.fig01-fr-FR, .fig02-fr-FR, .fig03-fr-FR { background-image: url('../img/kampass_figures_fr-FR.png'); }
.fig01-it-IT, .fig02-it-IT, .fig03-it-IT { background-image: url('../img/kampass_figures_it-IT.png'); }

.gym-title-extra {
    background: #6c767e;
    border: 0;
    border-radius: 4px;
    color: white;
    font-family: 'effra-regular', sans-serif;
    font-size: 36px;
    margin: 0;
    padding: 15px 30px 20px;
    text-rendering: geometricPrecision;
}

/* -----------------------------------  Survey Questionnaire view  ------------------------------------ */

.gym-survey-container {
    display: table;
    width: 100%;
}

.gym-survey-column {
    border: 0;
    display: table-cell;
    width: 100%;
}

.gym-survey-sidebar {
    background: #eceeee;
    border: 0;
    display: table-cell;
    vertical-align: top;
    width: 160px;
}

#scrollSpy {
    background: transparent;
    width: 160px;
}
#gymSidebarNav { 
    background: transparent;
    top: 0;
    width: 160px;
    z-index: 3003;
}

#scrollSpy .nav-tabs {
    border: 0;
}

/* Table inside of a question */
.row.gym-survey-que table {
    font-size: 0.9em;
    font-weight: normal;
    margin-top: 10px;
    width: 90%;
}
.row.gym-survey-que table td {
    background: #f2f4f4;
    border: 1px #dcdee0 solid;
    padding: 2px 5px;
}
    .row.gym-survey-que table tr td:first-child,
    .row.gym-survey-que table tr:first-child { font-weight: bold; }
    .row.gym-survey-que table tr td:last-child { text-align: right; }

/* Sidebar nav & Sidebar nav mobile link styles */
#scrollSpy ul.nav-tabs {
    border-bottom: 0;
}
#scrollSpy ul.nav-tabs > li > a {
    background: transparent;
    border: 0;
    border-radius: 0;
    color: #5d6770;
    font-size: 0.9em;
    line-height: 1.2;
    margin:0;
    padding: 12px 10px 12px 15px;
}
#scrollSpy ul.nav-tabs > li > a:hover { background: rgba(108, 118, 126, 0.12); color: black; }
#scrollSpy ul.nav-tabs > li.active > a { background: #6c767e; color: white; }
.gym-survey-perc-bar {
    background: #996;
    display: block;
    height: 4px;
    margin: 4px 0 2px;
    width: 25%;
}
#scrollSpy ul.nav-tabs > li.active .gym-survey-perc-bar { background: #cc9; }
.gym-survey-perc-stat {
    color: #884;
    /*font-size: 11px;*/
}
.gym-survey-perc-stat span:before { color: #996; }
#scrollSpy ul.nav-tabs > li.active .gym-survey-perc-stat { color: white; }
#scrollSpy ul.nav-tabs > li.active .gym-survey-perc-stat span:before { color: #eceeee; }

.gym-sidebar-save,
.gym-sidebar-msg {
    padding-left: 15px;
    padding-right: 15px;
    width: 100%;
}
.gym-sidebar-msg div {
    background-color: #cce6f6;
    border: 1px #6c9cc4 solid;
    color: #4b88bb;
    font-size: 11px;
    padding: 4px;
    text-align: center;
    width: 130px;
}
.gym-sidebar-msg .gym-ico-chck:before {
    color: #4b88bb;
}

/* Set the top position of the pinned navbar 
#scrollSpy ul.nav-tabs.affix { top: 80px } */

/* Sidebar nav mobile */

.gym-survey-sidebar-mobile {
    height: 100%; /* 100% Full-height */
    width: 160px; 
    position: fixed; /* Stay in place */
    z-index: 2999; /* Stay on top */
    top: 0;
    right: -160px; /* -160px - change this with JavaScript */
    background-color: #eceeee;
    overflow-x: hidden; /* Disable horizontal scroll */
    padding-top: 0; /* Place content 60px from the top */
    transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
    /* box-shadow: -3px 0 3px rgba(0,0,0,.08); */
}
.gym-survey-sidebar-mobile a {
    display: block;
    color: #818181;
    font-size: 1em;
    text-decoration: none;
    transition: 0.3s;
    width: 160px;
}

.gym-survey-sidebar-open {
    background: rgba(108, 118, 126, .64);
    border-radius: 4px 0 0 4px;
    position: fixed;
    bottom: 2%;
    right: 0;
    z-index: 3004;
}
.gym-survey-sidebar-open:hover { background: rgba(108, 118, 126, 1); }
.gym-survey-sidebar-open span {
    cursor: pointer;
    display: block;
    padding: 15px 15px 15px 10px;
}
#gymSidebarNavMobileOpen:before { color: white; content: "\e013"; font-family: 'kendo-ui'; font-size: 1.25em; line-height: 0; }
#gymSidebarNavMobileClose:before { color: white; content: "\e010"; font-family: 'kendo-ui'; font-size: 1.25em; line-height: 0; }


/* Sections, Questions & Options */
h1 > span { color: #996; font-family: 'Tahoma', sans-serif; font-size: 14px; font-weight: bold; letter-spacing: normal; line-height: 25px; }
h1 > span:before { content: "\e09f"; color: #bb8; font-family: 'kendo-ui'; font-size: 1.2em; font-weight: normal; line-height: 00px; margin-right: 3px; }
.gym-survey-wrap h1 { padding-bottom: 0; }

/* Initialize layout for each question and option */
.gym-survey-que, .gym-survey-opt {
    clear: both;
    margin-left: -15px;
    margin-right: -15px;
}

.gym-survey-que > div:nth-child(2) { font-weight: bold; }
.gym-survey-que { margin-bottom: 10px; }
.gym-survey-opt { margin-bottom: 5px; }
.gym-survey-que > div:first-child, .gym-survey-opt > div:first-child {
    max-width: 50px !important;
}
.gym-survey-opt > div:first-child, .gym-survey-opt > div:nth-child(2) { padding-bottom: 4px; padding-top: 4px; }
.gym-survey-que .lbl span { color: #b0b4b6; margin: 0 10px; }
.gym-survey-opt .btn-group { margin-right: 10px; }

/* Answer display for desktop view */
@media (min-width:992px) {
	.row.gym-survey-que > div:nth-child(3), .row.gym-survey-opt > div:nth-child(3) { text-align: center }
}

/* Answer display for mobile & tablet portrait views */
@media (max-width:991px) {
	/*.gym-survey-opt > div:nth-child(3) { padding-left: 65px; }*/
    .gym-survey-opt > div:nth-child(3) {
        text-align: center;
    }
}

/* Generic Survey Button Styles */
.gym-survey-btn-tf button, .gym-survey-btn-cc button { 
    background: white;
    border: 1px #ccc solid;
    display: inline-block;
    float: left;
    line-height: 1.5;
}
    .gym-survey-btn-tf button { padding: 3px 10px 2px; }
    .gym-survey-btn-cc button { padding: 3px 4px 2px; }

.gym-survey-btn-tf button[disabled], .gym-survey-btn-cc button[disabled] {
    box-shadow: inset 0 2px 4px rgba(0,0,0,.12);
    -webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,.12); 
} 
.gym-survey-btn-tf button:hover, .gym-survey-btn-cc button:hover { background: #f2f3f4; }

/* True or False Buttons */
.gym-survey-btn-tf { display: inline-block; margin-right:15px; position: relative; vertical-align: middle; }
.gym-ico-true:before { content: "\e030"; color: #858585; font-family: 'kendo-ui'; font-size: 1.15em; line-height: 0; }
.gym-ico-fals:before { content: "\e031"; color: #858585; font-family: 'kendo-ui'; font-size: 1.15em; line-height: 0; }

.gym-survey-btn-tf button:first-child { border-radius: 4px 0 0 4px; }
.gym-survey-btn-tf button:first-child[disabled] { background: #dedcbe; }
.gym-survey-btn-tf button:first-child[disabled] > span:before { color: #663; }

.gym-survey-btn-tf button:last-child { border-radius: 0 4px 4px 0; border-left: none; }
.gym-survey-btn-tf button:last-child[disabled] { background: #edd0d0; }
.gym-survey-btn-tf button:last-child[disabled] > span:before { color: #da242e; }

/* Competence and Confidence Buttons */
.gym-survey-btn-cc { display: inline-block; position: relative; vertical-align: middle; }

.gym-survey-btn-cc button:first-child { border-radius: 4px 0 0 4px; border-right: none; }
.gym-survey-btn-cc button:last-child { border-radius: 0 4px 4px 0; border-left: none; }
.gym-survey-btn-cc button[disabled] { background: #dadcdc; }

.gym-survey-btn-cc button > span { 
    background: url('../img/kampass_levels.png') no-repeat top center;
    background-size: 20px 60px;
    float: left;
    height: 20px;
    margin-bottom: 2px;
    margin-top: -1px;
    width: 24px;
}
.gym-survey-btn-cc button:nth-child(2) > span { background-position: 0 -20px; }
.gym-survey-btn-cc button:nth-child(3) > span { background-position: 0 -40px; }


/* Manager e-mail form */
.gym-form-manager-wrap {
    margin: 0 auto;
}
@media ( min-width: 768px ) {
    .gym-form-manager-wrap { max-width: 85%; }
}
@media ( min-width: 1200px ) {
    .gym-form-manager-wrap { max-width: 55%; }
}
.gym-form-manager-title {
    font-weight: bold;
}
.gym-ico-info:before { content: "\e0f9"; color: #5d6770; font-family: 'kendo-ui'; font-size: 1em; line-height: 00px; margin-right: 2px; }
.gym-form-manager-info {
    color: #666;
    font-size: 0.9em;
    line-height: 1.4em;
}

/* --------------------------------- Survey Questionnaire Read-only ---------------------------------- */

#questionGroupsContainer { padding-bottom: 30px; }

#answerContainer span[iscorrect="0"], 
#answerContainer span[iscorrect="1"], 
#answerContainer span[confidencelevel="0"],
#answerContainer span[confidencelevel="50"],
#answerContainer span[confidencelevel="100"] {
    border-radius: 2px;
    line-height: 1.5;
    overflow: hidden;
    padding: 2px 0;
    text-align: center;
    width: 85px;
    white-space: nowrap;
}

#answerContainer span[iscorrect="0"],
#answerContainer span[iscorrect="1"] { background: #efeedf; border: 1px #cecdbe solid; }

#answerContainer span[confidencelevel="0"],
#answerContainer span[confidencelevel="50"],
#answerContainer span[confidencelevel="100"] { background: #fffaeb; border: 1px #f9dea0 solid; }

/* ---------------------------------- Survey Questionnaire Preview ----------------------------------- */

/* setup container */
.gym-survey-preview {
    border: 1px #dbdbdb solid;
    height: 578px;
    padding-bottom: 30px;
    overflow-y: scroll;
    overflow-x: hidden;
    width: 990px;
}

/* Disable sidebar */
.gym-survey-preview .gym-survey-sidebar, .gym-survey-preview .gym-survey-sidebar-mobile { display: none; }
/* Adjust side padding */
.gym-survey-preview .gym-block-row { padding: 0 30px 0 0; }
/* Adjust intro columns */
.gym-survey-preview .gym-intro-figures .col-md-4 { width: 29.5%; }
/* Adjust question column width */
.gym-survey-preview .row.gym-survey-que .col-xs-10.col-md-7 { width: 84.5%; }

/* -------------------------------------  User Managemment view  -------------------------------------- */

.command-custom-visible { }
.command-custom-hidden { display:none }

/* ----------------------------------------  Survey Edit view  ---------------------------------------- */
#surveyForm label {
    margin-top: 10px;
}

#surveyForm .k-widget.k-datepicker {  }
#surveyForm .k-widget.k-datepicker.k-header input { font-size: 1.2em; height: 27px; text-indent: 0.4em }
#surveyForm .k-widget.k-datepicker .k-select { line-height: 2.4em; border-color: #ccc }
.k-picker-wrap { border-color: #ccc !important; border-radius: 2px !important }
.k-picker-wrap >  { border-color: #ccc !important }
.k-calendar { font-size: 1.2em }
.k-picker-wrap .k-state-selected { background:red !important }
.k-calendar .k-link.k-nav-fast { font-size: 1.2em !important }

#surveyForm input[type=checkbox], #surveyForm input[type=radio] { margin-bottom: 1px; vertical-align: text-bottom; }

#surveyForm .k-multiselect-wrap { font-size: 1.2em; padding-top: 3px }
#surveyForm .k-multiselect-wrap li { margin: 0 0 1px 3px }
.k-list-scroller .k-item { font-size: 1.2em; }

/* -----------------------------------------  Bulk upload view  --------------------------------------- */

.gym-bulk-admin { border:1px solid #dbdbdb; padding: 25px; width:100%; }
.gym-bulk-admin > div { text-align: center; }
.dd-shrink { width: 65%; }
.gym-bulk-fileupload { text-align: center; width: 100%; }
.gym-bulk-fileupload .cn-file-name { padding: 1em 0 .25em; }
.gym-bulk-fileupload .k-upload-status { font-weight: normal; right: 0; top: 20px; width: 100%; }
.gym-bulk-fileupload .k-button.k-upload-button { font-weight: bold; }
.gym-bulk-btns { margin-top: 2px; width: 300px; }

@media ( max-width: 576px ) { 
  .gym-bulk-admin { padding: 25px 0; }
  .dd-shrink { width: 100%; } 
  .gym-bulk-btns { width: auto; }
}
@media ( min-width: 992px ) {
  .gym-bulk-admin > div:first-child { text-align: right; }
  .gym-bulk-admin > div:last-child { text-align: left; }
}


/* ----------------------------------------  Login view styles  --------------------------------------- */

.gym-splash-table { background: #c9cbcc; float: none; height: 100%; position: absolute; width: 100%; }
.gym-splash-wrap { border-radius: 6px; margin-left: 0; margin-right: 0; max-width: 720px; }
@media ( max-width: 767px ) {
    .gym-splash-table { background: #c9cbcc; }
}

.gym-splash-welcome { font-family: 'effra-bold', sans-serif; font-size: 1.5em; letter-spacing: -0.25px; line-height: 1.2em; padding: 3px 0 2px 0; }

.gym-splash-txt { color: #5d6770; }
.gym-splash-txt, .gym-splash-form { text-align: left; width:330px; }
.gym-splash-txt .visible-xs { background: #eceeee; border-radius: 4px; margin-bottom: 10px; margin-top: 10px; padding: 25px 30px 15px 30px; }

.gym-splash-txt { height: 500px; padding: 11px 30px 0 0 }
.gym-splash-txt.flipped { height: 500px; padding: 11px 0 0 30px }
.gym-splash-txt.flipped p { text-align: left !important }

@media ( max-width: 767px ) { 
    .gym-splash-txt, .gym-splash-txt.flipped { height: auto; padding: 0 } 
}
@media ( min-width: 768px ) { 
    .gym-splash-wrap { background: #eceeee; padding: 30px; }
    .gym-splash-txt { background: transparent url('../../keystone.png') no-repeat left bottom; background-size: 100px 40px }
    .gym-splash-txt.flipped { background: transparent url('../../keystone.png') no-repeat right bottom; background-size: 100px 40px }
}

.gym-splash-form { background: white; border-radius: 4px; padding: 10px 30px 20px 30px; outline: 0; }
.gym-splash-form button { float: right }

@media ( min-width: 768px ) { 
    .gym-splash-form {  border: #dedede 1px solid; min-height: 500px;
                        box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(200, 204, 204, .6);
                        -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(200, 204, 204, .6); } 
}

a.gym-powered-by { height: 40px; position: absolute; top: 460px; width: 100px; }
.gym-powered-by { font-size: 10px; color: #999 }
.gym-powered-by > a { background: transparent url('../../keystone.png') no-repeat center bottom; background-size: 100px 40px; display: block;  height: 30px; width: 100px; }
.gym-powered-by.visible-xs { width: 330px; }


/* -------------------------------------  Indicator Exception  ------------------------------------- */

.gym-overlay-bg { 
    background-color: black;
    height: 100%;
    left: 0;
    opacity: 0.5;
    padding: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 30000;
}
.gym-overlay-fg { 
    height: 100%;
    left: 0;
    opacity: 1;
    padding: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 30001;
}
.gym-exception-wrap { background: white; border: 1px #ccc solid; border-radius: 4px; margin-left: 0; margin-right: 0; max-width: 520px; }
.gym-exception-wrap > div { margin: 0 15px; text-align: left }
.gym-exception-wrap textarea { background-color: #eceeee; border: 1px solid #dbdbdb; color: #606264; font-size: 0.85em; height: 200px; margin: 5px 0; padding: 5px; width:100%; }

.gym-exception-msg { background: white; border-top: 0px #ccc solid; margin: 0 -15px 0 -15px; }
.gym-exception-msg > div { color: black; padding: 10px 15px 0 15px; }
.gym-exception-msg > div:first-child { border-top: 1px #dbdbdb solid; padding-top: 18px; }
.gym-exception-msg > div:last-child { border-bottom: 1px #dbdbdb solid; padding-bottom: 18px; }
.gym-exception-msg li { color: #555; font-size: 0.85em; list-style-type: none; padding: 5px 20px 0 20px; padding-top: 5px; }
.gym-exception-msg li:first-child { padding-top: 10px }
.gym-exception-msg li:before { content: '\e00c'; font-family: 'kendo-ui'; font-size: 14px; margin-left: -20px; margin-right: 4px; }

.gym-exception-msg button { background: none; border: 0; color: #206099; margin: 0; padding: 0; text-decoration: none; }
.gym-exception-msg button:hover { color: #4b88bb; text-decoration: underline; }  

/* -------------------------------------  GDPR popup  ------------------------------------- */

.terms-title { width: 100%; }
.terms-title tr td:first-child { width:25px; }
.terms-title span { color: black; font-size: 1.2em; font-family: 'effra-regular', sans-serif; font-weight: 600; }

.terms-check { width: 100%; }
.terms-check tr td:last-child { padding-right: 1em; text-align: right; }
@media ( max-width: 480px ) {
    .terms-check tr td { display: block; }
    .terms-check tr td:last-child { padding-top: 1em; text-align: center; }
}
.terms-check input { cursor: pointer; height: 17px; margin: 0 .5em 0 0; vertical-align: middle; width: 17px; }
.terms-msg { width: 80%; }

/*defContainer .gym-popup-form { background-color: white; }
.defContainer .gym-popup-form input { margin-right: 4px; }
.defContainer #btnConfirmBoxDoAction { float: right; margin-top: -4px; margin-right: 25px; }

.defContainer p { padding-left: 5px }
.defContainer .gym-popup-form td { padding: 0; padding-left: 5px; }*/

/* -------------------------------------  Start/test app styles  ------------------------------------- */

#runModeTest { background: #cce6f6; border-bottom: 1px #a9cce3 solid; color: #5d6770; cursor: default; font-size: 0.9em; padding: 6px 15px; text-align: center; }
#runModeTest:hover { background: #cce6f6 }
#runModeTest select { background: #eceeee; border: 0; border-radius: 2px; cursor: pointer; margin-left: 6px; padding: 2px 2px 4px 2px; }
#runModeTest select:hover, #runModeTest select:focus { background: #fff; color: #333; }
#runModeTest .gym-ico-warn:before { color: #4b88bb; }

.gym-test-wrap { background: white; border-radius: 6px; margin: 30px auto; padding: 25px; max-width: 690px; }
.gym-test-title { color: black; font-family: 'effra-bold', sans-serif; font-size: 2em; letter-spacing: -0.4px; line-height: 1em; padding: 10px 0 0 10px; }
.gym-test-title span { font-family: 'effra-regular', sans-serif; letter-spacing: -0.25px; }
.gym-test-intro { line-height: 1.3em; padding: 30px 0 20px 10px; }

.gym-test-list { border-top: 1px #d0d0d0 solid; width: 100%; }
.gym-test-list tr { border-bottom: 1px #d0d0d0 solid; }
.gym-test-list td { padding: 10px; }
@media ( max-width: 480px ) {
    .gym-test-list td { display: block; }
    .gym-test-list tr > td:first-child { padding-bottom: 0; }
    .gym-test-list tr > td:last-child { padding-bottom: 15px; }
}

.gym-test-footer { background: transparent; float: left; margin-top: 25px; width: 100%; }
.gym-test-footer p { color: #909999; float: left; font-size: 11px; line-height: 15px; padding: 13px 0 0 10px; }
.gym-test-footer img { float: right; margin-right: 10px; }

.gym-test-wrap a.gym-btn-secondary {
    display: block;
    margin: auto;
    text-align: center;
    text-decoration: none;
    width: 160px;
}

.gym-ico-app:before { content: "\e0e5"; color: black; font-family: 'kendo-ui'; font-size: .8em; line-height: 00px; margin-left: -4px; }
.gym-ico-reset:before { content: "\e0e6"; color: black; font-family: 'kendo-ui'; font-size: 1em; line-height: 00px; margin-left: -4px; }