.ngparapoll-caption { display: flex; align-items: center; padding: 8px 0; } .ngparapoll-picture { display: block; width: 100%; margin: 0; padding: 0; } .ngparapoll-summary p:first-child { margin-top: 0; } .ngparapoll label { display: block; } .ngparapoll-option-detailed { margin-bottom: 20px; } .ngparapoll-option-detailed .ngparapoll-caption span { font-weight: bold; } .ngparapoll-picture img { display: block; width: 100%; margin: 0; padding: 0; } .ngparapoll-submit { margin-top: 16px; display: flex; justify-content: space-between; align-items: center; } .ngparapoll { position: relative; } .ngparapoll-noresult { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; } .ngparapoll-noresult>p { text-align: center; margin: 16px; } .ngparapoll input[type=submit] { border-color: #80a4d1; border-width: 2px; border-style: solid; padding: 10px 20px 10px 20px; background: #212c65; font: 14px Montserrat,Verdana,Helvetica,sans-serif; color: #ffffff; letter-spacing: 0.5px; text-transform: uppercase; border-radius: 7px; display: block; cursor: pointer; -webkit-appearance: none; } .ngparapoll input[type=submit]:hover:enabled { border-color: #9ea815; background: #9ea815; font-weight: normal; font-style: normal; text-transform: uppercase; color: #ffffff; } .ngparapoll input[type=submit]:focus:enabled { border-color: #80a4d1; background: #212c65; font-weight: normal; font-style: normal; text-transform: uppercase; color: #ffffff; outline: none; } .ngparapoll input[type=submit]:disabled { cursor: not-allowed; opacity: 0.2; } .ngparapoll input[type=radio] { margin: 2px 10px 2px 0; vertical-align: middle; display: block; width: 20px; height: 20px; box-sizing: border-box; accent-color: var(--ngparapoll-coloraccent); } .ngparapoll label span { vertical-align: middle; display: block; } .ngparapoll-result-bar>div { height: var(--ngparapoll-barheight); background-color: var(--ngparapoll-colorbar); } .ngparapoll-animate .ngparapoll-result-bar>div { transition: width 2s; } .ngparapoll-result-bar.ngparapoll-result-max>div { background-color: var(--ngparapoll-colorbarmax); } .ngparapoll-result-caption { display: flex; margin: 10px 0; } .ngparapoll-result-caption.ngparapoll-result-max { font-weight: bold; } .ngparapoll-result-caption>span:first-child { min-width: 3.5em; } .ngparapoll-result-bar { margin: 5px 0 15px 3.5em; } .ngparapoll-result-total { margin-top: 24px; color: var(--ngparapoll-colortotal); } .ngparapoll-skip { color: var(--ngparapoll-colortotal); text-decoration: none; } .ngparapoll-skip:hover { text-decoration: underline; } @media ( min-width: 1024px ) { .ngparapoll-columns-2 .ngparapoll-options, .ngparapoll-columns-3 .ngparapoll-options, .ngparapoll-columns-4 .ngparapoll-options { display: flex; flex-wrap: wrap; column-gap: 30px; } .ngparapoll-columns-2 .ngparapoll-options .ngparapoll-option { width: calc( 50% - 15px ); } .ngparapoll-columns-3 .ngparapoll-options .ngparapoll-option { width: calc( 33.33% - 20px ); } .ngparapoll-columns-4 .ngparapoll-options .ngparapoll-option { width: calc(25% - 22.5px ); } }