@charset "UTF-8";
/* CSS Document */

body {background: #524f49; margin: 0 auto; font-family: 'Source Sans Pro', helvetica, arial, sans-serif; font-size: 100%; line-height: 1.4em; color: #383838;}
.container {margin: 60px auto 0px; width: 880px; background-color: none;}
.headerhome {width: 880px; height: 40px; padding: 0px; margin: 0px; background: url(images/roundtop_black.jpg) 0 0 no-repeat}
.header {width: 880px; height: 40px; padding: 0px; margin: 0px; background: url(images/roundtop_white.jpg) 0 0 no-repeat}
.footer {width: 880px; height: 40px; padding: 0px; margin: 0px; background: url(images/roundbottom_white.jpg) bottom left no-repeat #ffffff;}

p, li, a {font-size: .9375em;}

p {margin: 0 0 .75em;}
li {margin: 0 0 1px;}

h1, h2, h3, h4, h5 {font-family: 'Oswald', helvetica, arial, sans-serif; font-weight: 400; margin: 0 0 .875em; padding-top: .5em;}

h1 {font-size: 1.75em; padding: 0;}
h2 {font-size: 1.5em;}
h3 {font-size: 1.25em;}
h4 {font-size: 1.1em;}

ul {margin: .75em 0 1em;}

a:link, a:visited {color: #4e6c92;}
a:hover {color: #3970b4;}

#light {
	font-weight: 300!important;}

#caption {
	display: block;
	text-transform: none!important;
	font-weight: 300;
	font-style: italic;
	padding: 5px 0 0;
	letter-spacing: 0;
	font-size: .94em;}
	
ul#topnav {
	width: 600px; 
	height: 30px; 
	float: right; 
	margin: 0px;
	padding: 0px; 
	list-style: none;
	overflow: hidden;}
	
ul#topnav li {
	display: inline;}
	
ul#topnav a {
	display: block; 
	float: right;
	height: 30px;
	line-height: 30px;
	overflow: hidden;
	background-position: 0 0px;
	background-repeat: no-repeat;
	text-indent: -9000px;
	margin: 0px;
	padding: 0px;}
	
ul#topnav li a:hover, ul#topnav li.selected a {background-position: 0px -30px; line-height: 30px;}

ul#topnav li#services a {width: 100px; background-image: url(images/topnav/services.gif)}
ul#topnav li#howitworks a {width: 120px; background-image: url(images/topnav/howitworks.gif)}
ul#topnav li#projects a {width: 100px; background-image: url(images/topnav/projects.gif)}
ul#topnav li#coloronline a {width: 120px; background-image: url(images/topnav/coloronline.gif)}
ul#topnav li#flips a {width: 80px; background-image: url(images/topnav/flips.gif)}
ul#topnav li#posts a {width: 80px; background-image: url(images/topnav/posts.gif)}
ul#topnav li#home a {width: 80px; background-image: url(images/topnav/home.gif)}
ul#topnav li#contact a {width: 120px; background-image: url(images/topnav/contact.gif)}

.maincontent {width: 880px; margin: 0 auto; padding-bottom: 40px; background-color: #ffffff;}
.bodybox {width: 880px; margin: 0px; padding-top: 40px;}
.leftcol {display: block; width: 200px; height: auto; float: left; margin: 0 0 0 40px; padding: 0px;}
.leftcolinner {width: 200px; margin: 0 0 20px; background: url(images/bubbletop.jpg) top left no-repeat #e5edf2;}
.leftcolinnercontent {width: 160px; margin: 0 20px 0px; padding-bottom: 5px}
.leftcolinnercontent a {display: block; font-size: 12px; color: #5a7a8b; margin:0 auto 4px; text-align: center}
.leftcolinnercontent a:hover {color: #317498;}
.leftcolinnercontent p {color: #627077; font-size: 12px; margin:0 auto 2px; text-align: center}
.rightcol {width: 600px; margin: 0 0 0 280px;}
.rightcol_body {margin: 40px 40px 0 0;}
a.sublink {display: block; font-size: 14px; font-weight: bold; color: #315172; margin: 18px 0 14px;}
a.sublink:hover {color: #417ebe} 

a.contactbutton {
	display: block;
	width: 132px;
	margin: 24px auto 0; 
	padding: 8px 8px 8px;
	font-size: .875em;
	line-height: 1em;
	letter-spacing: .15em;
	text-align: center;
	color: #61605f; 
	text-decoration: none;
	border: 1px solid #b3b1af;
	border-radius: 2px; 
	-webkit-border-radius: 2px; 
	-moz-border-radius: 2px; 
	background-color: #f5f1eb; 
	box-shadow: inset 0px 0px 20px 12px rgba(0,0,0,0.05);
	}

a.contactbutton:hover {
	background-color: #fffbf5; }



.collapsible {
	font-family: 'Source Sans Pro', helvetica, arial, sans-serif;
	font-size: 1em; 
	font-weight: 600;
	letter-spacing: .03em;
	text-transform: uppercase;
	color: #233657;
	cursor: pointer;
	margin: .875em 0 .25em 0;
	line-height: 1.5em;
	text-decoration: none;
	border-top: 1px solid #b4bccc;
	padding: 20px 0 5px;}

.active, .collapsible:hover {background-color: #ffffff}

.content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;}