:root {
	--background: white;
	
	--border-color: rgba(213, 151, 39, .21);
	--border-width: 1px;
	--border-radius: 10px;
	--borderSize: var(--border-width);
	--border: var(--border-color) var(--border-width) solid;
	
	--title: rgb(238, 136, 0);
	--text-color: black;
	--textColor: var(--text-color);
	
	--shadow: 0px 0px 2px black;
}

@media (prefers-color-scheme: dark) {
	:root {
		--background: #243B42;
		/* --background: rgba(100, 100, 100, 0.5) url("/media/mip.png") no-repeat fixed center; */
		--text-color: white;
		--title: rgb(255, 153, 0);
	}
}

body {
	transition: all 250ms;
	margin: 0px;
	font-family: csbook;
}

* {
	box-sizing: border-box;
}

@font-face {
	font-family: logo;
	src: url(/fonts/logo.otf) format('opentype');
}

@font-face {
	font-family: csblack;
	src: url(/fonts/csblack.woff) format('woff');
}

@font-face {
	font-family: csheavy;
	src: url(/fonts/csheavy.woff) format('woff');
}

@font-face {
	font-family: csbook;
	src: url(/fonts/csbook.woff) format('woff');
}


body {
	background: var(--background);
	text-align: center;
	color: var(--text-color);
}

.limitWidth {
	width: 100%;
	min-width: 900px;
	max-width: 1000px;
	display: inline-block;
}

.box {
	background: none;
	border: var(--border);
	border-radius: var(--border-radius);
	margin: calc(var(--border-width) * -1);
	margin-right: 70px;
	text-align: left;
}

.rightbox .box {
	margin-right: -1px;
	margin-left: 70px;
	text-align: right;
}

.pad {
	padding: 30px;
}

#title-container {
	text-align: left;
	display: inline-block;
}

#title {
	font-family: logo, sans-serif;
	font-size: 150px;
	color: var(--title);
}

.limitWidth>.box {
	margin-right: 0px;
	margin-left: 0px;
}

.rightbox>.box {
	margin-right: -1px;
	margin-left: 0px;
}

#subtitle {
	font-family: csblack;
	font-size: 22pt;
	margin-bottom: 20px;
}

#title-about {
	font-family: csbook;
	font-size: 16pt;
}

#main,
#about,
#links,
#info,
#poweredby,
footer {
	border-bottom: var(--border);
	padding: 40px;
}

#about {
	font-family: csheavy;
	font-size: 15pt;
	/* background: black; */
}

#links-container {
	min-width: 700px;
	display: grid;
	justify-content: space-between;
	/* background: yellow; */
	grid-template: auto / repeat(3, 1fr);
}

a,
a:visited {
	color: var(--text-color);
	font-size: 14pt;
	text-decoration: none;
	font-family: csbook;
	/* text-shadow: 0px 0px 5px rgba(0,0,0, 0.9); */

	/* background: var(--border-color);
	border: var(--border);
	padding: 20px;
	border-radius: var(--border-radius); */
}

a:hover {
	/* text-decoration: underline; */
	font-family: csblack;
	/* text-shadow: 0px 0px 5px var(--text-color); */
}

#links span {
	border-right: var(--border);
}

#links span:last-child {
	/* border-left: var(--border); */
	border-right: none;
}

#info {
	font-family: csbook;
	font-style: italic;
	font-size: 16pt;
}

#types>div {
	padding-top: 40px;
	padding-bottom: 40px;
	display: inline-grid;
	grid-template: auto / repeat(3, 1fr);
	grid-gap: 40px;
	justify-content: center;
}

#types a {
	position: relative;
	display: inline-grid;
	grid-template: auto / auto;
	background: var(--border-color);
	border-radius: var(--border-radius);
	/* width: 250px; */
}

#types img {
	width: 100%;
	/* height: 100%; */
	/* border: var(--border); */
	/* opacity: 0.7; */
	box-shadow: var(--shadow);
	border-radius: var(--border-radius);
}

.type-title {
	z-index: 1;
	opacity: 1;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	font-family: csheavy;
	font-size: 25pt;
	color: white;
	padding: 25px;
	text-shadow: var(--shadow);
}

#types a:hover .type-title {
	/* color: white; */
}

#types a:hover img {
	opacity: 0.7;
	/* color: white; */
}


#poweredby {
	background: var(--border-color) url("/media/mip.png") no-repeat fixed center;
	background-size: cover;
	font-family: csheavy;
	font-size: 22pt;
	padding: 50px;
}

footer .limitWidth>div,
footer a {
	font-size: 10pt;
}

footer {
	background: var(--border-color);
}

footer .limitWidth>div {
	display: flex;
	justify-content: space-between;
	font-family: csbook;
}


/* REGISTRATION FORM */
.doctorRow {
   display: grid;
   grid-template: auto / 1fr 1fr 1fr auto;
   grid-column-gap: 10px;
}

.hspace {
   display: inline-block;
   height: 1px;
   /*    min-width: var(--twoTimesPadding);*/
   flex: 0 0 var(--twoTimesPadding);
}