/* Theme Name: News Luan Santana (Uni) Description: Theme developed by Maria Nunes and Gustavo Franco Version: 2022.2 Author: Gustavo */ @import url('https://fonts.googleapis.com/css2?family=Fira+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap'); /* Site body */ body {margin: 0px; padding: 0px; background: #373737; font-size: 12px; color: #737373; font-family: "Fira Sans"; line-height: 2;} /* Links */ a {color: #e07272; font-weight: bolder;text-decoration: none; -webkit-transition:All 0.3s ease-in-out; -moz-transition:All 0.3s ease-in-out; -o-transition:All 0.3s ease-in-out;} a:hover, a:active {color:#f52393; text-decoration: none; -webkit-transition:All 0.3s ease-in-out; -moz-transition:All 0.3s ease-in-out; -o-transition:All 0.3s ease-in-out;} a img{border-radius: 10px; margin: 5px; filter: grayscale(0%); -webkit-transition:All 0.3s ease-in-out; -moz-transition:All 0.3s ease-in-out; -o-transition:All 0.3s ease-in-out;} a:hover img{ opacity: 0.8; -webkit-transition:All 0.3s ease-in-out; -moz-transition:All 0.3s ease-in-out; -o-transition:All 0.3s ease-in-out;} /* Formatacao de texto */ i { color: #adadad; font-style: italic; } em { color: #adadad; font-style: italic; } b, strong {color: #f7a1a1;} u {color: #f7a1a1; border-bottom: 2px solid #2d3a77; padding-bottom: 1px; text-decoration:none; } /* Wordpress */ .alignleft {float: left; text-align: left; margin-right: 10px;} .alignright {float: right; text-align: right; margin-left: 10px;} .aligncenter {min-width: 50px; text-align: center; margin: 10px auto; display: block; float: none;} /* Blockquote */ blockquote {padding: 20px 30px; position: relative; margin-top: 20px; margin-left: 0px; margin-right: 0px; margin-bottom: 20px; background: #1f1f1f; color: #595959; border: 0px; border: 1px solid rgba(0,0,0,0.05);} blockquote::before {content: '❝';font-size: 28px;font-family: Times New Roman;padding-top: 10px;color: #fff;background: #ffc895;width: 30px;height: 20px;border-radius: 50%;position: absolute;left: 20px;top: -10px;text-align: center;display: flex;align-content: center;align-items: center;justify-content: center;} /* ------------------- Specifics ------------------- */ /************ Just a transition guide ******************/ #logo, #logo:hover, #menu li a, #menu li:hover a, #menu li a:hover, #menu li, #menu li:hover,#post #img, #post #img:hover, #post #img::before, #post #img:hover::before, #post #conteudo, #post:hover #conteudo, #post #conteudo #titulo, #post:hover #conteudo #titulo, #post:hover #resumo, #post #resumo, #post:hover #img, #slide #img, #slide:hover #img, #slide li #conteudo #categoria a, #slide:hover li #conteudo #categoria a, #slide li #conteudo #titulo, #slide:hover li #conteudo #titulo, #next, #prev, #next:hover, #prev:hover, #footer #footer_sec #right #logof, #footer #footer_sec #right #logof:hover, #redes #tt, #redes #it, #redes #fb, #redes #yt, #redes #sp, #redes #tt:hover, #redes #it:hover, #redes #fb:hover, #redes #yt:hover, #redes #sp:hover, #galeria #areag #img, #galeria #areag #img:hover, #thumb #img::before, #thumb:hover #img::before, #thumb #img, #thumb:hover #img, #thumb #conteudo #titulo, #thumb:hover #conteudo #titulo, #quatro, #quatro:hover {-webkit-transition:All 0.3s ease-in-out; -moz-transition:All 0.3s ease-in-out; -o-transition:All 0.3s ease-in-out;} /* Header */ #header {width: 100%; height: 990px; position: relative; display: block; background: url('img/header.png')no-repeat center bottom;} #header2 {width: 1380px; height: 310px; position: relative; margin: 0px auto; display: flex; align-content: center; align-items: center; justify-content: space-between; justify-items: space-between;} /* Logo */ #logo {width: 445px; height: 100%; background: url('img/logo.png')no-repeat center; display: flex;} #logo:hover {filter:hue-rotate(360deg); } /* Menu */ #menu {width: 935px; height: 100%; display: flex; align-content: center; align-items: center;} #menu .menu-menu-1-container, #menu .menu-news-luan-santana-container {width: 100%; height: 70px; display flex; justify-content: center; align-content: center; align-items: center;} #menu ul {width: 100%; margin: 0px auto; padding: 0px; list-style: none; display: flex; justify-content: space-between; } #menu li { width: 175px; height: 70px; display: flex; background: #2a2a2a; display: flex; justify-content: center; justify-items: center; align-content: center; align-items: center;} #menu a {font-size: 13px; font-weight: 400; font-family: Fira Sans; color: #fff; text-transform: uppercase; padding: 20px; letter-spacing: 1px;} #menu li:hover {background: #212121;} #menu li:hover a, #menu li a:hover {color: #e7597e;} #menu .home, #menu .current-menu-item a, #menu .current_page_item a {color: #ffbc81; } #menu .home:hover, #menu .current-menu-item a:hover, #menu .current_page_item a:hover {color: #fff; } #menu .menu-menu-principal-container {width: 100%;} /* Ads */ #anun {width: 1380px; height: 145px; position: relative; display: flex; justify-content: center; justify-items: center; align-content: center; align-items: center; background: #2a2a2a url('img/adsbg.png')no-repeat right 50px center; margin: 30px auto;} /* Area geral */ #geralarea {width: 1380px; display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0px auto; } /* Lançamento */ #lancamento {width: 335px; height: 350px; position: relative; background: url('img/bglanca.png')no-repeat center top; background-size: cover; padding: 60px; padding-top: 120px; padding-bottom: 25px; text-align: center; font-size: 14px; font-style: italic; line-height: 1; color: #fff; margin-bottom: 20px;} #lancamento::before {content:''; position: absolute; left: 0px; top: 20px; right: 0px; height: 100px; background: url('img/lancamento.png')no-repeat center; } #lancamento p b, #lancamento p strong {color: #fff;} #lancamento p {margin: 0px;} #lancamento .textwidget { margin: 0px; width: 100%; height: 100%;} #lancamento a img {border-radius: 0px; max-width: 100%; max-height: 100%; border: 10px solid #525252; margin-bottom: 20px;} #lancamento a:hover img {border: 10px solid #151515;} /* Video */ #video {width: 905px; height: 385px; position: relative; padding-top: 105px; margin-bottom: 25px;} #video #barra { height: 95px; position: absolute; left: 0px; top: 0px; right: 0px; background: #2a2a2a; padding-left: 100px; display: flex; justify-content: center; justify-items: center; align-content: center; align-items: center; text-align: center; font-size: 16px; text-transform: uppercase; color: #fff; letter-spacing: 2px; font-weight: 400;} #video #barra::before { content: ''; position: absolute; left: 100px; width: 100px;top: 0px; bottom: 0px; background: url('img/yt.png')no-repeat center;} #video #barra b {color: #fff; font-weight: bold; margin: 0 5px;} #video #barra red {color: #dc2e2e; font-weight: bold; margin: 0 5px;} #video .textwidget, #video .textwidget p { margin: 0px; width: 100%; height: 100%;} #video iframe {max-width: 100%; max-height: 100%; width: 100%; height: 100%;} /* Slide */ #slide {width: 700px; height: 415px; background: #000; position: relative; margin-bottom: 18px; overflow: hidden;} #slide li {width: 700px; height: 415px; background: #000; position: relative; list-style: none; overflow: hidden;} #slide li #img {position: absolute; left: 0px; top: 0px; right: -100px; bottom: 0px; z-index: 55;} #slide li #img::before {position: absolute; left: 0px; top: 0px; right: 50px; bottom: 0px; content:'';background: rgb(4,4,4); background: linear-gradient(90deg, rgba(4,4,4,1) 28%, rgba(4,4,4,0) 70%); opacity: 0.9; z-index: 56;} #slide li #conteudo {position: absolute; left: 50px; top: 25px; bottom: 65px; width: 385px; z-index: 88; display: flex; align-content: center; align-items: center; flex-wrap: wrap;} #slide li #conteudo #categoria { margin-bottom: 22px; display: block;} #slide li #conteudo #categoria a { padding: 10px 20px; background: #e07272; border-radius: 50px; color: #a94545;} #slide li #conteudo #categoria a:hover {background: #ffc895; color: #cc9461;} #slide li #conteudo #titulo {font-size: 28px; font-weight: 800; font-style: italic; color: #fff; line-height: 1.2; margin: 10px 0; display: block; text-transform: uppercase; display: block; margin: 10px 0px; } #slide li #conteudo #button {position: relative; display: inline-block; padding: 10px 20px; padding-left: 0px; font-size: 10px; color: #81ffec; font-weight: normal;} #slide li #conteudo #button::after {content:''; background: url('img/link.png')no-repeat center; width: 28px; position: absolute; right: -14px; bottom: 0px; top: 0px; } #slide:hover #img {opacity: 0.8; right: -150px;} #slide:hover li #conteudo #categoria a {background: #ffc895; color: #cc9461;} #slide:hover li #conteudo #titulo {color: #f5b8b8;} #next {width: 31px; height: 31px; position: absolute; left: 85px; bottom: 50px; cursor: pointer; background: url('img/next.png')no-repeat center; background-size: contain; z-index: 999999;} #prev {width: 31px; height: 31px; position: absolute; left: 46px; bottom: 50px; cursor: pointer; background: url('img/prev.png')no-repeat center; background-size: contain; z-index: 999999;} #next:hover, #prev:hover {opacity: 0.5;} /* Posts */ #post {width: 333px; height: 415px; position: relative; margin-bottom: 18px; background: #000; overflow: hidden;} #post:nth-child(4), #post:nth-child(5) {width: 325px;} #post #img {position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; z-index: 55;} #post #img::before {position: absolute; left: 0px; top: 30%; right: 0px; bottom: 0px; content:''; background: rgb(4,4,4); background: linear-gradient(0deg, rgba(4,4,4,1) 0%, rgba(4,4,4,0) 100%); opacity: 0.8; z-index: 56;} #post:hover #img {transform: scale(1.1,1.1); opacity: 0.6;} #post #img:hover::before {opacity: 0.9;} #post #conteudo {position: absolute; left: 20px; right: 20px; bottom: 20px; z-index: 66; text-align: center;} #post:hover #conteudo {bottom: 95px;} #post #conteudo #titulo {font-size: 18px; font-weight: 800; font-style: italic; color: #fff; text-align: center; line-height: 1.2; margin: 10px 0; display: block;} #post #conteudo #data {color: #ffc895; font-weight: 500; font-size: 12px;} #post #conteudo #categoria { margin-bottom: 22px; display: block;} #post #conteudo #categoria a { padding: 10px 20px; background: #e07272; border-radius: 50px; color: #a94545;} #post #conteudo #categoria a:hover {background: #ffc895; color: #cc9461;} #post:hover #conteudo #titulo {color: #f5b8b8;} #post #resumo {position: absolute; left: 20px; bottom: -80px; right: 20px; color: #fff; opacity: 0.5; text-align: justify; z-index: 77;} #post:hover #resumo {bottom: 20px;} /* Twitter */ #twitter {width: calc(700px - 60px); height: calc(350px - 60px); background: #1089ce; color: #fff; overflow: hidden; padding: 30px; margin-bottom: 25px; position: relative; font-style: italic; font-size: 16px; line-height: 2; font-weight: 300;} #twitter::after {content: 'Últimas atualizações do nosso twitter'; position: absolute; left: 30px; bottom: 30px; font-size: 10px; color: #fff; text-transform: uppercase; letter-spacing: 5px; font-style: none !important; font-weight: 500 !important;} #twitter a {color: #7ed0ff;} #twitter a:hover {color: #fff; opacity: 0.2;} /* Instagram */ #instagram {width: 665px; height: 350px; background: #fff url('img/bginsta.png')no-repeat right top; background-size: cover; margin-bottom: 25px; position: relative;} #instagram::before {content:''; width: 415px; height: 35px; position: absolute; left: 30px; top: 20px; background: url('img/instat.png')no-repeat center left;} #instagram #areaf {position: absolute; left: 30px; bottom: 15px; top: 70px; right: 230px; } #instagram #link {position: absolute; right: 55px; bottom: 15px; padding: 15px 25px; background: #f81c97; border-radius: 50px; color: #fff; line-height: 1; font-size: 16px;} #instagram #link:hover {background: #000;} /* Galeria */ #galeria {width: 100%; height: 415px; background: #2a2a2a url('img/galeria.png')no-repeat left 20px bottom 20px; position: relative;} #galeria::before {content:''; width: 370px; height: 58px; background: url('img/galeriat.png')no-repeat center; position: absolute; top: 45px; left: 50px;} #galeria #barra {width: 835px; height: 80px; background: #fff; display: flex; justify-content: center; justify-items: center; align-content: center; align-items: center; position: absolute; right: 35px; top: 35px;} #galeria #barra a {font-size: 16px; margin: 0 20px; color: #9f9f9f; font-weight: 400; text-transform: uppercase; letter-spacing: 2px;} #galeria #barra a:hover { font-weight: 800;} #galeria #areag {position: absolute; left: 160px; right: 30px; bottom: 10px; top: 145px; display: flex; justify-content: space-between; justify-items: space-between; } #galeria #areag #img {list-style: none; width: 207px; height: 238px; border: 10px solid #373737;} #galeria #areag #img:hover {border: 10px solid #fff; opacity: 0.5;} /* Footer */ #footer { width: 100%; background: url('img/footerbg.png')no-repeat center top; padding: 110px 0px; position: relative; font-size: 16px; font-family: "Fira Sans"; font-weight: 400; line-height: 1.563; display: block; margin-top: 80px; color: #9d9d9d;} #footer #footer_sec {width: 1200px; display: flex; justify-content: space-between; justify-items: space-between; align-content: center; align-items: center; margin: 0px auto;} #footer #footer_sec #left {width: 675px; height: auto; position: relative; font-size: 22px;} #footer #footer_sec #right {width: 560px; height: 100%; position: relative; display: flex; flex-wrap: wrap; justify-content: center; justify-items: center; align-content: center; align-items: center;} #footer #footer_sec #right #logof {width: 100%; height: 140px; background: url('img/logofooter.png')no-repeat center; } #footer #footer_sec #right #logof:hover {filter:hue-rotate(360deg); } #redes {width: 100%; height: 105px; display: flex; justify-content: center; justify-items: center;} #redes #tt {width: 68px; height: 68px; display: flex; background: url('img/tti.png')no-repeat center; background-size: contain; margin: 0px 5px;} #redes #it {width: 68px; height: 68px; display: flex; background: url('img/igi.png')no-repeat center; background-size: contain; margin: 0px 5px;} #redes #fb {width: 68px; height: 68px; display: flex; background: url('img/fbi.png')no-repeat center; background-size: contain; margin: 0px 5px;} #redes #yt {width: 68px; height: 68px; display: flex; background: url('img/yti.png')no-repeat center; background-size: contain; margin: 0px 5px;} #redes #sp {width: 68px; height: 68px; display: flex; background: url('img/spti.png')no-repeat center; background-size: contain; margin: 0px 5px;} #redes #tt:hover, #redes #it:hover, #redes #fb:hover, #redes #yt:hover, #redes #sp:hover {transform: rotate(45deg) scale(0.95,0.95);} #footer b {color: #9d9d9d;} #footer a, #footer strong, #footer b{ font-weight: 800; } #footer a{ font-weight: 400; color: #df7970; } #footer a:hover {color: #404040;} #footer span { margin: 0px 10px;} /* Busca */ #footer_sec form {position: relative;} #search {width: 100%; display: flex; position: relative;} #search [type="text"] { outline: none; width: 240px; font-family: Fira Sans; font-weight: 400; font-size: 11px; color: #9f9f9f; background: #fff; border: 0px; padding: 18px; margin-left: 0px; margin-top: 10px; position: relative;} input#searchsubmit { cursor: pointer;height: 30px;width: 30px;top: 18px;left: 240px;right: auto;background: url('img/search.png')no-repeat center;color: transparent;position: absolute;border: 0px;font-family: Fira Sans;text-transform: uppercase;font-size: 11px;} /* Post area */ #post_a {width: 860px; float: left; } /* Thumb */ #thumb {width: 100%; height: 415px; background: #000; position: relative; margin-bottom: 18px; overflow: hidden;} #thumb #img {position: absolute; left: 150px; top: 0px; right: -180px; bottom: 0px; z-index: 55;} #thumb #img::before {position: absolute; left: -150px; top: 0px; right: 50px; bottom: 0px; content:'';background: rgb(4,4,4); background: linear-gradient(90deg, rgba(4,4,4,1) 18%, rgba(4,4,4,0) 80%); opacity: 0.9; z-index: 56;} #thumb #conteudo {position: absolute; left: 50px; top: 25px; bottom: 25px; width: 445px; z-index: 88; display: flex; align-content: center; align-items: center; flex-wrap: wrap;} #thumb #conteudo #categoria a:hover {background: #ffc895; color: #cc9461;} #thumb #conteudo #titulo {font-size: 36px; font-weight: 800; font-style: italic; color: #fff; line-height: 1.2; margin: 10px 0; display: block; text-transform: uppercase; display: block; margin: 10px 0px; } #thumb #conteudo #data {color: #ffc895; font-weight: 500; font-size: 12px; letter-spacing: 1px;} #thumb #conteudo #autor {color: #81ffec; font-weight: 500; font-size: 10px; letter-spacing: 2px;} #thumb:hover #img {right: -140px; opacity: 0.6;} #thumb:hover #img::before {opacity: 1;} #thumb:hover #conteudo #titulo {color: #e07272;} /* Conteudo */ #txt {padding: 22px 30px; text-align: justify; background: #181818; font-size: 14px; line-height: 2; } #txt li {list-style: none; position: relative;} #txt li::before {content: '●'; color: #81ffec; position: absolute; left: -20px;} #txt iframe {margin: 0px auto !important; max-width: 100% !important;} /* Extra */ #extra {padding: 22px 30px; text-align: justify; background: #181818; font-size: 14px; line-height: 2; display: flex; justify-content: space-between; background: #e07272; color: rgba(0,0,0,0.4); font-size: 12px;} #extra a {color: #fff; margin-left: 2px;} #extra a:hover {opacity: 0.5;} /* 404 */ #quatro {width: 100%;height: 400px;display: flex;justify-content: center;justify-items: center;align-content: center;align-items: center;font-size: 500px;color: #fff;position: relative;margin: 20px 0px;} #quatro::before {content:'Página não encontrada;'; background: #2a2a2a; color: #696969; font-size: 18px; width: 800px; height: 70px; text-align: center; display: flex; justify-content: center; align-content: cennter; justify-items: center; align-items: center; text-transform: uppercase; letter-spacing: 2px; text-align: center; position: absolute; left: calc(50% - 400px); top: calc(50% - 35px); } #quatro:hover {filter: blur(10px);} #quatro:hover::before, #quatro::before:hover {filter: blur(0px);} /* Extra páginas */ #titulo_page {width: 100%; margin: 30px 0px; text-align: center; font-size: 36px; font-weight: 800; font-style: italic; color: #fff; line-height: 1.2; display: block; text-transform: uppercase; display: block; } #titulo_page:hover {color: #e07272;} /* Paginacao */ #pagination { width: 100%; text-align: center; font-size: 14px; min-width: 200px; display: inline; text-transform: uppercase; font-family: Fira Sans; color: rgba(0,0,0,0.3); font-weight: 400; margin-top: 5px; /* background: #fff; */ padding: 15px; border: 1px solid #222;} #pagination span, #pagination a { display: inline; padding:6px 9px 5px 9px; text-decoration:none; border-bottom: 0px dotted transparent; color: rgba(255,255,255,0.6); background: transparent; font-weight: 400;} #pagination span{color: rgba(255,255,255,0.2);} #pagination a:hover{ color: rgba(255,255,255,1);} #pagination .current { padding: 9px 13px;background: rgba(0,0,0,0.2);color: rgba(255,255,255,0.2);border-radius: 0px;} /* Sidebar */ #sidebar {width: 470px; float: right;} #sidearea { width: calc(100% - 40px); background: #333333; overflow: hidden; margin-bottom: 15px; display: block; padding: 15px 20px; position: relative; color: #888; padding-top: 80px; } #sidearea .flo-shcode-instgm-container a img {width: 100px; height: 100px;} #sidetitle1 {position: absolute; left: 0px; top: 0px; right: 0px; height: 60px; display: flex; align-content: center; align-items: center; background: #e07272; background-size: cover; font-size: 16px; font-family: "Fira Sans"; font-weight: bold; line-height: 1.2; color: #fff; padding-left: 25px; text-transform: uppercase; font-style: italic;} #sidetitle1::after {content: ''; width: 0;height: 0;border-style: solid;border-width: 12px 9px 0 9px;border-color: #e07272 transparent transparent transparent; position: absolute; left: 25px; bottom: -8px;} /* Page Titles */ h9 {display: block; padding: 20px; background: #fff; color: #ccc; font-size: 14px; font-family: Poppins; text-transform: uppercase; margin-bottom: 14px; position: relative; font-weight: 500;} h9::before {content: ''; width: 0; height: 0; border-style: solid; border-width: 12px 12px 0 12px; border-color: #fff transparent transparent transparent; position: absolute; bottom: -12px; left: calc(50% - 12px); } hr {border: 0px; border-top: 1px solid rgba(0,0,0,0.1);}