/* --------------------------------------
	CSS FOR RESORT MADNESS
	Client: Club wyndham
	developer: iurlad.com
	version: 1.0 - 02-2014
	- - - - - - - - - - - - - - - - - - -
	>>> SECTION: FORMS <<<
	-------------------------------------
											*/

/* 	CSS RESET
	- - - - - - - - - - - - - - - - - - - - -
	http://meyerweb.com/eric/tools/css/reset/ 
   	v2.0 | 20110126
   	License: none (public domain)
*/

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;
}

/* 	BASIC CSS
	- - - - - - - - - - - - - - - - - - - - - */
body {
font-family:Arial, Helvetica, sans-serif;
color:#fff;
font-size:14px;
}

.wrapper {
width:100%;
max-width:810px;
height:1460px;
margin: 0px auto;
position:relative;
}

.logo {
width: 100%;
height:auto;
clear:both;
display:block;
margin:0px;
}

.intro {
margin:0px;
padding: 20px 5%;
text-align:center;
line-height:16px;
}

a {
color:#fff;
}

a:hover {
color:#ff9c4c;
}

/* 	BRANDS CUSTOMS
	- - - - - - - - - - - - - - - - - - - - - */
.svc {
background: url(images/bk_svc_form.jpg) top center no-repeat;
}

.cw {
background: url(images/bk_cw_form.jpg) top center no-repeat;
}

.wbw {
background: url(images/bk_wbw_form.jpg) top center no-repeat;
}


/* 	FORM STYLES
	- - - - - - - - - - - - - - - - - - - - - */
.form {
width:70%;
margin: 0 auto;
}

.form div {
display:block;
margin-bottom:10px;
}

.form .half {
width:48%;
}

.form .left {
float:left;
}

.form .right {
float:right;
}

.form .full {
width:100%;
float:left;
}

.form .description {
display:Block;
clear:both;
margin-bottom:5px;
}

.form div input.text{
width:100%;
height:22px;
padding:4px;
background:#ffffff;
border:0px;
-moz-box-shadow: inset 0 0 3px 3px #b7b7b7;
-webkit-box-shadow: inset 0 0 3px 3px #b7b7b7;
box-shadow: inset 0 0 3px 3px #b7b7b7;
}

.form div select {
width:101.5%;
height:30px;
padding:6px 4px;
background:#ffffff;
border:0px;
-moz-box-shadow: inset 0 0 3px 3px #b7b7b7;
-webkit-box-shadow: inset 0 0 3px 3px #b7b7b7;
box-shadow: inset 0 0 3px 3px #b7b7b7;
}

.form div.check {
margin-bottom:20px;
}

.form .check .checkbox {
display:inline-block;
clear:none;
float:left;
width:15px;
margin: 2px 1.2% 0 0;
}

.form .check .description {
display: inline-block;
clear:none;
float:left;
width: 95.5%;
line-height:18px;
}

.form .controls {
margin:10px auto;
width:100%; 
position:Relative;
clear:Both;
}

.button_text {
width:409px;
height:86px;
display:block;
margin:0px auto;
float:none;
position:relative;
clear:Both;
border:0px;
background:url(images/bt_submit.png) top left no-repeat;
text-indent:-99999px;
cursor: pointer;
}

.button_text:hover {
background-position:  left -85px;
cursor: pointer;
}

/* 	FOOTER
	- - - - - - - - - - - - - - - - - - - - - */
.form-footer {
/* Fallback for web browsers that doesn't support RGBa */
background: rgb(37, 37, 37);
/* RGBa with 0.6 opacity */
background: rgba(37, 37, 37, 0.4);
width:100%;
display:block;
position:absolute;
bottom:0px;
z-index:20;
}

.form-footer p {
padding: 20px 25px;
font-size:14px;
line-height:18px;
text-align:center;
}

.form-footer p b {
font-weight:bold;
}

.button_text, .logo, .form, .intro {
z-index:20;
position:relative;}


/*      -------------------------------------
	   - | - | - RESPONSIVE - | - | -
	- - - - - - - - - - - - - - - - - - -
	>>> SECTION: FORMS <<<
	-------------------------------------
											*/
@media only screen and (max-width: 767px) {

/* 	BRANDS CUSTOMS
	- - - - - - - - - - - - - - - - - - - - - */
.svc {
background: url(images/bk_svc_form_mobile.jpg) top center no-repeat #000;
position:Relative;
}

.cw {
background: url(images/bk_cw_form_mobile.jpg) top center no-repeat #043989;
}

.wbw {
background: url(images/bk_wbw_form_mobile.jpg) top center no-repeat #000056;
}

.bottom {
width:100%;
height:465px;
display:block;
position:absolute;
bottom:0px;
z-index:10;
}

.svc .bottom {
background: url(images/bottom_mobile.jpg) bottom center no-repeat;
}

.cw .bottom {
background: url(images/bottom_mobile_cw.jpg) bottom center no-repeat;
}

.wbw .bottom {
background: url(images/bottom_mobile_wbw.jpg) bottom center no-repeat;
}

/* 	BACKGROUND RESIZE
	- - - - - - - - - - - - - - - - - - - - - */
.wrapper {
background-size:100% auto;
height:1600px;
}


/* 	FORM ELEMENTS
	- - - - - - - - - - - - - - - - - - - - - */
.form .check .description {
display: inline-block;
clear:none;
float:left;
width: 94%;
line-height:18px;
}

.button_text {
width:87%;
background-size:100%;
height:0px;
padding-bottom:18%;
margin-bottom:350px;
}

.button_text:hover {
background-position: left 97.5%; 
cursor: pointer;
}

}

@media only screen and (max-width: 480px) {
.wrapper {
min-width:300px;
}

/* 	FORM ELEMENTS
	- - - - - - - - - - - - - - - - - - - - - */

.form .half {
width:100%;
}

.form .check .description {
display: inline-block;
clear:none;
float:left;
width: 90%;
line-height:18px;
font-size:12px;
}

.button_text {
width:100%;
background-size:100%;
height:0px;
padding-bottom:21%;
margin-bottom:350px;
}

.button_text:hover {
background-position: left 98%; 
cursor: pointer;
}


}