/*reset*/
body{padding:0;margin:0;font:13px Arial,Helvetica,Garuda,sans-serif;*font-size:small;*font:x-small;} h1,h2,h3,h4,h5,h6,ul,li,em,strong,pre,code{padding:0;margin:0;line-height:1em;font-size:100%;font-weight:normal;font-style: normal;} table{font-size:inherit;font:100%;} ul{list-style:none;} img{border:0;} p{margin:1em 0;}
html {height:100%; margin-bottom: 1px;}

/*general styles */
@font-face {font-family: Chunk; src: local("Chunk"), local("Chunkfive"), url(/Chunkfive.otf), url(/Chunkfive.ttf);}
@font-face {font-family: Graublau; src: local("Graublau"), local("GraublauWeb"), url(/GraublauWeb.otf), url(/GraublauWeb.ttf);}
body {font-family:Graublau, Helvetica, Arial, sans-serif; color:#555;line-height:28px; font-size:18px; font-weight:lighter;background:#66cccc;overflow-x:hidden;}
@-moz-document url-prefix() {body {overflow-y:scroll;}} 
a {color:#cc3300; text-decoration:none;}
a:hover {text-decoration:underline;}
h1, h2, h3, h4, h5, h6 {color:#fff; font-family:chunk;}
h1 {font-size: 80px;}
h2 {font-size: 36px;}
h3 {font-size: 28px;}
h4 {font-size: 22px;}
.red {color:#cc3300;}
.bold {font-weight:bold;}
.biggest {font-size:143px; font-family:chunk; letter-spacing:-.04em;color:#555;}

/*layout */
#container {width:1000px; margin:50px auto; text-align:center;}
#content {width:100%;}
.headline {letter-spacing:-.04em; color:#cc3300;margin-top:620px; text-align:right;margin-right:78px;}
@media screen and (-webkit-min-device-pixel-ratio:0) { .headline { margin-top:680px; } } 
.subhead {color:#555555;font-size:115px;letter-spacing:-0.03em;margin-left:-260px;margin-top:130px;position:relative !important;top:10px;}
@media screen and (-webkit-min-device-pixel-ratio:0) { .subhead { margin-bottom: -40px; margin-left:-25px; margin-top:110px; } } 

/*nav */
.mainLinks {font-size:30px;height:48px;margin-top:48px;overflow:hidden;position:relative;float:right;margin-right:73px;}
@media screen and (-webkit-min-device-pixel-ratio:0) { .mainLinks { margin-top:18px; } } 
#mainCopyLink, #mainDevLink, #mainDesignLink, #mainContactLink {color:#cc3300;}
#mainCopyLink:hover, #mainDevLink:hover, #mainDesignLink:hover, #mainBioLink:hover, #mainContactLink:hover {text-decoration:underline;cursor:pointer;cursor:hand;}
#mainDesignLink, #mainDevLink, #mainCopyLink {margin-right:15px;}
#mainDevLink, #mainCopyLink, #mainContactLink {margin-left:15px;}
.arrows {color:#FFFFFF;float:left;height:12px;position:relative;width:12px;background:#fff;border:.1em solid #555;margin-top:5px;margin-right:3px;-moz-border-radius:50px;-webkit-border-radius:50px;}
.linkItem {float:left;text-align:left;}
.linkItem a {color:inherit;}
.hideBody {margin-left:-9999px;}
.mainBody {margin-top:300px; text-align:left; width:940px; margin-left:67px;min-height:1000px;}
@media screen and (-webkit-min-device-pixel-ratio:0) { .mainBody { margin-top:260px; } } 
#mainDesign, #mainDev, #mainCopy, #mainProj, #mainBio, #mainContact {width:900px; background:#fff; padding:30px; -moz-border-radius: 40px; border:.1em solid #555; -moz-box-shadow:4px 4px 4px #555555; -webkit-border-radius: 40px; -webkit-box-shadow:4px 4px 4px #555555; height:0px; margin-left:-9999px; position:relative;z-index:10;}
#mainBio img {float:right; margin-left: 20px; -webkit-box-shadow:5px 5px 5px #bbb; -moz-box-shadow:5px 5px 5px #bbb; border:.1em solid #555;}
.quickContainer {float:left;}
#quickLinks {background:#999999 none repeat scroll 0 0;border-bottom:1px solid #555555;color:#666;font-size:14px;height:28px;margin-left:-2005px;margin-top:380px;padding-top:3px;position:absolute;width:5000px; }
@media screen and (-webkit-min-device-pixel-ratio:0) { #quickLinks { margin-top:380px; } } 
#quickLinks a {color:#fff;}
#quickLinks .title {color:#ddd;}
.subNav {font-size:22px;width:900px; background:#aaa; color:#fff; padding:30px 30px 100px 30px; -moz-border-radius: 40px; -webkit-border-radius: 40px; -webkit-box-shadow:4px 4px 4px #555555; height:0; -moz-box-shadow:4px 4px 4px #555555; height:0px;display:none; position:relative; margin-left:-9999px; opacity:.8; }
.subNav a:hover {cursor:pointer;color:#555;z-index:999;position:relative;text-decoration:underline;}
.mainLinkBg {background:transparent url(http://jonathonmorgan.net/images/whitebanner3.png) no-repeat scroll 0 0;height:380px;margin-left:-100px;margin-top:-155px;position:absolute;width:1340px;z-index:-1;}
@media screen and (-webkit-min-device-pixel-ratio:0) { .mainLinkBg { margin-top: -195px; } } 
.bar {float:left;margin-top:-25px;font-size:20px;}
#scrollTo {position:relative;top:60px;}
@media screen and (-webkit-min-device-pixel-ratio:0) { #scrollTo { position:absolute;top:522px; } }
.qtip {margin-top:260px;position:relative;z-index:9999;}
.toTop {background-color: #cc3300;background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #ff6666),color-stop(1, #cc3300)); -moz-border-radius:50px; padding:10px;-webkit-border-radius:50px;width:100px;height:30px;color:#fff;clear:both;text-align:center;-webkit-box-shadow:3px 3px 3px #bbb; -moz-box-shadow:3px 3px 3px #bbb;}
.toTop a {color:#fff;}
.toTop a:hover {text-decoration:none;}
.toTop:hover {background-color:#555;background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #cc3300),color-stop(1, #ff6666));cursor:pointer;cursor:hand;} 

/*background animation */
.cloudHolder {position:relative; margin-top:-210px; top:400px; margin-left:500px; z-index:-1;height:0px;}
.cloudHolder img {width:226px; height:150px;}
.cloudHolder2 {position:relative; margin-top:-210px; top:550px; margin-left:800px; z-index:-1;}
.cloudHolder3 {position:relative; margin-top:-210px; top:250px; margin-left:1300px; z-index:-2;} 
.cloudHolder4 {position:relative; margin-top:-210px; top:540px; margin-left:50px; z-index:-3;} 
.cloudHolder4 img {width:126px; height:150px;} 
.cloudHolder5 {position:relative; margin-top:-210px; top:670px; margin-left:1500px; z-index:-4;height:0px;}
.cloudHolder5 img {width:256px; height:150px;}
.cloudHolder6 {position:relative; margin-top:-210px; top:720px; margin-left:900px; z-index:-5;height:0px;}
.cloudHolder6 img {width:206px; height:100px;}
.birdright {background:transparent url(http://jonathonmorgan.net/images/birdright1.png) no-repeat scroll 0 0;height:200px;position:absolute;width:180px;z-index:-2;margin-left:910px;margin-top:440px;}
@media screen and (-webkit-min-device-pixel-ratio:0) { .birdright { margin-top: 462px; } } 
.birdright2 {background:transparent url(http://jonathonmorgan.net/images/birdright2.png) no-repeat scroll 0 0;height:200px;margin-left:910px;margin-top:457px;opacity:0;position:absolute;width:180px;z-index:-2;}
@media screen and (-webkit-min-device-pixel-ratio:0) { .birdright2 { margin-top: 479px; } } 

/*slider */
.contentslider {position:relative;display:block;width:900px;height:400px;margin:0 auto;overflow:hidden;}
.cs_wrapper {position:relative;display:block;width:100%;height:100%;margin:0;padding:0;overflow:hidden;}
.cs_slider {position:absolute;width:10000px;height:100%;margin:0;padding:0;}
.cs_article {float:left;position:relative;top:0;left:0;display:block;width:900px;height:400px;margin:0 auto;padding:0;}
.cs_article h2 {display:block;width:26%;margin:10px 26px 5px 67%;text-align:left;position:relative;z-index:999;}
.cs_article img {position:absolute;top:-10px;left:-5px;border:0;-ms-interpolation-mode:bicubic;}
.cs_article p {display:block;width:26%;margin:0 26px 5px 67%;padding:0;border:0;position:relative;z-index:999;}
.cs_article .readmore {display:block;width:26%;margin:0 26px 0 67%;text-align:right;}
.cs_leftBtn, .cs_rightBtn {position:absolute;top:0;height:400px;padding:10px 0;z-index:10000;}
.cs_leftBtn {left:0;outline:0;}
.cs_rightBtn {right:0;outline:0;}
.cs_leftBtn img, .cs_rightBtn img {border:0;position:relative;top:200px;margin:0;}
.contentslider {padding:10px; /* This acts as a border for the content slider */}
.cs_wrapper, .cs_article {background:#FFF; /* Background color for the entries */}
.cs_leftBtn, .cs_rightBtn {width:30px; /* Should be as wide as the button graphic being used */}
.cs_article h2 {font-size:22px;line-height:1.125em;color: #555;}
.cs_article h2 a {}
.cs_article p {font-size:85%;line-height:1.5em;color:#777;}
.cs_article .readmore {font-size:80%;}

/*form */
input {color:#555555;font-size:18px;padding:5px;margin-bottom:25px;border:.1em solid #bbb;}
input.button {background-color:#66cccc;background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #99ffff),color-stop(1, #66cccc));-moz-border-radius:50px; padding:10px;-webkit-border-radius:50px;color:#fff;clear:both;display:block;border:0px none;-webkit-box-shadow:3px 3px 3px #bbb; -moz-box-shadow:3px 3px 3px #bbb;}
input.button:hover {background-color:#555;background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #66cccc),color-stop(1, #99ffff));cursor:pointer;cursor:hand;}
input.focus {border:.1em solid #000;}
input.error {background:#cc3300;opacity:.6;}
textarea {color:#555555;font-size:18px;padding:5px;margin-bottom:25px;border:.1em solid #bbb;font-family:Graublau;}
textarea.focus {border:.1em solid #000;}
label.inlined + textarea.input-text {background-color:transparent;font-size:18px;margin-top:-31px;position:relative;width:50%;height:250px;z-index:2;float:left;clear:both;}
label.inlined + input.input-text {background-color:transparent;font-size:18px;margin-top:-31px;position:relative;width:50%;z-index:2;float:left;clear:both;}
label {clear:both;}
label.inlined {color:#999999;font-size:20px;position:relative;z-index:1;float:left;margin-left:10px;}
label.focus {color:#ddd;}
label.has-text {color:#fff;}
.formError {float:right;margin-right:130px;margin-top:-28px;color:#cc3300;}
#formBroke {background:#CC3300 none repeat scroll 0 0;color:#FFFFFF;padding:5px;display:none;}