/******************************************************************************/
/*                                 obecne                                     */
/******************************************************************************/
*{font-family: "Calluna Sans", "Arial", "Sans-serif";}
*:focus{outline:none;}
*::-moz-focus-inner{border:0;}

body{margin: 0px; padding: 0px; border: 0px; font-size: 12px; line-height: 20px; color: #333333; background: #ffffff;}

h1{font-size: 22px; color: #000000;}
h2{font-size: 18px; color: #000000; margin: 0px; padding: 10px 0px 0px;}
h3{font-size: 16px; color: #000000;}

a, .form-unit a, form a.blue{text-decoration: none; color: #5688d9;}
a:hover, .form-unit a:hover, form a.blue:hover{text-decoration: underline;}
p{text-align: justify;}
hr{border: none; height: 1px; background: #d7d7d7;}
img{border: none;}
form *{color: #333333;}
fieldset{margin: 0px; padding: 0px; border: 0px;}
legend{display: none;}
input{border: 1px solid #C0C0C0;}
input[type=checkbox], input[type=radio]{vertical-align: baseline; margin-top: 4px; margin-bottom: 7px;}
input[type=submit]{background: #434341; border: 1px #434341 solid; color: white;}
input[type=submit]:hover{cursor: pointer;}
input[type=submit].hide{display: none;}
ul{margin: 0px; padding: 0px 0px 0px 16px;}
anchor{border-bottom: 1px black dotted; cursor: help;}

.bold{font-weight: bold;}
.clear{clear: both;}

div.flash{margin: 0px 0px 10px; padding: 0px; font-size: 14px; font-weight: bold;}
div.flash.info{color: #34af01;}
div.flash.warn{color: #f66a09;}
div.flash.error{color: #c91013;}

.red{color: #880000;}
.green{color: #34af01;}

#page{padding: 0px 0px 20px;}
.center-page{width: 1310px; margin: 0px auto 0px;}
.center-page textarea {width: 580px; height: 139px;}

.video-container {padding: 0 0 20px 0; border-bottom: 2px solid #ececec; position: relative;}
.video-container:last-child {border-bottom: 0;}
.video-container h2 {font-size: 26px; margin: 30px 0 20px 0; }
.video-container video {max-width: 100%;}
.video-container .alert {padding: 15px; border-radius: 5px; position: absolute; top: 100px; left: 20px; background: red; opacity: 0; color: white; transition: opacity 0.2s;}
.video-container .alert .close {transform: rotate(45deg); font-weight: 700; display: inline-block; font-size: 18px; cursor: pointer;}

.page {margin: 10px 0;}

form ul.error {padding-left:50px;}
form ul.error li {list-style-image: url('/images/alert.png'); color: #c91013; vertical-align: top;}
.form-error-message {background: transparent url('/images/alert.png') no-repeat top left; padding-left: 18px; color: #c91013; margin-left: 3px;}
.no-data { font-weight: bold; font-size: 13px; text-align: center; padding: 15px; }

input.datetimepicker, input.datepicker, input.timepicker, input.place {padding: 1px 16px 1px 2px;}
input.datetimepicker, input.datepicker {background: transparent url('/images/calendar.png') no-repeat right;}
input.timepicker {background: transparent url('/images/chronometer.png') no-repeat right; width: 34px;}
input.datetimepicker {width: 103px;}
input.datepicker {width: 66px;}
input.place {background: transparent url('/images/map.png') no-repeat right; width: 306px;}
/******************************************************************************/
/*                                 header                                     */
/******************************************************************************/
#header #logout{background: #ededed; min-width: 1310px; text-align: right; height: 24px; border-bottom: 1px solid #d1d1d1;}
#header #logout a{display: inline-block; line-height: 12px; height: 12px; padding: 6px 15px; background: #e4f1fe; border: 1px solid #92b4d5; border-top: none;}
#header #logout a:hover{text-decoration: none;}

#header #logo{margin: 10px 0px; height: 80px;}
#header #logo a{padding: 20px 0px; float: left;}

#header #menu{height: 40px; min-width: 1310px; background: #434341; border-top: 3px solid #312f32; border-bottom: 1px solid #000000;}
#header #menu ul{margin: 0px; padding: 0px; height: 40px; list-style-type: none;}
#header #menu ul li{float: left; margin-top: -3px;}
#header #menu ul li a{display: block; height: 16px; font-weight: normal; color: #ffffff; font-size: 16px; line-height: 16px; padding: 12px 15px; border-top: 3px solid #312f32; border-bottom: 1px solid #000000;}
#header #menu ul li.active a{background: #50a6fd; border-top: 3px solid #4e7eae; border-bottom: 1px solid #3270ab;}
#header #menu ul li a:hover{text-decoration: none; background: #808080; border-top: 3px solid #676767; border-bottom: 1px solid #515151;}
#header #menu ul li.active a:hover{text-decoration: none; background: #62b8ff; border-top: 3px solid #6393c3; border-bottom: 1px solid #4683c4;}

#header #menu2 { background-color: #b1b1b1; height: 36px; }
#header #menu2 div ul { margin: 0; padding: 0; list-style: none;  }
#header #menu2 div ul li { display: inline; }
#header #menu2 div ul li a { background-color: #b1b1b1; float: left; padding: 8px 15px; font-size: 15px; margin-top: 0px; color: #464646; border: none; }
#header #menu2 div ul li a:hover { text-decoration: none; background-color: #9c9c9c; color: #464646; }
/******************************************************************************/
/*                                  body                                      */
/******************************************************************************/
#auth{text-align: center;}
#auth h1{color: #3c99f6; margin-bottom: 0px;}
#auth+div.flash{text-align: center;}

#frm-loginForm{display: inline-block; background: #ededed; width: 275px; padding: 10px; margin: 20px; border: 1px solid #d1d1d1;}
#frm-loginForm table{width: auto; margin: 0px;}
#frm-loginForm table th,
#frm-loginForm table td{border: none; background: none;}
#frm-loginForm fieldset{margin: 0px; padding: 0px;}
#frm-loginForm ul.error{margin: 0px; padding: 0px; list-style-type: none;}
#frm-loginForm ul.error li{color: #c91013; font-weight: bold;}
#frm-loginForm input{border: 1px solid #d1d1d1;}
#frm-loginForm input[type=submit]{line-height: 12px; padding: 4px 10px; background: #e4f1fe; border: 1px solid #92b4d5; color: #5688d9;}

#frm-editRecordForm,
#frm-addRecordForm{line-height: 30px;}
#frm-editRecordForm label,
#frm-addRecordForm label{text-align: left; font-weight: bold;}
#frm-editRecordForm th,
#frm-addRecordForm th{vertical-align: top; text-align: left; min-width: 100px;}
#frm-editRecordForm input[type=text],
#frm-addRecordForm input[type=text]{width: 200px;}
#frm-editRecordForm textarea,
#frm-addRecordForm textarea{width: 400px; resize:none;}
#frm-editRecordForm input[type=submit],
#frm-addRecordForm input[type=submit]{border: 1px solid #c5c5c5; padding: 6px 20px; font-size: 12px; font-weight: bold; float: right; background: #e5e5e5;}
#frm-editRecordForm input[type=submit]:hover,
#frm-addRecordForm input[type=submit]:hover{background: #c5c5c5;}

table.order{margin: 20px 0px 0px; border-collapse: collapse; border: none;}
table.order tr.caption th{text-align: left; font-weight: bold; font-size: 16px; padding-bottom: 5px;}
table.order th{text-align: left; padding-right: 10px;}
table.order .small-info{padding-left: 10px; font-size: 10px;}
table.order td.link{text-align: right;}
table.order td.link a{color: #5688d9;}

#body{padding: 10px 0px;}
#body table.styled{border: none; border-collapse: collapse; margin: 20px 0px; width: 100%;}
#body table.styled th,
#body table.styled td{text-align: left; vertical-align: top; border: 1px solid #e5e5e5; font-size: 12px; line-height: 18px; padding: 5px; overflow: hidden;}
#body table.styled td.data.right {text-align: right;}
#body table.styled tr:hover{background: #f8f8f8;}
#body table.styled tr.level-1{background: #fdf2f3;}
#body table.styled tr.level-1:hover{background: #fde8e8;}
#body table.styled tr.level-2{background: #fde2e4;}
#body table.styled tr.level-2:hover{background: #fcd8d9;}
#body table.styled tr.level-3{background: #fbd6d8;}
#body table.styled tr.level-3:hover{background: #fbc9cb;}
#body table.styled tr.level-4{background: #fda4a9;}
#body table.styled tr.level-4:hover{background: #fd848a;}
#body table.styled tr.level-4 .length{font-weight: bold;}
#body table.styled tr.level-4 .api-length{color: white; font-weight: bold;}
#body table.styled tr.fail .green,
#body table.styled tr.fail{color: #ff0000;}
#body table.styled th, #body table.styled tfoot td {background: #dcdcde;}
#body table.styled caption{font-size: 16px; font-weight: bold; padding-bottom: 10px;}

#body table.styled .project input{width: 90px;}
#body table.styled .company input{width: 120px;}
#body table.styled .ico input {width: 75px;}
#body table.styled .city input,
#body table.styled .phone input{width: 90px;}
#body table.styled .email input{width: 120px;}
#body table.styled .state select{width: 113px;}
#body table.styled .person input{width: 120px;}
#body table.styled .user input{width: 60px;}

table.birthdays-table {border: 1px solid #b5b5b5; text-align: left; border-collapse: collapse; margin: 20px 0; min-width: 600px;}
table.birthdays-table th {border: 1px solid #b5b5b5; padding: 5px 10px; background: #e8e8e8;}
table.birthdays-table td {border: 1px solid #e5e5e5; padding: 5px 10px;}
table.birthdays-table tr:hover > td {background: #fbfbfb;}
table.birthdays-table tr.month > td {background: #ffffca;}
table.birthdays-table tr.week > td {background: #dbffc9;}
table.birthdays-table tr.today > td {font-weight: bold;}

/*#body table.styled tr.no-style th,
#body table.styled tr.no-style td{border: none;}/**/
#body table.styled tr.no-style,
#body table.styled tr.no-style:hover{background: #f8f8f8;}

.order strong{display: inline-block; width: 130px;}
.snap{float: right; text-align: right;}
.contract{padding: 10px 0px 0px;}


.form-unit table tr th {vertical-align: middle;}
.form-unit table tr td {vertical-align: baseline;}
.form-unit th {text-align: right; font-weight: normal;}
.form-unit th label {padding: 1px 4px 0 0; display: block;}
.form-unit label.required {font-weight: bold;}
.form-unit td {vertical-align: middle; padding: 2px 0 2px 0;}
.form-unit td label {padding: 1px 4px 0 0;}
.form-unit td .number {text-align: right; padding-right: 2px;}
.form-unit .group-v,
.form-unit .group {display: inline-block; visibility: hidden;}
.form-unit .group-v {visibility: visible;}
.horizontal-separator {padding-left: 10px;}
.aborted .data {text-decoration: line-through;}
td.link {cursor: pointer;}
td.services { width: 26px; }
td.services a, td span.note, td.accept a, td.accept span { float: left; background-repeat: no-repeat; background-position: top center; }
td a.detail, td a.edit, td a.delete, td span.note, td.accept a, td.accept span {width: 26px; height: 16px; display: block;}
td a.detail {background-image: url('/images/detail.png');}
td a.edit {background-image: url('/images/edit.png');}
td a.delete {background-image: url('/images/delete.png');}
td.accept a.not-accepted, td.accept span.not-accepted {background-image: url('/images/delete.png'); opacity: .2;}
tr.first td.accept span.not-accepted {opacity: 1;}
tr.other td.accept span.accepted {opacity: .4;}
td.accept a.accepted, td.accept span.accepted {background-image: url('/images/accept-ok.png');}
td span.note {background-image: url('/images/text.png');}
td span.note.empty {opacity: .2;}

.subedit thead th { background-color: #333; color: white; padding: 2px 6px;}
.subedit tbody td { padding: 0px 2px;}

.report { padding: 10px; }
.report h2 { padding-left: 20px; color: #333; }

#rightBox { float:right; }
td.linker.closed { color: orange; }
td.linker.inserted { color: green; }

.icon { display: block; float: left; width: 16px; height: 16px; }
.icon-del { background: transparent url('/images/delete.png') top left no-repeat; }

.historyBox {position: relative; float:left; padding-left: 120px; text-align: center;}
.historyItem {text-align: left;}
.rightAlign {text-align: right; font-weight: bold; vertical-align: top; width: 100px}

.del-img {width: 16px; height: 16px; background-image: url('/images/datagrid/icons/bin_closed.png'); display: block; margin: auto;}
.edit-img {width: 16px; height: 16px; background-image: url('/images/datagrid/icons/page_edit.png'); display: block; margin: auto;}

.aresInfo {color: red; font-size: 16px; padding: 10px 0;}

span.info {
    background: #50a6fd;
    color: #fff;
    font-weight: bold;
    padding: 1px 5px;
    border-radius: 3px;
    z-index: 1;
    cursor: default;
    position: relative;
    line-height: 17px;
    font-size: 12px;
    height: 17px;
    display: inline-block;
    margin-left: 4px;
    text-shadow: 1px 1px 3px #0B55A2;
}

span.info>span.submenu {
    display: none;
    position: absolute;
    top: 18px;
    left: 0;
    padding: 10px;
    color: #333333;
    font-weight: normal;
    border: 1px solid #50a6fd;
    background: #fafcff;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    border-top-right-radius: 3px;
    z-index: 2;
    cursor: auto;
    text-shadow: none;
}

span.info:hover {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

span.info:hover>span.submenu {
    display: block;
}

span.submenu.big {
    width: 500px;
}

ul.lowerAlpha {
    list-style-type: lower-alpha;
}

ul.lowerRoman {
    list-style-type: lower-roman;
}

table.records {
    margin-top: 20px;
    border: 1px solid #000;
    border-collapse: collapse;
}

table.records th,
table.records td {
    padding: 3px 10px;
    border: 1px solid #000;
}

.button_black {
    background: #434341;
    border: 1px #434341 solid;
    color: white;
    padding-left: 5px;
    padding-right: 5px;
}


.playPauseButton{
    border-radius: 3px;
    background: #dcdcdc;
    padding: 15px 20px 13px 20px;
    color: #919293;
    font-size: 0.75rem;
    line-height: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    text-align: center;
    display: inline-block;
    text-decoration: none;
    letter-spacing: 0.07px;
    opacity: 0.8;
    transition: opacity 0.2s;
}

.playPauseButton:hover{
    opacity: 1;
    text-decoration: none;
}