@charset "UTF-8";

/* •••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••
     Project: mattgantner.com                                      
     Author:  matt gantner                                        
     Rev. Date:    3/2010                                         
   •••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••   
   
    1. Global Styles
       1.1 Default
      
    2. Layout
       2.1 Boilerplate
       2.2 Body and Sections
       2.5 Footer
       
    3.Pages
    	3.1 Index
    	3.2 Resume
      
---------------------------------------------------------------------- */

/* 1.1 Default */
/*---------------------------------------------------------------------- */

html, body {
  background-color: #012546;

}

html {
  overflow-x: auto;
  overflow-y: scroll;
}

body {
  font: normal 13px/1.5 "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Verdana, sans-serif;
  color: #dde9ec;
  padding-bottom: 40px;
}

a {
  color: #df9300;
  text-decoration: none;

}

a:hover,{;

}

a:active {
  position: relative;
  top: 1px;
}

del { text-decoration: line-through; }
li  { list-style: none; }

button,
input[type="submit"],
input[type="image"],
label,
label > input[type="checkbox"],
label > input[type="radio"] {
  cursor: pointer;
}

/* 2 Layout */
/*---------------------------------------------------------------------- */
/* 2.1 Boiler Plate */
/*---------------------------------------------------------------------- */

#hd {
  text-align: left;
  position: relative;
}



#hd .headerImage01 {
/* fox image */
float: left;
min-height: 100px;
min-width: 180px;
background-repeat: no-repeat;
background-image: url(../images/fox.gif);
}

#hd .headerImage02 {
/* bear image */
float: left;
min-height: 100px;
min-width: 180px;
background-repeat: no-repeat;
background-image: url(../images/bear.gif);
}

#hd .headerImage03 {
/* bear image */
float: left;
min-height: 100px;
min-width: 180px;
background-repeat: no-repeat;
background-image: url(../images/bear.gif);
}

#hd .headerImage04 {
/* bear image */
float: left;
min-height: 100px;
min-width: 180px;
background-repeat: no-repeat;
background-image: url(../images/penguin.gif);
}


#hd h1 {
  font: normal Georgia, "Times New Roman", Times, serif;
  font-size: 300%;
  text-align: left;
  text-shadow: rgba(0, 0, 0, 0.5) 0 1px 4px;
  color: #df9300;
  position: relative;
  margin: 0 auto;
  overflow: hidden;
}


#hd p {
  margin-top: -10px;
  padding-bottom: 10px;
}


#hd #navBar a {
  color: #df9300;
  font-size: 85%;
  line-height: 1;
  border: 0;
  text-shadow: rgba(255, 255, 255, 0.08) 0 1px 0;
  padding: 5px 4px 5px 14px;
  -moz-border-radius-topright: 2px;
  -moz-border-radius-bottomright: 2px;
  -webkit-border-top-right-radius: 2px;
  -webkit-border-bottom-right-radius: 2px;
  -webkit-transition: background-color 0.15s linear;
  -moz-transition: background-color 0.15s linear;
}


#hd #hereIAm {
background-color: #26537C;
}

#hd a:hover,
#hd a:focus {
  background-color: #377c37;
}

#hd a:active {
  left: -3px;
}

/* 2.2 Section
---------------------------------------------------------------------- */


.section {
  padding-right: 0px;
  margin-left: 10px;
  padding-left: 5px;
  padding-bottom: 5px;
  padding-top: 5px;
  margin-right: 10px;
  margin-bottom: 40px;
  margin-top: 40px;
  border-left-width: 3px;
  border-left-color: #df9300;
  border-left-style: solid;
  border-bottom-width: 0px;
  text-align: left;
  background: #35393c;
  width: 100%;
  font-size: 100%;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
}

.section h3 {
font-size: 123.1%;
}


.section:after {
  visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
}

/*
.yui-b ul {
  margin-right: 0;
  margin-top: 0;
}

.yui-b > li {
  padding-left: 8px;
}

.yui-b > li ul {
  margin-left: 8px;
}

.yui-b ul li a {
  border-bottom: 0;
  position: static;
}

.yui-b li,
.yui-b ul,
.yui-b ul li a  {
  display: inline;
  margin-bottom: 10px;
                  
  display: inline-block;
  line-height: 1;
}

.yui-b ul,
.yui-b ul li,
.yui-b ul li a {
}

.yui-b ul {
}

.yui-b ul li {
  margin-left: 1px;
}

.yui-b ul li:first-child {
  margin-left: 0;
}

.yui-b + ul li div {
	margin-bottom: 10px;
}

*/

.section #posts {
	padding-bottom: 15px;
	padding-left: 3px;
	font-size: 100%;
	font-family: sans-serif;
	width: 100%;
	}
	
.section #posts .post {
	display: list-item;
	list-style-position: inside;            
	list-style-type: none;                   
	margin-bottom: 5px;
	position: relative;
}

.section li h1 {
	font-size: 123.1%;
	margin-bottom: 8px;
	color: #df9300;
}

.section ul li a {
  padding: 5px 8px 6px;
  color: #df9300;
  text-shadow: rgba(255, 255, 255, 0.1) 0 1px 0;
  text-decoration: none;
}

.section #twitter {
color: white;
min-height: 100px;
min-width: 180px;
height: 120px;
width: 180px;
background-repeat: no-repeat;
background-image: url(../images/twitter_icon.gif);
}

.section hr {
	color: #12625b;
	}

#QR {
/* QR Code */

float: left;
min-height: 120px;
min-width: 120px;
border-width: 3px;
border-color: #35393c;
border-style:solid;
background-image: url(../images/websiteQR.gif);

}

#QR:hover {
  border-width: 3px;
  border-color: #df9300;
  border-style: solid;
background-image: url(../images/websiteQRWhite.gif);
}

.section .thumbnail_large{
float:left;
padding:7px;

}




/* 2.3 footer */
/*---------------------------------------------------------------------- */

#footer ul li a {
float:left;
}




/* 3.0 Pages */
/*---------------------------------------------------------------------- */


/* 3.1 Index */
/*---------------------------------------------------------------------- */
#index .sectionName {
font-size: 140%;
padding: 5px;
}

#index legend {
font-size: 110%;
color:#DDE9EC;
padding:7px;
}

#index #filter yui-g {
float:left;
}



#index #filter input {
margin-right:4px;
}

#index label {
padding:10px;

}

/*Image Grid */
/*---------------------------------------------------------------------- */

.image-grid {
  margin-left: -40px;
  margin-bottom: 0;
  margin-right: 0;
  padding-left: 45px;
  width:auto;
}

.image-grid:after {
  content: "";
  display: block;
  height: 0;
  overflow: hidden;
  clear: both;
}

.image-grid li {
  margin-left: 35px;
  margin-bottom: 0;
  margin-right: 0;
  margin-top: 20px;
  width: 128px;
  float: left;
  text-align: center;
  font-family: "Helvetica Neue", sans-serif;
  line-height: 17px;
  color: #686f74;
  height: 250px;
  overflow: hidden;
}

.image-grid li img,
.image-grid li strong {
  display: block;
}

.image-grid li strong {
  color: #fff;
}

.image-grid li span {
visibility: hidden;
}


/* 3.2 Resume */
/*---------------------------------------------------------------------- */

#resume .pageTitle{
font-size: 170%;
padding-bottom: 5px;
}

#resume .sectionName {
font-size: 140%;
}



#resume ul {

	list-style-position: outside;

	list-style-type: disc;

	margin: 5px;
	padding: 5px;
}


#resume .section li {
display:list-item;
	list-style-position: inside;
	list-style-type: disc;

}
#resume .section ul li a {
  padding: 0px;
  color: #46c5ec;
  text-shadow: rgba(255, 255, 255, 0.1) 0 1px 0;
  text-decoration: none;
}


#resume .companyName {
clear: left;
display: block;
font-size: 108%;
}

#resume .companyDescription {
clear: both;
display: block;
font-style: italic;

}

#resume .jobTitle jobDate {
clear: both;
display: block;

}

#resume .school {
display: block;
padding:5px;
}