/* CSS Document */

.success {
	width:auto;
	font-weight:bold;
	padding:3px 0px 3px 0px;
	color:#065700;
	background-color:#9fd89a;
	border:1px solid #087400;
	text-align:center;
	margin-bottom:15px;
}

.error {
	width:auto;
	font-weight:bold;
	padding:3px 0px 3px 0px;
	color:#8e0000;
	background-color:#f2aeae;
	border:1px solid #c20000;
	text-align:center;
	margin-bottom:15px;
}

body {
	width:100%;
	height:100%;
	padding:0px;
	margin:0px;
	font-family:'Brawler', serif;
	font-size:13px;
	color:#666;
	background-color:#fff;
}

a {
	color:#267cd9;
	text-decoration:none;
}

a:visited {
	color:#c44d58;
	text-decoration:none;
}

a:hover {
	color:#4978ab;
	text-decoration:none;
}

a:active {
	color:#4978ab;
	text-decoration:none;
}

h1 {
	font-size:30px;
	font-weight:bold;
	padding:0px;
	margin:0px 0px 10px 0px;
	color:#000;
}

h2 {
	font-size:24px;
	font-weight:bold;
	padding:0px;
	margin:0px 0px 5px 0px;
	color:#000;
}

h3 {
	font-size:18px;
	font-weight:bold;
	padding:0px;
	margin:0px 0px 5px 0px;
	color:#000;
}

.clear {
	clear:both;
	width:100%;
	height:0px;
	font-size:0px;
}

.wrapper {
	position:relative;
	margin:0px auto;
	width:960px;
}

.resources {
	padding:6px 0px;
	font-family: 'Gloria Hallelujah', cursive;
	color:#4d4d4d;
	font-size:18px;
}

.resources a, .resources a:visited {
	opacity:.7;
}
.resources a:hover, .resources a:active {
	opacity:1;
}

.handwriting {
	font-family: 'Gloria Hallelujah', cursive;
}

.green-text {
	color:#99be36;
}

.header {
	width:960px;
	height:131px;
	background-image:url(/images/bg-header.jpg);
	background-repeat:no-repeat;
	background-position:top center;
}

.logo {
	float:left;
	width:249px;
	height:100px;
	padding:15px 15px 0px 25px;
}

.nav {
	float:left;
	width:665px;
}

#mainnav {
	position:relative;
	list-style: none;
	margin:10px 0px 0px 0px;
	padding:0px 0px 0px 0px;
	width:665px;
	height:100px;
	font-size:15px;
	text-align:center;
}

#mainnav li {
	display: block inline;
	float:left;
	width:auto;
	height:100px;
	line-height:15px;
	font-size:15px;
	text-align:center;
	font-weight:normal;
	padding:0px;
	margin:0px;
}

#mainnav li a {
	display: block inline;
	float:left;
	width:auto;
	height:35px;
	padding:65px 22px 0px 22px;
	margin:0px 0px 0px 0px;
	line-height:17px;
	text-decoration: none;
	color:#fff;
	font-size:17px;
	font-weight:normal;
	text-align:center;
	text-transform:uppercase;
	background-position:top center;
	background-repeat:no-repeat;
	opacity:.8;
}

#mainnav li a.last {
	border: 0;
}

#mainnav li a:hover, #mainnav li.current {
	text-decoration:none;
	color:#fff;
	background-repeat:no-repeat;
	background-position:top center;
	opacity:1;
}

.nav-services {
	background-image:url(/images/bg-nav-services.gif);
}
.nav-services:hover {
	background-image:url(/images/bg-nav-services-hover.gif);
}
.nav-portfolio {
	background-image:url(/images/bg-nav-portfolio.gif);
}
.nav-portfolio:hover {
	background-image:url(/images/bg-nav-portfolio-hover.gif);
}
.nav-hosting {
	background-image:url(/images/bg-nav-hosting.gif);
}
.nav-hosting:hover {
	background-image:url(/images/bg-nav-hosting-hover.gif);
}
.nav-studio {
	background-image:url(/images/bg-nav-studio.gif);
}
.nav-studio:hover {
	background-image:url(/images/bg-nav-studio-hover.gif);
}
.nav-contact {
	background-image:url(/images/bg-nav-contact.gif);
}
.nav-contact:hover {
	background-image:url(/images/bg-nav-contact-hover.gif);
}
.preload {
	display:none;
}

.nav-subtitle {
	font-size:10px;
	font-family: 'Gloria Hallelujah', cursive;
	text-transform:lowercase;
	font-weight:normal;
}

.slides {
	width:960px;
	height:415px;
	padding:5px 0px 10px 0px;
}

/*--Main Container--*/
.main_view {
	float: left;
	position: relative;
}
/*--Window/Masking Styles--*/
.window {
	height:415px;	width: 960px;
	overflow: hidden; /*--Hides anything outside of the set width/height--*/
	position: relative;
}
.image_reel {
	position: absolute;
	top: 0; left: 0;
}
.image_reel img {float: left;}

/*--Paging Styles--*/
.paging {
	position: absolute;
	bottom: 10px; right: -7px;
	width: 178px; height:47px;
	z-index: 100; /*--Assures the paging stays on the top layer--*/
	text-align: center;
	line-height: 40px;
	background: url(/images/paging_bg2.png) no-repeat;
	display: none; /*--Hidden by default, will be later shown with jQuery--*/
}
.paging a {
	padding: 5px;
	text-decoration: none;
	color: #fff;
	font-weight: bold;
}
.paging a.active {
	font-weight: bold;
	background: #6f1f24;
	/*border: 1px solid #610000;
	-moz-border-radius: 3px;
	-khtml-border-radius: 3px;
	-webkit-border-radius: 3px;*/
}
.paging a:hover {font-weight: bold;}

.home {
	background-image:url(/images/bg-home.jpg);
	background-repeat:no-repeat;
	background-position:top left;
}

.home-words {
	float:left;
	width:342px;
	height:200px;
	padding-left:34px;
	margin-right:35px;
	padding-top:10px;
}

.home-word-1 {
	font-size:33px;
	font-weight:normal;
	color:#556270;
	margin-bottom:4px;
	text-transform:uppercase;
}

.home-word-2 {
	font-size:33px;
	font-weight:normal;
	color:#95b442;
	margin-bottom:4px;
	text-transform:uppercase;
}

.home-word-3 {
	font-size:33px;
	font-weight:normal;
	color:#308983;
	margin-bottom:4px;
	text-transform:uppercase;
}

.home-word-4 {
	font-size:33px;
	font-weight:normal;
	color:#c44d58;
	text-transform:uppercase;
}

.home-exp {
	float:left;
	width:549px;
}

.home-exp-title {
	width:529px;
	height:40px;
	padding:0px 10px 0px 10px;
	margin-bottom:5px;
	background-color:#b5d857;
	color:#fff;
	font-size:20px;
	font-family: 'Gloria Hallelujah', cursive;
}

.home-exp-title-big {
	float:left;
	font-size:30px;
	padding:0px;
	margin:0px 15px 0px 0px;
	font-family:'Brawler', serif;
}

.home-exp-left {
	float:left;
	width:260px;
	height:87px;
	padding:10px 14px 10px 0px;
	font-size:30px;
	line-height:27px;
	color:#2e2e2e;
	background-image:url(/images/bg-home-exp.jpg);
	background-repeat:no-repeat;
	background-position:top right;
}

.home-exp-right {
	float:left;
	width:260px;
	height:87px;
	padding:10px 0px 10px 10px;
	font-size:30px;
	line-height:27px;
	color:#2e2e2e;
}

.home-exp-value {
	float:right;
	font-size:59px;
	padding-top:15px;
	color:#99be36;
}

.home-exp-stat-title {
	float:left;
	width:210px;
	height:25px;
	padding:0px 5px 5px 5px;
	background-color:#eaeaea;
	margin:10px 6px 0px 0px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	color:#363434;
	font-size:18px;
	text-align:center;
}

.home-exp-stat-value {
	float:left;
	width:24px;
	height:25px;
	background-color:#99be36;
	color:#fff;
	font-size:20px;
	padding:0px 5px 5px 5px;
	margin:10px 0px 0px 0px;
	text-align:center;
}

.home-left {
	float:left;
	width:590px;
	margin:0px 50px 0px 0px;
}

.home-right {
	float:left;
	width:320px;
}

.ratebox {
	border-top:2px solid #4d4c4c;
	border-bottom:2px solid #4d4c4c;
	background-color:#f4f6f8;
	padding:10px;
	color:#556270;
	margin:0px 0px 10px 0px;
}

.ratebox-left {
	float:left;
	width:370px;
	font-size:46px;
	padding-right:10px;
	margin-right:10px;
	border-right:1px solid #c5c5c5;
}

.ratebox-right {
	float:left;
	width:175px;
	font-size:43px;
	padding-top:3px;
}

.ratebox-right-2 {
	float:left;
	width:175px;
	height:82px;
	font-size:43px;
	margin-right:10px;
	border-right:1px solid #c5c5c5;
}

.ratebox-right-3 {
	float:left;
	width:350px;
	height:82px;
	font-size:20px;
}

.port-col-1 {
	float:left;
	width:180px;
	padding-right:12px;
	border-right:1px solid #c5c5c5;
	margin-right:12px;
}

.port-col-2 {
	float:left;
	width:180px;
	padding-right:12px;
	border-right:1px solid #c5c5c5;
	margin-right:12px;
}

.port-col-3 {
	float:left;
	width:180px;
}

.port-col-title {
	font-size:19px;
	color:#a3a3a3;
}

.port-col-row {
	width:180px;
	height:150px;
	margin-top:15px;
}

.home-test {
	width:287px;
	height:600px;
	margin:-41px 0px 0px 8px;
	padding:50px 10px 10px 10px;
	background-color:#f4f6f8;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	-moz-box-shadow: 5px 5px #bfc5cb;
	-webkit-box-shadow: 5px 5px #bfc5cb;
	box-shadow: 5px 5px #bfc5cb;
	z-index:1;
	font-size:14px;
}

.home-test-title {
	position:relative;
	top:0px;
	left:0px;
	width:184px;
	height:49px;
	padding:2px 0px 0px 10px;
	font-size:28px;
	color:#fff;
	background-image:url(/images/bg-home-test-title.jpg);
	background-repeat:no-repeat;
	background-position:top left;
	z-index:2;
}

.footer {
	border-top:2px solid #efefef;
	padding:15px 0px 15px 0px;
}

.credits {
	color:#949393;
	font-size:12px;
	padding-top:10px;
}

.footer-blog {
	float:left;
	width:650px;
	margin-right:10px;
}

.footer-info {
	float:left;
	width:300px;
	text-align:right;
	font-size:15px;
}

.footer-blog-col {
	border-right:1px solid #dbdada;
	color:#9d9d9d;
	width:152px;
	padding:0px 5px;
	font-size:11px;
}

.footer-blog-date {
	font-size:26px;
	color:#9d9d9d;
}

.footer-blog-title {
	font-size:16px;
	color:#9d9d9d;
}

.footer-title {
	font-size:15px;
	color:#656565;
	margin-bottom:6px;
	padding-top:10px;
}

.sitemap {
	float:left;
	width:130px;
	margin-right:20px;
	font-size:12px;
	padding-left:10px;
}
.sitemap a, .sitemap a:visited {
	display:block;
	color:#98a3af;
	margin-bottom:3px;
}
.sitemap a:hover, .sitemap a:active {
	display:block;
	color:#556270;
	margin-bottom:3px;
}

.footer-resources {
	float:left;
	width:220px;
	margin-right:20px;
	font-size:12px;
}
.footer-resources a, .footer-resources a:visited {
	display:block;
	color:#98a3af;
	margin-bottom:3px;
}
.footer-resources a:hover, .footer-resources a:active {
	display:block;
	color:#556270;
	margin-bottom:3px;
}

.links {
	float:left;
	width:240px;
	margin-right:20px;
	font-size:12px;
}
.links a {
	display:block;
	color:#98a3af;
	margin-bottom:3px;
}

.links a, .links a:visited {
	display:block;
	color:#98a3af;
	margin-bottom:3px;
}
.links a:hover, .links a:active {
	display:block;
	color:#556270;
	margin-bottom:3px;
}

.buffalo {
	float:left;
	width:300px;
	height:180px;
	background-image:url(/images/footer-buffalo-ny.jpg);
	background-position:bottom right;
	background-repeat:no-repeat;
	font-size:19px;
	font-family: 'Gloria Hallelujah', cursive;
	color:#9d9d9d;
}

.item-border {
	border:1px solid #ccc;
}

.item {
	width:176px;
	height:146px;
	border:1px solid #fff;	
	margin:0px;
	
	/* required to hide the image after resized */
	overflow:hidden;
	
	/* for child absolute position */
	position:relative;
	
	/* display div in line */
	float:left;
}

.item .caption {
	width:176px;
	height:146px;
	background:#fff;
	color:#000;
	font-weight:bold;
		
	/* fix it at the bottom */
	position:absolute;
	left:0;

	/* hide it by default */
	display:none;

	/* opacity setting */
	filter:alpha(opacity=90);    /* ie  */
	-moz-opacity:0.9;    /* old mozilla browser like netscape  */
	-khtml-opacity: 0.9;    /* for really really old safari */  
	opacity: 0.9;    /* css standard, currently it works in most modern browsers like firefox,  */

}

.item .caption a {
	text-decoration:none;
	color:#267cd9;
	font-size:16px;	
	
	/* add spacing and make the whole row clickable*/
	padding:5px;
	display:block;
}

.item .caption p {
	padding:5px;	
	margin:0;
	font-size:12px;
	line-height:15px;
	font-family: 'Gloria Hallelujah', cursive;
}

.item img {
	border:0;
	
	/* allow javascript moves the img position*/
	position:absolute;
}

.left {
	float:left;
	width:730px;
	margin-right:20px;
}

.right {
	float:left;
	width:210px;
}

.subnav-title {
	font-size:28px;
	color:#242424;
	font-family: 'Gloria Hallelujah', cursive;
	margin-bottom:5px;
}

.subnav {
	width:210px;
}

.subnav a {
	display:block;
	width:185px;
	padding:0px 0px 0px 25px;
	background-image:url(/images/bg-subnav.jpg);
	background-position:top left;
	background-repeat:no-repeat; 
	text-decoration:none;
	color:#267cd9;
	font-size:16px;
	margin-bottom:3px;
}

.subnav a:visited {
	display:block;
	width:185px;
	padding:0px 0px 0px 25px;
	background-image:url(/images/bg-subnav-visited.jpg);
	background-position:top left;
	background-repeat:no-repeat; 
	text-decoration:none;
	color:#c44d58;
	font-size:16px;
	margin-bottom:3px;
}

.subnav a:hover, .subnav a:active {
	display:block;
	width:185px;
	padding:0px 0px 0px 25px;
	background-image:url(/images/bg-subnav-hover.jpg) !important;
	background-position:top left;
	background-repeat:no-repeat; 
	text-decoration:none;
	color:#4978ab;
	font-size:16px;
	margin-bottom:3px;
}

.row {
	padding-bottom:10px;
	border-bottom:2px dashed #ccc;
	margin-bottom:10px;
}

.studio-grid {
	float:left;
	width:470px;
	height:307px;
	margin:0px 20px 20px 0px;
}

.studio-grid-thumb {
	width:470px;
	height:275px;
	overflow:hidden;
	margin-bottom:2px;
}

.studio-grid-title {
	width:470px;
	font-size:20px;
}

.studio-grid-title a {
	display:block;
	padding:5px 10px;
	width:450px;
	background-color:#267cd9;
	color:#fff;
	font-weight:bold;
}

.studio-left {
	float:left;
	width:470px;
	height:auto;
	margin:0px 20px 0px 0px;
}

.studio-right {
	float:left;
	width:470px;
	height:auto;
}

.contact-grid {
	float:left;
	width:286px;
	height:235px;
	padding:10px;
	border:2px dashed #ccc;
	margin:0px 15px 15px 0px;
	background-color:#ffffff;
}
.contact-grid:hover {
	background-color:#fdfff0;
}

.contact-split {
	float:left;
	width:449px;
	height:375px;
	padding:10px;
	border:2px dashed #ccc;
	margin:0px 14px 0px 0px;
	background-color:#ffffff;
}

.column_contact_left {
	width:100px;
	color:#000;
	font-size:13px;
	font-weight:bold;
	padding-top:3px;
}

.column_contact_left_2 {
	width:100px;
	color:#000;
	font-size:13px;
	font-weight:bold;
	padding-top:3px;
}

.column_contact_right_2 {
	width:120px;
}

.column_contact_right_3 {
	width:180px;
}

.column_contact_right {
	width:370px;
}

.column_contact_textbox {
	width:425px;
	padding:5px;
	font-size:13px;
	color:#2b2b2b;
	border:1px solid #ccc;
	background-color:#f1f6fb;
	font-family:'Brawler', serif;
}

.column_contact_textbox:focus {
	background-color:#fff;
	border:1px solid #4978ab;
}

.contact_table_left {
	width:215px;
	color:#000;
	font-size:13px;
	font-weight:bold;
}

.contact_table_right {
	width:215px;
	color:#000;
	font-size:13px;
	font-weight:bold;
}

.port-col-grid {
	float:left;
	width:230px;
	height:191px;
	margin:0px 13px 14px 0px;
}

.item-2-border {
	border:1px solid #ccc;
}

.item-2 {
	width:226px;
	height:187px;
	border:1px solid #fff;	
	margin:0px;
	
	/* required to hide the image after resized */
	overflow:hidden;
	
	/* for child absolute position */
	position:relative;
	
	/* display div in line */
	float:left;
}

.item-2 .caption {
	width:226px;
	height:187px;
	background:#fff;
	color:#000;
	font-weight:bold;
		
	/* fix it at the bottom */
	position:absolute;
	left:0;

	/* hide it by default */
	display:none;

	/* opacity setting */
	filter:alpha(opacity=90);    /* ie  */
	-moz-opacity:0.9;    /* old mozilla browser like netscape  */
	-khtml-opacity: 0.9;    /* for really really old safari */  
	opacity: 0.9;    /* css standard, currently it works in most modern browsers like firefox,  */

}

.item-2 .caption a {
	text-decoration:none;
	color:#267cd9;
	font-size:16px;	
	
	/* add spacing and make the whole row clickable*/
	padding:5px;
	display:block;
}

.item-2 .caption p {
	padding:5px;	
	margin:0;
	font-size:12px;
	line-height:15px;
	font-family: 'Gloria Hallelujah', cursive;
}

.item-2 img {
	border:0;
	
	/* allow javascript moves the img position*/
	position:absolute;
}

.project-text {
	float:left;
	width:620px;
	margin-right:20px;
}

.project-info {
	float:left;
	width:320px;
}

.project-info-box {
	width:287px;
	height:330px;
	margin:-41px 0px 0px 8px;
	padding:50px 10px 10px 10px;
	background-color:#f4f6f8;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	-moz-box-shadow: 5px 5px #bfc5cb;
	-webkit-box-shadow: 5px 5px #bfc5cb;
	box-shadow: 5px 5px #bfc5cb;
	z-index:1;
	font-size:14px;
}

.project-info-title {
	position:relative;
	top:0px;
	left:0px;
	width:184px;
	height:49px;
	padding:2px 0px 0px 10px;
	font-size:28px;
	color:#fff;
	background-image:url(/images/bg-home-test-title.jpg);
	background-repeat:no-repeat;
	background-position:top left;
	z-index:2;
}

.client-logo {
	float:right;
	width:300px;
	margin:0px 0px 15px 15px;
}

.breacrumbs {
	padding:5px 0px 5px 0px;
	font-size:11px;
}

.hosting-price {
	float:right;
	width:150px;
	font-size:24px;
	color:#000;
	text-align:right;
}

.hosting-grid {
	float:left;
	width:286px;
	height:190px;
	padding:10px;
	border:2px dashed #ccc;
	margin:0px 15px 15px 0px;
	background-color:#ffffff;
}
.hosting-grid:hover {
	background-color:#fdfff0;
}

.hosting-grid-full {
	width:auto;
	height:auto;
	padding:10px;
	border:2px dashed #ccc;
	margin:0px 0px 15px 0px;
	background-color:#ffffff;
}
.hosting-grid-full:hover {
	background-color:#fdfff0;
}

.temp-terms-grid {
	float:left;
	width:607px;
	height:190px;
	padding:10px;
	border:2px dashed #ccc;
	margin:0px 15px 15px 0px;
	background-color:#ffffff;
}

.terms-scroller {
	padding:5px;
	height:148px;
	overflow:scroll;
	font-size:11px;
	border:1px solid #eaeaea;
}

.temp-hosting-grid {
	float:left;
	width:286px;
	height:190px;
	padding:10px;
	border:2px dashed #ccc;
	margin:0px 15px 15px 0px;
	background-color:#ffffff;
}
.temp-hosting-grid:hover {
	background-color:#fdfff0;
}

.service-grid {
	float:left;
	width:208px;
	height:250px;
	padding:10px;
	border:2px dashed #ccc;
	margin:0px 10px 10px 0px;
	background-color:#ffffff;
	text-align:center;
}
.service-grid:hover {
	background-color:#fdfff0;
}

.service-note {
	width:auto;
	border-top:1px solid #eaeaea;
	padding:3px 0px 3px 0px;
}

.template-float {
	float:left;
	width:240px;
}

.template-icon {
	position:relative;
	top:0px;
	left:0px;
	width:36px;
	height:36px;
	z-index:2;
}

.template-grid {
	width:193px;
	height:210px;
	padding:10px 10px 10px 10px;
	border:2px dashed #ccc;
	margin:-28px 10px 10px 10px;
	background-color:#ffffff;
	z-index:1;
}
.template-grid:hover {
	background-color:#fdfff0;
}

.service-left {
	float:left;
	width:470px;
}

/* PAGINATION STYLES */

.pages {
	width:auto;
	font-size:12px;
	padding:0px 0px 5px 0px;
	margin:0px auto 0px auto;
	clear: left;
	/*font-size: 85%;*/
	text-align:center;
	font-weight:normal;
}

.pages a, .pages span {
	display: block;
	float: left;
	padding: 0.2em 0.5em 0.2em 0.5em;
	margin-right: 0.1em;
	border:1px solid #267cd9;
	background-image: none;
	background-repeat: repeat;
	background-attachment: scroll;
	background-x-position: 0%;
	background-y-position: 0%;
	font-weight:normal;
	font-size:12px;
	text-decoration:none;
}

.pages span.current {
	border: 1px solid #267cd9;
	font-size:12px;
	font-weight: bold;
	background-color: #267cd9;
	background-image: none;
	background-repeat: repeat;
	background-attachment: scroll;
	background-x-position: 0%;
	background-y-position: 0%;
	color: #fff;
	font-weight:normal;
	text-decoration:none;
}

.pages a {
	border:1px solid #267cd9;
	text-decoration: none;
	font-weight:normal;
	font-size:12px;
	color: #267cd9;
	text-decoration:none;
}

.pages a:hover {
	border-color: #267cd9;
	background-color: #267cd9;
	font-weight:normal;
	font-size:12px;
	color: #fff;
	text-decoration:none;
}

.pages span.nextprev {
	font-size:12px;
	color: #e5eaef;
	text-decoration:none;
}

.pages span.nextprev {
	font-size:12px;
	border:1px solid #e5eaef;
	color: #e5eaef;
}

.form-left {
	float:left;
	width:110px;
	font-weight:bold;
	font-size:13px;
	padding-top:5px;
}

.form-right {
	float:left;
	width:320px;
}

.textbox {
	width:310px;
	padding:5px;
	font-size:13px;
	color:#2b2b2b;
	border:1px solid #ccc;
	background-color:#f1f6fb;
	font-family:'Brawler', serif;
}

.textbox:focus {
	background-color:#fff;
	border:1px solid #4978ab;
}