@charset "utf-8";
/* CSS Document */


/*	----------STYLESHEET FOR MY PORTFOLIO----------  */



/* --- selectors for background and global styles --- 

div{border: 1px solid green;}   */

body {
	background-image: url(images/bkgd-tile.jpg);
	background-color: #ddd2c0;
	background-position: top;
	background-attachment: scroll;
	background-repeat: repeat;
	/*font: 1em Verdana, Arial, Helvetica, sans-serif;*/
	font-size: 1em;
	font-family: BrandonGrotesque-Light; 
	font-weight: normal; 
	font-style: normal;
	margin: 0;
	padding: 0;
}

img {
	border: none;
	max-width: 100%;
	height: auto;
}
	
div, ul, ol, dl {
	padding: 0;
	margin: 0;
}



/* --- main structural divs --- */

#main {
	position: relative;
	width: 980px;
	height: 500px;
	margin: 0 auto;
}

.main-header {
	position: relative;
	width: 600px;
	height: 100px;
	float: left;
}

.left-column {
	position: relative;
	width: 600px;
	height: auto;
	float: left;
	margin-top: -10px;
}

.right-column {
	position: relative;
	width: 300px;
	height: 578px;
	float: right;
	margin: -80px 0 0 0;
}

.footer {
	position: relative;
	width: 280px;
	height: auto;
	float: right;
	text-align: left;
	font-size: 0.9em;
	margin: 30px 0;
}

.validator {
	position: relative;
	width: 80px;
	height: 15px;
	padding: 20px 0;
}



/* --- quick reference key --- */

.key-entry {
	position: relative;
	margin: 0;
	padding: 0;
	float: left;
	width: 300px;
	height: 45px;
}

.key-pt, .key-pam, .key-icontracting, .key-rockwp, .key-arl, .key-channel9, .key-mms, .key-personal, .key-cb, .key-weta {
	position: relative;
	float: left;
	width: 20px;
	height: 20px;
	margin: 10px 10px 10px 20px;
}

.key-weta {
	background-color: #eb7603;
}

.key-cb {
	background-color: #507989;
}

.key-pt {
	background-color: #b12b05;
}

.key-pam {
	background-color: #4c9612;
}

.key-icontracting {
	background-color: #90634e;
}

.key-rockwp {
	background-color: #562610;
}

.key-arl {
	background-color: #f1ede6;
}

.key-channel9 {
	background-color: #ecc458;
}

.key-mms {
	background-color: #305392;
}

.key-personal {
	background-color: #ebb190;
}

.key-entry-text {
	position: relative;
	float: left;
	width: 250px;
	margin: 10px 0 10px 0;
	font-size: 1em;
	color: #562610;
}



/* --- text styles --- */

h1 {
	font-size: 3em;
	font-weight: 100;
	margin-top: 20px;
	color: #260d04;
}

h2 {
	font-size: 1.6em;
	font-weight: 100;
	font-family: BrandonGrotesque-Light; 
	color: #260d04;
}

.subtitle {
	font-size: 1.4em;
	font-weight: 100;
	margin: 6px 0 11px 0;
	color: #260d04;
}

p {
	font-size: 1.2em;
	color: #562610;
}

@font-face {
	font-family: 'BrandonGrotesque-Light';
	src: url('webfonts/2348F9_0_0.eot');
	src: url('webfonts/2348F9_0_0.eot?#iefix') format('embedded-opentype'),url('webfonts/2348F9_0_0.woff') format('woff'),url('webfonts/2348F9_0_0.ttf') format('truetype');
}

/* @license
 * MyFonts Webfont Build ID 2312441, 2012-06-20T06:44:49-0400
 * 
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are 
 * explicitly restricted from using the Licensed Webfonts(s).
 * 
 * You may obtain a valid license at the URLs below.
 * 
 * Webfont: Brandon Grotesque Light by HVD Fonts
 * URL: http://www.myfonts.com/fonts/hvdfonts/brandon-grotesque/light/
 * Copyright: Copyright (c) 2009 by Hannes von Doehren. All rights reserved.
 * Licensed pageviews: 10,000
 * 
 * 
 * License: http://www.myfonts.com/viewlicense?type=web&buildid=2312441
 * 
 * © 2012 Bitstream Inc
*/

.ext-link {
	color: #b12a04;
	font-size: 1em;
	font-weight: 600;
	text-decoration: none;
}
.ext-link:visited { 
	color: #675955;
}
.ext-link:hover {
	color: #4c9612;
}
.ext-link:active { 
	color: #305392;
}




/* ------ javascript accordion menu ------ */

#accordion {
	position: relative;
	width: 980px;
	height: auto;
	clear: both;
}

.container-content {
	position: relative;
	padding: 30px 0 10px 0;
	background-color: transparent;
}

/* --- gallery thumbnails --- */

.gallery-thumb {
	position: relative;
	margin: 0;
	padding: 0;
	float: left;
	width: 140px;
	height: 140px;
}

.thumb-pt, .thumb-pam, .thumb-icontracting, .thumb-rockwp, .thumb-arl, .thumb-channel9, .thumb-mms, .thumb-personal, .thumb-cb, .thumb-weta {
	position: relative;
	float: left;
	width: 110px;
	height: 110px;
	margin: 9px;
}

.thumb-weta {
	border: 6px solid #eb7603;
}

.thumb-cb {
	border: 6px solid #507989;
}

.thumb-pt {
	border: 6px solid #b12b05;
}

.thumb-pam {
	border: 6px solid #4c9612;
}

.thumb-icontracting {
	border: 6px solid #90634e;
}

.thumb-rockwp {
	border: 6px solid #562610;
}

.thumb-arl {
	border: 6px solid #f1ede6;
}

.thumb-channel9 {
	border: 6px solid #ecc458;
}

.thumb-mms {
	border: 6px solid #305392;
}

.thumb-personal {
	border: 6px solid #ebb190;
}


.fancybox-buttons {
	position: relative;
	margin: 5px 5px; 
	top: 5px;
	opacity: 0.7; /* fx, safari, opera, chrome */
	filter: alpha(opacity=70); /* For IE */
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=70)"; /* For IE8 */
	-webkit-transition: .5s;
       -moz-transition: .5s;
        -ms-transition: .5s;
         -o-transition: .5s;
            transition: .5s;
}

.fancybox-buttons:hover {
	opacity: 1; /* fx, safari, opera, chrome */
	filter: alpha(opacity=100); /* For IE */
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=100)"; /* For IE8 */
}

/*.fancybox-buttons:after{
	background-image: url(images/thumbnails/web_pa-1_thumb_bw.jpg);
} */


/* --- tooltip --- */

#text {
	margin:50px auto;
	width:500px
}
.hotspot {
	color:#900;
	padding-bottom:1px;
	border-bottom:1px dotted #900;
	cursor:pointer
}
#tt {
	position:absolute;
	display:block;
	background:url(tooltip/images/tt_left.gif) top left no-repeat
}
#tttop {
	display:block;
	height:5px;
	margin-left:5px;
	background:url(tooltip/images/tt_top.gif) top right no-repeat;
	overflow:hidden
}
#ttcont {
	display:block;
	padding:2px 12px 3px 7px;
	margin-left:5px;
	background:#666;
	color:#FFF
}
#ttbot {
	display:block;
	height:5px;
	margin-left:5px;
	background:url(tooltip/images/tt_bottom.gif) top right no-repeat;
	overflow:hidden
}