/*** General layout ***/


/* Page background */
body {
 background-color: white;
 color: black;
}

@media screen {

	/* Main container for everything else */
	.body {
	 position: relative;
	 padding-left: 3em;
	}

	/* Main body area, lowest box */
	.main {
	 padding-left:   9em;
	 padding-right:  0.5em;
	 padding-bottom: 0.5em;
	 padding-top:    1em;

	 border-style: solid;
	 border-width: 1px;
	 border-color: black;

	 color: black;
	 background-color: #f2f0ca;
	 background-image: url(background/lightyellow2.jpg);

	 min-height: 23em;  /* Space for the menu */
	}
}

/* End floating elements the elegant (hackish) way,
 * http://www.positioniseverything.net/easyclearing.html */
.main:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

/* Hides from IE-mac \*/
* html .main {height: 1%;}
.main {display: block;}
/* End hide from IE-mac */


.widemain {
 padding-left:   0.5em;
 padding-right:  0.5em;
 padding-bottom: 0.5em;
 padding-top:    1em;

 border-style: solid;
 border-width: 1px;
 border-color: black;

 color: black;
 background-color: #f9f7d5;
 background-image: url(background/lightyellow2.jpg);

 min-height: 23em;  /* Space for the menu */
}



/* Email & url footer */
@media screen {
	#footer {
	 padding: 0.1em 0.5em;
	
	 border-style: none solid solid solid;
	 border-width: 1px;
	 border-color: black;
	
	 background-color: #dddddd;
	 color: #606060;
	 background-image: url(background/lightgray.jpg);
	}
}
@media print {
	#footer {
	 font-size: smaller;
	 padding: 0.1em 0.5em;
	 color: #606060;
	}
}
#footer p {
 margin: 0 0;
}
#footer .email {
 padding: 0 0.5em;
}
#footer .url {
 float:right;
 text-align: right;
}
#footer a {
 color: #606060;
 text-decoration: none;
}
#footer a:hover {
 background-color: #B0B0B0;
 color: white;
}


/* Validation links */
@media screen {
	#valid {
	 text-align: right;
	}
	#valid .img {
	 border: 0;
	 width: 88px;
	 height: 31px;
	}
	#valid a {
	 background-color: transparent;
	}
}
@media print {
	#valid {
	 display: none;
	}
}


/*** Text formatting ***/


h1 {
 text-align: center;
}

h2 {
 font-size: larger;
 font-weight: bold;
}

dt {
 margin-top: 0.5em;
}

.note {
 font-size: smaller;
 font-weight: normal;
}

.red {
 color: red;
}
a:link.red {
 color: #AA0000;
}
a:hover.red {
 color: white;
}

.email {
 font-style: italic;
}

.subheading {
 /* A small heading */
 font-size: larger;
 font-weight: bold;
}

.math {
 padding-left:  15%;
 font-style: italic;
}

.larp {
 font-style: oblique;
}

.invisible {
 display: none;
}

.center {
 text-align: center;
}
.left {
 text-align: left;
}
.right {
 text-align: right;
}

.floatleft {
 float: left;
 margin-right: 1em;
}

.floatright {
 float: right;
 margin-left: 1em;
}

.large dt {
 font-size: larger;
}



/*** Links ***/


a:link {
 text-decoration: none;
 color: blue;
}
a:active {
 text-decoration: none;
 color: red;
}
a:visited {
 text-decoration: none;
 color: blue;
}
a:hover {
 text-decoration: none;
 background-color: #c0c090;
 color: white;
}

a:hover.nobg {
 background-color: transparent;
}

/*** Image formatting ***/

.imgline {
 text-align: center;
 vertical-align: middle;
 font-size: larger;
 padding: 0.5em 0em;
}
.imgline img {
 vertical-align: middle;
}
.imgline span {
 padding: 0em 1em;
}



img {
 border: none;
}


/* Floating right container */
.rightimage {
 float: right;
 margin-left: 1.5em;
 margin-right: 0.5em;
 margin-top:   0.5em;
 margin-bottom: 0.5em;

 font-size: smaller;
 text-align: center;

 border-style: none;
}
.rightimage p {
 margin: 0.1em;
 font-size: smaller;
}

/* Floating right container */

.rightbox {
 float: right;
 margin-left: 1.5em;
 margin-right: 0.5em;
 margin-top:   0.5em;
 margin-bottom: 0.5em;

 padding: 1em 0.5em;

 font-size: smaller;
 text-align: center;

 background-image: url(background/lightgreen2.png);
 background-color: #bcecbf;
 border-style: dashed;
 border-color: #00c96b;
 border-width: 1px;
}
.rightbox p {
 margin: 0.1em;
 font-size: smaller;
}

/* Back-arrows */
@media screen {
	.backlink {
	 float: left;
	 position: relative;
	 margin-left: 1em;
	 margin-top: 2em;
	 font-size: smaller;
	 text-align: center;
	}
}
@media print {
	.backlink {
	 display: none;
	}
}


/*** Contact info table ***/

.contact {
 text-align: center;
}

.contact table {
 border-collapse: collapse;
 margin: 1em auto;
 text-align: left;
}

.contact th {
 border-right: solid 1px #A5BFD6;
 padding: 1em 2em;
 text-align: center;
}

.contact td {
 padding: 1em 2em;
}

.contact tr {
 border-top: solid 1px #A5BFD6;
}

.contact tr:first-child {
 border-top: none;
}






/***  MENU SYSTEM  ***/

@media screen {

	.menu {
	 position: absolute;
	 margin-top: 1.5em;
	 margin-left: -2em;
	 width: 9em;

	 border-style: solid;
	 border-width: 2px;
	 border-color: black;

	 background-color: #fcd3dd;
	 background-image: url(background/redpaper.jpg);

	 padding: 0.3em 0;
	 text-align: center;
	 line-height: 1.4em;
	}

	.submenu {
	 position: relative;
	 margin-left: 0em;
	 margin-right: 0em;
	 margin-top: 0.1em; 
	 margin-bottom: 0.1em;

	 border-style: dotted none;
	 border-width: 1px;
	 border-color: gray;

	 background-color: #ddd3fc;
	 background-image: url(background/bluepaper1.jpg);

	 padding: 0.05em 0;
	
	 line-height: 1.1em;
	}

	/* Submenu for software */
	#subsoftware {
	 background-position: 0 -6.9em;
	}
	#sublarppaus {
	 background-position: 0 -13.6em;
	}

	/* Title in the menu */
	.menu p {
	 margin: 0.5em 0;
	 font-size: smaller;
	 font-style: italic;
	 text-decoration: underline;
	 font-weight: bold;
	}

	/* Differences in menu and submenu appearance: */
	.menu a {
	 display: block;
	 font-size: larger;
	 margin: 0.15em 0;
	}
	.submenu a {
	 font-size: 100%;
	}	

	.menu a:hover {
	 text-decoration: none;
	 background-color: #e3b3bf;
	 color: white;
	}
	.submenu a:hover {
	 text-decoration: none;
	 background-color: #bfb3e3;
	 color: white;
	}

	a.thispage {
	 font-weight: bold;
	 color: #0000C0;
	}
}

@media print {
	.menu {
	 text-align: center;
	}

	.submenu {
	 font-size: smaller;
	}
	.submenu:before {
	 content: "[";
	}
	.submenu:after {
	 content: "]";
	}

	/* Title in the menu */
	.menu p {
	 display: inline;
	 visibility: hidden;
	 margin-left: 0.1em;
	 margin-right: -4.4em;
	}

	.menu p:before {
	 display: inline;
	 visibility: visible;
	 content: "|";
	}

	/* Differences in menu and submenu appearance: */
	.menu a {
	 font-size: smaller;
	}
	.submenu a {
	 font-size: smaller;
	}	

	.menu a:hover {
	 text-decoration: none;
	 background-color: #e3b3bf;
	 color: white;
	}
	.submenu a:hover {
	 text-decoration: none;
	 background-color: #bfb3e3;
	 color: white;
	}

	a.thispage {
	 font-weight: bold;
	 color: #0000C0;
	}
}