
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

body, h1, h2, h3, h4, h5, h6, p, ul { padding: 0; margin: 0; }
a, a:hover { text-decoration: none; outline: none; }
textarea, input, select { color: #777; border: 1px solid #ddd; border-radius: 3px; padding: 10px; font: 14px 'Open Sans', sans-serif; }
textarea { width: 100%; }
fieldset { max-width: 100%; }
ul > li { list-style: none; }
a { color: #0d588d; }
a:hover { color: #2595e7; }

table { width: 100%; margin-bottom: 30px; }
table tr {}
table tr td { background-color: #f1f1f1; padding: 5px 10px; font-size: 13px; }
table tr.date td, table tr.date:hover td { background-color: #fafafa; padding: 20px 10px 5px 10px; font-weight: bold; }
table tr.counter td, table tr.counter:hover td { color: #aaa; background-color: #fafafa; padding: 5px 10px 20px 10px; font-weight: bold; }
table tr.counter:nth-child(2) { display: none; }
table tr.date i, table tr.counter i { margin-right: 5px; }
table tr:first-child td { background-color: #e1e1e1; }
table tr td.centered { text-align: center; }
table tr td strong { font-size: 13px; }
/*
table tr:nth-child(even) td { background-color: #f1f1f1; }
table tr:nth-child(odd) td { background-color: #e1e1e1; }
*/
table tr:hover td { background-color: #e1e1e1; }
table tr.rereply td { background-color: #f1ddcc; }

/* TABLE NEW */

table.new { margin-bottom: 0px; }
table.new tr:first-child th:first-child { border-radius: 5px 0px 0px 0px; }
table.new tr:first-child th:last-child { border-radius: 0px 5px 0px 0px; }
table.new tr:last-child td:first-child { border-radius: 0px 0px 0px 5px; }
table.new tr:last-child td:last-child { border-radius: 0px 0px 5px 0px; }
table.new tr[data-href^="index.php"]:hover, table.new tr[data-chathref^="index.php"]:hover { cursor: pointer; }
table.new tr th { background-color: #d8dde5; padding: 10px; font-size: 13px; text-align: left; text-transform: uppercase; }
table.new tr td { background-color: #f6f8fc; padding: 10px; }
table.new tr.user-guest td { background-color: #fea; }
table.new tr[data-href^="index.php"]:hover td, table.new tr[data-chathref^="index.php"]:hover td { background-color: #e8ebf1; }
table.new tr td span.status { background-color: #d8dde5; border-radius: 3px; padding: 2px 5px; font-size: 12px; font-weight: 400; text-align: center; display: block; }
table.new tr td span.status-open { background-color: #ff5963; color: #fff; }
table.new tr td span.status-processing { background-color: #da794e; color: #fff; }
table.new tr td span.status-elaborated { background-color: #dac14e; color: #fff; }
table.new tr td span.status-technical-support { background-color: #e8aaf1; color: #fff; }
table.new tr td span.status-on-hold { background-color: #555; color: #fff; }
table.new tr td span.status-solved { background-color: #85c646; color: #fff; }
table.new tr td span.status-closed { background-color: #d8dde5; color: #aaa; }
table.new tr td span.status-quote { background-color: #4e90da; color: #fff; }

table.new tr td span.priority { background-color: #d8dde5; border-radius: 3px; padding: 2px 5px; font-size: 12px; font-weight: 400; text-align: center; display: block; }
table.new tr td span.priority-high { background-color: #ff5963; color: #fff; }
table.new tr td span.mid { background-color: #da794e; color: #fff; }

table.new tr.date td, table tr.date:hover td { padding: 10px 20px; }

/* TABLE PRIORITY */
table.new tr.priority-mid td { background-color: #fea; }
table.new tr.priority-high td { background-color: #fca; }

/* GENERAL */

h1, h2 { border-bottom: 1px solid #f1f1f1; padding-bottom: 10px; margin-bottom: 20px; font-size: 20px; }
div { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.clear { clear: both; }
.button { -webkit-appearance: none; -moz-appearance: none; appearance: none; }
.button { color: #fff; background-color: #2595e7; border-radius: 5px; padding: 10px; font-size: 12px; cursor: pointer; text-transform: uppercase; }
.button:hover { background-color: #0d588d; }
.button-new { -webkit-appearance: none; -moz-appearance: none; appearance: none; }
.button-new { background-color: #2595e7; color: #fff; height: 40px; line-height: 40px; border-radius: 5px; border: 0px; padding: 0px 20px; margin: 0px 0px 20px 0px; font-size: 13px; font-weight: 800; text-transform: uppercase; display: inline-block; cursor: pointer; }
.button-new:hover { background-color: #0d588d; color: #fff; }
.button-new[disabled="disabled"] { opacity: 0.3; }
.button-new.mini-black { background-color: #000; color: #fff; padding: 0px 10px; }
.main .button { display: inline-block; }

body { color: #222; background-color: #f6f8fc; font: 14px 'Open Sans', sans-serif; }
.box { background-color: #fff; border-radius: 5px; padding: 20px; margin: 0px 0px 20px 0px; }
.one-third { width: 33.333%; float: left; }
.one-fourth { width: 25%; float: left; }
.disabled { color: #aaa; }

/* GRID */
.opn-row { padding: 10px 0px; margin: 0px -10px; clear: both; position: relative; }
.opn-row:after { content: ''; display: block; clear: both; }
.opn-row > div { padding: 0px 10px; }
.opn-col-1 { width: 8.333%; float: left; }
.opn-col-2 { width: 16.666%; float: left; }
.opn-col-3 { width: 25%; float: left; }
.opn-col-4 { width: 33.333%; float: left; }
.opn-col-6 { width: 50%; float: left; }
.opn-col-8 { width: 66.666%; float: left; }
.opn-col-9 { width: 75%; float: left; }
.opn-col-12 { width: 100%; float: left; }

#container { margin: auto; }

/* HEADER */

#header { height: 90px; padding: 0px 20px; }
#header #logo { height: 50px; padding: 20px; float: left; display: block; }
#header #logo img { height: 50px; }
#header #nav { float: left; }
#header #nav li { height: 90px; line-height: 90px; display: inline-block; position: relative; }
#header #nav li a { color: #2c2c41; height: 90px; line-height: 90px; border-bottom: 5px solid #fff; padding: 0px 20px; font-size: 14px; font-weight: 800; text-transform: uppercase; display: block; }
#header #nav li.selected a, #header #nav li a:hover { border-color: #2595e7; }
#header #nav li small { background-color: #2595e7; color: #fff; font-weight: bold; min-width: 16px; height: 16px; line-height: 16px; border-radius: 5px; padding: 0px 5px; margin-left: -9px; font-size: 10px; font-weight: 700; text-align: center; display: block; position: absolute; top: 53px; left: 50%; }
#header #logout { margin: 25px 20px 0px 0px; float: right; }


/* CONTENT */

#content { padding: 20px; }

/* SIDEBAR */

#sidebar { width: 20%; margin-right: 1%; float: left; }
#sidebar .title { border-bottom: 1px solid #f1f1f1; padding-bottom: 15px; display: block; }
#sidebar .title .fa { font-size: 20px; }
#sidebar .fa { margin-right: 5px; }

/* MAIN */

.main { width: 79%; float: left; }
.main form {}
.main form .row { margin-bottom: 20px; }
.main form label { width: 150px; margin-top: 10px; display: inline-block; float: left; }
.main form input { width: 500px; max-width: 100%; }
.main form input[type=text] { height: 40px; }
.main form input[type=file] { height: 45px; }
.main form input[type=checkbox],
.main form input[type=submit] { width: auto; }
.main form input[name=files],
.main form input[name=files_of],
.main form input[name=files_free],
.main form select[name=files_free_date],
.main form input[name=files_free_recharge],
.main form input[name=filesphl],
.main form input[name=filesphl_of],
.main form input[name=filesfpro],
.main form input[name=filesfpro_of] { width: 50px; text-align: right; }
.main form input[name=files_unlimited],
.main form input[name=files_free_deadline] { width: 100px; text-align: right; }
.main form select { width: 500px; max-width: 100%; height: 40px; }
.main form textarea { width: 500px; max-width: 100%; height: 100px; }

.main .opn-row label { width: auto; margin-top: 0; display: inline; float: none; cursor: pointer; }
.main .opn-row input { margin-bottom: 10px; }
.main .opn-row input[type=checkbox] { margin-bottom: 7px; }
.main .opn-row input[type=file] { margin-bottom: 0; }
.main .opn-row select { margin-bottom: 10px; cursor: pointer; }
.main .opn-row textarea { width: 100%; height: 545px; display: block; }

.input { width: 500px; max-width: 100%; color: #aaa; padding: 10px; margin: 0; font-size: 14px; display: inline-block; }

#dashboard ul { margin-bottom: 20px; }
#dashboard ul li { display: inline-block; }

/* LOGIN */
#login form { text-align: center; }
#login form input { margin-right: 5px; }

.search_user { position: relative; float: right; }
.search_user input.key { width: 200px; height: 34px; line-height: 34px; padding: 0px 10px; }
.search_user input.city { width: 150px; height: 34px; line-height: 34px; padding: 0px 10px; }
.search_user select { width: 150px !important; }
.search_user input.submit { width: 70px !important; height: 34px; color: #777; background-color: #d1d1d1; border: 0; padding: 0; cursor: pointer; }

.search_user_new { position: relative;}
.search_user_new input { margin-bottom: 5px; }
.search_user_new select { width: 200px !important; margin-bottom: 5px; }

.pagination a { color: #222; background-color: #f6f8fc; min-width: 30px; text-align: center; padding: 5px; margin: 0px 2px 2px 0px; font-size: 12px; font-weight: 700; display: inline-block; }
.pagination a:hover, .pagination a.active { background-color: #d8dde5; }
.pagination a:hover { background-color: #d8dde5; }

/* MOBILE */

/*
@media (max-width: 769px) {

	#logo { width: 100%; margin-bottom: 10px; text-align: center; display: block; }
	#logo img { width: 100px; height: auto; }
	#nav { text-align: center; float: none !important; position: relative; }
	#nav li { width: 100%; padding: 0 !important; margin: 0px 0px 2px 0px !important; display: inline-block; float: none !important; }
	#nav li a { width: 100%; padding: 0; display: block; }
	#sidebar { display: none; }
	.main.box { width: 100%; }

}*/

/* REQUESTS */
#requests .opn-row > div { padding: 20px 10px; }

#requests .opn-row > div:nth-child(1) { border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; }
#requests .opn-row > div:nth-child(2) { border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; }
#requests .opn-row > div:nth-child(3) { border-bottom: 1px solid #ddd; }
#requests .opn-row > div:nth-child(4) { border-right: 1px solid #ddd; }
#requests .opn-row > div:nth-child(5) { border-right: 1px solid #ddd; }

#requests .opn-row a.button-new { margin: 0px; }


/* POPUP */
#popup { left: 50%; margin-left: -300px; position: absolute; top: 100px; z-index: 9999999; }
#popup img { height: auto; max-width: 600px; }
#popup-back { background-color: rgba(0,0,0,.9); height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 999999; }
#popup-close { background-color: #000; border: 1px solid #777; border-radius: 50%; color: #fff; display: block; font-weight: bold; height: 30px; left: 50%; line-height: 30px; margin-left: 285px; position: absolute; text-align: center; top: 85px; width: 30px; z-index: 99999999; }
#popup-close:hover { background-color: #222; }

#popup.required { width: 1000px; margin-left: -500px; }
#popup.required img { width: 600px; height: 600px; float: left; }
#popup.required form { background-color: #fff; width: 400px; height: 600px; padding: 10px; float: left; }
#popup.required form .title { padding: 10px 0px; display: block }
#popup.required form .text { height: 460px; border: 1px solid #ddd; padding: 10px; margin-bottom: 20px; overflow: auto; }
#popup.required form .button-new { float: right; }
#popup.required form label { font-weight: bold; cursor: pointer; }
/* POPUP END */


/* FAST PROG */
#fastprog { background: none; }
#fastprog form input#session-id { width: 100%; height: 50px; border: 2px solid #ccc; border-radius: 20px; }
#fastprog form textarea { border: 2px solid #ccc; border-radius: 20px; }
#fastprog .services label { width: 120px; height: 120px; line-height: 15px; background-color: #fff; border: 2px solid #ccc; border-radius: 20px; padding: 5px; margin: 0 15px 15px 0; text-align: center; font-size: 13px; float: left; display: block; position: relative; overflow: hidden; }
#fastprog .services label input { position: absolute; top: 5px; right: 5px; }
#fastprog .services label img { width: auto; max-width: 80%; height: 50px; margin: 10px auto 10px auto; display: block; }
/* FAST PROG */
