@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');
@import url('https://fonts.googleapis.com/css?family=Heebo&display=swap');
@import url('https://fonts.googleapis.com/css?family=Roboto&display=swap');
@import url('https://fonts.googleapis.com/css?family=Muli&display=swap');
@import url('https://fonts.googleapis.com/css?family=Quicksand&display=swap');
@import url('https://fonts.googleapis.com/css?family=Bebas+Neu&display=swap');
@import url('https://fonts.googleapis.com/css?family=Kalam&display=swap');
@import url('https://fonts.googleapis.com/css?family=Old+Standard+TT:wght@700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Poppins&display=swap');
body
 {
    line-height: 1;
    margin: 0; padding: 0;
    font-family: sans-serif;    
}

.title
{    
    font-family: sans-serif;
    font-weight: 500;    
    line-height: 120%;
    font-size: 3.0rem;
    color: #fff;
}

h1
{    
    font-family: sans-serif;
    font-weight: 500;    
    line-height: 120%;
    font-size: 3.0rem;
    color: #444;
}

h2
{    
    font-family: sans-serif;
    font-weight: 300;    
    line-height: 100%;
    font-size: 2.0rem;
    color: #444;
}

.membersform
{
    margin: auto;
    padding:24px;
}



TH
{
    background-color:#ff6500;
    color: #fff;
    padding:2px;
    font-size: 12px;
    
}
TABLE
{
 
    width: 100%;
    border: 0px;
    margin: 0;
    /*background-color: #dddddd; */
}

figure
{
 
    width: 100%;
    border: 0px;
    margin: 0;
    /*background-color: #dddddd; */
}


.field
{
    margin: 24px;
}

.display 
{
    margin: auto;
    max-width: 640px;
    padding: 0px 10px 18px 10px;
    border: 0;
   /* border: 1px solid #00FF00;    */
}

.form
{
    margin: auto;
    padding:24px;
    font-size: 1.4em;
    line-height: 200%;
}

.page__container 
{
    margin: auto;    
    width: 80%;    
    padding: 0px 10px 18px 10px;
    
   /* border: 1px solid #00FF00;    */
}
.page__container::after 
{
    clear: both;
    content: "";
    display: table
}

@media (max-width: 900px) 
{    .page__container 
    {
        padding: 0px 20px 20px 20px; 
    }
      .form
    {
  
        font-size: 1.2em;
        line-height: 2.0em;
        width: 80%;
        padding: 0px 45px 45px 45px; 
    }
  
}


@media (min-width: 900px) 
{    .page__container 
    {
        padding: 0px 25px 25px 25px; 
    }
    .form
    {
          
     
        font-size: 1.2em;
        line-height: 2.0em;
        width: 90%;
        /*padding: 0px 20px 20px 20px; */
    }
  
}


@media (min-width: 1024px) 
{
    .page__container 
    {
        padding: 0px 90px 45px 90px;
    }
      .form
    {
        width: 80%;
        padding: 0px 45px 45px 45px; 
    }
}

.container 
{
    margin: auto;
    max-width: 960px;
    padding: 0px 10px 18px 10px;
    border: 0;
   /* border: 1px solid #00FF00;    */
}

.header
{
    margin: auto;
    padding: auto;
    border: 0;
    text-align:left;
}

.menu 
{
    margin: auto;
    padding: auto;
    border: 0;
    display: table;
    display: inline-block;
   /* border: 1px solid #00FF00;    */
}
.item 
{
    margin: auto;    
    padding: auto;
    border: 0;
    display: inline-block;
    /*border: 1px solid #00FF00;*/
}

.logo
{
	width: 200px;
    height: 100px;
	text-align:center;
    /*background-color: #fff;*/
}
.grid
{
    margin: auto;
    width: 100%;
    padding: 0px;
    /*border: 1px solid #00FF00;*/
    background-color: #ffffff;   
    display: table;
    /*margin: 36px 0 36px 0;*/
    /*padding-bottom: 20px;
    padding-top: 20px;*/ 
}
.grid.mini
{
    margin: auto;
    width: 100%;
    padding: 0px;
    /*border: 1px solid #00FF00;*/
    background-color: #ffffff;   
    display: table;
    /*margin: 36px 0 36px 0;*/
    /*padding-bottom: 20px;
    padding-top: 20px;*/ 
}

.info
{ 
    width: 100px;
    display:table-cell;
    margin:auto;
    padding: 16px;
    border: 0;
    text-align:left;
    background-color: #f4f4f4;
}

.left 
{
 
    width: 200px;
    display:table-cell;
     vertical-align: TOP;
    margin:auto;
    padding: 16px;
    border: 0;
    text-align:center;
    /*border: 1px solid #00FF00;*/
    background-color: #2c2c2c;
}
.center 
{  
    display:table-cell;
    padding: 24px;
    margin: auto;
    border: 0;
    text-align: left;
    /*border: 1px solid #00FF00;*/
}

.linkbutton
{
	border-radius: 5px;
    background-color: #8CC63E;
	/*box-shadow: inset 0px 2px 8px #888888;*/
    border: 1px solid #ffffff;
    color: white; 
	padding: 12px 20px;
	margin:0 auto;
	margin-top:16px;
    display: inline-block;
	font-size: 10pt;
	min-width: 120px;
	text-align: center;
	cursor: pointer;	
	   -webkit-transition: background-color 0.5s; /* Safari */
    transition: background-color 0.5s;
}
A.linkbutton
{
    background-color: #04AEDA;    
	 text-decoration:none;
}

A.linkbutton:hover
{
   background-color: #ABABAB;   
	text-decoration:none; 
	color: white;
}
.linkbutton.blue
{
    background-color:#04AEDA;
}

.linkbutton.orange
{
    background-color:#ff6500;
}

.linkbutton.confirm
{
    background-color:#ff6500;
    width: 100%;
}

.orangeblock
{
    background-color:#ff6500;
    color:#fff;
    border-radius: 5px;
    padding: 6px ;
}

.orange
{
    background-color:#ff6500;
    color:#fff;
}
.orange.block
{
    padding: 2.0em;
}
.orange.subtitle
{
    background-color:#000;
    color:#ff6500;
    padding: 20px;
    text-align: center;
    font-size: 2.0rem; 
}
.orange.data
{
    background-color:#ff6500;
    color:#FFF;
    padding: 20px;
    text-align: center;
    font-size: 1.6rem; 
}
.orange.event
{
    background-color:#444;
    color:#FFF;
    padding: 20px;
    text-align: left;
    font-size: 1.6rem; 
}



.orangetitle
{
     
    font-family: "Heebo",sans-serif;
    font-weight: 600;    
    line-height: 120%;
    font-size: 3.0rem; 
    margin: 20px;
    text-align: center;
    color:#fff;
}





.polledescription
{
    background-color:#777777;
    color:#141414;
    border-radius: 5px;
    padding: 20px;
    width: 60%;
}

.polltext
{
    color:#141414;    
    border-radius: 5px;
    font-size: 0.8em;
    font-weight: 300;
    line-height: 20px;    
}

.polldescription
{
 
    /*margin-left: 20px;*/
    display: flex;
    font-size: 0.8em;
    margin: auto;
    line-height: 1.2em;
    /*float: right;*/
}

.pollimage
{
    display: flex;
    /*float: left;*/
    width: 200px;
    margin-left: 0px;
    margin: 10px;
}

.polloption
{
    /*background-color:#cccccc;*/
     display: block;
    color:#141414;
    border-radius: 5px;
    padding: 20px;
    width: auto;
    margin: 10px;
    border: 1px solid #cccccc;
}

/* The container */
.radiocontainer 
{
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.radiocontainer input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
color: #fff;
  background-color: #ff6500;
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.radiocontainer:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.radiocontainer input:checked ~ .checkmark {
  background-color: #ff6500;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.radiocontainer input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.radiocontainer .checkmark:after {
 	top: 9px;
	left: 9px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white;
}


.savebutton
{
   	border-radius: 5px;
    background-color: #8CC63E;
	/*box-shadow: inset 0px 2px 8px #888888;*/
    border: 1px solid #ffffff;
    color: white; 
	padding: 8px 8px;
	margin:0 auto;
    display: inline-block;
	font-size: 10pt;
	text-align: center;
	cursor: pointer;	
	   -webkit-transition: background-color 0.5s; /* Safari */
    transition: background-color 0.5s;
}


.linkbutton.green
{
    background-color:#8CC63E;
}



input {
  border: 1px solid #ccc;
  background-color: #fff;
  padding: 3px 5px;
  width: 100%;
    height: 40px;
}

input.date 
{
  border: 1px solid #c4c4c4;
  background-color: #fff;
  padding: 3px 5px;
  width: 120px;
}
input.date.green
{

  color: green;
}



.note
{
    float: right;
    width: 100%;
    font: 14px Arial, Helvetica, sans-serif;
    color: #121212;
    border: 1px solid #257C9E;

}