header{background: #fff; width:100%; padding:15px 0 5px 0; }
#top-msg{background:rgba(10, 10, 10, 0.5); -moz-box-shadow: 3px 3px 3px rgba(0,0,0,0.3);-webkit-box-shadow: 3px 3px 3px rgba(0,0,0,0.3);box-shadow: 3px 3px 3px rgba(0,0,0,0.3); margin-bottom:20px; color:#CCC; line-height:16px;}
#top-msg-wp{ padding:15px 15px 0 15px;}

#top-msg a{ color:#fff; }

#top-nav ul{ float:right; margin-top:25px;  margin-right:-10px; font-weight:bold; font-size:12px;}
#top-nav ul a { color:#7d7d7d; text-decoration:none;}
#top-nav ul a:hover, #top-nav ul a#active{ color:#323232;}
#top-nav ul li {background:url(http://www.ansonika.com/mastenia/img/menu_footer_divider.png) left center no-repeat; float:left; padding-left:10px; margin-right:10px }
#top-nav ul li:first-child{ background:none;}
#shadow {background: url(http://www.ansonika.com/mastenia/img/shadow_top.png) repeat-x 0 0; height:4px; width:100%; position:absolute; left: 0; top:0; z-index:99}
#shadow_2 {background: url(http://www.ansonika.com/mastenia/img/shadow_bottom.png) repeat-x 0 0; height:4px; width:100%; position:absolute; left: 0; bottom:0; z-index:99}

#top-nav ul li a#purchase { color: #C33;}
#top-nav ul li a#purchase:hover { color:#323232;}

/* Button Responsive Menu*/
.btn-responsive-menu{display: none;float: right;padding:5px;cursor:pointer;margin:  0px 0 0 0;color: #ffffff;text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);background:#333;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;}
.icon-bar {display: block;width: 18px;height: 2px;margin:5px;background-color: #f5f5f5;-webkit-border-radius: 1px;-moz-border-radius: 1px;border-radius: 1px;-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);}
.show{display:block!important}

/* #Site Footer
================================================ */
footer {border-top: 2px solid #ddd; padding-top:10px; margin-top:30px; margin-bottom:30px;}	
.copy { font-size:12px; padding-top:10px;text-align:right;}

/* #Content
================================================ */
#content_1, #content_2, #content_3, #content_4 { padding-top:40px}
#content_1 article, #content_2 article { margin-bottom:25px !important;}

#form_area { background: url(../img/blur_1.jpg) no-repeat top center; width:100%; padding: 60px 0; position:relative; color:#fff; }
#form_area_reserv { background: url(../img/blur_2.jpg) no-repeat top center; width:100%; padding: 60px 0; position:relative; color:#fff; border-bottom: 4px solid #CCC; border-top: 4px solid #CCC}
#form_area_survey { background:#356070; width:100%; padding: 60px 0; position:relative; color:#fff; border-bottom: 4px solid #CCC; border-top: 4px solid #CCC}

.container2 { background: url(http://www.ansonika.com/mastenia/img/white_bg_15.png) repeat; padding:30px; }
.box { border-top: 4px solid #CCC}
.box a {background:#f6f6f6 top right no-repeat ; height:90px; text-align:center; padding-top:30px; margin-bottom:20px; width:100%; display:block; -webkit-transition: background .6s ease;-moz-transition: background .6s ease;-ms-transition: background .6s ease; -o-transition: background .6s ease;transition: background .6s ease;}
.box a:hover {background:#c9eaee url(http://www.ansonika.com/mastenia/img/plus_corner.png) no-repeat bottom right;}
.about_strip { text-align:center;}

h3.question { font-size:16px; font-weight:600; padding-bottom:10px; border-bottom:3px double #fff; text-shadow: 1px 1px 1px rgba(0,0,0,.4); color:#fff; margin-bottom:20px; display:inline-block; line-height:20px; width:100%;}

/*============================================================================================*/
/* 2. PAGE AND CONTENT */
/*============================================================================================*/
.button-back { float: left; }
.button-next { float: right; }
a.button-back, a.button-next {text-decoration:none; color:#fff; }
.button-back, .button-next {
	 color: #fff; cursor: pointer; padding: 8px 20px; text-decoration: none; background: #f37410 url(http://www.ansonika.com/mastenia/img/bg_button_yellow.png) repeat-x 0 0; font-weight:700;
	-khtml-border-radius: 4px; -moz-border-radius: 4px; -opera-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; border-top: 1px solid #fac068; border-left: 1px solid #fac068;
	-moz-box-shadow: 1px 2px  2px rgba(0,0,0,0.3);-webkit-box-shadow: 1px 2px 2px rgba(0,0,0,0.3);box-shadow: 1px 2px 2px rgba(0,0,0,0.3); text-shadow: 1px 1px 1px rgba(0,0,0,.4); font-size:12px;}
	
.ie10 .button-back, .ie10 .button-next { border-radius: 0;}
.button-back:hover, .button-next:hover{color: #333; text-shadow: 1px 1px 1px rgba(255,255,255,.8); text-decoration: none; }

.step {clear: left; background:rgba(10, 10, 10, 0.5); padding:30px 60px; -moz-box-shadow: 3px 3px 3px rgba(0,0,0,0.4);-webkit-box-shadow: 3px 3px 3px rgba(0,0,0,0.4);box-shadow: 3px 3px 3px rgba(0,0,0,0.4);}

.step label { color: #fff; display: block; margin-bottom:3px;  text-shadow: 1px 1px 1px rgba(0,0,0,.4); position:relative; }
.step legend { font-size:11px}

.error-image { background: #111 url('../muimg/alert.png') no-repeat right top;}
ul.stepy-titles { margin:0; padding:0;}
.stepy-titles { list-style: none; margin: 0; padding: 0; width: 100%;  color:#fff; margin-bottom:0; height:40px; }
.stepy-titles li:first-child {margin-left:0;}
.stepy-titles li { cursor: pointer; float: left; padding: 7px 20px; background:#000; font-weight:600; margin-bottom:0px;  margin-left:2px; position:relative; font-size:16px; }
.stepy-titles li span { font-size:11px; display: block; font-weight:normal; }
.stepy-titles .current-step { cursor: auto; background:#02d16e; padding: 7px 20px;  }
div .smlicn {color:#02d16e;}
input.error{ border-bottom:1px solid #C00}
label.error {background: #ff0000 url(alert.png) no-repeat 5px 5px; color: #fff; display: block; float: left; font-size: 11px ; height: 20px; padding: 6px 10px 0px  25px;  font-weight:400; margin:8px 5px 0 0; -khtml-border-radius: 5px; -moz-border-radius: 5px; -opera-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; background-clip: border-box;}
.ie10 label.error {border-radius: 0; }
input[type="submit"].finish:hover, input[type="submit"].finish:active {color: #333; text-shadow: 1px 1px 1px rgba(255,255,255,.8);}


/*============================================================================================*/
/* 3. MISC */
/*============================================================================================*/
.magnify_2{ background:url(http://www.ansonika.com/mastenia/img/zoom_1.png) no-repeat 50% 50%; display:none; height:92%; left:0; position:absolute; top:0; width:100%; z-index:999; text-align:center; line-height:160px; font-weight:600; font-size:11px; color:#fff }
.pictures div{ position:relative}
.line{ border-left:1px dotted  #ccc; padding-left:35px;}

/* list bullets*/
ul.list_3{ margin-left:10px; margin-bottom:20px;}
ul.list_3 li{background:url(http://www.ansonika.com/mastenia/img/tick_1.png) no-repeat left 3px;line-height:18px;padding-left:20px;}

/*============================================================================================*/
/* 4. MEDIA QUERIES */
/*============================================================================================*/


/* Tablet Portrait size to standard 960 (devices and browsers) ================================== */
@media only screen and (min-width: 768px) and (max-width: 959px) {
.step {padding:30px 45px; }
input[type="text"],
	input[type="password"],
	input[type="email"],
	input[type="number"],
	input[type="date"],
	textarea{ width:100%}
	select{ width:100%}
input.long{ width:90%}
}



/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {
#form_area, #form_area_reserv, #form_area_survey { padding: 30px 0;}
input[type="text"],
	input[type="password"],
	input[type="email"],
	input[type="number"],
	input[type="date"],
	textarea { width:97%}
	select{ width:97%}
.step {padding:30px ; }
input.long{ width:97%}
.columns.line{ background:none }
.line{padding-top:35px; padding-left:0; border-left:none;}
.stepy-titles li {padding: 15px 10px;  font-size:12px; }
.stepy-titles li span { display:;font-size:08px; }
.stepy-titles .current-step { padding: 15px 10px;  }

#top-nav		{width:100%;float:left;}
#top-nav			{display:;font-size:08px;}
#top-nav ul	{float: none; padding:10px 0; margin:0;}
#top-nav ul li 	{float: none; border-top: 1px solid #ddd; font-size:14px; padding:0; margin:0;}
#top-nav ul li a	{ display:block; padding:5px;}
#top-nav ul li a:hover{ background-color:#ddd;}
#top-nav ul a#active{ color:#323232; background-color:#ddd;}
.btn-responsive-menu{display:block;}	

footer ul.social-bookmarks {float:none;  display:block;  text-align:center;}	
ul.social-bookmarks li{ display:inline-block; float:none}

.copy {padding-top:20px; text-align:center}

}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
input[type="text"],
	input[type="password"],
	input[type="email"],
	input[type="number"],
	input[type="date"],
	input[type="hidden"]	{ width:100%}
input.long{ width:97%}
select{ width:97%}
textarea.uniform { width:97%; min-height:95px;}


#form_area, #form_area_reserv, #form_area_survey { padding: 30px 0;}

.step {padding:30px ; }
.columns.line{ background:none }
.line{padding-top:35px; padding-left:0; border-left:none;}
.stepy-titles li {padding: 15px 10px;  font-size:12px; }
.stepy-titles li span { display:;font-size:08px; }
.stepy-titles .current-step { padding: 15px 10px;  }

#top-nav		{width:100%;float:left;}
#top-nav			{display:;font-size:08px;}
#top-nav ul	{float: none; padding:10px 0; margin:0;}
#top-nav ul li 	{float: none; border-top: 1px solid #ddd; font-size:14px; padding:0; margin:0;}
#top-nav ul li a	{ display:block; padding:5px;}
#top-nav ul li a:hover{ background-color:#ddd;}
#top-nav ul a#active{ color:#323232; background-color:#ddd;}
.btn-responsive-menu{display:block;}	

footer ul.social-bookmarks {float:none;  display:block;  text-align:center;}	
ul.social-bookmarks li{ display:inline-block; float:none}

.copy {padding-top:20px; text-align:center}

}