body {
	background-color: black;
	font-size: 16px;
	margin: 0 auto;
}





/* ============================ */
/* =    PAGINA 1 - FRAME 1    = */
/* ============================ */

#pagina1 {
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
	z-index: 10;
	/*border: 2px dashed orangered;*/
}
#container1 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 10;
	opacity: 1;
}
.continut1 {
	position: absolute;
	display: flex;
	flex-direction: column;
	margin: 0 auto;
	text-align: center;
	align-items: center;
	justify-content: center;
}
.frame1 {
	position: absolute;
	display: block;
	text-align: left;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-image: url("../img/clip1.gif");
	transform: translate(0px, -24px);
	/*border: 2px dashed orangered;*/
}
.buton {
	position: absolute;
	text-decoration: none;
	text-align: center;
	background-color: skyblue;
	border: 3px solid blue;
	border-radius: 10px;
	padding: 5px;
	color: blue;
	cursor: grab;
	width: 100px;
}
.inainte1 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	transform: translate(0px, 300px);
}
.inainte1:hover {
	font-weight: 700;
	background-color: royalblue;
}
.unu, .doi, .trei, .patru {
	position: absolute;
	display: block;
}
.unu {
	transform: translate(-344px, -195px);
}
.doi {
	transform: translate(345px, -195px);
}
.trei {
	transform: translate(-344px, 220px);
}
.patru {
	transform: translate(345px, 220px);
}
.titluri {
	text-align: center;
	margin: 0 auto;
	max-width: 800px;
	color: #a8a8a8;
	font-family: sans-serif;
	font-size: 1.5em;
	transform: translate(0px, -280px);
}
.liceu {
	color: #a8a8a8;
	font-weight: 700;
	padding: 10px;
}









/* ========================================= */
/* =    PAGINA 2 - FRAME 2 (modul-tema)    = */
/* ========================================= */
#pagina2 {
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
	z-index: 0;
}
#container2 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut2 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.inapoi2 {
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	transform: translate(0px, 300px);	
}
.inapoi2:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.frame2 {
	position: absolute;
	display: block;
	text-align: left;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
	/*z-index: 9;*/
	/*border: 2px dashed orangered;*/
}
.modul, .tema, .nota {
	position: absolute;
	display: block;
	color: #080808;
	width: 100%;
	padding: 50px;
}
.triunghi2 {
	position: absolute;
	display: block;
	transform: translate(-375px, -280px);
}
.cuprins2 {
	position: absolute;
	font-size: 1em;
	font-family: sans-serif;
	/*font-weight: 700;*/
	transform: translate(-300px, -280px);
	width: 100px;
}
.cuprins2:hover {
	color: #040abf;
	font-weight: 700;
	background-color: royalblue;
}
.cuprins2-trecere {
	position: absolute;
	font-size: .8em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	color: darkblue;
	background-color: #a8a8a8;
	padding: 5px;
	border: 1px solid darkblue;
	border-radius: 5px;
	transform: translate(-130px, -280px);
	/*transform: translate(-220px, -190px);*/
	opacity: 0;
}
.modul {
	font-size: 1.5em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	transform: translate(0px, -80px);	
}
.tema {
	font-size: 1.5em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	transform: translate(0px, -30px);	
}
.nume {
	position: absolute;
	font-size: 1em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	color: darkblue;
	/*padding: 10px;*/
	cursor: grab;
	transform: translate(0px, 80px);	
}
.nume:hover {
	color: blue;
	background-color: royalblue;
	font-weight: 700;
	padding: 5px;
}
.nume-trecere {
	position: absolute;
	font-size: .8em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	color: darkblue;
	background-color: #a8a8a8;
	padding: 5px;
	border: 1px solid darkblue;
	border-radius: 5px;
	transform: translate(0px, 180px);
	opacity: 0;
}
.consultant {
	position: absolute;
	font-size: 1em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	color: darkblue;
	cursor: grab;
	transform: translate(0px, 110px);	
}
.consultant:hover {
	color: blue;
	background-color: royalblue;
	font-weight: 700;
	padding: 5px;
}
.consultant-trecere {
	position: absolute;
	font-size: .8em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	color: darkblue;
	background-color: #a8a8a8;
	padding: 5px;
	border: 1px solid darkblue;
	border-radius: 5px;
	transform: translate(0px, 180px);
	opacity: 0;
}
.isbn {
	text-decoration: none;
	position: absolute;
	font-size: 1em;
	font-family: sans-serif;
	font-weight: 700;
	/*font-style: italic;*/
	color: black;
	/*padding: 10px;*/
	cursor: grab;
	transform: translate(0px, -230px);	
}
.nota {
	transform: translate(0px, 250px);	
	font-size: .8em;
	font-family: sans-serif;
	font-weight: 400;
	font-style: italic;
	font-stretch: condensed;
	color: #080808;
}
.culoare {
	color: darkblue;
	font-weight: 700;
	cursor: grab;
	padding: 3px;
}
.culoare:hover {
	color: darkblue;
	padding: 3px;
	background-color: royalblue;
}
.trecere {
	/*display: block;*/
	font-size: 1em; 
	font-family: sans-serif;
	width: 100px;
	cursor: grab;
	/*color: darkblue;*/
	/*font-weight: 700;*/
	transform: translate(5px, -7px);
}
.trecere:hover {
	color: blue;
	background-color: royalblue;
	font-weight: 700;
}
.buton-trecere {
	position: absolute;
	font-size: .8em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	color: darkblue;
	background-color: #a8a8a8;
	padding: 5px;
	border: 1px solid darkblue;
	border-radius: 5px;
	transform: translate(160px, 190px);
	opacity: 0;
}
.buton-culoare {
	position: absolute;
	font-size: .8em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	color: darkblue;
	background-color: #a8a8a8;
	padding: 5px;
	border: 1px solid darkblue;
	border-radius: 5px;
	transform: translate(140px, 190px);
	opacity: 0;
}









/* ====================================== */
/* =    PAGINA 3 - FRAME 3 (cuprins)    = */
/* ====================================== */

#pagina3 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
	z-index: 0;
}
#container3 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut3 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame3 {
	position: absolute;
	display: block;
	text-align: left;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
	/*z-index: 9;*/
	/*border: 2px dashed orangered;*/
}
.triunghi3 {
	position: absolute;
	display: block;
	transform: translate(-375px, -280px);
}
.cuprins3 {
	position: absolute;
	font-size: 1em;
	font-family: sans-serif;
	transform: translate(-300px, -280px);
	width: 100px;
}
.cuprins3:hover {
	color: #040abf;
	font-weight: 700;
	background-color: royalblue;
}
.cuprins3-trecere {
	position: absolute;
	font-size: .8em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	color: darkblue;
	background-color: #a8a8a8;
	padding: 5px;
	border: 1px solid darkblue;
	border-radius: 5px;
	transform: translate(-120px, -280px);
	opacity: 0;
}
.inapoi3 {
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	transform: translate(0px, 300px);
}
.inapoi3:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.item-cuprins {
	position: absolute;
	display: block;
}
.referent, .desenare, .editare, .cotarea, .proiectare, .aplicatii, .aplicatie1, .aplicatie2, .aplicatie3, .aplicatie4, .aplicatie5, .aplicatie6, .elev, .directii, .autoevaluare, .studiu, .bibliografie {
	position: absolute;
	display: block;
	text-align: left;
	font-size: 1em;
	font-family: sans-serif;
	font-weight: 700;
	color: #080808;
	width: 400px;
	cursor: grab;
}
.referent {
	transform: translate(-220px, -250px);	
}
.desenare {
	transform: translate(-70px, -210px);
}
.editare {
	transform: translate(-70px, -180px);
}
.cotarea {
	transform: translate(-70px, -150px);
}
.proiectare {
	transform: translate(-70px, -120px);
}
.aplicatii {
	color: darkblue;
	transform: translate(-70px, -90px);
}
.aplicatie1 {
	color: darkblue;
	transform: translate(-40px, -60px);
}
.aplicatie2 {
	color: #16226c;
	transform: translate(-40px, -30px);
}
.aplicatie3 {
	color: darkblue;
	transform: translate(-40px, 0px);
}
.aplicatie4 {
	color: #16226c;
	transform: translate(-40px, 30px);
}
.aplicatie5 {
	color: darkblue;
	transform: translate(-40px, 60px);
}
.aplicatie6 {
	color: #16226c;
	transform: translate(-40px, 90px);
}
.elev {
	color: darkblue;
	transform: translate(-40px, 120px);
}
.directii {
	color: red;
	transform: translate(-70px, 150px);
}
.autoevaluare {
	color: black;
	text-decoration: none;
	transform: translate(-225px, 170px);
}
.studiu {
	transform: translate(-70px, 210px);
}
.bibliografie {
	transform: translate(-70px, 240px);
}
.referent-trecere, .desenare-trecere, .editare-trecere, .cotarea-trecere, .proiectare-trecere, .aplicatii-trecere, .aplicatie1-trecere, .aplicatie2-trecere, .aplicatie3-trecere, .aplicatie4-trecere, .aplicatie5-trecere, .aplicatie6-trecere, .elev-trecere, .autoevaluare-trecere, .studiu-trecere, .bibliografie-trecere {
	position: absolute;
	font-size: .8em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	color: darkblue;
	background-color: #a8a8a8;
	padding: 5px;
	border: 1px solid darkblue;
	border-radius: 5px;
	opacity: 0;
}
.referent-trecere {
	transform: translate(60px, -240px);
}
.desenare-trecere {
	transform: translate(40px, -210px);
}
.editare-trecere {
	transform: translate(20px, -180px);
}
.cotarea-trecere {
	transform: translate(10px, -150px);
}
.proiectare-trecere {
	transform: translate(80px, -120px);
}
.aplicatii-trecere {
	transform: translate(20px, -90px);
}
/*.aplicatie1-trecere {
	transform: translate(270px, -60px);
}
.aplicatie2-trecere {
	transform: translate(270px, -30px);
}
.aplicatie3-trecere {
	transform: translate(270px, 0px);
}
.aplicatie4-trecere {
	transform: translate(270px, 30px);
}
.aplicatie5-trecere {
	transform: translate(270px, 60px);
}
.aplicatie6-trecere {
	transform: translate(270px, 90px);
}*/
/*.elev-trecere {
	transform: translate(170px, 120px);
}*/
.directii-trecere {
	position: absolute;
	font-size: .8em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	color: darkred;
	background-color: #dfbebe;
	padding: 5px;
	border: 1px solid #9e4e4e;
	border-radius: 5px;
	width: 240px;
	opacity: 0;	
	transform: translate(210px, 150px);
}
/*.autoevaluare-trecere {
	transform: translate(70px, 180px);
}*/
/*.studiu-trecere {
	width: 240px;
	transform: translate(270px, 210px);
}*/
/*.bibliografie-trecere {
	width: 240px;
	transform: translate(270px, 240px);
}*/
.bulina00, .bulina01, .bulina02, .bulina03, .bulina04, .bulina05, .bulina06, .bulina07, .bulina08, .bulina09, .bulina10, .bulina11, .bulina12, .bulina13, .bulina14, .bulina15, .bulina16 {
	position: absolute;
}
.bulina00 {
	transform: translate(-285px, -242px);
}
.bulina01 {
	transform: translate(-285px, -212px);
}
.bulina02 {
	transform: translate(-285px, -182px);
}
.bulina03 {
	transform: translate(-285px, -152px);
}
.bulina04 {
	transform: translate(-285px, -122px);
}
.bulina05 {
	transform: translate(-285px, -92px);
}
.bulina06 {
	transform: translate(-255px, -62px);
}
.bulina07 {
	transform: translate(-255px, -32px);
}
.bulina08 {
	transform: translate(-255px, -2px);
}
.bulina09 {
	transform: translate(-255px, 28px);
}
.bulina10 {
	transform: translate(-255px, 58px);
}
.bulina11 {
	transform: translate(-255px, 88px);
}
.bulina12 {
	transform: translate(-255px, 118px);
}
.bulina13 {
	transform: translate(-285px, 148px);
}
.bulina14 {
	transform: translate(-285px, 178px);
}
.bulina15 {
	transform: translate(-285px, 208px);
}
.bulina16 {
	transform: translate(-285px, 238px);
}
.smiley2D {
	transform: translate(170px, -45px);
}
.smiley3D {
	transform: translate(123px, 15px);	
}







/* =============================================== 
/* =    PAGINA 4 - FRAME 4 (Comenzi DESENARE)    = */
/* =============================================== */

#pagina4 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container4 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut4 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame4 {
	position: absolute;
	display: block;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi4 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi4:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.desen {
	position: absolute;
	color: #080808;
	font-weight: 700;
	padding: 10px;
}
.desen-img {
	position: relative;
	display: inline-block;
	/*border: 2px dashed orangered;*/
	transform: translate(0px, 0px);
}
.stiati-ca-desen {
	position: relative;
	display: inline-block;
	text-align: center;
	transform: translate(0px, -230px);
}
.stiati-desen {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	/*z-index: 11;*/
	transform: translate(0px, 0px);	
}
.stiati-desen:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.desen-trecere {
	position: absolute;
	font-size: 0.8em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	color: darkblue;
	width: 120px;
	background-color: #a8a8a8;
	border: 1px solid darkblue;
	border-radius: 5px;
	opacity: 0;
	transform: translate(-5px, 40px);	
}








/* ============================================== */
/* =    PAGINA 5 - FRAME 5 (Comenzi EDITARE)    = */
/* ============================================== */

#pagina5 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container5 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut5 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame5 {
	position: absolute;
	display: block;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
	z-index: 9;
}
.inapoi5 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	z-index: 10;
	transform: translate(0px, 300px);
}
.inapoi5:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.edit {
	position: absolute;
	color: #080808;
	font-weight: 700;
	padding: 10px;
	z-index: 11;
}
.edit-img {
	position: relative;
	display: inline-block;
	/*border: 2px dashed orangered;*/
	z-index: 11;
	transform: translate(0px, 0px);
}
.stiati-ca-edit {
	position: relative;
	display: inline-block;
	text-align: center;
	z-index: 11;
	transform: translate(0px, -230px);
}
.stiati-edit {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	/*z-index: 11;*/
	transform: translate(0px, 0px);	
}
.stiati-edit:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.edit-trecere {
	position: absolute;
	font-size: .8em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	color: darkblue;
	width: 113px;
	background-color: #a8a8a8;
	border: 1px solid darkblue;
	border-radius: 5px;
	opacity: 0;
	transform: translate(0px, 40px);	
}








/* ============================================= */
/* =    PAGINA 6 - FRAME 6 (Comenzi COTARE)    = */
/* ============================================= */

#pagina6 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container6 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut6 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame6 {
	position: absolute;
	display: block;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
	z-index: 9;
}
.inapoi6 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	z-index: 10;
	transform: translate(0px, 300px);
}
.inapoi6:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.cotare {
	position: absolute;
	display: block;
	color: #080808;
	font-weight: 700;
	padding: 10px;
	z-index: 11;
}
.dimension-img {
	position: absolute;
	display: block;
	/*border: 2px dashed orangered;*/
	z-index: 11;
	transform: translate(-60px, -180px);
}

.cotare-img {
	position: absolute;
	display: block;
	/*border: 2px dashed orangered;*/
	z-index: 11;
	transform: translate(0px, 85px);
}
.stiati-ca-cotare {
	position: absolute;
	display: block;
	text-align: center;
	z-index: 11;
	transform: translate(340px, -230px);
}
.stiati-cotare {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	/*z-index: 11;*/
	transform: translate(0px, 0px);	
}
.stiati-cotare:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.cotare-trecere {
	position: absolute;
	font-size: .8em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	color: darkblue;
	width: 113px;
	background-color: #a8a8a8;
	border: 1px solid darkblue;
	border-radius: 5px;
	opacity: 0;
	transform: translate(0px, 40px);	
}









/* ========================================================== */
/* =    PAGINA 7 - FRAME 7 (Proiectarea tridimensionala)    = */
/* ========================================================== */

#pagina7 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container7 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut7 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame7 {
	position: absolute;
	display: block;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi7 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi7:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.proiectarea {
	position: absolute;
	display: block;
	color: #080808;
	font-weight: 700;
	padding: 10px;
}
.proiectarea-img {
	position: absolute;
	display: block;
	/*border: 2px dashed orangered;*/
	transform: translate(-60px, 0px);
}
.stiati-ca-proiectarea {
	position: absolute;
	display: block;
	text-align: center;
	transform: translate(340px, -230px);
}
.stiati-proiectarea {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	transform: translate(0px, 0px);	
}
.stiati-proiectarea:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.proiectarea-trecere {
	position: absolute;
	font-size: .8em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	color: darkblue;
	width: 113px;
	background-color: #a8a8a8;
	border: 1px solid darkblue;
	border-radius: 5px;
	opacity: 0;
	transform: translate(0px, 40px);	
}










/* ============================================================== */
/* =    PAGINA 8 - FRAME 8 (Reprezentarea reperului 1 in 2D)    = */
/* ============================================================== */

#pagina8 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container8 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut8 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame8 {
	position: absolute;
	display: block;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi8 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi8:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.reper1 {
	position: absolute;
	display: block;
	color: #080808;
	font-weight: 700;
	padding: 10px;
}
/*.titlu2 {
	position: absolute;
	text-align: center;
	margin: 0 auto;
	width: 800px;
	color: #080808;
	font-family: sans-serif;
	font-size: 1em;
	transform: translate(-100px, -260px);
}*/
.titlu3 {
	position: absolute;
	text-align: left;
	padding: 10px;
	width: 800px;
	color: #080808;
	font-family: sans-serif;
	font-size: 1em;
	width: 580px;
	transform: translate(-100px, -230px);
}
.titlu4 {
	position: absolute;
	text-align: left;
	padding: 10px;
	width: 800px;
	color: #080808;
	font-family: sans-serif;
	font-size: 1em;
	width: 580px;
	transform: translate(-100px, -200px);
}
.reper1-img {
	position: absolute;
	display: block;
	/*border: 2px dashed orangered;*/
	transform: translate(-265px, 50px);
}
.reper11-img {
	position: absolute;
	display: block;
	/*border: 2px dashed orangered;*/
	transform: translate(70px, 0px);
}
.stiati-ca-reper1 {
	position: absolute;
	display: block;
	text-align: center;
	transform: translate(340px, -230px);
}
.stiati-reper1 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	transform: translate(0px, 0px);	
}
.stiati-reper1:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.reper1-trecere {
	position: absolute;
	font-size: .8em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	color: darkblue;
	width: 113px;
	background-color: #a8a8a8;
	border: 1px solid darkblue;
	border-radius: 5px;
	opacity: 0;
	transform: translate(0px, 40px);	
}
.help1-img {
	position: absolute;
	text-decoration: none;
	text-align: center;
	text-transform: uppercase;
	background-color: #ffd8d8;
	border: 3px solid darkred;
	border-radius: 15px;
	padding: 5px;
	color: darkred;
	cursor: grab;
	width: 120px;
	height: 1.3em;
	font-family: sans-serif;
	font-size: .8em;
	letter-spacing: 5px;
	transform: translate(285px, 220px);	
}
.help1-img:hover {
  background: #ffbfbf;
  font-weight: 900;
  box-shadow: 0 0 5px #ffbfbf,
              0 0 25px #ffbfbf,
              0 0 50px #ffbfbf,
              0 0 100px #ffbfbf;
}










/* ======================================================== */
/* =    PAGINA 9 - FRAME 9 (VIDEO - Realizare Reper 1)    = */
/* ======================================================== */

#pagina9 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container9 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut9 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame9 {
	position: absolute;
	display: block;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi9 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi9:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.vid-reper1 {
	position: absolute;
	display: block;
	color: #080808;
	font-weight: 700;
	padding: 10px;
}
.video-reper1 {
	width: 784px;
	height: 530px;
	z-index: 11;
}
.video-reper {
	width: 784px;
	height: 530px;
	z-index: 11;
}











/* ============================================================== */
/* =    PAGINA 10 - FRAME 10 (Reprezentarea reperului 2 in 2D)    = */
/* ============================================================== */

#pagina10 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container10 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut10 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame10 {
	position: absolute;
	display: block;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi10 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi10:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.reper2 {
	position: absolute;
	display: block;
	color: #080808;
	font-weight: 700;
	padding: 10px;
}
.titlu2 {
	position: absolute;
	text-align: center;
	margin: 0 auto;
	width: 800px;
	color: #080808;
	font-family: sans-serif;
	font-size: 1em;
	transform: translate(0px, -270px);
}
/*.titlu3 {
	transform: translate(0px, -250px);
}
.titlu4 {
	transform: translate(0px, -210px);
}*/
.reper2-img {
	position: absolute;
	display: block;
	/*border: 2px dashed orangered;*/
	transform: translate(-270px, 0px);
}
.reper21-img {
	position: absolute;
	display: block;
	/*border: 2px dashed orangered;*/
	transform: translate(65px, 0px);
}
.stiati-ca-reper2 {
	position: absolute;
	display: block;
	text-align: center;
	transform: translate(340px, -230px);
}
.stiati-reper2 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	transform: translate(0px, 0px);	
}
.stiati-reper2:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.reper2-trecere {
	position: absolute;
	font-size: .8em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	color: darkblue;
	width: 113px;
	background-color: #a8a8a8;
	border: 1px solid darkblue;
	border-radius: 5px;
	opacity: 0;
	transform: translate(0px, 40px);	
}
.help2-img {
	position: absolute;
	text-decoration: none;
	text-align: center;
	text-transform: uppercase;
	background-color: #ffd8d8;
	border: 3px solid darkred;
	border-radius: 15px;
	padding: 5px;
	color: darkred;
	cursor: grab;
	width: 120px;
	height: 1.3em;
	font-family: sans-serif;
	font-size: .8em;
	letter-spacing: 5px;
	transform: translate(285px, 220px);	
}
.help2-img:hover {
  background: #ffbfbf;
  font-weight: 900;
  box-shadow: 0 0 5px #ffbfbf,
              0 0 25px #ffbfbf,
              0 0 50px #ffbfbf,
              0 0 100px #ffbfbf;
}
.zoom-img {
	position: absolute;
	text-decoration: none;
	text-align: center;
	text-transform: uppercase;
	background-color: #ffd8d8;
	border: 3px solid darkred;
	border-radius: 15px;
	padding: 5px;
	color: darkred;
	cursor: grab;
	width: 120px;
	height: 1.3em;
	font-family: sans-serif;
	font-size: .8em;
	letter-spacing: 5px;
	transform: translate(-280px, 220px);	
}
.zoom-img:hover {
  background: #ffbfbf;
  font-weight: 900;
  box-shadow: 0 0 5px #ffbfbf,
              0 0 25px #ffbfbf,
              0 0 50px #ffbfbf,
              0 0 100px #ffbfbf;
}










/* ======================================================== */
/* =    PAGINA 11 - FRAME 11 (VIDEO - Realizare Reper 2)    = */
/* ======================================================== */

#pagina11 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container11 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut11 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame11 {
	position: absolute;
	display: block;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi11 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi11:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.vid-reper2 {
	position: absolute;
	display: block;
	color: #080808;
	font-weight: 700;
	padding: 10px;
}
.video-reper2 {
	width: 784px;
	height: 530px;
	z-index: 11;
}










/* =============================================== */
/* =    PAGINA 12 - FRAME 12 (ZOOM - Reper 2)    = */
/* =============================================== */

#pagina12 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container12 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut12 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame12 {
	position: absolute;
	display: block;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi12 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi12:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.zoom-reper2 {
	position: absolute;
	display: block;
	color: #080808;
	font-weight: 700;
	padding: 10px;
	transform: translate(150px, -280px);
	width: 250px;
}
.zoom-reper2-img {
	height: 590px;
	transform: translate(-186px, -24px);
}
.stiati-ca-zoom {
	position: absolute;
	display: block;
	text-align: center;
	transform: translate(340px, -230px);
}
.stiati-zoom {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	transform: translate(0px, 0px);	
}
.stiati-zoom:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.zoom-trecere {
	position: absolute;
	font-size: .8em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	color: darkblue;
	padding: 5px;
	text-align: justify;
	width: 380px;
	background-color: #a8a8a8;
	border: 1px solid darkblue;
	border-radius: 5px;
	opacity: 0;
	transform: translate(-280px, 40px);	
}










/* ===================================================================================== */
/* =    PAGINA 13 - FRAME 13 (Sarcina de lucru 3 - Reprezentarea reperului 1 in 3D)    = */
/* ===================================================================================== */

#pagina13 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container13 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut13 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame13 {
	position: absolute;
	display: block;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi13 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi13:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.reper3 {
	position: absolute;
	display: block;
	color: #080808;
	font-weight: 700;
	padding: 10px;
}
.reper3-img {
	position: absolute;
	display: block;
	/*border: 2px dashed orangered;*/
	width: 660px;
	transform: translate(-60px, 10px);
}
.stiati-ca-reper3 {
	position: absolute;
	display: block;
	text-align: center;
	transform: translate(340px, -230px);
}
.stiati-reper3 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	transform: translate(0px, 0px);	
}
.stiati-reper3:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.reper3-trecere {
	position: absolute;
	font-size: .8em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	text-align: justify;
	color: darkblue;
	padding: 3px;
	width: 410px;
	background-color: #a8a8a8;
	border: 1px solid darkblue;
	border-radius: 5px;
	opacity: 0;
	transform: translate(-305px, 40px);	
}
.aldin {
	font-weight: 900;
}
.help3-img {
	position: absolute;
	text-decoration: none;
	text-align: center;
	text-transform: uppercase;
	background-color: #ffd8d8;
	border: 3px solid darkred;
	border-radius: 15px;
	padding: 5px;
	color: darkred;
	cursor: grab;
	width: 120px;
	height: 1.3em;
	font-family: sans-serif;
	font-size: .8em;
	letter-spacing: 5px;
	transform: translate(-320px, 225px);	
}
.help3-img:hover {
	background: #ffbfbf;
  	font-weight: 900;
  	box-shadow: 	0 	0 	5px 	#ffbfbf,
              		0 	0 	25px 	#ffbfbf,
              		0 	0 	50px 	#ffbfbf,
              		0 	0 	100px	#ffbfbf;
}









/* ================================================================ */
/* =    PAGINA 14 - FRAME 14 (VIDEO - Realizare Reper 1 in 3D)    = */
/* ================================================================ */

#pagina14 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container14 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut14 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame14 {
	position: absolute;
	display: block;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi14 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi14:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.vid-reper3 {
	position: absolute;
	display: block;
	color: #080808;
	font-weight: 700;
	padding: 10px;
}
.video-reper1-3D {
	width: 784px;
	height: 530px;
	z-index: 11;
}










/* ===================================================================================== */
/* =    PAGINA 15 - FRAME 15 (Sarcina de lucru 3 - Reprezentarea reperului 2 in 3D)    = */
/* ===================================================================================== */

#pagina15 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container15 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut15 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame15 {
	position: absolute;
	display: block;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi15 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi15:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.reper4 {
	position: absolute;
	display: block;
	color: #080808;
	font-weight: 700;
	padding: 10px;
}
.reper4-img {
	position: absolute;
	display: block;
	/*border: 2px dashed orangered;*/
	width: 660px;
	transform: translate(-60px, 25px);
}
.stiati-ca-reper4 {
	position: absolute;
	display: block;
	text-align: center;
	transform: translate(340px, -230px);
}
.stiati-reper4 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	transform: translate(0px, 0px);	
}
.stiati-reper4:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.reper4-trecere {
	position: absolute;
	font-size: .8em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	text-align: justify;
	color: darkblue;
	padding: 3px;
	width: 150px;
	background-color: #a8a8a8;
	border: 1px solid darkblue;
	border-radius: 5px;
	opacity: 0;
	transform: translate(-45px, 40px);	
}
.aldin {
	font-weight: 900;
}
.help4-img {
	position: absolute;
	text-decoration: none;
	text-align: center;
	text-transform: uppercase;
	background-color: #ffd8d8;
	border: 3px solid darkred;
	border-radius: 15px;
	padding: 5px;
	color: darkred;
	cursor: grab;
	width: 120px;
	height: 1.3em;
	font-family: sans-serif;
	font-size: .8em;
	letter-spacing: 5px;
	transform: translate(285px, 208px);	
}
.help4-img:hover {
	background: #ffbfbf;
  	font-weight: 900;
  	box-shadow: 	0 	0 	5px 	#ffbfbf,
              		0 	0 	25px 	#ffbfbf,
              		0 	0 	50px 	#ffbfbf,
              		0 	0 	100px	#ffbfbf;
}









/* ================================================================ */
/* =    PAGINA 16 - FRAME 16 (VIDEO - Realizare Reper 2 in 3D)    = */
/* ================================================================ */

#pagina16 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container16 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut16 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame16 {
	position: absolute;
	display: block;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi16 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi16:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.vid-reper4 {
	position: absolute;
	display: block;
	color: #080808;
	font-weight: 700;
	padding: 10px;
}
.video-reper2-3D {
	width: 784px;
	height: 530px;
	z-index: 11;	
}











/* ============================================== */
/* =    PAGINA 17 - FRAME 17 (Buna practica)    = */
/* ============================================== */

#pagina17 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container17 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut17 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame17 {
	position: absolute;
	display: block;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi17 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi17:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.titlu-elev {
	position: absolute;
	display: block;
	color: #080808;
	font-weight: 700;
	padding: 10px;
	transform: translate(275px, -260px);
}
.elev-img {
	position: absolute;
	display: block;
	/*border: 2px dashed orangered;*/
	height: 590px;
	transform: translate(-120px, -25px);
}
.stiati-ca-elev {
	position: absolute;
	display: block;
	text-align: center;
	transform: translate(340px, -230px);
}
.stiati-elev {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	transform: translate(0px, 0px);	
}
.stiati-elev:hover {
	font-weight: 700;
	background-color: royalblue;	
}
/*.elev-trecere {
	position: absolute;
	font-size: .8em;
	font-family: sans-serif;
	font-weight: 700;
	font-style: italic;
	text-align: justify;
	color: darkblue;
	padding: 3px;
	background-color: #a8a8a8;
	border: 1px solid darkblue;
	border-radius: 5px;
	opacity: 0;
	transform: translate(-30px, 40px);	
}*/
.aldin {
	font-weight: 900;
}
.elev-help-img {
	position: absolute;
	text-decoration: none;
	text-align: center;
	text-transform: uppercase;
	background-color: #ffd8d8;
	border: 3px solid darkred;
	border-radius: 15px;
	padding: 5px;
	color: darkred;
	cursor: grab;
	width: 120px;
	height: 1.3em;
	font-family: sans-serif;
	font-size: .8em;
	letter-spacing: 5px;
	transform: translate(275px, 210px);	
}
.elev-help-img:hover {
	background: #ffbfbf;
  	font-weight: 900;
  	box-shadow: 	0 	0 	5px 	#ffbfbf,
              		0 	0 	25px 	#ffbfbf,
              		0 	0 	50px 	#ffbfbf,
              		0 	0 	100px	#ffbfbf;
}









/* ================================================================ */
/* =    PAGINA 18 - FRAME 18 (VIDEO - Realizare Reper 2 in 3D)    = */
/* ================================================================ */

#pagina18 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container18 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut18 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame18 {
	position: absolute;
	display: block;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi18 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi18:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.vid-reper8 {
	position: absolute;
	display: block;
	color: #080808;
	font-weight: 700;
	padding: 10px;
}
.video-elev {
	width: 784px;
	height: 430px;
	z-index: 11;	
}











/* ====================================================== */
/* =    PAGINA 19 - FRAME 19 (Transdisciplinaritate)    = */
/* ====================================================== */

#pagina19 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container19 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut19 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 5px;
	margin: 0 auto;
}
.frame19 {
	position: absolute;
	display: block;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi19 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi19:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.titlu-trans {
	position: absolute;
	display: block;
	color: #080808;
	font-weight: 700;
	padding: 10px;
}
hr.subliniat {
  	border: 3px solid green;
 	border-radius: 5px;
	width:75%;
	text-align: center;
}
.left-place {
	/*position: absolute;*/
	display: block;
	float: left;
	color: #080808;
	font-weight: 700;
	/*padding: 5px;*/
	/*border: 1px solid darkblue;*/
	font-family: sans-serif;
	width: 300px;
	height: 500px;
	margin: 5px;
	z-index: 10;
}
.center-place {
	/*position: absolute;*/
	display: block;
	float: left;
	color: #080808;
	font-weight: 700;
	/*padding: 5px;*/
	/*border: 1px solid darkred;*/
	font-family: sans-serif;
	width: 170px;
	height: 500px;
	margin: 5px;
	z-index: 10;
}
.right-place {
	/*position: absolute;*/
	display: block;
	float: left;
	color: #080808;
	font-weight: 700;
	/*padding: 5px;*/
	/*border: 1px solid orangered;*/
	font-family: sans-serif;
	width: 300px;
	height: 500px;
	margin: 5px;
	z-index: 10;
}
.mate {
	color: darkblue;
	font-weight: 700;
	padding: 5px;
	border: 5px solid darkblue;
	border-radius: 15px;	
	height: 230px;
	margin: 5px;
	margin-bottom: 10px;
}
.mate-scris {
	font-weight: 400;
	font-size: 1em;
	text-align: left;
	padding: 5px;
}
.mate-titlu {
	font-weight: 900;
	font-size: 1em;
	font-style: italic;
	text-transform: uppercase;
	text-align: center;
	border: 1px solid darkblue;
	border-radius: 5px;
	background-color: skyblue;
	padding: 5px;
	width: 140px;
}
.titlu-scris {
	font-weight: 700;
}
.mate-smiley {
	position: absolute;
	transform: translate(45%, -5px);
	width: 80px;
}
.mate-go-img {
	position: absolute;
	text-decoration: none;
	text-align: center;
	text-transform: uppercase;
	background-color: #ffd8d8;
	border: 3px solid darkred;
	border-radius: 10px;
	padding: 5px;
	color: darkred;
	cursor: grab;
	width: 50px;
	font-family: sans-serif;
	font-size: .8em;
	/*letter-spacing: 5px;*/
	height: 1.3em;
	transform: translate(150%, 190px);	
}
.mate-go-img:hover {
	background: #ffbfbf;
  	font-weight: 900;
  	box-shadow: 	0 	0 	5px 	#ffbfbf,
              		0 	0 	25px 	#ffbfbf,
              		0 	0 	50px 	#ffbfbf,
              		0 	0 	100px	#ffbfbf;
}
.fizi {
	color: darkgreen;
	font-weight: 700;
	padding: 5px;
	border: 5px solid darkgreen;
	border-radius: 15px;	
	height: 230px;
	margin: 5px;
	margin-top: 10px;
}
.fizi-scris {
	font-weight: 400;
	font-size: 1em;
	text-align: left;
	padding: 5px;
}
.fizi-titlu {
	font-weight: 900;
	font-size: 1em;
	font-style: italic;
	text-transform: uppercase;
	text-align: center;
	border: 1px solid darkgreen;
	border-radius: 5px;
	background-color: lightgreen;
	padding: 5px;
	width: 140px;
}
.fizi-smiley {
	position: absolute;
	transform: translate(85%, -5px);
	width: 80px;
}
.trans-fizica-go {
	position: absolute;
	text-decoration: none;
	text-align: center;
	text-transform: uppercase;
	background-color: #ffd8d8;
	border: 3px solid darkred;
	border-radius: 10px;
	padding: 5px;
	color: darkred;
	cursor: grab;
	width: 50px;
	font-family: sans-serif;
	font-size: .8em;
	/*letter-spacing: 5px;*/
	height: 1.3em;
	transform: translate(150%, 190px);	
}
.trans-fizica-go:hover {
	background: #ffbfbf;
  	font-weight: 900;
  	box-shadow: 	0 	0 	5px 	#ffbfbf,
              		0 	0 	25px 	#ffbfbf,
              		0 	0 	50px 	#ffbfbf,
              		0 	0 	100px	#ffbfbf;
}
.trans-reper1 {
	margin: 5px;
}
.trans-rep1-3d {
	margin: 5px;
}
.des-teh {
	color: SaddleBrown;
	font-weight: 700;
	padding: 5px;
	border: 5px solid SaddleBrown;
	border-radius: 15px;	
	height: 230px;
	margin: 5px;
	margin-bottom: 10px;
}
.des-teh-scris {
	font-weight: 400;
	font-size: 1em;
	text-align: left;
	padding: 5px;
}
.des-teh-titlu {
	font-weight: 900;
	font-size: 1em;
	font-style: italic;
	text-transform: uppercase;
	text-align: center;
	border: 1px solid DarkGoldenRod;
	border-radius: 5px;
	background-color: bisque;
	padding: 5px;
	width: 140px;
}
.des-teh-smiley {
	position: absolute;
	transform: translate(45%, -5px);
	width: 80px;
}
.trans-desen-go {
	/*position: absolute;*/
	text-decoration: none;
	text-align: center;
	text-transform: uppercase;
	background-color: #ffd8d8;
	border: 3px solid darkred;
	border-radius: 10px;
	padding: 5px;
	color: darkred;
	cursor: grab;
	width: 50px;
	font-family: sans-serif;
	font-size: .8em;
	/*letter-spacing: 5px;*/
	height: 1.3em;
	transform: translate(150%, 190px);	
}
.trans-desen-go:hover {
	background: #ffbfbf;
  	font-weight: 900;
  	box-shadow: 	0 	0 	5px 	#ffbfbf,
              		0 	0 	25px 	#ffbfbf,
              		0 	0 	50px 	#ffbfbf,
              		0 	0 	100px	#ffbfbf;
}
.tic {
	color: darkred;
	font-weight: 700;
	padding: 5px;
	border: 5px solid darkred;
	border-radius: 15px;	
	height: 230px;
	margin: 5px;
	margin-top: 10px;
}
.tic-scris {
	font-weight: 400;
	font-size: 1em;
	text-align: left;
	padding: 5px;
}
.tic-titlu {
	font-weight: 900;
	font-size: 1em;
	font-style: italic;
	text-transform: uppercase;
	text-align: center;
	border: 1px solid darkred;
	border-radius: 5px;
	background-color: #ffcccc;
	padding: 5px;
	width: 140px;
}
.tic-smiley {
	position: absolute;
	transform: translate(110%, -5px);
	width: 80px;
}
.tic-go-img {
	position: absolute;
	text-decoration: none;
	text-align: center;
	text-transform: uppercase;
	background-color: #ffd8d8;
	border: 3px solid darkred;
	border-radius: 10px;
	padding: 5px;
	color: darkred;
	cursor: grab;
	width: 50px;
	font-family: sans-serif;
	font-size: .8em;
	/*letter-spacing: 5px;*/
	height: 1.3em;
	transform: translate(-35px, 190px);	
}
.tic-go-img:hover {
	background: #ffbfbf;
  	font-weight: 900;
  	box-shadow: 	0 	0 	5px 	#ffbfbf,
              		0 	0 	25px 	#ffbfbf,
              		0 	0 	50px 	#ffbfbf,
              		0 	0 	100px	#ffbfbf;
}
.help-tic-go-img {
	opacity: 0;	
	background-color: #ffcccc;
	border: 1px solid darkred;
	border-radius: 5px;
	transform: translate(0px, -65px);
}










/* ====================================================== */
/* =    PAGINA 20 - FRAME 20 (Sarcina de lucru 5)    = */
/* ====================================================== */

#pagina20 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container20 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut20 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame20 {
	position: absolute;
	display: block;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi20 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi20:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.titlu-aplic5 {
	position: absolute;
	display: block;
	color: #080808;
	font-weight: 700;
	padding: 10px;
	/*transform: translate(275px, -260px);*/
}
.aplic5-img {
	position: relative;
	display: block;
	left: 0;
	top: 0;
	margin: 0, auto;
	transform: translate(0px, 45px);
}
.aplic5-help-img {
	position: absolute;
	text-decoration: none;
	text-align: center;
	text-transform: uppercase;
	background-color: #ffd8d8;
	border: 3px solid darkred;
	border-radius: 15px;
	padding: 5px;
	color: darkred;
	cursor: grab;
	width: 120px;
	height: 1.3em;
	font-family: sans-serif;
	font-size: .8em;
	letter-spacing: 5px;
	transform: translate(280px, 200px);	
}
.aplic5-help-img:hover {
	background: #ffbfbf;
  	font-weight: 900;
  	box-shadow: 	0 	0 	5px 	#ffbfbf,
              		0 	0 	25px 	#ffbfbf,
              		0 	0 	50px 	#ffbfbf,
              		0 	0 	100px	#ffbfbf;
}
.vid-aplic5 {
	position: absolute;
	display: block;
	color: #080808;
	font-weight: 700;
	padding: 10px;
}
.video-aplic5-reper {
	position: absolute;
	display: block;
	color: #080808;
	font-weight: 700;
	padding: 10px;
	width: 784px;
	height: 530px;
	transform: translate(10px, 0px);
}










/* ====================================================== */
/* =    PAGINA 29 - FRAME 29 (Sarcina de lucru 6)    = */
/* ====================================================== */

#pagina29 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container29 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut29 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame29 {
	position: absolute;
	display: block;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi29 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi29:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.titlu-aplic6 {
	position: absolute;
	display: block;
	color: #080808;
	font-weight: 700;
	padding: 10px;
	/*transform: translate(275px, -260px);*/
}
.aplic6-img {
	position: relative;
	display: block;
	left: 0;
	top: 0;
	margin: 0, auto;
	transform: translate(0px, 45px);
}
.aplic6-help-img {
	position: absolute;
	text-decoration: none;
	text-align: center;
	text-transform: uppercase;
	background-color: #ffd8d8;
	border: 3px solid darkred;
	border-radius: 15px;
	padding: 5px;
	color: darkred;
	cursor: grab;
	width: 120px;
	height: 1.3em;
	font-family: sans-serif;
	font-size: .8em;
	letter-spacing: 5px;
	transform: translate(280px, 200px);	
}
.aplic6-help-img:hover {
	background: #ffbfbf;
  	font-weight: 900;
  	box-shadow: 	0 	0 	5px 	#ffbfbf,
              		0 	0 	25px 	#ffbfbf,
              		0 	0 	50px 	#ffbfbf,
              		0 	0 	100px	#ffbfbf;
}
.vid-aplic6 {
	position: absolute;
	display: block;
	color: #080808;
	font-weight: 700;
	padding: 10px;
}
.video-aplic6-reper {
	position: absolute;
	display: block;
	color: #080808;
	font-weight: 700;
	padding: 10px;
	width: 784px;
	height: 530px;
	transform: translate(10px, 0px);
}
/* ========================================================= */
/* =    PAGINA 30 - FRAME 30 (Video sarcina de lucru 5)    = */
/* ========================================================= */

#pagina30 {
	clear: both;
	display: flex;
	width: 99%;
	align-items: center;
	justify-content: center;
}
#container30 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	z-index: 0;
	opacity: 0;
}
.continut30 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
}
.frame30 {
	position: absolute;
	display: block;
	text-align: left;
	margin-top: 0;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(10px, -24px);
}
.inapoi30 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(10px, 300px);
}
.inapoi30:hover {
	font-weight: 700;
	background-color: royalblue;	
}
/*.titlu-trans-tic {
	position: absolute; 
    display: block; 
    text-align: center;
    width: 780px;
    height: 100px;
    font-weight: 900; 
    font-size: 1.6em; 
    text-align: center; 
    color: darkred;
    transform: translate(0px, -265px);
}
.scris-trans-tic {
    display: block;
    position: absolute;
    text-align: justify;
    width: 780px;
    font-size: 1.1em;
    font-family: sans-serif;
    font-weight: 500;
    color: darkred;
    transform: translate(0px, -110px);
}
hr.subliniat-tic {
  	border: 3px solid darkred;
 	border-radius: 5px;
	width:420px;
	text-align: center;
}
*/











/* ============================================================== */
/* =    PAGINA 21 - FRAME 21 (Directii de abordare              = */
/* =                          interdisciplinara. MATEMATICA)    = */
/* ============================================================== */

#pagina21 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container21 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut21 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame21 {
	position: absolute;
	display: block;
	text-align: left;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi21 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi21:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.titlu-trans-mate1 {
	position: absolute; */
    display: block; 
    text-align: left;
    width: 680px;
    height: 250px;
    /* font-weight: 900; */
    /* font-size: 1.3em; */
    /* text-align: center; */
    color: darkblue;
    transform: translate(-55px, -199px);
}
.titlu-trans-mate11 {
	/*position: absolute;*/
	/*display: block;*/
	text-align: left;
	font-weight: 900;
	font-size: 1.3em;
	text-align: left;
	color: darkblue;
	/*transform: translate(0px, -110px);	*/
}
.titlu-trans-mate2 {
	position: absolute; */
    display: block; 
    text-align: left;
    width: 680px;
    height: 250px;
    /* font-weight: 900; */
    /* font-size: 1.3em; */
    /* text-align: center; */
    color: darkblue;
    transform: translate(-55px, 70px);
}
.titlu-trans-mate21 {
	/*position: absolute;*/
	/*display: block;*/
	text-align: left;
	font-weight: 900;
	font-size: 1.3em;
	text-align: left;
	color: darkblue;
	/*transform: translate(0px, -110px);	*/
}
.cerc {
	width: 200px;
    height: 200px;
    transform: translate(0px, 0px);
}
.cilindru {
	transform: translate(0px, 0px);
}
.scris-cerc {
    text-align: left;
    width: 490px;
    font-size: .9em;
    font-weight: 500;
    color: royalblue;
    transform: translate(180px, -170px);
}
.scris-cilindru {
    text-align: left;
    width: 550px;
    font-size: .9em;
    font-weight: 500;
    color: royalblue;
    transform: translate(180px, -230px);
}
hr.subliniat-mate1 {
  	border: 3px solid darkblue;
 	border-radius: 5px;
	width:420px;
	float: left;
}
hr.subliniat-mate2 {
  	border: 3px solid darkblue;
 	border-radius: 5px;
	width: 510px;
	float: left;
}
.stiati-ca-trans-mate {
	position: absolute;
	display: block;
	text-align: center;
	transform: translate(340px, -230px);
}
.stiati-trans-mate {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	transform: translate(0px, 0px);	
}
.stiati-trans-mate:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.trans-mate-trecere {
	position: absolute;
	/*font-size: .8em;*/
	/*font-family: sans-serif;*/
	/*font-weight: 700;*/
	/*font-style: italic;*/
	/*text-align: justify;*/
	/*color: darkblue;*/
    padding: 3px;
    width: 670px;
    height: 585px;
    background-color: #a8a8a8;
    border: 1px solid darkblue;
    border-radius: 5px;
    opacity: 0;
    transform: translate(-680px, -180px);
}
.titlu-mate-trecere {
	font-size: 1.3em;
	font-family: sans-serif;
	font-weight: 900;
	font-style: italic;
	text-align: center;
	color: darkblue;	
}
.img-trans-mate-trec {
	display: inline-block;
	float: left;
    width: 670px;
    height: 510px;
}
.scris-trans-mate-trec {
	font-size: 1em;
	font-family: sans-serif;
	font-weight: 500;
	/*font-style: italic;*/
	text-align: justify;
	color: darkblue;	
    transform: translate(0px, -175px);
    padding: 10px;
}












/* ========================================================== */
/* =    PAGINA 22 - FRAME 22 (Directii de abordare          = */
/* =                          interdisciplinara. FIZICA)    = */
/* ========================================================== */

#pagina22 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container22 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut22 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame22 {
	position: absolute;
	display: block;
	text-align: left;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi22 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi22:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.titlu-trans-fizica {
	position: absolute; */
    display: block; 
    text-align: center;
    width: 780px;
    height: 100px;
    font-weight: 900; 
    font-size: 1.6em; 
    text-align: center; 
    color: darkgreen;
    transform: translate(0px, -265px);
}
.scris-fizica-trans {
    text-align: justify;
    width: 780px;
    font-size: .9em;
    font-weight: 500;
    color: darkgreen;
    transform: translate(0px, 0px);
}
hr.subliniat-fizica {
  	border: 3px solid darkgreen;
 	border-radius: 5px;
	width:420px;
	text-align: center;
}
.formula-fizica {
    text-align: center;
    width: 780px;
    font-size: 1em;
    font-weight: 700;
    color: darkgreen;
    /*transform: translate(0px, 0px);	*/
}












/* ========================================================================= */
/* =    PAGINA 23 - FRAME 23 (Directii de abordare                         = */
/* =                          interdisciplinara. DESEN TEHNIC - pag. 1)    = */
/* ========================================================================= */

#pagina23 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container23 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut23 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame23 {
	position: absolute;
	display: block;
	text-align: left;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi23 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi23:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.titlu-trans-desen {
	position: absolute; */
    display: block; 
    text-align: center;
    width: 780px;
    height: 100px;
    font-weight: 900; 
    font-size: 1.6em; 
    text-align: center; 
    color: SaddleBrown;
    transform: translate(0px, -265px);
}
.scris-desen-trans {
    text-align: justify;
    width: 780px;
    font-size: .7em;
    font-weight: 500;
    color: SaddleBrown;
    transform: translate(0px, 0px);
}
hr.subliniat-desen {
  	border: 3px solid SaddleBrown;
 	border-radius: 5px;
	width:420px;
	text-align: center;
}
.hasuri {
	display: inherit;
    text-align: center;
    margin: 0 auto;
    /*width: 780px;*/
    /*font-size: 1em;*/
    /*font-weight: 700;*/
    /*color: darkgoldenrod;*/
    transform: translate(0px, -20px);	
}
.paragraf-desen {
    transform: translate(0px, -20px);	
}
.trans-desen-go-img {
	position: absolute;
	text-decoration: none;
	text-align: center;
	text-transform: uppercase;
	background-color: #ffd8d8;
	border: 3px solid darkred;
	border-radius: 10px;
	padding: 5px;
	color: darkred;
	cursor: grab;
	width: 50px;
	font-family: sans-serif;
	font-size: .8em;
	/*letter-spacing: 5px;*/
	height: 1.3em;
	transform: translate(0px, 230px);
}
.trans-desen-go-img:hover {
	background: #ffbfbf;
  	font-weight: 900;
  	box-shadow: 	0 	0 	5px 	#ffbfbf,
              		0 	0 	25px 	#ffbfbf,
              		0 	0 	50px 	#ffbfbf,
              		0 	0 	100px	#ffbfbf;
}
















/* ========================================================================= */
/* =    PAGINA 24 - FRAME 24 (Directii de abordare                         = */
/* =                          interdisciplinara. DESEN TEHNIC - pag. 2)    = */
/* ========================================================================= */

#pagina24 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container24 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut24 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame24 {
	position: absolute;
	display: block;
	text-align: left;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi24 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi24:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.titlu-trans-desen2 {
	position: absolute; */
    display: block; 
    text-align: center;
    width: 780px;
    height: 100px;
    font-weight: 900; 
    font-size: 1.6em; 
    text-align: center; 
    color: SaddleBrown;
    transform: translate(0px, -265px);
}
.scris-desen-trans2 {
    display: block;
    position: absolute;
    text-align: justify;
    width: 780px;
    font-size: 1.1em;
    font-family: sans-serif;
    font-weight: 500;
    color: SaddleBrown;
    transform: translate(0px, -110px);
}
hr.subliniat-desen2 {
  	border: 3px solid SaddleBrown;
 	border-radius: 5px;
	width:420px;
	text-align: center;
}
.trans-desen-cotare {
    transform: translate(155px, 175px);	
}
















/* ========================================================= */
/* =    PAGINA 25 - FRAME 25 (Video sarcina de lucru 5)    = */
/* ========================================================= */

#pagina25 {
	clear: both;
	display: flex;
	width: 99%;
	align-items: center;
	justify-content: center;
}
#container25 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	z-index: 0;
	opacity: 0;
}
.continut25 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
}
.frame25 {
	position: absolute;
	display: block;
	text-align: left;
	margin-top: 0;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(10px, -24px);
}
.inapoi25 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(10px, 300px);
}
.inapoi25:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.titlu-trans-tic {
	position: absolute; 
    display: block; 
    text-align: center;
    width: 780px;
    height: 100px;
    font-weight: 900; 
    font-size: 1.6em; 
    text-align: center; 
    color: darkred;
    transform: translate(0px, -265px);
}
.scris-trans-tic {
    display: block;
    position: absolute;
    text-align: justify;
    width: 780px;
    font-size: 1.1em;
    font-family: sans-serif;
    font-weight: 500;
    color: darkred;
    transform: translate(0px, -110px);
}
hr.subliniat-tic {
  	border: 3px solid darkred;
 	border-radius: 5px;
	width:420px;
	text-align: center;
}















/* ================================================== */
/* =    PAGINA 26 - FRAME 26 (Studiu individual)    = */
/* ================================================== */

#pagina26 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container26 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut26 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame26 {
	position: absolute;
	display: block;
	text-align: left;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi26 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi26:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.titlu-studiu-individual {
	position: absolute; */
    display: block; 
    text-align: center;
    width: 780px;
    height: 100px;
    font-weight: 900; 
    font-size: 1.6em; 
    text-align: center; 
    color: black;
    transform: translate(0px, -265px);
}
.scris-studiu-individual {
    display: block;
    position: absolute;
    text-align: justify;
    width: 780px;
    font-size: 1.1em;
    font-family: sans-serif;
    font-weight: 500;
    color: black;
    transform: translate(0px, -110px);
}
hr.subliniat-studiu-individual {
  	border: 3px solid black;
 	border-radius: 5px;
	width:420px;
	text-align: center;
}
/*.trans-desen-cotare {
    transform: translate(155px, 175px);	
}
*/














/* =========================================== */
/* =    PAGINA 28 - FRAME 28 (Biliografie)   = */
/* =========================================== */

#pagina28 {
	clear: both;
	display: flex;
	max-width: 100%;
	/*width: 99%;*/
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
#container28 {
	position: absolute;
	display: flex;
	flex-direction: column;
	top: 0;
	width: 800px;
	height: 650px;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	/*border: 2px dashed skyblue;*/
	z-index: 0;
	opacity: 0;
}
.continut28 {
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	margin: 0 auto;
}
.frame28 {
	position: absolute;
	display: block;
	text-align: left;
	margin: 0 auto;
	width: 800px;
	height: 600px;
	background-color: #cccccc;
	transform: translate(0px, -24px);
}
.inapoi28 {
	position: absolute;
	display: block;
	font-size: 1em; 
	font-family: sans-serif;
	text-align: center;
	transform: translate(0px, 300px);
}
.inapoi28:hover {
	font-weight: 700;
	background-color: royalblue;	
}
.bibliograf {
	position: absolute;
	display: block;	
	color: #080808;
	font-weight: 700;
	padding: 10px;
}
.biblio {
	position: absolute;
	text-align: justify;
	color: #080808;
	font-family: sans-serif;
	font-size: 1em;
	font-weight: 700;
	padding: 10px;
}
.biblio1 {
	transform: translate(0px, -200px);	
}
.biblio2 {
	transform: translate(0px, -150px);	
}
.biblio3 {
	transform: translate(0px, -100px);	
}
.biblio4 {
	transform: translate(0px, -50px);	
}