/* Solid border */
hr.solid {
  border-top: 3px solid #bbb;
  border-color: Gainsboro;
}

/* OSD-Logo sizing and aligning  */
img.logo {
  display:flex;
  max-height:60px;
  padding-left: 5%;
}

div.headerBanner {
	margin-bottom: 10px;
	flex-direction: row;
	height: 5%;
	display: flex;
	width: 100%;
	min-height: fit-content;
	background-color: #e8e8e8;
}

div.leftContent{
	padding: 5px;
	width: 33%;
	float:left;
}

/* centers the content of a div */
div.centerContent {
  width: 33%;
  margin:auto;
  text-align: center;
}

div.rightContent {
	width: 33%;
}

/* bigger font size and weight for the title*/
label.title {
	color:#70ad9d;
	font-size: 30px;
	font-weight: bold;
	font-family: CraftviewRaleway;
}



/* Applies CraftviewRaleway font to texts */
.CraftviewRaleway {
	font-family: CraftviewRaleway;
}

/*Custom font--*/
@font-face {
    font-family: 'CraftviewRaleway'; 
    src: url('raleway-v28-latin-regular.woff');
}

/* Applies CraftviewRaleway to texts */
label.lableStyle {
	font-family: CraftviewRaleway;
	font-weight: bold;
}

/* few Styles for the table */
table {
	width: 90%;
	margin: 0 auto;
}

/* style of a column */
td {
	text-align: left;
	width: 300px;
}



a.buttonStyle {
    color: white;
    font-size: 20px; /* or the font size you need */
    background: #70ad9d;
    height: 35px; /* or the height you need */
    width: 100%;
    font-family: CraftviewRaleway;
    border-radius: 5px;
    margin-bottom: 5px;
    border: 1px solid black; /* small black border */
    text-decoration: none;
    display: inline-block;
    text-align: center;
    padding: 8px 12px; /* or the padding you need */
    box-sizing: border-box;
    line-height: normal; /* or the line height you need */
    outline: none;
}



/* Hover Style for the Button */
button:hover, a.buttonStyle:hover {
	background: #609486;
}

/* Focused e.g. clicked Style for the Button */
button:focus, a.buttonStyle:focus {
	border-width: thick;
	border-color: #90DEC9;
}

div.splashtext {
	font-size: 14px;
	color: black;
	line-height:1.5;
}

div.infotext {
	font-size: 12px;
	color: gray;
}
	
@media all and (orientation:landscape){

	
/* Styles the Colors,borders and fonts of a button */
button, a.buttonStyle {
	font-size: 16px;
	color: white;
	background: #70ad9d;
	height: 2.25em;
	width: 100%;
	font-family: CraftviewRaleway;
	border-radius: 5px;
	margin-bottom: 5px;
	border-width: thin;
}

/* style for the inputs, which we use mainly for the height */
input {
	height: 2em;
	width: 97%;
}

	/* solid Border around a div */
div.solidBorder {
	font-family: CraftviewRaleway;
	border:1px solid black;
	margin: auto;
	width: 25%;
	padding:10px;
	border-color: Gainsboro;
	border-radius: 15px;
	border-width: thick;
	text-align: center;
  }

  /* styles the text small and grey */
p.registrationSmall {
	font-size: 12px;
	font-weight: thin;
	color: gray;
	font-family: CraftviewRaleway;
}

}

@media all and (orientation:portrait){

	
/* Styles the Colors,borders and fonts of a button */
button, a.buttonStyle {
	color: white;
	font-size: 20px;
	background: #70ad9d;
	height: 35px;
	width: 100%;
	font-family: CraftviewRaleway;
	border-radius: 5px;
	margin-bottom: 5px;
	border-width: thin;
}

	/* style for the inputs, which we use mainly for the height */
input {
	border-width: 1px;
	font-size: 22px;
	height: 35px;
	width: 97%;
}

	/* solid Border around a div */
div.solidBorder {
	font-size: 25px!important;
	font-family: CraftviewRaleway;
	border:1px solid black;
	margin: auto;
	width: 50%;
	height: fit-content;
	padding:10px;
	border-color: Gainsboro;
	border-radius: 15px;
	border-width: thick;
	text-align: center;
  }

  /* styles the text small and grey */
p.registrationSmall {
	font-size: 16px;
	font-weight: thin;
	color: gray;
	font-family: CraftviewRaleway;
}

}