
/***********************************************/
/* tbf_style.css - roland schaffer 2024        */
/***********************************************/
/*
 * gruen: #97c21c
 */

/***********************************************/
/* HTML tag styles                             */
/***********************************************/ 


/* padding: OBEN RECHTS UNTEN LINKS */

/*
 * ein paar farben
 */
:root {
    --sse:#97c21c; /* gruen */
    --sseDark:#163c00; /* dunkelgruen */
    --grey:#bbbbbb; 
}
/* hier zum kopieren :)
 
    color: var(--sseDark);
*/

/*
 *
 */



body{
	/* background-color:#88ff88;  */
	background-color:#eee;
	/* color: #97c21c; */
    color: var(--sseDark);
	line-height: 1.166;	
	margin: 0px;
	padding: 0px;
	font-family: sans-serif, Verdana, Arial, monospaced;
	font-size:12pt;
}

/*
* hinweis + errormessage
*/
.hinweis {
	color:#0a0a0a;
	text-decoration:none;
	text-transform:none;
	margin:5px;
        background-color:#dddddd;
}
.errormessage {
	color:yellow;
	text-decoration:none;
	text-transform:none;
	margin:5px;
        background-color:red;
}

.klein {
    font-size: x-small;
}

/*
 * zentrieren
 */
.center {
  display:block;
  margin-left:auto;
  margin-right:auto;
}

/* 
 * hauptmenue
 */

#mainmenu{
	border-bottom:1px solid #00549f;
}
.menu{
	color:#00549f;
	text-decoration:none;
	font-size:18px;
	text-transform:none;
	margin:5px;
 }

.menu:link{
	color:#00549f;
	text-decoration:none;
	font-size:18px;
	text-transform:none;
	margin:5px;
 }

.menu:visited {
	color:#00549f;
	text-decoration:none;
	font-size:18px;
	text-transform:none;
 }
.menu:hover {
	color:#00549f;
	/*font-weight:bold;*/
	background:lightgray;
	text-decoration:none;
	font-size:18px;
	text-transform:none;
	border:1px solid #00549f;
 }
.menuactive{
	color:#00549f;
	text-decoration:none;
	font-size:18px;
	font-weight:bold;
	text-transform:none;
	margin:5px;
	background:lightgray;
	border-bottom:1px solid #00549f;
 }

.menuactive:link{
	color:#00549f;
	text-decoration:none;
	font-size:18px;
	font-weight:bold;
	text-transform:none;
	margin:5px;
	background:lightgray;
	border-bottom:1px solid #00549f;
 }

.menuactive:visited {
	color:#00549f;
	text-decoration:none;
	font-size:18px;
	font-weight:bold;
	text-transform:none;
 }
.menuactive:hover {
	color:white;
	font-weight: bold;
	background:gray;
	text-decoration:none;
	font-size:18px;
	text-transform:none;
	border:1px solid #00549f;
 }


/*
* menue fertig
*/


a:link, a:visited, a:hover {
	color: #000;
	/* color: #ffffff; */
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

/* overrides decoration from previous rule for hovered links */

h1, h2, h3, h4, h5, h6 {
	font-family: sans-serif, Verdana, Arial;
	margin: 0px;
	padding: 0px;
}

h1{
 font-family: sans-serif, Verdana, Arial;
 font-size: 120%;

}

h2{
 font-size: 114%;
}

h3{
 font-size: 100%;
}

.h33{
 font-size: 100%;
}


h4{
 font-size: 100%;
 font-weight: normal;
}

h5{
 font-size: 100%;
}

ul{
 font-family: sans-serif, Verdana, Arial;
 list-style-type: square;
}

ul ul{
 list-style-type: disc;
}

ul ul ul{
 list-style-type: diamond;
}

/* RWH */
ol{
 font-family: sans-serif, Verdana, Arial;
 padding:30px;
}

li{
 padding:5px;
}

/* tabellen */

/* menu table */
.menutable,.menutable td,.menutable th { 
  font-family:Tahoma;
  font-size: 3px;
  color:#00549f;
}

.trborder { 
  border-width:thin;
  border-color:black;
  border-bottom:solid;  
}

/*
 * randlose tabele
 */
.randlos table tr tr:hover td {
    border-style:none;
}

/*
 * normale Tabelle
 */

.tStd table td {
    border: 0px solid black;
    width=100%;
    padding: 5px 5px;
    border-collapse: collapse;
}

t.tStd d { 
  border-spacing:3px 3px;
  border:0px solid #000; 
  vertical-align:middle; 
  /* text-align:center; */
  overflow:hidden; 
}

t.tStd h { 
  border-spacing:5px 5px;
  background-color: var(--grey);
  border:0px solid #000; 
  vertical-align:middle; 
  /* text-align:center; */
  overflow:hidden; 
}
t.tStd r { 
    border-style: none;
    border-width:3px 3px;
}

t.tStd r:nth-child(odd){
    background-color:#eeffee;
}
t.tStd r:nth-child(even){
    background-color:#eef7ee;
}

/*
 * datenbank tabelle
 */
.tDB table td {
    border: 0px solid black;
    width=100%;
    padding: 5px 5px;
    border-collapse: collapse;
}

.tDB td { 
  border-spacing:3px 3px;
  border:0px solid #000; 
  vertical-align:middle; 
  /* text-align:center; */
  overflow:hidden; 
}

.tDB th { 
  border-spacing:5px 5px;
  background-color: var(--grey);
  border:0px solid #000; 
  vertical-align:middle; 
  /* text-align:center; */
  overflow:hidden; 
}
.tDB tr { 
    border-style: none;
    border-width:3px 3px;
}
.tDB tr:hover { 
    border:3px solid var(--sseDark);
    background-color: yellow;
}

.tDB tr:nth-child(odd){
    background-color:#eeffee;
}
.tDB tr:nth-child(even){
    background-color:#eef7ee;
}

.tDB tr:hover:nth-child(odd){
    background-color:#ddddcc;
}
.tDB tr:hover:nth-child(even){
    background-color:#ddddcc;
}
/* login eingabefelder */
.inputLogin {
    border-color:#00549f;
    background-color: #ffffff;
    border-width: 1px;
    border-style:solid;
    border-radius: 0px;
    color: #000000;
    font-size: x-large;
    font-family: ;
    font-style: normal;
    font-weight: ;
    padding: 10px;
	transition: .3s ease;
	width: auto; 
	outline: none;
}

/* login */
.login {
    border-style:solid;
    border-width:1px;
    border-color:#00549f;
    border-radius: 10px;
    background-color:#cdcdcd;
    opacity:0.85;
    vertical-align: top;
    margin:10px;
    padding:10px 10px;
    font-size:normal;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.txtLogin {
    font-size:x-large;
}



/* einstellungen tabelle */
.prefs {
    vertical-align: top;
    border-width:1px;
    border-bottom-style:dashed;
    border-color:#00549f;
    padding:1px;
}
.prefs:hover {
    vertical-align: top;
    border-width:3px;
    border-style:solid;
    border-color:#00549f;
    padding:1px;
    background-color:yellow;
}

/*
 * BUTTONS
 */

/* Auge-icon im button */
.icnAuge {
    padding-left: 5px;
    padding-right: 30px;
    background: url("pic/auge_icon.png") no-repeat right;
    background-size: 20px;
    background-color: #ffffff;
}
/* QRCode-icon im button */
.icnQRcode {
    padding-left: 5px;
    padding-right: 30px;
    background: url("pic/qrcode.png") no-repeat right;
    background-size: 20px;
    background-color: #ffffff;
}
/* WebUntis-icon im button */
.icnWebuntis {
    padding-left: 5px;
    padding-right: 30px;
    background: url("pic/webuntis.jpg") no-repeat right;
    background-size: 20px;
    background-color: #ffffff;
}
/* Sokrates-icon im button */
.icnSokrates {
    padding-left: 5px;
    padding-right: 30px;
    background: url("pic/sokrates.png") no-repeat right;
    background-size: 20px;
    background-color: #ffffff;
}
/* ein normaler button */
.btn {
  /* font-size:15px; */
  font-family:Arial;
  /* width:140px; */
  /* height:50px; */
  border-width:1px;
  /* color:#757d6f; */
  color:black;
  border-color:#b2b8ad;
  font-weight:normal;
  border-top-left-radius:6px;
  border-top-right-radius:6px;
  border-bottom-left-radius:6px;
  border-bottom-right-radius:6px;
  box-shadow:inset 0px 0px 14px -3px #f2fadc;
  text-shadow:inset 0px 1px 0px #ced9bf;
  background:linear-gradient(#dbe6c4, #9ba892);
  padding:5px;
}

.btn:hover {
  background: linear-gradient(#9ba892, #dbe6c4);
  /* font-weight:bold; */
}

/* ein QR button */
.btnQR {
  /* font-size:15px; */
  font-family:Arial;
  /* width:140px; */
  /* height:50px; */
  border-width:1px;
  /* color:#757d6f; */
  color:black;
  border-color:#b2b8ad;
  font-weight:normal;
  border-top-left-radius:6px;
  border-top-right-radius:6px;
  border-bottom-left-radius:6px;
  border-bottom-right-radius:6px;
  box-shadow:inset 0px 0px 14px -3px #f2fadc;
  text-shadow:inset 0px 1px 0px #ced9bf;
  background:linear-gradient(#dbe6c4, #9ba892);
  padding:5px;
}
.btnQR:hover {
  background: linear-gradient(#9ba892, #dbe6c4);
  /* font-weight:bold; */
}


/* ein Student button */
.btnStud {
  font-size:18px; 
  font-family:Arial;
  border-width:1px;
  color:black;
  border-color:#b2b8ad;
  font-weight:normal;
  border-top-left-radius:3px;
  border-top-right-radius:3px;
  border-bottom-left-radius:3px;
  border-bottom-right-radius:3px;
  box-shadow:inset 0px 0px 14px -3px #f2fadc;
  text-shadow:inset 0px 1px 0px #ced9bf;
  /* background:linear-gradient(#dbe6c4, #9ba892); */
  background:linear-gradient(#ffffaa, #aaaa00);
  padding:1px;
}

.btnStud:hover {
  background: linear-gradient(#aaaa00, #ffffaa);
  /* font-weight:bold; */
}

/* ein normaler DEL button */
.btnDel {
  /* font-size:15px; */
  font-family:Arial;
  /*
  width:140px;
  height:50px;
  */
  border-width:1px;
  /* color:#757d6f; */
  color:black;
  border-color:#b2b8ad;
  font-weight:normal;
  border-top-left-radius:6px;
  border-top-right-radius:6px;
  border-bottom-left-radius:6px;
  border-bottom-right-radius:6px;
  box-shadow:inset 0px 0px 14px -3px #f2fadc;
  text-shadow:inset 0px 1px 0px #ced9bf;
  background:linear-gradient(#dbb694, #9b7862);
  padding:5px;
}

.btnDel:hover {
  background: linear-gradient(#9b7862, #dbb694);
  /* font-weight:bold; */
}

/* LOGION Button */
.btnLogin {
  font-size:30px; 
  font-family:Arial;
  border-width:1px;
  color:black;
  border-color:#b2b8ad;
  font-weight:normal;
  border-top-left-radius:6px;
  border-top-right-radius:6px;
  border-bottom-left-radius:6px;
  border-bottom-right-radius:6px;
  box-shadow:inset 0px 0px 14px -3px #f2fadc;
  text-shadow:inset 0px 1px 0px #ced9bf;
  background:linear-gradient(#dbe6c4, #9ba892);
  padding:1px;
}

.btnLogin:hover {
  background: linear-gradient(#9ba892, #dbe6c4);
  /* font-weight:bold; */
}

/* ein IMG button */
.btnImg {
  /* font-size:15px; */
  font-family:Arial;
  /*
  width:140px;
  height:50px;
  */
  border-width:1px;
  /* color:#757d6f; */
  color:black;
  border-color:#b2b8ad;
  font-weight:normal;
  border-top-left-radius:6px;
  border-top-right-radius:6px;
  border-bottom-left-radius:6px;
  border-bottom-right-radius:6px;
  box-shadow:inset 0px 0px 14px -3px #f2fadc;
  text-shadow:inset 0px 1px 0px #ced9bf;
  background:linear-gradient(#dbe6c4, #9ba892);
  padding:1px;
}

.btnImg:hover {
  background: linear-gradient(#9ba892, #dbe6c4);
  /* font-weight:bold; */
}

/*
 * fruehwarn rahmen
 */
.fwFrame1{
	border:3px solid orange;
}
.fwFrame2{
	border:3px solid red;
}
/* MA Buttons */
.btnMAfw {
  font-size:10px;
  font-family:Arial;
  border-width:0px;
  color:rgba(0, 0, 0, 1);
  border-color:#18ab29;
  border-top-left-radius:0px;
  border-top-right-radius:0px;
  border-bottom-left-radius:0px;
  border-bottom-right-radius:0px;
  background:#ffaaaa;
}
.btnMAfw:hover {
  background: rgba(155, 155, 155, 1)
}

.btnMAfwDel {
  font-size:10px;
  font-family:Arial;
  border-width:0px;
  color:yellow;
  border-color:#18ab29;
  border-top-left-radius:0px;
  border-top-right-radius:0px;
  border-bottom-left-radius:0px;
  border-bottom-right-radius:0px;
  background:#ff0000;
}
.btnMAfwDel:hover {
  background: rgba(155, 155, 155, 1)
}

.btnMA {
  font-size:10px;
  font-family:Arial;
  border-width:0px;
  color:rgba(0, 0, 0, 1);
  border-color:#18ab29;
  border-top-left-radius:0px;
  border-top-right-radius:0px;
  border-bottom-left-radius:0px;
  border-bottom-right-radius:0px;
  background:#ffffff;
}
.btnMA:hover {
  background: rgba(155, 155, 155, 1)
}

.btnMAbig {
  font-size:15px;
  font-family:Arial;
  border-width:0px;
  color:rgba(0, 0, 0, 1);
  border-color:#18ab29;
  border-top-left-radius:0px;
  border-top-right-radius:0px;
  border-bottom-left-radius:0px;
  border-bottom-right-radius:0px;
  background:#ffffff;
}
.btnMAbig:hover {
  background: rgba(155, 155, 155, 1)
}


.btnMA1 {
  font-size:10px;
  font-family:Arial;
  border-width:0px;
  color:rgba(0, 0, 0, 1);
  border-color:#18ab29;
  border-top-left-radius:0px;
  border-top-right-radius:0px;
  border-bottom-left-radius:0px;
  border-bottom-right-radius:0px;
  background:#44c767;
}

.btnMA1:hover {
  background: rgba(155, 155, 155, 1)
}

.btnMA3 {
  font-size:10px;
  font-family:Arial;
  border-width:0px;
  color:rgba(0, 0, 0, 1);
  border-color:#18ab29;
  border-top-left-radius:0px;
  border-top-right-radius:0px;
  border-bottom-left-radius:0px;
  border-bottom-right-radius:0px;
  background:rgba(200,200,200, 1);
}

.btnMA3:hover {
  background: rgba(155, 155, 155, 1)
}

.btnMA5 {
  font-size:10px;
  font-family:Arial;
  border-width:0px;
  color:rgba(0, 0, 0, 1);
  border-color:#18ab29;
  border-top-left-radius:0px;
  border-top-right-radius:0px;
  border-bottom-left-radius:0px;
  border-bottom-right-radius:0px;
  background:rgba(199, 68, 68, 1);
}

.btnMA5:hover {
  background: rgba(155, 155, 155, 1)
}
/* MA Buttons fertig */

/* input */
.in {
	padding: 5px 5px;
	/* width: 100%; */
	outline: none;
	background: #FFFFFF;
	color: #000000;
	border: 1px solid #9CA6BB;
	border-radius: 0px;
	transition: .3s ease;
}

.in input.files {
	padding: 5px 5px;
	/* width: 100%; */
	outline: none;
	background: #FFFFFF;
	color: #000000;
	border: 1px solid #9CA6BB;
	border-radius: 0px;
	transition: .3s ease;
}

.in:focus {
	background: #F2F2F2;
	border: 1px solid #00DD00;
	border-radius: 0px;
}

.in::placeholder {
	color: #797979;
}

input {
	padding: 5px 5px;
	/* width: 100%; */
	outline: none;
	background: #FFFFFF;
	color: #000000;
	border: 1px solid #9CA6BB;
	border-radius: 0px;
	transition: .3s ease;
}

input.files {
	padding: 5px 5px;
	/* width: 100%; */
	outline: none;
	background: #FFFFFF;
	color: #000000;
	border: 1px solid #9CA6BB;
	border-radius: 0px;
	transition: .3s ease;
}

/*
 * students karte
 */
.nameKarte {
    font-size: 15px;
    font-weight:bold;
    background-color: #559955; /* gruen */
    color: white;
}

.Karte {
    font-size: 11px;
    background-color: #ffffbb; /* hellgelb */
    color: var(--sseDark);
	border:2px solid var(--sseDark);
    border-radius: 5px;
    text-align:center;
}
.Karte:hover {
    background-color: #bbffbb; /* hellgruen */
}

.name18Karte {
    background-color: red;
    color:white;
}

.noteKarte {
    font-size: 14px;
}

/* selectbox fuer sitzplan */
.selectfont {
    font-size: 140%;
    /* font-family: Courier New; */
    font-family: monospace;
    font-size: 150%;
    /* -moz-font-size: 150%; */
    /* -moz-font-family: Courier New; */
    -moz-appearance:none; 
    text-indent: 0.01px;
    text-overflow: '';
}

/*
button {
  color:#00549f;
}

select {
  font-size:18px;
  color:#00549f;
}
*/

/***********************************************/
/* Layout Divs                                 */
/***********************************************/

#seKopf{
	margin: 0;
	padding: 10px 0px;
	border-bottom: 1px solid #000000; /* strich der seiten-ueberschrift GYS... */
	width: 100%;
	background-color: #ffffff;
	/* color:#00549f; */
}


/*
* ein raehmchen halt...
*/
#rahmen {
	border:1px solid color: var(--sseDark);

}

/* fix for browsers that don't need the hack */
#seNav li {border-bottom: none;}



/*********** #sectionLinks styles ***********/

#sectionLinks{
	position: relative;
	margin: 0px;
	padding: 0px;
	/* border-bottom: 1px solid #cccccc; */
	font-size: 100%;
}

#sectionLinks h3{
	padding: 10px 2px 2px 10px;
}

#sectionLinks a:link{
	padding: 4px 4px 4px 10px;
	/* border-top: 1px solid #cccccc; */
	width: 100%;
	width: auto;
}

#sectionLinks a:visited{
	border-top: 0px solid #cccccc;
	padding: 4px 4px 4px 10px;
}

/*
 * menu mit maus ueberfahren (hover)
*/
#sectionLinks a:hover{
	border-top: 0px solid #cccccc;
	background-color: #ffffff;
        color: #00549f;
	padding: 4px 4px 4px 10px;
	text-decoration: none;
}
#sectionLinks h2:hover{
	border-top: 0px solid #cccccc;
	background-color: #ffffff;
	color: #00549f;
	/*padding: 4px 4px 4px 10px;*/
	text-decoration: none;
}


/*********** .relatedLinks styles ***********/

.relatedLinks{
	margin: 0px;
	padding: 0px 0px 10px 10px;
	font-size: 90%;
}

.relatedLinks h3{
	padding: 10px 0px 2px 0px;
}

/*************** buttons ****************/

/* container image enthaelt bild */
.container {
  position: relative;
  text-align: center;
}
.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  //transform: translate(-50%, -50%);
}

.SABenSave  {
    /* width:25px; */
    background:#fedddd;
}


/* Kommentar zu schueler button */
.kmntBtn {
  padding: 3px;
  color: black;
  background: #ccccff;
}

/*
* Notenblatt Tabelle
*/

div.nt { 
    display: table; 
    /* border-collapse:collapse; */
    border-style:ridge;
    border-width:3px;
    padding:0px;
    border-radius:8px;
    border-color:#770000;
}
div.ntr { 
    display:table-row; 
}
div.nth { 
    display:table-cell; 
    border:thin solid red; 
    padding:5px;
    font-weight: bold;
}
div.ntd { 
    display:table-cell; 
    border:thin solid red; 
    padding:5px; 
}

/*
 * Noten
 */
.tNote {
    background-color:yellow;
}

/*
Upload in SITZPLAN verstecken! */
.hiddenUpload {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.hiddenUploadLabel {
    background-color:white;
    font-size:x-small;
}



/*
 * MODAL DIALOG
 * braucht das php include
 */

/* Modaler Dialog */
 .modaldialog {
      padding: 5px;
      border: 0.5px solid #1c87c9;
      border-radius: 10px;
      /* box-shadow: 0 0 18px 0 #1c87c9; */
      box-shadow: 0 0 18px 0 #003300;
}

/* ueberschrift vom modaldialog */
.modaldialogHead {
  border-radius: 5px;
  background-color: #ddeedd;
  border: 0px solid #ddd;
  padding: 8px;
}

.btnXdlg {
  font-size:18px;
  font-family:Arial;
  width:33px;
  height:33px;
  border-width:0px;
  color:black;
  border-color:#18ab29;
  border-top-left-radius:28px;
  border-top-right-radius:28px;
  border-bottom-left-radius:28px;
  border-bottom-right-radius:28px;
  background-color:transparent;
}

.btnXdlg:hover {
  background-color: #aaddaa;
}

