@charset "utf-8"; /* CSS Document */ /* ======================================================================================= FONTES === */ /* ================================================================================================== */ /* ================================================================================================== */ /* ================================================================================================== */ /* ================================================================================================== */ /* FONTES PUC 'Rethink Sans' Opções de font-weight: 400 a 800 'Literata' Opções de font-weight: 200 a 900 */ /* ========================================================================== ESTILOS PUC > CORES === */ /* ================================================================================================== */ /* ================================================================================================== */ /* ================================================================================================== */ /* ================================================================================================== */ /* ESQUEMA DE CORES ESPECÍFICOS PARA CADA SITE ATENÇÃO: Elementos em cinza não se apresentam neste css por serem neutros a qualquer site, mas estes podem ser anulados por estilos que começam com o nome do id específico para o site em questão, que será colocado na tag das páginas. */ /* ================================================================= TOPO === */ /* ========================================================================== */ /* ========= link menu pular se for a index ======= */ .index #menu_link_index { visibility:hidden; display:none; } /* ----- TÍTULO DA PÁGINA ----- */ #SUSTENTABILIDADE header h1 { /* color:#666666; */ } /* ----- CAMINHO / BREADCRUMB ----- */ #SUSTENTABILIDADE header nav a:link, #SUSTENTABILIDADE header nav a:visited { /* color:#AAA; */ } #SUSTENTABILIDADE header nav a:hover { /* color:#555; */ } /* ================================================================= MENU === */ /* ========================================================================== */ /* ----- MENU VAZIO (LINHA) ----- */ #SUSTENTABILIDADE header #puc_menu_vazio { /* background:#E5E5E5; */ } /* ----- MENU COMUM A PARTIR DAQUI ----- */ /* ------------------------------------- */ /* ----- FAIXA QUE ATRAVESSA A PÁGINA ----- */ @media (min-width:1140px) { #SUSTENTABILIDADE header #puc_menu_faixa { /* background:#9b9583; */ border-top:1px solid #9b9583; border-bottom:1px solid #9b9583; } /* fecha @media (min-width:1140px) */ } /* ----- LINHAS ACIMA E ABAIXO DA FAIXA ----- */ #SUSTENTABILIDADE header #menu span { background:#9b958300; } /* ----- DESATIVAÇÃO DAS BORDAS GRANDES DOS LINKS NO MENU DESKTOP (ex: CCCI) ----- */ @media (min-width:1140px) { #SUSTENTABILIDADE header #menu { margin:1px 10px 0 10px; } #SUSTENTABILIDADE header #menu span { top:0; margin-top:-1px; } #SUSTENTABILIDADE header #menu a:link, #SUSTENTABILIDADE header #menu a:visited { border-top:0; border-bottom:0; } /* fecha @media (min-width:1140px) */ } /* ----- MENU DESKTOP - LINKS ----- */ @media (min-width:1140px) { /* mouse out */ #SUSTENTABILIDADE header #menu a:link, #SUSTENTABILIDADE header #menu a:visited, #SUSTENTABILIDADE header #menu .puc_menu_submenu_linkmestre { border-bottom:4px solid rgba(106,231,0,0); } /* mouse over */ #SUSTENTABILIDADE header #menu a:hover, #SUSTENTABILIDADE header #menu .puc_menu_submenu_linkmestre:hover, #SUSTENTABILIDADE header #menu .puc_menu_submenu_conjunto:hover .puc_menu_submenu_linkmestre { /* color:#FFF; */ border-bottom:4px solid #4646ff; } /* fecha @media (min-width:1140px) */ } /* ----- MENU MOBILE - LINKS ----- */ @media (max-width:1139px) { /* mouse out */ #SUSTENTABILIDADE header #menu a:link, #SUSTENTABILIDADE header #menu a:visited, #SUSTENTABILIDADE header #menu .puc_menu_submenu_linkmestre { color:#000000; background:#FFFFFF; border-color:#9b9583; } /* mouse over */ #SUSTENTABILIDADE header #menu a:hover, #SUSTENTABILIDADE header #menu .puc_menu_submenu_linkmestre:hover, #SUSTENTABILIDADE header #menu .puc_menu_submenu_conjunto:hover .puc_menu_submenu_linkmestre { color:#000000 !important; background:#FFFFFF !important; /* border-color:#00a800 !important; */ } /* fecha @media (max-width:1139px) */ } /* ----- MENU MOBILE - BOTÃO "MENU" ----- */ #SUSTENTABILIDADE header button { /*color:#FFF; background:#7CA2B5; background-image:url(https://www.puc-rio.br/imagens/puc_menu_abrefecha.png); background-repeat:no-repeat;*/ color:#000; background: #F5F5F0; background-image: url(https://www.puc-rio.br/imagens/puc_icone_sanduiche_preto.svg); background-repeat: no-repeat; background-size: 35px; background-position-x: 20px; background-position-y: center; border-bottom: 1px solid #9b9583; border-top: 1px solid #9b9583; } @media (max-width: 1139px) { body header button::before, .menu_button_mobile::before { margin-right: 50px !important;}} /* ----- SUBMENU DESKTOP ----- */ @media (min-width:1140px) { #SUSTENTABILIDADE header #menu .puc_menu_submenu_links a:link, #SUSTENTABILIDADE header #menu .puc_menu_submenu_links a:visited { background:#043458; color:#97D3FF; } #SUSTENTABILIDADE header #menu .puc_menu_submenu_links a:hover { color:#0092FF; background:#18496E; } /* fecha @media (min-width:1140px) */ } /* ----- SUBMENU MOBILE ----- */ @media (max-width:1139px) { #SUSTENTABILIDADE header #menu .puc_menu_submenu_links a:link, #SUSTENTABILIDADE header #menu .puc_menu_submenu_links a:visited { border-bottom:1px solid #9b9583; background:#F5F5F0; color:#000000; } #SUSTENTABILIDADE header #menu .puc_menu_submenu_links a:hover { background:#00a800; color:#000000; } /* fecha @media (max-width:1139px) */ } /* ================================================================= MEIO === */ /* ========================================================================== */ /* ----- BORDA AO FINAL DO CONTEÚDO ----- */ #SUSTENTABILIDADE section { /* border-bottom-color:#DDDDDD; */ } /* ============================================= MEIO >> COLUNA PRINCIPAL === */ /* ========================================================================== */ /* ----- TÍTULOS ----- */ #SUSTENTABILIDADE h1 { /* color:#666666; */ } #SUSTENTABILIDADE h2 { font-size: 2.6em; font-weight: 400; } #SUSTENTABILIDADE h3 { font-size: 1.9em; font-weight: 400; } #SUSTENTABILIDADE h4 { /* color:#0B5182; */ } #SUSTENTABILIDADE h5 { /* color:#68a9d7; */ } /* ----- TEXTO DESTAQUE EM QUADRO ----- */ #SUSTENTABILIDADE section .puc_texto_destaque_em_quadro_centro, #SUSTENTABILIDADE section .puc_texto_destaque_em_quadro_esquerda, #SUSTENTABILIDADE section .puc_texto_destaque_em_quadro_direita { /* background:#FFFFFF; color:#000000; */ } /* ----- LINKS (GERAL) ----- */ #SUSTENTABILIDADE a:link, #SUSTENTABILIDADE a:visited { /* color:#000000; */ } #SUSTENTABILIDADE a:hover { /* color:#000000; */ } /* ----- LINK VOLTAR ----- */ #SUSTENTABILIDADE section article button.puc_link_voltar_TAG-BUTTON { /* color:#043458; background:#D4DEE9; */ } #SUSTENTABILIDADE section article button.puc_link_voltar_TAG-BUTTON:hover { /* color:#FFF; background:#043458; */ } /* ----- LINK DESTAQUE ----- */ #SUSTENTABILIDADE a.puc_link_destaque_TAG-A:link, #SUSTENTABILIDADE a.puc_link_destaque_TAG-A:visited, #SUSTENTABILIDADE a.puc_link_destaque_centralizado_TAG-A:link, #SUSTENTABILIDADE a.puc_link_destaque_centralizado_TAG-A:visited { background:#000000; color:#f5f5f0; } #SUSTENTABILIDADE a.puc_link_destaque_TAG-A:hover, #SUSTENTABILIDADE a.puc_link_destaque_centralizado_TAG-A:hover { background:#FFFFFF; color:#000000; } /* ----- LINK DE PAGINAÇÃO ----- */ #SUSTENTABILIDADE section article .puc_link_paginacao_anterior_TAG-A:link, #SUSTENTABILIDADE section article .puc_link_paginacao_anterior_TAG-A:visited, #SUSTENTABILIDADE section article .puc_link_paginacao_proximo_TAG-A:link, #SUSTENTABILIDADE section article .puc_link_paginacao_proximo_TAG-A:visited { /* color:#1A73A0; */ } #SUSTENTABILIDADE section article .puc_link_paginacao_anterior_TAG-A:hover, #SUSTENTABILIDADE section article .puc_link_paginacao_proximo_TAG-A:hover { /* color:#09AEFF; */ } /* ----- GALERIA DE IMAGENS ----- */ /* thumbnails */ #SUSTENTABILIDADE section article .puc_imagem_galeria a:link, #SUSTENTABILIDADE section article .puc_imagem_galeria a:visited { background:rgba(0,0,0,0.08); } #SUSTENTABILIDADE section article .puc_imagem_galeria a:hover { background:rgba(0,0,0,0.04); } /* legenda dos thumbnails */ #SUSTENTABILIDADE section article .puc_imagem_galeria a:link .puc_texto_menor, #SUSTENTABILIDADE section article .puc_imagem_galeria a:visited .puc_texto_menor, #SUSTENTABILIDADE section article .puc_imagem_galeria a figure { color:#000000; } #SUSTENTABILIDADE section article .puc_imagem_galeria a:hover .puc_texto_menor, #SUSTENTABILIDADE section article .puc_imagem_galeria a:hover figure { color:#000000; } /* ----- TABELA ----- */ /* bordas da tabela */ #SUSTENTABILIDADE section article .puc_tabela_padrao_TAG-TABLE, #SUSTENTABILIDADE section article .puc_tabela_padrao_TAG-TABLE td { border-color:rgba(0,0,0,0.15); } /* linhas para tabela */ #SUSTENTABILIDADE section article .puc_tabela_linha_n1_TAG-TR { background:#000000; color:#FFFFFF; } #SUSTENTABILIDADE section article .puc_tabela_linha_n2_TAG-TR { background:rgba(0,0,0,0.4); color:#FFFFFF; } #SUSTENTABILIDADE section article .puc_tabela_linha_n3_TAG-TR { background:#FFFFFF; color:#000000; } #SUSTENTABILIDADE section article .puc_tabela_linha_clara_TAG-TR { background:rgba(0,0,0,0.04); } #SUSTENTABILIDADE section article .puc_tabela_linha_escura_TAG-TR { background:rgba(0,0,0,0.08); } #SUSTENTABILIDADE section article .puc_tabela_linha_alternada_TAG-TABLE tr:nth-child(odd) { background:rgba(0,0,0,0.08); } #SUSTENTABILIDADE section article .puc_tabela_linha_alternada_TAG-TABLE tr:nth-child(even) { background:rgba(0,0,0,0.02); } /* ----- LINHA HORIZONTAL ----- */ #SUSTENTABILIDADE hr { /* color:rgba(0,0,0,0.15); */ } /* ----- LISTAS ----- */ /* bullet */ #SUSTENTABILIDADE ul li::before { /* color:#09AEFF; */ } /* lista destaque */ #SUSTENTABILIDADE section .puc_lista_especial_TAG-UL li::before, #SUSTENTABILIDADE section .puc_lista_especial_item_unico_TAG-LI::before { /* color:#0B5182; */ } #SUSTENTABILIDADE section .puc_lista_especial_TAG-UL li, #SUSTENTABILIDADE section .puc_lista_especial_item_unico_TAG-LI { /* color:#0B5182; */ } /* ----- FORMULÁRIOS ----- */ /* área do formulário */ #SUSTENTABILIDADE article form { background:rgba(0,0,0,0.04); } /* campos de preenchimento */ #SUSTENTABILIDADE article form input[type=text], #SUSTENTABILIDADE article form input[type=password], #SUSTENTABILIDADE article form input[type=file], #SUSTENTABILIDADE article form textarea, #SUSTENTABILIDADE article form select { background:#FFF; border-color:rgba(0,0,0,0.15); } /* botão "enviar" */ #SUSTENTABILIDADE article form input[type=submit] { background:#000000; color:#FFFFFF; } #SUSTENTABILIDADE article form input[type=submit]:hover { background:rgba(0,0,0,0.8); color:#FFFFFF; } /* ----- PLAYER DE ÁUDIO ----- */ #SUSTENTABILIDADE section div.puc_player_audio_TAG-DIV { /* background:#B4CFE3; */ } #SUSTENTABILIDADE section div.puc_player_audio_TAG-DIV:hover { /* background:#81BFE7; */ } /* ----- LINKS REDES SOCIAIS ----- */ #SUSTENTABILIDADE div.puc_links_redes_sociais_TAG-DIV a img { width:40px; height:40px; } /* =============================================== MEIO >> COLUNA LATERAL === */ /* ========================================================================== */ /* ----- TÍTULO ----- */ #SUSTENTABILIDADE section aside .puc_texto_coluna-lateral_titulo { /* color:#09AEFF; */ } /* ----- BANNER DE TEXTO ----- */ #SUSTENTABILIDADE section aside p.puc_texto_coluna-lateral_banner_TAG-P { background:rgba(0,0,0,0.04); } /* ----- BANNER DE LINK ----- */ #SUSTENTABILIDADE section aside p.puc_texto_coluna-lateral_banner_TAG-P a:link, #SUSTENTABILIDADE section aside p.puc_texto_coluna-lateral_banner_TAG-P a:visited { color:#000000; background:rgba(0,0,0,0.04); } #SUSTENTABILIDADE section aside p.puc_texto_coluna-lateral_banner_TAG-P a:hover { background:#000000; color:#FFFFFF; } /* ========================================================================== ESTILOS ESPECÍFICOS === */ /* ================================================================================================== */ /* ================================================================================================== */ /* ================================================================================================== */ /* ================================================================================================== */ /* ----- AQUI ENTRA OS ESTILOS ESPECÍFICOS PARA O DEPTO/UNID ----- Para sobressair qualquer estilo já existente usar o ID do depto/unid (localizado no body) antes do nome da classe/id OU o termo "!important" */ /* ======================================================================================= */ /* ============================= SITE MODELO BANDING ===================================== */ /* ======================================================================================= */ .ttl-inicial{ text-align:center; margin: 50px auto; } .texto-inicial-2c, .texto-inicial-2c_peq { column-count: 2; column-gap: 40px; margin-bottom: 64px; font-weight: 400; line-height: 30px; } .texto-inicial-2c { font-size: 1.2em; } .texto-inicial-2c_peq { font-size: 1em; } @media (max-width:680px) { .texto-inicial-2c, .texto-inicial-2c_peq { column-count:1; } } .voltar-ao-topo{ margin:90px 0; } .voltar-ao-topo .material-symbols-outlined { transform:rotate(180deg); font-size: 1.2em; vertical-align: middle; font-weight: 500; } .voltar-ao-topo a:link, .voltar-ao-topo a:visited { color: #4646FF !important; font-size: 24px; font-weight: 400; font-family: "Rethink Sans", sans-serif; } /* ======================= estilo adaptado para a página FARMACIA ======================= */ /* ================================================================================ */ /* ============================Slide show========================*/ .slide-geral { min-height: 555px;} .slide-geral a:link, .slide-geral a:hover {text-decoration: none !important; min-height: 555px;} .slideshow-container { border-radius: 3px;} .slide-texto{ color: #f5f5f0; z-index:100; box-sizing: border-box; position: absolute; bottom: 45px; width: 100%; text-shadow: 2px 2px 2px rgba(17, 17, 17, 0.3); } @media (max-width:680px) { .slide-texto{ top:330px;} .slide-ttl{font-size: 2.3em !important;} } .slide-texto-gradiente{ background: linear-gradient(0deg, rgba(0,0,0,0.5) 0%, rgba(34,193,195,0) 50%, rgba(34,193,195,0) 100%); position: absolute; bottom: 0; left: 0; height:100%; width: 100%;} .slide-ttl{font-size: 3em; line-height: 1em !important; font-weight: 500; margin: 0 50px 20px 50px; text-align: center; font-family: "Rethink Sans", sans-serif; } .slide-stl{ line-height: 1em !important; font-weight: 400; margin: 0 50px; text-align: center; font-size: 18px; } #SUSTENTABILIDADE img{border-radius: 3px;} /* ============== DIV INTRODUÇÃO ========== */ #SUSTENTABILIDADEintroducao{width: 100%;height: 100%; display: flex; flex-wrap: wrap;} #SUSTENTABILIDADE #SUSTENTABILIDADEintroducao .texto strong{ font-size: 2.5em !important; line-height: 1.2 !important;} @media (max-width:800px) { #SUSTENTABILIDADE #SUSTENTABILIDADEintroducao .texto strong { font-size: 1.8em!important;} } /* ============= DIV TEXTO DESTAQUE =========== */ #texto-destaque{ display: flex; flex-wrap: wrap; width: 100%; margin: 80px 0 10px 0; } .ia-texto-inicial-2c{ font-family: "Literata", serif; font-size: 1.3em; line-height: 1.4em; column-count: 2; column-gap: 40px;} @media (max-width:809px) { .ia-texto-inicial-2c { column-count: 1 !important; } } @media only screen and (max-width: 1139px) and (min-width: 699px) { .tapume .puc_layout_coluna_3cols_nivelador, .puc_layout_coluna_4cols_nivelador { display: flex !important; align-items: stretch !important; justify-content: space-between !important; flex-wrap: wrap !important; } .tapume .puc_layout_coluna_3cols_nivelador { margin-top: -30px !important;} .puc_layout_coluna_3cols_interno, .puc_layout_coluna_4cols_interno {width: calc(50% - 15px) !important; margin-bottom: 30px !important; } } /* ================ DIV ESCOLHER ================ */ #SUSTENTABILIDADE-escolher{display: flex; flex-wrap: wrap; margin:80px auto 10px auto;} #SUSTENTABILIDADE-escolher .card{ height: 100%; padding-top: 55px;} #SUSTENTABILIDADE-escolher .tapume .puc_layout_coluna_3cols_interno { width: calc(33.3% - 20px); margin-bottom: 30px!important; } /* ============== DIV OBJETIVOS ========== */ #Objetivos-farmacia{ display: flex; flex-wrap: wrap; margin:80px auto 10px auto;} #Objetivos-farmacia .card{ height: 100%; padding-top: 55px;} #Objetivos-farmacia img{width: 100%;} /* ============== PARCERIA ============== */ #parceria{ display: flex; flex-wrap: wrap; margin: 80px 0 10px 0; width: 100%; } #parceria .card{padding-top: 50px;} .ia-texto-inicial-2c-parceria{ column-count: 2; column-gap: 40px; font-size: 0.88em;} .ia-texto-inicial-2c-parceria strong{font-size: 1.4em;} @media (max-width:709px) { .ia-texto-inicial-2c-parceria { column-count: 1 !important; } } .bolsa-AI{display: flex; flex-wrap: wrap; margin-top:30px;} /* ============== mensagem-final ============== */ #mensagem-final{ display: flex; flex-wrap: wrap; width: 70%; margin: 80px auto 80px auto; font-size: 1.7em; line-height: 1.6em; } /* ==================== Sobre o Curso ============== */ #SUSTENTABILIDADEsobre{ display: flex; flex-wrap: wrap;} #SUSTENTABILIDADEsobre-opcoes{ display: flex; flex-wrap: wrap; margin:80px auto 80px auto;} #SUSTENTABILIDADEsobre-opcoes .card{ height: 100%; padding: 50px 30px 20px 30px;} #SUSTENTABILIDADEsobre-opcoes img { object-fit: cover; width: 100%; height: 100%;} #inscricoes-farmacia{ display: flex; flex-wrap: wrap; width: 100%; margin: 60px auto 50px auto;} #inscricoes-farmacia .txtinscricoes{font-family: "Literata", serif; font-size: 1.5em; } #inscricoes-farmacia h2{ display: block; width: 100%;} @media (max-width:709px) { #SUSTENTABILIDADEsobre-opcoes img { height: auto;} .tapume .puc_layout_coluna_4cols_interno { margin-bottom: 20px!important;} } /* ================ Coordenação ===================== */ #SUSTENTABILIDADEcorrdenacao{ display: flex; flex-wrap: wrap; margin:80px auto 80px auto;} #SUSTENTABILIDADEcorrdenacao .card {padding: 30px;} #SUSTENTABILIDADEcorrdenacao .puc_layout_area-inicial_nivelador {margin: 0;} /* ================ Estrutura curricular ===================== */ #topo-estrutura-farmacia {display: flex; flex-wrap: wrap;} .tapume #topo-estrutura-farmacia img {width: 100% !important; object-fit: cover !important; height: 100% !important;} #topo-estrutura-farmacia .slide-geral{min-height: 100%;} @media (max-width:709px) { /*.tapume #topo-estrutura-farmacia img {height: 350px!important;}*/ #topo-estrutura-farmacia .slide-texto { top: 200px; } #topo-estrutura-farmacia img{} } #SUSTENTABILIDADEestrutura { display: flex; flex-wrap: wrap; margin:30px auto 80px auto;} #SUSTENTABILIDADEestrutura .card { height: 100%; padding-top: 55px !important; } /* ============== Grade Curricular ========== */ #SUSTENTABILIDADEgrade { display: flex; flex-wrap: wrap; margin:40px auto 80px auto;} #grade-topo .card, #grade-trilhas .card { min-height: 270px; padding-top: 55px; } #grade-trilhas{display: flex; flex-wrap: wrap; margin:80px auto 30px auto;} #proj-integrados {display: flex; flex-wrap: wrap; margin:80px auto 80px auto; width: 100%;} #ttl-integrados {background-position: 0px 49.5px; font-size: 1em; align-items: start; padding: 30px; margin-top: 80px;} #ttl-integrados h3{ color: #F5F5F0; margin: 2px 0; } #cont-integrados{font-size: 1.1em;} #cont-integrados p{ font-family: "Literata", serif; font-size: 0.73em; } #proj-integrados .card{ width: 100%!important; } #grade-completa{display: flex; flex-wrap: wrap;} #SUSTENTABILIDADE-tabela{ max-width: 100%; overflow-x: scroll; display: flex; flex-wrap: wrap; box-sizing: border-box; margin: 15px auto;} #SUSTENTABILIDADE-tabela tr{ padding: 20px 5px!important;} .ia-topo-tabela { padding: 20px 5px!important; font-size: 1.1em !important; font-weight: 300;} .ia-meio-tabela {font-family: "Literata", serif!important; font-size: 0.9em!important; } /* Grade no formato tabela */ #grade-tabela{ width: 873px!important; border-radius: 0!important; margin: 0 auto; } #grade-tabela table{ width: 100%; background: #FFFFFF; border: 1px solid #9B9583!important; } #grade-tabela .topo-tabela{ background: #9B9583; border-radius: 0!important; } #grade-tabela .topo-tabela td{font-family: "Rethink Sans", sans-serif!important; color: #FFFFFF; font-size: 1.3em; font-weight: 400;} #grade-tabela .periodo-tabela{ background: #F5F5F0;} #grade-tabela .periodo-tabela td{font-family: "Literata", serif; font-size: 1.15em!important; font-weight: 500; color: #000000; border-bottom: 1px solid #9B9583;} #grade-tabela tr{border-bottom: 1px solid #9B9583!important; border-radius: 0!important;} #grade-tabela td{padding: 10px 15px!important; font-family: "Literata", serif; font-size: 1em; color: #000000; border-bottom: 1px solid #9B9583!important; border-radius: 0!important;} #grade-tabela .grade-linhas-finais{background: #F5F5F0; border: 2px solid #9B9583!important; border-radius: 0!important;} #grade-tabela .grade-linhas-finais td{ border: 1px solid #9B9583!important; font-family: "Rethink Sans", sans-serif!important; font-size: 1.2em; font-weight: 500; border-radius: 0!important;} /* para mostrar e sumir a grade */ #grade-tabela, #grade-visual{display: none;} .linha-oculta, .linha-oculta2 { display: none; /* já inicia oculta */} /*para o combo de escolher tabela ou diagrama */ #grade-tabela-diagrama{display: flex; flex-wrap: wrap; width: 100%; margin: 10px auto 20px 100px; font-family: "Rethink Sans", sans-serif!important;} #grade-tabela-diagrama select {border: 0; background: #F5F5F0; border-bottom: 1px solid #000; width: 150px; margin: 0 0 0 15px;} /* Borda da tabela de cursos de acordo com o desenho do site */ .borda-vertical_roxo2{ border-left: 3px solid #7817B1; } .borda-vertical_roxo3{ border-left: 3px solid #3A0062; } .borda-vertical_turquesa2{border-left: 3px solid #00A2AC; } .borda-vertical_verde2{border-left: 3px solid #00A800; } .borda-vertical_verde3 {border-left: 3px solid #003900; } .borda-vertical_vermelho2 {border-left: 3px solid #BE002D;} .borda-vertical_turquesa3{border-left: 3px solid #005C66;} .borda-vertical_cinza{border-left: 3px solid #9B9583; } #toggleBtn{border: 0; background: #FFF; font-size: 1.15em; font-weight: 400;} #toggleBtn span{vertical-align: middle; padding-bottom: 2px;} #toggleBtn2{border: 0; background: #00A800; font-size: 0.9em; font-weight: 400; color: #FFF; column-count: 2; display: inline-flex; align-items: center; line-height: 1.2;} #toggleBtn2 span{display: flex; width: 30px; height: 50px; margin: 20px auto 0 auto;} /* ==================== Perguntas ==================== */ #SUSTENTABILIDADEperguntas {display: flex; flex-wrap: wrap; margin:40px auto 80px auto;} #SUSTENTABILIDADEperguntas .card {font-size: 1.25em; width: 100%;} #SUSTENTABILIDADEperguntas .card p{ font-family: "Literata", serif; font-size: 0.73em; } /* ==================== BOLSAS ==================== */ #SUSTENTABILIDADEbolsas {display: flex; flex-wrap: wrap; margin:40px auto 80px auto;} #SUSTENTABILIDADEbolsas .card {font-size: 1.25em; width: 100%;} #SUSTENTABILIDADEbolsas .card p{ font-family: "Literata", serif; font-size: 0.73em; } /* ============= Rodapé cinza ============================ */ .rodape_completo_faixa_cinza h5 {/*font-weight: 300!important;*/} /* ====================================================== */ /* ====================================================== */ /* ====================================================== */ /* ============ LAYOUT RECEBIDO ========================= */ /* ====================================================== */ /* ====================================================== */ /* ====================================================== */ #Introducao-farmacia{display: flex; flex-wrap: wrap; width: 100%;} #Introducao-farmacia .puc_layout_area-inicial_nivelador{ width: 100%;} @media (max-width:1138px) { #Introducao-farmacia .puc_layout_area-inicial_nivelador .puc_layout_area-inicial_esquerda{ margin-bottom: 30px!important;} .botoes-topo{ display: flex; flex-wrap: wrap; width: 100%; justify-content: space-between;} .botoes-topo .card{display: flex; flex-wrap: wrap; width: 48.5%;} } @media (max-width:984px) { .botoes-topo .card{ min-height: 150px!important; } .slide-geral { min-height: 300px; }} @media (max-width:630px) { .botoes-topo .card{height: 210px; font-size:1.05em; } .slide-geral { min-height: 300px; } .slide-texto {top: 165px; } .slide-stl {font-size: 17px!important;} } .sustentabilidade-MEC { font-size: 0.80em; line-height: 1.5em; } /* ============= NOSSO CURSO =============== */ #nossocurso-geral {display: flex; flex-wrap: wrap; margin:0 auto 10px auto; font-family: "Literata", serif; font-size: 1.24em; line-height: 1.5em;} #nossocurso-geral h2{margin-top: 5px;} #nossocurso-dir {font-family: "Literata", serif; /*font-size: 20px; line-height: 30px;*/ font-size: 1em; line-height: 1.5em; } /*========= Vídeos de conheça o curso =============== */ #sust-videos{display: flex; flex-wrap: wrap; width: 100%; margin: 20px auto 50px auto;} .sust-videos-geral{display: grid; grid-template-columns: 25% 75%; column-gap: 30px; width: 100%; min-height: 560px;} /* seta do vídeo */ .btn-play .material-symbols-outlined { font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; font-size: 4em!important; text-shadow: 1px 1px 3px #00000038; } .tag-verde3{ background: #005666;} .tag-azul1{ background: #4646FF;} .tag-verde3, .tag-azul1{ padding: 1px 8px; margin: 0 20px; font-family: "Rethink Sans", sans-serif; font-size: 0.8em; position: relative; z-index: 100; display: flex; bottom: 230px; border-radius: 3px; color: #FFF; font-weight: 500; letter-spacing: 0.05em; width: fit-content; height: 25px; transition: all 0.3s; } .btn-play{ color: #FFFFFF; position: relative; z-index: 100; display: flex; top: -20%; justify-content: center; transition: all 0.3s; } .txt-descicao-video{ position: relative; font-family: "Rethink Sans", sans-serif; font-size: 1.6em; font-weight: 500; color: #FFFFFF; text-shadow: 1px 1px 2px #0000006e; transition: all 0.3s; } .txt-descicao-video p{margin: 0 30px; z-index: 100; position: relative; top: 60px; transition: all 0.3s; } /*.txt-descicao-video span{ background-color: transparent; background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgb(0, 0, 0)); opacity: 0.7; z-index: 90; position: relative; min-height: 92px; width: 100%; display: block;border-radius: 3px; }*/ .sust-apresentacao-01{ background-repeat: no-repeat; padding: 250px 0 0 0; background-color: #FFF; border-radius: 3px; background: url("../imagens/img_farm_apresentacao-01.jpg"); background-size: cover; background-position: top center; } .sust-apresentacao-01:link, .sust-apresentacao-02:link{text-decoration: none;} /* Quando o link todo for hover */ .sust-apresentacao-01:hover .tag-azul1, .sust-apresentacao-02:hover .tag-azul1, .sust-apresentacao-01:hover .tag-verde3, .sust-apresentacao-02:hover .tag-verde3 { background: #0000A9;; } .sust-apresentacao-01:hover .btn-play, .sust-apresentacao-02:hover .btn-play { transform: scale(1.2); } .sust-apresentacao-01:hover .txt-descicao-video, .sust-apresentacao-02:hover .txt-descicao-video { bottom: 10px; } .sust-apresentacao-01:hover .txt-descicao-video p, .sust-apresentacao-01:hover .txt-descicao-video p { top: 50px; } .sust-apresentacao-02{ background-repeat: no-repeat; padding: 250px 0 0 0; background-color: #FFF; border-radius: 3px; background: url("../imagens/img_farm_apresentacao-02.jpg"); background-size: cover; background-position: top center;} .sust-apresentacao-02-foto{} /* ============ O profissional ============= */ #profissional-form {display: flex; flex-wrap: wrap; margin:10px auto 10px auto; font-family: "Literata", serif; line-height: 1.4;} #profissional-form h2{width: 100%} #profissional-form-linha { box-sizing: border-box; float: left; width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between;} #profissional-form-col01{ width: 65%; padding: 20px 0; font-size: 1.2em; line-height: 1.5em;} #profissional-form-col01 p{margin-left: 15px;} #profissional-form-col01 .lista_farm{font-size: 1em !important;} #profissional-form-col02{ width: 30%; /*padding: 10px;*/ height: 100%; display: flex; flex-wrap: wrap; align-items: end;} #profissional-form-col02 .slideshow-atuacao { position: relative; width: 100%; /*height: 100%;*/ height: 380px; overflow: hidden; } .card-frase { position: absolute; width: 100%; height: 100%; text-align: center; display: flex; flex-direction: column; justify-content: center; align-items: center; opacity: 0; transition: opacity 1s; } .card-frase.active { opacity: 1; } .dots { position: absolute; top: 300px; left: 50%; transform: translateX(-50%); display: flex; justify-content: center; z-index: 100; } .dot { width: 10px; height: 10px; margin: 5px; /*background-color: #F5F5F0;*/ border: 1px solid #F5F5F0; border-radius: 50%; display: inline-block; cursor: pointer; } .dot.active { background-color: #F5F5F0; } #profissional-form-col02 .slideshow-atuacao .card{height: 100%; width: 100%;} #profissional-form-col02 .slideshow-atuacao .card .txtcont{ margin: auto; top: 100px; position: relative;} #profissional-form-col02 .slideshow-atuacao .card .tag{text-align: left;} @media (max-width:944px) { #profissional-form-col01{width: 50%} #profissional-form-col02{width: 40%} } @media (max-width:680px) { #profissional-form-linha { box-sizing: border-box; width: 100%; display: block; float: left;} #profissional-form-col01{width: 100%;display: block; float: left;} #profissional-form-col02{width: 100%; display: block; float: left; height: 400px; } #profissional-form-col02 .slideshow-atuacao .card { display: flex; height: 100%; width: 100%;} } /* ==================== EIXOS (trilhas) ============================ */ #curricular{ display: flex; flex-wrap: wrap; margin:40px auto 10px auto; width: 100%;} #curricular h2{width: 100%;} #curricular h3{width: 100%;} .curri01, .curri02, .curri03{display: flex; flex-wrap: wrap; width: 100%; margin-bottom: 30px; min-height: 170px; background: #FFFFFF;} .curri01-ttl{background: #BE002D; text-align: center; padding: 20px; color: #f5f5f0; font-family: "Rethink Sans", sans-serif; display: flex; flex-wrap: wrap; width: 28%; font-size: 1.5em; font-weight: 500; align-content: center; justify-content: center;} .curri02-ttl{background: #00A2AC; text-align: center; padding: 20px; color: #f5f5f0; font-family: "Rethink Sans", sans-serif; display: flex; flex-wrap: wrap; width: 28%; font-size: 1.5em; font-weight: 500; align-content: center; justify-content: center;} .curri03-ttl{background: #005C66; text-align: center; padding: 20px; color: #f5f5f0; font-family: "Rethink Sans", sans-serif; display: flex; flex-wrap: wrap; width: 28%; font-size: 1.5em; font-weight: 500; align-content: center; justify-content: center;} @media (max-width:709px) {.curri01-ttl, .curri02-ttl, .curri03-ttl{width: 100%;} .curri01-desc, .curri02-desc, .curri03-desc {width: 100%!important;} } .curri01-desc{ display: flex; flex-wrap: wrap; width: 60%; padding: 20px; font-size: 1.2em; align-content: space-around; } .curri02-desc{ display: flex; flex-wrap: wrap; width: 60%; padding: 20px; font-size: 1.2em; align-content: space-around; } .curri03-desc{ display: flex; flex-wrap: wrap; width: 60%; padding: 20px; font-size: 1.2em; align-content: space-around; } /* acho que usarei esses */ .ex01,.ex02, .ex03, .ex04 { display: flex; flex-wrap: wrap; width: 100%; font-family: "Rethink Sans", sans-serif; background-position: center; font-size: 1.7em; line-height: 1.1em; font-weight: 500; /*height: 160px;*/ color: #F5F5F0; background-repeat: no-repeat; background-size: cover;} @media (max-width:1344px){ .ex01,.ex02, .ex03, .ex04{height: 185px;} } @media (max-width:1138px){ .ex01,.ex02, .ex03, .ex04{height: 130px;} } @media (max-width:798px){ .ex01,.ex02, .ex03, .ex04{height: 150px;} } @media (max-width:668px){ .ex01,.ex02, .ex03, .ex04{height: 186px;} } @media (max-width:559px){ .ex01,.ex02, .ex03, .ex04{font-size: 1.4em;} } @media (max-width:500px){ .ex01,.ex02, .ex03, .ex04{height: 110px;} } .ex01{ background-color: #00A800; background-image: url('https://www.puc-rio.br/imagens/grafismos/bkg_grafismo_roxoasa.svg');} .ex02{ background-color: #003900; background-image: url('https://www.puc-rio.br/imagens/grafismos/bkg_grafismo_turquesacurva.svg');} .ex03{ background-color: #00A800; background-image: url('https://www.puc-rio.br/imagens/grafismos/bkg_grafismo_verdereto.svg');} .ex04{ background-color: #FF0031; background-image: url('https://www.puc-rio.br/imagens/grafismos/bkg_grafismo_vermelhoasainvertida.svg');} .txtex{ font-size: 1em; width: 100%; padding: 18px; display: block; } .descicao-eixos{ font-size: 1.1em; width: 100%; padding: 20px 0; display: block; line-height: 1.5em;} #grade{ display: flex; flex-wrap: wrap; margin:10px auto 50px auto; width: 100%;} #grade h3{width: 100%;} #grade table { border: 0} #grade td {padding: 5px; border-radius: 3px; font-size: 0.88em;} /*cores-meio a meio*/ .meio-TE-meio-TC{background: #005C66; background: linear-gradient(90deg,rgba(0, 92, 102, 1) 51%, rgba(0, 162, 172, 1) 51%); color: #FFF;} .meio-TC-meio-verm{background: #00A2AC; background: linear-gradient(90deg,rgba(0, 162, 172, 1) 51%, rgba(190, 0, 45, 1) 51%); color: #FFF;} .roxo2{ background: #7817B1; color: #F5F5F0; } .turquesa2{background: #00A2AC; color: #f5f5f0;} .verde2{background: #00A800; color: #f5f5f0;} .vermelho2 {background: #BE002D; color: #f5f5f0;} .verde3 {background: #003900; color: #f5f5f0;} .turquesa3{background: #005C66; color: #f5f5f0;} .cinza1{background: #9B9583; color: #F5F5F0;} #dis_inov{ display: flex; flex-wrap: wrap; margin:20px auto 0 auto; width: 100%;} #dis_inov .puc_layout_coluna_2cols_nivelador{font-size: 1.24em; line-height: 1.4;} /* ================= METODOLOGIA ================ */ #metodologia{ display: flex; flex-wrap: wrap; margin:40px auto 10px auto; width: 100%;} #metod-texto-intro{ font-family: "Literata", serif; font-size: 1.24em; line-height: 1.4em; column-count: 2; column-gap: 40px; margin-bottom: 40px;} @media (max-width:680px) {#metod-texto-intro{column-count: 1; width: 100%;} } .caixas-eixos{display: flex; flex-wrap: wrap; width: 100%; margin: 40px auto 10px auto;} #metod-texto-final{display: block; float: left; width: 50%; font-size: 1.24em; margin: 30px 0; } #metodologia .puc_layout_coluna_2cols_interno{ font-size: 1.24em!important; line-height: 1.4;} .metodologia-cx{display: flex; background: #FFFFFF; width: 100%;margin-bottom: 30px; min-height: 200px; align-items: center;} .medodologia-destaque{background: #00A800; text-align: center; padding: 0 20px; color: #f5f5f0; font-family: "Rethink Sans", sans-serif; display: flex; flex-wrap: wrap; width: 298px; font-size: 1.5em; font-weight: 500; align-content: center; justify-content: center; height: 100%;} .medodologia-destaque2{background:#003900; text-align: center; padding: 0 20px; color: #f5f5f0; font-family: "Rethink Sans", sans-serif; display: flex; flex-wrap: wrap; width: 298px; font-size: 1.5em; font-weight: 500; align-content: center; justify-content: center;height: 100%;} .medologia-texto-destaque{ display: flex; flex-wrap: wrap; width: 70%; padding: 20px; font-size: 1.1em; } @media (max-width:1300px) { .medologia-texto-destaque { width: 60%;} } @media (max-width:984px) { .medologia-texto-destaque { width: 50%; } } @media (max-width:796px) { .medodologia-destaque, .medodologia-destaque2{} .medologia-texto-destaque { } #metod-texto-final{display: block; float: left; width: 100%; } } @media (max-width:590px) { .medodologia-destaque, .medodologia-destaque2{font-size: 1.05em; width: 30%;} .medologia-texto-destaque { width: 70%; font-size: 0.98em; line-height: 1.3em; } } /* ================== Currículo flexibilizado ================== */ #SUSTENTABILIDADE-flex{display: flex; flex-wrap: wrap; margin:30px auto 90px auto; width: 100%;} .bolsa-flex-texto{font-size: 1.24em; line-height: 1.5;} /* ===== Currículo flex caixas horizontal ===== */ #curriculo_flex_caixas{display: flex; flex-wrap: wrap;} #sust-cont-vazado{ /* display: block; */ position: relative; /* float: left; */ margin-top: 40px; /* width: 81vw; */ /* overflow: auto; */ box-sizing: border-box; width: 100%; } #sust-cont-vazado::after { content: ""; display: block; clear: both; } .wrapper { width: 100%; } .div-vazando { width: 100vw; /* ultrapassa 100% da largura da tela */ margin-left: 0; /* começa na esquerda */ } .caixas-scroll-area:active { cursor: grabbing; } .caixas-scroll-area { overflow-x: auto; width: 100%; display: contents; cursor: grab; user-select: none;} .caixas-geral { position: relative; display: flex; gap: 16px; box-sizing: border-box; width: calc(100vw + (100% - 100vw) / 2 - 8px); margin-right: calc((100% - 100vw) / 2); overflow-x: auto; color: white;} .caixas { display: grid; margin-right: 20px; width: 500px;border-radius: 3px; min-width: 500px;} @media (max-width:600px) { .caixas { width: 300px; min-width: 300px; background: #FFFFFF;} .ttl-caixas { height: 60px!important;} .txt-caixas { background: #FFFFFF; height: 250px;} } #carousel { display: flex; width: 100%; transition: transform 0.5s ease-in-out; } .carousel-container { /*display: flex; overflow: hidden; width: 100%;*/ overflow-x: auto; scroll-behavior: smooth; -webkit-overflow-scrolling: touch; gap: 10px; } .carousel-container::-webkit-scrollbar { display: none; /* oculta a barra de rolagem no Chrome/Safari */ } .carousel-item { flex: 0 0 15%;/**/ box-sizing: border-box; scroll-snap-align: start; } .ttl-caixas{ background: #00a800; font-family: "Rethink Sans", sans-serif; color: #FFFFFF; padding: 20px; display: block; font-size: 1.5em; min-height: 50px!important; border-radius: 3px 3px 0 0; } .txt-caixas {background: #FFFFFF; padding: 20px; min-height: 150px; font-size: 1.1em; border-radius:3px ; color: #000;} /* ================= Bolsas =================== */ #SUSTENTABILIDADE-bolsas{ display: flex; flex-wrap: wrap; margin:40px auto 10px auto; width: 100%;} .bolsa-farmacia-texto{font-size: 1.24em;} .bolsa-farmacia-global{display: flex; flex-wrap: wrap; margin:30px auto 30px auto; width: 100%;} .bolsa-farmacia{display: flex; flex-wrap: wrap; margin:0 0 20px 0; width: 100%; height: 250px;} .bolsa-farmacia-descricao{display: flex; flex-wrap: wrap; margin:0 auto; width: 100%; font-size: 1.2em;} #SUSTENTABILIDADE-bolsas .card{margin-bottom: 15px!important;} #SUSTENTABILIDADE-bolsas .puc_layout_coluna_3cols_interno{margin-bottom: 30px!important;} /* ================ Escolher-engressar =========== */ #SUSTENTABILIDADE-esc-ing{display: flex; flex-wrap: wrap; margin:40px auto 10px auto; width: 100%;} #SUSTENTABILIDADE-esc-ing h2{display: flex; flex-wrap: wrap; vertical-align: bottom; width: 100%;} .esc-ing-texto{display: flex; flex-wrap: wrap; margin:20px auto; width: 100%; font-size: 1.24em;} #SUSTENTABILIDADE-esc-ing ul{ margin: 0; font-size: 1.24em; line-height: 1.4;} @media (max-width:444px) {.esc-ing-texto{font-size: 0.9em;} } .lista_farm {display: flex; flex-wrap: wrap; margin: 0 !important; padding: 0 20px; font-size: 1.25em; line-height: 1.5;} .lista_farm li{display: block; width: 100%; margin: 0 auto 10px auto;} .btn-incricao-aberta {border: 1px #000000 solid; border-radius: 3px; background: #FFFFFF; padding: 10px; font-size: 0.95em; font-family: "Rethink Sans", sans-serif; font-weight: 600;} .btn-incricao-aberta:hover, .btn-incricao-aberta:focus { border-color:#030053 !important; background:#030053 !important; color:#F5F5F0 !important; text-decoration: none;} /* =========== INFRAESTRUTURA DO CURSO =============== */ #infraestrutura{ margin:40px auto 10px auto; width: 100%;} #infraestrutura h2{ vertical-align: bottom; width: 100%;} #infraestrutura .puc_layout_coluna_2cols_nivelador, #infraestrutura .puc_layout_area-inicial_nivelador{font-size: 1.24em; line-height: 1.4;} /* ================ COMO INGRESSAR =============== */ #como-ingressar{ display: flex; flex-wrap: wrap; margin:30px auto 80px auto; width: 100%; } #como-ingressar h2{ display: block; width: 100%; } #como-ingressar .puc_layout_coluna_2cols_interno{font-size: 1.24em; line-height: 1.5em;} /* ====================== FAQ ===================== */ #perguntas-frequentes-faq{ display: flex; flex-wrap: wrap; width: 100%; margin:40px auto 80px auto;} .faq_card { background:#FFFFFF; padding:25px; margin-bottom:12px; border-radius:3px; min-height: 60px; align-content: center; } .faq_card h3 { font-size:1.45em!important; font-weight: 500 !important; cursor:pointer; margin:0; display:flex; align-items:flex-start; line-height:1.1em; } .faq_card .material-symbols-outlined { color:#4646FF; font-size:1.5em; width:10px; height:17px; position:relative; margin:6px 14px 0 0; transition:0.3s all; } .faq_card .material-symbols-outlined span { position:absolute; top:-10px; left:-15px; } .faq_card .seta_virada { transform:rotate(90deg); } .faq_card .puc_efeito_aparecer { display:block; margin-top:17px; } /*================== COORDENADOR =================== */ #coordenador{ display: flex; flex-wrap: wrap; width: 100%; margin:40px auto 80px auto;} .card.branco.coordenador a:hover, .card.branco.coordenador a:focus { border-color:#030053 !important; background:#030053 !important; color:#F5F5F0 !important; } .coordenador_texto { display:flex; align-items:center; box-sizing:border-box; padding:30px 30px 30px 0; } @media (max-width:1139px) { .coordenador_texto { padding:30px !important; } } /* ================== SABER MAIS ===================== */ #saber-mais{display: flex; flex-wrap: wrap; width: 100%; margin:40px auto 80px auto;} #saber-mais h2{ width: 100%;} #saber-mais .puc_layout_coluna_3cols_nivelador{width: 100%;} #saber-mais .card{min-height: 140px;}