/* ============================== Project Name: Clínica Pedro Cavalcanti Description: Slicer: Fernando Aureliano Designer: Kênia castro ===============================*/ //============================ Font Auxiliar @font: 'Museo300', serif; @font-face { font-family: 'Museo300'; src: url('../fonts/museo300-regular-webfont.eot'); src: url('../fonts/museo300-regular-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/museo300-regular-webfont.woff') format('woff'), url('../fonts/museo300-regular-webfont.ttf') format('truetype'), url('../fonts/museo300-regular-webfont.svg#Museo300') format('svg'); font-weight: normal; font-style: normal; } //============================ Colors @bg: #fff; @links: #e77700; //============================ Libraries @import "libs/css3"; @import "libs/noGrid"; @import "libs/grid"; //============================ Code a { color: #333; /*.animate;*/ &:hover { color: #999; } } header{ background: #b4b1a0 url(../img/header/rotator.php) no-repeat center top; height: 289px; //============================ Logo h1{ float: left; margin: 50px 0 95px 0; } section{ .container; .etiqueta{ float: left; height: 50px; width: 155px; text-indent: -9000px; .animate(); &:hover{ margin-top: 5px; } } .marcacaoOnline{ background: url(../img/marcacaoOnline.gif) no-repeat left top; margin-left: 100px; } .unidadesAtendimento{ background: url(../img/unidadesAtendimento.gif) no-repeat left top; margin-left: 3px; } nav{ clear: both; margin-top: 100px; height: 35px; background: #ffbc0c; a{ float: left; text-transform: uppercase; font-size: 11px; color: #000; padding: 10px 10px 0 10px; &:hover{ border-top: 5px solid #ffd900; margin-top: -5px; color: #000!important; } } .current_page_item a { border-top: 5px solid #ffd900; margin-top: -5px; } .search{ background: #e89e00 url(../img/lupaBusca.gif) no-repeat left 1px; width: 163px; height: 25px; margin: 5px 110px 0 -290px; float: right; input{ border: none; background: none; padding: 5px 30px 0 10px; color: #fff; font-family: 'Droid Serif', Arial, serif; font-style: italic; font-size: 12px; } } .redesSociais{ width: 100px; float: right; a{ height: 15px; padding: 7px 3px; &:hover{ padding: 3px; } } } } } } //===================================================== Vitrine .vitrine{ overflow: hidden; background: #b4b1a0; section{ .container; position: relative; overflow: visible; height: 210px; background: #db7a2f url(../img/bgVitrine.jpg) repeat-x left top; } h4{ padding: 20px; line-height: 24px; a{ font-family: @font; font-size: 32px; color: #fff; } } p{ color: #333333; padding: 0 20px; font-size: 12px; margin-bottom: 20px; } .imgVitrine{ width: 332px; height: 177px; padding: 20px; float: left; .etiquetaImgVitrine{ a{ position: absolute; margin: 120px 0; padding: 10px 20px; font-family: @font; font-size: 20px; text-transform: uppercase; background: transparent url(../img/bgTransparencia.png); color: #e36e1b; } } } a.leiaMais{ font-family: 'Droid Serif', serif; font-size: 16px; font-style: italic; color: #fff; background: url(../img/setaBranca.png) no-repeat right 2px; padding: 3px 30px 10px 0; .animate; &:hover{ .opacity(0.8); padding-left: 5px; } } #vitrine{ overflow: hidden!important; span { width: 980px!important; } } #btVoltar{ background: url(../img/voltarEsquerda.png) no-repeat right top; width: 33px; height: 84px; float: left; margin: 60px -33px; text-indent: -9000px; } #btAvancar{ background: url(../img/avancarDireita.png) no-repeat right top; width: 34px; height: 84px; float: right; margin: -160px -33px; text-indent: -9000px; position: absolute; right: 0; } } //=================================================================== Serviços .servicos{ p{ font-size: 13px; color: #333333; line-height: 18px; margin-bottom: 10px; } article{ ul{ margin-top: 20px; li{ display:list-item; list-style-position: inside; list-style-image: url(../img/marcador.gif); font-size: 12px; margin-left: 16px; margin-bottom: 8px; padding: 0 0 0 0px; color:#333333; a{ text-decoration: underline; } } .clock{ list-style-image: url(../img/icon_clock.gif); color: #78776B; margin: 5px 0 0 0; padding: 0; } .mapa{ float: left; border: solid 1px #D9D8C4; padding: 3px; } } h4{ font-family: 'Droid Serif', serif; font-style: italic; font-size: 18px; color: @links; margin: 30px 0 10px 0; } .section p strong { font-family: Arial; font-size: 14px; color: #333333; font-weight: 800; } .fraseDestaque{ font-size: 26px; font-family: 'Droid Serif', serif; font-style: italic; line-height: 24px; color: #999; padding-top: 20px; } .destaque{ font-size: 26px; font-family: 'Droid Serif', serif; font-style: italic; line-height: 24px; color: #999; margin: 10px 0 10px 0; } .boxmapa{ border:1px solid #DCDBD7; padding: 5px; float: left; margin: 0 25px 10px 0px; } } .servicosSidebar{ a{ border-bottom: 1px dotted #ddd; display: block; padding: 13px 0; font-family: @font; font-size: 26px; color: #999; .animate; &:hover{ color: @links; } } img{ margin: -36px 0; float: right; .animate; &:hover{ padding-right: 10px; } } } } //=================================================================== Página #main{ background: #fff url(../img/bgMain.gif) repeat-x left top; border-top: 1px solid #fff; h3{ font-family: @font; font-size: 24px; margin-bottom: 10px; padding: 8px; } h2{ background: #e77021; float: left; padding: 15px; font-family: @font; font-size: 32px; color: #fff; } .content{ .container; height: auto; overflow: hidden; article { .box(670px, 20px 0 20px 0); clear: both; float: left; } .widthFull { width: 100%; } } aside{ float: left; margin: 40px 0 0 60px; float: left; width: 250px; h3{ font-family: @font; font-size: 28px; margin-bottom: 10px; } } .paginacao{ clear: both; float: left; width: 300px; margin-left: 200px; font-family: 'Droid Serif', serif; font-style: italic; a{ color: #999; font-size: 14px; .animate; &:hover{ color: @links; } } .btAnterior{ background: url(../img/setaAmarelaLeft.gif) no-repeat left 2px; padding: 3px 0 3px 25px; float: left; } .btProximo{ background: url(../img/setaAmarela.gif) no-repeat right 2px; padding: 3px 25px 3px 0; float: right; } } } .boxequipe { overflow: hidden!important; ul{ li{ margin-bottom: 5px; } } .boxmapa{ border:1px solid #DCDBD7; padding: 5px; } } //=================================================================== Acontece .acontece { section { float: left; clear: both; margin-bottom: 60px; } .listagem { a { color: @links; font-size: 20px; display: block; height: 40px; font-weight:bold; margin-bottom: 10px; &:hover{ text-decoration: underline; } } } article{ .box(570px, 40px 0); margin: 0; float: left; .data{ width: 30px; height: 30px; float: left; padding-top: 5px; clear: both; .dia{ color: #666; font-family: Arial; font-size: 24px; float: left; } .mes{ color: #999; font-family: Droid, serif; font-style: italic; font-size: 14px; padding-left: 3px; } } p{ border-left: 1px dotted #666; margin-left: 40px; padding-left: 15px; a{ font-size: 12px; margin: 0; padding: 0; height: auto; float: none; display: inline; color: @links; &:hover{ text-decoration: underline; } } } h3{ color: @links; font-family: Arial, sans-serif; border-left: 1px dotted #999; margin-left: 30px; font-size: 30px!important; padding: 10px 15px; line-height: 30px; } section{ margin-top: 20px; p{ border: none; margin: 0; padding: 0; font-size: 13px; line-height: 20px; margin-bottom: 10px; strong{ font-weight: 800; font-size: 14px; color: #333; margin: 15px 0 8px 0; } } h4 { font-size: 18px; font-weight: 600; color: #625A5A; margin: 20px 0 10px 0; } img{ border: 1px solid #ddd; padding: 5px; float: left; margin: 0 20px 20px 0 } #fotos{ img{ border: none; padding: 0; margin-left: -25px; } } #voltarFoto, #avancarFoto{ img{ border: none; } } } .albumFotos{ width: 510px; } } .blogSidebar{ margin-top: -45px; a{ font-size: 14px; color: #333; font-weight: bold; .animate; &:hover{ color: @links; } } li{ border-bottom: 1px dotted #ddd; padding: 8px 0; } } } //=================================================================== Blog .blog{ section{ float: left; clear: both; } h2{ margin-bottom: 30px; } h3{ a{ font-family: @font; font-size: 30px; color: @links; margin-bottom: 10px; float: left; width: 100%; padding-top: 3px; line-height: 30px; } } h4 { font-size: 16px; font-weight: 600; color: #FFA903; margin: 20px 0 10px 0; } .boxinfo { /* float: left; */ width: 275px; text-align: center; margin: 10px 0 0 0; display: block; clear: both; /* min-width: 350px; */ background: #eeeeed; padding: 8px; margin-bottom: 10px; .data { font-family: Droid, serif; font-style: italic; font-size: 12px; color: #333; } .numeroComentarios { background: url(../img/iconComentarios.gif) no-repeat left 8px; margin-left: 20px; padding: 8px 8px 8px 20px; .animate; a{ color: #333; &:hover{ color: @links; } } } } p{ font-size: 14px; line-height: 22px; color: #333333; margin-bottom: 15px; strong { font-family: Arial; font-size: 14px; color: #333333; font-weight: 800; } span.autor{ font-size: 12px; color: #979797; font-weight: bold; font-style: italic; } } .tags{ clear: both; float: left; width: 100%; padding-top: 10px; margin-top: 30px; border-top: 1px dotted #ddd; div{ margin-bottom: 30px; } p{ color: #ffbc0c; font-weight: bold; float: left; margin-right: 10px; } a{ font-family: 'Droid Serif', serif; font-style:normal; color: #666; font-style: italic; float: left; padding: 2px 5px 0 0; .animate; &:hover{ color: @links; text-decoration: underline; } } } .compartilhe{ font-family: 'Droid Serif', serif; font-size: 16px; font-style: italic; color: #999; margin: 20px 0 10px 0; float: left; clear: both; } aside{ float: left; margin: -100px 0 0 60px; float: left; width: 250px; .categorias { ul + li { /* display: none; */ } a{ background: url(../img/setaAmarela.gif) no-repeat left 6px; padding: 8px 0 8px 25px; border-bottom: 1px dotted #999; color: #999; font-size: 16px; display: block; width: 220px; .animate; &:hover{ color: @links; padding-left: 30px; } } } .nuvemtags{ margin-top: 40px; border: none; margin-bottom: 40px; div{ width: 200px; background: #f5f5f5; padding: 20px; /* height: 150px; */ } a{ color: @links; margin: 20px 0; &:hover{ text-decoration: underline; } } } .flickrblog{ /*margin-top: 40px;*/ img{ border: 1px solid #ddd; padding: 2px; margin: 5px 10px 5px 0; .animate; &:hover{ border: 1px solid @links; } } .flickr{ width: 350px; } } .arquivo{ margin-top: 40px; } } } #basicuse { width: 350px!important; li { float: left; margin-right: 10px; } .thumbs{ } } /*** PARA ALINHAMENTO IMAGENS NO EDITOR WORDPRESS ***/ img.centered { display: block; margin-left: auto; margin-right: auto; } img.alignright { padding: 4px; margin: 0 0 2px 7px; display: inline; } img.alignleft { padding: 4px; margin: 0 7px 2px 0; display: inline; } .alignright { float: right; } .alignleft { float: left; } //=============================================================== Página Inicial .boxIndex{ .box(240px, 50px 15px); float: left; padding-left: 50px; } .servicos{ background: url(../img/iconServicos.png) no-repeat left top; } .exames{ background: url(../img/iconExames.png) no-repeat left top; } .equipe{ background: url(../img/iconEquipe.png) no-repeat left top; } hr{ clear: both; margin-bottom: 40px; border:none; border-bottom: 1px dotted #999; } a.saibaMais{ background: url(../img/setaCinza.gif) no-repeat left 2px; padding: 2px 0 5px 25px; font-family: 'Droid Serif', serif; font-size: 14px; font-style: italic; color: #666; float: left; margin-top: 10px; .animate; &:hover{ color: #ff770c; } } a.vejaMais{ background: url(../img/maisAmarelo.gif) no-repeat left 2px; padding: 2px 0 5px 25px; font-family: 'Droid Serif', serif; font-size: 14px; font-style: italic; color: #666; float: left; margin-top: 20px; .animate; &:hover{ color: #ff770c; } } .index{ .acontece{ .box(240px, 0 15px 0 0); float: left; .data{ width: 30px; height: 30px; float: left; padding-top: 5px; clear: both; .dia{ color: #666; font-family: @font; font-size: 24px; float: left; clear: both; } .mes{ color: #999; font-family: @font; font-size: 14px; } } p{ margin: 0 0 10px 35px; padding-left: 15px; border-left: 1px dotted #666; a{ color: @links; font-size: 13px; &:hover{ text-decoration: underline; } } } } .blogSaude{ .box(580px, 0 0 40px 120px); float: left; .imgPost{ float: left; margin-right: 5px; } .post{ background: #f5f5f5; padding: 8px; float: left; width: 355px; margin-bottom: 8px; min-height: 60px; a{ font-size: 14px; color: #333; font-weight: bold; letter-spacing: -1px; .animate; &:hover{ color: #ff770c; } } } } } .depoimentos{ background: url(../img/bgDepoimentos.gif); clear: both; padding: 20px 0; margin-bottom: 20px; margin-top: 70px; section{ margin: 0; /* .twitters{ .box(630px, 0px 0); float: left; background: url(../img/linhaTwittersFooter.png) no-repeat 60px top; img{ float: left; } div{ width: 240px; margin: 0 0 0px 8px; padding: 0px 10px; float: left; p{ color: #000; font-family: 'Droid Serif', serif; font-style: italic; font-size: 14px; a { text-decoration: underline; color: #DD7107; .animate; &:hover{ color: #fff; } } } .data{ color: #E6851B; clear: both; float: left; } } a.siganos{ color: #fff; float: left; font-family: 'Droid Serif', serif; font-size: 14px; font-style: italic; .animate; &:hover{ margin-right: 10px; } } } */ .facebook{ float: left; width: 250px; height: 200px; margin-left: 30px; } .container; height: 100px; h3{ margin-top: -50px; color: #999; position: absolute; } /* p{ background: url(../img/aspasDepoimentos.png) no-repeat left top; padding-left: 25px; font-size: 12px; } a{ color: @links; float: left; padding: 10px 0 10px 25px; clear: both; } */ section{ .box(600px); height: auto; float: left; margin-right: 10px; } } } /* Twitter Index */ .twitters{ width: 400px; float: left; background: url(../img/linhaTwittersFooter.png) no-repeat 60px top; img{ float: left; } div{ width: 240px; margin: 0 0 0px 8px; padding: 0px 10px; float: left; } } .twitterTimeline{ float: left; background: url(../img/linhaTwittersFooter.png) no-repeat 60px top; margin: 0; .twit{ margin: 0; padding: 0; } } .siganos{ color: #666666; float: left; font-family: 'Droid Serif', serif; font-size: 12px; font-style: italic; margin-left: 20px; a{ color: #666666; .animate; &:hover{ color: #fff; } } } .twitNavi, .twitHeader, .twitUser { display: none!important; } .twitBody { float: left; width: 670px; margin: 0 0px 0 0; } .twitEntry { width: 240px; margin: 0 20px 5px 0px; padding: 0px 10px; float: left; font-size: color: #000; font-family: 'Droid Serif', serif; font-style: italic; font-size: 14px; a { text-decoration: underline; color: #DD7107; .animate; &:hover{ color: #fff; } } } /* Album de fotos */ #dm_taglines_container { display: none; } .albumFotos{ width: 480px; height: 650px; float: left; margin-right: 40px; h3{ padding-bottom: 10px; } #voltarFoto{ float: left; margin: 140px 5px 0 0; } #avancarFoto{ margin: 140px 0 0 5px; float: right; } div{ border-top: 1px dotted #999; padding-top: 10px; clar: both; margin-top: 10px; .dataFoto{ color: @links; font-family: 'Droid Serif', serif; font-style: italic; font-size: 14px; clear: both; float: left; } a{ clear: both; float: left; font-size: 16px; font-weight: bold; letter-spacing: -1px; padding-top: 5px; color: #333; .animate; &:hover{ color: @links; } } } } //=============================================================== Footer footer{ background: #ff7305 url(../img/bgFooter.jpg) repeat-x left top; height: 225px; margin-top: 60px; clear: both; section{ .container; .contatos{ .box(320px); padding-top: 50px; float: left; .titulo{ font-family: @font; font-size: 22px; margin-bottom: 10px; color: #333; } .iconTelefone{ float: left; margin-right: 10px; } .numeroTelefone{ font-family: @font; color: #fff; font-size: 18px; margin-left: 50px; padding-bottom: 5px; .urgencia{ color: #FFD901; } span{ font-family: 'Droid Serif', serif; color: #ffcc00; margin-left: 10px; font-style: italic; } } a{ color: #333; margin: 10px 0 0 50px; float: left; .animate; &:hover{ color: #fff; } } } .redesSociais{ .box(130px, 50px 0px 0 130px); float: left; a{ margin-right: 5px; .animate; &:hover{ .opacity(0.8); } } h4{ color: #FFDD00; font-family: @font; font-size: 22px; padding: 5px 0; } p{ color: #333; } } .unidades{ .box(280px, 50px 0px 0 80px); float: left; a{ margin-right: 5px; .animate; &:hover{ .opacity(0.8); } } h4{ color: #FFDD00; font-family: @font; font-size: 22px; padding: 5px 0; } p{ color: #333; line-height: 16px; } } .twitters{ .box(370px, 40px 0); float: left; background: url(../img/linhaTwittersFooter.png) no-repeat 60px top; img{ float: left; } div{ margin: 0 0 5px 90px; background: url(../img/bgTwittersFooter.gif); padding: 8px 10px; p{ color: #000; a{ color: #ffcc00; .animate; &:hover{ color: #fff; } } } .data{ color: #ffcc00; } } a.siganos{ color: #fff; float: right; font-family: 'Droid Serif', serif; font-size: 14px; font-style: italic; .animate; &:hover{ margin-right: 10px; } } } } a.assinatura{ clear: both; float: right; margin-right: 25px; margin-bottom: 10px; color: #333; } } //=================================================================== paginação .navigation { margin: 50px 0 0 0; float: left; clear: both; a { background-color: none!important; border: none; font-size: 14px; } .wp-paginate { margin: 0; display: inline; font-family: 'Droid Serif', Arial, serif; font-size: 14px; font-style: italic; color:#666; a { height: none; background: none; } .current { padding-top: 5px; border: none; font-size: 14px; text-decoration: underline; color: #E77700; } .page { background: none!important; border: none; } .next{ background: url(../img/setaAmarela.gif) no-repeat right 2px; padding: 3px 25px 3px 0; float: right; } li { float: left; display: inline; margin: 0 8px 0 8px; height: none; a { color: #666; background-color: none!important; border: none; font-size: 14px; } } } } .videos { overflow: hidden; float: left; width: 500px; margin-right: 10px; /* min-height: 500px; */ h3{ padding-bottom: 10px; } a.saibaMais{ float: left!important; } } .flickr { overflow: hidden; float: left; width: 400px; margin-right: 60px; /* min-height: 500px; */ h3{ padding-bottom: 10px; } ul { overflow: hidden; li { float: left; display: inline; margin: 0 25px 14px 0; } } } .share{ clear: both; width: 600px; margin: 10px 0 0px 0; } .addthis_toolbox { /* padding-top: 20px; */ /* float: right; */ }