/* Reset
-------------------------------------------------------------- */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline;}
body {line-height: 1.5; background: #fff; margin:1.5em 0;}
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight:400; }
a img {border:none;}

/* General Elements
-------------------------------------------------------------- */
* {-moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;}
html, body {background-color:#000000;}
body {margin:0; padding:0; color:#575757; font-size:75%; font-family:"Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;}
header, footer, nav {display:block;}
img {border:0; max-width:100%;}
button::-moz-focus-inner {border:0;}
::selection, ::-moz-selection {background:#f9ab53;}
hr {border:0; border-top:1px solid #ddd; border-bottom:1px solid #fff; margin:20px 0;}

/*Typography ------------------------------------------ */
body, button {font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;}
h1,h2,h3,h4,h5,h6 {font-weight:500;  letter-spacing:-1px; margin:20px 0 5px 0; color:#333}
h1 {font-size:38px; font-weight:700;}
h2, .h2 {font-size:28px; font-weight:700;}
h3, .h3 {font-size:30px;}
h4, .h4 {font-size:22px;}
h5, .h5 {font-size:16px;}
h6, .h6 {font-size:14px;}
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a {text-decoration:none}
hgroup {margin:20px 0 5px 0;}
hgroup h1, hgroup h2, hgroup h3, hgroup h4, hgroup h5, hgroup h6 {margin:0;}
p {margin:0 0 20px 0; font-size:15px;}
a {text-decoration:none;}
a:link, a:visited {color:#0d7cad;}
a:hover, a:focus, a:active {color:#0d7cad; text-decoration:underline;}
a:focus {outline:1px dotted rgba(0, 0, 0, 0.25);}
a[href="#"], a[onclick] {cursor:pointer; color:#0d7cad;}
a[onclick]:hover, a[onclick]:active {color:#101010;}
strong {font-weight:bold;}
em {color:#555; font-style:italic;}
abbr, acronym {border-bottom:1px dotted #666;}
code {display:block; margin:1em 0; background-color:#fff; padding:1.2em; font-family:Courier, monospace; font-size:110%; color:#333;}


.clearfix {*zoom:1;}
.clearfix:before, .clearfix:after {display:table;content:"";}
.clearfix:after {clear:both;}

.row {width:100%; *zoom:1;}
.row:before, .row:after {display:table; content:"";}
.row:after {clear:both;}
.row > [class*="span"] {float:left; margin-left:2.127659574%;}
.row > [class*="span"]:first-child {margin-left:0;}
.row .span1 {width:6.382978723%;}
.row .span2 {width:14.89361702%;}
.row .span3 {width:23.404255317%;}
.row .span4 {width:31.914893614%;}
.row .span5 {width:40.425531911%;}
.row .span6 {width:48.93617020799999%;}
.row .span7 {width:57.446808505%;}
.row .span8 {width:65.95744680199999%;}
.row .span9 {width:74.468085099%;}
.row .span10 {width:82.97872339599999%;}
.row .span11 {width:91.489361693%;}
.row .span12 {width:99.99999998999999%;}
.container {*zoom:1;}
.container:before, .container:after {display:table; content:"";}
.container:after {clear:both;}

@media screen and (max-width: 960px) {
	.row .span2 {width:23.404255317%;}
	.row .span3 {width:48.93617020799999%;}
	.row .span6 {width:99.99999998999999%;}
}

@media screen and (max-width: 480px) {
	.row .span2 {width:48.93617020799999%;}
	.row .span3 {width:48.93617020799999%;}
	.row .span4 {width:99.99999998999999%;}
	.row .span8 {width:99.99999998999999%;}
}


header[role="banner"] {position:relative; width:100%; margin:0; padding:0 10px 0 0; height:37px; background:url(/img/header-bg.png) bottom left repeat-x; -webkit-box-shadow:0 0 4px rgba(0, 0, 0, .9); -moz-box-shadow:0 0 4px rgba(0, 0, 0, .9); box-shadow:0 0 4px rgba(0, 0, 0, .9);}
header[role="banner"] h1 {margin:0; font-size:18px; color:#fff; background:url(/img/mandrill-logo.png) bottom left no-repeat; width:42px; height:37px; border-bottom:1px solid #000;}

#content {background-color:#f1f1f2; min-height:200px;}

footer {margin:0; padding:30px 0 0 0; color:#fff; background:transparent url(/img/mandrill.png) 79px 33px no-repeat;}
footer nav li a {color:#999; text-decoration:none;}
footer nav li a:hover, footer nav li a:focus, footer nav li a:active {text-decoration:underline;}
footer img[src="img/mark.png"] {opacity:0.5;}


/*Lists --------------------------------------------------*/
ul, ol {margin:15px 0; padding:0; list-style-type:none;}
ul li, ol li {margin:10px 0;}
.bulleted {list-style-type:disc;}
.numbered {list-style-type:decimal;}
.linear-list {overflow:hidden;}
.linear-list li {float:left; padding:0 6px;}
.linear-list li:first-child {padding-left:0;}


.menu ul, .menu li {margin: 0; border: 0;}
.menu li a {font-size:13px; line-height:25px; margin-top:5px; color: #bfbfbf; display: block; padding: 0 20px; position: relative;}
.menu li:hover a {color:#f1f1f2; text-decoration:none;}
.menu .sign-up {margin-left:10px;}

footer p {font-size:13px; color:#747578;}
footer h4 {font-size:13px; color:#f1f1f2; letter-spacing:0;}
#footer-inner {margin:0 0 60px 290px;}
footer .linear-list li {background:url(/img/bullet-footer.png) left 7px no-repeat; padding-left:9px; font-size:13px; margin-top:7px;}
footer .linear-list li:first-child {background:none;}

@media screen and (max-width: 780px) {
	footer {background-image:none;}
	#footer-inner {margin-left:0;}
	#footer-inner .span4:first-child {margin-left:2.127659574%;}
}


/*Tables --------------------------------------------------*/
table {width:100%; margin-bottom:1.4em; border-collapse:separate; border:0;}
th {font-weight:bold; font-size:110%; color:#f1f1f2; background-color:#008bc0; height:29px; text-transform:capitalize; padding:0 10px; vertical-align:middle;}
thead tr, tfoot tr {background:none transparent !important;}
thead th {border-left:1px solid transparent;}
thead th:first-child {border-left:none;}
th:last-of-type, td:last-of-type {border-right:0}
td {color:#4f4f4f; border-bottom:1px solid #bfbfbf; font-size:12px; padding:9px 10px; vertical-align:top;}
tfoot td {font-style:italic;}
caption {margin:0 0 -3px 0; padding:6px 10px; color:#333; font-size:16px; border-bottom:1px solid #aaa; text-transform:capitalize;}
/*tr:nth-child(odd) {background:#eee;}
tr:nth-child(even) {background:#fff;}*/
tr:last-child td {border-bottom:none;}
/*tr:hover {background:#e2f4fe !important; color:#333;}*/
table.vertical-table {border-top:1px solid #e4e4e4;}
.vertical-table caption {color:#f1f1f2; background-color:#008BC0; margin-bottom:0;}
.vertical-table th {border-top:none; border-bottom:1px solid #bfbfbf; background-color:#ddd; color:#4f4f4f;}
.vertical-table tr:last-child td {border-bottom:1px solid #bfbfbf !important;}



/*Buttons --------------------------------------------------*/
.btn, form input[type="submit"] {display:inline-block; padding:4px 10px 4px; font-size:13px; line-height:18px; color:#333333; text-align:center; background-color:#fafafa; background-image:-webkit-gradient(linear, 0 0, 0 100%, from(#222222), color-stop(25%, #222222), to(#171717)); background-image:-webkit-linear-gradient(#222222, #222222 25%, #171717); background-image:-moz-linear-gradient(top, #222222, #222222 25%, #171717); background-image:-ms-linear-gradient(#222222, #222222 25%, #171717); background-image:-o-linear-gradient(#222222, #222222 25%, #171717); background-image:linear-gradient(#222222, #222222 25%, #171717); background-repeat:no-repeat; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#222222', endColorstr='#171717', GradientType=0); border:1px solid #000000; border-bottom-color:#000000; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; -webkit-box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); -moz-box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); cursor:pointer; *margin-left:.3em; font-weight:normal;}
.btn:hover {color:#333333; text-decoration:none; background-color:#171717; background-position:0 -15px; -webkit-transition:background-position 0.1s linear; -moz-transition:background-position 0.1s linear; -ms-transition:background-position 0.1s linear; -o-transition:background-position 0.1s linear; transition:background-position 0.1s linear;}
.btn:focus {outline:thin dotted; outline:5px auto -webkit-focus-ring-color; outline-offset:-2px;}


/*Mix-Ins
-------------------------------------------------------------- */
.hide, .hidden {display:none !important;}
.clear {clear:both;}
.clear-right {clear:right;}
.clear-left {clear:left;}
.pull-left {float:left !important;}
.pull-right {float:right !important;}
.alignr {text-align:right;}
.alignl {text-align:left;}
.alignc {text-align:center;}
.above-below15 {margin-top:15px !important; margin-bottom:15px !important;}
.above0 {margin-top:0 !important;}
.above30 {margin-top:30px !important;}
.below30 {margin-bottom:30px !important;}
.below0 {margin-bottom:0 !important;}
.overflow {overflow:visible;}
.imgrpl {display:block; text-indent:-9999em; overflow:hidden;}
.inline {display:inline-block !important;}
.small-meta {font-size:11px; font-weight:normal; color:#999; color:rgba(255, 255, 255, .3); font-style:italic;}
.nomargin {margin:0 !important;}
.panel-block {padding:20px; background-color:#fefefe;}

/* Borders */ 
.no-border {border:0 !important;}
.border {border:1px solid #ccc;}
.border-bottom {display:block; padding-bottom:8px; border-bottom:1px solid #cdcdce;}

/* Rounding */
.rounded, .rounded4 {-moz-border-radius:4px; -webkit-border-radius:4px; -o-border-radius:4px; border-radius:4px; -webkit-background-clip: padding-box;
  -moz-background-clip:    padding;
  background-clip:         padding-box;}
.rounded8 {-moz-border-radius:8px; -webkit-border-radius:8px; -o-border-radius:8px; border-radius:8px;}




p, h1, h2, h3, h4, h5, h6, td, th, li {color:rgba(255, 255, 255, .6);}
#content {background: #171717 url(https://mandrillapp.com/img/faux-col.png) top left repeat;}
#content {background: #171717;}
thead th {background-color:transparent; color:rgba(255, 255, 255, .6); border-left:none;}
th {border-bottom:1px solid rgba(255, 255, 255, .2); font-size:16px; font-weight:normal;}
td {color:rgba(255, 255, 255, .6); border-color:rgba(255, 255, 255, .2); font-size:16px;}
#content {padding:50px 20px 100px 20px;}
#map {margin:30px 0 70px 0; position:relative;}
#map img {width:100%;}
.status {display:block; height:15px; width:15px; border-radius:15px; background-color:#008000;}
.minor {background-color:#ff9d1e;}
.major {background-color:#ed0023;}
.marker {position:absolute; height:0px; width:0px; overflow:visible;}
.marker-westus {top:38.2%; left:14.5%;}
.marker-eastus {top:43.5%; left:25.9%;}
.marker-ireland {top:31.9%; left:46%;}
.marker-singapore {top:65.3%; left:76.7%;}
.marker-tokyo {top:45.5%; left:86.6%;}
.marker-sydney {top:86%; left:90%;}
.marker-saopaulo {top:79.4%; left:35%;}
#map .status {position:absolute; top:-20px; left:-20px; display:block; height:20px; width:20px; background-color:#008000; box-shadow: 0 0 0 10px rgba(1, 132, 63, .3);}
#map .status.minor {background-color:#ff9d1e; box-shadow: 0 0 0 10px rgba(255, 157, 30, .3);}
#map .status.major {background-color:#ed0023; box-shadow: 0 0 0 10px rgba(238, 0, 36, .3);}
#map .status:hover {cursor:pointer;}
.stat-block {text-align:center; margin-bottom:30px;}
.mandrill-stats .stat-block {background-color:rgba(255, 255, 255, .05); border-radius:5px; padding:10px;}
.mandrill-stats .stat-block p {margin-bottom:0;}
.mandrill-stats .label {font-size:16px;}
.mandrill-stats .stat {font-size:30px;}
h3 {font-size:24px; letter-spacing:0; margin-bottom:30px; font-weight:normal; border-bottom:1px solid rgba(255, 255, 255, .2);}
h2.region-title {font-weight:normal; letter-spacing:0;}
h2.region-title .status {height:20px; width:20px;}
.last-updated {margin-left:38px;}
.graph-block {height:200px; background-color:rgba(255, 255, 255, .05); border-radius:5px; text-align:left; padding:10px;}
.graph-block {width:31.914893614%;float:left; margin-left:2.127659574%;}
.graph-block:nth-child(3n+1) {margin-left:0;}
@media screen and (max-width: 1260px) {
	.graph-block {width:48.93617020799999%;}
	.graph-block:nth-child(3n+1) {margin-left:2.127659574%;}
	.graph-block:nth-child(odd) {margin-left:0;}
}

@media screen and (max-width: 630px) {
	.graph-block {width:99.99999998999999%; margin-left:0;}
	.graph-block:nth-child(3n+1) {margin-left:0;}
}

@media screen and (max-width: 960px) {
	.main-content.span8 {width:99.99999998999999%;}
	.side-content.span4 {width:99.99999998999999%; margin-left:0;}
}
@media screen and (max-width: 1450px) {
	.mandrill-stats .span2 {width:31.914893614%;}
	.mandrill-stats .span2:nth-child(3n+1) {margin-left:0%;}
}
@media screen and (max-width: 480px) {
	.mandrill-stats .span2 {width:48.93617020799999%;}
	.mandrill-stats .span2:nth-child(3n+1) {margin-left:2.127659574%;}
	.mandrill-stats .span2:nth-child(odd) {margin-left:0%;}
	#map {margin:0 0 30px 0;}
}

.twitter-link {background:url(/img/twitter-16.png) left -1px no-repeat; padding-left:20px; font-size:13px;}
#timeline {background:url(/img/timeline-bg.png) 15px top repeat-y;}
#timeline ul {margin-bottom:50px;}
#timeline .date {background-color:#171717; padding:7px 15px; margin-bottom:15px; display:inline-block; border-radius:20px; background-color:#2a2a2a;}
#timeline .description {padding-left:35px;}
.description h4 {font-size:16px; font-weight:normal; letter-spacing:0; margin:0 0 0 -29px;}
.description h4 .status {display:inline-block; border:3px solid #2a2a2a; height:21px; width:21px; position:relative; top:4px; margin-right:3px;}
.description p {font-size:12px;}
.description p.small-meta {margin-bottom:5px;}
.status-update {margin-bottom:25px;}

/* status messages page */
#status-messages {margin:0 auto; max-width:600px;}

#status-filter li {color:#6e6e6f; color:rgba(241, 241, 242, .6); font-size:13px; margin-right:5px;}
#status-filter li a {color:#6e6e6f; color:rgba(241, 241, 242, .6); padding:3px 10px; border-radius:20px;}
#status-filter li a.selected, #status-filter li a:hover {background-color:#2a2a2a; text-decoration:none;}
#status-filter .status {display:inline-block; height:12px; width:12px; margin-right:2px; position:relative; top:1px;}