@import url('https://fonts.googleapis.com/css?family=Ubuntu:300,400,500');
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,600');

body {
  font-family: Ubuntu;
  overflow-x: hidden;
  overflow-y: scroll;
  background-color: #fff;
  background-blend-mode: darken;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPSc1JyBoZWlnaHQ9JzUnPgo8cmVjdCB3aWR0aD0nNScgaGVpZ2h0PSc1JyBmaWxsPScjZmZmJy8+CjxyZWN0IHdpZHRoPScxJyBoZWlnaHQ9JzEnIGZpbGw9JyNjY2MnLz4KPC9zdmc+");
  background-repeat: repeat;
  cursor: crosshair;
  padding-top: 10vh;
  z-index: 9998;
}

/*
#cover {
  position: fixed;
  z-index: 1000;
  width: 100%;
}

#cover img{
  position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: auto;
    opacity: 0;
}
*/
h1 {
	font-family: 'Ubuntu';
	font-size: 1.75rem;
	font-style: normal;
	font-variant: normal;
	font-weight: 400;
	line-height: 23px;
}
h3 {
	font-family: 'Ubuntu';
	font-size: 2.2rem;
	font-style: normal;
	font-variant: normal;
	font-weight: 400;
	line-height: 23px;
}
p {
	font-family: 'Roboto', sans-serif;
	font-size: 1.35rem;
	font-style: normal;
	font-variant: normal;
	line-height: 25px;
  margin-bottom: 0px;
  letter-spacing: 0.035em;
}
blockquote {
	font-family: Ubuntu;
	font-size: 17px;
	font-style: normal;
	font-variant: normal;
	font-weight: 400;
	line-height: 23px;
}
pre {
	font-family: Ubuntu;
	font-size: 11px;
	font-style: normal;
	font-variant: normal;
	font-weight: 400;
	line-height: 23px;
}

a {
  color: #000;
  text-decoration: none;
  font-size: 1.65rem;
}

.tag p{
  font-size: 1em;
  font-weight: 300;
}

.sub {
  position: absolute;
  top: 2vh;
  right: 0;
  display: inline-flex;
  width: 80%;

  z-index: 9989;
}

.sub a{
  color: #000;
  text-decoration: none;
  font-size: 0.9rem;;
  border: 1px solid black;
  margin-right: 2%;
  padding-left: 3%;
  padding-right: 3%;
  padding-top: 1vh;
  padding-bottom: 1vh;
}

.sub a:hover {
  color: #fff;
  text-decoration: none;
  font-size: 0.9rem;;
  background-color: #000;
  margin-right: 2%;
  padding-left: 3%;
  padding-right: 3%;
  padding-top: 1vh;
  padding-bottom: 1vh;
  transition: top 2s ease;
}

.sub a:focus {
  text-decoration: none;
  color: #fff;
  transition: top 2s ease;
}

.sub a:active {
  text-decoration: none;
  color: #fff;
  background-color: #000;
}

.sub a:visited {
  color: #000;
  text-decoration: none;
  font-size: 0.9rem;;
  border: 1px solid black;
  margin-right: 2%;
  padding-left: 3%;
  padding-right: 3%;
  padding-top: 1vh;
  padding-bottom: 1vh;
}

.sub a:hover {
  color: #fff;
  background-color: #000;
  transition: top 2s ease;
}

a:focus {
  text-decoration: none;
  color: #fff;
  transition: top 2 ease;
}

/*Header block*/
#header {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  max-height:10vh;
  min-height: 10vh;

  padding-left:2%;
  padding-top: 2vh;
  padding-bottom: 2vh;
  padding-right:2%;

  border-bottom: 1px dashed #000;

  overflow-x: hidden;
  overflow-y: hidden;

  background-blend-mode: darken;
  background-repeat: repeat;
  background-color: #fff;
  z-index: 9999;
/*
  background-image: url('../img/texture5.jpg');
  background-repeat: no-repeat;
  background-size: cover;*/
}

#header h1,h3{
  font-weight: 400;
}

.logo {
  max-height: 6vh;
  max-width: 25%;
  z-index: 9999;
}

.logo img{
  max-width: 6vh;
  max-height: 6vh;
  margin-right: 0.5%;
}

.cut img{
  position: fixed;
  height: 2.5%;
  top:8.5vh;
  z-index: 9999;
  left: 2px;
}

.category {
padding-left: 7%;
height: 100%;
}

.category h1{

}

.category img{
  max-height: 4vh;
  min-height: 4vh;
  min-width: 5vh;
  max-width: 5vh;
  padding-left: 3%;
  margin-bottom: 1vh;
  margin-top: 1vh;
  display: inline-flex;
}
.subject{
  font-weight: 500;
}

.tite{
}
/*main container for content*/
#contain {
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  overflow-x: hidden;

  border-bottom: 1px solid #000;
}

::-webkit-scrollbar {
    width: 0px;  /* remove scrollbar space */
    background: transparent;  /* optional: just make scrollbar invisible */
  }



.boTop {
  border-top: 1px solid #000;
}

.boBot {
  border-bottom: 1px solid #000;
}

.boRow {
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
}

.boL {
  border-left: 1px solid #000;
}

.boR {
  border-right: 1px solid #000;
}

.wind {
  border: 1px solid black;
}

.bord {
  border: 1px solid black;
}

/*overridden bootsrap*/
.row {
  min-height:14px;

  overflow-x: hidden;
  overflow-y: hidden;
  display: inline-block;

  margin-bottom: 10vh;

  /*Alternate for show system
  margin-top: 3vh;
  margin-bottom: 3vh;*/

}

.row h1,h3{
  padding-left: 3%;
  font-weight: 400;
  padding-top: 1vh;
}

.row p{
  padding-top: 2vh;
  padding-left: 3%;
  line-height: 1.5rem;
}

.row a {
  color: #000;

}

.row a:hover {
  color: #bbb;
}

.black {
  background-color: #000;
  color: #fff;
}

.text{
  font-weight: 300;
}

.tab1{
}

.tab2 {
margin-bottom: 0px;

}

.tab3 {

}

.draggable {
  border-radius: 10px;
  margin: 0 10px 10px 0;
  float: left;
  padding-top: 2vh;
}

.draggable img{
  max-width: 30vh;
  border:1px dashed black;
}

.draggable2 {
  border-radius: 10px;
  margin: 0 10px 10px 0;
  float: left;
  padding-top: 2vh;
}

.draggable2 img{
  max-width: 500px;
  border:1px dashed black;
}

.draggable.is-pointer-down {
  z-index: 2; /* above other draggies */
}
.draggable.is-dragging { opacity: 0.5; }

.container {
  min-height: 40vh;
}

.handle {
  background: #555;
  background: hsla(0, 0%, 0%, 0.4);
  width: 100%;
  height: 30px;
  top:  90%;
  position: relative;
}

.brick {
  background-image: url('../img/wall.png');
  background-repeat: repeat-y;
}

.nav-up {
    top: -200px;
}
