@font-face {
  
  font-display: swap;
  
}



.navbar-collapse {
    top: 50px;
}

.header.scrolled {
	background: #fff;
	z-index: 1000;

	top: 0;
	-webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
	box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
}

.header .main-nav .navbar-toggle {
	top: 10px;
}

.header .main-nav .navbar-toggle .icon-bar {
	background-color: rgb(255, 255, 255);
}

.header.scrolled .main-nav .navbar-toggle .icon-bar {
	background-color: rgb(18, 172, 229);
}


.section {
    padding-top: 80px !important;
}


/* Lock the header */
.config-wrapper {
    display: block;
  }
  .header {
    height: 80px;
  }
  .header.navbar-fixed-top {
    position: fixed;
  }
  
.header.scrolled span.logo a {

    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    border-radius: 0;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    color: #12ace5;
    background: #fff;
    padding: 20px 30px !important;

}
  
  .shoppingcart section {
  	background-color: #f5f5f5;
  }

	.shoppingcart header {
	background: #fff;
}

	.shoppingcart h2 {
		text-align:left;
	}
	
	.shoppingcart h3 {
		font-size: 16px;
	}
	
	.shoppingcart div.contentbox:hover {
		border: 3px solid #12ace1;
		
	}
		.shoppingcart div.contentbox {
		border: 3px solid #fff;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		-ms-border-radius: 10px;
		border-radius: 10px;
	}
	
	.shoppingcart .contentbox {
		margin-top: 20px;
	}

  .header.scrolled h1.logo a,
  .shoppingcart .header h1.logo a {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    border-radius: 0;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    color: #12ace5;
    background: #fff;
    padding: 19px 30px !important;
  }
  .header.scrolled .main-nav .nav .nav-item a,
  .shoppingcart .header .main-nav .nav .nav-item a {
    color: #666;
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
  }
  
  
  .header.scrolled .main-nav .nav .nav-item.nav-item-cta a.btn-cta-secondary {
    background: #12ace5;
    border-color: #12ace5;
  }
  
  .btn-cta-primary.submitVoucherCode {
  	padding:2px;
  	float:right;
  }  
  
  .btn-cta-primary.removeVoucherCode {
  	padding:2px;
  }

.voucherCode {
	width:84% !important;
}  
  
  .header .main-nav .nav .dropdown-menu a {
    color: #fff !important;
  }
  .main-nav {
    float: right !important;
  }
  .navbar-form .form-control {
    width: 280px;
  }
  
  
  .header span.logo {
  	font-family: "Roboto Slab", arial, sans-serif;
	font-weight: bold;
    float: left;
    margin: inherit;
  }
  .header .main-nav .nav .nav-item {
    margin-right: 15px;
  }
  .main-nav.navbar-right {
    float: right !important;
  }
  
  
  
  

.header span.logo a {
	color: #fff;
	text-align: center;
	line-height: 1.4;
	font-size: 20px;
	max-width: 200px;
	padding: 20px 30px;
}

.headerlogo {
	width: 40px;
	float: left;
}

.navbar-fixed-top .text {
	margin-top: 10px;
	display: block;
	float: left;
}

.steps .step i {
	font-size: 100px;
	color: #12ace5;
}

.container {
	width: 100%;
}

.header span.logo {
	float: left;
}

@media screen and (min-width: 1016px) {
	.promo {
	    padding-top: 200px !important;
	}
	
	.container {
    	max-width: 1100px !important;
	}
	
	#billDurationRadio .col-md-6 .pricepermonthbox  {
	    padding-right: 75px;
	}
}

.header .main-nav .nav .nav-item, .header .main-nav .nav .nav-item {
	margin-right: 0;
}

.nav > li > a {
    padding: 15px 10px;
}


@media screen and (max-width: 1015px) {
	.header .main-nav .nav .nav-item, .header .main-nav .nav .nav-item {
		font-size: 10px;
	}

	.header .main-nav .nav .nav-item.nav-item-cta a.btn-cta-secondary {
		font-size: 10px;
		padding:4px 10px;
		margin-top: 5px;
	}
	.header .main-nav {
		margin-top: 7px;
	}
	
	.header span.logo a {
    	padding: 5px 30px;
	}
	
	.fr .nav>li>a, .de .nav>li>a {
		padding: 10px 8px;
	}
	
	.headline-bg.download {
		height: 700px;
	}
	
	.header.scrolled span.logo a {
		padding: 5px 30px !important;
	}
}

.apps-section .content-area .download-list li .btn {
	width: 250px;
	height:60px;
	padding-top:8px;
	padding-left:7px;
	
}

a.btn-ghost .fa, .btn-ghost .fa {
    font-size: 40px;
}
a.btn-ghost .text, .btn-ghost .text {

    top: -5px;
}

.download-list {
	margin: 10px;
}

.apps-section .phone-holder {
	width:280px;
}

.pricing .item .heading .title {
	font-size: 30px;
}

.pricing .item.single  .heading .title {
	margin-bottom:0px;
	padding-bottom:0px;
}
.pricing .item.single  .heading {
	margin-bottom:0px;
	padding-bottom:0px;
}

.pricing .item.single .content {
	padding-bottom:0px;
}

.pricing .item .heading {
	
}


.pricing .title {
	margin-bottom:0;
}

.intro {
	margin-bottom: 30px !important;
}

.pricing .item .ribbon .text {
	font-size: 14px;
	padding:5px;
}

.feature-list img {
	margin: 2px;
}

.press .press-list li {
	height: auto;
}

.press .press-list li img {
	height: 100px !important;
	margin: 0 auto 10px;
}

.why .item {
	padding-top: 40px;
	padding-bottom: 40px;
}

@media screen and (min-width: 768px) {
	.phone-holder {
		float: right;
	}
	.container {
		width: 100%;
	}
	
}


@media screen and (max-width: 767px) {
	.header span.logo a {
	    padding: 5px 30px !important;
	}
	
	.header.scrolled {
		height:50px;
	}
	
	.header.scrolled .main-nav .nav .active.nav-item a {
	    color: #12ace5;
	}
	
	.header.scrolled .main-nav .nav .nav-item a {
	    color: #fff;
	}
}

.vcenter {
	margin-top:10px;
	margin-bottom:5px;    
}


.orderfaq .inner div.vcenter {
	padding-top:8px;
}

.pricing .item .heading .title.error {
	color:red;
}

.pricing .item .heading .title.success {
	color:green;
}

#header {
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}


/* Order form  */
.orderform  {
	background-color:white;
	background: #fff;
	
	
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius: 10px;

	-moz-background-clip: padding;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;

	border: none;

	
}

.orderform.inner {
	background-color:#fff;
	display:block;
	margin: 0 -8px 0 -8px;
	padding-bottom: 10px;
}



.orderform.high {
	min-height:300px;	
}


@media screen and (max-width: 767px) {
	.orderform.high {
		min-height:0;	
	}
	
	.paymentBox.row > div {
		padding-left:7px;
		padding-right:7px;
	}

	
}

.paytype {
	margin-top:4px;
}
	
.panel-heading {
    padding: 10px 0px;
}

.pricepermonthbox span {
	display: block;
	float:right;
	font-weight:bold;
}

.pricepermonthbox .permonth {
	margin-right:25px;
	margin-bottom:10px;
	font-size:16px;
	font-weight:bold;
}


 

.pricepermonthbox .currencysymbol {
	vertical-align:top;
	margin-top:20px;
	margin-right:5px;
}

.pricepermonthbox .price {
	font-size:34px !important;
	 margin-right: 25px;
	margin-top:7px;
	margin-bottom:-10px;
}


.pricepermonthbox.withoutpermonth .price {
	margin-bottom:0px;
	
}


#billDurationRadio .pricepermonthbox .price {
    margin-bottom: 0;
}
#billDurationRadio .pricepermonthbox  {
    margin:25px 0 0;
}





#billDurationRadio .pricepermonthbox .currencysymbol {
    margin-top:10px;
}


.orderform h2 {
	font-weight:bold;
	padding: 0;
	margin:20px 0 10px;
	font-size: 20px;
	color: #333;
	
}

.orderform h3 {
	font-weight:bold;
	padding: 0;
	margin:20px 0 10px;
	font-size: 16px;
	
}

.orderform .items-wrapper ul li {
	text-align:left;
	font-size:13px;
}


.orderform .panel {
	margin-bottom:0;
}

.orderform .items-wrapper .row div {
    display: inline-block;
    vertical-align: middle;
	padding-top: 20px;
}


.orderform {
	font-size:16px;
}

.orderform label
, .orderform input
, .orderform a {
	
	margin-bottom:3px;
}



input.sendOrder,
button.sendOrder {
	font-size:18px;
	
}

@media screen and (max-width: 778px) {
	input.sendOrder,
	button.sendOrder {
		font-size:12px;
	}
	a.btn-cta, .btn-cta {
	    padding: 8px 10px;
	}
	
}

.orderform label.error {
	font-size:15px;
}
.order .slider {
	height:15px;;	
}

.order .slider td {
	padding-left:10px;;	
	height:15px;
}

#AmountSlider,
#BillDurationSlider {
	width:100%;
	float:left;
	height:5px;
	margin-top:5px;

}
#AmountSlider.ui-slider .ui-slider-handle,
#BillDurationSlider.ui-slider .ui-slider-handle {
	height:20px;
	width:10px;
	background-color:#12ACE5;
	top:-8px;
	position: relative;
    display: block;	
}


.ui-widget-header
{
	background:#15b6ea !important;	
	border-color:#15b6ea !important;
	border-right-color:#76b7cd !important;
}

#progressbar_old .ui-widget-header,
#progressbar_old_boxpage .ui-widget-header {
	background:#ababab !important;	
	border-color:#ababab !important;
	border-right-color:#76b7cd !important;
}

#progressbar_new .ui-widget-header,
#progressbar_new_boxpage .ui-widget-header {
	background: #f6a828 url("images/ui-bg_gloss-wave_35_f6a828_500x100.png") 50% 50% repeat-x !important;
	border-color:#ababab !important;
	border-right-color:#76b7cd !important;
}

.ui-widget-content {
	background-color:#4b5054;

}

  .ui-progressbar {
    position: relative;
  }
  
  .progress-label {
    position: absolute;
    left: 10px;
    top: 4px;
    font-weight: bold;
    color:#ffffff;
        

  }

#progressbar_old_boxpage .progress-label,
#progressbar_new_boxpage .progress-label {
	font-size:12px;
	margin-top:5px;
}

.orderform > form > div {
	
}

.orderform input[type="text"],
.orderform input[type="email"],
.orderform input[type="password"] {
	width:100%;
	color:#a1a1a1;
	
}

.orderform select {
	width:100%;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	-ms-border-radius: 0;
	background:none;;
}



/*
.orderform input[type="text"],
.orderform input[type="password"],
.orderform select {
	height:50px;
	padding:10px;
}

*/
.orderform input[type="text"]::-webkit-input-placeholder,
.orderform input[type="password"] { /* WebKit, Blink, Edge */
    color:    #888;
}
.orderform input[type="text"]:-moz-placeholder,
.orderform input[type="password"] { /* Mozilla Firefox 4 to 18 */
   color:    #888;
   opacity:  1;
}
.orderform input[type="text"]::-moz-placeholder,
.orderform input[type="password"] { /* Mozilla Firefox 19+ */
   color:    #888;
   opacity:  1;
}
.orderform input[type="text"]:-ms-input-placeholder,
.orderform input[type="password"]:-ms-input-placeholder
{
   color:    #888;
}
.orderform input[type="text"]::-ms-input-placeholder,
.orderform input[type="password"]::-ms-input-placeholder { /* Microsoft Edge */
   color:    #888;
}

input.error {
    background-color: #ffdcd7;
    border: 2px solid red !important;
}

.error {
    color: red;
}

#errorCount {
  	display:none;
}

#errorCount.orderform h2 {
	color:red;	
}

.productbox {
	float:left;
	margin-right:15px; 
	display:block;
}


.why-shellfire-vpn {
	font-size:14px;
}

#tooltip
{
    text-align: center;
    color: #fff;
    background: #111;
    position: absolute;
    z-index: 100;
    padding: 15px;

}
 
    #tooltip:after /* triangle decoration */
    {
        width: 0;
        height: 0;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid #111;
        content: '';
        position: absolute;
        left: 50%;
        bottom: -10px;
        margin-left: -10px;
    }
 
        #tooltip.top:after
        {
            border-top-color: transparent;
            border-bottom: 10px solid #111;
            top: -20px;
            bottom: auto;
        }
 
        #tooltip.left:after
        {
            left: 10px;
            margin: 0;
        }
 
        #tooltip.right:after
        {
            right: 10px;
            left: auto;
            margin: 0;
        }
        
.number,
#pricePerMonth,
#pricePerPayment,
#wholeSum,

#rebate,
#compared,
#shipping,
#pricingDeal,
#virtualAccountOuter {
	font-size: 26px;
	font-weight: bold;
}

#avgPerMonth {
	font-size:14px;
}

#avgPerMonthOuter .currency {
	top: 0;
	font-size:14px;
	
}

.currency {
	top: -8px;
	right: 0px;
	position: relative;
	font-family: arial,sans-serif;
	color: #666;
	font-size: 18px;
}


.zip {
	padding-right:3px;
}

.place {
	padding-left:0;
}

.orderform.inner.comodo {
	margin-top:20px;
	padding-top:10px;
}

.strikeout::after {
  border-bottom: 0.125em solid red;
  content: "";
  left: 0;
  margin-top: calc(0.125em / 2 * -1);
  position: absolute;
  right: 0;
  top: 50%;
  
  -webkit-transform:rotate(-5deg);
  -moz-transform:rotate(-5deg);
  -ms-transform:rotate(-5deg);
  -o-transform:rotate(-5deg);
  transform:rotate(-5deg);
}


#basePriceRadio label {
		width:100%;
	box-sizing:border-box;
	height:70px;
}

#autoExtendRadio label {
	width:100%;
	height:45px;
	box-sizing:border-box;
}


#billDurationRadio label {
	box-sizing:border-box;
	height: 100px;
}

.ui-button-text {
	padding: 0 !important;
	
}

.orderform .ui-state-default {
	background-color:#fff;
	background-image:none;
	border: 2px solid #888;
	
}


    


.orderform .ui-state-active, 
.orderform .ui-widget-content .ui-state-active, 
.orderform .ui-widget-header .ui-state-active {
    border: none;
    background: #21ace1;
}

.orderform .ui-state-active span.ui-button-text {
    font-weight: bold;
    color: #fff;
    
	
} 

span.ui-button-text  {
	font-size:24px;	
	padding-top: 10px !important;
	color:#777;
	font-weight:normal;
}

#labelAutoExtendY,
#labelAutoExtendN,
span.ui-button-text .rebate
 {
		-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius: 10px;
}

.ui-button-text span.months {
	font-size:14px;	
}

.ui-button-text span.price {
	font-size:16px;	
}
.ui-button-text span.permonth {
	font-size:10px;	
}
	
.ui-button-text span.price .currency {
	top: 0px;
	right: 0px;
	position: relative;
	font-family: inherit;
	color: inherit;
	font-size: 10px;
}
	
.orderform .ui-state-default,
#billDurationRadio .ui-state-default,
#billDurationRadio .ui-state-default .rebate {
	border-color:#888;
}


.orderform .ui-state-hover,
#billDurationRadio .ui-state-hover,
#billDurationRadio .ui-state-hover .rebate {
	border-color:#12ace1;
}



.ui-state-active .ui-button-text span.rebate {
	background-color: #1e9aca;
	color:#fff;
}

	
.ui-button-text span.rebate {
	font-size:18px;
	padding: 13px 30px;
	text-align:center;
	display:block;
	float:right;
    height: 45px;
    margin-top: -10px;
}


	
#billDurationRadio .ui-button-text span.rebate {
	background-color: #f5f5f5;
    margin-top: 20px;

}


@media screen and (max-width: 991px) {
	.ui-button-text span.rebate {
		font-size:18px;
		padding: 13px 15px;
	}
	
	.pricepermonthbox .price {
		font-size:36px;
	}

	.pricepermonthbox .currencysymbol {
    	margin-top: 15px;
	}
	
	#billDurationRadio .pricepermonthbox  {
	    margin:0;
	}
	#billDurationRadio .ui-button-text span.rebate {
	    margin-top: 5px;
	}
	#billDurationRadio .pricepermonthbox .currencysymbol {
	    margin-top: 5px;;
	}
	
	#billDurationRadio .pricepermonthbox .price {
    	margin-top: 0px;
	}
	#billDurationRadio .pricepermonthbox .permonth {
	    margin-bottom: 0px;
	}
}


#billDurationRadio label {
	height:auto;
	width: 100%;
		-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius: 10px;
	border-color:#f5f5f5;
	min-height: 190px !important;
	
}

#billDurationRadio .ui-state-active {
	background-color: #fff;
	border: 3px solid #21ace1;
	
}
#billDurationRadio .ui-state-active .ui-button-text {
	color: #12ace5 !important;
}

#billDurationRadio .ui-state-active .ui-button-text .container>div {
	padding-left:10px !important;	
	
}

#billDurationRadio span.ui-button-text .rebate {
	-webkit-border-radius: 0px;
	-moz-border-radius: 0px;
	-ms-border-radius: 0px;
	border-radius: 0px;
	width:100%;
	
	border-bottom-left-radius:10px;
	border-bottom-right-radius:10px;
	
}

#billDurationRadio .ui-state-active span.ui-button-text .rebate {
	background-color: #21ace1;
	border-bottom-left-radius:0;
	border-bottom-right-radius:0;
}

.countrylist .title img {
	width:70px;
}

.countrylist .steps .step {
	padding:0;
	margin:0;
}

.countrylist .promo {
	height:150px;
}

.countrylist .promo {
    padding-top: 100px !important;
    background:none;
}


.paymentTypeHeader {
	background-color:#f1f1f1;
	height: 40px;
	padding-top: 10px;
	cursor:pointer;
}



.paymentTypeBody,.paymentTypeHeader {
	color:#444;
	
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius: 10px;
	border: 3px solid #f5f5f5; 
}

.paymenttype label {
	font-size:14px;
	display: inline;
}
.paymenttype a {
	font-size:14px;
}

#autoExtendRadio.ui-buttonset {
    margin-right: 0;
}


	
#orderForm .pricepermonthbox.withoutpermonth .price {
	font-size:16px !important;
	margin-right: 5px;
	margin-top:0px;
	font-weight:normal;
	
}
	
#orderForm .textbox,
#orderForm .pricepermonthbox.withoutpermonth .price  {
	color:black;
	font-weight:bold;
}
	
	
.description {
	font-size:14px;
	color:black;
}

#sBICDisplay {
	font-size:15px;
}

#trustInShellfire {
	text-align:center;
}




ul.list-unstyled.download-list.black li a,
ul.list-unstyled.download-list.black li a i {
	color:#444 !important;
	border-color:#444;	
}


ul.list-style-check-orderform li {
	background: url("/https/cdn.shellfire.net/images/order_check.png") no-repeat left top;	
    line-height: 25px;
    padding-left: 30px;	
    list-style:none;
    margin-bottom:5px;
    font-size:90%;
    line-height:15px;
    min-height:30px;
}

ul.list-style-check-orderform li.green {
	background: url("/https/cdn.shellfire.net/images/order_check_green.png") no-repeat left top;	
}




ul.list-style-check-orderform  {
    margin-left: 0px;
    padding-left:0;
}

#Email,
#Password  {
	margin-top:10px;
}
h2.nomargin {
	margin:10px 0 0 0;
}


#activateHowto {
	width:569px;
	height:320px;
	margin-left:-47px;
	margin-right:-47px;

}


.shellfireboxheader .highlight {
	font-weight:bold;
	
}

.shippingSumContainer div {
	font-weight:normal !important;
	
}



#stripe-card-payment-element  {
	margin-top:10px;
}

/* VAT Information Styling */
.vatInfoContainer .vatInfo {
	line-height: 1.3;
}

.vat-country-selector {
	position: relative;
	width: 100%;
}

.vat-country-display {
	cursor: pointer;
	text-decoration: underline;
	word-wrap: break-word;
	line-height: 1.2;
	min-height: 20px;
	font-family: inherit;
}

.vat-country-dropdown {
	display: none;
	position: absolute;
	top: 100%;
	right: 0;
	background: white;
	border: 1px solid #ccc;
	border-radius: 4px;
	box-shadow: 0 2px 8px rgba(0,0,0,0.15);
	z-index: 1000;
	max-height: 200px;
	overflow-y: auto;
	min-width: 250px;
	font-family: inherit;
}

.vat-country-dropdown:focus {
	outline: none;
}

.vat-country-group {
	border-bottom: 1px solid #ddd;
}

.vat-country-group:last-child {
	border-bottom: none;
}

.vat-country-group > div:first-child {
	padding: 8px 12px;
	background: #f5f5f5;
	font-weight: bold;
	font-size: 12px;
	color: #666;
	border-bottom: 1px solid #ddd;
}

.vat-country-option {
	padding: 8px 12px;
	cursor: pointer;
	border-bottom: 1px solid #eee;
	transition: background-color 0.2s ease;
}

.vat-country-option:last-child {
	border-bottom: none;
}

.vat-country-option:hover {
	background-color: #f0f0f0 !important;
}

.vat-country-option.selected {
	background-color: #e6f3ff !important;
	font-weight: bold;
}

.vat-country-option.highlighted {
	background-color: #f0f0f0 !important;
}

/* Ensure VAT container matches other pricing elements */
.vatCountryContainer .pricepermonthbox {
	min-height: auto;
}

.vatCountryContainer .textbox {
	line-height: 1.4;
}

/* Legal Documents Styling (Terms, Imprint, Withdrawal) */
.legal-document {
    max-width: 100%;
    margin: 0 auto;
    line-height: 1.6;
}

.legal-document .section-divider {
    margin: 30px 0;
    border-top: 2px solid #e1e5e9;
}

.legal-document .section-header {
    margin-bottom: 25px;
}

.legal-document .document-title {
    color: #2c3e50;
    font-size: 28px;
    font-weight: 600;
    margin-bottom: 20px;
    text-align: center;
    border-bottom: 2px solid #3498db;
    padding-bottom: 15px;
}

.legal-document .document-subtitle {
    color: #666;
    font-size: 16px;
    font-style: italic;
    text-align: center;
    margin-bottom: 20px;
}

.legal-document .company-info {
    background: #f8f9fa;
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 20px;
    border-left: 4px solid #3498db;
}

.legal-document .key-facts-section {
    background: #f8f9fa;
    padding: 15px 20px;
    border-radius: 8px;
    margin-bottom: 25px;
    border: 1px solid #dee2e6;
    box-shadow: 0 2px 4px rgba(0,0,0,0.08);
}

.legal-document .key-facts-title {
    color: #495057;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 15px;
    text-align: center;
    padding-bottom: 8px;
    border-bottom: 1px solid #dee2e6;
}

.legal-document .key-facts-table {
    margin: 0;
    border-radius: 6px;
    overflow: hidden;
}

.legal-document .key-facts-table .table {
    margin-bottom: 0;
    background: white;
    font-size: 14px;
}

.legal-document .key-facts-table thead th {
    background-color: #3498db;
    color: white;
    font-weight: 600;
    text-align: center;
    padding: 12px;
    border: none;
}

.legal-document .key-facts-table .fact-label {
    background-color: #f1f3f4;
    color: #495057;
    font-weight: 600;
    width: 30%;
    padding: 12px;
    vertical-align: middle;
    border-right: 1px solid #dee2e6;
    border-bottom: 1px solid #dee2e6;
}

.legal-document .key-facts-table .fact-content {
    background-color: white;
    color: #495057;
    padding: 12px;
    vertical-align: middle;
    line-height: 1.5;
    border-bottom: 1px solid #dee2e6;
}

.legal-document .key-facts-table tbody tr:last-child .fact-label,
.legal-document .key-facts-table tbody tr:last-child .fact-content {
    border-bottom: none;
}

.legal-document .key-facts-table tbody tr:hover .fact-label {
    background-color: #e9ecef;
}

.legal-document .key-facts-table tbody tr:hover .fact-content {
    background-color: #f8f9fa;
}

.legal-document .section-title {
    color: #2c3e50;
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e1e5e9;
}

.legal-document .section-content {
    margin-bottom: 15px;
    color: #34495e;
    text-align: justify;
    line-height: 1.7;
}

.legal-document .subsection {
    margin-bottom: 18px;
    padding-left: 15px;
}

.legal-document .subsection-label {
    color: #2980b9;
    font-weight: 600;
}

.legal-document .customer-obligations {
    padding-left: 15px;
}

.legal-document .customer-obligations ul {
    list-style-type: disc;
    margin-left: 20px;
}

.legal-document .customer-obligations ul li {
    margin-bottom: 10px;
    line-height: 1.6;
}

.legal-document .contract-models-table {
    margin: 25px 0;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    border-radius: 8px;
    overflow: hidden;
}

.legal-document .contract-models-table .table {
    margin-bottom: 0;
}

.legal-document .contract-models-table .table-header th {
    background-color: #3498db;
    color: white;
    font-weight: 600;
    text-align: center;
    padding: 15px 10px;
    border: none;
}

.legal-document .contract-models-table tbody td {
    padding: 15px 12px;
    vertical-align: middle;
    border-color: #e1e5e9;
}

.legal-document .contract-models-table tbody tr:hover {
    background-color: #f8f9fa;
}

.legal-document .additional-notes {
    background: #f8f9fa;
    padding: 20px;
    border-radius: 8px;
    border-left: 4px solid #e74c3c;
    margin-top: 20px;
}

.legal-document .contact-list {
    padding-left: 15px;
}

.legal-document .contact-list .list-item {
    display: block;
    margin-bottom: 15px;
    line-height: 1.6;
}

.legal-document .numbered-list {
    counter-reset: item;
    padding-left: 0;
}

.legal-document .numbered-list .list-item {
    display: block;
    margin-bottom: 15px;
    padding-left: 30px;
    position: relative;
    line-height: 1.6;
}

.legal-document .numbered-list .list-item:before {
    content: counter(item);
    counter-increment: item;
    position: absolute;
    left: 0;
    top: 0;
    background: #3498db;
    color: white;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: bold;
}

.legal-document .external-link {
    color: #3498db;
    text-decoration: none;
    border-bottom: 1px dotted #3498db;
}

.legal-document .external-link:hover {
    color: #2980b9;
    text-decoration: none;
    border-bottom: 1px solid #2980b9;
}

.legal-document .email-link {
    color: #e74c3c;
    text-decoration: none;
    font-weight: 600;
}

.legal-document .email-link:hover {
    color: #c0392b;
    text-decoration: underline;
}

/* Imprint specific styling */
.legal-document .imprint-info {
    background: #f8f9fa;
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 20px;
    border-left: 4px solid #3498db;
    text-align: left;
}

.legal-document .imprint-info p {
    margin-bottom: 15px;
    line-height: 1.6;
}

.legal-document .imprint-info p:last-child {
    margin-bottom: 0;
}

/* Withdrawal instruction specific styling */
.legal-document .withdrawal-form {
    border: 1px solid #ccc;
    padding: 20px;
    margin: 20px 0;
    background-color: #f9f9f9;
    border-radius: 8px;
    text-align: left;
}

.legal-document .withdrawal-form p {
    margin-bottom: 15px;
    line-height: 1.6;
}

.legal-document .withdrawal-form p:last-child {
    margin-bottom: 0;
}

.legal-document .left-aligned-list {
    text-align: left;
}

.legal-document .left-aligned-list ul {
    margin-left: 20px;
}

.legal-document .left-aligned-list li {
    margin-bottom: 8px;
    line-height: 1.5;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .legal-document .terms-section {
        padding: 15px 0;
        margin-bottom: 25px;
    }
    
    .legal-document .document-title {
        font-size: 24px;
    }
    
    .legal-document .section-title {
        font-size: 18px;
    }
    
    .legal-document .key-facts-section {
        padding: 20px 15px;
        margin-bottom: 25px;
    }
    
    .legal-document .key-facts-title {
        font-size: 20px;
    }
    
    .legal-document .key-facts-table .fact-label {
        width: 35%;
        padding: 15px 12px;
        font-size: 14px;
    }
    
    .legal-document .key-facts-table .fact-content {
        padding: 15px 12px;
        font-size: 14px;
    }
    
    .legal-document .contract-models-table .table-header th {
        padding: 12px 8px;
        font-size: 14px;
    }
    
    .legal-document .contract-models-table tbody td {
        padding: 12px 10px;
        font-size: 14px;
    }
    
    .legal-document .subsection, 
    .legal-document .customer-obligations, 
    .legal-document .contact-list {
        padding-left: 10px;
    }
    
    .legal-document .imprint-info,
    .legal-document .withdrawal-form {
        padding: 15px;
        margin: 15px 0;
    }
}