﻿<style>

* {   
    box-sizing: border-box;
}

.row::after {
  content: "";
  clear: both;
  display: table;
}

[class*="col-"] {
  float: left;
  padding: 15px;
  /*border: 1px solid red;*/
}

html {
   font-family: "Arial", sans-serif;
}

.plist {
	margin-top: 0;
	margin-bottom: 0; 
	padding-left: 1em; 
	text-indent: -1em;
}

.header {
    padding: 15px;
    font-size: xx-large;
}

.subtitle {
    padding: 15px;
    font-size: x-large;
}

img { 
    max-width: 100%;
    height: auto;
}

.fullwidth {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}

a {
  color:black;
  font-weight:bold;
}

a:hover {
	color:#0000FF;
}

.spoff {
	display:none;
}

ol, ul {
	margin-top: 0;
	margin-bottom: 0;
}

.listleft {
	margin-top: 0;
	padding: 0;
	margin-left: 1em;
}
/* For mobile phones: */
    [class*="col-text-"] {width: 90%;}
    .col-menu {width: 15%; margin:0; padding:15px; font-size: large;}
    .col-list {width: 90%; background-color: #e9e9e9; margin-top: 10px; height:85px; box-shadow:0px 3px 3px grey; border-radius: 10px;}
	.col-orchlist {width: 90%; background-color: #e9e9e9; margin-top: 10px; height:100px; box-shadow:0px 3px 3px grey; border-radius: 10px;}
    .col-text-right {width: 90%; text-align: right;}

@media only screen and (min-width: 800px) {
/* For desktop: */
    .col-menu {width: 10%; margin:0; padding:15px; font-size: large;}
    .col-text-half {width: 45%;}
    .col-text-full {width: 90%;}
    .col-text-right {width: 45%; text-align:right; height: 50px;}
    .col-list {width: 30%; background-color: #e9e9e9; margin: 10px; height:85px; box-shadow:0px 3px 3px grey; border-radius: 10px;}
	.col-orchlist {width: 30%; background-color: #e9e9e9; margin: 10px; height:100px; box-shadow:0px 3px 3px grey; border-radius: 10px;}
}

</style>
}