/*Reset*/
html, body, div, h1, h2, h3, h4, h5, h6, img, p, ul, ol, li, a, fieldset, form, input, textarea, label {margin: 0; padding: 0; border: 0; outline: 0; font-weight: normal; font-style: inherit; font-size: 100%; font-family: inherit; color: inherit; vertical-align: baseline; line-height: 0; }

/*Containers*/
body {padding-bottom: 15px; color: #aaa; background-color: #222; font-family: Helvetica, Arial, sans-serif; font-size: 12px; }
div.wrap {width: 1185px; margin: 15px auto; }
div.one {width: 285px; margin-left: 15px; }
div.one:first-child {margin-left: 0; }
div.half {width: 135px; margin-left: 15px; }
div.three {width: 885px; margin-left: 15px; }

/*General*/
h1 {width: 210px; height: 36px; background-image: url(../img/interface/h1_gioledda.png); }
h1 a {width: 100%; height: 100%; }
h3 {line-height: 130%; color: #fff; font-weight: bold; }
p {line-height: 140%; margin-bottom: 15px; }
ul {margin-bottom: 15px; }
li {line-height: 140%; list-style-type: none; font-style: italic; }
a {text-decoration: none; font-weight: bold; 
-webkit-transition:color 0.15s ease-in;  
-moz-transition:color 0.15s ease-in;  
-o-transition:color 0.15s ease-in;  
transition:color 0.15s ease-in; }
div.half a {line-height: 140%; color: #aaa; }
a:hover, div.half a:hover {color: #fff; }
a.icon {width: 15px; height: 15px; margin-right: 15px; }
a.icon img {width: 15px; height: 15px; opacity: 0.5; filter: alpha(opacity=50);
-webkit-transition:opacity 0.15s ease-in;  
-moz-transition:opacity 0.15s ease-in;  
-o-transition:opacity 0.15s ease-in;  
transition:opacity 0.15s ease-in; }
a.icon img:hover {opacity: 1; filter: alpha(opacity=100); }
.first {margin-left: 0 !important;  }

/*Thumbs*/
a.thumb {width: 285px; height: 285px; margin: 0 0 15px 15px; display: none; }
a.thumb img {width: 285px; height: 285px;  
-webkit-transition:opacity 0.15s ease-in;  
-moz-transition:opacity 0.15s ease-in;  
-o-transition:opacity 0.15s ease-in;  
transition:opacity 0.15s ease-in; }
a.thumb img:hover {opacity: 0; filter: alpha(opacity=0); }
a#svs {background-image: url(../img/thumb/svs2.jpg); }
a#grim_reminder {background-image: url(../img/thumb/grim_reminder2.jpg); }
a#southside_insurance {background-image: url(../img/thumb/southside_insurance2.jpg); }
a#calgary_couture {background-image: url(../img/thumb/calgary_couture2.jpg); }
a#kingpin_social {background-image: url(../img/thumb/kingpin_social2.jpg); }
a#lael_osness {background-image: url(../img/thumb/lael_osness2.jpg); }
a#sait_polytechnic {background-image: url(../img/thumb/sait_polytechnic2.jpg); }
a#cfdh {background-image: url(../img/thumb/cfdh2.jpg); }
a#chris_amott {background-image: url(../img/thumb/chris_amott2.jpg); }
a#trauma_resilience {background-image: url(../img/thumb/trauma_resilience2.jpg); }
a#study_abroad {background-image: url(../img/thumb/study_abroad2.jpg); }
a#nebucadnezzer {background-image: url(../img/thumb/nebucadnezzer2.jpg); }
a#personal_artwork {background-image: url(../img/thumb/personal_artwork2.jpg); }
a#elbow_park {background-image: url(../img/thumb/elbow_park2.jpg); }
a#jesse_laura {background-image: url(../img/thumb/jesse_laura2.jpg); }
a#octillian {background-image: url(../img/thumb/octillian2.jpg); }

/*H2*/
h2 {width: 285px; height: 18px; margin-bottom: 11px; padding-top: 15px; border-top: 2px solid #fff; background-repeat: no-repeat; background-position: bottom; }
h2#about {background-image: url(../img/interface/h2_about.png); }
h2#services {background-image: url(../img/interface/h2_services.png); }
h2#contact {background-image: url(../img/interface/h2_contact.png); }
h2#svs {background-image: url(../img/interface/h2_svs.png); }
h2#grim_reminder {background-image: url(../img/interface/h2_grim_reminder.png); }
h2#southside_insurance {background-image: url(../img/interface/h2_southside_insurance.png); }
h2#calgary_couture {background-image: url(../img/interface/h2_calgary_couture.png); }
h2#kingpin_social {background-image: url(../img/interface/h2_kingpin_social.png); }
h2#lael_osness {background-image: url(../img/interface/h2_lael_osness.png); }
h2#sait_polytechnic {background-image: url(../img/interface/h2_sait_polytechnic.png); }
h2#cfdh {background-image: url(../img/interface/h2_cfdh.png); }
h2#chris_amott {background-image: url(../img/interface/h2_chris_amott.png); }
h2#trauma_resilience {background-image: url(../img/interface/h2_trauma_resilience.png); }
h2#study_abroad {background-image: url(../img/interface/h2_study_abroad.png); }
h2#nebucadnezzer {background-image: url(../img/interface/h2_nebucadnezzer.png); }
h2#personal_artwork {background-image: url(../img/interface/h2_personal_artwork.png); }
h2#elbow_park {background-image: url(../img/interface/h2_elbow_park.png); }
h2#jesse_laura {background-image: url(../img/interface/h2_jesse_laura.png); }
h2#octillian {background-image: url(../img/interface/h2_octillian.png); }

/*Work*/
div.three img {margin: 0 0 15px 15px; display: none; }
img.showcase {width: 885px; height: 588px; margin-left: 0 !important; }
.button {width: 60px; height: 60px; margin: 0 0 15px 15px; }
img.button {opacity: 0; }
a.button {opacity: 0.5; filter: alpha(opacity=50); 
-webkit-transition:opacity 0.15s ease-in;  
-moz-transition:opacity 0.15s ease-in;  
-o-transition:opacity 0.15s ease-in;  
transition:opacity 0.15s ease-in; }
a.button:hover {opacity: 1; filter: alpha(opacity=100); }
a#previous {background-image: url(../img/interface/button_previous.png); }
a#view {background-image: url(../img/interface/button_view.png); }
a#gallery {background-image: url(../img/interface/button_home.png); }
a#next {background-image: url(../img/interface/button_next.png); }

/*Float Etc.*/
h1 a, a.button {display: block; }
div.one, div.half, div.three, a.icon, a.thumb, img.thumb, div.three img, .button {float: left; }
div.wrap {overflow: auto; }
h1, h2, a.button {text-indent: -2000em; overflow: hidden; }