p {font-size:0.95rem;}
.card-header h5 {font-size:1.0rem;}
.bg-dark h5 {color:white;}


#sbpsGridMicro { font-size:6px; width:100%;}
#sbpsGridMicro td, #sbpsGridMicro th {text-align:center; vertical-align:middle; padding:0px; height:30px;}

#sbpsGridMicro {border-collapse:separate; border-spacing:2px;}
#sbpsGridMicro td.tdGrid {border-radius:3px; color:black; cursor:pointer;}
#sbpsGridMicro td.o {background:#ddd; border:thin solid #ddd;}
#sbpsGridMicro td.o:hover {background:lightgreen; border-radius:3px; border:thin solid #ddd; color:black;}
#sbpsGridMicro td.tdGridtaken {background:#5e6e82; border:thin solid red; color:white; background-image: linear-gradient(225deg, red, red 5px, transparent 5px, transparent);}
#sbpsGridMicro td.taken-paid {background:#5e6e82; border:thin solid green; color:white; background-image: linear-gradient(225deg, green, green 5px, transparent 5px, transparent);}

#sbpsGridMicro #trTopCoord th,#sbpsGrid th.leftCoordinates {color:white; border:none; border-radius:3px; background:#232e3c;}
#sbpsGridMicro #topAxisText, #sbpsGridMicro #leftAxis {font-size:8px;}
#sbpsGridMicro #leftAxis, #sbpsGridMicro #firstRow th {border:none;}	
#sbpsGridMicro #topAxisText {letter-spacing:0.3em;}
#sbpsGridMicro #topAxis {background3:#ffe9e9; color:red; padding:0px 10px;}
#sbpsGridMicro #leftAxis {background3:#ded3d3; color:maroon; padding:10px 0px;text-align:center; width:20px;}
#sbpsGridMicro #trTopCoord th {background:red;}
#sbpsGridMicro th.leftCoordinates {color:white; border:none; background:maroon;width:12px;}
#sbpsGridMicro td.openbox {background:#fdfdfd;}


#sbpsGrid {border-collapse:separate; border-spacing:3px;}
#sbpsGrid td.tdGrid {border-radius:8px; color:black; cursor:pointer;}
#sbpsGrid td.o {background:#ddd; border:thin solid #ddd;}
#sbpsGrid td.o:hover {background:lightgreen; border-radius:8px; border:thin solid #ddd; color:black;}
#sbpsGrid td.tdGridtaken {background:#C7B5A9; border:thin solid red; color:black; background-image: linear-gradient(225deg, red, red 10px, transparent 10px, transparent);}
#sbpsGrid td.taken-paid {background:#5e6e82; border:thin solid green; color:white; background-image: linear-gradient(225deg, green, green 10px, transparent 10px, transparent);}

#sbpsGrid #trTopCoord {height:50px;}
#sbpsGrid #trTopCoord th,#sbpsGrid th.leftCoordinates {color:white; border:none; background:#232e3c;}
#sbpsGrid #trTopCoord th {border-top-left-radius:6px;border-top-right-radius:6px;}
#sbpsGrid th.leftCoordinates {border-top-left-radius:6px;border-bottom-left-radius:6px;}
#sbpsGrid td, #sbpsGrid th {text-align:center; vertical-align:middle;}
#sbpsGrid td.tdGrid {height:84px;}
#sbpsGrid #topAxisText, #sbpsGrid #leftAxis {font-size:18pt;}
#sbpsGrid #leftAxis, #sbpsGrid #firstRow th {border:none;}	
#sbpsGrid td {font-size:12px;}
#sbpsGrid #topAxisText {letter-spacing:0.4em;}
#sbpsGrid #topAxis {background3:#ffe9e9; color:#595194; padding:0px 20px;}
#sbpsGrid #leftAxis {background3:#ded3d3; color:#595194; padding:20px 0px;text-align:center; min-width:25px;}
#sbpsGrid #trTopCoord th {background:#595194;}
#sbpsGrid th.leftCoordinates {color:white; border:none; background:#595194;}
#sbpsGrid td.openbox {background:#fdfdfd;}


.sbpsgrid25 th.leftCoordinates {height:40px;}
.sbpsgrid25 #trTopCoord th {width:9%!important;}

#sbpsGrid tr th:first-child {
		padding: 0px;
}