/*TEDxAncona 2026 - edit: Visione.Digitale*/

/*font*/
@font-face{
  font-family:"Garnett";
  src:url("/2026/assets/fonts/Garnett-Light.woff2") format("woff2");
  font-weight:300; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Garnett";
  src:url("/2026/assets/fonts/Garnett-Light-Italic.woff2") format("woff2");
  font-weight:300; font-style:italic; font-display:swap;
}
@font-face{
  font-family:"Garnett";
  src:url("/2026/assets/fonts/Garnett-Regular.woff2") format("woff2");
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:"Garnett";
  src:url("/2026/assets/fonts/Garnett-Medium.woff2") format("woff2");
  font-weight:500; font-style:normal; font-display:swap;
}

/*variabili*/
:root {
    --bianco: #FFF;
    --nero: #000;
    --blu: #0038a9;
    --red: #f1030a;
    --ted: #e20613;
    --roboto:"Garnett", serif;
    --transition-3:all 0.3s ease-in-out;
    --transition-5:all 0.5s ease-in-out;
}

/*scrolling*/
@media screen and (min-width:1280px) {
    body::-webkit-scrollbar {width:10px;}
    body::-webkit-scrollbar-track {background: var(--bianco);}
    body::-webkit-scrollbar-thumb {background-color:var(--ted);}
    body::after {content: "";position: fixed;top: 0;right: 0;bottom: 0;background: var(--bianco);width: 1px;z-index: 9999;}
}

/*default*/
html, button, input, select, textarea {color:var(--nero);overflow-x:hidden;}
html, body {margin:0px;padding:0px;background:var(--bianco);}
/*::-moz-selection {background:var(--nero);text-shadow:none;color:var(--bianco);}
::selection {background:var(--nero);text-shadow:none;color:var(--bianco);}*/
hr {display: block;height: 1px;border: 0;}
img {margin:0px;padding:0px;border:0px;outline:none;vertical-align: middle;border-radius:0px;}
a {text-decoration:none;outline:none;border:none;}
fieldset {border:0;margin:0;padding:0;}
textarea {resize: vertical;}
.chromeframe { margin: 0.2em 0;background:#ccc;color:var(--nero);padding:0.2em 0;}

/*default link*/
a, a:link, a:visited, a:active, a:hover {transition:var(--transition-3);}
.no-underline {text-decoration:none !important;}

/*animation*/
.animation, .animation > * {transition:var(--transition-5);}

/*typographic*/
body {font-family: var(--roboto);}
html, body {font-family: var(--roboto);font-weight:400;font-style:normal;color:var(--nero);font-optical-sizing: auto;}
strong {font-weight:600;}
.text-indent {text-indent:-9999px !important;}
.text-pre {white-space:pre;}

/*font*/
.roboto {font-family: var(--roboto);}

/*font dimension*/
html {font-size: 100%;}
body, input {font-family: var(--roboto);font-size: 1rem;line-height: 1.5;}
@media (max-width: 600px) {body, input {font-size:14px;line-height:1.4;}}
@media (min-width: 1200px) {body, input {font-size: 18px;line-height:1.6;}}
small, .small {font-size: .875em ! important;}
.fs-7 {font-size:1.1rem !important;}
.small-10 {font-size:10% !important;}
.small-20 {font-size:20% !important;}
.small-30 {font-size:30% !important;}
.small-40 {font-size:40% !important;}
.small-50 {font-size:50% !important;}
.small-60 {font-size:60% !important;}
.small-70 {font-size:70% !important;}
.small-80 {font-size:80% !important;}
.small-90 {font-size:90% !important;}

/*lineheight*/
.lh-1   {line-height:1rem !important;}
.lh-1-5 {line-height:1.5rem !important;}
.lh-2   {line-height:2rem !important;}
.lh-2-5 {line-height:2.5rem !important;}
.lh-3   {line-height:3rem !important;}
.lh-3-5 {line-height:3.rem !important;}
.lh-4   {line-height:4rem !important;}

/*font-weight*/
.fw-thin       {font-weight:100 !important;}
.fw-light      {font-weight:300 !important;}
.fw-regular    {font-weight:400 !important;}
.fw-medium     {font-weight:500 !important;}
.fw-semibold   {font-weight:600 !important;}
.fw-bold       {font-weight:700 !important;}
.fw-extrabold  {font-weight:800 !important;}
.fw-black      {font-weight:900 !important;}

/*text color*/
.text-bianco {color:var(--bianco) !important;} 
.text-nero   {color:var(--nero) !important;}
.text-blu    {color:var(--blu) !important;}
.text-red    {color:var(--red) !important;}
.text-ted    {color:var(--ted) !important;}

/*background*/
.bg-bianco {background-color:var(--bianco) !important;} 
.bg-nero   {background-color:var(--nero) !important;}
.bg-blu    {background-color:var(--blu) !important;}
.bg-red    {background-color:var(--red) !important;}
.bg-ted    {background-color:var(--ted) !important;}

/*border color*/
.border-bianco {border-color:var(--bianco) !important;} 
.border-nero   {border-color:var(--nero) !important;}
.border-blu    {border-color:var(--blu) !important;}
.border-red    {border-color:var(--red) !important;}
.border-ted    {border-color:var(--ted) !important;}

/*fill*/
.fill-bianco {fill:var(--bianco) !important;} 
.fill-nero   {fill:var(--nero) !important;}
.fill-blu    {fill:var(--blu) !important;}
.fill-red    {fill:var(--red) !important;}
.fill-ted    {fill:var(--ted) !important;}

/*background cover*/
.bg-cover {background-position:center !important;background-repeat: no-repeat !important;background-size: cover !important;}

/*opacity*/
.opacity-100 {opacity:1 !important;}
.opacity-95  {opacity:.95 !important;}
.opacity-90  {opacity:.90 !important;}
.opacity-85  {opacity:.85 !important;}
.opacity-80  {opacity:.80 !important;}
.opacity-75  {opacity:.75 !important;}
.opacity-50  {opacity:.50 !important;}
.opacity-25  {opacity:.25 !important;}
.opacity-20  {opacity:.20 !important;}
.opacity-15  {opacity:.15 !important;}
.opacity-10  {opacity:.10 !important;}
.opacity-0   {opacity:0 !important;}

/*border*/
.border-0 {border:none !important;}
.rounded-0  {border-radius:0px !important;}
.rounded-4 {border-radius: .4rem !important;}
.rounded-5 {border-radius: .5rem !important;}

/*z-index*/
.z-index-1 {z-index:1 !important;}
.z-index-2 {z-index:2 !important;}
.z-index-3 {z-index:3 !important;}
.z-index-4 {z-index:4 !important;}
.z-index-5 {z-index:5 !important;}
.z-index-9 {z-index:9 !important;}
.z-index-99 {z-index:99 !important;}
.z-index-999 {z-index:999 !important;}
.z-index-9999 {z-index:9999 !important;}

/*width*/
.wd-20  {width:20px;}
.wd-25  {width:25px;}
.wd-30  {width:30px;}
.wd-40  {width:40px;}
.wd-50  {width:50px;}
.wd-60  {width:60px;}
.wd-70  {width:70px;}
.wd-80  {width:80px;}
.wd-90  {width:90px;}
.wd-100 {width:100px;}
.wd-125 {width:125px;}
.wd-150 {width:150px;}
.wd-200 {width:200px;}
.wd-250 {width:250px;}

/*perecentual width*/
.wd-50p {width:50%;}
.wd-60p {width:60%;}
.wd-70p {width:70%;}
.wd-75p {width:75%;}

/*height*/
.hg-0 {height:0px !important;}
.mn-height-50  {min-height:50vh;}
.mn-height-75  {min-height:75vh;}
.mn-height-100 {min-height:100vh;}

/*margin*/
.m-05  {margin:.25rem !important;}
.mx-05 {margin-left:.25rem !important;margin-right:.25rem !important;}
.my-05 {margin-top:.25rem !important;margin-bottom:.25rem !important;}
.mt-05 {margin-top:.25rem !important;}
.mb-05 {margin-bottom:.25rem !important;}
.ms-05 {margin-left:.25rem !important;}
.me-05 {margin-right:.25rem !important;}

/*padding*/
.p-05  {padding:.25rem !important;}
.px-05 {padding-left:.25rem !important;padding-right:.25rem !important;}
.py-05 {padding-top:.25rem !important;padding-bottom:.25rem !important;}
.pt-05 {padding-top:.25rem !important;}
.pb-05 {padding-bottom:.25rem !important;}
.ps-05 {padding-left:.25rem !important;}
.pe-05 {padding-right:.25rem !important;}

/*effect*/
.blur-25  {filter: blur(.25rem);}
.blur-05  {filter: blur(.5rem);}
.blur-1   {filter: blur(1rem);}
.blur-1-5 {filter: blur(1.5rem);}
.blur-2   {filter: blur(2rem);}

/*scale*/
.scale-1   {transform: scale(1);}
.scale-1-5 {transform: scale(1.5);}
.scale-2   {transform: scale(2);}
.scale-2-5 {transform: scale(2.5);}
.scale-3   {transform: scale(3);}

/*link*/
a.link-underline {border-bottom: 1px solid currentColor;}

/*button*/
.btn.btn-outline-primary {color:var(--ted);border-color:var(--ted);background-color:transparent;}
.btn.btn-outline-primary:hover {color:var(--bianco);background-color:var(--ted);}
.btn.btn-outline-white-blu {color:var(--bianco);border-color:var(--bianco);background-color:transparent;}
.btn.btn-outline-white-blu:hover {color:var(--blu);background-color:var(--bianco);}

/*template*/
.container-fluid {max-width:1460px !important;}

/*logo*/
#head-logo, #head-logo .svg-container {width:260px;height:50px;margin:0px;}
#head-logo .svg-container svg {fill:var(--nero);transition:all 0.3s ease-in-out;position:absolute;top:0;left:0;width:260px;height:50px;}
#head-logo .svg-container svg .red {fill:var(--ted);}
@media screen and (max-width:680px) {
    #head-logo, #head-logo .svg-container, #head-logo .svg-container svg {width:240px;height:40px;}
}

/*menu-main*/
#menu-main ul li a {color:var(--nero);}
#menu-main ul li a:hover {color:var(--ted);}
#menu-main ul li a.active, #menu-main ul li a.active:hover {color:var(--ted);cursor: default;}
#menu-main .navbar-nav .nav-link {padding-left: 0rem !important;padding-right: 0rem !important;}

/*mobile*/
#btn-mobile, #btn-mobile > * {transition:all 0.5s ease-in-out;}
#btn-mobile {display:block;width:40px;height:40px;border:1px solid var(--ted);background: var(--bianco);position:relative;cursor:pointer;}
#btn-mobile:hover {background: var(--ted);}
#btn-mobile span {display:block;width:auto;height:2px;background: var(--ted);position:absolute;left:5px;right:5px;transform: scale(.7);}
#btn-mobile:hover span {background: var(--bianco);}
#btn-mobile span:nth-child(1) {top:14px}
#btn-mobile span:nth-child(2) {top:19px;}
#btn-mobile span:nth-child(3) {top:24px;}
#btn-mobile span:nth-child(4) {opacity:0;}
#btn-mobile span:nth-child(5) {opacity:0;}
#btn-mobile.active {background: var(--ted);}
#btn-mobile.active span {background: var(--bianco);}
#btn-mobile.active span:nth-child(1) {opacity:0;}
#btn-mobile.active span:nth-child(2) {opacity:0;}
#btn-mobile.active span:nth-child(3) {opacity:0;}
#btn-mobile.active span:nth-child(4) {opacity:1;}
#btn-mobile.active span:nth-child(5) {opacity:1;}
#btn-mobile span:nth-child(4) {transform: rotate(45deg);top:18px;}
#btn-mobile span:nth-child(5) {transform: rotate(-45deg);top:18px;}

/*mobile menu*/
#menu-modal .container {position:relative;height:100%;}
#mobile-menu-wrapper nav {display:block !important;width:100%;margin:0px;padding:0px;}
#mobile-menu-wrapper .navbar-expand .navbar-nav {flex-direction: column;}
#mobile-menu-wrapper nav ul li {display:block !important;margin:0px !important;padding:0.35rem 0px !important;border-top:1px solid #eee;}
#mobile-menu-wrapper nav ul li:first-child, #mobile-menu-wrapper nav ul li:first-of-type {border:none;}
#mobile-menu-wrapper nav ul li a {font-size:1.6rem;font-weight:300 !important;}
#menu-main .navbar-nav a {line-height:40px;}
#menu-main .navbar-nav a.btn {height:40px;line-height:40px;}

/*intro*/
.banner-wrapper {width:100%;height:auto;overflow: hidden;}
#track {
    stroke:white; 
    stroke-width:200;
    stroke-dasharray: 1;
    stroke-dashoffset: 1;
    stroke-linecap:square;
    stroke-linejoin:bevel;
    animation: evidenziatore 4s ease-in-out infinite;
}
@keyframes evidenziatore {
    0% {stroke-dashoffset: 1;}
    20% {stroke-dashoffset: 0.5;}
    60% {stroke-dashoffset: 0;}
    100% {stroke-dashoffset: -1;}
}

/*card*/
.card.card-partners .card-body {position:absolute;left:0px;right:0px;bottom:-100px;opacity:0;}
.card.card-partners:hover .card-body {position:absolute;left:0px;right:0px;bottom:0px;opacity:1;}
@media screen and (max-width:680px) {
    .card.card-partners .card-body, .card.card-partners:hover .card-body {position:absolute;left:0px;right:0px;bottom:0px;opacity:1;}
}
.card.card-speakers h5 {text-shadow: 0px 0px 10px #000000;} 
.card.card-speakers p  {text-shadow: 0px 0px 10px #000000;}

/*modal*/
.modal-backdrop.fade.show {display:none !important;opacity:0 !important;}

/*carousel*/
.tns-controls button {opacity:1;transform: scale(.75);background:var(--ted);}
.tns-controls button:hover {background:var(--bianco);}
.tns-controls button:hover .bi {color:var(--nero);}
.tns-nav button::before {background:var(--bianco);}
.tns-nav button.tns-nav-active::before, .tns-nav button.tns-nav-active:hover::before {background:var(--bianco);}
.tns-controls button[data-controls="prev"], .carousel:hover .tns-controls button[data-controls="prev"] {left:10px;}
.tns-controls button[data-controls="next"], .carousel:hover .tns-controls button[data-controls="next"] {right:10px;}

/*accordion*/
.accordion .accordion-button::after {color:var(--red);top:0px !important;margin-top:0px !important;font-size:1.25rem !important;}

/**/
#ticket-bar {height:90px;overflow:hidden;}

/*card speakers*/
.word-portrait {position:relative;margin:0;overflow:hidden;background:#000}
.word-portrait img {display:block;width:100%;height:auto;opacity:0}

/*banner loading*/
.word-bg .content{opacity:0;transition:opacity 1s ease}
.word-bg:not(.is-ready) .content{pointer-events:none}
.word-bg.is-ready .content{opacity:1}
.word-bg.is-ready .content.top{transition-delay:.3s}
.word-bg.is-ready .content.text{transition-delay:.7s}
.word-bg.is-ready .content.bottom{transition-delay:1.1s}

/*banner text*/
.word-bg {position:relative;min-height:800px;height:calc(100vh - 210px);display:flex;align-items:center;justify-content:center;overflow:hidden;background:#000;flex-direction: column;}
.word-bg canvas {position:absolute;inset:0;width:100%;height:100%;display:block}
.word-bg .content {width:65%;max-width:990px;position:relative;z-index:1;padding:0 20px !important;pointer-events:none;z-index:2;margin-left:auto !important;margin-right:auto !important;}
.word-bg .content.top    {margin-top:5rem;}
.word-bg .content.bottom {margin-bottom:5rem;}
.word-bg .content h1 {font-size:5rem;line-height:4.5rem;text-shadow:0 0 24px #000,0 0 48px #000}
.word-bg .content h4 {text-shadow:0 0 24px #000,0 0 48px #000}
.word-bg::after{
  content:"";
  position:absolute; inset:0;
  pointer-events:none;
  box-shadow:inset 0 0 200px 200px rgba(0,0,0,0.35);
}

@media screen and (max-width:1380px) {
  .word-bg .content {max-width:1100px;}
  .word-bg .content h1 {font-size:4.5rem;line-height:4rem;}
}
@media screen and (max-width:1200px) {
  .word-bg .content {width:85%;max-width:inherit;}
}
@media screen and (max-width:990px) {
  .word-bg .content {width:100%;max-width:inherit;padding:0 40px !important;}
  .word-bg .content h1 {font-size:3rem;line-height:3.5rem;}
  .word-bg .content h1.text-start, .word-bg .content h1.text-end {text-align:center !important;}
  #header-wrapper {height:65px !important;}
  #main-wrapper.pt-10 {padding-top:65px !important;}
}

@media screen and (max-width:760px) {
  #header-wrapper {height:90px !important;position: fixed !important;
  
        transform: translateY(0) !important;
    opacity: 1 !important;
  
  }
  #main-wrapper.pt-10 {padding-top:90px !important;}
  #ticket-bar {height:auto !important;}

  #btn-mobile {background:var(--ted) !important;}
  #btn-mobile span {background:var(--bianco) !important;}
}