@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

* {
  font-family: 'Roboto', sans-serif;
}

html,
body {
	padding: 0px;
  margin: 0px;
	font-size: 14px;
	color: #181818;
}

/* Left menu */
.left-menu {
	left: 0;
	z-index: 2;
	color : #fff;
	width: 60px;
	height: 100%; /* Safari iOS fix */
	overflow-y: auto;
	overflow-x: hidden;
	position: fixed;
	background-color: #2c51b3;
  transition: width .3s;
  -webkit-transition: width .3s;
}

.left-menu > ul > li > a > span {
	display: none;
}

.extended > ul > li > a > span {
	display: inline-block;
  text-decoration: none;
}

.extended {
	width: 300px;
}

.content {
  width: calc(100% - 300px);
    height: 100vh;
    position: absolute;
    left: 300px;
}

.content h1, .content h3, .content a {
  padding: 20px;
}

.web-link {
  padding: 0px !important;
}

.content p {
  padding: 0px 20px;
  line-height: 24px;
}

.content ul {
  /* padding: 0px 20px; */
  line-height: 24px;
  list-style: disc;
}

.content li {
  /* padding: 0px 20px; */
  line-height: 24px;
}

.left-menu::-webkit-scrollbar { 
    display: none; 
}

.left-menu > ul {
	padding: 0px;
	list-style-type: none;
}

.left-menu > ul > li {
  text-align: center;
}

.left-menu > ul > li > a {
	color : #fff;
	margin: 0px;
	width: 100%;
	height: 100%;
	display: block;
	font-size: 24px;
	line-height: 60px;
	transition: background-color .3s;
  white-space: nowrap;
}

.left-menu > ul > li > a:hover {
	color : #fff;
	background-color: #26459b;
}

.left-menu-nav-icon {
	color : #fff;
	background-color: #2c51b3;
}

ul { list-style-type: none; }

.accordion {
  width: 100%;
  max-width: 360px;
  /* margin: 30px auto 20px; */
  /* color: #FFF; */
  padding-left: 0px;
}

.accordion .link {
  cursor: pointer;
  display: block;
  padding: 10px 15px;
  color: #ffffff;
  font-size: 14px;
  /* font-weight: 700; */
  border-bottom: 1px solid #CCC;
  position: relative;
  -webkit-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
  text-transform: uppercase;
}

.accordion .link-common a {
  cursor: pointer;
  display: block;
  padding: 10px 15px;
  color: #ffffff;
  font-size: 14px;
  /* font-weight: 700; */
  position: relative;
  -webkit-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
  text-transform: uppercase;
  border-top: 1px solid #CCC;
}

.accordion .link-common-first a {
  cursor: pointer;
  display: block;
  padding: 10px 15px;
  color: #ffffff;
  font-size: 14px;
  /* font-weight: 700; */
  position: relative;
  -webkit-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
  text-transform: uppercase;
  border-bottom: 1px solid #CCC;
  text-decoration: none;
}

.accordion .link:hover {
  background: #26459b;
}

.accordion .link-common:hover {
  background: #26459b;
}

.accordion .link-common-first a:hover {
  background: #26459b;
}

.accordion .active {
  background: #26459b;
}

.accordion .link a, .accordion .link a:visited,
.accordion .link-common a, .accordion .link-common a:visited {
  text-decoration: none;
  color: #ffffff;
}

.accordion .link svg {
  font-size: 16px;
  margin-left: 4px;
}

.accordion li:last-child .link { border-bottom: 0; }

.submenu li:last-child { border-bottom: 0;}

.opened svg {
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}


.submenu {
  display: none;
  /* background: #444359; */
  font-size: 14px;
  padding-left: 0px
}

.submenu li { border-bottom: 1px solid #a8a6c9; }

.submenu a {
  display: block;
  text-decoration: none;
  color: #ffffff;
  padding: 12px;
  padding-left: 42px;
  -webkit-transition: all 0.25s ease;
  -o-transition: all 0.25s ease;
  transition: all 0.25s ease;
}

.submenu a svg {
  margin-right: 4px;
}

.submenu a:hover {
  background: #26459b;
}

.logo-container {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.logo-container img {
  width: 104px;
  height: 101px;
  padding: 0;
  margin: 0;
  border-radius: 50%;
  /* border:1px solid white;  */
  box-shadow: 0 0 20px 1px #ffffffe6;
}

table {
  margin: 0 20px;
  border-collapse: collapse;
  /* border: 1px solid grey; */
  display: block;
    overflow-x: auto;
    white-space: nowrap;
}

th{
  border: 1px solid grey;
  padding: 10px;
  font-weight: bold;
}

td {
  border: 1px solid grey;
  padding: 10px;
}

.separator {
  display: block;
  width: 100%;
  height: 1px;
  background: #bbbbbb;
}

.news-image-container img {
  max-width: 500px;
  width: 100%;
  height: auto;
  padding: 10px 20px;
}

@media screen and (max-width: 768px)
{
  /* .left-menu {
    left: 0;
    z-index: 2;
    color : #fff;
    width: 60px;
    height: 100%; /* Safari iOS fix */
    /* overflow-y: auto;
    overflow-x: hidden;
    position: fixed;
    background-color: #2c51b3;
    transition: width .3s;
    -webkit-transition: width .3s;
  }
  
  .left-menu > ul > li > a > span {
    display: none;
  }
  
  .extended > ul > li > a > span {
    display: inline-block;
    text-decoration: none;
  }
  
  .extended {
    width: 300px;
  } */ 
  
}
