@font-face {
    font-family: LE_SILENCE_DES_CAFARDS;
    src: url('../fonts/LE_SILENCE_DES_CAFARDS.ttf');
}

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

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

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

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

@keyframes colorFade {
    from {background-color: #06364B;}
    to {background-color: #0E7DAD;}
}

@keyframes colorOriginal {
    from {background-color: #0E7DAD;}
    to {background-color: #06364B;}    
}

::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar:hover{
    cursor:pointer;
}
 
/* Track */
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: rgba(76, 75, 73, 1);
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 1); 
}

::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(76, 75, 73, 1);
}


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

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

.tab_nav{
	position:absolute;
	bottom:0;
	width:16%;
	height:9.5%;
	left: 42%;
	z-index:1;
}

.tab_nav div{
	display:inline-block;
	float:left;
	height:100%;
}

.custom_btn{
    width:33%;
    height:100%;
    background: #64b238;
    color:#FFF;
    font-size:3em;
    text-align:center;
    border-bottom:solid 6px #006633;
    bottom:0;
    position:absolute;
}

.custom_btn:hover{
    cursor:pointer;
    background:#79C84F;
}

.custom_btn:active{
    transform:scaleY(0.8);
    background:#006633;
}

.popup{
	width:100%;
	height:100%;
	position:absolute;
	background-color:rgba(255, 255, 255, 0.8);
	z-index:20;
	display:none;
}

.btn_close{
	position:absolute;
	width:4%;
	z-index:7;
	right: 18%;
	top: 48%;
}

.btn_close:hover{
	cursor:pointer;
	transform:scale(1.1);
	opacity:0.85;
}

.btn_close:active{
	transform:scale(0.95);
	opacity:1;
}

#popup_1 > .info .btn_close{
	top:48%;
	left:77%;
}

#popup_1 .btn_close{
	top:2%;
	right:0.4%;
}

#popup_2 > .info > .btn_close{
	top: 28%;
	left: 87.5%;
}

.btn_previous{
	border-radius:10px 0 0 0;
	left:1%;
}

.btn_home{
	border-radius:0;
	right:33%;
}

.btn_next{
	border-radius:0px 10px 0 0;
	right:0;
}


.btn_play{
	position:absolute;
	width:15%;
	left:42.5%;
	top:50%;
	transform:translateY(-50%);
}

.btn_play:hover{
	transform:translateY(-50%) scale(1.1);
	cursor:pointer;
	opacity:0.85;	
}

.btn_play:active{
	transform:translateY(-50%) scale(0.95);
	opacity:1;
}

.info{
	width:100%;
	position:absolute;
	height:100%;
	background:url("../img/illustration_1.png");
	background-color:rgba(255, 255, 255, 0.8);
	background-size:60%;
	background-repeat:no-repeat;
	background-position:50% 10%;
	z-index:10;
	display:none;
}

.info > div{
	position:absolute;
	width:59%;
	height:37%;
	bottom:12.6%;
	left:20.5%;
}

.info > div > p{
	margin:0;
	font-family:'cabin-regular';
	font-size:2.7em;
	color:white;
	text-align:justify;
	padding:0 3%;
	position:relative;
	top:50%;
	transform:translateY(-50%);
}

.info > div > p > b{
	color:#0986B2;
}

.video_info{
	position:absolute;
	width:64%;
	background:url("../img/video_info_bg.png");
	background-size:80% 72%;
	background-position: 50% 0;
	background-repeat:no-repeat;
	left:18%;
	height: 55%;
	z-index:4;
	-webkit-transition:all 1s ease;
	-moz-transition:all 1s ease;
	-ms-transition:all 1s ease;
	transition:all 1s ease;
}

.video_info > div{
	position:absolute;
	width:100%;
	height:31%;
	bottom:0;
	background:url("../img/video_info.png");
	background-size:100%;
	background-position:100% 100%;
	-webkit-transition:all 1s ease;
	-moz-transition:all 1s ease;
	-ms-transition:all 1s ease;
	transition:all 1s ease;
}

.video_info > div:hover{
	cursor:pointer;
	transform:scale(1.05);
}

.video_info > div:active{
	transition:none;
	-webkit-transition:none;
	-moz-transition:none;
	-ms-transition:none;
	transform:scale(1);

}

.video_info > div > p{
	margin:0;
	color:white;
	font-family:'cabin-regular';
	font-size:1.7em;
	text-align:center;
	padding:0 2.2%;
	position:relative;
	top:25%;
}

.video iframe{
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	display:none;
	border:none;
}

.video{
	position:absolute;
}

.video{
	width:59.3%;
	height:73.3%;
	left:20.7%;
	top:8.2%;
}

.header{
	width:70%;
	height: 8%;
	background:#69359B;
	margin: 1% 0 0 15%;
	border-radius:10px;
}

.header p{
	margin:0;
	color:white;
	font-family:'cabin-regular';
	font-size:2em;
	text-align:center;
	position:relative;
	top:50%;
	transform:translateY(-50%);
}

.notepad{
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAGQA\
    gMAAAASNuJIAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpg\
    AAA6mAAAF3CculE8AAAADFBMVEX///8tQV0tQV3////Lf7vBAAAAAnRSTlMAwO33D4gAAAABYkt\
    HRACIBR1IAAAACXBIWXMAAC4jAAAuIwF4pT92AAAAFElEQVQoz2NgGAWjYMQCB4YG/BAAi2AIQX\
    Wxvm8AAAAldEVYdGRhdGU6Y3JlYXRlADIwMTUtMDQtMjhUMTc6MDU6MjUrMDI6MDDD9mZeAAAAJ\
    XRFWHRkYXRlOm1vZGlmeQAyMDE1LTA0LTI4VDE3OjA1OjI1KzAyOjAwsqve4gAAABl0RVh0U29m\
    dHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAAASUVORK5CYII=');
    background-size:100% 8%;
     background-color:#FFFFFF;
     background-position:0% 17%;
     border:none;    
     font: normal 14px verdana;
     line-height: 25px;
     padding: 2px 10px;
     border:none;
     resize:none;
     position:absolute;
     width:93%;
     height:71%;
     left:3%;
     top:16%;
     font-family:'cabin-regular';
     font-size:1.56em;
     line-height:1.48em;
     overflow:hidden;
     text-align:justify;
}

.menu{
	position:absolute;
	width: 90%;
	height: 15%;
	left:5%;
	top: 64%;
}

.menu > div{
	width:35%;
	display:inline-block;
	float:left;
	height:100%;
	background: #6B5293;
	border-radius:15px;
	float:left;
	margin-bottom:4.1%;
	border-bottom: solid 10px #3C0877;
}

.menu > div:hover, .buttons > div:hover{
	cursor:pointer;
	opacity:0.85;
	transform:scale(1.05);
}

.menu > div:active, .buttons > div:active{
	opacity:1;
	transform:scale(1);
}

.menu > div:last-of-type{
	margin-left:30%;
}

.menu > div > p{
	margin:0;
	color:white;
	font-family:'cabin-bold';
	font-size:3em;
	text-align:center;
	position:relative;
	top:50%;
	transform:translateY(-50%);
}

.content{
	position:absolute;
	width:90%;
	left:5%;
	top:10%;
	height:35%;
	background:#06A1C4;
	border:solid 6px #FFFFFF;
}

.content > div{
	width:100%;
	position:relative;
	top:50%;
	transform:translateY(-50%);
}

.content p{
	margin:0 0 2% 0;
	padding:0 2%;
	color:#046384;
	font-family:'cabin-bold';
	font-size:3em;
}

.title{
	color:#026633;
	position:absolute;
	font-size:2em;
	margin:0;
	font-family:'cabin-bold';
	font-size:3.5em;
	left:4%;
	top:2%;
}

#tab_2 .container{
	position:absolute;
	width:51%;
	height:80%;
	background:url("../img/description_1.png");
	background-size:100%;
	background-repeat:no-repeat;
	right:2%;
	bottom:15%;
}

.buttons{
	position:absolute;
	width:42%;
	height:60%;
	bottom:30%;
	left:2%;
	background:url("../img/arrows.png");
	background-repeat:no-repeat;
	background-size:24%;
	background-position:100% 95%
}

.buttons > div{
	width:75%;
	height:34%;
	margin-bottom:10%;
	background:#5D9908;
	border-radius:15px;
	border-bottom:solid 12px #026633;
}

.buttons > div > p{
	color:white;
	font-family:'cabin-bold';
	font-size:3em;
	text-align:center;
	position:relative;
	top:50%;
	transform:translateY(-50%);
}

#quiz{
	position:absolute;
	width:100%;
	height:100%;
	left:0;
	top:0;
}

#quiz > div{
	width:28.5%;
	height:41%;
	/* background:whitesmoke; */
	display:inline-block;
	margin-top:1%;
	margin-right:2%;
}

#quiz > div:first-of-type, #quiz > div:nth-of-type(4){
	margin-left:5%;
}

#quiz > div > .checkbox{
	width:4%;
	height:8%;
	background:#FFFFFF;
	border-radius:10px;
	border:solid 2px gray;
	position:absolute;
	margin-left:24.5%;
}

#quiz > div > .checkbox:hover{
	cursor:pointer;
	opacity:0.85;
	transform:scale(1.05);
}

#quiz > div > .checkbox:active{
	opacity:1;
	transform:scale(1);
}

#quiz > div > div{
	width:85%;
	height:82%;
}

#quiz > div:first-of-type > div:nth-of-type(2){
	background:url("../img/item_1.png");
	background-size:100%;
}

#quiz > div:nth-of-type(2) > div:nth-of-type(2){
	background:url("../img/item_2.png");
	background-size:100% 100%;
}

#quiz > div:nth-of-type(3) > div:nth-of-type(2){
	background:url("../img/item_3.png");
	background-size:100%;
}

#quiz > div:nth-of-type(4) > div:nth-of-type(2){
	background:url("../img/item_4.png");
	background-size:100%;
}

#quiz > div:nth-of-type(5) > div:nth-of-type(2){
	background:url("../img/item_5.png");
	background-size:100%;
}

#quiz > div:nth-of-type(6) > div:nth-of-type(2){
	background:url("../img/item_6.png");
	background-size:100%;
}

#quiz > div > .input{
	height:14%;
	border:dashed 1px gray;
	outline:none;
	margin-top:2%;
	width:85%;
	background:rgba(255, 255, 255, 0.6);
	font-family:'cabin-regular';
	font-size:2em;
}

.btn_audio{
	right:0;
	border-radius:0 10px 0 0;
}

.btn_help{
	left:35%;
	border-radius:10px 0 0 0;
}

#tab_2 #popup_2 .info{
	background-image:url("../img/illustration_2.png");
	background-repeat:no-repeat;
	background-size:34%;
	background-repeat:no-repeat;
	background-position:50% 10%;
}

.images{
	position:absolute;
	width:90%;
	height:83%;
	left:5%;
	top:5%;
}

.images > div{
	width:26.9%;
	height:45%;
	display:inline-block;
	background:purple ;
	float:left;
	margin-right:9.6%;
	margin-bottom:3%;
}

#popup_2 .images > div:first-of-type{
	margin-left:16%;
	background:url("../img/item_7.png");
	background-size:100%;
}

#popup_2 .images > div:nth-of-type(2){
	background:url("../img/item_8.png");
	background-size:100%;
}

#popup_2 .images > div:nth-of-type(3){
	background:url("../img/item_9.png");
	background-size:100%;
}

#popup_2 .images > div:nth-of-type(4){
	background:url("../img/item_10.png");
	background-size:100%;
}

#popup_2 .images > div:last-of-type{
	margin-right:0;
	background:url("../img/item_11.png");
	background-size:100%;
}

#tab_3 .buttons > div{
	height:16%;
	margin-bottom:-5%;
	margin-left:29%;
}

#tab_3 .buttons{
	height:79%;
	bottom: 12%;
	left: 45%;
	background:url("../img/arrows_2.png");
	background-repeat:no-repeat;
	background-size:27%;
	background-position:0% 50%
}

.images_2{
	/* background:purple; */
	width:90%;
}

.images_2 > div{
	margin-right:46%;
}

.images_2 > div:last-of-type, .images_2 > div:nth-of-type(2){
	margin-right:0;
}

#popup_3 .images_2 > div:first-of-type{
	background:url("../img/item_12.png");
	background-size:100%;
}

#popup_3 .images_2 > div:nth-of-type(2){
	background:url("../img/item_13.png");
	background-size:100%;
}

#popup_3 .images_2 > div:nth-of-type(3){
	background:url("../img/item_14.png");
	background-size:100%;
}

#popup_3 .images_2 > div:nth-of-type(4){
	background:url("../img/item_15.png");
	background-size:100%;
}

#popup_3 .btn_close{
	right:4%;
	top:4%;
}

.popup .overlap{
	position:absolute;
}

.popup .overlap:nth-of-type(3){
	position:absolute;
	top:36%;
	left:20%;
}

.popup .overlap:nth-of-type(4){
	position:absolute;
	top:36%;
	left:54%;
}

.popup h3{
	position:absolute;
	width:50%;
	left:25%;
	top: 19%;
	text-align:center;
	font-family:'cabin-bold';
	font-size: 6em;
	margin:0;
	line-height:0.9em;
	color:#69359B;
	text-shadow: 2px 2px 2px rgba(105, 53, 155, 1);
	
}

#popup_6 .overlap{
	left:37%;
}

#popup_6 .images > div:first-of-type{
	background:url("../img/illustration_17.png");
	background-repeat:no-repeat;
	background-size:100%;
}

#popup_6 .images > div:nth-of-type(2){
	background:url("../img/illustration_18.png");
	background-repeat:no-repeat;
	background-size:100%;
}

#popup_6 .images > div:nth-of-type(3){
	background:url("../img/illustration_19.png");
	background-repeat:no-repeat;
	background-size:100%;
}

#popup_6 .images > div:nth-of-type(4){
	background:url("../img/illustration_20.png");
	background-repeat:no-repeat;
	background-size:100%;
}

#popup_6 .images > div:nth-of-type(5){
	background:url("../img/illustration_21.png");
	background-repeat:no-repeat;
	background-size:100%;
}

#popup_5 .images > div:nth-of-type(1){
	background:url("../img/item_22.png");
	background-repeat:no-repeat;
	background-size:100%;
}

#popup_5 .images > div:nth-of-type(2){
	background:url("../img/item_23.png");
	background-repeat:no-repeat;
	background-size:100%;
}

#popup_5 .images > div:nth-of-type(3){
	background:url("../img/item_33.png");
	background-repeat:no-repeat;
	background-size:100%;
}

#popup_5 .images > div:nth-of-type(4){
	background:url("../img/item_24.png");
	background-repeat:no-repeat;
	background-size:100%;
}

#popup_5 .images > div:nth-of-type(5){
	background:url("../img/item_25.png");
	background-repeat:no-repeat;
	background-size:100%;
}

#popup_5 .images > div:nth-of-type(6){
	background:url("../img/item_26.png");
	background-repeat:no-repeat;
	background-size:100%;
}

#popup_4 .images > div:nth-of-type(1){
	background:url("../img/item_16.png");
	background-repeat:no-repeat;
	background-size:100%;
}

#popup_4 .images > div:nth-of-type(2){
	background:url("../img/item_17.png");
	background-repeat:no-repeat;
	background-size:100%;
}

#popup_4 .images > div:nth-of-type(3){
	background:url("../img/item_20.png");
	background-repeat:no-repeat;
	background-size:100%;
}

#popup_4 .images > div:nth-of-type(4){
	background:url("../img/item_21.png");
	background-repeat:no-repeat;
	background-size:100%;
}

#popup_4 .images > div:nth-of-type(5){
	background:url("../img/item_18.png");
	background-repeat:no-repeat;
	background-size:100%;
}

#popup_4 .images > div:nth-of-type(6){
	background:url("../img/item_19.png");
	background-repeat:no-repeat;
	background-size:100%;
}

#popup_2 h3{
	left:56%;
	top:30%;
	width:33%;
	background:white;
	border-radius:10px;
	padding:0.7%;
	border:solid 2px black;
	font-size:3em;
}


#tab_4 .container{
	position:absolute;
	width:70%;
	height:68%;
	left:4%;
	top:21%;
	/* background:red; */
}

#tab_4 .container > div{
	display:inline-block;
	float:left;
	height:48%;
	width:100%;
	/* background:whitesmoke; */
	margin-bottom:2%;
}

#tab_4 .container > div > div{
	display:inline-block;
	float:left;
	height:100%;
	width:30%;
	margin-right:5%;
	background-repeat:no-repeat !important;
}

#tab_4 .container > div > div:last-of-type{
	margin-right:0;
}

#tab_4 .container > div:first-of-type > div:first-of-type{
	background:url("../img/item_34.png");
	background-size:100%;
}

#tab_4 .container > div:first-of-type > div:nth-of-type(2){
	background:url("../img/item_16.png");
	background-size:100%;
}

#tab_4 .container > div:first-of-type > div:nth-of-type(3){
	background:url("../img/item_2.png");
	background-size:100%;
	background-repeat:no-repeat;
	border-radius:10px;
	border:solid 7px white;
	box-sizing:border-box;
  -moz-box-sizing:border-box;
  -webkit-box-sizing:border-box;
}

#tab_4 .container > div:last-of-type > div:first-of-type{
	background:url("../img/item_17.png");
	background-size:96%;
	background-repeat:no-repeat;
}

#tab_4 .container > div:last-of-type > div:nth-of-type(2){
	background:url("../img/item_22.png");
	background-size:100%;
}

#tab_4 .container > div:last-of-type > div:nth-of-type(3){
	background:url("../img/item_5.png");
		background-size:100%;
	background-repeat:no-repeat;
	border-radius:10px;
	border:solid 7px white;
	box-sizing:border-box;
  -moz-box-sizing:border-box;
  -webkit-box-sizing:border-box;
}

#tab_4 .drags_container{
	position:absolute;
	width:20%;
	height:67%;
	/* background:purple; */
	right:2%;
	top:22%;
}

#tab_4 .drags_container > div{
	display:inline-block;
	float:left;
	width:100%;
	height:44%;
	margin-bottom:20%;
	background:whitesmoke;
	box-sizing:border-box;
  	-moz-box-sizing:border-box;
  	-webkit-box-sizing:border-box;
  	border:dashed 2px gray;
}

#tab_4 .drags_container > div > p{
	color:#69359B;
	margin:1% 0 0 0;
	font-family:'cabin-bold';
	font-size:1.8em;
	text-align:center;
}

#tab_4 .drags_container > div > div{
	display:inline-block;
	height:70%;
	width:90%;
	margin-left:5%;
	/* background:red; */
}

#tab_4 .drags_container .drop{
	width:30%;
	height:50%;
	display:inline-block;
	float:left;
	background:white;
	border-radius:100%;
	box-sizing:border-box;
  	-moz-box-sizing:border-box;
  	-webkit-box-sizing:border-box;
  	border:solid 2px #380884;
}

#tab_4 .drags_container .drop:first-of-type{
	margin:0 15% 0 11.3%;
}

#tab_4 .drags_container .drop:last-of-type{
	margin:0 0 0 35%;
}

#tab_4 .drags_container .drop > p{
	margin:0;
	color:#69359B;
	font-family:'cabin-bold';
	font-size:2.6em;
	text-align:center;
	position:relative;
	top:50%;
	transform:translateY(-50%);
}

.drag{
	width:25%;
	height:30%;
	display:inline-block;
	float:left;
	background:white;
	border-radius:100%;
	box-sizing:border-box;
  	-moz-box-sizing:border-box;
  	-webkit-box-sizing:border-box;
  	border:solid 2px #380884;
}

.drag p{
	margin:0;
	color:#69359B;
	font-family:'cabin-bold';
	font-size:2.6em;
	text-align:center;
	position:relative;
	top:50%;
	transform:translateY(-50%);
}

.drag:hover{
	cursor:pointer;
	opacity:0.9;
	transform:scale(1.05);
}

.drag:active{
	cursor:pointer;
	opacity:1;
	transform:scale(1);
}

#tab_4 .btn_home{
	border-radius:0 10px 0 0;
}

#popup_6 h3{
	top:2%;
}

/*New */

.info_bg{
	position:absolute;
	height:15%;
	width:29%;
	display:inline-block;
	float:left;
	background: #6B5293;
	border-radius:15px;
	left:70%;
	top:35%;	
	margin-bottom:4.1%;
	border-bottom: solid 10px #3C0877;
}

.info_bg:hover{
	cursor:pointer;
	opacity:0.85;
	transform:scale(1.05);
}

.info_bg:active{
	opacity:1;
	transform:scale(1);
}

.info_bg p{
	color:white;
	margin:0;
	font-family:'cabin-bold';
	font-size:1.7em;
	padding:0 3%;
	position:relative;
	top:50%;
	transform:translateY(-50%);
}

#tab_1 .item{
	position:absolute;
	width: 6%;
	height: 24%;
	background-repeat:no-repeat !important;
}

#tab_1 .item:hover{
	cursor:pointer;
	opacity:0.85;
	transform:scale(1.1);
}

#tab_1 .item:active{
	opacity:1;
	transform:scale(1);
}

#tab_1 .item:first-of-type{
	background:url("../img/illustration_6.png");
	background-size:100%;
	left: 47%;
	top: 1%;
}

#tab_1 .item:nth-of-type(2){
	background:url("../img/illustration_7.png");
	background-size:100%;
	left: 46%;
	top: 16%;
}

#tab_1 .item:nth-of-type(3){
	background:url("../img/illustration_5.png");
	background-size:100%;
	left: 40%;
	top: 22%;
}

#tab_1 .item:nth-of-type(4){
	background:url("../img/illustration_9.png");
	background-size:100%;
	left: 51%;
	top: 34%;
}

#tab_1 .item:nth-of-type(5){
	background:url("../img/illustration_10.png");
	background-size:100%;
	left: 47%;
	top: 48%;
}

#tab_1 .item:nth-of-type(6){
	background:url("../img/illustration_8.png");
	background-size:100%;
	left: 35%;
	top: 41%;
}

.table{
	position:absolute;
	border-radius:10px;
	width:94%;
	height:76%;
	left:3%;
	top:12%;
	background:whitesmoke;
}

.table .row{
	width:100%;
	height:13%;
	display:inline-block;
	float:left;
	margin-bottom:0.5%;
}

.table .row .column{
	height:100%;
	display:inline-block;
	float:left;
	width:13.93%;
	background:#D7D8F2;
	margin-left:0.3%;
}

.table .row:first-of-type .column{
	background:#8448B0;
}

.table .row:first-of-type .column p{
	margin:0;
	font-family:'cabin-bold';
	font-size:1.4em;
	color:#F9EC08;
	position:relative;
	text-align:center;
	top:50%;
	transform:translateY(-50%);
}

.table .row:first-of-type .column:first-of-type p{
	font-size:2em;
}

.table .row:not(:first-of-type) .column p{
	margin:0;
	font-family:'cabin-bold';
	font-size:1.5em;
	text-align:center;
	text-align:left;
	position:relative;
	top:50%;
	transform:translateY(-50%);
	padding:0 0 0 5%;
}

.table .row:first-of-type{
	margin-top:0.3%;
} 

#tab_3 .info_bg{
	left:5%;
	top:10%;
	width:22%;
	height:12%;
}

#tab_3 .info_bg p{
	text-align:center;
}

.character{
	position:absolute;
	top:25%;
	left:5%;
	height:70%;
	width:29%;
	background-repeat:no-repeat !important;
}

#tab_3 .character, #tab_4 .character{
	background:url("../img/illustration_11.png");	
	background-size:100%;
}

.circle{
	position:absolute;
	width:23%;
	height:46%;
	background-repeat:no-repeat !important;
	border-radius:100%;
	border:solid 5px #F4C606;
}

.circle:nth-of-type(3){
	left:50%;
	top:5%;
}

.circle:nth-of-type(4){
	left:70%;
	top:40%;
}

#tab_3 .circle:nth-of-type(3){	
	background:url("../img/IM_S_G04_U05_L02_03_04_02.jpg");
	background-size:cover;
}

#tab_3 .circle:nth-of-type(4){
	background:url("../img/IM_S_G04_U05_L02_03_04_01-01.jpg");
	background-size:cover;
	background-position:0 90%;
}

#tab_3 .header, #tab_5 .header, #tab_7 .header, #tab_9 .header, #tab_11 .header, #tab_13 .header{
	margin-top:6%;
	margin-left:3%;
	width:40%;
	height:11%;
}

#tab_4 .table, #tab_6 .table, #tab_8 .table, #tab_10 .table, #tab_12 .table, #tab_14 .table{
	top:4%;
	height:20%;
}

#tab_4 .table .row, #tab_6 .table .row, #tab_8 .table .row, #tab_10 .table .row, #tab_12 .table .row, #tab_14 .table .row{
	height:44%;
}

.rectangles{
	position:absolute;
	top:27%;
	left:35%;
	width:62%;
	height: 57%;
}

.rectangles > div{
	height:100%;
	width:32.6%;
	display:inline-block;
	float:left;
	background:whitesmoke;
	margin-right:1%;
	border-radius:10px;
	border:solid 5px #F4C606;
	box-sizing:border-box;
  -moz-box-sizing:border-box;
  -webkit-box-sizing:border-box;
  background-repeat:no-repeat !important;
  background-size:cover !important;
}

.rectangles > div:last-of-type{
	margin-right:0;
}

#tab_4 .rectangles > div:first-of-type{
	background:url("../img/IM_S_G04_U05_L02_03_04_03-01.jpg");
}

#tab_4 .rectangles > div:nth-of-type(2){
	background:url("../img/IM_S_G04_U05_L02_03_04_04-01.jpg");
}

#tab_4 .rectangles > div:nth-of-type(3){
	background:url("../img/IM_S_G04_U05_L02_03_04_05-01.jpg");
}

#tab_5 .character, #tab_6 .character{
	background:url("../img/illustration_12.png");	
	background-size:100%;
	top:34%;
}

#tab_5 .circle:nth-of-type(3){
	background:url("../img/IM_S_G04_U05_L02_03_04_07-01.jpg");
	background-size:cover;
}

#tab_5 .circle:nth-of-type(4){
	background:url("../img/IM_S_G04_U05_L02_03_04_06-01.jpg");
	background-size:cover;
}

#tab_6 .rectangles > div:first-of-type{
	background:url("../img/illustration_22.png");
}

#tab_6 .rectangles > div:nth-of-type(2){
	background:url("../img/IM_S_G04_U05_L02_03_04_08-01.jpg");
}

#tab_6 .rectangles > div:nth-of-type(3){
	background:url("../img/IM_S_G04_U05_L02_03_04_09-01.jpg");
}

#tab_7 .character{
	background:url("../img/illustration_13.png");
	background-size:100%;
}

#tab_7 .circle:nth-of-type(3){
	background:url("../img/IM_S_G04_U05_L02_03_04_10-01.jpg");
	background-size:cover;
}

#tab_7 .circle:nth-of-type(4){
	background:url("../img/IM_S_G04_U05_L02_03_04_11-01.jpg");
	background-size:cover;
}

#tab_8 .rectangles > div:first-of-type{
	background:url("../img/illustration_5.png");
}

#tab_8 .rectangles > div:nth-of-type(2){
	background:url("../img/IM_S_G04_U05_L02_03_04_13-01.jpg");
	background-position:50% 50%;
}

#tab_8 .rectangles > div:nth-of-type(3){
	background:url("../img/IM_S_G04_U05_L02_03_04_12-01.jpg");
	background-position:50% 50%;
}

#tab_9 .character{
	background:url("../img/illustration_14.png");
	background-size:100%;
}

#tab_9 .circle:nth-of-type(3){
	background:url("../img/IM_S_G04_U05_L02_03_04_14.jpg");
	background-position:50% 50%;
}

#tab_9 .circle:nth-of-type(4){
	background:url("../img/IM_S_G04_U05_L02_03_04_15.jpg");
	background-position:50% 50%;
}

#tab_10 .rectangles > div:first-of-type{
	background:url("../img/IM_S_G04_U05_L02_03_04_16.jpg");
}

#tab_10 .rectangles > div:nth-of-type(2){
	background:url("../img/illustration_7.png");
}

#tab_10 .rectangles > div:nth-of-type(3){
	background:url("../img/IM_S_G04_U05_L02_03_04_17.jpg");
	background-position:70% 50%;
}

#tab_11 .character{
	background:url("../img/illustration_15.png");
	background-size:100%;
}

#tab_11 .circle:nth-of-type(3){
	background:url("../img/IM_S_G04_U05_L02_03_04_18.jpg");
	background-size:cover;
}

#tab_11 .circle:nth-of-type(4){
	background:url("../img/IM_S_G04_U05_L02_03_04_19.jpg");
	background-position:50% 40%;
}

#tab_12 .rectangles > div:first-of-type{
	background:url("../img/illustration_6.png");
}

#tab_12 .rectangles > div:nth-of-type(2){
	background:url("../img/IM_S_G04_U05_L02_03_04_20.jpg");
}

#tab_12 .rectangles > div:nth-of-type(3){
	background:url("../img/IM_S_G04_U05_L02_03_04_21.jpg");
	background-position:50% 50%;
}

#tab_13 .character{
	background:url("../img/illustration_16.png");
	background-size:100%;
}

#tab_13 .circle:nth-of-type(3){
	background:url("../img/IM_S_G04_U05_L02_03_04_22.JPG");
	background-position:50% 50%;
}

#tab_13 .circle:nth-of-type(4){
	background:url("../img/IM_S_G04_U05_L02_03_04_23.jpg");
	background-size:cover;
	background-position:50% 80%;
}

#tab_14 .rectangles > div:first-of-type{
	background:url("../img/illustration_9.png");
}

#tab_14 .rectangles > div:first-of-type{
	background:url("../img/illustration_9.png");
}

#tab_14 .rectangles > div:nth-of-type(2){
	background:url("../img/IM_S_G04_U05_L02_03_04_25.jpg");
}

#tab_14 .rectangles > div:nth-of-type(3){
	background:url("../img/IM_S_G04_U05_L02_03_04_24.jpg");
}

#tab_1 .btn_next{
	border-radius:10px 10px 0 0;
}

#tab_1 .btn_help{
	border-radius:10px 10px 0 0;
}

#tab_1 .tab_nav{
	left:5%;
}

#tab_2 .btn_audio{
	left:33%;
}

.tab:nth-of-type(odd) .btn_audio{
	left:1.2%;
	border-radius:10px 0 0 0;
}

.btn_home{
	border-radius:0 !important;
}