/*--------- Year End landing page style sheet   ---------*/

/*
*
* - 1.0 Main Styles
* - - 1.1 Text Formatting
* - - 1.2 Div Formatting
* - - 1.3 Tabcontent Styling
* - - 1.4 Timeline Section Formatting
* - - 1.5 Travel Section Formatting
* - - 1.6 Accordion Menu Styles
* - 2.0 Media Queries
* - - 2.1 Small Phones
* - - 2.2 Standard Phones
* - - 2.3 Large Phones
* - - 2.4 Tablets
* - - 2.5 Small Displays
* - - 2.6 Large Displays
*
*/

/*---------   1.0 Main styles   ---------*/

/*--- 1.1 Text Formatting ---*/

body {
	background:#74243c;
}

.center-blurb {
	text-align: center;
	padding: 0px 125px 0px 125px;
}
.btn {
	padding: 17px;
	margin-bottom: 0;
	font-size:22px;
}

@media only screen and (min-width: 768px) {
.btn {
	padding: 17px 0 15px;
	height: 70px;
	margin-bottom: 0;
	font-size:25px;

}
}

p.large {
	font-size: 16px;
	color: #fff;
}

h1 {
	text-transform: uppercase;
	font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
	font-weight: 300;
	font-size: 36px;
	margin-top: 20px;
	margin-bottom: 10px;
	color: #fff;
}

h2 {
	text-transform: uppercase;
	font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
	font-weight: 300;
	font-size: 30px;
}

h3 {
	text-transform: uppercase;
  font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-weight: 300;
	font-size: 24px;
	margin-top: 5px;
  margin-bottom: 5px;
}

h5 {
	text-transform: uppercase;
  font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-weight: 300;
	font-size: 14px;
	margin-top: 2px;
  margin-bottom: 2px;
}

h6 {
	text-transform: uppercase;
  font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-weight: 300;
	font-size: 14px;
	margin-top: 2px;
  margin-bottom: 2px;
	color: #ddd;
}

a {
	color: rgb(117, 37, 62)
}

a:hover {
	color: #fff;
	webkit-transition: 1.3s;
	transition: 1.3s;
}

.download-link {
	color: #fff;
}
.download-link:hover {
	color: #ddd;
	text-decoration: underline;
}

/*--- 1.2 Div Formatting ---*/
.main-contain {
	width: 100%;
	background-color: rgb(117, 37, 62);
}

.hero-img {
	background-image: url('../img/HC17-Web-Banner-1920x720.jpg');
	background-repeat: no-repeat;
	background-size: contain;
	width: 100%;
	height: 500px;
}

.hero-img3 img {
	min-width: 100% !important;
}

.color-box {
	background-color: rgb(117, 37, 62);
  color: #ddd;
  font-size: 16px;
}

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

.btn-gradient {
	height: 70px;
	background: rgba(10, 10, 10, 0.83); /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(left, rgba(10, 10, 10, 0.83), rgba(10, 10, 10, 0)); /*Safari 5.1-6*/
  background: -o-linear-gradient(left, rgba(10, 10, 10, 0.83), rgba(10, 10, 10, 0)); /*Opera 11.1-12*/
  background: -moz-linear-gradient(left, rgba(10, 10, 10, 0.83), rgba(10, 10, 10, 0)); /*Fx 3.6-15*/
  background: linear-gradient(to right rgba(10, 10, 10, 0.83), rgba(10, 10, 10, 0)); /*Standard*/
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
}

.main-btn-left {
	width: 100%;
	/*background-color: rgba(10, 10, 10, 0.83);*/
	margin: 0 auto;
	text-align: center;
	color: #ddd;
	padding: 0px;
}

.main-btn-center {
	width: 100%;
	/*background-color: rgba(10, 10, 10, 0.57);*/
	margin: 0 auto;
	text-align: center;
	color: #ddd;
	padding: 0px;
}

.main-btn-right {
	width: 100%;
	/*background-color: rgba(10, 10, 10, 0.83);*/
	margin: 0 auto;
	text-align: center;
	color: #ddd;
	padding: 0px;
}

.main-btn-left:hover {
	background-color: rgb(117, 37, 62);
	transition: .7s;
	-webkit-transition: .7s;
}

.main-btn-center:hover {
	background-color: rgb(117, 37, 62);
	transition: .7s;
	-webkit-transition: .7s;
}

.main-btn-right:hover {
	background-color: rgb(117, 37, 62);
	transition: .7s;
	-webkit-transition: .7s;
}

/*--- 1.3 Tabcontent Styling ---*/
.tabcontent {
    display: none;
    -webkit-animation: fadeEffect 1s;
    animation: fadeEffect 1s;
}

@-webkit-keyframes fadeEffect {
    from {opacity: 0;}
    to {opacity: 1;}
}

@keyframes fadeEffect {
    from {opacity: 0;}
    to {opacity: 1;}
}

/*-- 1.4 Timeline Section Formatting --*/

.timeline h2 {
	font-weight: 900;
	font-size: 50px;
	text-transform: uppercase;
	line-height: 50px;
	font-family: 'Passion One' sans-serif;
	color: #fff;
}

.timeline h4 {
	font-weight: 900;
	font-size: 50px;
	font-family: 'Passion One' sans-serif;
	color: #fff;
}

.timeline h6 {
	font-weight: 900;
	color: #fff;
	font-size: 20px;
	margin-top: 5px;
	margin-bottom: 5px;
	font-family: 'Passion One' sans-serif;
	color: #ddd;
}

.timeline strong {
	color: #ddd;
}

.timeline p {
	color: #ddd;
}
#events {
	display: block;
}

/*--- 1.5 Travel Section Formatting ---*/

.travel {
    border-radius: 50px 15px 30px 15px;
    background: #dddddb;
    padding: 20px;
    width: auto;
    height: auto;
    min-height: 365px;
    margin: 0 auto;
    position: relative;
    webkit-transition: .7s;
    transition: .7s;
}
.travel-2 {
    border-radius: 15px 50px 15px 30px;
    background: #dddddb;
    padding: 20px;
    width: auto;
    height: auto;
    min-height: 365px;
    margin: 0 auto;
    position: relative;
    webkit-transition: .7s;
    transition: .7s;
}
.travel-inner {
    background: #74243c;
    border-radius: 15px 20px 15px 20px;
    color: #fff;
    width: 200px;
    height: auto;
    position: absolute;
    padding: 5px;
    text-align: center;
    font-size: 20px !important;
    left: 35px;
    bottom: 15px;
    webkit-transition: .7s;
    transition: .7s;
}
.travel-inner-2 {
    background: #74243c;
    border-radius: 20px 15px 20px 15px;
    color: #fff;
    width: 200px;
    height: auto;
    position: absolute;
    padding: 5px;
    text-align: center;
    font-size: 20px !important;
    left: 33px;
    bottom: 15px;
    webkit-transition: .7s;
    transition: .7s;
}
.travel:hover {
    background-color: rgba(10, 10, 10, 0);
    color: #fff;
}
.travel-2:hover {
    background-color: rgba(10, 10, 10, 0);
    color: #fff;
}
.travel:hover > .travel-inner {
    background-color: #dddddb;
    color: #000;
}
.travel-2:hover > .travel-inner-2 {
    background-color: #dddddb;
    color: #000;
}

/*--- 1.6 Accordion Menu Styles ---*/

button.accordion {
	 background-color: rgba(10, 10, 10, 0.83);
	 color: #444;
	 cursor: pointer;
	 width: 100%;
	 text-align: left;
	 border: none;
	 outline: none;
	 transition: 0.4s;
	 padding: 10px;
	 border: 1px solid #fff;
	 margin-bottom: 20px;
}
button.accordion.active, button.accordion:hover {
	 background-color: #ddd0;
}
div.panel {
	 padding: 0 18px;
	 display: none;
}

/*---------    2.0 Media Queries   ---------*/

/*--- 2.1 Small Phones ---*/

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

.hero-img {
	height: 130px;
}
.center-blurb {
	padding: 5px;
	text-align: left;
}
.btn-gradient {
	background: none;
	border: none;
}
.main-btn-left {
	background: rgba(10, 10, 10, 0.83);
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	padding: 10px 0px 10px 0px;
}
.main-btn-center {
	padding: 10px 0px 10px 0px;
}
.main-btn-right {
	background: rgba(10, 10, 10, 0.83);
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	padding: 10px 0px 10px 0px;
}
.main-btn-right h2, .main-btn-center h2, .main-btn-left h2 {
	font-size: 25px !important;
}
.non-ac {
	display: none !important;
}
.travel, .travel-2 {
	margin: 10px;
}

}

/*--- 2.2 Standard Phones ---*/

@media only screen and (max-width: 425px) and (min-width: 360px){

.hero-img {
	height: 160px;
}
.center-blurb {
	padding: 10px;
	text-align: left;
}
.btn-gradient {
	background: none;
	border: none;
}
.main-btn-left {
	background: rgba(10, 10, 10, 0.83);
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	padding: 10px 0px 10px 0px;
}
.main-btn-center {
	padding: 10px 0px 10px 0px;
}
.main-btn-right {
	background: rgba(10, 10, 10, 0.83);
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	padding: 10px 0px 10px 0px;
}
.main-btn-right h2, .main-btn-center h2, .main-btn-left h2 {
	font-size: 25px !important;
}
.non-ac {
	display: none !important;
}
.travel, .travel-2 {
	margin: 10px;
}

}

/*--- Horizontal Phones ---*/

@media only screen and (max-width: 735px) and (min-width: 426px) {

	.hero-img {
		height: 280px;
	}
	.center-blurb {
		padding: 10px;
		text-align: left;
	}
	.btn-gradient {
		background: none;
		border: none;
	}
	.main-btn-left {
		background: rgba(10, 10, 10, 0.83);
		border-top: 1px solid #fff;
		border-bottom: 1px solid #fff;
		padding: 10px 0px 10px 0px;
	}
	.main-btn-center {
		padding: 10px 0px 10px 0px;
	}
	.main-btn-right {
		background: rgba(10, 10, 10, 0.83);
		border-top: 1px solid #fff;
		border-bottom: 1px solid #fff;
		padding: 10px 0px 10px 0px;
	}
	.main-btn-right h2, .main-btn-center h2, .main-btn-left h2 {
		font-size: 25px !important;
	}
	.non-ac {
		display: none !important;
	}
	.travel, .travel-2 {
		margin: 10px;
	}

}

/*--- 2.3 Large Phones --- */

@media only screen and (max-width: 799px) and (min-width: 736px) {
	.hero-img {
		height: 300px;
	}
	.center-blurb {
		padding: 10px;
		text-align: left;
	}
	.btn-gradient {
		background: none;
		border: none;
	}
	.main-btn-right h2, .main-btn-center h2, .main-btn-left h2 {
		font-size: 25px !important;
	}
	.non-ac {
		display: none !important;
	}
	.travel, .travel-2 {
		margin: 10px;
	}

}

/*--- 2.4 Tablets ---*/

@media only screen and (max-width: 979px) and (min-width: 800px) {


.hero-img {
	height: 360px;
}
.btn {
	font-size: 22px;
}
.travel, .travel-2 {
	min-height: 415px;
}
.travel-inner, .travel-inner-2 {
	width: 150px;
}
.ac {
	display: none !important;
}

}

/*--- 2.5 Small Displays ---*/

@media only screen and (max-width: 1279px) and (min-width: 980px) {

.hero-img {
	height: 515px;
}
.ac {
	display: none !important;
}

}

/*--- 2.6 Standard Displays ---*/

@media only screen and (max-width: 1399px) and (min-width: 1280px) {

.hero-img {
		height: 515px;
}
.ac {
	display: none !important;
}

}

/*--- 2.7 Large Displays ---*/

@media only screen and (min-width: 1400px) and (max-width: 1899px) {

.hero-img {
		height: 730px;
}
.ac {
	display: none !important;
}

}

/*--- Oversized Displays ---*/

@media only screen and (min-width: 1900px) {

.hero-img {
	height: 960px;
}
.ac {
	display: none !important;
}

}
.white {
	color:#fff;
}
footer {
    padding: 25px 0;
    text-align: center;
    border-top: 1px solid #fff;
    margin-top: 20px;
}

footer span.copyright {
    text-transform: uppercase;
    text-transform: none;
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    line-height: 40px;
		color:#fff;
}

footer ul.quicklinks {
    margin-bottom: 0;
    text-transform: uppercase;
    text-transform: none;
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    line-height: 40px;
}

.list-inline {
    padding-left: 0;
    margin-left: -5px;
    list-style: none;
}
.list-inline>li {
    display: inline-block;
    padding-right: 5px;
    padding-left: 5px;
}

ul.social-buttons {
    margin-bottom: 0;
		list-style: none;
}

ul.social-buttons li a {
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    font-size: 20px;
    line-height: 40px;
    outline: 0;
    color: #fff;
    background-color: #222;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    transition: all .3s;
}

ul.social-buttons li a:hover,
ul.social-buttons li a:focus,
ul.social-buttons li a:active {
    background-color: #999;
}

.btn:focus,
.btn:active,
.btn.active,
.btn:active:focus {
    outline: 0;
}
