@charset "utf-8";

/*
background:#
fuchia:#733456
*/

/*
Table of Content
==================================================
	1#Reset & Basics
	2#Global properties
	3#Fonts
	4#Classes
	5#Links
	6#Displays
	7#Header
	8#Hoovers
	9#Navigation
   10#Slider
   11#Filter
   12#Pages
   13#Contact Form
   14#Footer
   15#Misc
*/

/*--- 1#Reset & Basics (Inspired by E. Meyers) --- */
a,abbr,acronym,address,applet,article,aside,audio,b,blockquote,big,body,center,canvas,caption,cite,code,command,datalist,dd,del,details,dfn,dl,div,dt,em,embed,fieldset,figcaption,figure,
font,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,keygen,label,legend,li,meter,nav,object,ol,output,p,pre,progress,q,s,samp,section,small,span,source,
strike,strong,sub,sup,table,tbody,tfoot,thead,th,tr,tdvideo,tt,u,ul,var{background:transparent;border:0 none;font-size:100%;margin:0;padding:0;border:0;outline:0;vertical-align:top;}ol, ul {list-style:none;}blockquote, q {quotes:none;}table, table td {padding:0;border:none;border-collapse:collapse;}img {vertical-align:top;}embed {vertical-align:top;}input[type=text], textarea{ outline:none;border-radius:0;}


article,aside,audio,canvas,command,datalist,details,embed,figcaption,figure,footer,header,hgroup,keygen,meter,nav,output,progress,section,source,video{display:block}
mark,rp,rt,ruby,summary,time{display:inline}
/*--- 2#Global properties ---*/
html {width:100%}

/*--- 3#Fonts ---*/
body {font-family: 'Roboto', sans-serif;font-size:13px; line-height:19px; color:#424242; min-width:1030px; background:url(../images/bg.png) 50% 0 repeat;-webkit-text-size-adjust: none;}
h2, .h2, .h3, .sf-menu a{font-family: 'Roboto', sans-serif;font-weight:900;}
p {font-size:14px;}

.main{width: 940px;margin: 0 auto;}

.reg {text-transform:uppercase}
.f_left {float:left}
.f_right {float:right}
.align_right {text-align:right}
.align_center {text-align:center}

.it{font-style:italic}
.let{letter-spacing:-1px}

/*--- 4#Classes ---*/
.m_bottom_zero{ margin-bottom:0 !important;}
.m_left_zero{ margin-left:0 !important;}
.p_bottom_zero{ padding-bottom:0 !important;}
.p_left_zero{ padding-left:0 !important;}
	
.clear {clear:both;width:100%;line-height:0;font-size:0;}
.wrapper {width:100%;overflow:hidden}
.extra_wrapper{ overflow:hidden;}
.container{width:100%}
.extra_last, .last{ margin-bottom:0 !important; padding-bottom:0 !important;}
.extra_last{ border:none !important; background:none !important;}
.bg_none{ background:none !important;}
.bg_none:after{display: none !important;}

/*--- 5#Links ---*/
a {color:#424242;outline:none; text-decoration:none; cursor:pointer;}
a:hover{ color:#733456; text-decoration:none;}

/*--- 6#Displays ---*/
.block{ display:block;}
.inline-block{ display:inline-block;}

/*--- 7#header ---*/
header {width: 100%;position: fixed; background: #000;height: 100px;left: 0;top: 0;z-index: 10;}
header .inner{padding: 16px 0 0 0;}
header h1{float: left;margin-top: -16px;}
header h1 a {display:block;width:180px;height:100px;background:url(../images/logo.png) 0 0 no-repeat; text-decoration:none; text-indent:-9999px;}


p {margin-bottom:19px}
.p2{ margin-bottom:41px;}


.list1{}
.list1 li{ background:url(../images/marker1.png) 0 7px no-repeat; padding-left:20px;}
.list1 a{}

.list2{}
.list2 li{ background:url(../images/marker2.png) 0 7px no-repeat; padding-left:20px;}
.list2 a{}

.list3{}
.list3 li{ background:url(../images/marker3.png) 0 7px no-repeat; padding-left:20px;}
.list3 a{}


h2,h3{ font-weight:bold;}
h4, h5{ font-weight:normal;}
h2{font-size: 28px; line-height: 29px; color:#4e4e4e;margin-bottom: 10px;}
h2.h2{background: url('../images/stripe1.png') 0 bottom repeat-x;padding-bottom: 26px;}

h2.ind{ margin-bottom:46px;}
h2.ind1{ margin-bottom:px;}
h2.ind2{ margin-bottom:px;}

h3, .h3{font-size: 24px; line-height: 34px; color:#4e4e4e;}
h3.ind1{ margin-bottom:px;}
h3.ind2{ margin-bottom:px;}
h3.ind3{ margin-bottom:px;}

h4, h4 a{font-size: 24px; line-height: 29px; color: #4e4e4e;}
h4 a:hover{color: #733456;}

h5{font-size: 20px; line-height: 24px; color: #4e4e4e;margin-bottom: 21px;}
h5.ind{margin-bottom: 19px;}


/*--- 8#hovers ---*/
.sf-menu li, .element, #product .element a, #product .element .description, #product .element .text, #filter a, .button, .product1 a, .product1 .text, .service .inner{-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;}

.flex-direction-nav a, .social_box img, .sf-menu a{-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease;}
/*********************************page_1*************************************/
.ext_list>li, .ext_box, .ext_box1{ overflow:hidden;}
.ext_list>li>figure, .ext_box>figure, .ext_box1>div{ float:left;}
.ext_list>li>div, .ext_box>div, .ext_box1>figure{overflow:hidden;}
.ext_box1>figure{display: block;}


/*--- 9#Navigation ---*/
nav{ position:relative; margin: 0px -14px 0 0;float: right;}
.sf-menu ul {position:absolute;top:-999px; display:none;/* left offset of submenus need to match (see below) */}
.sf-menu ul li {width:100%}
.sf-menu li {float:left;position:relative}

.sf-menu>li>a{display:block;position:relative; font-size: 20px; font-weight: 800; line-height: 26px; color:#4e4e4e;padding: 16px 12px 18px;border-radius: 3px;background: url('../images/spacer.gif') repeat;}
.sf-menu>li>a:hover,.sf-menu>li.current>a{background-color: #733456;color: #fff;}
.sf-menu>li:hover,.sf-menu>li.current,.sf-menu>li.sfHover{}

.sf-menu>li{margin-left: 2px;}
.sf-menu a{}

#menu-icon{display: none;}
/*==>> NAV RESPONSIVE LAYOUTS <<==*/
@media only screen and (max-width: 995px) {
  .sf-menu>li>a{font-size: 16px;font-weight: 600;line-height: 19px;padding: 4px 10px;}
}

@media only screen and (max-width: 767px) {
  #menu-icon{display: block;background:url("../images/menu-icon.png") center -27px no-repeat #733456;width: 60px;height: 40px;font-size: 22px; line-height: 28px;position: absolute;top: 15px;right: 0px;cursor: pointer;border-radius: 3px;}
  #menu-icon:hover{background-color: #000;}
  .sf-menu{position: absolute;display: none;top: 55px;right: 0;width: 170px;background: #fff;padding: 10px 0;border-radius:3px; }
  .sf-menu>li>a{font-size: 13px;font-weight: 600;line-height: 17px;padding: 4px 8px;}
  .sf-menu>li{float: none;margin: 0 2px 1px;}
  #menu-icon.active{background:url("../images/menu-icon-active.png") center 11px no-repeat #733456;}
  #menu-icon.active:hover{background-color: #000;}
  
}

@media only screen and (max-width: 479px) {
	
}

/*--- 10#Slider ---*/
/* Browser Resets */
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus  {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;} 

/* FlexSlider Necessary Styles
*********************************/ 
.flexslider {width: 100%; height: 712px; padding: 0;overflow: hidden;}
.flexslider .slides > li {display: none; position: relative; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {width: 100%; display: block;}
.flex-pauseplay span {text-transform: capitalize;}

/* Clearfix for the .slides element */
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} 
html[xmlns] .slides {display: block;} 
* html .slides {height: 1%;}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}


/* FlexSlider Default Theme
*********************************/
.flexslider {position: relative;}
.flexslider .banner{position: absolute;width: 100%;top: 0;left: 0;text-align: center;}
.flexslider .inner{font-size: 42px; line-height: 51px; color: #fff;padding-top: 234px;}
.flexslider .title1, .flexslider .title2{padding: 8px 20px 12px;display: inline-block;}
.flexslider .title1{background: #733456;margin-bottom: 3px;}
.flexslider .title2{background: #000;}

.flex-viewport {}
.loading .flex-viewport {max-height: 300px;}
.flexslider .slides {zoom: 1;}

/* Direction Nav */
.flex-direction-nav a {width: 73px; height: 73px; margin: 0px 0 0; display: block;  position: absolute; top: 309px; cursor: pointer; text-indent: -9999px;z-index: 99; border-radius: 3px;}
.flex-direction-nav .flex-prev {left: 10px;background: url('../images/prev.png') 23px 10px no-repeat #070707;}
.flex-direction-nav .flex-next {right: 10px;background: url('../images/next.png') 23px 10px no-repeat #070707;}
.flex-direction-nav a:hover{background-position: 23px -182px;background-color: #733456;}


/* Control Nav */
.flex-control-nav {width: 100%; position: absolute; bottom: 0px; text-align: center;}
.flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-paging li a {width: 11px; height: 11px; display: block; background: url('') repeat;cursor: pointer; text-indent: -9999px;}
.flex-control-paging li a:hover, .flex-control-paging li a.flex-active{ background-position:0 0;}

.flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;}
.flex-control-thumbs li {width: 25%; float: left; margin: 0;}
.flex-control-thumbs img {width: 100%; display: block; cursor: pointer;}
.flex-control-thumbs img:hover {opacity: 1;}
.flex-control-thumbs .active {opacity: 1; cursor: default;}

@media screen and (max-width: 860px) {
  
}

/*--- 11#filter ---*/
.isotope-item {z-index: 2;}
.isotope-hidden.isotope-item {pointer-events: none;z-index: 1;}
.element{margin: 0 0px 20px 20px;overflow: hidden;width: 300px;height: 269px;}

.element>a{display: block;}
.element>a figure{display: block;position: relative;}

#container{margin-left: -20px;/*height: 867px;*/overflow: hidden;}
.filter_box{position: relative;padding-top: 40px;}
#filter{position: absolute;right: 0;top: -66px;}
#filter>li, .tags>li{display: inline-block;margin-left: 3px;}
#filter>li a, .tags a, .button{display: inline-block;border-radius: 3px;background: #ededed;text-align: center;padding: 6px 12px 8px;font-weight: bold;}
#filter>li:hover a, #filter a.selected, .tags a:hover, .button:hover{background: #733456;color: #fff;}


/*--- 12#PAGES ---*/

/* content */
#content {padding:0 0px 0px;position: relative;z-index: 1;}
.cont_pad{padding:0 0 0 0 !important;}

#pages{position: relative;}
#pages>li{width: 100%;}

#home>.inner{padding-top: 86px;}
#home{}

/* about page */


/* Process Page */
.box1{position: relative;padding: 23px 0 27px;margin-bottom: 54px;}
.box1:after, .box1:before{display: block;position: absolute;width: 100%;height: 1px;background: url('../images/stripe1.png') repeat-x;content: "";}
.box1:after{bottom: 0;}
.box1:before{top: 0;}

#about>.inner, #processes>.inner, #product>.inner, #shop>.inner, #get_in_touch>.inner{padding-top: 110px;}

.process{float: left;text-align: center;position: relative;padding: 0;}
.process .img_wrap{ display: inline-block;overflow: hidden;margin-bottom: 3px;}

.process>.inner{margin-right: 11px;padding: 0 0 5px;position: relative;display: block;}
.process span{display: block;}
span.text {font-size: 12px; font-weight:bold; color:#4e4e4e; }
.process1, .process3{width: 308px;}
.process2{width: 321px;}
.process2>.inner{margin: 0 11px;}
.process3>.inner{margin-left: 11px;}



/* Products Page */
#product{z-index: 10;}
#product .main{padding-top: 24px;margin-bottom: 10px;}

.filter_box{background: url('../images/stripe1.png') 0 bottom repeat-x;padding-bottom: 31px;margin-bottom: 23px;}
#product .element {float:left;}
#product .element>a{display: block;}
#product .element .description{height: 0;color: #fff;left: 0;bottom: 0;display: block;position: absolute;width: 100%;overflow: hidden;background: url('../images/description_bg.png') repeat;}
#product .element .description .inner{display: block;padding: 10px 10px 10px ;}
#product .element .text, .product1 .text{display: block;background: url('../images/marker.png') 270px -100% no-repeat #ededed;padding: 14px 0 16px 10px;font-weight: bold;border-radius: 0 0 4px 4px;}
#product .element figure{position: relative;}
#product .element a:hover .description{height: 76px;}
#product .element a.text:hover, .product1 a.text:hover{background-color: #733456;background-position: 270px 50%;}
#product .element a:hover, .product1 a:hover{color: #fff;}
.product_box{position: relative;}

#container{/*min-height: 867px;*/}


.social_plugins{overflow: hidden;}
.social_plugins>div{margin: 10px 0 0;display: inline-block;}

.tags{position: absolute;top: -1px;right: 0;}

.info_box{margin-bottom: 25px;}
.info_box>div{width: 290px;margin-right: 29px;}
.info_box>figure{margin: 4px 0px 0 0;}

.button{margin-top: 25px;}

.product1{width: 300px;float: left;}

.m_left{margin-left: 20px;}
.m_bot1{margin-bottom: 50px;}


/* Contact Page */
#get_in_touch{z-index: 1;padding-bottom: 150px;}
#contact-form .row{overflow: hidden;}
#contact-form .row label{width: 300px;display: block;float: left;margin-left: 20px;}
#contact-form .row label:first-child{margin-left: 0;}

.info{float: left;margin: -5px 0 0;width: 300px;}
.info h5{margin-bottom: 19px;}
.contact_info{}
.contact_info span{color: #909090;}
.contact_info{}

/*--- 13#Contact form ---*/
#contact-form {padding:0px 0 0 0;width: 640px;float: left;}
#contact-form .success {width:246px;  padding:10px;}
#contact-form textarea, #contact-form input {margin:0;font-size:13px; border:1px solid #cacaca; border-radius: 3px; color:#909090; padding:13px 18px 15px;outline:none; position:relative; font-family: 'Open Sans', sans-serif;background:#f6f6f6;}
#contact-form input {width:262px;}
#contact-form textarea {overflow:auto; width:582px; height:128px;resize:none; float:left; margin: 0 0 0 0;}	
#contact-form label {display:block; min-height:67px; overflow:hidden;}	
#contact-form label.message { display:block; padding-bottom:0; }
#contact-form .button {margin-left:8px;}	
#contact-form .error, #contact-form .empty, #contact-form .success {display:none;}	
#contact-form .error, #contact-form .empty {text-align:left; color:red; font-size:11px; clear:both;}
#contact-form .buttons2 {overflow:hidden; position:relative; clear:both; padding-top:20px;}
#contact-form .buttons2 a{cursor:pointer;	margin-right:4px;	display: inline-block;text-align:center;font-size:24px;line-height:29px;color:#cacaca;background: #4e4e4e;border-radius: 3px;padding: 7px 18px 8px;}
#contact-form .buttons2 a:hover{background: #733456;color: #fff;}

#contact-form span{ display:block; margin: 0px 0 0 5px;}
.formerror {color: #ff0000;padding-left: 15px;}	
.formsuccess {display: none;}
.contactformHide {display: none;}

#thankyou, #formerror {
	position: relative;width: 700px;margin: 200px auto 0 auto;padding: 20px 0 0 20px;
	background:url(../images/pattern.jpg) top left repeat;
	font-size: 24px;color: #272727;text-shadow: 0 1px 0 #fff;overflow: hidden;
}	


.map_wrapper{overflow:hidden;position: relative;display:block;margin-bottom:50px;}
.map_wrapper:before{display: block;position: absolute;width: 100%;height: 10px;top: -5px;left: 0;box-shadow: inset 0 5px 5px rgba(1,1,1,0.75);content: "";}
.map_wrapper:after{display: block;position: absolute;width: 100%;height: 10px;bottom: -5px;left: 0;box-shadow: inset 0 -5px 5px rgba(1,1,1,0.75);content: "";}
#map_canvas {width:100%;height:550px;}
.adress{}
.adress span{ display:inline-block; width:74px;}
.adress dt{ margin-bottom:14px;} 

.demo{}
.demo:hover{ text-decoration:underline;}

/*--- 14#footer ---*/
#footer{background: #000 !important;border-top: 7px solid #733456;height: 102px !important;color: #fff;}

.footer {padding:39px 0 26px;}
.social{ overflow:hidden;padding-right: 2px;float: right;}
.social a{ display:block; float:left;height:24px; overflow:hidden; margin-left:17px;}
.social a:first-child{margin: 0 0 0 0;}
.social a:hover img{ margin-top:-24px;}
.privacy{float: left;padding-top: 2px;}

/*==================================RESPONSIVE LAYOUTS===============================================*/
@media screen and (min-width: 1000px) and (max-width: 1023px) {
	nav a{font-size:20px;}
}
@media only screen and (max-width: 1024px) {
	body{min-width:960px;}
	nav{margin: 0 0px 0 0;}
	.flexslider{height: 508px;}
	.flexslider .inner{font-size: 28px; line-height: 36px;padding-top: 200px;}
	.box1{padding-left: 10px;padding-right: 10px;}
}
@media only screen and (max-width: 995px) {
 body{min-width:920px;}
 .main{width: 900px;}
 .sf-menu>li>a{font-size: 20px;line-height: 24px;}
 #container .element img, .info_box img, .product img, .process img {width: 100%;}
 #container .element, .product,  .process{width: 286px;}
 .process2:before, .process:after{display: none;}
 #contact-form{width: 600px;}
 #contact-form .row label{width: 280px;}
 #contact-form input{width: 240px;}
 #contact-form textarea{width: 540px;}
}

@media only screen and (max-width: 767px) {
 body{min-width:420px;}
 .main{width: 400px;}
 .flexslider{height: 403px;}
 .flexslider .inner{font-size: 24x; line-height: 30px;padding-top: 120px;}
 #contact-form .row label{width: 100%;margin: 0;}
 .process, .info_box > div, .product, #contact-form, .info{float: none;width:100%;margin: 0 0 20px;}
 #contact-form textarea, #contact-form input{width: 360px;}
 .process2:before, .process:after{display: none;}
 .pad_box{padding-left: 100px;}
 #search input{width: 328px;}
 #filter, .tags{position: relative;top: 0;left: 0;}
 .tags{margin-bottom: 20px;}
 #container{margin: 20px 0 0;}
 #container .element{margin-left: 0;width: 100%;height: 345px;}
 .footer{padding-top: 20px;}
 .footer>div{float: none;}
 .footer .privacy{margin-bottom: 10px;}
 #get_in_touch{padding-bottom: 30px;}
 .flex-direction-nav a{top: 30%;z-index: 999;}
 .process .bg_none:after{display: block !important;}
}

@media only screen and (max-width: 479px) {
 body{min-width:300px;}
 .main{width: 280px;}
 .flexslider{height: 236px;}
 .flexslider .inner{padding-top: 60px;font-size:24px;line-height: 29px;display: none;}
 #search input{width: 208px;}
 #container .element{height: 255px;}
 #product .element a.text:hover, .product a.text:hover{background-color: #733456;background-position: 250px 50%;}
 #filter>li{margin-bottom: 10px;}
 #contact-form textarea, #contact-form input{width: 240px;}
 #contact-form .button1{margin-bottom: 10px;}
}


/* --- PROMO - Modal --- */

#promo h2 {;margin:0;background-color:#000;font-size:20px; text-transform:none;letter-spacing:1px;}
#promo h2 a{color:rgb(1, 165, 236)}
#promo h2 a:hover{color:rgb(150, 195, 0)}
#promo h3 {padding:6px;background-color:#000;font-family: 'Playball', cursive;font-size:36px; text-transform:none;letter-spacing:1px;}
#promo h2 span {color:#fff;}
#promo h3 span {color:#fff;font-family: 'Playball', cursive;font-size:36px;}

#promo img {max-width:100%}