body {font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: medium;}
html {box-sizing:border-box}*,*:before,*:after{box-sizing:inherit;} 
a:link    {color:#4472C4; text-decoration: underline}
a:visited {color:#A863A0; text-decoration: none}
a:hover   {color:#6699E5; text-decoration: underline; font-style:italic}
a:active  {color:#88AAE6; text-decoration: none}
h1 {font-size:150%; color:#4472C4; text-align:left}
h2 {font-size:180%; color:#000000; text-align:center}
h3 {font-size:120%; color:#000000; text-align:center}
h4 {font-size:110%; color:#000000; text-align:left  }
h5 {font-size:100%; color:#888888; text-align:center}
h6 {font-size:80% ; color:#333300; text-align:right }

.center{max-width: 1200px; width: 100% ; margin: auto; padding: 0px 20px 0px 20px;}  
.midden{text-align:center; margin: auto;}
ul.a {list-style-type: circle; padding: 0px 14px 0px 14px;}

.col_l{float:  left; width: 50%; text-align: left; padding: 10px 25px 10px 0;}
.col_r{float: right; width: 50%; text-align: left; padding: 10px 0 10px 25px;}
.col_lo{float: left; width: 50%; text-align: left; padding: 10px 25px 30px 0;}
.col_ro{float:right; width: 50%; text-align: left; padding: 10px 0 30px 25px;}
.col_5{float: left; width: 20%; text-align: center; padding: 5px;}

@media(max-width:  700px) {.col_l {width: 100%; padding: 10px 0 10px 0;}}
@media(max-width:  700px) {.col_r {width: 100%; padding: 10px 0 10px 0;}}
@media(max-width:  700px) {.col_lo {width: 100%; padding: 10px 0 10px 0;}}
@media(max-width:  700px) {.col_ro {width: 100%; padding: 10px 0 30px 0;}}
@media(max-width:  870px) {.col_5 {width: 100%;}}