/*
 Najvažnije mjere su:
 
	Calendars
	Calendar 
		calendar - veličina jednog mjeseca - okvira, blocka
				 - treba dobro pogoditi min-height jer inače mj s najvećom visinom (height) floata čudno
		s100	- font-size
				- height (sprječi krivo crtanje td-a zbog border-radiusa)
		td		- width i min-height veličina ćelije
				- ako se promijene width i min-height - treba se u calendar podesiti
				min-height
	
	Studenti
	Student
		width i min-height definiraju veličinu slike
		max-height - da svi imaju isto bijelo polje u kojem jesu
*/

* {
    font-family: Tahoma, serif;
	font-size: 16px;
    box-sizing: border-box;
	/*border: 1px dotted #ff0000;*/
}

.row::after {
    clear: both;
    /*display: table;*/
}

[class*="col-"] {
	margin: 0;
	padding: 0;
    float: left;
}

input {
	z-index: 10001;
}

.nofloat {
	float: none;
	clear: both;
}

.tag1 {
	width: 1px;
	height: 1px;
}

html {
	min-height: 1000px;
	background-color: #eeeeee;
}

body {
	display: block;
	position: relative;
	font-family: Tahoma;
	font-size: 1rem;
	width: 100vw;
	min-height: 100%;
	margin: 0;
	padding: 0;
	background-color: #eeeeee;
	z-index: 1;
}



/*:root {
  --scolor1: #fb7756;
  --scolor2: #facd60;
  --scolor3: #fdfa60;
  --scolor4: #a1c0c6;
  --scolor5: #fdd2b7;
}

/* sc = studentcolor - kratki naziv jer ide an puno mjesta */
/*.bc1 {background-color: #d53e4f75;}
.bc2 {background-color: #e6f59875;}
.bc3 {background-color: #f46d4375;}
.bc4 {background-color: #abdda475;}
.bc5 {background-color: #fdae6175;}
.bc6 {background-color: #66c2a575;}
.bc7 {background-color: #fee06b75;}
.bc8 {background-color: #3288bd75;}*/

/* sc = studentcolor - kratki naziv jer ide an puno mjesta */
.bc1 {background-color: #ff000070; color: #000000;}
.bc2 {background-color: #00ffff70; color: #000000;}
.bc3 {background-color: #80ff0070; color: #000000;}
.bc4 {background-color: #8000ff70; color: #000000;}
.bc5 {background-color: #ffff0070; color: #000000;}
.bc6 {background-color: #0000ff70; color: #000000;}
.bc7 {background-color: #00ff8070; color: #000000;}
.bc8 {background-color: #ff00ff70; color: #000000;}

.bbc1 {border: 4px solid #ff000070;}
.bbc2 {border: 4px solid #00ffff70;}
.bbc3 {border: 4px solid #80ff0070;}
.bbc4 {border: 4px solid #8000ff70;}
.bbc5 {border: 4px solid #ffff0070;}
.bbc6 {border: 4px solid #0000ff70;}
.bbc7 {border: 4px solid #00ff8070;}
.bbc8 {border: 4px solid #ff00ff70;}







.s100  {
	display: block;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	background-color: #ffffff50;
	z-index: 200;
}
.s100:hover {
	background-color: #00000033;
	z-index: 200;
}
.dt {
	position: apsolute;
	display: block;
	font-size: 0.8rem;
	font-weight: normal;
	top: 1px;
	left: 1px;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	z-index: 201;
}

.smallico {
	display: inline-block;
	width: 50px;
	height: 50px;
	margin: 0 38%;
	opacity: 0.5;
}
.smallico img {
	width: 100%;
	height: auto;
}
h1 {
	font-size: 1.4rem;
	margin-top: 40px;
}
h2 {
	font-size: 1.2rem;
}

a {
	font-weight: bold;
	text-decoration: none;
}

hr {
	border: 1px solid #bbbbbb;
}

#container {
	width: 100vw;
}

#dim {
	display: none;
	position: absolute;
	top: 1px;
	left: 1px;
	width: 100%;
	height: 100%;
	background: rgb(100,100,100,0.6);
	z-index: 10;
	cursor: not-allowed;
}

#aai {
	position: absolute;
	font-size: 0.9rem;
	font-weight: bold;
	top: -30px;
	right: 2px;
	padding: 3px 5px;
	margin: 1px;
	color: #000000;
	background-color: #8cd6ff;
	border: 1px solid #000044;
	border-radius: 10px;
}

class .rel {
	position: relative;
}

.calendar table {
/*    box-shadow: 0 1px 3px rgba(0,0,0,0.6), 0 1px 2px rgba(0,0,0,0.12);*/
	width: 20vw;
	overflow: hidden;
}

.calendar .dayoffmonth {
	background-color: rgba(255,255,255,0.8);
}
	
.calendar th {
	background-color: rgb(253,205,175,1);
}
.calendar .hasdata {
	background-color: rgb(255,0,0,0.1);
	font-weight: bold;
}
.calendar .hasdata:hover {
	background-color: rgb(255,0,0,0.5);
}
.calendar .chosenday {
	border: 3px solid rgb(255,0,0,0.5);
	border-radius: 50%;
	color: #000000;
}
.calendar .chosenday a {
	color: #000000;
}
.calendar .weekend {
	background-color: rgb(71,170,215,1);
	color: #444444;
}
.calendar .dayoffmonth {
	background-color: rgb(255,255,255,0.3);
}
.calendar th {
	height: 2.2rem;
}
.calendar a {
	font-size: inherit;
	font-weight: normal;
	color: #000000;
	text-decoration: none;
}
.calendar .cell-is-link, #hours .cell-is-link {
	position: absolute;
	display: block;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;	
	font-size: inherit;
	color: #000000;
	text-align: center;
	padding-top: 0.5rem;
	text-decoration: none;
	background-color: rgb(255,255,255,0.3);
	cursor: zoom-in;
}

#container_klinikestudenti {
	display: block;
	width: 100vw;
	height: auto;
}
	
.studenti {
}
.student {
	/*border: 4px solid #dddddd;*/
}

#cb_zid {
	font-size: 1.2rem;
	margin: 2vh 0;
	padding: 1vh 1vw;
}

#container-edit {
	display: block;
	font-size: 1.4rem;
}

#container-edit #frame {
	display: block;
	font-size: inherit;
	width: 100%;
	min-height: 26vh;
	height: auto;
	margin: 1vh 1vw 1vh 1vw;
	padding: 2px;
	border: 4px solid #ffffff;
	border-radius: 15px;
	background-color: #0000001;
	overflow: hidden;
}
#container-edit #newframe {
	display: block;
	font-size: inherit;
	color: #888888;
	width: 100%;
	min-height: 26vh;
	height: auto;
	margin: 1vh 1vw 1vh 1vw;
	padding: 2px;
	border: 4px solid #ffffff;
	border-radius: 15px;
	background-color: #0000001;
	overflow: hidden;
}
#container-edit #preleft {
	display: inline-block;
	font-size: inherit;
	min-width: 100%;
	width: auto;
	float: left;
}
#container-edit #left {
	display: inline-block;
	font-size: inherit;
	width: 100%;
	float: left;
}
#container-edit #right {
	display: inline-block;
	font-size: inherit;
	width: 100%;
	margin: 5px 5px 5px 5px;
}
#container-edit input {
	font-size: inherit;
	width: 80%;
	margin: 4px;
	padding: 3px 5px;
	border: 1px solid #aaaaaa;
	border-radius: 15px;
}
#container-edit .imewidth {
	display: inline-block;
	font-size: inherit;
	width: 48%;
}
#container-edit .width1 {
	width: 40%;
}
#container-edit .width2 {
	width: 80%;
}
#container-edit .new {
	background-color: #ffff0020;
}
	
#container-edit .fielderr {
	background-color: #ee111150;
}

#container-edit h1 {
	font-size: inherit;
}
#container-edit .studentimg {
	font-size: inherit;
	width: 100%;
	height: auto;
	text-align: center;	
	background-color: #ffffff;
	border-radius: 15px;
	opacity: 0.9;
}
#container-edit .novi {
	color: #ff0000ee;
	font-weight: bold;
	}
#container-edit .studentimg img {
	display: inline-block;
	width: 30%;
	height: auto;
	margin: 10px 35%;
	border-radius: 15px;
}
#container-edit .erasestudent {
	display: inline-block;
	width: 30px;
	height: 30px;
	background: url('https://intranet.vef.hr/prg/erasmus/images/ico-close50.gif') no-repeat top left;
	background-size: contain;
	opacity: 50%;
}
#container-edit .erasestudent img {
	display: inline-block;
	width: 30px;
	height: 30px;
	opacity: 0.8;
}
#container-edit .editclin {
	font-size: 1rem;
	margin: 1px;
	padding: 3px 5px;
	border: 1px solid #aaaaaa;
	border-radius: 15px;
}
#container-edit .submitclass {
	display: block;
	font-size: 1rem;
	color: #ffffff;
	min-width: 5vw;
	width: 8vw;
	height: 4vh;
	margin: 5px 8px;
	text-align: center;	
	background-color: #2222dd80;
	border-radius: 15px;
	opacity: 0.9;
	cursor: pointer;
}


@media only screen and (max-width: 740px) {    /* For mobile phones: */

	body {
		width: 100vw;
		margin: 0;
		padding: 0;
	}

	.not-on-mobile {
		display: none !important;
	}
	.only-on-mobile {
		display: block !important;
	}
	.not-on-mobile-tbl {
		display: none !important;
	}

	.clear-float {
	}
	.clear-left {
	}
	.m-clear-left {
		clear: both;
		float: none;
	}
	.nofloat {
	}

	/* sb = studentblock - kratki naziv jer ide an puno mjesta */
	#container {
		width: 100vw;
	}

	.sb {
		position: static;
		display: block;
		font-weight: normal;
		width: 100%;
		height: 1px;
		margin: 0;
		padding: 0;
		z-index: 201;
	}
	.sb2 {
		position: absolute;
		font-size: 0.8rem;
		font-weight: normal;
		width: 3vw;
		top: 1px;
		left: 1px;
		margin: 0;
		padding: 0;
		cursor: grab;
		z-index: 203;
	}
	.s100  {
		position: absolute;
		display: block;
		font-size: 1rem;
		font-weight: normal;
		top: 1px;
		left: 1px;
		width: 100%;
		height: 5px;
		margin: 0;
		padding: 0;
		background-color: #ffffff20;
		border: 1px solid #ffffff01;
		border-radius: 50%;
		z-index: 202;
	}
	.s100:hover {
		background-color: #00000033;
		border: 1px solid #ffffff01;
		border-radius: 50%;
	}
	.sh1 {
		height: 100%;
	}
	.sh2 {
		height: 50%;
	}
	.sh3 {
		height: 33%;
	}
	.sh4 {
		height: 25%;
	}
	.sh5 {

		height: 20%;
	}
	.sb2 {
		position: absolute;
		font-size: 0.8rem;
		font-weight: normal;
		width: 3vw;
		top: 1px;
		left: 1px;
		margin: 0;
		padding: 0;
		cursor: grab;
		z-index: 202;
	}

	.detail {
		/*position: sticky;
		position: -webkit-sticky;*/
		position: absolute;
		display: none;
		top: 50%;
		width: 100%;
		height: 15vh;
		margin: 0;
		background-color: #888888;
		border: 2px solid #00000;
		border-radius: 15px;
		z-index: 1001;
		overflow: visible;
	}
	.detail .onerow {
		display: block;
		width: 100%;
		height: auto;
		color: #ffffff;
		margin: 0;
		border: 2px solid #444444;
		border-radius: 15px;
		z-index: 1002;
	}
/*	#detail2 {
		position: sticky;
		position: -webkit-sticky;
		display: block;
	}*/
	
	#container {
		marginu: 0;
		padding: 0;
	}

	#container_klinikestudenti {
		display: block;
		width: 100%;
		min-height: 20vh;
		height: auto;
		background-color: #ffffff;
	}	

	#container_klinike {
		position: relative;
		display: block;
		width: 200%;
		padding: 0;
		z-index: 301;
		overflow: visible;
	}
	##container-edit #klinike {
		display: none !important;
	}
	#klinike {
		display: block;
		width: 100vw;
		height: auto;
		margin: 0;
		padding: 0;
		border: 1px solid #00005590;
		border-radius: 5%;
		cursor: grab;
		overflow: visible;
	}
	#klinike ul {
		width: 100%;
		height: 8rem;
		padding: 5px;
		background-color: #ffffff;
		list-style-type: none;		
	}
	#klinike li {
		display: inline-block;
		font-size: 0.8rem;
		width: auto;
		height: 2rem;
		text-align: left;
		margin: 2px 5px;
		padding: 8px 8px;
		border: 1px solid #444444;
		border-radius: 15px;
		float: left;
	}
	#klinike li:hover {
		background-color: #55558890;
	}
	.klinika_active {
		color: #ffffff;
		background-color: #00008880;
	}
	
	#container_klinopt {
		display: block;
		color: #000000;
		width: 100vw;
		background-color: #ffff0050;
		border: 1px solid #444444;
		border-radius: 10px;
		opacity: 1;
	
	}
	#container_klinopt ul {
			width: 98%;
			height: 2rem;
			margin: 5px;
			padding: 3px 0px;
			list-style-type: none;
		}
	#container_klinopt li {
			display: inline-block !important;
			width: 8rem;
			text-align: center;
			padding: 2px 3%;
			background-color: #ffffff;
			border: none;
			border-radius: 10px;
			float: left;
			opacity: 0.8;
			overflow: hidden;
		}
		li:hover {
			background-color: #1111ff;
		}
		li a {
			font-color: #000000;
		}
	.klinopt {
		display: inline-block;
		color: #000000;
		width: 100%;
		text-align: center;
		padding: 0;
		background-color: #eeee88;
		float: left;
		opacity: 1;
	}
	
	
	.studentclick_studentheight {
		/*height: 35vh;*/
	}
	#studenti {
		position: relative;
		display: block;
		width: 100vw;
		min-height: inherit;
		height: auto;
		/*background-color: #ff0000;*/
		border-radius: 15px;
	}
	.student {
		display: inline-block;
		width: 33%;
		height: 25vh;
		border-radius: 5%;
		float: left;
		overflow: hidden;
		opacity: 95%
	}
	.student h1 {
		font-size: 1em;
		font-weight: 100;
		height: 3rem;
		margin: 0;
		padding: 0.5rem 0 0 0;
		text-align: center;
		z-index: 205;
	}
	.student #img1 {
		display: inline-block;
		position: relative;
		width: auto;
		height: 80%;
		max-height: inherit;
		margin: 0;
		/*border: 2px solid #bbbbbb;*/
		border-radius: 4%;
		z-index: 202;
	}
	.student #img2 {
		display: none;
		}
	
	#calendars {
		display: block;
		width: 100%;
		height: 350vh;
		background-color: #ffffff;
		overflow: visible;
	}

	.calendar {
		position: relative;
		width: 100%; /* ispunjava kol-m-3a */
		margin: 0;
		padding: 0;
		float: left;
	}
	.calendar h1 {
	}
	.calendar table {
		width: 100%;
		box-shadow: 0 1px 3px rgba(0,0,0,0.6), 0 1px 2px rgba(0,0,0,0.12);
	}
	.calendar .weekend {
		background-color: rgb(71,170,215,0.2);
		color: #444444;
	}
	.calendar .dayoffmonth {
		background-color: rgb(255,255,255,0.8);
	}
	.calendar th {
		height: 2.2rem;
	}
	.calendar a {
		font-size: 0.8rem;
		font-weight: normal;
		color: #000000;
		text-decoration: none;
	}
	.calendar td, .calendar th {
		position: relative;
		z-index: 200;
	}
	.calendar td {
		position: relative;
		font-size: 0.6rem;
		width: 3vw;
		height: 3.8vh;
		margin: 0;
		border: 1px solid #aaaaaa;
		z-index: 200;
	}
	
	#f_edit_save {
		width: 50%;
		cursor: pointer;
	}
	
	.kol-m-3a  {width: 47.5%; padding: 0; float: left; margin: 0 0 0 2px;}
	.kol-m-h {width: 48%; background-color: #ffffff; float: left;}
	.col-m-1  {width: 100%;}
	.col-m-2  {width: 16.66%;}
	.col-m-2a  {width: 100%;}
	.col-m-3  {width: 46%; padding: 0; float: left;}
	.col-3a  {width: 100%;}
	.col-m-3b  {width: 33.33%;}
	.col-m-4  {width: 100%;}
	.col-m-5  {width: 100%;}
	.col-m-6  {width: 100%;}
	.col-m-6a {width: 100%; padding: 0 0 5% 0;}
	.col-m-7  {width: 100%;}
	.col-m-8  {width: 100%;}
	.col-9  {width: 100%;}
	.col-m-11 {width: 100%;}
	.col-m-12 {width: 100%;}


}


/* @media only screen and (min-width: 741px) {*/    /* For tablets: */

@media only screen and (min-width: 740px) {    /* For desktop: and tablets: */

	.not-on-mobile {
		display: block !important;
	}
	.not-on-mobile-tbl {
		display: block !important;
	}
	.only-on-mobile {
		display: none !important;
	}

	.clear-float {
		clear: both;
		float: none;
	}
	.clear-left {
		clear: left;
		float: none;
	}
	.m-clear-left {
		clear: both;
		float: none;
	}

	html {
		font-size: 14pt;
	}
	
	body {
		display: block;
		position: relative;
		width: 100vw;
		overflow-x: visible;
		overflow-y: visible;
		z-index: 1;
	}

	#container {
		display: block;
		width: 90vw;
		margin: 0 5vw;
	}

	#pos11 {
		top: 1px;
		left: 1px;
	}

	/* sb = studentblock - kratki naziv jer ide an puno mjesta */
	.sb {
		position: static;
		display: inline-block;
		font-weight: bold;
		width: 100%;
		height: 1px;
		margin: 0;
		padding: 0;
		float: left;
		z-index: 201;
	}
	.sh1 {
		height: 100%;
	}
	.sh2 {
		height: 50%;
	}
	.sh3 {
		height: 33%;
	}
	.sh4 {
		height: 25%;
	}
	.sh5 {

		height: 20%;
	}
	.sb2 {
		position: absolute;
		font-weight: normal;
		width: 3vw;
		top: 1px;
		left: 1px;
		margin: 0;
		padding: 0;
		cursor: grab;
		z-index: 202;
	}

	.s100  {
		position: absolute;
		display: block;
		font-size: 85%;
		font-weight: normal;
		text-align: center;
		top: 1px;
		left: 1px;
		width: 100%;
		height: 4px;
		margin: 0;
		padding: 0;
		background-color: #ffffff;
		border: 1px solid #ffffff01;
		border-radius: 50%;
		z-index: 202;
	}
	.s100:hover {
		background-color: #00000033;
		border: 1px solid #ffffff01;
		border-radius: 50%;
	}
	.dt {
		position: absolute;
		width: 100%;
		height: 100%;
		top: 1px;
		left: 1px;
		margin: 0;
		padding: 0;
		cursor: grab;
		z-index: 250;
	}

	.detail {
		position: relative;
		display: none;
		width: 100%;
		min-height: 10vh;
		height: auto;
		max-height: 40vh;
		margin: 1rem 0 0 0;
		padding: 5px 2px;
		background-color: #888888;
		border: 4px solid #d00000e0;
		border-radius: 15px;
		z-index: 401;
	}
	.detail .onerow {
		display: inline-lock;
		font-size: 1rem;
		font-weight: 100;
		color: #ffffff;
		width: 95%;
		height: 2rem;
		margin: 2px 8px;
		padding: 2px 5px;
		text-align: center;
		border: 1px solid #444444;
		border-radius: 15px;
		z-index: 402;
		opacity: 1;
	}
	#detail1 {
		/*top: 1px;
		left: 1px;
		position: absolute;*/
	}
	

/*
	#container_klinike:hover {
		display: none;
		background-color: #ff000055;
		z-index: 0;
	}
*/

	#klinike #container_klinopt {
			display: block;
			font-size: inherit;
			width: 100%;
			height: auto;
			margin: 3vh 0 0 0;
			background-color: #ffffff;
			border: 2px solid #444444;
			border-radius: 15px;
			padding: 0px 2.5%;
			z-index: 601;
			overflow-x: hidden;
			overflow-y: visible;
	}
	#klinike #container_klinopt ul {
			width: 100%;
			margin: 2px;
			padding: 0px;
			list-style-type: none;
			background-color: #ffff0020;
			overflow-x: hidden;
		}
	#klinike #container_klinopt li {
			display: inline-block;
			width: 45%;
			height: 1.8rem;
			margin: 2px 3px;
			padding: 4px 5px;
			background-color: #ffffff;
			border: none;
			float: left;
			background-color: #2222ff20;
		}
	#klinike #container_klinopt li:hover {
			color: #ffffff;
			background-color: #00000080;
		}
	#klinike #container_klinopt a {
			color: #000000;
		}

	.klinike_shorter {
	}

	#container {
		/*margin: 1vh 1vw;*/
		padding: 0;
	}

	.not-on-mobile {
		display: block;
	}
	.not-on-mobile-tbl {
		display: table-cell;
	}

	#calendars {
		width: auto;
		min-height: 150vh;
		height: auto;
		margin: 0 1%;
		padding: 8px;
		background-color: #ffffff;
		overflow-x: scroll;
		overflow-y: visible;
		background-color: #ffffff80;
	}
	
	#calendars h1 {
		font-size: 1.2rem;
		font-weight: 200;
		width: 10%;
	}
	
	.calendar {
		display: inline-block;
		width: auto;
		min-height: 30vh;
		height: auto;
		margin: 0;
		padding: 0;
		/*background-color: #ff0000;
		border: 1px solid #ff0000;*/
		float: left;
	}

/* **** veličina fonta je u .s100 **** */

	.calendar table {
		width: auto;
		min-width: 1vw;
		height: 20vh;
		margin: 0;
		padding: 0;
		background-color: #888888;
		box-shadow: 0 1px 3px rgba(0,0,0,0.6), 0 1px 2px rgba(0,0,0,0.12);
	}
	#legend-container {
		min-width: 40%;
		margin: 1% 0 0 5%;
	}
	.calendar h3 {
		margin: 0 0 0 7%;
	}
	.calendar td {
		position: relative;
		font-size: inherit;
		width: 2.5vw;
		height: 3.5vh;
		margin: 1px;
		background-color: #ffffff;
		/*border: 1px solid #aaaaaa;*/
		z-index: 200;
	}

	.calendar th {
		font-weight: 400;
		height: 3.5vh;
		margin: 0;
	}

	.calendar .dayoffmonth {
		background-color: rgba(255,255,255,0.8);
	}
		
	#container_klinikestudenti {
		display: block;
		width: 100vw;
		min-height: 20vh;
		height: auto;
/*		min-height: 100%;
		height: auto;
		overflow-x: scroll;
		overflow-y: hidden;
		overflow: visible;
		border: 5px solid #aaaaaa;*/
		float: left;
		background-color: #ffffff80;
	}	

	#container_klinike {
		position: absolute;
		display: block;
		top: 1px;
		right: 2vw;
		width: 14vw;
		height: 150%;
		margin: 2px;
		padding: 0;
		z-index: 301;
	}
	#klinike {
		position: sticky;
		display: block;
		top: 1px;
		right: 10px;
		width: 100%;
		height: auto;
		margin: 2px;
		padding: 0;
		background-color: #ffffff;
		border: 4px solid #00005590;
		border-radius: 5%;
		z-index: 200;
		cursor: grab;
		overflow-x: hidden;
		overflow-y: visible;
	}
	.container_klinike_norm {
		height: 250vh;
	}
	.container_klinike_shorter {
		height: 6rem;
	}
	.klinike_norm {
		height: 25rem;
	}
	.klinike_shorter {
		height: 6rem;
	}
	.klinike_ul_norm {
		display: block;
	}
	.klinike_ul_shorter {
		display: none;
	}

	#klinike ul {
		margin: 5px;
		padding: 0px;
		background-color: #ffffff;
		list-style-type: none;		
	}
	#klinike li {
		border: none;
		width: 100%;
		height: 2.5rem;
		margin: 2px;
		text-align: center;
		padding: 10px 0 0 0;
		border: 1px solid #222222;
		border-radius: 15px;
		float: none;
	}
	li:hover {
		background-color: #00008820;
	}
	.klinika_active {
		color: #ffffff;
		background-color: #00008880;
	}
	.klinikeclick_studenteight {
		height: auto;
	}
	
	#studenti {
		position: relative;
		display: block;
		width: 84vw;
		min-height: inherit;
		height: inherit;
		/*overflow-x: hidden;
		clear: both;
		float: none;
		border-radius: 5%;
		overflow-x: scroll;
		overflow-y: hidden;*/
	}
	
	.studentclick_studentheight {
		height: inherit;
	}
	.student {
		display: inline-block;
		position: relative;
		/*max-width: inherit;*/
		width: auto;
		max-width: 16vw; 
		height: 34vh;
		text-align: center;
		border-radius: 5%;
		overflow: hidden;
		opacity: 80%;
		/*height: auto;
		margin: 2%;
		background-color: #ffffff;*/
		float: left;
	}

	.student h1 {
		font-size: 1.2em;
		font-weight: 100;
		height: 3rem;
		margin: 0;
		padding: 0.5rem 0 0 0;
		z-index: 205;
	}
	.student #img1 {
		display: inline-block;
		position: absolute;
		top: 1px;
		left: 1px;
		width: 90%;
		height: auto;
		max-height: inherit;
		margin: 25% 5%;
		/*border: 2px solid #bbbbbb;*/
		border-radius: 4%;
		z-index: 202;
	}
	.student #img2 {
		display: inline-block;
		width: 500%;
		height: 500%;
		max-height: inherit;
		margin: -250% -250%;
		opacity: 30%;
		z-index: 201;
	}
	#newframe {
		width: 90%;
		min-height: 40vh;
		height: auto;
		text-align: left;
		overflow: hidden;
	}
	#frame {
		width: 90%;
		min-height: 40vh;
		height: auto;
		text-align: left;
		overflow: hidden;
	}

	#container-edit {
		display: block;
		font-size: 1.2rem;
	}
#container-edit .studentimg {
	font-size: inherit;
	width: 100%;
	height: auto;
	text-align: center;	
	background-color: #ffffff;
	border-radius: 15px;
	opacity: 0.9;
}
#container-edit .studentimg img {
	display: inline-block;
	width: 80%;
	height: auto;
	margin: 10px 10%;
	border-radius: 15px;
}
	.studentimg img {
		display: block;
		width: 100%;
		height: auto;
	}
	#container-edit #preleft {
		display: inline-block;
		min-width: 15%;
		width: 15%;
		float: left;
	}
	#container-edit #left {
		display: inline-block;
		width: 35%;
		/*width: auto;*/
		float: left;
	}
	#container-edit #right {
		display: inline-block;
		font-size: 80%;
		width: auto;
		margin: 5px 5px 5px 5px;
	}
	
	#f_edit_save {
		width: 30%;
		cursor: pointer;
	}
	
    .kol-2a {float: left;}
    .kol-3a  {width: 25vw; background-color: #ffffffee; float: left;}
    .kol-3b  {width: 20vw; background-color: #ffffff80; float: left;}
    .kol-6a {width: 49.5%;}
    .col-1  {width: 8.33%;}
    .col-2  {width: 16.66%;}
    .col-3  {width: 25%;}
    .col-4  {width: 33.33%;}
    .col-5  {width: 41.66%;}
    .col-6  {width: 50%;}
    .col-7 	{width: 58.33%;}
    .col-8 	{width: 66.66%;}
    .col-9 	{width: 75%;}
    .col-10 {width: 83.33%;}
    .col-11 {width: 91.66%;}
    .col-12 {width: 100%;}
}