|
|
| Line 2: |
Line 2: |
| | <style> | | <style> |
| | html { | | html { |
| − | height: 100%;
| |
| | background-color: #f8f8f8; | | background-color: #f8f8f8; |
| − | }
| |
| − |
| |
| − | body {
| |
| − | overflow: hidden;
| |
| − | height: 100%;
| |
| − | width: 100%;
| |
| − | margin: 0 auto;
| |
| − | background-color: #ffffff;
| |
| − | font-family: 'Roboto', sans-serif;
| |
| − | color: #555555;
| |
| | } | | } |
| | | | |
| Line 49: |
Line 38: |
| | } | | } |
| | | | |
| − | .menu-title:before {
| |
| − | content: "";
| |
| − | display: block;
| |
| − | height: 0;
| |
| − | border-top: 5px solid #9dc852;
| |
| − | border-left: 75px solid transparent;
| |
| − | border-right: 75px solid transparent;
| |
| − | border-bottom: 0 solid #dddddd;
| |
| − | position: absolute;
| |
| − | top: 100%;
| |
| − | left: 0;
| |
| − | transition: 0.2s 0.2s border-top ease-out, 0.3s border-top-color;
| |
| − | }
| |
| | | | |
| | .menu-title:hover { | | .menu-title:hover { |
| Line 76: |
Line 52: |
| | } | | } |
| | | | |
| − | .menu-title:after {
| |
| − | content: "";
| |
| − | display: block;
| |
| − | height: 0;
| |
| − | border-left: 75px solid transparent;
| |
| − | border-right: 75px solid transparent;
| |
| − | border-bottom: 0 solid #ebebeb;
| |
| − | position: absolute;
| |
| − | bottom: 0;
| |
| − | left: 0;
| |
| − | transition: 0.2s border-bottom ease-in;
| |
| − | }
| |
| | | | |
| | .menu:hover > .menu-title:after { | | .menu:hover > .menu-title:after { |
