@import url(https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,300,700);

body {
	margin: 0 auto;
	font-family: 'Open Sans', Tahoma, sans-serif;
	font-size: 11pt;
	color: #333;
	background-color: #fff;
}

#container {
	width: 800px;
	margin: 0 auto;
	padding: 10px;
}

#header {
	width: 100%;
	background-repeat: no-repeat;
	background-color: #0099bb;	
	text-align: center;
	margin: 0 auto;
}
#headerimg {
	background-image:url(https://efiction.org/webpics/header.png);
	background-repeat: no-repeat;
	background-color: #0099bb;	
	width: 637px;
	height: 234px;
	text-align: center;
	margin: 0 auto;
}

a:link, a:active, a:visited { 
	color: #0099bb;
	text-decoration: none;
	text-transform: none;
	font-weight: normal;
}
a:hover { 
	color: #ccc;
	border-width: 0 0 1px 0;
	border-style: solid;
	border-color: #ccc;
}

.alert-box {
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px; 
  padding: 1px;
  margin: 1px;
}
.error {
  background-color:#ffecec;
  border: 1px solid #f5aca6;
}
.success {
  background-color:#e9ffd9;
  border: 1px solid #a6ca8a;
}
.warning {
  background-color:#fff8c4;
  border: 1px solid #f2c779;
}
.info {
  background-color:#e3f7fc;
  border: 1px solid #8ed9f6;
}

* {
	margin: 0;
	padding: 0;
	}

*, *:after, *:before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.grid-wrapper {
/*	width: 1400px;*/
	max-width: 1440px;
	min-width: 755px;
	margin: 0 auto;
	padding: 6px;
	overflow: hidden;
}

.grid-wrapper:after {
	content: "";
	display: table;
	clear: both;
}

[class*='gb-'] {
	float: left;
	padding: 6px;
}

[class*='gb-']:last-of-type {
	padding-right: 0;
}

/* class gb -- grid box */
.gb-100, .gb-full {
	width: 100%;
}

.gb-90 {
	width: 90%;
}

.gb-80 {
	width: 80%;
}

.gb-70 {
	width: 70%;
}

.gb-60 {
	width: 60%;
}

.gb-50, .gb-half, .gb-2qrt {
	width: 50%;
}

.gb-40 {
	width: 40%;
}

.gb-30 {
	width: 30%;
}

.gb-20 {
	width: 20%;
}

.gb-10 {
	width: 10%;
}

.gb-1thrd {
	width: 33%;
}

.gb-2thrd {
	width: 67%;
}

.gb-1qrt {
	width: 25%;
}

.gb-3qrt {
	width: 75%;
}

/* golden ratio: http://en.wikipedia.org/wiki/Golden_ratio */
.gb-golden1 {
	width: 38.2%;
}

.gb-golden2 {
	width: 61.8%;
}

@media handheld, only screen and (max-width: 825px) {
	.grid-wrapper {
		width: 100%;
		min-width: 0;
		margin: 0;
		padding: 0;
	}

[class*="gb-"] { 
   display: block;
    float: none;
    padding: 0;
    margin: 0;
    width: 100% !important;
  }

@media screen and ( max-width: 567px )  {
  .screen-micro,
  .screen-micro > [class*="gb-"] {
  display: none; 	
  }
}