/* ==================================================
   APP STYLE
   ================================================== */

*, *:before, *:after {margin: 0; padding: 0; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
body, .page, input, button, .button, .text-input, .list, .toolbar-button, .page--material, .page--material__content, .page__content h1, .page__content h2, .page__content h3, .page__content h4, .page__content h5, .toolbar--material__center, .toolbar--material__left, .toolbar--material__right {font-family: 'Open Sans', sans-serif !important;}
.page, .page__background, .page__content {background: #f3f3f3;}
a, button, .button, .back-button, .toolbar-button {cursor: pointer !important; transition: all .2s ease-in-out !important;}
.toolbar-button, .back-button {color: #009DDE; font-size: 15px; text-transform: uppercase; font-weight: 600;}
.back-button__label {font-size: 15px;}
.back-button__icon {fill: #029dde;}
.back-button__icon svg {width: 15px !important;}
.button, button {cursor: pointer; background: #7B98AA;}
.button--material--flat {cursor: pointer; background: #ffffff;}
.toolbar--material__left, .toolbar--material__right {min-width: auto;}
.button--material, :checked+.switch--material__toggle>.switch--material__handle {box-shadow: none;}
.button--material:active {background-color: #053E4C;}
.button--material--flat:active {background-color: rgba(153,153,153,.2);}
.button--material--flat:focus {background-color: transparent;}
.toolbar {background-image: none; box-shadow: 0 0 5px rgba(0,0,0,.1); background-color: #fff;}
.toolbar .center {font-weight: bold; text-align: center;}
.toolbar .idieikon-adsum-brand {vertical-align: middle;}
.toolbar .exit-btn .ons-icon.fa {margin-left: 5px;}
.text-input--material:focus {background-image: linear-gradient(#029dde,#029dde),linear-gradient(to top,transparent 1px,#afafaf 1px);}
:checked+.switch__toggle {box-shadow: inset 0 0 0 2px #26a6da; background-color: #26a6da;}
:checked+.checkbox__checkmark:before {background: #029dde;}
.range__input {background-image: linear-gradient(#26a6da,#26a6da);}

/* LOGIN */

.page__content {text-align: center;}
.page__content .wrapper-page {width: 95%; max-width: 400px; margin: 30px auto; background: #fff; padding: 30px 50px; border-top: 10px solid #053E4C; box-shadow: 0 0 5px rgba(0,0,0,.1); display: inline-block; vertical-align: top; text-align: left; border-radius: 0 0 4px 4px;}
.page__content .wrapper-page ons-input {margin: 10px 0 !important;}
.page__content .wrapper-page ons-input .text-input--material__label {top: 12px;}
.page__content .wrapper-page ons-input .text-input--material__label--active {transform: translate(0, -130%) scale(.75);}
.page__content .wrapper-page input {width: 100%; padding: 10px 0; height: auto;}
.page__content .login .button, .page__content .password .button {width: 100%; margin: 15px 0; text-align: center;}
.page__content #password-recover-btn, .page__content #password-send-btn {margin: 15px 0 0px 0;}
.page__content .password .info-text {margin-bottom: 15px;}
.page__content .password h2 {text-align: center; font-size: 1em;}
.page__content .password .privacy {height: 160px; overflow-y: scroll; border: 1px solid #b0afb0; border-radius: 3px; padding: 15px; margin: 15px 0;}
.page__content .password .privacy p {margin-bottom: 15px; font-size: .8em}
.page__content .password .privacy p:last-child {margin-bottom: 0;}
.page__content #policy_accept {margin: 3px 3px 0 0;}
.page__content .simple-link {margin: 10px 0; font-size: .9em;}
.page__content .simple-link a {transition: all .2s ease-in-out !important; color: #3d5afe;}
.page__content .simple-link a:hover, .page__content .simple-link a:active, .page__content .simple-link a:focus {text-decoration: none; color: #000;}

.developed-by {font-size: .9em; margin-bottom: 30px;}
.developed-by a {color: #00a4e4; text-decoration: none;}
.developed-by a:hover, .developed-by a:active, .developed-by a:focus {color: #000;}

.login-alert {border: 1px solid #ffe69c; background: #fff3cd; color: #664d03; border-radius: 3px; padding: 10px 15px; font-size: .9em; margin-bottom: 20px;}

/* LIST */

.page__content .wrapper-list h2 {margin: 30px auto 0 auto; max-width: 650px; width: 95%; font-size: 1.1em;}
.page__content .wrapper-list .list {margin: 30px auto; max-width: 650px; width: 95%; box-shadow: 0 0 5px rgba(0,0,0,.1); border: 0; border-radius: 4px;}
.page__content .wrapper-list .list .ons-icon.fa {margin-right: 10px; width: 20px;}
.page__content .wrapper-list .list .fa-exclamation-circle {color: #e42323;}
.page__content .wrapper-list .list .fa-check-circle {color: #7B98AA;}
.page__content .wrapper-list .list .delayedwarning .fa-check-circle {display: none;}
.page__content .wrapper-list .list span {background: #292929; color: #fff; display: inline-block; margin-right: 10px; border-radius: 3px; padding: 2px 6px; font-size: .8em;}
.page__content .wrapper-list .list .list-item {border-bottom: 1px solid #ccc;}
.page__content .wrapper-list .list .list-item:last-child {border-bottom: 0px solid #ccc;}
.page__content .wrapper-list .list .list-item__center {background-image: none; padding: 12px 25px 12px 0;}
.page__content .wrapper-list .list #noscheduledsurveys {padding: 12px;}
.page__content .wrapper-list #delayedwarning .card {margin: 30px auto 0 auto; max-width: 650px; width: 95%; box-shadow: 0 0 5px rgba(0,0,0,.1); border: 0; border-radius: 4px; background: #e42323; color: #fff;}
.page__content .wrapper-list #delayedwarning .card .ons-icon {margin-right: 10px; color: #fff;}

/* SURVEY */

.page__content .wrapper-survey {margin: 30px auto; max-width: 1024px; width: 95%; background: #fff; box-shadow: none; border-radius: 4px;} /*box-shadow: 0 0 5px rgba(0,0,0,.1)*/
.page__content .wrapper-survey .list {border-radius: 4px; background-image: none;}
.page__content .wrapper-survey .list-header {background-color: #f3f3f3; font-weight: bold; background-image: none; text-transform: none;}
.page__content .wrapper-survey .sd-body {text-align: left;}
.page__content .wrapper-survey .sd-body .sd-html h1 {text-align: center;}

/* LANDING */

.page__content .wrapper-landing {margin: 30px auto; max-width: 650px; width: 95%; background: #fff; box-shadow: 0 0 5px rgba(0,0,0,.1); border-radius: 4px; text-align: left; overflow: hidden;}
.page__content .wrapper-landing .img-proms {width: 100%; max-width: 650px; height: auto;}
.page__content .wrapper-landing > div {padding: 30px 50px;}
.page__content .wrapper-landing > div h3 {margin: 2em 0 1em 0; font-weight: 600;}
.page__content .wrapper-landing > div h3:first-child {margin-top: 0;}
.page__content .wrapper-landing > div p {line-height: 1.4em;}
.page__content .wrapper-landing > div.also-app {background: #7B98AA; border: 10px solid #fff; border-top: 0; border-radius: 0 0 13px 13px; padding: 30px 40px;}
.page__content .wrapper-landing > div.also-app h2 {text-align: center; color: #fff; border-top: 1px solid #587c92; padding: 25px 0; margin: 25px 0 0 0;}
.page__content .wrapper-landing > div.also-app .button-bar__button {background-color: #fff; color: #063e4c; border: 1px solid #587b92; border-width: 1px 1px 1px 0; height: 35px; line-height: 35px; font-weight: 600;}
.page__content .wrapper-landing > div.also-app .button-bar__item:first-child>.button-bar__button {border-left-width: 1px;}
.page__content .wrapper-landing > div.also-app .button-bar__button:active, .page__content .wrapper-landing > div.also-app :active+.button-bar__button {background-color: #587b92; border: 0 solid #587b92; border-top: 1px solid #587b92; border-bottom: 1px solid #587b92; border-right: 1px solid #587b92; color: #fff;}

/* PHOTO - QR */

#qr .page__content .wrapper-page {max-width: 1024px;}
#qr-video {width: 100% !important; height: auto !important; border-radius: 4px; margin: 0; /*30px 0 20px 0*/}
#upload #imageList .card {text-align: center;}
#upload #imageList .card img {width: 100%; height: auto;}
#newsession #imageSessionList .card img {width: 100%; height: auto;}
#keypass {margin: 25px 0 10px 0; padding-top: 25px; font-weight: bold; border-top: 1px solid #ccc; font-family: "Courier New", Courier, monospace; font-size: 1.2em;}
#addsimg {margin: 10px 0;}
#imageSessionList .card {border: 1px solid #d2d2d2; border-radius: 4px; box-shadow: 0 3px 0px rgba(0,0,0,.1); margin: 0 0 10px 0; text-align: right;}
#imageSessionList .card .card__content .delete-img-sessionlist {background: #e65858;}
#photos #sessionslist ons-row {margin: 0px 0 25px 0; padding-bottom: 25px; border-bottom: 1px solid #ccc; flex-direction: column;}
#photos .txt-session-warning {color: #de1e1e; font-size: 0.8em; margin-top: 10px; font-family: Arial, Helvetica, sans-serif;}

.qr-container {text-align: center; margin: 50px auto; width: 90%;}
.qr-container #qrcode {margin: 0 auto 25px auto; text-align: center;}
.qr-container #qrcode canvas, .qr-container #qrcode img {margin: 0 auto; text-align: center; max-width: 320px; height: auto; width: 100%;}
.qr-container #qrurl {background: #7B98AA; transition: all .2s ease-in-out; border-radius: 3px; text-decoration: none; color: #fff; font-size: 1.2em; padding: 10px 20px; display: inline-block;}
.qr-container #qrurl:hover, .qr-container #qrurl:active, .qr-container #qrurl:focus {background-color: #053E4C;}

.qr-imagelist {margin-bottom: 25px;}
.qr-imagelist #imageList {text-align: center;}
.qr-imagelist #imageList .card__content {text-align: center; display: inline-block; margin: 0 auto; vertical-align: top;}
.qr-imagelist #imageList .card__content img {display: inline-block; margin: 5px; max-width: 300px; width: 90%; height: auto;}

#qr-div {position: relative; margin-top: 25px; overflow: hidden; border-radius: 4px;}
#qr-video {position: relative; border-radius: 4px;}
.qr-canvas {position: absolute; top: -5px; z-index: 10; display: none; border-radius: 4px;}

.wrapp-qr-photo .card {box-shadow: 0 3px 0px rgba(0,0,0,.1); border-radius: 4px; margin: 20px 0; padding: 20px 25px; border: 1px solid #d2d2d2;}
.wrapp-qr-photo .card .card__title {margin: 0 0 20px 0;}
.wrapper-page.wp-content-centered {text-align: center;}

/* NOTIFICATIONS */

#notificationsdialog .dialog {box-shadow: 0 20px 20px rgba(0,0,0,.2); border-radius: 4px; font-family: inherit; top: 15px; transform: translate(-50%, 0%);}
#notificationsdialog .dialog .dialog-container {padding: 30px; background-color: #fff; min-width: 325px; text-align: center;}
#notificationsdialog .dialog .dialog-container p {margin-bottom: 15px;}
#notificationsdialog .dialog .dialog-container button {border: 0; padding: 10px 20px; font-family: inherit !important; border-radius: 0px; color: #fff; margin: 0 1px 1px 0;}
#notificationsdialog .dialog .dialog-container button:hover, #notificationsdialog .dialog .dialog-container button:active, #notificationsdialog .dialog .dialog-container button:focus {background: #053E4C; box-shadow: 0 6px 10px 0 rgba(0,0,0,.14), 0 1px 18px 0 rgba(0,0,0,.12), 0 3px 5px -1px rgba(0,0,0,.4);}
#notificationsdialog .dialog .dialog-container button#notif-btn-yes {border-radius: 4px 0 0 4px;}
#notificationsdialog .dialog .dialog-container button#notif-btn-later {border-radius: 0 4px 4px 0;}
#notificationsdialog .dialog .dialog-container .dialog-btn-wrapp {display: flex; flex-direction: row; justify-content: center;}

/* ==================================================
   RESPONSIVE
   ================================================== */

@media (max-width: 400px) {
.page__content .wrapper-page {padding: 30px 30px;}
.page__content .wrapper-landing > div {padding: 30px 30px;}
.page__content .wrapper-landing > div.also-app {padding: 30px 20px;}
}

/* ==================================================
   FONTS
   ================================================== */

@font-face{font-family:'Open Sans';font-weight:400;font-style:normal;src:url(fonts/Open-Sans-regular/Open-Sans-regular.eot);src:url(fonts/Open-Sans-regular/Open-Sans-regular.eot?#iefix) format("embedded-opentype"),local("Open Sans"),local(Open-Sans-regular),url(fonts/Open-Sans-regular/Open-Sans-regular.woff2) format("woff2"),url(fonts/Open-Sans-regular/Open-Sans-regular.woff) format("woff"),url(fonts/Open-Sans-regular/Open-Sans-regular.ttf) format("truetype"),url(fonts/Open-Sans-regular/Open-Sans-regular.svg#OpenSans) format("svg")}
@font-face{font-family:'Open Sans';font-weight:600;font-style:normal;src:url(fonts/Open-Sans-600/Open-Sans-600.eot);src:url(fonts/Open-Sans-600/Open-Sans-600.eot?#iefix) format("embedded-opentype"),local("Open Sans Semibold"),local(Open-Sans-600),url(fonts/Open-Sans-600/Open-Sans-600.woff2) format("woff2"),url(fonts/Open-Sans-600/Open-Sans-600.woff) format("woff"),url(fonts/Open-Sans-600/Open-Sans-600.ttf) format("truetype"),url(fonts/Open-Sans-600/Open-Sans-600.svg#OpenSans) format("svg")}
@font-face{font-family:'Open Sans';font-weight:800;font-style:normal;src:url(fonts/Open-Sans-800/Open-Sans-800.eot);src:url(fonts/Open-Sans-800/Open-Sans-800.eot?#iefix) format("embedded-opentype"),local("Open Sans Extrabold"),local(Open-Sans-800),url(fonts/Open-Sans-800/Open-Sans-800.woff2) format("woff2"),url(fonts/Open-Sans-800/Open-Sans-800.woff) format("woff"),url(fonts/Open-Sans-800/Open-Sans-800.ttf) format("truetype"),url(fonts/Open-Sans-800/Open-Sans-800.svg#OpenSans) format("svg")}
@font-face{font-family:'Open Sans';font-weight:400;font-style:italic;src:url(fonts/Open-Sans-italic/Open-Sans-italic.eot);src:url(fonts/Open-Sans-italic/Open-Sans-italic.eot?#iefix) format("embedded-opentype"),local("Open Sans Italic"),local(Open-Sans-italic),url(fonts/Open-Sans-italic/Open-Sans-italic.woff2) format("woff2"),url(fonts/Open-Sans-italic/Open-Sans-italic.woff) format("woff"),url(fonts/Open-Sans-italic/Open-Sans-italic.ttf) format("truetype"),url(fonts/Open-Sans-italic/Open-Sans-italic.svg#OpenSans) format("svg")}
@font-face{font-family:'Open Sans';font-weight:600;font-style:italic;src:url(fonts/Open-Sans-600italic/Open-Sans-600italic.eot);src:url(fonts/Open-Sans-600italic/Open-Sans-600italic.eot?#iefix) format("embedded-opentype"),local("Open Sans Semibold Italic"),local(Open-Sans-600italic),url(fonts/Open-Sans-600italic/Open-Sans-600italic.woff2) format("woff2"),url(fonts/Open-Sans-600italic/Open-Sans-600italic.woff) format("woff"),url(fonts/Open-Sans-600italic/Open-Sans-600italic.ttf) format("truetype"),url(fonts/Open-Sans-600italic/Open-Sans-600italic.svg#OpenSans) format("svg")}

/* Remove number spinners */

input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0;}
input[type=number] {-moz-appearance: textfield;}