|
|
|
@font-face {
|
|
|
|
font-family: "OCRAStd";
|
|
|
|
src: url("font/OCR_A.ttf");
|
|
|
|
font-weight: 300;
|
|
|
|
font-style: normal;}
|
|
|
|
|
|
|
|
|
|
|
|
@font-face {
|
|
|
|
font-family: "Roboto";
|
|
|
|
src: url("font/Roboto-Bold.ttf") format("truetype");
|
|
|
|
font-weight: bold;
|
|
|
|
font-style: normal;}
|
|
|
|
|
|
|
|
@font-face {
|
|
|
|
font-family: "Roboto";
|
|
|
|
src: url("font/Roboto-Regular.ttf") format("truetype");
|
|
|
|
font-weight: regular;
|
|
|
|
font-style: normal;}
|
|
|
|
|
|
|
|
@font-face {
|
|
|
|
font-family: "Roboto";
|
|
|
|
src: url("font/Roboto-BoldItalic.ttf") format("truetype");
|
|
|
|
font-weight: bold;
|
|
|
|
font-style: italic;}
|
|
|
|
|
|
|
|
@font-face {
|
|
|
|
font-family: "Roboto";
|
|
|
|
src: url("font/Roboto-Italic.ttf") format("truetype");
|
|
|
|
font-weight: regular;
|
|
|
|
font-style: italic;}
|
|
|
|
|
|
|
|
|
|
|
|
/* style edits */
|
|
|
|
a{
|
|
|
|
text-decoration: none;
|
|
|
|
color: black;
|
|
|
|
display: inline;
|
|
|
|
clear: none;
|
|
|
|
}
|
|
|
|
|
|
|
|
a:hover{
|
|
|
|
text-decoration: none;
|
|
|
|
color: #21632c;
|
|
|
|
}
|
|
|
|
|
|
|
|
a:active {
|
|
|
|
color: #21632c;
|
|
|
|
}
|
|
|
|
|
|
|
|
a:visited{
|
|
|
|
text-decoration: none;
|
|
|
|
color: black;
|
|
|
|
}
|
|
|
|
|
|
|
|
.name_T{
|
|
|
|
margin-top: 10vh;
|
|
|
|
margin-left: 1vw;
|
|
|
|
font-family: "OCRAStd";
|
|
|
|
text-transform: uppercase;
|
|
|
|
}
|
|
|
|
|
|
|
|
.name_T:hover {
|
|
|
|
text-decoration: none;
|
|
|
|
color: #21632c;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* style edits */
|
|
|
|
|
|
|
|
|
|
|
|
body
|
|
|
|
{
|
|
|
|
width:100%;
|
|
|
|
background-color: #21632c;
|
|
|
|
font-family: "Roboto", sans-serif;
|
|
|
|
width:100%;
|
|
|
|
font-size: calc(8px + 0.7vw);
|
|
|
|
scrollbar-width: 0px;
|
|
|
|
border: none;
|
|
|
|
margin-top: 0px;
|
|
|
|
margin-bottom: 0px;
|
|
|
|
margin-right: 0px;
|
|
|
|
margin-left: 0px;
|
|
|
|
}
|
|
|
|
|
|
|
|
div#left {
|
|
|
|
border: 1px solid white;
|
|
|
|
color: black;
|
|
|
|
width:49vw;
|
|
|
|
display: inline-block;
|
|
|
|
/* margin-left: auto;
|
|
|
|
margin-right: auto; */
|
|
|
|
height:100vh;
|
|
|
|
overflow-y: scroll;
|
|
|
|
/*! padding-bottom: 200px; */
|
|
|
|
background-color: white;
|
|
|
|
/*! padding-left: 5px; */
|
|
|
|
/*! padding-right: 5px; */
|
|
|
|
}
|
|
|
|
|
|
|
|
div#right {
|
|
|
|
border: none;
|
|
|
|
width:50vw;
|
|
|
|
display: inline-block;
|
|
|
|
margin-left: auto;
|
|
|
|
margin-right: 0px;
|
|
|
|
height:100vh;
|
|
|
|
overflow-y: scroll;
|
|
|
|
/*! padding-bottom: 200px; */
|
|
|
|
background-color: #21632c;
|
|
|
|
}
|
|
|
|
|
|
|
|
.p-style{
|
|
|
|
/* letter-spacing: 1px; */
|
|
|
|
margin-left: 1vw;
|
|
|
|
margin-right: 2vw;
|
|
|
|
margin-top: 1vh;
|
|
|
|
margin-bottom:1vh;
|
|
|
|
font-size: 13pt;
|
|
|
|
text-align: justify;
|
|
|
|
}
|
|
|
|
|
|
|
|
.collapsible {
|
|
|
|
background-color: white;
|
|
|
|
color: black;
|
|
|
|
cursor: pointer;
|
|
|
|
margin-top: 0px;
|
|
|
|
margin-bottom: 5px;
|
|
|
|
margin-left: 0vw;
|
|
|
|
padding-left:1vw;
|
|
|
|
width: 100%;
|
|
|
|
border: none;
|
|
|
|
text-align: left;
|
|
|
|
outline: none;
|
|
|
|
font-size: 13pt;
|
|
|
|
font-weight: bold;
|
|
|
|
}
|
|
|
|
|
|
|
|
.active, .collapsible:hover {
|
|
|
|
color:#21632c;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
#SPIX {
|
|
|
|
max-width: 90%;
|
|
|
|
text-align: center;
|
|
|
|
display: block;
|
|
|
|
margin-left: auto;
|
|
|
|
margin-right: auto;
|
|
|
|
padding-top: 8%;
|
|
|
|
font-family: "OCRAStd";
|
|
|
|
font-size: 2vw;
|
|
|
|
color: white;
|
|
|
|
padding-bottom: 2%;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
div#maintitle {
|
|
|
|
max-width: 95%;
|
|
|
|
text-align: center;
|
|
|
|
display: block;
|
|
|
|
margin-left: auto;
|
|
|
|
margin-right: auto;
|
|
|
|
padding-top: 5%;
|
|
|
|
font-family: "Roboto";
|
|
|
|
font-size: 10vw;
|
|
|
|
color: black;
|
|
|
|
padding-bottom: 0px;
|
|
|
|
margin-bottom: 0px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.student{
|
|
|
|
margin-top: 0vh;
|
|
|
|
margin-bottom: 0vh;
|
|
|
|
font-family: "OCRAStd";
|
|
|
|
font-style: "light";
|
|
|
|
font-size: 1.2vw;
|
|
|
|
margin-left: 1vw;
|
|
|
|
}
|
|
|
|
|
|
|
|
.tfam {
|
|
|
|
max-width: 90%;
|
|
|
|
text-align: center;
|
|
|
|
display: block;
|
|
|
|
margin-left: auto;
|
|
|
|
margin-right: auto;
|
|
|
|
padding-top: 0px;
|
|
|
|
padding-bottom: 2%;
|
|
|
|
font-family: "OCRAStd";
|
|
|
|
font-size: 2vw;
|
|
|
|
color: white;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.plusminus {
|
|
|
|
max-width: 90%;
|
|
|
|
text-align: center;
|
|
|
|
display: block;
|
|
|
|
margin-left: auto;
|
|
|
|
margin-right: auto;
|
|
|
|
margin-top:0px;
|
|
|
|
padding-top: 0px;
|
|
|
|
padding-bottom: 30%;
|
|
|
|
font-family: "OCRAStd";
|
|
|
|
font-size: 1.8vw;
|
|
|
|
color: white;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
div#subtitle {
|
|
|
|
font-size: 1.5vw;
|
|
|
|
margin-top: 0;
|
|
|
|
color: black;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
div #maingif{
|
|
|
|
max-width: 100%;
|
|
|
|
margin-top: 0px;
|
|
|
|
/* margin-bottom: 10%; */
|
|
|
|
margin-right: 0px;
|
|
|
|
margin-left: 0px;
|
|
|
|
padding:0px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.maingif{
|
|
|
|
width: 100%;
|
|
|
|
display: block;
|
|
|
|
padding:0px;
|
|
|
|
}
|
|
|
|
|
|
|
|
div#define {
|
|
|
|
max-width: 90%;
|
|
|
|
/*! text-align: justify; */
|
|
|
|
display: block;
|
|
|
|
margin-left: auto;
|
|
|
|
margin-right: auto;
|
|
|
|
font-family: "OCRAStd";
|
|
|
|
font-size: 1.5vw;
|
|
|
|
padding-top: 5%;
|
|
|
|
color:#fff;
|
|
|
|
}
|
|
|
|
|
|
|
|
div#pzi {
|
|
|
|
max-width: 90%;
|
|
|
|
/*! text-align: justify; */
|
|
|
|
display: block;
|
|
|
|
margin-left: auto;
|
|
|
|
margin-right: auto;
|
|
|
|
font-family: "OCRAStd";
|
|
|
|
font-size: 1.5vw;
|
|
|
|
color:white;
|
|
|
|
}
|
|
|
|
|
|
|
|
div#names {
|
|
|
|
max-width: 90%;
|
|
|
|
/*! text-align: justify; */
|
|
|
|
display: block;
|
|
|
|
margin-left: 1vw;
|
|
|
|
font-family: "OCRAStd";
|
|
|
|
font-style: "light";
|
|
|
|
color: white;
|
|
|
|
font-size: 1.2vw;
|
|
|
|
}
|
|
|
|
|
|
|
|
div#intro {
|
|
|
|
max-width: 90%;
|
|
|
|
/*! text-align: justify; */
|
|
|
|
display: block;
|
|
|
|
margin-left: auto;
|
|
|
|
margin-right: auto;
|
|
|
|
font-family: "OCRAStd";
|
|
|
|
font-size: 1.2vw;
|
|
|
|
color: white;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* div.moduleimg{
|
|
|
|
margin-top:50px;
|
|
|
|
margin-bottom: 100px;
|
|
|
|
} */
|
|
|
|
|
|
|
|
div.moduleimg img{
|
|
|
|
max-width: 100%;
|
|
|
|
display: block;
|
|
|
|
position: relative;
|
|
|
|
margin-left: auto;
|
|
|
|
margin-right: auto;
|
|
|
|
margin-top: 25%;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
div#bigpcb{
|
|
|
|
max-width: 90%;
|
|
|
|
display: block;
|
|
|
|
margin-left: auto;
|
|
|
|
margin-right: auto;
|
|
|
|
padding-top: 5%;
|
|
|
|
padding-bottom: 10vh;
|
|
|
|
}
|
|
|
|
|
|
|
|
.bigpcb{
|
|
|
|
width: 100%;
|
|
|
|
height: auto;
|
|
|
|
margin-left: auto;
|
|
|
|
margin-right: auto;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.output{
|
|
|
|
max-width: 90%;
|
|
|
|
display: block;
|
|
|
|
margin-left: auto;
|
|
|
|
margin-right: auto;
|
|
|
|
padding-top: 5%;
|
|
|
|
}
|
|
|
|
|
|
|
|
.code {
|
|
|
|
max-width: 80%;
|
|
|
|
display: block;
|
|
|
|
margin-left: auto;
|
|
|
|
margin-right: auto;
|
|
|
|
background-color: transparent;
|
|
|
|
border: 0.1em solid;
|
|
|
|
border-color: rgba(255, 255, 255, 0.3);
|
|
|
|
margin-bottom: white;
|
|
|
|
color: white;
|
|
|
|
font-family: "OCRAStd";
|
|
|
|
font-style:;
|
|
|
|
font-weight: 0.1%;
|
|
|
|
font-size: 13px;
|
|
|
|
padding-top: 1%;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.extended {
|
|
|
|
display: none;
|
|
|
|
overflow: hidden;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* .moduletext{
|
|
|
|
font-family: "OCRAStd";
|
|
|
|
text-transform: uppercase;
|
|
|
|
} */
|
|
|
|
|
|
|
|
div.links{
|
|
|
|
max-width: 100%;
|
|
|
|
background-color: black;
|
|
|
|
padding: 10px;
|
|
|
|
padding-left: 1vw;
|
|
|
|
margin-top: 3vh;
|
|
|
|
}
|
|
|
|
|
|
|
|
a.link_title{
|
|
|
|
font-size: 13pt;
|
|
|
|
color: white;
|
|
|
|
text-decoration: none;
|
|
|
|
padding-right: 50px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.link_title:hover {
|
|
|
|
color:#21632c;
|
|
|
|
}
|
|
|
|
|
|
|
|
::-webkit-scrollbar {
|
|
|
|
margin: 0px 0px 0px 0px;
|
|
|
|
padding: 0px 0px 0px 0px;
|
|
|
|
width: 0px;
|
|
|
|
/* background-color: #21632c; */
|
|
|
|
}
|