/*----------------------
SCC Assicurazioni // CSS
bg@barbaragambini.com
2025-01-23
---------------------*/


html { scroll-behavior:smooth; }
body, html { width: 100%;  height: 100%;  }

::-moz-selection  { background: #FF5321; color: #ffffff; }
::selection { background: #FF5321; color: #ffffff; }
a { color:#6f9fb8; text-decoration: underline; }
a:hover { color:#1068B2; }

h1,
h2,
h3,
h4,
h5,
h6 { font-weight:;  margin:0; }


.line-height-1 { line-height:1; } 
.line-height-n { line-height: normal; }
.line-height-2 { line-height: 1.5; }


.border-radius-3 { border-radius: 3px; }
.border-radius-5 { border-radius: 5px; }
.border-radius-8 { border-radius: 8px; }
.border-radius-10 { border-radius: 10px; }
.border-radius-15 { border-radius: 15px; }
.border-radius-20 { border-radius: 20px; }
.border-radius-25 { border-radius: 25px; }
.border-radius-30 { border-radius: 30px; }
.border-radius-35 { border-radius: 35px; }
.border-radius-40 { border-radius: 40px; }

.letter-spacing-005 { letter-spacing:.05em; }
.letter-spacing-010 { letter-spacing:.1em; }
.letter-spacing-015 { letter-spacing:.15em; }
.letter-spacing-020 { letter-spacing:.2em; }
.letter-spacing-025 { letter-spacing:.25em; }


/*-------------------------
colori e grandezze font
-------------------------*/
.rosso { color:#ba2a42; }
.pink { color: #ec008c; }
.rosso-mattone { color:#7c0505; }
.marrone { color:#330000; }
.blu { color:#00669D; }
.ciano { color:#24a09d;}
.giallo { color:#FFCB2C; }
.green { color:#78b84d; }
.light-green { color:#E0F0D7; }
.light-blue { color:#e5ecf8; }
.dark-green { color:#017a45; }
.dark { color:rgba(0,0,0,.8); }
.heavy-green { color:#1d2b0b; }
.gold { color: #D7AB24; }
.bianco { color: #fff; }
.orange { color:#ff6333; }
.black { color:#000; }

.marrone-bg { background-color:#330000; }
.rosso-mattone-bg { background-color:#7c0505; }
.rosso-bg { background-color:#ba2a42; }
.ciano-bg { background-color:#24a09d;}
.giallo-bg { background-color:#FFCB2C; }
.bianco-bg { background-color:#fff; }
.blu-bg { background-color:#00669D; }
.green-bg { background-color:#acca00; }
.dark-green-bg { background-color:#017a45; }
.dark-bg { background-color:rgba(0,0,0,.7); }
.pink-bg { background-color: #ec008c; }
.black-bg { background-color:#000; }

.light-green-bg { background-color:#E0F0D7; }
.light-blue-bg { background-color:#e5ecf8; }
.heavy-green-bg { background-color:#1d2b0b; }
.white-bg { background-color:#fff; }
.orange-bg { background-color:#ff6333; }
.gold-bg { background-color: #D7AB24; }

.light-green-bg { background-color:#c4e973; }
.light-grey-bg { background-color:#eee ; }
.cold-grey-bg { background-color:#d1d4d9 ; }

.text-18 { font-size:18px; }
.text-20 { font-size:20px; }
.text-25 { font-size:25px; }
.text-30 { font-size:30px; }
.text-35 { font-size:35px; }
.text-40 { font-size:40px; }
.text-45 { font-size:45px; }
.text-50 { font-size:50px; }
.text-60 { font-size:60px; }


.max-width-90 { max-width:900px; }
.max-width-80 { max-width:800px; }
.max-width-70 { max-width:700px; }
.max-width-60 { max-width:600px; }
.max-width-50 { max-width:500px; }
.max-width-40 { max-width:400px; }
.max-width-30 { max-width:300px; }
.max-width-20 { max-width:200px; }

.font-weight-100 { font-weight: 100; }
.font-weight-200 { font-weight: 200; }
.font-weight-300 { font-weight: 300; }
.font-weight-400 { font-weight: 400; }
.font-weight-500 { font-weight: 500; }
.font-weight-600 { font-weight: 600; }
.font-weight-700 { font-weight: 700; }
.font-weight-800 { font-weight: 800; }
.font-weight-900 { font-weight: 900; }


/*-------------------------
font
-------------------------*/
.font-freeroad { font-family: 'Freeroad Bold', sans-serif; }
.font-opensans { font-family: 'Open Sans', sans-serif; }
.font-opensans-c { font-family: 'Open Sans Condensed', sans-serif; }
.font-muli { font-family: 'Muli', sans-serif; }
.font-coda { font-family: 'Coda', cursive; }
.font-oswald { font-family: 'Oswald', sans-serif; }
.font-anton { font-family: 'Anton', sans-serif; letter-spacing:0.03em; }
.font-norffo { font-family: 'Norffo'; }
.font-norffo-i { font-family: 'Norffo Italic'; }
.font-montserrat { font-family: 'Montserrat', sans-serif; }
.font-pacifico { font-family: 'Pacifico', cursive; }
.font-rancho { font-family: 'Rancho', cursive; }
.font-lato { font-family: 'Lato', sans-serif; }
.font-arvo { font-family: 'Arvo', serif; }
.font-titillium { font-family: 'Titillium Web', sans-serif; }
.font-roboto { font-family: 'Roboto', sans-serif; }
.font-roboto-c { font-family: 'Roboto Condensed', sans-serif; }
.font-laila { font-family: 'Laila', serif; }
.font-roboto-slab { font-family: 'Roboto Slab', serif; }
.font-kaushan { font-family: 'Kaushan Script', cursive; }
.font-nunito-sans {font-family: 'Nunito Sans', sans-serif; }
.font-noto-sans-KR { font-family: 'Noto Sans KR', sans-serif; }
.font-lora { font-family: 'Lora', serif; }
.font-pt-sans { font-family: 'PT Sans', sans-serif; }
.font-nunito-sans {font-family: 'Nunito Sans', sans-serif; }
.font-caveat {font-family: 'Caveat', cursive; }
.font-poppins { font-family: 'Poppins', sans-serif;} 
.font-raleway { font-family: 'Raleway', sans-serif; }
.font-dosis {font-family: 'Dosis', sans-serif;}
.font-maven-pro { font-family: 'Maven Pro', sans-serif; }
.font-inter { font-family: 'Inter', sans-serif; }
.font-playfair { font-family: 'Playfair Display', serif; }
.font-catamaran { font-family: 'Catamaran', serif; }
.font-source-sans-3 { font-family: 'Source Sans 3', sans-serif; }
.noto-serif { font-family: 'Noto Serif', serif; }

/*-------------------------
-------------------------*/

.overlay { position:absolute; bottom:0; top:0; width:100%; height:100%; z-index:1; 
background: rgb(0,54,55);
background: linear-gradient(90deg, rgba(0,0,0,.7) 0%, rgba(0,0,0,.3) 70%);  
opacity: 1; }

.opacity-10 { opacity:.1; }
.opacity-20 { opacity:.2; }
.opacity-30 { opacity:.3; }
.opacity-40 { opacity:.4; }
.opacity-50 { opacity:.5; }
.opacity-60 { opacity:.6; }
.opacity-80 { opacity:.8; }
.opacity-90 { opacity:.9; }

.gutter-grid-var { margin-right:-8px; margin-left:-8px;}
.gutter-grid-var > .col, 
.gutter-grid-var > [class*="col-"] { padding-right:8px; padding-left:8px; }

.line-height-1 { line-height:1; } 
.line-height-1.small { line-height:1.1; }
.line-height-n { line-height: normal; }
.line-height-2 { line-height: 1.5; }
.full-height { height:100%; }

/*------------------------------*/


nav { position:relative; z-index:2000; }
nav .container { position:relative; z-index:2000; }

.section-header { position:relative; overflow: hidden; }
.section-header .container { position:relative; z-index: 2; }

.striscia { height:58px; width:100%; position:absolute; z-index:500; background-size:100% auto; background-attachment:scroll; background-repeat:no-repeat; }
.striscia.sopra { top:-58px; left:0; background:url('img/striscia-sopra.svg') no-repeat; background-color:; background-position:0 bottom;}
.striscia.sotto { bottom:-58px; right:0; background:url('img/striscia-sotto.svg') no-repeat; background-color:; background-position:top right; }
.main-cover { background:url('img/iStock-1341607980.webp') no-repeat center center / cover; }

/*------------------------------*/
@keyframes flickerAnimation {
  0%   { opacity:1; }
  50%  { opacity:0; }
  100% { opacity:1; }
}
@-o-keyframes flickerAnimation{
  0%   { opacity:1; }
  50%  { opacity:0; }
  100% { opacity:1; }
}
@-moz-keyframes flickerAnimation{
  0%   { opacity:1; }
  50%  { opacity:0; }
  100% { opacity:1; }
}
@-webkit-keyframes flickerAnimation{
  0%   { opacity:1; }
  50%  { opacity:0; }
  100% { opacity:1; }
}
.animate-flicker {
   -webkit-animation: flickerAnimation 7s infinite;
   -moz-animation: flickerAnimation 7s infinite;
   -o-animation: flickerAnimation 7s infinite;
    animation: flickerAnimation 7s infinite;
}

/*------------------------------
RUOTA
------------------------------*/	
@keyframes rotating {
	from
		{
		transform: rotate(0deg);
		-o-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		}
	to
		{
		transform: rotate(360deg);
		-o-transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		-moz-transform: rotate(360deg);
		-webkit-transform: rotate(360deg);
		}
}
@-webkit-keyframes rotating {
	from
		{
		transform: rotate(0deg);
		-webkit-transform: rotate(0deg);
		}
	to
		{
		transform: rotate(360deg);
		-webkit-transform: rotate(360deg);
		}
}
.ruota {
	-webkit-animation: rotating 22s linear infinite;
	-moz-animation: rotating 22s linear infinite;
	-ms-animation: rotating 22s linear infinite;
	-o-animation: rotating 22s linear infinite;
	animation: rotating 22s linear infinite;
}


/*------------------------------
------------------------------*/

.su-giu { animation: sugiu 1s infinite linear; }


@keyframes sugiu {
0%  { transform:translate(0px, 0px); }
25%  { transform:translate(0px, -4px); }
50%  { transform:translate(0px, 0px); }
75%  { transform:translate(0px, 4px); }
}



/*----------------------------*/
.bubble { border:3px solid #ddd; padding:30px 20px; color:; margin:0 auto; background:#fff; border-radius: 15px; position: relative; z-index:400; line-height:1.3; max-width:460px;  }
.bubble:before {
    border-color: #ddd rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
    border-style: solid;
    border-width: 30px 40px 0;
    bottom: -30px;
    content: "";
    display: table;
    height: 0;
    left: 50%;
    margin-left: -40px;
    position: absolute;
    width: 0;
}
.bubble:after {
    border-color: #fff rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
    border-style: solid;
    border-width: 26px 34px 0;
    bottom: -26px;
    content: "";
    display: table;
    height: 0;
    left: 50%;
    margin-left: -34px;
    position: absolute;
    width: 0;
}
/*----------------------------*/
footer { background:; } 
footer p.copyright {  }


/*----------------------------
Form
----------------------------*/

.form-control {
background:#fff;
border: none;
border-radius: 0;
box-shadow: none;
color: #333;
font-size: 18px;
height:auto;
padding:14px;
font-weight:normal;
line-height:normal;
}
.form-control::-moz-placeholder { opacity:1; color: #999; }
.form-control::placeholder { opacity:1; color:#999; }
select option { opacity:1; color:#333; }


label.checkbox-terms { margin:0; line-height:1; }
.checkbox-terms input { margin:5px 0 0; }

select { 
appearance:none;
-moz-appearance:none;
-webkit-appearance: none;
background:none; border:none; width:100%;
color:#999;
padding: 14px 10px;
}
select option { color:#666; }

.form-group-privacy { }
.form-group-privacy a { color:#fff; text-decoration: underline; }
.form-group-privacy label.radio-inline { font-size:14px; margin:0 0 6px 0; }


.form-control.custom-select-grip { padding:0; }
.custom-select-grip { position:relative; }
.custom-select-grip:after { position:absolute; right:15px; top:3px; content:""; display:block; 
right:14px; top:50%; margin-top:-8px; width: 10px; height: 18px; background: url(img/select-grip.svg) no-repeat center center / 100% auto; z-index:; opacity:.4; }


.btn-custom, button.btn-custom { font-size:16px; border:2px solid transparent; letter-spacing:0; padding:1rem; 
border-radius:50px; line-height:1; display:block; text-decoration:none; text-align:center; text-decoration:none; }
.btn-custom:hover, button.btn-custom:hover { background:none; color:#fff; text-decoration:none; border: 2px solid #fff; }




.btn-custom.btn-custom-2:hover, button.btn-custom.btn-custom-2:hover { background:#ffcb2c; color:#333; border: 2px solid transparent; }
    
    
    
    
.btn-custom.btn-outline, button.btn-custom.btn-outline { border: 2px solid; background:none; }   
.btn-custom.btn-outline:hover, button.btn-custom.btn-outline:hover { background:#ff6333; color: #fff; border: 2px solid transparent;  }  
    


/*----------------------------*/
.custom-list { position:relative; margin:0 0 0 40px; padding:0 0 0 0; list-style-type: none; }
.custom-list li { margin:0 0 12px 0; line-height:normal; position:relative; }
.custom-list li:last-child  { margin-bottom:0; }
.custom-list i { font-size: 25px; left:-40px; position:absolute; top:2px; }
/*----------------------------*/



section.vantggi span.material-symbols-rounded { font-size: 60px; font-weight:300; }


/*----------------------------*/
.shake { animation:shake 1s infinite; display: inline-block; }
@-webkit-keyframes shake {
0% { transform: translateY(-.1rem); }
50% { transform: translateY(.3rem); } 
100% { transform: translateY(-.1rem); } 
}
@keyframes shake { 
0% { transform: translateY(-.1rem); }
50% { transform: translateY(.3rem); } 
100% { transform: translateY(-.1rem); }
}



/*----------------------------
----------------------------*/
.bottom-call-to-action { }
a.bottom-bnt {
    border: 3px solid #fff;
    border-radius: 4px;
    display: block;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -0.03em;
    margin:0px auto 0;
    width:100%;
    padding: 14px 0;
    text-align: center;
    text-transform: uppercase;
	color:#fff;
}

a.bottom-bnt:hover { text-decoration:none; background:#fff;  border:3px solid transparent; color:#EC008C; }


/*----------------------------
mobile sopra i....
----------------------------*/

@media(min-width:1920px) { 
}
@media(min-width:1440px) { 
.h-lg-100 { height: 100%; }
}
@media(min-width:990px) {
}



/*----------------------------
mobile sotto i...
----------------------------*/
@media(max-width:1600px) { }
@media(max-width:1440px) { 
}
@media(max-width:1280px) { }

@media(max-width:1200px) {
.text-20 { font-size:18px; }
.text-25 { font-size:20px; }
.text-30 { font-size:25px; }
.text-35 { font-size:28px; }
.text-40 { font-size:30px; }
.text-45 { font-size:35px; }
.text-50 { font-size:40px; }
.text-60 { font-size:50px; }
}


@media(max-width:1198px) {
.brand { width: 220px; }
}

@media(max-width:1080px) { 
}

@media(max-width:990px) {
}
@media(max-width:767px) {
p.copyright {  margin: 15px 0 0;}
body { font-size:16px; }

}

@media(max-width:480px) {
.text-18 { font-size:16px; }
.text-20 { font-size:15px; }
.text-25 { font-size:18px; }
.text-30 { font-size:20px; }
.text-35 { font-size:25px; }
.text-40 { font-size:30px; }
.text-45 { font-size:32px; }
.text-50 { font-size:35px; }
.text-60 { font-size:40px; }


}
	
	
	