├── web ├── img │ ├── bg.jpg │ ├── linhas.png │ ├── logo.png │ ├── bg-sobre.jpg │ ├── bg-contato.jpg │ ├── bg-footer.jpg │ ├── bg-mobile.jpg │ ├── bg-produtos.jpg │ ├── bg-portfolio.jpg │ ├── equipe-bikcraft.jpg │ ├── portfolio │ │ ├── retro.jpg │ │ ├── esporte.jpg │ │ └── passeio.jpg │ ├── produtos │ │ ├── esporte.png │ │ ├── passeio.png │ │ ├── retro.png │ │ ├── bikcraft-retro-1.jpg │ │ ├── bikcraft-retro-2.jpg │ │ ├── bikcraft-esporte-1.jpg │ │ ├── bikcraft-esporte-2.jpg │ │ ├── bikcraft-passeio-1.jpg │ │ └── bikcraft-passeio-2.jpg │ ├── bikcraft-qualidade.png │ ├── endereco-bikcraft.jpg │ └── redes-sociais │ │ ├── twitter.png │ │ ├── facebook.png │ │ └── instagram.png ├── css │ ├── sobre.css │ ├── portfolio.css │ ├── reset.css │ ├── responsivo.css │ ├── contato.css │ ├── grid.css │ ├── produtos.css │ ├── style.css │ └── normalize.css ├── portfolio.html ├── contato.html ├── sobre.html ├── index.html └── produtos.html ├── planejamento ├── bikcraft_ai.pdf └── bikcraft_briefing.pdf └── wireframe └── bikcraft-wireframe.psd /web/img/bg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/bg.jpg -------------------------------------------------------------------------------- /web/img/linhas.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/linhas.png -------------------------------------------------------------------------------- /web/img/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/logo.png -------------------------------------------------------------------------------- /web/img/bg-sobre.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/bg-sobre.jpg -------------------------------------------------------------------------------- /web/img/bg-contato.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/bg-contato.jpg -------------------------------------------------------------------------------- /web/img/bg-footer.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/bg-footer.jpg -------------------------------------------------------------------------------- /web/img/bg-mobile.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/bg-mobile.jpg -------------------------------------------------------------------------------- /web/img/bg-produtos.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/bg-produtos.jpg -------------------------------------------------------------------------------- /web/img/bg-portfolio.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/bg-portfolio.jpg -------------------------------------------------------------------------------- /planejamento/bikcraft_ai.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/planejamento/bikcraft_ai.pdf -------------------------------------------------------------------------------- /web/img/equipe-bikcraft.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/equipe-bikcraft.jpg -------------------------------------------------------------------------------- /web/img/portfolio/retro.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/portfolio/retro.jpg -------------------------------------------------------------------------------- /web/img/produtos/esporte.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/produtos/esporte.png -------------------------------------------------------------------------------- /web/img/produtos/passeio.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/produtos/passeio.png -------------------------------------------------------------------------------- /web/img/produtos/retro.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/produtos/retro.png -------------------------------------------------------------------------------- /web/img/bikcraft-qualidade.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/bikcraft-qualidade.png -------------------------------------------------------------------------------- /web/img/endereco-bikcraft.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/endereco-bikcraft.jpg -------------------------------------------------------------------------------- /web/img/portfolio/esporte.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/portfolio/esporte.jpg -------------------------------------------------------------------------------- /web/img/portfolio/passeio.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/portfolio/passeio.jpg -------------------------------------------------------------------------------- /web/img/redes-sociais/twitter.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/redes-sociais/twitter.png -------------------------------------------------------------------------------- /wireframe/bikcraft-wireframe.psd: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/wireframe/bikcraft-wireframe.psd -------------------------------------------------------------------------------- /planejamento/bikcraft_briefing.pdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/planejamento/bikcraft_briefing.pdf -------------------------------------------------------------------------------- /web/img/redes-sociais/facebook.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/redes-sociais/facebook.png -------------------------------------------------------------------------------- /web/img/redes-sociais/instagram.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/redes-sociais/instagram.png -------------------------------------------------------------------------------- /web/img/produtos/bikcraft-retro-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/produtos/bikcraft-retro-1.jpg -------------------------------------------------------------------------------- /web/img/produtos/bikcraft-retro-2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/produtos/bikcraft-retro-2.jpg -------------------------------------------------------------------------------- /web/img/produtos/bikcraft-esporte-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/produtos/bikcraft-esporte-1.jpg -------------------------------------------------------------------------------- /web/img/produtos/bikcraft-esporte-2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/produtos/bikcraft-esporte-2.jpg -------------------------------------------------------------------------------- /web/img/produtos/bikcraft-passeio-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/produtos/bikcraft-passeio-1.jpg -------------------------------------------------------------------------------- /web/img/produtos/bikcraft-passeio-2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vicckm/bikcraft-origamid/master/web/img/produtos/bikcraft-passeio-2.jpg -------------------------------------------------------------------------------- /web/css/sobre.css: -------------------------------------------------------------------------------- 1 | .interna_sobre { 2 | background: url(../img/bg-sobre.jpg) no-repeat center; 3 | background: cover; 4 | } 5 | 6 | .missao_sobre { 7 | padding-top: 60px; 8 | } 9 | 10 | .missao_sobre p { 11 | font-size: 18px; 12 | line-height: 25px; 13 | margin-bottom: 1em; 14 | padding-right: 60px; 15 | } 16 | 17 | .missao_sobre ul li { 18 | font-family: Georgia, "Times New Roman", serif; 19 | font-size: 18px; 20 | line-height: 30px; 21 | } 22 | 23 | .foto-equipe { 24 | padding-top: 20px; 25 | } -------------------------------------------------------------------------------- /web/css/portfolio.css: -------------------------------------------------------------------------------- 1 | .interna_portfolio { 2 | background: url(../img/bg-portfolio.jpg) no-repeat center; 3 | background: cover; 4 | } 5 | 6 | .quote_clientes { 7 | padding: 60px 0; 8 | max-width: 460px; 9 | margin: 0 auto; 10 | } 11 | 12 | .quote_clientes p { 13 | text-align: center; 14 | font-family: Georgia, "Times New Roman", serif; 15 | font-size: 18px; 16 | line-height: 25px; 17 | font-style: italic; 18 | margin-bottom: 20px; 19 | } 20 | 21 | .quote_clientes cite { 22 | font-weight: bold; 23 | font-size: 18px; 24 | line-height: 25px; 25 | float: right; 26 | font-style: normal; 27 | } 28 | 29 | -------------------------------------------------------------------------------- /web/css/reset.css: -------------------------------------------------------------------------------- 1 | /* http://meyerweb.com/eric/tools/css/reset/ 2 | v2.0 | 20110126 3 | License: none (public domain) 4 | */ 5 | 6 | html, body, div, span, applet, object, iframe, 7 | h1, h2, h3, h4, h5, h6, p, pre, 8 | a, abbr, acronym, address, big, code, 9 | del, dfn, em, img, ins, kbd, q, s, samp, 10 | small, strike, strong, sub, sup, tt, var, 11 | b, u, i, center, 12 | dl, dt, dd, ol, ul, li, 13 | fieldset, form, label, legend, 14 | table, caption, tbody, tfoot, thead, tr, th, td, 15 | article, aside, canvas, details, embed, 16 | figure, figcaption, footer, header, hgroup, 17 | menu, nav, output, ruby, section, summary, 18 | time, mark, audio, video { 19 | margin: 0; 20 | padding: 0; 21 | border: 0; 22 | font: inherit; 23 | vertical-align: baseline; 24 | text-decoration: none; 25 | } 26 | /* HTML5 display-role reset for older browsers */ 27 | article, aside, details, figcaption, figure, 28 | footer, header, hgroup, menu, nav, section { 29 | display: block; 30 | } 31 | body { 32 | line-height: 1; 33 | } 34 | ol, ul { 35 | list-style: none; 36 | } 37 | 38 | table { 39 | border-collapse: collapse; 40 | border-spacing: 0; -------------------------------------------------------------------------------- /web/css/responsivo.css: -------------------------------------------------------------------------------- 1 | /*Estilo para tablets*/ 2 | @media only screen and (min-width: 788px) and (max-width: 979px) { 3 | /*Qualidade Home*/ 4 | .qualidade:after { 5 | right: 66px; 6 | } 7 | .qualidade_lista li { 8 | padding: 0 10px; 9 | } 10 | 11 | /*Footer*/ 12 | .footer_redes ul li a { 13 | border: 3px solid #fec63e; 14 | display: block; 15 | padding: 6px; 16 | } 17 | 18 | .footer_redes ul li a img { 19 | width: 26px; 20 | height: 26px; 21 | } 22 | } 23 | 24 | /*Estilo para smartphone*/ 25 | @media only screen and (max-width: 787px) { 26 | 27 | /*Header*/ 28 | 29 | .header { 30 | position: relative; 31 | padding-bottom: 0; 32 | } 33 | 34 | .header img { 35 | margin: 0 auto 0px auto; 36 | } 37 | 38 | .header_menu { 39 | text-align: center; 40 | margin-top: 10px; 41 | } 42 | 43 | 44 | .header_menu ul li { 45 | margin: 5px; 46 | } 47 | 48 | .header_menu ul li a { 49 | border: 4px solid #000; 50 | width: 136px; 51 | display: block; 52 | float: left; 53 | } 54 | 55 | .header_menu ul li a:hover { 56 | border-color: #fff; 57 | } 58 | 59 | .header_menu ul li a.menu_ativo { 60 | border-color: #fff; 61 | } 62 | 63 | /*Introducao*/ 64 | 65 | .introducao h1 { 66 | font-size: 36px; 67 | } 68 | 69 | .introducao { 70 | margin-top: 0; 71 | padding-top: 40px; 72 | background: url(../img/bg-mobile.jpg) no-repeat center; 73 | background-size: cover; 74 | } 75 | 76 | /*Introdução Interna*/ 77 | 78 | .introducao-interna { 79 | margin-top: 0px; 80 | } 81 | 82 | /*Call*/ 83 | 84 | .call-to-action { 85 | padding-top: 10px; 86 | } 87 | 88 | /*Qualidade Home*/ 89 | .qualidade:after { 90 | display: none; 91 | } 92 | /*Sobre*/ 93 | .missao_sobre p { 94 | font-size: 14px; 95 | line-height: 25px; 96 | padding-right: 0px; 97 | } 98 | 99 | .missao_sobre ul li { 100 | font-size: 14px; 101 | line-height: 20px; 102 | padding-right: 0px; 103 | } 104 | 105 | 106 | } -------------------------------------------------------------------------------- /web/css/contato.css: -------------------------------------------------------------------------------- 1 | .interna_contato { 2 | background: url(../img/bg-contato.jpg) no-repeat center; 3 | background-size: cover; 4 | } 5 | 6 | /*Orçamento*/ 7 | 8 | .contato { 9 | padding: 40px 0; 10 | } 11 | 12 | 13 | .contato_form { 14 | padding-right: 60px; 15 | } 16 | 17 | .contato_form label { 18 | display: block; 19 | font-family: Georgia, "Times New Roman", serif; 20 | font-size: 18px; 21 | line-height: 25px; 22 | margin-bottom: 4px; 23 | } 24 | 25 | .contato_form input { 26 | display: block; 27 | width: 100%; 28 | border: 4px solid #fec63e; 29 | background: none; 30 | padding: 7px 10px; 31 | margin-bottom: 10px; 32 | outline: none; 33 | font-size: 14px; 34 | font-family: Georgia, "Times New Roman", serif 35 | } 36 | 37 | .contato_form textarea { 38 | display: block; 39 | width: 100%; 40 | height: 120px; 41 | border: 4px solid #fec63e; 42 | background: none; 43 | padding: 7px 10px; 44 | margin-bottom: 20px; 45 | outline: none; 46 | font-size: 14px; 47 | font-family: Georgia, "Times New Roman", serif 48 | } 49 | 50 | .contato_form button { 51 | background: none; 52 | padding: 7px 40px; 53 | } 54 | 55 | .contato_dados h3 { 56 | font-size: 18px; 57 | line-height: 25px; 58 | font-weight: bold; 59 | text-transform: uppercase; 60 | color: #fec63e; 61 | } 62 | 63 | .contato_dados span { 64 | display: block; 65 | font-size: 18px; 66 | line-height: 30px; 67 | font-family: Georgia, "Times New Roman", serif; 68 | } 69 | 70 | .contato_dados span:nth-of-type(even) { 71 | margin-bottom: 30px; 72 | } 73 | 74 | .dados_email { 75 | margin-bottom: 40px; 76 | } 77 | 78 | .contato_dados ul { 79 | margin-top: 10px; 80 | } 81 | 82 | .contato_dados ul li { 83 | display: inline-block; 84 | margin-right: 10px; 85 | } 86 | 87 | .contato_dados ul li a { 88 | border: 3px solid #fec63e; 89 | display: block; 90 | padding: 10px; 91 | } 92 | 93 | .contato_dados ul li a:hover { 94 | border-color: #000; 95 | } 96 | 97 | .contato_mapa { 98 | margin-bottom: 60px; 99 | } 100 | 101 | -------------------------------------------------------------------------------- /web/css/grid.css: -------------------------------------------------------------------------------- 1 | *, *:before, *:after { 2 | -webkit-box-sizing: border-box; 3 | -moz-box-sizing: border-box; 4 | box-sizing: border-box; 5 | } 6 | 7 | .container { 8 | width: 960px; 9 | margin: 0 auto; 10 | padding: 0px; 11 | position: relative; 12 | } 13 | 14 | .container:after, .container:before { 15 | content: " "; 16 | display: table; 17 | } 18 | 19 | .container:after { 20 | clear: both; 21 | } 22 | 23 | .grid-1, .grid-2, .grid-3, .grid-4, .grid-5, .grid-6, .grid-7, .grid-8, .grid-9, .grid-10, .grid-11, .grid-12, .grid-13, .grid-14, .grid-15, .grid-16, .grid-1-3 { 24 | float: left; 25 | margin-left: 10px; 26 | margin-right: 10px; 27 | } 28 | 29 | .grid-1 {width: 40px;} 30 | .grid-2 {width: 100px;} 31 | .grid-3 {width: 160px;} 32 | .grid-4 {width: 220px;} 33 | .grid-5 {width: 280px;} 34 | .grid-6 {width: 340px;} 35 | .grid-7 {width: 400px;} 36 | .grid-8 {width: 460px;} 37 | .grid-9 {width: 520px;} 38 | .grid-10 {width: 580px;} 39 | .grid-11 {width: 640px;} 40 | .grid-12 {width: 700px;} 41 | .grid-13 {width: 760px;} 42 | .grid-14 {width: 820px;} 43 | .grid-15 {width: 880px;} 44 | .grid-16 {width: 940px;} 45 | .grid-1-3 {width: 300px;} 46 | 47 | @media only screen and (min-width: 788px) and (max-width: 979px) { 48 | .container { 49 | width: 768px; 50 | } 51 | 52 | .grid-1 {width: 28px;} 53 | .grid-2 {width: 76px;} 54 | .grid-3 {width: 124px;} 55 | .grid-4 {width: 172px;} 56 | .grid-5 {width: 220px;} 57 | .grid-6 {width: 268px;} 58 | .grid-7 {width: 316px;} 59 | .grid-8 {width: 364px;} 60 | .grid-9 {width: 412px;} 61 | .grid-10 {width: 460px;} 62 | .grid-11 {width: 508px;} 63 | .grid-12 {width: 556px;} 64 | .grid-13 {width: 604px;} 65 | .grid-14 {width: 652px;} 66 | .grid-15 {width: 700px;} 67 | .grid-16 {width: 748px;} 68 | .grid-1-3 {width: 236px;} 69 | 70 | } 71 | 72 | 73 | @media only screen and (max-width: 787px) { 74 | .container { 75 | width: 300px; 76 | } 77 | 78 | .grid-1, .grid-2, .grid-3, .grid-4, .grid-5, .grid-6, .grid-7, .grid-8, .grid-9, .grid-10, .grid-11, .grid-12, .grid-13, .grid-14, .grid-15, .grid-16, .grid-1-3 { 79 | width: 300px; 80 | margin: 0 0 20px 0; 81 | float: none; 82 | } 83 | 84 | } -------------------------------------------------------------------------------- /web/css/produtos.css: -------------------------------------------------------------------------------- 1 | .interna_produtos { 2 | background: url(../img/bg-produtos.jpg) no-repeat center; 3 | background-size: cover; 4 | } 5 | 6 | .produto_item { 7 | padding-top: 60px; 8 | } 9 | 10 | .produto_item h2 { 11 | color: #fff; 12 | font-size: 36px; 13 | text-transform: uppercase; 14 | letter-spacing: .1em; 15 | font-weight: bold; 16 | position: relative; 17 | top: -180px; 18 | text-align: center; 19 | margin-bottom: -50px; 20 | } 21 | 22 | .produto_item h2:after, .produto_item h2:before { 23 | content: ""; 24 | display: block; 25 | width: 60px; 26 | height: 3px; 27 | background: #fff; 28 | margin: 6px auto 8px auto; 29 | } 30 | 31 | .produto_icone { 32 | background: #000; 33 | padding: 70px 0; 34 | } 35 | 36 | .produto_icone img { 37 | margin: 0 auto; 38 | } 39 | 40 | .produto_info { 41 | background: #000; 42 | } 43 | 44 | .produto_info p { 45 | color: #fff; 46 | height: 180px; 47 | font-size: 18px; 48 | line-height: 25px; 49 | padding: 30px 40px; 50 | } 51 | 52 | .produto_info ul li { 53 | background: #fec63e; 54 | text-transform: uppercase; 55 | font-weight: bold; 56 | font-size: 18px; 57 | line-height: 20px; 58 | float: left; 59 | text-align: center; 60 | width: 229px; 61 | height: 49px; 62 | padding-top: 16px; 63 | } 64 | 65 | .produto_info ul li:nth-child(1), .produto_info ul li:nth-child(2) { 66 | margin-bottom: 2px; 67 | } 68 | 69 | .produto_info ul li:nth-child(even) { 70 | margin-left: 2px; 71 | } 72 | 73 | /*Orçamento*/ 74 | 75 | .orcamento { 76 | background: #000; 77 | width: 100%; 78 | margin-top: 60px; 79 | padding: 40px 0; 80 | } 81 | 82 | .orcamento h2 { 83 | color: #fec63e; 84 | } 85 | 86 | .orcamento h2:after { 87 | background: #fec63e; 88 | } 89 | 90 | .form { 91 | padding-right: 60px; 92 | } 93 | 94 | .form label { 95 | display: block; 96 | color: #fff; 97 | font-family: Georgia, "Times New Roman", serif; 98 | font-size: 18px; 99 | line-height: 25px; 100 | margin-bottom: 4px; 101 | } 102 | 103 | .form input { 104 | display: block; 105 | width: 100%; 106 | border: 4px solid #fec63e; 107 | background: none; 108 | color: #fff; 109 | padding: 7px 10px; 110 | margin-bottom: 10px; 111 | outline: none; 112 | font-size: 14px; 113 | font-family: Georgia, "Times New Roman", serif 114 | } 115 | 116 | .form textarea { 117 | display: block; 118 | width: 100%; 119 | height: 120px; 120 | border: 4px solid #fec63e; 121 | background: none; 122 | color: #fff; 123 | padding: 7px 10px; 124 | margin-bottom: 20px; 125 | outline: none; 126 | font-size: 14px; 127 | font-family: Georgia, "Times New Roman", serif 128 | } 129 | 130 | .form button { 131 | background: none; 132 | padding: 7px 40px; 133 | } 134 | 135 | .orcamento_dados { 136 | color: #fff; 137 | } 138 | 139 | .orcamento_dados h3 { 140 | font-size: 18px; 141 | line-height: 25px; 142 | font-weight: bold; 143 | text-transform: uppercase; 144 | color: #fec63e; 145 | } 146 | 147 | .orcamento_dados span { 148 | display: block; 149 | font-size: 18px; 150 | line-height: 30px; 151 | font-family: Georgia, "Times New Roman", serif; 152 | } 153 | 154 | .dados_email { 155 | margin-bottom: 40px; 156 | } 157 | 158 | .orcamento_dados ul { 159 | padding-right: 60px; 160 | } 161 | 162 | .orcamento_dados ul li { 163 | font-family: Georgia, "Times New Roman", serif; 164 | font-size: 14px; 165 | padding: 10px 15px; 166 | } 167 | 168 | .orcamento_dados ul li:nth-child(odd) { 169 | background: #1d1d1d; 170 | } 171 | 172 | .orcamento_dados p { 173 | margin: 8px 0; 174 | } -------------------------------------------------------------------------------- /web/portfolio.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Bikcraft - Portfólio 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 |
17 | 18 | Bikcraft 19 | 20 | 21 | 29 |
30 |
31 | 32 |
33 |
34 |

Portfólio

35 |

conheça os projetos que amamos mostrar

36 |
37 |
38 | 39 |
40 |
41 |

O verdadeiro segredo da felicidade está em ter um genuíno 42 | interesse por todos os detalhes da vida cotidiana. 43 | interesse por todos os detalhes da vida cotidiana.

44 | Barbara Moss 45 |
46 |
47 | 48 |
49 |
50 | 61 |
62 |
63 | 64 |
65 |
66 |

"o verdadeiro segredo da felicidade está em ter um genuíno interesse por todos os detalhes da vida cotidiana."

67 | Willian Morris 68 |
69 |
70 | 71 | 102 |
103 |
104 |

Bikcraft - Alguns direitos reservados

105 |
106 |
107 | 108 | 109 | -------------------------------------------------------------------------------- /web/contato.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Bikcraft - Contato 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 |
17 | 18 | Bikcraft 19 | 20 | 21 | 29 |
30 |
31 | 32 |
33 |
34 |

Contato

35 |

tire suas dúvidas com a gente

36 |
37 |
38 | 39 |
40 |
41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 |
55 | 56 |
57 |

Dados

58 | +55 21 3131-3232 59 | orcamento@bikcraft.com 60 | Rua Ali Perto - Botafogo 61 | Rio de Janeiro - RJ - Brasil 62 | 63 |

Redes Sociais

64 | 69 |
70 |
71 | 72 |
73 | Endereço da Bikcraft 74 |
75 | 76 | 77 |
78 |
79 |

"o verdadeiro segredo da felicidade está em ter um genuíno interesse por todos os detalhes da vida cotidiana."

80 | Willian Morris 81 |
82 |
83 | 84 | 115 |
116 |
117 |

Bikcraft - Alguns direitos reservados

118 |
119 |
120 | 121 | 122 | -------------------------------------------------------------------------------- /web/sobre.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Bikcraft - Sobre 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 |
17 | 18 | Bikcraft 19 | 20 | 21 | 29 |
30 |
31 | 32 |
33 |
34 |

Sobre

35 |

conheça mais sobre a bikcraft

36 |
37 |
38 | 39 |
40 |
41 |

História, Missão e Valores

42 |

43 | No mundo atual, a contínua expansão de nossa atividade cumpre um papel essencial na formulação da gestão inovadora da qual fazemos parte da qual fazemos parte. 44 |

45 |

46 | No mundo atual, a contínua expansão de nossa atividade cumpre um papel essencial na formulação da gestão inovadora da qual fazemos parte da qual fazemos parte. 47 |

48 |
49 | 50 |
51 |

Valores

52 | 58 |
59 | 60 |
61 | Equipe Bikcraft 62 |
63 |
64 | 65 |
66 |

Qualidade

67 | Bikcraft 68 | 82 |
83 | 84 |
85 |
86 |

"o verdadeiro segredo da felicidade está em ter um genuíno interesse por todos os detalhes da vida cotidiana."

87 | Willian Morris 88 |
89 |
90 | 91 | 122 |
123 |
124 |

Bikcraft - Alguns direitos reservados

125 |
126 |
127 | 128 | 129 | -------------------------------------------------------------------------------- /web/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Bikcraft 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 |
16 | 17 | Bikcraft 18 | 19 | 20 | 28 |
29 |
30 | 31 |
32 |
33 |

Bicicletas feitas a mão

34 |
35 |

"não tenha nada em sua casa que você não considere útil ou acredita ser bonito"

36 | Willian Morris 37 |
38 | Orçamento 39 |
40 |
41 | 42 |
43 |

Produtos

44 | 67 |
68 |

clique aqui e veja os detalhes dos produtos

69 | Produtos 70 |
71 |
72 | 73 |
74 |
75 |

Portfólio

76 | 87 |
88 |
89 |

conheça mais o nosso portfólio

90 | Portfólio 91 |
92 |
93 | 94 |
95 |

Qualidade

96 | Bikcraft 97 | 111 |
112 |

conheça mais a nossa história

113 | Sobre 114 |
115 |
116 | 117 |
118 |
119 |

"o verdadeiro segredo da felicidade está em ter um genuíno interesse por todos os detalhes da vida cotidiana."

120 | Willian Morris 121 |
122 |
123 | 124 | 155 |
156 |
157 |

Bikcraft - Alguns direitos reservados

158 |
159 |
160 | 161 | 162 | -------------------------------------------------------------------------------- /web/produtos.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Bikcraft - Produtos 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 |
17 | 18 | Bikcraft 19 | 20 | 21 | 29 |
30 |
31 | 32 |
33 |
34 |

Produtos

35 |

conheça todos os nossos produtos

36 |
37 |
38 | 39 |
40 |
41 | Bikcraft Passeio 42 |

Passeio

43 |
44 |
45 | 46 |
47 |
48 | Bikcraft Passeio 49 |
50 |
51 |

No mundo atual, a contínua expansão de nossa atividade cumpre um papel essencial na formulação da gestão inovadora da qual fazemos parte da qual fazemos parte.

52 | 58 |
59 |
60 | 61 |
62 |
63 | Bikcraft Esporte 64 |

Esporte

65 |
66 |
67 | 68 |
69 |
70 | Bikcraft Esporte 71 |
72 |
73 |

No mundo atual, a contínua expansão de nossa atividade cumpre um papel essencial na formulação da gestão inovadora da qual fazemos parte da qual fazemos parte.

74 | 80 |
81 |
82 | 83 |
84 |
85 | Bikcraft Retrô 86 |

Retrô

87 |
88 |
89 | 90 |
91 |
92 | Bikcraft Retrô 93 |
94 |
95 |

No mundo atual, a contínua expansão de nossa atividade cumpre um papel essencial na formulação da gestão inovadora da qual fazemos parte da qual fazemos parte.

96 | 102 |
103 |
104 | 105 |
106 |
107 |

Orçamento

108 |
109 | 110 | 111 | 112 | 113 | 114 | 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 |
123 | 124 |
125 |

Dados

126 | +55 21 3131-3232 127 | orcamento@bikcraft.com 128 | 129 |

Monte a sua Bikcraft

130 |

Escolha as especificações

131 |
    132 |
  • - Cores
    • 133 |
  • - Estilo
    • 134 |
  • - Medidas
    • 135 |
  • - Acessórios
    • 136 |
  • - E outros
    • 137 |
138 |
139 |
140 |
141 | 142 | 143 |
144 |
145 |

"o verdadeiro segredo da felicidade está em ter um genuíno interesse por todos os detalhes da vida cotidiana."

146 | Willian Morris 147 |
148 |
149 | 150 | 181 |
182 |
183 |

Bikcraft - Alguns direitos reservados

184 |
185 |
186 | 187 | 188 | -------------------------------------------------------------------------------- /web/css/style.css: -------------------------------------------------------------------------------- 1 | /* Estilos gerais*/ 2 | 3 | body { 4 | font-family: Helvetica, Arial, sans-serif; 5 | } 6 | 7 | p { 8 | font-family: Georgia, serif; 9 | font-size: 14px; 10 | } 11 | 12 | img { 13 | display: block; 14 | max-width: 100%; 15 | } 16 | 17 | .btn { 18 | color: #fec63e; 19 | text-transform: uppercase; 20 | border: 3px solid #fec63e; 21 | padding: 10px 30px; 22 | font-style: 14px; 23 | line-height: 20px; 24 | letter-spacing: .1em; 25 | font-weight: bold; 26 | } 27 | 28 | .btn:hover { 29 | border-color: #fff; 30 | color: #fff; 31 | } 32 | 33 | .btn.btn-preto:hover { 34 | border-color: #000; 35 | color: #000; 36 | } 37 | 38 | .subtitulo { 39 | text-transform: uppercase; 40 | font-size: 24px; 41 | line-height: 30px; 42 | font-weight: bold; 43 | letter-spacing: .1em; 44 | text-align: center; 45 | color: #000; 46 | margin-bottom: 40px; 47 | } 48 | 49 | .subtitulo:after { 50 | content: ""; 51 | display: block; 52 | width: 60px; 53 | height: 3px; 54 | background: #000; 55 | margin: 5px auto; 56 | } 57 | 58 | .subtitulo-amarelo { 59 | text-transform: uppercase; 60 | font-size: 24px; 61 | line-height: 30px; 62 | font-weight: bold; 63 | letter-spacing: .1em; 64 | text-align: center; 65 | color: #fec63e; 66 | margin-bottom: 40px; 67 | } 68 | 69 | .subtitulo-amarelo:after { 70 | content: ""; 71 | display: block; 72 | width: 60px; 73 | height: 3px; 74 | background: #fec63e; 75 | margin: 5px auto; 76 | } 77 | 78 | .subtitulo-interno { 79 | text-transform: uppercase; 80 | font-size: 24px; 81 | line-height: 30px; 82 | font-weight: bold; 83 | letter-spacing: .1em; 84 | color: #000; 85 | margin-bottom: 20px; 86 | } 87 | 88 | .subtitulo-interno:after { 89 | content: ""; 90 | display: block; 91 | width: 60px; 92 | height: 3px; 93 | background: #000; 94 | margin: 5px 0; 95 | } 96 | 97 | /*Header*/ 98 | 99 | .header { 100 | position: fixed; 101 | top: 0; 102 | width: 100%; 103 | background: #fec63e; 104 | padding: 15px 0; 105 | z-index: 20; 106 | } 107 | 108 | .header_menu { 109 | text-align: right; 110 | margin-top: 20px; 111 | } 112 | 113 | .header_menu ul li { 114 | display: inline-block; 115 | margin-left: 20px; 116 | } 117 | 118 | .header_menu ul li a { 119 | color: #000; 120 | font-weight: bold; 121 | text-transform: uppercase; 122 | letter-spacing: .1em; 123 | font-size: 14px; 124 | padding: 10px 0; 125 | } 126 | 127 | .header_menu ul li a:hover { 128 | color: #fff; 129 | } 130 | 131 | .header_menu ul li a.menu_ativo { 132 | color: #fff; 133 | } 134 | /*Introdução*/ 135 | 136 | .introducao { 137 | width: 100%; 138 | height: 380px; 139 | background: url(../img/bg.jpg) no-repeat center; 140 | margin-top: 92px; 141 | text-align: center; 142 | padding: 80px; 143 | } 144 | 145 | .introducao h1 { 146 | font-size: 48px; 147 | line-height: 60px; 148 | color: #fff; 149 | font-weight: bold; 150 | text-transform: uppercase; 151 | } 152 | 153 | .quote-externo { 154 | max-width: 320px; 155 | margin: 0 auto; 156 | color: #fff; 157 | margin-bottom: 40px; 158 | } 159 | 160 | .quote-externo p { 161 | font-style: italic; 162 | } 163 | 164 | .quote-externo p:before, .quote-externo p:after { 165 | content: ""; 166 | display: block; 167 | width: 60px; 168 | height: 3px; 169 | background: #fff; 170 | margin: 13px auto 10px auto; 171 | } 172 | 173 | 174 | .quote-externo cite { 175 | font-style: normal; 176 | font-weight: bold; 177 | text-transform: uppercase; 178 | font-size: 14px; 179 | letter-spacing: .1em; 180 | } 181 | 182 | /*Introdução interna*/ 183 | 184 | .introducao-interna { 185 | width: 100%; 186 | margin-top: 92px; 187 | height: 160px; 188 | color: #fff; 189 | background-size: cover; 190 | text-align: center; 191 | padding-top: 20px; 192 | } 193 | 194 | .introducao-interna h1 { 195 | font-size: 36px; 196 | line-height: 60px; 197 | font-weight: bold; 198 | text-transform: uppercase; 199 | } 200 | 201 | .introducao-interna h1:after { 202 | content: ""; 203 | display: block; 204 | width: 60px; 205 | height: 3px; 206 | background: #fff; 207 | margin: 1px auto 10px auto; 208 | } 209 | 210 | /*produtos*/ 211 | 212 | .produtos { 213 | padding: 60px 0; 214 | } 215 | 216 | .produtos_lista { 217 | margin: 20px 0; 218 | } 219 | 220 | .produtos_lista li { 221 | background: #fec63e; 222 | text-align: center; 223 | } 224 | 225 | .produtos_lista li h3 { 226 | text-transform: uppercase; 227 | font-weight: bold; 228 | letter-spacing: .1em; 229 | padding: 5px 0; 230 | font-size: 18px; 231 | line-height: 25px; 232 | margin-top: 10px; 233 | } 234 | 235 | .produtos_lista li h3:after { 236 | content: ""; 237 | display: block; 238 | width: 60px; 239 | height: 3px; 240 | background: #000; 241 | margin: 2px auto; 242 | } 243 | 244 | .produtos_lista-img { 245 | background: #000; 246 | padding: 10px; 247 | } 248 | 249 | .produtos_lista-img img { 250 | margin: 0 auto; 251 | } 252 | 253 | .produtos_lista li p { 254 | padding: 10px 20px 20px 20px; 255 | text-align: center; 256 | } 257 | 258 | .call-to-action { 259 | clear: both; 260 | text-align: center; 261 | padding-top: 40px; 262 | } 263 | 264 | .call-to-action p { 265 | margin-bottom: 20px; 266 | } 267 | 268 | /*Portfólio*/ 269 | 270 | .portfolio { 271 | width: 100%; 272 | background: #000; 273 | padding: 60px; 274 | } 275 | 276 | .portfolio .call-to-action p { 277 | color: white; 278 | clear: both; 279 | } 280 | 281 | .portfolio_lista li:last-child{ 282 | margin-top: 20px; 283 | } 284 | 285 | /*Qualidade*/ 286 | 287 | .qualidade { 288 | padding: 60px 0; 289 | } 290 | 291 | .qualidade:after { 292 | content: ""; 293 | display: block; 294 | width: 634px; 295 | height: 83px; 296 | background: url("../img/linhas.png") no-repeat center; 297 | position: absolute; 298 | top: 206px; 299 | right: 162px; 300 | z-index: -1; 301 | } 302 | 303 | .qualidade img { 304 | margin: 0 auto; 305 | } 306 | 307 | .qualidade_lista { 308 | padding-top: 20px; 309 | overflow: hidden; 310 | } 311 | 312 | .qualidade_lista li { 313 | text-align: center; 314 | padding: 0 40px; 315 | } 316 | 317 | .qualidade_lista li h3 { 318 | font-weight: bold; 319 | font-size: 18px; 320 | line-height: 25px; 321 | text-transform: uppercase; 322 | letter-spacing: .1em; 323 | margin-top: 20px; 324 | } 325 | 326 | .qualidade_lista li h3:after { 327 | content: ""; 328 | display: block; 329 | width: 60px; 330 | height: 3px; 331 | background: #000; 332 | margin: 6px auto; 333 | } 334 | 335 | /*Quebra*/ 336 | 337 | .quebra { 338 | width: 100%; 339 | height: 220px; 340 | background: url(../img/bg-footer.jpg) no-repeat center; 341 | background-size: cover; 342 | text-align: center; 343 | padding-top: 40px; 344 | } 345 | 346 | .quebra .quote-externo { 347 | max-width: 400px; 348 | } 349 | 350 | /*Footer*/ 351 | 352 | .footer { 353 | width: 100%; 354 | background: #000; 355 | color: #fff; 356 | padding: 20px 0; 357 | } 358 | 359 | .footer h3 { 360 | font-size: 18px; 361 | line-height: 25px; 362 | color: #fec63e; 363 | text-transform: uppercase; 364 | letter-spacing: .1em; 365 | font-weight: bold; 366 | } 367 | 368 | .footer h3:after { 369 | content: ""; 370 | display: block; 371 | width: 60px; 372 | height: 3px; 373 | background: #fec63e; 374 | margin: 6px 0 12px 0; 375 | } 376 | 377 | .footer_historia { 378 | padding-right: 100px; 379 | } 380 | 381 | .footer_contato ul li { 382 | font-size: 14px; 383 | line-height: 20px; 384 | font-family: Georgia, "Times New Roman", serif; 385 | } 386 | 387 | .footer_redes ul li { 388 | display: inline-block; 389 | margin-right: 10px; 390 | } 391 | 392 | .footer_redes ul li a { 393 | border: 3px solid #fec63e; 394 | display: block; 395 | padding: 10px; 396 | } 397 | 398 | .footer_redes ul li a:hover { 399 | border-color: #fff; 400 | } 401 | 402 | .copy { 403 | width: 100%; 404 | background: #fec63e; 405 | padding: 20px 0; 406 | color: #000; 407 | } -------------------------------------------------------------------------------- /web/css/normalize.css: -------------------------------------------------------------------------------- 1 | /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ 2 | 3 | /* Document 4 | ========================================================================== */ 5 | 6 | /** 7 | * 1. Correct the line height in all browsers. 8 | * 2. Prevent adjustments of font size after orientation changes in iOS. 9 | */ 10 | 11 | html { 12 | line-height: 1.15; /* 1 */ 13 | -webkit-text-size-adjust: 100%; /* 2 */ 14 | } 15 | 16 | /* Sections 17 | ========================================================================== */ 18 | 19 | /** 20 | * Remove the margin in all browsers. 21 | */ 22 | 23 | body { 24 | margin: 0; 25 | } 26 | 27 | /** 28 | * Render the `main` element consistently in IE. 29 | */ 30 | 31 | main { 32 | display: block; 33 | } 34 | 35 | /** 36 | * Correct the font size and margin on `h1` elements within `section` and 37 | * `article` contexts in Chrome, Firefox, and Safari. 38 | */ 39 | 40 | h1 { 41 | font-size: 2em; 42 | margin: 0.67em 0; 43 | } 44 | 45 | /* Grouping content 46 | ========================================================================== */ 47 | 48 | /** 49 | * 1. Add the correct box sizing in Firefox. 50 | * 2. Show the overflow in Edge and IE. 51 | */ 52 | 53 | hr { 54 | box-sizing: content-box; /* 1 */ 55 | height: 0; /* 1 */ 56 | overflow: visible; /* 2 */ 57 | } 58 | 59 | /** 60 | * 1. Correct the inheritance and scaling of font size in all browsers. 61 | * 2. Correct the odd `em` font sizing in all browsers. 62 | */ 63 | 64 | pre { 65 | font-family: monospace, monospace; /* 1 */ 66 | font-size: 1em; /* 2 */ 67 | } 68 | 69 | /* Text-level semantics 70 | ========================================================================== */ 71 | 72 | /** 73 | * Remove the gray background on active links in IE 10. 74 | */ 75 | 76 | a { 77 | background-color: transparent; 78 | } 79 | 80 | /** 81 | * 1. Remove the bottom border in Chrome 57- 82 | * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. 83 | */ 84 | 85 | abbr[title] { 86 | border-bottom: none; /* 1 */ 87 | text-decoration: underline; /* 2 */ 88 | text-decoration: underline dotted; /* 2 */ 89 | } 90 | 91 | /** 92 | * Add the correct font weight in Chrome, Edge, and Safari. 93 | */ 94 | 95 | b, 96 | strong { 97 | font-weight: bolder; 98 | } 99 | 100 | /** 101 | * 1. Correct the inheritance and scaling of font size in all browsers. 102 | * 2. Correct the odd `em` font sizing in all browsers. 103 | */ 104 | 105 | code, 106 | kbd, 107 | samp { 108 | font-family: monospace, monospace; /* 1 */ 109 | font-size: 1em; /* 2 */ 110 | } 111 | 112 | /** 113 | * Add the correct font size in all browsers. 114 | */ 115 | 116 | small { 117 | font-size: 80%; 118 | } 119 | 120 | /** 121 | * Prevent `sub` and `sup` elements from affecting the line height in 122 | * all browsers. 123 | */ 124 | 125 | sub, 126 | sup { 127 | font-size: 75%; 128 | line-height: 0; 129 | position: relative; 130 | vertical-align: baseline; 131 | } 132 | 133 | sub { 134 | bottom: -0.25em; 135 | } 136 | 137 | sup { 138 | top: -0.5em; 139 | } 140 | 141 | /* Embedded content 142 | ========================================================================== */ 143 | 144 | /** 145 | * Remove the border on images inside links in IE 10. 146 | */ 147 | 148 | img { 149 | border-style: none; 150 | } 151 | 152 | /* Forms 153 | ========================================================================== */ 154 | 155 | /** 156 | * 1. Change the font styles in all browsers. 157 | * 2. Remove the margin in Firefox and Safari. 158 | */ 159 | 160 | button, 161 | input, 162 | optgroup, 163 | select, 164 | textarea { 165 | font-family: inherit; /* 1 */ 166 | font-size: 100%; /* 1 */ 167 | line-height: 1.15; /* 1 */ 168 | margin: 0; /* 2 */ 169 | } 170 | 171 | /** 172 | * Show the overflow in IE. 173 | * 1. Show the overflow in Edge. 174 | */ 175 | 176 | button, 177 | input { /* 1 */ 178 | overflow: visible; 179 | } 180 | 181 | /** 182 | * Remove the inheritance of text transform in Edge, Firefox, and IE. 183 | * 1. Remove the inheritance of text transform in Firefox. 184 | */ 185 | 186 | button, 187 | select { /* 1 */ 188 | text-transform: none; 189 | } 190 | 191 | /** 192 | * Correct the inability to style clickable types in iOS and Safari. 193 | */ 194 | 195 | button, 196 | [type="button"], 197 | [type="reset"], 198 | [type="submit"] { 199 | -webkit-appearance: button; 200 | } 201 | 202 | /** 203 | * Remove the inner border and padding in Firefox. 204 | */ 205 | 206 | button::-moz-focus-inner, 207 | [type="button"]::-moz-focus-inner, 208 | [type="reset"]::-moz-focus-inner, 209 | [type="submit"]::-moz-focus-inner { 210 | border-style: none; 211 | padding: 0; 212 | } 213 | 214 | /** 215 | * Restore the focus styles unset by the previous rule. 216 | */ 217 | 218 | button:-moz-focusring, 219 | [type="button"]:-moz-focusring, 220 | [type="reset"]:-moz-focusring, 221 | [type="submit"]:-moz-focusring { 222 | outline: 1px dotted ButtonText; 223 | } 224 | 225 | /** 226 | * Correct the padding in Firefox. 227 | */ 228 | 229 | fieldset { 230 | padding: 0.35em 0.75em 0.625em; 231 | } 232 | 233 | /** 234 | * 1. Correct the text wrapping in Edge and IE. 235 | * 2. Correct the color inheritance from `fieldset` elements in IE. 236 | * 3. Remove the padding so developers are not caught out when they zero out 237 | * `fieldset` elements in all browsers. 238 | */ 239 | 240 | legend { 241 | box-sizing: border-box; /* 1 */ 242 | color: inherit; /* 2 */ 243 | display: table; /* 1 */ 244 | max-width: 100%; /* 1 */ 245 | padding: 0; /* 3 */ 246 | white-space: normal; /* 1 */ 247 | } 248 | 249 | /** 250 | * Add the correct vertical alignment in Chrome, Firefox, and Opera. 251 | */ 252 | 253 | progress { 254 | vertical-align: baseline; 255 | } 256 | 257 | /** 258 | * Remove the default vertical scrollbar in IE 10+. 259 | */ 260 | 261 | textarea { 262 | overflow: auto; 263 | } 264 | 265 | /** 266 | * 1. Add the correct box sizing in IE 10. 267 | * 2. Remove the padding in IE 10. 268 | */ 269 | 270 | [type="checkbox"], 271 | [type="radio"] { 272 | box-sizing: border-box; /* 1 */ 273 | padding: 0; /* 2 */ 274 | } 275 | 276 | /** 277 | * Correct the cursor style of increment and decrement buttons in Chrome. 278 | */ 279 | 280 | [type="number"]::-webkit-inner-spin-button, 281 | [type="number"]::-webkit-outer-spin-button { 282 | height: auto; 283 | } 284 | 285 | /** 286 | * 1. Correct the odd appearance in Chrome and Safari. 287 | * 2. Correct the outline style in Safari. 288 | */ 289 | 290 | [type="search"] { 291 | -webkit-appearance: textfield; /* 1 */ 292 | outline-offset: -2px; /* 2 */ 293 | } 294 | 295 | /** 296 | * Remove the inner padding in Chrome and Safari on macOS. 297 | */ 298 | 299 | [type="search"]::-webkit-search-decoration { 300 | -webkit-appearance: none; 301 | } 302 | 303 | /** 304 | * 1. Correct the inability to style clickable types in iOS and Safari. 305 | * 2. Change font properties to `inherit` in Safari. 306 | */ 307 | 308 | ::-webkit-file-upload-button { 309 | -webkit-appearance: button; /* 1 */ 310 | font: inherit; /* 2 */ 311 | } 312 | 313 | /* Interactive 314 | ========================================================================== */ 315 | 316 | /* 317 | * Add the correct display in Edge, IE 10+, and Firefox. 318 | */ 319 | 320 | details { 321 | display: block; 322 | } 323 | 324 | /* 325 | * Add the correct display in all browsers. 326 | */ 327 | 328 | summary { 329 | display: list-item; 330 | } 331 | 332 | /* Misc 333 | ========================================================================== */ 334 | 335 | /** 336 | * Add the correct display in IE 10+. 337 | */ 338 | 339 | template { 340 | display: none; 341 | } 342 | 343 | /** 344 | * Add the correct display in IE 10. 345 | */ 346 | 347 | [hidden] { 348 | display: none; 349 | } --------------------------------------------------------------------------------