/*
Theme Name: BQ Bike Week
Theme URI: https://bikeweekqld.com.au
Author: Simone Armani
Author URI: https://ashtonarmani.com.au
Description: Bike Week Queensland
Version: 1.0
*/

@font-face {
font-family: 'Effra';
font-style: normal;
font-weight: normal;
src: local('Effra'), url('fonts/Effra-Regular.woff') format('woff');
}
@font-face {
font-family: 'Effra';
font-style: normal;
font-weight: 700;
src: local('Effra'), url('fonts/Effra-Bold.woff') format('woff');
}

body{
  font-family:'Effra', sans-serif;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
}
h1{ font-size: 40px;}
h2{ font-size: 30px;}
h3{ font-size: 25px;}
h4{ font-size: 20px;}
h5{ font-size: 15px;}
h1, h2, h3, h4, h5{
  text-transform: uppercase;
  font-weight: 700;
}
a{
  color: #267f3f;
  transition: color 0.5s ease;
  text-decoration: none;
}
a:hover{
  color: #459e5e;
}

/*--------------- Universal ------*/
.clearfix{
  clear: both;
}
.button{
  background: none;
  border: 3px solid #fff;
  padding: 20px 30px;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  border-radius: 7px;
  text-transform: uppercase;
  transition: background-color 0.5s ease;
  font-weight: 700;
  font-size: 20px;
  letter-spacing: 0.2em;
  text-align: center;
}
.button:hover{
  background: #fff;
  color: #36ac48;
  text-decoration: none;
}
.button-blue{
  background: #26435c;
}
.button-green{
  background: #267f3f;
  color: #fff;
}
.button-green:hover{
  background: #459e5e;
  color: #fff;
}
/* Remove default list styling*/
.clean-list{
  list-style: none;
  margin: 0;
  padding: 0;
}
input{
  border: 3px solid #fff;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  border-radius: 7px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: none;
}
input:focus{
   outline: none;
}
.lead{
  font-size: 20px;
}
.small{
  font-size: 12px;
}
.medium{
  font-size: 15px;
}
.meta{
  color: #d0d0d0;
  text-transform: uppercase;
}
.hide,
.hidePastEvent{
  display: none;
}
.gutter{
  padding: 0 15px;
}
.block{
  display: block;
}
.viewMore{
  text-align: center;
}
.viewMore a{
  font-size: 12px;
  padding: 5px;
  background: #f7f7f7;
  color: #ccc;
  text-align: center;
}
.viewMore a:hover{
  text-decoration: none;
  color: #459e5e;
}
/*--------------- Forms ------*/
#ri-feedback{
  text-align: center;
  text-transform: uppercase;
}
/*--------------- Hero ------*/
#home #hero{
  min-height: 1000px; /* Fall-back for older browsers */
  min-height: 100vh;
}
#hero{
  padding: 0 0 100px 0;
  padding: 0 0 4vh 0;
  background: url(img/hero.jpg); /* Fall-back for older browsers */
  background: linear-gradient(rgba(0, 0, 0, 0.40), rgba(0, 0, 0, 0.40) ),url(img/hero.jpg);
  background-size: cover;
  background-repeat: repeat-y;
  background-position: bottom center;
  color: #fff;
  text-align: center;
}
#hero a{
  color: #fff;
}
#hero a:hover{
  text-decoration: none;
  color: #36ac48;
}
#hero #logo{
  text-align: center;
}
#hero #logo img{
  max-width: 200px;
}
#hero .content{
  margin-top: 250px;
  margin-top: 20vh;
}
#hero .content .button{
  display: inline-block;
  width: 100%;
  margin: 15px 0;
}
/*--------------- Hero countdown------*/
#hero ul#countdown li{
  display: inline-block;
  background: rgb(254, 242, 0); /* Fall-back for browsers that don't support rgba */
  background: rgba(254, 242, 0, .9);
  color: #267f3f;
  font-size: 30px;
  margin: 40px 5px;
  padding: 20px 0;
  padding: 3vh 0;
  width: 18%;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 55px;
  border-radius: 5px;
}
#hero ul#countdown li span.desc{
  font-size: 20px;
  font-weight: normal;
  display: block;
}
/*--------------- Menu ------*/
ul#menu-sub,
ul#menu {
  width: 100%;
}
ul#menu-sub{
  margin-top: 2vh;
}
ul#menu{
  margin-top: 2vh;
}
ul#menu li{
  text-transform: uppercase;
}
ul#menu li{
  padding: 0 15px;
  font-size: 17px;
}
ul#menu-sub{
  padding-right: 15px;
}
ul#menu-sub,
ul#menu{
  text-align: center;
}
ul#menu-sub li,
ul#menu li{
  display: inline-block;
}
ul#menu-sub li{
  padding: 0 10px 10px 0;
  font-size: 12px;
}
ul#menu-sub li:last-child{
  padding-left: 20px;
}
ul#menu-sub li .button{
  padding-top: 8px;
  padding-bottom: 8px;
  font-size: 14px;
}
/*--------------- Event Filter ------*/
#events #filter{
  background-color: #267f3f;
  text-transform: uppercase;
  text-align: center;
  padding: 10px 0;
  color: #fff;
  font-size: 20px;
}
#events #filter label .glyphicon{
  padding: 10px 0 0 0;
}
#events #filter .filter-select{
  border: 3px solid #fff;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  border-radius: 7px;
  display: inline-block;
  padding: 0px 20px;
  position: relative;
}
#events #filter span{
  display: inline-block;
  margin-right: 20px;
}
#events #filter select{
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: none;
  border: none;
  text-transform: uppercase;

}
#events #filter select:focus{
   outline: none;
}
#events #filter .contain{
  display: inline-block;
  padding: 0 30px;
}
#events #filter input#filterPast{
  height: 25px;
  width: 25px;
  position: absolute;
  opacity: 0;
  cursor: pointer;
}
#events #filter .checkmark {
  position: relative;
  top: 5px;
  left: 20px;
  height: 30px;
  width: 30px;

  border: 3px solid #fff;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  border-radius: 7px;
}
/* On mouse-over, add a grey background color */
#events #filter .contain:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
#events #filter .contain input:checked ~ .checkmark {
  background-color: #2196F3;
}

/* Create the checkmark/indicator (hidden when not checked) */
#events #filter .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
#events #filter .contain input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
#events #filter .contain .checkmark:after {
  left: 9px;
  top: 6px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
/*--------------- Event boxes ------*/
#events .event{
  height: 350px;
  text-align: center;
  color: #fff;
  overflow: hidden;
}
#events .event .event-image{
  position: absolute;
  height: 100%;
  width: 100%;
  background-position: center;
  transition: all .5s ease-in;
  -moz-transition: all .5s ease-in;
  -ms-transition: all .5s ease-in;
  -o-transition: all .5s ease-in;
  -webkit-transition: all .5s ease-in;
}
#events .event:hover .event-image{
  transform: scale(1.2);
  -moz-transform: scale(1.2);
  -webkit-transform: scale(1.2);
  -o-transform: scale(1.2);
  -ms-transform: scale(1.2); /* IE 9 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1.2, M12=0, M21=0, M22=1.2, SizingMethod='auto expand')"; /* IE8 */
   filter: progid:DXImageTransform.Microsoft.Matrix(M11=1.2, M12=0, M21=0, M22=1.2, SizingMethod='auto expand'); /* IE6 and 7 */ 
}
#events .event .content{
  position: relative;
  padding: 30px 30px;
}
#events .event .content .location{
  background: rgb(255, 255, 255); /* Fall-back for browsers that don't support rgba */
  background: rgba(255, 255, 255, .7);
  text-transform: uppercase;
  color: #7b7d7c;
  padding: 5px 10px;
  position: absolute;
  top: 5px;
  right: 0;
}
#events .event .content .sold-out{
  background: rgb(216, 3, 38); /* Fall-back for browsers that don't support rgba */
  background: rgba(216, 3, 38, .7);
  text-transform: uppercase;
  color: #fff;
  padding: 5px 10px;
  position: absolute;
  top: 5px;
  left: 0;
}
#events .event .content .featured{
  background: rgb(254, 242, 0);
  background: rgba(254, 242, 0, .9);
  text-transform: uppercase;
  color: #267f3f;
  padding: 5px 10px;
  position: absolute;
  top: 5px;
  left: 5px;
}
#events .event .content .meta{
  color: #fff;
  margin: 3vh 0 2vh;
  padding: 20px;
  text-transform: uppercase;
  font-weight: bold;
  /*background: rgb(38, 127, 63); /* Fall-back for browsers that don't support rgba 
  background: rgba(38, 127, 63, .3);*/
}
#events .event .content .meta .meta-day{
  font-size: 20px;
}
#events .event .content .meta .meta-date{
  font-size: 17px;
}
#events .event .content .button{
  opacity: 0;
  display: inline-block;
  font-size: 15px;
  margin-top: 20px;
  padding-top: 8px;
  padding-bottom: 8px;
}
#events .event .content .button-m{
  opacity: 100;
}
#events .event .content .button:hover{
  color: #36ac48;
}
#events .event:hover .button{
  opacity: 100;
}
.event-data .sidebar{
  text-transform: uppercase;
}
.event-data .sidebar .sold-out{
  background: rgb(152, 2, 27);
  color: #fff;
  padding: 10px 10px;
  text-align: center;
}
/*--------------- Register you interest ------*/
#updates{
  background-color: #20ae4c;
  color: #fff;
  padding: 30px 0 50px 0;
}
#updates .col{
  padding: 0 15px;
}
#updates h2{
  text-align: center;
  margin-bottom: 30px;
}
#updates label{
  display:block;
  text-transform: uppercase;
}
#updates input{
  width: 100%;
  padding: 20px 20px;
  color: #fff;
  font-size: 20px;
}
#updates input.button{
  color: #fff;
}
#updates input.button:hover{
  color: #36ac48;
}
/*--------------- Intro ------*/
#intro{
  background: #267f3f;
  padding: 50px 0;
  color: #fff;
  margin: 0 auto;
  text-align: justify;
  text-align-last: center;
}
/*--------------- News & Media ------*/
 #news{
  text-align: center;
  color: #fff;
  background-image: linear-gradient(top, #267f3f, #267f3f 50%, transparent 50%, transparent 100%);
  background-image: -webkit-linear-gradient(top, #267f3f, #267f3f 50%, transparent 50%, transparent 100%)
}
#news .item{
  color: #404040;
}
#news .item img{
  border-radius: 50%;
}
#news .item1{
  padding-right: 1.5vw;
}
#news .item2{
  padding-left: .75vw;
  padding-right: .75vw;
}
#news .item3{
  padding-left: 1.5vw;
}
#news h4{
  font-size: 35px;
  text-transform: none;
}
/*--------------- Sponsors ------*/
#sponsors{
  text-align: center;
  padding: 50px 0;
}
#sponsors .item{
  display: inline-block;
  vertical-align: top;
  width: 20%;
}

/*--------------- Footer ------*/
#footer{
  background: #267f3f;
  padding: 50px 0;
  text-align: center;
  color: #fff;
  text-transform: uppercase;
}
#footer h4{
  margin-bottom: 30px;
}
#footer ul li{
  padding: 10px 0;
}
#footer a{
  text-decoration: underline;
}
#footer a,
#footer ul li a{
  color: #fff;
}
#footer a:hover,
#footer a:hover:focus,
#footer ul li a:hover,
#footer ul li a:focus{
  color: #113a1d;
  text-decoration: none;
}
#footer .sponsor{
  text-align: justify;
  text-align-last: center;
  text-transform: none;
}
/*--------------- Content ------*/
#content .title{
  background: #f7f7f7;
  padding: 20px 0;
}
#content .title h1{
  font-size: 35px;
  padding: 0;
  margin: 0;
  color: #267f3f;
}
#content .content{
  padding: 30px 0 0 0;
}
/*--------------- Content Sidebar------*/
#content #side{
  padding: 0 0 0 30px;
}
#content #side #regi{
  background: #f7f7f7;
  padding: 30px;
}
#content #side #regi h3{
  padding: 0;
  margin: 0 0 30px 0;
}
#content #side #riForm label,
#content #side #riForm input{
  width: 100%;
}
#content #side #riForm input{
  border: 0;
  border-bottom: 2px solid #ccc;
  border-radius: 0;
}
#content #side #riForm input.button{
  border: 0;
  padding: 5px 20px;
  margin-top: 20px;
}
#content #side #ri-feedback{
  text-align: left;
}
#content #side #latestNews{
  margin-top: 30px;
}
#content #side #latestNews .item{
  padding: 15px 0;
}
#content #side #latestNews .item .image{
  padding-right: 30px;
}
#content #side #latestNews .item img{
  border-radius: 50%;
}
#content #side #latestNews .item .text h5{
  margin-bottom: 0;
}
#content #side #latestNews .item .text .meta{
  font-size: 12px;
}

/*------------------------------------------------------------------ Page contact us --------------*/
#gMaps {
        position: relative;
        padding-bottom: 35%;
        height: 0;
        overflow: hidden;
}
#gMaps iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100% !important;
        height: 100% !important;
}
/*-------------------------------------------------------------- WordPress Core --------------*/
.alignnone {
    margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

.alignright {
    float:right;
    margin: 5px 0 20px 20px;
}

.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

a img.alignnone {
    margin: 5px 20px 20px 0;
}

a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.wp-caption {
    background: #fff;
    border: 1px solid #f0f0f0;
    max-width: 96%; /* Image does not overflow the content area */
    padding: 5px 3px 10px;
    text-align: center;
}

.wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
    margin: 5px 0 20px 20px;
}

.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}

.wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 0 4px 5px;
}

/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
	background-color: #eee;
	clip: auto !important;
	clip-path: none;
	color: #444;
	display: block;
	font-size: 1em;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
	/* Above WP toolbar. */
}

/**
 * Featherlight Loader
 *
 * Copyright 2015, WP Site Care http://www.wpsitecare.com
 * MIT Licensed.
 */
@-webkit-keyframes featherlightLoader {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@keyframes featherlightLoader {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

.featherlight-loading .featherlight-content {
  -webkit-animation: featherlightLoader 1s infinite linear;
          animation: featherlightLoader 1s infinite linear;
  background: transparent;
  border: 8px solid #8f8f8f;
  border-left-color: #fff;
  border-radius: 80px;
  width: 80px;
  height: 80px;
  min-width: 0;
}

.featherlight-loading .featherlight-content > * {
  display: none !important;
}

.featherlight-loading .featherlight-close,
.featherlight-loading .featherlight-inner {
  display: none;
}