@charset "utf-8";

/************************ CSS RESET
==========================================================================*/
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, 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,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
td {
	text-align:left;
	}
/*****************************************************************************/


/* Common Classes by Mohammad Abbas
===========================================*/
.floatleft {float:left;}
.floatright {float:right;}
.cls {clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0;}
.textleft {text-align:left;}
.textright {text-align:right;}
.textcenter {text-align:center !important;}
.hidden {
	opacity:0;
}
.animated {
	-o-transition: all .5s linear;
  -moz-transition: all .5s linear;
  -webkit-transition: all .5s linear;
  transition: all .5s linear;
}
.wrapper {width:100%}
.hashed {color:#BBB;}
.column, .columns {	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */}
a img {border:none;}
.spacer {
	height:0px;
	width:100%;
	display:block;
	margin:20px 0;
	clear:both;
}
.unselectable {	-moz-user-select: none;	-webkit-user-select: none;	user-select: none; }
.relative {position:relative;}

.thin {font-weight:300 !important;}
.thick {font-weight:bold;}
.light {font-weight:normal !important ;}
.no-margin {margin:0 !important;}
.element-centered, centered {
	margin-left: auto !important;
	margin-right:auto !important;
}
.reset-line-height {line-height:1em;}
* {
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
}
.fb {
	height:100%;
	width:100%;
	text-align:center;
	vertical-align:middle;
	background-color:#3584FF;
}

/* grids
===========================================*/

/* #Base 960 Grid
================================================== */

    .container                                  { position: relative; margin:auto; width:1320px; padding: 0; }
    .container .column, .container .columns_fixed, .container .column_fixed,
    .container .columns                         { float: left; display: inline; padding-left: 15px; padding-right: 15px; margin-left:1%; margin-right:1%;}
    .row                                        { margin-bottom: 20px; }

    /* Nested Column Classes */
    .column.alpha, .columns.alpha               { margin-left: 	0;}
    .column.omega, .columns.omega               { margin-right: 0;}

    /* Base Grid */
	/* fluid
	===========================================================*/
    .container .one.column,
    .container .one.columns                     { width: 6%;  }
    .container .two.columns                     { width: 14%; }
    .container .three.columns                   { width: 22%; }
    .container .four.columns                    { width: 30%; }
    .container .five.columns                    { width: 38%; }
    .container .six.columns                     { width: 46%; }
    .container .seven.columns                   { width: 54%; }
    .container .eight.columns                   { width: 62%; }
    .container .nine.columns                    { width: 70%; }
    .container .ten.columns                     { width: 78%; }
    .container .eleven.columns                  { width: 86%; }
    .container .twelve.columns                  { width: 94%; }
	
	
	/* fixed layout only columns (not responsive)
	=============================================================*/
	.container .one.column_fixed,
    .container .one.columns_fixed              		  { width: 6%;  }
    .container .two.columns_fixed                     { width: 14%; }
    .container .three.columns_fixed                   { width: 22%; }
    .container .four.columns_fixed                    { width: 30%; }
    .container .five.columns_fixed                    { width: 38%; }
    .container .six.columns_fixed                     { width: 46%; }
    .container .seven.columns_fixed                   { width: 54%; }
    .container .eight.columns_fixed                   { width: 62%; }
    .container .nine.columns_fixed                    { width: 70%; }
    .container .ten.columns_fixed                     { width: 78%; }
    .container .eleven.columns_fixed                  { width: 86%; }
    .container .twelve.columns_fixed                  { width: 94%; }
	
	
	/*
    .container .thirteen.columns                { width: 78%; }
    .container .fourteen.columns                { width: 84%; }
    .container .fifteen.columns                 { width: 90%; }
    .container .sixteen.columns                 { width: 96%; }
	*/
	
	/* fixed
	================================================================
	 .container .one.column,
    .container .one.columns                     { width: 40px;  }
    .container .two.columns                     { width: 100px; }
    .container .three.columns                   { width: 160px; }
    .container .four.columns                    { width: 220px; }
    .container .five.columns                    { width: 280px; }
    .container .six.columns                     { width: 340px; }
    .container .seven.columns                   { width: 400px; }
    .container .eight.columns                   { width: 460px; }
    .container .nine.columns                    { width: 520px; }
    .container .ten.columns                     { width: 580px; }
    .container .eleven.columns                  { width: 640px; }
    .container .twelve.columns                  { width: 700px; }
    .container .thirteen.columns                { width: 760px; }
    .container .fourteen.columns                { width: 820px; }
    .container .fifteen.columns                 { width: 880px; }
    .container .sixteen.columns                 { width: 940px; }
	
	    .container .offset-by-one                   { margin-left: 60px;  }
    .container .offset-by-two                   { margin-left: 120px; }
    .container .offset-by-three                 { margin-left: 180px; }
    .container .offset-by-four                  { margin-left: 240px; }
    .container .offset-by-five                  { margin-left: 300px; }
    .container .offset-by-six                   { margin-left: 360px; }
    .container .offset-by-seven                 { margin-left: 420px; }
    .container .offset-by-eight                 { margin-left: 480px; }
    .container .offset-by-nine                  { margin-left: 540px; }
    .container .offset-by-ten                   { margin-left: 600px; }
    .container .offset-by-eleven                { margin-left: 660px; }
    .container .offset-by-twelve                { margin-left: 720px; }
    .container .offset-by-thirteen              { margin-left: 780px; }
    .container .offset-by-fourteen              { margin-left: 840px; }
    .container .offset-by-fifteen               { margin-left: 900px; }
	
	
*/
    .container .one-third.columns                { width: 33%; }
    .container .two-thirds.columns               { width: 66%; }

    /* Offsets */

	
    .container .offset-by-one                   { margin-left: 8%;  }
    .container .offset-by-two                   { margin-left: 16%; }
    .container .offset-by-three                 { margin-left: 24%; }
    .container .offset-by-four                  { margin-left: 32%; }
    .container .offset-by-five                  { margin-left: 40%; }
    .container .offset-by-six                   { margin-left: 48%; }
    .container .offset-by-seven                 { margin-left: 56%; }
    .container .offset-by-eight                 { margin-left: 64%; }
    .container .offset-by-nine                  { margin-left: 72%; }
    .container .offset-by-ten                   { margin-left: 80%; }
    .container .offset-by-eleven                { margin-left: 88%; }
	/*
    .container .offset-by-twelve                { margin-left: 72%; }
    .container .offset-by-thirteen              { margin-left: 78%; }
    .container .offset-by-fourteen              { margin-left: 84%; }
    .container .offset-by-fifteen               { margin-left: 90%; }
	*/


/* #Clearing
================================================== */

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

    /* Use group class on parent to clear nested columns,
    or wrap each row of columns in a <div class="row"> */
    .group:before,
    .group:after,
    .row:before,
    .row:after {
      content: '\0020';
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0; }
    .row:after,
    .group:after {
      clear: both; }
    .row,
    .group {
      zoom: 1; }

    /* You can also use a <br class="clear" /> to clear columns */
    .clear {
      clear: both;
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0;
    }