/* CSS Document */
body 												{width: 90%; max-width: 1080px; margin: 2em auto; background-image: url("../pictures/bglogo-small.png"); background-color: rgb(255,242,242); color: rgb(153,0,0); font-family: Tahoma; font-size : 14pt;}
.container 											{display: grid; grid-template-areas: "nav nav" "header header" "div1 div1" "div2 div2" "div3 div3" "div4 div4" "div5 div5" "footer footer"; grid-template-columns: 1fr; gap: 20px; }
nav													{display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); grid-auto-rows: minmax(30px, auto);  column-gap: 10px; row-gap: 10px;}
nav 												{grid-area: nav; }
div.navigate                                        {width: 220px; height: 25px; padding: 6px; margin: 3px; background-color: rgb(255,242,242); color: rgb(153,0,0); border-radius: 8px; border: solid rgb(153,0,0) 3px; text-align: center; font-size : 16pt;}
header 												{grid-area: header; }
header				 								{font-size : 28pt; text-align: center; padding-top: 20px; padding-bottom: 20px;}
footer 												{border-top: 3px solid rgb(153,0,0); padding: 20px; margin-top: 40px; margin-bottom: 20px;}
footer 												{grid-area: footer; }

.motto 												{grid-area: div1;}
.motto 												{display: grid; grid-template-columns: 1fr 3fr; grid-auto-rows: minmax(200px, auto); gap: 20px; }
.face 												{height: 180px; width: 180px;}
.text 												{font-size : 18pt; }

.searchdiv											{grid-area: div2;}
.searchdiv											{left: 0px; width: 100%; border-top: solid rgb(153,0,0) 3px; padding-top: 10px; padding-bottom: 10px;}
.input 												{margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin right: 30px; border-radius: 3px; border: rgb(153,0,0) solid 3px; height: 35px; font-size: 14pt; }

.textcontent 										{grid-area: div3; }
.textcontent										{display: grid; grid-template-columns: repeat(auto-fit, minmax(305px, 1fr)); grid-auto-rows: minmax(30px, auto);  column-gap: 20px; row-gap: 20px;}
.textcontent										{width: 100%; padding-top: 10px; padding-bottom: 10px; margin-top: 10px; margin-bottom: 10px;}

.basket												{grid-area: div4; }
.basket												{text-align: right;}

.media												{grid-area: div5; }
.media  											{display: grid; grid-template-columns: repeat(auto-fit, minmax(305px, 1fr)); grid-auto-rows: minmax(220px, auto);  column-gap: 20px; row-gap: 20px;}
.media												{width: 100%; padding-top: 20px; padding-bottom: 20px; margin-top: 20px; margin-bottom: 20px;}
.mediafield 										{height: 200px; width: 300px; border: 3px solid rgb(153, 0, 0)}

button            							        {width: 90px; height: 35px; border: solid rgb(153,0,0) 2px; border-radius: 5px; color: rgb(255,255,255); background-color: rgb(153,0,0); cursor: pointer; font-size : 14pt; font-weight: bold;}

div.rotor											{grid-area: div1; text-align: center}

div.forms											{grid-area: div1; width: 100%; max-width: 1000px; margin-top: 20px; margin-bottom: 20px; }
div.forms form									    {border: none; text-align: left; width: 100%; max-width: 1000px;}
div.forms input              		                {height: 25px; font-family: Tahoma; font-size : 14pt; color: rgb(153,0,0); border: solid rgb(153,0,0) 2px; width: 100%; max-width: 1000px; margin-top: 20px; margin-bottom: 20px;}
div.forms label             		                {font-family: Tahoma; font-size : 14pt; color: rgb(153,0,0);}
div.forms button             		                {width: 150px; height: 40px; border: solid rgb(153,0,0) 2px; border-radius: 5px; color: rgb(255,255,255); background-color: rgb(153,0,0); cursor: pointer; margin-top: 20px; margin-bottom: 20px;}
div.forms textarea                                  {border: rgb(153,0,0) solid 2px; border-radius: 5px; overflow-y: scroll; resize: none; width: 100%; max-width: 1000px; margin-top: 20px; margin-bottom: 20px;}

div.contcal											{grid-area: div1; width: 100%; max-width: 1000px; margin-top: 20px; margin-bottom: 20px; }
div.contcal											{display: grid; grid-template-columns: repeat(auto-fit, minmax(305px, 1fr)); grid-auto-rows: minmax(220px, auto); column-gap: 20px; row-gap: 20px; }

div.books											{grid-area: div1; width: 100%; max-width: 1000px; margin-top: 20px; margin-bottom: 20px; }                                                           
div.books            						        {display: grid; grid-template-columns: repeat(auto-fit, minmax(305px, 1fr)); grid-auto-rows: minmax(220px, auto); column-gap: 20px; row-gap: 20px; } 

div.interact1                                       {grid-area: div1; width: 100%;}
div.interact1 input 								{width: 100%; margin-top: 10px; margin-bottom: 5px; border-radius: 3px; border: rgb(153,0,0) solid 3px; font-size: 14pt; }
div.interact1 textarea 								{width: 100%; height: 300px; overflow-y: scroll; resize: none; margin-top: 5px; margin-bottom: 10px; border-radius: 3px; border: rgb(153,0,0) solid 3px; font-size: 14pt; }
div.interact2                                       {grid-area: div2; width: 100%;}
div.interact2 input 								{width: 100%; margin-top: 10px; margin-bottom: 5px; border-radius: 3px; border: rgb(153,0,0) solid 3px; font-size: 14pt; }
div.interact2 textarea 								{width: 100%; height: 300px; overflow-y: scroll; resize: none; margin-top: 5px; margin-bottom: 10px; border-radius: 3px; border: rgb(153,0,0) solid 3px; font-size: 14pt; }
div.safe                                            {width: 50%; display: grid; grid-template-columns: 1fr 1fr 1fr; grid-auto-rows: 1fr; gap: 20px;}
div.contrib                                         {grid-area: div3; width: 100%;}
div.frdiv                                           {width: 100%; height: 500px; background-color: rgb(255,255,255); border: rgb(153,0,0) solid 2px; border-radius: 5px; padding: 20px; overflow-y: scroll; resize: none;}

a                                                   {color: rgb(153,0,0); text-decoration: underline; cursor: pointer;}
a:link                                              {color: rgb(153,0,0); text-decoration: underline; }
a:visited                                           {color: rgb(143,0,0); text-decoration: underline; }
a:hover                                             {color: rgb(255,0,0); text-decoration: underline; }

table.pattern		             {top: 0px; border: none; border-collapse: collapse; }
table.pattern	td	             {border: none; border-collapse: collapse; font-family: Courier New; font-size: 3pt; font-weight: bold; width: 4px; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; }
table.pattern	tr	             {height: 3px; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px;}

figure                           {width: 300px;}
figcaption                       {width: 100%; padding-top: 20px; font-size: 12pt; text-align: justify;}

table.cmicrodata  	             {font-size : 12pt; border-collapse: collapse; border: none;}
table.cmicrodata td	             {font-size : 12pt; border-collapse: collapse; border: none; padding-left: 10px;}
table.cmicrodata tr	             {height: 30px;}
table.cmicrodata span	         {font-weight: bold;}
div.cmicrodata p	             {font-size : 12pt;}

#mypop1                          {text-align: center; padding-left:40px; padding-right:40px; padding-bottom:40px; padding-top:20px; background-color: rgb(255,255,255); font-family: Tahoma; color: rgb(153,0,0); border: rgb(153,0,0) solid 4px; border-radius: 8px;}
#mypop2                          {text-align: center; padding-left:40px; padding-right:40px; padding-bottom:40px; padding-top:20px; background-color: rgb(255,255,255); font-family: Tahoma; color: rgb(153,0,0); border: rgb(153,0,0) solid 4px; border-radius: 8px;}
#mypop3                          {text-align: center; padding-left:40px; padding-right:40px; padding-bottom:40px; padding-top:20px; background-color: rgb(255,255,255); font-family: Tahoma; color: rgb(153,0,0); border: rgb(153,0,0) solid 4px; border-radius: 8px;}
#mypop4                          {text-align: center; padding-left:40px; padding-right:40px; padding-bottom:40px; padding-top:20px; background-color: rgb(255,255,255); font-family: Tahoma; color: rgb(153,0,0); border: rgb(153,0,0) solid 4px; border-radius: 8px;}





/*
p                               {margin-left : 2px; margin-right : 2px; margin-top :2px; margin-bottom :6px;}
h1                              {font-size : 22pt; font-weight: bold; text-align: left;}
h2                              {font-size : 20pt; font-weight: bold; text-align: left;}
h3                              {font-size : 16pt; font-weight: bold; text-align: left;}
h4                              {font-size : 12pt; font-weight: bold; text-align: left;}

span.sh1                         {font-size : 22pt; font-weight: bold; text-align: left;}
span.sh2                         {font-size : 20pt; font-weight: bold; text-align: left;}
span.sh3                         {font-size : 16pt; font-weight: bold; text-align: left;}
span.sh4                         {font-size : 12pt; font-weight: bold; text-align: left;}

//div.page                         {position: absolute; top: 0px; left: 50%; width: 1080px; margin-left: -540px;}


div.left                         {position: absolute; left: 0px; width: 710px; top: 360px; height: 500px; background-color: rgb(255,255,255); border: rgb(153,0,0) solid 2px; border-radius: 5px; padding: 20px; overflow-y: scroll; resize: none;}
div.right                        {position: absolute; left: 720px; width: 345px; top: 360px; height: 100px;}
div.mediaitem                    {position: relative; margin-top: 20px; margin-bottom: 20px;}
div.msource                      {position: absolute; top: 50px; left: 0px; width: 340px; }
div.mdescription                 {position: absolute; top: 340px; left: 0px; width: 340px; padding: 5px;}
div.instruction                  {position: absolute; top: 200px; left: 50%; width: 600px; margin-left: -300px; padding: 30px; border: solid rgb(153,0,0) 2px; border-radius: 5px; }

div.frdiv                        {position: absolute; left: 0px; width: 1060px; height: 500px; background-color: rgb(255,255,255); border: rgb(153,0,0) solid 2px; border-radius: 5px; padding: 20px; overflow-y: scroll; resize: none;}
div.item                         {background-color: transparent;}

textarea.tarea                   {border: rgb(153,0,0) solid 2px; border-radius: 5px; overflow-y: scroll; resize: none;}

#home                            {position: absolute; top: 20px; left: 850px;}

form.dataform                    {border: none; text-align: left;}
form.dataform input              {height: 25px; font-family: Tahoma; font-size : 14pt; color: rgb(153,0,0); border: solid rgb(153,0,0) 2px;}
form.dataform label              {font-family: Tahoma; font-size : 14pt; color: rgb(153,0,0);}
form.dataform button             {width: 150px; height: 40px; border: solid rgb(153,0,0) 2px; border-radius: 5px; color: rgb(255,255,255); background-color: rgb(153,0,0); cursor: pointer;}

form.basketform                  {border: none; font-family: Tahoma; font-size : 12pt; color: rgb(153,0,0);}
form.basketform input            {height: 25px; font-family: Tahoma; font-size : 14pt; color: rgb(153,0,0); border: solid rgb(153,0,0) 2px;}
form.basketform button           {position: relative; width: 150px; height: 40px; border: solid rgb(153,0,0) 2px; border-radius: 5px; color: rgb(255,255,255); background-color: rgb(153,0,0); cursor: pointer;}
form.basketform placeholder      {font-family: Tahoma; font-size : 12pt; color: rgb(220,220,220);}

table.baskettable td             {padding: 3px; margin-right: 15px;}
table.bookinfo td                {text-align: center; }



form                             {width: 700px;  font-family: Tahoma;  font-size : 11px;  font-weight: bold;}
form.p                           {margin: 0px 0px 0px 0px; padding: 5px 5px 2px 2px; text-align: left; font-family: Tahoma; font-size : 11px; font-weight: bold; color: rgb(153,0,0);}
form.td                          {text-align: left; font-family: Tahoma; font-size : 11px; font-weight: bold;}
button                           {font-family: Tahoma; font-size: 11px; font-weight: bold; cursor: pointer;}
ol.ord1                          {text-align: justify;	list-style-type: decimal;}
ol.ord2                          {text-align: justify;	list-style-type: lower-alpha;}

ul.enhancedlist                  {margin : 20px 20px 20px 20px;}
ul.enhancedlist li               {margin-bottom: 15px; font-size: 20px;}

div.calendar                     {position: absolute; text-align: center; }
table.calendar                   {background-color: transparent; border-collapse: collapse; border: none;}
table.calendar td                {text-align: left; font-size: 12pt; border-collapse: collapse; border: none;}

textarea.textadminarea           {position: absolute; width: 450px; border: rgb(0,0,153) solid 3px; overflow-y: scroll; resize: none;}
input.crange                     {position: absolute; width: 950px; color: rgb(0,0,153);}

#mypop1                          {text-align: center; padding-left:40px; padding-right:40px; padding-bottom:40px; padding-top:20px; background-color: rgb(255,255,255); font-family: Tahoma; color: rgb(153,0,0); border: rgb(153,0,0) solid 4px; border-radius: 8px;}
#mypop2                          {text-align: center; padding-left:40px; padding-right:40px; padding-bottom:40px; padding-top:20px; background-color: rgb(255,255,255); font-family: Tahoma; color: rgb(153,0,0); border: rgb(153,0,0) solid 4px; border-radius: 8px;}
#mypop3                          {text-align: center; padding-left:40px; padding-right:40px; padding-bottom:40px; padding-top:20px; background-color: rgb(255,255,255); font-family: Tahoma; color: rgb(153,0,0); border: rgb(153,0,0) solid 4px; border-radius: 8px;}
#mypop4                          {text-align: center; padding-left:40px; padding-right:40px; padding-bottom:40px; padding-top:20px; background-color: rgb(255,255,255); font-family: Tahoma; color: rgb(153,0,0); border: rgb(153,0,0) solid 4px; border-radius: 8px;}


.tooltip {position: relative; display: inline-block; margin-top: 20px; margin-bottom: 20px; padding: 5px; cursor: pointer;}
.tooltip .tooltiptext { visibility: hidden; width: 150px; background-color: rgb(255,242,242); color: rgb(153,0,0); text-align: left; font-size: 10pt; border: solid rgb(153,0,0) 3px; border-radius: 6px; padding: 5px 0; position: absolute; z-index: 1; top: 0px; left: 70%; }
.tooltip:hover .tooltiptext {visibility: visible;}
 */