.navbar-default {border: none;background-color: #293c55;z-index: 100;transition: background-color 0.5s linear;height: 50px;}.navbar-default .navbar-nav {transition: background-color 0.5s linear;}.navbar-default .navbar-nav li {position: relative;}.navbar-default .navbar-nav li a {color: rgba(255, 255, 255, 0.45);background-color: none !important;padding: 15px 20px;transition: 0.5s background-color;font-size: 14px;}.navbar-default .navbar-nav li a:before {content: '';position: absolute;left: 50%;right: 50%;top: 0;background: #a9334c;height: 4px;transition-property: 'left, right';transition-duration: .3s;transition-timing-function: ease-out;}.navbar-default .navbar-nav li a:hover, .navbar-default .navbar-nav li a:focus {color: #f9f9f9;background-color: #162436;}.navbar-default .navbar-nav li a:hover:before, .navbar-default .navbar-nav li a:focus:before {left: 0;right: 0;}.navbar-default .navbar-nav li a .iconfont {font-size: 12px;}.navbar-default .navbar-nav li.open {background-color: #162436;color: #fff;}.navbar-default .navbar-nav li.open > a:focus, .navbar-default .navbar-nav li.open > a:hover {color: #eee;background-color: #162436;}.navbar-default .navbar-nav li.active > a {padding-top: 11px;border-top: 4px solid #a9334c;color: #fff;background-color: #0e151f;font-family: noto-light;transition: 0.5s background-color;}.navbar-default .navbar-nav li.active > a:before {display: none;}.navbar-default .navbar-nav li.active > a:hover, .navbar-default .navbar-nav li.active > a:focus {color: #f9f9f9;background-color: #162436;}.navbar-default .navbar-nav li .dropdown-menu {width: 100%;padding: 0;background-color: #162436;box-shadow: none;border: none;}.navbar-default .navbar-nav li .dropdown-menu li {background-color: #162436;border-top: none;padding: 5px 0;}.navbar-default .navbar-nav li .dropdown-menu li a {padding: 8px 20px;}.navbar-default .navbar-nav li .dropdown-menu li:hover, .navbar-default .navbar-nav li .dropdown-menu li:focus {background-color: #a9334c;}.navbar-default .navbar-nav li .dropdown-menu li:hover a, .navbar-default .navbar-nav li .dropdown-menu li:focus a {background-color: #a9334c;}.navbar-default .navbar-nav li ul a:before {display: none;}.navbar-default .navbar-logo {height: 32px;margin-top: -6px;margin-left: -2px;}.navbar-default .navbar-collapse {border-top: none;}.navbar-default .navbar-toggle {padding: 1px 5px;margin: 7px 16px 0 0;border-color: #384E6B;background-color: #384E6B;}.navbar-default .navbar-toggle .icon-bar {margin: 7px 0 !important;height: 1px;background-color: #fff;}.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {border-color: #384E6B;background-color: #384E6B;}#menu-btn {display: none;float: right;height: 45px;line-height: 45px;margin: 5px 20px 0 0;font-size: 30px;color: #fff;cursor: pointer;}.navbar-bg {background-color: rgba(41, 60, 85, 0.4);}.navbar-bg .navbar-nav li a {color: #fff;}.navbar-bg .navbar-nav li.active a {color: #fff;background-color: transparent;}.navbar-bg .navbar-nav #nav-github {opacity: 1;}#nav-github {opacity: 0.4;transition: 0.5s;}#nav-github:hover {opacity: 1;}@media (max-width: 768px) {.navbar-default .navbar-nav {background-color: #293c55;transition: background-color 0.5s linear;margin-top: 0;margin-bottom: 0;}.navbar-default .navbar-nav .open .dropdown-menu {padding: 0;}.navbar-default .navbar-nav .open .dropdown-menu li a {color: #fff;}.navbar-default .navbar-nav li.active > a {border-left: 4px solid #a9334c;border-top: none;padding: 10px 15px 10px 11px;}#menu-btn {display: block;}#nav-download {display: none;}}@media (max-width: 992px) and (min-width: 768px) {.navbar-default .navbar-nav li a {padding: 15px 15px;}}h1 {font-size: 2rem;}h3 {font-size: 1.5rem;margin-top: 30px;margin-bottom: 20px;}p {padding-left: 30px;}#preview-viewport {width: 100%;height: 400px;}.container {margin-bottom: 20px;}
