@charset "utf-8";

/*--------------------------------------------

				Defaults
				
---------------------------------------------*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0; 
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
outline: 0;
}
body {
line-height: 1;
color: black;
background: white;
}
ol, ul {
list-style: none;
}
/* tables still need ‘cellspacing="0"‘ in the markup */
table {
border-collapse: separate;
border-spacing: 0;
}
caption, th, td {
text-align: left;
font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: "";
}
blockquote, q {
quotes: "" "";
}
.left {
float: left;
}
.right {
float: right;
}
.clear {
clear: both;
}
em {
font-style: italic;
}
strong {
font-weight: bold;
}
a {
color: #1a75cf;  /*set this color relative to your site design*/
text-decoration: underline;
}
a:hover {
text-decoration: none;
}
input, select {
color: #878684;
}
input.image {
border: none;
}
.hidden {
display: none;
}
.print_page {
display: none;
}
.preload {
position: absolute;
left: -999em;
height: 0px;
width: 0px;
overflow: hidden;
}

img.left {
padding: 0 15px 0 0;
}

/*--------------------------------------------

				Basics
				
---------------------------------------------*/

html {
overflow-x: hidden;
}

body {
font-size: 62.5%;
font-family: Arial, Helvetica, sans-serif;
color: #939598;
width: 960px;
margin: 0 auto;
position: relative;
}

h2 {
color: black;
font-size: 1.8em;
font-weight: bold;
line-height: 1.6em;
}

.introduction {
font-size: 2em;
line-height: 1.4em;
text-align: center;
padding: 25px 0 215px;
}

.introduction em {
font-style: normal;
color: black;
}

.alexandra-wetmore {
float: left;
width: 912px;
padding: 0 24px;
height: 62px;
background: url(../images/alexandra-wetmore-logo.gif) center top no-repeat;
}

.alexandra-wetmore li {
float: left;
height: 62px;
position: relative;
display: inline;
}

.alexandra-wetmore li p {
font-size: 1.5em;
line-height: 1.3em;
}

.alexandra-wetmore li .top-left {
position: absolute;
left: -27px;
top: -324px;
border: 2px solid #a7a9ac;
padding: 15px;
height: 250px;
background: white;
width: 42em;
}

.alexandra-wetmore li .top-left .arrow {
position: absolute;
top: 280px;
left: 5px;
width: 22px;
height: 58px;
background: url(../images/arrow-topleft.png);
}

.alexandra-wetmore li .bottom-left {
position: absolute;
left: -27px;
top: 125px;
border: 2px solid #a7a9ac;
padding: 15px;
height: 250px;
background: white;
width: 42em;
}

.alexandra-wetmore li .bottom-left .arrow {
width: 22px;
height: 60px;
position: absolute;
top: -60px;
left: 5px;
background: url(../images/arrow-bottomleft.gif);
}

.alexandra-wetmore li .top-right {
position: absolute;
right: -25px;
top: -324px;
border: 2px solid #a7a9ac;
padding: 15px;
height: 250px;
background: white;
width: 42em;
}

.alexandra-wetmore li .top-right .arrow {
position: absolute;
top: 280px;
right: 5px;
width: 22px;
height: 58px;
background: url(../images/arrow-topright.png);
}

.alexandra-wetmore li .bottom-right {
position: absolute;
right: -22px;
top: 125px;
border: 2px solid #a7a9ac;
padding: 15px;
height: 250px;
background: white;
width: 42em;
}

.alexandra-wetmore li .bottom-right .arrow {
width: 22px;
height: 60px;
position: absolute;
top: -60px;
right: 5px;
background: url(../images/arrow-bottomright.gif);
}

/*--------------------------------------------

				Letters
				
---------------------------------------------*/

.letter {
cursor: pointer;
}

.display-off {
left: -999em !important;
}

.alex {
width: 51px;
margin-right: 8px;
}

ul .alex .top-left {
width: 35em;
}

ul .alex .top-left .thumbnails {
width: 35em;
}

.logo-design {
width: 18px;
margin-right: 8px;
}

.logo-design .bottom-left {

}

.entertainment-marketing {
width: 53px;
}

.entertainment-marketing .thumbnails li, .niche .thumbnails li, .advertising .thumbnails li {
margin: 19px 6px 0;
display: inline;
}

.experience {
width: 57px;
}

ul .experience .bottom-left {
padding: 20px;
height: 240px;
width: 34em;
}

ul .experience .bottom-left p {
padding: 5px 5px 0 0;
}

.accounts-agencies {
width: 49px;
margin-right: 4px;
}

.accounts-agencies li img {
display: inline;
float: left;
}

.alexandra-wetmore li.right {
float: right;
}

.accounts-agencies .thumbnails li.correct {
margin-top: 50px;
}

.accounts-agencies .thumbnails li.correct1 {
position: relative;
}

.accounts-agencies .thumbnails li.correct1 img {
left:64px;
top:-119px;
position: absolute;
}

ul .accounts-agencies .top-left {
width: 540px;;
}

ul .accounts-agencies .top-left .thumbnails {
width: 540px;
top: -38px;
margin-bottom: -38px;
}

.accounts-agencies .thumbnails li.correct3 img {
padding-bottom: 9px;
}

.accounts-agencies .thumbnails li.correct4 img {
padding-bottom: 6px;
}

.niche {
width: 48px;
margin-right: 8px;
}

ul .niche .bottom-left {
width: 37em;
}

ul .niche .bottom-left .thumbnails {
width: 37em;
}

.direct-marketing {
width: 49px;
margin-right: 9px;
}

.direct-marketing .thumbnails li.correct {
position: relative;
top: -20px;
left: 25px;
}

.direct-marketing .thumbnails li.correct2 {
position: relative;
top: -100px;
left: 10px;
}

.resume {
width: 45px;
margin-right: 3px;
}

ul .resume .bottom-left {
width: 39em;
}

ul .resume .bottom-left .thumbnails {
width: 39em;
}

.resume .thumbnails li {
margin: 5px 8px 0 6px;
display: inline;
}

.advertising {
width: 51px;
margin-right: 32px;
}

.web {
width: 82px;
}

.web .thumbnails li{
margin: 30px 9px 0;
display: inline;
}

.events-tradeshows {
width: 52px;
margin-right: 4px;
}

.events-tradeshows .thumbnails li img {
margin: 20px 10px 0;
display: inline;
}

.television {
width: 43px;
margin-right: 6px;
}

.television .thumbnails {
text-align: center;
padding-top: 15px;
}

.television .thumbnails li {
float: none;
}

.macintosh {
width: 76px;
margin-right: 7px;
}

ul .macintosh .top-right {
width: 33em;
padding: 20px;
height: 240px;
}

ul .macintosh .top-right p {
padding: 5px 25px 0 0;
}

.outdoor-advertising {
width: 52px;
margin-right: 8px;
}

.outdoor-advertising .thumbnails li {
margin: 15px 15px 0 15px;
display: inline;
}

ul .outdoor-advertising .bottom-right {
width: 39em;
}

ul .outdoor-advertising .bottom-right .thumbnails {
width: 39em;
}

.responsible-advertising {
width: 37px;
}

.responsible-advertising .thumbnails {
text-align: center;
padding-top: 25px;
}

.responsible-advertising .thumbnails li {
float: none;
}

.entertainment-marketing-emphasis  {
width: 52px;
}

.entertainment-marketing-emphasis .thumbnails {
width: 40em;
}

.niche h2, .responsible-advertising h2 {
font-size: 1.7em;
line-height: 1.2em;
padding: 3px 0;
}

.entertainment-marketing-emphasis h2 {
line-height: 1.1em;
padding: 3px 0;
}

.entertainment-marketing-emphasis h2 em {
font-style: normal;
font-size: 0.6em;
vertical-align: middle;
}

.entertainment-marketing-emphasis .thumbnails li {
margin: 5px 6px 0 6px;
display: inline;
}

ul .entertainment-marketing-emphasis .bottom-right {
width: 40em;
height: 230px;
}

.thumbnails {
float: left;
width: 42em;
position: relative;
}

.thumbnails li {
height: auto;
cursor: pointer;
}

.accounts-agencies .thumbnails li {
height: auto;
cursor: auto;
}

.close {
cursor: pointer;
position: absolute;
top: 0;
right: 0;
height: 19px;
width: 17px;
padding: 0 0 0 1px;
line-height: 15px;
font-size: 15px;
text-align: center;
color: white;
background: #A7A9AC;
}

.bottom-right .close {
right: auto;
left: 0;
padding: 0 1px 0 0;
}

.instructions {
position: absolute;
bottom: 10px;
right: 10px;
font-size: 1.3em;
font-weight: bold;
}

/*--------------------------------------------

				Campaigns
				
---------------------------------------------*/

.letter .campaigns {
position: absolute;
left: -999em;
}

.display-campaigns {
border: 1px solid #A7A9AC;
position: relative;
position: absolute;
top: 100px;
left: -950%;
width: 720px;
height: 500px;
margin-left: -360px;
background: #e7e8e9;
padding: 20px;
overflow: hidden;
}

.campaign {
float: left;
width: 720px;
height: 500px;
padding: 0 0 20px 0;
position: relative;
top: 0;
}

.display-campaigns .close {
padding: 1px 1px 0 2px;
}

.display-campaigns .campaign-controls {
position: absolute;
top: 500px;
right: 15px;
color: #666666;
font-size: 23px;
font-weight: bold;
background: #E7E8E9;
padding: 5px;
}

.display-campaigns .campaign-controls li {
float: left;
margin: 0 5px;
cursor: pointer;
}

.display-campaigns .campaign-information {
position: absolute;
bottom: 70px;
right: 0;
width: 350px;
}

.display-campaigns h3, .display-campaigns p {
padding-right: 25px;
}

.display-campaigns h3 {
color: black;
font-weight: bold;
font-size: 19px;
padding: 0 0 10px;
line-height: 20px;
}

.display-campaigns p {
color: #787b7b;
font-size: 16px;
line-height: 24px;
}

.display-campaigns .colateral {
position: relative;
float: left;
width: 347px;
z-index: 5;
}

.display-campaigns .colateral ul {
float: left;
border: 1px solid #111211;
width: 345px;
height: 460px;
overflow: hidden;
background: white;
position: relative;
}

.display-campaigns .colateral ul li {
height: 460px;
width: 345px;
text-align:center;
position: relative;
display: table-cell;
vertical-align: middle;
max-width: 345px;
}

.display-campaigns .colateral ul li table, .display-campaigns .colateral ul li table td {
width: 345px;
height: 460px;
vertical-align: middle;
text-align: center;
}

.display-campaigns .colateral ul li img {
position: relative;
padding: 50px 0;
margin: -50px 0;
background: white;
}

.display-campaigns .colateral ul li .stint {
float: left;
width: 345px;
} 

.display-campaigns .colateral .colateral-controls {
position: absolute;
top: 100%;
right: 1px;
width: auto;
height: auto;
border: none;
background: none;
}

.display-campaigns .colateral .colateral-controls li {
background: white;
float: left;
margin-left: 5px;
display: inline;
color: #000;
font-size: 15px;
font-weight: bold;
line-height: 25px;
width: 26px;
text-align: center;
padding: 0 0 1px;
cursor: pointer;
height: auto;
}
