﻿/* Language/market specific rules */
html[market="ja-jp"] body
{
	font-family:'YuGothic UI';
}
body
{
    background-color:#FFFFFF;
    font-family:'Segoe UI';
    font-size:16px;
    max-width:900px;
    line-height:22px;
    margin:18px;
}
/* <720 */
@media (max-width: 719px)
{
    body
    {
        margin:10px;
    }
}
p,h1,h2,h3,h4,h5,h6
{
    margin-left:8px;
    margin-right:8px;
    margin-bottom:17px;
}
h1,h2,h3,h4,h5,h6
{
    margin-top:35px;
    font-weight:500;
}
h1
{
    font-size:36px;
}

h2
{
    font-size:24px;
}

h3
{
    font-size:22px;
}

h4
{
    font-size:19px;
}

h5
{
    font-size:16px;
}

h6
{
    font-size:14px;
}
p
{
    margin-top:17px;
}
img
{
    border:none;
    max-width:100%;
    height:auto;
}
video
{
    width:100%;
}
span.glyph
{
    font-family: 'Segoe MDL2 Assets';
}

/* Alerts */
div.alert
{
    background-color:#E3E3E3;
    width:100%;
    max-width:480px;
    min-height:58px;
    margin-bottom:20px;
    padding-bottom:10px;
}
div.alert div.alert-icon
{
    height:28px;
    width:28px;
    padding:25px;
    font-family:'Segoe MDL2 Assets';
    font-size:28px;
    line-height:28px;
    color:#505050;
}        
div.alert div.alert-title
{
    margin-top:-53px;
    font-size:24px;
}
div.alert p
{
    margin-left:0px;
    margin-right:0px;
}
div.alert-note div.alert-icon::before
{
    content: "\E160";
}
div.alert-tip div.alert-icon::before
{
    content: "\EA80";
}
div.alert-warning div.alert-icon::before
{
    content: "\E98F";
}

/* Captions (generally used only for images) */
span.withCaption
{
	display:block;
}
span.caption
{
	display:block;
	font-size:13px;
	font-weight:400;
	text-align:left;
}

/* Tabled content */
table
{
    width:100%;
    table-layout:fixed;
    border-spacing:0px;
}
thead,
div.thead-delegate
{
    font-size:20px;
    font-weight:600;
}
table td
{
    padding-top:0px;
    padding-right: 5px;
    padding-bottom:0px;
    padding-left: 5px;
    vertical-align:top;
}
table td h2
{
    margin: 0px;
}
table td p
{
    margin-top:0px;
}
/* <730 */
@media (max-width: 729px)
{
    thead
    {
        display: none;
    }
    table td
    {
        display: block;
    }
}
/* 730+ */
@media (min-width: 730px)
{
    div.thead-delegate
    {
        display: none;
    }
}