Services Pricing Updates
This commit is contained in:
Karol Orzeł
parent
52bfedea3e
commit
2a2fe0a635
4 changed files with 148 additions and 70 deletions
|
|
@ -68,7 +68,7 @@ b, strong, label, th {
|
|||
src: url("./fonts/Novecentosanswide-Medium-webfont.eot?#iefix") format("embedded-opentype"), url("./fonts/Novecentosanswide-Medium-webfont.woff2") format("woff2"), url("./fonts/Novecentosanswide-Medium-webfont.woff") format("woff"), url("./fonts/Novecentosanswide-Medium-webfont.ttf") format("truetype"), url("./fonts/Novecentosanswide-Medium-webfont.svg#novecento_sans_widemedium") format("svg");
|
||||
font-weight: normal;
|
||||
font-style: normal; }
|
||||
.default-animation, #body, .archive-list button, .modular .showcase .button, .modular .showcase .archive-list button, .archive-list .modular .showcase button, .modular .showcase .contact button, .contact .modular .showcase button, .modular .slideme_container .arrow, .modular .slideme_container .pagination .numbers li, .modular .bottom .button, .modular .bottom .archive-list button, .archive-list .modular .bottom button, .modular .bottom .contact button, .contact .modular .bottom button, .contact input, .contact textarea, .contact button, .callout .notebook .screen .screen-content-hover, .callout table tr:last-child td a, .team .members .social-icons li, .team .members .social-icons li a, .logo h3, .logo ul.social-icons li, .logo ul.social-icons li a {
|
||||
.default-animation, #body, .archive-list button, .modular .showcase .button, .modular .showcase .archive-list button, .archive-list .modular .showcase button, .modular .showcase .contact button, .contact .modular .showcase button, .modular .slideme_container .arrow, .modular .slideme_container .pagination .numbers li, .modular .bottom .button, .modular .bottom .archive-list button, .archive-list .modular .bottom button, .modular .bottom .contact button, .contact .modular .bottom button, .contact input, .contact textarea, .contact button, .callout .notebook .screen .screen-content-hover, .callout .pricing-container .pricing-item, .callout .pricing-container .pricing-item .name, .callout .pricing-container .pricing-item .foot, .callout .pricing-container .pricing-item .foot .button, .callout .pricing-container .pricing-item .foot .archive-list button, .archive-list .callout .pricing-container .pricing-item .foot button, .callout .pricing-container .pricing-item .foot .contact button, .contact .callout .pricing-container .pricing-item .foot button, .team .members .social-icons li, .team .members .social-icons li a, .logo h3, .logo ul.social-icons li, .logo ul.social-icons li a {
|
||||
-webkit-transition: all 0.5s ease;
|
||||
-moz-transition: all 0.5s ease;
|
||||
transition: all 0.5s ease; }
|
||||
|
|
@ -274,7 +274,7 @@ b, strong, label, th {
|
|||
clear: both; }
|
||||
.footer a {
|
||||
color: #9A9898; }
|
||||
.footer h4, .footer .archive-list label, .archive-list .footer label, .footer .modular .bottom table th, .modular .bottom table .footer th, .footer .contact label, .contact .footer label, .footer .callout table th, .callout table .footer th, .footer .callout table tr:last-child td a, .callout table tr:last-child td .footer a {
|
||||
.footer h4, .footer .archive-list label, .archive-list .footer label, .footer .modular .bottom table th, .modular .bottom table .footer th, .footer .contact label, .contact .footer label, .footer .callout .pricing-container .pricing-item .name, .callout .pricing-container .pricing-item .footer .name, .footer .callout .pricing-container .pricing-item .foot .button, .callout .pricing-container .pricing-item .foot .footer .button, .footer .callout .pricing-container .pricing-item .foot .archive-list button, .callout .pricing-container .pricing-item .foot .archive-list .footer button, .footer .archive-list .callout .pricing-container .pricing-item .foot button, .archive-list .callout .pricing-container .pricing-item .foot .footer button, .footer .callout .pricing-container .pricing-item .foot .contact button, .callout .pricing-container .pricing-item .foot .contact .footer button, .footer .contact .callout .pricing-container .pricing-item .foot button, .contact .callout .pricing-container .pricing-item .foot .footer button {
|
||||
line-height: 2rem;
|
||||
margin-top: 0;
|
||||
text-align: left;
|
||||
|
|
@ -409,7 +409,7 @@ body {
|
|||
font-family: "Helvetica Neue", "HelveticaNeue-Light", "Helvetica Neue Light", Helvetica, Arial, "Lucida Grande", sans-serif;
|
||||
font-weight: 400; }
|
||||
|
||||
h1, h2, h3, h4, .archive-list label, .modular .bottom table th, .contact label, .callout table th, .callout table tr:last-child td a, h5, h6 {
|
||||
h1, h2, h3, h4, .archive-list label, .modular .bottom table th, .contact label, .callout .pricing-container .pricing-item .name, .callout .pricing-container .pricing-item .foot .button, .callout .pricing-container .pricing-item .foot .archive-list button, .archive-list .callout .pricing-container .pricing-item .foot button, .callout .pricing-container .pricing-item .foot .contact button, .contact .callout .pricing-container .pricing-item .foot button, h5, h6 {
|
||||
font-family: "novecento_sans_widedemibold", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
|
||||
text-rendering: optimizeLegibility; }
|
||||
|
||||
|
|
@ -439,17 +439,17 @@ h2 {
|
|||
h3 {
|
||||
font-size: -1rem; } }
|
||||
|
||||
h4, .archive-list label, .modular .bottom table th, .contact label, .callout table th, .callout table tr:last-child td a {
|
||||
h4, .archive-list label, .modular .bottom table th, .contact label, .callout .pricing-container .pricing-item .name, .callout .pricing-container .pricing-item .foot .button, .callout .pricing-container .pricing-item .foot .archive-list button, .archive-list .callout .pricing-container .pricing-item .foot button, .callout .pricing-container .pricing-item .foot .contact button, .contact .callout .pricing-container .pricing-item .foot button {
|
||||
font-size: 1.2rem;
|
||||
font-weight: normal;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
color: #656161; }
|
||||
@media only all and (min-width: 48em) and (max-width: 59.938em) {
|
||||
h4, .archive-list label, .modular .bottom table th, .contact label, .callout table th, .callout table tr:last-child td a {
|
||||
h4, .archive-list label, .modular .bottom table th, .contact label, .callout .pricing-container .pricing-item .name, .callout .pricing-container .pricing-item .foot .button, .callout .pricing-container .pricing-item .foot .archive-list button, .archive-list .callout .pricing-container .pricing-item .foot button, .callout .pricing-container .pricing-item .foot .contact button, .contact .callout .pricing-container .pricing-item .foot button {
|
||||
font-size: 1.35rem; } }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
h4, .archive-list label, .modular .bottom table th, .contact label, .callout table th, .callout table tr:last-child td a {
|
||||
h4, .archive-list label, .modular .bottom table th, .contact label, .callout .pricing-container .pricing-item .name, .callout .pricing-container .pricing-item .foot .button, .callout .pricing-container .pricing-item .foot .archive-list button, .archive-list .callout .pricing-container .pricing-item .foot button, .callout .pricing-container .pricing-item .foot .contact button, .contact .callout .pricing-container .pricing-item .foot button {
|
||||
font-size: 1.25rem; } }
|
||||
|
||||
h1 {
|
||||
|
|
@ -755,12 +755,12 @@ td {
|
|||
border-bottom: 0; }
|
||||
.list-item .list-blog-header {
|
||||
position: relative; }
|
||||
.list-item .list-blog-header h4, .list-item .list-blog-header .archive-list label, .archive-list .list-item .list-blog-header label, .list-item .list-blog-header .modular .bottom table th, .modular .bottom table .list-item .list-blog-header th, .list-item .list-blog-header .contact label, .contact .list-item .list-blog-header label, .list-item .list-blog-header .callout table th, .callout table .list-item .list-blog-header th, .list-item .list-blog-header .callout table tr:last-child td a, .callout table tr:last-child td .list-item .list-blog-header a {
|
||||
.list-item .list-blog-header h4, .list-item .list-blog-header .archive-list label, .archive-list .list-item .list-blog-header label, .list-item .list-blog-header .modular .bottom table th, .modular .bottom table .list-item .list-blog-header th, .list-item .list-blog-header .contact label, .contact .list-item .list-blog-header label, .list-item .list-blog-header .callout .pricing-container .pricing-item .name, .callout .pricing-container .pricing-item .list-item .list-blog-header .name, .list-item .list-blog-header .callout .pricing-container .pricing-item .foot .button, .callout .pricing-container .pricing-item .foot .list-item .list-blog-header .button, .list-item .list-blog-header .callout .pricing-container .pricing-item .foot .archive-list button, .callout .pricing-container .pricing-item .foot .archive-list .list-item .list-blog-header button, .list-item .list-blog-header .archive-list .callout .pricing-container .pricing-item .foot button, .archive-list .callout .pricing-container .pricing-item .foot .list-item .list-blog-header button, .list-item .list-blog-header .callout .pricing-container .pricing-item .foot .contact button, .callout .pricing-container .pricing-item .foot .contact .list-item .list-blog-header button, .list-item .list-blog-header .contact .callout .pricing-container .pricing-item .foot button, .contact .callout .pricing-container .pricing-item .foot .list-item .list-blog-header button {
|
||||
text-align: left;
|
||||
margin-bottom: 1.5rem; }
|
||||
.list-item .list-blog-header h4 a, .list-item .list-blog-header .archive-list label a, .archive-list .list-item .list-blog-header label a, .list-item .list-blog-header .modular .bottom table th a, .modular .bottom table .list-item .list-blog-header th a, .list-item .list-blog-header .contact label a, .contact .list-item .list-blog-header label a, .list-item .list-blog-header .callout table th a, .callout table .list-item .list-blog-header th a, .list-item .list-blog-header .callout table tr:last-child td a a, .callout table tr:last-child td .list-item .list-blog-header a a {
|
||||
.list-item .list-blog-header h4 a, .list-item .list-blog-header .archive-list label a, .archive-list .list-item .list-blog-header label a, .list-item .list-blog-header .modular .bottom table th a, .modular .bottom table .list-item .list-blog-header th a, .list-item .list-blog-header .contact label a, .contact .list-item .list-blog-header label a, .list-item .list-blog-header .callout .pricing-container .pricing-item .name a, .callout .pricing-container .pricing-item .list-item .list-blog-header .name a, .list-item .list-blog-header .callout .pricing-container .pricing-item .foot .button a, .callout .pricing-container .pricing-item .foot .list-item .list-blog-header .button a, .list-item .list-blog-header .callout .pricing-container .pricing-item .foot .archive-list button a, .callout .pricing-container .pricing-item .foot .archive-list .list-item .list-blog-header button a, .list-item .list-blog-header .archive-list .callout .pricing-container .pricing-item .foot button a, .archive-list .callout .pricing-container .pricing-item .foot .list-item .list-blog-header button a, .list-item .list-blog-header .callout .pricing-container .pricing-item .foot .contact button a, .callout .pricing-container .pricing-item .foot .contact .list-item .list-blog-header button a, .list-item .list-blog-header .contact .callout .pricing-container .pricing-item .foot button a, .contact .callout .pricing-container .pricing-item .foot .list-item .list-blog-header button a {
|
||||
color: #656161; }
|
||||
.list-item .list-blog-header h4 a:hover, .list-item .list-blog-header .archive-list label a:hover, .archive-list .list-item .list-blog-header label a:hover, .list-item .list-blog-header .modular .bottom table th a:hover, .modular .bottom table .list-item .list-blog-header th a:hover, .list-item .list-blog-header .contact label a:hover, .contact .list-item .list-blog-header label a:hover, .list-item .list-blog-header .callout table th a:hover, .callout table .list-item .list-blog-header th a:hover, .list-item .list-blog-header .callout table tr:last-child td a a:hover, .callout table tr:last-child td .list-item .list-blog-header a a:hover {
|
||||
.list-item .list-blog-header h4 a:hover, .list-item .list-blog-header .archive-list label a:hover, .archive-list .list-item .list-blog-header label a:hover, .list-item .list-blog-header .modular .bottom table th a:hover, .modular .bottom table .list-item .list-blog-header th a:hover, .list-item .list-blog-header .contact label a:hover, .contact .list-item .list-blog-header label a:hover, .list-item .list-blog-header .callout .pricing-container .pricing-item .name a:hover, .callout .pricing-container .pricing-item .list-item .list-blog-header .name a:hover, .list-item .list-blog-header .callout .pricing-container .pricing-item .foot .button a:hover, .callout .pricing-container .pricing-item .foot .list-item .list-blog-header .button a:hover, .list-item .list-blog-header .callout .pricing-container .pricing-item .foot .archive-list button a:hover, .callout .pricing-container .pricing-item .foot .archive-list .list-item .list-blog-header button a:hover, .list-item .list-blog-header .archive-list .callout .pricing-container .pricing-item .foot button a:hover, .archive-list .callout .pricing-container .pricing-item .foot .list-item .list-blog-header button a:hover, .list-item .list-blog-header .callout .pricing-container .pricing-item .foot .contact button a:hover, .callout .pricing-container .pricing-item .foot .contact .list-item .list-blog-header button a:hover, .list-item .list-blog-header .contact .callout .pricing-container .pricing-item .foot button a:hover, .contact .callout .pricing-container .pricing-item .foot .list-item .list-blog-header button a:hover {
|
||||
color: #87b672; }
|
||||
.list-item .list-blog-header img {
|
||||
display: block;
|
||||
|
|
@ -858,7 +858,7 @@ div#breadcrumbs {
|
|||
padding-left: 0; } }
|
||||
#sidebar .sidebar-content {
|
||||
margin-bottom: 3rem; }
|
||||
#sidebar .sidebar-content h4, #sidebar .sidebar-content .archive-list label, .archive-list #sidebar .sidebar-content label, #sidebar .sidebar-content .modular .bottom table th, .modular .bottom table #sidebar .sidebar-content th, #sidebar .sidebar-content .contact label, .contact #sidebar .sidebar-content label, #sidebar .sidebar-content .callout table th, .callout table #sidebar .sidebar-content th, #sidebar .sidebar-content .callout table tr:last-child td a, .callout table tr:last-child td #sidebar .sidebar-content a {
|
||||
#sidebar .sidebar-content h4, #sidebar .sidebar-content .archive-list label, .archive-list #sidebar .sidebar-content label, #sidebar .sidebar-content .modular .bottom table th, .modular .bottom table #sidebar .sidebar-content th, #sidebar .sidebar-content .contact label, .contact #sidebar .sidebar-content label, #sidebar .sidebar-content .callout .pricing-container .pricing-item .name, .callout .pricing-container .pricing-item #sidebar .sidebar-content .name, #sidebar .sidebar-content .callout .pricing-container .pricing-item .foot .button, .callout .pricing-container .pricing-item .foot #sidebar .sidebar-content .button, #sidebar .sidebar-content .callout .pricing-container .pricing-item .foot .archive-list button, .callout .pricing-container .pricing-item .foot .archive-list #sidebar .sidebar-content button, #sidebar .sidebar-content .archive-list .callout .pricing-container .pricing-item .foot button, .archive-list .callout .pricing-container .pricing-item .foot #sidebar .sidebar-content button, #sidebar .sidebar-content .callout .pricing-container .pricing-item .foot .contact button, .callout .pricing-container .pricing-item .foot .contact #sidebar .sidebar-content button, #sidebar .sidebar-content .contact .callout .pricing-container .pricing-item .foot button, .contact .callout .pricing-container .pricing-item .foot #sidebar .sidebar-content button {
|
||||
margin-bottom: 1rem;
|
||||
text-align: left; }
|
||||
#sidebar .sidebar-content p, #sidebar .sidebar-content ul {
|
||||
|
|
@ -872,7 +872,7 @@ ul.pagination {
|
|||
margin-top: 5rem;
|
||||
text-align: center; }
|
||||
|
||||
.archive-list h4, .archive-list label, .archive-list .modular .bottom table th, .modular .bottom table .archive-list th, .archive-list .callout table th, .callout table .archive-list th, .archive-list .callout table tr:last-child td a, .callout table tr:last-child td .archive-list a {
|
||||
.archive-list h4, .archive-list label, .archive-list .modular .bottom table th, .modular .bottom table .archive-list th, .archive-list .callout .pricing-container .pricing-item .name, .callout .pricing-container .pricing-item .archive-list .name, .archive-list .callout .pricing-container .pricing-item .foot .button, .callout .pricing-container .pricing-item .foot .archive-list .button, .callout .pricing-container .pricing-item .foot .archive-list button, .archive-list .callout .pricing-container .pricing-item .foot button {
|
||||
text-align: left; }
|
||||
.archive-list input {
|
||||
width: 50%;
|
||||
|
|
@ -1134,7 +1134,7 @@ ul.pagination {
|
|||
width: 100%; } }
|
||||
.modular .features .feature i.fa {
|
||||
font-size: 2rem; }
|
||||
.modular .features .feature h4, .modular .features .feature .archive-list label, .archive-list .modular .features .feature label, .modular .features .feature .bottom table th, .modular .bottom table .features .feature th, .modular .features .feature .contact label, .contact .modular .features .feature label, .modular .features .feature .callout table th, .callout table .modular .features .feature th, .modular .features .feature .callout table tr:last-child td a, .callout table tr:last-child td .modular .features .feature a {
|
||||
.modular .features .feature h4, .modular .features .feature .archive-list label, .archive-list .modular .features .feature label, .modular .features .feature .bottom table th, .modular .bottom table .features .feature th, .modular .features .feature .contact label, .contact .modular .features .feature label, .modular .features .feature .callout .pricing-container .pricing-item .name, .callout .pricing-container .pricing-item .modular .features .feature .name, .modular .features .feature .callout .pricing-container .pricing-item .foot .button, .callout .pricing-container .pricing-item .foot .modular .features .feature .button, .modular .features .feature .callout .pricing-container .pricing-item .foot .archive-list button, .callout .pricing-container .pricing-item .foot .archive-list .modular .features .feature button, .modular .features .feature .archive-list .callout .pricing-container .pricing-item .foot button, .archive-list .callout .pricing-container .pricing-item .foot .modular .features .feature button, .modular .features .feature .callout .pricing-container .pricing-item .foot .contact button, .callout .pricing-container .pricing-item .foot .contact .modular .features .feature button, .modular .features .feature .contact .callout .pricing-container .pricing-item .foot button, .contact .callout .pricing-container .pricing-item .foot .modular .features .feature button {
|
||||
margin: 0;
|
||||
font-size: 1.1rem; }
|
||||
.modular .features .feature p {
|
||||
|
|
@ -1156,7 +1156,7 @@ ul.pagination {
|
|||
padding-right: 2rem; }
|
||||
.modular .features.big .feature-content.icon-offset {
|
||||
margin-left: 1rem; }
|
||||
.modular .features.big .feature-content h4, .modular .features.big .feature-content .archive-list label, .archive-list .modular .features.big .feature-content label, .modular .features.big .feature-content .bottom table th, .modular .bottom table .features.big .feature-content th, .modular .features.big .feature-content .contact label, .contact .modular .features.big .feature-content label, .modular .features.big .feature-content .callout table th, .callout table .modular .features.big .feature-content th, .modular .features.big .feature-content .callout table tr:last-child td a, .callout table tr:last-child td .modular .features.big .feature-content a {
|
||||
.modular .features.big .feature-content h4, .modular .features.big .feature-content .archive-list label, .archive-list .modular .features.big .feature-content label, .modular .features.big .feature-content .bottom table th, .modular .bottom table .features.big .feature-content th, .modular .features.big .feature-content .contact label, .contact .modular .features.big .feature-content label, .modular .features.big .feature-content .callout .pricing-container .pricing-item .name, .callout .pricing-container .pricing-item .modular .features.big .feature-content .name, .modular .features.big .feature-content .callout .pricing-container .pricing-item .foot .button, .callout .pricing-container .pricing-item .foot .modular .features.big .feature-content .button, .modular .features.big .feature-content .callout .pricing-container .pricing-item .foot .archive-list button, .callout .pricing-container .pricing-item .foot .archive-list .modular .features.big .feature-content button, .modular .features.big .feature-content .archive-list .callout .pricing-container .pricing-item .foot button, .archive-list .callout .pricing-container .pricing-item .foot .modular .features.big .feature-content button, .modular .features.big .feature-content .callout .pricing-container .pricing-item .foot .contact button, .callout .pricing-container .pricing-item .foot .contact .modular .features.big .feature-content button, .modular .features.big .feature-content .contact .callout .pricing-container .pricing-item .foot button, .contact .callout .pricing-container .pricing-item .foot .modular .features.big .feature-content button {
|
||||
font-size: 1.2rem; }
|
||||
.modular .features.big .feature-content p {
|
||||
padding: 0; }
|
||||
|
|
@ -1211,7 +1211,7 @@ ul.pagination {
|
|||
.about hr {
|
||||
margin: 3rem 0; }
|
||||
|
||||
.contact h4, .contact .modular .bottom table th, .modular .bottom table .contact th, .contact label, .contact .callout table th, .callout table .contact th, .contact .callout table tr:last-child td a, .callout table tr:last-child td .contact a {
|
||||
.contact h4, .contact .modular .bottom table th, .modular .bottom table .contact th, .contact label, .contact .callout .pricing-container .pricing-item .name, .callout .pricing-container .pricing-item .contact .name, .contact .callout .pricing-container .pricing-item .foot .button, .callout .pricing-container .pricing-item .foot .contact .button, .callout .pricing-container .pricing-item .foot .contact button, .contact .callout .pricing-container .pricing-item .foot button {
|
||||
text-align: left; }
|
||||
.contact input {
|
||||
width: 50%;
|
||||
|
|
@ -1364,36 +1364,64 @@ ul.pagination {
|
|||
margin: 0.4375rem 0 0 -0.625rem;
|
||||
z-index: -1;
|
||||
border-radius: 100%; }
|
||||
.callout table {
|
||||
.callout .pricing-container {
|
||||
position: relative;
|
||||
z-index: 11; }
|
||||
.callout table td {
|
||||
background: #f7f7f7; }
|
||||
.callout table th {
|
||||
background: #87b672;
|
||||
color: #fff; }
|
||||
.callout table tr:first-child td {
|
||||
font-weight: bold;
|
||||
color: #656161;
|
||||
font-size: 3.5rem;
|
||||
font-family: "novecento_sans_widedemibold", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
|
||||
font-weight: normal; }
|
||||
.callout table tr:last-child td {
|
||||
background: #87b672;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
padding: 1rem 0; }
|
||||
.callout table tr:last-child td a {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 9rem;
|
||||
font-size: 1rem;
|
||||
line-height: 2.5rem;
|
||||
z-index: 10;
|
||||
margin-top: 2rem;
|
||||
min-height: 33rem; }
|
||||
.callout .pricing-container:after {
|
||||
content: "";
|
||||
display: table;
|
||||
clear: both; }
|
||||
.callout .pricing-container .pricing-item {
|
||||
display: block;
|
||||
float: left;
|
||||
width: 24.5%;
|
||||
margin-right: 0.3rem;
|
||||
margin-bottom: 2rem;
|
||||
vertical-align: middle;
|
||||
position: relative; }
|
||||
.callout .pricing-container .pricing-item:hover {
|
||||
margin-top: -1rem; }
|
||||
.callout .pricing-container .pricing-item:hover .name {
|
||||
padding: 1rem 0; }
|
||||
.callout .pricing-container .pricing-item:hover .foot {
|
||||
padding: 1.5rem 0; }
|
||||
.callout .pricing-container .pricing-item div {
|
||||
background: #f7f7f7; }
|
||||
.callout .pricing-container .pricing-item .name {
|
||||
background: #87b672;
|
||||
color: #fff;
|
||||
display: inline-block;
|
||||
background: rgba(255, 255, 255, 0.25); }
|
||||
.callout table tr:last-child td a:hover {
|
||||
background: rgba(255, 255, 255, 0.15); }
|
||||
padding: 0.5rem 0; }
|
||||
.callout .pricing-container .pricing-item .info {
|
||||
line-height: 3rem;
|
||||
border-bottom: #EEEEEE 1px solid; }
|
||||
.callout .pricing-container .pricing-item .price {
|
||||
font-weight: bold;
|
||||
color: #656161;
|
||||
font-size: 3.5rem;
|
||||
font-family: "novecento_sans_widedemibold", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
|
||||
font-weight: normal;
|
||||
border-bottom: #EEEEEE 1px solid;
|
||||
line-height: 5rem; }
|
||||
.callout .pricing-container .pricing-item .foot {
|
||||
background: #87b672;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
padding: 1rem 0; }
|
||||
.callout .pricing-container .pricing-item .foot .button, .callout .pricing-container .pricing-item .foot .archive-list button, .archive-list .callout .pricing-container .pricing-item .foot button, .callout .pricing-container .pricing-item .foot .contact button, .contact .callout .pricing-container .pricing-item .foot button {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 9rem;
|
||||
font-size: 1rem;
|
||||
line-height: 2.5rem;
|
||||
color: #fff;
|
||||
display: inline-block;
|
||||
background: rgba(255, 255, 255, 0.25); }
|
||||
.callout .pricing-container .pricing-item .foot .button:hover, .callout .pricing-container .pricing-item .foot .archive-list button:hover, .archive-list .callout .pricing-container .pricing-item .foot button:hover, .callout .pricing-container .pricing-item .foot .contact button:hover, .contact .callout .pricing-container .pricing-item .foot button:hover {
|
||||
background: rgba(255, 255, 255, 0.15); }
|
||||
.callout .pricing-container .pricing-item sup {
|
||||
font-size: 2rem; }
|
||||
|
||||
.team {
|
||||
background: #EEEEEE;
|
||||
|
|
@ -1426,11 +1454,11 @@ ul.pagination {
|
|||
text-align: center;
|
||||
margin: 0;
|
||||
margin-bottom: 2rem; } }
|
||||
.team .members .member h4, .team .members .member .archive-list label, .archive-list .team .members .member label, .team .members .member .modular .bottom table th, .modular .bottom table .team .members .member th, .team .members .member .contact label, .contact .team .members .member label, .team .members .member .callout table th, .callout table .team .members .member th, .team .members .member .callout table tr:last-child td a, .callout table tr:last-child td .team .members .member a {
|
||||
.team .members .member h4, .team .members .member .archive-list label, .archive-list .team .members .member label, .team .members .member .modular .bottom table th, .modular .bottom table .team .members .member th, .team .members .member .contact label, .contact .team .members .member label, .team .members .member .callout .pricing-container .pricing-item .name, .callout .pricing-container .pricing-item .team .members .member .name, .team .members .member .callout .pricing-container .pricing-item .foot .button, .callout .pricing-container .pricing-item .foot .team .members .member .button, .team .members .member .callout .pricing-container .pricing-item .foot .archive-list button, .callout .pricing-container .pricing-item .foot .archive-list .team .members .member button, .team .members .member .archive-list .callout .pricing-container .pricing-item .foot button, .archive-list .callout .pricing-container .pricing-item .foot .team .members .member button, .team .members .member .callout .pricing-container .pricing-item .foot .contact button, .callout .pricing-container .pricing-item .foot .contact .team .members .member button, .team .members .member .contact .callout .pricing-container .pricing-item .foot button, .contact .callout .pricing-container .pricing-item .foot .team .members .member button {
|
||||
text-align: left;
|
||||
margin-bottom: 0; }
|
||||
@media only all and (max-width: 47.938em) {
|
||||
.team .members .member h4, .team .members .member .archive-list label, .archive-list .team .members .member label, .team .members .member .modular .bottom table th, .modular .bottom table .team .members .member th, .team .members .member .contact label, .contact .team .members .member label, .team .members .member .callout table th, .callout table .team .members .member th, .team .members .member .callout table tr:last-child td a, .callout table tr:last-child td .team .members .member a {
|
||||
.team .members .member h4, .team .members .member .archive-list label, .archive-list .team .members .member label, .team .members .member .modular .bottom table th, .modular .bottom table .team .members .member th, .team .members .member .contact label, .contact .team .members .member label, .team .members .member .callout .pricing-container .pricing-item .name, .callout .pricing-container .pricing-item .team .members .member .name, .team .members .member .callout .pricing-container .pricing-item .foot .button, .callout .pricing-container .pricing-item .foot .team .members .member .button, .team .members .member .callout .pricing-container .pricing-item .foot .archive-list button, .callout .pricing-container .pricing-item .foot .archive-list .team .members .member button, .team .members .member .archive-list .callout .pricing-container .pricing-item .foot button, .archive-list .callout .pricing-container .pricing-item .foot .team .members .member button, .team .members .member .callout .pricing-container .pricing-item .foot .contact button, .callout .pricing-container .pricing-item .foot .contact .team .members .member button, .team .members .member .contact .callout .pricing-container .pricing-item .foot button, .contact .callout .pricing-container .pricing-item .foot .team .members .member button {
|
||||
text-align: center; } }
|
||||
.team .members .member hr {
|
||||
margin: 1rem 0; }
|
||||
|
|
@ -1469,7 +1497,7 @@ ul.pagination {
|
|||
float: left; }
|
||||
.logo h3 a {
|
||||
color: #9A9898; }
|
||||
.logo h4, .logo .archive-list label, .archive-list .logo label, .logo .modular .bottom table th, .modular .bottom table .logo th, .logo .contact label, .contact .logo label, .logo .callout table th, .callout table .logo th, .logo .callout table tr:last-child td a, .callout table tr:last-child td .logo a {
|
||||
.logo h4, .logo .archive-list label, .archive-list .logo label, .logo .modular .bottom table th, .modular .bottom table .logo th, .logo .contact label, .contact .logo label, .logo .callout .pricing-container .pricing-item .name, .callout .pricing-container .pricing-item .logo .name, .logo .callout .pricing-container .pricing-item .foot .button, .callout .pricing-container .pricing-item .foot .logo .button, .logo .callout .pricing-container .pricing-item .foot .archive-list button, .callout .pricing-container .pricing-item .foot .archive-list .logo button, .logo .archive-list .callout .pricing-container .pricing-item .foot button, .archive-list .callout .pricing-container .pricing-item .foot .logo button, .logo .callout .pricing-container .pricing-item .foot .contact button, .callout .pricing-container .pricing-item .foot .contact .logo button, .logo .contact .callout .pricing-container .pricing-item .foot button, .contact .callout .pricing-container .pricing-item .foot .logo button {
|
||||
text-align: left; }
|
||||
.logo ul {
|
||||
margin: 0;
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -137,33 +137,60 @@ $image-margin: 2rem;
|
|||
z-index: -1;
|
||||
border-radius: 100%;
|
||||
}
|
||||
table {
|
||||
.pricing-container {
|
||||
position: relative;
|
||||
z-index: 11;
|
||||
td {
|
||||
background: $main-bg;
|
||||
}
|
||||
th {
|
||||
background: $core-accent;
|
||||
@extend h4;
|
||||
color: $white;
|
||||
}
|
||||
tr:first-child {
|
||||
td {
|
||||
z-index: 10;
|
||||
@include clearfix;
|
||||
margin-top: 2rem;
|
||||
min-height: 33rem;
|
||||
.pricing-item {
|
||||
@extend .default-animation;
|
||||
display: block;
|
||||
float: left;
|
||||
width: 24.5%;
|
||||
margin-right: 0.3rem;
|
||||
margin-bottom: 2rem;
|
||||
vertical-align: middle;
|
||||
position: relative;
|
||||
&:hover {
|
||||
margin-top: -1rem;
|
||||
.name {
|
||||
padding: 1rem 0;
|
||||
}
|
||||
.foot {
|
||||
padding: 1.5rem 0;
|
||||
}
|
||||
}
|
||||
div {
|
||||
background: $main-bg;
|
||||
}
|
||||
.name {
|
||||
@extend .default-animation;
|
||||
background: $core-accent;
|
||||
@extend h4;
|
||||
color: $white;
|
||||
padding: 0.5rem 0;
|
||||
}
|
||||
.info {
|
||||
line-height: 3rem;
|
||||
border-bottom: $border-color 1px solid;
|
||||
}
|
||||
.price {
|
||||
font-weight: bold;
|
||||
color: $light-gray;
|
||||
font-size: 3.5rem;
|
||||
font-family: $font-family-header;
|
||||
font-weight: normal;
|
||||
border-bottom: $border-color 1px solid;
|
||||
line-height: 5rem;
|
||||
}
|
||||
}
|
||||
tr:last-child {
|
||||
td {
|
||||
.foot {
|
||||
@extend .default-animation;
|
||||
background: $core-accent;
|
||||
color: $white;
|
||||
text-align: center;
|
||||
padding: 1rem 0;
|
||||
a {
|
||||
.button {
|
||||
@extend h4;
|
||||
@extend .default-animation;
|
||||
margin: 0;
|
||||
|
|
@ -177,10 +204,11 @@ $image-margin: 2rem;
|
|||
&:hover {
|
||||
background: transparentize($white, 0.85);
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
sup {
|
||||
font-size: 2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,13 +1,35 @@
|
|||
<div class="modular-row callout">
|
||||
{{ content }}
|
||||
{{ content }}
|
||||
{% if page.header.pricing %}
|
||||
<div class="pricing-container">
|
||||
{% for item in page.header.pricing %}
|
||||
<div class="pricing-item">
|
||||
<div class="name">{{ item.name }}</div>
|
||||
<div class="price">{{ item.price }}</div>
|
||||
{% for line in item.options %}
|
||||
<div class="info">
|
||||
{{ line.line }}
|
||||
</div>
|
||||
{% endfor %}
|
||||
<div class="foot">
|
||||
<a class="button" href="{{ item.button_url }}">{{ item.button_text }}</a>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if page.header.portfolio %}
|
||||
<div class="notebooks">
|
||||
{% for portfolio in page.header.portfolio %}
|
||||
<div class="notebook">
|
||||
<div class='screen'><div class="screen-content" style="background-image: url({{ page.media[portfolio.image].url }})" ></div><div class="screen-content-hover"><i class="fa fa-plus-square"></i></div></div>
|
||||
<div class='keyboard'></div>
|
||||
<h4>{{ portfolio.description }}</h4>
|
||||
</div>
|
||||
<div class="notebook">
|
||||
<div class='screen'><div class="screen-content" style="background-image: url({{ page.media[portfolio.image].url }})" ></div><div class="screen-content-hover"><i class="fa fa-plus-square"></i></div></div>
|
||||
<div class='keyboard'></div>
|
||||
<h4>{{ portfolio.description }}</h4>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
|
||||
<div class="callout-line"></div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue