/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea {
	color: #222;
}

body {
	font-size: 1em;
	line-height: 1.35;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection declarations have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
	background: #b3d4fc;
	text-shadow: none;
}

::selection {
	background: #b3d4fc;
	text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
	display: block;
	height: 1px;
	border: 0;
	border-top: 1px solid #ccc;
	margin: 1em 0;
	padding: 0;
}

/*
 * Remove the gap between images and the bottom of their containers: h5bp.com/i/440
 */

img {
	vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
	border: 0;
	margin: 0;
	padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
	resize: vertical;
}

/* ==========================================================================
   Chrome Frame prompt
   ========================================================================== */

.chromeframe {
	margin: 0.2em 0;
	background: #ccc;
	color: #000;
	padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

* {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}

body {
	margin: 15px 25px;
	padding: 0;
	font-family: sans-serif;
	background: #fff;
	font-size: 15px;
}

a {
	color: #317eb4;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}




p {
	font-size: 15px;
}


.caption {
	padding: 0;
	font-size: 13px;
}
p:last-child {
	margin-bottom: 0;
}

h1 {
	margin-top: -4px;
	color: #2c2c2c;
	font-size: 19px;
	font-weight: 600;
	text-transform: uppercase;
}


h2 {
	margin-top: 0px;
	margin-bottom: 7px;
	color: #2c2c2c;
	font-size: 15px;
	font-weight: bold;
	text-transform: uppercase;
}

img {
	max-width: 100%;
}

.float-left{
	float: left;
	margin: 0 12px 12px 0;
	position: relative;
	top: 6px;
}

.float-right{
	float: right;
	margin: 0 0 12px 12px;
	position: relative;
	top: 6px;
}
.revert {
    background: url("../img/main/stock-redo.png") no-repeat scroll 0 0 transparent;
    height: 16px;
    width: 16px;
}
.paging-right {
 	border-left: 1px solid #CDCDCD;
    font-size: 11px;
    padding: 0 0 0 5px;
    position: absolute; 
    bottom:5px; 
    right:5px;
}
.paging-right span#a{
	display:inline;
}
.paging-right:hover span#a{
	display:none;
}
.paging-right span#b{
	display:none;
}
.paging-right:hover span#b{
	display:inline;
}
.paging-right span#n{
	position: absolute;
 top: -690px ;
 right:0px;
 color:#999;
}

.paging-left {
 border-right: 1px solid #CDCDCD;

    font-size: 11px;

    padding: 0 5px 0 0;
  position: absolute; 
  bottom:5px; 
  left:5px;
}
.paging-left span#a{
	display:inline;
}
.paging-left:hover span#a{
	display:none;
}
.paging-left span#b{
	display:none;
}
.paging-left:hover span#b{
	display:inline;
}



.float-clear {
	clear: both;
	margin: 5px 10px 0 0;
}

.spacing {
	margin-top: 30px;
}

.strong {
	font-weight: bold;
}

.clean {
	margin: 10px 0;
	border: none;
}

.formula {
	font-weight: bold;
	font-size: 14px;
	text-align: center;
}

.container {
	margin: 21px auto;
	max-width: 1160px;
	height:718px;
	/*border:1px solid #cdcdcd;*/
	padding:10px;
	background:#fff;
	position: relative;
	
}

.razmik{
	margin: -10px 0 0 0;

}

.truefalse{
	/*margin: -5px 0 0 0;*/
	/*font-size:12px;*/
}

.truefalse input{
	margin: 0 10px 0 0px;
}
.truefalse span{
	/*margin: 0 0 0 18px;*/
	color: #000000;
    font-size: 14px;
}
.wrapper{
	margin: 0 0 12px 0;
	}
.wrapper-top{
	margin: -16px 0 20px 0;
	}
	.wrapper-frame{
	margin: -65px 0 20px 0;
	}
	.wrapper-frame2{
	margin: -35px 0 20px 0;
	}
	
.lista li{
margin-top: 4px;	
}

	
/**
 * Navigation
 */	
#nav   { height: 30px; position: fixed; top: 0; left: 0; width: 100%; background: url(../img/main/bg_nav_top.png) repeat-x; color: #f7f7f7; z-index: 100; }
#nav ul    { margin: 0; padding: 0; list-style-type: none; }
#nav a     { font-size: 13px; color: #fff; text-transform: uppercase; text-decoration: none; }

/* Main */
#nav .main    { position: absolute; top: 0; left: 16px;  }
#nav .main ul { white-space: nowrap; }
#nav .main li { display: inline-block; border-right: 1px solid #232323;}
#nav .main a  { padding: 0 18px 0 46px; height: 30px; line-height: 25px; }
#nav .main .shelf a   { background: url(../img/main/nav_icn_shelf.png) no-repeat 14px -1px; }
#nav .main .topics a  { background: url(../img/main/nav_icn_topics.png) no-repeat 4px -1px; }
#nav .main .pages a   { background: url(../img/main/nav_icn_pages.png) no-repeat 14px 0; }
#nav .main li:hover   { background: url(../img/main/nav_bg_hover.png); display:inline-block }
#nav .main li:hover a { padding: 0 18px 0 46px; color: #64aed4; }

/* Main */
#nav .meta { position: absolute; top: -2px; right: 16px;  }
#nav .meta ul { white-space: nowrap; }
#nav .meta li { display: inline-block; padding: 0 0 0 4px; }
#nav .meta a  { display: inline-block; width: 34px; height: 32px; background: url(../img/main/nav_icn_meta.png) no-repeat 8px 6px; text-indent: -9999em; overflow: hidden; }
#nav .meta .print a    { background-position: 8px 6px; }
#nav .meta .download a { background-position: -36px 6px; }
#nav .meta .edit a     { background-position: -80px 6px; }
#nav .meta .speech a   { background-position: -120px 6px; }
#nav .meta .cc a   { background-position: -160px 6px; }

.tocCurrent {
   color: black;
   font-weight: 600;
}


#textbook-title {
  text-align:center;
  font-weight:bold;
  margin-top:3px;
}


/* Tabbed */
#nav-tabbed, #nav-pages { position: fixed; top: 0; left: -257px; width: 257px; height: 772px; background: url(../img/main/bg_nav_side.png); z-index: 99; }
#nav-tabbed.opened, #nav-pages.opened       { left: 0; }
#nav-tabbed ul, #nav-pages ul           { margin: 0; padding: 0; list-style-type: none; }

	/* Tabs */
	#nav-tabbed .tabs, #nav-pages .tabs { position: absolute; width: 228px; top: 27px; left: 7px; font-size: 12px; text-transform: uppercase; }
	/*#nav-tabbed .tabs li{ float: left; width: 75px; border-bottom: 1px solid #c3c3c3; border-right: 1px solid #c3c3c3; color: #404040; background:  url(../img/main/nav_side_tab.png); font-size: 13px; }*/
	#nav-pages .tabs li, #nav-tabbed .tabs li     { float: left; width: 75px;  color: #404040; font-size: 13px; padding: 15px; background: none; border: none; }
	#nav-tabbed .tabs li.on, #nav-pages .tabs li.on   { background: none; border-bottom: none; }
	#nav-tabbed .tabs a, #nav-pages .tabs a      { height: 36px; line-height: 36px; color: #404040; text-decoration: none; text-align: center; display: block; }
	#nav-tabbed .tabs a:hover, #nav-pages .tabs a:hover { color: #317eb4; }
	/*#nav-tabbed .tabs li.on a { color: #64aed4; }*/

	/* Content */
	#nav-tabbed .content, #nav-pages .content                { position: absolute; top: 30px; left: 6px; width: 224px; }
	#nav-tabbed .content nav, #nav-pages .content nav            { display: none; border-top: 1px solid #D2D2D2; }
	#nav-tabbed .content nav.on, #nav-pages .content nav.on        { display: block; }
	#nav-tabbed .content nav a, #nav-pages .content nav a          { color: #000000; font-size: 12px; text-decoration: none; text-transform: uppercase; padding: 5px 16px; display: block; border-bottom: 1px solid #D2D2D2; background: #ececec url(../img/main/nav_side_li.png) repeat-x; }
	#nav-tabbed .content nav a:hover, #nav-pages .content nav a:hover   { color: #317eb4; }
	#nav-tabbed .content nav li.on a, #nav-pages .content nav li.on a    { color: #317eb4; }
	#nav-tabbed .content nav li.on ul a, #nav-pages .content nav li.on ul a { background: #F7F7F7; color: #2c2c2c; font-size: 11px; padding-left: 20px; }
	#nav-tabbed .content nav li.on ul a:hover, #nav-pages .content nav li.on ul a:hover { color: #317eb4; }
	#nav-tabbed .content nav li.on ul li.on a, #nav-pages .content nav li.on ul li.on a { color: #317eb4; background: none; }
	/#nav-tabbed .content nav li.last, #nav-pages .content nav li.last { border-bottom:1px solid #c2c2c2; }
	
	.accordion li > .sub-menu {display: none;}
    .accordion li:target > .sub-menu {display: block;}

.page_numbers{
 float:right; 
 color:DarkSlateGray;
 font-size:90%;
 vertical-align:middle;
 margin-right:-10px;
}

/**
 * Buttons
 */
.btn-white {
	padding: 7px;
	font-weight: bold;
	font-size: 12px;
	color: #5fb5d5;
	background: #fff;
	border: 1px solid #cdcdcd;
	display: inline-block;
}

.btn-blue,
.btn-green,
.btn-orange  {
	color: #fff;
	padding: 5px;
	border-radius: 3px;
	display: inline-block;
	font-size: 12px;
	line-height: 14px;
	letter-spacing:1px;
}

.btn-blue:hover,
.btn-green:hover,
.btn-orange:hover {
	text-decoration: none;
}

.btn-blue {
	border: 1px solid #66a7d0;
	background: #8acbe3; /* Old browsers */
	background: -moz-linear-gradient(top,  #8acbe3 0%, #7ac1de 3%, #59a6cf 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8acbe3), color-stop(3%,#7ac1de), color-stop(100%,#59a6cf)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #8acbe3 0%,#7ac1de 3%,#59a6cf 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #8acbe3 0%,#7ac1de 3%,#59a6cf 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #8acbe3 0%,#7ac1de 3%,#59a6cf 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #8acbe3 0%,#7ac1de 3%,#59a6cf 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8acbe3', endColorstr='#59a6cf',GradientType=0 ); /* IE6-9 */
}

.btn-blue:hover {
	background: #71c4e2; /* Old browsers */
	background: -moz-linear-gradient(top,  #71c4e2 0%, #6abddd 4%, #3797cc 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#71c4e2), color-stop(4%,#6abddd), color-stop(100%,#3797cc)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #71c4e2 0%,#6abddd 4%,#3797cc 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #71c4e2 0%,#6abddd 4%,#3797cc 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #71c4e2 0%,#6abddd 4%,#3797cc 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #71c4e2 0%,#6abddd 4%,#3797cc 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#71c4e2', endColorstr='#3797cc',GradientType=0 ); /* IE6-9 */
}

.btn-green {
	border: 1px solid #77b04a;
	background: #adcf75; /* Old browsers */
	background: -moz-linear-gradient(top,  #adcf75 0%, #a2c96c 4%, #77b04a 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#adcf75), color-stop(4%,#a2c96c), color-stop(100%,#77b04a)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #adcf75 0%,#a2c96c 4%,#77b04a 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #adcf75 0%,#a2c96c 4%,#77b04a 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #adcf75 0%,#a2c96c 4%,#77b04a 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #adcf75 0%,#a2c96c 4%,#77b04a 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#adcf75', endColorstr='#77b04a',GradientType=0 ); /* IE6-9 */
}

.btn-green:hover {
	background: #a4cc5f; /* Old browsers */
	background: -moz-linear-gradient(top,  #a4cc5f 0%, #95c64f 4%, #6daf36 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a4cc5f), color-stop(4%,#95c64f), color-stop(100%,#6daf36)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #a4cc5f 0%,#95c64f 4%,#6daf36 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #a4cc5f 0%,#95c64f 4%,#6daf36 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #a4cc5f 0%,#95c64f 4%,#6daf36 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #a4cc5f 0%,#95c64f 4%,#6daf36 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a4cc5f', endColorstr='#6daf36',GradientType=0 ); /* IE6-9 */
}

.btn-orange {

    border: 1px solid #C4853E;
    background: #D5A44C; /* Old browsers */
    background: -moz-linear-gradient(top,  #f1a26e 0%, #f1a877 4%, #ee9255 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ee9255), color-stop(4%,#f1a26e), color-stop(100%,#ee9255)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #f1a26e 0%,#f1a877 4%,#ee9255 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #f1a26e 0%,#f1a877 4%,#ee9255 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #f1a26e 0%,#f1a877 4%,#ee9255 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #f1a26e 0%,#f1a877 4%,#ee9255 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1a877', endColorstr='#ee9255',GradientType=0 ); /* IE6-9 */
}

.btn-orange:hover {
    opacity: 0.90;
    transition:opacity 0.2s ease-in-out 0s;
}

// okvir

  .img-border {
    padding:3px;
    border: 1px solid #6d6d6d;
}


.namig{
   float: right;
}

.gumb{
    font-size: 13px;
    margin: 5px 0 0;
}

.feedbackbutton, .jsxbutton{
 background: #f7f7f7; /* Old browsers */
	background: -moz-linear-gradient(top,  #f7f7f7 0%, #e8e8e8 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f7f7f7), color-stop(100%,#e8e8e8)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #f7f7f7 0%,#e8e8e8 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #f7f7f7 0%,#e8e8e8 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #f7f7f7 0%,#e8e8e8 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #f7f7f7 0%,#e8e8e8 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f7', endColorstr='#e8e8e8',GradientType=0 ); /* IE6-9 */
    border: 1px solid #C3C3C3;
    box-shadow: 0 1px 2px #FFFFFF inset;
    color: #686868;
    text-shadow: none;
	padding:7px;
	border-radius: 3px;
	display: inline-block;
	font-size: 12px;
	line-height: 16px;
	font-family:Arial, Helvetica, sans-serif;
	letter-spacing:1px;
}

.feedbackbutton:hover{
    background: -moz-linear-gradient(top,  #fcfcfc 0%, #efefef 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fcfcfc), color-stop(100%,#efefef)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #fcfcfc 0%,#efefef 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #fcfcfc 0%,#efefef 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #fcfcfc 0%,#efefef 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #fcfcfc 0%,#efefef 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#efefef',GradientType=0 ); /* IE6-9 */
    border: 1px solid #C3C3C3;
    box-shadow: 0 1px 2px #FFFFFF inset;
    color: #686868;
    text-shadow: none;
}

/**
 * Breadcrumbs
 */
.breadcrumbs {
	font-size: 12px;
	text-align: center;
}

.breadcrumbs ul {
	padding: 0;
	margin: 0 0 15px 15px;
}

.breadcrumbs li {
	display: inline-block;
	padding: 0 25px 0 0;
	position: relative;
}

/*
.breadcrumbs li:before {
	content: '/';
	color: #5fb5d5;
	position: absolute;
	right: 8px;
	top: -1px;
	font-size: 13px;
}
*/
.breadcrumbs a {
	color: #2c2c2c;
}

.breadcrumbs li:last-child a {
	color: #999;
	font-size: 12px;
}

.breadcrumbs li:last-child:before {
	display: none;
}

.unit-path {
	color: silver;
	font-size: 12px; 
	vertical-align:bottom;
}
/**
 * Pages
 */
.page {
	width: 50%;
	float: left;
	min-height: 680px;
}

.page-left {
	padding: 0 25px 0 15px;
	border-right: 1px solid #d2d2d2;
}

.page-center{
	padding: 0 15px 0 15px;
	border-right: 1px solid #d2d2d2;
}

.page-right {
	padding: 0 15px 10px 25px;
}
.summary {
	width: 100%;
	float: left;
	min-height: 680px;
	padding: 0 25px 0 15px;
}

/**
 * Questions
 */
.question {
	padding: 0 10px;
}

.question-red {
	border-left: 2px solid #f67a4b;
}

.question-green {
	border-left: 2px solid #a4c970;
}

/**
 * Boxes
 */
 
.jxgbox {
   line-height: 135%;
}

 
 
.box_dejstvo {
	margin: 15px 0;
	padding: 8px 19px 5px 10px;
	background: #f4e0df;
	border-top: 1px solid #cdcdcd;
	border-left: 1px solid #cdcdcd;
	border-right: 1px solid #cdcdcd;
	border-bottom: 2px solid #cc5d5b;
	font-weight:normal;
	position: relative;

}
.box_definicije {
	margin: 15px 0;
	padding: 8px 19px 5px 10px;
	background: #f0f6e8;
	border-top: 1px solid #cdcdcd;
	border-left: 1px solid #cdcdcd;
	border-right: 1px solid #cdcdcd;
	border-bottom: 2px solid #769c46;
	font-weight:normal;
	position: relative;

}
.box_zanimivost {
	margin: 10px 0;
	padding: 8px 19px 5px 10px;
	background: #fdeadc;
	border-top: 1px solid #cdcdcd;
	border-left: 1px solid #cdcdcd;
	border-right: 1px solid #cdcdcd;
	border-bottom: 2px solid #f78939;
	font-weight:normal;
	position: relative;

}
.box_aktivnost {
	margin: 10px 0;
	padding:8px 19px 5px 10px;
	background: #e7f4f9;
	border-top: 1px solid #cdcdcd;
	border-left: 1px solid #cdcdcd;
	border-right: 1px solid #cdcdcd;
	border-bottom: 2px solid #7ac4dd;
	font-weight:normal;
	position: relative;

}

.box_aktivnost:after, .box_zanimivost:after,
.box_definicije:after, .box_dejstvo:after {
	visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}
	

.box {
	margin: 10px 0;
	padding: 8px 19px 5px 10px;
	background: #fff;
	border: 1px solid #cdcdcd;
	font-weight:normal;
	position: relative;
}
/*.box_dejstvo p, .box_definicije p,.box_zanimivost p, .box_aktivnost p {margin: 6px 0 2px; }*/



.box2 {
	margin: 30px 0 0 25px;
	padding: 8px 19px 5px 10px;
	background: #fff;
	border: 1px solid #cdcdcd;
	font-weight:normal;
	position:relative;
}
.box2_dejstvo {
	margin: 30px 0 0 25px;
	padding: 8px 19px 5px 10px;
	background: #f4e0df;
	border-top: 1px solid #cdcdcd;
	border-left: 1px solid #cdcdcd;
	border-right: 1px solid #cdcdcd;
	border-bottom: 2px solid #cc5d5b;
	font-weight:normal;
	position:relative;
}
.box p {
	margin: 13px 0;
}

.box p:first-child {
	margin-top: 0;
}

.box p:last-child {
	margin-bottom: 0;
}

.box .formula {
	margin: -8px 0;
}

.posebna_znanja {
	border-left: 2px dashed brown;  
	margin-left:-2px;	
}

.izbirna_znanja{
	border-left: 2px solid brown;
	margin-left:-2px;
}


/**
 * Gallery
 */
.gallery {
	margin: 0px auto;
	padding: 0px;
	width: 400px;
}

.gallery-title {
	margin: 20px auto -10px;
	width: 335px;
	font-size: 14px;
	display: none;
}

.gallery img {
	border: none;
}

.gallery-preview {
	position: relative;
}

.gallery-items {
	margin: 10px 0 5px;
	width: 350px;
	height: 85px;
	position: relative;
	padding: 0 30px;
}

.gallery-items img {
	margin: 5px 5px;
	cursor: pointer;
	background: #fff;
}


.gallery-items img:hover {
	outline: 1px solid #6ccff3;
}

.gallery-items img.active {
	outline: 1px solid #5fb5d5;
	cursor: default;
}

.gallery-items-next,
.gallery-items-prev {
	position: absolute;
	top: 30px;
	background: #fff;
	border-radius: 15px;
	width: 26px;
	height: 26px;
	display: block;
	background-position: center center;
	background-repeat: no-repeat;
	cursor: pointer;
}

.gallery-items-next {
	right: 0;
	background-image: url(../img/main/gallery-arrow-next.png);
}

.gallery-items-prev {
	left: 0;
	background-image: url(../img/main/gallery-arrow-prev.png);
}

.gallery-items {
	overflow: hidden;
}

.gallery-items-group {
	/*display: none;*/
	left: 400px;
}

.gallery-items-group-active {
	/*display: block;*/
	left: 30px;
}

.besediloObSliki {
	    height: 24px;
    text-align: center;	
	overflow:hidden;
	padding:3px;
}


/* eksperiment nastavitve */
.wrapper ul {margin-top:-2px;}
.wrapper ul li {  margin-left: 15px; list-style-type: circle;}

.eksperiment_sekcije {	background:  #f4e0df; padding:2px 5px;}

/**
 * Video
 */
 .video{
	margin: 50px 0 0 0;
}
 
 
/**
 * Feedback
 */
.page {
	position: relative;
}

.feedback-top {
    position: relative;
}
.feedback-top .feedbackbutton{
    position: relative;
}
.feedback-content-top {
    position: fixed;
    left: 0px;
    width: 480px;
    background: #f7f7f7;
    margin: 0 4px;
    padding-bottom: 25px;
	border: 3px solid #7AC1DE;
    z-index: 1000;
    line-height: 19px!important;
}

.feedback-content-container{
	position: relative;
	top: 25px;
	padding: 12px;
	overflow:auto;
	max-height:475px;
}

.feedback-exercise-top {
    position: absolute;
    left: 0px;
    padding: 12px;
    width: 460px;
    background: #f7f7f7;
    margin: 0 4px;
	border: 3px solid #7AC1DE;
    z-index: 1000;
    line-height: 19px!important;
}

.feedback-close{
	z-index:1001;
	padding: 10px;
	position: absolute;
	right: 0px;
	top: 1px;
	display: block;
	background: url(feedback-close.png) center center no-repeat;
	cursor: pointer;
}

.close{
	z-index:1001;
	padding: 10px;
	position: absolute;
	right: 0px;
	top: 1px;
	display: block;
	background: url(feedback-close.png) center center no-repeat;
	cursor: pointer;
}

.feedback-draggable{
	position: absolute;
	padding:2px;
	cursor: move;
	height: 25px;
	width: 100%;
	background-color: #7AC1DE;
}


/**
 * Inputs
 */
.polja{
   border: 1px solid #CDCDCD;
    font-size: 12px;
    height: 20px;
    margin: 0 0 10px;
    padding: 3px 0 0 3px;
    /*width: 30px!important;*/
    color: #000;
    margin: 2px;	
  /*  background: #bed4ad!important;*/
}
.poljaTable{
   border: 1px solid #CDCDCD;
    font-size: 14px;
    height: 20px;
    padding: 3px 0 0 2px;
    width: 45px;
    color: #000;	
}
.poljaTable2{
   border: 1px solid #CDCDCD;
    font-size: 14px;
    height: 20px;
    padding: 3px 0 0 2px;
    width: 80px;
	margin:1px;
	color: #000;
		
}
.rezultat{
font-weight: bold;
font-size: 12px;
color:#5FB5D5;
margin:5px !important;
 }
 .blockb {
    margin: 5px 0 0;
    clear: both;
	*zoom: 1;
}
 .popupb {
    margin: 5px 0 0;
}
 .popup {
    margin: 15px 0 0 0;
}
  table {
  border-collapse: collapse;
	font-size:12px;
	 margin:0 0 10px; font-size: 14px;
}
.tDefault{
background:#f7f7f7; 
}

.tDefault tbody td, .tDefault thead td {
    border: 1px solid #DFDFDF!important;
    box-shadow: 0 1px 0 #FAFAFA inset;
    
}
.tDefault tbody td:first-child, .tDefault thead td:first-child {
    border-left: medium none;
}
.checkAll thead td:first-child > img {
    padding-bottom: 2px;
    vertical-align: middle;
}
.tDefault thead td {
    background: none repeat scroll 0 0 #EEEEEE;
    color: #909090;
    font-size: 11px;
    padding: 3px 5px 2px;
    text-align: center;
}
.tDefault tbody td {
    padding: 3px;
    vertical-align: middle;
}
.tDefault tbody tr {
    border-top: 1px solid #DFDFDF;
}
.tDefault tbody tr:first-child {
    box-shadow: 0 1px 0 #FFFFFF inset;
		
}
.tDefault tbody tr:nth-child(2n) {
    background: none repeat scroll 0 0 #F2F2F2;
}
 
/* 
match - povezovanje  
*/ 
.celica{
	overflow:auto;
    display: inline-block;
    vertical-align: middle;
    line-height: 1em;
	padding:5px;	
}

/**
 * Triangles
 */

.triangle {
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 34px 26px 0;
	position: absolute;
	top: 0;
	right: 0;
}

.triangle-red {
	border-color: transparent #e09e9d transparent transparent;
}

.triangle-blue {
	border-color: transparent #afdceb transparent transparent;
}

.triangle-green {
	border-color: transparent #adc490 transparent transparent;
}
.triangle-orange {
    border-color: transparent #fbbe92 transparent transparent;
}

/**
 * Checkboxes
 */
form {
	margin: 15px 0 15px 0;
}

form button{
	margin-top:15px;
	}
.checkbox-label {
	/*font-size: 13px;*/
	color: #000000;
	display: block;
    margin-bottom: 5px;
    margin-left: 25px;
    margin-top: -21px;
    vertical-align: middle;
}

.input-row {
	margin: 2px 0;
}

/**
 * Tooltip
 */

 .popupDiv {
    margin: 0 4px;
	border: 2px solid #7AC1DE;
	position: absolute;
	left: 0;
	width: 100%;
	height: auto;
	background: #f4f4f4;
}
 .popupDiv p{
   padding: 15px;
}

.popupdiv .img-caption {
	margin: 0px;
	position: absolute;
	right: 0;
	top: 0;
	width: 30px;
	z-index: 100;
	border: none;
}

.popupdiv .img-caption .caption {
	display: none;
}

.popupdiv .img-caption img {
	border: none;
}

.popupDivLabel {
	padding: 10px 15px;
	margin: 0;
	text-align: left;
	display: block;
	font-weight: bold;
	font-size: 13px;
	border-bottom: 1px solid #cdcdcd;
	color: #000000;
	position: relative;
	background: #f7f7f7; /* Old browsers */
	background: -moz-linear-gradient(top,  #f7f7f7 0%, #e8e8e8 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f7f7f7), color-stop(100%,#e8e8e8)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #f7f7f7 0%,#e8e8e8 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #f7f7f7 0%,#e8e8e8 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #f7f7f7 0%,#e8e8e8 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #f7f7f7 0%,#e8e8e8 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f7', endColorstr='#e8e8e8',GradientType=0 ); /* IE6-9 */
}

/**
 * Numbers
 */
.numbered {
	padding-left: 30px;
	position: relative;
}

.numbered-frame {
	padding-left: 21px;
	position: relative;
}
.numbered-frame2 {
	padding-left: 15px;
	position: relative;
}
.numbered2 {
	padding-left: 25px;
	position: relative;
}

.number {
	 background: url("../img/main/number.jpg") no-repeat scroll center center transparent;
    display: inline-block;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 12px;
    font-weight: bold;
    height: 22px;
    left: 0;
    line-height: 23px;
    margin-top: -1px;
    position: absolute;
    text-align: center;
    width: 22px;
}
.number2 {
	 background: url("../img/main/number.jpg") no-repeat scroll center center transparent;
    display: inline-block;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 12px;
    font-weight: bold;
    height: 22px;
    left: -10px;
    line-height: 23px;
    margin-top: -1px;
    position: absolute;
    text-align: center;
    width: 22px;
}

.number3 {
	 background: url("../img/main/number.jpg") no-repeat scroll center center transparent;
    display: inline-block;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 12px;
    font-weight: bold;
    height: 22px;
    left: 0;
    line-height: 23px;
    margin-top: 10px;
    position: absolute;
    text-align: center;
    width: 22px;
}

.number-blue {
	color: #2158aa;
}

.number-red {
	color: #ef3e48;
}

.number-green {
	color: #78a419;
}


/* naloge*/

.pravilenOdgovor{
	color: #76ae4a;
	/*padding: 5px 0 0 0;*/
	font-weight:bold;
	font-size:12px;
}

.pravilenOdgovorTF{
	background-color: #76ae4a;
}

.napacenOdgovor{
	color: #f76e4d;
	/*padding:5px 0 0 0;*/
	font-weight:bold;
	font-size:12px;
}

.napacenOdgovorTF{
	background-color: #f76e4d;
}

.hideall{
	margin-top: -5px;
	line-height:16px;
}
.hideall2{
	margin-top: 0;
}
.hideall3{
	margin: 0 0 0 -30px;
}

.ui-button-exe, .ui-button-exe3{
	font-size:100%; 
	overflow: auto; 
	width: 160px;   
	height: 7ex;  
	padding: 0.5em; 
	margin: 5px;
	border: 1px solid rgba(0, 0, 0, 0.1);
	box-shadow: 4px 4px 4px #888888;
	    display:table-cell;
    vertical-align:middle;
    text-align: center;
}
.ui-button-exe1{
	border: 1px solid rgba(0, 0, 0, 0.1);
	box-shadow: 4px 4px 4px #888888;
	font-size:80%; 
	overflow: auto; 
	background-color:#F8F8F8;
	width: 160px;   
	height: 7ex;  
	color:silver;
    display:table-cell;
    vertical-align:middle;
    text-align: center;
	margin: 5px;
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
	background-color: transparent;
	border: 0;
	overflow: hidden;
	/* IE 6/7 fallback */
	*text-indent: -9999px;
}

.ir:before {
	content: "";
	display: block;
	width: 0;
	height: 150%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
	display: none !important;
	visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
	clip: auto;
	height: auto;
	margin: 0;
	overflow: visible;
	position: static;
	width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
	visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
	content: " "; /* 1 */
	display: table; /* 2 */
}

.clearfix:after {
	clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
	*zoom: 1;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   Theses examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
	/* Style adjustments for viewports that meet the condition */
}

@media print,
	   (-o-min-device-pixel-ratio: 5/4),
	   (-webkit-min-device-pixel-ratio: 1.25),
	   (min-resolution: 120dpi) {
	/* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
	* {
		background: transparent !important;
		color: #000 !important; /* Black prints faster: h5bp.com/s */
		box-shadow: none !important;
		text-shadow: none !important;
	}

	a,
	a:visited {
		text-decoration: underline;
	}

	a[href]:after {
		content: " (" attr(href) ")";
	}

	abbr[title]:after {
		content: " (" attr(title) ")";
	}

	/*
	 * Don't show links for images, or javascript/internal links
	 */

	.ir a:after,
	a[href^="javascript:"]:after,
	a[href^="#"]:after {
		content: "";
	}

	pre,
	blockquote {
		border: 1px solid #999;
		page-break-inside: avoid;
	}

	thead {
		display: table-header-group; /* h5bp.com/t */
	}

	tr,
	img {
		page-break-inside: avoid;
	}

	img {
		max-width: 100% !important;
	}

	@page {
		margin: 0.5cm;
	}

	p,
	h2,
	h3 {
		orphans: 3;
		widows: 3;
	}

	h2,
	h3 {
		page-break-after: avoid;
	}
	

