@import "reset.css"; .indicator, .indicator-right { background: none; font-size: 12px; vertical-align: middle; font-weight: bold; color: #6c7680; } .indicator::before, .indicator-right::after { content: ''; display: inline-block; height: 8px; width: 8px; border-radius: 8px; } .indicator::before { margin: 0 4px 0 0px; } .indicator-right::after { margin: 0 0 0 4px; } .indicator.grey::before, .indicator-right.grey::after { background: #F0F4F7; } .indicator.blue::before, .indicator-right.blue::after { background: #5e64ff; } .indicator.red::before, .indicator-right.red::after { background: #ff5858; } .indicator.green::before, .indicator-right.green::after { background: #98d85b; } .indicator.orange::before, .indicator-right.orange::after { background: #ffa00a; } .indicator.purple::before, .indicator-right.purple::after { background: #743ee2; } .indicator.darkgrey::before, .indicator-right.darkgrey::after { background: #b8c2cc; } .indicator.black::before, .indicator-right.black::after { background: #36414C; } .indicator.yellow::before, .indicator-right.yellow::after { background: #FEEF72; } .indicator.light-blue::before, .indicator-right.light-blue::after { background: #7CD6FD; } .indicator.lightblue::before, .indicator-right.lightblue::after { background: #7CD6FD; } .modal-header .indicator { float: left; margin-top: 7.5px; margin-right: 3px; } a { color: #7575ff; text-decoration: none; transition: color 0.5s ease-in; } a:hover { color: #2E3338; text-decoration: underline; } .navbar { padding: 1rem 2.5rem; } .navbar-header { display: flex; justify-content: space-between; } .navbar-icon { width: 25px; margin-right: .5rem; padding-bottom: 0.07rem; } .navbar-brand { font-size: 1rem; font-weight: bold; text-decoration: none; color: #36414C; } .navbar-brand:hover { text-decoration: none; color: #2E3338; } .navbar-brand:visited { color: #36414C; } .menu { display: flex; } .menu-items { padding-left: 1.5rem; } .menu-links { color: #6c7680; text-decoration: none; } .menu-links:hover { text-decoration: none; } .container { max-width: 1200px; margin: 0 auto; } .feature, .footer { padding: 8rem 2.5rem; border-top: 1px solid #EBEFF2; } .page { padding: 0 2.5rem; border-top: 1px solid #EBEFF2; } .homepage-illustration { margin-bottom: 2.5rem; width: 100%; max-width: 900px; } .title { font-size: 2.5rem; line-height: 1.025; } .domain-links { font-size: 1.5rem; display: block; } .domain-image { width: 125px; padding-bottom: 1.5rem; } .list-items { text-align: center; padding: 2em; /* border: 1px solid @border-color;*/ border-radius: .5rem; background-color: #fff; } .list.grid-of-four { grid-gap: 2.5rem; } .list { list-style: none; padding-left: 0; } /*utilities*/ .left-aligned { text-align: left; } .right-aligned { text-align: right; } .centered { text-align: center; } .text-muted { color: #8D99A6; } .text-light { color: #6c7680; } .text-white { color: #fff; } .grid-of-four { display: grid; grid-template-columns: repeat(4, 1fr); } .intro-copy { font-size: 1.5rem; max-width: 600px; margin: 0 auto 1.5rem auto; line-height: 1.5em; } .community-bg .intro-copy { max-width: 800px; } .primary-links { color: #6c7680; transition: color 0.5s ease-in; } .primary-links:hover { color: #2E3338; text-decoration: none; } .button { padding: .75em 1.5em .5em; border-radius: .25em; cursor: pointer; transition: all 0.3s ease 0s; border-bottom: 3px solid rgba(0, 0, 0, 0.2); text-decoration: none; } .button:hover { text-decoration: none; } .button-primary { font-size: 1.5em; color: #fff; background: #7575ff; border-right: 0px; border-left: 0px; border-top: 0px; line-height: 3; } .button-primary:hover { background: #5e5ec9; color: #fff; } .button-secondary { font-size: 1.5em; color: #6c7680; background: #F0F4F7; border-right: 0px; border-left: 0px; border-top: 0px; line-height: 3; } .button-secondary:hover { background: #cad5df; color: #2E3338; } .gray-bg { background-color: #fafbfc; } .dark-bg { background-color: #2E3338; } .community-bg { background-image: linear-gradient(to bottom, rgba(117, 116, 254, 0.52), #7574fe), url("/assets/foundation/img/community-2016.jpg"); background-size: cover; background-repeat: no-repeat; background-position: center; background-attachment: fixed; } .secondary-link { color: #6c7680; transition: color 0.5s ease-in; } .secondary-link:hover { color: #2E3338; } .three-column { display: flex; justify-content: space-between; } .list-unstyled { padding: 0; margin: 0; } .list-unstyled li { list-style: none; } .bulleted-list { margin: 0; list-style: circle; padding-left: 1em; } .bulleted-list li { padding-bottom: 1em; } .footer-row { display: flex; text-align: left; justify-content: space-between; } .footer-list { padding-left: 0; padding: ; } .list-unstyled li { list-style: none; margin-bottom: 1rem; } .top-spacer { margin-top: 3rem; } .page-container { display: flex; max-width: 1200px; margin: 0 auto; } .active { color: #2E3338; } .breadcrumb { padding: 0; margin-bottom: 1.5rem; } .breadcrumb a, .breadcrumb a:focus, .breadcrumb a:visited { background-color: transparent; color: #8D99A6; } .breadcrumb a:hover { color: #2E3338; transition: color 0.5s ease-in; } .breadcrumb > li { display: inline-block; } .breadcrumb > li + li::before { padding: 0 5px; color: #8D99A6; content: "/\00a0"; } .sidebar-block { padding: 4rem 0; border-right: 1px solid black; min-width: 200px; border-right: 1px solid #EBEFF2; } .page-content { width: 100%; padding: 4rem 0; } .page-content.with-sidebar { padding: 4rem 0 4rem 2.5rem; } hr { margin-top: 20px; margin-bottom: 20px; border: 0; border-top: 1px solid #EBEFF2; } .footer-end { border-top: 1px solid #EBEFF2; padding: 2rem 2.5rem; font-size: 0.75rem; } .footer-end a { text-decoration: underline; color: #8D99A6; } .footer-end a:hover { color: #fff; } .footer-icon { width: 1.5rem; margin-right: .5em; } /* loaned from bootstrap*/ .btn-default { color: inherit; background-color: #F0F4F7; border-color: transparent; } .btn { display: inline-block; padding: .25em .75em; margin-bottom: 0; font-size: 1em; font-weight: normal; text-align: center; white-space: nowrap; vertical-align: middle; cursor: pointer; user-select: none; background-image: none; border: 1px solid transparent; border-radius: .25em; } .table-bordered { border: 1px solid #d1d8dd; } .table-bordered > thead > tr > th, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > tbody > tr > td, .table-bordered > tfoot > tr > td { border: 1px solid #d1d8dd; } .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td { padding: .5em; vertical-align: top; border-top: 1px solid #EBEFF2; } .btn-block { display: block; width: 100%; } .form-signin .form-control { position: relative; height: auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: .5rem ; margin-bottom: .5rem; } .form-control { display: block; width: 100%; height: 2em; padding: .5em; color: #2E3338; background-color: #fff; background-image: none; border: 1px solid #d1d8dd; border-radius: .25em; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; } code { color: #FC4F51; background: #fff5f5; padding: .25em; border-radius: .25em; font-size: .85em; } /*loaned from frappe*/ .page-card { max-width: 360px; padding: 1em; margin: 8rem auto; border: 1px solid #d1d8dd; border-radius: .25em; background-color: #fff; box-shadow: 0px 0.25em 0.5em rgba(0, 0, 0, 0.1); } .page-card .page-card-head { padding: .75em 1em; margin: -1em; margin-bottom: 1em; border-bottom: 1px solid #d1d8dd; } .login-content .btn { margin-top: 3rem; } .btn-primary { background-color: #7575ff; border-color: #7575ff; color: #fff; transition: background-color 0.5s ease-in; } .btn-primary:hover, .btn-primary:focus, .btn-primary.focus, .btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary { color: #fff; background-color: #5e5ec9; border-color: #5e5ec9; text-decoration: none; } .screenshot { max-width: 800px; margin: auto; } img.blog-cover-image, .blog-text img, .screenshot { box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1); border: 1px solid #d1d8dd; } .btn-next-wrapper { margin-top: 4rem; } /*blog*/ .blog-text h1, .blog-text h2, .blog-text h3, .blog-text h4, .blog-text h5, .blog-text h6 { margin-top: 3em; margin-bottom: 1em; font-weight: bold; color: #36414C; } .blog-list-content { border: 0px; background: transparent; } .blog-list-item { padding-top: 4em; padding-bottom: 4em; border-bottom: 1px solid #EBEFF2; } .blog-list-item:last-child { border-bottom: 0; } .blog-list-item a { color: #36414C; } .blog-list-item h1 { margin-bottom: .5em; font-weight: normal; } .blogpost-cover-img { width: 75%; } .blog-list-item .avatar { margin-right: 1em; } .blog-list-item .blog-header { font-size: 1.6em; } .blog-header { font-size: 2em; font-weight: bold; } .blog-comments { position: relative; border-top: 1px solid #d1d8dd; } .blog-info { margin: 2em 0; } .blog-text { line-height: 2; font-size: 1.25em; letter-spacing: 0.01em; } .blog-content { margin-bottom: 3em; } .blogger { padding-top: 0px; padding-bottom: 3em; } .blogger-name { margin-top: .25em; } .post-description { margin: 1em 0; } .blog-list-item .avatar { margin-right: 1em; } .avatar { display: inline-block; vertical-align: middle; width: 50px; height: 50px; } .avatar img { max-width: 100%; max-height: 100%; border-radius: 4px; } .inline-block { display: inline-block; } .blog-container { max-width: 800px; }