@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');





body {
	background: url(../img/bg.jpg) #333333;
	text-align: center;
	font-family: 'Roboto', sans-serif;
	color: #000000;
}

body.su {
	background: url(../img/bg2.png) #333333;
	text-align: center;
	font-family: 'Roboto', sans-serif;
	margin: 0px;
	padding: 0px;
}

/*********** LOGIN STUFF ***********/


.homedirectinput {
        
        width: 350px;
        height: 58px;
        background-color: rgb(233 233 233);
        border-style: dashed;
        border-width: 1px;
        border-radius: 10px;
        margin-bottom: 40px;
        text-align: center;
        color: #000 !important;
        font-size: 24px;
        padding: 0px 10px 0px 10px;
       
}


.homedirectbutton {
    display: inline-block;
    border-radius: 4px;
    background-color: #5770b5;
    color: #ffffff;
    font-size: 18px;
    text-align: center;
    border: 0px;
    /* height: 35px; */
    width: 350px;
    padding: 20px 10px 20px 10px;
    outline-width: 0;
    text-decoration: none;
}

.card {
	background: #fff;
	border-radius: 8px;
	margin: 100px auto 0px auto;
	display: block;
}

.card-1, .loginError {
	width: 340px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
	transition: all 0.3s cubic-bezier(.25,.8,.25,1);
}

.card-1 {
	height: 274px;
}

.loginError {
	margin-top: 10px;
	padding: 6px 0px 6px 0px;
	background-color: #D50000;
	color: #FFFFFF;
	font-weight: bold;
	display: none;
	font-size: 20px;
}

.standard_field {
	border: 0px;
	border-bottom: 2px solid #cccccc;
	padding: 6px 6px 6px 0px;
	font-size: 16px;
	color: #aaaaaa;
	outline-width: 0;
	font-family: 'Roboto', sans-serif;
} 

.login_field {
	width: 292px;
}

.search_field {
	border: 1px solid #cccccc;
	border-radius: 4px;
	color: #333333;
	padding: 6px 6px 6px 6px;
}

.margin_field {
	margin-bottom: 20px;
}

.double_margin_field {
	padding-top: 20px;
	margin-bottom: 20px;
}

.standard_button, .small_button {
	border-radius: 4px;
	background-color: #004587;
	color: #ffffff;
	font-size: 18px;
	text-align: center;
	border: 0px;
	height: 35px;
	padding: 5px 20px 5px 20px;
	outline-width: 0;
	text-decoration: none;
}

.button_esce_dip {
	border-radius: 4px;
	display: inline-block;
	background-color: #5770b5;
	color: #ffffff;
	font-size: 16px;
	text-align: center;
	border: 0px;
	height: 39px;
	width: 150px;
	padding: 5px 20px 5px 20px;
	margin: 5px 0px 5px 20px;
	outline-width: 0;
	text-decoration: none;
}

.button_entra_dip {
	border-radius: 4px;
	display: inline-block;
	background-color: #cf8f00;
	color: #ffffff;
	font-size: 16px;
	text-align: center;
	border: 0px;
	height: 39px;
	width: 150px;
	padding: 5px 20px 5px 20px;
	margin: 5px 0px 5px 20px;
	outline-width: 0;
	text-decoration: none;
}


.login_button  {
	width: 300px;
}

#logoLogin {
	padding-top: 20px;
	width: 280px;
	height: auto;
}

/*********** END LOGIN STUFF *******/

#logout {
	position: absolute;
	top: 20px;
	left: 20px;
}

#logout_utente {
	position: absolute;
	top: 20px;
	left: 20px;
}

#counter {
        position: absolute;
        top: 20px;
        right: 20px;
}

#div_accesso_diretto_dip {
        position: fixed;
        bottom: 140px;
        right: 20px;
}


.square {
	width: 100px;
	height: 102px;
	text-align: center;
	border-radius: 10px;
	color: #FFFFFF;
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
}

.squareName {
	font-weight: bold;
	font-size: 14px;
	margin-top: 10px;
}

.squareNumber {
	font-weight: bold;
	font-size: 32px;
	margin-top: 10px;
}

.green {
	background-color: #57B565;
}

.blue {
	background-color: #5770B5;
}

.lightblue {
	background-color: #81c2e6;
}

.darkblue {
	background-color: #467995;
}


#logo {
	padding-top: 20px;
	width: auto;
	height: 65px;
}

#welcome {
	padding: 20px 0px 20px 0px;
	font-size: 50px;
	font-weight: bold;
}

#actionButtons {
	width: auto;
	margin: 0px auto 0px auto;
    text-align: center;
    vertical-align: middle;
}

#actionButtons a {
	display: inline-block;
        text-align: center;
        vertical-align: middle;
	width: 260px;
        /*height: 56px;*/
	color: #FFFFFF;
	font-size: 24px;
	text-decoration: none;
	padding: 10px;
	border-radius: 6px;
	margin: 0px 5px 0px 5px;

}

.actionButtonGreen {
	/*background-color: #2db700;*/
        background-color: #57B565;
}


.actionButtonBlue {
    background-color: #5770b5;
}

.actionButtondarkBlue {
    background-color: #467995;
}

.accept {
	background-color: #ee8e17;
        
}

.actionButtonRed {
	background-color: #B55757;
}

#flags {
	margin-top: 40px;
}

#flags img {
	width: 66px;
	height: 40px;
	margin: 0px 5px 0px 5px;
}

#fLangs {
	padding: 20px;
        /*position: absolute;*/
	bottom: 20px;
	left: 20px;
}

#fLangs img {

        width: 50px;
        height: 33px;
        margin: 0px 10px 0px 10px;
}

#fLogo {
	position: absolute;
	bottom: 20px;
	right: 20px;
}

#fLogo img {
	width: 200px;
}

.bigFont {
	font-size: 30px;
}

.bold {
	font-weight: bold;
}

select {
	width: 250px;
	border: 0px;
	background-color: transparent;
	border-bottom: 2px solid #000000;
	margin-top: 100px;
	margin-bottom: 20px;
	font-size: 30px;
	color: #000000;
}

select *.selopt {
	background-color: transparent;
	color: #000000;
}

#bubble {
	width: 760px;
	font-size: 18px;
	margin: 10px auto 0px auto;
	background-color: rgb(255,255,255);
	border-radius: 6px;
	padding: 20px;
        text-align: left;
        
}

table {
	margin: 60px auto 20px auto;
	text-align: left;
}

table td {
	padding: 0px 10px 0px 10px;
}

.presenze_td {
	background-color: white;
    padding: 7px;
    border-radius: 3px;
}

table input {
    /*
	width: 350px;
	height: 40px;
	background-color: rgba(30, 30, 30, 0.4);
	border: 0px;
	margin-bottom: 40px;
        text-align: center;
	color: #fff !important;
	font-size: 20px;
	padding: 0px 10px 0px 10px;
    */    
        
        
        width: 350px;
        height: 58px;
        background-color: rgb(233 233 233);
        border-style: dashed;
        border-width: 1px;
        border-radius: 10px;
        margin-bottom: 40px;
        text-align: center;
        color: #000 !important;
        font-size: 24px;
        padding: 0px 10px 0px 10px;
       
}








table select {
	font-size: 24px;
	margin-top: 0px;
	margin-bottom: 40px;
	width: 370px;
}

#safety, #eplan {
	margin-top: 40px;
	overflow-x: auto;
	height: calc(100vh - 200px);
	font-size: 20px;
}

#safety {
	margin-top: 10px;
	height: calc(100vh - 80px);
}

#safety td {
	font-size: 16px;
}

#safety td.images {
	width: 400px;
	text-align: right;
	padding-bottom: 40px;
}

#safety td.text {
	width: 500px;
	padding-bottom: 40px;
}

#safety::-webkit-scrollbar {
	width: 10px;
	background-color: none;
}

#safety::-webkit-scrollbar-thumb {
	background-color: #AAAAAA;
	border-radius: 5px;
}

#safety table {
	margin: 0px auto 0px auto;
	text-align: left;
}

#eplan img {
	margin-top: 40px;
	margin-bottom: 40px;
	width: 560px;
}

#privacy {
	width: 800px;
	display: inline-block;
	margin-bottom: 40px;
}

#bigCheck {
	margin: 40px 0px 40px 0px;
}

.loading {
	width: 128px;
	margin-top: 40px;
}

#searchresults {
	border-collapse: collapse;
	font-size: 18px;
}

.colname {
	background-color: #57B565;
	color: #FFFFFF;
	font-weight: bold;
	padding: 10px;
}

.rowone, .rowtwo {
	padding: 10px;
	white-space: nowrap
}

.rowone {
	background-color: #ECE9D4;
}

.rowtwo {
	background-color: #D2D7C0;
}

#contractors_list {
	width: 600px;
	border-collapse: collapse;
	font-weight: none;
	margin: -20px auto 40px auto;
}

#contractors_list td:last-child {
    width: 100%;
}

#employee_list {
	width: 600px;
	border-collapse: collapse;
	font-weight: none;
	margin: -20px auto 40px auto;
}

#employee_list td:last-child {
    width: 100%;
}


.iconDesc {
	padding-top: 10px;
	font-weight: bold;
}

#whoami {
	margin-top: 40px;
	font-size: 64px;
}

.singleIcon {
	display: inline-block;
}

.singleIcon img {
	width: 160px;
	height: 160px;
	margin: 40px 40px 0px 40px;
}

/**** CHECKBOXES *****/

/* The container */
.container {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 25px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 21px;
  width: 22px;
  background-color: none;
  border: 2px solid #555555;
}

/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.container input:checked ~ .checkmark {
  background-color: #57B565;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.container .checkmark:after {
  left: 7px;
  top: 3px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

ul {
	font-size: 20px;
}

li {
	padding: 6px;
	list-style-type: none;
}

.testo {
	width: 80%;
	margin: 0px auto 0px auto;
}

.testo td {
	padding: 8px;
}

.testo img {
	width: 80px;
}

.reset {
	width: auto;
	border: 0px;
	background-color: transparent;
	border-bottom: 0px solid #000000;
	margin-top: 0px;
	margin-bottom: 0px;
	font-size: 20px;
	color: #000000;
}

#pagecontainer {
	width: 1000px;
	margin: 0px auto 0px auto;
}

#pagecontainer table {
	border: 1px solid black;
	background-color: #FFFFFF;
}

#pagecontainer table td {
	padding: 10px;
	vertical-align: top;
}