/* Remove the navbar's default margin-bottom and rounded borders */ 

    .navbar {

      margin-bottom: 0;

      border-radius: 0;

    }

    .navbar-brand-op {
	position: fixed;
	margin-left: 82%;
	margin-top: 15.2%;
	float: right;

    }

    

    /* Set height of the grid so .sidenav can be 100% (adjust as needed) */

    .row.content {height: 450px}

    

    /* Set gray background color and 100% height */

    .sidenav {

      padding-top: 20px;

      background-color: #f1f1f1;

      height: 100%;

    }

    

    /* Set black background color, white text and some padding */

    footer {

      background-color: #555;

      color: white;

      padding: 15px;
    }


    /* On small screens, set height to 'auto' for sidenav and grid */

    @media screen and (max-width: 767px) {

      .sidenav {

        height: auto;

        padding: 15px;

      }

      .row.content {height:auto;}

	  img.bild {

		height: 25px;

	  }

	  div#myNavbar {

		border: none;

	  }

	  img.talk {

		width: 100%;

		height: auto;

	  }

	  .footer p.foottext {

		text-align: center;

	  }
    }

	

	@media screen and (min-width: 768px) {

      nav.navbar-inverse {

		margin-left: 20%;

		height: 108px;

	  }

	  div#myNavbar {

		margin-left: 225px;

		margin-top: 57px;

	  }

	  img.bild {

		height: 75px;

	  }

	  img.talk {

		width: 70%;

		height: auto;

	  }

	  p.termin {

		margin-left: 275px;
		font-weight: bold;

	  }

	  .footer p.foottext {

		margin-left: 397px;

	  }
	  
	  	  .col-sm-6 {
		margin-top: 20px;
	  }


    }

	

	.footer {

    position: fixed;

    left: 0;

    bottom: 0;

    width: 100%;

    background-color: #666666;

    color: white;

    text-align: left;

	height: 45px;

	}

	.footer p {

	position: relative;

	top: 50%;

	-webkit-transform: translateY(-50%);

	-ms-transform: translateY(-50%);

	transform: translateY(-50%);
	
	font-size: 11px;

	}

	

	nav.navbar-inverse {

		background-color: white;

		border: none;

	}

	

	.navbar-inverse .navbar-nav > li > a {

		color: #666666;
		font-size: 12px;

	}

	

	.navbar-inverse .navbar-nav > li > a:hover {

		color: black;

	}

	

	#no > span {

				cursor: pointer;

				font-size: 2em;

				opacity: 0.4;

				transition: opacity 0.3s ease-in-out;

				width:50px;

			}



			#yes > span {

				cursor: pointer;

				font-size: 2em;

				opacity: 0.4;

				transition: opacity 0.3s ease-in-out;

			}



			#back > span {

				cursor: pointer;

				font-size: 2em;

				opacity: 0.4;

				transition: opacity 0.3s ease-in-out;

			}



			#backs > span {

				cursor: pointer;

				font-size: 2em;

				opacity: 0.4;

				transition: opacity 0.3s ease-in-out;

			}



			#back {

				float: left;
				margin-left: 35px;
				margin-top: 15px;

			}



			#no {

				float: left;

				margin-top: 15px;

			}



			#yes {

				float: left;

				margin-right: 15px;

				margin-top: 15px;

			}



			#next {

				padding-bottom: 10px;

			}



			#next > span{

				cursor: pointer;

				font-size: 2em;

				opacity: 0.4;

				transition: opacity 0.3s ease-in-out;

				padding-left: 15px;

			}
			
			#next_start {

				margin-top: 35px;

			}



			#next_start > span{

				cursor: pointer;

				margin-top: 10px;
				transition: opacity 0.3s ease-in-out;
				background-color: red;
				
				padding: 10px;

			}



			#yes:hover > span{

				opacity: 0.9;

				color: green;

			}



			#no:hover > span{

				opacity: 0.9;

				color: red;

			}



			#next:hover > span{

				opacity: 0.9;

			}
			
			#next_start:hover > span{

				color: white;

			}



			#back:hover > span{

				opacity: 0.9;

			}



			#backs:hover > span{

				opacity: 0.9;

			}

			

			input {

				width: 32.9%;

			}

			

			input {

				background: none;

				border: 1px solid #666666;;

				padding: 5px;

			}

			

			input[type=submit]:hover {

				background: #666666;

				color: white;

			}

			

			@media only screen and (max-width: 576px) {

				input {

					width: 100%;

					margin-bottom: 10px;

				}

			}

			

			textarea {

				width: 100%;

				background: none;

				border: 1px solid #666666;;

				padding: 5px;

			}

		

		div.sidenav {

			background-color: white;

		}

	.jahre    {
		padding: 0;
		margin-top: -50px;
		margin-left: 50%;
		align: center;
	}

@media (prefers-color-scheme: dark) {

body, .col-sm-4.sidenav, .col-sm-1.sidenav, .container-fluid, .formfield, button, select, .navbar.navbar-inverse {
	background-color: black;
}

.tox-menubar, .tox-mbtn.tox-mbtn--select:hover, .tox-mbtn.tox-mbtn--select:focus, .tox-mbtn.tox-mbtn--select:active, .tox-statusbar, .tox-toolbar__primary, .tox-tbtn:focus, .tox-tbtn:hover {
	background-color: black !important;
}

.col-sm-6.text-left {
	background-color: none;
}

.tox-toolbar__primary {
	background: none;
}

div[style="position: fixed; margin-top: -2.4%; margin-left: 5%; height: auto; width: auto; background-color: white; z-index: 10000; padding: 5px; border-radius: 3px;"] {
	background-color: black !important;
}

.container-fluid, table {
	border-color: black !important;  
}

.footer {
	background-color: #303030;
}

input, .tox-statusbar__path-item, .formfield, h1, h2, h3, h4, h5, h6, ol, li, button, select, td, #text, div[style="display: inline; margin: 0; font-size: 90%;"], div[style="font-size: 90%;"] {
	color: #c0c0c0 !important;
}

p, span {
	color: #c0c0c0;
}

a {
        color: #72BCD4 !important;
        text-decoration: none;
    }

a:hover {
        color: #86C5DA !important;
        text-decoration: !important;
}

svg {
	fill: white !important;
}

}