
/* Default 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;}

/* 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;}
* { outline:none;}

p, li, a { font-family:'Maven Pro', sans-serif; }
h1,h2,h3,h4,h5,h6, .vl_steps li { font-family: 'Bree Serif', serif; }

body { background: #f3f3f3; height: 100%; position: relative; }
img { width: 100%; max-width: 100%; }

a { text-decoration: none; }

.vl_box { width: 1125px; margin: 0 auto; position: relative; z-index: 10; }
.vl_text_center { text-align: center; }

.vlog_button { border: none; padding: 15px 40px; font-size: 16px; color: #FFF; display: inline-block; clear: both; background: #da0a7b; text-transform: uppercase;
text-align: center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; margin: 4px 0 0 0; }
.vlog_button span { margin-right: -15px; margin-left: 10px; }
.vlog_button:hover { background: #bf046a; }

.vl_header { width: 100%; height: 55px; background:#fff; -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.075);
-moz-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.075); box-shadow: 0 2px 3px rgba(0, 0, 0, 0.075); }

.vl_header .vl_logo { display: block; width: 159px; padding: 6px 0; float: left; }
.vl_header .vl_link { float: right; width: auto; }

.vl_one_third { width: 33%; float: left; padding: 0 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.vl_one_fourth { width: 25%; float: left; padding: 0 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }


.vl_container_box { display: block; position: relative; width:100%; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.075);
-moz-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.075); box-shadow: 0 2px 3px rgba(0, 0, 0, 0.075); background: #FFF; border: 2px #fff solid; }

.vl_center_text { text-align: center; }

.vl_content { overflow: hidden; padding-bottom: 5px; }
.vl_content h3 { font-weight: normal; font-size: 35px; padding: 15px 0; }

.vl_container_box h4 { text-align: center; padding: 13px 0; color: #cf207e; font-size: 24px; }
.vl_container_box .vl_image_box { position: relative; padding-bottom: 0; border-bottom: 1px #f2f2f2 solid; }
.vl_container_box .vl_image_box img { position: relative; z-index: 2; }
.vl_container_box .vl_image_box .vl_price { position: absolute; display: inline-block; color: #fff; font-size: 28px; text-align: center; bottom: 25%; left: -2px; background: #fcb800; z-index: 5; padding: 15px 15px 7px 11px; }
.vl_container_box .vl_image_box .vl_price span { position: absolute; top: 4px; background: none; color: #2c2c2c; text-decoration: line-through; font-size: 13px; }
.vl_container_box .vl_text_box p { font-size: 20px; color: #545454; padding: 20px; text-align: center; line-height: 25px; }

.vl_text_box { height: 100px; }

form { padding-bottom: 60px; }

.vl_checkbox span { font-size: 25px; line-height: 40px; text-align: center; color: #dbdbdb; }
.vl_checkbox .active { display: none; color: #fff; }
.vl_checkbox .non-active { display: block; }

.vl_first_item  { margin-top: -3px; border: none; }
.vl_first_item .vl_container_box { border: none; }
.vl_first_item .vl_checkbox { bottom: 40%; top: auto; left: -20px; }

#checkboxes input[type=checkbox]{ display: none; }
#checkboxes input[type=checkbox]:checked + .vl_container_box { border: 2px #fcb800 solid; }
#checkboxes input[type=checkbox]:checked + .vl_container_box .active { display: block; }
#checkboxes input[type=checkbox]:checked + .vl_container_box .vl_checkbox { background: #fcb800; }
#checkboxes input[type=checkbox]:checked + .vl_container_box .non-active { display: none; }

.vl_checkbox { top: -5px; left: -5px; position: absolute; background: #FFF; width: 40px; height: 40px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2); box-shadow: 0 0 3px rgba(0, 0, 0, 0.2); }


/* Steps */
.vl_steps { overflow: hidden; }
.vl_steps li { float: left; padding: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.vl_steps li .vl_number_step { display: inline-block; float: left; width: 50px; line-height: 50px; text-align: center; height: 50px; color: #fcb800; background: #fff; font-size: 33px; -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.075);
-moz-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.075); box-shadow: 0 2px 3px rgba(0, 0, 0, 0.075);  -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; }
.vl_steps li .vl_number_text { font-size: 23px; color: #000; padding: 10px; display: block; float: left; width: 75%; padding-right: 20px; -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
        box-sizing: border-box; }

@media only screen and (min-width: 960px) and (max-width: 1124px) {
	.vl_box { width: 100%; } 
}
@media only screen and (min-width: 768px) and (max-width: 959px) {
	.vl_box { width: 100%; } 
}
@media only screen and (max-width: 767px) {
	.vl_box { width: 100%; } 
	.vl_one_fourth { width: 50%; padding: 10px 5px; }
	.vlog_button { font-size: 14px; padding: 12px 20px; }
	.vlog_button span { margin-right: 0; margin-left: 6px; }
	.vl_content h3 { font-size: 25px; padding: 15px 0 10px 0; }
	.vl_container_box h4, .vl_container_box .vl_image_box .vl_price { font-size: 20px; }
	.vl_header { height: 35px; }
	.vl_header .vl_logo { width: 88px; padding: 6px 5px; float: none; margin: 0 auto; }

	.vl_checkbox { width: 30px; height: 30px; }
	.vl_checkbox span { font-size: 25px; line-height: 30px; }

	.vl_footer .vl_link a { width: 200px !important; }

	.vl_header .vl_link { display: none; }
	.vl_first_item { margin-top: 0; }
	.vl_first_item .vl_checkbox { left: 0; right: 0; margin: 0 auto; bottom:-10px }
	
	.vl_one_third { text-align: center; }
	.vl_steps li { text-align: center; padding:18px 0 0 0; }
	.vl_steps li .vl_number_step { width: 40px; height: 40px; line-height: 38px; font-size: 25px; float: none; }
	.vl_steps li .vl_number_text { float: none; width: 100%; font-size: 16px; padding: 7px 5px; }
}
@media only screen and (min-width: 480px) and (max-width: 767px) {
	.vl_box { width: 100%; } 
	.vl_one_fourth { width: 50%; padding: 10px 10px; }
	
}



.vl_footer { z-index: 10; display: block; background: #FFF; height: 57px; position: fixed; bottom: 0; width: 100%;  -webkit-box-shadow: 0 -2px 3px rgba(0, 0, 0, 0.075);
-moz-box-shadow: 0 -2px 3px rgba(0, 0, 0, 0.075); box-shadow: 0 -2px 3px rgba(0, 0, 0, 0.075); }
.vl_footer .vl_link { text-align: center; width: 100%; }
.vl_footer .vl_link a { width: 250px; }