html {
	 height: 100%;
}
body {
/* Lato is just a tad too thin to be nicely readable (at 300) or a bit too thick (at 400) */
/* 	 font-family: "Lato"; 
	 font-weight: 300; */
/*	 font-family: "Computer Modern Serif"; */
	 font-family: "Computer Modern Bright"; 
/*	 font-weight: 300; */
	 font-size: 17px;
	 height: 100%;
	 line-height: 1.4;
	 background: white;
	 text-align: justify;
         hyphens: auto;
}
a {
  color: #209020;
  background-color: transparent;	
  text-decoration: none;
  }

a:hover {
  color: #209020;
  background-color: #e0e0e0;
}
#logobar a:hover {
	 background-color: white !important;
}
hr {
    border: 0;
    height: 1px;
    background: #ccc;
	 margin-top: 20px;
	 margin-bottom: 20px;
}
hr#below_logo {
	 margin-left: 40px;
	 margin-right: 40px;
	 margin-top: 0px;
	 margin-bottom: 0px;
}
div#logobar {
	 margin-left: 40px;
	 margin-right: 40px;
	 padding-bottom: 20px;
}
div#logobar div#cadabra_logo {
	 width: 42px;
	 position: relative;
	 top: 3px;
	 margin-left: 0px;
	 margin-right: 10px;
	 vertical-align: middle;
	 display: inline-block;
}
div#logobar div#cadabra_logo img {
	 vertical-align: middle;	 
	 width: 100%;
}
div#logobar #cadabra {
	 vertical-align: middle;	 
	 display: inline-block;
	 color: green;
	 font: 400 60px/1.3 "Bree Serif";
	 font-size: 48px;
}
div#topflex {
	 display: flex;
	 justify-content: space-between;
}
div#topflex div#search {
	 margin-top: 32px;
	 width: 300px;
	 margin-right: 30px;
}
div#logobar #subtext {
	 font-family: "Computer Modern Bright";
	 font-size: 14px;
	 font-weight: 300;
	 padding-left: 5px;
}
div#logobar #author {
	 float: right;
	 margin-top: 20px;
	 font: 400 14px "Bree Serif";
}
div#menubar {
	 display: inline-block;
	 vertical-align: top;
	 margin-left: 40px;
	 margin-top: 30px;
}
div#menubar ul {
	 list-style-type: none;
}
div#menubar ul li {
	 cursor: pointer;
	 margin-bottom: 5px;
}
div#menubar ul li:hover {
	 background: yellow;
}
div.splash_image {
	 width: 50%;
	 float: right;
	 margin-left: 50px;
	 margin-bottom: 20px;
}
div.splash_image img {
	 width: 100%;
}
div#main {
	 display: inline-block;
	 vertical-align: top;
	 margin-top: 20px;
	 margin-left: 40px;
	 width: calc(100% - 280px);
	 margin-bottom: 40px;
}
div#main > p {
	 margin-bottom: 20px;
	 margin-left: 40px;
}
div#main > dl {
	 margin-bottom: 20px;
	 margin-left: 40px;
}
div#main > dl dt {
	 font-style: oblique;
	 font-size: smaller;
}
div#main > dl dd {
	 margin-bottom: 10px;
}
.quote {
	 width: 80%;
	 margin-left: auto !important;
	 margin-right: auto !important;
}
div#main blockquote {
	 margin-top: -5px;
	 margin-left: 60px;
}
div#main ul {
	 margin-top: 0px;
	 margin-left: 40px;
}
div#main br {
	 margin-bottom: 40px;
}
div#main h1 {
	 text-align: left;
	 overflow: hidden;
	 margin-top: 4px;
	 font: 400 60px/1.3 "Bree Serif";
	 color: green;
	 font-size: 24px;
	 border-bottom: 1px solid #bbb;
	 margin-bottom: 20px;
}
div.summary {
	 font-style: italic;
	 margin-bottom: 20px;
	 margin-top: 0px;
}
div#main h2 {
	 width: 100%;
	 margin-top: 24px;
	 font-family: "Bree Serif";
	 font-weight: normal;
	 color: green;
	 font-size: 20px;
	 border-bottom: 1px solid #bbb; 
}
div#main h3 {
	 margin-top: 24px;
	 margin-left: 40px;
	 font-family: "Bree Serif";
	 font-weight: normal;
	 color: green;
	 font-size: 16px;
}
.latex_view h3 {
	 margin-left: 0px !important;
}
div#main h1 span.date {
	 margin-top: 10px;
	 float: right;
	 font-size: 10px;
	 font-family: sans;
	 font-weight: normal;
}

.running_image {
	 height: 40px;
	 width: 40px;
}

div.icon_background {
	 position: relative;
	 width: 130px;
	 height: 40px;
/* 	 background: #D56203;/* #36a750;  */
 	 background: green; 
	 cursor: pointer;
	 margin-bottom: 10px;
}
div.icon_background path {
/* 	 fill: #fa6; */
	 fill: #cfc;
	 transition-duration: 0.5s;  
}	 
div.icon_background img {
	 transition-duration: 0.5s;  
	 height: 70%;
	 margin-left: 3px;
	 margin-top: 3px;
	 opacity: 0.6;
	 outline: 1px solid transparent;
}
div.icon_background svg {
	 transition-duration: 0.5s;  
	 height: 80%;
}
div.icon_background div.icon_text {
	 position: absolute;
	 bottom: 5px;
	 right: 10px;
	 font-size: 14px;
	 color: white;
	 font-family: "Bree Serif";
	 font-weight: 400;
	 transition-duration: 0.5s;  
}
div.icon_background img.jupyter_icon {
    margin-left: 5px;
    opacity: 1.0;
}
div.firstline {
	 position: relative;
	 top: 6px;
}
/* div.icon_background:hover div.icon_text {
	 font-size: 15px;
	 transition-duration: 0.5s;  
} */
div.icon_background:hover {
/* 	 background: #292;*/
	 border-bottom: 2px solid #3a3;
	 height: 38px;
}
div.icon_background:hover img {
	 transition-duration: 0.5s;  
	 opacity: 1.0;
	 height: 85%;
}
div.icon_background:hover svg {
	 transition-duration: 0.5s;  
	 height: 100%;
}
div.icon_background:hover svg path {
	 transition-duration: 0.5s;  
	 fill: white;
}

/* Book */

div.book_cover {
    width: 33%;
    border: 1px solid #777;
}

/* Notebooks */

div.latex div.output { 
	 display: none; 
}
div.image_png { 
	 width: 400px; 
}
div.output { 
	 padding-left: 40px;
	 font-family: monospace;
    white-space: pre;
	 color: black;
}
code {
	 font-size: 14px;
}
div.verbatim {
	 padding-left: 40px;
	 font-size: 14px;
	 color: black;
}
div.latex { 
/* 	 font-family: 'STIXGENERAL';  */
	 padding-left: 10px; 
	 margin-bottom: 10px; 
}
div.latex_view h1 { 
	 margin-left: -20px;
}
div.latex_view { 
	 color: black;
	 font-size: 16px;
	 padding-left: 20px; 
	 margin-bottom: 15px; 
}
div.MathJax_Display {
    text-align: left !important;	 
	 margin-bottom: 5px !important;
	 margin-top: 5px !important;
	 margin-left: 30px;
	 padding-bottom: 0px !important;
}
.mjx-chtml {
	 text-align: left !important;
}
.MathJax_SVG_Display {
	 text-align: left !important;
	 font-size: 14px;
}
div.image_png img { 
	 width: 100%; 
}
div.python {
	 margin-left: 40px;
}
div.python > div.source { 
	 font-family: "Inconsolata", monospace; 
	 font-size: 15.8px;
	 padding-left: 10px; 
	 margin-bottom: 10px; 
	 padding-bottom: 0px;
	 margin-top: 10px;
	 white-space: pre-wrap; 
	 line-height: 20px;
	 color: blue; 
	 margin-left: 0px;
	 border-left: 1px solid blue;
	 tab-size: 3;
	 -moz-tab-size: 3;	 
}
div.input_form {
	 display: none;
}

div.view_options {
	 margin-left: 20px;
	 margin-top: -10px;
	 margin-bottom: 10px;
}
div.view_options span::before {
    content: "• ";
}
div.view_options span {
	 display: inline-block;
	 margin-left: 40px;
	 font-style: italic;
	 min-width: 300px;
	 width: 300px;
}
div.download_options {
	 margin-left: 50px;
	 margin-bottom: 20px;
}
div.view_options a {
	 margin-left: 20px;
}
pre {
	 margin-left: 30px;
	 font-size: 14px;
}
pre.output {
	 margin-left: 0px;
	 font-size: 14px;
}
div#main table {
	 margin-left: 50px;
}

/* Tooltips */

.tooltip {
	 position: relative;
}

.tooltip:hover:after{
    background: rgba(0,100,0,0.8);
    border-radius: 5px;
    bottom: 26px;
    color: #fff;
    content: attr(tiptext);
    left: -120px;
	 font-size: smaller;
    padding: 5px 15px;
    position: absolute;
    z-index: 98;
    width: 160px;
}
.tooltip:hover:before{
    border: solid;
    border-color: rgba(0,100,0,0.8) transparent;
    border-width: 6px 6px 0 6px;
    bottom: 20px;
    content: "";
    left: 14%;
    position: absolute;
    z-index: 99;
}

div#bottombar {
	 clear: both;
	 margin-top: 80px;
	 padding-top: 5px;
	 margin-left: 40px;
	 margin-right: 40px;
	 border-top: 1px solid #bbb;
	 font-size: small;
}
div#bottomleft {
	 float:left;
	 padding-bottom: 10px;
}
div#bottomright {
	 float:right;
	 padding-bottom: 10px;
}

tt {
	 font-family: "Inconsolata", monospace; 
	 font-size: 15.8px;
}
	 
div.literal {
	 font-family: "Inconsolata", monospace; 
	 font-size: 15.8px;
	 color: blue; 
	 line-height: 20px;
	 margin-left: 50px;
}

div.packages {
	 margin-left: 50px;
}
div.distrotype {
	 border-top: 1px solid #bbb;
	 margin-top: 10px;
	 padding-top: 15px;
	 margin-bottom: 40px;
}
div.distrotype img {
	 max-width: 200px;
	 max-height: 80px;
	 margin-bottom: 20px;
}
div.distrotxt {
	 margin-top: 10px;
	 margin-left: 30px;
}
div.distronum {
	 margin-left: 20px;
}

table.packages {
	 border-collapse: separate;
    border-spacing:  5px 10px;
}
table.packages .system {
	 white-space: nowrap;
}
table.packages .date {
	 white-space: nowrap;
}
table.packages .instructions {
	 font-size: smaller;
	 padding-left: 20px;
	 text-align: left;
}
table.packages td {
	 vertical-align: top;
}
table.packages tr {
}
div.distrotxt code {
	 display: block;
	 font-size: 12px;
	 margin-left: 10px;
	 margin-top: 5px;
	 margin-bottom:5px;
}
div#main > dl dt.author {
    font-size: 17px;
    font-style: oblique;
}
span.author {
    font-size: 17px;
    font-style: oblique;
}

/* Young tableaux */

div.young_box {
	 display: inline-block;
	 border: 1px solid black;
	 width: 10px;
	 min-width: 10px;
	 height: 10px;
	 min-height: 10px;
	 margin: 0px;
	 padding: 0px;
}
div.filled {
	 background: red;
}
div.young_tableau {
	 display: inline-block;
}
div.young_row {
	 padding: 0px;
	 margin: 0px;
	 height: 10px;
}

ol.table_of_contents {
	 margin-left: 40px;
}

/* Blog */

h2.blog {
	 width: 60%;
}
p.blog {
	 width: 60%;
}

/* Search */

#gsc-i-id1 {
	 font-size: 14px;
}
#gs_tti50 {
	 padding-top: 0px !important;
}

/* FAQ */

div#main div.faq_item h3 {
    font-style: normal;
    color: #209020;
    font-family: "Computer Modern Bright";
    font-size: 17px;
    text-align: left;
    margin-top: 2px !important;
    margin-bottom: 2px !important;    
}
div#main div.faq_item label:hover {
    cursor: pointer;
    background-color: #e0e0e0;
}
input[name="collapse"] {
    display: none; 
}
div#main div.faq_item .content {
    margin-left: 60px;
    margin-right: 60px;
    max-height: 0px;
    overflow-y: hidden;
    transition: max-height 0.5s;
}
div#main div.faq_item input[name="collapse"]:checked ~ .content {
    max-height: 1000px;
    transition: max-height 0.5s;
    margin-bottom: 10px;
}
div#main div.faq_item input[name="collapse"]:checked ~ h3 {
    margin-bottom: 5px !important;
    transition: max-height 0.5s;
}


/* Small screens */

@media screen and (max-width: 800px) {
	 div#main {
		  position: relative;
		  margin-left: 2%;
		  margin-right: 2%;
		  width: 96%;
	 }
	 div#menubar {
		  margin-left: 2%;
		  margin-right: 2%;
		  width: auto;
		  text-align: left;
	 }
	 div#menubar .icon_background {
		  display: inline-block;
		  margin-bottom: 5px;
	 }
	 div#menubar hr {
		  display: none;
		  margin-top: 0px;
		  margin-bottom: 5px;
	 }
	 div#main > p {
		  margin-bottom: 20px;
		  margin-left: 0px;
	 }
	 div#main ul {
		  margin-left: 0px;
	 }
	 div.splash_image {
		  width: 100%;
	 }
	 div#logobar {
		  margin-left: 2%;
		  margin-right: 2%;
	 }
	 div#bottombar {
		  margin-left: 2%;
		  margin-right: 2%;
	 }
	 hr#below_logo {
		  margin-left: 2%;
		  margin-right: 2%;
	 }
	 div.latex_view h1 { 
		  margin-left: 0px;
	 }
	 div.latex_view { 
		  padding-left: 0px; 
	 }
	 div.latex { 
		  padding-left: 0px; 
		  margin-bottom: 10px; 
	 }
	 div.python { 
		  margin-left: 1%;
	 }
	 div.python > div.source { 
		  width: calc(100% - 20px);
		  overflow-x: scroll;
	 }
	 div#main blockquote {
		  margin-left: 15px;
	 }
	 div.literal {
		  white-space: nowrap;
		  overflow-x: scroll;
		  margin-left: 10px;
	 }
}