/*  
 * RESET
 */
* {
	vertical-align: baseline;
	font-weight: inherit;
	font-family: inherit;
	font-style: inherit;
	font-size: 100%;
	border: 0 none;
	outline: 0;
	padding: 0;
	margin: 0;
}

/* 
 * GLOBALS
 */
body {
	background: #fff url('images/bg.jpg') repeat-x;
	font-family: "Helvetica Narrow", "Helvetica", Arial, "sans-serif";
	font-size: 100%;
	margin: 0;
	color: #4e6a74;
}
img { 
	border: none;
}
a:link {
	color: #4e6a74;
}
a:visited {
	color: #4e6a74;
}
a:hover {
	color: #613d27;
}
a:active {
	color: #ff7d02;
}
.left {
	float: left;
}
.right {
	float: right;
}
.clear {
	clear: both;
}
form { 
	margin: 0;
	padding: 0;
}
input, textarea, select, div.select_logo a:link, div.select_logo a:visited, div#uploadbutton {
	border: 1px solid #f3f1f1;
	background: url('images/input_bg.gif') repeat-x;
	padding: 8px;
	color: #949494;
	font-family: "Helvetica Narrow", "Helvetica", Arial, "sans-serif";
	font-size: 12px;
}
input:focus {
	border: 1px solid #96b2bd;
}

/*
 * FONTS & COLOURS
 */
h1, h2, h3, h4 {
	font-family: Georgia;
	font-style: italic;
	font-weight: normal;
}
em { font-style: italic; }
h1 { font-size: 32px; }
h2 { font-size: 24px; }
h3 { font-size: 18px; }
h4 { font-size: 14px; }
.yellow { color: #fff8d6; }
.pink {	color: #ffc4c4; }
.red { color: #d02d29; }
.brown { color: #5e483a; }
.black { color: #000; }
.orange { color: #ff7d02; }
.green { color: #82c07b; }

a.green_button:link, a.green_button:visited {
	background: #82c07b url('images/arrow.gif') 95% center no-repeat;;
	color: #fff;
	text-decoration: none;
	font-size: 24px;
	line-height: 32px;
	text-decoration: none;
	padding: 3px 33px 3px 8px;
	position: absolute;
	margin-top: 7px;
	margin-left: 115px;
	opacity: 0;
}
a.green_button:hover {
	background-color: #4f8a49;
}

a.more_link:link, a.more_link:visited { 
	display: block; 
	padding: 7px 0px 7px 8px; 
	text-align: right; 
	border-top: 1px solid #c1cdc9; 
	color: #506c76; 
	text-transform: uppercase;
	text-decoration: none;
	font-size: 9px;
	font-weight: bold;
}
a.more_link:hover { 
	border-top: 1px solid #613d27;
	color: #613d27;
}
div.spacer {
	height: 30px;
}
a.external_link:link, 
a.external_link:visited {
	background: url('images/external_link.gif') right center no-repeat;
	padding-right: 15px;
}

/*
 * SECTIONS
 */
div.header, div.content, div.recent_sites, div.footer {
	margin: 0 auto;
	width: 900px;
}

	/* HEADER */
	div.header_container {
		width: 960px;
		margin: 0 auto;
		/* background: transparent url('images/ie_logo.jpg') right top no-repeat; */
	}
		div.slogan {
			background: url('images/slogan_bg.gif') repeat-x;
			color: #fff;
			height: 32px;
			float: left;
			padding: 0 10px;
			line-height: 32px;
			font-size: 14px;
		}
		div.slogan a:link, div.slogan a:visited {
			color: #fff;
			text-decoration: none;
		}
		div.slogan em {
			font-family: "Georgia", "Times New Roman", sans-serif;
			font-style: italic;
			color: #e2f7ff;
		}
		
		div.logo {
			float: left;
			display: block;
			position: absolute;
			margin-top: 35px;
		}		
		div.menu {
			width: 200px;
			float: right;
			margin-top: -32px;
			position: relative;
		}
		div.menu a:link, div.menu a:visited {
			display: block;
			padding: 8px;
			color: #999;
			text-decoration: none;
			opacity: .5;
			font-weight: bold;
			text-transform: uppercase;
			font-size: .7em;
			background: #fff;
		}
		div.menu a:hover {
			background: #fff;
			color: #376d90;
		}

		div.logo a:hover {
			opacity: .7;
		}
		div.homebox {
			height: 253px;
			margin-top: 40px;
			background: url('images/homebox_bg.gif') repeat-x;
		}
		div.homebox div.left {
			width: 520px;
			padding: 30px;
		}
			div.homebox div.homebox_text,div.homebox div.homebox_text p, div.homebox div.homebox_image {
				opacity: 0;
			}
		div.homebox h1 {
			background-color: #f9faf8;
			font-size: 42px;
		}
		div.homebox p {
			background-color: #fbfcf9;
			color: #5e483a;
			font-size: 32px;
			line-height: 48px;
		}
		
	/* CONTENT */
	div.content {
	}
		div.content div.left {
			width: 30%;
			margin: 40px 0;
		}
		div.content div.right {
			width: 30%;
			margin: 40px 0;
		}	
		div.content h1 {
		}
		div.content strong {
			color: #64412a;
			font-weight: bold;
		}
		div.content p {
			padding: 8px 0;
			font-size: .8em;
			line-height: 1.6em;
		}
		div.why, div.browser {
			padding-right: 4.9%;
		}
		div.why, div.browser, div.do {
			height: 160px;
		}
		a.firefox, a.safari, a.opera {
			padding: 9px 0px 10px 37px;
			font-size: 11px;
			width: 66px;
			line-height: 32px !important;
			height: 32px;
		}
		a.firefox {
			background: url('images/firefox.gif') left 0 no-repeat;
		}
		a.firefox:hover {
			background-position: 0 -33px;
		}
		a.safari {
			background: url('images/safari.gif') left 0 no-repeat;
		}
		a.safari:hover {
			background-position: 0 -32px;
		}
		a.opera {
			background: url('images/opera.gif') left 0 no-repeat;
		}	
		a.opera:hover {
			background-position: 0 -31px;
		}
		a.get_button:link, a.get_button:visited {
			color: #fff;
			background: #4e6a74 url('images/arrow.gif') 95% center no-repeat;
			padding: 5px 28px 5px 8px;
			margin: 0;
			text-decoration: none;
			font-size: 10px;
			font-weight: bold;
			text-transform: uppercase;
		}
		a.get_button:hover {
			background: #508ab2 url('images/arrow.gif') 95% center no-repeat;
		}
	div.page {
		margin-top: 40px;
		margin-bottom: 20px;
		background: #fff;
	}
		div.page_inner {
			padding: 30px;
			display: block;
			min-height: 500px;
		}
		
			div.buttons_left {
				float: left;
				width: 210px;
				padding-right: 30px;
				height: 500px;
				font-size: 12px;
				color: #6b7b81;
				margin-bottom: 20px;
			}
				div.buttons_left h1 {
					font-style: normal;
					font-size: 48px;
					margin-bottom: 10px;
				}
				div.buttons_left strong { 
					color: #6c5548;
					font-weight: bold;
				}
				div.buttons_left p {
					line-height: 20px;
					margin-bottom: 10px;
				}
				input { 
					width: 191px;
					margin-bottom: 5px;
					vertical-align: baseline;
				}
				input.submit {
					float: right;
					width: 90px;
					background-image: none;
					background-color: #96b2bd;
					color: #fff;
					font-weight: bold;
				}
				input.submit:hover {
					cursor: pointer;
					background: #543d30;
				}
				div.buttons_left input.file_input {
					width: 100px !important;
				}
				div#uploadbutton {
					margin-bottom: 5px;
				}
				div.allowed_types { 
					float: left;
					font-size: 12px;
					color: #b1b1b1;
				}
				div#uploadbutton {
					cursor: pointer;
				}
				div#uploadbutton span {
					background: url('images/pictures.png') left center no-repeat;
					padding: 3px 0 3px 22px;
					cursor: pointer;
				}
				a#submit_button:link, a#submit_button:visited {
					float: right;
					padding: 8px 12px;
					color: #fff;
					background: #96b2bd;
					font-weight: bold;
					text-decoration: none;
				}
				a#submit_button:hover {
					background: #543d30;
				}
				div.html_code_container {
					padding-bottom: 20px;
				}
				input.html_code {
					width: 191px;
				}
				p.html_heading {
					background: url('images/copy_here.gif') right 15px no-repeat;
					padding-bottom: 5px;
					margin-bottom: 0;
					margin-top: 10px;
					padding-top: 15px;
					border-top: 2px dotted #cacaca;
				}
		
			div.buttons_right {
				float: left;
				width: 600px;
			}
			
			div.buttons_content {
			}
				div.buttons_content h2 {
					font-size: 40px;
					font-style: normal;
					margin-bottom: 5px;
					color: #5c381e;
				}
				div.buttons_content input {
					margin-bottom: 2px;
				}
				div.buttons_content label {
					font-size: 12px;
					padding-left: 15px;
				}
				div#buttons_tab, div#button_generator, div#redirect_code, div#submitted_buttons {
					-moz-border-radius-topleft: 30px;
					-webkit-border-top-left-radius: 30px;
					border-top-left-radius: 30px;
					border-top: 1px solid #96b2bd;
					border-left: 1px solid #96b2bd;
					clear: both;					
					padding: 30px 0 0 30px;
				}
				div#buttons_tab p, div#button_generator p, div#redirect_code p {
					padding: 3px 0;
				}
				
				ul.tabs {
					height: 30px;
					text-align: right;
					vertical-align: baseline;
				}		
					.ui-tabs .ui-tabs-hide {
					     display: none;
					}
					
					ul.tabs {
						float: right;
						margin: 0;
						padding: 0;
						list-style: none;
					}
					ul.tabs li {
						float: left;
						margin: 0;
						padding: 0;
						height: 30px;
					}
					ul.tabs li a {
						display: block;
						height: 30px;
						padding: 0 15px;
						line-height: 30px;
						margin-left: 1px;
						background: #cedce1;
						text-decoration: none;
						color: #fff;
						font-size: 12px;
						font-weight: bold;
					}
					ul.tabs li.ui-tabs-selected a:link, ul.tabs li.ui-tabs-selected a:visited {
						background: #96b2bd;
					}
					
					/* GENERATE BUTTON PAGE */
					div.select_logo {
						margin-top: 5px;
					}
					a#select_logo:link {						
						text-decoration: none;
						background: url('images/arrow_right.gif') 93% center no-repeat;
						padding-right: 18px;
					}
					
					div.select_logo_inner {
						background-color: #96B2BD;
						position: absolute;
						margin-left: 94px;
						margin-top: -60px;
						width: 176px;
						border: 1px solid #aaa;
					}

					div.logo_link   { background-position: left center; border-bottom: 1px solid #96B2BD; background-repeat: no-repeat; }
					div.logo_link:hover { border-bottom: 1px solid #000; cursor: pointer;}
					div.logo_preview { clear: both; width: 88px; height: 15px; background-position: center center; background-repeat: no-repeat;}
					
					div.generate_loading { 
						height: 24px;
						padding-top: 2px;
						font-size: 20px;
						color: #ccc;
						padding-left: 30px;
						background: url('images/loader.gif') no-repeat;
					}
					div.generate_response td {
						vertical-align: middle;
					}
					
					div.generate_response a {
						padding: 0 12px;
					}
					
					/* REDIRECT CODE */
					div.redirect_code_container {
						float: left;
						width: 340px;
					}
					textarea.redirect_code { 
						width: 320px;
						height: 160px;
						text-align: left;
					}
					div.redirect_description {
						float: left;
						width: 150px;
						padding-left: 30px;
						color: #afafaf;
					}
					
				/* WHY PAGE */
				div.why_page h1, div.why_page  h2, div.why_page h3 {
					font-style: normal;
				}
				div.why_page p {
					margin: 10px 30px 20px 0;
				}
				div.why_page h1 { font-size: 48px; margin-bottom: 15px; }
				div.why_page h2 { color: #6C5548; }
				div.why_page h3 { color: #bdd9e4; font-size: 36px; margin-bottom: 15px; }
				div.why_page p { line-height: 24px; color: #aaa; }
				div.why_left { float: left; width: 580px; border-right: 1px solid #bdd9e4; padding-right: 30px; }
				div.why_right { float: right; width: 190px; padding-left: 30px; }
					div.why_right ul {
						list-style: none;
						list-style-position: inside;
					}
					div.why_right ul li {
						padding: 0 0 10px 25px;
						font-size: 12px;
						line-height: 24px;
						color: #666;
						background: url('images/tick_circle_frame.png') left 3px no-repeat;
					}
					
				/* BROWSERS PAGE */
				div.browsers h1 {
					font-style: normal;
					font-size: 36px;
				}
				div.browsers a.heading:link, div.browsers a.heading:visited {
					font-size: 24px;
					text-decoration: none;
					margin-top: 20px;
					padding-bottom: 20px;	
					padding-top: 15px;	
					display: block;			
				}
					a.firefox48:link, a.firefox48:visited { background: url('images/firefox48.gif') 90px center no-repeat; }
					a.safari48:link, a.safari48:visited { background: url('images/safari48.gif') 70px center  no-repeat; }
					a.opera48:link, a.opera48:visited { background: url('images/opera48.gif') 70px center  no-repeat; }
					a.chrome48:link, a.chrome48:visited { background: url('images/chrome48.gif') 90px center  no-repeat; }
					
					div.browsers div {
						float: left;
						width: 170px;
						font-size: 12px;
						padding-right: 45px;
						
					}
					div.about_page p, div.browsers p, div.legal_page p, div.supported_page p, ol, ul {
						margin: 5px 0px 15px 0;
						line-height: 24px;
						color: #aaa;
					}
					div.browsers p strong {
						font-weight: bold;
						color: #97acb4;
					}
					a.download:link, a.download:visited {
						display: block;
						border-top: 1px ;
					}
					
				/* ABOUT PAGE */
				div.about_container {
					background: #fff url('images/about.jpg') right top no-repeat;
				}
				div.about_page {
					padding-left: 40px;
				}
				div.about_page h1, div.contact_page h1, div.supported_page h1 {
					font-style: normal;
					font-size: 48px;
				}
				div.about_page p {
				}
				
				/* LEGAL PAGE */
				div.legal_page h1 {
					font-size: 36px;
					font-style: normal;
					margin-bottom: 20px;
				}
				div.legal_page p {
					font-size: 12px;
				}
				div.legal_page ol, div.legal_page ul {
					list-style-position: inside;
					margin-left: 2em;
					font-size: 12px;	
				}
				
				/* SUPPORTED PAGE */
				div.supported_page {					
				}
				div.supported_left {
					float: left;
					width: 560px;
					padding-right: 30px;
					border-right: 1px solid #96B2BD;
				}
					div.supported_left a:link, div.supported_left a:visited {
						background: url('images/external_link.gif') right center no-repeat;
						padding-right: 20px;
						font-size: 12px;
					}
				div.supported_right {
					float: right; 
					padding-left: 30px;
					width: 210px;
					font-size: 12px;
				}
					
				
				
	/* FOOTER */
	div.footer {
		height: 32px;
		background: url('images/bg.jpg') 0 -100px repeat-x;
		line-height: 32px;
		text-transform: uppercase;
		font-size: 11px;
	}
	div.footer div {
		padding: 0 12px;
	}
	div.footer .right {
		color: #78a5b7;
	}
	div.footer a:link, div.footer a:visited {
		text-decoration: none;
		margin: 0 5px;
	}
	div.footer a:hover {
		border-bottom: 1px dotted #613d27;
	}
	a.stache {
		font-weight: bold;
		color: #543e31;
	}