/* Classic Klikhosting shell, scoped to the native HostFact checkout. */
body.kh-order-page { margin:0; background:#fff; color:#000; }
.kh-order-page #content { width:700px; max-width:calc(100% - 24px); margin:20px auto; }
.kh-order-page #logo { width:100%; background-position:center; background-repeat:no-repeat; }
.kh-logo-link { display:block; }
.kh-titlebar { display:grid; grid-template-columns:134px minmax(0,1fr); min-height:41px; background:#eee url('/i/grey.gif') repeat-x; }
.kh-titlebar > div { padding:12px 14px; font-size:11px; }
.kh-titlebar .welkom { background:#393; color:#fff; font-weight:bold; }
.kh-checkout-layout { display:grid; grid-template-columns:134px minmax(0,1fr); border:1px solid #c0c0c0; border-top:0; }
.kh-sidebar { border-right:1px solid #c0c0c0; min-width:0; }
.kh-sidebar nav a { display:block; padding:6px 15px; border-bottom:1px solid #c0c0c0; color:#39752d; font-size:11px; }
.kh-sidebar nav a:hover, .kh-sidebar nav a[aria-current] { background:#f5f5f5; }
.kh-side-domain { padding:23px 7px 0; text-align:center; }
.kh-side-domain form { padding:0; }
.kh-side-domain label { display:block; font-size:10px; margin-bottom:6px; }
.kh-side-domain input { width:100%; max-width:117px; box-sizing:border-box; }
.kh-side-domain button { padding:6px 0; border:0; background:transparent; color:#39752d; font:10px Verdana,Arial,sans-serif; text-decoration:underline; cursor:pointer; }
.kh-side-logos { padding:22px 5px; text-align:center; }
.kh-side-logos img { display:block; max-width:100%; height:auto; margin:15px auto; }
.kh-order-main { padding:22px 14px 30px; min-width:0; text-align:left; }
.kh-order-main .o_form_container, .kh-order-main .w_form_container, .kh-order-main .o_form, .kh-order-main .w_form, .kh-order-main .w_result { width:100%; min-width:0; max-width:100%; padding:0; box-sizing:border-box; }
.kh-order-main p { background:transparent; }
.kh-order-main .o_form > br:first-child { display:none; }
.kh-order-main input, .kh-order-main select, .kh-order-main textarea { max-width:100%; box-sizing:border-box; }
.kh-order-main .auth_key input { width:170px; }
.kh-order-main table { width:100%; font-size:11px; border:0; }
.kh-order-main td:first-child { overflow-wrap:anywhere; }
.kh-order-main .o_form .progress { width:calc(100% - 30px); margin:18px 15px 0; }
.kh-order-main .progress li { box-sizing:content-box; }
.kh-order-main .package_container .package_box { box-sizing:border-box; width:calc(50% - 10px); }
.kh-order-main .nav::after { content:''; display:block; clear:both; }
.kh-site-footer { background:#393 url('/i/onder.gif') repeat-x; color:#fff; font-size:10px; line-height:1.8; padding:5px 8px; text-align:center; }
.kh-site-footer a { color:#fff; }
.kh-skip { position:absolute; left:-10000px; top:0; }
.kh-skip:focus { left:10px; padding:10px; background:#fff; z-index:10; }
@media (max-width:740px) {
  .kh-titlebar, .kh-checkout-layout { grid-template-columns:120px minmax(0,1fr); }
  .kh-order-main { padding:20px 12px; }
  .kh-order-main .o_form label { display:block; width:100%; }
  .kh-order-main .o_form label.no_width { display:inline-block; width:auto; }
  .kh-order-main .o_form input[type=text], .kh-order-main .o_form input[type=password], .kh-order-main .o_form select, .kh-order-main .o_form textarea { width:100%; min-height:30px; margin:3px 0; }
  .kh-order-main .o_form input.small { width:27%; }
  .kh-order-main .o_form input.small_fill { width:70%; }
  .kh-order-main .o_form select.contactperson { width:28%; }
  .kh-order-main .o_form input.contactperson { width:34%; }
  .kh-order-main .o_form .amount_span { display:inline-block; padding-left:0; }
  .kh-order-main .col-left, .kh-order-main .col-right { width:100%; float:none; }
  .kh-order-main .package_container .package_box { width:100%; }
}
@media (max-width:520px) {
  .kh-titlebar, .kh-checkout-layout { grid-template-columns:95px minmax(0,1fr); }
  .kh-order-page #content { max-width:calc(100% - 12px); margin:10px auto; }
  .kh-order-page #logo { height:43px; background-size:contain; background-position:center; }
  .kh-titlebar > div { padding:10px 8px; }
  .kh-order-main { padding:18px 8px; }
  .kh-sidebar nav a { padding:8px; }
  .kh-side-domain label { font-size:8px; }
  .kh-order-main h2 { font-size:15px; }
  .kh-order-main table { table-layout:auto; }
  .kh-order-main td, .kh-order-main th { font-size:10px; overflow-wrap:anywhere; word-break:normal; }
  .kh-order-main .o_form table td:first-child { word-break:normal; }
  .kh-order-main input[value="overview"] ~ table.cart th[width="100"] { width:42px; }
  .kh-order-main input[value="overview"] ~ table.cart td[width="30"] { width:10px; }
  .kh-order-main input[value="overview"] ~ table.cart td[width="90"] { width:42px; }
  .kh-order-main .o_form .button_submit { font-size:11px; padding:8px; }
}