@font-face {
  font-family: 'Scada';
  src: url('/web/css/fonts/Scada-Regular.ttf');
}
body {font-family: 'Scada', sans-serif; font-size: 14px;}
a{color: blue;}
ul{list-style-type: none;}
#header a {color: #ffffff; transition: 0.5s;}
#header a:hover{color: #ffe397;}
#header .active, #header .active a{color: #ffb128;}
#home-page > a{padding: 80px 40px; background-color: #155495; color: #ffffff; position: relative;}
#home-page > a:after{content: ""; position: absolute; width: 90%; height: 90%; border: 1px solid #ffffff; left: 5%; top: 5%;}
.data-view {margin-bottom: 30px; display: flex; flex-wrap: wrap;}
.data-form th{text-align: right;}
.text-th-left th{text-align: left;}
.data-form select{width: auto;}
.pagination select{width: auto;}
.admin{margin: 20px auto; font-family: 'Scada', sans-serif;}
.admin td, .admin th{padding: 1px 5px;}
.admin input, .admin select{padding: 1px 4px; font-size: 14px;}
input, select{border: none; border-bottom: 1px solid #666;}
.max-content{width: max-content;}
.chooser {z-index: 2}
.chooser > div{padding: 5px; border-bottom: 1px solid #555;}
.button{background-color: #006fd2; border-radius: 30px; position: relative;}
.button.small{padding: 0px; width: 20px; height: 20px; line-height: 20px; text-align: center;}
.font-size-20px{font-size: 20px;}
.border-radius-20, .popup-content{border-radius: 20px;}
#photos-assembly{flex-direction: column; height: calc(100vh - 100px);}
#assembly-iframe{flex: 1;}
.popup-buttons{position: absolute; right: 15px; top: 15px; font-size: 32px;}
.popup-buttons button{background: none; border: none; font-size: inherit;}
.popup-content{font-size: inherit;}
.flex-start{align-items: flex-start;}
.errorLine{font-weight: bold; font-size: 22px; color: red;}
/*.button:before{content: ""; width: 100%; height: 100%; padding: 1px; position: absolute; transform: translate(-3px, -3px); border: 2px solid #006fd2; left: 0; top: 0; border-radius: 30px;}*/
.overflow-auto{overflow: auto;}
.button{border: none; padding: 8px 16px; color: #fff;}

.switchers > div{padding: 10px;}
.switchers >div:nth-child(even){background-color: #bae4ff;}
.switchers >div:nth-child(odd){background-color: #f8ffba;}
.switcher{width:40px;height:20px;position:relative;border-radius:15px;border:1px solid gray;line-height:30px;font-size:12px;text-align:center}
.change-switcher{width:50%;display:block;height:100%;float:left;cursor:pointer; font-size: 10px; line-height: 22px;}
.switcher .switch{position:absolute;width:50%;height:104%;transition:1s;border-radius:20px}
.switcher .on{left:0;top:0;background-color:green}
.switcher .off{left:50%;top:0;background-color:red}

/* working reference */
#working-refference{overflow: auto; max-width: 97vw; box-sizing: border-box;}
#working-refference th {padding: 5px;}
.data-table{border-collapse: collapse;}
.file-preview .File{width: 100px;}
.file-small .File{width: 60px;}
.project-row th{background-color: powderblue; font-size: 26px;}
.action-row th{background-color: thistle; font-size: 22px;}
.role-row th{background-color: darksalmon; font-size: 18px;}
.artist-row td {border-bottom: 1px solid #9c9c9c; background-color: antiquewhite;}
.artist-row th {background-color: antiquewhite;}
.artist-row:hover td {background-color: #ffe44c;}
#worksheet tbody tr:last-child td{border-bottom: none;}
#worksheet input[type='number']{width: 70px;}
#worksheet tbody tr:first-child th:first-child{border-top-left-radius: 10px;}
#worksheet tbody tr:last-child th:first-child, #worksheet tbody tr:last-child td:first-child{border-bottom-left-radius: 10px;}
#worksheet tbody tr:first-child th:last-child{border-top-right-radius: 10px;}
#worksheet tbody tr:last-child th:last-child, #worksheet tbody tr:last-child td:last-child{border-bottom-right-radius: 10px;}
.contact-collections{word-wrap: break-word; max-width: 80vw;}
#reference-artist-roles{position: fixed; right: 0; top: 0; overflow: auto;}

/* project */
.legend span{margin: 0 10px;}
#project{height: calc(100vh - 140px);}
#project .project-item{height: 100%;}
#project fieldset{overflow-y: auto; margin: 4px 3px 0;}
#project .project-item #project-sheet{height: 30%;}
#project .project-item #action-sheet{height: 65%;}
#project .project-table{border-spacing: 0;}
#project .project-table td{padding: 3px;}
#project .project-table tr:nth-child(even) > td{background-color: rgba(255, 255, 255, 0.3);}
#project .project-table tr td:first-child{border-top-left-radius: 10px; border-bottom-left-radius: 10px;}
#project .project-table tr td:last-child{border-top-right-radius: 10px; border-bottom-right-radius: 10px;}
#project fieldset .project-table .active td{background-color: #78ed78;}
#project fieldset .project-table tr:hover td{background-color: #ffe44c;}
#project .project-add{cursor: pointer; border: 1px solid #444444; border-radius: 10px; padding: 2px 5px; color: #ffffff;}
#copy-dates{height: 130px; overflow: auto; border: 1px solid #9c9c9c;}
.productuction-attached { line-height: 12px; width: 100%; padding-right: 10px;}
#project .project-table tr .productuction-attached th{font-size: 10px; width: 55px; font-weight: normal; text-align: left; padding: 0;}
#project .project-table tr .productuction-attached td{text-align: right; background: none!important; padding: 0;}
#project .project-table tfoot > tr > th{border-top: 1px solid;}
.project-galleries{text-align: left;}
.project-galleries li{padding: 5px 0; display: flex; justify-content: space-between;}
.project-galleries .button{display: inline-block;}

/* artist */
.artist-popup .image{height: 300px; width: auto; margin: 0 auto;}
.artist-preview .image{height: 70px; width: 70px; object-fit: contain; margin: 0 auto;}
.artist-gallery > div{width: 22%; margin: 10px 1%; border: 1px solid #000000; padding: 10px;}
.artist-gallery .File{height: 400px;}
.note{border-bottom: 1px solid #acacac;}
.note > a {margin: 0 10px;}
.artist-data ul{padding: 0 30px; box-sizing: border-box;}
.artist-data ul li{display: flex; justify-content: space-evenly; }
.artist-data ul li > * {flex: 1;}
#add-more-contacts > *{flex: unset;}
.contact-data{margin: 5px 0;}
.contact-data > span:first-child{width: 120px;}
.contact-data input[type="text"]{width: 120px;}
#physical-image{height: 400px;}
#physical-data, .flex-center{justify-content: center;}
#common-physical-data{height: fit-content;}
fieldset{border-radius: 10px;}
#artist-focus-image{height: 350px;}
.artist-table{border-spacing: 0;}
.artist-table tr:nth-child(even) td{background-color: rgba(255, 255, 255, 0.3);}
.artist-table tr td:first-child{border-top-left-radius: 10px; border-bottom-left-radius: 10px;}
.artist-table tr td:last-child{border-top-right-radius: 10px; border-bottom-right-radius: 10px;}
.artist-table .active td{background-color: #78ed78;}
.artist-table tr:hover td{background-color: #ffe44c;}
.artist-search-selector{padding: 0 5px;}

/* gallery */
.gallery-document, .project-galleries li{border-bottom: 1px solid #9c9c9c;}

/* HEADER */
#header{background: linear-gradient(#383838 57%, #5e5e5e); color: #ffffff; z-index: 2; position: relative;}
#menu-header-wrapper{width: fit-content; margin: 0 auto;}
.logger a{padding: 0 3px;}
.logger a{border-right: 1px solid #fff;}
.logger a:last-child{border-right: none;}
.sub-menu{display: none; position: absolute; top: 100%; background-color: blue; border-radius: 5px;}
.sub-menu-item a{padding: 10px; display: block; width: 200px;}
.menu-item{position: relative; border-right: 1px solid #fff; padding: 10px 20px; text-transform: uppercase;}
#menu-header-wrapper > .menu-item:last-child{border-right: none;}
.menu-item:hover > .sub-menu{display: block;}

/* HOME */
.bgimg{background-image:url(/web/file/jovaughn-stephens-IuT4XqfabPs-unsplash.jpg);height:calc(100vh - 66px);background-position:center;background-size:cover;position:relative;color:#fff;font-family:"Courier New",Courier,monospace;font-size:25px}
.topleft{position:absolute;top:0;left:16px}
.bottomleft{position:absolute;bottom:0;left:16px}
.middle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}
hr{margin:auto;width:40%}

/* REGISTRATION */
.file-edit{display: flex; flex-wrap: wrap;}
.file-input-preload{width: 300px;}
.file-input-content{display: none;}

/* Jquery Datepicker */
.ui-date-selector {width: 300px;padding: 7px;}
.ui-state-highlight {border: 0 !important;}
.ui-state-highlight a {background: #006fd2 !important;color: #fff !important;}

#role-request-form li{border: 1px solid #888; padding: 30px; margin: 20px 0; border-radius: 10px; background: #fafafa; font-size: 20px;}

.color-1{color: blue;} /* blue */
.color-1-bg{background-color: blue;} /* blue */
.color-2{color: red;} /* red */
.color-2-bg{background-color: red;} /* red */
.color-3{color: antiquewhite;}
.color-3-bg{background-color: antiquewhite;}
.color-4{color: thistle;}
.color-4-bg{background-color: thistle;}
.color-5{color: powderblue;}
.color-5-bg, .chooser{background-color: powderblue;}
.color-6{color: darksalmon;}
.color-6-bg{background-color: darksalmon;}
.color-7{color: green;}
.color-7-bg{background-color: green;}