/***************************************************************************************************************/
/* Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html */
/***************************************************************************************************************/
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, font, 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 {
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	vertical-align: baseline;
}
body {
	line-height: 1;
}
h1, h2, h3, h4, h5, h6 {
	clear: both;
	font-weight: normal;
}
ol, ul {
	list-style: none;
}
blockquote {
	quotes: none;
}
blockquote:before, blockquote:after {
	content: '';
	content: none;
}
del {
	text-decoration: line-through;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}
a img {
	border: none;
}
* {
	outline:none;
}
*, *:before, *:after {
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
}



/***************************************************************************************************************/
/* main base ***************************************************************************************************/
/***************************************************************************************************************/
/* html -------------------------------------------------------------------------------------------------------*/
html {
	height: 100%;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	font-smoothing: antialiased;
	-webkit-font-smoothing: antialiased;
	-moz-font-smoothing: antialiased;
	-ms-font-smoothing: antialiased;
	-o-font-smoothing: antialiased;
}
/* body -------------------------------------------------------------------------------------------------------*/
body {
	height: 100%;
}
/* main -------------------------------------------------------------------------------------------------------*/
#main {
	position: relative;
	width: 100%;
	min-height: 100%;
}
/* header -----------------------------------------------------------------------------------------------------*/
#header {
	width: 100%;
	height: 100px;
	padding: 0.1px;
}
/* content ----------------------------------------------------------------------------------------------------*/
#content {
	width: 100%;
	padding-bottom: 300px; /* same value of #preFooter + #footer height */
}
/* preeFooter -------------------------------------------------------------------------------------------------*/
#preFooter {
	position: absolute;
	display: block;
	bottom: 100px; /* same value of #footer height */
	width: 100%;
	height: 200px;
	z-index: 2;
}
/* footer -----------------------------------------------------------------------------------------------------*/
#footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 100px;
	z-index: 1;
}
/* layout resize 960px grid -----------------------------------------------------------------------------------*/
.resize {
	position: relative;
	width: 960px;
	margin: 0 auto;
}
/* clearfix ---------------------------------------------------------------------------------------------------*/
.resize:after {
	content: "";
	clear: both;
	display: table;
}
/* basic colors -----------------------------------------------------------------------------------------------*/
#main {
	background: white;
}
#header, #footer {
	background: lightslategray;
}
#preFooter {
	background: lightsteelblue;
}



/***************************************************************************************************************/
/* layout 960px grid *******************************************************************************************/
/***************************************************************************************************************/
/* grid -------------------------------------------------------------------------------------------------------*/
.full,
.oneHalf,
.oneThird,
.twoThird,
.oneQuarter,
.threeQuarter,
.oneFifth,
.twoFifth,
.threeFifth,
.fourFifth {
	float: left;
}
/* grid width -------------------------------------------------------------------------------------------------*/
.full {
	width: 960px;
}
.oneHalf {
	width: 480px;
}
.oneThird {
	width: 320px;
}
.twoThird {
	width: 640px;
}
.oneQuarter {
	width: 240px;
}
.threeQuarter {
	width: 720px;
}
.oneFifth {
	width: 192px;
}
.twoFifth {
	width: 384px;
}
.threeFifth {
	width: 586px;
}
.fourFifth {
	width: 768px;
}



/***************************************************************************************************************/
/* text ********************************************************************************************************/
/***************************************************************************************************************/
/* family -----------------------------------------------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6, p, a, label, input[type="submit"] {
	font-family: 'PT Sans', Arial, Helvetica, sans-serif;
}
/* color ------------------------------------------------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6, p, a, label, input[type="submit"] {
	color: #444444;
}
/* headers ----------------------------------------------------------------------------------------------------*/
h1 {
	font-size: 34px;
}
h2 {
	font-size: 24px;
}
h3 {
	font-size: 19px;
}
h4 {
	font-size: 17px;
}
h5 {
	font-size: 15px;
}
h6 {
	font-size: 13px;
}
/* paragraph --------------------------------------------------------------------------------------------------*/
p {
	margin: 5px 0;
	line-height: 1.5em;
}

/* align ------------------------------------------------------------------------------------------------------*/
.left {
	text-align: left;
}
.right {
	text-align: right;
}
.center {
	text-align: center;
}



/***************************************************************************************************************/
/* images ******************************************************************************************************/
/***************************************************************************************************************/
img {
	display: block;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
}



/***************************************************************************************************************/
/* buttons and links *******************************************************************************************/
/***************************************************************************************************************/
.btn a, .btn input[type="submit"] {
	display: block;
	width: 192px;
	height: 35px;
	margin: 5px 0;
	border: 0;
	border-radius: 3px;
	font-size: 12px;
	text-align: center;
	text-decoration: none;
	line-height: 35px;
	cursor: pointer;
	transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
}
.btn.big a, .btn.big input[type="submit"] {
	height: 50px;
	font-size: 16px;
	line-height: 50px;
}
.btn.small a, .btn.small input[type="submit"] {
	width: 96px;
	height: 20px;
	border-radius: 10px;
	font-size: 10px;
	line-height: 20px;
}
.btn.elastic a, .btn.elastic input[type="submit"] {
	display: block;
	width: 162px;
	height: 35px;
	padding: 0 27px 0 10px;
	border-radius: 0;
	background-image: url(../images/framework/arrow-next.png);
	background-position: right center;
	background-repeat: no-repeat;
	font-size: 12px;
	text-align: left;
	text-decoration: none;
	line-height: 35px;
}
.btn.elastic a:hover, .btn.elastic input[type="submit"]:hover {
	width: 192px;
	background-image: url(../images/framework/arrow-next.png);
	background-position: right center;
	background-repeat: no-repeat;
}

.btn a, .btn input[type="submit"] {
	background: steelblue;
	color: black;
}
.btn a:hover, .btn input[type="submit"]:hover {
	background: slategray;
	color: black;
}

/* link -------------------------------------------------------------------------------------------------------*/
a {
	text-decoration: none;
	color: steelblue;
	transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
}
a:hover {
	color: slategray;
}



/***************************************************************************************************************/
/* form and inputs *********************************************************************************************/
/***************************************************************************************************************/
form.form label {
	display: block;
	margin-bottom: 4px;
	padding: 0;
}
form.form input[type="text"] {
	width: 100%;
	height: 35px;
	margin-bottom: 8px;
	padding: 5px;
	border: 1px solid #CCC;
	outline: none;
}
form.form select {
	width: 100%;
	height: 35px;
	margin-bottom: 8px;
	padding: 5px;
	border: 0;
	outline: none;
}
form.form textarea {
	width: 100%;
	height: 100px;
	margin-bottom: 8px;
	padding: 10px;
	border: 1px solid #CCC;
	outline: none;
}
form.form label:after, form.form input[type="text"]:after, form.form select:after, form.form textarea:after {
	content: "";
	clear: both;
	display: table;
}



/***************************************************************************************************************/
/* others ******************************************************************************************************/
/***************************************************************************************************************/
.clear {
	clear: both;
}
.clearFix:after {
	content: "";
	clear: both;
	display: table;
}
.floatLeft {
	float: left;
}
.floatRight {
	float: right;
}
.alignCenter {
	display: block;
	margin: 0 auto;
}


.vpad5 {
	padding: 5px 0;
}
.vpad10 {
	padding: 10px 0;
}
.vpad15 {
	padding: 15px 0;
}
.vpad20 {
	padding: 20px 0;
}
.vpad25 {
	padding: 25px 0;
}
.vpad30 {
	padding: 30px 0;
}
.vpad35 {
	padding: 35px 0;
}
.vpad40 {
	padding: 40px 0;
}
.vpad45 {padding: 45px 0;
}
.vpad50 {
	padding: 50px 0;
}


.tpad5 {
	padding-top: 5px;
}
.tpad10 {
	padding-top: 10px;
}
.tpad15 {
	padding-top: 15px;
}
.tpad20 {
	padding-top: 20px;
}
.tpad25 {
	padding-top: 25px;
}
.tpad30 {
	padding-top: 30px;
}
.tpad35 {
	padding-top: 35px;
}
.tpad40 {
	padding-top: 40px;
}
.tpad45 {
	padding-top: 45px;
}
.tpad50 {
	padding-top: 50px;
}


.bpad5 {
	padding-bottom: 5px;
}
.bpad10 {
	padding-bottom: 10px;
}
.bpad15 {
	padding-bottom: 15px;
}
.bpad20 {
	padding-bottom: 20px;
}
.bpad25 {
	padding-bottom: 25px;
}
.bpad30 {
	padding-bottom: 30px;
}
.bpad35 {
	padding-bottom: 35px;
}
.bpad40 {
	padding-bottom: 40px;
}
.bpad45 {
	padding-bottom: 45px;
}
.bpad50 {
	padding-bottom: 50px;
}

.borderRadius {
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-ms-border-radius: 3px;
	-o-border-radius: 3px;
}

.boxShadow {
	box-shadow: 0 0 10px 0px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 0 0 15px 1px black;
	-moz-box-shadow: 0 0 10px 0px rgba(0, 0, 0, 0.5);
	-ms-box-shadow: 0 0 10px 0px rgba(0, 0, 0, 0.5);
	-o-box-shadow: 0 0 10px 0px rgba(0, 0, 0, 0.5);
}


/***************************************************************************************************************/
/* CUSTOM LAYOUT OPTIONS ***************************************************************************************/
/***************************************************************************************************************/

/***************************************************************************************************************/
/* main ********************************************************************************************************/
/***************************************************************************************************************/
/* fonts hint
	font-family: 'PT Sans', sans-serif;
*/
/* colors hint
	#FFF200 	cor1
	#FFF100 	cor2
*/

/* layout pre-adjustments *************************************************************************************/
#main.home {
	background: white url(../images/header.png) repeat-x;
}
#main {
	background: white url(../images/header_pages.png) repeat-x;
}
#header {
	height: auto;
	background: none;
}
#content {
	padding-bottom: 480px; /* same value of #preFooter + #footer height */
}
#preFooter {
	bottom: 80px; /* same value of #footer height */
	height: 400px;
	background: black;
}
#footer {
	height: 80px;
	background: black;
}

.bold {
	font-weight: bold;
}

.btn a, .btn input[type="submit"] {
	background: #FFF200;
	color: black;
}
.btn a:hover, .btn input[type="submit"]:hover {
	background: #FFF100;
	color: black;
}

a {
	color: black/*#FFF200*/;
}
a:hover {
	color: #FFF100;
}



/***************************************************************************************************************/
/* header ******************************************************************************************************/
/***************************************************************************************************************/
#header #logo a {
	float: left;
	width: 246px;
	height: 73px;
	margin-top: 15px;
	background: url(../images/logo.png) no-repeat;
	background-size: 246px;
	text-indent: -9999px;
	overflow: hidden;
}

#header #menu {
	display: block;
	width: auto;
	height: 68px;
	margin: 0 auto;
	background: url(../images/menu.jpg) repeat-x;
	text-align: center;
}

a.social {
	float: left;
	display: block;
	width: 25px;
	height: 25px;
	margin-right: 10px;
	background: white;
	text-indent: -9999px;
	overflow: hidden;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-ms-border-radius: 3px;
	-o-border-radius: 3px;
	opacity: 0.7;
}
a:hover.social {
	opacity: 1;
}

a.facebook {
	background: url(../images/facebook.png) no-repeat !important;
	background-size: 25px !important;
}
a.twitter {
	background: url(../images/twitter.png) no-repeat !important;
	background-size: 25px !important;
}
a.youtube {
	background: url(../images/youtube.png) no-repeat !important;
	background-size: 25px !important;
}
a.instagram {
	background: url(../images/instagram.png) no-repeat !important;
	background-size: 25px !important;
}

#search input[type="text"] {
	float: left;
	width: 180px;
	height: 25px;
	padding: 5px;
	border: 0;
	outline: none;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-ms-border-radius: 3px;
	-o-border-radius: 3px;
	background-color: #CCC;
}

a.newsletter {
	float: right;
	color: #CCC;
	font-weight: bold;
}
a:hover.newsletter {
	color: #FFF200;
}

/***************************************************************************************************************/
/* content *****************************************************************************************************/
/***************************************************************************************************************/
#content .resize {
	padding-top: 12px;
	padding-bottom: 30px;
}

#breadcrumbs {
	display: block;
	margin-top: 5px;
	margin-bottom: 35px;
}
#breadcrumbs:after {
	content: "";
	display: table;
	clear: both;
}
#breadcrumbs ul {
	position: relative;
	float: left;
	list-style: none;
}
#breadcrumbs ul li {
	position: relative;
	float: left;
}
#breadcrumbs ul li:after {
	content: "\203A";
	padding: 0 8px;
	color: black;
}
#breadcrumbs ul li:last-child:after {
	content: none;
}
#breadcrumbs ul li a {
	color: black;
	font-size: 12px;
	text-transform: uppercase;
}
#breadcrumbs ul li a:hover {
	color: black;
}
#breadcrumbs ul li:last-child a {
	color: black;
}

form.productSearch label {
	float: left;
	display: block;
	margin-right: 10px;
	margin-bottom: 4px;
	padding: 0;
}
form.productSearch label h5 {
	padding-top: 9px;
}
form.productSearch label h5.w130 {
	width: 130px;
}
form.productSearch label h5.w200 {
	width: 200px;
}
form.productSearch input[type="text"] {
	float: left;
	display: block;
	width: 170px;
	height: 35px;
	padding: 5px;
	border: 1px solid #CCC;
	outline: none;
}
form.productSearch select {
	float: left;
	display: block;
	width: 185px;
	height: 35px;
	padding: 5px;
	border: 1px solid #CCC;
	outline: none;
}
form.productSearch .btn input[type="submit"] {
	float: left;
	display: block;
	width: 35px;
	height: 35px;
	margin: 0;
	margin-left: 10px;
	padding: 0;
	border-radius: 0;
	border: 1px solid #CCC;
	background: none;
	font-size: 14px;
	text-align: center;
	text-decoration: none;
	color: #444;
	line-height: 35px;
	cursor: pointer;
	transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
}
form.productSearch .btn input[type="submit"]:hover {
	border: 1px solid #FFF200;
}

.box {
	position: relative;
	padding: 0 10px;
}
.box.h335 {
	height: 335px;
}
.box.h335 {
	height: 335px;
}
.box h2 {
	font-size: 20px;
}

.border {
	border: 1px solid #CCC;
	margin-bottom: 15px;
}
.border .thumb {
	width: 100%;
	border: 6px solid white;
	overflow: hidden;
}
.border .thumb.h150 {
	max-height: 150px;
}
.border .thumb.h300 {
	max-height: 300px;
}

a.more {
	position: absolute;
	bottom: 0;
	float: left;
	padding: 6px 8px;
	padding-right: 20px;
	background-color: #FFF200;
	background-image: url(../images/framework/arrow-next.png);
	background-position: right center;
	background-repeat: no-repeat;
	background-size: 12px;
	font-size: 12px;
	color: black;
}
a:hover.more {
	background-color: #FFF100;
}

#twitter-widget-0[style] {
	height: 335px !important;
}

ul.galery li {
	float: left;
}
ul.galery li {
	display: block;
	float: left;
	width: 25%;
	height: 80px;
	margin: 0;
	padding: 2px;
	overflow: hidden;
}
ul.galeryProd li {
	display: block;
	float: left;
	width: 20%;
	height: 80px;
	margin: 0;
	padding: 2px;
	overflow: hidden;
}

.table table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
}
.table table, .table table tr, .table table td {
	border: 1px solid #CCC;
	padding: 3px 4px;
}



/***************************************************************************************************************/
/* preFooter ***************************************************************************************************/
/***************************************************************************************************************/
#stripe {
	width: 100%;
	margin: 0 auto;
	background: #FFF200;
}
#stripe table {
	width: 100%;
	height: 25px;
}
#stripe table tr td a img {
	opacity: 1;
	transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
}
#stripe table tr td a:hover img {
	opacity: 0.7;
}
#stripe table tr td img {
	width: auto;
	height: 15px;
}

#preFooter ul.oneThird {
	padding:35px 5px 0;
}
#preFooter ul.oneThird li p {
	font-size: 12px;
}
#preFooter ul.oneThird li p, #preFooter ul.oneThird li h3 {
	color: grey;
}
#preFooter ul.oneThird h4 {
	padding: 0 5px 20px;
	border-bottom: 1px solid #222;
	font-weight: bold;
	color: white;
}
#preFooter ul.oneThird li a {
	display: block;
	padding: 12px 5px;
	border-bottom: 1px solid #222;
	font-size: 12px;
	color: grey;
}
#preFooter ul.oneThird li a:hover {
	background: #222;
	color: #FFF200;
}
#preFooter ul.oneThird li.contact {
	position: absolute;
	bottom: 0;
	display: block;
	width: 100%;
	border-bottom: 1px solid #222;
}



/***************************************************************************************************************/
/* footer ******************************************************************************************************/
/***************************************************************************************************************/
#footer p#rights {
	position: absolute;
	left: 5px;
	height: 15px;
	margin-top: 36px;
	font-size: 10px;
	color: black;
}

#footer a#broop {
	position: absolute;
	right: 5px;
	display: block;
	width: 160px;
	height: 25px;
	margin-top: 27px;
	background: url(../images/framework/broopwht.png) no-repeat;
	text-indent: -9999px;
	overflow: hidden;
}

#footer a#broopCenter {
	display: block;
	width: 160px;
	height: 25px;
	margin: 27px auto 0;
	background: url(../images/framework/broopwht.png) no-repeat;
	text-indent: -9999px;
	overflow: hidden;
}