* { margin: 0; padding: 0; outline: 0; }

/* HTML5 tags */
header, section, footer,
aside, nav, article, figure {
	display: block;
}
@font-face { font-family: "FontinSans-Regular"; src: local("Fontin Sans"), url(Fontin_Sans_R_45b.otf); format:("opentype") }
@font-face { font-family: "FontinSans-Bold"; src: local("Fontin Sans"), url(Fontin_Sans_B_45b.otf); format:("opentype") }


body { font-family: Verdana; font-size: 14px; color: #333; background: url(images/pattern.gif); text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2); }

::selection { background-color: rgba(128, 0, 128, 0.2); }
::-moz-selection { background-color: rgba(128, 0, 128, 0.2);  border: 10px solid red; }

h1 { color: #333; font-size: 40px; position: relative; top: 15px; }
h1 a { color: #333; font-size: 40px; background-color: #ff5400; padding: 5px 25px 10px 25px; width: 300px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.4); -moz-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.6); border-bottom: 1px solid rgba(0, 0, 0, 0.4); border-top: 1px solid rgba(255, 255, 255, 0.6);
	background: -webkit-gradient(
	    linear,
	    left bottom,
	    left top,
	    color-stop(0.23, #c34000),
	    color-stop(0.62, #ff5400)
	);
	background: -moz-linear-gradient(
	    center bottom,
	    #c34000 23%,
	    #ff5400 62%
	);
}

h1 a:hover { color: #fff; border-bottom: 1px solid rgba(0, 0, 0, 0.4); padding-bottom: 10px; background-color: #7ac000;
	background: -webkit-gradient(
	    linear,
	    left bottom,
	    left top,
	    color-stop(0.23, #619702),
	    color-stop(0.62, #7ac000)
	);
	background: -moz-linear-gradient(
	    center bottom,
	    #619702 23%,
	    #7ac000 62%
	);
}

h2 { font-size: 66px; color: #333; height: 105px; font-family: FontinSans-Regular, Verdana;  }
h2 strong { font-family: FontinSans-Bold, Verdana;}
h2 span.sub { margin-top:50px; font-size: 33px; float: left; color: #666; }
h2 span.sub2 { font-size: 22px; float: left; color: #666;padding-left:30px; margin-top:30px; }
h2 span.sub2 a {color: #666; text-decoration: none;}
h2 span.sub3 { font-size: 14px;color: #999; padding-left:20px;}

h3 {font-family: FontinSans-Regular, Verdana; font-size: 33px; color: #666; padding-bottom: 20px;}

/* h2.intro { background: url(images/intro.png) no-repeat -10px -10px; }
h2.work { background: url(images/portfolio.png) no-repeat -10px -10px; }
h2.about { background: url(images/about.png) no-repeat -10px -10px; }
h2.contact { background: url(images/contact.png) no-repeat -10px -10px; } */

a { color: #800080; text-decoration: underline;  padding-bottom: 2px; }
a:hover { color: #666; text-decoration: none;  padding-bottom: 2px; }
a:active { color: #666; text-decoration: none;  padding-bottom: 2px; position: relative; top: 1px; }

p {   font-family: Verdana;    margin-bottom:15px;}

header { padding: 5px 0; width: 480px; background-color: rgba(60, 1, 60, 0.2); top:5px; right:5px; margin-bottom: 25px; position: fixed; z-index: 10; float: left; -webkit-border-radius: 20px; -moz-border-radius: 20px; }
#headercontainer { width: 100%; margin: 0 auto; position: relative; }
#contentcontainer { width: 960px; margin: 0 auto; position: relative; float: none; padding-top: 0px;}

nav { width: auto; height:20px; float: left; font-family: FontinSans-Regular, Verdana; font-size: 14px;   }
nav ul { position: absolute; left: 42px; top:2px;  display: block;  }
nav ul li { display: inline; margin-right: 40px;  }
nav ul li a {  border-bottom: none; color:#333; text-decoration: none; }
nav ul li a:hover {  border-bottom: none; color:#800080; }
nav ul li a:active {  border-bottom: none; color:#333; }

section { margin-bottom: 500px; padding-top: 150px; float: left; }

#web, #photo { margin-bottom: 100px; padding-top: 0px; float: left;}

#intro h2 a { padding-bottom: 0px; }
#intro a.featured { padding-bottom: 0px; border-bottom: none; }
#intro a img { border: 0px;}
#intro p  { margin-top:200px;}

#portfolio .work a img:hover, input:hover, textarea:hover { border: 5px solid rgba(128, 0, 128, 1);-webkit-border-radius: 5px; -moz-border-radius: 5px;  -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.4); }
#portfolio .work a img:active { -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); }
#portfolio ul.work a { border-bottom: none; }
#portfolio ul.work a img { border: 5px solid rgba(128, 0, 128, .2); -webkit-border-radius: 5px; -moz-border-radius: 5px; }
#portfolio ul.work { float: left; margin-left: -15px; width: 975px;  }
#portfolio ul.work li { list-style: none; float: left; margin-left: 15px; margin-bottom: 15px; }

#about ul {margin-left:30px; margin-bottom:15px; }


.galleria{list-style:none;width:200px}
.galleria li{display:block;width:80px;height:80px;overflow:hidden;float:left;margin:0 10px 10px 0}
.galleria li a{display:none}
.galleria li div{position:absolute;display:none;top:0;left:180px}
.galleria li div img{cursor:pointer}
.galleria li.active div img,.galleria li.active div{display:block}
.galleria li img.thumb{cursor:pointer;top:auto;left:auto;display:block;width:auto;height:auto}
.galleria li .caption{display:block;padding-top:.5em}
* html .galleria li div span{width:400px} /* MSIE bug */


#contact { margin-bottom: 0px; }
#contactform { float:left; }

input[type="text"] { width: 400px; }
textarea { width: 960px; height: 200px; }
label { color: #800080; font-size:14px; }
input, textarea { background-color: rgba(255, 255, 255, 0.4); border: 5px solid rgba(128, 0, 128, .2); padding: 10px; font-family: Verdana; color: #4b4b4b; font-size: 14px; -webkit-border-radius: 5px; margin-bottom: 15px; margin-top: -10px; }
input:focus, textarea:focus { border: 5px solid #800080; background-color: rgba(255, 255, 255, 1); }

input[type="submit"] { float:left; border: none; cursor: pointer; color: #fff; font-size: 14px; background-color: #800080; padding: 5px 10px 5px 10px; margin-top:10px; -webkit-border-radius: 10px; -moz-border-radius: 10px;  border-bottom: 1px solid rgba(0, 0, 0, 0.4); border-top: 1px solid rgba(255, 255, 255, 0.6);}

input[type="submit"]:hover { color: #fff; border-bottom: 1px solid rgba(0, 0, 0, 0.4); background-color: #AF00AF;}

input[type="submit"]:active { position: relative; top: 1px; }

#footer { width:960px; margin: 20px auto; position: relative; float: none; }
footer { float: left; margin-top: 50px; background:#2F1D2F; width:100%; }
footer h3 {float: none;}
footer ul { margin-bottom: 50px; margin-left:15px; }
footer ul li {display:inline; margin-left:40px;}
footer ul li a { font-size: 12px; color:#FFF; text-decoration: none;  padding-bottom: 2px; }
footer ul li a:hover { color: #999; text-decoration: none;  padding-bottom: 2px; }
footer ul li a:active { color: #999; text-decoration: none;  padding-bottom: 2px; position: relative; top: 1px; }