ascribe/wp-theme
1
0
Fork 0
mirror of https://github.com/ascribe/wp-theme synced 2024-12-23 01:30:09 +01:00
Code Issues Releases Wiki Activity

Merge pull request #16 from ascribe/feature/blueboxcta

Browse Source 
Add CTA to blue box
This commit is contained in:
Alberto Granzotto 2015-12-17 15:02:36 +01:00
commit 5c06830d89
4 changed files with 169 additions and 165 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

323
assets/css/ascribe.css
View File

@ -417,10 +417,10 @@ html.page-template-template-companyblue {
} }
a { a {
text-decoration: none; text-decoration: none;
color: #67c4da; color: #67C4DA;
} }
a:hover { a:hover {
color: #d8127d; color: #D8127D;
} }
.fontLight, .fontLight,
body, body,
@ -530,7 +530,7 @@ h6,
} }
.sectionHeader { .sectionHeader {
font-size: 34px; font-size: 34px;
color: #67c4da; color: #67C4DA;
line-height: 1.2; line-height: 1.2;
margin: 35px 0; margin: 35px 0;
text-align: center; text-align: center;
@ -542,43 +542,43 @@ h6,
} }
.subsectionHeader { .subsectionHeader {
font-size: 31px; font-size: 31px;
color: #000000; color: #000;
line-height: 37px; line-height: 37px;
text-align: center; text-align: center;
} }
.h1, .h1,
h1 { h1 {
font-size: 36px; font-size: 36px;
color: #d8127d; color: #D8127D;
line-height: 1.2; line-height: 1.2;
} }
.h2, .h2,
h2 { h2 {
font-size: 26px; font-size: 26px;
color: #d8127d; color: #D8127D;
line-height: 1.2; line-height: 1.2;
} }
.h3, .h3,
h3 { h3 {
font-size: 27px; font-size: 27px;
color: #d8127d; color: #D8127D;
line-height: 1.2; line-height: 1.2;
} }
.h4, .h4,
h4 { h4 {
font-size: 26px; font-size: 26px;
color: #000000; color: #000;
line-height: 1.2; line-height: 1.2;
} }
.h5, .h5,
h5 { h5 {
font-size: 26px; font-size: 26px;
color: #000000; color: #000;
line-height: 1.2; line-height: 1.2;
} }
.h6, .h6,
h6 { h6 {
color: #d8127d; color: #D8127D;
font-size: 15px; font-size: 15px;
line-height: 19px; line-height: 19px;
} }
@ -599,57 +599,57 @@ h6 {
} }
.heroText { .heroText {
font-size: 37px; font-size: 37px;
color: #ffffff; color: #fff;
line-height: 44px; line-height: 44px;
} }
.tourNavText { .tourNavText {
font-size: 25px; font-size: 25px;
line-height: 30px; line-height: 30px;
color: #67c4da; color: #67C4DA;
} }
.signInUpText { .signInUpText {
font-size: 17px; font-size: 17px;
line-height: 20px; line-height: 20px;
color: #ffffff; color: #fff;
text-transform: uppercase; text-transform: uppercase;
} }
.featureCircleH1 { .featureCircleH1 {
font-size: 20px; font-size: 20px;
color: #d8127d; color: #D8127D;
letter-spacing: 1.11px; letter-spacing: 1.11px;
line-height: 24px; line-height: 24px;
margin-bottom: 22px; margin-bottom: 22px;
} }
.caseStudyText { .caseStudyText {
font-size: 23px; font-size: 23px;
color: #ffffff; color: #fff;
line-height: 28px; line-height: 28px;
} }
.oldWayNewWayTH { .oldWayNewWayTH {
font-size: 24px; font-size: 24px;
color: #d8127d; color: #D8127D;
line-height: 29px; line-height: 29px;
} }
.blueBoxTitle { .blueBoxTitle {
font-size: 43px; font-size: 43px;
color: #ffffff; color: #fff;
line-height: 52px; line-height: 52px;
text-align: center; text-align: center;
} }
.blueBoxCopy { .blueBoxCopy {
font-size: 43px; font-size: 43px;
color: #ffffff; color: #fff;
line-height: 52px; line-height: 52px;
} }
.galleriesPressTitle { .galleriesPressTitle {
font-size: 30px; font-size: 30px;
color: #000000; color: #000;
line-height: 36px; line-height: 36px;
margin-bottom: 50px; margin-bottom: 50px;
} }
.featureBlogDesc { .featureBlogDesc {
font-size: 13px; font-size: 13px;
color: #67c4da; color: #67C4DA;
line-height: 22.79px; line-height: 22.79px;
} }
.featureBlogTitle { .featureBlogTitle {
@ -659,12 +659,12 @@ h6 {
text-transform: uppercase; text-transform: uppercase;
} }
.teamName { .teamName {
color: #000000; color: #000;
font-size: 19px; font-size: 19px;
} }
.footerText { .footerText {
font-size: 14px; font-size: 14px;
color: #ffffff; color: #fff;
line-height: 25px; line-height: 25px;
} }
.subfooterText { .subfooterText {
@ -683,60 +683,60 @@ h6 {
text-align: center; text-align: center;
} }
.button.blue { .button.blue {
color: #ffffff; color: #fff;
background-color: #67c4da; background-color: #67C4DA;
border-color: #67c4da; border-color: #67C4DA;
} }
.button.blue:hover { .button.blue:hover {
background-color: rgba(103, 196, 218, 0.5); background-color: rgba(103, 196, 218, 0.5);
} }
.button.pink { .button.pink {
color: #ffffff; color: #fff;
background-color: #d8127d; background-color: #D8127D;
border-color: #d8127d; border-color: #D8127D;
} }
.button.pink:hover { .button.pink:hover {
background-color: rgba(216, 18, 125, 0.5); background-color: rgba(216, 18, 125, 0.5);
} }
.button.blue-overPic { .button.blue-overPic {
color: #ffffff; color: #fff;
background-color: #67c4da; background-color: #67C4DA;
border-color: #67c4da; border-color: #67C4DA;
} }
.button.blue-overPic:hover { .button.blue-overPic:hover {
background-color: #ffffff; background-color: #fff;
color: #67c4da; color: #67C4DA;
} }
.button.pink-overPic { .button.pink-overPic {
color: #ffffff; color: #fff;
background-color: #d8127d; background-color: #D8127D;
border-color: #d8127d; border-color: #D8127D;
} }
.button.pink-overPic:hover { .button.pink-overPic:hover {
background-color: #ffffff; background-color: #fff;
color: #d8127d; color: #D8127D;
} }
.button.white-blue { .button.white-blue {
color: #67c4da; color: #67C4DA;
background-color: #ffffff; background-color: #fff;
border-color: #67c4da; border-color: #67C4DA;
} }
.button.white-blue:hover { .button.white-blue:hover {
background-color: rgba(103, 196, 218, 0.5); background-color: rgba(103, 196, 218, 0.5);
color: #ffffff; color: #fff;
} }
.button.small { .button.small {
padding: 5px 15px; padding: 5px 15px;
font-size: 14px; font-size: 14px;
color: #ffffff; color: #fff;
background-color: transparent; background-color: transparent;
border-color: #ffffff; border-color: #fff;
min-width: auto; min-width: auto;
} }
.button.small:hover { .button.small:hover {
background-color: rgba(255, 255, 255, 0.4); background-color: rgba(255, 255, 255, 0.4);
border-color: rgba(255, 255, 255, 0.4); border-color: rgba(255, 255, 255, 0.4);
color: #ffffff; color: #fff;
} }
@media screen and (max-width: 400px) { @media screen and (max-width: 400px) {
.button { .button {
@ -759,7 +759,7 @@ h6 {
width: 21px; width: 21px;
height: 21px; height: 21px;
padding: 1px; padding: 1px;
fill: #ffffff; fill: #fff;
background-color: #b8b8b8; background-color: #b8b8b8;
border-radius: 5px; border-radius: 5px;
} }
@ -776,7 +776,7 @@ hr {
.blog header, .blog header,
.archive header, .archive header,
.single-post header { .single-post header {
background-color: #67c4da; background-color: #67C4DA;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#519cad+0,67c4da+100 */ /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#519cad+0,67c4da+100 */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzUxOWNhZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM2N2M0ZGEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzUxOWNhZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM2N2M0ZGEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
@ -877,7 +877,7 @@ hr {
padding: 0 10px 50px; padding: 0 10px 50px;
width: 100%; width: 100%;
margin: 0 auto; margin: 0 auto;
background-color: #ffffff; background-color: #fff;
} }
.centered-content-padding:before, .centered-content-padding:before,
.centered-content-padding:after { .centered-content-padding:after {
@ -1218,7 +1218,7 @@ header + .chevron-divider {
z-index: 800; z-index: 800;
} }
.page-template-template-tour header .sticky.stuck ul.active { .page-template-template-tour header .sticky.stuck ul.active {
background-color: #000000; background-color: #000;
padding-bottom: 10px; padding-bottom: 10px;
} }
.page-template-template-tour header nav { .page-template-template-tour header nav {
@ -1226,7 +1226,7 @@ header + .chevron-divider {
margin-top: 9px; margin-top: 9px;
font-size: 25px; font-size: 25px;
line-height: 30px; line-height: 30px;
color: #67c4da; color: #67C4DA;
} }
.page-template-template-tour header nav ul { .page-template-template-tour header nav ul {
padding: 0 35px; padding: 0 35px;
@ -1280,19 +1280,19 @@ header + .chevron-divider {
} }
.page-template-template-tour header h1 { .page-template-template-tour header h1 {
font-size: 37px; font-size: 37px;
color: #ffffff; color: #fff;
line-height: 44px; line-height: 44px;
margin-bottom: 160px; margin-bottom: 160px;
} }
.page-template-template-tour header .app-links { .page-template-template-tour header .app-links {
color: #ffffff; color: #fff;
margin-top: 10px; margin-top: 10px;
} }
.page-template-template-tour header .app-links a { .page-template-template-tour header .app-links a {
color: #ffffff; color: #fff;
} }
.page-template-template-tour header .app-links a:hover { .page-template-template-tour header .app-links a:hover {
color: #d8127d; color: #D8127D;
} }
.page-template-template-tour header .chevron-divider { .page-template-template-tour header .chevron-divider {
position: absolute; position: absolute;
@ -1420,7 +1420,7 @@ header + .chevron-divider {
.error404 header nav ul li:hover, .error404 header nav ul li:hover,
.archive header nav ul li:hover, .archive header nav ul li:hover,
.single-post header nav ul li:hover { .single-post header nav ul li:hover {
border: 1px solid #d8127d; border: 1px solid #D8127D;
} }
.page-template-template-companywhite header nav ul li:hover a, .page-template-template-companywhite header nav ul li:hover a,
.page-template-template-general header nav ul li:hover a, .page-template-template-general header nav ul li:hover a,
@ -1430,7 +1430,7 @@ header + .chevron-divider {
.error404 header nav ul li:hover a, .error404 header nav ul li:hover a,
.archive header nav ul li:hover a, .archive header nav ul li:hover a,
.single-post header nav ul li:hover a { .single-post header nav ul li:hover a {
color: #d8127d; color: #D8127D;
} }
@media screen and (max-width: 910px) { @media screen and (max-width: 910px) {
.page-template-template-companywhite header nav ul li, .page-template-template-companywhite header nav ul li,
@ -1521,7 +1521,7 @@ header + .chevron-divider {
.blog header nav ul li a, .blog header nav ul li a,
.archive header nav ul li a, .archive header nav ul li a,
.single-post header nav ul li a { .single-post header nav ul li a {
color: #ffffff; color: #fff;
} }
.blog header nav ul li:hover, .blog header nav ul li:hover,
.archive header nav ul li:hover, .archive header nav ul li:hover,
@ -1532,7 +1532,7 @@ header + .chevron-divider {
.blog header nav ul li:hover a, .blog header nav ul li:hover a,
.archive header nav ul li:hover a, .archive header nav ul li:hover a,
.single-post header nav ul li:hover a { .single-post header nav ul li:hover a {
color: #ffffff; color: #fff;
} }
.blog header .chevron-divider, .blog header .chevron-divider,
.archive header .chevron-divider, .archive header .chevron-divider,
@ -1544,7 +1544,7 @@ header + .chevron-divider {
.blog header h1, .blog header h1,
.archive header h1, .archive header h1,
.single-post header h1 { .single-post header h1 {
color: #ffffff; color: #fff;
font-size: 54px; font-size: 54px;
position: relative; position: relative;
z-index: 2; z-index: 2;
@ -1555,32 +1555,32 @@ header + .chevron-divider {
.blog header h1 a, .blog header h1 a,
.archive header h1 a, .archive header h1 a,
.single-post header h1 a { .single-post header h1 a {
color: #ffffff; color: #fff;
} }
.blog header h1 a:hover, .blog header h1 a:hover,
.archive header h1 a:hover, .archive header h1 a:hover,
.single-post header h1 a:hover { .single-post header h1 a:hover {
color: #d8127d; color: #D8127D;
} }
.blog header .app-links, .blog header .app-links,
.archive header .app-links, .archive header .app-links,
.single-post header .app-links { .single-post header .app-links {
color: #ffffff; color: #fff;
} }
.blog header .app-links a, .blog header .app-links a,
.archive header .app-links a, .archive header .app-links a,
.single-post header .app-links a { .single-post header .app-links a {
color: #ffffff; color: #fff;
} }
.blog header .app-links a:hover, .blog header .app-links a:hover,
.archive header .app-links a:hover, .archive header .app-links a:hover,
.single-post header .app-links a:hover { .single-post header .app-links a:hover {
color: #d8127d; color: #D8127D;
} }
.blog header + nav, .blog header + nav,
.archive header + nav, .archive header + nav,
.single-post header + nav { .single-post header + nav {
background-color: #67c4da; background-color: #67C4DA;
border-top: 2px solid rgba(255, 255, 255, 0.5); border-top: 2px solid rgba(255, 255, 255, 0.5);
} }
.blog header + nav ul, .blog header + nav ul,
@ -1642,21 +1642,21 @@ header + .chevron-divider {
margin-top: 35px; margin-top: 35px;
font-size: 17px; font-size: 17px;
line-height: 20px; line-height: 20px;
color: #ffffff; color: #fff;
text-transform: uppercase; text-transform: uppercase;
color: #000000; color: #000;
position: relative; position: relative;
z-index: 3; z-index: 3;
} }
.app-links a { .app-links a {
font-size: 17px; font-size: 17px;
line-height: 20px; line-height: 20px;
color: #ffffff; color: #fff;
text-transform: uppercase; text-transform: uppercase;
color: #000000; color: #000;
} }
.app-links a:hover { .app-links a:hover {
color: #d8127d; color: #D8127D;
} }
.hamburger { .hamburger {
cursor: pointer; cursor: pointer;
@ -1690,17 +1690,17 @@ header + .chevron-divider {
font-size: 13px; font-size: 13px;
} }
.mobile-nav li a { .mobile-nav li a {
color: #ffffff; color: #fff;
} }
.mobile-nav li a:hover { .mobile-nav li a:hover {
color: #d8127d; color: #D8127D;
} }
.mobile-nav li:nth-child(-n+3) { .mobile-nav li:nth-child(-n+3) {
font-size: 16px; font-size: 16px;
padding-bottom: 35px; padding-bottom: 35px;
} }
.mobile-nav li:nth-child(3) { .mobile-nav li:nth-child(3) {
border-bottom: 1px solid #ffffff; border-bottom: 1px solid #fff;
margin-bottom: 25px; margin-bottom: 25px;
} }
@media screen and (max-width: 600px) { @media screen and (max-width: 600px) {
@ -1730,7 +1730,7 @@ header + .chevron-divider {
} }
.subtemplate h1 { .subtemplate h1 {
font-size: 34px; font-size: 34px;
color: #67c4da; color: #67C4DA;
line-height: 1.2; line-height: 1.2;
margin: 35px 0; margin: 35px 0;
text-align: center; text-align: center;
@ -1790,7 +1790,7 @@ header + .chevron-divider {
top: -2px; top: -2px;
bottom: -2px; bottom: -2px;
border-radius: 50%; border-radius: 50%;
background: linear-gradient(#67c4da, #d8127d); background: linear-gradient(#67C4DA, #D8127D);
} }
.feature-circles .surround-circle .container { .feature-circles .surround-circle .container {
position: absolute; position: absolute;
@ -1820,7 +1820,7 @@ header + .chevron-divider {
} }
.feature-circles h1 { .feature-circles h1 {
font-size: 20px; font-size: 20px;
color: #d8127d; color: #D8127D;
letter-spacing: 1.11px; letter-spacing: 1.11px;
line-height: 24px; line-height: 24px;
margin-bottom: 22px; margin-bottom: 22px;
@ -1914,7 +1914,7 @@ header + .chevron-divider {
bottom: 35px; bottom: 35px;
right: 0; right: 0;
font-size: 23px; font-size: 23px;
color: #ffffff; color: #fff;
line-height: 28px; line-height: 28px;
} }
.case-studies p { .case-studies p {
@ -1923,7 +1923,7 @@ header + .chevron-divider {
.case-studies .slider-action { .case-studies .slider-action {
width: 80px; width: 80px;
height: 80px; height: 80px;
background-color: #ffffff; background-color: #fff;
cursor: pointer; cursor: pointer;
position: absolute; position: absolute;
top: calc(50% - 40px); top: calc(50% - 40px);
@ -1994,7 +1994,7 @@ header + .chevron-divider {
} }
.old-new h1 { .old-new h1 {
font-size: 34px; font-size: 34px;
color: #67c4da; color: #67C4DA;
line-height: 1.2; line-height: 1.2;
margin: 35px 0; margin: 35px 0;
text-align: center; text-align: center;
@ -2006,7 +2006,7 @@ header + .chevron-divider {
} }
.old-new th { .old-new th {
font-size: 24px; font-size: 24px;
color: #d8127d; color: #D8127D;
line-height: 29px; line-height: 29px;
text-transform: uppercase; text-transform: uppercase;
padding-bottom: 15px; padding-bottom: 15px;
@ -2028,7 +2028,7 @@ header + .chevron-divider {
margin: 0 auto; margin: 0 auto;
} }
.old-new .new { .old-new .new {
border-bottom-color: #ffffff; border-bottom-color: #fff;
position: relative; position: relative;
background-color: #d7e9ef; background-color: #d7e9ef;
} }
@ -2072,7 +2072,7 @@ header + .chevron-divider {
} }
.product-overview h1 { .product-overview h1 {
font-size: 34px; font-size: 34px;
color: #67c4da; color: #67C4DA;
line-height: 1.2; line-height: 1.2;
margin: 35px 0; margin: 35px 0;
text-align: center; text-align: center;
@ -2146,11 +2146,12 @@ header + .chevron-divider {
padding: 175px 0; padding: 175px 0;
background-color: #fbfbfb; background-color: #fbfbfb;
font-size: 43px; font-size: 43px;
color: #ffffff; color: #fff;
line-height: 52px; line-height: 52px;
text-align: center;
} }
.blue-box .blue-copy { .blue-box .blue-copy {
background-color: #67c4da; background-color: #67C4DA;
padding: 70px 0 110px; padding: 70px 0 110px;
} }
.blue-box .blue-copy div { .blue-box .blue-copy div {
@ -2160,7 +2161,7 @@ header + .chevron-divider {
} }
.blue-box h1 { .blue-box h1 {
font-size: 43px; font-size: 43px;
color: #ffffff; color: #fff;
line-height: 52px; line-height: 52px;
text-align: center; text-align: center;
} }
@ -2202,7 +2203,7 @@ header + .chevron-divider {
} }
.galleries-marketplaces h1 { .galleries-marketplaces h1 {
font-size: 30px; font-size: 30px;
color: #000000; color: #000;
line-height: 36px; line-height: 36px;
margin-bottom: 50px; margin-bottom: 50px;
} }
@ -2224,7 +2225,7 @@ header + .chevron-divider {
} }
.blog-features .centered-content > h1 { .blog-features .centered-content > h1 {
font-size: 30px; font-size: 30px;
color: #000000; color: #000;
line-height: 36px; line-height: 36px;
margin-bottom: 50px; margin-bottom: 50px;
text-align: center; text-align: center;
@ -2250,7 +2251,7 @@ header + .chevron-divider {
} }
.blog-features h2 { .blog-features h2 {
font-size: 13px; font-size: 13px;
color: #67c4da; color: #67C4DA;
line-height: 22.79px; line-height: 22.79px;
margin: 10px 10px 0; margin: 10px 10px 0;
padding: 0 10px; padding: 0 10px;
@ -2315,7 +2316,7 @@ header + .chevron-divider {
border-radius: 100%; border-radius: 100%;
} }
.team h1 { .team h1 {
color: #000000; color: #000;
font-size: 19px; font-size: 19px;
margin-top: 20px; margin-top: 20px;
margin-bottom: 0; margin-bottom: 0;
@ -2362,7 +2363,7 @@ header + .chevron-divider {
.faq .featured-faqs dt { .faq .featured-faqs dt {
font-size: 25px; font-size: 25px;
line-height: 32px; line-height: 32px;
color: #d8127d; color: #D8127D;
cursor: pointer; cursor: pointer;
} }
.faq .featured-faqs dd { .faq .featured-faqs dd {
@ -2400,7 +2401,7 @@ header + .chevron-divider {
} }
} }
.values .value h1 { .values .value h1 {
color: #000000; color: #000;
font-size: 25px; font-size: 25px;
line-height: 1; line-height: 1;
margin-bottom: 0; margin-bottom: 0;
@ -2413,12 +2414,12 @@ header + .chevron-divider {
margin-bottom: 75px; margin-bottom: 75px;
} }
.careers a { .careers a {
color: #000000; color: #000;
font-size: 27px; font-size: 27px;
line-height: 32px; line-height: 32px;
} }
.careers a:hover { .careers a:hover {
color: #d8127d; color: #D8127D;
} }
.careers li { .careers li {
margin-bottom: 35px; margin-bottom: 35px;
@ -2460,7 +2461,7 @@ header + .chevron-divider {
} }
.contact label.required:after { .contact label.required:after {
content: '*'; content: '*';
color: #d8127d; color: #D8127D;
} }
.contact input, .contact input,
.contact textarea { .contact textarea {
@ -2474,7 +2475,7 @@ header + .chevron-divider {
} }
.contact input[aria-invalid=true], .contact input[aria-invalid=true],
.contact textarea[aria-invalid=true] { .contact textarea[aria-invalid=true] {
border: 1px solid #d8127d; border: 1px solid #D8127D;
} }
.contact input[type=submit] { .contact input[type=submit] {
display: inline-block; display: inline-block;
@ -2485,66 +2486,66 @@ header + .chevron-divider {
text-decoration: none; text-decoration: none;
min-width: 265px; min-width: 265px;
text-align: center; text-align: center;
color: #ffffff; color: #fff;
background-color: #67c4da; background-color: #67C4DA;
border-color: #67c4da; border-color: #67C4DA;
width: auto; width: auto;
} }
.contact input[type=submit].blue { .contact input[type=submit].blue {
color: #ffffff; color: #fff;
background-color: #67c4da; background-color: #67C4DA;
border-color: #67c4da; border-color: #67C4DA;
} }
.contact input[type=submit].blue:hover { .contact input[type=submit].blue:hover {
background-color: rgba(103, 196, 218, 0.5); background-color: rgba(103, 196, 218, 0.5);
} }
.contact input[type=submit].pink { .contact input[type=submit].pink {
color: #ffffff; color: #fff;
background-color: #d8127d; background-color: #D8127D;
border-color: #d8127d; border-color: #D8127D;
} }
.contact input[type=submit].pink:hover { .contact input[type=submit].pink:hover {
background-color: rgba(216, 18, 125, 0.5); background-color: rgba(216, 18, 125, 0.5);
} }
.contact input[type=submit].blue-overPic { .contact input[type=submit].blue-overPic {
color: #ffffff; color: #fff;
background-color: #67c4da; background-color: #67C4DA;
border-color: #67c4da; border-color: #67C4DA;
} }
.contact input[type=submit].blue-overPic:hover { .contact input[type=submit].blue-overPic:hover {
background-color: #ffffff; background-color: #fff;
color: #67c4da; color: #67C4DA;
} }
.contact input[type=submit].pink-overPic { .contact input[type=submit].pink-overPic {
color: #ffffff; color: #fff;
background-color: #d8127d; background-color: #D8127D;
border-color: #d8127d; border-color: #D8127D;
} }
.contact input[type=submit].pink-overPic:hover { .contact input[type=submit].pink-overPic:hover {
background-color: #ffffff; background-color: #fff;
color: #d8127d; color: #D8127D;
} }
.contact input[type=submit].white-blue { .contact input[type=submit].white-blue {
color: #67c4da; color: #67C4DA;
background-color: #ffffff; background-color: #fff;
border-color: #67c4da; border-color: #67C4DA;
} }
.contact input[type=submit].white-blue:hover { .contact input[type=submit].white-blue:hover {
background-color: rgba(103, 196, 218, 0.5); background-color: rgba(103, 196, 218, 0.5);
color: #ffffff; color: #fff;
} }
.contact input[type=submit].small { .contact input[type=submit].small {
padding: 5px 15px; padding: 5px 15px;
font-size: 14px; font-size: 14px;
color: #ffffff; color: #fff;
background-color: transparent; background-color: transparent;
border-color: #ffffff; border-color: #fff;
min-width: auto; min-width: auto;
} }
.contact input[type=submit].small:hover { .contact input[type=submit].small:hover {
background-color: rgba(255, 255, 255, 0.4); background-color: rgba(255, 255, 255, 0.4);
border-color: rgba(255, 255, 255, 0.4); border-color: rgba(255, 255, 255, 0.4);
color: #ffffff; color: #fff;
} }
@media screen and (max-width: 400px) { @media screen and (max-width: 400px) {
.contact input[type=submit] { .contact input[type=submit] {
@ -2561,7 +2562,7 @@ header + .chevron-divider {
} }
.contact .contact-point h1 { .contact .contact-point h1 {
font-size: 19px; font-size: 19px;
color: #d8127d; color: #D8127D;
text-align: left; text-align: left;
margin-bottom: 0; margin-bottom: 0;
} }
@ -2569,13 +2570,13 @@ header + .chevron-divider {
color: #121417; color: #121417;
font-size: 15px; font-size: 15px;
line-height: 19px; line-height: 19px;
color: #d8127d; color: #D8127D;
} }
.contact .wpcf7-not-valid-tip { .contact .wpcf7-not-valid-tip {
color: #121417; color: #121417;
font-size: 15px; font-size: 15px;
line-height: 19px; line-height: 19px;
color: #d8127d; color: #D8127D;
margin-top: -20px; margin-top: -20px;
margin-bottom: 10px; margin-bottom: 10px;
} }
@ -2605,16 +2606,16 @@ header + .chevron-divider {
border-bottom: 1px solid #979797; border-bottom: 1px solid #979797;
} }
.press-articles .press-article h1 { .press-articles .press-article h1 {
color: #000000; color: #000;
font-size: 19px; font-size: 19px;
margin-bottom: 0; margin-bottom: 0;
text-align: left; text-align: left;
} }
.press-articles .press-article h1 a { .press-articles .press-article h1 a {
color: #000000; color: #000;
} }
.press-articles .press-article h1 a:hover { .press-articles .press-article h1 a:hover {
color: #67c4da; color: #67C4DA;
} }
.downloads .left { .downloads .left {
float: left; float: left;
@ -2638,16 +2639,16 @@ header + .chevron-divider {
.past-events .event-archives h1 { .past-events .event-archives h1 {
text-align: left; text-align: left;
font-size: 19px; font-size: 19px;
color: #d8127d; color: #D8127D;
font-weight: 400; font-weight: 400;
} }
.upcoming-events .event-archives h1 a, .upcoming-events .event-archives h1 a,
.past-events .event-archives h1 a { .past-events .event-archives h1 a {
color: #d8127d; color: #D8127D;
} }
.upcoming-events .event-archives h1 a:hover, .upcoming-events .event-archives h1 a:hover,
.past-events .event-archives h1 a:hover { .past-events .event-archives h1 a:hover {
color: #000000; color: #000;
} }
.upcoming-events .event-archives ul, .upcoming-events .event-archives ul,
.past-events .event-archives ul { .past-events .event-archives ul {
@ -2663,11 +2664,11 @@ header + .chevron-divider {
} }
.upcoming-events .event-archives ul a, .upcoming-events .event-archives ul a,
.past-events .event-archives ul a { .past-events .event-archives ul a {
color: #000000; color: #000;
} }
.upcoming-events .event-archives ul a:hover, .upcoming-events .event-archives ul a:hover,
.past-events .event-archives ul a:hover { .past-events .event-archives ul a:hover {
color: #d8127d; color: #D8127D;
} }
.upcoming-events h2, .upcoming-events h2,
.past-events h2 { .past-events h2 {
@ -2705,7 +2706,7 @@ header + .chevron-divider {
.upcoming-events .event h1, .upcoming-events .event h1,
.past-events .event h1 { .past-events .event h1 {
font-size: 26px; font-size: 26px;
color: #000000; color: #000;
line-height: 1.2; line-height: 1.2;
text-align: left; text-align: left;
margin-bottom: 0; margin-bottom: 0;
@ -2713,11 +2714,11 @@ header + .chevron-divider {
} }
.upcoming-events .event h1 a, .upcoming-events .event h1 a,
.past-events .event h1 a { .past-events .event h1 a {
color: #000000; color: #000;
} }
.upcoming-events .event h1 a:hover, .upcoming-events .event h1 a:hover,
.past-events .event h1 a:hover { .past-events .event h1 a:hover {
color: #d8127d; color: #D8127D;
} }
.upcoming-events .event time, .upcoming-events .event time,
.past-events .event time { .past-events .event time {
@ -2785,7 +2786,7 @@ header + .chevron-divider {
} }
.short-descriptions .short-description h1 { .short-descriptions .short-description h1 {
font-size: 22px; font-size: 22px;
color: #d8127d; color: #D8127D;
} }
@media screen and (max-width: 600px) { @media screen and (max-width: 600px) {
.short-descriptions .short-description { .short-descriptions .short-description {
@ -2800,8 +2801,8 @@ header + .chevron-divider {
background-color: #fbfbfb; background-color: #fbfbfb;
} }
.content-boxed .centered-content > div { .content-boxed .centered-content > div {
border: 1px solid #d8127d; border: 1px solid #D8127D;
background-color: #ffffff; background-color: #fff;
padding: 60px 10%; padding: 60px 10%;
text-align: center; text-align: center;
color: #121417; color: #121417;
@ -2864,22 +2865,22 @@ header + .chevron-divider {
cursor: pointer; cursor: pointer;
text-transform: uppercase; text-transform: uppercase;
font-size: 24px; font-size: 24px;
color: #d8127d; color: #D8127D;
line-height: 29px; line-height: 29px;
color: #000000; color: #000;
font-weight: 400; font-weight: 400;
} }
.existing-new .top-tab.active div { .existing-new .top-tab.active div {
border: 1px solid #d8127d; border: 1px solid #D8127D;
border-bottom: 0; border-bottom: 0;
background-color: #ffffff; background-color: #fff;
color: #d8127d; color: #D8127D;
} }
.existing-new .content { .existing-new .content {
text-align: center; text-align: center;
display: none; display: none;
background-color: #ffffff; background-color: #fff;
border: 1px solid #d8127d; border: 1px solid #D8127D;
padding: 60px 10%; padding: 60px 10%;
margin-top: -1px; margin-top: -1px;
color: #121417; color: #121417;
@ -2905,9 +2906,9 @@ header + .chevron-divider {
margin-bottom: 0; margin-bottom: 0;
} }
.existing-new .button { .existing-new .button {
color: #ffffff; color: #fff;
background-color: #d8127d; background-color: #D8127D;
border-color: #d8127d; border-color: #D8127D;
} }
.existing-new .button:hover { .existing-new .button:hover {
background-color: rgba(216, 18, 125, 0.5); background-color: rgba(216, 18, 125, 0.5);
@ -2967,7 +2968,7 @@ header + .chevron-divider {
} }
.get-started .methods-of-use h1 { .get-started .methods-of-use h1 {
font-size: 26px; font-size: 26px;
color: #d8127d; color: #D8127D;
line-height: 1.2; line-height: 1.2;
text-transform: uppercase; text-transform: uppercase;
font-weight: 200; font-weight: 200;
@ -2990,11 +2991,11 @@ header + .chevron-divider {
height: 470px; height: 470px;
padding-top: 80px; padding-top: 80px;
text-align: center; text-align: center;
color: #ffffff; color: #fff;
font-weight: 400; font-weight: 400;
} }
.pricing h1 { .pricing h1 {
color: #ffffff; color: #fff;
margin-bottom: 10px; margin-bottom: 10px;
} }
.pricing .pricing-detail { .pricing .pricing-detail {
@ -3013,10 +3014,10 @@ header + .chevron-divider {
.pricing .pricing-detail div { .pricing .pricing-detail div {
height: 135px; height: 135px;
text-align: center; text-align: center;
background-color: #ffffff; background-color: #fff;
font-size: 36px; font-size: 36px;
line-height: 1.2; line-height: 1.2;
color: #d8127d; color: #D8127D;
} }
.pricing .pricing-detail div p { .pricing .pricing-detail div p {
position: relative; position: relative;
@ -3025,16 +3026,16 @@ header + .chevron-divider {
transform: translateY(-50%); transform: translateY(-50%);
} }
.pricing .pricing-detail small { .pricing .pricing-detail small {
color: #000000; color: #000;
font-size: 16px; font-size: 16px;
display: block; display: block;
margin-top: 7px; margin-top: 7px;
} }
.pricing a { .pricing a {
color: #ffffff; color: #fff;
} }
.pricing a:hover { .pricing a:hover {
color: #d8127d; color: #D8127D;
} }
@media screen and (max-width: 600px) { @media screen and (max-width: 600px) {
.pricing { .pricing {
@ -3129,7 +3130,7 @@ article.post .meta {
} }
.blog-sidebar .sidebar-blog-features h1 { .blog-sidebar .sidebar-blog-features h1 {
font-size: 19px; font-size: 19px;
color: #d8127d; color: #D8127D;
margin-bottom: 0; margin-bottom: 0;
} }
.blog-sidebar .sidebar-blog-features time { .blog-sidebar .sidebar-blog-features time {
@ -3138,7 +3139,7 @@ article.post .meta {
margin-bottom: 5px; margin-bottom: 5px;
} }
.blog-sidebar .sidebar-blog-features a { .blog-sidebar .sidebar-blog-features a {
color: #000000; color: #000;
} }
.blog-sidebar .sidebar-blog-features a:hover { .blog-sidebar .sidebar-blog-features a:hover {
opacity: .3; opacity: .3;
@ -3173,19 +3174,19 @@ article.post .meta {
} }
footer { footer {
font-size: 14px; font-size: 14px;
color: #ffffff; color: #fff;
line-height: 25px; line-height: 25px;
} }
footer a { footer a {
font-size: 14px; font-size: 14px;
color: #ffffff; color: #fff;
line-height: 25px; line-height: 25px;
width: 100%; width: 100%;
} }
footer a:hover { footer a:hover {
font-family: "canada-type-gibson", sans-serif; font-family: "canada-type-gibson", sans-serif;
font-weight: 400; font-weight: 400;
color: #ffffff; color: #fff;
} }
footer .top-footer { footer .top-footer {
background-color: #8c8c8c; background-color: #8c8c8c;

2
assets/css/ascribe.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
assets/css/less/ascribe.less
View File

@ -854,6 +854,7 @@ header + .chevron-divider {
padding: 175px 0; padding: 175px 0;
background-color: @greyBg; background-color: @greyBg;
.blueBoxCopy; .blueBoxCopy;
text-align: center;
.blue-copy { .blue-copy {
background-color: @blueBright; background-color: @blueBright;
@ -1947,4 +1948,3 @@ h1 > a,
.subtemplate.downloads .centered-content { .subtemplate.downloads .centered-content {
text-align: center; text-align: center;
} }

5
controller/classes/Subtemplate.php
View File

@ -282,13 +282,16 @@ class Subtemplate {
} }
public function blueBox($subtemplateTitle) { public function blueBox($subtemplateTitle) {
$content = get_sub_field('content'); $content = get_sub_field('content');
$blueBoxCtaText = get_sub_field('bluebox_cta_text');
$blueBoxCtaLink = get_sub_field('bluebox_cta_link');
$result = "<section class='subtemplate blue-box'> $result = "<section class='subtemplate blue-box'>
<div class='centered-content'> <div class='centered-content'>
<article class='blue-copy'> <article class='blue-copy'>
<h1>{$subtemplateTitle}</h1> <h1>{$subtemplateTitle}</h1>
<div>{$content}</div> <div>{$content}</div>
<a href='{$blueBoxCtaLink}' class='button pink-overPic'>{$blueBoxCtaText}</a>
</article> </article>
</div> </div>
</section>"; </section>";