/* ======================= BASE */

@import url(http://fonts.googleapis.com/css?family=Josefin+Sans:100,300,400,600,700,100italic,300italic,400italic,600italic,700italic);

*, *:before, *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

a img{ border: none; text-decoration: none; }

html, body {
	background: url(_inc/img/BG@2x.png);
	height: 100%;
	width: 100%;
	overflow: hidden;
	font-size: 100%;
}

a { color: #fff; text-decoration: none; }

.icon-mail { font-size: .8em; margin-top: 2px; }

.announcement {
	background: transparent;
	border-top: 2px solid #fff;
	border-bottom: 2px solid #fff;
	color: #f9f9f9;
	padding: 22px 38px 17px 38px;
	display:inline;
    white-space:normal;
    font-size: 2.5em ;
    letter-spacing:inherit !important;
    word-spacing:inherit !important;
    *letter-spacing:0 !important;
    *word-spacing:0 !important;
	font-family: 'Josefin Sans', sans-serif;
	font-weight: 600;
	transition: box-shadow 1s;
	-moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    -webkit-animation-duration: 3.5s;
    -moz-animation-delay: 5s;
    -webkit-font-smoothing: antialiased;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
    -webkit-box-shadow: 0px 20px 300px -25px rgba(12,19,26,0.8);
	-moz-box-shadow: 0px 20px 300px -25px rgba(12,19,26,0.8);
	box-shadow: 0px 20px 300px -25px rgba(12,19,26,0.8);
}

.email {
	font-size: 1.3em;
	color: #f8f8f8;
	letter-spacing:inherit !important;
    word-spacing:inherit !important;
    *letter-spacing:0 !important;
    *word-spacing:0 !important;
	font-family: 'Josefin Sans', sans-serif;
	font-weight: 400;
	text-align: center;
	-webkit-animation-duration: 3s;
    -moz-animation-delay: 2s;
    -webkit-font-smoothing: antialiased;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
	height: 40px;
	margin: 50px 0px 0px 0px;
}

.soon {
	font-size: 1em;
	color: #f8f8f8;
	letter-spacing:inherit !important;
    word-spacing:inherit !important;
    *letter-spacing:0 !important;
    *word-spacing:0 !important;
	font-family: 'Josefin Sans', sans-serif;
	font-weight: 300;
	text-align: center;
	-webkit-animation-duration: 7s;
    -moz-animation-delay: 5s;
    -webkit-font-smoothing: antialiased;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
	height: 20px;
	margin: -10px 0px 0px 0px;
	opacity: .5;
}

h3 { font-weight: 400; }

.half { width: 50%; }

.left { float: left; }
.right { float: right; }


body {
	background: none;
}

div.logo {
	padding: 0px;
	height: 170px;
	padding-top: 22px;
}

h1 {
	font-family: 'Josefin Sans', sans-serif;
	font-weight: 200;
	font-size: 24px;
	color: #2E2E2D;
	margin-top: 15px;
}

h2 {
	font-family: 'Josefin Sans', sans-serif;
	font-size: 13px;
	color: #fff;
	display: inline;
	text-shadow: 1px 1px 2px #1a1109;
        filter: dropshadow(color=#1a1109, offx=1, offy=1);
}

span.dot {
	background: #83BC08;
	width: 22px;
	height: 10px;
	border-radius: 20px;
	margin: 0px 25px;
}

.container {
  	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -85px; /* the bottom margin is the negative value of the footer's height */
}
 
.box {
  height: auto;
  width: auto;
  position: absolute;
  margin: 0;
  left:0;
  top:0;
}

#f1_container {
  position: relative;
  margin: -30px 0px 0px 0px;
  width: 350px;
  height: 150px;
  z-index: 1;
}

#f1_container {
  -webkit-perspective: 1000px;
  -moz-perspective: 1000px;
  -o-perspective: 1000px;
  perspective: 1000px;
  z-index: 99;
}


#f1_card {
  width: 100%;
  height: 100%;
  -webkit-transform-style: preserve-3d;
  -webkit-transition: all 1.0s linear;
  -moz-transform-style: preserve-3d;
  -moz-transition: all 1.0s linear;
  -o-transform-style: preserve-3d;
  -o-transition: all 1.0s linear;
  transform-style: preserve-3d;
  transition: all 1.0s linear;
}

#f1_container:hover #f1_card, #f1_container.hover_effect #f1_card {
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  transform: rotateY(180deg);
}

.face {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;
}

.face.back {
  display: block;
  -webkit-transform: rotateY(180deg);
  -webkit-box-sizing: border-box;
  -moz-transform: rotateY(180deg);
  -moz-box-sizing: border-box;
  -o-transform: rotateY(180deg);
  -o-box-sizing: border-box;
  transform: rotateY(180deg);
  box-sizing: border-box;
  color: white;
  text-align: center;
}

#footer, .push {
	height: 85px; /* .push must be the same height as .footer */
	width: 100%;
	text-align: right;
	padding: 0px 5% 0px 0px;
}

#footer a {
	opacity: .7;
	transition: opacity 3s ease-in-out;
    -moz-transition: opacity 3s ease-in-out;
    -webkit-transition: opacity 3s ease-in-out;
}

#footer a:hover {
	opacity: .7;
}

.copyright {
	font-family: 'Josefin Sans', sans-serif;
    color: #fff;
    font-weight: 100;
    text-align: center;
    font-size: 10px;
    opacity: .4;
}

#mc_embed_signup {
	text-align: center;
	z-index: 999999;
	margin-top: 0px;
	margin-left: -35px;
}

#mc_embed_signup input[type="submit"] {
	background: #2E2E2D;
	margin: 0px 0 0 -5px;
	position: absolute;
	padding-right: 10px;
	width: 45px;
	height: 32px;
	color: #fff;
	display: inline;
	border-top-left-radius: 0px;
	border-bottom-left-radius: 0px;
}

input { 
	height: 32px;
	padding: 7px 10px 8px 15px;
	border-radius: 4px;
	border: 1px solid #2E2E2D;
	color: #46281D;
	font-family: 'Josefin Sans', sans-serif;
	width: 60%;
	display: inline;
	font-size: 13px;
}

::-webkit-input-placeholder { /* WebKit browsers */
    color:    #46281D;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #46281D;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #46281D;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    #46281D;
}

input:focus,
select:focus,
textarea:focus,
button:focus {
    outline: none;
}

.tell a {
	color: #fff;
	text-decoration: none; 
	font-size: 25px;
	font-family: 'Josefin Sans', sans-serif;
	padding: 0px 0px 0px 29px;
	opacity: .7;
}

@media (max-width: 800px) { 
	
	.announcement {
		font-size: 2em !important;
		padding: 15px 9px 10px 9px;;
	}
	
	#f1_container {
     	width: 229px !important;
     	height: 100px !important;
     	margin: -30px 0px 0px 0px !important;
     }

	
}


@media all and (orientation: portrait) {  
     #f1_container {
     	width: 100px;
     	height: 100px;
     	margin: -95px 0px 0px 0px;
     }
     
     #f1_container img { width: 150px; }
     
     #footer { padding: 8% 8% 0px 0px;}
     
     h1 { font-size: 4.2vw; }
     h2 { font-size: 2.4vw; }
     
     span.dot { margin: 0px 5px; height: 5px; width: 5px; }
     
     #footer a img{ width: 90px; }
     
     input { 
     	font-size: 9px;
     	width: 67%;
     }
     
     .tell a {
	color: #fff;
	text-decoration: none; 
	font-size: 14px;
	font-family: 'Josefin Sans', sans-serif;
	padding: 0px 0px 0px 13px;
	line-height: 35px;
	height: 35px;
	opacity: .7;
}

	#mc_embed_signup { margin: 75px 0 0 -35px; z-index: 999999;}
     
}