@charset "utf-8"; /* CSS Document */ /* ======================================================================================= FONTES === */ /* ================================================================================================== */ /* ================================================================================================== */ /* ================================================================================================== */ /* ================================================================================================== */ /* FONTES PUC 'Roboto' Opções de font-weight: 100 / 300 / 400 / 500 / 700 / 900 'Roboto Condensed' Opções de font-weight: 300 / 400 / 700 */ /* @import url('https://fonts.googleapis.com/css?family=Roboto+Slab:300,400,700'); */ @import url('https://fonts.googleapis.com/css?family=Montserrat:400,600,700,800'); /* ========================================================================== 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 === */ /* ========================================================================== */ /* ----- TÍTULO DA PÁGINA ----- */ #cipa header h1 { color:#666666; } /* ----- CAMINHO / BREADCRUMB ----- */ #cipa header nav a:link, #cipa header nav a:visited { color:#AAA; } #cipa header nav a:hover { color:#555; } #cipa header nav{float:left; display:block; paddin:0; color:#888; margin: 0 0 3px 0; width: 100%; padding: 0; box-sizing: border-box;} /* ================================================================= MENU === */ /* ========================================================================== */ /* ----- MENU VAZIO (LINHA) ----- #cipa header #puc_menu_vazio { background:#E5E5E5; } */ /* ----- MENU COMUM A PARTIR DAQUI ----- */ /* ------------------------------------- */ /* ----- FAIXA QUE ATRAVESSA A PÁGINA ----- */ @media (min-width:1140px) { #cipa header #puc_menu_faixa { background:#7ab793; } /* fecha @media (min-width:1140px) */ } /* ----- LINHAS ACIMA E ABAIXO DA FAIXA ----- */ #cipa header #menu span { background:#7ab793; } /* ----- DESATIVAÇÃO DAS BORDAS GRANDES DOS LINKS NO MENU DESKTOP (ex: CCCI) ----- */ @media (min-width:1140px) { #cipa header #menu { margin:1px 10px 0 10px; } #cipa header #menu span { top:0; margin-top:-1px; } #cipa header #menu a:link, #cipa header #menu a:visited { border-top:0; border-bottom:0; } /* fecha @media (min-width:1140px) */ } /* ----- MENU DESKTOP - LINKS ----- */ @media (min-width:1140px) { /* mouse out */ #cipa header #menu a:link, #cipa header #menu a:visited { color:#003d19; } /* mouse over */ #cipa header #menu a:hover, #cipa header #menu .puc_menu_link_ativo:link, #cipa header #menu .puc_menu_link_ativo:visited { color:#FFF; background:#003d19; border-color:transparent; } /* fecha @media (min-width:1140px) */ } /* ----- MENU MOBILE - LINKS ----- */ @media (max-width:1139px) { /* mouse out */ #cipa header #menu a:link, #cipa header #menu a:visited { color:#003d19; background:#7ab793; border-color:#003d19; } /* mouse over */ #cipa header #menu a:hover, #cipa header #menu .puc_menu_link_ativo:link, #cipa header #menu .puc_menu_link_ativo:visited { color:#fff; background:#003d19; border-color:#003d19; } /* fecha @media (max-width:1139px) */ } /* ----- MENU MOBILE - BOTÃO "MENU" ----- */ #cipa header button { color:#003d19; background:#7ab793; background-image:url(/imagens/puc_menu_abrefecha.png); background-repeat:no-repeat; } /* ----- SUBMENU DESKTOP ----- */ @media (min-width:1140px) { #cipa header #menu ul { background:#222; } #cipa header #menu ul a:link, #cipa header #menu ul a:visited { color:#7ab793; } #cipa header #menu ul a:hover { color:#222; background:#7ab793; } /* fecha @media (min-width:1140px) */ } /* ----- SUBMENU MOBILE -----*/ @media (max-width:1139px) { #cipa header #menu ul a:link, #cipa header #menu ul a:visited { border-bottom:1px solid #222; background:#222; color:#7ab793; } #cipa header #menu ul a:hover { color:#222; background:#7ab793; } /* fecha @media (max-width:1139px)*/ } /* ================================================================= MEIO === */ /* ========================================================================== */ /* ----- BORDA AO FINAL DO CONTEÚDO ----- #cipa section { border-bottom-color:#D5DEC1; } */ /* ============================================= MEIO >> COLUNA PRINCIPAL === */ /* ========================================================================== */ /* ----- TÍTULOS ----- */ /* ----- TÍTULO ----- */ #cipa h1.border, #cipa h2.border, #cipa h3.border, #cipa h4.border, #cipa h5.border { border-bottom: 1px dotted #999; } #cipa h1 { color:#666666; } #cipa h2 { color:#297a4a; } #cipa h3 { color:#96c161; } #cipa h4 { color:#666666; } #cipa h5 { color:#666666; } /* ----- TEXTO DESTAQUE EM QUADRO ----- #cipa section .puc_texto_destaque_em_quadro_centro, #cipa section .puc_texto_destaque_em_quadro_esquerda, #cipa section .puc_texto_destaque_em_quadro_direita { background:#E3E8EE; color:#07345B; } */ /* ----- LINKS (GERAL) ----- */ #cipa a:link, #cipa a:visited { color:#6d91a0; } #cipa a:hover { color:#113d50; } /* ----- LINK VOLTAR ----- */ #cipa section article button.puc_link_voltar_TAG-BUTTON { color: #7ab793; background: #0f5c2e; border-color: #966d00; } #cipa section article button.puc_link_voltar_TAG-BUTTON:hover { color: #0f5c2e; background: #7ab793; } /* ----- LINK DESTAQUE ----- */ #cipa section article a.puc_link_destaque_TAG-A:link, #cipa section article a.puc_link_destaque_TAG-A:visited, #cipa section article a.puc_link_destaque_centralizado_TAG-A:link, #cipa section article a.puc_link_destaque_centralizado_TAG-A:visited { background:#F0B820; color:#FFFFFF; } #cipa section article a.puc_link_destaque_TAG-A:hover, #cipa section article a.puc_link_destaque_centralizado_TAG-A:hover { background:#715300; color:#FFFFFF; } /* ----- LINK DE PAGINAÇÃO ----- #cipa section article .puc_link_paginacao_anterior_TAG-A:link, #cipa section article .puc_link_paginacao_anterior_TAG-A:visited, #cipa section article .puc_link_paginacao_proximo_TAG-A:link, #cipa section article .puc_link_paginacao_proximo_TAG-A:visited { color:#1A73A0; } #cipa section article .puc_link_paginacao_anterior_TAG-A:hover, #cipa section article .puc_link_paginacao_proximo_TAG-A:hover { color:#09AEFF; } */ /* ----- GALERIA DE IMAGENS ----- */ /* thumbnails #cipa section article .puc_imagem_galeria a:link, #cipa section article .puc_imagem_galeria a:visited { border-color:#CCC; background:#EEE; } #cipa section article .puc_imagem_galeria a:hover { border-color:#043458; background:#D4DEE9; } */ /* legenda dos thumbnails #cipa section article .puc_imagem_galeria a:link span.puc_imagem_galeria_legenda_TAG-SPAN, #cipa section article .puc_imagem_galeria a:visited span.puc_imagem_galeria_legenda_TAG-SPAN { color:#666; } #cipa section article .puc_imagem_galeria a:hover span.puc_imagem_galeria_legenda_TAG-SPAN { color:#043458; } */ /* ----- TABELA ----- */ /* bordas da tabela #cipa section article .puc_tabela_padrao_TAG-TABLE, #cipa section article .puc_tabela_padrao_TAG-TABLE td { border-color:#CCC; } */ /* linhas para tabela #cipa section article .puc_tabela_linha_n1_TAG-TR { background:#043458; color:#FFF; } #cipa section article .puc_tabela_linha_n2_TAG-TR { background:#9DBDD4; color:#043458; } #cipa section article .puc_tabela_linha_n3_TAG-TR { background:#CDDDE8; color:#043458; } #cipa section article .puc_tabela_linha_clara_TAG-TR { background:#EEE; } #cipa section article .puc_tabela_linha_escura_TAG-TR { background:#DDD; } #cipa section article .puc_tabela_linha_alternada_TAG-TABLE tr:nth-child(odd) { background:#F5F5F5; } #cipa section article .puc_tabela_linha_alternada_TAG-TABLE tr:nth-child(even) { background:#E5E5E5; } */ /* ----- LINHA HORIZONTAL ----- */ #cipa hr { color:#CCC; } /* ----- LISTAS ----- */ /* bullet */ #cipa ul li::before { color:#297a4a; } /* lista destaque */ #cipa section .puc_lista_especial_TAG-UL li::before, #cipa section .puc_lista_especial_item_unico_TAG-LI::before { color:#715300; } #cipa section .puc_lista_especial_TAG-UL li, #cipa section .puc_lista_especial_item_unico_TAG-LI { color:#715300; } /* ----- FORMULÁRIOS ----- */ /* área do formulário */ #cipa article form { background:#7ab793} /* campos de preenchimento */ #cipa article form input[type=text], #cipa article form input[type=password], #cipa article form input[type=file], #cipa article form textarea, #cipa article form select { background:#FFF; border-color:#CCC; } /* botão "enviar" */ #cipa article form input[type=button], #cipa article form input[type=reset]{ color: #7ab793; background: #0f5c2e; border-color: #7ab793; cursor: pointer} #cipa article form input[type=button]:hover, #cipa article form input[type=reset]:hover{ color: #0f5c2e; background: #4c996b; } /* ----- PLAYER DE ÁUDIO ----- #cipa section div.puc_player_audio_TAG-DIV { background:#B4CFE3; } #cipa section div.puc_player_audio_TAG-DIV:hover { background:#81BFE7; } */ /* ----- LINKS REDES SOCIAIS ----- #cipa div.puc_links_redes_sociais_TAG-DIV a img { width:40px; height:40px; } */ /* =============================================== MEIO >> COLUNA LATERAL === */ /* ========================================================================== */ /* ----- TÍTULO ----- #cipa section aside .puc_texto_coluna-lateral_titulo { color:#09AEFF; } */ /* ----- BANNER DE TEXTO ----- #cipa section aside p.puc_texto_coluna-lateral_banner_TAG-P { background:#E3E8EE; } */ /* ----- BANNER DE LINK ----- #cipa section aside p.puc_texto_coluna-lateral_banner_TAG-P a:link, #cipa section aside p.puc_texto_coluna-lateral_banner_TAG-P a:visited { color:#043458; background:#B4CFE3; } #cipa section aside p.puc_texto_coluna-lateral_banner_TAG-P a:hover { background:#9CC0DB; } */ /* ========================================================================== 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" */ .cipa_equipe div { box-shadow: 0 5px 15px rgba(0,0,0,0.3); transition: box-shadow 0.3s ease-in-out; } .cipa_equipe div.none { box-shadow: none; } .ccipa_equipe div:hover { box-shadow: 0 1px 2px rgba(0,0,0,0.15); } .ccipa_equipe div.none:hover { box-shadow:none; } .cipa_equipe div{ text-align: center; /*box-shadow: 0 3px 8px #888;*/ padding-bottom: 20px; position: relative } .cipa_equipe div a:link, .cipa_equipe div a:visited, .cipa_equipe div a:hover{ display:block; cursor:default; text-decoration: none; color: #555; } .cipa_texto_projetos{ padding: 0 10px } .cipa_tipo_projetos{ display: block; font-family: 'Roboto Condensed'; font-size: 2.0em; color: #666; line-height: 1em; margin-top: 20px; } .cipa_equipe span { display: block; text-align: right; font-weight: 700; color: #E07808 ; position: absolute; bottom: 5px; right: 15px; } .cipa_equipe_no_link a{ pointer-events: none; } #cipa_link { display:flex; justify-content:center; flex-wrap: nowrap; margin:0 -10px 0 -10px; } #cipa_link a:link, #cipa_link a:visited { display:flex; align-items:center; justify-content:center; flex-grow:1; flex-basis: 0; margin:0 10px 20px 10px; padding:10px; max-width:150px; font-weight:bold; text-align:center; background:#1a73a0; color:#FFF; box-shadow:0px 0px 0px rgba(0,0,0,0); box-sizing:border-box; transition:background 0.3s, color 0.3s, transform 0.3s, box-shadow 0.3s; } #cipa_link a:hover { background:#657387 /* #CDCEE8 */; color:#FFFFFF; text-decoration:none; transform:scale(1.2); box-shadow:0px 0px 15px rgba(0,0,0,0.2); } @media (max-width:490px) { #cipa_link { display: inherit; } #cipa_link a:link, #cipa_link a:visited {display: block} } /*-----estilo menu simples-----*/ #cipa ul.menu { padding: 0; margin: 0; display:flex; justify-content:left; align-items:center; list-style:none; text-align:center; } #cipa ul.menu li{ border-bottom:1px solid #7ab793; border-top:1px solid #7ab793; } #cipa ul.menu li a{ float:left; padding:1em; text-decoration:none; } #cipa ul.menu li:hover{ background-color:#7ab793; color:#fff; } #cipa ul.menu li:hover a{ color:#fff; text-decoration:none; } #cipa ul.menu li h5{ margin: 0 } #cipa ul.menu li::before { display: none; } @media (max-width:630px) { #cipa ul.menu { padding: 0; margin: 0; display:initial; justify-content:left; align-items:center; list-style:none; text-align:left; } #cipa ul.menu li{ border-bottom:none; border-top:none; } #cipa ul.menu li:first-child{ border-top:1px solid #7ab793; } #cipa ul.menu li:last-child{ border-bottom:1px solid #7ab793; } #cipa ul.menu li a{ float:none; display: block } }