Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- /* Josh Below */
- @media (min-width: 767px) {
- .mobileabout{display:none;}
- }
- @media (max-width: 767px) {
- .desktopabout{display:none;}
- }
- @media (max-width: 1200px) {
- .yagerbar{display:none;}
- .map-responsive{display:none;}
- }
- @media (min-width: 1200px) {
- .yagerbar2{
- display:none;}
- }
- .yagerbar2 {
- background-color: #33c200;
- box-shadow: 0 3px 0 #33c200;
- left: 0;
- right: 0;
- color: #fdd5d3;
- text-shadow: 0 1px rgba(0,0,0, .3);
- font-size: 14px;
- z-index:9999;
- position:fixed !important;
- top:300px !important;
- margin:0 auto;
- padding:20px;
- width:80%;
- }
- .yagerbar2 a { color: #000; text-decoration: none;
- font-weight: bold;float:right;font-size:30px; position: absolute;right: 0px;top: -46px;}
- .yagerbar2 a:hover { text-decoration: none; color:#fff;}
- .yagerbar {
- background-color: #33c200;
- box-shadow: 0 3px 0 #33c200;
- position: sticky;
- top: 0;
- left: 0;
- right: 0;
- color: #fdd5d3;
- text-shadow: 0 1px rgba(0,0,0, .3);
- font-size: 14px;
- z-index:9999;
- }
- .yagerbar a { color: #fff; text-decoration: none;
- font-weight: bold;}
- .yagerbar a:hover { text-decoration: none; }
- .yagerbar-wrap {
- position: relative;
- margin: 0 auto;
- width: 100%;
- max-width: 960px;
- }
- .yagerbar-content {
- overflow: hidden;
- padding: 7px 0;
- transition: 0.1s ease;
- font-size: 18px;
- text-align:center;
- font-weight:600;
- font-family:'Open Sans', sans-serif;
- width: 93%;
- margin: 0 auto;
- color:white;
- }
- .yagerbar-toggle {
- position: absolute;
- top: 7px;
- right: 15px;
- bottom: 0;
- z-index: 1;
- min-width: 9px;
- min-height: 17px;
- opacity: 0;
- cursor: pointer;
- }
- .yagerbar-toggle:checked { top: 0; right: -133px; min-width: 38px; min-height: 30px; }
- .yagerbar-toggle:checked ~ .yagerbar-content { padding: 0; height: 0; }
- .yagerbar-toggle:checked ~ .yagerbar-arrow:after { top: 7px; left: 16px; box-shadow: none; }
- .yagerbar-toggle:checked ~ .yagerbar-arrow:before {
- position: absolute;
- top: 15px;
- left: 11px;
- border-color: #4c4237 transparent transparent transparent;
- border-width: 8px 8px 0 8px;
- box-shadow: none;
- }
- .yagerbar-toggle:checked ~ .yagerbar-arrow {
- top: 0;
- right: -130px;
- width: 38px;
- height: 30px;
- border: 3px solid transparent;
- border-top: 0;
- border-radius: 0 0 3px 3px;
- background-color:#33c200;
- }
- .yagerbar-arrow {
- position: absolute;
- top: 7px;
- right: 15px;
- background-color: #b45210;
- }
- .yagerbar-arrow:before {
- display: block;
- width: 0px;
- height: 0px;
- border-color: transparent transparent #4B4237 transparent;
- border-style: solid;
- border-width: 0 8px 8px 8px;
- box-shadow: 0 1px 0 rgba(255,255,255,0.2);
- content: '';
- background-color: #33c200;
- }
- .yagerbar-arrow:after {
- position: absolute;
- left: 5px;
- display: block;
- width: 6px;
- height: 8px;
- background-color: #4B4237;
- box-shadow: 0 1px 0 rgba(255,255,255,0.2);
- content: '';
- }
- .yagerbar-toggle:hover ~ .yagerbar-arrow:after { background-color: #7d2b27; }
- .yagerbar-toggle:hover ~ .yagerbar-arrow:before { border-bottom-color: #7d2b27; border-top-color: #7d2b27; }
- .shakebutton {
- animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
- transform: translate3d(0, 0, 0);
- perspective: 1000px;
- }
- @keyframes shake {
- 10%, 90% {
- transform: translate3d(-1px, 0, 0);
- }
- 20%, 80% {
- transform: translate3d(2px, 0, 0);
- }
- 30%, 50%, 70% {
- transform: translate3d(-4px, 0, 0);
- }
- 40%, 60% {
- transform: translate3d(4px, 0, 0);
- }
- }
- /*Josh Codepen End Test*/
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement