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

 Milwaukee Art Museum | mam.org
Frank Lloyd Wright
 * Minisite specific styles
   
----------------------------------------------------------------------- 
*/


/* Color Scheme
-----------------------------------------------------------------------
Background..#FEFEFE or #EDEDED
Wright Red.......#b32017
Bright Wright Red.......#d0251b

*/

/* Blueprint Adjustments
----------------------------------------------------------------------- 
This will provide a method to keep blueprint intact while still making 
adjustments to the framework.
----------------------------------------------------------------------- */
div {position:relative;}
.showgrid {background:url(../image/dev_grid.png) !important;}


/* Links
----------------------------------------------------------------------- */
a:link,
a:visited {text-decoration:underline; color:#666;}
a:hover,
a:active,
a:focus {text-decoration:underline; color:#444;}

h2 a:link,
h2 a:visited, 
h3 a:link,
h3 a:visited, 
h4 a:link, 
h4 a:visited,
h5 a:link,
h5 a:visited,
h6 a:link,
h6 a:visited{text-decoration:none !important;}

h2 a:hover, h2 a:focus,
h3 a:hover, h3 a:focus,
h4 a:hover, h4 a:focus,
h5 a:hover, h5 a:focus,
h6 a:hover, h6 a:focus {text-decoration:underline;}

#body a:link,
#body a:visited {font-weight:normal; text-decoration:normal; color:#b32017;}
#body a:hover,
#body a:active,
#body a:focus {text-decoration:underline; color:#d0251b;}

#sidebar a:link,
#sidebar a:visited {text-decoration:normal; color:#b32017;}
#sidebar a:hover,
#sidebar a:active,
#sidebar a:focus {text-decoration:underline; color:#d0251b;}


/* Typography
----------------------------------------------------------------------- */
body {
color:#222;
font-family:"Segoe UI", Tahoma, "Helvetica Neue", Helvetica, sans-serif;
font-size:80%;}

/* Different Font Stacks to consider
font-family:"Segoe UI", Tahoma, "Helvetica Neue", Helvetica, sans-serif;
font-family: Calibri, "Myriad Pro", Myriad, Tahoma, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", sans-serif;
*/

h1, h2, h3, h4, h5, h6 {
font-family:"Century Gothic", "Lucida Sans Gothic", "Helvetica Neue", Helvetica, "Segoe UI", Tahoma, sans-serif;
font-weight:normal;
color:#b32017;}

h1 {font-size:1.3em; line-height:1; margin-bottom:0.5em;}
h2 {font-size:1.3em; line-height:1.1; margin-bottom:0;}
h3 {font-size:1.4em; line-height:1.1; margin-bottom:0.5em;}
h4 {font-size:1.1em; line-height:1.1; margin-bottom:0.5em; color:#222;}
h5 {font-size:1em; font-weight:normal; margin-bottom:0.5em;}
h6 {font-size:.9em; font-weight:bold;}

p {margin:0 0 1.5em;}
p.subhead {margin:0;padding:0; color:#934C93;}
p.more {margin-top:-1em !important; background:transparent !important;}

blockquote {
background:url(../image/quotes-trans.png) no-repeat 10px 10px;
border-top:1px solid #DDD;
border-bottom:1px solid #DDD;
margin:1.5em 0;
padding:.5em 0 .5em 0;
}

blockquote p {
color:#222;
font-style:normal;
font-weight:bold;
font-size:160%;
line-height:1.1em;
margin:0;
padding:11px 10px .5em 50px;
}

acronym {cursor:help;}

dl.dialogue {}
dl.dialogue dt {float:left; width:80px; background:;}
dl.dialogue dd {margin:0 0 1em 80px;}


/* Global
----------------------------------------------------------------------- */
html,body {background:#FEFEFE;}

ul.nav {margin:0; padding:0;}
ul.nav li {display:inline; list-style:none;}
ul.nav li span {padding:0 6px;}
ul.nav li a {text-decoration:none;}
 
ul.menu {margin:0; padding:0; list-style:none;}
ul.menu li {margin-bottom:.25em;}
ul.menu a {text-decoration:underline;}
ul.menu a:hover {text-decoration:none;}
ul.menu.pdf {margin-bottom:2em;}
ul.menu.pdf li {background:aqua /* url(../images/links/pdf.png) no-repeat 0 2px; margin-bottom:.25em; padding-left:25px; list-style:none*/;}


/* Images */
img.right {float:right;margin:0;}
img.left {float:left;margin:0;}
p img.right {float:right; margin:.5em 0 1.7em 1.7em;}
p img.left {float:left; margin:1.5em 1.7em 1.7em 0; padding:0;}
p img.top {margin-top:.5em;}
p img.bottom {}
img.art {border:5px solid #EEE;}
img.block {display:block;}

div.inset {float:right; width:240px; margin-top:.5em;}
div.inset p {margin:0 0 1.7em 30px; font-size:x-small;}
div.inset img {display:block; margin:0 0 1em;}


/* Microformats */
.vevent {}
.vevent .summary {display:block; font-weight:bold;}
.vevent .date {display:block;}
.vevent abbr {cursor:pointer; border-bottom:none;}
.vevent .details {margin-top:-1em;}


/* Tools */
.clear {clear:both;}
.white-space {white-space:nowrap;}
.creditline {font-size:xx-small;}
.creditline b {font-weight:normal; text-transform:uppercase;}
.sponsor {font-style:italic; color:#666;}
.sponsor i {font-style:normal !important;}
.quiet {color:#666;}
.popup {}
.credit-lines li {padding: 0 0 10px 0;}


/* Header
-------------------------------------------------------------- */
#header {
background:#ECECEC;
border-bottom:1px solid #DDD;
margin:0 auto;
margin-bottom:40px;
position:relative;
z-index:1;
}

#headerWrap {
margin-bottom:10px;}

#header p {margin:0;}

#global { 
height:50px !important;
padding-top:5px;
}

#global h1#mam { 
float:left; 
position:relative; top:15px; 
margin:0; 
width:690px; height:22px;
z-index:100;
}

#global a#wordmark {
display:block;
width:600px; height:22px;
text-indent:-999em;
background:url(../../media/image/brand_mam-trans.png) no-repeat;
}

#service {position:absolute; left:650px; width:300px;}
#service .nav {position:relative; top:-2px; margin:0; font-size:11px; color:#555;}
#service form {}
#service form button {float:left; margin:0;}
#service form input.text {
float:left; 
position:relative; top:0;
margin:0; margin-right:3px;
padding:0 4px !important; 
border:1px solid #777 !important;
width:240px; height:21px;}

#service a:link,
#service a:visited {color:#555;}
#service a:hover,
#service a:active,
#service a:focus {color:#666;}


/* Title */
#title {
float:left;
width:270px;
}

#title a {
background:url(../../media/image/logo.png) no-repeat;
display:block;
height:270px;
margin:0;
margin-bottom:2em;
padding:0;
text-indent:-9999em;
}

#title .date {
font:bold 14px "Helvetica Neue", Helvetica, "Segoe UI", Tahoma, sans-serif;
margin:0;
margin-bottom:1em;}

#title .sponsor {font-size:x-small;}
#title .sponsor img {vertical-align:middle; margin-top:.5em; margin-left:1em;}
#title .mjs {white-space:nowrap;}


/* Main Nav */
#nav-site {
clear:left;
border-top:1px solid #DDD;
font:bold 105% "Segoe UI", Tahoma, Helvetica, sans-serif;
margin-bottom:5px;
width:270px;}

#nav-site .menu {margin-bottom:20px;}

#nav-site  span {display:none;}
#nav-site  li {position:relative; top:5px; margin-right:20px;}
#nav-site  li a {font-family: "Century Gothic", "Tw Cen MT", Futura, "URW Gothic L", Arial, sans-serif;}
#nav-site  li a:link,
#nav-site  li a:visited {color:#b32017; text-decoration:none;}
#nav-site  li a:hover,
#nav-site  li a:active,
#nav-site  li a:focus {color:#d0251b; text-decoration:none;}

#gallery #nav-site  li#ns1 a,
#programs #nav-site  li#ns2 a,
#dictionary #nav-site  li#ns3 a {color:#b32017;}


#guides ul {list-style:none outside; padding:0; margin:0;}

#guides.menu {border:0; font-family: "Century Gothic", "Tw Cen MT", Futura, "URW Gothic L", Arial, sans-serif;font-size:85%;}
#guides.menu div {padding:0 0 .5em;}

#guides.menu a span {
border-top:1px solid #DDD;
display:block;
padding:.3em 0 0;
}

#guides a:link,
#guides a:visited {text-decoration:none;}
#guides a:hover,
#guides a:active,
#guides a:focus {text-decoration:none;}

#guides.menu span {display:block; color:#b32017; font-size:120%;}

#guides a:link span,
#guides a:visited span {text-decoration:none; color:#b32017;}
#guides a:hover span,
#guides a:active span,
#guides a:focus span {text-decoration:none; color:#d0251b;	-webkit-transition-duration: .5s, .5s; -webkit-transition-timing-function: linear, ease-in;
}

.share {margin-top:1em;}

.share a {
background:url(../../asset/image/btn_share.png) no-repeat;
display:block;
height:25px;
margin-bottom:2em;
text-indent:-999em;
width:102px;
}


/* Body
-------------------------------------------------------------- */
#body {}
#bodyWrap {}


/* Columns */
.primary {float:right;width:630px;border-left:4px double #cecece;padding: 0 0 0 22px;}

/* Sidebar */
#sidebar {clear:left;width:270px;}

#sidebar .video {
border-bottom:1px solid #DDD;
margin:20px 0;
padding-bottom:5px;
}


#sidebar .video p {
margin-top:10px; 
font-size:85%;
}

#sidebar .sponsor {font-size:80%; padding:.5em 0 0;}
#sidebar .sponsor span {color: #666666; display:inline;}
.museum-hours, ul.museum-hours li a { border-top:0; list-style:outside none; margin: 0; padding:0 0 .3em; list-style-type:none;}
#guides.menu .museum-hours li a {border:0; padding:0; margin:0}
.media-sponsors {padding:0;!important}

/* Home */
#slideshow {height:370px;}
#slideshow li {display:none;}
#home #video {margin-bottom:2em;}
#home .vevent {font-weight:bold; margin-bottom:1em; font-family:"Century Gothic", "Lucida Sans Gothic", sans-serif;}
#home .summary {font-weight:bold;}
#home .primary .sponsor {font-size:90%; border-top:1px solid #DDD; padding-top:1em;}

#home #aside {margin-left:10px; padding-left:19px; border-left:1px solid #DDD;}
#home #aside img {margin-bottom:10px;}
#home #aside p {font-size:85%;}
#aside li {display:none;}

.sites h5 { border-bottom:1px solid #B32017; padding: 20px 0 0;}


/* Gallery */
.gallery-selections {}
.gallery-selections h3 {margin-bottom:1em;}
.gallery-selections img {
border:3px solid #111;
float:left;
margin:0 10px 10px 0;
width:144px;
}

.gallery-selections img.last {margin-right:0 !important;}
.gallery-selections p {margin-left:0;}

/* Dictionary */
#dictionary .vevent {font-weight:bold; margin-bottom:1em;}
#dictionary .summary {font-weight:bold;}

#dictionary dl {margin:1.3em 0;}
#dictionary dt {}
#dictionary dd {margin-bottom:1.3em; margin-left:0;}
#dictionary dl#major {border-bottom:1px solid #DDD;}

/* Programs */
#programs .vevent {font-weight:bold; margin:1em 0;}
#programs .summary {font-weight:bold;}
#programs .vevent .sponsor {color:#222; font-style:normal;}

#calendar-listing {margin-bottom:2em; padding-top:1em;}
#calendar-listing .alt {background:#EEE; /*border:1px solid #ECECEC;*/ border-width:1px 0;}
#calendar-listing li { list-style:inside; }

.calendar-item {padding:1.5em 0 .6em;}
.calendar-item h4 {margin-bottom:0; padding:0 15px 5px;}
.calendar-item p {margin-bottom:1em; padding:0 15px;}
.calendar-item .date {margin-bottom:.5em; text-transform:uppercase;}

a.rss {
background:url(../image/link/rss.png) no-repeat 0 center; 
display:block;
hright:16px;
position:absolute; top:0; right:0;
text-indent:-999em;
width:16px;
}



/* Footer
-------------------------------------------------------------- */

#footer {
clear:both;
color:#666;
padding:20px 0;
font-size:11px;
}

#footer .left {float:left;}
#footer .left img {margin-top:3em;}
#footer .right {float:right;}

#footer a {text-decoration:none; color:#666;}
#footer a:hover,
#footer a:active,
#footer a:focus {text-decoration:none; color:#777;}


#nav-utility {clear:left; margin-bottom:2px;}
#nav-utility span {padding:0 6px;}

#footer #mamlogo {height:78px; padding-bottom:5px;}

#footer-local {margin-top:50px; border-bottom:1px solid #666;}
#footer-global {}

#footer-global a#mam-logo { 
position:absolute; top:-84px; left:100%;
margin-left:-95px;
height:78px; width:95px;
text-indent:-999em;
background:url(../../media/image/brand_mam-logo-trans.png) no-repeat;}



/* Miscellaneous
-------------------------------------------------------------- */
a#wordmark:focus,
#title a,
a#mam-logo:focus {outline:none;}





