@font-face{
    font-family: 'cabin-italic';
    src: url('../fonts/Cabin-Italic.ttf');
}

@font-face {
    font-family: cabin-regular;
    src: url("../fonts/Cabin-Regular.ttf");
}

@font-face {
    font-family: cabin-bold;
    src: url("../fonts/Cabin-Bold.ttf");
}

@font-face {
    font-family: cabin-medium;
    src: url("../fonts/Cabin-Medium.ttf");
}

.tab{
    width:97%;
    height:83%;
    border-radius:15px;
    position:absolute;
    display:none;
    background-size:cover;
    overflow:hidden;
}

#tab_1{
    display:block;
    background:url("../img/bg_7_1.png");
    background-size:cover;
}

.source{
  position:absolute;
  background-size:100% !important;
  background-position:50% 50% !important;
  background-repeat:no-repeat !important;
  width:10%;
  height:10%;
  z-index:2;
}

.source:nth-of-type(1){
  background-image:url("../img/source_1.png");
  top:45%;
  left:25%;
  width:10%;
  height:10%;
}

.source:nth-of-type(2){
  background-image:url("../img/source_2.png");
  top:50%;
  left:15%;
  width:6%;
  height: 48%;
  z-index:2;
}

.source:nth-of-type(3){
  background-image:url("../img/source_3.png");
  top: 63%;
  left:4%;
  width:25%;
  height: 36%;
}

.source:nth-of-type(4){
  background-image:url("../img/source_4.png");
  top: 25%;
  left:20%;
  width:80%;
  height: 70%;
  z-index:0;
}

.source:nth-of-type(5){
  background-image:url("../img/source_5.png");
  top: 88%;
  left:90%;
  width:5%;
  height: 10%;
}

.source:nth-of-type(6){
  background-image:url("../img/source_6.png");
  top: 64%;
  left:62%;
  width:22%;
  height: 32%;
  z-index:1;
}

.layer{
  position:absolute;
  width:100%;
  height:100%;
  background-size:100% !important;
  background-repeat:no-repeat !important;
  pointer-events:none;
}

.layer:nth-of-type(7){
  background-image:url("../img/bg_7_2.png");
  z-index:1;
}

.layer:nth-of-type(8){
  background-image:url("../img/bg_7_3.png");
}

.source:hover{
  cursor:pointer;
  transform:scale(1.1);
}

.source:active{
  transform:scale(0.95);
}