| body { |
| position: relative; /* For scrollyspy */ |
| /*font-family: 'Lato', sans-serif !important;*/ |
| font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif !important; |
| /*font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif; */ |
| } |
| h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { |
| /*font-family: 'Lato', sans-serif !important;*/ |
| font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif !important; |
| } |
| /* ---------------------------------- |
| * home |
| * ---------------------------------- */ |
| .home { |
| background: url(../img/index.png) no-repeat 50% 100px; |
| } |
| @media (max-width: 767px) { |
| .home { |
| background: none; |
| } |
| } |
| /* ---------------------------------- |
| * icons |
| * ---------------------------------- */ |
| @font-face { |
| font-family: "angularicons"; |
| src: url("../angularicons/angularicons.eot"); |
| src: url("../angularicons/angularicons.eot?#iefix") format("embedded-opentype"), url("../angularicons/angularicons.woff") format("woff"), url("../angularicons/angularicons.ttf") format("truetype"), url("../angularicons/angularicons.svg") format("svg"); |
| } |
| .icon { |
| display: inline-block; |
| font-family: "angularicons"; |
| font-weight: normal; |
| font-style: normal; |
| text-decoration: none; |
| vertical-align: top; |
| -webkit-font-smoothing: antialiased; |
| -moz-osx-font-smoothing: grayscale; |
| } |
| .icon[data-icon]:before { |
| content: attr(data-icon); |
| speak: none; |
| } |
| /* ---------------------------------- |
| * index |
| * ---------------------------------- */ |
| .index { |
| padding-top: 100px; |
| text-align: center; |
| background-color: rgba(255, 255, 255, .9); |
| min-height: 746px; |
| } |
| .index h2 { |
| margin-top: 10px; |
| color: rgba(0, 0, 0, .8); |
| font-size: 16px; |
| line-height: 26px; |
| font-weight: normal; |
| } |
| .index h3 { |
| margin-top: 20px; |
| font-size: 14px; |
| font-style: italic; |
| } |
| .index .download-link { |
| margin: 40px 0 20px; |
| } |
| .index .download-link .btn { |
| padding: 15px 35px; |
| border: 0; |
| font-size: 22px; |
| opacity: 1; |
| } |
| .index .version-text { |
| color: rgba(0, 0, 0, .6); |
| font-size: 12px; |
| } |
| .index .learn-more { |
| margin-top: 20px; |
| font-weight: bold; |
| color: rgba(79, 190, 186, 1); |
| } |
| .index .learn-more a, |
| .index .learn-more a:hover, |
| .index .learn-more a:active { |
| color: #50c1e9 !important; |
| text-decoration: none; |
| } |
| .index .learn-more .icon { |
| font-weight: bold; |
| font-size: 16px; |
| } |
| @media (max-width: 767px) { |
| .index { |
| padding-top: 0; |
| min-height: 600px; |
| } |
| .index .download-link .btn { |
| padding: 15px; |
| } |
| } |
| /* ---------------------------------- |
| * social |
| * ---------------------------------- */ |
| .social { |
| position: relative; |
| margin-top: -100px; |
| margin-bottom: 0; |
| padding: 40px 5px; |
| height: 99px; |
| text-align: center; |
| background: rgba(255, 255, 255, .7) url(../img/divider.png) no-repeat 50% 100%; |
| } |
| .social li { |
| height: 30px; |
| display: inline-block; |
| vertical-align: top; |
| } |
| .social a { |
| color: #50c1e9 !important; |
| } |
| .social .github-watch { |
| width: 105px; |
| } |
| .social .github-fork { |
| width: 105px; |
| } |
| .social .twitter-share { |
| width: 80px; |
| margin-right: 10px; |
| } |
| .social .twitter-follow { |
| width: 200px; |
| } |
| /* ---------------------------------- |
| * desc |
| * ---------------------------------- */ |
| .desc { |
| text-align: center; |
| background-color: rgba(255, 255, 255, 1); |
| } |
| .desc a { |
| color: rgba(79, 190, 186, 1); |
| } |
| .desc a:hover, |
| .desc a:active { |
| color: #50c1e9; |
| text-decoration: none; |
| } |
| .desc .desc__introduces { |
| border-top: 1px dashed #AAB2BD ; |
| } |
| .desc .desc__introduces:first-child { |
| border-top: none; |
| } |
| .desc .desc__introduces h3, |
| .desc .desc__introduces p { |
| margin: 0 auto; |
| } |
| .desc .desc__introduces h3 { |
| padding: 70px 0 14px; |
| max-width: 900px; |
| font-size: 28px; |
| } |
| .desc .desc__introduces p { |
| padding-bottom: 40px; |
| max-width: 900px; |
| font-size: 18px; |
| color: #888; |
| } |
| .desc .desc__introduces .photo--responsive img { |
| width: 100%; |
| } |
| .desc .desc__features { |
| margin: 70px auto; |
| text-align: left; |
| } |
| .desc .desc__features .row { |
| margin-bottom: 70px; |
| } |
| .desc .desc__features .col-md-6 { |
| padding-left: 247px; |
| min-height: 200px; |
| text-align: left; |
| } |
| .desc .desc__features .features__photo { |
| position: absolute; |
| top: 0; |
| left: 0; |
| } |
| .desc .desc__features h4 { |
| font-size: 20px; |
| margin-bottom: 10px; |
| } |
| .desc .desc__features p { |
| font-size: 16px; |
| color: #888; |
| line-height: 26px; |
| } |
| @media (max-width: 767px) { |
| .desc .desc__introduces h3 { |
| padding-top: 20px; |
| text-align: left; |
| } |
| .desc .desc__introduces p { |
| text-align: left; |
| } |
| .desc .desc__features { |
| margin-top: 20px; |
| } |
| .desc .desc__features .row { |
| margin-bottom: 20px; |
| } |
| .desc .desc__features .row p { |
| padding-bottom: 20px; |
| text-align: left; |
| } |
| .desc .desc__features .features__photo { |
| position: static; |
| } |
| .desc .desc__features .col-md-6 { |
| padding: 0 15px; |
| text-align: center; |
| } |
| } |
| /* ---------------------------------- |
| * docs |
| * ---------------------------------- */ |
| .docs-header { |
| padding-top: 50px; |
| border-top: 1px solid #50c1e9; |
| background: url(../img/wild_flowers.png) repeat 0 0; |
| } |
| .docs-header.header--noBackground { |
| background: none; |
| } |
| @media (max-width: 768px) { |
| .docs-header { |
| padding-top: 0; |
| } |
| } |
| /*/* ---------------------------------- |
| * advertisement |
| * ---------------------------------- */ |
| .advertisement { |
| width: auto !important; |
| padding: 10px !important; |
| overflow: hidden; /* clearfix */ |
| font-size: 13px !important; |
| line-height: 18px !important; |
| text-align: left; |
| background: #50c1e9 !important; |
| border: 0 !important; |
| border-radius: 4px; |
| box-shadow: inset 0 3px 5px rgba(0,0,0,.075); |
| height: 121px; |
| } |
| .advertisement-image { |
| margin: 0 !important; |
| position: absolute; |
| } |
| .advertisement-text { |
| margin-left: 100px !important; |
| font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important; |
| } |
| .advertisement-text a { |
| color: #fff !important; |
| } |
| @media (max-width: 767px) { |
| .advertisement { |
| position: static; |
| margin-top: 30px; |
| box-shadow: inset 0 3px 5px rgba(0,0,0,.075), 0 1px 0 rgba(255,255,255,.1); |
| } |
| } |
| @media (min-width: 768px) { |
| .advertisement { |
| position: absolute; |
| top: 5px; |
| right: 15px; /* 15px instead of 0 since box-sizing */ |
| padding: 15px !important; |
| width: 300px !important; |
| } |
| }*/ |
| /* ---------------------------------- |
| * navbar |
| * ---------------------------------- */ |
| .navbar-custom { |
| position: fixed; |
| top: 0; |
| left: 0; |
| border: none; |
| border-radius: 0; |
| background-color: rgba(255, 255, 255, .9); |
| width: 100%; |
| z-index: 2000; |
| } |
| .navbar-custom .nav li a { |
| display: block; |
| color: #50c1e9; |
| } |
| .navbar-custom .nav li a:focus, |
| .navbar-custom .nav li a:hover { |
| color: #50c1e9; |
| } |
| .navbar-custom .nav li a:active, |
| .navbar-custom .nav li a.current { |
| border-bottom: 3px solid #50c1e9; |
| } |
| .navbar-custom .navbar-toggle { |
| position: relative; |
| background-color: #50c1e9; |
| border-color: #50c1e9; |
| } |
| .navbar-custom .navbar-toggle:hover, |
| .navbar-custom .navbar-toggle:focus { |
| background-color: #50c1e9; |
| } |
| .navbar-custom .navbar-toggle .icon-bar { |
| background-color: rgba(255, 255, 255, .9); |
| } |
| .navbar-custom .navbar-brand { |
| padding: 5px 15px; |
| opacity: .7; |
| filter:alpha(opacity=70); |
| transition: opacity .4s ease-in-out; |
| } |
| .navbar-custom .navbar-brand:hover, |
| .navbar-custom .navbar-brand:active { |
| opacity: 1; |
| filter:alpha(opacity=100); |
| } |
| .navbar-default .navbar-collapse { |
| border-color: #e7e7e7; |
| } |
| @media (max-width: 992px) { |
| .navbar-custom .navbar-brand { |
| width: 63px; |
| overflow: hidden; |
| } |
| } |
| @media (max-width: 767px) { |
| .navbar-custom { |
| position: relative; |
| top: 0; |
| } |
| .navbar-custom .navbar-nav > li > a:hover, |
| .navbar-custom .navbar-nav > li > a:focus { |
| color: #fff; |
| background-color: #50c1e9; |
| } |
| } |
| /* ---------------------------------- |
| * topic |
| * ---------------------------------- */ |
| .topic { |
| position: relative; |
| padding: 50px 0 110px; |
| } |
| .topic h3 { |
| margin-top: 30px; |
| color: #fff; |
| font-size: 28px; |
| font-weight: normal; |
| } |
| .topic h4 { |
| margin-top: 15px; |
| color: rgba(255, 255, 255, .8); |
| font-weight: normal; |
| } |
| .topic .topic__infos { |
| position: absolute; |
| bottom: 0; |
| padding-bottom: 15px; |
| padding-top: 14px; |
| background: rgba(255, 255, 255, 0.25); |
| width: 100%; |
| } |
| .topic .container { |
| position: relative; |
| color: rgba(255, 255, 255, .8); |
| } |
| .topic .container a { |
| color: #fff; |
| filter:alpha(opacity=100); |
| opacity: 1; |
| text-decoration: underline; |
| padding: 0; |
| font-weight: normal; |
| } |
| .topic .container a.btn { |
| padding: 10px 16px; |
| text-decoration: none; |
| } |
| .topic .github { |
| position: relative; |
| top: 10px; |
| } |
| /* ---------------------------------- |
| * documents |
| * ---------------------------------- */ |
| .documents { |
| margin-top: 40px; |
| } |
| /* ---------------------------------- |
| * details |
| * ---------------------------------- */ |
| .details { |
| position: relative; |
| padding-right: 400px; |
| } |
| @media (max-width: 991px) { |
| .details { width: 100%; } |
| } |
| @media (max-width: 767px) { |
| .details { padding: 0 15px; } |
| } |
| /* ---------------------------------- |
| * docs-article |
| * ---------------------------------- */ |
| .docs-article { |
| margin-bottom: 40px; |
| padding-bottom: 40px; |
| border-bottom: 1px solid #ddd; |
| } |
| .docs-article:last-child { |
| border-bottom: none; |
| } |
| .docs-article h3 { |
| margin: 0 0 10px; |
| padding-bottom: 10px; |
| font-family: "Georgia", "Palatino", "Times New Roman", "Times" !important; |
| font-weight: normal; |
| font-size: 25px; |
| color: #50c1e9; |
| } |
| .docs-article p { |
| margin-bottom: 10px; |
| font-size: 14px; |
| line-height: 22px; |
| } |
| .docs-article dd { |
| margin-bottom: 10px; |
| } |
| .docs-article a { |
| color: #50c1e9; |
| text-decoration: underline; |
| } |
| .docs-article a:hover { |
| color: #50c1e9; |
| } |
| .docs-article .item__infos { |
| margin: 0 0 10px 0; |
| font-size: 14px; |
| list-style: disc; |
| } |
| .docs-article .item__infos li { |
| margin-bottom: 10px; |
| } |
| .docs-article .btn-primary, |
| .docs-article .btn-primary:hover { |
| color: #fff; |
| text-decoration: none; |
| } |
| .docs-article pre { |
| border: none; |
| background-color: #f7f7f7; |
| } |
| /* ---------------------------------- |
| * example |
| * ---------------------------------- */ |
| .example { |
| margin-bottom: 20px; |
| } |
| .example .example-title { |
| margin-bottom: 20px; |
| font-weight: 700; |
| font-size: 18px; |
| text-shadow: 2px 2px 2px rgba(255, 255, 255, 1); |
| } |
| .example .example-title span { |
| font-weight: normal; |
| font-size: 14px; |
| color: #ED5565; |
| } |
| .example [class*="col-"] { |
| margin-bottom: 10px; |
| } |
| .example-dropdown h2 + .dropdown-menu, |
| .example-popover .popover, |
| .example-modal .modal { |
| position: static; |
| display: block; |
| } |
| .example-dropdown h2 + .dropdown-menu { |
| float: none; |
| width: 200px; |
| } |
| .example-popover .popover { |
| position: relative; |
| } |
| @media (max-width: 960px) { |
| .tooltip-demo [class*="col-"] { |
| text-align: center; |
| } |
| .tooltip-demo [class*="col-"] .btn-block { |
| display: inline-block; |
| margin: 0 auto; |
| width: 160px; |
| } |
| } |
| .example-popover [class*="col-"]:nth-of-type(1) .popover { |
| margin-top: 0; |
| } |
| .example-popover [class*="col-"]:nth-of-type(3) .popover, |
| .example-popover [class*="col-"]:nth-of-type(4) .popover { |
| margin-top: 40px; |
| } |
| .example-progress [class*="col-"]:last-child .progress { |
| margin-bottom: 10px; |
| } |
| .example-pagination .pagination, |
| .example-pagination .pager { |
| margin: 0 !important; |
| } |
| |
| .example-modal .modal { |
| overflow: hidden; |
| } |
| @media (min-width: 768px) { |
| .example-modal .modal-dialog { |
| width: 545px; |
| margin: 5px; |
| } |
| } |
| .example-typography { |
| position: relative; |
| padding-left: 25%; |
| margin-bottom: 40px; |
| } |
| .example-typography .heading-note, |
| .example-typography .text-note { |
| display: block; |
| width: 260px; |
| position: absolute; |
| bottom: 2px; |
| left: 0; |
| font-size: 13px; |
| line-height: 13px; |
| color: #AAB2BD; |
| font-weight: 400; |
| } |
| .example-typography .text-note { |
| bottom: auto; |
| top: 10px; |
| } |
| /* ---------------------------------- |
| * color-swatches |
| * ---------------------------------- */ |
| .color-swatches .swatches { |
| -webkit-border-radius: 4px; |
| -moz-border-radius: 4px; |
| border-radius: 4px; |
| background-color: #FFF; |
| width: 100%; |
| box-shadow: 0 1px 2px rgba(0, 0, 0, .2); |
| } |
| .color-swatches .light, |
| .color-swatches .dark { |
| width: 50%; |
| height: 50px; |
| } |
| .color-swatches .light { |
| -webkit-border-radius: 4px 0 0 0; |
| -moz-border-radius: 4px 0 0 0; |
| border-radius: 4px 0 0 0; |
| } |
| .color-swatches .dark { |
| -webkit-border-radius: 0 4px 0 0; |
| -moz-border-radius: 0 4px 0 0; |
| border-radius: 0 4px 0 0; |
| } |
| .color-swatches .infos { |
| padding: 5px 10px; |
| } |
| .color-swatches .infos h4, |
| .color-swatches .infos p { |
| margin: 0; |
| } |
| .color-swatches .infos h4 { |
| margin-bottom: 3px; |
| font-weight: bold; |
| font-size: 14px; |
| } |
| .color-swatches .infos p { |
| font-size: 12px; |
| } |
| /* ---------------------------------- |
| * psd-download |
| * ---------------------------------- */ |
| .psd-download { |
| padding: 40px 0; |
| background: #e6e9ed url(../img/github.png) no-repeat 100% 0; |
| min-height: 680px; |
| } |
| .psd-download h2 { |
| text-align: center; |
| } |
| .psd-download .infos { |
| font-size: 20px; |
| line-height: 40px; |
| } |
| .psd-download .row { |
| margin-top: 20px; |
| } |
| @media (max-width: 768px) { |
| .psd-download [class*="col-md-"] { |
| text-align: center; |
| } |
| } |
| .psd-download h4 { |
| margin: 0 0 15px 0; |
| } |
| .psd-download img { |
| margin-bottom: 15px; |
| } |
| /* ---------------------------------- |
| * previews |
| * ---------------------------------- */ |
| .previews { |
| text-align: center; |
| } |
| .previews p { |
| margin-bottom: 20px; |
| font-size: 20px; |
| line-height: 40px; |
| } |
| .previews img { |
| max-width: 100%; |
| } |
| /* ---------------------------------- |
| * btn-group & labels |
| * ---------------------------------- */ |
| .blank { |
| display: none; |
| } |
| @media (max-width: 768px) { |
| .blank { |
| display: block; |
| height: 15px; |
| } |
| } |
| /* ---------------------------------- |
| * site-footer |
| * ---------------------------------- */ |
| .site-footer { |
| position: relative; |
| z-index: 2000; |
| border-top: 1px dashed #AAB2BD; |
| padding: 40px 0 20px; |
| background-color: #f5f5f5; |
| } |
| .site-footer a, |
| .site-footer .connect { |
| color: #50c1e9; |
| } |
| .site-footer a:hover, |
| .site-footer a:active { |
| color: #50c1e9; |
| text-decoration: none; |
| } |
| .site-footer .row .col-md-4 { |
| margin-bottom: 20px; |
| } |
| .site-footer h3 { |
| margin-bottom: 20px; |
| font-weight: 600; |
| font-size: 18px; |
| } |
| .site-footer ul { |
| padding-left: 0; |
| } |
| .site-footer li { |
| list-style: none; |
| font-size: 14px; |
| } |
| .site-footer hr { |
| margin: 20px 0; |
| border: none; |
| height: 1px; |
| width: 100%; |
| } |
| .site-footer hr.dashed { |
| border-top: 1px dashed #ccc; |
| } |
| .site-footer .icon { |
| margin-right: 10px; |
| font-size: 28px; |
| } |
| .site-footer form { |
| padding: 0 !important; |
| } |
| .site-footer form label { |
| font-size: 14px !important; |
| font-weight: normal !important; |
| } |
| .site-footer input[type="email"] { |
| margin-right: 10px; |
| width: 75%; |
| } |
| .site-footer input[type="email"], |
| .site-footer input[type="email"]:focus, |
| .site-footer input[type="submit"], |
| .site-footer input[type="submit"]:active, |
| .site-footer input[type="submit"]:focus { |
| border: none !important; |
| } |
| .site-footer .email, |
| .site-footer .clear { |
| float: left; |
| } |
| .site-footer .copyright p:last-child { |
| margin-top: 10px; |
| } |
| .site-footer .copyright b { |
| font-size: 16px; |
| } |
| .site-footer .download .download__infos { |
| font-size: 18px; |
| } |
| .site-footer .download .btn { |
| color: #000; |
| } |
| .site-footer .download .btn-primary { |
| color: #fff; |
| } |
