style.css

/*
* Theme Name: Biocentaur
* Theme URI: https://olopso.co.uk
* Author: Tom Brooks
* Author URI: https://olopso.co.uk
* Description: WordPress Theme for Biocentaur
* Version: 1.5.1
*/

/*********************** MW IMPROVEMENTS ***********************/
.anchor-link {
    display: block;
    position: relative;
    top: -200px;
    visibility: hidden;
}
.woofc-area .woofc-area-mid .woofc-undo .woofc-undo-inner, .woofc-area .woofc-area-mid .woofc-undo .woofc-undo-inner a {
    color: #00365f;
}

/* search results */
.search-results h1 span {
    background: #e6eaef;
    padding: 0px 10px;
}

@media (min-width: 768px) {
	.single-faq section.hero.service .background, .single-faq section.hero.single .background {
		padding: 0;
	}
}

/* remove mobile CSS opacity transitions */
.accordionItemContent p a {
	color: #00365F;
	text-decoration: underline;
	text-decoration-color: #EF928E;
}
footer .end_links a, footer .end_links strong, footer .end_links span.registered {
	padding: 5px 10px;
}
footer .end_links span.dpo a {
	padding: 5px 0px;
}
.footer_block {
	margin: 10px 0;
}

/* Forms */
.payment_method_stripe img {
	display: initial;
}
section .nf-form-layout form select, section .nf-form-layout form input, section .nf-form-layout form textarea, section .woocommerce form select, section .woocommerce form input, section .woocommerce form textarea, .wc-stripe-elements-field, .wc-stripe-iban-element-field, .nf-form-content .list-select-wrap .nf-field-element>div, .nf-form-content input:not([type=button]), .nf-form-content textarea {
	padding: 15px;
	-webkit-border-radius: 5px !important;
	-moz-border-radius: 5px !important;
	-ms-border-radius: 5px !important;
	border-radius: 5px !important;
	border: 1px solid #adbac8 !important;
	background: transparent !important;
	box-shadow: none !important;
	color: #00365F !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
	padding: 10px;
	border: 0px solid #adbac8 !important;
	color: #00365F !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 25px;
}
.nf-form-content button, .nf-form-content input[type=button], .nf-form-content input[type=submit] {
	background: #00365F !important;
	color: #ffffff !important;
	border: 0px solid #ffffff !important; 
}
section .nf-form-layout form select:focus, section .nf-form-layout form input:focus, section .nf-form-layout form textarea:focus, section .woocommerce form select:focus, section .woocommerce form input:focus, section .woocommerce form textarea:focus, .wc-stripe-elements-field:focus, .wc-stripe-iban-element-field:focus {
	border: 1px solid #00365F !important;
	outline: 1px solid #00365F !important;
}
.select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option--highlighted[data-selected] {
	background-color: #00365F;
}
label abbr[title] {
	text-decoration: none;
}

p.mailchimp-newsletter {
  margin-top: 20px;
}

#customer_details .col-1 input.input-checkbox {
  width: auto;
  display: inline-block;
}
label[for=payment_method_stripe] {
    display: inline-block !important;
}
input[type="radio"] {
    display: inline-block !important;
    width: auto !important;
}
ul.woocommerce-PaymentMethods.payment_methods.methods li {
    list-style: none;
}
.woocommerce-form-login input {
    width: 100%;
}
.woocommerce-form-login-toggle {
    background: #f6f8fc;
    padding: 20px;
    margin: 0 0 40px 0;
    border: 1px solid #00365f;
    border-radius: 10px;
    font-weight: 600;
    color: #00365f;
}
input#rememberme {
    width: auto;
}


/* Mobile 768px */
@media screen and (max-width: 47.9375rem) {	
	/* Spacing, padding + margins */
	.our_tests + .footer_faq .container {
	    padding: 20px 20px 40px 20px;
	}
	.fixed_header + .health_conditions {
    	margin-top: 20px;
	}
	.footer_faq .accordionItem .title, .faq_page .accordionItem .title {
  	  	padding-right: 20px;
	}
	.home_help, .health_conditions {
		padding: 40px 0;
	}
	.home.hero .float {
    	padding: 40px 10px;
	}
	.home_cta .cta__block .content, .footer_faq .accordionItem, .faq_page .accordionItem {
    	padding: 20px;
	}
	.health_conditions .block__title {
	    padding: 20px 0;
	}
	footer .end_links a, footer .end_links strong, footer .end_links span.registered {
    	padding: 5px 5px;
	}
	footer .about svg#Layer_1 {
		margin: 0px auto 20px auto;
		margin-left: calc(50% + -5%);
		transform: translateX(-50%);
	}
	section h1, section.hero .content h1 {
		margin-bottom: 1em;
	}
	.footer_faq .filter {
   		padding-bottom: 10px;
	}
	.health_conditions .block__title h3, section h3, .faq_page .filter h1 {
		margin-bottom: 20px;
	}
	
	/* Typography */
	.block__conditions article .title, .health_conditions .block__title p, .home_info p, .condition .content p:first-of-type, .faq_page .filter p {
	    font: 400 1.8rem/2.8rem "Dosis", Helvetica, Arial, sans-serif !important;
	}
	section.hero .content h1, .home_info h3 {
	    font: 600 2.2rem/3rem "Dosis", Helvetica, Arial, sans-serif;
	}
	.page-template-news section.hero .content h1, .illustration_steps .step .step_text h2 {
	    font: 600 2.8rem/3.4rem "Dosis", Helvetica, Arial, sans-serif;
	}
	.test_cta .container {
		text-align: center;
		font: 400 2.2rem/3rem "Dosis", Helvetica, Arial, sans-serif;
	}
	footer .end_links {
    	font: 400 1.4rem/2.4rem "Dosis", Helvetica, Arial, sans-serif;
	}
	section.post.individual_tests p:first-of-type, .single_test .container.flex p:first-of-type {
		font: 400 1.8rem/2.8rem Dosis,Helvetica,Arial,sans-serif !important;
	}
	
	/* UI */
	.declaration .next_button svg {
		width: 60px;
	}
	.declaration .next_button {
	    padding: 30px;
    	background-position: right 30px top 40px;
	}
	.test_navigation ul li {
	    padding: 0px;
	}
	.test_navigation ul li:after {
    	padding: 0px 2px;
	}
	.test_navigation ul li {
		margin-left: 4px;
	}
	.fixed_header {
		-webkit-box-shadow: 0 0px 30px -10px #00365F;
		box-shadow: 0 0px 30px -10px #00365F;
	}
	td.product-subtotal, th.product-subtotal {
    	display: none;
	}
	footer .about ul.social-icons li svg {
		width: 60px;
	}
	.condition aside svg {
		max-width: 22.5%;
    	margin-bottom: -65px;
	}
	.condition .breadcrumbs {
		padding-left: 32.5%;
		margin-bottom: 15vw;
	}
	#archive-faq-search, #footer-faq-search {
		width: 85%;
	}
	
	/* Mobile main nav */
	nav.mobile ul li.menu-item-has-children a {
    	margin-right: 0;
	}
	nav.mobile ul li ul.sub-menu {
		margin: 0;
	}
	nav.mobile ul li ul.sub-menu li {
    	padding-left: 0;
	}
	nav.mobile ul li ul.sub-menu li a {
    	padding-left: 10px;
	}
	nav.mobile ul li ul.sub-menu li ul.sub-menu a {
    	padding-left: 20px;
	}
	nav.mobile [aria-current="page"] {
		background: #e1e1ff !important;
	}	
}


/* iPhone 5/SE */
@media screen and (max-width: 20rem) {	
	/* Typography */
	.home_cta .cta__block .content p, .footer_faq .accordionItem .title, .faq_page .accordionItem .title {
		font: 400 1.8rem/2.8rem "Dosis", Helvetica, Arial, sans-serif;
	}
	section h1, .our_tests .test_intro h2, .faq_page .filter h1, .about_bio .content h4 {
		font: 600 2.8rem/3.4rem "Dosis", Helvetica, Arial, sans-serif;
	}
	
	/* Spacing, padding + margins */
	.button {
	    padding: 15px 60px 15px 20px;
	}
	.footer_faq .filter h2 {
    	padding: 0 20px;
	}
}