* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

html { margin: 0;padding: 0;}
body {border:0;margin:0;padding:0;background:  white url('../imgs/main_bg.png') -32px 0 repeat-y;font-size: 10pt;font-family: "Open Sans","tahoma","verdana",sans-serif;color:#333;position: relative; }
html, body { height: 100%; }

a {color:#008dd2;}
a:hover {color:#364150}

p {border:0; margin:15px 0; padding:0;}

div {display:block; border:0; margin:0; padding:0;}

h1, h2, h3, h4, h5 {border:0; margin:15px 0 10px 0; padding:0; font-weight:bold;}
h1 {font-size: 200%;font-family:"Open Sans","arial",serif;}
h2 {font-size:190%; font-family:"Open Sans","arial",serif; }
h3 {font-size:150%; font-family:"Open Sans","arial",serif; }
h4 {font-size:120%; font-family:"Open Sans","arial",serif; }

ul, ol {display:block; border:0; margin:15px 0 15px 40px; padding:0;}
ol {list-style-type:decimal;}
li {display:list-item; border:0; margin:0; padding:0; _height:1px;}
ul ul, ul ol, ol ol, ol ul {margin: 0 0 0 20px;}

form {border:0; margin:0; padding:0;}
fieldset {border:1px solid #000; margin:15px 0; padding:10px;}
legend {margin-left:10px; font-size:100%; font-weight:bold; }

hr {display:block; height:1px; margin:10px 0; padding:0; background:#CCC; border:0 solid #CCC; color:#CCC;}

a, img, span {border:0; margin:0; padding:0;}
abbr, acronym {border-bottom:1px dotted #CCC; cursor:help;}

strong, .strong {font-weight:bold;}

.f-left {float:left;}
.f-right {float:right;}
.half { float: left; width: 50%; }

.t-left {text-align:left;}
.t-center {text-align:center;}
.t-right {text-align:right;}
.t-justify {text-align:justify;}

.clear {clear:both;}
.cleaner {clear:both;line-height:0px; font-size:0px;}
.row:before, .row:after { content: " "; display: table;clear: both; } 

*.box {min-height:1px; _height:1px;}
.box:after {content:" "; display: table;clear: both;}

.noscreen {display:none;}

.hidden{display: none;}
/* -------------------------------------------------------------------------------------------------- */


/* Hlavicka */
#header { position: fixed;top: 0;left: 0;display: block; height: 80px;margin:0;padding:0;background: #2b3643;color: #c6cfda;z-index: 1000;width: 100%; }

    /* Hlavicka - logo */
    #header #logo h1 {position: absolute; top: 15px;left: 20px;margin:0;padding: 0;width: 280px;height: 50px;background: url('../imgs/tasks.png') 0 0 no-repeat;}
    #header #logo h1 a, header #logo h1 a:hover {color: transparent;display: inline-block;width: 280px;}

/* Informace nad hlavickou */	 
#whitetop a { color: #c6cfda;text-decoration: none; }
#whitetop .user { float: right; display: inline-block; margin-top: 28px; margin-right: 20px;color: #c6cfda;}
#whitetop .search { display: inline-block;float: left;margin-left: 330px; margin-top: 28px;}
#whitetop #navigate { display: inline-block; margin-top: 12px; margin-right: 10px;position: fixed;right: 20px;cursor: pointer; }

#whitetop button, .button {background: #008dd4;border: none;height: 22px;padding: 0 10px;color: white;border: none;}
#whitetop input { font-size: 10pt;height: 22px;line-height: 22px;padding: 1px 5px;border: none; background: #364150; color: #c6cfda; width: 180px; }
#whitetop a:hover { color: white; }



#main { height: 100%; padding-top: 80px; padding-bottom: 40px; } 
	 
/* Stranka */
#page { min-height: 100%;background:  white url('../imgs/main_bg.png') -32px 0 repeat-y; }
#page-in { height: 100%; } 

/* Levy panel */
#panell { float:left;width:220px;margin-right:-100%;padding:0;background: #364150;padding-bottom: 10px; min-height: 100% !important; position: relative}

/* Obsah */
#content { float: left;width: 100%; min-height: 100% !important;margin: 0; }
#content-in { padding: 0px; min-height: 100% !important; background: white;min-height: 100%; }
.withpanel { margin-left: 220px; }

/* Paticka */
#footer {position:fixed;bottom: 0;left: 0; width: 100%; background: #2b3643; color:#c6cfda; padding: 0px 10px; line-height: 40px;height: 40px; margin:0px}
#footer a:hover { color: white; }

#content h1:first-child {font-size: 160%;color: #364150;}
#content h1 { color: #f08015; font-size: 200%; }

#content h3 {color: #008dd2; }

#content .indent {margin: 15px 15px 40px;position: relative; }
#content .half:nth-of-type(odd) { padding-right: 15px; }


.panel-in {padding:0px; color: #6b788b; }
.panel-in h4 {margin:0px;margin-top: 7px;display:block;padding:0px;padding-left: 10px;line-height: 30px;font-size: 110%;color: #f08015;font-weight: 400;}
.panel-in p { margin: 0px; padding: 10px; }
.panel-in ul { list-style:none; margin: 10px;}
.panel-in ul li a { color:#6b788b; line-height: 24px;}
.panel-in ul li a:hover {color:#e77817;}



/********  SHOP ******************************************************************/

.cErrorPage {padding:50px;font-size:larger}
.cErrorPage H2 {color:red}

.cBreadcrumbNavigation {margin: 0;display:block;padding:0px;padding-left: 15px;line-height: 30px;font-size: 100%;color: #404040 !important;background: #F2F2F2;min-height: 30px;}
.cBreadcrumbNavigation a { text-decoration: none; }

.divCategoryTree ul {margin:0; padding:0; list-style:none; }
.divCategoryTree li {margin:0; padding:0; }
.divCategoryTree ul li a {display:block; padding:0px 10px;  line-height: 26px; color:#b4bcc8; text-decoration:none; border-bottom: 1px solid #3d4957;  }
.divCategoryTree ul li a:hover { background-color: #007cc3;text-decoration: none; color:#b4bcc8;}

.cSearchForm fieldset { margin: 0px; border: none; }
.cSearchForm fieldset input.inp { border: 1px solid black; background: white url(../imgs/input_bg.png) bottom left repeat-x; height: 16px; font-size: 100% }
.cSearchForm fieldset input.sub { background: #e77817 url(../imgs/search.png) top left no-repeat; width: 17px; height: 20px; border: none; margin: 0px; padding: 0px; margin-left: 0px; padding-bottom: 5px; }
.cSearchForm fieldset label { color: black; font-weight: bold; padding: 0px; margin: 0px; }
.cSearchForm fieldset label.row { display: block; float: left; width: 120px; } 
.cSearchForm fieldset legend { padding: 0px 5px; color: black; }

.cList1 {border-collapse: collapse;width: 100%;}
.cList1 th {text-align:left;background: #7a889a;padding:5px 0.5em;border-right:1px solid #ddd;color:white;font-weight: 600;}
.cList1 td {background:#F8F8F8; padding:3px 0.5em; border:0px; margin:0px; border:1px solid #ddd}

.cList1 tr:nth-child(even) td {background:#FEFEFE;}
.cList1 td input.txt {border: 1px solid black; background: white url(imgs/input_bg.png) bottom left repeat-x; width:40px;}
.cList1 tr:hover td { background: #f4f4f4;} 

.cItemList {width:100%}
.cItemList .il-name strong {display:block}
.cItemList .il-price {text-align: right}

.cOptions {background: #F4F4F4;padding:10px;border: 1px solid #ddd;padding: 15px;}
.cOptions select { border: 1px solid #D5D5D5;font-size: 10pt; margin-right: 10px; } 

.cFormFields {background: #F8F8F8;padding:10px;border: 1px solid #dddddd;max-width: 800px;}
.cFormFields h3 {display:inline;margin:0px; padding:0px}
.cFormFields .ff-max {width:556px}
.half .cFormFields .ff-max {width:335px}
.cFormFields label {width: 150px; float:left; clear:both; line-height:19px;font-weight:normal;white-space:nowrap;}
.cFormFields br { clear: both;}
.cFormFields th, .cFormFields td, .cFormFields textarea, .cFormFields input, .cFormFields option {font-size: 100%; }
.cFormFields th, .cFormFields td {padding: 2px 0px 0px 5px;vertical-align:top} 
.cFormFields td { width: auto; }
.cFormFields th { font-weight: bold; text-align:left; }
.cFormFields input, .cFormFields textarea {padding-left: 3px;border: 1px solid #ddd;background: white;margin-bottom: 4px;} 
.cFormFields select { border: 1px solid #ddd; margin-bottom: 4px} 
.cFormFields .button  {background: #008dd4;border: none;width: 100px;height: 25px;line-height: 25px;color: white;/* font-weight: bold; *//* margin-left: 150px; */}
.cFormFields textarea {height:25em;width:350px;}
.cFormFields legend { color: #007cc3; margin: 10px 0px 5px 0px}
.cFormFields fieldset {padding:0px;margin:0px;border:0px}
.cFormFields .ff-buttons{padding: 1em 0px 1em 150px;}
.cStatusNotes textarea{height:120px !important;width:100% !important;} 
.cStatusNotes textarea.n-internal{border-left:5px solid red;}


.cButtons {padding:1em; clear: both; text-align: center;}
.cButtons .button { background: #008dd4; border: none; width: 100px; height: 22px;padding-bottom: 2px; color: white; font-weight: bold; font-size:100%; }

.cPaging { margin-bottom: 5px; margin-top: 5px; text-align: right; font-size: 8pt;}
.cPaging a { padding: 0px 3px; text-decoration: none; border: 1px solid white;}
.cPaging a:hover { color: #EE8B36!important; background-color: #ECECEC; text-decoration: none!important;}

.cListModeChanger { margin-bottom: 5px; margin-top: 5px; text-align: left; font-size: 8pt; float:right}
.cListModeChanger a { padding: 0px 3px; text-decoration: none; border: 1px solid white;}
.cListModeChanger a:hover { color: #EE8B36!important; background-color: #ECECEC; text-decoration: none!important;}

.cListOrderChanger { margin-bottom: 5px; text-align: left; font-size: 8pt; float:left}
.cListOrderChanger select { text-align: left; font-size: 8pt; border:1px solid silver; padding:0px}

.cDiscussion .d-titl {padding-left: 10px;background: #eee;line-height: 27px;border-bottom: 1px solid #ddd;}
.cDiscussion .d-post {border:1px solid #DDD;background: #F4F4F4; margin-bottom:1px;}
.cDiscussion .d-titl a {margin: 0 5px;}
.cDiscussion .d-post ul {margin:12px;}
.cDiscussion .d-text { padding-left:5px;}
.cDiscussion .d-replies .d-post { background: #F8F8F8;}
.cDiscussion .d-replies {padding-left:4em;margin-right: -1px;margin-bottom:-2px}
.cDiscussion .d-replies .d-replies .d-post {background:#FFF}
.cDiscussion .d-inactive strong, .cDiscussion .d-inactive em { color: #AAA }
.cDiscussion .d-internal {border-left: 5px solid #f08015}

.cLogin input.txt {width:130px}

.cList1 a.view,.cList1 a.delete, a.button {display: inline-block;background: #008dd4;border: none;height: 23px;padding: 0 10px;line-height: 23px;color: white;text-decoration: none;}

.taskList th a { color:white}
.taskList th a:hover { text-decoration: none}
.tl-statusNote {float:right;padding-right:3px;}
.tl-statusNote.n-internal{color:#f01515;}
.tl-statusNote.n-public{color:#008dd4;}
.tl-statusNote.n-empty{color:#ddd;}

@media (max-width: 1024px) {
    #whitetop .search { float: right;clear: right; display: block;margin-top: 10px;margin-right: 20px; }
    #whitetop .user  { margin-top: 15px; } 

    .taskList td:nth-child(4),.taskList td:nth-child(5),.taskList th:nth-child(4),.taskList th:nth-child(5), .taskDetail th:nth-child(1), .taskDetail td:nth-child(1), .taskDetail th:nth-child(3), .taskDetail td:nth-child(3){ display: none; }
    .cOptions a.button { float: none;margin-top: 10px; }
    .cFormFields .ff-max, .cFormFields textarea { width: 95%!important; }

    .table-container { width: 100%; overflow-y: auto; _overflow: auto; margin: 0 0 1em; }
    #panell { width: 190px; }
    .withpanel { margin-left: 190px; }
    #page { background-position: -62px 0; }
 
}

@media (min-width: 756px) {
    #whitetop #navigate { display: none; }
}

@media (max-width: 756px) {
    #whitetop .search { display: none; }
    #whitetop #navigate { display: inline-block; }
    #whitetop .user { margin-right: 70px; }
    .taskList th:nth-child(6),.taskList td:nth-child(6) { display: none; }
    .cList1 { overflow: scroll; }
    #header #logo h1 { top: 9px;left: 10px;width: 168px;height: 30px;background: url('../imgs/tasks-xs.png') 0 0 no-repeat;}
    #header #logo h1 a, header #logo h1 a:hover {width: 168px;}
    #header { height: 50px; }
    #main { padding-top: 50px;}
    .cFormFields .ff-buttons { padding-left: 0; }
    .half { width: 100%!important; float:none!important }
    .cOptions label:before { content: " "; display: table;clear: both; }
    .cOptions a.button { margin: 0; }

    .withpanel { margin-left: 0; }
    body, #page { background: white; }
    #panell { position: absolute;z-index: 100; }
    #footer { position: relative; }
    .cDiscussion .d-replies { padding-left: 1em; }
}

@media (max-width: 500px) {
    #whitetop .user { display: none; }
}

.cTabs { padding-bottom: 1px; border-bottom: 3px solid #7a889a}
.cTabs .t-tab { display: inline-block;padding: 0 15px; background: #008dd4;border: none;font-size: 115%;line-height: 150%;color: white;text-decoration: none; font-weight: bold}
.cTabs .t-tab.active { background: #7a889a;color: white; margin-bottom: -2px;padding-bottom: 2px;border-bottom:1px solid #7a889a}

.cView td {font-weight:bold}
.cView th {font-weight:normal}

.cFormFields .button-secondary { color: white;background: #b4bcc8}

span.priority-0 { border: 1px solid #e9e9e9; border-left: 5px solid #e9e9e9; padding: 2px 7px; color: #afafaf; }
span.priority-1 { border: 1px solid #e9e9e9; border-left: 5px solid #e9e9e9; padding: 2px 7px; }
span.priority-2 { border: 1px solid #e9e9e9; border-left: 5px solid #f01515; padding: 2px 7px; }
span.priority-3 { background: #f01515; color: #fff; border-left: 5px solid #f01515; padding: 2px 7px; }

td.priority { border-left: 5px solid #e9e9e9; }
td.priority-0 { border-left: 5px solid #e9e9e9 !important; padding: 2px 7px; color: #afafaf; }
td.priority-1 { border-left: 5px solid #e9e9e9 !important; padding: 2px 7px; }
td.priority-2 { border-left: 5px solid #f01515 !important; padding: 2px 7px; }
td.priority-3 { background: #f01515 !important; color: #fff; border-color: #f01515 !important; border-left: 5px solid #f01515 !important; padding: 2px 7px; }

.time-table { border-collapse: collapse; }
.time-table tr {}
    .time-table tr.actual th { background: #ef7c1e; }
    .time-table tr th { padding: 5px; background: #7a899a; color: #fff; }
    .time-table tr td { border: 1px solid #dbdbdb; text-align: center; min-width: 30px; }
.time-table tr td.actual { background: #ef7c1e; }
.time-table tr td.actual a { color: white; font-weight: bold; }
        .time-table tr td.disabled { color: #c1c1c1; background: #f7f7f7 !important; }
        .time-table tr td a { padding: 5px; text-decoration: none; }
    .time-table tr.actual td:not(.actual) { background: #fff2e8; }