html,body,h1,h2,h3,h4,h5,h6 {font-family: "arial", sans-serif;}
body {
  font-size: 30px; 
/*  max-width: 1024px; */
  margin: auto;
  padding-top: 75px; 
  /*background-color: #000040; 
  color: white;*/
}

body.waiting * {
    cursor: progress;
}

h1 { margin-top: 50px; color: #F00000;}
/*h2 { color: #6610f2; }*/
h2 { color: #0D6EFD; }

.button { font-size: 30px; }
/*
body {
  margin: 0;
  padding: 0;
  background-color: #17a2b8;
  height: 100vh;
}*/
#login .container #login-row #login-column #login-box {
  margin-top: 120px;
  max-width: 640px;
  height: 480px;
  border: 1px solid #9C9C9C;
  background-color: #EAEAEA;
  color: midnightblue;
}
#login .container #login-row #login-column #login-box #login-form {
  font-size: 30px;
  padding: 20px;
}
#login .container #login-row #login-column #login-box #login-form #register-link {
  margin-top: -85px;
}
#login input, select, textarea, button { 
  /*font-family:inherit; */
  font-size: 30px;
}

.tdPanel {
  background: #ddd;
  padding: 50px 10px 30px 10px;
  border-left: solid #0d0 5px;
  width: 90%;
  margin-left: 5%;
  margin-bottom: 2em;
}

/* Grids:  Used in Regression */
.grid {
  width: 70px;
  text-align: center;
}
.gridb {
  border-bottom: solid 1px black;
  width: 70px;
  text-align: center;
}
.gridr {
  border-right: solid 1px black;
  width: 70px;
  text-align: center;
}
.gridbr {
  border-bottom: solid 1px black;
  border-right: solid 1px black;
  width: 70px;
  text-align: center;
}
.gridR {
  width: 70px;
  text-align: right;
}
.gridRb {
  border-bottom: solid 1px black;
  width: 70px;
  text-align: right;
}

.width10 { width: 10%; }
.width25 { width: 25%; }
.width40 { width: 40%; }
.width50 { width: 50%; }

.width10c { width: 10%; text-align: center;}
.width40r { width: 40%; text-align: right;}

.p50 { text-indent: 50px; }
/*
@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}
*/
#loginForm {
  padding-top: 40px;
  padding-bottom: 40px;
/*  font-size:16px; */
  max-width: 360px;
/*  padding: 15px; */
  margin: 0 auto;
}

#loginForm input { text-align: left; }

.tdPanel { 
  background: #ddd;
  /*padding: 50px 10px 30px 10px;*/
  border-left: solid #0d0 5px;
  width: 98%;
  margin-left: 1%;
  margin-bottom: 2em;
}
.tdrPanel {
  background: #ddd;
  padding: 50px 10px 30px 50px;
  border-left: solid #d00 5px;
  width: 98%;
  margin-left: 1%;
  margin-bottom: 2em;
}

.tPanel {
  background: #ddd;
  padding: 50px 10px 30px 50px;
/*  border-left: solid #d00 5px; */
  width: 98%;
  margin-left: 1%;
  margin-bottom: 2em;
}

.tdc {text-align: center; vertical-align: middle !important;}
.tdl {text-align: left; vertical-align: middle !important;}
.tdr {text-align: right; vertical-align: middle !important;}

.td30l { width: 30px; text-align: left;}
.td32l { width: 32px; text-align: left;}
.td50l { width: 50px; text-align: left;}
.td60l { width: 60px; text-align: left;}
.td70l { width: 70px; text-align: left;}
.td100l { width: 100px !important; text-align: left;}
.td200l { width: 200px !important; text-align: left;}
.td300l { width: 300px !important; text-align: left;}
.td400l { width: 400px !important; text-align: left;}
.td10c { width: 10px; text-align: center;}
.td30c { width: 30px; text-align: center;}
.tdequals { width: 50px; text-align: center !important; vertical-align: center !important;}
.td50c { width: 50px; text-align: center !important; vertical-align: center !important;}
.td100c { width: 100px; text-align: center !important;}
.td30r { width: 30px; text-align: right;}
.td50r { width: 50px; text-align: right;}
.td60r { width: 60px; text-align: right;}
.td70r { width: 70px; text-align: right;}
.td100r { width: 100px !important; text-align: right;}
.td150r { width: 150px !important; text-align: right;}
.td200r { width: 200px !important; text-align: right;}
.td300r { width: 300px !important; text-align: right;}
.td400r { width: 400px !important; text-align: right;}

.row { padding-bottom: 20px; }
.btn { font-size: 24px; }
.indent50 { padding-left: 50px; }
.indent100 { padding-left: 100px; }

/*figcaption { font-size: 50px; } */
figcaption {
  padding: 5px;
/*  font-family: 'Cherry Swash', cursive; */
  font-size: 0.8em;
  font-weight: 700;
  border: none;
  background: transparent;
  word-wrap:normal;
/*  text-align: center; */
}
.fc20 { padding-left: 20px; }
.fc50 { padding-left: 50px; }
.fc100 { padding-left: 100px; }
.fc200 { padding-left: 200px; }

.footer {
  padding: 20px 50px 20px 50px;
  font-size: 14px;
  color: #444;
  background: #C0C0C0;
  text-align: center;
}
/* Grids */
.grid-container {
  display: grid;
  grid-template-columns: 48px minmax(200px, 410px) 220px minmax(52px,auto);
  grid-template-rows: auto;
  grid-gap: 0px;
  padding: 10px;
  align-items: center;
}
.grid-2x2 {
  display: grid;
  grid-template-columns: 60px 60px;
  grid-gap: 0px;
  padding: 0px;
}
.grid-3x3 {
  display: grid;
  grid-template-columns: 60px 60px 60px;
  grid-gap: 0px;
  padding: 0px;
}
.grid-help {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 0px;
  padding: 10px;
}
.grid-equation {
  display: grid;
  grid-template-columns: minmax(200px,300px) 50px auto;
  grid-gap: 0px;
  padding: 10px;
  align-items: center;
}
.grid-page {
  display: grid;
  grid-template-columns: auto auto auto;
  grid-gap: 0px;
  padding: 50px;
}

/* gi: grid item */
.gi { 
/*  border: 1px solid rgba(0, 0, 0, 0.8); */
  padding: 10px;
} 

.gi2_3l {
  grid-column: 1 / span 2;  
/*  border: 1px solid rgba(0, 0, 0, 0.8); */
  padding: 10px;
}
.gi2_3r {
  grid-column: 2 / span 2;  
/*  border: 1px solid rgba(0, 0, 0, 0.8); */
  padding: 10px;
}
.gi3_3 {
  grid-column: 1 / span 3;  
/*  border: 1px solid rgba(0, 0, 0, 0.8); */
  padding: 10px;
}


.gic { /* grid page item centered */
/*  border: 1px solid rgba(0, 0, 0, 0.8); */
  padding: 10px;
  text-align: center;
} 
.gi2 {
  grid-column: 1 / span 2;  
/*  border: 1px solid rgba(0, 0, 0, 0.8); */
  padding: 10px;
}
.giheader { /* grid item header */
/*  border: 1px solid rgba(0, 0, 0, 0.8); */
  padding: 10px;
  color: #0F0;
  background: #286090;
  text-align: center;
} 
.item1 {
  grid-column: 1 / span 4;
}
.wholerow {
  grid-column: 1 / span 4;
}
.item2 {
  grid-column: 2 / span 3;
}
.item1_2 {
  grid-column: 1 / span 2;
}
/* Matrix cells */
.mc60 { width: 60px; text-align: center; }
.mc100 { width: 100px; text-align: center; }
.mc200 { width: 200px; text-align: center; }
.mc220 { width: 220px; text-align: center; }
.mc300 { width: 300px; text-align: center; }
.mc400 { width: 400px; text-align: center; }
.mc500 { width: 500px; text-align: center; }

.eqnrow {
  grid-column: 1 / span 3;
}

.fill {object-fit: fill;}

.questions {
  display: grid;
  max-width: 760px;
  grid-gap: 10px;
/*  grid-template-columns: 50px minmax(150px, 400px) 50px minmax(150px, 400px) auto; */
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr; 
  /*grid-template-rows: repeat(2, [row] auto  ); */
  background: #DDD;
  color: #000;
  padding: 40px;
  margin: auto;
}
@media screen and (min-width: 760 px) {
  .questions {
    display: grid;
    max-width: 960px;
    grid-gap: 10px;
/*    grid-template-columns: 50px minmax(150px, 240px) 80px 60px auto; */
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr; 
    background: #DDD;
    color: #000;
    padding: 40px;
    margin: auto;
  }
}
.c1 {
  grid-column: 1;
}
.c1_5 {
  grid-column: 1 / span 5;
}
.c2 {
  grid-column: 2;
}
.c2r {
  grid-column: 2;
  text-align: right;
}
.c2_3 {
  grid-column: 2 / span 3;
}
.c2_4 {
  grid-column: 2 / span 4;
}
.c3 {
  grid-column: 3;
  text-align: center;
}
.c4 {
  grid-column: 4;
}
.c5 {
  grid-column: 5;
}

.ggrid4 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  text-align: center;
}

.ggrid7 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  text-align: center;
}

/*input { width: 50px; font-size: 28px; color: #000; text-align: center; } */

.eqngrid {
  display: grid;
  grid-gap: 10px;
  padding: 0px;
}

.eqngrid input { width: 100px; text-align: center; }

.eqn1 {
  grid-column: 1;
  grid-row: 1 / span 2;
}

.eqn2 {
  grid-column: 2;
  grid-row: 1;
  text-align: center;
}

.eqn3 {
  grid-column: 2;
  grid-row: 2;
  text-align: center;
}

.eqn4 {
  grid-column: 3;
  grid-row: 1 / span 2;
  text-align: center;
}

.eqn4a {
  grid-column: 3;
  grid-row: 1;
  text-align: center;
}

.eqn4b {
  grid-column: 3;
  grid-row: 2;
  text-align: center;
}
.eqn5 {
  grid-column: 4;
  grid-row: 1;
  text-align: center;
}

.eqn6 {
  grid-column: 4;
  grid-row: 2;
  text-align: center;
}

.eqn7 {
  grid-column: 5;
  grid-row: 1;
}

.eqn8 {
  grid-column: 5;
  grid-row: 2;
}

.mb { margin-bottom:10px; }
.fs { font-size: 24px; }
.al { text-align: left; }

.table-bordered td {border: none !important; } /*border-right: solid 1px #ccc !important;} */

.centre {border: auto; }

@media (min-width: 992px){
  .dropdown-menu .dropdown-toggle:after{
    border-top: .3em solid transparent;
      border-right: 0;
      border-bottom: .3em solid transparent;
      border-left: .3em solid;
  }
  .dropdown-menu .dropdown-menu{
    margin-left:0; margin-right: 0;
  }
  .dropdown-menu li{
    position: relative;
  }
  .nav-item .submenu{ 
    display: none;
    position: absolute;
    left:-200%; top:-7px;
  }
  .nav-item .submenu-left{ 
    right:-200%; left:auto;
  } 
  .dropdown-menu > li:hover{ background-color: #f1f1f1 }
  .dropdown-menu > li:hover > .submenu{
    display: block;
  }
}

.card {
    background-color: #161616;
}

/* To rotate images for check my maths */
.image-container {
    width: 1024px;
    height: 768px;
    overflow: hidden;
    position: relative;
}

.rotated {
    transition: transform 1s ease;
    transform-origin: center;
}

.rotated-90 {
    transition: transform 1s ease;
    transform: rotate(90deg);  /* scale(0.75); / * scale if needed */
}

.rotated-180 {
    transition: transform 1s ease;
    transform: rotate(180deg);  /* scale(0.75); / * scale if needed */
}

.rotated-270 {
    transition: transform 1s ease;
    transform: rotate(270deg);  /* scale(0.75); / * scale if needed */
}

input[type="checkbox"] {
    width: 28px;
    height: 28px;
}

.in_line {
  display: inline
}