html,body{ 
    margin:0px; 
    width:100%;
    height:100%; 
    font-family:-apple-system-font,Helvetica Neue,Helvetica,sans-serif;
    font-size:12px;
    -webkit-touch-callout:none ;
    -webkit-user-drag:none;
     box-sizing:border-box;
    -moz-box-sizing:border-box; /* Firefox */
    -webkit-box-sizing:border-box; /* Safari */
} 
body[flex]
{
    display:-webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-wrap:nowrap;
    align-content:flex-start;
    flex-direction:column;
    align-items:flex-start;
}
div[flex]
{
    display:-webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-wrap:wrap;
    -webkit-flex-wrap:wrap;
    -webkit-box-lines:multiple;
    -moz-flex-wrap:wrap;
    flex-wrap:wrap;
    align-content:flex-start;
    align-items:flex-start;
}
div[center-v]
{
    align-items: center;
}
div[center-h]
{
    justify-content: center;
}
.flexnowrapcolumn
{
    align-content:flex-start;
    align-items:flex-start;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    flex-wrap:nowrap;
    flex-direction:column;
}
div[flexrow]
{
    flex-direction:row;
}
div[flexcolumn]
{
    flex-direction:column;
}
div[flex-nowrap]
{
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    flex-wrap:nowrap;
    -webkit-flex-wrap:nowrap;
    -webkit-box-lines:single;
    -moz-flex-wrap:nowrap;
    flex-wrap:nowrap;
}
body[flex-nowrap]
{
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    flex-wrap:nowrap;
    -webkit-flex-wrap:nowrap;
    -webkit-box-lines:single;
    -moz-flex-wrap:nowrap;
    flex-wrap:nowrap;
    flex-direction:column;
}