/********************************
* CSS for sirovine.rs
* author: vladimir@mrav.rs
* date: 2015-11-11
********************************/

/* responsive */

* {
    box-sizing: border-box;
}

.print_only {display: none;}

.row {
    margin: 0 auto;
    width: 100%;
    clear: both;
    display: block;
}

.row:after {
    content: "";
    clear: both;
    display: block;
}

/* mobile */
[class*="col-"] {
    float: left;
    padding: 10px;
    width: 100%;
}

/* tablet */
@media only screen and (min-width: 600px) {
    .col-m-01 {width: 8.33%;}
    .col-m-02 {width: 16.66%;}
    .col-m-03 {width: 25%;}
    .col-m-04 {width: 33.33%;}
    .col-m-05 {width: 41.66%;}
    .col-m-06 {width: 50%;}
    .col-m-07 {width: 58.33%;}
    .col-m-08 {width: 66.66%;}
    .col-m-09 {width: 75%;}
    .col-m-10 {width: 83.33%;}
    .col-m-11 {width: 91.66%;}
    .col-m-12 {width: 100%;}
}

/* desktop */
@media only screen and (min-width: 960px) {
    .col-01 {width: 8.33%;}
    .col-02 {width: 16.66%;}
    .col-03 {width: 25%;}
    .col-04 {width: 33.33%;}
    .col-05 {width: 41.66%;}
    .col-06 {width: 50%;}
    .col-07 {width: 58.33%;}
    .col-08 {width: 66.66%;}
    .col-09 {width: 75%;}
    .col-10 {width: 83.33%;}
    .col-11 {width: 91.66%;}
    .col-12 {width: 100%;}
}

/* old */

body {
    margin: 0;
    background-color: #fff; 
    color: #000; 
    font-family: 'Oswald', sans-serif; 
    /*min-width: 1280px;*/
}

/* Tables */
table {width: 90%; font-family: Arial, sans-serif;}

thead {background-color: #efefef;}
/*
th, td {border-bottom: 1px solid #ddd; padding: 5px 10px;}
th {background-color: #ddd}
tr:hover {background-color: #eee}
tr:nth-child(even) {background-color: #ddd}
*/

/* Headings */
h1, h2, h3, h4, h5, h6 {text-align: center;}

ul {padding: 0;}

ul > li {list-style: none;}

a {color: #696;}
a:hover {color: #000; text-decoration: none;}

.clear {clear: both; overflow: auto;}

/* header.php */

#header {border-bottom: 2px #000 solid; text-align: left; padding: 0px; width: 100%; min-height: 86px}
/*#header a {color: #696;}
#header a:hover {color: #ccc; text-decoration: none;}*/

#logo {min-width: 300px; display: block; text-align: center;}

#jezik {min-width: 250px; margin: 30px 0 10px 0; display: block; text-align: center;}
#jezik ul li {list-style: none; display: inline; padding: 2px;}
#jezik ul li a:hover {opacity: 0.5;}

#header-info {}
#slogan {font-weight: 700; font-size: 1.8em; text-transform: uppercase;}

.slogan_sirovina {color: #696}
.slogan_berza {color: #09c}
.slogan_period {color: #c00}
.slogan_trades {color: #09c}

#datum {margin: 0 10px; clear:right; text-align: center;}


/* index.php */

#wrapper {margin: 0 auto; text-align: center; overflow: auto; display: block;}
.left {margin: 10px 0; z-index: 3;}
.main {margin: 10px auto; padding: 0 10px 60px 10px; overflow: auto;}
.right {margin: 10px 0; z-index: 2; padding-bottom: 60px; overflow: auto;}

.box {
    /*min-width: 300px;*/
    /*max-width: 500px;*/
    min-height: 500px;
    padding: 0 10px;
    /*margin: 10px;*/
    /*border: 2px solid #096;
    border-radius: 10px;*/
    text-align: center;
    /*box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);*/
}

.box img {
    /*border-radius: 50%;*/
    max-width: 250px;
    height: auto;
}

/* analiza.php */

/*#analiza, #berza {background: #fff url('../images/baneri/sirovine.jpg') no-repeat center; text-align: center;}*/

/*#ie8_msg,*/

.info {padding: 5px; color: #999; font-family: Arial; font-size: 0.8em;}
#servis {padding: 5px; margin-bottom: 20px; color: #fff; background-color: #f00;}

/* Menus */
#menu_main ul li { list-style: none; display: inline;}
#menu_main ul li.selected a{background-color:#ddd;}

#menu_berze ul li { list-style: none; display: inline;}
#menu_berze ul li.selected a{background-color:#6cf;}

#menu_sirovine ul li {list-style: none; display: inline-block;}
#menu_sirovine ul li.selected a {background-color:#9c9;}

#menu_period ul li {list-style: none; display: inline-block;}
#menu_period ul li.selected a{background-color:#c00;}

#menu_trades ul li {list-style: none; display: inline-block;}
#menu_trades ul li.selected a{background-color:#6cf; color: #000;}

/* Buttons */
.button {color: #000; text-indent:0; text-align: center; text-transform: uppercase; text-decoration: none; display: inline-block; border-radius: 4px; min-width: 160px; margin: 4px; padding: 8px 0; border: 1px #999 solid;}

.button.green {background-color: #cec;}
.button.green:hover {background-color: #9c9 !important; opacity: 0.9;}

.button.blue {background-color: #cef; color: #000;}
.button.blue:hover {background-color: #6cf; opacity: 0.9;}

.button.red {background-color: #f33; color: #fff;}
.button.red:hover {background-color: #c00; opacity: 0.9;}

.button.orange {background-color: #fc0; color: #000;}
.button.orange:hover {background-color: #f90; opacity: 0.9;}

.button.grey {background-color: #eee; color: #000;}
.button.grey:hover {background-color: #ccc; opacity: 0.9;}

.button.white {background-color: transparent; color: #000;}
.button.white:hover {background-color: #ddd;}

#social a {color: #369; padding: 0 10px;}
#social a:hover {color: #999;}

#address {width: 380px; margin: 20px auto; padding: 10px; border: #696 3px solid; text-align: left;}

#banner-header {float: left; margin: 4px 0 0 140px;}
#banner-right img {margin-top: 40px; opacity: 0.7;}
#banner-right img:hover {opacity: 1;}

#footer {background-color: #fff; border-top: 2px #000 solid; color: #666; padding: 10px 0; font: normal 0.8em Arial; text-align: center; width: 100%;
    position: fixed;
    bottom: 0;
    margin-top: 20px;
}
#footer a {color: #696; text-decoration: none;}
#footer a:hover {color: #333; text-decoration: underline;}

.debug {color: #f00; font: normal 0.8em Arial; text-align: left; list-style: none; padding-left: 20px;}
.discrete {color: #666;}

/*
#tabela {
    min-width: 600px;
    text-align: center;
    margin: 0 auto;
}
*/

#grafik {
    max-width: 90%;
    min-height: 400px;
    margin: 0 auto;
    border: 1px #ccc solid;
    /*overflow: auto;*/
}

fieldset {
    display: block;
    -webkit-margin-start: 2px;
    -webkit-margin-end: 2px;
    -webkit-padding-before: 0.35em;
    -webkit-padding-start: 0.75em;
    -webkit-padding-end: 0.75em;
    -webkit-padding-after: 0.625em;
    min-width: -webkit-min-content;
    border: 0;
}

#valid_number {color: #0c0;}
#invalid_number {color: #900;}
.cursive {color: #666; font-family: Arial; font-size: 0.8em;}

/*
#about {
    background: url('../images/bg1.jpg');
    width: 1920px;
    height: 540px;
}

#contact {
    background: url('../images/bg3.jpg');
    width: 1920px;
    height: 540px;
}
*/

/* CSV Table Classes */
table.csvtable {
	margin: 0 auto;
    font-family: 'Oswald', sans-serif;
	border-collapse: collapse;
}

/* header */
table.csvtable thead tr {
	background: #cef;
}
table.csvtable th {
	font-family: 'Oswald', sans-serif;
	font-size: 1em;
}

/* table cells */
table.csvtable td, table.csvtable th {
	padding: 8px;
	text-align: left;
	border-bottom: 1px solid #ffffff;
	border-top: 1px solid transparent;
}
/* default background color for rows */
table.csvtable tr {
	background: #f0f0f0;
}
/* background color for odd rows */
table.csvtable tr.odd {
	background: #f9f9f9;
}
/* hover color for all rows */
table.csvtable tr:hover {
	background: #cef;
}

/* Font-Awesome icons */
.fa-light {color: #9c9;}

.more-info {
    position: relative;
    cursor:help
}

.more-info .title {
    position: absolute;
    top: 20px;
    left: -130px;
    padding: 6px;
    border-radius: 4px;
    font-family: Arial, sans-serif;
    font-size: 0.8em;
    background-color: #9c9;
    color: #fff;
    white-space: nowrap;
    z-index: 9;
}

.more-info.usericon .title {
    position: absolute;
    top: 0;
    left: 40px;
    padding: 6px;
    border-radius: 4px;
    font-family: Arial, sans-serif;
    font-size: 1em;
    background-color: #369;
    color: #fff;
    white-space: nowrap;
    z-index: 9;
}

/* Reports */

#report-right {
    padding: 10px 0;
}

.report {text-transform: uppercase; padding: 10px 0;}
.report a {background-color: #f90; color: #fff; text-decoration: none;}
.report a:hover {text-decoration: none; background-color: #f90; color: #000;}

.img-report:hover {opacity: 0.66;}

.reports:hover {background-color: #ded;}


/* jQuery Tablesorter Classes */
/*
table.tablesorter {
	font-size: 12px;
	background-color: #4d4d4d;
	width: 1024px;
	border: 1px solid #000;
}
table.tablesorter th {
	text-align: left;
	padding: 5px;
	background-color: #6e6e6e;
}
table.tablesorter td {
	color: #fff;
	padding: 5px;
}
table.tablesorter .even {
	background-color: #3d3d3d;
}
table.tablesorter .odd {
	background-color: #6e6e6e;
}
table.tablesorter .header {
	background-image: url(../images/bg.png);
	background-repeat: no-repeat;
	border-left: 1px solid #fff;
	border-right: 1px solid #000;
	border-top: 1px solid #fff;
	padding-left: 30px;
	padding-top: 8px;
	height: auto;
}
table.tablesorter .headersortup {
	background-image: url(../images/asc.png);
	background-repeat: no-repeat;
}
table.tablesorter .headersortdown {
	background-image: url(../images/desc.png);
	background-repeat: no-repeat;
}
*/

/*
form {text-align: center;}
form label {
    display: inline-block;
    padding: 0.5em 0;
    margin: 0 0.5em 0 0;
    text-align: right;
    vertical-align: middle;
    width: 150px;
}
form input {
   -moz-box-sizing: border-box;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: 0 1px 3px #ddd inset;
    display: inline-block;
    padding: 0.5em 0.6em;
}
form input.disabled:hover {cursor: not-allowed;}
form input.required:focus {border: 1px solid #c00;}
form button.submit {
    background-color: #696;
    border-radius: 4px;
    border: 0 none rgba(0, 0, 0, 0);
    color: #fff;
    font-family: Oswald;
    margin-top: 0.5em;
    padding: 0.5em 1.5em;
    cursor: pointer;
}
form button.submit:hover {
    background-color: #9c6;
    color: #ccc;
}
*/

