:root {
    --main-color: #123d72;
    --active-color: #002D72;
    --navbar-bcolor: #ffffff;
    --navbar-text-color: #777;
    --navbar-hover-color: #002D72;
    --navbar-accent: #29b6ff;
}
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200&display=swap');

body {
    box-sizing: border-box;
    min-height: 100vh;
    display: flex;
    font-size: .85em;
    font-family: "Poppins", "Segoe UI", Verdana, Helvetica, Sans-Serif;
    color: #444;
    background: #F7FDFF;
    margin: 0 auto;
    position: relative;
    background-image: url('images/sfondo.png');
    background-repeat: repeat-x;
    background-position: bottom;
    background-attachment: fixed;
}
.famfamfam-flags {
    display:inline-block;
}
    .famfamfam-flags.en {
        width: 16px;
        height: 11px;
        background-position: -112px -88px;
    }
.btn {
    background-color: azure;
    background-image: none;
}

.btn-danger {
    background-color: orange;
    background-image: none;
}

.btn-light {
    background-color: rgba(255,255,255,.6);
    padding:6px 16px !important;
    border-radius:3px;
}

    .btn-light:hover {
        background-color: rgba(220,245,255,1);
        padding: 5px 15px !important;
        border: 1px solid rgb(200,225,235);
        border-radius: 3px;
        text-decoration: none;
    }


.navbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 99;
	border-bottom:1px solid #e0e0e0;
    background: var(--navbar-bcolor);
	box-shadow: 0 2px 10px 10px rgba(170,180,190,.4)

}
.background {
/*    display: block;
    float: left;
    min-height: 100vh;
    width: 100vw;
    backdrop-filter: blur(10px);*/
}
.mainContainer {
    max-width: 1360px;
    margin: 100px auto;
    min-height: 10vh;
}
.navbar .brand{
    margin: 0 !important;
    padding: 10px 0px !IMPORTANT;		
}


footer {
    position: fixed;
    bottom: 0;
    margin-top: 20px;
    border-top: 4px solid #8ad7ff;
    left: 0;
    right: 0;
    width: 100%;
    background:#e7f9ff;
    opacity: .9;
    height: auto;
}
    footer p {
        font-size:  1.2em;
        margin: 16px 0;
        font-weight:500;
    }

    footer a {
        color: inherit;
    }

    footer .navbar {
        margin-bottom: 0px;
    }

header,
footer,
nav,
section {
    display: block;
}

legend {
    color: #444;
    font-size: 1.2em;
    font-weight: bold;
}


textarea {
    min-height: 75px;
}

.editor-label {
    margin: 1em 0 0 0;
}

.editor-field {
    margin: 0.5em 0 0 0;
}

.expandBtn {
    position: absolute;
    top: 0;
    left: 0;
    font-size: x-large;
    background: lightgrey;
    padding: 10px;
    border-bottom-right-radius: 5px;
    opacity: .1;
}

.preview {
    height: 100%;
    width: 100%;
}

.previewContainer {
    position: relative;
    height: 500px;
}

.expandBtn:hover {
    opacity: 1;
}

.expandBtn,
.expandBtn:after,
.expandBtn:before {
    transition: all .2s;
}

.previewContainer,
.previewContainer:after,
.previewContainer:before,
.metadataContainer,
.metadataContainer:after,
.metadataContainer:before {
    transition: all .3s;
}

#searchString
{
	height: 52px !important;
    border-radius: 6px;
    font-size: 1.4em;

}



.DocumentDetail {
    background-color: rgba(230,250,255,.9);
    border-radius: 24px;
    padding: 10px 20px;
    margin-bottom: 2%;
    margin-right: 2%;
    padding-left: 96px;
    position: relative;
    min-width: 48%;
    width: 48%;
    box-shadow: 0 2px 5px -1px rgb(70 100 130 / 70%);
    box-sizing: border-box;
}
    .DocumentDetail a {
        text-transform: none;
        margin-right: 10px;
        border-radius: 4px;
        padding: 4px 8px;
        margin-left: -8px;
        font-size: 1.1em;
        font-weight:500;
    }
    
        .DocumentDetail a:hover {
            text-decoration: none;
            background-color: #d3ebff;
        }

    .DocumentDetail h2 {
        margin: 0;
        padding: 0;
        font-size: 1em;
        text-transform: uppercase;
        font-weight: 600;
        line-height: inherit;
        color: #444;
    }
    .DocumentDetail label {
        margin: 0;
        min-height: 24px;
        color: #888;
        margin-bottom: 10px;
    }

    .DocumentDetail i, .DocumentDetail img {
        position: absolute;
        left: 20px;
        top: 16px;
        color: crimson;
        text-indent: 0;
        font-size: 4.1em;
        background-color: #fff;
        border-radius: 50%;
        border: 2px solid #ddeeff;
        width: 64px;
        height: 64px;
        text-align: center;
        margin-left: -6px;
        line-height: 65px;
    }






/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error {
    color: #f00;
}

.field-validation-valid {
    display: none;
}

.input-validation-error {
    border: 1px solid #f00;
    background-color: #fee;
}

.validation-summary-errors {
    font-weight: bold;
    color: #fff;
    background-color: #ff4f4f;
    padding: 4px;
    border-radius: 4px;
    list-style: none;
}
.validation-summary-errors ul {
    list-style: none;
}
    .validation-summary-errors li {
        padding:10px 2px;
    }


.validation-summary-valid {
    display: none;
}

/*  Personalizzazioni  */
label {
    width: fit-content;
}

h1 {
font-size: 22pt;
    margin: 0;
    /* font-weight: 400; */
    font-weight: 700;
    color: var(--navbar-hover-color);
    text-transform: uppercase;
}
h1 small, h3 small{
	display:block;
    font-size: 13pt;
	color:coral; //#fff; 
	font-weight:500;
		margin-bottom:20px;
        text-transform:none;
}


h2 {
    font-weight: 400;
    font-size: 1.30rem;
    color: darkorange;
    font-weight: 500;
    font-size: 1.40rem;
    color: var(--navbar-hover-color);
    
    text-shadow: 0 0 5px #fff;
}

h3 {
    font-weight:600;
	color:#222;
    font-size: 16pt;
}

.listModeBtn {
    margin-top: 20px;
}

    .listModeBtn i {
        font-size: x-large;
        color: #444;
        padding: 5px;
        border-radius: 5px;
        cursor: pointer;
    }

        .listModeBtn i:hover {
            color: var(--navbar-bcolor);
            background-color: var(--navbar-accent);
        }

        .listModeBtn i.selectedBtn {
            color: #fff !Important;
            background-color: var(--navbar-hover-color);
            cursor: inherit;
        }

    .listModeBtn button {
        background: none;
        border: none;
    }

.DocumentInfo {
    padding: 10px;
    margin-bottom: 10px;
    background-color: #fafafa;
}

.Row {
    border-bottom: 1px dotted #ccc;
    padding: 10px 0px;
    position: relative;
}

    .Row label {
        position: absolute;
        width: 200px;
        overflow: hidden;
        color: #888;
    }

    .Row span {
        padding-left: 200px;
        font-weight: 300;
    }

.Box {
    background-color: #eee;
    padding: 10px;
    float: left;
    width: 30%;
    margin-right: 1%;
    margin-bottom: 1%;
}

.content {
    position: relative;
    width: 100%;
    min-height: 500px;
    padding: 5px;
}

.title {
	display:none;
    text-decoration: none;
    color: darkorange !important;
    font-size: small;
    text-transform: uppercase;
    font-weight: bold !important;
    font-family: sans-serif;
    margin: 0;
}

@media (max-width: 480px) {
    .small-centered {
        text-align: center;
    }

    .LogoPanel {
        max-width: 70%;
    }
}

.GreyPanel {
    padding: 20px 20px;
    margin-top: 10px;
    border-radius: 10px;
    background-color: rgba(255,255,255,.9);
    box-shadow: 0 1px 2px 0 rgba(150,150,150,.8);
    border-radius: 4px;
    width: 100%;
    background-color: rgba(230,250,255,.9);
    background: linear-gradient(15deg, rgba(230,250,255,.9), rgba(150,230,255,.8));
    border-radius: 24px;
    padding: 10px 20px;
    margin-bottom: 2%;
    margin-right: 2%;
    position: relative;
    box-shadow: 0 2px 5px -1px rgb(70 100 130 / 70%);
    box-sizing: border-box;
}

    .GreyPanel h1 small, .GreyPanel h3 small {
        display: block;
        font-size: 13pt;
        color:#0082a9;
        font-weight: 500;
        margin-bottom: 20px;
        text-transform: none;
    }


    .GreyPanel label {
        margin-top: 2px;
        font-size: 1.1em;
        font-weight: 400;
    }

    .GreyPanel h2 {
        text-transform:uppercase;
    }

    .GreyPanel input[type=checkbox] {
        margin-right: 10px;
        margin-bottom:10px;
        float:left;
    } 
    .WelcomePanel {
        position: absolute;
        top: 10px;
        right: 0px;
    }

    .WelcomePanel label {
        line-height: 22px;
        font-size: 12pt;
        vertical-align: bottom;
        display: inline;
        color: #448;
    }

.alert-custom {
    float: left;
    width: 95%;
    margin-top: 15px;
}


.SearchFrame {
    position: absolute;
    top: 0px;
    right: 10px;
}

.TipologiaDetail {
    float: left;
    width: 27.33%;
    padding: 2%;
    margin-bottom: 2%;
    margin-right: 2%;
    background-color: #fff;
	box-shadow:0 1px 2px 0 rgba(200,200,200,.4);
	border-radius:4px;
}

    .TipologiaDetail label {
        font-size: 12pt;
        padding: 0px;
        margin: 0px;
    }

    .TipologiaDetail a {
        color: #444;
        --text-shadow: 1px 1px 1px white;
    }

        .TipologiaDetail a:hover {
            color: var(--active-color);
            --text-shadow: 1px 1px 3px white;
            text-decoration: none;
        }

.nav-folder {
    border-radius: 5px;
    background-color: whitesmoke;
    padding: 10px;
    display: flex;
    margin-bottom: 20px;
}

    .nav-folder a, p {
        font-size: 12pt;
        margin: 0 5px;
        white-space: nowrap;
    }

    .nav-folder .badge {
        margin: 0 10px auto 0;
    }

    .nav-folder .nav-folder-body {
        width: 100%;
        text-overflow: ellipsis;
        overflow: hidden;
    }

.BinderDetail a {
    margin-bottom: 2%;
    border-radius: 5px;
    border: 1px solid whitesmoke;
    background-color: whitesmoke;
    display: flex;
    padding: 2%;
    color: #444;
}

    .BinderDetail a:hover {
        border: 1px solid lightgrey;
        color: #29b6ff;
        background-color: #ededed;
        text-decoration: none;
    }

.BinderDetail img {
    float: left;
    width: 30px;
    height: 30px;
    margin-right: 10px;
}

.BinderDetail .badge {
    vertical-align: middle;
    text-align: center;
    margin: auto 3px;
}

.BinderDetail label {
    font-size: 12pt;
    padding: 0px;
    vertical-align: middle;
    margin: 0px;
    line-height: 30px;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    margin-right: 5px;
}


#changeViewForm i
{
	//color:#ccc;
}


.PathContainer {
    display: flex;
    overflow-y: hidden;
    overflow-x: auto;
}

.badge {
    padding: 3px 9px !important;
    background: var(--active-color);
}

#docListTable tr {
    cursor: pointer;
	padding:10px;
}
#docListTable td {
	padding:16px 4px;
}

table.vcentered-content td {
    vertical-align: middle !important;
}

.vcentered {
    vertical-align: middle !important;
}

table.hcentered-content td {
    text-align: center !important;
}

.hcentered {
    text-align: center !important;
}

.centered {
    text-align: center !important;
    vertical-align: middle !important;
}

table.centered-content td {
    text-align: center !important;
    vertical-align: middle !important;
}

.ui-tabs {
    padding: 0;
}

.ui-tabs-nav {
    background: none;
    border-radius: 0;
    border-left: none;
    border-top: none;
    border-right: none;
}

.SingleDocument {
    margin: 0 2%;
    text-align: center;
	min-width:210px;
    float: left;
    width: 21% !Important;
    overflow: hidden;
    margin-bottom: 10px;
    height: 300px;
    cursor: pointer;
}

    .SingleDocument img {
        width: 210px;
        height: 240px;
        border: 1px solid #ccc;
        box-shadow: 0px 4px 10px #eee;
		border-radius:4px;
        margin-bottom: 10px;
		margin-left:0;
    }

.img-rounded {
    border-radius: 50% !important;
    height: 210px !important;
    border: 1px dashed #ccc !important;
    padding: 8px;
    background-color: white;
    box-sizing: border-box;
}
.img-smallrounded {
    border-radius: 50% !important;
    height: 66px !important;
    width: 66px !important;
    border: 1px dashed #ccc !important;
    padding: 2px;
    background-color: white;
    box-sizing: border-box;
    margin-left: -6px;
    margin-top: -2px;
}
	
    .SingleDocument a {
        color: #444;
		display:block;
		text-align:center;
    }

    .SingleDocument label {
        font-size: 10px !Important;
        color: #666;
    }

    .SingleDocument .riga1 {
		font-size:1rem !Important;
		font-weight:600;
		text-align:center;
        line-height: 20px;
        max-height: 32px;
        overflow-x: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
		margin: auto;
    }

    .SingleDocument .riga2 {
		font-size:.6rem !Important;
		text-align:center;
        line-height: 18px;
        overflow-x: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
		margin: auto;
    }
    .SingleDocument a:hover {
        color: #48c;
        text-decoration: none;
    }

.DocumentPreview img {
    width: 100%;
    border: 1px solid #ccc;
    box-shadow: 0px 2px 10px #aaa;
    border-radius: 0px;
}

.alert {
    position: absolute;
    top: 20px;
    right: 0px;
    width: 40%;
}

.IstruzioniContainer,
.ContattiContainer,
.TextContainer {
    width: 100%;
}

    .TextContainer p {
        text-align: justify;
    }

    .TextContainer h1,
    .TextContainer h2,
    .TextContainer h3 {
        margin: 0;
    }

    .TextContainer .GreyPanel {
        margin-top: 20px;
    }

.SingleComunication {
    margin-bottom: 10px;
    padding: 4px;
}

hr.top {
    margin: 10px 0 20px 0;
}

hr.bottom {
    margin: 20px 0 10px 0;
}

form {
    margin: 0;
}

.reverseCaret {
    border-top: none;
    border-bottom: 4px solid #000000;
}

.powered-by-info {
    margin-right: 10px
}
.breadcrumb
{
	background:transparent;
	padding:0;
}

.brand-text {
    padding: 0 10px 0 5px !important;
}

.brand-image {
    padding: 0 !important;
    margin: -12px 0 !important;
    margin-right: 50px;
//    background-image: linear-gradient(to right,var(--navbar-text-color), var(--main-color));
}

.navbar .brand-text:hover {
  //  border-bottom: 3px solid var(--navbar-accent)
}

.navbar .brand-text,
.navbar .brand-text:after,
.navbar .brand-text:before {
    transition: all .3s;
}
.navbar .dropdown-menu i.fa {
    margin-right: 8px;
}


.nav-pills{
    border-bottom: 1px solid #ddd;
    text-align:center;
}

.nav-pills li.active a {
    font-weight:600;
    background-color: inherit;
    color: #444;
}

.btn-navbar {
    background: var(--active-color) !important;
}
.btn-success
{
	background: var(--active-color);
	color:#fff;
}
.btn {
    padding: 8px 20px;
    font-size: 1rem;
}
.btn-large {
    padding: 12px 20px;
    font-size: 1.2rem;
    width:180px;
}


.btn-primary
{
	background: var(--navbar-hover-color);
	color:#fff;
}
.btn:hover, .btn:active
{
	--border: 1px solid var(--navbar-hover-color);
	--background: #29b6ff;
	--color:#222;
}

.loginpanel, .loginpanel label, .loginpanel input {
    font-size: 1.2rem;
}


.loginpanel > div > label
{
	padding:10px;
}
.loginpanel > div 
{
	vertical-align:baseline;
}


input[type=text],
input[type=password],
input[type=date],
input[type=file],
input[type=number],
textarea,
select {
    padding: 4px 10px;
    color: var(--active-color);
    height: 40px;
    margin-bottom: 10px;
    font-weight: 500;
    box-sizing: border-box;
    font-size: 18px;
    background-color: #fff; /* #c8f5ff; #95e6f9*/
    border: 1px solid cadetblue;
}

textarea {
    height: 100px;
    resize: none;

}


.loginpanel a {
    color: var(--navbar-hover-color);
    //#0065ff;
    /*font-size:0.85rem;*/
    padding: 0px;
    font-weight: 500;
}
.loginpanel input {
    padding: 16px 10px !important;
    line-height: 50px !important;
    background-color: white;

}

.loginpanel input {
    background-color: #d9f4ff;
    color: darkblue;
}


.contatti {
    width: 100%;
    padding: 0 30px;
    box-sizing: border-box;
    background-color: var(--navbar-hover-color);
    color: val(--navbar-bcolor);
    margin: auto auto;
}
.contatti p {
		color: var(--navbar-bcolor) !Important;
}
.contatti a {
		color: var(--navbar-accent) !Important;
		font-size:1.2em;
		font-weight:600;
}
.blocco_contatti 
{
	text-align:left;
	//display:none;
clear:both;
   max-width: 1170px;
   	color: var(--navbar-bcolor);
margin: auto auto;

height:100%;

margin-top:20px;
width:100%;

}
.blocco_contatti strong
{
	font-variant:500;
	text-transform:uppercase;
}

.blocco_contatti_1 h2
{
	font-size:1.3rem;
	font-weight:700;
	text-transform:uppercase;
	color: var(--navbar-bcolor) !Important;
}

.blocco_contatti_1_1
{
	float:left;
	width:60%;
}
.blocco_contatti_1_2
{
	float:left;
	width:35%;
	padding-left:2%;
	border-left:1px solid #ccc;
}
.blocco_contatti_1_2 p span{
 font-weight:500;
 text-transform:uppercase;
 font-size:1.2em;
 display:inline-block;
 margin-bottom:10px;
}

.disclaimer
{
   max-width: 1170px;
	margin: auto auto;
    color: #444;
     min-height: 64px;
    width: 100%;
	padding: 0 30px;
	box-sizing: border-box;
	bottom:0;
}

.icon-bar {
    background: #fff !important;
}

.navbar-inner {
	border:none;
	max-width:1200px;
	box-shadow:none;
	margin:auto;
    background: var(--navbar-bcolor);

}

    .navbar-inner a {
        color: var(--navbar-text-color) !important;
		font-size:1.05rem;
		padding: 24px 20px !important;
        text-shadow: none !important;
	    font-weight:500;
        border-bottom: 3px solid transparent;
    }

.navbar .nav > .active > a {
    background: var(--navbar-bcolor);
        color: #29b6ff !important;
    box-shadow: none !important;
    border-bottom: 3px solid var(--navbar-accent)
}

.navbar .nav > li > a:hover {
    background: var(--navbar-bcolor) !important;
    color: var(--navbar-text-color) !important;
    border-bottom: 3px solid var(--navbar-text-color)
}

.navbar ul li a,
.navbar ul li a:after,
.navbar ul li a:before {
    transition: all .2s;
}

.navbar .nav > li.dropdown.open > a:hover {
}

.navbar .nav > .dropdown.open.active > a {
}

.navbar .nav .dropdown .dropdown-toggle:hover {
}

.navbar .nav li.dropdown.open .dropdown-toggle,
.navbar .nav li.dropdown.active .dropdown-toggle,
.navbar .nav li.dropdown.active.open .dropdown-toggle {
    box-shadow: none;
}

.navbar .nav .dropdown-menu a {
    color: var(--main-color) !important;
	padding: 10px 20px !important;
	font-size: 1rem;
}

.navbar .nav .dropdown-menu a small {
padding-left: 24px;
    color: #6261a2;
}	
.navbar .nav .dropdown-menu .active a {
    background: var(--active-color);
    color: var(--navbar-text-color) !important;
}

.navbar .nav .dropdown-menu a:hover {
    background: var(--navbar-hover-color) !important;
    color: var(--navbar-text-color) !important;
}

#manage-user-menu a:hover {
    background: var(--navbar-hover-color) !important;
    color: var(--navbar-text-color) !important;
}

#manage-user-menu a,
#manage-user-menu a:after,
#manage-user-menu a:before {
    transition: all .2s;
}


.navbar .nav li.dropdown > .dropdown-toggle .caret,
.navbar .nav li.dropdown.open > .dropdown-toggle .caret,
.navbar .nav li.dropdown.active > .dropdown-toggle .caret,
.navbar .nav li.dropdown.open.active > .dropdown-toggle .caret,
.navbar .nav li.dropdown > a:hover .caret,
.navbar .nav li.dropdown > a:focus .caret {
    border-top-color: var(--navbar-text-color);
}










@media (max-width: 370px) {
    .navbar .brand-text {
        display: none;
    }

    footer {
        display: none;
    }
}

@media (max-width: 530px) {
    .powered-by-info {
        display: none;
    }
    * {
        font-size: .95em !important;
    }
	.SingleDocument {
	width: 95% !Important;
	}

    .btn {
        padding: 4px 16px;
        font-size: .8rem;
    }

    .btn-large {
        padding: 6px 16px;
        font-size: 1rem;
    }

}

@media (max-width: 980px) {

    .DocumentDetail {
        width:100%;
    }
        .btn {
        padding: 6px 18px;
        font-size: .8rem;
    }

    .btn-large {
        padding: 8px 18px;
        font-size: 1rem;
    }


.blocco_contatti_1_1
{
	float:left;
	width:60%;
}
.blocco_contatti_1_2
{
	float:left;
	width:35%;
	padding-left:2%;
	border-left:1px solid #ccc;
}

.TipologiaDetail {
	float:none;
	width: 100%;
	box-sizing:border-box;
}
.navbar .brand{
    margin: 0 !important;
    padding: 14px 0px !IMPORTANT;		
}


H1{
	font-size:1.4em !Important;
    margin-bottom:70px;
}
h1 small, h3 small{
    font-size: .7em !Important;
    margin-top: -7px;
    line-height: 1.2em;
}
	footer
	{
		display:none;
		
	}
    .navbar .right-ul {
        float: none;
    }

    .navbar .nav .dropdown-menu {
        background: white;
        border-radius: 3px;
    }

    .brand-image {
        margin: 0 10px 0 -20px !important;
    }

    .table-responsive {
        width: 100%;
        overflow-y: hidden;
        white-space: nowrap;
        -ms-overflow-style: -ms-autohiding-scrollbar;
    }
}