@font-face {
    font-family: 'Geograph';
    src: url('https://account.natgeokids.com/fileAssets/CM/NGK/Geograph-Regular.eot');
    src: url('https://account.natgeokids.com/fileAssets/CM/NGK/Geograph-Regular.eot?#iefix') format('embedded-opentype'),
        url('https://account.natgeokids.com/FileAssets/CM/NGK/Geograph-Regular.woff2') format('woff2'),
        url('https://account.natgeokids.com/FileAssets/CM/NGK/Geograph-Regular.woff') format('woff'),
        url('https://account.natgeokids.com/FileAssets/CM/NGK/Geograph-Regular.ttf') format('truetype'),
        url('https://account.natgeokids.com/FileAssets/CM/NGK/Geograph-Regular.svg#Geograph-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
 
 
 
@font-face {
    font-family: 'Geograph';
    src: url('https://account.natgeokids.com/FileAssets/CM/NGK/Geograph-Medium.eot');
    src: url('https://account.natgeokids.com/FileAssets/CM/NGK/Geograph-Medium.eot?#iefix') format('embedded-opentype'),
        url('https://account.natgeokids.com/FileAssets/CM/NGK/Geograph-Medium.woff2') format('woff2'),
        url('https://account.natgeokids.com/FileAssets/CM/NGK/Geograph-Medium.woff') format('woff'),
        url('https://account.natgeokids.com/FileAssets/CM/NGK/Geograph-Medium.ttf') format('truetype'),
        url('https://account.natgeokids.com/FileAssets/CM/NGK/Geograph-Medium.svg#Geograph-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Geograph';
    src: url('https://account.natgeokids.com/FileAssets/CM/NGK/Geograph-Bold.eot');
    src: url('https://account.natgeokids.com/FileAssets/CM/NGK/Geograph-Bold.eot?#iefix') format('embedded-opentype'),
        url('https://account.natgeokids.com/FileAssets/CM/NGK/Geograph-Bold.woff2') format('woff2'),
        url('https://account.natgeokids.com/FileAssets/CM/NGK/Geograph-Bold.woff') format('woff'),
        url('https://account.natgeokids.com/FileAssets/CM/NGK/Geograph-Bold.ttf') format('truetype'),
        url('https://account.natgeokids.com/FileAssets/CM/NGK/Geograph-Bold.svg#Geograph-Medium') format('svg');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

body {
	font-family: 'Geograph', sans-serif;
	background-color: transparent;
	font-weight: normal;
    font-style: normal;
    font-display: swap;
	overflow-wrap: break-word;
  }
  
  h1,
  h2 {
	color: #212121; 
	font-weight:700;
	letter-spacing:2px;
  }
h2,
h3,
.title h1{
	text-transform: uppercase;
}
.inform-section-legend-main{
	letter-spacing:2px;
}
  button,
  a.button {
	color: #212121;
	border: 0;
	border-radius: 0;
	background: #FFCC00;
	text-transform: uppercase;
	-webkit-transition: background-color 0.25s ease-in;
    transition: background-color 0.25s ease-in;
	letter-spacing:2px;
	font-size:14px;
	font-family: 'Geograph', sans-serif;
	text-transform: uppercase;
  }
  button:hover,
  button:focus,
  a.button:hover,
  a.button:focus {
	background: #FCAF17;
	color:#212121;
  }
  button.style2{
	color: #212121;
	background-color: #FFCC00; 
	border:none;
	border-radius: 0;
	font-size:14px;
	font-family: 'Geograph', sans-serif;
	text-transform: uppercase;
  }
  button.style2:not([disabled]):hover, 
  button.style2:not([disabled]):focus {
    background-color: #FCAF17;
	color:#212121;
}
  a.button.mobile {
	color: #212121;
	width: 124px;
	padding-top: 6px;
  }
  a.button.mobile:hover,
  a.button.mobile:focus {
	color: #212121;
  }
  button.text,
  button.returnTo {
	color: #212121;
	text-transform: uppercase;
	font-weight: 500;
  }
  
  button.text:hover,
  button.returnTo:hover {
 	background-color:transparent;
  }
  
  a:link,
  a:visited {
	color: #212121;
	text-decoration: none;
	font-weight:700;
  }
  
  a:hover,
  a:active {
	color: #212121;
	text-decoration: underline;
  }
  legend{
	text-transform: uppercase;
  }
  .validationBox h2 {
	font-size: 1.6em;
	line-height: 1.56;
  }
  
  .validationBox li {
	font-size: 1.6em;
	line-height: 1.56;
  }

  .paymentType .radiogroup label > input[type="radio"]{
	position: initial; 
    opacity: 1;
    appearance: none;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
    height: 12px;
    width: 12px;
    margin-right: 12px;
    margin-left: -6px;
    box-shadow: 0 0 0 2px #ffcc00;
    border-radius: 50%;
  }

  .paymentType .radiogroup label > input[type="radio"]:checked {
      background-color: #ffcc00;
      box-shadow: 0 0 0 2px #ffcc00, inset 0 0 0 2px #ffffff;
  }

  .paymentType .radiogroup label > input:focus {
	outline-style: none;
	outline-color: transparent;
}
.signIn .sign-option-guest .label-title{
	padding-left: 40px;
}

.secureCheckout .sign-option-guest .label-title .description, 
.signIn .sign-option-guest .label-title .description{
	padding:0;
	font-size: 14px;
}
.secureSocialCheckout.signIn .centreColumn .informInline .field .radios .radio + label{
	padding: 4px 0 8px;
}

  .paymentType .radiogroup label > span {
	color: #222;
	padding-top: 1px;
  }
  .order-summary-container.content-appended{ 
	border: 2px solid #212121;
	border-radius: 0;
  }
  .order-summary-container .order-summary-table tfoot td:first-child div{
	border-bottom-left-radius:0;
  }
  .order-summary-container .order-summary-table tfoot td:last-child div { 
    border-bottom-right-radius: 0;
}
  #wrapper {
	box-shadow: 0 0 0;
	position: static;
	background-color: transparent;
	overflow:inherit;

	padding-top:0;
  }

  #wrapper {
	padding-bottom:0;
  }
  #wrapper:before {
	content: "";
	background-color: #fff;
	height: 105px;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	border-bottom:1px solid #dcdcdc;
  }
  
  #wrapper .products .labelInner1 .title {
	color: #212121;
  }
  .centreContent > h1 {
	text-transform:uppercase;
  }
  .mastheadLogo #brand-logo{
	display:block;
 
}

.mastheadLogo #mobile-logo{
	display:none;
}

.mastheadLogo{
	display:flex;
	align-items: center;
	justify-content: center;
}
 
.mastheadLogo  .mastHybrid p.mastHybrid-text {
	display:none;
}
  .mast {
	margin-bottom: 30px;
	position:relative; 
  }

  
  .mast .sleeve a .mobile {
	display: none;
  }
  
  .mast .sleeve div {
	padding: 16px 0;
  }
  .validation-advice {
	text-align: right;
	}
  .navigation-home {
	position: absolute;
	z-index: 10;
	color: red;
	width: 40px;
	height: 52px;
	display: inline-block;
	top: 140px;
	line-height: 64px;
	text-align: center;
  }
  .checkbox.showPassword.no-image {
    text-align: right;
}
.progress li:first-child:before {
    left: 0;
}
.progress li{
	color:#2C2C2C;
	font-family: 'Geograph', sans-serif;
	letter-spacing:2px;
}
.progress li.current > span:after, .progress li.complete > span:after {
    border-bottom-color: #212121;
}
.progress .current > span, .progress .complete > span{
	border-bottom: 4px solid #212121;
}
.progress li span span { 
    font-size: 11px;
}
.informSleeve > fieldset > legend {
    font-weight: 700;
    font-size: 20px;
    line-height: 32px;
}
label, 
fieldset fieldset legend{
	font-size:14px;
	line-height:24px;
	font-weight:500;
	text-transform:uppercase; 
	letter-spacing:2px;
}
.radio label,
.checkbox label{
	text-transform:none;
	letter-spacing:normal;
}

  .field.checkbox{
		display:block;
	}

  .checkbox {
	display: none; /* Hide the default checkbox */
  }
  
  .checkbox + label {
	position: relative;
	padding-left: 25px; /* Adjust the padding to create space for the custom checkbox */
	cursor: pointer;
  }

  .checkbox:checked + label:after,
  .checkbox + label:before {
	content: "";
	position: absolute;
	left: -30px;
	top: 0;
	width: 20px;
	height:20px;
	background-color: #fff;
	border-radius: 0;
	border: 1px solid #ffcc00;
	}
  .checkbox:checked + label:after{
	z-index:0;
  }
  .checkbox:checked + label:before {
	content: '';
    text-align: center;
    font-size: 16px;
    line-height: 20px;
    color: black;
    display: inline-block;
    transform: rotate(45deg);
    height: 10px;
    width: 4px;
    left: -22px;
    border-bottom: 2px solid #212121;
    border-right: 2px solid #212121;
    border-top: 0 solid;
    border-left: 0 solid;
    z-index: 1;
    top: 11px;
  }

  input[type="radio"] {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
  }
  input:focus, 
  input.text:focus, 
  textarea:focus,
  select:focus{
	outline-style: inset;
	outline-color:#ffcc00;
	-moz-box-shadow: 0 0 3px #ffcc00;

}
  
  /* Style the custom radio button */
  input[type="radio"] + label {
	position: relative;
	padding-left: 0; /* Adjust as needed */
	cursor: pointer;
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
  }
  
  /* Create the custom radio button indicator */
  input[type="radio"] + label::before {
    content: "";
    position: absolute;
    left: -25px;
    top: 6px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    box-shadow: 0 0 0 2px #ffcc00;
  }
  
  /* Style the custom radio button indicator when selected */
  input[type="radio"]:checked + label::before {
	background-color: #ffcc00;
    box-shadow: 0 0 0 2px #ffcc00, inset 0 0 0 2px #ffffff;
  }

 
  
  .secureSocialCheckout.signIn .centreColumn .informInline .field .radios .radio + label{
	width:100%;
  }
input.text, select, textarea{
	border:1px solid #FFCC00;
	font-family: 'Geograph', sans-serif;
}

.DeliveryAddress table tr td .field button{
	font-size: 1em;
    padding: 10px 12px;
    border: 2px solid #000;
    height: auto; 
}
.DeliveryAddress .selectDeliveryAddress .field button + button{
	border-left: 2px solid #000;
	padding-left: 12px;
}

.newProduct #wrapper .offerVariantSelectionForm .productTable tbody div h4{
	color:#212121;
}
.newProduct #wrapper .offerVariantSelectionForm .informInline.left .promotion .updateOffers{
	width:auto;
	height:36px;
}
.newProduct #wrapper .offerVariantSelectionForm .informInline.left .promotion.show div{
	display:flex;
}
fieldset.style2 .promotion button {
	height:36px;
}
.group .field.radio, .group .field.checkbox {
    padding-left: 30px;
    vertical-align: top;
}
.field .twoColumn fieldset:first-child div.field:first-of-type, 
.field .twoColumn fieldset:first-child div.field:first-of-type + div, 
.field .twoColumn fieldset:first-child + fieldset div.field:first-of-type, 
.field .twoColumn fieldset:first-child + fieldset div.field:first-of-type + div {
    margin-top: 0;
}

.highlight, .informInline label.highlight, .field.buttons.highlight, .group.highlight{
	border:1px solid #212121;
	background-color:#fff;
	border-radius:0;
}
.product #offerVariantSelectionWrapper > h2 {
    background: #eaeaea;
}
#wrapper .products div label {
    margin: 0 0 0 20px;
    padding: 0px 0 0;
}
#wrapper .products .field:hover {
    background-color: #eaeaea;
    cursor: pointer;
}
.newProduct #wrapper .offerVariantSelectionForm [data-quantity-adjustor] div[class*="qty-"] circle {
    fill: #ffcc00;
}
div#reflow-content-desktop td:first-child {
    padding: 0!important;
}
.order-summary-container .order-summary-table tfoot td:first-child div{
	margin-left:0;
}
.order-summary-container .order-summary-table tfoot td:last-child div {
    margin-right: 0;
}
.order-summary-container .order-summary-table th, 
.order-summary-container .order-summary-table td { 
    padding-left: 8px;
    padding-right: 8px;
}

.order-summary-container .order-summary-table thead th { 
    padding-right: 8px;
    padding-left: 8px;
}

.order-summary-container .order-summary-table tfoot div {
    background: #f2f2f2;
}
.order-summary-container .order-summary-table tfoot {
    background-color: #f2f2f2;
}
#wrapper .products div label span *{
	text-transform:none;
}
/* icons */
.pagePartial .blockGroup .userDataBlock .icon{
	background-color:#ffcc00;
}
.pagePartial .blockGroup .userDataBlock h3{
	color:#212121;
	letter-spacing:2px;
}
.pagePartial .blockGroup .userDataBlock:hover h3, 
.pagePartial .blockGroup .userDataBlock:hover p.edit, 
.pagePartial .blockGroup .userDataBlock:active h3, 
.pagePartial .blockGroup .userDataBlock:active p.edit {
    border-bottom-color: #212121;
}
.newProduct #wrapper .offerVariantSelectionForm .informInline.left > .field label[for="DeliveryCountry"] {
  
	text-transform: none;
    letter-spacing: 1px;
    width: fit-content;
	margin-top:4px;
}
.newProduct #wrapper .offerVariantSelectionForm .informInline.left .promotion label{
	color: #212121;
    text-transform: none;
    letter-spacing: 1px;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable thead tr th { 
    text-transform: uppercase;
    letter-spacing: 2px;
}
.informInline select.medium{
	margin:0;
	width:42%;
}
 
fieldset.style2 .promotion label { 
    padding: 0 0 6px; 
    text-transform: none;
    letter-spacing: 1px;
}
fieldset.style2 {
 
    padding: 40px 20px;
 
}
.product .informInline label[for="DeliveryCountry"]{
	letter-spacing: 1px;
    text-transform: none;
    line-height: normal;
    margin-top: 6px;
}
#wrapper .products .labelInner1 {
 
    letter-spacing: 1px;
}
.newProduct #wrapper .offerVariantSelectionForm .productTable tbody tr td {
   
    letter-spacing: 1px;
}
.validationBox h2 { 
    text-transform: none;
    letter-spacing: 1px;
}
  /* FOOTER */
  .footer {
	width: 100%;
	width: -webkit-calc(100vw - 9px);
	width: -moz-calc(100vw - 9px);
	width: calc(100vw - 9px);
	margin: 0 -moz-calc(-50vw + 50%);
	margin: 0 -webkit-calc(-50vw + 50%);
	margin: 0 calc(-50vw + 50%);
	position: relative;
	padding-top: 0;
}
  
  .footer .sleeve {
	position: relative;

  }
  
  .footer .sleeve:before {
	content: "";
	position: absolute;
	top: 0;
	width: 100%;
	
  }
  .footer .inner-sleeve{
	background-color: #f2f2f2;
  }
  .footer ul {
	position: relative;
	clear: both;
	max-width:1220px;
	color: #212121;
	width: 100%;
	padding: 17px 20px;
	float: none;
	margin: auto;
	display:flex; 
	text-align: center;
	flex-wrap: wrap;
    justify-content: center;
  }
  
  .footer li {
	float: none; 
	vertical-align: top;
	font-weight: bold;
	text-transform: uppercase;
	font-size: 1.4em;
	border-left:0;
	letter-spacing:2px;
	font-size:14px;
	margin:0 10px;
	padding:0 10px;
	line-height: 2;
  }
  
  .footer li:first-child{
	margin:0 10px;
	padding:0 10px;
  }
  .footer ul li a {
	color: #212121;
  }
  
  .footer .sleeve .subFooter{
	background-color:#fff;
	border-top:1px solid #dcdcdc
  }
  .footer .sleeve .subFooter-details{
	max-width:1220px;
	width: 100%;
	padding: 17px 20px; 
	margin: auto;
	display:flex;
	justify-content: space-between;
	text-align: center;
  }

  .footer .sleeve .subFooter-details .paymentCards{
	display:flex;
	gap:10px;
	margin-left: auto;
	margin-top:-17px;
  }
  .footer .sleeve div {
	text-align: center;
	font-size: 12px;
	line-height: 16px;
  }
   .poweredby{
	font-size: 12px;
	line-height: 16px;
	padding: 9px 0;
	margin:auto;
	background-color:#FAFAFA;
	color:#888888;
  }
  .poweredby a{
	  font-weight:800;
  }

  p {
	font-size: 1.6em;
	line-height: 1.56;
}

p.style1 {
	font-size: 1.8em;
	line-height: 1.55;
}

li {
	font-size: 1.6em;
	line-height: 1.56;
}

ol li {
	margin-left: 27px;
}

dl {
	font-size: 1.6em;
	line-height: 1.56;
}

address {
	font-size: 1.6em;
	line-height: 1.56;
}

table {
	font-size: 1.6em;
	line-height: 1.56;
}



input.text, select, textarea {
	font-size: 1.6em;
	line-height: 1.56;

}

.checkbox:checked + label:after, .checkbox + label:before {
    top: 8px;
}


.field.sliding .switch {
    font-size: 9px;
}

#fieldset_inf_wtcInformControl_1_7_55 > div > div > label {
    font-size: 9px;
}

#fieldset_inf_wtcInformControl_1_7_55 > div > div > legend > p {
    font-size: 14px;
}

#fieldset_inf_wtcInformControl_10_29_84 > div > div > label > p {
    font-size: 16px !important;
}

#fieldset_inf_wtcInformControl_13_37_96 > div > div > label p {
   font-size: 16px !important; 
}



  @media print {
	h2 {
	  font-size: 100% !important;
	}
	table,
	table li,
	table p,
	p {
	  font-size: 10pt;
	  line-height: 1.2;
	}
	.address {
	  margin-right: 20px;
	}
	.payment {
	  margin-left: 0;
	}
	#wrapper {
	  max-width: 1220px;
	  margin-left: auto;
	  margin-right: auto;
	}
	label,
	input,
	textarea,
	select {
	  display: inline !important;
	}
	a:link:after,
	a:visited:after {
	  content: none !important;
	}
	.navigation-home,
	.icon.required {
	  display: none;
	}
	.mast {
	  margin-bottom: 80px !important;
	  padding: 17px 0;
	}
  
	.mast .sleeve div {
	  padding: 0 !important;
	}
  }


  @media only screen and (max-width: 767px) {
	#wrapper {
		 margin-top:0;
	  }
	  #wrapper:before {
		height: 88px;
	  }
	.mastheadLogo{
		justify-content: center;
	}
 
	.mastheadLogo #mobile-logo{
		display:block;
	}
	.mastheadLogo #brand-logo{
		display:none;
	}
	.mast{
		margin-bottom: 17px;
	}
	.mast::after {
		content: '';
		width: 100vw;
		height: 2px;
		background-color: transparent;
		position: absolute;
		left: 50%;
		right: 50%;
		margin-left: -50vw;
		margin-right: -50vw;
		bottom: 0px;
	  }
	.mast .sleeve a [class="desktop"] {
	  display: none;
	}
	.mast .sleeve a [class="mobile"] {
	  display: block;
	}

	.validation-advice {
		text-align:left;
		} 
		.footer .sleeve .subFooter-details{
			flex-direction:column;
		}
		.footer .sleeve .subFooter-details .paymentCards{
			margin-right:auto;
			margin-top: 0;
		}
	.footer li {
	  display: block;
	  border: 0 none; 
	  text-align:center; 
	} 
}

@media screen and (max-width: 995px){
	.order-summary-container table.hide{
		
		display: table;
		
	}
	#reflow-content-mobile h3:after {
		background-image: none;
	}
	
}

  @media screen and (min-width: 768px){
	#wrapper:before{
		background-position: top right -20em;
		background-size: unset;
	}
	.mastheadLogo .mastHybrid{
		max-width: 410px;
		margin-left: -26px;
		margin-top: 26px;
		line-height: 0;
	}
	.mastheadLogo .mastHybrid p.mastHybrid-text {
	  color: white;
	  font-size: 22px;
	  display:block;
	  line-height: 1.2;
  }
}
@media only screen and (min-width: 855px){
	.newProduct #wrapper .offerVariantSelectionForm .informInline.left .promotion.show div {
		justify-content: flex-end;
	}

}
@media screen and (min-width: 1024px){
	#wrapper:before{
		background-position: top right;
 
	}

}

.subscriptions .productDetails .date{
	display: none;	
}