mirror of
https://github.com/usmannasir/cyberpanel.git
synced 2026-05-07 01:57:52 +02:00
Initial Commit
This commit is contained in:
usmannasir
213
static/baseTemplate/assets/frontend-elements/blog.css
Normal file
213
static/baseTemplate/assets/frontend-elements/blog.css
Normal file
@@ -0,0 +1,213 @@
|
||||
/* Blog specific elements */
|
||||
|
||||
.blog-box {
|
||||
margin: 0 0 50px;
|
||||
padding: 0 0 50px;
|
||||
border-bottom: rgba(0,0,0,0.05) solid 1px;
|
||||
}
|
||||
.blog-box .post-image a:hover img {
|
||||
opacity: 0.8;
|
||||
-webkit-transition: all .1s ease-in-out;
|
||||
-moz-transition: all .1s ease-in-out;
|
||||
-ms-transition: all .1s ease-in-out;
|
||||
-o-transition: all .1s ease-in-out;
|
||||
}
|
||||
.blog-box .post-title h3 {
|
||||
font-size: 22px;
|
||||
}
|
||||
.blog-box .post-meta {
|
||||
padding: 15px 0;
|
||||
font-size: 12px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.blog-box .post-meta span {
|
||||
padding: 0 20px 0 0;
|
||||
}
|
||||
.blog-box .post-content p {
|
||||
font-size: 13px;
|
||||
line-height: 1.7em;
|
||||
}
|
||||
.blog-box .post-content p + p {
|
||||
margin-top: 15px;
|
||||
}
|
||||
.blog-box .post-content {
|
||||
margin-bottom: 22px;
|
||||
}
|
||||
|
||||
/* Blog alternate */
|
||||
|
||||
.blog-box-alt .post-image {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.blog-box-alt .post-title h3 {
|
||||
font-size: 28px;
|
||||
}
|
||||
.blog-box-alt .post-content {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.blog-box-alt .post-content p {
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
/* Blog masonry */
|
||||
|
||||
.blog-box.panel {
|
||||
margin: 0 0 30px;
|
||||
padding: 0;
|
||||
}
|
||||
.blog-box.panel .post-image {
|
||||
margin: -1px -1px 0;
|
||||
}
|
||||
.blog-box.panel .post-image img {
|
||||
border-top-left-radius: 4px;
|
||||
border-top-right-radius: 4px;
|
||||
}
|
||||
.blog-box.panel .post-title h3 {
|
||||
font-size: 19px;
|
||||
}
|
||||
.blog-box.panel .post-title {
|
||||
margin: 15px 15px 0;
|
||||
display: block;
|
||||
}
|
||||
.blog-box.panel .post-meta {
|
||||
padding: 15px 15px;
|
||||
}
|
||||
.blog-box.panel .post-content {
|
||||
padding: 0 15px 15px;
|
||||
margin: 0;
|
||||
}
|
||||
.blog-box.panel .panel-footer span {
|
||||
font-size: 12px;
|
||||
}
|
||||
.blog-box.panel .panel-footer span .glyph-icon {
|
||||
margin: 0 2px;
|
||||
}
|
||||
|
||||
/* Posts lists */
|
||||
|
||||
.content-box .posts-list {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.posts-list ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.posts-list li {
|
||||
border-bottom-style: solid;
|
||||
border-bottom-width: 1px;
|
||||
padding: 15px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.posts-list li:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
.posts-list li .post-image {
|
||||
float: left;
|
||||
overflow: hidden;
|
||||
z-index: 1;
|
||||
display: inline;
|
||||
margin-right: 15px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
.posts-list li .post-image img {
|
||||
border-radius: 3px;
|
||||
width: 50px;
|
||||
}
|
||||
.posts-list li .post-body {
|
||||
overflow: hidden;
|
||||
font-size: 12px;
|
||||
}
|
||||
.posts-list li .post-title {
|
||||
margin-bottom: 10px;
|
||||
display: block;
|
||||
}
|
||||
.posts-list li .post-title h3 {
|
||||
font-size: 13px;
|
||||
line-height: 1.4em;
|
||||
}
|
||||
|
||||
/* Tags list */
|
||||
|
||||
.tags-list .bs-label {
|
||||
margin: 3px;
|
||||
float: left;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Single post */
|
||||
|
||||
.blog-box-single .post-title h3 {
|
||||
font-size: 32px;
|
||||
}
|
||||
.blog-box-single .post-image {
|
||||
margin-top: 30px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.blog-box-single .post-content {
|
||||
margin-top: 20px;
|
||||
}
|
||||
.blog-box-single {
|
||||
border: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/* Blog comments */
|
||||
|
||||
.blog-comments ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.blog-comments .comments-list li li {
|
||||
margin-left: 45px;
|
||||
margin-right: 25px;
|
||||
}
|
||||
.blog-comments .panel {
|
||||
|
||||
}
|
||||
.blog-comments .panel-body {
|
||||
padding: 25px;
|
||||
}
|
||||
|
||||
.blog-comments .comments-list .comment-image {
|
||||
display: inline;
|
||||
float: left;
|
||||
overflow: hidden;
|
||||
z-index: 1;
|
||||
margin-right: 25px;
|
||||
}
|
||||
.blog-comments .comments-list .comment-wrapper {
|
||||
overflow: hidden;
|
||||
z-index: 1;
|
||||
}
|
||||
.blog-comments .comments-list .comment-header {
|
||||
margin: 0 0 15px;
|
||||
}
|
||||
.blog-comments .comments-list .comment-header .comment-author b {
|
||||
opacity: 0.7;
|
||||
}
|
||||
.blog-comments .comments-list .comment-header .comment-date {
|
||||
opacity: 0.6;
|
||||
font-size: 11px;
|
||||
padding: 4px 0 0;
|
||||
}
|
||||
.blog-comments .comments-list .comment-header .btn-xs {
|
||||
float: right;
|
||||
margin: 0 0 0;
|
||||
}
|
||||
.blog-comments .comments-list .comment-image img {
|
||||
width: 60px;
|
||||
}
|
||||
.blog-comments .comments-list .comment-body p {
|
||||
font-size: 12px;
|
||||
line-height: 1.9em;
|
||||
opacity: 0.9;
|
||||
}
|
||||
.post-share-box {
|
||||
margin-top: 30px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
67
static/baseTemplate/assets/frontend-elements/cta-box.css
Normal file
67
static/baseTemplate/assets/frontend-elements/cta-box.css
Normal file
@@ -0,0 +1,67 @@
|
||||
/* CTA Boxes */
|
||||
|
||||
.cta-box {
|
||||
text-align: center;
|
||||
}
|
||||
.cta-box .cta-title {
|
||||
font-size: 26px;
|
||||
font-weight: normal;
|
||||
display: inline-block;
|
||||
margin: 0 15px 0 0;
|
||||
padding: 0;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.cta-box .cta-text {
|
||||
font-size: 17px;
|
||||
display: inline-block;
|
||||
margin: 0 15px 0 0;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.cta-box .cta-btn {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
/* CTA Button */
|
||||
|
||||
.cta-box-btn {
|
||||
text-align: center;
|
||||
position: relative;
|
||||
z-index: 25;
|
||||
}
|
||||
.cta-box-btn a {
|
||||
margin: -10px 0;
|
||||
height: auto;
|
||||
line-height: 1.3em;
|
||||
text-transform: capitalize;
|
||||
padding: 15px 35px;
|
||||
font-size: 23px;
|
||||
display: inline-block;
|
||||
}
|
||||
.cta-box-btn a span {
|
||||
display: block;
|
||||
font-size: 13px;
|
||||
color: rgba(255,255,255,.7);
|
||||
text-transform: uppercase!important;
|
||||
}
|
||||
|
||||
/* CTA vertical */
|
||||
|
||||
.cta-box-vertical {
|
||||
text-align: center;
|
||||
}
|
||||
.cta-box-vertical h3 {
|
||||
color: #464646;
|
||||
font-size: 24px;
|
||||
margin: 0;
|
||||
}
|
||||
.cta-box-vertical p {
|
||||
color: #8b8b8b;
|
||||
font-size: 19px;
|
||||
margin: 0 0 25px;
|
||||
}
|
||||
.cta-box-vertical .hero-btn {
|
||||
height: 60px;
|
||||
line-height: 59px;
|
||||
margin: 0 auto;
|
||||
min-width: 260px;
|
||||
}
|
||||
223
static/baseTemplate/assets/frontend-elements/feature-box.css
Normal file
223
static/baseTemplate/assets/frontend-elements/feature-box.css
Normal file
@@ -0,0 +1,223 @@
|
||||
/* Feature Boxes */
|
||||
|
||||
.feature-box .feature-content {
|
||||
overflow: hidden;
|
||||
padding: 0 35px;
|
||||
}
|
||||
.feature-box .feature-img {
|
||||
float: left;
|
||||
margin: 0 40px 0 20px;
|
||||
}
|
||||
.feature-box .feature-img.float-right {
|
||||
margin: 0 20px 0 40px;
|
||||
}
|
||||
.feature-box .feature-img > a > img,
|
||||
.feature-box .feature-img > img {
|
||||
width: 100%;
|
||||
margin-top: 25px;
|
||||
padding: 10px;
|
||||
}
|
||||
.feature-box .feature-content .feature-heading {
|
||||
padding: 20px 0 0;
|
||||
}
|
||||
.feature-box .feature-content .feature-heading h2 {
|
||||
font-size: 30px;
|
||||
}
|
||||
.feature-box .feature-content .feature-heading p {
|
||||
font-size: 18px;
|
||||
font-weight: normal;
|
||||
line-height: 1.6em;
|
||||
padding: 15px 0;
|
||||
opacity: .65;
|
||||
-moz-opacity: .65;
|
||||
filter: alpha(opacity: 65);
|
||||
}
|
||||
.feature-content .feature-list {
|
||||
margin: 25px 0 0;
|
||||
}
|
||||
.feature-list {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
.feature-list li {
|
||||
padding: 0 0 35px;
|
||||
}
|
||||
.feature-list li .glyph-icon {
|
||||
font-size: 26px;
|
||||
line-height: 40px;
|
||||
float: left;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
margin: -5px 5px 0 0;
|
||||
text-align: center;
|
||||
opacity: .75;
|
||||
-moz-opacity: .75;
|
||||
filter: alpha(opacity: 75);
|
||||
}
|
||||
.feature-list li span {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
}
|
||||
.feature-list li b {
|
||||
font-size: 20px;
|
||||
font-weight: 300;
|
||||
display: block;
|
||||
}
|
||||
.feature-list li p {
|
||||
font-size: 14px;
|
||||
line-height: 2em;
|
||||
margin: 5px 0 0;
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
/* Featured icons */
|
||||
|
||||
.feature-icon {
|
||||
float: none;
|
||||
margin: 0 auto;
|
||||
text-align: left;
|
||||
}
|
||||
.feature-icon .feature-box-wrapper {
|
||||
padding: 35px 0 35px 110px;
|
||||
position: relative;
|
||||
}
|
||||
.feature-icon .feature-box-wrapper .glyph-icon {
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
width: 90px;
|
||||
display: block;
|
||||
font-size: 80px;
|
||||
left: 0;
|
||||
height: 100px;
|
||||
line-height: 100px;
|
||||
top: 50%;
|
||||
margin-top: -50px;
|
||||
color: rgba(255,255,255,0.4);
|
||||
}
|
||||
.feature-icon h3 {
|
||||
font-size: 35px;
|
||||
font-weight: 300;
|
||||
margin: 0;
|
||||
color: rgba(255,255,255,0.8);
|
||||
}
|
||||
.feature-icon p {
|
||||
margin: 5px 0 0;
|
||||
font-size: 20px;
|
||||
color: rgba(255,255,255,0.5);
|
||||
line-height: 1.5em;
|
||||
}
|
||||
|
||||
/* Clients box */
|
||||
|
||||
.clients-title {
|
||||
font-weight: 300;
|
||||
font-size: 55px;
|
||||
text-align: center;
|
||||
line-height: 1.3em;
|
||||
padding: 0 70px;
|
||||
margin: 0 0 34px;
|
||||
}
|
||||
.clients-title + .text-center {
|
||||
margin-bottom: 24px;
|
||||
margin-top: -10px;
|
||||
}
|
||||
.clients-desc {
|
||||
opacity: 0.5;
|
||||
text-align: center;
|
||||
padding: 0 60px 50px;
|
||||
font-size: 23px;
|
||||
line-height: 1.6em;
|
||||
}
|
||||
.clients-box .content-box {
|
||||
height: 100px;
|
||||
line-height: 100px;
|
||||
margin: 0 0 20px;
|
||||
font-size: 45px;
|
||||
text-align: center;
|
||||
}
|
||||
.tick-feature {
|
||||
padding: 0 25px;
|
||||
font-size: 20px;
|
||||
}
|
||||
.tick-feature .glyph-icon {
|
||||
margin-right: 5px;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
/* Tabs checklist */
|
||||
|
||||
.tabs-nav {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
position: relative;
|
||||
z-index: 6;
|
||||
text-align: center;
|
||||
}
|
||||
.tabs-nav:before {
|
||||
content: "";
|
||||
height: 1px;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
background: #f1f1f1;
|
||||
z-index: 5;
|
||||
}
|
||||
.tabs-nav li {
|
||||
display: inline-block;
|
||||
margin: 0 -5px 0 0;
|
||||
position: relative;
|
||||
z-index: 6;
|
||||
}
|
||||
.tabs-nav li:first-child a {
|
||||
border-top-left-radius: 4px;
|
||||
border-bottom-left-radius: 4px;
|
||||
}
|
||||
.tabs-nav li:last-child a {
|
||||
border-top-right-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
.tabs-nav li a {
|
||||
display: block;
|
||||
padding: 15px 40px;
|
||||
text-transform: uppercase;
|
||||
font-size: 20px;
|
||||
border: 1px solid #d1d1d1;
|
||||
color: #bfbfbf;
|
||||
background: #fff;
|
||||
}
|
||||
.tabs-nav li.active a {
|
||||
background: #fdfdfd;
|
||||
}
|
||||
|
||||
/* Features tour box */
|
||||
|
||||
.features-tour-box {
|
||||
padding: 55px 0;
|
||||
}
|
||||
.features-tour-box h3 {
|
||||
font-size: 30px;
|
||||
text-transform: uppercase;
|
||||
margin: 0;
|
||||
}
|
||||
.features-tour-box p {
|
||||
line-height: 1.7em;
|
||||
margin: 15px 0;
|
||||
}
|
||||
.features-tour-box ul {
|
||||
list-style: none;
|
||||
margin: 0 0 0 25px;
|
||||
padding: 0;
|
||||
}
|
||||
.features-tour-box ul li {
|
||||
font-size: 16px;
|
||||
padding: 6px 0;
|
||||
color: rgba(0,0,0,0.6);
|
||||
}
|
||||
.features-tour-box ul li .glyph-icon {
|
||||
margin-right: 10px;
|
||||
font-size: 22px;
|
||||
}
|
||||
100
static/baseTemplate/assets/frontend-elements/footer.css
Normal file
100
static/baseTemplate/assets/frontend-elements/footer.css
Normal file
@@ -0,0 +1,100 @@
|
||||
/* Footer */
|
||||
|
||||
.main-footer {
|
||||
position: relative;
|
||||
padding-top: 35px;
|
||||
color: rgba(255, 255, 255, .3);
|
||||
}
|
||||
.main-footer a {
|
||||
color: rgba(255, 255, 255, .4);
|
||||
}
|
||||
.main-footer a:hover {
|
||||
color: rgba(255, 255, 255, .8);
|
||||
}
|
||||
.main-footer p.about-us {
|
||||
font-size: 12px;
|
||||
line-height: 1.8em;
|
||||
}
|
||||
.main-footer .posts-list li .post-image img {
|
||||
width: 88px;
|
||||
}
|
||||
.main-footer .posts-list li {
|
||||
padding: 0 0 15px;
|
||||
margin: 0 0 15px;
|
||||
border-bottom-color: rgba(255, 255, 255, .1);;
|
||||
}
|
||||
.main-footer .posts-list li .post-title h3 {
|
||||
font-size: 14px;
|
||||
}
|
||||
.main-footer .posts-list li a {
|
||||
color: rgba(255, 255, 255, .8);
|
||||
}
|
||||
.main-footer .posts-list li a:hover {
|
||||
color: #fff;
|
||||
}
|
||||
.main-footer .footer-nav li,
|
||||
.main-footer .footer-nav li a {
|
||||
display: block;
|
||||
}
|
||||
.main-footer .footer-nav li {
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
.main-footer .footer-nav li a {
|
||||
border-radius: 3px;
|
||||
padding: 5px 10px;
|
||||
font-size: 12px;
|
||||
}
|
||||
.main-footer .footer-nav li a:hover {
|
||||
background: rgba(255,255,255,0.1);
|
||||
}
|
||||
.main-footer .header {
|
||||
font-size: 12px;
|
||||
text-transform: uppercase;
|
||||
color: rgba(255, 255, 255, .8);
|
||||
padding: 0 0 20px;
|
||||
}
|
||||
.main-footer .no-gutter .col-xs-4 {
|
||||
padding: 3px;
|
||||
}
|
||||
.main-footer .no-gutter {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
.main-footer .no-gutter .col-xs-4 img {
|
||||
border-radius: 3px;
|
||||
}
|
||||
.main-footer ul.footer-contact {
|
||||
margin-top: -15px;
|
||||
}
|
||||
.main-footer .footer-contact li {
|
||||
padding: 5px 0;
|
||||
font-size: 12px;
|
||||
}
|
||||
.main-footer .divider {
|
||||
background: rgba(255,255,255,0.06);
|
||||
margin: 15px 0;
|
||||
}
|
||||
.main-footer .theme-color-wrapper {
|
||||
|
||||
}
|
||||
.main-footer .theme-color-wrapper {
|
||||
padding: 0;
|
||||
}
|
||||
.main-footer ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
.footer-pane {
|
||||
background: rgba(0,0,0,0.1);
|
||||
padding: 20px 0;
|
||||
font-size: 12px;
|
||||
}
|
||||
.footer-pane .logo {
|
||||
float: left;
|
||||
}
|
||||
.footer-pane .footer-nav-bottom {
|
||||
float: right;
|
||||
}
|
||||
.footer-pane .footer-nav-bottom a {
|
||||
padding: 0 5px;
|
||||
}
|
||||
118
static/baseTemplate/assets/frontend-elements/hero-box.css
Normal file
118
static/baseTemplate/assets/frontend-elements/hero-box.css
Normal file
@@ -0,0 +1,118 @@
|
||||
/* Hero sections */
|
||||
|
||||
.hero-box {
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
-webkit-background-size: cover;
|
||||
-moz-background-size: cover;
|
||||
-o-background-size: cover;
|
||||
background-size: cover;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
}
|
||||
.hero-box * {
|
||||
position: relative;
|
||||
z-index: 13;
|
||||
}
|
||||
.hero-heading {
|
||||
font-weight: 300;
|
||||
padding: 0 50px;
|
||||
text-transform: uppercase;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.hero-text {
|
||||
font-weight: 100;
|
||||
padding: 10px 50px 0;
|
||||
margin: 0 auto;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
/* Hero overlays */
|
||||
|
||||
.hero-video,
|
||||
.hero-pattern,
|
||||
.hero-overlay {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 10;
|
||||
}
|
||||
.hero-pattern,
|
||||
.hero-overlay {
|
||||
opacity: 0.5;
|
||||
-moz-opacity: .50;
|
||||
filter: alpha(opacity: 50);
|
||||
}
|
||||
.hero-dark {
|
||||
background: #000;
|
||||
}
|
||||
.hero-light {
|
||||
background: #fff;
|
||||
}
|
||||
/* Hero patterns */
|
||||
|
||||
.hero-pattern {
|
||||
opacity: 0.05;
|
||||
-moz-opacity: .05;
|
||||
filter: alpha(opacity: .05);
|
||||
z-index: 12;
|
||||
}
|
||||
.hero-video {
|
||||
z-index: 9;
|
||||
}
|
||||
/* Hero alignments */
|
||||
|
||||
.hero-left {
|
||||
text-align: left;
|
||||
}
|
||||
.hero-left .hero-btn {
|
||||
margin-left: 50px;
|
||||
}
|
||||
.hero-right {
|
||||
text-align: right;
|
||||
}
|
||||
.hero-right .hero-btn {
|
||||
margin-right: 50px;
|
||||
}
|
||||
/* Image holder in hero sections */
|
||||
|
||||
.bg-holder {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
.bg-holder.float-right img {
|
||||
right: auto;
|
||||
left: 0;
|
||||
}
|
||||
.bg-holder img {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
/* Hero elements */
|
||||
|
||||
.hero-box .img-holder img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Page title */
|
||||
|
||||
.hero-box.page-title {
|
||||
padding: 15px 0;
|
||||
}
|
||||
|
||||
/* Contact widget */
|
||||
|
||||
.contact-list li {
|
||||
padding: 5px;
|
||||
font-size: 14px;
|
||||
}
|
||||
.contact-list li .glyph-icon {
|
||||
margin-right: 5px;
|
||||
}
|
||||
121
static/baseTemplate/assets/frontend-elements/icon-box.css
Normal file
121
static/baseTemplate/assets/frontend-elements/icon-box.css
Normal file
@@ -0,0 +1,121 @@
|
||||
/* Icon box */
|
||||
|
||||
.icon-box {
|
||||
text-align: center;
|
||||
}
|
||||
.icon-small {
|
||||
font-size: 28px;
|
||||
line-height: 56px;
|
||||
width: 56px;
|
||||
height: 56px;
|
||||
}
|
||||
.icon-medium {
|
||||
font-size: 38px;
|
||||
line-height: 76px;
|
||||
width: 76px;
|
||||
height: 76px;
|
||||
}
|
||||
.icon-large {
|
||||
font-size: 48px;
|
||||
line-height: 96px;
|
||||
width: 96px;
|
||||
height: 96px;
|
||||
}
|
||||
.icon-box.icon-box-left .icon-alt {
|
||||
font-size: 44px;
|
||||
margin-top: -10px;
|
||||
margin-right: 25px;
|
||||
width: 40px;
|
||||
}
|
||||
.icon-content-wrapper {
|
||||
overflow: hidden;
|
||||
}
|
||||
.icon-box.icon-box-offset-small .glyph-icon {
|
||||
margin-top: -48px;
|
||||
}
|
||||
.icon-box.icon-box-offset-medium .glyph-icon {
|
||||
margin-top: -58px;
|
||||
}
|
||||
.icon-box.icon-box-offset-large .glyph-icon {
|
||||
margin-top: -68px;
|
||||
}
|
||||
.icon-box.icon-box-offset-small {
|
||||
margin-top: 24px;
|
||||
}
|
||||
.icon-box.icon-box-offset-medium {
|
||||
margin-top: 29px;
|
||||
}
|
||||
.icon-box.icon-box-offset-large {
|
||||
margin-top: 34px;
|
||||
}
|
||||
.icon-box .glyph-icon {
|
||||
font-weight: normal;
|
||||
display: block;
|
||||
margin: 0 auto 20px;
|
||||
border-radius: 100%;
|
||||
}
|
||||
.icon-border {
|
||||
border: transparent solid 2px;
|
||||
}
|
||||
.icon-box .icon-title {
|
||||
font-size: 17px;
|
||||
margin: 0;
|
||||
color: rgba(0, 0, 0, .9);
|
||||
}
|
||||
.icon-box.inverse .icon-title {
|
||||
color: rgba(255, 255, 255, .9);
|
||||
}
|
||||
.icon-box .icon-content {
|
||||
line-height: 1.6em;
|
||||
margin: 0;
|
||||
padding: 10px;
|
||||
color: rgba(0, 0, 0, .45);
|
||||
overflow: hidden;
|
||||
font-size: 15px;
|
||||
}
|
||||
.icon-box.inverse .icon-content {
|
||||
color: rgba(255, 255, 255, .6);
|
||||
}
|
||||
/* Boxed style */
|
||||
|
||||
.icon-boxed {
|
||||
padding: 20px 0;
|
||||
}
|
||||
/* Left icons */
|
||||
|
||||
.icon-box-left {
|
||||
text-align: left;
|
||||
}
|
||||
.icon-box-left .glyph-icon {
|
||||
float: left;
|
||||
margin-right: 15px;
|
||||
text-align: center;
|
||||
}
|
||||
.icon-box-left .icon-content {
|
||||
padding: 10px 0;
|
||||
}
|
||||
.icon-box .read-more {
|
||||
margin: 5px 0 0 63px;
|
||||
color: rgba(255, 255, 255, .9);
|
||||
display: inline-block;
|
||||
padding: 5px 15px;
|
||||
font-weight: 700;
|
||||
font-size: 11px;
|
||||
border: 1px solid rgba(255, 255, 255, .2);
|
||||
text-transform: uppercase;
|
||||
border-radius: 50px;
|
||||
}
|
||||
.icon-box .read-more:hover {
|
||||
color: #fff;
|
||||
border-color: rgba(255,255,255,.4);
|
||||
background: rgba(255,255,255,.07);
|
||||
}
|
||||
.hero-box .icon-box .icon-alt {
|
||||
color: rgba(255,255,255,.3);
|
||||
}
|
||||
.hero-box .icon-box .icon-content {
|
||||
color: rgba(255,255,255,.7);
|
||||
}
|
||||
.hero-box .icon-box .icon-title {
|
||||
color: rgba(255,255,255,.9);
|
||||
}
|
||||
@@ -0,0 +1,74 @@
|
||||
/* Portfolio Nav */
|
||||
|
||||
.portfolio-controls {
|
||||
margin: 15px 0;
|
||||
padding: 15px 0;
|
||||
}
|
||||
.dropdown.controls {
|
||||
margin: 30px 0;
|
||||
}
|
||||
.portfolio-controls ul {
|
||||
float: right;
|
||||
margin: 0 -5px 0 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
.portfolio-category {
|
||||
float: left;
|
||||
margin: 0;
|
||||
padding: 0 10px 0 0;
|
||||
}
|
||||
.portfolio-category-alt {
|
||||
margin-top: 36px;
|
||||
}
|
||||
.portfolio-controls ul .filter {
|
||||
line-height: 32px;
|
||||
display: block;
|
||||
float: left;
|
||||
height: 32px;
|
||||
margin: 0 5px;
|
||||
padding: 0 10px;
|
||||
}
|
||||
.portfolio-nav-alt .portfolio-category {
|
||||
color: rgba(255, 255, 255, .8);
|
||||
}
|
||||
.portfolio-nav-alt.inverse .portfolio-category {
|
||||
color: rgba(0, 0, 0, .8);
|
||||
}
|
||||
.portfolio-controls.portfolio-nav-alt.inverse ul .filter {
|
||||
color: rgba(0, 0, 0, .6);
|
||||
}
|
||||
.portfolio-controls.portfolio-nav-alt.inverse ul .filter:hover,
|
||||
.portfolio-controls.portfolio-nav-alt.inverse ul .filter.active {
|
||||
color: #000;
|
||||
}
|
||||
.portfolio-controls ul .filter:hover,
|
||||
.portfolio-controls ul .filter.active {
|
||||
cursor: pointer;
|
||||
color: #fff;
|
||||
border-radius: 4px;
|
||||
background: rgba(0, 0, 0, .05);
|
||||
}
|
||||
.portfolio-nav-alt {
|
||||
margin: 0 0 20px;
|
||||
padding: 20px 0;
|
||||
}
|
||||
.portfolio-controls.portfolio-nav-alt ul .filter {
|
||||
color: rgba(255, 255, 255, .6);
|
||||
}
|
||||
.portfolio-controls.portfolio-nav-alt ul .filter:hover,
|
||||
.portfolio-controls.portfolio-nav-alt ul .filter.active {
|
||||
color: #fff;
|
||||
}
|
||||
.isotope {
|
||||
margin-top: 20px;
|
||||
}
|
||||
/*.isotope .thumbnail-box,
|
||||
.isotope .thumb-box, */
|
||||
|
||||
.portfolio-fullwidth .thumbnail-box,
|
||||
.portfolio-fullwidth ul li .thumb-box,
|
||||
.portfolio-fullwidth ul li.mix_all {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
225
static/baseTemplate/assets/frontend-elements/pricing-table.css
Normal file
225
static/baseTemplate/assets/frontend-elements/pricing-table.css
Normal file
@@ -0,0 +1,225 @@
|
||||
/* Pricing tables */
|
||||
|
||||
.pricing-box {
|
||||
text-align: center;
|
||||
}
|
||||
.pricing-box .pricing-title,
|
||||
.pricing-box .pricing-specs {
|
||||
margin: -1px -1px 0;
|
||||
}
|
||||
.pricing-box .pricing-title {
|
||||
font-weight: normal;
|
||||
padding: 15px;
|
||||
}
|
||||
.pricing-box ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
.pricing-box .pricing-specs {
|
||||
padding: 10px 15px 20px;
|
||||
}
|
||||
.pricing-box .pricing-specs span {
|
||||
font-size: 50px;
|
||||
}
|
||||
.pricing-box .pricing-specs span sup {
|
||||
font-size: 30px;
|
||||
margin-left: -20px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
.pricing-box .pricing-specs i {
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
display: block;
|
||||
color: rgba(255, 255, 255, .6);
|
||||
}
|
||||
.pricing-box ul li {
|
||||
font-size: 14px;
|
||||
line-height: 48px;
|
||||
height: 48px;
|
||||
padding: 0 10px;
|
||||
border-bottom: #eee solid 1px;
|
||||
}
|
||||
.pricing-box ul li:nth-child(even) {
|
||||
background: #fafafa;
|
||||
}
|
||||
/* Pricing table alternate style */
|
||||
|
||||
.pricing-table .pricing-box {
|
||||
padding: 0;
|
||||
}
|
||||
.pricing-table .pricing-box + .pricing-box {
|
||||
border-width: 1px 1px 1px 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
.pricing-table .pricing-box + .pricing-box:nth-child(2):last-child {
|
||||
border-width: 1px 1px 1px;
|
||||
}
|
||||
.pricing-table .pricing-box .pricing-title,
|
||||
.pricing-table .pricing-box .pricing-specs {
|
||||
margin: 0;
|
||||
border-bottom: #eee solid 1px;
|
||||
border-radius: 0;
|
||||
}
|
||||
.pricing-table .pricing-box .pricing-specs span {
|
||||
font-size: 40px;
|
||||
}
|
||||
.pricing-table .pricing-box .pricing-specs span sup {
|
||||
font-size: 20px;
|
||||
margin-left: -10px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
.pricing-table .pricing-box .pricing-specs i {
|
||||
color: rgba(0, 0, 0, .5);
|
||||
}
|
||||
.pricing-table .pricing-best {
|
||||
position: relative;
|
||||
z-index: 15;
|
||||
margin-right: -1px;
|
||||
margin-left: -1px;
|
||||
box-shadow: 0 0 10px 0 rgba(0, 0, 0, .1);
|
||||
}
|
||||
.pricing-table .pricing-best .pricing-specs {
|
||||
background: #fafafa;
|
||||
}
|
||||
.pricing-table .pricing-best .pricing-title {
|
||||
font-size: 28px;
|
||||
line-height: 60px;
|
||||
height: 90px;
|
||||
margin: -25px -1px 0;
|
||||
}
|
||||
|
||||
/* Pricing alternate */
|
||||
|
||||
.pricing-box-alt {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.pricing-box-alt .col-md-3 {
|
||||
padding: 0;
|
||||
border: #c6c6c6 solid 1px;
|
||||
border-width: 1px 1px 1px 0;
|
||||
width: 26%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.pricing-box-alt .plans-features {
|
||||
width: 22%;
|
||||
text-align: right;
|
||||
border-color: transparent #c6c6c6 transparent transparent;
|
||||
}
|
||||
|
||||
.pricing-box-alt .plans-features .plan-header {
|
||||
height: 170px;
|
||||
}
|
||||
|
||||
.pricing-box-alt .plans-features ul li {
|
||||
border-left: #f0f0f0 solid 1px;
|
||||
}
|
||||
|
||||
.pricing-box-alt ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.pricing-box-alt .plan-header {
|
||||
padding: 15px;
|
||||
border-bottom: #f0f0f0 solid 1px;
|
||||
}
|
||||
|
||||
.pricing-box-alt .plan-header h4 {
|
||||
margin: 0;
|
||||
color: #f26b33;
|
||||
text-transform: uppercase;
|
||||
font-size: 17px;
|
||||
font-weight: bold;
|
||||
height: 40px;
|
||||
line-height: 30px;
|
||||
border-bottom: #F3F3F3 solid 1px;
|
||||
}
|
||||
|
||||
.pricing-box-alt .plan-header .plan-price {
|
||||
font-size: 45px;
|
||||
font-weight: 100;
|
||||
height: 60px;
|
||||
line-height: 65px;
|
||||
margin: 0 0 5px;
|
||||
}
|
||||
|
||||
.pricing-box-alt .plan-header .plan-price small {
|
||||
font-size: 30px;
|
||||
opacity: 0.4;
|
||||
padding-right: 3px;
|
||||
}
|
||||
|
||||
.pricing-box-alt .studio-plan .plan-header h4 {
|
||||
color: #32cf4e;
|
||||
}
|
||||
|
||||
.pricing-box-alt .unlimited-plan .plan-header h4 {
|
||||
color: #3792f2;
|
||||
}
|
||||
|
||||
.pricing-box-alt ul li {
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
padding: 0 10px;
|
||||
border-bottom: #f0f0f0 solid 1px;
|
||||
color: #0093d9;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.pricing-box-alt .plans-features ul li {
|
||||
color: #6f6f6f;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.pricing-box-alt ul li .feature-included,
|
||||
.pricing-box-alt ul li .feature-excluded {
|
||||
border-radius: 30px;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.pricing-box-alt ul li .feature-excluded {
|
||||
background: #e6e6e6;
|
||||
}
|
||||
|
||||
.pricing-box-alt .pricing-btn {
|
||||
padding: 15px;
|
||||
background: #fafafa;
|
||||
}
|
||||
|
||||
.pricing-box-alt .pricing-btn .btn {
|
||||
padding: 15px 0;
|
||||
font-weight: bold;
|
||||
font-size: 16px;
|
||||
box-sizing: initial;
|
||||
display: block;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.pricing-box-alt .pricing-btn .btn b {
|
||||
opacity: 0.6;
|
||||
display: block;
|
||||
padding: 6px 0 0;
|
||||
font-size: 13px;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.individual-plan .pricing-btn {
|
||||
border-left: #c6c6c6 solid 1px;
|
||||
margin-left: -1px;
|
||||
}
|
||||
|
||||
.pricing-box-alt ul li.header {
|
||||
background: #f9f9f9;
|
||||
text-transform: uppercase;
|
||||
font-weight: bold;
|
||||
text-align: right;
|
||||
font-size: 12px;
|
||||
color: #000;
|
||||
}
|
||||
36
static/baseTemplate/assets/frontend-elements/sliders.css
Normal file
36
static/baseTemplate/assets/frontend-elements/sliders.css
Normal file
@@ -0,0 +1,36 @@
|
||||
/* Iphone */
|
||||
|
||||
.iphone-wrapper,
|
||||
.iphone-screen {
|
||||
position: relative;
|
||||
width: 366px;
|
||||
height: 768px;
|
||||
}
|
||||
.iphone-screen {
|
||||
position: absolute;
|
||||
z-index: 6;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background-image: url('../image-resources/objects/iphone-screen.png');
|
||||
}
|
||||
.iphone-content {
|
||||
position: absolute;
|
||||
z-index: 7;
|
||||
top: 112px;
|
||||
left: 30px;
|
||||
width: 310px;
|
||||
height: 541px;
|
||||
}
|
||||
.iphone-content .owl-pagination {
|
||||
display: none !important;
|
||||
}
|
||||
.iphone-content .slider-wrapper .owl-controls .owl-buttons .owl-prev {
|
||||
font-size: 95px;
|
||||
right: auto;
|
||||
left: -65px;
|
||||
}
|
||||
.iphone-content .slider-wrapper .owl-controls .owl-buttons .owl-next {
|
||||
font-size: 95px;
|
||||
right: -65px;
|
||||
left: auto;
|
||||
}
|
||||
166
static/baseTemplate/assets/frontend-elements/testimonial-box.css
Normal file
166
static/baseTemplate/assets/frontend-elements/testimonial-box.css
Normal file
@@ -0,0 +1,166 @@
|
||||
/* Testimonials */
|
||||
|
||||
.testimonial-box {
|
||||
margin: 0 0 45px;
|
||||
}
|
||||
.owl-item .testimonial-box {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.testimonial-box .popover {
|
||||
position: relative;
|
||||
display: block;
|
||||
float: none;
|
||||
margin: 0;
|
||||
-webkit-box-shadow: 0 0 0 transparent;
|
||||
-moz-box-shadow: 0 0 0 transparent;
|
||||
box-shadow: 0 0 0 transparent;
|
||||
}
|
||||
.testimonial-box .popover .arrow {
|
||||
left: 54px !important;
|
||||
margin: 0;
|
||||
}
|
||||
.testimonial-box .popover .arrow.float-right {
|
||||
right: 45px !important;
|
||||
left: auto !important;
|
||||
}
|
||||
.testimonial-box .popover .popover-content {
|
||||
padding: 22px 30px 30px 50px;
|
||||
}
|
||||
.testimonial-box-big .testimonial-content .glyph-icon,
|
||||
.testimonial-box .popover .popover-content .glyph-icon {
|
||||
font-size: 25px;
|
||||
position: absolute;
|
||||
opacity: .25;
|
||||
-moz-opacity: .25;
|
||||
filter: alpha(opacity: 25);
|
||||
}
|
||||
.testimonial-box .popover .popover-content .icon-quote-left {
|
||||
top: 15px;
|
||||
left: 15px;
|
||||
}
|
||||
.testimonial-box .popover .popover-content .icon-quote-right {
|
||||
right: 15px;
|
||||
bottom: 10px;
|
||||
}
|
||||
.testimonial-box-big .testimonial-content {
|
||||
background: transparent;
|
||||
}
|
||||
.testimonial-box-big .testimonial-content p,
|
||||
.testimonial-box .popover .popover-content p {
|
||||
font-family: Georgia, Times, 'Times New Roman', serif;
|
||||
font-size: 17px;
|
||||
margin: 0;
|
||||
}
|
||||
.testimonial-author-wrapper {
|
||||
padding: 20px 0 0;
|
||||
}
|
||||
.testimonial-author-wrapper img {
|
||||
float: left;
|
||||
width: 60px;
|
||||
margin: 0 20px 0 25px;
|
||||
}
|
||||
.testimonial-author-wrapper img.float-right {
|
||||
margin: 0 25px 0 20px;
|
||||
}
|
||||
.testimonial-author {
|
||||
overflow: hidden;
|
||||
}
|
||||
.testimonial-author b {
|
||||
font-size: 18px;
|
||||
font-weight: 300;
|
||||
display: block;
|
||||
padding: 6px 0 0;
|
||||
}
|
||||
.testimonial-author span {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
/* Testimonials Big */
|
||||
|
||||
.testimonial-box-big {
|
||||
text-align: center;
|
||||
}
|
||||
.testimonial-box-big .testimonial-content .glyph-icon {
|
||||
font-size: 40px;
|
||||
}
|
||||
.testimonial-box-big .testimonial-content .icon-quote-left {
|
||||
top: 0;
|
||||
left: -30px;
|
||||
}
|
||||
.testimonial-box-big .testimonial-content .icon-quote-right {
|
||||
right: -30px;
|
||||
bottom: 0;
|
||||
}
|
||||
.testimonial-box-big .testimonial-author-wrapper {
|
||||
display: inline-block;
|
||||
padding-top: 0;
|
||||
}
|
||||
.testimonial-box-big .testimonial-author-wrapper .testimonial-author b {
|
||||
padding: 0 0 10px;
|
||||
}
|
||||
.testimonial-box-big .testimonial-author-wrapper img {
|
||||
display: none;
|
||||
}
|
||||
.testimonial-box-big .testimonial-content {
|
||||
position: relative;
|
||||
margin: 0 40px;
|
||||
}
|
||||
.testimonial-box-big .testimonial-content p {
|
||||
font-size: 22px;
|
||||
padding: 0 20px;
|
||||
}
|
||||
.slider-wrapper .testimonial-box-big {
|
||||
margin-bottom: 35px;
|
||||
}
|
||||
/* Testimonials Alternate */
|
||||
|
||||
.testimonial-content {
|
||||
position: relative;
|
||||
padding: 15px 20px 18px;
|
||||
}
|
||||
.testimonial-content .testimonial-arrow {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: -34px;
|
||||
display: block;
|
||||
content: '';
|
||||
text-indent: 0;
|
||||
opacity: .8;
|
||||
border-width: 34px 34px 0 0;
|
||||
border-style: solid;
|
||||
border-color: #e9e9e9;
|
||||
border-right-color: transparent !important;
|
||||
border-bottom-color: transparent !important;
|
||||
border-left-color: transparent !important;
|
||||
-moz-opacity: .8;
|
||||
filter: alpha(opacity: 8);
|
||||
}
|
||||
.testimonial-content .testimonial-arrow.arrow-rounded {
|
||||
right: 15px;
|
||||
opacity: 1;
|
||||
-moz-opacity: 1;
|
||||
filter: alpha(opacity: 1);
|
||||
}
|
||||
.testimonial-box-alt .testimonial-content p {
|
||||
font-size: 14px;
|
||||
line-height: 1.8em;
|
||||
margin: 0;
|
||||
padding: 0 0 0 25px;
|
||||
}
|
||||
.testimonial-box-alt .glyph-icon {
|
||||
font-size: 25px;
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: 12px;
|
||||
opacity: .6;
|
||||
-moz-opacity: .6;
|
||||
filter: alpha(opacity: 6);
|
||||
}
|
||||
.testimonial-box-alt .testimonial-author-wrapper {
|
||||
padding-top: 15px;
|
||||
}
|
||||
.testimonial-box-alt .testimonial-author-wrapper img {
|
||||
margin: 0 10px 0 25px;
|
||||
}
|
||||
.testimonial-box-alt .testimonial-author {
|
||||
padding-left: 15px;
|
||||
}
|
||||
Reference in New Issue
Block a user