@charset "UTF-8"; /* CSS Document */ /* **** GENERAL **** */ body{ /*background: #dbdbdb;*/ background: #EBEBEB; font-family: Arial, Helvetica, sans-serif; font-weight: normal; font-size: 100%; color: #000; } a{ color: #ae8005; } img, embed, object, video { max-width: 100%; } input[type=text], input[type=url], input[type=number], input[type=tel], input[type=email], input[type=date], textarea { color: #777; } input { border: 1px solid #888; padding: 0.5em; font-size: 0.8em; } .error-label{ color: #da1000; } .figure_right { float: right; margin-bottom: 0.5em; margin-left: 2.189%; /* 12px / 548px */ width: 36.494%; /* 200px / 548px */ } .figure_full { margin-bottom: 0.5em; width: 100%; } #logo{ width: 180px; margin: 0.75em 0; } #top-image{ width: 260px; margin-top: 1em; } h1,h2,h3{ color: #555; } h1{ font-size: 1.7em; /* 24px / 16px (med antaggandet att 100% storlek är 16px i webbläsarna, och storleken på rubriken är 24px i mockup */ font-family: Arial, Helvetica, sans-serif; margin: 0 0 0.666em 0; } h2, h3{ font-size: 1em; font-family: Arial, Helvetica, sans-serif; margin: 0 0 1em 0; } h2{ font-size: 1.2em; } p{ margin: 0 0 1em 0; font: 0.9em/1.4em Arial, Helvetica, sans-serif; /* size: 12px/16px */ font-weight: 100; color: #555; } td{ font-size: 0.75em; line-height: 1.5em; } table{ margin-bottom: 0.5em; } strong{ font-weight: bold;} ul{ font-size: 0.78em; line-height: 1.4em; list-style-type: disc; list-style-position: outside; padding: 0 1.5em; } .center{ text-align: center; width: 100%; } .content { margin: 0 auto 0.4em; width: 600px; } .content .main{ padding: 1.5em; float: left; margin: 0 0 0.75em 0; background: #fff; /*border-radius: 0.3em; -webkit-box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.35); -moz-box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.35); box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.35);*/ width: 92%; width: calc(100% - 3em); } .content .extra ul li a{ text-decoration: none; color: #555; } .no-wrap, .no-linebreak{ white-space:nowrap; } .userinfo-chars{ font-family: 'Source Code Pro', courier; background: #eaeaea; padding: 0.2em 0.6em; font-size: 1.2em; color: #000; margin: 0.3em; display: inline-block; border: dashed 1px #bbb; } .btn, .btnHref{ -webkit-appearance: none; cursor:pointer; display: inline-block; font-size: 0.9em; text-decoration: none; -webkit-border-radius: 4em; -moz-border-radius: 4em; border-radius: 4em; padding: 0.5em 1em; margin: 0 0.5em 0.5em 0; background: #1d9acb; color: #fff !important; border: none; font-weight: normal !important; outline:none; } input[type=text], input[type=url], input[type=number], input[type=tel], input[type=email], input[type=date], textarea{ color: #555; width: 100%; font-size: 1em; box-sizing:border-box; } input[type="submit"]{ -webkit-appearance: none; } textarea{ height: 5em; padding: 1.5%; width: 97%; } .config-setting-row{ margin-bottom: 0.5em; } .config-row{ margin-bottom: 1em; } label{ display: block; margin-bottom: 0.3em; line-height: 1.2em; font-size:0.9em; } label em{ font-style: italic; font-size: 0.8em; color: #999; } .hl{ width: 100%; border-bottom: 1px solid #ddd; } .code { display: block; border: 1px #ddd dashed; padding: 10px; margin: 5px 0px 5px 0px; background-color: #eee; font: 11px "Courier New", Courier, monospace; } #whoisblock { overflow-x: scroll; overflow-y: unset; } .error-box, .success-box, .warning-box { background: #ffe7e7 ; /*padding: 3.8%; margin: 0.5em 0.6em 1.3em 0;*/ margin: 0.5em 0 1.3em 0; padding: 3.5%; width: 92.9%; -webkit-border-radius: 0.4em !important; -moz-border-radius: 0.4em !important; border-radius: 0.4em !important; clear: both !important; border: 1px solid #999 !important; display: inline-block; color: #fff !important; } .error-box h2, .success-box h2, .warning-box h2, .error-box p, .success-box p, .warning-box p{ color: #fff; } .success-box a{ color: #fff !important; } .error-box{ background: #B70000 !important; } .success-box{ background: #269820 !important; } .warning-box{ background: #FFDC50 !important; } .error-box .inside-content, .success-box .inside-content, .warning-box .inside-content { color:#555; padding: 1.5em; float: left; margin: 0 0 0.75em 0; background: #fff; border-radius: 0.3em; width:100%; box-sizing:border-box; } .error-box .inside-content p, .success-box .inside-content p, .warning-box .inside-content p{ color:#555; } .inside-content input[type="radio"] { vertical-align:middle; margin:0 5px 0 0; } .nps-grade{ display: none; width: 1.5em; padding: 0.5em; font-size: 4em; border-radius: 0.5em; color: #fff; margin: 0 auto; text-shadow: 1px 1px 4px rgba(0,0,0,0.4); } .nps-grade00 { background: #d10019; } .nps-grade01 { background: #e7211c; } .nps-grade02 { background: #ef4d1e; } .nps-grade03 { background: #f16420; } .nps-grade04 { background: #f07b22; } .nps-grade05 { background: #f19023; } .nps-grade06 { background: #f1d628; } .nps-grade07 { background: #f5e429; } .nps-grade08 { background: #fbf41c; } .nps-grade09 { background: #8eea30; } .nps-grade10 { background: #11b832; } .nps-grade-select{ float: left; width: 7.83%; padding: 9px 0.3% 2px; margin: 0 0.3% 0.5em 0.3%; display: block; text-align: center; border-radius: 0.5em; font-weight: bold; } .nps-grade-select input{ display: block; margin: 0 auto; margin-bottom: 0.5em; clear: both !important; } #nps-grade-select-container{ padding-bottom: 1.5em; clear: both !important; } .grading-labels{ width: 100%; margin-bottom: 0; } table.grading-labels tr td:first-child{ text-align: left; width: auto !important; padding-left: 4px; } table.grading-labels tr td:last-child{ text-align: right; width: auto !important; padding-right: 4px; } table.grading-labels tr td span{ font-size: 11px; font-style: italic; margin-top: -0.5em; display: block; } .question{ padding: 1em 0; border-top: 1px dotted #ccc; } .radio-btn-list input[type="radio"]{ float: left; margin-right: 0.7em; } .radio-btn-list label{ font-size: 0.9em; padding-top: 0.1em; margin-bottom: 0.5em; } .checklist input[type="checkbox"] { margin:0 7px 0 0; } .checklist h2 { display:inline-block; margin-bottom:0; } .checklist p{ padding-left:20px; } .checklist label { font-size:18px; padding-top:5px; cursor:pointer; } .divider{ border-bottom: 1px solid #bbb; margin: 1.5em 0; } .domain-search-form { background: #fff; padding: 0; border-radius: 2em; border: 1px solid #979797; margin: 1.5em 0 2em 0; } .domain-search-form input.form-control { width: calc(100% - 10rem); display: inline-block; border: 0; outline: 0; margin: 0 0 0 1.5rem; padding-left: 0; } .domain-search-form .btn { margin-right: -1px; padding: 0.6rem 2.5rem; font-size: 1rem; line-height: 1; } .btn-primary { color: #fff; background-color: #901d1d; border: 0; box-shadow: 0 -0.125em 0 0 #661414 inset; } .btn-outline-white { border:2px solid #fff; text-decoration:none; color:#fff; padding:0.8rem 1.75em; border-radius:2em; text-align:center; } .btn-group-lg > .btn, .btn-lg { padding: 1rem 2.5rem; font-size: 1.375rem; line-height: 1.2; font-weight: 600; } .pull-right { float: right!important; } .figure_right_small{ width: 30%; float: right; margin-left: 2%; } .language{ } .language h4{ font-size: 1.2em; font-weight: normal; color: #555; margin: 1.5em 0 0.5em; } .language a{ font-size: 0.75em; color: #000; text-decoration: none; float: left; margin-right: 0.5em; text-align: center; } .language a img{ width: 43px; } .language a span{ display: block; } #footer{ font-size: 0.9em; color: #777; } #footer a{ color: #777; } .tnps-heart { display:inline-block; width:36px; vertical-align:middle; transform:rotateZ(20deg); } .tnps-trustpilot-logo { max-width:35%; vertical-align:middle; margin-left:1rem; } .tnps-title { line-height:1.4; } @media screen and (max-width:620px) { .btn-outline-white { display:block; } .tnps-trustpilot-logo { display:block; max-width:60%; margin:1em auto; } .tnps-heart { width:30px; } } /* Widescreen specific CSS */ @media screen and (min-width: 1024px) { .content { width: 600px; } } /*/mediaquery*/ /* Code that respond.js needs (media queries hack that makes older browsers IE8, FF2 etc compatible with min- and max-width) */ /* Tablet specific CSS */ @media screen and (min-width: 561px) and (max-width: 786px) { .content{ width: 80%; margin: 0 10%; } } /*/mediaquery*/ /* Mobile specific CSS */ @media screen and (max-width: 560px) { .content{ width: 95%; margin: 0 2.45%; } #logo{ width: 150px; margin-bottom: 0.75em; } #top-image{ width: 180px; } } /*/mediaquery*/