﻿
section.banner { min-height: 260px; }
section.banner .background { position: absolute; left: 0; top: 0; right: 0; bottom: 0; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 40px), 0 65%); background-position: center bottom; background-repeat: no-repeat; background-size: cover; }
section.banner .content { display: flex; flex-direction: row; }
section.banner .content .intro { margin-top: 40px; width: 100%; max-width: 546px; background-color: #5284ab; padding: 40px 40px 50px 40px; color: #ffffff; clip-path: polygon(0 0, 100% 0, 100% 87%, 0 100%); }
section.banner .content .social-media { flex-basis: 100%; display: flex; flex-direction: column; }

section.banner .intro h1 { margin-bottom: 0.5em; font-size: 36px; }
section.banner .intro p { color: inherit; line-height: 1.3em; font-size: 17px; }

section.disclaimer p { color: #333333; font-size: 14px; }

section.search { }
section.search .search-bar { display: flex; flex-direction: row; align-items: center; width: 100%; justify-content: end; gap: 20px; }

section.search .search-bar .search-box { border: 1px solid #cccccccc; flex-basis: 100%; max-width: 400px; display: flex; flex-direction: row; align-items: center; gap: 5px; }
section.search .search-bar .search-box input[type=text] { padding: 10px; font-size: 16px; flex-basis: 100%; }

section.search .search-bar .btn-search { display: inline-block; width: 21px; height: 21px; background-color: transparent; background-image: url("/_assets/icon-search.png"); cursor: pointer; flex-shrink: 0; background-size: 21px 21px; background-position: center; background-repeat: no-repeat; padding: 10px; box-sizing: content-box; }


section.questionnaire-header .introduction { margin: 0 0 30px 0; }
section.questionnaire-header .introduction h2 { font-size: 30px; margin-bottom: 0.33em;  }
section.questionnaire-header .introduction p { font-size: 19px; color: #5482ab; margin: 0; }


section.questionnaire-header .container { background-color: #F7F7F7; width: 100%; display: flex; flex-direction: row; }

section.questionnaire-header .container .intro { flex-basis: 50%; flex-shrink: 0; background-color: #5482ab; padding: 30px 60px 30px 30px; border-left: 10px solid #bed400; clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 100%, 0 100%); font-size: 23px; color: #ffffff; }
section.questionnaire-header .container .intro p { color: inherit; line-height: 1.2em; }
section.questionnaire-header .container .intro p:last-child { margin-bottom: 0; }

section.questionnaire-header .container .buttons { flex-basis: 50%; display: flex; flex-direction: row; align-items: center; justify-content: center; padding: 0 10px; }


.btn-large { font-size: 21px; color: #000000; font-family: berlingske_sans_roundmedium, sans-serif; }


section.questionnaire { }

section.questionnaire .question-panel { margin-top: 10px; background-color: #f7f7f7; border-left: 10px solid #5482ab; padding: 20px 30px; font-size: 18px; }
section.questionnaire .question-panel .standard-page-content { margin: 0; }

section.questionnaire .question-panel p.title { font-size: 22px; margin-bottom: 0.75em; }

section.questionnaire .question-panel p:last-child { margin-bottom: 0; }

section.questionnaire .buttons { margin-top: 20px; display: flex; flex-direction: row; align-items: center; }
section.questionnaire .user-answers { display: flex; flex-direction: row; gap: 16px; flex-basis: 100%;  }
section.questionnaire .btn-user-response { flex-basis: 300px; padding: 10px; font-family: berlingske_sans_roundmedium, sans-serif; font-size: 20px; background-color: #ADB2B2; color: #ffffff; }

section.questionnaire .btn-user-response:not(.selected):not([disabled]):hover { background-color: #999f9f; }

section.questionnaire .question-panel .user-answers .btn-user-response.selected { background-color: #5482ab; color: #ffffff; }

section.questionnaire .question-panel .user-answers .btn-user-response[disabled] { opacity: 0.75; }

section.questionnaire .btn-clear-answer { background-color: #3C4748; color: #ffffff; font-size: 16px; white-space: nowrap; padding: 10px 14px; font-family: berlingske_sans_roundmedium, sans-serif; display: flex; align-items: center; }
section.questionnaire .btn-clear-answer:hover { background-color: #5b6566; }
section.questionnaire .btn-clear-answer img { width: 16px; height: 16px; margin-left: 14px; }

section.results { }

section.results .your-results { background-color: #5482ab; border-left: 10px solid #31574E; padding: 30px; }

section.results .your-results  .exclamation { display: flex; flex-direction: row; align-items: center; }

section.results .your-results .exclamation .exclamation-mark { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; background-color: #bed600; border-radius: 30px; font-size: 25px; margin-right: 20px; }
section.results .your-results .exclamation p { color: #ffffff; font-size: 27px; margin: 0; }

section.results .your-results .details { padding-left: 64px; margin: 10px 0 0 0; }
section.results .your-results .details .standard-page-content { margin: 0; }
section.results .your-results .details p.title { font-size: 22px; }

section.results .your-results .actions { margin-top: 30px; display: flex; flex-direction: row; gap: 10px; padding-left: 64px; }
section.results .your-results .actions .buttons { display: flex; flex-direction: row; gap: 20px; flex-basis: 50%; }
section.results .your-results .actions .taken { flex-basis: 50%; color: #ffffff; display: flex; align-items: end; justify-content: end; font-size: 15px;}

section.results .btn-restart-questionnaire { font-size: 17px; background-color: #779FC7; color: #ffffff; border-color: #779FC7; }
section.results .btn-restart-questionnaire:hover { background-color: #ffffff; color: #333333; }


section.results .standard-page-content p,
section.results .standard-page-content ul li,
section.results .standard-page-content a { color: #ffffff; font-size: 18px }
section.results .standard-page-content a { font-family: berlingske_sans_roundmedium, sans-serif;}

section.results .document-groups { margin-top: 20px; }

section.results .document-groups .document-group { margin-top: 30px; }

section.results .document-groups .document-group .document-group-title { font-size: 28px; color: #3C4748; }

.document-items { display: grid; gap: 20px; grid-template-columns: repeat(4,1fr); }

.document-item { background-color: #5482ab; color: #ffffff; font-size: 22px; padding: 10px 20px 60px 20px; position: relative; text-align: left; line-height: 1.2; vertical-align: top; border-top: 10px solid #5482ab; display: flex; flex-direction: column; }
.document-item:hover { background-color: #577598; border-color: #577598; }

.document-item p { color: inherit; }

.document-item p.context { font-size: 16px; line-height: 1.3em; }

.document-item .search-highlight { color: #bed600; font-family: berlingske_sans_roundmedium, sans-serif; }
/*.document-item.non-hipaa .search-highlight { color: #5482ab; }*/

.document-item .plus { position: absolute; width: 22px; height: 22px; right: 20px; bottom: 20px; background-image: url(/_assets/icon-plus-white-thin.png); background-size: cover; background-position: center; background-repeat: no-repeat; }

.document-item.active { background-color: #49617F; border-color: #49617f; }
.document-item.active:after { content: ""; position: absolute; width: 0; height: 0; border-top: 15px solid #49617F; border-left: 15px solid transparent; border-right: 15px solid transparent; border-bottom: 0; top: 100%; left: 50%; margin-left: -15px; }

/*.document-items .document-item.non-hipaa { background-color: #f7f7f7; color: #000000; border-top: 10px solid #5482ab; }
.document-items .document-item.non-hipaa:hover { background-color: #EBEBEB; }
.document-items .document-item.non-hipaa .plus { background-image: url(/_assets/icon-plus.png); }

.document-items .document-item.non-hipaa.active { background-color: #dddddd; }
.document-items .document-item.non-hipaa.active:after { border-top-color: #dddddd; }*/

.document-information { position: relative; grid-column: 1 / 5; background-color: #EEF3F7; padding: 30px; display: none; }
.document-information .btn-close-doc-info { position: absolute; top: 20px; right: 20px; width: 40px; height: 40px; }

.document-information .content .standard-page-content { margin: 0; }

.document-information .content p,
.document-information .content li,
.document-information .content a { font-size: 19px!important; color: #333333!important; }

.document-information .content .title { color: #5482ab; font-size: 22px; }

.document-information .control { display: flex; flex-direction: row; align-items: center; justify-content: space-between; margin-top: 24px;  }
.document-information .control label { font-size: 15px; }

.btn-download-document { font-size: 17px; display: flex; flex-direction: row; gap: 20px; align-items: center; white-space: nowrap; }
.btn-download-document img { height: 20px; }

section.search-results .header { display: flex; flex-direction: row; align-items: center; gap: 10px; margin-bottom: 30px }
section.search-results .header .count { flex-shrink: 0; font-size: 30px; }
section.search-results .header hr { flex-basis: 100%; }

section.search-results .header .btn-close { display: inline-block; width: 24px; height: 24px; background-image: url(/_assets/icon-close-dark.png); background-size: cover; background-position: center; background-repeat: no-repeat; }


.library-switch { background-color: transparent; width: 100%; transform:translateY(64px); text-align: right; display: flex; justify-content: end; }
.switch { display: flex; flex-direction: row; align-items: center; margin: 0; }
.switch > span { font-size: 14px; color: #333333; }

.switch .switch-status { width: 50px; } 
.switch .slider { box-shadow: 0 0 0 1px #333333; background-color: transparent; }

.switch .slider:before { background-color: #5482ab; }

.switch input[type=checkbox]:checked + .slider:before { transform: translateX(-25px); }


.key-contacts-list-wide { background-color: #5482ab; clip-path: polygon(0 0, 100% 0, 100% 80%, 0 100%); padding-bottom: 80px; margin-top: 40px; }

.key-contacts-list-wide .slick-arrows-and-dots { margin-top: 20px; margin-left: 5px; font-size: 0; }

.key-contacts-list-wide .slick-arrow { margin-top: -18px; width: 36px; height: 36px; border: 1px solid #C3D544; background-color: transparent; background-image: url("/blockchain/_assets/carousel-arrow.png") !important; background-position: center; background-size: 16px; background-repeat: no-repeat; font-size: 0;  }
.key-contacts-list-wide .slick-arrow { background-image: url("/blockchain/_assets/carousel-arrow-white.png") !important; margin-top: 0; }

.key-contacts-list-wide .slick-arrow.slick-next { transform: rotate(180deg); margin-left: 20px; }

.key-contacts-list-wide .carousel-container .title h2 { color: #ffffff; font-size: 30px; font-family: berlingske_sans_roundlight, sans-serif; }
.key-contacts-list-wide .key-contact-panel-content { padding-bottom: 0; display: flex; flex-direction: row; gap: 20px; }

.key-contacts-list-wide .key-contact-panel-content .key-contact-image { }
.key-contacts-list-wide .key-contact-panel-content .key-contact-image img { margin: 0; height: 150px; width: auto; }
.key-contacts-list-wide .key-contact-panel-content .key-contact-details { justify-self: end; align-self: end; }

.key-contacts-list-wide .key-contact-panel-content p,
.key-contacts-list-wide .key-contact-panel-content p.name { color: #ffffff; font-size: 18px; white-space: normal; }

.key-contacts-list-wide .key-contact-panel-content p { font-family: berlingske_sans_roundregular, sans-serif; }
.key-contacts-list-wide .key-contact-panel-content p.name { font-family: berlingske_sans_roundmedium, sans-serif; }

.key-contacts-list-wide .contacts a.btn-contact-us { background-color: #ffffff; color: #333333; font-size: 16px; background-image: url("/_assets/icon-email-blue.png"); padding: 16px 16px 16px 50px;  }
.key-contacts-list-wide .contacts a.btn-contact-us:hover { color: #ffffff!important; background-image: url("/_assets/icon-email-white.png"); border-color: #ffffff;   }

.tooltip .tooltip-inner { max-width: 400px!important; }