/*
Theme Name: Hyrox
Author: MXR
Author URI: https://mxr.fi
Version: 1.0.0
Template: dt-the7
*/


/*-------------------------------------------------------------------------*/
/*	Info
/*-------------------------------------------------------------------------*/

/*
	Breakpoints:
	1300px content
	778px mobile

	Colors
	Blue: #0056b3
	Orange: #ff6a00
	Black: #121a22


*/


/*-------------------------------------------------------------------------*/
/*	Nav
/*-------------------------------------------------------------------------*/
/*
.main-nav > li > a .menu-text {
  font-family: "Oswald", sans-serif;
  text-transform: uppercase;
}
*/


/*-------------------------------------------------------------------------*/
/*	Hero
/*-------------------------------------------------------------------------*/
.hero .vc_column-inner {
	color: #fff !important;
	max-width: 90%;
	margin: 0 auto;
	padding-bottom: 35px;
}

.vc_row.vc_row-flex.hero > .vc_column_container {
	flex-direction: row;
}

.hero h2 {
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
	color: #fff !important;
	text-align: center !important;
	font-size: 26px !important;
	line-height: 1.2em!important;
}

.hero p {
	color: #fff !important;
	text-align: center !important;
	line-height: 1.2em!important;
}

.hero .vc_column-inner {
	background-color: rgba(0,0,0,0.5) !important;
}


@media only screen and (min-width: 600px) {
	.hero .vc_column-inner {
		max-width: 650px !important;
	}

	.hero h2 {
		font-size: 32px !important;
	}
}

@media only screen and (min-width: 778px) {
	.hero .vc_column-inner {
		max-width: 60%;
	}
}

@media only screen and (min-width: 1000px) {
	.hero .vc_column-inner {
		max-width: 50%;
	}
}

@media only screen and (min-width: 1300px) {
	.hero .vc_column-inner {
		max-width: 40%;
		margin: 0 5% 0 0;
		padding-left: 25px;
	}

	.vc_row.vc_row-flex.hero > .vc_column_container > .vc_column-inner {
		margin-left: auto;
	}

	.hero h2 {
		text-align: left !important;
		font-size: 45px !important;
	}

	.hero p {
		text-align: left !important;
		line-height: 1.5!important;
	}
}

@media only screen and (min-width: 2000px) {
	.hero .vc_column-inner {
		max-width: 30%;
		margin: 0 5% 0 0;
	}
}




/*-------------------------------------------------------------------------*/
/*	Content
/*-------------------------------------------------------------------------*/
body, h1, h2, h3, h4, h5, h6, p, li {
	color: #121a22;
}

.uvc-heading .uvc-main-heading h1,
h1 {
	line-height: 120% !important;
	margin-bottom: 25px;
}

#content {
	padding-bottom: 0px;
}	

#content p,
#content li {
	line-height: 1.75em;
}

h2 {
	margin: 30px 0 10px 0;
}

#content a {
	color: #0056b3 !important;
}

#content a.dt-btn {
	color: #fff !important;
}


.padding-top {
	padding-top: 50px;
}

.padding-top-more {
	padding-top: 75px;
}

.padding-bottom {
	padding-bottom: 50px;
}

.padding-bottom-more {
	padding-bottom: 75px;
}

.padding-both {
	padding-top: 50px;
	padding-bottom: 50px;
}

.padding-both-more {
	padding-top: 75px;
	padding-bottom: 75px;
}

.pt-color {
	background-color: rgba(18,26,34,0.03) !important;
}

.bg-top div {
	background-position: center top !important;
}

.default-btn-shortcode,
.wpcf7-submit,
.button-load-more  {
	font-weight: 600 !important;
	background: #5891e8 !important;
	text-transform: uppercase !important;
	font-size: 12px !important;
	letter-spacing: 2px !important;
	border-radius: 3px !important;
	min-width: 200px !important;
}

.default-btn-shortcode:hover,
.wpcf7-submit:hover,
.button-load-more:hover {
	background: #4586e8 !important;
	font-weight: 600 !important;
}

.paginator .button-load-more .button-caption::before {
	display: none !important;
}

.paginator .button-load-more .button-caption,
.paginator a * {
	text-transform: uppercase !important;
	font-size: 12px !important;
	letter-spacing: 2px !important;
	color: #fff !important;
}

.default-btn-shortcode:hover,
.wpcf7-submit:hover {
	background: #5891e8 !important;
}

p {
	margin-bottom: 20px !important;
}

@media only screen and (min-width: 782px) {
	#content h3,
	#content p {
		padding-right: 25px;
	}	
}

@media only screen and (min-width: 1300px) {
	h2 {
		margin: 40px 0 10px 0;
	}

	.padding-top {
		padding-top: 75px;
	}

	.padding-top-more {
		padding-top: 125px;
	}

	.padding-bottom {
		padding-bottom: 75px;
	}

	.padding-bottom-more {
		padding-bottom: 125px;
	}

	.padding-both {
		padding-top: 75px;
		padding-bottom: 75px;
	}

	.padding-both-more {
		padding-top: 125px;
		padding-bottom: 125px;
	}
}

@media only screen and (max-width: 778px) {
	h2 {
		text-align: left !important;
	}

	.h-center-mobile h2 {
		text-align: center !important;
	}

}



/*-------------------------------------------------------------------------*/
/*	Lajit
/*-------------------------------------------------------------------------*/
.timeline-header-block {
	background: #f8f8f8;
}

.timeline-header-block h3 {
	font-size: 20px !important;
}

.timeline-header-block h3,
.timeline-item-spt {
	color: #121a22;
}

.timeline-block .timeline-header-block .timeline-header, .timeline-feature-item .timeline-header-block .timeline-header {
  font-size: 1rem !important;
}

.timeline-wrapper .timeline-dot {
  width: 1px;
  height: 1px;
  background-color: #121a22 !important;
  border: 4px solid #fff;
  -webkit-border-radius: 500px;
  border-radius: 500px;
  position: absolute;
  top: 32px;
  display: block;
  padding: 3px;
}

.timeline-line span:first-child {
  content: "";
  width: 10px;
  height: 10px;
  -webkit-border-radius: 100%;
  border-radius: 100%;
  background-color: #121a22 !important;
  position: absolute;
  left: -4px;
}

.timeline-line span:last-child {
  content: "";
  width: 10px;
  height: 10px;
  -webkit-border-radius: 100%;
  border-radius: 100%;
  background-color: #121a22 !important;
  position: absolute;
  bottom: 0;
  left: -4px;
}



/*-------------------------------------------------------------------------*/
/*	FAQ
/*-------------------------------------------------------------------------*/
#content .ea-header a {
	color: #121a22 !important; 
}


/*-------------------------------------------------------------------------*/
/*	Footer
/*-------------------------------------------------------------------------*/
#footer.solid-bg {
  background-color: #121a22;
}

.grecaptcha-badge {
	visibility: hidden !important;
}

footer .logo {
	margin-top: 5px;
}

footer .copy, .copy a {
	color: #626368 !important;
}

footer .copy a:hover {
	color: #fff !important;
}

@media screen and (max-width: 990px) {
	#bottom-bar .wf-container-bottom {
		justify-content: flex-start !important;
		align-items: normal !important;
	}
}

@media only screen and (min-width: 1300px) {
	footer h2 {
		margin: 10px 0 10px 0;
	}


/*-------------------------------------------------------------------------*/
/*	Fixes
/*-------------------------------------------------------------------------*/
/* iPhone hero fixed background not working */
@supports (-webkit-touch-callout: none) {
	@media screen and (max-width: 990px) {
		.hero .upb_row_bg {
			background-attachment: scroll !important; 
		}
	}
}