/*
Author - Calum Ryan
Year - 2010
Site - Zizz Fusion Portfolio
*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, textarea, input, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
}
body {
	color:#FFF;
	font-family:Arial, Helvetica, sans-serif;
	font-weight: normal;
	position:relative;
}
/*Shared Styling*/
a {
	overflow:hidden;
}
a, a:visited, a:active {
	color:#09F;
}
a:active {
	outline:#CCC 1px dotted;
}
a:hover {
	text-decoration:none;
}
p {
	padding:0;
	margin:0;
}
img {
	border: 0;
	margin: 0;
}
.indent {
	text-indent:-10000px;
}
.clear {
	clear:both;
}
.right {
	float:right;
}
.center {
	margin:0 auto;
	text-align:center;
}
/*Wrappers & Containers*/
#home {
	background:url(../images/background.jpg) top center repeat-x;
	width:100%;
}
#projects {
	background:url(../images/background_2.jpg) top center repeat-x;
	width:100%;
}
#wrapper, #projects, #projects_wrapper, #projects_navigation {
	margin:0 auto;
}
#projects_navigation ul {
	height:74px;
	margin-top:2px;
	background:#3e3e3e;
}
/*Sprite Image Declarations*/
#primary, .nav_web, .nav_visual, .nav_technology, .proj_home, .proj_web, .proj_visual, .proj_technology, .experience_chart table, .int_world div, .f_about, .f_copyright, .f_zf, a.link_twitter, a.link_skype, a.link_linkedin, a.link_cv, .f_name, .f_subject, .f_email, .f_message, #ajax-contact-form input#contactform_send, .h_web, .h_visual, .h_technology {
	background:url(../images/elements.jpg) top center no-repeat;
	display:block;
}
.envelope, .top_link, .back_link, .h_introduction_to_calum, .h_what_i_do, .h_international, .h_experience_chart, .do_circle div, .envelope_single, .proj_envelope, .p_more {
	background:url(../images/transparent.png) top center no-repeat;
	display:block;
}
/*End Sprite Image Declarations*/
div#primary, div#secondary, #introduction_to_calum, #what_i_do, #international, #experience_chart, .lower_margin, #footer_container, #wrapper, #projects_wrapper, #projects_navigation {
	width:997px;
}
div#primary {
	width:997px;
	height:132px;
	clear:both;
}
div#secondary {
	height:324px;
	margin:0 auto;
	font-family: 'Droid Sans', sans-serif;
}
div#projects_navigation li {
	list-style:none;
	float:left;
}
.project_thumb {
	float:left;
	width:319px;
	height:265px;
	display:block;
	margin:0 6px;
}
.project_thumb img, .project_thumb object {
	border:1px solid #737373;
}
.project_thumb img:hover, .project_thumb object:hover {
	border:1px solid #0CF;
}
.project_thumb div {
	font-size:0.7em;
	font-weight:bold;
}
.nav_web, .nav_visual, .nav_technology {
	height:56px;
}
.nav_web {
	background-position:0 -132px;
	width:330px;
	margin-left:5px;
}
.nav_web:hover {
	background-position:0 -188px;
}
.nav_visual {
	background-position:-315px -132px;
	width:340px;
}
.nav_visual:hover {
	background-position:-315px -188px;
}
.nav_technology {
	background-position:-660px -132px;
	width:320px;
}
.nav_technology:hover {
	background-position:-660px -188px;
}
.proj_home, .proj_web, .proj_visual, .proj_technology {
	height:72px;
}
.proj_web, .proj_visual, .proj_technology {
	margin-left:20px;
}
.proj_home {
	background-position:0 -378px;
	width:88px;
}
.proj_home:hover {
	background-position:0 -450px;
}
.proj_web {
	background-position:-147px -378px;
	width:146px;
}
.proj_web:hover {
	background-position:-147px -450px;
}
.proj_visual {
	background-position:-387px -378px;
	width:192px;
}
.proj_visual:hover {
	background-position:-387px -450px;
}
.proj_technology {
	background-position:-625px -378px;
	width:204px;
}
.proj_technology:hover {
	background-position:-625px -450px;
}
#introduction_to_calum, #what_i_do, #experience_chart, #international {
	font-size:0.7em;
	clear:both;
}
#what_i_do {
	height:235px;
}
#introduction_to_calum {
	height:235px;
	color:#333;
}
.lower_margin {
	height:61px;
	width:997px;
	clear:both;
	margin-top:10px;
}
#footer {
	background:#3e3e3e;
	width:100%;
	height:600px;
	margin:0 auto;
}
#footer_container {
	margin:0 auto;
}
/*Headings and Buttons*/
.h_introduction_to_calum {
	background-position:-154px -136px;
	width:85px;
	height:34px;
}
.h_what_i_do {
	background-position:-154px -102px;
	width:132px;
	height:34px;
}
.h_international {
	background-position:-154px -62px;
	width:267px;
	height:40px;
}
.h_experience_chart {
	background-position:-422px -62px;
	width:228px;
	height:40px;
}
.h_web, .h_visual, .h_technology {
	height:100px;
}
.h_web {
	background-position:0 -785px;
	margin-left:60px;
	width:133px;
}
.h_visual {
	background-position:-139px -785px;
	margin-left:60px;
	width:190px;
}
.h_technology {
	background-position:-340px -785px;
	width:364px;
}
.envelope {
	background-position:-391px 0;
	width:45px;
	height:55px;
	float:right;
	margin-top:15px;
}
.envelope:hover, .proj_envelope:hover {
	background-position:-437px 0;
}
.envelope_single {
	background-position:-392px 0;
	width:45px;
	height:26px;
	margin-top:10px;
}
.proj_envelope {
	background-position:-391px 0;
	width:45px;
	height:55px;
	margin:15px 0 0 60px;
}
.top_link, .back_link {
	width:190px;
	height:59px;
	float:right;
}
.top_link {
	background-position:0 0;
}
.top_link:hover {
	background-position:-194px 0;
}
.back_link {
	background-position:-295px -105px;
}
.back_link:hover {
	background-position:-487px -105px;
}
.padding01 {
	width:132px;
	padding:80px 30px;
	float:left;
}
.padding02 {
	width:785px;
	padding:48px 10px;
	float:left;
}
.padding03 {
	width:230px;
	padding:94px 30px;
	float:left;
	color:#737373;
}
.padding04 {
	width:265px;
	padding:66px 30px;
	float:left;
	color:#737373;
}
.padding05 {
	width:650px;
	padding:23px 10px;
	float:left;
	color:#737373;
}
#projects_heading {
	width:370px;
	padding:20px;
	float:left;
	color:#333;
}
.padding06 {
	width:132px;
	padding:102px 30px;
	float:left;
}
.padding07 {
	width:500px;
	padding:30px;
	float:left;
}
.padding07 p {
	line-height:1.2em;
	padding:4px;
	margin:4px;
}
.padding08 {
	width:150px;
	padding:10px 45px;
	float:left;
	color:#737373;
}
#projects_description {
	width:500px;
	padding:35px 40px;
	float:left;
	font-size:0.8em;
	font-weight:bold;
	color:#333;
}
.item_wrapper {
	color:#333;
	padding:10px 10px;
	width:860px;
}
.item_wrapper.dark {
	color:#FFF;
	padding:10px 10px;
	background:#333;
	width:997px
}
.item_wrapper h2 {
	font-size:2.05em;
	margin:15px 0;
}
.item_wrapper p {
	font-size:0.8em;
}
.item_wrapper ul {
	font-size:0.8em;
	padding:10px 40px;
}
div.shots, div.postcards {
	padding:10px;
	border-bottom:3px solid #333;
	border-top:3px solid #333;
	margin-top:15px;
	overflow:hidden;
}
div.shots {
	border-bottom:3px solid #333;
	border-top:3px solid #333;
}
div.postcards {
	border-bottom:3px solid #FFF;
	border-top:3px solid #FFF;
}
div.shots img {
	display:block;
	border:#333 1px solid;
	float:left;
	margin:4px;
}
div.shots img:hover {
	border:#09C 1px solid;
}
div.postcards img {
	display:block;
	border:#CC99FF 1px solid;
	float:left;
	margin:4px;
	width:auto;
	height:100px;
}
div.postcards img:hover {
	border:#CCCCCC 1px solid;
}
/*What I Do Padding & Graphics*/
.do_circle, .do_play, .do_study, .int_places {
	margin:0 auto;
	float:left;
	color:#737373;
}
.do_play h3, .do_study h3, .int_places h3 {
	margin-top:5px;
	color:737373;
	font:Arial Black;
}
.do_circle {
	width:245px;
}
.do_play {
	width:254px;
	margin-left:10px;
}
.do_study {
	width:254px;
	text-align:right;
	margin-right:10px;
}
.do_circle div {
	background-position:-676px 0;
	width:245px;
	height:146px;
}
/*Experience Chart Padding & Graphics*/
.experience_chart {
	padding:0 15px;
	float:left;
}
.experience_chart table {
	width:676px;
	height:248px;
	background-position:0 -528px;
	text-indent:-10000px;
	float:left;
	border:0;
}
/*International travel Padding & Graphics*/
.int_world {
	width:260px;
	margin-top:15px;
	float:left;
}
.int_world div {
	background-position:-678px -527px;
	width:165px;
	height:165px;
	margin:0 auto;
}
.int_places {
	width:370px;
	margin-left:10px;
	float:left;
}
/*Footer General Declarations*/
#col_about, #col_links, #col_email {
	float:left;
	height:600px;
}
#col_about, #col_links {
	background:url(../images/background_footer.jpg) right top repeat-y;
}
#col_about {
	width:371px;
}
#col_about p {
	width:340px;
	font-size:0.8em;
	margin-bottom:1.2em;
	line-height:1.5em;
}
#col_links {
	width:290px;
}
#col_email {
	width:310px;
	padding:0 10px;
}
#col_links ul {
	width:230px;
	margin:10px 15px;
}
#col_links li, #col_links li a {
	list-style:none;
	height:64px;
	margin-bottom:30px;
	display:block;
}
/*Footer Headings*/
.f_about {
	background-position:-816px -349px;
	width:86px;
	height:27px;
	margin-top:10px;
}
.f_copyright {
	background-position:-816px -315px;
	width:150px;
	height:27px;
	margin-top:10px;
}
.f_zf {
	background-position:-816px -247px;
	width:138px;
	height:59px;
	margin-top:10px;
}
/*Footer Contact Links*/
a.link_twitter {
	background-position:0 -244px;
	width:230px;
}
a.link_twitter:hover {
	background-position:0 -312px;
}
a.link_skype {
	background-position:-240px -244px;
	width:199px;
}
a.link_skype:hover {
	background-position:-240px -312px;
}
a.link_linkedin {
	background-position:-448px -244px;
	width:181px;
}
a.link_linkedin:hover {
	background-position:-448px -312px;
}
a.link_cv {
	background-position:-635px -244px;
	width:173px;
}
a.link_cv:hover {
	background-position:-635px -312px;
}
/*Footer Contact form headings*/
.f_name, .f_message, .f_email, f_subject {
	height:18px;
	margin:15px 0 1px 0;
}
.f_name {
	background-position:-883px -417px;
	width:65px;
}
.f_email {
	background-position:-883px -460px;
	width:77px;
}
.f_subject {
	background-position:-883px -393px;
	width:55px;
}
.f_message {
	background-position:-883px -440px;
	width:52px;
}
/*Contact Form*/
#ajax-contact-form {
	width:280px;
}
#ajax-contact-form input, #ajax-contact-form textarea {
	width:270px;
	padding:5px;
	margin-top:5px;
	margin-bottom:10px;
	font:140% normal Arial, Helvetica, sans-serif;
	border:#999 2px solid;
}
#ajax-contact-form input:hover, #ajax-contact-form textarea:hover {
	border:#09C 2px solid;
}
#ajax-contact-form input#contactform_send {
	width:51px;
	margin:0;
}
#ajax-contact-form input#contactform_send {
	border:0;
	background-position:-883px -484px;
	width:50px;
	height:30px;
	text-indent:-10000px;
	display:block;
	cursor:pointer;
	float:right;
}
#ajax-contact-form input#contactform_send:hover {
	background-position:-939px -484px;
}
.notification_error {
	background:#993333;
	width:280px;
	font-size:0.8em;
	font-weight:bold;
	padding:5px;
	margin-bottom:5px;
}
.notification_ok {
	font-weight:bold;
	font-size: 0.8em;
}
/*Projects Containers & Content*/
.projects_holder {
	background:#555555;
	width:982px;
	height:140px;
	margin-top:20px;
	clear:both;
}
.p_image {
	width:400px;
	height:120px;
	padding:10px;
	float:left;
}
.p_image img {
	border:1px solid #CCC;
}
.p_image img:hover {
	border:1px solid #09F;
}
.p_text {
	width:530px;
	height:120px;
	float:left;
	padding:10px;
	margin-left:5px;
}
.p_text h3 {
	font-size:1.2em;
	font-weight:bold;
	padding-bottom:3px;
}
.p_text h3 a, .p_text li a {
	color:#CCC;
	text-decoration:none;
}
.p_text h3 a:hover, .p_text li a:hover {
	text-decoration:underline;
}
.p_text p {
	font-size:0.8em;
}
.p_text li {
	font-size:0.8em;
	padding:0;
	margin:5px 0 2px 30px;
}
.p_more {
	background-position:0 -63px;
	width:153px;
	height:38px;
	margin:-20px 0 10px 0;
	float:right;
}
.p_more:hover {
	background-position:0 -101px;
}
iframe {
	width:400px;
	height:400px;
	border:3px solid #333;
}
.cr-uk {
	background:url(../images/project_thumbs/bfae2.jpg) bottom left no-repeat;
	padding-bottom:350px;
}
/*-------------------------
----2011 Interim Add-on--*/

/* Make HTML 5 elements display block-level for consistent styling */
header, nav, article, footer, address {
	display: block;
}
nav {
	width:44%;
	overflow:hidden;
	padding:10px;
	margin:10px;
	float:left;
	font-weight:bold;
	line-height: 1.4em;
}
nav.primary-navigation ul {
	margin:20px;
}
nav.primary-navigation li {
	list-style:none;
	margin:15px 0;
}
nav.primary-navigation li a {
	padding:4px;
	background:#333;
	-webkit-box-shadow:0 2px 3px 0 #333;
	-moz-box-shadow:0 2px 3px 0 #333;
	box-shadow:0 2px 3px 0 #333;
	text-decoration:none;
}
nav.primary-navigation li a:hover {
	-webkit-box-shadow:0 2px 3px 0 #000;
	-moz-box-shadow:0 2px 3px 0 #000;
	box-shadow:0 2px 3px 0 #000;
}
nav h2 {
	color:#CCC;
}
nav.secondary-navigation ul {
	margin:10px 0;
}
nav.secondary-navigation li {
	list-style:none;
	float:left;
	margin-right:4px;
}
nav.secondary-navigation img {
	border:1px solid #737373;
	-webkit-box-shadow:0 2px 3px 0 #333;
	-moz-box-shadow:0 2px 3px 0 #333;
	box-shadow:0 2px 3px 0 #333;
}
nav.secondary-navigation img:hover {
	border:1px solid #0CF;
	-webkit-box-shadow:0 2px 3px 0 #000;
	-moz-box-shadow:0 2px 3px 0 #000;
	box-shadow:0 2px 3px 0 #000;
}