/*
Program       esci.css
Author        Gordon Moore
Date          14 July 2020
Description   CSS for esci
Licence       GNU General Public LIcence Version 3, 29 June 2007
*/

/* #region Version history

0.0.1   Initial version
0.9.6	2020-08-07  Added breadcrumbs menu

#endregion */


/*-------------------------------------------------------------------------------------------*/
/*default font size*/
:root {
  --fontsize: 1.3rem;
}

html {
  width: 100%;
  height: 100%;
  font-size: 62.5%;
}

body {
  background-color: lightyellow;
  font-family: Verdana, sans-serif;
  font-size: var(--fontsize);
  color: blue;
  height: calc(100% - 2rem);
  overflow-x: hidden; 
}

label {
  font: normal var(--fontsize) Verdana !important;
  user-select: none;
}

select {
  font-size: var(--fontsize) !important;
}

option {
  font-size: var(--fontsize) !important;
}

input[type=text] {
  padding:5px; 
  border: 1px solid #ccc; 
  border-radius: 5px;
  width: 4rem;
  height: 1.2rem;
  font-size: var(--fontsize);
}

.greek {
  font-size: var(--fontsize);
}

.italic {
  font-style: italic;
  font-size: var(--fontsize);
}

/*------------------------------------------Main Panel-------------------------------------------------*/

#main {
  /*split into left and right panels*/
  display: grid;
  grid-template-columns: 40rem auto;
  grid-column-gap: 8px;
  height: 100%;
} 

/*--------------------------------------------Left Panel-----------------------------------------------*/

#leftpanel {
  border: 2px solid black; 
  display: grid;
  grid-template-rows: auto 2rem 1fr auto;
}

/*-------------------------------------------Main heading-----------------------------------------------*/
#header {
  border: 1px solid black;
  display: grid;
  grid-template-columns: 5rem 12rem auto 2rem;
}

#logoimg {
  max-width: 4rem;
  max-height: 4rem;
}

#mainheading {
  font-size: 2.5rem;
} 

#subheading {
  margin-left: 1.0rem;
  padding: 0.4rem;
  font-size: 2.0rem;
}

#tooltipsonoff {
  border: 1px solid black;
  background-color: lightgrey;
  height: 1.5rem;
  width: 1.4rem;
  margin-top: 0.8rem;
  text-align: center;
  border-radius: 1rem;
}

/*--------------------------------------------Breadcrumbs----------------------------------------------*/

#breadcrumbs {
  border: 1px solid green;
  font-size: 1.5rem;
}

#homecrumb {
  color: red;
}

#homecrumb:hover {
  color: green;
}

#homecrumb:active {
  color: magenta;
}


/*--------------------------------------------Menu items-----------------------------------------------*/


/*--------------------------------------------Footer----------------------------------------------------*/

#footer {
  float:left;
  bottom: 5px;

  border: 1px solid black;
  color: #0c43f8;
  background-color: #e8eef0e3;
  padding: 0.3rem;
  clear: both;
  width: auto;
}

#footer:hover {
  background-color: palegreen;
}

#footer:active {
  background-color: green;
}


/*--------------------------------------------right Panel-----------------------------------------------*/
/*see esci-distributions.css*/


/*--------------------------------------Tooltips skin for Tipped library----------------------------*/

/*--------------------------------------Tooltips skin for Tipped library----------------------------*/

/* skin is 'esci' */
.tpd-skin-esci .tpd-content,
.tpd-skin-esci .tpd-title,
.tpd-skin-esci .tpd-close { color:blue; }
.tpd-skin-esci .tpd-background-content { background-color: lightyellow; }
.tpd-skin-esci .tpd-background {
  border-width: 1px;
  border-color: rgba(6,0,12,.6);
}
.tpd-skin-esci .tpd-background-title { background-color: lightyellow; }
/* line below the title */
.tpd-skin-esci .tpd-title-wrapper { border-bottom: 1px solid #2a1fb4; }
/* shadow */
.tpd-skin-esci .tpd-background-shadow { box-shadow: 0 0 8px rgba(0,0,0,.15); }
/* spinner */
.tpd-skin-esci .tpd-spinner-spin {
  border-color: rgba(255,255,255,.2);
  border-left-color: #fff;
}
/* links */
.tpd-skin-esci a { color: blue; }
.tpd-skin-esci a:hover { color: #c6c6c6; }

/* text size xlarge */
.tpd-size-xlarge .tpd-content,
.tpd-size-xlarge .tpd-title {
  padding: 4px;  /*GM changed from 15*/
  font-size: 1.4rem;
  line-height: 20px;
}
.tpd-size-xlarge .tpd-background { border-radius: 10px; }
.tpd-size-xlarge .tpd-stem {
  width: 24px;
  height: 12px;
  margin-left: 8px; /* space from the side */
  margin-top: 2px; /* space between stem and target */
}
.tpd-size-xlarge.tpd-no-radius .tpd-stem { margin-left: 10px; }
.tpd-size-xlarge .tpd-close { margin: 11px 5px 11px 5px; }
.tpd-size-xlarge .tpd-close-icon { font-size: 32px; }
.tpd-size-xlarge .tpd-spinner {
  width: 66px;
  height: 50px;
}
.tpd-size-xlarge .tpd-spinner-spin { margin: 14px 0 0 22px; }
.tpd-size-xlarge .tpd-spinner-spin,
.tpd-size-xlarge .tpd-spinner-spin:after {
  width: 22px;
  height: 22px;
}

/* text size versionsize */
.tpd-size-versionsize .tpd-content,
.tpd-size-versionsize .tpd-title {
  padding: 10px;  /*GM changed from 15*/
  font-size: 1.5rem;
  line-height: 20px;
}
.tpd-size-versionsize .tpd-background { border-radius: 10px; }
.tpd-size-versionsize .tpd-stem {
  width: 24px;
  height: 12px;
  margin-left: 8px; /* space from the side */
  margin-top: 2px; /* space between stem and target */
}
.tpd-size-versionsize.tpd-no-radius .tpd-stem { margin-left: 10px; }
.tpd-size-versionsize .tpd-close { margin: 11px 5px 11px 5px; }
.tpd-size-versionsize .tpd-close-icon { font-size: 32px; }
.tpd-size-versionsize .tpd-spinner {
  width: 66px;
  height: 50px;
}
.tpd-size-versionsize .tpd-spinner-spin { margin: 14px 0 0 22px; }
.tpd-size-versionsize .tpd-spinner-spin,
.tpd-size-versionsize .tpd-spinner-spin:after {
  width: 22px;
  height: 22px;
}