body {
	background-color: #f6f6f6;
	/*background-color: #9CD204;*/

}

button:hover {cursor: pointer;}
.even,
.first {
	background: #d0e5f5;
	opacity:.8;
}

.odd,
.second {
	background-color: none;
}
.even:hover, .odd:hover {
	background-color: #F5F67A;
}

.dead-center {
	position: relative;
	left: 50%;
	margin-left: -512px;
	margin-top: 10px;
	width: 1024px;
}

.shadow {
	box-shadow: 3px 2px 4px #AAA;
	-webkit-box-shadow: 3px 2px 4px #CCC;
	-moz-box-shadow: #AAA 3px 2px 4px;
}

.left-floated,
.right-floated {
	width: 495px;
	float: left;
	margin-top: -10px;
}
.right-floated {
	float: right;
}

.left-floated>div,
.right-floated>div,
#lefters>div,
#righters>div {
	margin-top: 10px;
}

.fill-space {
	width: 100%;
	height: 100%;
}
.title-text {
	font-size:1.5em;
	font-weight:bold;
	z-index:100;
	color:#222;
}

#search-probisdb {
	style=color:dimgray; 
	padding:10px; 
	font-size: 1.2em; 
	margin-top: 40px;
	border: 1px solid gray;
}
#search-probisdb:focus {
	border-color: blue;
}

#search-button {
 background: #3498db;
  background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
  background-image: -moz-linear-gradient(top, #3498db, #2980b9);
  background-image: -ms-linear-gradient(top, #3498db, #2980b9);
  background-image: -o-linear-gradient(top, #3498db, #2980b9);
  background-image: linear-gradient(to bottom, #3498db, #2980b9);
	color: white;
	font-weight: bold;
	padding: 13px;
	margin-right: 80px;
	border: 0;
}
.blue-button {	
	background: #3498db;
   background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
   background-image: -moz-linear-gradient(top, #3498db, #2980b9);
   background-image: -ms-linear-gradient(top, #3498db, #2980b9);
   background-image: -o-linear-gradient(top, #3498db, #2980b9);
   background-image: linear-gradient(to bottom, #3498db, #2980b9);
   color: white;
	font-weight: bold;
	border: 0;
	border-radius: 4px;
}
#search-button:hover, .blue-button:hover{
	cursor: pointer;
	 background: #3cb0fd;
  background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
  background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
}
#home {
	float: right;
	margin-top: 30px;
	margin-right: 10px;
}

/* binding sites */
.test_desno {
	background-image: url('desna.png');
   background-repeat: no-repeat;
   background-attachment: fixed;
   
   background-position: 120% -330px; 
   
}

.show_info:hover { cursor: pointer;}

.blur {
	-webkit-filter: blur(5px);
 	-moz-filter: blur(5px); 
 	-o-filter: blur(5px); 
 	-ms-filter: blur(5px);
 	filter: blur(5px); 
 	pointer-events: none;
 }
 
::-webkit-scrollbar {
    display: none;
} 
#motif_close { cursor:pointer; width:15px; height:15px; margin-right: 12px; margin-top: 11px; float: right;}
#motif_help{ cursor:pointer; margin-left: 5px; margin-top: 10px; float: left;}
#motif_help:hover{text-decoration: underline; color: red;}
.motif_htxt {float: left; font-size: 1.4em; margin-top: 10px; margin-left: 10px;}
.motif_ozadje{ position: fixed; z-index: 1000; background-color: #fff; display: none; border: 1px solid black; overflow: auto;}
.motif_header {width: 100%; height: 6.5%; background-color: #f2f2f2; border-bottom: 1px solid #d9d9d9;}
#motif_right_header {width: 98%; height: 30px; border-bottom: 1px solid #323232; margin-left: 2%; float: left;}
.motif_content {float:left; width: 100%; height: 93%; }
.motif_right {float: left; width: 19.5%; height:100%; border-left:1px dashed #d9d9d9;}
.motif_left { float: left; width: 79.5%; height: 100%; }
#motif_info { position: fixed; z-index: 2147483647; margin-top: 5.5%; margin-left: 20%; background-color: #323232; 
	color: white; padding: 10px; font-size:1.2em; padding:10px; width: 40%; display: none; cursor: pointer;}
#working_structure { position: fixed; z-index: 2147483647; background-color: #323232; 
	color: white; padding: 30px; font-size:1.4em; display:none; font-weight: bold; }
#top_buttons {width: 98%; float: left;}

#bsite_buttons {float: left;width: 230px; height: 50px;margin-top: 20px;}
#bsites_parameters {z-index: 2147483647; position: absolute; width: 230px; height: 140px; background-color: #fff; border: 1px solid black; display:none; }
#bsite_parameters_header {width: 100%; height: 20px; border-bottom: 1px solid #323232; background-color: #f2f2f2; cursor:move; }
.residues {margin-left: 20px; width: 90%; float: left; }
.residues img {
	margin: 0; 
	padding: 0;
}
#bsite-enter-cen input {
	padding: 5px;
	font-size: 1.2em;
	margin: 3px;
	margin-top: 6px;
	border: 0;
	border-bottom: 2px solid #3cb0fd;
	float: left;
	text-align: center;
}
/* prikaz bsites na desni strani */
#binding_sites {width: 98%; float:left; margin-left:2%;}
#binding_sites tbody {display: block; overflow-y: auto;}

#bsite_more {float: left; margin-top: 3px; font-size: 1.1em;}

#jsmol_control input, #jsmol_control span {float: left;}

/*marvin*/
#draw_close { cursor:pointer; width:15px; height:15px; margin-right: 12px; margin-top: 11px; float: right;}
#draw_help{ cursor:pointer; margin-left: 5px; margin-top: 10px; float: left;}
#draw_help:hover{text-decoration: underline; color: red;}
.draw_htxt {float: left; font-size: 1.4em; margin-top: 10px; margin-left: 10px;}
.draw_ozadje{ position: fixed; z-index: 1000; background-color: #fff;  border: 1px solid black;display:none; overflow:auto; }
.scroll_div {float: left;}

.draw_header {width: 100%; height: 6.5%; background-color: #f2f2f2; border-bottom: 1px solid #d9d9d9;}
#draw_right_header {width: 98%; height: 30px; border-bottom: 1px solid #323232; margin-left: 2%;}
.draw_content {float:left; width: 100%; height: 93%; }
.draw_right {float: left; width: 19.5%; height:100%; border-left:1px dashed #d9d9d9;}
.draw_left { float: left; width: 79.5%; height: 100%; }
#draw_info { position: fixed; z-index: 2147483647; margin-top: 5.5%; margin-left: 20%; background-color: #323232; 
	color: white; padding: 10px; font-size:1.2em; padding:10px; width: 40%; display:none; cursor: pointer;}

.sketcher-frame {
	border: none;
}
#draw_ligands tbody {display: block; overflow-y: auto; }
#marvin_guide:hover {color: red;}
#marvin_guide {color: white;}

#animated_div {
margin-left: 5px;
margin-top: -40px;
margin-bottom: 30px;
width:85px;
height:47px;
background:#92B901;
color:#ffffff;
position:relative;
font-weight:bold;
font-size:20px;
padding:10px;
border-radius:5px;
-webkit-border-radius:5px;
}
.run_animation {
animation:animated_div 5s 1;
-moz-animation:animated_div 5s 1;
-webkit-animation:animated_div 5s 1;
-o-animation:animated_div 5s 1;
}

@keyframes animated_div
{
0%		{transform: rotate(0deg);left:0px;}
25%		{transform: rotate(20deg);left:0px;}
50%		{transform: rotate(0deg);left:85%;}
55%		{transform: rotate(0deg);left:85%;}
70%		{transform: rotate(0deg);left:85%;background:#1ec7e6;}
100%	{transform: rotate(-360deg);left:0px;}
}

@-webkit-keyframes animated_div
{
0%		{-webkit-transform: rotate(0deg);left:0px;}
25%		{-webkit-transform: rotate(20deg);left:0px;}
50%		{-webkit-transform: rotate(0deg);left:85%;}
55%		{-webkit-transform: rotate(0deg);left:85%;}
70%		{-webkit-transform: rotate(0deg);left:85%;background:#1ec7e6;}
100%	{-webkit-transform: rotate(-360deg);left:0px;}
}

@-moz-keyframes animated_div
{
0%   {-moz-transform: rotate(0deg);left:0px;}
25%  {-moz-transform: rotate(20deg);left:0px;}
50%  {-moz-transform: rotate(0deg);left:85%;}
55%  {-moz-transform: rotate(0deg);left:85%;}
70%  {-moz-transform: rotate(0deg);left:85%;background:#1ec7e6;}
100% {-moz-transform: rotate(-360deg);left:0px;}
}

@-o-keyframes animated_div
{
0%   {transform: rotate(0deg);left:0px;}
25%  {transform: rotate(20deg);left:0px;}
50%  {transform: rotate(0deg);left:85%;}
55%  {transform: rotate(0deg);left:85%;}
70%  {transform: rotate(0deg);left:85%;background:#1ec7e6;}
100% {transform: rotate(-360deg);left:0px;}
}

iframe:hover {
	width: 200%;
	height: 200%;
}

.table-content-bsite {
	float: left;
	width: 98%;
	margin: 1% 0 1% 1%;
	background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAIklEQVQIW2NkQAIfP378zwjjgzj8/PyMYAEYB8RmROaABAAVMg/XkcvroQAAAABJRU5ErkJggg==   ) repeat;
	-moz-box-shadow: 0 2px 5px 0 rgba(0,0,0,.2);
   -webkit-box-shadow: 0 2px 5px 0 rgba(0,0,0,.2);
   box-shadow: 0 2px 5px 0 rgba(0,0,0,.2);
	border-bottom:10px solid #14937a;
}

#binding_sites tbody tr td, #binding_sites tbody tr {
	margin: 0;
	padding: 0;
	width: 99%;
	float: left;
}

.tcb-first-elt {
	float: left;
	width: 80%;
}
.tcb-first-elt p {
	margin-left: 1%;
	font-size: 0.9em;
}
.tcb-second-elt {
	float: left;
	width: 20%;
}
.check-div {
	margin-top: -6px;
	margin-bottom: 3px;
	float: left;
	width: 95%;
	margin-left: 5%;
}
.check-div input {
	float: left;
}
.check-div span {
	float: left;
	margin-top: 3px;
	font-size: 0.9em;
	margin-right: 5px;
}

.tcb-second-elt button {
	background-color: transparent;
	margin-left: 20%;
	margin-top: 12px;
	margin-bottom: 5px;
	padding: 5px 0 5px 0;
   width:60%;
   font-weight: bold;
   font-size: 1.3em;
	border-radius: 4px;
}
.blue {color: blue;}
.yellow {color: black;}
.green {color: green;}
.red {color: red;}
.violet {color: violet;}
.orange {color: orange;}
.cyan {color: cyan;}
.black {color: black;}
.gray {color: gray;}

.blue:hover { cursor: pointer; background: blue; color: white; }
.yellow:hover { cursor: pointer; background: yellow; color: black; }
.green:hover { cursor: pointer; background: green; color: white; }
.red:hover { cursor: pointer; background: red; color: white; }
.violet:hover { cursor: pointer; background: violet; color: white; }
.orange:hover { cursor: pointer; background: orange; color: white; }
.cyan:hover { cursor: pointer; background: cyan; color: white; }
.black:hover { cursor: pointer; background: black; color: white; }
.gray:hover { cursor: pointer; background: gray; color: white; }

.next-cen, .back-cen {
    float:left;
    height:58px;
    width:8%;
    font-size:1.2em;
    line-height: 60px;
    text-align: center;
}
.next-cen:hover, .back-cen:hover {
    cursor: pointer;
    background-color: #7a7a7a;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAABZJREFUeNpi2r9//38gYGAEESAAEGAAasgJOgzOKCoAAAAASUVORK5CYII=);
}

.show-elt { display:block; }
.no-show-elt {display:none}
.show-elt, .no-show-elt {
    float:left;
    width:84%;
    height:100%;
}