/*
Theme Name: Racing Emotion Theme
Author: Karolis Dailidonis
Author URI: http://karolisdailidonis.de
Version: 1.0.0
*/
@import url(https://fonts.googleapis.com/css?family=Roboto);
*{
  font-family:Roboto, sans-serif;
  letter-spacing: .6px;
	line-height: 25px;
}
.white{background-color: #fff; color:#000}
.black{background-color: #090909; color:#fff}
.blue{background-color: #2168d5; color:#fff}

body{
  margin: 0;
  width: 100%;
  /* min-height: 100vh; */
  background-color: #0a0a0a;
  overflow-x: hidden;
}
.info-box p{
	background-color: #2168d5;
  color: #fff;
	margin-top: 0;
	padding: 10px;
}
.box {
	border: thin solid #d3d3d366;
	-webkit-box-shadow: 0 2px 10px 0 rgba(0,0,0,.12);
	box-shadow: 0 2px 10px 0 rgba(0,0,0,.12);
	background-color: #fff;
}
section h2{margin-top:0;}
.slogan {
	display: inline-block;
	position: absolute;
	top: 12%;
	width: 95%;
  max-width: 885px;
	background-size: cover;
}
#landing{
  height: 100vh;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  background-position: left;
}
#car{
  background-color: #fff;
  color: #000;
  position: relative;
  height: 450px;
}
#car .content{
  display: flex;
  justify-content: flex-end;
  flex-flow: row;
  z-index: 2;
  height: 100%;
}
#car img{
  width: 50%;
  height: 100%;
  filter: grayscale(100);
  object-fit: cover;
  object-position: bottom;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
#car .text{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-flow: column;
  margin: 0 20px;
  width: 40%;
}
#car .text p:last-child{
  display: flex;
  flex-flow: row wrap;
}
#car .text span {
	background-color: #2168d5;
	color: #fff;
	padding: 10px;
	box-sizing: border-box;
	margin: 10px;
	display: inline;
}
#sponsors{
  background-color: #fff;
  height: auto;
}
#car h2,
#sponsors h2 {
	background-color: #2168d5;
	color: #fff;
	width: auto;
	display: inline-block;
	padding: 10px 30px;
  position: absolute;
  z-index: 2;
}
.sponsors-content{
  display: flex;
  justify-content: center;
  padding-bottom: 5%;
  padding-top: 75px;
}
.sponsors-item {
	display: flex;
	width: 33%;
  height: 100px;
	justify-content: center;
	align-items: center;
}
#sponsors .sponsors-item div {
	width: 100%;
	height: 100%;
	background-size: contain !important;
	background-repeat: no-repeat !important;
	background-position: center !important;
}
#topics{
  display: flex;
  flex-flow: row wrap;
}
.topic-child {
	position: relative;
	width: 25%;
	display: flex;
	justify-content: center;
	align-items: center;
}
.topic-child:before {
content: "";
display:block;
padding-top: 70%;
}
.topic-child.thumb {
	background-size: cover;
	filter: grayscale(100);
}
.topic-child.thumb:hover {
	filter: grayscale(0);
}
.topic-child p {
	padding: 0;
	margin: 0 8%;
	font-size: 1.5em;
	text-align: left;
}
.topic-child p a{
  color: #fff;
  text-decoration: none;
}
.topic-child:hover p a{
  text-decoration: underline;
}
article {
	display: flex;
	flex-flow: column;
	justify-content: flex-start;
	align-items: center;
  margin-top: 60px;
  background-size: cover;
  background-position: center;
  min-height: 100vh;
}
#calender .row {
	color: #fff;
	display: flex;
	width: 70%;
  max-width: 750px;
	margin: 5px 0;
	height: 50px;
	align-items: center;
  background-color: #3666ce;
}
#calender .info{
  background-color:  #fff;
  color: #000;
  width: 70%;
  max-width: 750px;
}
#calender .info p{ padding: 0 25px;}
#calender .date {
	width: 18%;
	text-align: right;
  margin-left: 5px;
}
#calender .space {
	margin: 0 1%;
  color: #2168d5;
}
#calender .description {
	width: 66%;
}

.btn-primary{
  background-color: #3666ce;
  color: #fff;
  text-decoration: none;
  padding: 5px 10px;
  border: unset;
}
.btn-primary:hover{
  background-color: #fff;
  color: #3666ce;
}

.btn-buy {
	height: 100%;
	width: 15%;
	border: none;
	background-color: #fff;
	border-radius: 0px 10px 10px 45px;
  cursor: pointer;
}
.btn-buy:hover {
  background-color: #2168d5;
  color: #fff;
}
#calender .row:hover {
  border-color: #2168d5;
}
#contact{
  justify-content: center;
}
#contact .content{
  background-color: #fff;
  width: 60%;
  max-width: 500px;
  display: flex;
  flex-flow: column;
  align-items: center;
}
#contact .content div{
  width: 70%;
}
#popup .header,
#contact .content .text{
  width: 100%;
  color: #fff;
  background-color: #2168d5;
  display: flex;
  flex-flow: column;
  align-items: center;
}
#contact .content .text p{
  width: 70%;
}
#contact .logo{
  height: 40px;
}
#contact form,
#calender form{ text-align: center;}
#contact form label{ color: #fff;}

#contact form input,
#contact form textarea,
#calender form input,
#calender form select,
#calender form textarea{
	width: 96%;
	margin: 0;
	padding: 6px 2%;
	border: 0;
	font-size: 0.9em;
}
#contact form textarea{ border:thin solid #000;}
#contact form input,
#calender form input{border-bottom: thin solid #000;}

#contact form input[type="submit"],
#calender form input[type="submit"] {
	width: 30%;
	background-color: unset;
  cursor: pointer;
}
#contact form input[type="submit"],
#calender form input[type="submit"] {
	color: #000;
	border: thin solid #000;
}
#contact form input[type="submit"]:hover,
#calender form input[type="submit"]:hover{
  border-color: #2168d5;
  background-color: #2168d5;
  color: #fff;
}
#blog{
  flex-flow: row wrap;
  align-items: flex-start;
  padding: 0 5%;
  align-content: baseline;
}
#more{
  display: flex;
  justify-content: flex-start;
  flex-flow: row wrap;
  align-items: flex-start;
  width: 60rem;
}
#blog .post,
#more .post {
  background-size: cover;
  background-position: center;
	display: flex;
  flex-flow: column;
  justify-content: end;
	flex: 1 0 30%;
	max-height: 400px;
  position: relative;
  margin-top: 20px;
  margin-right: 1%;
  margin-left: 1%;
  height: 400px;
  text-decoration: none;
}

#more .post {
  flex: 1 0 45%;
}
#blog .thumb,
#more .thumb
{
	width: 100%;
  height: 100%;
	margin: 0;
	padding: 0;
	border: none;
  position: absolute;
  z-index: 0;
}
#blog .thumb img,
#more .thumb img
 {
	width: 100%;
	height: 100%;
	object-fit: cover;
  filter: grayscale(100);
}
#blog .post:hover .thumb img,
#more .post:hover .thumb img
{
  filter: grayscale(0);
}
#blog .info,
#more .info
{
  display: flex;
  flex-flow: column;
  z-index: 1;
  align-items: center;
  margin-bottom: 10px;
}
#blog .info p,
#more .info p {
    margin: 0;
    width: 90%;
    display: inline;
    padding: .25em;
    background: #fff;
    color: #000;
    box-shadow: 0.0em 0 0 #fff, -0.0em 0 0 #fff;
    font-size: 0.9em;
    line-height: 1.9em;
    text-transform: uppercase;
    letter-spacing: .06em;
    overflow: hidden;
    height: 75px;
    text-overflow: ellipsis;
}
#blog .info a,
#more .info a
 {
	margin: 10px 10px;
	position: absolute;
	bottom: 0;
	background-color: #fff;
	color: #2168d5;
	align-self: flex-start;
}
#blog h2,
#more h2
 {
	background-color: #2168d5;
	color: #fff;
	padding: 0 3px;
	text-transform: uppercase;
	align-self: flex-start;
	margin-left: 10px;
  width: 92%;
}
#about{align-items: flex-start;}
#about .content-row-rev,
#about .content-row{
  display: flex;
  background-color: #fff;
  color: #000;
  position: relative;
  width: 100%;
  height: 500px;
}
#about .content-row-rev{
  flex-flow: row-reverse;
  background-color: #2168d5;
}
#about .content{
	margin: 0;
	position: absolute;
	width: 50%;
	top: 10%;
	left: 45%;
	padding: 10px;
	height: 50%;
	font-size: 1.5em;
  z-index: 2;
}
#about .content-rev {
	margin: 0;
	position: absolute;
	width: 50%;
	top: 10%;
	right: 45%;
	padding: 10px;
	height: 50%;
	font-size: 1.5em;
  z-index: 2;
}
#about .content p,
#about .content-rev p {
	display: inline;
	padding: .25em 0;
	background: #2168d5;
	color: #ffffff;
	box-shadow: 0.0em 0 0 #2168d5, -0.0em 0 0 #2168d5;
	font-size: 0.9em;
	line-height: 1.78em;
	text-transform: uppercase;
	letter-spacing: .06em;
}
#about .content-rev p {
	background: #ffffff;
	color: #2168d5;
	box-shadow: 0.0em 0 0 #ffffff, -0.0em 0 0 #ffffff;
  text-align: right;
}
#post .content {
	background-color: #fff;
	width: 90%;
	max-width: 60rem;
	min-height: 500px;
	display: flex;
	flex-flow: column;
  border-bottom: 25px solid #2168d5;
}
#post .content .header{
  background-color: #2168d5;
  color: #fff;
}
#post h1 {padding: 30px 10px;	margin: 0; text-align: center;}
#post .content h2,
#post .content h3,
#post .content h4,
#post .content p {
	padding: 0 15%;
  /* text-align: justify; */
}
#post .content blockquote p {
	border-left: solid;
	padding-left: 2%;
	margin-left: 15%;
  text-align: left;
}
#post .content h3,
#post .content h4{
  margin-bottom: 0;
}
#post .has-text-align-right {
	text-align: right !important;
}
/* #post .wp-block-media-text .wp-block-media-text__media{height: 100%;} */
#post .wp-block-media-text .wp-block-media-text__media img {
	height: 100%;
  max-height: 400px;
	object-fit: cover;
	filter: grayscale(100);
	object-position: right;
}
#post .wp-block-media-text__content {
	/* height: 100%; */
}
#post .wp-block-media-text .wp-block-media-text__content{
  padding: 0;
  align-self: flex-start;
}
#post .wp-block-media-text .wp-block-media-text__content p:first-child{margin-top: 0;}
#post .wp-block-media-text .wp-block-media-text__content p:last-child{margin-bottom: 0;}
#post .wp-block-media-text{
  grid-template-columns: 45% auto !important;
  margin-top: 16px;
}
#post .wp-block-media-text .wp-block-media-text__content p {padding-left: 15px; padding-right: 27%;}
#post .wp-block-media-text.has-media-on-the-right {
	-ms-grid-columns: 1fr 45%;
	grid-template-columns: 1fr 45% !important;
}
#post .wp-block-media-text.has-media-on-the-right p {padding-left: 27%; padding-right: 15px;}
.profile-img {
  filter: grayscale(100);
	width: 65%;
	background-size: cover;
	object-fit: cover;
  z-index: 1;
}
#popup {
	width: 60%;
  max-width: 500px;
	height: 500px;
	background-color: #fff;
	position: absolute;
	top: 15%;
  display: none;
  flex-flow: column;
  align-items: center;
}
.pop-close {
	width: 30px;
	height: 30px;
	background-size: cover;
  cursor: pointer;
  align-self: flex-end;
  margin: 5px;
}
.pop-info,
.pop-content {
	width: 70%;
}
footer{
  display: flex;
  flex-flow: column;
  justify-content: space-around;
  align-items: flex-start;
  color: #fff;
  height: auto;
}
footer .row{
  display: flex;
  justify-content: space-around;
  width: 100%;
}
footer .row:last-child .item{
  justify-content: center;
  align-items: center;
  padding: 20px 0;
}
footer .item {
	display: flex;
	flex-flow: column wrap;
}
footer .item-rev{
  display: flex;
  flex-flow: row;
}
#menu-footer {
	list-style: none;
	padding: 0;
  margin: 0;
}
footer h3{
  font-size: 15px;
  margin-bottom: 8px;
}
footer a,
footer span{
  margin: 0;
  color: #fff;
  text-decoration: none;
  font-size: 12px;
}
footer .logo{
  height: 20px !important;
  margin: 0 3px;
}
footer a:hover{text-decoration: underline;}

.wp-block-embed-youtube{
  text-align: center;
	padding: 0 15%;
	margin: 0;
}

.wp-block-embed-youtube .wp-block-embed__wrapper {
	width: 100%;
	height: 0;
	padding-top: 52%;
	position: relative;
}
.wp-block-embed__wrapper iframe {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.woocommerce-order,
.wc-block-checkout,
.wc-block-cart,
.woocommerce .products ul,
.woocommerce ul.products
 {
  margin: 0 15px !important; 
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
  display: flex;
  flex-flow: column;
  justify-content: center;
}

.woocommerce ul.products li.product .price {
  text-align: center;
}

.woocommerce-loop-product__title {
  text-align: center !important;
}

.woocommerce div.product form.cart {
  display: flex;
  align-items: center;
}


div.product .woocommerce-tabs{
  margin-top: 15px;
}

.woocommerce ul.products li.product .button {
  display: inline-block;
  margin-top: 1em;
  text-align: center;
}

.woocommerce ul.products li.product .button,
.woocommerce div.product form.cart .button{
  background-color: #2168d5;
  color:#fff;
  border-radius: 0;
  font-weight: 500;
}

.wc-block-cart__submit-container {
  background-color: #2168d5 !important;
  color: #fff !important;
}

.wc-block-cart__submit-container a {
  color: #fff;
  text-decoration: none;
}

button.components-button.wc-block-components-button.wp-element-button.wc-block-components-checkout-place-order-button.contained {
  background-color: #2168d5 !important;
  color: #fff;
  border: none;
}

.wp-block-woocommerce-checkout{
  margin-bottom: 10px !important;
}

form.variations_form {
  display: flex;
  flex-flow: column;
}
p.wc-gzd-additional-info.wc-gzd-additional-info-loop.shipping-costs-info,
p.wc-gzd-additional-info.wc-gzd-additional-info-loop.small-business-info{
  display: none;
}

.product p.wc-gzd-additional-info {
  display: flex;
  flex-flow: column;
}

span.wc-gzd-additional-info {
  margin: 5px 0;
}

h2.woocommerce-loop-product__title {
  color: #000;
}
p.price {
  color: #000 !important;
}
span.price {
  color: #000 !important;
}