.collapse-sidebar-none{
    display: inline-block;
}

.collapse-sidebar-block{
    display: inline-block;
}

.list-unstyled li a:hover {
    color: #87A4B0 !important;
    text-decoration: none;
    background-color: #fff !important;
}

.font-size-bigger{
    font-size: 2.5rem !important;
}

.social-class{
    width: 10px;
    height: 10px;
    background-color: blue;
    display: inline-block;
    margin-left: 20px;
    border-radius: 50px;
    margin-right: 5px;
}

.app-class{
    width: 10px;
    height: 10px;
    background-color: #E51886;
    display: inline-block;
    margin-left: 20px;
    border-radius: 50px;
    margin-right: 5px;
}

.list-unstyled li a:hover img{
    filter: invert(68%) sepia(4%) saturate(1620%) hue-rotate(152deg) brightness(91%) contrast(95%);
}

.text-lightblue{
    color: lightblue;
}

#main-photo-gallery .gallery-for{
    height:auto;
}

#main-photo-gallery .gallery-for img{
    object-fit:cover;
}

.text-violet{
    color: violet;
}

.text-brown{
    color: rgb(74, 39, 39)
}

.inline-block{
    display: inline-block
}

.right-0px{
    right: 0px;
}

.price-info-immobile p{
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 0rem
}

#datable-match-richieste_filter, #datable-matchimmobili_filter{
    display:none !important
}

[type=radio] { 
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

/* IMAGE STYLES */
[type=radio] + img {
    cursor: pointer;
    object-fit: cover;
}

/* CHECKED STYLES */
[type=radio]:checked + img {
    outline: 4px solid #E51886;
}

.label-image-radio{
    width: 30%;
    margin: 10px;
}

.tipo{
	display: none;
}

#hasCustomer, .hasCustomerIcon{
    display:none;
}

.object-fit{
    object-fit: cover;
}

.preloader{
    display: none;
    width: 100vw;
    height: 100vh;
    background-color: rgba(135, 164, 176, 0.5);
}

.preloader-content{
    display: flex;
    justify-content: center;
    align-items: center;
    height:100vh;
    font-size: 25px;
    color: #fff;
}

.immobili-web-table{
    width: 100%;
    margin-top: 20px;
}

.immobili-web-table thead tr th{
    width: calc(100% / 15 - 5px);
    margin: 5px 0;
    text-align: center;
}

.immobili-web-table tbody tr td{
    text-align: center;
}

.max-height-500{
    max-height: 500px !important;
}

.max-height-180{
    max-height: 180px !important;
}

.color-secondary{
    color: #6b8895;
}

.previewimage{
    width: 50px !important;
}

.img-height{
    max-height: 150px !important;
}

.custom-cliente, .custom-immobile{
    display: none;
}

.color-red{
    color: red;
}

.color-green{
    color: green;
}

.color-orange{
    color: orange;
}

.w-20{
    width: 25%
}

.w-150px{
    width: 150px;
}

.disabled-button{
    background-color: #80CE92;
    border-color: #80CE92 !important;
}

.disabled-button:hover{
    background-color: #80CE92;
    border-color: #80CE92 !important;
}

.disabled-button-info{
    background-color: #17a3b8a4;
    border-color: #17a3b8a4 !important;
}

.disabled-button-info:hover{
    background-color: #17a3b8a4;
    border-color: #17a3b8a4 !important;
}

.progress-bar-main-color{
    background-color: #6B8895
}

.progress-bar-success{
    background-color: green;
}

.progress-bar-info{
    background-color: #007bff;
}

.progress-bar-warning{
    background-color: #f0ad4e;
}

.progress-bar-danger{
    background-color: #d9534f;
}

.save-status{
    display: none;
}

.border-radius-10px{
    border-radius: 10px
}

.btn-detail-grid{
    background-color: #6b8895;
    border-radius: 0px 0px 0px 5px;
    border: 1px solid #fff;
    color: #fff;
}

.btn-detail-grid:hover{
    background-color: #EFEFEF
}

.top-0{
    top: 0px;
}

.right-0{
    right: 0px;
}

.font-size-20{
    font-size: 20px;
}

.page{
    font-size: 22px;
    padding: 0px 10px;
    border: 1px solid #004078;
}

.page a{
    color: #004078;
}

.current{
    font-size: 22px !important;
    padding: 0px 10px !important;
    border: 1px solid #004078 !important;
    color: #E72A84;
}

.first{
    font-size: 22px;
    padding: 0px 10px;
    border: 1px solid #004078;
}

.first a{
    color: #004078;
}

.previous{
    font-size: 22px;
    padding: 0px 10px;
    border: 1px solid #004078;
}

.previous a{
    color: #004078;
}

.next{
    font-size: 22px;
    padding: 0px 10px;
    border: 1px solid #004078;
}

.next a{
    color: #004078;
}

.last{
    font-size: 22px;
    padding: 0px 10px;
    border: 1px solid #004078;
}

.last a{
    color: #004078;
}

.gallery-for{
    width: 100%;
    height: 500px;
    margin-bottom: 30px;
}

.gallery-nav{
    width: 100%;
    height: 200px; 
}

.gallery-main-modal{
    width: 100%;
    height: 500px;
    margin-bottom: 30px;
}

.gallery-nav-modal{
    width: 100%;
    height: 200px; 
}

.gallery-main-modal .slick-next{
    right: 25px;
}

.gallery-main-modal .slick-prev{
    left: 25px;
    z-index: 1
}

#gallery-modal-for .slick-list.draggable{
    width: 100%;
    height: 100%;
}

#gallery-modal-nav .slick-list.draggable, #gallery-modal-nav .slick-list.draggable .slick-track .slick-slide div a img{
    width: 100%;
    height: 100%;
}

#gallery-modal-nav .slick-list.draggable .slick-track, #gallery-modal-nav .slick-list.draggable .slick-track .slick-slide, #gallery-modal-nav .slick-list.draggable .slick-track .slick-slide div, #gallery-modal-nav .slick-list.draggable .slick-track .slick-slide div a{
    height: 100% !important;
}

#gallery-modal-nav .slick-list.draggable{
    height: 115px;
}

#gallery-modal-nav .slick-list.draggable .slick-track .slick-slide div a img{
    object-fit: cover;
}

.close{
    color:#6b8895
}

#immobiliGalleryModal .modal-dialog .close.closemodal-gallery{
    display: none;
}

.next-arrow{
    position: absolute;
    top: 50%;
    right: 0%;
    background-color: rgba(141, 141, 141, 0.51);
    border: none;
    color: #fff;
    padding: 5px;
    border-radius: 10px;
    font-size: 50px;
}
.prev-arrow{
    position: absolute;
    top: 50%;
    left: 0%;
    background-color: rgba(141, 141, 141, 0.51);
    border: none;
    color: #fff;
    padding: 5px;
    border-radius: 10px;
    font-size: 50px;
    z-index: 1;
}

.id-icon{
    border: 1px solid #6b8895;
    border-radius: 20px;
}

.rounded-modal-icon{
    border: 1px solid #6b8895;
    border-radius: 50px;
    padding: 5px 10px;
    color: #6b8895
}



/* .gallery-nav-modal .slick-list .slick-track{
    width: 100% !important;
    transform: translate3d(0,0,0) !important;
} */

.gallery-nav-modal .slick-list .slick-track .slick-slide{
    margin: 5px
}

.slick-prev::before, .slick-next::before {
    color: #004078;
}

.gallery-for .slick-slide img{
    height: 500px !important;
    width: 100%;
}

.gallery-nav .slick-slide img{
    height: 200px;
    padding: 5px;
}

#additional-filter{
    display: none;
    margin-top: 30px;
}

#show-additional-filter{
    border: 1px solid grey;
    padding: 0px 20px;
}

.translation{
    transform: translateY(-10px);
    position: absolute;
    left: 45%;
    z-index: 5;
    background-color: #fff;
}

.relative{
    position: relative;
}

.border-down{
    border-bottom: 1px solid grey;
}

.border-info-modal{
    border: 1px solid #6b8895
}

.btn-close-gallery{
    background-color: #87A4B0;
    padding: 10px 30px;
    border-radius: 0px;
    color: #fff;
}

.btn-filter-web{
    background-color: #87A4B0;
    padding: 10px 30px;
    border-radius: 0px;
    color: #fff;
}

.btn-filter-web-active{
    background-color: #fff;
    padding: 10px 30px;
    border-radius: 0px;
    color: #6b8895;
}

.btn-filter-web-active:hover, .btn-close-gallery:hover{
    background-color: #6b8895;
    color: #fff
}

.btn-filter-web:hover{
    background-color: #6b8895;
    color: #fff
}

.margin-negative-5px{
    margin-left: -5px;
}

.position-inline-block{
    position: relative;
}

.position-delete-button{
    position: absolute; 
    right: 0%;
    top: 0%;
}

.margin-lateral{
    margin-left: 10px;
    margin-right: 10px;
}

.padding-lateral{
    padding-left: 10px;
    padding-right: 10px;
}

.margin-top-10{
    margin-top: 10px;
}

.link-correlato{
    color: black;
    text-decoration: none;
}

.link-correlato:hover{
    color: #004078;
}

.round-legend{
	height: 25px;
	width: 25px;
	border-radius: 50px;
	display: inline-block;
	margin-right: 5px;
	margin-top: 5px;
}

.flex-legend{
	display: flex;
	align-items: center;
	padding-bottom: 10px;
	margin-top: 10px;
}

.dark-blue{
	background-color: #673AB7;
}

.purple{
	background-color: #9C27B0;
}

.red{
	background-color: #FF5252;
}

.white{
	background-color: #F5FFFF;
	border: 1px solid #000;
}

.dark-green{
	background-color: #0F9D58;
}

.grey{
	background-color: #757575;
}

.light-green{
	background-color: #00FF00;
}

.cyan{
	background-color: #0097A7;
}

.red-brown{
	background-color: #A52714;
}

.pink{
	background-color: #F48FB1;
}

.brown{
	background-color: #795548;
}

.blue{
	background-color: #002BFF;
}

.yellow{
	background-color: #FFFF0D;
}

.black{
	background-color: #010101
}

.orange{
	background-color: #F9A825;
}

.crimson{
	background-color: #DC143C;
}

.dark-magenta{
	background-color: #8B008B;
}

.dark-orange{
    background-color: #FF8C00;
}

.indigo{
    background-color: #4B0082;
}

.light-cyan{
    background-color: #E0FFFF
}

.lime{
    background-color: #00FF00;
}

.fuchsia-crayola{
    background-color: #CD55BB;
}

.metal-purple{
    background-color: #6600ff;
}

/*INIZIO SIDEBAR*/
.wrapper {
    display: flex;
    width: 100%;
    align-items: stretch;
}

#sidebar {
    min-width: 250px;
    max-width: 250px;
    background: #87a4b0 !important;
    color: #fff;
    transition: all 0.3s;
}

.custom-color-sidebar{
    background-color: #87a4b0 !important;
}

.green-circle{
    height: 15px;
    width: 15px;
    background-color: green;
    border-radius: 15px;
    margin-right: 10px;
    border: 1px solid #fff
}

.red-circle{
    height: 15px;
    width: 15px;
    background-color: red;
    border-radius: 15px;
    margin-right: 10px;
    border: 1px solid #fff
}

.yellow-circle{
    height: 15px;
    width: 15px;
    background-color: yellow;
    border-radius: 15px;
    margin-right: 10px;
    border: 1px solid #fff
}

.full-image-grid{
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    height: 250px;
    width: 100%;
}

.grid-link p{
    color: #004078;
    text-decoration: none;
    padding-left: 15px;
    padding-right: 15px;
}

.grid-link:hover{
    text-decoration: none;
}

.grid-border{
    border: 1px solid #004078;
}

.height-fixed{
    height: 300px;
}

.no-padding-lateral{
    padding-left: 0px;
    padding-right: 0px;
}

#sidebar.active {
    width: 50px;
    min-width: 100px;
}

.custom-cliente, .custom-immobile{
    border-top: 1px solid #87A4B0;
    padding-top: 20px;
}

#datable-match-immobili-web, #datable-acquisti, #datable-clienti, #datable-immobili, #datable-matchimmobili, #datable-match-richieste, #datable-vendite{
    width: 100% !important
}

#datable-match-immobili-web tr th, #datable-match-immobili-web tr td {
    padding: 10px 0px;
}

.invisible-button{
    background-color: transparent;
    border: none;
}

.cliente_venditore_richiesta{
    color: #6b8895;
}

#sidebar ul li:last-child{
    border-bottom: none;
}

#sidebar ul li button{
    color: #fff;
    font-size: 1.1em;
}

#sidebar .sidebar-header {
    padding: 20px;
    background: #87a4b0;
		border-bottom: 1px solid #fff;
}

#sidebar ul p {
    color: #fff;
    padding: 10px;
}

#sidebar ul li a {
    padding: 10px;
    font-size: 1.1em;
    display: block;
}

#sidebar ul li a:hover {
    color: #87a4b0;
    background: #fff;
}

#sidebar ul li a:hover img {
    filter: invert(68%) sepia(4%) saturate(1620%) hue-rotate(152deg) brightness(91%) contrast(95%);
}

#sidebar ul li.active>a,
a[aria-expanded="true"] {
    color: #fff;
    background: #87a4b0;
}

a[data-toggle="collapse"] {
    position: relative;
}

.dropdown-toggle::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
}

.btn-immobili{
    background-color: #E51886;
    border-radius: 0px;
    color: white;
    width: 100%;
    text-align: left;
}

.btn-immobili:hover{
    background-color: #fff;
}

ul ul a {
    font-size: 0.9em !important;
    padding-left: 30px !important;
    background: #87a4b0;
}

ul.CTAs {
    padding: 20px;
}

ul.CTAs a {
    text-align: center;
    font-size: 0.9em !important;
    display: block;
    border-radius: 5px;
    margin-bottom: 5px;
}

a.download {
    background: #fff;
    color: #7386D5;
}

a.article,
a.article:hover {
    background: #87a4b0 !important;
    color: #fff !important;
}

.list-unstyled li a{
	color: #fff;
}

.list-unstyled li a:hover{
	color: #fff;
	text-decoration: none;
	background-color: #004078;
}

.button-tornesi{
	background-color: transparent;
	border: none;
}

.button-tornesi:hover{
	background-color: #87a4b0 !important;
    border: none;
}

.button-tornesi:active{
	background-color: #87a4b0 !important;
    border: none;
}

.button-tornesi:focus{
	background-color: #87a4b0 !important;
    border: none;
}

.button-tornesi:focus-visible{
	background-color: #87a4b0 !important;
    border: none;
}

.form-errors > ul{
    list-style: none;
    color: red;
    padding-left: 0px;
}

#open-ticket{
    cursor: pointer;
}

.open-ticket-link{
    color: #fff;
}

.open-ticket-link:hover{
    background-color: transparent;
    color: #fff;
    text-decoration: underline;
}

.matched_field{
    color: #fff;
    background-color: #E51886;
    font-weight: 600;
}

.matched_field_tolerate{
    color: #fff;
    background-color: #e5188591;
    font-weight: 600;
}

.btn-delete{
    border: none;
    background-color: transparent;
    color: #87a4b0;
    border-radius: 5px;
    padding: 5px 10px;
    transition: 0.5s
}

.btn-delete:hover{
    color: #fff;
    background-color: #87a4b0;
}

.features-list{
    list-style-type: none;
    margin-left: 0px;
    padding-left: 0px;
}

.font-weight-500{
    font-weight: 500;
}

.transparent_link_pink{
    margin-left: 5px;
    background-color: transparent;
    border: none;
    color: #E51886;
    text-decoration: none;
    padding: 5px;
}

.transparent_link_pink:hover{
    background-color: #E51886;
    padding: 5px;
    color: #fff;
    text-decoration: none;
}

/* ---------------------------------------------------
    CONTENT STYLE
----------------------------------------------------- */

#content {
    width: 100%;
    min-height: 100vh;
    transition: all 0.3s;
    background-color: #efefef
}

#inner-content{
    padding: 20px;
}

.background-white{
    background-color: #fff
}

.btn-tornesi{
    background-color: #E51886;
    color: white;
    transition: 0.5s
}

.btn-tornesi:hover{
    background-color: #fff;
    color: #E51886;
    border: 1px solid #E51886;
}

.btn-tornesi-grid{
    background-color: #E51886;
    color: white;
    padding: 5px 20px;
    transition: 0.5s;
    font-size: 15px;
}

.btn-tornesi-grid:hover{
    background-color: #fff;
    color: #E51886;
    border: 1px solid #E51886;
}

.btn-tornesi-save{
    background-color: #E51886;
    color: white;
    transition: 0.5s;
    padding: 5px 50px;
}

.btn-tornesi-save:hover{
    background-color: #fff;
    color: #E51886;
    border: 1px solid #E51886;
}

.display-flex{
    display: flex;
}

.direction-column{
    flex-direction: column
}

.justify-end{
    justify-content: flex-end
}

.justify-self-end{
    justify-self: flex-end;
}

.flex-wrap{
    flex-wrap: wrap;
}

.space-between{
    justify-content: space-between
}

.align-items-center{
    align-items: center;
}

.custom-input-filter-container{
    width: 20%;
}

.custom-input-filter-container-half{
    width: 8%;
}

.custom-input-filter + button {
    padding: 0px;
}
  
.custom-input-filter{
    background-color: #fff;
    border-radius: 5px;
    border: none;
    padding: 5px 5px;
    width: 100% !important
}

.bottom-elements{
    margin-top: auto;
    margin-bottom: 15px;
}

td{
    font-size: 14px;
}

.btn-filter.padding-filter{
    padding: 5px 10px;
}


.btn-filter-grid{
    background-color: #6b8895;
    color: #fff;
    padding: 5px 20px;
    transition: 0.5s;
    width: 100%;
    font-size: 15px;
}

.btn-filter-grid:hover{
    background-color: #87a4b0;
    color: #fff;
    padding: 5px 20px
}

 /* The switch - the box around the slider */
 .switch {
    position: relative;
    display: inline-block;
    width: 70px;
    height: 34px;
  }
  
  /* Hide default HTML checkbox */
  .switch input {
    opacity: 0;
    width: 0;
    height: 0;
  }
  
  /* The slider */
  .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    -webkit-transition: .4s;
    transition: .4s;
    color: #6b8895;
    font-weight: 700;
  }
  
  .slider:before {
    position: absolute;
    content: "Sì";
    height: 33px;
    width: 33px;
    left: 0px;
    bottom: 0px;
    background-color: #6b8895;
    -webkit-transition: .4s;
    transition: .4s;
    text-align: center;
    font-weight: 700;
    padding-top: 3px;
    color: #fff;
  }
  
  input:checked + .slider {
    background-color: #6b8895;
  }
  
  input:focus + .slider {
    box-shadow: 0 0 1px #6b8895;
  }
  
  input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
  }
  
  /* Rounded sliders */
  .slider.round {
    border-radius: 34px;
  }
  
  .slider.round:before {
    border-radius: 50%;
  } 

  .padding-slider-span{
    padding-left: 40px;
    padding-top: 4px;
  }

  .btn-filter, .btn-grey-download, .btn-filter-image{
    background-color: #6b8895;
    color: #fff;
    padding: 5px 10px;
  }

  .btn-filter-image{
    color: #fff !important;
  }

  .btn-filter:hover, .btn-grey-download:hover{
    background-color: #87a4b0;
    color: #fff;
    padding: 5px 10px;
  }

  .btn-filter-image:hover{
    color: #fff;
    background-color: #87a4b0;
    padding: 5px 10px;
  }

  .btn-filter.padding-filter:hover{
    background-color: #87a4b0;
    color: #fff;
    padding: 5px 10px
  }

/* ---------------------------------------------------
    TOPBAR
----------------------------------------------------- */
.bg-darkgrey{
    background-color: #6b8895;
}


/* ---------------------------------------------------
    MEDIAQUERIES
----------------------------------------------------- */



@media (max-width: 768px) {
    #sidebar {
        margin-left: -250px;
    }
    #sidebar.active {
        margin-left: 0;
    }
    #sidebarCollapse span {
        display: none;
    }
}