/* ---CSS RESET ---*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; }

/*---------------------Import Fonts---------------------------*/

@font-face {
  font-family: 'FuturaBT-Light';
  src: url('fonts/FuturaBT-Light.eot');
  src: url('fonts/FuturaBT-Light.eot?#iefix') format('embedded-opentype'),
    url('fonts/FuturaBT-Light.woff2') format('woff2'),
    url('fonts/FuturaBT-Light.woff') format('woff'),
    url('fonts/FuturaBT-Light.ttf') format('truetype'),
    url('fonts/FuturaBT-Light.svg#FuturaBT-Light') format('svg');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'FuturaBT-Medium';
  src: url('fonts/FuturaBT-Medium.eot');
  src: url('fonts/FuturaBT-Medium.eot?#iefix') format('embedded-opentype'),
    url('fonts/FuturaBT-Medium.woff2') format('woff2'),
    url('fonts/FuturaBT-Medium.woff') format('woff'),
    url('fonts/FuturaBT-Medium.ttf') format('truetype'),
    url('fonts/FuturaBT-Medium.svg#FuturaBT-Medium') format('svg');
  font-weight: 500;
  font-style: normal;
}



/* ------------------------------------- GENERAL ------------------------------------- */
html{  height:auto; width:100%; background-image:url(../img/wave.jpg); background-size:100% 100%;
			background-position: center center;
			background-attachment: fixed;
			background-repeat: repeat;
			-webkit-box-shadow:none; }
body { font-family: 'FuturaBT-Light'; font-size: 16px; height: auto; margin: auto; color: #ffffff; line-height: 1.7em; }
h1 { font-family: 'FuturaBT-Medium'; font-size: 32px; margin: auto; }
h2 { font-size: 24px; margin: auto; padding-top: 10px; padding-bottom: 10px; }

img { width: 100%; max-width: 100%; }
input { border:none; }

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color: #000000;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color: #000000;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color: #000000;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color: #000000;
}

button { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; border: none; margin-left:5px; }

button:focus, input:focus, input[type]:focus, .uneditable-input:focus {   
  border-color: rgba(3, 153, 158, 0.8);
  box-shadow: 0 1px 1px rgba(229, 103, 23, 0.075) inset, 0 0 8px rgba(5, 217, 96, 0.95);
  outline: 0 none;
}

.wrap { max-width: 500px; margin: auto; }

.logo {padding-top: 100px; max-width: 460px; margin: auto; }

.copy { padding:10px 40px; text-transform: capitalize; box-sizing: border-box;}

.copyright {max-width: 980px; margin: auto; margin-bottom: 20px; padding: 20px; bottom: 0; font-size: 10px; text-align: right; }

.subscribe { width: 100%; margin-top: 30px; margin-bottom: 120px;  box-sizing: border-box;
 }

.email { padding: 10px; font-size: 12px; width: 100%; box-sizing: border-box; }

.input { width: 80%; float: left; padding: 0; margin: 0; box-sizing: border-box; }

.button { width: 20%; float: left; padding: 0; margin:0; box-sizing: border-box; }

.btn-red { width: 100%; box-sizing: border-box; color: #ffffff; font-size: 12px; background-color: #e41838; padding: 10px; text-decoration: none; }
.btn-red:hover { background-color: #ffffff; text-decoration: none; color: #cc091b; }
.message { display: none; padding:0 40px; padding-bottom: 10px; font-weight: bold; font-size: 18px; }

@media screen and (max-width: 980px) {
	.wrap{ width: 100%; }
}

@media screen and (max-width: 526px) {

button { margin: 0; }
.message { padding: 10px; }
.logo { padding-top: 50px; width:317px; margin: auto; }
.copy { padding: 10px; }
.subscribe { margin: 0; padding: 10px; }

.input, .button { width: 100%; float: none; margin-top: 20px; }