/* Frontend Css File */

/* Fonts */
@font-face { 
	font-family: Comfortaa; 
	src: url(../../fonts/Comfortaa/Comfortaa-Light.ttf); 
}

@font-face { 
	font-family: Raleway; 
	src: url(../../fonts/Raleway/Raleway-Light.ttf); 
}

@font-face { 
	font-family: Montserrat; 
	src: url(../../fonts/Montserrat/Montserrat-Light.ttf); 
}

/* Tags */
body {
	font-family: 'Comfortaa', sans-serif;
	padding: 5rem 0 6.7rem 0;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	background: radial-gradient(circle, #fff 30%, #eee 70%, #ddd 100%);
}

a {
	color: #00000080;
}

a:active, 
a:hover,
a:visited,  
a:focus {
    text-decoration: none!Important;
    color: #000000b3;
}

label {
	font-weight: 700;
	cursor: pointer;
}

textarea {
	resize: none;
}

/* Font Awesome */
.fa-solid {
    padding-right: .5rem;
}

#estimates_body .fa-circle-arrow-right {
	padding-right: 0;
	display: inline-block;
	transform-origin: center;
}

/* BS Navbar */
.fixed-top {
    border-bottom: 0.063rem solid #e5e5e5;
}

.fixed-bottom {
    border-top: 0.063rem solid #e5e5e5;
}

.dropdown-divider {
    margin: 0 0;
}

.dropdown-menu {
    padding: 0 0;
}

.dropdown-item {
    padding: .75rem 1.5rem;
}

.navbar, 
.dropdown-menu {
    /* box-shadow: 0 0 0 rgb(0 0 0 / 20%), 0 0 .25rem rgb(0 0 0 / 20%); */
}

.bg-light {
    background-color: rgb(248, 249, 250, .85)!Important;
}

/* BS card */
.card.card-calculator, 
.card.card-account, 
.card.card-detail {
	/* box-shadow: 0 0 0 rgb(0 0 0 / 20%), 0 0 .25rem rgb(0 0 0 / 20%); */
}

.card.card-calculator {
	padding: 0.25rem;
	background-color: #fff;
	border: 0.0625rem solid #d5d5d5;
}

.card-header-account h2.card-title {
	margin-bottom: 0;
	font-size: 1.5rem;
}

.card-header.card-header-calculator, 
.card-footer.card-footer-calculator {
	background-color: #000000b3;
	color: #fff;
}

.card-body.card-body-calculator {
	background-color: #00000099;
	color: #ddd;
}

/* BS List Group */
.list-group-item.active {
    background-color: #000000b3;
    border-color: #000000b3;
}

.list-group-shadow {
	/* box-shadow: 0 0 0 rgb(0 0 0 / 20%), 0 0 .25rem rgb(0 0 0 / 20%); */
}

/* BS Dropdown Menu */
.dropdown-item.active, .dropdown-item:active {
    background-color: #000000b3;
}

/* BS badge */
.badge-designluce {
	padding-top: .35rem; 
	font-size: 1rem; 
	width: auto; 
	min-width: 12rem;
}

/* BS Pagination */
.page-item.active .page-link {
    background-color: #000000b3;
    border-color: #000000b3;
}

.page-link {
	color: #000000b3;
}

.page-link:hover {
	color: #000000b3;
}

#search_bar {
	display: none;
}

.reset_search_fields {
    display: none;
    cursor: pointer;
}

/* Customized classes Home Page */

.boxes {
	padding: .5rem;
	border: 0.0625rem solid #d5d5d5;
	/* box-shadow: 0 0 0 rgb(0 0 0 / 20%), 0 0 .25rem rgb(0 0 0 / 20%); */
	text-align: center;
}

.box {
	margin: .5rem;
	padding: 4rem 0 4rem 0;
	border: 0.0625rem solid #d5d5d5;
	font-weight: bold;
	font-size: 2rem;
	color: #555;
	background: #eee;

	-webkit-transition: background-color 500ms linear;
    -moz-transition: background-color 500ms linear;
    -o-transition: background-color 500ms linear;
    -ms-transition: background-color 500ms linear;
    transition: background-color 500ms linear;
}

.box:hover {
	color: #e5e5e5;
	background: #555;
}

/* Customized classes families */

.finishes_img {
	width: 2.5rem;
	height: 2.5rem;
	cursor: pointer;
}

.spotlights_img {
	width: 1.5rem;
	height: 1.5rem;
	cursor: pointer;
}

.top_image {
	width: 30%;
	height: auto;
}

.big_image,
.tris_big_finish,
.irid22_big_finish,
.irid33_big_finish {
	max-width: 100%;
	height: auto;
}

.polaroid {
	padding: 0.25rem;
	background-color: #fff;
	border: 0.0625rem solid #d5d5d5;
	/* box-shadow: 0 0 0 rgb(0 0 0 / 20%), 0 0 .25rem rgb(0 0 0 / 20%); */
}

.thumb_img {
	width: 100%;
	height: auto;
}

/* Scrollup */
.btn.scrollup {
    position: fixed;
    bottom: 3rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 500;
    display: none;
    /* box-shadow: 0 0 0 rgb(0 0 0 / 20%), 0 0 .25rem rgb(0 0 0 / 20%); */
}

/* Loader */
#show_loader {
   position: fixed;
   top: 7.5%;
   left: 50%;
   transform: translateX(-50%);
   padding: .2rem .5rem;
   background: white;
   /* box-shadow: 0 0 0 rgb(0 0 0 / 20%), 0 0 .25rem rgb(0 0 0 / 20%); */
   display: none;
   z-index: 9999;
}

/* Alert */
#alert {
	position: fixed;
	top: 9.5%;
	left: 50%;
	transform: translateX(-50%);
	width: 50%;
	z-index: 9998;
}

.alert_close {
	cursor: pointer;
}

.text-orange {
	color: #ff6600;
}

.text-yellow {
	color: #ffcc00;
}

.bg-mid-dark {
	border-top: .0625rem solid rgba(0, 0, 0, .125);
	background-color: rgba(0, 0, 0, .75)!important;
	border-bottom: .0625rem solid rgba(0, 0, 0, .125);
}

.width-5 {
	width: 5%!Important;
}

.width-90 {
	width: 90%!Important;
}

.select_composition_polaroid {
	transition: transform 0.3s ease;
}

.select_composition_polaroid:hover {
	transform: scale(1.5);
}

.pagination_left,
.pagination_right {
	padding: 1.2rem .75rem .75rem .75rem;
}

.pagination_center {
	padding: 1rem 0 0 0;
}

.pagination_left {
	text-align: left;
}

.pagination_right {
	text-align: right;
}

/* Media Query from 0 to 1199 */
@media (min-width: 0px) and (max-width: 1199px) {
	.fa-solid {
		display: none;
	}

	.btn.scrollup {
	    left: 50%;
	    transform: translateX(-50%);
	} 

	 .section_icon {
		display: none;
	}

	.section_title {
		font-size: 3rem;
	}

	.registration_header .fa-solid, 
	.account_header .fa-solid {
		display: none;
	}

	.pagination_left {
		text-align: center;
		padding-bottom: .75rem;
	}

	.pagination_right {
		text-align: center;
		padding-bottom: 1rem;
		padding-top: 0rem;
	}

	.pagination_center {
		padding-top: 0;
	}
}

/* Media Query from 1200 to larger */
@media (min-width: 1200px) {
    .fixed-pos {
        width: 100%;
        right: 0;
        min-height:100%;
        position:fixed;
    }
}

/* Rimuove le frecce per Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none!important;
  margin: 0;
}

/* Rimuove le frecce per Firefox */
input[type=number] {
  -moz-appearance: textfield;
}