/*	
	Architecture.css
	Based On : Skeleton by Dave Gamache
	License: http://opensource.org/licenses/mit-license.php	*/


/*	Resets
	------	*/
	
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,hr,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figure,figcaption,hgroup,menu,footer,header,nav,section,summary,time,mark,audio,video {
	border:0;
	margin:0;
	padding:0;
}

article,aside,canvas,figure,figure img,figcaption,hgroup,footer,header,nav,section,audio,video {
	display:block;
}
a {
	outline:0;
}
a img {
	border:0;
}

/*	Clearing
	--------	*/
	
.qcContainer:after {
	content:"\0020";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}

.clearfix:before,.clearfix:after,.row:before,.row:after {
	content:'\0020';
	display:block;
	overflow:hidden;
	visibility:hidden;
	width:0;
	height:0;
}

.row:after,.clearfix:after {
	clear:both;
}

.row,.clearfix {
	zoom:1;
}

.clear {
	clear:both;
	display:block;
	overflow:hidden;
	visibility:hidden;
	width:0;
	height:0;
}

/*	Selections
	----------	*/

body {
	-webkit-tap-highlight-color:#ffff9e;
}

::selection,::-moz-selection {
	background:#ffff9e;
}

img::selection,img::-moz-selection {
	background:transparent;
}

/* --------------------------------------------------------------------------------------------------------------------------- */
/* 	THEME GRID ARCHITECTURE */
/* --------------------------------------------------------------------------------------------------------------------------- */

/*	BASE 960 GRID 
---------------------------------------------------------------------------------------------------------------------------------
	cols    1     2      3      4      5      6      7      8      9      10      11      12     13     14     15     16     		
	px      40    100    160    220    280    340    400    460    520    580     640     700    760    820    880    940     */

	.qcContainer                                  { position: relative; width: 960px; margin: 0 auto; padding: 0; }
	.column, .columns                             { float: left; display: inline; margin-left: 10px; margin-right: 10px; }
	.row                                          { margin-bottom: 20px; }
	.column.alpha, .columns.alpha                 { margin-left: 0; }
	.column.omega, .columns.omega                 { margin-right: 0; }
	.qcContainer .one.column                      { width: 40px;  }
	.qcContainer .two.columns                     { width: 100px; }
	.qcContainer .three.columns                   { width: 160px; }
	.qcContainer .four.columns                    { width: 220px; }
	.qcContainer .five.columns                    { width: 280px; }
	.qcContainer .six.columns                     { width: 340px; }
	.qcContainer .seven.columns                   { width: 400px; }
	.qcContainer .eight.columns                   { width: 460px; }
	.qcContainer .nine.columns                    { width: 520px; }
	.qcContainer .ten.columns                     { width: 580px; }
	.qcContainer .eleven.columns                  { width: 640px; }
	.qcContainer .twelve.columns                  { width: 700px; }
	.qcContainer .thirteen.columns                { width: 760px; }
	.qcContainer .fourteen.columns                { width: 820px; }
	.qcContainer .fifteen.columns                 { width: 880px; }
	.qcContainer .sixteen.columns                 { width: 940px; }
	.qcContainer .one-third.column                { width: 300px; }
	.qcContainer .two-thirds.column               { width: 580px; }

/*	TABLET : 768px 
---------------------------------------------------------------------------------------------------------------------------------
	cols    1     2      3      4      5      6      7      8      9      10      11      12     13     14     15     16     		
	px      28    76     124    172    220    268    316    364    412    460     508     556    604    652    700    748     */

	@media only screen and (min-width: 768px) and (max-width: 959px) {

	.qcContainer                                  { width: 728px; }
	.qcContainer .column, .qcContainer .columns   { margin-left: 10px; margin-right: 10px;  }
	.column.alpha, .columns.alpha                 { margin-left: 0; margin-right: 10px; }
	.column.omega, .columns.omega                 { margin-right: 0; margin-left: 10px; }
	.qcContainer .one.column                      { width: 28px; }
	.qcContainer .two.columns                     { width: 76px; }
	.qcContainer .three.columns                   { width: 124px; }
	.qcContainer .four.columns                    { width: 172px; }
	.qcContainer .five.columns                    { width: 210px; }
	.qcContainer .six.columns                     { width: 268px; }
	.qcContainer .seven.columns                   { width: 316px; }
	.qcContainer .eight.columns                   { width: 364px; }
	.qcContainer .nine.columns                    { width: 412px; }
	.qcContainer .ten.columns                     { width: 460px; }
	.qcContainer .eleven.columns                  { width: 478px; }
	.qcContainer .twelve.columns                  { width: 556px; }
	.qcContainer .thirteen.columns                { width: 604px; }
	.qcContainer .fourteen.columns                { width: 652px; }
	.qcContainer .fifteen.columns                 { width: 700px; }
	.qcContainer .sixteen.columns                 { width: 748px; }
	.qcContainer .one-third.column                { width: 236px; }
	.qcContainer .two-thirds.column               { width: 460px; }
	
	}

/*	MOBILE PORTRAIT : 320px 
---------------------------------------------------------------------------------------------------------------------------------
	cols    1     2      3      4      5      6      7      8      9      10      11      12     13     14     15     16     		
	px      300   300    300    300    300    300    300    300    300    300     300     300    300    300    300    300     */

	@media only screen and (max-width: 767px) {
	
	.qcContainer 							{ width: 300px; }
	.columns, .column 						{ margin: 0; }
	.qcContainer .one.column,
	.qcContainer .two.columns,
	.qcContainer .three.columns,
	.qcContainer .four.columns,
	.qcContainer .five.columns,
	.qcContainer .six.columns,
	.qcContainer .seven.columns,
	.qcContainer .eight.columns,
	.qcContainer .nine.columns,
	.qcContainer .ten.columns,
	.qcContainer .eleven.columns,
	.qcContainer .twelve.columns,
	.qcContainer .thirteen.columns,
	.qcContainer .fourteen.columns,
	.qcContainer .fifteen.columns,
	.qcContainer .sixteen.columns,
	.qcContainer .one-third.column,
	.qcContainer .two-thirds.column  			{ width: 300px; }
	
	}
	
/*	MOBILE WIDE / LANDSCAPE : 480px 
---------------------------------------------------------------------------------------------------------------------------------
	cols    1     2      3      4      5      6      7      8      9      10      11      12     13     14     15     16     		
	px      420   420    420    420    420    420    420    420    420    420     420     420    420    420    420    420     */

	@media only screen and (min-width: 480px) and (max-width: 767px) {
	
	.qcContainer 							{ width: 420px; }
	.columns, .column 						{ margin: 0; }
	.qcContainer .one.column,
	.qcContainer .two.columns,
	.qcContainer .three.columns,
	.qcContainer .four.columns,
	.qcContainer .five.columns,
	.qcContainer .six.columns,
	.qcContainer .seven.columns,
	.qcContainer .eight.columns,
	.qcContainer .nine.columns,
	.qcContainer .ten.columns,
	.qcContainer .eleven.columns,
	.qcContainer .twelve.columns,
	.qcContainer .thirteen.columns,
	.qcContainer .fourteen.columns,
	.qcContainer .fifteen.columns,
	.qcContainer .sixteen.columns,
	.qcContainer .one-third.column,
	.qcContainer .two-thirds.column 			{ width: 420px; }
	
	}	

/*	RETINA MEDIA QUERY.
	Overrides styles for devices with a 
	device-pixel-ratio of 2+, such as iPhone 4.
------------------------------------------------------------------------------------------------------------------------------ */

	@media 
	only screen and (-webkit-min-device-pixel-ratio: 2),
	only screen and (min-device-pixel-ratio: 2) {
	
	}

/* --------------------------------------------------------------------------------------------------------------------------- */
/*	BASIC TEMPLATE STYLE */
/* --------------------------------------------------------------------------------------------------------------------------- */

body {
	font: 12px/18px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #666;
	-webkit-text-size-adjust: 100%; /* Stops Mobile Safari from auto-adjusting font-sizes */	
}
.qcContainer {
	margin: 0 auto;
}

/* --------------------------------------------------------------------------------------------------------------------------- */
/*	BASIC FORM STYLE */
/* --------------------------------------------------------------------------------------------------------------------------- */

form {
	margin-bottom: 20px; 
}
fieldset {
	margin-bottom: 20px; 
}
input[type="text"],
input[type="password"],
input[type="email"],
textarea,
select {
	border: 1px solid #ccc;
	padding: 6px 4px;
	outline: none;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	font: 13px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #777;
	margin: 0;
	width: 210px;
	max-width: 100%;
	display: block;
	margin-bottom: 20px;
	background: #fff; 
}
select {
	padding: 0; 
}
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
textarea:focus {
	border: 1px solid #aaa;
 	color: #444;
 	-moz-box-shadow: 0 0 3px rgba(0,0,0,.2);
	-webkit-box-shadow: 0 0 3px rgba(0,0,0,.2);
	box-shadow:  0 0 3px rgba(0,0,0,.2); 
}
textarea {
	min-height: 60px; 
}
label,
legend {
	display: block;
	font-weight: bold;
	font-size: 13px;  
}
select {
	width: 220px; 
}
input[type="checkbox"] {
	display: inline; 
}
label span,
legend span {
	font-weight: normal;
	font-size: 13px;
	color: #444; 
}
		
/* --------------------------------------------------------------------------------------------------------------------------- */
/*	BASIC BUTTON STYLE */
/* --------------------------------------------------------------------------------------------------------------------------- */

a.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
	background: #eee; /* Old browsers */
	background: #eee -moz-linear-gradient(top, rgba(255,255,255,.2) 0%, rgba(0,0,0,.2) 100%); /* FF3.6+ */
	background: #eee -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.2)), color-stop(100%,rgba(0,0,0,.2))); /* Chrome,Safari4+ */
	background: #eee -webkit-linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* Chrome10+,Safari5.1+ */
	background: #eee -o-linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* Opera11.10+ */
	background: #eee -ms-linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* IE10+ */
	background: #eee linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* W3C */
	border: 1px solid #aaa;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	padding: 4px 12px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	color: #444;
	display: inline-block;
	font-size: 11px;
	font-weight: bold;
	text-decoration: none;
	text-shadow: 0 1px rgba(255, 255, 255, .75);
	cursor: pointer;
	margin-bottom: 20px;
	line-height: 21px;
	font-family: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; 
}
a.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover {
	color: #222;
	background: #ddd; /* Old browsers */
	background: #ddd -moz-linear-gradient(top, rgba(255,255,255,.3) 0%, rgba(0,0,0,.3) 100%); /* FF3.6+ */
	background: #ddd -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.3)), color-stop(100%,rgba(0,0,0,.3))); /* Chrome,Safari4+ */
	background: #ddd -webkit-linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* Chrome10+,Safari5.1+ */
	background: #ddd -o-linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* Opera11.10+ */
	background: #ddd -ms-linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* IE10+ */
	background: #ddd linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* W3C */
	border: 1px solid #888;
	border-top: 1px solid #aaa;
	border-left: 1px solid #aaa; 
}
a.button:active,
button:active,
input[type="submit"]:active,
input[type="reset"]:active,
input[type="button"]:active {
	border: 1px solid #666;
	background: #ccc; /* Old browsers */
	background: #ccc -moz-linear-gradient(top, rgba(255,255,255,.35) 0%, rgba(10,10,10,.4) 100%); /* FF3.6+ */
	background: #ccc -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.35)), color-stop(100%,rgba(10,10,10,.4))); /* Chrome,Safari4+ */
	background: #ccc -webkit-linear-gradient(top, rgba(255,255,255,.35) 0%,rgba(10,10,10,.4) 100%); /* Chrome10+,Safari5.1+ */
	background: #ccc -o-linear-gradient(top, rgba(255,255,255,.35) 0%,rgba(10,10,10,.4) 100%); /* Opera11.10+ */
	background: #ccc -ms-linear-gradient(top, rgba(255,255,255,.35) 0%,rgba(10,10,10,.4) 100%); /* IE10+ */
	background: #ccc linear-gradient(top, rgba(255,255,255,.35) 0%,rgba(10,10,10,.4) 100%); /* W3C */ 
}
.button.full-width,
button.full-width,
input[type="submit"].full-width,
input[type="reset"].full-width,
input[type="button"].full-width {
	width: 100%;
	padding-left: 0 !important;
	padding-right: 0 !important;
	text-align: center; 
}
		
/* --------------------------------------------------------------------------------------------------------------------------- */
/*	BASIC SUPERFISH MENU STYLE */
/* --------------------------------------------------------------------------------------------------------------------------- */

.sf-menu {
	margin: 0;
	padding: 0;
	list-style: none;
	font: 12px 'Arial', sans-serif;
	color: #666;
}
.sf-menu li {
	float: left;
	position:	relative;
	list-style: none;
	padding: 5px 15px;
	text-transform: uppercase;
	border-right: 1px #ccc dotted;	
}
.sf-menu li a {
	color: #666;
}
.sf-menu ul {
	position: absolute;
	min-width: 160px;
	-moz-box-shadow: 0 0 5px #ddd;
	-webkit-box-shadow: 0 0 5px #ddd;
	box-shadow: 0 0 5px #ddd;
}
.sf-menu ul li {
	position: relative;
	min-width: 160px;
	border-bottom: 1px #ddd dotted;
	border-right: 0;
	background: #fff;
	text-transform: none;
}
.sf-menu li ul {
	display: none;
	visibility: hidden;	
}
.sf-menu ul li:hover {
	background: #f9f9f9;
}
.sf-menu ul li a {
	display: block;
	padding: 5px;
}
.sf-menu li:hover {
	visibility: inherit; 
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left: 0;
	top: 40px; 
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top: -999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left: 200px;
	top:	0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top: -999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left: 200px;
	top: 0;
}
.sf-sub-indicator {
	margin-left: 10px;
	padding: 1px 5px;
	background: transparent url('../images/theme/arrow_d.png') no-repeat center center;	
}
.sf-menu li ul li a .sf-sub-indicator {
	float: right;
	background: transparent url('../images/theme/arrow_r.png') no-repeat center center;
}