/* --------------------------------------------------------- */
/*                        Periodic Table                             */
/*                www.periodni.com    2011                   */
/* --------------------------------------------------------- */

h1 {
	margin-top: 30px;
	margin-bottom: 0px;
	text-align: center;
	font: bold 16pt cursive;
	padding: 10px 0px 20px 0px;
}
img {border: 0px;}
li {padding: 5px;}
p {
	margin: 0px 5px 10px 5px;
	padding: 0px 10px 5px 10px;
	font: normal 10pt verdana;
	color: #123456;
}


/* --------------------------------------------------------- */
/*                            GOOGLE                                  */
/* --------------------------------------------------------- */
.google-vrh {
	position: absolute;
	top: 70px;
	left: 150px;
	/* border-top: 1px #cacaba solid; */
}

.google-dno {
	position: relative;
	top: 0px;
	left: 0px;
	text-align: center;
	width: 100%;
	background: #fff;
	padding-top: 10px;
	border-top: 1px #cacaba solid;
	border-bottom: 1px #cacaba solid;
}
.google-link {
	position: absolute;
	top: 70px;
	left: 150px;
	/* border-top: 1px #cacaba solid; */
}

/* --------------------------------------------------------- */

a:link {
	color: #000000;
	text-decoration: none;
 }
a:visited {
	color: #000000;
	text-decoration: none;
 }
a:active {
	color: #000000;
	text-decoration: none;
 }
a:hover {
	color: #00f;
	text-decoration: none;
 }


/* LONG PERIODNI  SUSTAV  ELEMENATA */
/* p = periode    s = skupine    e = elementi*/
.naslov {
	position: relative;
	top: 5px;
	width: 100%;
	color:#800;
	font: bold 18pt cursive;
	text-align: center;
}

.periodni {
	position: relative;
	top: 40px;
	left: 0px;
	width: 750px;
	height: 275px;
}

.ab {
	position: absolute;
	top: 6px;
	width: 100%;
	color: #000;
	font: 8pt serif;
	text-align: center;
}
/* periode */
.p1, .p2, .p3, .p4, .p5, .p6, .p7 {
 position: absolute;
 left: 0px;
 height: 32px;
 width: 20px;
 color: #d00;
 font: bold 10pt serif;
 text-align: center;
 padding-top: 16px;
}
.p1 {top: 9px;}
.p2 {top: 36px;}
.p3 {top: 63px;}
.p4 {top: 90px;}
.p5 {top: 117px;}
.p6 {top: 144px;}
.p7 {top: 171px;}

.e1, .e2, .e3, .e4, .e5, .e6, .e7, .e8, .e9, .e10 , .e11, .e12, .e13, .e14, .e15, .e16, .e17, .e18, .e19, .e20, .e21, .e22, .e23, .e24, .e25, .e26, .e27, .e28, .e29, .e30, .e31, .e32, .e33, .e34, .e35, .e36, .e37, .e38, .e39, .e40, .e41, .e42, .e43, .e44, .e45, .e46, .e47, .e48, .e49, .e50, .e51, .e52, .e53, .e54, .e55, .e56, .e57, .e58, .e59, .e60, .e61, .e62, .e63, .e64, .e65, .e66, .e67, .e68, .e69, .e70, .e71, .e72, .e73, .e74, .e75, .e76, .e77, .e78, .e79, .e80, .e81, .e82, .e83, .e84, .e85, .e86, .e87, .e88, .e89, .e90, .e91, .e92, .e93, .e94, .e95, .e96, .e97, .e98, .e99, .e100, .e101, .e102, .e103, .e104, .e105, .e106, .e107, .e108, .e109, .e110, .e111, .e112, .e57la , .e89ac {
 position: absolute;
 height: 24px;
 width: 24px;
 color: #fff;
 border: 1px outset;
 padding: 0px;
 background: #baeafa;  /*plavo*/
 }
.e80, .e35 {
background: #ffd8a8;}  /*crveno*/
.e1, .e2, .e7, .e8, .e9, .e10, .e17, .e18, .e36, .e54, .e86 {
background: #afc;}  /*zeleno*/
.e57la , .e57, .e58, .e59, .e60, .e61, .e62, .e63, .e64, .e65, .e66, .e67, .e68, .e69, .e70, .e71  {
background: #dbebff;}  /*lantanoidi*/
.e89ac, .e89, .e90, .e91, .e92, .e93, .e94, .e95, .e96, .e97, .e98, .e99, .e100, .e101, .e102, .e103 {
background: #c2e2ff;}  /*aktinoidi*/ 

.e1, .e2 {
top: 20px;}
.e3, .e4, .e5, .e6, .e7, .e8, .e9, .e10 {
top: 47px;}
.e11, .e12, .e13, .e14, .e15, .e16, .e17, .e18 {
top: 74px;}
.e19, .e20, .e21, .e22, .e23, .e24, .e25, .e26, .e27, .e28, .e29, .e30, .e31, .e32, .e33, .e34, .e35, .e36 {
top: 101px;}
.e37, .e38, .e39, .e40, .e41, .e42, .e43, .e44, .e45, .e46, .e47, .e48, .e49, .e50, .e51, .e52, .e53, .e54 {
top: 128px;}
.e55, .e56, .e72, .e73, .e74, .e75, .e76, .e77, .e78, .e79, .e80, .e81, .e82, .e83, .e84, .e85, .e86, .e57la {
top: 155px;}
.e87, .e88, .e104, .e105, .e106, .e107, .e108, .e109, .e110, .e111, .e112, .e89ac  {
top: 182px;}
.e57, .e58, .e59, .e60, .e61, .e62, .e63, .e64, .e65, .e66, .e67, .e68, .e69, .e70, .e71 {
top: 155px;}
.e89, .e90, .e91, .e92, .e93, .e94, .e95, .e96, .e97, .e98, .e99, .e100, .e101, .e102, .e103 {
top: 182px;}

/* skupine */
.s1, .s2, .s3, .s4, .s5, .s6, .s7, .s8, .s9, .s10, .s11, .s12, .s13, .s14, .s15, .s16, .s17, .s18  {
 position: absolute;
 top: 0px;
 height: 32px;
 width: 38px;
 color: #d00;
 font: bold 10pt serif;
 text-align: center;
 } 



.s1 {left: 14px;}
.s2 {left: 40px;}
.s3 {left: 445px;}
.s4 {left: 472px;}
.s5 {left: 499px;}
.s6 {left: 526px;}
.s7 {left: 553px;}
.s8 {left: 580px;}
.s9 {left: 607px;}
.s10 {left: 634px;}
.s11 {left: 661px;}
.s12 {left: 688px;}
.s13 {left: 715px;}
.s14 {left: 742px;}
.s15 {left: 769px;}
.s16 {left: 796px;}
.s17 {left: 823px;}
.s18 {left: 850px;}

.e1, .e3, .e11, .e19, .e37, .e55, .e87 {
left: 20px;}
.e4, .e12, .e20, .e38, .e56, .e88 {
left: 47px;}
.e57, .e89 {
left: 74px;}
.e58, .e90 {
left: 101px;}
.e59, .e91 {
left: 128px;}
.e60, .e92 {
left: 155px;}
.e61, .e93 {
left: 182px;}
.e62, .e94 {
left: 209px;}
.e63, .e95 {
left: 236px;}
.e64, .e96 {
left: 263px;}
.e65, .e97 {
left: 290px;}
.e66, .e98 {
left: 317px;}
.e67, .e99 {
left: 344px;}
.e68, .e100 {
left: 371px;}
.e69, .e101 {
left: 398px;}
.e70, .e102 {
left: 425px;}
.e71, .e103 {
left: 452px;}

.e21, .e39 {
left: 452px;}
.e22, .e40, .e72, .e104 {
left: 479px;}
.e23, .e41, .e73, .e105 {
left: 506px;}
.e24, .e42, .e74, .e106 {
left: 533px;}
.e25, .e43, .e75, .e107 {
left: 560px;}
.e26, .e44, .e76 , .e108 {
left: 587px;}
.e27, .e45, .e77, .e109 {
left: 614px;}
.e28, .e46, .e78, .e110 {
left: 641px;}
.e29, .e47, .e79, .e111 {
left: 668px;}
.e30, .e48, .e80, .e112 {
left: 695px;}
.e5, .e13, .e31, .e49, .e81 {
left: 722px;}
.e6, .e14, .e32, .e50, .e82 {
left: 749px;}
.e7, .e15, .e33, .e51, .e83 {
left: 776px;}
.e8, .e16, .e34, .e52, .e84 {
left: 803px;}
.e9, .e17, .e35, .e53, .e85 {
left: 830px;}
.e2, .e10, .e18, .e36, .e54, .e86 {
left: 857px;}

/*
.vidi {background: #ff0; visibility: visible;}
.nevidi {visibility: hidden;} */
/* -------------------------------------------- */