@import url('https://fonts.googleapis.com/css?family=Dosis:700|Quicksand:300,400');
@import url('https://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700');
body {
   font-family: 'Quicksand', sans-serif;
   font-weight: 300;
}
header {
   background: #090909;
   color: #fff;
   font-family: 'Dosis', sans-serif;
   padding: .5em;
   text-transform: uppercase;
}
h1,h2,h3,h4,h5,h6 {
   font-family: 'Ubuntu', sans-serif;
   font-weight: 700;
}
p, i, span {
   font-family: 'Quicksand', sans-serif;
   font-weight: 300;
}
header .caption {
   background-image: url(../media/v.png);
   background-position: center -70px;
   background-size: 300px;
   background-repeat: no-repeat;
   padding: .6em;
}
header .caption h5 {
   font-weight: 300;
   font-family: 'Quicksand', sans-serif;
   text-transform: uppercase;
   font-size: 1em;
   text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5);
}
header .caption h5:first-child {
   border-bottom: 2px solid  #0e5a4c;
   display: inline-block;
   padding: 0em .6em .4em .6em;
}
#cover {
   padding-top: 2em;
   background: #090909;
}
#cover .bg {
   position: relative;
   overflow: hidden;
}
#cover .bg .caption-image {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: 2;
   background: rgba(0, 0, 0, 0.2);
      background-image: url(../media/v.png);
      background-position: center 300px;
      background-size: contain;
      background-repeat: no-repeat;
   color: #fff;
}
#cover .bg .caption-image img {
   background: rgba(0, 0, 0, 0.1);
}
#cover .bg .caption-image .caption {
   padding: 1.5em;
   text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
}
#cover .bg .caption-image .caption h5 {
   font-weight: 400;
   letter-spacing: 1px;
   font-family: 'Ubuntu', sans-serif;
   text-transform: uppercase;
   font-size: 1.4em;
   margin-bottom: .3em;
   text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5);
}
#cover .bg .caption-image .caption h5:first-child {
   border-bottom: 2px solid  #0e5a4c;
   display: inline-block;
   padding: 0em .6em .4em .6em;
}
.counter {
   background: #fe4c6e;
   padding: 1em;
}
.counter span {
   font-size: 2em;
   font-weight: 700;
   color: #fff;
}
.counter .item h6 {
   letter-spacing: 1px;
   color: #f0f0f0;
   font-size: .7em;
}
.counter .item {
   position: relative;
}
.counter .item:not(:last-child)::after {
   content: ' ';
   width: 1px;
   height: 50%;
   background: #fff;
   position: absolute;
   top: 25%;
   right: 0;
}
.ticket {
   padding: 1.6em 1em;
}
.ticket a {
   text-align: center;
   color: #fff;
   width: 100%;
   display: block;
   text-decoration: none;
   text-transform: uppercase;
}
.ticket a span {
   font-family: 'Dosis', sans-serif;
   font-size: 2em;
   text-shadow: 0px 0px 0px rgba(0, 0, 0, 0) !important;
}
.ticket a i {
   font-size: 2em;
   transform: rotate(-45deg);
}

#desc {
   background: #000;
   padding: 1.5em 1.5em 1.5em 1.5em;
   text-align: center;
}

.data-item {
   padding: 60px 2em 1.5em 2em;
   width: 50%;
   min-width: 297px;
   margin: auto;
   margin-bottom: 20px;
   margin-top: 3em;
   border: 1px solid rgba(255, 255, 255, 0.9);
   position: relative;
   color: #fff;
}
.data-item::before {
   content: ' ';
   width: 60px;
   height: 60px;
   border: .5em solid rgba(0, 0, 0, 0.5);
   position: absolute;
   top: -30px;
   left: 40%;
   transform: rotate(45deg);
}
.data-item.date::after { content: '\f274';}
.data-item.place::after{ content: '\f21d';}
.data-item::after {
   position: absolute;
   top: -18px;
   left: 46.5%;
   font-size: 1.5em;
   font-weight: 100;
   font-family: 'FontAwesome';
   color: #fff;
}
.data-item.date::before {
   background: #fe4c6e;
}
.data-item.place::before {
   background: #0e5a4c;
}
.data-item .title {
   font-family: 'Quicksand', sans-serif;
   text-transform: uppercase;
   font-size: 1.1em;
   text-align: center;
   margin-bottom: .7em;
   line-height: 25px;
}
.data-item p {
   margin: 0.2em auto;
}

#intro {
   padding: 2em 0.5em;
   text-align: center;
}
.title {
   text-transform: uppercase;
   font-size: 2em;
   text-align: center;
}
.btn-ticket {
   background: #404c72;
   padding: .5em 1em;
   font-size: 1.2em;
   cursor: pointer;
   color: #fff;
   text-decoration: none;
   font-family: 'Dosis', sans-serif;
   text-transform: uppercase;
   font-weight: 200;
   letter-spacing: 1px;
   margin: auto;
   text-align: center;
}
.btn-ticket:hover, .btn-ticket:focus, .btn-ticket:active {
   color: #fff;
   text-decoration: none;
}
#guest {
   padding: 0em;
   color: #fff;
}
#guest .desc {
   padding: 1.2em 1em;
}
#guest .desc hr {
   background: rgba(255, 255, 255, 0.5);
}
.title2 {
   font-family: 'Ubuntu', sans-serif;
   font-weight: 300;
   font-size: 1.6em;
   text-align: center;
}
.list-awards {
   margin: 0;
   padding: .5em 1em;
}
.list-awards li {
   display: flex;
   align-items: center;
   margin: .5em auto;
}
.list-awards li i {
   font-size: 2.3em;
   padding: 0;
   display: inline-block;
   margin-right: .5em;
}
.list-awards li span {
   display: inline-block;
}
.list-awards li span h3 {
   font-size: 1.3em;
   margin: 0;
   text-align: left;
   text-transform: capitalize;
   color: #f0f0f0;
}
.list-awards li span h6 {
   font-family: 'Quicksand', sans-serif;
   font-weight: 300;
   color: rgba(255, 255, 255, 0.7);
}
#discount {
   padding: 0em 0em 2em 0em;
}
.discounted {
   text-align: center;
}
.discounted .number {
   font-size: 5em;
   font-weight: 700;
   font-family: 'Dosis';
}
.discounted div i {
   display: block;
   font-size: 1.8em;
}
.discounted div span {
   display: block;
   font-size: 1.8em;
   margin: 0;
   line-height: 23px;
   font-weight: 700;
   font-family: 'Dosis';
}

#pricing {
   padding: 2em 0em 4em 0em;
   color: #fff;
}
#author {
   padding: 2em 0em;
}
#venue {
   padding: 1em 0em 0em 0em;
}
.address {
   text-align: center;
}
.address li {
   margin-bottom: .8em;
}
.address li i {
   font-size: 1.2em;
   margin-right: .3em;
}
.address li strong {
   font-family: 'Ubuntu', sans-serif;
   text-transform: uppercase;
   font-weight: 700;
   text-shadow: 0px 0px 0px rgba(0, 0, 0, 0) !important;
}
#directionsPanel {
   padding: .5em;
   background: #fafafa;
   box-shadow: inset 1px 1px 3px rgba(190,189, 189, 0.5);
   font-size: .9em;
   max-height: 450px;
   overflow-y: scroll;
}
#map_canvas {
   width: 100%;
   height: 500px;
}
#venue table td {
   text-align: left;
}
#venue .getroute-content input::-webkit-input-placeholder {
   color: rgba(189, 189, 189, 0.5);
}
#form {
   min-height: 899px;
   background-image: url(../media/bgform.jpg);
   background-repeat: no-repeat;
   background-position: center top;
   background-size:  cover;
   position: relative;
}
#form::after {
   content: ' ';
   width: 100%;
   height: 100%;
   background: rgba(0, 0, 0, 0.7);
   position: absolute;
   top: 0;
   left: 0;
}
#form .container {
   position: relative;
   z-index: 2;
   color: #fff;
}
#form .container .caption {
   background-image: url(../media/v.png);
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center 15px;
   margin-bottom: 3em;
}
#form h3 {
   font-size: 2.5em;
   font-weight: 400;
   font-family: 'Ubuntu', sans-serif;
}
#form p {
   font-weight: 300;
   font-size: 1.2em;
   text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
   color: rgba(255, 255, 255, 0.7);
}
#form form label {
   color: #Fff;
   text-transform: uppercase;
   font-family: 'Ubuntu', sans-serif;
   font-weight: 400;
   color: rgba(255, 255,255, 0.85);
}
#form form .input-group .input-group-addon {
   width: 40px;
   text-align: center;
   height: 45px;
   border-radius: 0px;
   border: 1px solid #0e5a4c;
}
#form form .input-group .input-group-addon i {
   font-size: 1.2em;
}
#form form input.form-control {
   background: transparent;
   border: 1px solid rgba(14, 90, 76, 0.9);
   border-left: 0px;
   color: #fff;
}
#form form input.form-control::-webkit-input-placeholder {
   color: rgba(255, 255, 255, 0.5);
}
#form form button[type="submit"] {
   border-radius: 0px;
   margin-top: 1em;
}
#progress-form, #success-form, #error-form {
   display: none;
}
footer {
   padding: 1em;
}
form label {
   font-family: 'Ubuntu', sans-serif;
   font-weight: 300;
   text-transform: capitalize;
   color: #636363;
}
form input {
   border-radius: 0px !important;
   font-family: 'Quicksand', sans-serif;
   font-weight: 300;
}
table th {
   font-family: 'Ubuntu', sans-serif;
   font-weight: 300;
   font-size: .87em;
   text-align: center;
}
table td {
   font-family: 'Quicksand', sans-serif;
   font-weight: 300;
   font-size: .9em;
   text-align: right;
}
p {
   text-align: center;
}
p strong {
   text-transform: uppercase;
   font-family: 'Ubuntu', sans-serif;
   font-weight: 500;
}
p b {
   font-weight: 400;
   font-family: 'Ubuntu';
}
.bg-dark {
   background: #000;
}
.bg-one {
   background: #fe4c6e;
}
.bg-two {
   background: #0e5a4c;
}
.bg-three {
   background: #404c72;
}
.bg-four {
   background: #5a0e1d;
}
.bg-white {
   background: #fff;
}
.color-one {
   color: #fe4c6e;
}
.color-two {
   color: #0e5a4c;
}
.color-three {
   color: #404c72;
}
.color-four {
   color: #5a0e1d;
}

/*RESPONSIVE */
@media (min-width: 767px ) {
   #guest .desc {
      padding-left: 7em;
      padding-right: 7em;
   }
   .title {
      font-size: 2.5em;
   }
   .title2 {
      font-size: 2em;
   }
   #discount .title2 {
      font-size: 1.5em;
   }
}
@media (min-width: 1023px ) {
   #guest .desc {
      padding-left: 1.5em;
      padding-right: 1.5em;
   }
   #venue .getroute-content {
      padding: 0em 4em !important;
   }
}
@media (min-width: 1439px) {
   #cover .bg {
      max-height: 790px;
   }
   #cover .bg .caption-image {
      background-position: center 470px;
      background-size: 600px;
   }
   .counter {
      padding: 1em 1em;
      font-size: 1.4em;
   }
   .ticket {
      padding: 1.7em;
      font-size: 1.5em;
   }
   #intro {
      padding: 4em 0em;
   }
   #discount {
      padding: 2em 0em;
   }
   #desc {
      padding:6em 0em;
   }
   .data-item {
      font-size: 1.3em;
      padding-top: 75px;
      width: 62%;
      margin: auto;
      border-color: rgba(255, 255, 255, 0.5);
   }
   .data-item::before {
      width:80px;
      height: 80px;
      top: -40px;
      left: 42%;
   }
   .data-item::after {
      top: -25px;
      left: 49.2%;
      font-size: 1.6em;
   }
   .data-item .title {
      line-height: 30px;
   }
   .data-item p {
      margin: 0.2em auto;
   }
   #guest .desc {
      padding: 7em;
   }
   #guest .desc .title2 {
      font-size: 3em;
   }
   #guest .desc .list-awards li {
      margin: 1em auto;
   }
   #guest .desc .list-awards li i {
      font-size: 2.5em;
   }
   #guest .desc p {
      font-size: 1.1em;
   }
   #author {
      padding: 4em 0em;
   }
   #discount .discounted .number {
      font-size: 8em;
   }
   #discount .discounted i {
      font-size: 3.5em;
   }
   #discount .discounted span {
      font-size: 3em;
      line-height: 40px;
   }
   #discount .title2 {
      text-align: left ;
      font-size: 2.3em;
      margin-bottom: .4em;
   }
   #discount p {
      margin-bottom: 2em;
   }
   #venue .address {
      margin-bottom: 3em;
      margin-top: 2em;
   }
   #venue .address li {
      margin: auto 2em;
   }
   #venue {
      padding: 4em 0em 0em 0em;
   }
}

@media (max-width: 425px) {
   #form .container .caption {
      margin-bottom: 1em;
   }
    #form .caption img {
        height:60px;
    }
    #form h3 {
      font-size: 1.75em;
   }
   #form p {
      font-size: 1em;
   }
}
@media (max-width: 376px) {
   #desc a {
      display: block;
      margin-bottom: .5em;
   }
   #guest .desc p {
      font-size: 1em;
   }
}
