.container { width: 100% } #hs-component { background-color: inherit; padding: 0 } #hs-component .container { padding: 0; width: 100% } #comp-menu { background-color: #FFFFFF; z-index: 1; padding: 0 } #comp-menu .cont, .demo { padding: 0 50px } #comp-menu h2, #comp-menu h2 a { color: #000000; font-weight: lighter; text-transform: inherit } #comp-menu h2 a:hover { color: #8085e8 } .blink_me { animation: blinker 1.5s linear infinite; } @keyframes blinker { 20% { opacity: 0.4; } } a.btn.btn-theme { color: #eeeaea; background-color: #007E88; border: 1px solid #007E88; border-bottom: 0; border-radius: 0; font-weight: 400; margin: 0 5px 0 0 } a.btn.btn-theme:hover { color: #90ef7f } .btn-book { color: #fff; background-color: #337ab7; border-color: #2e6da4; display: inline-block; white-space: nowrap; vertical-align: middle; border: 1px solid transparent; touch-action: manipulation; cursor: pointer; padding: 2px 6px; font-size: 10px; font-weight: bold; line-height: 1.1333333; border-radius: 6px; background-image: linear-gradient(to bottom,#337ab7 0,#265a88 100%); } a.btn.btn-theme.noselected { background-color: #FFF; color: #313131; opacity: 1 } a.btn.btn-theme.disabled { background-color: #FFF; color: #313131; opacity: 1 } .demo { background-color: #f6f6f6 } .demo .demo-name { color: #000000; font-weight: lighter; text-transform: none; padding-left: 15px; text-align: center; display: inline; margin: 0 10px } #chart-switcher { text-align: center; padding: 30px 0 } .demo #chart-switcher #next-example, .demo #chart-switcher #previous-example { font-size: 30px; padding: 0 10px; color: #888 } #demo-buttons { text-align: center; padding: 30px 0 } #demo-buttons a { background-color: #ddd } #demo-buttons a:hover { background-color: #40818b } .demo .chart-container { position: relative; background-color: #fff; padding: 30px 0 } .demo .chart-container #previous-example { position: absolute; top: 50%; left: -30px; font-size: 70px; color: #888 } .demo .chart-container #next-example { position: absolute; top: 50%; right: -30px; font-size: 70px; color: #888 } .sidebar-eq-fill { background-color: #f6f6f6 } @media screen and (max-width: 400px) { #chart-switcher, .demo .chart-container, .sidebar-wrapper .sidebar-eq { padding: 0 } #small-switcher { text-align: center } .demo #chart-switcher #next-example, .demo #chart-switcher #previous-example { font-size: 20px } #sidebar-close { position: absolute; top: 0; left: 0; background-color: #FFFFFF; color: #fff; border-radius: 0; z-index: 100; cursor: pointer; padding: 10px; visibility: hidden } .toggled #sidebar-close { visibility: visible } } @media screen and (min-width: 400px) and (max-width: 768px) { .demo { padding: 15px } #sidebar-close { position: absolute; top: 0; left: 0; background-color: #FFFFFF; color: #fff; border-radius: 0; z-index: 100; cursor: pointer; padding: 10px; visibility: hidden } .toggled #sidebar-close { visibility: visible } } #hs-below { background-color: #eeeaea; font-size: 18px; line-height: 26px } #hs-below h3 { font-size: 30px; line-height: 30px; font-weight: bolder; margin-top: 0; margin-bottom: 15px } #hs-below p, ul { font-size: 1pc } #hs-below .box { position: relative; background-color: #fff; padding: 14px 22px } #hs-below .box .box-content { margin-bottom: 40px } #hs-below .box .button { position: absolute; bottom: 0; margin-bottom: 10px } #hs-below .box.purple { border-bottom: 8px solid #8085e8 } #hs-below .box.green { border-bottom: 8px solid #90ef7f } #hs-below .box .book { text-align: center } #hs-below .box .book img { max-height: 200px } @media screen and (max-width: 768px) { #hs-below h3 { margin-top: 30px } #hs-below .box-1 h3 { margin-top: 0 } #hs-below .box .book { text-align: left } } @media screen and (min-width: 768px) and (max-width: 992px) { #hs-below h3 { margin-top: 30px } #hs-below .box-1 h3, #hs-below .box-2 h3 { margin-top: 0 } #hs-below .box-1 .box, #hs-below .box-2 .box { min-height: 260px } #hs-below .box-3 .box, #hs-below .box-4 .box { min-height: 280px } } @media screen and (min-width: 992px) and (max-width: 1200px) { #hs-below h3 { margin-top: 30px } #hs-below .box-1 h3, #hs-below .box-2 h3 { margin-top: 0 } #hs-below .box-1 .box, #hs-below .box-2 .box { min-height: 255px } #hs-below .box-3 .box, #hs-below .box-4 .box { min-height: 280px } } @media screen and (min-width: 1200px) { #hs-below .box { min-height: 390px } } #hs-bottom, #hs-bottom a { color: #eeeaea } #hs-bottom { background-color: #FFFFFF; font-size: 1pc; line-height: 20px } #hs-bottom a:focus, #hs-bottom a:hover { color: #90ef7f } #hs-bottom a.button { color: #313131 } #hs-bottom a.button:focus, #hs-bottom a.button:hover { color: #eeeaea } #hs-bottom h3 { font-size: 24px; line-height: 24px; font-weight: lighter } #hs-bottom h4 { font-size: 14px } #hs-bottom .grayed { color: #d6d1d1; margin: 0 } @media screen and (max-width: 768px) { #hs-bottom [class*=col-] { border-bottom: 1px dotted #eeeaea; padding-bottom: 15px } #hs-bottom [class*=col-]:nth-child(1) h3 { margin-top: 0 } #hs-bottom [class*=col-]:last-child { border-bottom: 0; padding-bottom: 0 } } @media screen and (min-width: 768px) and (max-width: 992px) { #hs-bottom [class*=col-] { min-height: 350px; border-right: 1px dotted #eeeaea } #hs-bottom [class*=col-]:last-child, #hs-bottom [class*=col-]:nth-child(2) { border-right: 0 } } @media screen and (min-width: 992px) and (max-width: 1200px) { #hs-bottom [class*=col-] { min-height: 300px; border-right: 1px dotted #eeeaea } #hs-bottom [class*=col-]:last-child, #hs-bottom [class*=col-]:nth-child(2) { border-right: 0 } } @media screen and (min-width: 1200px) { #hs-bottom [class*=col-] { min-height: 25pc; border-right: 1px dotted #eeeaea } #hs-bottom [class*=col-]:last-child { border-right: 0 } } .button{ border:1px solid #333; background:#6479fd; } .button:hover{ background:#a4a9fd; } .dialog{ border:5px solid #666; padding:10px; background:#3A3A3A; position:absolute; display:none; } .dialog label{ display:inline-block; color:#cecece; } input[type=text]{ border:1px solid #333; display:inline-block; margin:5px; } #btnOK{ border:1px solid #000; background:#ff9999; margin:5px; } #btnOK:hover{ border:1px solid #000; background:#ffacac; }