/* main #f40*/
*{list-style-type: none; text-decoration: none; margin: 0; padding: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
:root {
  --main_color: #de2000;
  --hont: 'Roboto', sans-serif;
}
.the_color{
	color: $fff;
	background: red;
	background: var(--main_color);
}

img, a img , a img:visited, a img:hover{display: block; border: 0;image-orientation: from-image;max-width: 100%;}
body {font:normal 1rem/1.5rem Verdana, sans-serif; color: #000; background: #eee;}
p, h2 {text-align: left; clear: both;}
a, a:visited{font-size: 1em; color: #0055aa;}
a:hover {font-size: 1em;}
.black_url , .black_url:visited, .black_url:hover{color: #000;}

h1, h2, h3, h4, h5, h6{display: inline-block; font-family: var(--hont); line-height: 100%; font-weight: bold; color: #333;}
h1 {
	font-size: 3rem;
	text-align: center;
	z-index: 999;
	display: block;
}
h2 {
	font-size: 2.5rem;
	margin: 40px 10px 10px 10px;
	text-align: center;
}
h3 {
	font-size: 2rem;
	margin: 15px 0 7px 0;
}
h4 {
	font:normal 40px Verdana, sans-serif;
	margin: 20px;
	text-align: center;
}
h5{
	font-size: 1.5rem;
	margin: 10px 0 10px 0;
}
h6{
	font-size: 1.2rem;
	margin: 10px 0 10px 0;
}
.hont{
	font-family: var(--hont);
	font-weight: 700;
	font-size: 2rem;
	color: #333;
	line-height: 120%;
}
.mono{
	max-width:800px;
	margin: 0 auto;
	padding: 3rem 5%;
}
.mono img{
	width: 100%;
	height: auto;
	max-width:800px;
}

/* constants */
.mar{margin: 10px;}
.pad{padding: max(4vw, 10px);}
.pre{white-space: pre-wrap;}
.mont{font-family: var(--hont);line-height: 120%;}
b, .bold{font-weight: bold;}
.round5{
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
.capsule{border-radius: 100000000000000px;}
.txt_right{text-align:right;}
.t_center{text-align:center;}
.t_min{font-size: 0.75em;line-height: 1.2em;}
.text_hont{font-size:1rem;font-family: var(--hont); line-height: 150%; font-weight: normal;}
section{position: relative;}
/*icons*/
.ic12{fill:none;stroke:#000000;stroke-width:20;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}

/*flex grid*/
.grid{
	--min: max(19vw, 120px);
	--gap: max(10px, 4vw);
	display: grid;
    grid-template-columns: repeat(auto-fit, minmax(var(--min), 1fr));
	grid-gap: var(--gap);
	margin: var(--gap);
	grid-auto-flow: row dense;
}
.grid2-1, .grid1-1{display: grid; grid-template-columns: 1fr; --gap: 0; grid-gap: var(--gap); margin: var(--gap);grid-auto-flow: row dense;}

@media (min-width: 960px) {
	.grid2-1{grid-template-columns: 2fr 1fr;}
	.grid1-1{grid-template-columns: 1fr 1fr;}
	.grid-flip-1{grid-column: 2;}
	.grid-flip-2{grid-column: 1 / 2;}
}

.flex{display: flex;flex-direction: row;flex-wrap: wrap;justify-content: center;align-items: stretch;align-content: stretch;}
.flexy{display: flex;flex-direction: row;flex-wrap: wrap;}
.flex_between{display: flex;flex-direction: row;flex-wrap: wrap;justify-content: space-between;align-items: center;align-content: center;}
.bg_contain{
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center top;
}
.bg_cover{
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center top;
}
.white{
	color: #fff;
}
.fw{width: 100%; height: auto;}
iframe{
	width: 100%;
	height: 450px;
}
.side{
	background: #fff;
	padding: 0 max(2vw, 10px);
	min-height: 100vh;
}

.btn, .btn:hover, .btn:visited{
	display:inline-block;
	padding:0 max(3vw, 14px);
	border: 0;
	border-radius: 10000px;
	color: #fff;
	background: var(--main_color);
	text-transform: uppercase;
	font-size: 1rem;
	font-weight: normal;
	line-height: 50px;
	height: 50px;
	cursor: pointer;
	text-align: center;
}
.btn_block{
	text-align: center;
	display: block;
	position: relative;
	margin: -100px 0 0 0;
	height: 100px;
	z-index: 999;
}
video{display: block;pointer-events: none;}

#head{
	padding: 70px 5% 15px 5%;
}
#headimg{
	width: 100%;
	overflow: hidden;
	background: #333;
}
#headimg img{
	width: 100%;
}

/* full img */
.img_cover{object-fit: cover;width: 100%;height: 100%;}
.img_bg_title{
	position: absolute;
	top: 90%;
	left: 0;
	transform: translate(10%, -100%);
	color: #fff;
	font-family: var(--hont);
	font-size: 8vw;
	line-height: 100%;
	font-weight: bold;
}

.img_top {
	position: absolute;
	width: 100%;
	height: 100vh;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	align-content: stretch;
}

/* menu */
#fixnav{
	position: relative;
	top:0;
	left:0;
	width: 100%;
	display: block;
	z-index: 1000;
}

#menu_top{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	align-content: center;
}
#logo svg{
	display: block;
	height: 6vw;
	width: auto;
	max-height: 30px;
	padding: 0 10px 0 3vw;
}
#menu_shop{
	font-size: 12px;
	line-height: 12px;
	color: #fff;
	padding: 5px 10px 5px 10px;
	text-transform: uppercase;
}
#menu_fix{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	align-content: center;
}
#menu_main{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-end;
	align-items: center;
	align-content: stretch;
	padding: 20px 0;
}
.menu_item, .menu_item:visited{
	display: none;
	color: #333;
	padding: 0 10px;
	margin: 0 6px;
}
.menu_item:hover{
	color: red;
	color: var(--main_color);
}
#menu_cart{
	position: relative;
	margin: 0 10px;
}
#cart_svg{
	width: 20px;
	height: auto;
	margin: 5px 0 0 0;
}
#cart_item_count{
	position: absolute;
	top: 0;
	left: 70%;
	background: var(--main_color);
	color: #fff;
	font-size: 0.5rem;
	line-height: 16px;
	width: 16px;
	text-align: center;
	border-radius: 8px;
}
#flag{
	padding: 8px max(3vw, 10px) 8px 15px;
	cursor: pointer;
}
#flag_icon{
	width: 30px; 
	height: 30px;
	border: 1px solid #666;
	border-radius: 15px;
}

/* menu lang */
#menu_world{
	display: none;
	background: #eee;
	border-bottom: 1px solid #ccc;
}
#langform{
	padding: 50px 10px 80px 10px;
	text-align: center;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-end;
	align-content: stretch;
}
#langform select, #langform input{
	width: 300px;
	margin: 10px 8px;
	min-width: 300px;
}

/* menu mobile */
#menu_mobile_x{
	padding: 8px 20px 8px 8px;
	display: flex;
}
#menu_mobile_x svg{
	width: 20px;
	height: 20px;
	cursor: pointer;
}
#menu_mobile{
	background: #000;
	padding: 15px;
	display: none;
}
.menu_mobile_item, .menu_mobile_item:visited{
	display: block;
	color: #fff;
	padding: 6px 8px;
}
.menu_mobile_item:hover{
	color: red;
	color: var(--main_color);
}
#page{
	position: relative;
}
@media only screen and (min-width: 768px) {
	#menu{position: absolute;}
	#fixnav{position: fixed;}
	#menu_right{padding: 20px 0;}
	#menu_mobile_x{display: none;}
	.menu_item{display: block;}
	#page{
		margin-top: 20px;
	}
}

/* content */
.txt_block{
	max-width: 800px;
	padding: 20px;
	white-space: pre-wrap;
	background: #fff;
}
.content{white-space: pre-wrap;}
.content img{width: 100%;height: auto;}
.full{
	position: relative;
	overflow: hidden;
}
.full img{
	width: 100%;
	height: auto;
}

/* form */
.cfs{
	position: relative;
}
.inputs{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: stretch;
	align-content: stretch;
}
.cfs textarea, .cfs input, .cfs select, .cfs option, .cfs button{
	font-family: inherit;
	font-size: 100%;
	margin: 0 0 10px 0;
	border: 1px solid #ccc;
	padding: 0 15px;
	width: 100%;
	border-radius: 25px;
	-webkit-appearance: none;
	-moz-appearance: none;
}
.cfs input, .cfs select, .cfs option, .cfs button {
	height: 50px;
}
.cfs input:focus, .cfs textarea:focus{
	outline: none;
	border-color: green;
}

.cfs textarea {
	padding: 12px;
}
.cfs select, .cfs option{
	background: #fff url("https://halfbikes.com/images/dropdown.png") no-repeat right top;
	color: #000;
}
.cfs input[type="submit"]{
	border: 0;
	padding: 0;
	font-size: 1.1rem;
	height: 49px;
}
.cfs input[type="file"]{
	height: 50px;
	padding: 12px;
	background: #fff;
	cursor: pointer;
	height: 100%;
}
.cfs input[type="checkbox"]{
	-webkit-appearance: checkbox;
	-moz-appearance: checkbox;
	height: 1rem;
	width: 1rem;
}
.cfs label{
	display: block;
}
.cfs  .half_input, .cfs .half_select, .cfs .half_select option{
	width: 49.5%;
}
.cfs input[type=radio]{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	display: inline-block;
	position: relative;
	color: #666;
	height: 20px;
	width: 20px;
	border-radius: 40px;  
	margin: 0;
	padding: 0;
	background: #fff;
	border: 1px solid #333;
}
.cfs input[type=radio]:checked::before
{
	position: absolute;
	font-size: 20px;
	line-height: 20px;
	left: 3.5px;
	top: -3.5px;
	content: '\25CF';
}
.cfs .input_err{
	outline: none;
	border-color: red;
}
#errors{
	color: #f30;
}

.grecaptcha-badge{
	display:none;
}

/* community menu */
#community_menu{
	margin: 70px 0 30px 0;
	text-align: center;
}

#community_menu a{
	color: #333;
	margin: 0 10px;
	font-size: .9rem;
}
#community_menu_focus{
	opacity: .3;
}

#community_menu i{
	font-size: 1.8rem;
}

/* benefits */
.benefit{
	text-align: center;
	padding: 40px;
}
.benefit img{
	width: 70px;
	height: auto;
}
.benefit_title{
	padding: 15px 0;
}

/* footer */
#footer{
	position: relative;
	background: #333;
	font-family: var(--hont);
	color: #fff;
	padding-top: 3vw;
}
#top_btn{
	position: absolute;
	top: 0;
	right: 0;
}
#footer_nav{
	display: grid; 
	grid-template-columns: 1fr 1fr;
	max-width: 800px;
	margin: 20px auto;
}
.foot_blk_holder{
	margin: 20px auto;
}
.foot_blk{
	display: inline-block;
}
@media (min-width: 960px) {
	#footer_nav{grid-template-columns: 1fr 1fr 1fr 1fr;}
}
#footer_nav a, #footer_nav a:visited{
	color: #fff;
	display: block;
}
#footer_nav a:hover{
	color: #ccc;
}

#footer i{
	font-size: 1.8rem;
}
#stripe_news{
	z-index: 10000;
}
#social a svg{
	display: block;
	width: 30px;
	height: 30px;
	margin-right:10px;
	fill: #999;
}
#social a svg:hover{
	fill: var(--main_color);
}
#social{
	margin: 30px 0;
}

#newsform {
	position: relative;
	display: block;
	width: min(500px, 95vw);
	margin: 0 auto;
	font-size: min(1rem, 4vw);
	
}
#news_input{
	background: #eee;
	border-width: 2px;
	border-color: #fff;
}
#news_input:focus{
	background: #fff;
	border-color: green;
}
#news_submit{
	position: absolute;
	top: 0;
	left: 70%;
	width: 30%;
	height: 50px;
	line-height: 50px;
	padding: 0;
	font-size: min(1rem, 4vw);
}



#footext{
	font-size: .9rem;
	color: #999;
	text-align: center;
	padding: 12px;
}
#footext a{
	font-size: .9rem;
	color: #999;
	text-decoration: underline;
}

@keyframes more {
	0%   {top:-3rem;}
	65%  {top:-2.5rem;}
	75%  {top:-3rem;}
	85%  {top:-2.8rem;}
	100% {top:-3rem;}
}

.more {
	position:relative;
	text-align:center;
	height:0;
	font-size: 2rem;
	color: #333;
	top:-3rem;
	animation: more 2s infinite;
}

.off{position: relative;display: inline-block;color: #999;}
.off::before {content: '';width: 110%;
    position: absolute;
    right: -5%;
    top: 50%;
    border-bottom: 2px solid #f40;
}

@media (max-width: 1025px) {
	#head{
		padding: 15px 5% 15px 5%;
	}
	h4 {font:normal 20px Verdana, sans-serif;margin: 20px 0 10px 0;}
	
	.cfs textarea, .cfs input, .cfs select, .cfs option, .cfs button {
		display: inline-block;
	}
	.cfs input[type="submit"]{
		width: 100%;
		margin: 0;
	}
	.cfs  .half_input, .cfs .half_select, .cfs .half_select option{
		width: 100%;
	}
	.cfn input[type="submit"]{
		width: 100%;
		margin: 0;
	}
	.cfn  .half_input, .cfn .half_select, .cfn .half_select option{
		width: 100%;
	}
}


/* popnews */
#popnews {
	position: fixed;
	top: 100%;
	left: 0;
	width: 100%;
	height: 300px;
	background:#eee;
	z-index: 100000;
	text-align: center;
	border-top: 1px solid #000;
}
#popnewstxt {
	padding: 25px 120px;
}
#popnews input{
	font-size: 16px;
}
#close{
	position: absolute;
	top: 15px;
	left: 100%;
	margin: 0 0 0 -55px;
	cursor: pointer;
}

/* cookies */
#pop_cookies {
	position: fixed;
	bottom: 0;
	left: 0;
	background: #fff;
	z-index: 1000000;
	border-top: 1px solid #999;
	width: 100%;
}
#pop_cookies_block{
	--gap: max(10px, 2vw);
}
#pop_cookies_txt{
	font-size: 14px;
	line-height: 18px;
}
#pop_cookies_btns{
	text-align: center;
}
#pop_cookies_btns .btn{
	padding:0 20px;
	font:normal .9rem/40px Verdana, sans-serif;
	height: 40px;
}
#c_no{
	background: #eee;
	color: #666;
}
/* loader */
#loader{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	opacity: .3;
	z-index: 1000000;
	cursor:wait;
	display: none;
}