/*
Styles for www.wiskundeopweg.nl
*/

body{
	background-color:#FDCD20;
	color:#2D4157;
	height:100%;
	width:100%;
	font-size:large;
}

h1{
	width:99%;
	text-align:center;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:125%;
	font-weight:bold;
	background-color:#FDCD20;
	color:#2D4157;
}

h2{
	width:99%;
	font-family:Verdana, Arial, Helvetica, sans-serif;              
	text-align:center;
	background-color:#2D4157;
	color:#FDCD20;   
}

h3{
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:125%;
	font-weight:bold;
	background-color:#FDCD20;
	color:#2D4157;
}

#mainbody{
	width: 83%;
	font:100%Verdana, Arial, Helvetica, sans-serif;
	font-size:large;
	float:right;
	padding:1px;
}

.alert {
	width:96%;
  padding: 20px;
  background-color: red;
  color: #FDCD20;
  margin-bottom: 15px;
}

#sidebar{
	font:100%Verdana,Arial, Helvetica, sans-serif;
	float:left;
	width:15%;
	position:sticky;
	bottom:0;
	background-color:#2D4157;
	color:grey;
	padding:5px;
}

#sidebar a {
  background-color: #FDCD20; /* Mellow Yellow */
  color: grey; /* Grey text color */
  display: block; /* Make the links appear below each other */
  padding: 12px; /* Add some padding */
  text-decoration: none; /* Remove underline from links */
}

#sidebar a:hover {
  background-color:red; /* Dark navy blue background on mouse-over */
}

.vertical-menu{
	text-align:center;
	font-size:large;
}

footer{
	width:99%;
	heigth:auto;
	position:sticky;
	bottom:0;
	overflow:auto;
	
	text-align:center;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:small;
	background-color:#2D4157;
	color:#FDCD20;
}

em{
	font-weight:bold;
	color:grey;
}
 
li{
	display: list-item;
}
      
a:link {color:grey;}                  
    
a:visited {color:red;}
                 
a:hover {text-decoration:#FDCD20; color:grey; background-color:red;}                  
                 
a:active {background-color:#2D4157;}

a[href^="tel:"]:before {
        content: "\260e";
        margin-right: 10px;
}

.figure{
	margin: 0 1% auto auto;
}

/* Panorama Picture */
#panoramapicture{
	background-image:url("AfbeeldingenW/Casper - rekenen.jpg");
	background-color:#2D4157;
	width:99%;
	background-position: center top;
	background-repeat:no-repeat;
	background-size:contain;
	overflow:auto;
}

/* Panoram Picture Text */
#panoramatext{
	width:auto;
	text-align:left;
	position:relative;
	top:0%;
	left:0%;
/*
	transform: translate(-50%, -50%);
*/
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color:#FDCD20;
	font-size:500%;
	font-weight:bold;
}