/* 1. RESET -ADAPTEDFROMMEYERRESET URL-http://meyerweb.com/eric/tools/css/reset/ LICENSE-PUBLICDOMAIN */
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,caption,canvas,center,cite,code,dd,del,details,dfn,dialog,div,dl,dt,em,embed,fieldset,figcaption,figure,form,footer,header,hgroup,h1,h2,h3,h4,h5,h6,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,tt,table,tbody,textarea,tfoot,thead,time,tr,th,td,u,ul,var,video{background:transparent;border:0;font-family:inherit;font-size:100%;font-style:inherit;font-weight:inherit;margin:0;padding:0;outline:0;text-align:left;text-decoration:none;vertical-align:baseline;white-space:normal}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}			
ol,ul{list-style:none}
blockquote,q{quotes:none}
:focus{outline:0}
table{border-collapse:collapse;border-spacing:0}
td{vertical-align:top}

/*-----------------------------------------------------------------*/
/* OUTLINES */
/*
.row{outline:1px dotted red}
.col{outline:1px dotted green}


/* -----------------------------------------------------------------*/
/* 3. STYLES */
body{background:#F0F0F0;font:62% arial}
body img{display:block;height:auto;max-width:100%;width:100%}
body a{color:#4496d2}
body a:hover{color:#111}

header{background:#FFF;border-bottom:1px solid #D8D8D8;margin-bottom:30px}
header h1{color:#444;font:normal 2.2em/80px Arial}
header h1 a{color:#444}
header .user{color:#444;font:normal 1.1em/80px Arial;text-align:right}

pre {
	width: 500px;                          /* specify width  */
	white-space: pre-wrap;                 /* CSS3 browsers  */
	white-space: -moz-pre-wrap !important; /* 1999+ Mozilla  */
	white-space: -pre-wrap;                /* Opera 4 thru 6 */
	white-space: -o-pre-wrap;              /* Opera 7 and up */
	word-wrap: break-word;                 /* IE 5.5+ and up */
	/* overflow-x: auto; */                /* Firefox 2 only */
	/* width: 99%; */		       			/* only if needed */
}

/* -----------------------------------------------------------------*/
/* 4. NAVMAIN */
.navmain{}
.navmain ul{background:#FFF;border:1px solid #D8D8D8;border-top:0;margin:0 0 20px 0}
.navmain ul a{border-top:1px solid #D8D8D8;color:#555;cursor:pointer;display:block;font:1.2em/40px Arial;padding:0 5%}

.navmain ul ul{border:0;margin:0}
.navmain ul ul a{border:0;color:#555;display:block;font:1.2em/40px Arial;padding:0 5% 0 10%}

.navmain ul a:hover{background:#FAFAFA}
.navmain ul a.active{background:#FAFAFA}

/* -----------------------------------------------------------------*/
/* 4. CONTENT */
.content{}
.content .border{background:#FFF;border:1px solid #D8D8D8;margin-bottom:20px;padding:20px 0}
.content .border .padding{padding:0 20px}

.content .border h1{border-bottom:1px solid #D8D8D8;color:#444;font:normal 2.2em/normal Arial;margin:0 0 20px 0;padding:0 20px 20px 20px}
.content .border h2{color:#444;font:normal 1.6em/normal Arial;margin:0 0 20px 20px}
.content .border h2.archive{margin:20px 0 20px 0}
.content .border p{color:#444;font:normal 1.2em/1.6em Arial;margin:0 20px 20px 20px}
.content .border pre{color:#444;font:normal 1.2em/1.6em Arial;margin:0 20px 20px 20px}
.content .border ul{color:#444;font:normal 1.2em/1.6em Arial;margin:0 20% 20px 20px}
.content .border hr{background:#D8D8D8;border:0;height:1px;margin:0 0 20px 0;width:100%}
.content .border label{color:#444;display:inline-block;font:1.2em/30px Arial;width:100%}

.content .border .padding p{margin-left:0}

.content .border .input-style{border:1px solid #D8D8D8;display:block;margin-bottom:10px;padding:0 5px}
.content .border .input-style.false{border:1px solid red}
.content .border input[type="text"]{background:#FFF;border:0;color:#444;font:1.2em/30px Arial;height:30px;width:100%}
.content .border input[type="file"]{background:#FFF;border:0;color:#444;font:1.2em/30px Arial;height:30px;width:100%}
.content .border input[type="password"]{background:#FFF;border:0;color:#444;font:1.2em/30px Arial;height:30px;width:100%}
.content .border input[type="checkbox"]{margin-top:8px}

.content .border input[type="submit"]{background:#F0F0F0;border:1px solid #D8D8D8;color:#444;cursor:pointer;float:left;font:1.2em/30px Arial;height:30px;padding:5px 10px;transition:background 0.5s}
.content .border input[type="submit"]:hover{background:#DDD;transition:background 0.5s}

.content .border .textarea-style{border:1px solid #D8D8D8;display:block;margin-bottom:10px;padding:0 0 0 5px}
.content .border textarea{background:#FFF;border:0;color:#444;font:1.2em/1.4em Arial;height:100px;padding:5px 0;width:100%}

.content .border button{background:#F0F0F0;border:1px solid #D8D8D8;color:#444;cursor:pointer;float:left;font:1.2em/30px Arial;height:34px;margin:0 10px 10px 0;padding:0 10px;transition:background 0.5s}
.content .border button:hover{background:#DDD;transition:background 0.5s}
.content .border button.submit{margin-bottom:0}
.content .border button.margin-bottom{margin-bottom:10px}
.content .border button.margin-left{margin-left:20px}
.content .border button.margin-top{margin-top:20px}
.content .border button.fullwidth{width:100%}

.content .border .ckeditor{margin-bottom:10px;width:100%}

.content .border .select-style{background:#FFF url(data:image/svg+xml;base64,PHN2ZyB4bWxuczpzdmc9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4IiBoZWlnaHQ9IjUiIHZlcnNpb249IjEuMSI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCwtMTA0Ny4zNjIyKSI+PHBhdGggZD0iTTIwMC4wMDAwMSAzNTkuNTA1MDYgNjMuOTEwMjgyIDU4Mi4xOTczMS02MC45MDE5OTggMzUyLjk5NDA0LTE4NS43MTQyOCAxMjMuNzkwNzVsMjYwLjkwMTk5MiA2LjUxMTAzIDI2MC45MDIwMDggNi41MTEwM3oiIHRyYW5zZm9ybT0ibWF0cml4KDAuMDE1MzMxNDMsMCwwLDAuMDEwOTA3MzUsMi44NDcyNjU2LDEwNDYuMDEyKSIgZmlsbD0iI2IzYjNiMyIvPjwvZz48L3N2Zz4=) no-repeat 95% 50%;border:1px solid #D8D8D8;height:30px;margin-bottom:10px;overflow:hidden;width:50%}
.content .border .select-style select{background:transparent;background-image:none;border:none;box-shadow:none;color:#444;cursor:pointer;padding:5px;width:130%;-webkit-appearance:none}
.content .border .select-style select:focus{outline:none}

.content .border .select-style-multiple{background:#FFF;border:1px solid #D8D8D8;height:auto;margin-bottom:10px;width:50%}
.content .border .select-style-multiple select[multiple]{background:transparent;background-image:none;border:none;box-shadow:none;color:#444;cursor:pointer;height:auto;padding:5px;width:100%;-webkit-appearance:none}
.content .border .select-style-multiple select[multiple]:focus{outline:none}

.content .border .action{border-top:1px solid #D8D8D8;padding-top:20px}

.content .border img.prodimg{border:1px solid #000;margin-bottom:10px}
.content .border img.catimg{border:1px solid #000;margin-bottom:10px}

.content .border ul.archive{margin:0}
.content .border ul.archive li{line-height:2.4em;padding:0 1%;width:98%}
.content .border ul.archive li:nth-child(even){background:#FFF}
.content .border ul.archive li:nth-child(odd){background:#FAFAFA}
.content .border ul.archive li h1{border:0;color:#444;font:bold 1.2em/1.6em Arial;margin:0;padding:10px 0}

.content .border ul.archive li .select-style{background:#FFF url(data:image/svg+xml;base64,PHN2ZyB4bWxuczpzdmc9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI4IiBoZWlnaHQ9IjUiIHZlcnNpb249IjEuMSI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCwtMTA0Ny4zNjIyKSI+PHBhdGggZD0iTTIwMC4wMDAwMSAzNTkuNTA1MDYgNjMuOTEwMjgyIDU4Mi4xOTczMS02MC45MDE5OTggMzUyLjk5NDA0LTE4NS43MTQyOCAxMjMuNzkwNzVsMjYwLjkwMTk5MiA2LjUxMTAzIDI2MC45MDIwMDggNi41MTEwM3oiIHRyYW5zZm9ybT0ibWF0cml4KDAuMDE1MzMxNDMsMCwwLDAuMDEwOTA3MzUsMi44NDcyNjU2LDEwNDYuMDEyKSIgZmlsbD0iI2IzYjNiMyIvPjwvZz48L3N2Zz4=) no-repeat 95% 50%;border:1px solid #D8D8D8;height:20px;margin:3px 0 0 0;overflow:hidden;width:50%}
.content .border ul.archive li .select-style select{background:transparent;background-image:none;border:none;box-shadow:none;color:#444;cursor:pointer;font:.9em/normal Arial;padding:0;width:130%;-webkit-appearance:none}
.content .border ul.archive li .select-style select:focus{outline:none}

.content .border ul.archive li button{margin:5px 0}

.content .border .red{color:red}
.content .border .green{color:green}

/*	----------------------------------------------------------------- */
/*	3. RESPONSIVE GRID SYSTEM DEVELOPED BY DENIS LEBLANC URL - http://responsive.gs LICENSED UNDER GPL & MIT */
.container{margin:0 auto;position:relative}
.row:after,.clr:after,.group:after{clear:both;content:"";display:block;height:0;visibility:hidden} /* SELF CLEARING FLOATS - CLEARFIX METHOD */
.row{margin-bottom:0} /* DEFAULT ROW STYLES */
.col{display:block;float:left;margin-left:2%} /* DEFAULT COLUMN STYLES */
.col:first-child{margin-left:0} /* RESET MARGINS - all browsers except IE6 and lower */
.span_1{width:6.5%}
.span_2{width:15%}
.span_3{width:23.5%}
.span_4{width:32%}
.span_5{width:40.5%}
.span_6 {width:49%}
.span_7{width:57.5%}
.span_8{width:66%}
.span_9{width:74.5%}
.span_10{width:83%}
.span_11{width:91.5%}
.span_12{margin-left:0;width:100%}

.margin_1{margin-left:8.5%}
.margin_2{margin-left:17%}
.margin_3{margin-left:25.5%}
.margin_4{margin-left:34%}
.margin_5{margin-left:42.5%}
.margin_6{margin-left:51%}
.margin_7{margin-left:59.5%}
.margin_8{margin-left:68%}
.margin_9{margin-left:76.5%}
.margin_10{margin-left:85%}
.margin_11{margin-left:93.5%}

/*	----------------------------------------------------------------- */
/*	4. MEDIAQUERIES FOR COMMON DEVICES - RESPONSIVE GRID SYSTEMURL - http://responsive.gs LICENSE - PUBLIC DOMAIN */
@media all and (min-width: 1px) and (max-width:799px) {
	.phone{visibility:visible}
	.no-phone{display:none;visibility:hidden}
	.login{width:100%;margin:40px auto}
	.container{width:90%}
	.span_1,.span_2 ,.span_3 ,.span_4,.span_5,.span_6 ,.span_7 ,.span_8 ,.span_9,.span_10,.span_11,.span_12 {margin:0;width:100%}
	.margin_1,.margin_2,.margin_3,.margin_4,.margin_5,.margin_6,.margin_7,.margin_8,.margin_9,.margin_10,.margin_11{margin-left:0}
	.content .border label{line-height:normal;margin-bottom:5px;text-align:left}
	.content .border .select-style.fullwidth{width:50%}
	.content .border button.fullwidth{margin-bottom:10px;width:50%}
	.content .border ul.archive button{font:1em/20px Arial;height:24px}
}

@media all and (min-width: 800px) {
	.phone{display:none;visibility:hidden}
	.no-phone{visibility:visible}
	.container{max-width:1600px;width:90%}
	.login{width:40%;margin:120px auto}
	.content .border img.prodimg{width:50%}
	.content .border img.catimg{height:auto;width:auto}
	.content .border ul.archive button{font:1em/20px Arial;height:24px}
}