
@import url('https://fonts.googleapis.com/css2?family=Spinnaker&display=swap');

/****** BRAND COLOR ******/

.bg-beige { 
	background-color:#e5e3de; 
}
.bg-white { 
	background-color:#fff; 
}

.text-blu {
	color: #0066cc;
}
.text-oro {
	color: #b9921c;
}

.btn-primary {
    color: #fff;
    background-color: #0066cc;
    font-weight: bold;
}
.btn-primary:hover {
    background-color: #b9921c;
}



/****** TYPE ******/

body, html { 
	font-family: 'Spinnaker', sans-serif;
}
h1,h2,h3,.h1,.h2,.h3 { 
	color:#003366; 
	line-height:1em;
	margin-bottom: 1.5rem;
}
h1 small, .h1 small{ 
	color:#b9921c; 
	display: block;
	line-height:14px;
	font-size: 14px;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 2px;
}
h2 { 
	color:#0066cc; 
}
.progetto img { 
	margin-bottom: -12px;
}
.categoria-progetto { 
	color:#fff; 
	background:#b9921c;
	font-size: 13px;
	line-height: 16px;
	text-transform: uppercase;
	padding: .25rem 1rem;
	margin-bottom:5px;
    border-radius: 5rem;
    z-index: 9999999;
    display: inline-block;
}
p { 
	font-size: 18px;
	line-height: 28px;
	margin-bottom: 1.5rem;
	color: #666666;
}

a {
    color: #0066cc;
}
a:hover {
    color: #b9921c;
}
.btn {
    border:0 none;
    padding: .5rem 1.75rem;
    border-radius: 5rem;
    transition: color .25s ease-in-out,background-color .25s ease-in-out,border-color .25s ease-in-out,box-shadow .25s ease-in-out;
}




/****** HEADER ******/

.navbar-brand {
	color:#003366; 
	font-weight: bold;
}
.logo-mobile img {
    max-width: 180px;
    margin-bottom: -25px;
    margin-left: -10px;
    z-index: 99999999;
    position: relative;
}
.logo-desktop {
    margin-bottom: -36px;
    z-index: 9999999;
    position: relative;
}
.navbar-expand-md .navbar-nav .nav-link {
    padding: 5px 25px;
    text-transform: uppercase;
}

@media (max-width: 767px) {
	/* mobile only */

	.navbar-nav.align-items-end {
	    display: block !important;
	}
	.navbar-expand-md .navbar-nav .nav-link {
	    padding: 10px 0px;
	}
}
@media (min-width: 767px) and (max-width: 991px) {
	/* tablet only */

	.navbar-expand-md .navbar-nav .nav-link {
	    padding: 5px 10px;
	    font-size: 14px;
	}
}

.navbar svg {
	fill: #0066cc; 
}

.navbar-toggler {
    border:1px solid rgba(0,0,0,0);
}
.navbar-toggler small {
    color: #0066cc;
    display: block;
    font-size: 11px;
    font-weight: bold;
}
.navbar-toggler:focus {
    box-shadow:none;
    border:1px solid #0066cc;
}




/****** FOOTER ******/

#socket {
	padding: 30px 0 15px 0;
	text-align:center;
}
#socket p {
	font-size:13px;
	line-height: 18px;
}






/****** CONTENT ******/

section {
	padding:70px 0;
	box-shadow: inset 0 50px 50px rgb(0 0 0 / 5%);
}
@media (min-width: 768px) {
	/* desktop only */

	section {
		padding:130px 0;
	}
}

.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    padding-right: var(--bs-gutter-x,1.5rem);
    padding-left: var(--bs-gutter-x,1.5rem);
}

.rounded {
    border-radius: .8rem!important;
}

.carousel-caption {
    background:rgba(0,0,0,0.6);
}


@media (max-width: 767px) {
	/* mobile only */
	.carousel-caption h5 {
	    font-size: 24px;
	}
}
@media (min-width: 768px) {
	/* desktop only */
	.carousel-caption {
	    right: 30%;
    	left: 30%;
	}
	.carousel-caption h5 {
	    font-size: 36px;
	}
}
.carousel-control-next-icon, .carousel-control-prev-icon {
    width: 3rem;
    height: 3rem;
}





@media (max-width: 767px) {
	/* mobile only */

}
@media (min-width: 768px) {
	/* desktop only */

}













.counter
{
    /* background-color: #eaecf0; */
    text-align: center;
}
.employees,.customer,.design,.order
{
    margin-top: 70px;
    margin-bottom: 70px;
}
.counter-count
{
    /*
    font-size: 18px;
    background-color: #00b3e7;
    border-radius: 50%;
    position: relative;
    color: #ffffff;
    text-align: center;
    line-height: 92px;
    width: 92px;
    height: 92px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    display: inline-block;
    */
    text-align: center;
    font-size: 36px;
}

.employee-p,.customer-p,.order-p,.design-p
{
    font-size: 16px;
    color: #000000;
    line-height: 16px;
}
