@import url(../../People/Antonio/noto/noto-tmp.css);

/* default settings should work well on small screens; custom settings
 * for desktop and tablet displays are handled at the end of this file */

body {
    margin: 1rem;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: bold;
}

h1 {
    margin-top: 0px;
    font-size: 1.5em;
}

h2 {
    font-size: 1.25em;
}

h3 {
    font-size: 1.125em;
}

:not(pre):not(ol):not(ul) {
    line-height: 1.5;
}
pre, pre *, ol, ol *, ul, ul * {
    line-height: 1.25;
}
li {
    margin-bottom: 0.25rem;
}
ul#navbar li {
    margin-bottom: 0;
}
:not(code):not(pre) {
    font-family: 'Noto Sans', sans-serif;
}
code, code *, pre, pre * {
    font-family:  'Inconsolata', monospace !important;
    background: #f6f6f6;
}

code, pre {
    padding: .15rem .25rem;
    border: thin solid #ccc;
    border-radius: 4px;
    font-size: 93%;
}

pre {
  border: 1px solid #c1c1c1;
  border-radius: 3px;
  background-color: #f6f6f6;
  padding: 0.5rem;
  overflow-x: scroll;
  max-width: 90%;
  display: inline-block;
  margin: 0;
  margin-left: 2rem;
}

table {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
th {
    padding: 0.25rem 0.75rem 0.25rem 0.75rem;
    text-align: center;
}
td {
    padding: 0.25rem 0.75rem 0.25rem 0.75rem;
    text-align: center;
}

a:link {
    text-underline-offset: 2px;
}

.targetable h2 a,
.targetable h3 a,
.targetable h4 a,
.targetable h5 a,
.targetable h6 a {
    opacity: 0;
    margin-left: 1rem;
    text-decoration: none;
    font-weight: 300;
    transition: .25s opacity linear;
}

.targetable section:hover h2 a,
.targetable section:hover h3 a,
.targetable section:hover h4 a,
.targetable section:hover h5 a,
.targetable section:hover h6 a {
    opacity: 1;
}

.targetable :target {
    animation-duration: 2s;
    animation-name: highlight;
}

@keyframes highlight {
    0%, 50% {
        box-shadow: 0 0 4rem #000000;
        background-color: #ffffff;
    }
    to {}
}

/* navbar copied and adapted from generic-navbar-2.css */
#navbar {
	background-color: #ebebeb;
	border: 1px solid #aaa;
	border-radius: 4px;
	margin-right: 1rem;
	padding: 0.5rem;
	font-size: 1em;
}

#navbar li.empty {
	padding-left: 1rem;
	background-color: #e0e0e0;
	padding-left: 4px;
	font-weight: bold;
}

#navbar li {
	padding: 1px 1px 1px 1rem;
	list-style: none;
	border-bottom: #bbb;
	border-width: 0 0 1px 0;
	border-style: none none solid none;
}

#navbar li#current {
	background-color: #CF9;
}

#navbar li a {
	display: inline;
	text-decoration: none;
}

#navbar li:hover {
	background-color: #ddd;
	border-bottom: #005A9C;
	border-width: 0 0 1px 0;
	border-style: none none solid none;
}

.info {
	background: #cce5ff;
	border: thin solid #017eff;
	border-radius: 4px;
	padding: 0.5rem;
}

.warning {
	background: #ffebe9;
	border: thin solid #cf222e;
	border-radius: 4px;
	padding: 0.5rem;
}

/* custom settings for wider screens (desktops, tablets) */
@media screen and (min-width: 48em) {
    body {
	margin: 1rem 2rem;
    }
    h1 { font-size: 2em; }
    h2 { font-size: 1.5em; }
    h3 { font-size: 1.25em; }
    #navbar {
	width: 17rem;
	float: right;
	margin-right: 2rem;
    }
}