/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Rubik');

@font-face {
    font-family: 'nexa_rust_sansblack';
    src: url('fonts/NexaRustSans-Black-Free-webfont.eot');
    src: url('fonts/NexaRustSans-Black-Free-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/NexaRustSans-Black-Free-webfont.woff2') format('woff2'),
         url('fonts/NexaRustSans-Black-Free-webfont.woff') format('woff'),
         url('fonts/NexaRustSans-Black-Free-webfont.ttf') format('truetype'),
         url('fonts/NexaRustSans-Black-Free-webfont.svg#nexa_rust_sansblack') format('svg');
    font-weight: normal;
    font-style: normal;
}

* {
	margin:0;
	padding:0;
}

html {
}

body {
	background: url(images/header2.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	font-family: 'Rubik', sans-serif;
	width: 100%;
  min-width: 300px;
	padding-top: 0;
	padding-bottom: 0;
}

#wrap{
   width:100%;
   height:100%;
}

.wrapper {
	padding-left: 2%;
	padding-right: 2%;
}

/* header */
div.ribbon {
	margin: 0 auto;
	text-align: center;
	z-index: 99;
	background-color: rgba(127,182,224,.5) !important;
  height:75px;
  padding: 10px 0;
}

.ribbon{
	display: block;
	width: 100%;
	z-index: 99;
	/*padding makes the header ribbon adjust to the size of the logo plus 20px on top and bottom*/
}

.brand_logo {
  width:calc(50% - 1px);
  float:left;
}

.brand_logo:first-of-type {
  border-right:2px solid white;
}

h1 {
	color: #1b303f;
	font-family: 'nexa_rust_sansblack', sans-serif;
	font-size: 26px;
	font-weight: bold;
}
h2 {
	color: #1b303f;
	font-family: 'nexa_rust_sansblack', sans-serif;
	font-size: 26px;
	margin-bottom: 5px;
	font-weight: bold;
}
h3 {
	color: #1b303f;
	font-family: 'nexa_rust_sansblack', sans-serif;
	font-size: 26px;
	margin: 1rem 0;
	font-weight: bold;
}
h4 {
	color: #3A3A3C;
	font-family: 'nexa_rust_sansblack', sans-serif;
	font-size: 26px;
}
p {
	font-size: 20px !important;
	margin:0 0 15px;
	line-height: 1.4;
	color: #fff;
}

#home ul li{
	color: #404041;
}

ul {
	color: #404041;
	font-size:16px;
	margin:0 0 15px 20px;
	color: #1F6777;
}

 ul li {
	margin:0 0 1rem;
	font-size: 20px;
	color: #404041;
}

 ul li span{
	font-size: 1.5rem;
	padding-right: .25rem
}

a {color:#5ca4d8;text-decoration:underline;}
a:hover { color:#1b303f; text-decoration: underline; }


#subtitle{
	text-indent: -9999em;
	height: 0;
}

#overlay{
	margin:0;
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
	padding-top: 50px;
	padding-bottom: 50px;
	z-index: 0;

}

article#home a {
	color:#336a96;

}
article#home a:hover { text-decoration: underline; color:#1b303f;}

.wrapper {
	max-width:1000px;
	margin:0 auto;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
}

#top-bar{
	text-align: center;
}

#branding {
	background-color: rgba(0,0,0,0.3);
	/* background: #f0eedf url( 'images/vilasbg.png' ) repeat center center fixed; */
	padding: 20px 0;
	/* box-shadow: 0 5px 23px #BBBBBB; */
}


#branding h1 {
	display: inline-block;
	width:100%;
	max-width: 320px;
	height:75px;
	text-indent:-9999em;
	background: url(images/logo.png) left center no-repeat;
	background-size: contain;
}


#top-bar{
	text-align: left;
	max-width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 0 5%;
}

#giveaway > img{
	max-width: 100%;
}

#giveaway{
	text-align: center;
}

#content:after{
	clear: both;
	display: table;
	content: "";
}

.logo{
	margin: 0 auto;
  text-align: center;
  max-width: 500px;
  margin-bottom: 20px;
}
.logoimg{
	width:80%;
}
#bikegif {
	width: 100vw;

}
#bikegif img {
	margin-top: -80px;
    margin-bottom: -50px;
}
article {
	margin:20px 0 30px;
	padding:30px;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
	background-color: rgba(255,255,255,.85) !important;
	color:#000;
	-webkit-box-shadow:0 0 15px rgba(0,0,0,.5);
	-moz-box-shadow:0 0 15px rgba(0,0,0,.5);
	box-shadow:0 0 15px rgba(0,0,0,.5);
	border-radius: 10px;
}
article#home {
	color:#1F6777;
	background:transparent;
	box-shadow:none;
	padding:0 0 50px 0;
	width:48%;
	float:left;
}

#home p{
	font-size: 1.2rem;
	/*text-shadow: 0 0 6px #000;*/
}

#home p, #home h3{
	text-color: #333;
}

#home h3, #home ul li, #home ul li a{
}

#entry-form {
	width:48%;
	float:right;
	margin:20px 0 0;
	padding:20px;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
	background: rgba(255, 255, 255,.75);
	border-radius: 10px;
	box-shadow:0 0 15px rgba(0,0,0,.4);
}

footer,#footer {
	width: 100%;
	background-color: #1b303f;
	height: auto;
	/* min-height: 100px; */
	margin: 0;
	padding: 10px 20PX;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	text-align: center;
	box-shadow: 0 0 10px #000;
}
footer a, #footer a {
	color: #5ca4d8;
	font-size: 1.5em;
	text-decoration:none;
}
footer a:hover, #footer a:hover {
	text-decoration:underline;
}

footer p {
	font-size: 12px !important;
}

span.seperator{
	padding: 0 10px;
}

.button {
    text-align:center;
    margin:35px 0 25px;
}
.button a {
	display: inline-block;
	font-family: 'nexa_rust_sansblack', sans-serif;
    background:#5ca4d8;
    padding:10px 25px 10px;
    color:#fff;
    text-decoration:none !important;
    /* text-transform:uppercase; */
    font-size:35px;
    font-weight:100;
    /* text-shadow:-1px -1px 0 rgba(0,0,0,.25); */
    border-radius:7.5px;
    box-shadow:0px 1px 5px rgba(0,0,0,.5);
    letter-spacing: 2px;

}
.button a:hover {
    background:#1b303f;
    box-shadow:none;
    color: white;
}
.clearfix {
	clear:both;
}

#giveaway{
	margin: 0 0 20px 0;
	margin-top: 50px;
}

#home #giveaway{
	margin: 0;
}

.submit {
	background: #ec4337 !important;
}

@media screen and (max-width:960px) {

}


@media screen and (max-width:600px) {
	article#home,#home3,
	#entry-form {
		width:100%;
		float:none;
		margin:0;
		margin-bottom: 50px !important;
	}

	#overlay, #branding{

		-webkit-transition: background-color 0.5s ease;
		-moz-transition: background-color 0.5s ease;
		transition: background-color 0.5s ease;
	}

	.logoimg {
		width: 80%
	}

  div.ribbon {
    height: 150px;
  }

  .brand_logo {
    width: calc(100% - 20px);
    float:left;
    margin: 0 10px;
  }

  .brand_logo:first-of-type {
    border-right: none;
    border-bottom:2px solid white;
  }

  .brand_logo:nth-of-type(2) {
  padding-top: 10px;
  }
}

/* Social Share Section */
.ssbp-list {
  list-style: none;
  display: inline-block;
  vertical-align: middle;
  margin: 0 auto;
  padding: 0;
}

.ssbp-list {
  display: table;
  table-layout: fixed;
  width: auto;
}

.ssbp-list li {
  display: inline-block !important;
  margin: 0 0 !important;
  display: table-cell !important;
  width: auto;
  height: auto;
}

.ssbp-btn:hover, .ssbp-btn:focus, .ssbp-btn:active, .ssbp-btn:visited {
    z-index: 10;
    color: #fff;
}

.ssbp-btn {
  display: block;
  width: auto;
  color: white !important;
}

.ssbp-btn:hover, .ssbp-btn:focus, .ssbp-btn:active, .ssbp-btn:visited {
  z-index: 10;
  color: #fff;
}

.ssbp-facebook {
  background-color: rgba(59, 89, 152, .75)
}

.ssbp-twitter {
  background-color: rgba(0, 169, 241, .75);
}

.ssbp-email {
  background-color: rgba(95, 95, 95, .75);
}

.ssbp-btn {
  width: auto;
  padding: 0 10px;
  height: 2em;
  line-height: 2em;
  position: relative;
  color: #fff;
  font-weight: normal;
  -webkit-transition: .25s;
  transition: .25s;
  border-bottom: 0;
  margin-right: 5px;
}

.ssbp-btn {
  display: inline-block;
  text-align: center;
  text-decoration: none;
  font-family: sans-serif;
}

.ssbp-btn {
  border-radius: 5px !important;
}

.ssbp-wrap *, .ssbp-wrap *:before, .ssbp-wrap *:after {
  box-sizing: border-box;
}

.stext {
display: inline-block;
}

@font-face {
    font-family: 'fontello';
    src: url('fonts/fontello.eot?16816896');
    src: url('fonts/fontello.eot?16816896#iefix') format('embedded-opentype'),
         url('fonts/fontello.woff?16816896') format('woff'),
         url('fonts/fontello.ttf?16816896') format('truetype'),
         url('fonts/fontello.svg?16816896#fontello') format('svg');
    font-weight: normal;
    font-style: normal;
  }

  #home3 li a {
    color: white !important;
  }

  .demo-icon {
    font-family: "fontello";
    font-style: normal;
    font-weight: normal;
    speak: none;

    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;
    /* opacity: .8; */

    /* For safety - reset parent styles, that can break glyph codes*/
    font-variant: normal;
    text-transform: none;

    /* fix buttons height, for twitter bootstrap */
    line-height: 1em;

    /* Animation center compensation - margins should be symmetric */
    /* remove if not needed */
    margin-left: .2em;

    /* You can be more comfortable with increased icons size */
    /* font-size: 120%; */

    /* Font smoothing. That was taken from TWBS */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

    /* Uncomment for 3D effect */
    /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
  }

  .icon-facebook:before {
    content: "" !important;
  }

  @media screen and (max-width: 640px) {
    .ssbp-list {
      margin: 0 auto !important;
    }

    .ssbp-btn {
      width: 75px;
    }

    .stext {
      display: none;
    }
  }
/* End Social Share Section */