﻿:root {
  --offwhite: #f5f8fc;
  --ink: #14305c;
  --line-light: rgba(20, 48, 92, 0.12);
  --radius-xl: 28px;
  --shadow-card: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  --font-body: 'Open Sans', sans-serif;
}

@font-face {
    font-family: Fontjek;
    src: url(../assets/fonts/Fontjek.otf);
}
@font-face {
    font-family: tahu;
    src: url(../assets/fonts/Tahu.ttf);
}
@font-face {
    font-family: source-pro;
    src: url(../assets/fonts/SourceSansPro-Regular.ttf);
}
@font-face {
    font-family: amithen_extraregular;
    src: url(../assets/fonts/amithen_extra-webfont.eot);
    src: url(../assets/fonts/amithen_extra-webfont.eot?#iefix) format("embedded-opentype"), 
        url(../assets/fonts/amithen_extra-webfont.woff2) format("woff2"), 
        url(../assets/fonts/amithen_extra-webfont.woff) format("woff"), 
        url(../assets/fonts/amithen_extra-webfont.svg#amithen_extraregular) format("svg");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: amithenregular;
    src: url(../assets/fonts/amithen-webfont.eot);
    src: url(../assets/fonts/amithen-webfont.eot?#iefix) format("embedded-opentype"), 
        url(../assets/fonts/amithen-webfont.woff2) format("woff2"), 
        url(../assets/fonts/amithen-webfont.woff) format("woff"), 
        url(../assets/fonts/amithen-webfont.svg#amithenregular) format("svg");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: Montserrat Regular;
    src: url(../assets/fonts/Montserrat-Regular.woff2) format("woff2"), 
        url(../assets/fonts/Montserrat-Regular.woff) format("woff");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Montserrat Black;
    src: url(../assets/fonts/Montserrat-Black.woff2) format("woff2"), 
        url(../assets/fonts/Montserrat-Black.woff) format("woff");
    font-weight: 900;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Montserrat Bold;
    src: url(../assets/fonts/Montserrat-Bold.woff2) format("woff2"), 
        url(../assets/fonts/Montserrat-Bold.woff) format("woff");
    font-weight: 700;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Montserrat SemiBold;
    src: url(../assets/fonts/Montserrat-SemiBold.woff2) format("woff2"), 
        url(../assets/fonts/Montserrat-SemiBold.woff) format("woff");
    font-weight: 600;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Montserrat Medium;
    src: url(../assets/fonts/Montserrat-Medium.woff2) format("woff2"), 
        url(../assets/fonts/Montserrat-Medium.woff) format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: Montserrat Italic;
    src: url(../assets/fonts/Montserrat-Italic.woff2) format("woff2"), 
        url(../assets/fonts/Montserrat-Italic.woff) format("woff");
    font-weight: 400;
    font-style: italic;
    font-display: swap
}


img{pointer-events:none;}
.navbar-toggler{margin-right:20px;font-size:0.8rem;border:1px solid #e4e4e4; background-color:transparent;}
.navbar-toggler:not(:hover) {
        background-color: transparent;
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    }
.navbar-toggler:hover {
        background-color: #e4e4e4;
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    }
.navbar .navbar-toggler-icon {
    background-image: url(images/burguer.png);
    background-size:contain;
    background-position:center center;
    background-repeat:no-repeat;
}
.nav-item{white-space:nowrap;}
.nav-item:hover{
    background-color: #f5f5f5;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
.nav-item:not(:hover){
    background-color: transparent;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}
/*.flag-icon{font-size:0.8rem;}*/
.flag-icon img{width:20px; margin-right:5px;}


.modal-net {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    display: block;
    overflow: hidden;
    background-color: rgba(255,255,255,0.7);
    outline: 0;
}
.modal-dialog-net{
    width:100%;
    max-width:200px;
    margin:auto;
}
.modal-dialog-net-centered {
    display: flex;
    align-items: center;
    min-height: 100%;
}
.modal-content-net {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width:100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    -webkit-transition:background 0.5s;
    -moz-transition:background 0.5s;
    -o-transition:background 0.5s;
    transition:background 0.5s;
    border-radius: .3rem;
    outline: 0;
}
.modal-content,.modal-content-net  {
    /* Bootstrap sets the size of the modal in the modal-dialog class, we need to inherit it */
    width:inherit;
    max-width:inherit; /* For Bootstrap 4 - to avoid the modal window stretching full width */
    /*min-width:400px;*/
    height:inherit;
    /* To center horizontally */
    margin: 0 auto;
    pointer-events: all;
}
.modal-header-net {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1rem;
    border-bottom: 1px solid #e9ecef;
    border-top-left-radius: .3rem;
    border-top-right-radius: .3rem;
}

.modal-footer-net {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding: 1rem;
    border-top: 1px solid #e9ecef;
}
/*.form-row label{font-size:0.75rem;}
.form-row input{font-size:0.85rem;}
.form-row input[type=radio] {
    position: absolute;
    margin-top: .3rem;
    margin-left: -1.25rem;
}*/

/*.radio-custom input[type="radio"]:checked {
    background-color: #e11d48;
    padding: 4px;
    border: 2px solid #000;
}

.radio-gap input:not(:first-child) {
    margin-left: 15px !important;
}

.radio-gap input[type="radio"] {
    appearance: none;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background-clip: content-box;
    border: 2px solid #1a3365;
    margin-right: 5px;
}
*/

.checkInline input{margin-right:3px; margin-left:10px;}

footer{font-size:10px; color:#555555;}



.campoErro{
    background-color:#fff4e0;
    -webkit-transition:background 0.5s;
    -moz-transition:background 0.5s;
    -o-transition:background 0.5s;
    transition:background 0.5s;
}
.campoObrigatorio{}
.campoNaoObrigatorio {}
.numeros {}
.data{}
.cpf{}
.email{}
.usaTooltip{}
.text-yellow{color:#ffd599;}
a.text-yellow:hover,a.text-yellow:active{color:#ff9c00;}
.jumbotron{
    /*background-image:url(images/bg-VenhaNosConhecer.jpg);*/
    background-repeat:no-repeat;
    background-position:center center;
    background-size:cover;
}
.formularioVNC{
    margin-top:-100px;
    background-color:#FFFFFF;
    padding:20px;
}
.alertaValidacao{font-size:0.85rem;}
.alertaValidacao h4{font-size:1.2rem; margin-top:10px;}
.alertaValidacao label{display:block;}
.alertaValidacao div{font-style:italic}
.alertaValidacao div label{display:inline; font-style:normal;}
.alertaValidacao .campoErro{margin-top:10px;}

.ui-datepicker{z-index:99 !important;}

.confirmacaoDados{float:left; margin-right:10px; padding:5px;}
.cleared{clear:both;}
.quadro{clear:both;}
.grupoCampos{clear:both;}
.noBreak{page-break-inside:avoid;}

.home h3{font-family:"tahu"; font-size:5rem; webkit-transform: rotate(-5deg);-ms-transform: rotate(-5deg);transform: rotate(-5deg);color:#003c74; text-align:center;margin-bottom:0;margin-top:-6rem;}
        .home p{font-size:1.1rem;}
        .home .nameText{font-weight:bold;float:right; text-align:right;display:block; width:50%; margin-right:25%; border-right:2px solid #b6282d; padding-right:1rem; color:#003c74}
        .home .frase{font-size:1rem;clear:both; padding-bottom:20px;display:block; width:50%; margin-left:25%; color:#003c74}
        
        .bgAzulPorto{background-color:#003C74; color:#ffffff;}
        .bgAzulPorto p{font-size:1rem;}
        .bgAzulPorto a:link,.bgAzulPorto a:visited{color:#ffffff; text-decoration:none;}
        .bgAzulPorto a:hover,.bgAzulPorto a:active{color:#ffffff; text-decoration:underline;}
        
.home .qualidades-portinho {
  font-size: 1.4rem;
  text-align: center;
  margin-bottom:1rem;
}

.home .seta-div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-animation-name: arrowAnimation;
          animation-name: arrowAnimation;
  -webkit-animation-duration: 1500ms;
          animation-duration: 1500ms;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  position: relative;
  top: -5px;
}

.home .seta {
  width: 35px;
  -webkit-animation-name: arrowAnimation;
          animation-name: arrowAnimation;
  -webkit-animation-duration: 1500ms;
          animation-duration: 1500ms;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  top: -5px;
  fill: var(--main-color);
  text-align: center;
}

.home .paragrafoMenor p{font-size:1.1rem;}

/*overrides*/
.formEstiloAlternado .form-control[type=text]{
    border-top:none;border-left:none; border-right:none; border-radius:unset;
}
.formEstiloAlternado .form-control[type=select]{
}
.formEstiloAlternado .form-control:focus{
     box-shadow:none;
}
.formEstiloAlternado label{
    margin-top:1rem; margin-bottom:0 !important; color:#003C74;
}
.text-primary{color:#174680 !important;}
.btn-primary{
    background-color:#174680 !important;
    border-color:#174680;
}
.btn-primary:hover{
    background-color:#204fa0 !important;
    border-color:#204fa0;
}
.btn-danger{
    background-color:#b6282d;
    border-color:#b6282d;
}



/*progressbar*/
#progressbar {
    margin-bottom: 30px;
    padding:0;
    overflow: hidden;
    /*CSS counters to number the steps*/
    counter-reset: step;
}

#progressbar li {
    list-style-type: none;
    color: #000000;
    text-transform: uppercase;
    font-size: 9px;
    width: 20% !important;
    float: left;
    position: relative;
    letter-spacing: 1px;
}

#progressbar li:before {
    padding-top: 2px;
    content: counter(step);
    counter-increment: step;
    width: 30px;
    height: 30px;
    line-height: 26px;
    display: block;
    font-size: 14px;
    color: #333;
    /* background: white; */
    border: 1px solid black;
    border-radius: 50%;
    margin: 0 auto 10px auto;
}

/*progressbar connectors*/
#progressbar li:after {
    content: '';
    width: 100%;
    height: 2px;
    background: white;
    position: absolute;
    left: -50%;
    top: 13px;
    z-index: -1; /*put it behind the numbers*/
}

#progressbar li:first-child:after {
    /*connector not needed before the first step*/
    content: none;
}

/*marking active/completed steps green*/
/*The number of the step and the connector before it = green*/
#progressbar li.active:before, #progressbar li.active:after {
    background: #003C74;
    color: white;
}

.red-line-top-right{
    background-image: url(/assets/images/red-line-right-top.gif); 
    background-position:right top; 
    background-repeat:no-repeat;
    padding-top:1px;
}

.hidden {
    display: none !important;
}
.jumboText {
    background-color: #003c74;
    color:#fff;
    padding:1.5rem 0;
    font-family:Fontjek;
    font-size:50px
}
.fontJek {
    font-family: Fontjek; font-size:50px;
}
.blueForm {
    color: #003c74
}
.bg-azul {
    background-color: #133f73;
    color: #ffffff;
}
.btn-round {
    border-radius: 20px;
}
@media screen {
    .noPrint{}
    .print{display:none;}
}
@media print{
    .noPrint{display:none;}
    .print{}
    
}

.m-rbt {
    position: absolute;
    z-index: -900;
    top: -10000px;
    left: -10000px;
}

.tituloColunaSecaoForm {
    color: #143e72;
    font-family: Montserrat SemiBold;
    margin-bottom: 14px;
    font-size: 1.875rem;
}
.footer-title {
    text-align: center;
    color: #5b5b5f;
    font-family: Montserrat SemiBold;
    margin-bottom: 40px;
}
.footer-partners {
    padding: 40px 0 70px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.footer-sign {
    margin-top: 90px;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 80px;
    padding: 16px 0;
    /*color: #fff;
    background: #143e72;*/
    display: flex;
}
.footer{}

.btn-primary {
    background-color: #003c74;
    border-color: #003c74;
}

.alertaValidacao{font-size:0.85rem;}
.alertaValidacao h4{font-size:1.2rem; margin-top:10px;}
.alertaValidacao label{display:block;}
.alertaValidacao div{font-style:italic}
.alertaValidacao div label{display:inline; font-style:normal;}
.alertaValidacao .campoErro{margin-top:10px;}
.campoErro {
    background-color: #fff4e0 !important;
    -webkit-transition: background 0.5s;
    -moz-transition: background 0.5s;
    -o-transition: background 0.5s;
    transition: background 0.5s;
}
.nav-over-blue a:link{color: #fff;
  text-decoration: none;
  display: inline-block;
  padding: 10px;
  background-color: lightslategray;
  border-radius: 10px 10px 0 0;
  margin: 0 1px;
  transition:all 0.2s ease-in-out;
}
.nav-over-blue a.active{color:#555555;background-color:#fff}
.nav-over-blue a:hover{background-color:#003c74}
.nav-over-blue a.active:hover{background-color:#fff}




/*bloco de registro university fair*/
.registration-section {
    padding: 80px 0;
    background: #fff;
}

.registration-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 60px;
    row-gap: 40px;
    align-items: start;
    background: var(--offwhite);
    border-radius: 20px;
    padding: 48px;
    border: 1px solid rgba(20, 48, 92, 0.12);;
    box-shadow: var(--shadow-card);
}


.registration-header {
    grid-column: 1 / -1; 
}

.registration-header .section-title {
    margin-bottom: 12px;
    color: var(--navy-900);
}

.registration-logo-wrapper {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-bottom: 24px;
}

.registration-card-logo {
    height: auto;
    max-height: 90px;
    object-fit: contain;
}


.registration-desc {
    font-size: 1.12rem;
    color: #5c6b85;
    line-height: 1.7;
    margin-bottom: 0;
}

.registration-info {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-bottom: 44px;
}

.info-item {
    display: flex;
    gap: 18px;
    align-items: flex-start;
}

.info-icon {
    width: 52px;
    height: 52px;
    background: rgba(227, 30, 36, 0.08);
    border: 1px solid rgba(227, 30, 36, 0.15);
    color: #e31e24;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    flex-shrink: 0;
}

    .info-icon svg {
        color: #e31e24;
    }
.custom-icon {
    width: 26px;
    height: 26px;
    background-color: #e31e24;
}

.custom-icon {
    display: inline-block;
    flex-shrink: 0;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}

.icon-calendar {
    -webkit-mask-image: url('/assets/images/icone_calendario.svg');
    mask-image: url('/assets/images/icone_calendario.svg');
}

.icon-clock {
    -webkit-mask-image: url('/assets/images/icone_relogio.svg');
    mask-image: url('/assets/images/icone_relogio.svg');
}

.icon-location {
    -webkit-mask-image: url('/assets/images/icone_local.svg');
    mask-image: url('/assets/images/icone_local.svg');
}

.icon-parking {
    -webkit-mask-image: url('/assets/images/icone_estacionamento.svg');
    mask-image: url('/assets/images/icone_estacionamento.svg');
}

.icon-map {
    -webkit-mask-image: url('/assets/images/icone_mapa.svg');
    mask-image: url('/assets/images/icone_mapa.svg');
}

.icon-list {
    -webkit-mask-image: url('/assets/images/icone_lista.svg');
    mask-image: url('/assets/images/icone_lista.svg');
}

.info-text strong {
    display: block;
    font-family: 'Open Sans', sans-serif;;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--navy-800);
    margin-bottom: 4px;
}

.info-text span {
    color: #5c6b85;
    font-size: 1.05rem;
    line-height: 1.5;
    display: block;
}

.btn-link-map {
    display: inline-block;
    margin-top: 8px;
    font-size: 0.85rem;
    font-family: 'Open Sans', sans-serif;;
    font-weight: 700;
    color: var(--navy-600);
    text-decoration: none;
    border-bottom: 1px solid var(--navy-600);
    transition: all 0.2s ease;
}

.btn-link-map:hover {
    color: var(--red-brand);
    border-bottom-color: var(--red-brand);
}

.btn-subscribe {
    background: var(--red-brand);
    color: #fff;
    border: none;
    padding: 18px 36px;
    border-radius: 14px;
    text-decoration: none;
    font-family: 'Open Sans', sans-serif;;
    font-weight: 700;
    font-size: 0.95rem;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    display: inline-flex;
    align-items: center;
    justify-content: center; 
    text-align: center; 
    transition: all 0.25s ease;
    box-shadow: 0 15px 34px rgba(227, 30, 36, 0.25);
}

.btn-subscribe:hover {
    transform: translateY(-3px);
    box-shadow: 0 20px 42px rgba(227, 30, 36, 0.4);
    background: #c9181f;
    color: #fff;
}

.registration-image {
    width: 100%;
    height: 100%;
    border-radius: 20px;
    overflow: hidden;
    display: flex;
}

.campus-photo {
    width: 100%;
    height: 100%;
    min-height: 280px;
    max-height: 380px; 
    object-fit: cover;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(10, 24, 48, 0.1);
}


/* ==========================================================================
   RODAPÉ
   ========================================================================== */
.site-footer {
  background:#174680;/* #0a1830; /*navy*/
  border-bottom: 3px solid #e31e24; /*red-brand*/
  padding: 36px 0 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}

.site-footer .social-links-cta {
    margin-top: 0; 
}

.site-footer p {
    text-align: center;
    color: rgba(255, 255, 255, 0.55);
    font-family: 'Open Sans', sans-serif;
    /*! font-size: 0.8rem; */
    letter-spacing: 0.3px;
    margin: 0;
}

.footer-brand {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-bottom: 15px; 
}

.footer-logo {
    height: 150px; 
    width: auto; 
    display: block;

}

.footer-logo:hover {
    opacity: 1;
    transform: scale(1.03);
}
/* ==========================================================================
   redes sociais DO RODAPÉ
   ========================================================================== */
.social-links-cta {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 18px;
    margin-top: 48px;
    flex-wrap: wrap;
}

.social-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    background-color: #fff;
    color: #0a1830;
    border-radius: 50%;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.social-btn svg {
    width: 24px;
    height: 24px;
    fill: currentColor;
    transition: transform 0.3s ease;
}

.social-btn:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.3);
    color: #e31e24;
}

.social-btn:hover svg {
    transform: scale(1.15);
}

.time-wrapper {
  flex-direction: column;
  align-items: flex-start;
  gap: 5px;
}
/* .time-wrapper { */
  /* display: flex; */
  /* align-items: start; */
  /* gap: 10px; */
  /* flex-wrap: wrap; */
/* } */
.checkin-label {
  color: #e31e24 !important;
  font-size:0.68rem !important;
  padding: 2px 7px;
  letter-spacing: 0.5px;
  opacity: 0.75;
}
.checkin-label {
  display: inline-flex;
  align-items: center;
  background: transparent;
  border: 1px solid currentColor;
  border-radius: 999px;
  padding: 3px 10px;
  font-family: 'Open Sans', sans-serif;;
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  white-space: nowrap;
  opacity: 0.85;
}