@font-face {
  font-family: "Montserrat";
  font-weight: normal;
  font-style: normal;
  src: url("../font/Montserrat-Regular.ttf");
}

@font-face {
  font-family: "Montserrat";
  font-style: normal;
  font-weight: bold;
  src: url("../font/Montserrat-Bold.ttf");
}

@font-face {
  font-family: "Montserrat";
  font-weight: normal;
  font-style: italic;
  src: url("../font/Montserrat-Italic.ttf");
}

@font-face {
  font-family: "Montserrat";
  font-weight: bold;
  font-style: italic;
  src: url("../font/Montserrat-BoldItalic.ttf");
}

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
  background: #ccc;
}

::-webkit-scrollbar-thumb:hover {
  background: #2dc942;
}

html, body {
  height: 100%;
  font-family: "Montserrat";
}

.tingle-modal {
  user-select: text !important;
}

/* Title page*/

.title-container {
  width: 100vw;
  height: 100vh;
}

.title-col1 {
  height: 100%;
  background-image: url("../img/back.jpg");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  border-right: 5px solid white;
}

.title-col2 {
  height: 100%;
  background-color: #4b51a8;
  background-size: 100% 100%;
}

#logo {
  position: absolute;
  top: 3vh;
  right: 3vw;
}

#logo img {
  width: 22vh;
  height: 7vh;
}

#title {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 3vw;
  text-align: right;
  width: 70%;
  color: white;
  font-weight: bold;
}

#title #caption {
  font-size: 6vh;
  text-transform: uppercase;
}

#title #more {
  font-weight: bold;
  font-size: 2vh;
}

#place {
  position: absolute;
  bottom: 2vh;
  left: 2vw;
  color: white;
}

.delimeter-solid {
  border-top: 0.8vh solid white;
}

.title-menu {
  position: absolute;
  width: 50%;
  bottom: 10vh;
  right: 8vw;
  padding: 1rem;
  font-weight: bold;
  text-align: center;
  padding: 0 15px;
  border: solid 1px white;
}

.title-menu a {
  color: inherit;
  text-decoration: none;
  font-size: 3vh;
}

.title-menu-item-1 {
  color: white;
  padding: 0.5rem;
  border-right: 1px solid white;
}

.title-menu-item-2 {
  color: white;
  padding: 0.5rem;
  border-right: 1px solid white;
}

.title-menu-item-3 {
  color: white;
  padding: 0.5rem;
  background-color: #3d485c;
  border-right: 1px solid white;
}

.title-menu-item-4 {
  color: white;
  padding: 0.5rem;
  background-color: #3d485c;
  border-right: 1px solid white;
}

/* Content page*/

.content {
  position: absolute;
  left: 3vh;
  top: 3vh;
  cursor: pointer;
}

.content-item {
  border: solid 1px white;
  background-color: rgba(255, 255, 255, 0.8);
  padding: 1vh;
  margin: 1vh;
}

.content-item a {
  text-decoration: none;
  color: black;
  font-size: 2vh;
  margin: 0 1rem;
}

.content-menu {
  position: absolute;
  bottom: 1vh;
  right: 1vh;
  padding: 1rem;
  font-weight: bold;
  text-align: center;
  border: solid 1px white;
  padding: 0 15px;
}

.content-menu a {
  color: inherit;
  text-decoration: none;
}

.content-menu-item-1 {
  color: white;
  padding: 0.5rem;
  background-color: #2d6edf;
}

.content-menu-item-2 {
  color: #2d6edf;
  padding: 0.5rem;
  background-color: white;
}

.content-menu-item-3 {
  color: white;
  padding: 0.5rem;
  background-color: #ff6666;
}

.panel {
  position: absolute;
  width: 98.6vw;
  top: 12vh;
  left: 0.7vw;
  bottom: 8vh;
  padding: 1rem;
  background-color: white;
  border: solid 3px white;
  font-size: 1.5vh;
}

.panel .list-group-item:hover {
  opacity: 0.8;
}

.panel .list-group-item-action {
  border-radius: 0;
  color: black;
}

.panel .list-group-item-warning {
  border-radius: 0;
  background-color: #3ab54a;
  color: black;
}

.panel .list-group-horizontal .list-group-item {
  border-radius: 0;
}

.panel .list-group-horizontal .list-group-item:not(:last-child) {
  margin-right: 1rem;
}

.panel a {
  text-decoration: none;
}

.content-scroll-pane {
  height: 65vh;
  overflow-y: scroll;
}

.lection-scroll-panel {
  width: 100%;
  height: 77vh;
  overflow-y: scroll;
  padding-right: 1rem;
}

.lection-content {
  text-align: justify;
  text-indent: 2rem;
  font-size: 2vh;
}

.picture {
  display: flex;
  flex-flow: column nowrap;
  flex-grow: unset;
  align-items: center;
  margin: 2rem auto;
  text-align: center;
}

.btn-home {
  position: absolute;
  width: 10vh;
  height: 10vh;
  top: 1vh;
  left: 1vh;
  background-image: url("../img/btnHome.png");
  background-size: 100% 100%;
  cursor: pointer;
}

.btn-home .list-group-item:hover {
  opacity: 0.8;
}

.test-variant {
  margin-bottom: 1rem;
}

.test-variant button, label {
  margin-right: 1rem;
}

.navbar {
  padding-top: 3.5vh;
  background: rgba(255, 255, 255, 0);
}

#authors .caption {
  font-size: 2rem;
  font-weight: bold;
  text-align: center;
  text-transform: uppercase;
}

#authors hr {
  border-top: 3px solid gray;
}

#authors img {
  height: 10vh;
}

#authors .names {
  font-size: 2.5vh;
  color: firebrick;
}

#authors .pare {
  font-size: 3vh;
  color: darkblue;
}