.ellipsis{ display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; -o-text-overflow:ellipsis; -ms-text-overflow:ellipsis } .clear{ clear:both } .stripe-logo{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; border:1px solid #4fb0ae!important; color:#4fb0ae!important; text-decoration:none; padding:4px 6px; font-size:12px; margin-top:10px; line-height:17px; border-radius:7px; -webkit-border-radius:7px; -moz-border-radius:7px; height:17px } .stripe-logo:hover{ background:rgba(79,176,174,.1) } .stripe-logo svg{ width:40px; height:17px } .stripe-logo svg path,.stripe-logo svg rect{ fill:#4fb0ae } .stripe-logo>span{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; position:relative; font-family:Helvetica,Arial } .container{ position:relative } .container .aux{ border-color:#4fb0ae } .container .aux,.container .aux div{ position:absolute; top:0; bottom:0; left:0; right:0; border-radius:2px; -webkit-border-radius:2px; -moz-border-radius:2px } .container .aux img{ width:100%; height:100% } .container .dark{ display:none } .container.step5 .dark{ display:block } .container.step5 .light{ display:none } .container.step0 .aux img{ -khtml-opacity:.3; -moz-opacity:.3; opacity:.3; -ms-filter:"alpha(Opacity=30)" } .container.step1 .aux img{ -khtml-opacity:.4; -moz-opacity:.4; opacity:.4; -ms-filter:"alpha(Opacity=40)" } .container.step2 .aux img{ -khtml-opacity:.5; -moz-opacity:.5; opacity:.5; -ms-filter:"alpha(Opacity=50)" } .container.step3 .aux img{ -khtml-opacity:.6; -moz-opacity:.6; opacity:.6; -ms-filter:"alpha(Opacity=60)" } .container.step4 .aux img{ -khtml-opacity:.6; -moz-opacity:.6; opacity:.6; -ms-filter:"alpha(Opacity=60)" } .container.step5 .aux img{ -khtml-opacity:.6; -moz-opacity:.6; opacity:.6; -ms-filter:"alpha(Opacity=60)" } .container .bg{ z-index:2; -webkit-box-shadow:0 1px 1px #000; -moz-box-shadow:0 1px 1px #000; box-shadow:0 1px 1px #000 } .container.step0 .bg{ -khtml-opacity:.05; -moz-opacity:.05; opacity:.05; -ms-filter:"alpha(Opacity=5)" } .container.step1 .bg{ -khtml-opacity:.05; -moz-opacity:.05; opacity:.05; -ms-filter:"alpha(Opacity=5)" } .container.step2 .bg{ -khtml-opacity:.1; -moz-opacity:.1; opacity:.1; -ms-filter:"alpha(Opacity=10)" } .container.step3 .bg{ -khtml-opacity:.1; -moz-opacity:.1; opacity:.1; -ms-filter:"alpha(Opacity=10)" } .container.step4 .bg{ -khtml-opacity:.1; -moz-opacity:.1; opacity:.1; -ms-filter:"alpha(Opacity=10)" } .container.step5 .bg{ -khtml-opacity:.1; -moz-opacity:.1; opacity:.1; -ms-filter:"alpha(Opacity=10)" } .container .inset{ z-index:3; -webkit-box-shadow:inset 0 2px 0 #fff; -moz-box-shadow:inset 0 2px 0 #fff; box-shadow:inset 0 2px 0 #fff } .container.step0 .inset{ -khtml-opacity:.4; -moz-opacity:.4; opacity:.4; -ms-filter:"alpha(Opacity=40)" } .container.step1 .inset{ -khtml-opacity:.3; -moz-opacity:.3; opacity:.3; -ms-filter:"alpha(Opacity=30)" } .container.step2 .inset{ -khtml-opacity:.25; -moz-opacity:.25; opacity:.25; -ms-filter:"alpha(Opacity=25)" } .container.step3 .inset{ -khtml-opacity:.2; -moz-opacity:.2; opacity:.2; -ms-filter:"alpha(Opacity=20)" } .container.step4 .inset{ -khtml-opacity:.15; -moz-opacity:.15; opacity:.15; -ms-filter:"alpha(Opacity=15)" } .container.step5 .inset{ -khtml-opacity:.05; -moz-opacity:.05; opacity:.05; -ms-filter:"alpha(Opacity=5)" } .container .bd{ z-index:4; border:1px solid #000 } .container.step0 .bd{ -khtml-opacity:.15; -moz-opacity:.15; opacity:.15; -ms-filter:"alpha(Opacity=15)" } .container.step1 .bd{ -khtml-opacity:.2; -moz-opacity:.2; opacity:.2; -ms-filter:"alpha(Opacity=20)" } .container.step2 .bd{ -khtml-opacity:.3; -moz-opacity:.3; opacity:.3; -ms-filter:"alpha(Opacity=30)" } .container.step3 .bd{ -khtml-opacity:.4; -moz-opacity:.4; opacity:.4; -ms-filter:"alpha(Opacity=40)" } .container.step4 .bd{ -khtml-opacity:.5; -moz-opacity:.5; opacity:.5; -ms-filter:"alpha(Opacity=50)" } .container.step5 .bd{ -khtml-opacity:.15; -moz-opacity:.15; opacity:.15; -ms-filter:"alpha(Opacity=15)"; border:1px solid #fff } .container .tick{ display:none; position:absolute; right:7px; top:50%; margin-top:-15px; font-size:21px; -khtml-opacity:.7; -moz-opacity:.7; opacity:.7; -ms-filter:"alpha(Opacity=70)" } .container .tick:before{ font-family:typeIconFont; content:"H" } .container.selected .tick{ display:block } .container.selected.step0 .overlay{ -khtml-opacity:.03; -moz-opacity:.03; opacity:.03; -ms-filter:"alpha(Opacity=3)"; display:block; background-color:#000 } .container.selected.step1 .overlay{ -khtml-opacity:.1; -moz-opacity:.1; opacity:.1; -ms-filter:"alpha(Opacity=10)"; display:block; background-color:#fff } .container.selected.step2 .overlay{ -khtml-opacity:.05; -moz-opacity:.05; opacity:.05; -ms-filter:"alpha(Opacity=5)"; display:block; background-color:#fff } .container.selected.step3 .overlay{ -khtml-opacity:.05; -moz-opacity:.05; opacity:.05; -ms-filter:"alpha(Opacity=5)"; display:block; background-color:#fff } .container.selected.step4 .overlay{ -khtml-opacity:.05; -moz-opacity:.05; opacity:.05; -ms-filter:"alpha(Opacity=5)"; display:block; background-color:#fff } .container.selected.step5 .overlay{ -khtml-opacity:.05; -moz-opacity:.05; opacity:.05; -ms-filter:"alpha(Opacity=5)"; display:block; background-color:#fff } .container .overlay{ background-color:#000; background-color:rgba(0,0,0,0); z-index:1 } .container.step0 .overlay{ background-color:#000; background-color:rgba(0,0,0,0) } .container.step1 .overlay,.container.step2 .overlay,.container.step3 .overlay,.container.step4 .overlay,.container.step5 .overlay{ background-color:#fff; background-color:rgba(255,255,255,0) } .container.pre-selected.step0 .overlay,.container.active.step0 .overlay{ background-color:#000; background-color:rgba(0,0,0,.05) } .container.pre-selected.step0 .bd,.container.active.step0 .bd{ -khtml-opacity:.3; -moz-opacity:.3; opacity:.3; -ms-filter:"alpha(Opacity=30)" } .container.pre-selected.step1 .overlay,.container.active.step1 .overlay{ background-color:#fff; background-color:rgba(255,255,255,.2) } .container.pre-selected.step1 .bd,.container.active.step1 .bd{ -khtml-opacity:.35; -moz-opacity:.35; opacity:.35; -ms-filter:"alpha(Opacity=35)" } .container.pre-selected.step2 .overlay,.container.active.step2 .overlay{ background-color:#fff; background-color:rgba(255,255,255,.1) } .container.pre-selected.step2 .bd,.container.active.step2 .bd{ -khtml-opacity:.45; -moz-opacity:.45; opacity:.45; -ms-filter:"alpha(Opacity=45)" } .container.pre-selected.step3 .overlay,.container.active.step3 .overlay{ background-color:#fff; background-color:rgba(255,255,255,.1) } .container.pre-selected.step3 .bd,.container.active.step3 .bd{ -khtml-opacity:.55; -moz-opacity:.55; opacity:.55; -ms-filter:"alpha(Opacity=55)" } .container.pre-selected.step4 .overlay,.container.active.step4 .overlay{ background-color:#fff; background-color:rgba(255,255,255,.1) } .container.pre-selected.step4 .bd,.container.active.step4 .bd{ -khtml-opacity:.65; -moz-opacity:.65; opacity:.65; -ms-filter:"alpha(Opacity=65)" } .container.pre-selected.step5 .overlay,.container.active.step5 .overlay{ background-color:#fff; background-color:rgba(255,255,255,.1) } .container.pre-selected.step5 .bd,.container.active.step5 .bd{ -khtml-opacity:.25; -moz-opacity:.25; opacity:.25; -ms-filter:"alpha(Opacity=25)" } .container:hover .no-hover .overlay{ display:none } .preventHover .container:hover .overlay{ display:none!important } .preventHover .container.pre-selected .overlay{ display:block!important } html,body,div,applet,object,iframe,a,abbr,acronym,address,big,cite,code,del,dfn,font,img,ins,kbd,q,s,samp,small,strike,sub,sup,tt,var,dl,dt,dd,ol,ul,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,label,legend,p,blockquote,table,caption,tbody,tfoot,thead,tr,th,td{ margin:0; padding:0; border:0; outline:0; font-weight:inherit; font-style:inherit; font-size:100%; font-family:inherit; vertical-align:baseline } body{ line-height:1; color:#000; background:#fff } :focus{ outline:0 } table{ border-collapse:collapse; border-spacing:0 } caption,th,td{ text-align:left; font-weight:400 } fieldset,img{ border:0 } address,caption,cite,code,dfn,th,var{ font-style:normal; font-weight:400 } ol,ul{ list-style:none } h1,h2,h3,h4,h5,h6{ font-size:100%; font-weight:400 } blockquote:before,blockquote:after,q:before,q:after{ content:"" } blockquote,q{ quotes:"" "" } abbr,acronym{ border:0 } .buttonColor{ color:#4fb0ae } .backgroundColor{ background-color:#fff } .primaryColor{ color:#4fb0ae } .secondaryColor{ color:#4fb0ae } .overlayOpacity{ -khtml-opacity:0; -moz-opacity:0; opacity:0; -ms-filter:"alpha(Opacity=0)" } .overlayColor{ background-color:#fff } a:not(.button){ color:#3d3d3d; text-decoration:none; border-bottom:1px dotted #3d3d3d } body{ background-color:#fff; overflow:scroll; overflow-x:hidden } body.scroll-disable{ overflow:hidden } #loader{ background-color:#fff } .questions,.screen .content,.footer .content,.footer-confirm .wrapper,.screen .footer .content,.footer-message .content{ display:block; margin:0 auto; max-width:800px } .focus-current #typeform .questions>li{ -khtml-opacity:.08; -moz-opacity:.08; opacity:.08; -ms-filter:"alpha(Opacity=8)" } .resizing #typeform .form,.resizing #typeform .form .questions>li,.resizing #typeform .form .questions>li .content{ display:block!important } .resizing #typeform .screen{ position:fixed; display:block!important } .resizing.resizing-scroll #typeform .form .questions>li{ display:none!important } .resizing.resizing-scroll #typeform .form .questions>li.active{ display:block!important } body.field .footer,body.field .footer-message{ display:none } body.field #typeform .form .questions{ padding-bottom:300px } #typeform{ position:relative; font-family:"Source Sans Pro",sans-serif; z-index:3; -webkit-touch-callout:none; -webkit-user-select:none; -khtml-user-select:none; -moz-user-select:-moz-none; -ms-user-select:none; user-select:none } #typeform .form{ position:relative; z-index:5 } #typeform .form .questions{ position:relative; font-family:"Source Sans Pro",sans-serif; padding:0 20px } @media only screen and (min-width:800px){ #typeform .form .questions{ padding:0 } } #typeform .form .questions>li{ position:relative; -webkit-tap-highlight-color:rgba(0,0,0,0); -khtml-opacity:.2; -moz-opacity:.2; opacity:.2; -ms-filter:"alpha(Opacity=20)"; display:none } #typeform .form .questions>li .wrapper{ padding:30px 20px 30px 0 } #typeform .form .questions>li.active{ display:block } #typeform .form .questions>li.visible .content{ display:block } #typeform .form .questions>li.focus{ cursor:default; -khtml-opacity:1; -moz-opacity:1; opacity:1; -ms-filter:"alpha(Opacity=100)" } #typeform .form .questions>li.focus div.item .arrow{ display:block } #typeform .form .questions>li.fadeout{ -khtml-opacity:0; -moz-opacity:0; opacity:0; -ms-filter:"alpha(Opacity=0)" } #typeform .form .questions>li .content{ display:none; position:relative; padding:27px 55px 0 50px } #typeform .form .questions>li .content .description,#typeform .form .questions>li .content .stripe-description{ margin-top:-14px; margin-bottom:33px; font-size:16px; line-height:145%; text-align:left; color:#3d3d3d; -khtml-opacity:.8; -moz-opacity:.8; opacity:.8; -ms-filter:"alpha(Opacity=80)" } #typeform .form .questions>li .content .description .placeholder,#typeform .form .questions>li .content .stripe-description .placeholder{ -khtml-opacity:.3; -moz-opacity:.3; opacity:.3; -ms-filter:"alpha(Opacity=30)" } .question{ color:#3d3d3d; font-family:"Source Sans Pro",sans-serif; position:relative; padding:0; cursor:pointer; padding-left:50px; line-height:140%; text-align:left; font-size:24px; -webkit-touch-callout:text; -webkit-user-select:text; -khtml-user-select:text; -moz-user-select:text; -ms-user-select:text; user-select:text } var.tag{ border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; background-color:rgba(61,61,61,.2); border:1px solid; font-size:80%; padding:3px; white-space:nowrap; vertical-align:middle } .item{ color:#4fb0ae; font-family:"Source Sans Pro",sans-serif; position:absolute; padding:0; text-align:right; width:20px; line-height:35px; margin-right:30px; font-size:16px } .sub-question .item,.header.sub .item{ width:40px; font-size:20px } .sub-question .item .arrow,.header.sub .item .arrow{ display:none!important } .item .arrow{ position:absolute; left:29px; top:16px; height:4px; width:7px; background-color:#4fb0ae } .item .arrow .arrow-right{ width:0; height:0; border-top:5px solid transparent; border-bottom:5px solid transparent; border-left:5px solid; margin-left:7px; margin-top:-3px } .item .required{ display:none } .focus .message{ visibility:visible } .container .label,.button,.text,.multiple,.question span,.header .question,.description{ -webkit-font-smoothing:antialiased } .preview.safari #background,.preview.safari .footer,.preview.safari #progress,.preview.safari .confirm.container,.preview.safari .questions>li{ -webkit-transform:translate3d(0,0,0); -moz-transform:translate3d(0,0,0); transform:translate3d(0,0,0) } .mozilla .letter{ box-shadow:none } .mozilla .container .bg,.mozilla .container .inset{ display:none } .ie9 .question{ margin-top:0 } .ie9 input{ width:100% } .screen #watermark{ z-index:12 } #watermark{ position:fixed; top:0; right:0; padding:15px; z-index:4; font-family:Helvetica,Arial } #watermark a{ font-size:13px; text-decoration:none; color:#fff; color:rgba(255,255,255,.3) } #watermark a:hover{ color:#fff } .dark #watermark a{ color:#000; color:rgba(0,0,0,.3) } .dark #watermark a:hover{ color:#000 } .asterisk{ font-family:'Courier New',monospace; display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; margin-top:-5px } .credits{ color:#3d3d3d; height:14px; font-family:Helvetica,Arial; opacity:.8; font-size:12px } .credits a{ color:#3d3d3d; text-decoration:none; font-weight:700; border-bottom:1px solid #3d3d3d } .credits a:hover{ border-bottom:2px solid #3d3d3d } #errors,#texts{ display:none } #load{ -khtml-opacity:.01; -moz-opacity:.01; opacity:.01; -ms-filter:"alpha(Opacity=1)" } #load:before{ font-family:typeIconFont; content:"H" } .fullscreen #background{ background-size:cover } .repeat #background{ background-repeat:repeat } .no-repeat #background{ background-repeat:no-repeat } .persistent.overlayColor{ position:absolute; height:100%; width:100%; top:0; left:0; z-index:1 } .persistent.background{ position:absolute; bottom:0; left:0; right:0 } #background{ position:fixed; background-color:#fff; background-image:none; width:100%; height:100%; z-index:1; top:0 } #background div{ position:absolute; height:100%; width:100%; top:0; background-color:#fff; -khtml-opacity:0; -moz-opacity:0; opacity:0; -ms-filter:"alpha(Opacity=0)" } #private{ position:fixed; top:0; display:block; color:#faffcf; background-color:#000; font-size:12px; font-family:Helvetica,Arial; text-align:center; height:20px; z-index:12; line-height:20px; width:100%; margin:0 auto; border-radius:4px; -webkit-border-radius:4px; -moz-border-radius:4px; margin-top:-4px; padding-top:4px } #private img{ width:10px; height:10px; position:absolute; right:8px; top:8px; cursor:pointer } #private span{ display:none } #private.top span.top{ display:block } #private.embed span.embed{ display:block } .empty-form{ position:fixed; top:50%; z-index:3; width:100%; padding:10px; font-size:18px; line-height:20px; text-align:center; margin-top:-10px } .header{ position:fixed; width:100%; z-index:6; border-bottom-style:solid; border-bottom-width:1px; overflow:hidden; -moz-transition:top ease-out 150ms 0; -webkit-transition:top ease-out 150ms 0; -o-transition:top ease-out 150ms 0; transition:top ease-out 150ms 0 } .header.step0{ border-color:rgba(0,0,0,.2); -webkit-box-shadow:0 0 3px rgba(0,0,0,.2); -moz-box-shadow:0 0 3px rgba(0,0,0,.2); box-shadow:0 0 3px rgba(0,0,0,.2) } .header.step0 .overlay{ background-color:#000; -khtml-opacity:.02; -moz-opacity:.02; opacity:.02; -ms-filter:"alpha(Opacity=2)" } .header.step1{ border-color:rgba(0,0,0,.25); -webkit-box-shadow:0 0 3px rgba(0,0,0,.2); -moz-box-shadow:0 0 3px rgba(0,0,0,.2); box-shadow:0 0 3px rgba(0,0,0,.2) } .header.step1 .overlay{ background-color:#000; -khtml-opacity:.04; -moz-opacity:.04; opacity:.04; -ms-filter:"alpha(Opacity=4)" } .header.step2{ border-color:rgba(0,0,0,.25); -webkit-box-shadow:0 0 3px rgba(0,0,0,.25); -moz-box-shadow:0 0 3px rgba(0,0,0,.25); box-shadow:0 0 3px rgba(0,0,0,.25) } .header.step2 .overlay{ background-color:#000; -khtml-opacity:.05; -moz-opacity:.05; opacity:.05; -ms-filter:"alpha(Opacity=5)" } .header.step3{ border-color:rgba(0,0,0,.25); -webkit-box-shadow:0 0 3px rgba(0,0,0,.3); -moz-box-shadow:0 0 3px rgba(0,0,0,.3); box-shadow:0 0 3px rgba(0,0,0,.3) } .header.step3 .overlay{ background-color:#000; -khtml-opacity:.05; -moz-opacity:.05; opacity:.05; -ms-filter:"alpha(Opacity=5)" } .header.step4{ border-color:rgba(0,0,0,.4); -webkit-box-shadow:0 0 3px rgba(0,0,0,.45); -moz-box-shadow:0 0 3px rgba(0,0,0,.45); box-shadow:0 0 3px rgba(0,0,0,.45) } .header.step4 .overlay{ background-color:#000; -khtml-opacity:.08; -moz-opacity:.08; opacity:.08; -ms-filter:"alpha(Opacity=8)" } .header.step5{ -webkit-box-shadow:0 0 3px rgba(0,0,0,.45); -moz-box-shadow:0 0 3px rgba(0,0,0,.45); box-shadow:0 0 3px rgba(0,0,0,.45); border-top:1px solid rgba(255,255,255,.15) } .header.step5 .overlay{ background-color:#fff; -khtml-opacity:.06; -moz-opacity:.06; opacity:.06; -ms-filter:"alpha(Opacity=6)" } .header.sub{ z-index:5; top:100px; -khtml-opacity:0; -moz-opacity:0; opacity:0; -ms-filter:"alpha(Opacity=0)"; visibility:hidden; -moz-transition:opacity ease-out 150ms 0; -webkit-transition:opacity ease-out 150ms 0; -o-transition:opacity ease-out 150ms 0; transition:opacity ease-out 150ms 0 } .header.sub.show{ -khtml-opacity:1; -moz-opacity:1; opacity:1; -ms-filter:"alpha(Opacity=100)"; visibility:visible; -moz-transition:none ease-out 0 0; -webkit-transition:none ease-out 0 0; -o-transition:none ease-out 0 0; transition:none ease-out 0 0 } .header .arrow{ display:block } .header .description{ display:none; visibility:hidden } .header .question-wrap{ position:relative } .header .question-wrap .item{ top:0 } .header .question .attachment{ float:right; padding-left:20px } .header .question .attachment img{ height:78px } .header .question .stripe-logo{ margin-top:0; float:right } .header .attachment{ display:none } .header .close{ display:none; position:fixed; top:10px; right:30px; width:30px; height:30px; font-size:55px; color:rgba(61,61,61,.8); font-family:HelveticaNeue-Light,"Helvetica Neue Light","Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif; font-weight:200; cursor:pointer } .header .close:hover{ color:#3d3d3d } .header.type-default .question{ display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; -o-text-overflow:ellipsis; -ms-text-overflow:ellipsis } .header.type-default:hover{ height:auto!important } .header.type-default:hover .question{ display:block; white-space:normal; overflow:auto; text-overflow:clip; -o-text-overflow:clip; -ms-text-overflow:clip } .header.type-group{ -moz-transition:all ease-out 150ms 0; -webkit-transition:all ease-out 150ms 0; -o-transition:all ease-out 150ms 0; transition:all ease-out 150ms 0; height:100px } .header.type-group.openable:hover{ padding-bottom:7px } .header.type-group .question-wrap{ padding:0 50px 0 0 } .header.type-group .question-wrap .question{ display:block; width:100%; font-size:20px; line-height:128%; float:left } .header.type-group .question-wrap .item{ top:-5px } .header.type-group .full-content{ padding:0 50px } .header.type-group .full-content .description{ visibility:hidden; display:none; padding:15px 0; font-size:16px; line-height:145%; text-align:left; color:#3d3d3d; -khtml-opacity:.8; -moz-opacity:.8; opacity:.8; -ms-filter:"alpha(Opacity=80)" } .header.type-group.one-lines .question-wrap{ top:25px } .header.type-group.one-lines .question .attachment{ margin-top:-25px } .header.type-group.two-lines .question-wrap{ top:12px } .header.type-group.two-lines .question .attachment{ margin-top:-10px } .header.type-group.three-lines .question-wrap{ top:0 } .header.type-group.three-lines .question .attachment{ margin-top:0 } .header.type-group.n-lines .question-wrap{ top:0 } .header.type-group.n-lines .smooth-break{ display:block } .header.type-group .smooth-break{ position:absolute; display:none; left:0; bottom:0; right:0; height:10px; z-index:5; background-repeat:repeat-x; background-image:-khtml-gradient(linear,left top,left bottom,from(rgba(245,245,245,0)),to(#f5f5f5)); background-image:-moz-linear-gradient(rgba(245,245,245,0),#f5f5f5); background-image:-ms-linear-gradient(rgba(245,245,245,0),#f5f5f5); background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,rgba(245,245,245,0)),color-stop(100%,#f5f5f5)); background-image:-webkit-linear-gradient(rgba(245,245,245,0),#f5f5f5); background-image:-o-linear-gradient(rgba(245,245,245,0),#f5f5f5); background-image:linear-gradient(rgba(245,245,245,0),#f5f5f5) } .header.thumbnail-show .question .attachment{ display:block } .header.state-full .question-wrap{ top:0!important } .header.state-full .question .attachment{ display:none } .header.state-full .content{ overflow:scroll } .header.state-full .content .content-wrapper{ margin-bottom:30px } .header.state-full .full-content .attachment{ padding:15px 0; display:block } .header.state-full .full-content .description{ visibility:visible } .header.state-full .close{ display:block } .header .background{ position:absolute; background:#fff; top:0; left:0; right:0; bottom:0; z-index:1 } .header .overlay{ position:absolute; top:0; left:0; right:0; bottom:0; z-index:3; background-color:#fff; -khtml-opacity:0; -moz-opacity:0; opacity:0; -ms-filter:"alpha(Opacity=0)" } .header .content{ z-index:5; padding:11px 20px; position:relative; height:100% } .header .content .question{ max-width:715px; margin:0 } .header .content .content-wrapper{ display:block; margin:0 auto; max-width:800px } .setHeaderGradient{ background-repeat:repeat-x; background-image:-khtml-gradient(linear,left top,left bottom,from(rgba(245,245,245,0)),to(#f5f5f5)); background-image:-moz-linear-gradient(rgba(245,245,245,0),#f5f5f5); background-image:-ms-linear-gradient(rgba(245,245,245,0),#f5f5f5); background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,rgba(245,245,245,0)),color-stop(100%,#f5f5f5)); background-image:-webkit-linear-gradient(rgba(245,245,245,0),#f5f5f5); background-image:-o-linear-gradient(rgba(245,245,245,0),#f5f5f5); background-image:linear-gradient(rgba(245,245,245,0),#f5f5f5) } .footer-error.confirm-nav .footer-message{ display:none } .footer-error .footer-message{ -moz-transition:bottom ease-out 100ms 0; -webkit-transition:bottom ease-out 100ms 0; -o-transition:bottom ease-out 100ms 0; transition:bottom ease-out 100ms 0; bottom:60px } .footer-error.footer-submit .footer-message{ -moz-transition:bottom ease-out 100ms 0; -webkit-transition:bottom ease-out 100ms 0; -o-transition:bottom ease-out 100ms 0; transition:bottom ease-out 100ms 0; bottom:175px } .footer-error.proportion.footer-submit .footer-message,.footer-error.percent.footer-submit .footer-message{ -moz-transition:bottom ease-out 100ms 0; -webkit-transition:bottom ease-out 100ms 0; -o-transition:bottom ease-out 100ms 0; transition:bottom ease-out 100ms 0; bottom:125px } .footer-message{ position:fixed; width:100%; bottom:-5px; z-index:5; -moz-transition:bottom ease-out 100ms 0; -webkit-transition:bottom ease-out 100ms 0; -o-transition:bottom ease-out 100ms 0; transition:bottom ease-out 100ms 0 } .footer-message .content{ padding:5px } .footer-message .content span{ font-family:Helvetica,Arial; position:relative; color:#fff; font-size:13px; z-index:2; line-height:13px; left:10px } @media only screen and (min-width:800px){ .footer-message .content span{ left:54px } } .footer-message .background{ position:absolute; left:0; top:0; right:0; bottom:0; background-color:#900; z-index:1 } .footer{ position:fixed; bottom:0; width:100%; height:60px; z-index:5; overflow:hidden; border-top-style:solid; border-top-width:1px; -webkit-touch-callout:none; -webkit-user-select:none; -khtml-user-select:none; -moz-user-select:-moz-none; -ms-user-select:none; user-select:none } .footer.step0{ border-color:rgba(0,0,0,.2); -webkit-box-shadow:0 0 3px rgba(0,0,0,.2); -moz-box-shadow:0 0 3px rgba(0,0,0,.2); box-shadow:0 0 3px rgba(0,0,0,.2) } .footer.step0 .overlay{ background-color:#000; -khtml-opacity:.02; -moz-opacity:.02; opacity:.02; -ms-filter:"alpha(Opacity=2)" } .footer.step1{ border-color:rgba(0,0,0,.25); -webkit-box-shadow:0 0 3px rgba(0,0,0,.2); -moz-box-shadow:0 0 3px rgba(0,0,0,.2); box-shadow:0 0 3px rgba(0,0,0,.2) } .footer.step1 .overlay{ background-color:#000; -khtml-opacity:.04; -moz-opacity:.04; opacity:.04; -ms-filter:"alpha(Opacity=4)" } .footer.step2{ border-color:rgba(0,0,0,.25); -webkit-box-shadow:0 0 3px rgba(0,0,0,.25); -moz-box-shadow:0 0 3px rgba(0,0,0,.25); box-shadow:0 0 3px rgba(0,0,0,.25) } .footer.step2 .overlay{ background-color:#000; -khtml-opacity:.05; -moz-opacity:.05; opacity:.05; -ms-filter:"alpha(Opacity=5)" } .footer.step3{ border-color:rgba(0,0,0,.25); -webkit-box-shadow:0 0 3px rgba(0,0,0,.3); -moz-box-shadow:0 0 3px rgba(0,0,0,.3); box-shadow:0 0 3px rgba(0,0,0,.3) } .footer.step3 .overlay{ background-color:#000; -khtml-opacity:.05; -moz-opacity:.05; opacity:.05; -ms-filter:"alpha(Opacity=5)" } .footer.step4{ border-color:rgba(0,0,0,.4); -webkit-box-shadow:0 0 3px rgba(0,0,0,.45); -moz-box-shadow:0 0 3px rgba(0,0,0,.45); box-shadow:0 0 3px rgba(0,0,0,.45) } .footer.step4 .overlay{ background-color:#000; -khtml-opacity:.08; -moz-opacity:.08; opacity:.08; -ms-filter:"alpha(Opacity=8)" } .footer.step5{ -webkit-box-shadow:0 0 3px rgba(0,0,0,.45); -moz-box-shadow:0 0 3px rgba(0,0,0,.45); box-shadow:0 0 3px rgba(0,0,0,.45); border-top:1px solid rgba(255,255,255,.15) } .footer.step5 .overlay{ background-color:#fff; -khtml-opacity:.06; -moz-opacity:.06; opacity:.06; -ms-filter:"alpha(Opacity=6)" } .footer .background{ z-index:1; height:100%; background-color:#fff } .footer .by{ position:absolute; right:115px; top:17px; z-index:2; display:none } @media only screen and (min-width:500px){ .footer .by{ display:block } } .footer .by .button{ text-decoration:none; font-family:Helvetica,Arial; font-size:11px; padding:3px 6px; height:16px; line-height:17px; font-weight:400 } .footer .by .button:active{ line-height:18px!important } .footer.review .content .button-wrapper.review{ display:block } .footer.review .content .button-wrapper.submit{ display:none } .footer .overlay{ position:absolute; top:0; left:0; right:0; bottom:0; z-index:2; -khtml-opacity:0; -moz-opacity:0; opacity:0; -ms-filter:"alpha(Opacity=0)"; background-color:#fff } .footer .button-text{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; font-family:Helvetica,Arial; font-size:11px; margin:16px 8px 0; color:#4fb0ae; top:6px; position:absolute; left:100%; width:150px; text-align:left } .footer .nav-buttons{ position:absolute; z-index:2; right:8px; top:8px } .footer .nav-buttons .button-wrapper.up{ top:8px; margin-right:2px } .footer .nav-buttons .button-wrapper.down{ top:8px } .footer .content{ position:relative; z-index:2 } .footer .content .text{ color:#4fb0ae } .footer .content .button-wrapper{ position:absolute } .footer .content .button-wrapper.confirm{ top:8px; left:0 } .footer .content .button-wrapper.submit{ top:60px; left:10px } @media only screen and (min-width:800px){ .footer .content .button-wrapper.submit{ left:55px } } .footer .content .button-wrapper.review{ top:60px; display:none; left:10px } @media only screen and (min-width:800px){ .footer .content .button-wrapper.review{ left:55px } } .footer .content .phishing-notice{ top:131px; left:10px; position:absolute; opacity:.8; font-size:13px } @media only screen and (min-width:800px){ .footer .content .phishing-notice{ left:55px } } .footer .content .phishing-notice a{ color:#4fb0ae; text-decoration:underline; border-bottom:0 } .footer .content #progress{ top:0; margin-top:14px; position:absolute; width:324px; left:10px; visibility:hidden; -khtml-opacity:0; -moz-opacity:0; opacity:0; -ms-filter:"alpha(Opacity=0)"; -moz-transition:opacity ease-out 300ms 0; -webkit-transition:opacity ease-out 300ms 0; -o-transition:opacity ease-out 300ms 0; transition:opacity ease-out 300ms 0 } @media only screen and (min-width:800px){ .footer .content #progress{ left:55px } } .footer .content #progress.show{ visibility:visible; -khtml-opacity:1; -moz-opacity:1; opacity:1; -ms-filter:"alpha(Opacity=100)"; -moz-transition:opacity ease-out 300ms 0; -webkit-transition:opacity ease-out 300ms 0; -o-transition:opacity ease-out 300ms 0; transition:opacity ease-out 300ms 0 } .footer .content #progress .label{ font-size:13px; font-family:Helvetica,Arial; color:#4fb0ae } .footer .content #progress .bar{ position:relative; margin:8px 0; width:225px; height:6px; display:block } .footer .content #progress .bar div{ position:absolute; left:0; top:0; bottom:0 } .footer .content #progress .bar div.wrapper{ right:0; z-index:1; -khtml-opacity:.35; -moz-opacity:.35; opacity:.35; -ms-filter:"alpha(Opacity=35)"; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; background-color:#4fb0ae } .footer .content #progress .bar div.progress{ display:block; width:0; z-index:2; height:100%; -moz-transition:width ease-out 200ms 0; -webkit-transition:width ease-out 200ms 0; -o-transition:width ease-out 200ms 0; transition:width ease-out 200ms 0; background-color:#4fb0ae; -webkit-border-top-left-radius:10px; -webkit-border-top-right-radius:0; -webkit-border-bottom-right-radius:0; -webkit-border-bottom-left-radius:10px; -moz-border-radius-topleft:10px; -moz-border-radius-topright:0; -moz-border-radius-bottomright:0; -moz-border-radius-bottomleft:10px; border-top-left-radius:10px; border-top-right-radius:0; border-bottom-right-radius:0; border-bottom-left-radius:10px } .footer .content #progress .bar div.progress.rounded{ -webkit-border-top-left-radius:10px; -webkit-border-top-right-radius:10px; -webkit-border-bottom-right-radius:10px; -webkit-border-bottom-left-radius:10px; -moz-border-radius-topleft:10px; -moz-border-radius-topright:10px; -moz-border-radius-bottomright:10px; -moz-border-radius-bottomleft:10px; border-top-left-radius:10px; border-top-right-radius:10px; border-bottom-right-radius:10px; border-bottom-left-radius:10px } .scroll-overlay{ position:fixed; top:0; bottom:0; left:0; right:0; background:#ccc; display:none; z-index:4 } .proportion .footer .content #progress,.percent .footer .content #progress{ visibility:visible; -khtml-opacity:1; -moz-opacity:1; opacity:1; -ms-filter:"alpha(Opacity=100)" } #banner{ position:fixed; bottom:-60px; width:100%; height:60px; z-index:5; overflow:hidden; border-top-style:solid; border-top-width:1px; -webkit-touch-callout:none; -webkit-user-select:none; -khtml-user-select:none; -moz-user-select:-moz-none; -ms-user-select:none; user-select:none; -khtml-opacity:0; -moz-opacity:0; opacity:0; -ms-filter:"alpha(Opacity=0)"; -moz-transition:all ease-out 300ms 0; -webkit-transition:all ease-out 300ms 0; -o-transition:all ease-out 300ms 0; transition:all ease-out 300ms 0 } #banner.step0{ border-color:rgba(0,0,0,.2); -webkit-box-shadow:0 0 3px rgba(0,0,0,.2); -moz-box-shadow:0 0 3px rgba(0,0,0,.2); box-shadow:0 0 3px rgba(0,0,0,.2) } #banner.step0 .overlay{ background-color:#000; -khtml-opacity:.02; -moz-opacity:.02; opacity:.02; -ms-filter:"alpha(Opacity=2)" } #banner.step1{ border-color:rgba(0,0,0,.25); -webkit-box-shadow:0 0 3px rgba(0,0,0,.2); -moz-box-shadow:0 0 3px rgba(0,0,0,.2); box-shadow:0 0 3px rgba(0,0,0,.2) } #banner.step1 .overlay{ background-color:#000; -khtml-opacity:.04; -moz-opacity:.04; opacity:.04; -ms-filter:"alpha(Opacity=4)" } #banner.step2{ border-color:rgba(0,0,0,.25); -webkit-box-shadow:0 0 3px rgba(0,0,0,.25); -moz-box-shadow:0 0 3px rgba(0,0,0,.25); box-shadow:0 0 3px rgba(0,0,0,.25) } #banner.step2 .overlay{ background-color:#000; -khtml-opacity:.05; -moz-opacity:.05; opacity:.05; -ms-filter:"alpha(Opacity=5)" } #banner.step3{ border-color:rgba(0,0,0,.25); -webkit-box-shadow:0 0 3px rgba(0,0,0,.3); -moz-box-shadow:0 0 3px rgba(0,0,0,.3); box-shadow:0 0 3px rgba(0,0,0,.3) } #banner.step3 .overlay{ background-color:#000; -khtml-opacity:.05; -moz-opacity:.05; opacity:.05; -ms-filter:"alpha(Opacity=5)" } #banner.step4{ border-color:rgba(0,0,0,.4); -webkit-box-shadow:0 0 3px rgba(0,0,0,.45); -moz-box-shadow:0 0 3px rgba(0,0,0,.45); box-shadow:0 0 3px rgba(0,0,0,.45) } #banner.step4 .overlay{ background-color:#000; -khtml-opacity:.08; -moz-opacity:.08; opacity:.08; -ms-filter:"alpha(Opacity=8)" } #banner.step5{ -webkit-box-shadow:0 0 3px rgba(0,0,0,.45); -moz-box-shadow:0 0 3px rgba(0,0,0,.45); box-shadow:0 0 3px rgba(0,0,0,.45); border-top:1px solid rgba(255,255,255,.15) } #banner.step5 .overlay{ background-color:#fff; -khtml-opacity:.06; -moz-opacity:.06; opacity:.06; -ms-filter:"alpha(Opacity=6)" } .field #banner{ -moz-transition:none ease-out 0 0; -webkit-transition:none ease-out 0 0; -o-transition:none ease-out 0 0; transition:none ease-out 0 0 } .resizing #banner{ display:none } .banner-top #banner{ box-shadow:none; border-bottom-style:solid; border-bottom-width:1px; top:0; height:40px } .banner-top #banner .by{ top:8px; right:8px } #banner.risen{ bottom:0; -khtml-opacity:1; -moz-opacity:1; opacity:1; -ms-filter:"alpha(Opacity=100)" } #banner .background{ z-index:1; height:100%; background-color:#fff } #banner .by{ position:absolute; right:16px; top:17px; z-index:2; display:block } #banner .by span{ display:block; float:left; line-height:25px; margin-right:10px; font-family:Arial,sans-serif; font-size:14px; color:#4fb0ae } #banner .by .button{ text-decoration:none; font-family:Helvetica,Arial; font-size:13px; padding:3px 6px; height:17px; line-height:17px; font-weight:400 } #banner .by .button:active{ line-height:18px!important } #banner .overlay{ position:absolute; top:0; left:0; right:0; bottom:0; z-index:2; -khtml-opacity:0; -moz-opacity:0; opacity:0; -ms-filter:"alpha(Opacity=0)"; background-color:#fff } ::-webkit-input-placeholder{ color:rgba(79,176,174,.4) } :-moz-placeholder{ color:rgba(79,176,174,.4) } ::-moz-placeholder{ color:rgba(79,176,174,.4) } :-ms-input-placeholder{ color:rgba(79,176,174,.4) } .content-wrapper>.text,.button-wrap>.text{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; font-family:Helvetica,Arial; font-size:11px; margin:16px 8px 0; color:#4fb0ae } textarea.placeholder,input.placeholder{ -khtml-opacity:.3; -moz-opacity:.3; opacity:.3; -ms-filter:"alpha(Opacity=30)" } .confirm-nav.confirm-footer .footer-confirm{ visibility:visible; height:120px } .footer-confirm{ position:fixed; left:0; right:0; bottom:0; -moz-transition:all ease-out 200ms 0; -webkit-transition:all ease-out 200ms 0; -o-transition:all ease-out 200ms 0; transition:all ease-out 200ms 0; z-index:4; height:60px; width:100%; overflow:hidden; border-top-style:solid; border-top-width:1px; -webkit-touch-callout:none; -webkit-user-select:none; -khtml-user-select:none; -moz-user-select:-moz-none; -ms-user-select:none; user-select:none; visibility:hidden } .footer-confirm.step0{ border-color:rgba(0,0,0,.2); -webkit-box-shadow:0 0 3px rgba(0,0,0,.2); -moz-box-shadow:0 0 3px rgba(0,0,0,.2); box-shadow:0 0 3px rgba(0,0,0,.2) } .footer-confirm.step0 .overlay{ background-color:#000; -khtml-opacity:.02; -moz-opacity:.02; opacity:.02; -ms-filter:"alpha(Opacity=2)" } .footer-confirm.step1{ border-color:rgba(0,0,0,.25); -webkit-box-shadow:0 0 3px rgba(0,0,0,.2); -moz-box-shadow:0 0 3px rgba(0,0,0,.2); box-shadow:0 0 3px rgba(0,0,0,.2) } .footer-confirm.step1 .overlay{ background-color:#000; -khtml-opacity:.04; -moz-opacity:.04; opacity:.04; -ms-filter:"alpha(Opacity=4)" } .footer-confirm.step2{ border-color:rgba(0,0,0,.25); -webkit-box-shadow:0 0 3px rgba(0,0,0,.25); -moz-box-shadow:0 0 3px rgba(0,0,0,.25); box-shadow:0 0 3px rgba(0,0,0,.25) } .footer-confirm.step2 .overlay{ background-color:#000; -khtml-opacity:.05; -moz-opacity:.05; opacity:.05; -ms-filter:"alpha(Opacity=5)" } .footer-confirm.step3{ border-color:rgba(0,0,0,.25); -webkit-box-shadow:0 0 3px rgba(0,0,0,.3); -moz-box-shadow:0 0 3px rgba(0,0,0,.3); box-shadow:0 0 3px rgba(0,0,0,.3) } .footer-confirm.step3 .overlay{ background-color:#000; -khtml-opacity:.05; -moz-opacity:.05; opacity:.05; -ms-filter:"alpha(Opacity=5)" } .footer-confirm.step4{ border-color:rgba(0,0,0,.4); -webkit-box-shadow:0 0 3px rgba(0,0,0,.45); -moz-box-shadow:0 0 3px rgba(0,0,0,.45); box-shadow:0 0 3px rgba(0,0,0,.45) } .footer-confirm.step4 .overlay{ background-color:#000; -khtml-opacity:.08; -moz-opacity:.08; opacity:.08; -ms-filter:"alpha(Opacity=8)" } .footer-confirm.step5{ -webkit-box-shadow:0 0 3px rgba(0,0,0,.45); -moz-box-shadow:0 0 3px rgba(0,0,0,.45); box-shadow:0 0 3px rgba(0,0,0,.45); border-top:1px solid rgba(255,255,255,.15) } .footer-confirm.step5 .overlay{ background-color:#fff; -khtml-opacity:.06; -moz-opacity:.06; opacity:.06; -ms-filter:"alpha(Opacity=6)" } .footer-confirm .content{ position:relative; z-index:2; padding:0 55px } .footer-confirm .content .button-wrapper{ position:relative; left:0 } .footer-confirm .content .text{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; font-family:Helvetica,Arial; font-size:11px; margin:16px 8px 0; color:#4fb0ae; padding-top:6px; font-size:12px } .footer-confirm.show{ visibility:visible } .footer-confirm .button-wrapper.confirm{ z-index:3; top:6px } .footer-confirm .background{ z-index:1; top:0; background-color:#fff } .footer-confirm .overlay{ position:absolute; top:0; left:0; right:0; bottom:0; z-index:2; -khtml-opacity:0; -moz-opacity:0; opacity:0; -ms-filter:"alpha(Opacity=0)"; background-color:#fff } .footer-confirm .content .text .default{ display:block } .footer-confirm .content .text .multiple{ display:none } .footer-confirm .content .text .textarea{ display:none } .confirm-text-default .footer-confirm .content .text .default{ display:block } .confirm-text-default .footer-confirm .content .text .multiple{ display:none } .confirm-text-default .footer-confirm .content .text .textarea{ display:none } .confirm-text-textarea .footer-confirm .content .text .textarea{ display:block } .confirm-text-textarea .footer-confirm .content .text .default{ display:none } .confirm-text-textarea .footer-confirm .content .text .multiple{ display:none } .confirm-text-multiple .footer-confirm .content .text .multiple{ display:block } .confirm-text-multiple .footer-confirm .content .text .default{ display:none } .confirm-text-multiple .footer-confirm .content .text .textarea{ display:none } .button-wrapper{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline } .button-wrapper.loading #spin{ left:50%; text-align:center; position:absolute; top:50%; -khtml-opacity:.4; -moz-opacity:.4; opacity:.4; -ms-filter:"alpha(Opacity=40)" } .button-wrapper.loading .button>span{ visibility:hidden } .button.nav{ display:inline-block; cursor:default; background-color:#4fb0ae; width:auto; height:35px; line-height:30px; padding:5px 12px 0; font-size:19px; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; text-align:center; font-weight:700; font-family:"Source Sans Pro",sans-serif; max-width:610px; overflow:hidden; -moz-transition:background-color ease-out 100ms 0; -webkit-transition:background-color ease-out 100ms 0; -o-transition:background-color ease-out 100ms 0; transition:background-color ease-out 100ms 0; color:#edf7f7; background-image:url(https://s3-eu-west-1.amazonaws.com/typeform-media-static/button-gradient-light.png); border-top:1px solid #479e9d; border-left:1px solid #367776; border-right:1px solid #367776; border-bottom:1px solid #24504f; box-shadow:inset 0 1px 1px rgba(255,255,255,.3); -webkit-box-shadow:inset 0 1px 1px rgba(255,255,255,.3); -moz-box-shadow:inset 0 1px 1px rgba(255,255,255,.3); box-shadow:inset 0 1px 1px rgba(255,255,255,.3),0 2px 2px rgba(0,0,0,0),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0; -webkit-box-shadow:inset 0 1px 1px rgba(255,255,255,.3),0 2px 2px rgba(0,0,0,0),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0; -moz-box-shadow:inset 0 1px 1px rgba(255,255,255,.3),0 2px 2px rgba(0,0,0,0),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0; text-shadow:rgba(0,0,0,.4) 0 -1px 1px } .button.nav.enabled{ cursor:pointer } .default .focus .button.nav:hover.enabled,.default .footer .button.nav:hover.enabled,.default .footer-confirm .button.nav:hover.enabled,.screen .focus .button.nav:hover.enabled,.default #banner .button.nav:hover.enabled{ -moz-transition:background-color ease-out 100ms 0; -webkit-transition:background-color ease-out 100ms 0; -o-transition:background-color ease-out 100ms 0; transition:background-color ease-out 100ms 0; background-color:#72c0be; cursor:pointer } .default .focus .button.nav:active.enabled,.default .footer .button.nav:active.enabled,.button.nav.selected,.button.nav.active.enabled,.default #banner .button.nav:active.enabled{ -webkit-box-shadow:inset 0 2px 2px rgba(0,0,0,.8); -moz-box-shadow:inset 0 2px 2px rgba(0,0,0,.8); box-shadow:inset 0 2px 2px rgba(0,0,0,.8); line-height:32px; background-color:#72c0be; border:0; border-bottom:1px solid #2f6a68; margin:1px; margin-bottom:0 } .default .focus .button.nav:active.enabled span,.default .footer .button.nav:active.enabled span,.button.nav.selected span,.button.nav.active.enabled span,.default #banner .button.nav:active.enabled span{ margin-top:1px } .button.nav.disabled{ -khtml-opacity:.5; -moz-opacity:.5; opacity:.5; -ms-filter:"alpha(Opacity=50)"; -moz-transition:all ease-out 0 0; -webkit-transition:all ease-out 0 0; -o-transition:all ease-out 0 0; transition:all ease-out 0 0 } .button.nav .reload{ background:url(https://s3-eu-west-1.amazonaws.com/typeform-media-static/reload-black.png) no-repeat; width:24px; margin-top:7px; height:30px; position:relative; display:block; float:left; margin-right:17px; top:1px; -khtml-opacity:.4; -moz-opacity:.4; opacity:.4; -ms-filter:"alpha(Opacity=40)" } .button.nav .tick{ background:url(https://s3-eu-west-1.amazonaws.com/typeform-media-static/tick-black.png) no-repeat; position:relative; display:block; float:right; width:32px; height:30px; margin:9px 25px 0; -khtml-opacity:.4; -moz-opacity:.4; opacity:.4; -ms-filter:"alpha(Opacity=40)" } .button.nav .next{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; font-size:27px; width:20px; line-height:31px; margin-left:2px } .button.nav .next:before{ font-family:typeIconFont; content:"I" } .button.nav .confirm{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; font-size:20px; width:16px; line-height:28px; margin-left:9px } .button.nav .confirm:before{ font-family:typeIconFont; content:"H" } .button.nav .up{ display:block; font-size:27px; width:21px; line-height:30px; margin-left:-4px; margin-right:2px; text-align:left; font-weight:400 } .button.nav .up:before{ font-family:typeIconFont; content:"K" } .button.nav .down{ display:block; font-size:27px; width:21px; line-height:30px; margin-left:-4px; margin-right:2px; text-align:left; font-weight:400 } .button.nav .down:before{ font-family:typeIconFont; content:"L" } .button.nav.red{ display:inline-block; cursor:default; background-color:#900; width:auto; height:35px; line-height:30px; padding:5px 12px 0; font-size:19px; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; text-align:center; font-weight:700; font-family:"Source Sans Pro",sans-serif; max-width:610px; overflow:hidden; -moz-transition:background-color ease-out 100ms 0; -webkit-transition:background-color ease-out 100ms 0; -o-transition:background-color ease-out 100ms 0; transition:background-color ease-out 100ms 0; color:#ff8080; background-image:url(https://s3-eu-west-1.amazonaws.com/typeform-media-static/button-gradient-dark.png); border-top:1px solid #666; border-left:1px solid #262626; border-right:1px solid #262626; border-bottom:1px solid #000; box-shadow:inset 0 1px 1px rgba(255,255,255,.3); -webkit-box-shadow:inset 0 1px 1px rgba(255,255,255,.3); -moz-box-shadow:inset 0 1px 1px rgba(255,255,255,.3); box-shadow:inset 0 1px 1px rgba(255,255,255,.3),0 2px 2px rgba(0,0,0,0),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0; -webkit-box-shadow:inset 0 1px 1px rgba(255,255,255,.3),0 2px 2px rgba(0,0,0,0),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0; -moz-box-shadow:inset 0 1px 1px rgba(255,255,255,.3),0 2px 2px rgba(0,0,0,0),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0; text-shadow:rgba(0,0,0,.4) 0 -1px 1px } .button.nav.red.enabled{ cursor:pointer } .default .focus .button.nav.red:hover.enabled,.default .footer .button.nav.red:hover.enabled,.default .footer-confirm .button.nav.red:hover.enabled,.screen .focus .button.nav.red:hover.enabled,.default #banner .button.nav.red:hover.enabled{ -moz-transition:background-color ease-out 100ms 0; -webkit-transition:background-color ease-out 100ms 0; -o-transition:background-color ease-out 100ms 0; transition:background-color ease-out 100ms 0; background-color:#c00; cursor:pointer } .default .focus .button.nav.red:active.enabled,.default .footer .button.nav.red:active.enabled,.button.nav.red.selected,.button.nav.red.active.enabled,.default #banner .button.nav.red:active.enabled{ -webkit-box-shadow:inset 0 2px 2px rgba(0,0,0,.8); -moz-box-shadow:inset 0 2px 2px rgba(0,0,0,.8); box-shadow:inset 0 2px 2px rgba(0,0,0,.8); line-height:32px; background-color:#c00; border:0; border-bottom:1px solid #300; margin:1px; margin-bottom:0 } .default .focus .button.nav.red:active.enabled span,.default .footer .button.nav.red:active.enabled span,.button.nav.red.selected span,.button.nav.red.active.enabled span,.default #banner .button.nav.red:active.enabled span{ margin-top:1px } .button.nav.red.disabled{ -khtml-opacity:.5; -moz-opacity:.5; opacity:.5; -ms-filter:"alpha(Opacity=50)"; -moz-transition:all ease-out 0 0; -webkit-transition:all ease-out 0 0; -o-transition:all ease-out 0 0; transition:all ease-out 0 0 } .button.nav.red .reload{ background:url(https://s3-eu-west-1.amazonaws.com/typeform-media-static/reload-black.png) no-repeat; width:24px; margin-top:7px; height:30px; position:relative; display:block; float:left; margin-right:17px; top:1px; -khtml-opacity:.4; -moz-opacity:.4; opacity:.4; -ms-filter:"alpha(Opacity=40)" } .button.nav.red .tick{ background:url(https://s3-eu-west-1.amazonaws.com/typeform-media-static/tick-black.png) no-repeat; position:relative; display:block; float:right; width:32px; height:30px; margin:9px 25px 0; -khtml-opacity:.4; -moz-opacity:.4; opacity:.4; -ms-filter:"alpha(Opacity=40)" } .button.nav.red .next{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; font-size:27px; width:20px; line-height:31px; margin-left:2px } .button.nav.red .next:before{ font-family:typeIconFont; content:"I" } .button.nav.red .confirm{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; font-size:20px; width:16px; line-height:28px; margin-left:9px } .button.nav.red .confirm:before{ font-family:typeIconFont; content:"H" } .button.nav.red .up{ display:block; font-size:27px; width:21px; line-height:30px; margin-left:-4px; margin-right:2px; text-align:left; font-weight:400 } .button.nav.red .up:before{ font-family:typeIconFont; content:"K" } .button.nav.red .down{ display:block; font-size:27px; width:21px; line-height:30px; margin-left:-4px; margin-right:2px; text-align:left; font-weight:400 } .button.nav.red .down:before{ font-family:typeIconFont; content:"L" } .button.key{ display:inline-block; cursor:default; background-color:#4fb0ae; width:15px; height:25px; line-height:19px; padding:5px 7px 0; font-size:18px; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; text-align:center; font-weight:700; font-family:"Source Sans Pro",sans-serif; max-width:610px; overflow:hidden; -moz-transition:background-color ease-out 100ms 0; -webkit-transition:background-color ease-out 100ms 0; -o-transition:background-color ease-out 100ms 0; transition:background-color ease-out 100ms 0; color:#edf7f7; background-image:url(https://s3-eu-west-1.amazonaws.com/typeform-media-static/button-gradient-light.png); border-top:1px solid #479e9d; border-left:1px solid #367776; border-right:1px solid #367776; border-bottom:1px solid #24504f; box-shadow:inset 0 1px 1px rgba(255,255,255,.3); -webkit-box-shadow:inset 0 1px 1px rgba(255,255,255,.3); -moz-box-shadow:inset 0 1px 1px rgba(255,255,255,.3); box-shadow:inset 0 1px 1px rgba(255,255,255,.3),0 2px 2px rgba(0,0,0,0),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0; -webkit-box-shadow:inset 0 1px 1px rgba(255,255,255,.3),0 2px 2px rgba(0,0,0,0),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0; -moz-box-shadow:inset 0 1px 1px rgba(255,255,255,.3),0 2px 2px rgba(0,0,0,0),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0; text-shadow:rgba(0,0,0,.4) 0 -1px 1px } .button.key.enabled{ cursor:pointer } .default .focus .button.key:hover.enabled,.default .footer .button.key:hover.enabled,.default .footer-confirm .button.key:hover.enabled,.screen .focus .button.key:hover.enabled,.default #banner .button.key:hover.enabled{ -moz-transition:background-color ease-out 100ms 0; -webkit-transition:background-color ease-out 100ms 0; -o-transition:background-color ease-out 100ms 0; transition:background-color ease-out 100ms 0; background-color:#72c0be; cursor:pointer } .default .focus .button.key:active.enabled,.default .footer .button.key:active.enabled,.button.key.selected,.button.key.active.enabled,.default #banner .button.key:active.enabled{ -webkit-box-shadow:inset 0 2px 2px rgba(0,0,0,.8); -moz-box-shadow:inset 0 2px 2px rgba(0,0,0,.8); box-shadow:inset 0 2px 2px rgba(0,0,0,.8); line-height:21px; background-color:#72c0be; border:0; border-bottom:1px solid #2f6a68; margin:1px; margin-bottom:0 } .default .focus .button.key:active.enabled span,.default .footer .button.key:active.enabled span,.button.key.selected span,.button.key.active.enabled span,.default #banner .button.key:active.enabled span{ margin-top:1px } .button.key.disabled{ -khtml-opacity:.5; -moz-opacity:.5; opacity:.5; -ms-filter:"alpha(Opacity=50)"; -moz-transition:all ease-out 0 0; -webkit-transition:all ease-out 0 0; -o-transition:all ease-out 0 0; transition:all ease-out 0 0 } .button.key .reload{ background:url(https://s3-eu-west-1.amazonaws.com/typeform-media-static/reload-black.png) no-repeat; width:24px; margin-top:7px; height:20px; position:relative; display:block; float:left; margin-right:17px; top:1px; -khtml-opacity:.4; -moz-opacity:.4; opacity:.4; -ms-filter:"alpha(Opacity=40)" } .button.key .tick{ background:url(https://s3-eu-west-1.amazonaws.com/typeform-media-static/tick-black.png) no-repeat; position:relative; display:block; float:right; width:32px; height:30px; margin:9px 25px 0; -khtml-opacity:.4; -moz-opacity:.4; opacity:.4; -ms-filter:"alpha(Opacity=40)" } .button.key .next{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; font-size:27px; width:20px; line-height:31px; margin-left:2px } .button.key .next:before{ font-family:typeIconFont; content:"I" } .button.key .confirm{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; font-size:20px; width:16px; line-height:28px; margin-left:9px } .button.key .confirm:before{ font-family:typeIconFont; content:"H" } .button.key .up{ display:block; font-size:27px; width:21px; line-height:30px; margin-left:-4px; margin-right:2px; text-align:left; font-weight:400 } .button.key .up:before{ font-family:typeIconFont; content:"K" } .button.key .down{ display:block; font-size:27px; width:21px; line-height:30px; margin-left:-4px; margin-right:2px; text-align:left; font-weight:400 } .button.key .down:before{ font-family:typeIconFont; content:"L" } .button.key-great{ display:inline-block; cursor:default; background-color:#4fb0ae; width:26px; height:35px; line-height:30px; padding:5px 7px 0; font-size:25px; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; text-align:center; font-weight:700; font-family:"Source Sans Pro",sans-serif; max-width:610px; overflow:hidden; -moz-transition:background-color ease-out 100ms 0; -webkit-transition:background-color ease-out 100ms 0; -o-transition:background-color ease-out 100ms 0; transition:background-color ease-out 100ms 0; color:#edf7f7; background-image:url(https://s3-eu-west-1.amazonaws.com/typeform-media-static/button-gradient-light.png); border-top:1px solid #479e9d; border-left:1px solid #367776; border-right:1px solid #367776; border-bottom:1px solid #24504f; box-shadow:inset 0 1px 1px rgba(255,255,255,.3); -webkit-box-shadow:inset 0 1px 1px rgba(255,255,255,.3); -moz-box-shadow:inset 0 1px 1px rgba(255,255,255,.3); box-shadow:inset 0 1px 1px rgba(255,255,255,.3),0 2px 2px rgba(0,0,0,0),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0; -webkit-box-shadow:inset 0 1px 1px rgba(255,255,255,.3),0 2px 2px rgba(0,0,0,0),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0; -moz-box-shadow:inset 0 1px 1px rgba(255,255,255,.3),0 2px 2px rgba(0,0,0,0),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0; text-shadow:rgba(0,0,0,.4) 0 -1px 1px } .button.key-great.enabled{ cursor:pointer } .default .focus .button.key-great:hover.enabled,.default .footer .button.key-great:hover.enabled,.default .footer-confirm .button.key-great:hover.enabled,.screen .focus .button.key-great:hover.enabled,.default #banner .button.key-great:hover.enabled{ -moz-transition:background-color ease-out 100ms 0; -webkit-transition:background-color ease-out 100ms 0; -o-transition:background-color ease-out 100ms 0; transition:background-color ease-out 100ms 0; background-color:#72c0be; cursor:pointer } .default .focus .button.key-great:active.enabled,.default .footer .button.key-great:active.enabled,.button.key-great.selected,.button.key-great.active.enabled,.default #banner .button.key-great:active.enabled{ -webkit-box-shadow:inset 0 2px 2px rgba(0,0,0,.8); -moz-box-shadow:inset 0 2px 2px rgba(0,0,0,.8); box-shadow:inset 0 2px 2px rgba(0,0,0,.8); line-height:32px; background-color:#72c0be; border:0; border-bottom:1px solid #2f6a68; margin:1px; margin-bottom:0 } .default .focus .button.key-great:active.enabled span,.default .footer .button.key-great:active.enabled span,.button.key-great.selected span,.button.key-great.active.enabled span,.default #banner .button.key-great:active.enabled span{ margin-top:1px } .button.key-great.disabled{ -khtml-opacity:.5; -moz-opacity:.5; opacity:.5; -ms-filter:"alpha(Opacity=50)"; -moz-transition:all ease-out 0 0; -webkit-transition:all ease-out 0 0; -o-transition:all ease-out 0 0; transition:all ease-out 0 0 } .button.key-great .reload{ background:url(https://s3-eu-west-1.amazonaws.com/typeform-media-static/reload-black.png) no-repeat; width:24px; margin-top:7px; height:30px; position:relative; display:block; float:left; margin-right:17px; top:1px; -khtml-opacity:.4; -moz-opacity:.4; opacity:.4; -ms-filter:"alpha(Opacity=40)" } .button.key-great .tick{ background:url(https://s3-eu-west-1.amazonaws.com/typeform-media-static/tick-black.png) no-repeat; position:relative; display:block; float:right; width:32px; height:30px; margin:9px 25px 0; -khtml-opacity:.4; -moz-opacity:.4; opacity:.4; -ms-filter:"alpha(Opacity=40)" } .button.key-great .next{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; font-size:27px; width:20px; line-height:31px; margin-left:2px } .button.key-great .next:before{ font-family:typeIconFont; content:"I" } .button.key-great .confirm{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; font-size:20px; width:16px; line-height:28px; margin-left:9px } .button.key-great .confirm:before{ font-family:typeIconFont; content:"H" } .button.key-great .up{ display:block; font-size:27px; width:21px; line-height:30px; margin-left:-4px; margin-right:2px; text-align:left; font-weight:400 } .button.key-great .up:before{ font-family:typeIconFont; content:"K" } .button.key-great .down{ display:block; font-size:27px; width:21px; line-height:30px; margin-left:-4px; margin-right:2px; text-align:left; font-weight:400 } .button.key-great .down:before{ font-family:typeIconFont; content:"L" } .button.general{ display:inline-block; cursor:default; background-color:#4fb0ae; width:auto; height:45px; line-height:38px; padding:5px 20px 0; font-size:25px; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; text-align:center; font-weight:700; font-family:"Source Sans Pro",sans-serif; max-width:610px; overflow:hidden; -moz-transition:background-color ease-out 100ms 0; -webkit-transition:background-color ease-out 100ms 0; -o-transition:background-color ease-out 100ms 0; transition:background-color ease-out 100ms 0; color:#edf7f7; background-image:url(https://s3-eu-west-1.amazonaws.com/typeform-media-static/button-gradient-light.png); border-top:1px solid #479e9d; border-left:1px solid #367776; border-right:1px solid #367776; border-bottom:1px solid #24504f; box-shadow:inset 0 1px 1px rgba(255,255,255,.3); -webkit-box-shadow:inset 0 1px 1px rgba(255,255,255,.3); -moz-box-shadow:inset 0 1px 1px rgba(255,255,255,.3); box-shadow:inset 0 1px 1px rgba(255,255,255,.3),0 2px 2px rgba(0,0,0,0),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0; -webkit-box-shadow:inset 0 1px 1px rgba(255,255,255,.3),0 2px 2px rgba(0,0,0,0),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0; -moz-box-shadow:inset 0 1px 1px rgba(255,255,255,.3),0 2px 2px rgba(0,0,0,0),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0; text-shadow:rgba(0,0,0,.4) 0 -1px 1px } .button.general.enabled{ cursor:pointer } .default .focus .button.general:hover.enabled,.default .footer .button.general:hover.enabled,.default .footer-confirm .button.general:hover.enabled,.screen .focus .button.general:hover.enabled,.default #banner .button.general:hover.enabled{ -moz-transition:background-color ease-out 100ms 0; -webkit-transition:background-color ease-out 100ms 0; -o-transition:background-color ease-out 100ms 0; transition:background-color ease-out 100ms 0; background-color:#72c0be; cursor:pointer } .default .focus .button.general:active.enabled,.default .footer .button.general:active.enabled,.button.general.selected,.button.general.active.enabled,.default #banner .button.general:active.enabled{ -webkit-box-shadow:inset 0 2px 2px rgba(0,0,0,.8); -moz-box-shadow:inset 0 2px 2px rgba(0,0,0,.8); box-shadow:inset 0 2px 2px rgba(0,0,0,.8); line-height:40px; background-color:#72c0be; border:0; border-bottom:1px solid #2f6a68; margin:1px; margin-bottom:0 } .default .focus .button.general:active.enabled span,.default .footer .button.general:active.enabled span,.button.general.selected span,.button.general.active.enabled span,.default #banner .button.general:active.enabled span{ margin-top:1px } .button.general.disabled{ -khtml-opacity:.5; -moz-opacity:.5; opacity:.5; -ms-filter:"alpha(Opacity=50)"; -moz-transition:all ease-out 0 0; -webkit-transition:all ease-out 0 0; -o-transition:all ease-out 0 0; transition:all ease-out 0 0 } .button.general .reload{ background:url(https://s3-eu-west-1.amazonaws.com/typeform-media-static/reload-black.png) no-repeat; width:24px; margin-top:7px; height:40px; position:relative; display:block; float:left; margin-right:17px; top:1px; -khtml-opacity:.4; -moz-opacity:.4; opacity:.4; -ms-filter:"alpha(Opacity=40)" } .button.general .tick{ background:url(https://s3-eu-west-1.amazonaws.com/typeform-media-static/tick-black.png) no-repeat; position:relative; display:block; float:right; width:32px; height:30px; margin:9px 25px 0; -khtml-opacity:.4; -moz-opacity:.4; opacity:.4; -ms-filter:"alpha(Opacity=40)" } .button.general .next{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; font-size:27px; width:20px; line-height:31px; margin-left:2px } .button.general .next:before{ font-family:typeIconFont; content:"I" } .button.general .confirm{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; font-size:20px; width:16px; line-height:28px; margin-left:9px } .button.general .confirm:before{ font-family:typeIconFont; content:"H" } .button.general .up{ display:block; font-size:27px; width:21px; line-height:30px; margin-left:-4px; margin-right:2px; text-align:left; font-weight:400 } .button.general .up:before{ font-family:typeIconFont; content:"K" } .button.general .down{ display:block; font-size:27px; width:21px; line-height:30px; margin-left:-4px; margin-right:2px; text-align:left; font-weight:400 } .button.general .down:before{ font-family:typeIconFont; content:"L" } .button.general.red{ display:inline-block; cursor:default; background-color:#900; width:auto; height:45px; line-height:38px; padding:5px 20px 0; font-size:25px; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; text-align:center; font-weight:700; font-family:"Source Sans Pro",sans-serif; max-width:610px; overflow:hidden; -moz-transition:background-color ease-out 100ms 0; -webkit-transition:background-color ease-out 100ms 0; -o-transition:background-color ease-out 100ms 0; transition:background-color ease-out 100ms 0; color:#ff8080; background-image:url(https://s3-eu-west-1.amazonaws.com/typeform-media-static/button-gradient-dark.png); border-top:1px solid #666; border-left:1px solid #262626; border-right:1px solid #262626; border-bottom:1px solid #000; box-shadow:inset 0 1px 1px rgba(255,255,255,.3); -webkit-box-shadow:inset 0 1px 1px rgba(255,255,255,.3); -moz-box-shadow:inset 0 1px 1px rgba(255,255,255,.3); box-shadow:inset 0 1px 1px rgba(255,255,255,.3),0 2px 2px rgba(0,0,0,0),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0; -webkit-box-shadow:inset 0 1px 1px rgba(255,255,255,.3),0 2px 2px rgba(0,0,0,0),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0; -moz-box-shadow:inset 0 1px 1px rgba(255,255,255,.3),0 2px 2px rgba(0,0,0,0),transparent 0 0 0,transparent 0 0 0,transparent 0 0 0; text-shadow:rgba(0,0,0,.4) 0 -1px 1px } .button.general.red.enabled{ cursor:pointer } .default .focus .button.general.red:hover.enabled,.default .footer .button.general.red:hover.enabled,.default .footer-confirm .button.general.red:hover.enabled,.screen .focus .button.general.red:hover.enabled,.default #banner .button.general.red:hover.enabled{ -moz-transition:background-color ease-out 100ms 0; -webkit-transition:background-color ease-out 100ms 0; -o-transition:background-color ease-out 100ms 0; transition:background-color ease-out 100ms 0; background-color:#c00; cursor:pointer } .default .focus .button.general.red:active.enabled,.default .footer .button.general.red:active.enabled,.button.general.red.selected,.button.general.red.active.enabled,.default #banner .button.general.red:active.enabled{ -webkit-box-shadow:inset 0 2px 2px rgba(0,0,0,.8); -moz-box-shadow:inset 0 2px 2px rgba(0,0,0,.8); box-shadow:inset 0 2px 2px rgba(0,0,0,.8); line-height:40px; background-color:#c00; border:0; border-bottom:1px solid #300; margin:1px; margin-bottom:0 } .default .focus .button.general.red:active.enabled span,.default .footer .button.general.red:active.enabled span,.button.general.red.selected span,.button.general.red.active.enabled span,.default #banner .button.general.red:active.enabled span{ margin-top:1px } .button.general.red.disabled{ -khtml-opacity:.5; -moz-opacity:.5; opacity:.5; -ms-filter:"alpha(Opacity=50)"; -moz-transition:all ease-out 0 0; -webkit-transition:all ease-out 0 0; -o-transition:all ease-out 0 0; transition:all ease-out 0 0 } .button.general.red .reload{ background:url(https://s3-eu-west-1.amazonaws.com/typeform-media-static/reload-black.png) no-repeat; width:24px; margin-top:7px; height:40px; position:relative; display:block; float:left; margin-right:17px; top:1px; -khtml-opacity:.4; -moz-opacity:.4; opacity:.4; -ms-filter:"alpha(Opacity=40)" } .button.general.red .tick{ background:url(https://s3-eu-west-1.amazonaws.com/typeform-media-static/tick-black.png) no-repeat; position:relative; display:block; float:right; width:32px; height:30px; margin:9px 25px 0; -khtml-opacity:.4; -moz-opacity:.4; opacity:.4; -ms-filter:"alpha(Opacity=40)" } .button.general.red .next{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; font-size:27px; width:20px; line-height:31px; margin-left:2px } .button.general.red .next:before{ font-family:typeIconFont; content:"I" } .button.general.red .confirm{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; font-size:20px; width:16px; line-height:28px; margin-left:9px } .button.general.red .confirm:before{ font-family:typeIconFont; content:"H" } .button.general.red .up{ display:block; font-size:27px; width:21px; line-height:30px; margin-left:-4px; margin-right:2px; text-align:left; font-weight:400 } .button.general.red .up:before{ font-family:typeIconFont; content:"K" } .button.general.red .down{ display:block; font-size:27px; width:21px; line-height:30px; margin-left:-4px; margin-right:2px; text-align:left; font-weight:400 } .button.general.red .down:before{ font-family:typeIconFont; content:"L" } .confirm-skip .confirm .button{ -khtml-opacity:.5; -moz-opacity:.5; opacity:.5; -ms-filter:"alpha(Opacity=50)" } .confirm-skip .confirm .button:hover{ -khtml-opacity:1; -moz-opacity:1; opacity:1; -ms-filter:"alpha(Opacity=100)" } .container.confirm{ position:absolute; bottom:-60px; -khtml-opacity:0; -moz-opacity:0; opacity:0; -ms-filter:"alpha(Opacity=0)"; visibility:hidden; padding:5px } .container.confirm .text{ color:#4fb0ae; font-family:Helvetica,Arial; display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; font-size:11px; margin:16px 8px 0 } .container.confirm .button-wrapper{ position:relative; z-index:5 } .confirm-nav.confirm-inline #quickyform .questions>li:not(.focus){ -khtml-opacity:.07; -moz-opacity:.07; opacity:.07; -ms-filter:"alpha(Opacity=7)"; -moz-transition:bottom 300ms,opacity 300ms; -webkit-transition:bottom 300ms,opacity 300ms; -o-transition:bottom 300ms,opacity 300ms; transition:bottom 300ms,opacity 300ms } .confirm-nav.confirm-inline #quickyform .questions>li:not(.focus) .item{ -khtml-opacity:.2; -moz-opacity:.2; opacity:.2; -ms-filter:"alpha(Opacity=20)" } .confirm-nav.confirm-inline .focus .container.confirm{ -khtml-opacity:1; -moz-opacity:1; opacity:1; -ms-filter:"alpha(Opacity=100)"; visibility:visible; bottom:-65px; -moz-transition:bottom 150ms,opacity 150ms; -webkit-transition:bottom 150ms,opacity 150ms; -o-transition:bottom 150ms,opacity 150ms; transition:bottom 150ms,opacity 150ms } input,textarea{ display:block; color:#4fb0ae; resize:none; background:0 0; outline:0; font-family:"Source Sans Pro",sans-serif; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; font-size:32px; line-height:35px; padding:3px; border:0; margin:2px } input.blur,textarea.blur{ border:2px dashed #4fb0ae; border:2px dashed rgba(79,176,174,.4); margin:0 } textarea{ border-left:2px dashed #4fb0ae!important; border-left:2px dashed rgba(79,176,174,.4)!important; border-radius:0; -webkit-border-radius:0; -moz-border-radius:0 } .ready input,.ready textarea{ border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; border:2px dashed #4fb0ae; border:2px dashed rgba(79,176,174,.4); -moz-transition:border 0 linear 600ms,border-radius 0 linear 600ms; -webkit-transition:border 0 linear 600ms,border-radius 0 linear 600ms; -o-transition:border 0 linear 600ms,border-radius 0 linear 600ms; transition:border 0 linear 600ms,border-radius 0 linear 600ms } .ready input:focus,.ready textarea:focus{ border-radius:0; -webkit-border-radius:0; -moz-border-radius:0; border:0 } .attachment .content-wrapper .attachment-wrapper .attachment{ display:block; margin-bottom:20px } .attachment .content-wrapper .attachment-wrapper .attachment .video{ background:#000 } .message{ position:relative; display:inline-block; display:none; z-index:3; padding:5px 8px; border-radius:2px; -webkit-border-radius:2px; -moz-border-radius:2px; background-color:#900; margin-top:20px } .message span{ font-family:Helvetica,Arial; color:#fff; font-size:13px } .message div{ width:0; height:0; border-left:5px solid transparent; border-right:5px solid transparent; border-bottom:5px solid #900; position:absolute; top:-5px; left:10px } .message.left div{ width:0; height:0; border-top:5px solid transparent; border-bottom:5px solid transparent; border-right:5px solid #900; position:absolute; top:7px; left:-10px } .message.right div{ width:0; height:0; border-top:5px solid transparent; border-bottom:5px solid transparent; border-left:5px solid #900; position:absolute; top:7px; right:-10px; left:auto } .letter{ position:relative; display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; width:16px; padding:0; height:17px; font-size:12px; line-height:18px; border:1px solid #000; border:1px solid rgba(0,0,0,.3); margin-right:7px; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; text-align:center; -webkit-box-shadow:inset 0 1px 1px rgba(255,255,255,.3); -moz-box-shadow:inset 0 1px 1px rgba(255,255,255,.3); box-shadow:inset 0 1px 1px rgba(255,255,255,.3); font-weight:700 } .letter.dark-shadow{ text-shadow:0 1px 1px #fff } .letter.light-shadow{ text-shadow:0 -1px 1px #000 } .letter img{ position:absolute; right:0; top:-10px; -khtml-opacity:0; -moz-opacity:0; opacity:0; -ms-filter:"alpha(Opacity=0)"; -webkit-animation:hand-effect 1000ms 0; -moz-animation:hand-effect 1000ms 0; -ms-animation:hand-effect 1000ms 0; z-index:10 } @-webkit-keyframes hand-effect{ 10%,87%{ -khtml-opacity:1; -moz-opacity:1; opacity:1; -ms-filter:"alpha(Opacity=100)" } 0%,28%,56%,84%{ margin-top:-3px } 14%,42%,70%,100%{ margin-top:0 } } @-moz-keyframes hand-effect{ 10%,87%{ -khtml-opacity:1; -moz-opacity:1; opacity:1; -ms-filter:"alpha(Opacity=100)" } 0%,28%,56%,84%{ margin-top:-3px } 14%,42%,70%,100%{ margin-top:0 } } @-ms-keyframes hand-effect{ 10%,87%{ -khtml-opacity:1; -moz-opacity:1; opacity:1; -ms-filter:"alpha(Opacity=100)" } 0%,28%,56%,84%{ margin-top:-3px } 14%,42%,70%,100%{ margin-top:0 } } .letter span{ font-family:Helvetica,Arial; -khtml-opacity:.4; -moz-opacity:.4; opacity:.4; -ms-filter:"alpha(Opacity=40)" } .letter .tooltip-key{ position:absolute; right:-3px; top:-3px; bottom:-3px; padding:0 4px; border:1px solid rgba(0,0,0,.4); border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; line-height:20px; z-index:5 } .letter .tooltip-key span{ letter-spacing:0; display:block; font-weight:400 } .letter .tooltip-key span.t{ -khtml-opacity:.4; -moz-opacity:.4; opacity:.4; -ms-filter:"alpha(Opacity=40)"; padding-right:11px } .letter .tooltip-key span.k{ position:absolute; top:0; right:4px; -khtml-opacity:1; -moz-opacity:1; opacity:1; -ms-filter:"alpha(Opacity=100)" } .tab-key{ font-size:10px; width:34px; height:14px; padding:2px; border-width:1px; border-style:solid; line-height:12px; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; margin-top:10px; font-weight:700 } .screen{ position:absolute; left:0; top:0; bottom:0; right:0; width:100%; z-index:11; text-align:center } .screen .button-text{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; font-family:Helvetica,Arial; font-size:11px; margin:16px 8px 0; color:#4fb0ae; top:11px; position:absolute; left:100%; width:150px; text-align:left } .screen .attachment{ margin:0 auto } .screen .attachment .image,.screen .attachment .video{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline } .screen.layout-float .content-wrapper .content .media{ display:inline; float:left } .screen.no-footer .footer{ visibility:hidden } .screen.outro.default .content-wrapper .content .text{ font-size:20px; line-height:20px; height:30px } .screen.outro.default .content-wrapper .content .credits{ margin-top:10px; line-height:16px } .screen .content-wrapper{ position:relative; height:100%; width:100% } .screen .content-wrapper .content{ padding-left:55px; padding-right:55px; max-width:800px; line-height:40%; overflow:hidden; margin:0 auto } .screen .content-wrapper .content.scrollable{ padding-bottom:90px } .screen .content-wrapper .content.scrollable .button-text{ display:none } .screen .content-wrapper .content .media{ display:block } .screen .content-wrapper .content .text{ color:#3d3d3d; font-family:"Source Sans Pro",sans-serif; font-size:24px; line-height:36px } .screen .content-wrapper .content .description{ margin-top:16px; color:#3d3d3d; font-family:"Source Sans Pro",sans-serif; font-size:16px; line-height:145% } .screen .content-wrapper .content .button-wrapper{ position:relative; display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; clear:both } .screen .content-wrapper .content .button-wrapper .button{ margin:4px; text-decoration:none } .screen .content-wrapper .content .button-wrapper .button a{ font-family:"Source Sans Pro",sans-serif; color:inherit } .screen .content-wrapper .content .button-wrapper .label{ text-align:left; padding-left:2px; padding-top:2px; margin-bottom:4px } .screen .content-wrapper .content .button-wrapper .tooltip.show{ position:absolute; margin-top:5px; top:0; display:block; width:165px; left:100% } .screen .content-wrapper .content .placeholder{ position:relative; border-radius:4px; -webkit-border-radius:4px; -moz-border-radius:4px; background:#ccc; opacity:.5; margin-bottom:40px } .screen .content-wrapper .content .placeholder .wrapper{ position:absolute; top:50%; margin-top:-86px; width:100%; height:100%; text-align:center; font-family:Helvetica,Arial } .screen .content-wrapper .content .placeholder .wrapper h2{ color:#333; font-size:20px; font-weight:400; line-height:150%; margin-top:10px } .screen .content-wrapper .content .placeholder .wrapper h3{ color:#666; font-size:12px; font-weight:400; line-height:140% } .screen .content-wrapper .content .social{ display:none } .screen .content-wrapper .content .social a{ border:0 } .screen .content-wrapper .content .social a img{ border:0 } .screen .content-wrapper .content .social.show{ display:block } .screen .content-wrapper .content .social,.screen .content-wrapper .content .credits{ margin-top:30px } .screen .footer{ position:fixed; bottom:0; display:none; z-index:2; left:0; right:0; overflow:hidden; height:70px; border-top-style:solid; border-top-width:1px } .screen .footer.step0{ border-color:rgba(0,0,0,.2); -webkit-box-shadow:0 0 3px rgba(0,0,0,.2); -moz-box-shadow:0 0 3px rgba(0,0,0,.2); box-shadow:0 0 3px rgba(0,0,0,.2) } .screen .footer.step0 .overlay{ background-color:#000; -khtml-opacity:.02; -moz-opacity:.02; opacity:.02; -ms-filter:"alpha(Opacity=2)" } .screen .footer.step1{ border-color:rgba(0,0,0,.25); -webkit-box-shadow:0 0 3px rgba(0,0,0,.2); -moz-box-shadow:0 0 3px rgba(0,0,0,.2); box-shadow:0 0 3px rgba(0,0,0,.2) } .screen .footer.step1 .overlay{ background-color:#000; -khtml-opacity:.04; -moz-opacity:.04; opacity:.04; -ms-filter:"alpha(Opacity=4)" } .screen .footer.step2{ border-color:rgba(0,0,0,.25); -webkit-box-shadow:0 0 3px rgba(0,0,0,.25); -moz-box-shadow:0 0 3px rgba(0,0,0,.25); box-shadow:0 0 3px rgba(0,0,0,.25) } .screen .footer.step2 .overlay{ background-color:#000; -khtml-opacity:.05; -moz-opacity:.05; opacity:.05; -ms-filter:"alpha(Opacity=5)" } .screen .footer.step3{ border-color:rgba(0,0,0,.25); -webkit-box-shadow:0 0 3px rgba(0,0,0,.3); -moz-box-shadow:0 0 3px rgba(0,0,0,.3); box-shadow:0 0 3px rgba(0,0,0,.3) } .screen .footer.step3 .overlay{ background-color:#000; -khtml-opacity:.05; -moz-opacity:.05; opacity:.05; -ms-filter:"alpha(Opacity=5)" } .screen .footer.step4{ border-color:rgba(0,0,0,.4); -webkit-box-shadow:0 0 3px rgba(0,0,0,.45); -moz-box-shadow:0 0 3px rgba(0,0,0,.45); box-shadow:0 0 3px rgba(0,0,0,.45) } .screen .footer.step4 .overlay{ background-color:#000; -khtml-opacity:.08; -moz-opacity:.08; opacity:.08; -ms-filter:"alpha(Opacity=8)" } .screen .footer.step5{ -webkit-box-shadow:0 0 3px rgba(0,0,0,.45); -moz-box-shadow:0 0 3px rgba(0,0,0,.45); box-shadow:0 0 3px rgba(0,0,0,.45); border-top:1px solid rgba(255,255,255,.15) } .screen .footer.step5 .overlay{ background-color:#fff; -khtml-opacity:.06; -moz-opacity:.06; opacity:.06; -ms-filter:"alpha(Opacity=6)" } .screen .footer .content{ position:relative; z-index:6; margin:0 auto } .screen .footer .button-text{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; font-family:Helvetica,Arial; font-size:11px; margin:16px 8px 0; color:#4fb0ae; top:4px; position:absolute; left:100%; width:150px; text-align:left } .screen .footer .overlay{ position:absolute; top:0; left:0; right:0; bottom:0; z-index:2 } .screen .footer .persistent-wrapper,.screen .footer .background,.screen .footer .overlayColor{ position:absolute; top:0; bottom:0; left:0; right:0 } .screen .footer .background{ z-index:2 } .screen .footer .overlayColor{ z-index:3 } .screen .footer .button-wrapper{ position:relative; display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; margin-top:8px } .screen .footer .button-wrapper .button{ font-family:"Source Sans Pro",sans-serif } .screen .footer .button-wrapper .label{ text-align:left; line-height:54px } .screen .footer .button-wrapper .tooltip{ margin-top:5px } .screen .footer .button-wrapper .tooltip.show{ position:absolute; margin-top:5px; top:0; display:block; width:165px; left:100% } .statement div.question span{ line-height:130%; min-height:28px } .statement div.content{ margin-top:0 } .statement div.item{ width:40px; font-size:56px; top:20px; line-height:normal } .statement.sub-question.connected .item{ top:-10px } .textfield div.input,.email div.input,.website div.input,.number div.input{ position:relative; margin-left:-5px; height:55px } .textfield div.input input,.email div.input input,.website div.input input,.number div.input input{ position:absolute; width:100% } #typeform .questions .textarea.focus .wrapper{ height:auto!important } #typeform .questions .textarea .textarea-wrapper{ margin-left:-5px; padding-right:20px; position:relative } #typeform .questions .textarea .textarea-wrapper textarea{ position:relative; height:36px; overflow:hidden; width:100%; margin-bottom:3px } #typeform .questions .textarea .keyboard-tip{ display:none; position:relative; font-size:11px; padding:20px 0 } #typeform .questions .textarea .keyboard-tip .aux-border{ position:absolute; height:1px; left:0; top:0; right:0; border-top:1px; border-style:solid; -khtml-opacity:.2; -moz-opacity:.2; opacity:.2; -ms-filter:"alpha(Opacity=20)" } #typeform .questions .textarea .keyboard-tip.show{ display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline } #typeform .questions .textarea .keyboard-tip .tab-key{ margin-top:-2px } #typeform .questions .textarea .keyboard-tip .key{ position:relative; display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; margin-left:7px } #typeform .questions .textarea .keyboard-tip span{ -khtml-opacity:.6; -moz-opacity:.6; opacity:.6; -ms-filter:"alpha(Opacity=60)" } #typeform .questions .textarea .keyboard-tip span b{ -khtml-opacity:1; -moz-opacity:1; opacity:1; -ms-filter:"alpha(Opacity=100)" } #typeform .questions .textarea .keyboard-tip .hand1{ position:absolute; top:-12px; left:-5px; -khtml-opacity:0; -moz-opacity:0; opacity:0; -ms-filter:"alpha(Opacity=0)"; -webkit-animation:hand-effect 1000ms 0; -moz-animation:hand-effect 1000ms 0; -ms-animation:hand-effect 1000ms 0 } @-webkit-keyframes hand-effect{ 10%,87%{ -khtml-opacity:1; -moz-opacity:1; opacity:1; -ms-filter:"alpha(Opacity=100)" } 0%,28%,56%,84%{ margin-top:-3px } 14%,42%,70%,100%{ margin-top:0 } } @-moz-keyframes hand-effect{ 10%,87%{ -khtml-opacity:1; -moz-opacity:1; opacity:1; -ms-filter:"alpha(Opacity=100)" } 0%,28%,56%,84%{ margin-top:-3px } 14%,42%,70%,100%{ margin-top:0 } } @-ms-keyframes hand-effect{ 10%,87%{ -khtml-opacity:1; -moz-opacity:1; opacity:1; -ms-filter:"alpha(Opacity=100)" } 0%,28%,56%,84%{ margin-top:-3px } 14%,42%,70%,100%{ margin-top:0 } } #typeform .questions .textarea .keyboard-tip .hand2{ position:absolute; top:-10px; right:0; -khtml-opacity:0; -moz-opacity:0; opacity:0; -ms-filter:"alpha(Opacity=0)"; -webkit-animation:hand-effect 1000ms 0; -moz-animation:hand-effect 1000ms 0; -ms-animation:hand-effect 1000ms 0 } @-webkit-keyframes hand-effect{ 10%,87%{ -khtml-opacity:1; -moz-opacity:1; opacity:1; -ms-filter:"alpha(Opacity=100)" } 0%,28%,56%,84%{ margin-top:-3px } 14%,42%,70%,100%{ margin-top:0 } } @-moz-keyframes hand-effect{ 10%,87%{ -khtml-opacity:1; -moz-opacity:1; opacity:1; -ms-filter:"alpha(Opacity=100)" } 0%,28%,56%,84%{ margin-top:-3px } 14%,42%,70%,100%{ margin-top:0 } } @-ms-keyframes hand-effect{ 10%,87%{ -khtml-opacity:1; -moz-opacity:1; opacity:1; -ms-filter:"alpha(Opacity=100)" } 0%,28%,56%,84%{ margin-top:-3px } 14%,42%,70%,100%{ margin-top:0 } } #typeform .questions .list .multiple{ margin:10px 0; font-size:16px; display:none; color:#3d3d3d } #typeform .questions .list.multiple .multiple{ display:block; -khtml-opacity:.7; -moz-opacity:.7; opacity:.7; -ms-filter:"alpha(Opacity=70)" } #typeform .questions .list.multiple .control{ padding-left:10px; border-left-width:1px; border-left-style:dashed; border-color:#4fb0ae } #typeform .questions .list .button-wrapper.confirm .button.visible{ visibility:visible; -khtml-opacity:1; -moz-opacity:1; opacity:1; -ms-filter:"alpha(Opacity=100)"; -moz-transition:opacity ease-out 200ms 0; -webkit-transition:opacity ease-out 200ms 0; -o-transition:opacity ease-out 200ms 0; transition:opacity ease-out 200ms 0 } #typeform .questions .list.vertical ul li{ margin:4px 3px 8px } #typeform .questions .list ul{ margin:0; margin-left:-3px; display:block; outline:0; text-align:left; margin-bottom:25px } #typeform .questions .list ul li{ position:relative; display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; cursor:pointer; margin:4px 3px; list-style:none; color:#fff; padding:8px 37px } #typeform .questions .list ul li .tick{ color:#4fb0ae; top:50%; margin-top:-12px } #typeform .questions .list ul li .label{ color:#4fb0ae; font-size:21px } #typeform .questions .list ul li .letter{ color:#4fb0ae; position:absolute; left:10px; top:10px } #typeform .questions .list ul li.custom{ float:none; clear:both; position:relative; -moz-transition:width ease-out 100ms 0; -webkit-transition:width ease-out 100ms 0; -o-transition:width ease-out 100ms 0; transition:width ease-out 100ms 0 } #typeform .questions .list ul li.custom input{ display:none; position:relative; width:100%; padding:0; background:0 0; border:0; font-size:21px; z-index:10; height:31px } #typeform .questions .list ul li.custom .label{ display:block } #typeform .questions .list ul li.custom .ok-confirm{ position:absolute; top:2px; right:2px; display:none; z-index:7 } #typeform .questions .list ul li.custom .ok-confirm .button{ position:relative; margin:0; width:13px; height:27px; right:0; padding:2px 12px 4px } #typeform .questions .list ul li.custom.open{ -moz-transition:width ease-out 100ms 0; -webkit-transition:width ease-out 100ms 0; -o-transition:width ease-out 100ms 0; transition:width ease-out 100ms 0; padding:2px 50px 3px 37px } #typeform .questions .list ul li.custom.open .ok-confirm{ display:block } #typeform .questions .list ul li.custom.open .label{ display:none } #typeform .questions .list ul li.custom.open input{ display:block } .list-image div.content .content-wrapper>.button-wrapper{ margin-top:20px } .list-image div.message{ margin-top:20px; margin-bottom:0 } .list-image .multiple{ margin-bottom:10px; font-size:16px; display:none; color:#3d3d3d } .list-image.multiple .multiple{ display:block } .list-image.multiple .content-wrapper{ padding-left:10px; border-left-width:1px; border-left-style:dashed } .list-image ul{ padding:0 } .list-image li{ cursor:pointer; word-wrap:break-word; padding:5px; float:left; padding-bottom:53px; list-style:none; margin:2px 12px 12px 2px } .list-image li .image-wrapper{ position:relative; overflow:hidden } .list-image li .image-wrapper img{ display:block; position:absolute; left:50%; top:50% } .list-image li .tick-wrapper{ display:none } .list-image li.selected .tick-wrapper{ z-index:3; display:block; position:absolute; top:-1px; right:1px; width:48px; height:50px; background-image:url(https://s3-eu-west-1.amazonaws.com/typeform-media-static/tickbg.png) } .list-image li.selected .tick{ display:block; z-index:4; color:#000; position:absolute; top:2px; right:2px; -khtml-opacity:.7; -moz-opacity:.7; opacity:.7; -ms-filter:"alpha(Opacity=70)"; margin:0 } .list-image li.selected .tick:before{ font-family:typeIconFont; content:"H" } .list-image li .text{ position:absolute; text-align:center; left:0; right:0; bottom:6px; height:46px } .list-image li .text .label{ color:#4fb0ae; position:relative; display:-moz-inline-stack; display:inline-block; vertical-align:top; zoom:1; *display:inline; text-align:left; height:31px; line-height:15px; font-size:14px; padding-top:17px; padding-left:28px; vertical-align:middle; padding-right:5px } .list-image li .text .label .caption{ word-break:break-word; overflow:hidden; height:100% } .list-image li .text .letter{ color:#4fb0ae; position:absolute; margin-top:-2px; left:6px } .list-image li span.val{ position:absolute; top:50%; margin-top:-16px; text-align:center; width:100%; -khtml-opacity:.4; -moz-opacity:.4; opacity:.4; -ms-filter:"alpha(Opacity=40)" } .list-image li.custom input{ position:absolute; left:10px; right:10px; top:50%; display:none; margin:0; margin-top:-25px; padding:0; background:0 0; border:0; font-size:16px; z-index:10 } .list-image li.custom .button-wrapper{ position:absolute; top:50%; left:50%; margin-left:-16px; margin-top:20px; display:none; z-index:10 } .list-image li.custom .button-wrapper .tick{ margin-top:0; -khtml-opacity:1; -moz-opacity:1; opacity:1; -ms-filter:"alpha(Opacity=100)"; position:relative; display:block; width:17px } .list-image li.custom.open span.val{ display:none } .list-image li.custom.open img{ -khtml-opacity:.4; -moz-opacity:.4; opacity:.4; -ms-filter:"alpha(Opacity=40)" } .list-image li.custom.open input,.list-image li.custom.open .ok-confirm{ display:block } .yes-no .scroll-area,.terms .scroll-area{ color:#4fb0ae; -webkit-touch-callout:text; -webkit-user-select:text; -khtml-user-select:text; -moz-user-select:text; -ms-user-select:text; user-select:text; line-height:140%; margin-bottom:30px; font-size:13px } .yes-no ul,.terms ul{ margin-bottom:10px; color:#4fb0ae } .yes-no ul li,.terms ul li{ display:block; margin:9px 0; padding:5px 35px 5px 5px; font-size:21px; line-height:27px; cursor:pointer } .yes-no ul li .letter,.terms ul li .letter{ margin:4px } .terms .description{ display:none } .rating .icons{ color:#4fb0ae } .rating .icons li{ float:left; cursor:pointer; margin-right:7px } .rating .icons li .icon{ padding-top:1px; font-weight:400; font-style:normal; display:inline-block; text-decoration:inherit } .rating .icons li .icon.back{ position:absolute; top:0; left:0; right:0; -khtml-opacity:0; -moz-opacity:0; opacity:0; -ms-filter:"alpha(Opacity=0)"; -moz-transition:opacity ease-out 100ms 0; -webkit-transition:opacity ease-out 100ms 0; -o-transition:opacity ease-out 100ms 0; transition:opacity ease-out 100ms 0 } .rating .icons li.hover .back,.rating .icons li.pre-selected .back{ -khtml-opacity:.2; -moz-opacity:.2; opacity:.2; -ms-filter:"alpha(Opacity=20)"; -moz-transition:opacity ease-out 100ms 0; -webkit-transition:opacity ease-out 100ms 0; -o-transition:opacity ease-out 100ms 0; transition:opacity ease-out 100ms 0 } .rating .icons li.selected .icon{ text-shadow:0 1px 1px #204646; padding-top:0; padding-bottom:1px } .rating .icons li .center-wrapper{ display:table } .rating .icons li .center{ position:relative } .rating .icons li .label{ font-size:12px; display:block; text-align:center; margin-top:10px } .rating .icons li .letter{ margin:0 } .rating.icon-star .icons .icon:before{ font-family:typeIconFont; content:"a" } .rating.icon-star .icons .selected .icon,.rating.icon-star .icons .back{ text-transform:uppercase } .rating.icon-star .icons .selected .icon:before,.rating.icon-star .icons .back:before{ font-family:typeIconFont; content:"A" } .rating.icon-heart .icons .icon:before{ font-family:typeIconFont; content:"b" } .rating.icon-heart .icons .selected .icon,.rating.icon-heart .icons .back{ text-transform:uppercase } .rating.icon-heart .icons .selected .icon:before,.rating.icon-heart .icons .back:before{ font-family:typeIconFont; content:"B" } .rating.icon-user .icons .icon:before{ font-family:typeIconFont; content:"c" } .rating.icon-user .icons .selected .icon,.rating.icon-user .icons .back{ text-transform:uppercase } .rating.icon-user .icons .selected .icon:before,.rating.icon-user .icons .back:before{ font-family:typeIconFont; content:"C" } .rating.icon-up .icons .icon:before{ font-family:typeIconFont; content:"d" } .rating.icon-up .icons .selected .icon,.rating.icon-up .icons .back{ text-transform:uppercase } .rating.icon-up .icons .selected .icon:before,.rating.icon-up .icons .back:before{ font-family:typeIconFont; content:"D" } .rating.icon-crown .icons .icon:before{ font-family:typeIconFont; content:"e" } .rating.icon-crown .icons .selected .icon,.rating.icon-crown .icons .back{ text-transform:uppercase } .rating.icon-crown .icons .selected .icon:before,.rating.icon-crown .icons .back:before{ font-family:typeIconFont; content:"E" } .rating.icon-cat .icons .icon:before{ font-family:typeIconFont; content:"f" } .rating.icon-cat .icons .selected .icon,.rating.icon-cat .icons .back{ text-transform:uppercase } .rating.icon-cat .icons .selected .icon:before,.rating.icon-cat .icons .back:before{ font-family:typeIconFont; content:"F" } .group #placeholder{ margin-left:30px } .group #placeholder span{ display:block; -webkit-font-smoothing:antialiased; font-size:20px; line-height:30px; color:rgba(61,61,61,.4) } .group #placeholder span:first-child{ color:rgba(61,61,61,.6) } .group #placeholder span:nth-child(2){ color:rgba(61,61,61,.5) } #typeform .form .questions>li.group.connected .wrapper{ padding-bottom:25px; padding-top:30px } #typeform .form .questions>li.connected .wrapper{ padding-top:0 } .dropdown .message{ margin-top:10px } .dropdown .not-found{ position:relative; visibility:hidden; top:0; padding:2px; display:block } .dropdown.not-found .not-found{ font-size:14px; visibility:visible; top:5px; -moz-transition:top ease-out 100ms 0; -webkit-transition:top ease-out 100ms 0; -o-transition:top ease-out 100ms 0; transition:top ease-out 100ms 0 } .dropdown.not-found .input-wrapper .triangle{ display:none } .dropdown.not-found .input-wrapper .cross{ display:block } .dropdown .input-wrapper{ position:relative } .dropdown .input-wrapper input{ border-bottom:1px solid rgba(79,176,174,.4); display:block; width:100% } .dropdown .input-wrapper .triangle{ padding:10px 0; position:absolute; z-index:10; right:0; top:8px; border:0 } .dropdown .input-wrapper .triangle span{ position:relative; top:10px; width:0; height:0; border-left:5px solid transparent; border-right:5px solid transparent; border-top:6px solid rgba(79,176,174,.4) } .dropdown .input-wrapper .triangle:hover span{ border-top:6px solid rgba(79,176,174,.6) } .dropdown .input-wrapper .cross{ display:none; padding:10px; position:absolute; z-index:10; right:-10px; top:4px; text-decoration:none; -webkit-font-smoothing:antialiased; font-size:19px; border:0 } .dropdown .input-wrapper .cross:hover span{ color:#72c0be } .dropdown.focus .dropdown-menu{ visibility:visible } .dropdown .dropdown-menu{ position:relative; z-index:10; overflow:auto; margin-top:7px; visibility:hidden } .dropdown .dropdown-menu li .tick{ position:absolute; right:5px; top:24px } .dropdown .dropdown-menu li a{ padding:10px; margin:5px; display:block; font-size:20px; text-decoration:none; cursor:pointer; z-index:10; position:relative; -webkit-font-smoothing:antialiased; border:0 } .dropdown .dropdown-menu li .aux .overlay{ display:none } .dropdown .dropdown-menu li.active .aux .overlay{ display:block } .keyboard-icon{ font-family:keyboard; color:rgba(79,176,174,.4); position:absolute } .keyboard-icon.hidden{ display:none } .nano{ position:absolute; width:100%; height:100%; overflow:hidden } .nano .nano-content{ overflow:hidden; position:absolute; top:0; right:13px!important; bottom:0; left:0 } .nano .nano-content:focus{ outline:thin dotted } .nano .nano-content::-webkit-scrollbar{ visibility:hidden } .nano>.pane{ background-color:rgba(79,176,174,.25); position:absolute; width:7px; right:0; top:7px; bottom:0; visibility:hidden\9; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px } .nano>.pane>.slider{ background-color:rgba(79,176,174,.5); position:relative; margin:0 1px; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px } .nano:hover>.pane,.pane.active,.pane.flashed{ visibility:visible\9; opacity:.99 } .has-scrollbar .content::-webkit-scrollbar{ visibility:visible } .padlock-icon{ width:14px; height:19px; float:left; padding:7px; fill:#3d3d3d }