/*
Theme Name: DGD-002
Theme URI: http://underscores.me/
Author: Lorcan Donnellan & Juraj Lorinc
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: dgd-001
Tags:
*/
/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
clip: rect(1px, 1px, 1px, 1px);
position: absolute !important;
height: 1px;
width: 1px;
overflow: hidden;
}
.screen-reader-text:focus {
background-color: #f1f1f1;
border-radius: 3px;
box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
-webkit-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
clip: auto !important;
color: #21759b;
display: block;
font-size: 14px;
font-size: 0.875rem;
font-weight: bold;
height: auto;
left: 5px;
line-height: normal;
padding: 15px 23px 14px;
text-decoration: none;
top: 5px;
width: auto;
z-index: 100000; /* Above WP toolbar. */
}
/*------------------------------------------------------------------------------------------------------------------*\
#MY CUSTOM CSS
\*------------------------------------------------------------------------------------------------------------------*/
/*------------------------------*\
RESET
\*------------------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block; }
body {line-height: 1; }
ol, ul {list-style: none; }
blockquote, q {quotes: none; }
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
table {border-collapse: collapse; border-spacing: 0;}
input[type="text"],
input[type="submit"]
{-webkit-appearance:none; /* Remove default shadow on iOS*/}
button{outline: none !important}
/*------------------------------*\
GENERAL
\*------------------------------*/
body{padding: 0; margin: 0; background-color: white; min-width: 200px}
body{-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;} /* OSX font fix */
body, input{font-family: 'Source Sans Pro', sans-serif; font-size: 15px; }
a{text-decoration: none; color: #17a6d1}
a:not(.button-link):hover{opacity: 0.9;}
p{line-height: 26px}
b, strong{font-weight: bold;}
@font-face {
font-family: 'GoodFoot';
src: url('fonts/goodfoot-webfont.eot');
src: url('fonts/goodfoot-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/goodfoot-webfont.woff2') format('woff2'),
url('fonts/goodfoot-webfont.woff') format('woff'),
url('fonts/goodfoot-webfont.ttf') format('truetype'),
url('fonts/goodfoot-webfont.svg#good_footregular') format('svg');
font-weight: normal;
font-style: normal;
}
/*@font-face {
font-family: 'ChunkFive';
src: url('fonts/chunkfive.regular-webfont.eot');
src: url('fonts/chunkfive.regular-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/chunkfive.regular-webfont.woff2') format('woff2'),
url('fonts/chunkfive.regular-webfont.woff') format('woff'),
url('fonts/chunkfive.regular-webfont.ttf') format('truetype'),
url('fonts/chunkfive.regular-webfont.svg#chunkfiveregular') format('svg');
font-weight: normal;
font-style: normal;
}*/
::-moz-selection { background: rgba(0, 204, 255, 0.5); }
::selection { background: rgba(0, 204, 255, 0.5); }
/*.button-link {font: 300 21px 'Oswald', sans-serif; color: #cf6af8; text-decoration: none; display: inline-block; height: 38px; border: 1px solid #d4a7ea; border-radius: 6px; padding: 0 45px; line-height: 38px; }*/
.clearfix{clear: both}
.clearfix-left{clear: left}
.clearfix-right{clear: right}
h2{display: inline-block; position: relative; padding: 0 25px; margin: 0 auto; overflow: visible; font-size: 37px; font-weight: 600; line-height: 1em; z-index: 20}
.h2-line{position: relative; width: 98%; left: 1%; border-top: 2px solid #8a8a8a; z-index: 10;}
.wrapper{position: relative; width: 100%; text-align: center; }
.content{position: relative; margin: auto; max-width: 1400px; min-width: 320px;}
.edit-link a{display: block; position: fixed; bottom: 0; right: 0; margin: -5px; padding: 0.5em 2em; width: 2em; background-color: #444; color: white !important; border: 2px solid black; border-radius: 5px; z-index: 100;}
.anchor{position: relative; top: -100px;}
.show-under-700 {display: none; }
/*------------------------------*\
#header
\*------------------------------*/
#header-wrapper{position: relative; height: 473px; z-index: 102; }
#header-map{height: 473px;}
#header{background-repeat: no-repeat; background-size: cover; height: 100%; position: relative; z-index: 100; overflow: visible !important; margin-top: 76px;}
#header nav { position: fixed; height: 76px; background-color: black; width: 100%; z-index: 500;
-webkit-backface-visibility: hidden;
display: block;
position: fixed;
transform: translate3d(0px, 0px, 0px);
top: 0;
left: 0;
right: 0;
margin: auto;
z-index: 100000;
}
body.admin-bar #header nav {
top: 32px;
}
@media screen and (max-width: 782px) {
body.admin-bar #header nav {
top: 46px;
}
}
@media screen and (max-width: 600px) {
body.admin-bar #header nav {
top: 0;
}
}
#header nav ul{position: relative; top: 17px; padding: 0; margin: 0;}
#header nav li {list-style-type: none; display: inline-block; margin: 0 0 0 25px; padding: 0}
#header nav .nav-home {margin-left: 36px}
#header nav .nav-wm {margin-right: 1em}
#header nav .nav-dm {margin-left: 59px}
#header nav a{text-decoration: none; color: white; margin: 0; padding: 0; transition: color 0.2s; font: 400 24px "GTSectra", sans-serif; text-transform: uppercase;}
#header nav a:hover{color: #dcddde; transition: color 0.2s}
#nav-man{position: relative; display: inline-block; top: -13px; margin: 0 auto; width: 27px; height: 50px; background-image: url("images/sprite-sheet-global.png"); background-size: 537px 500px; background-repeat: no-repeat; background-position: -232px -5px; z-index: 300}
#header nav .sub-menu{display: none;}
/*------------------------------*\
#header
\*------------------------------*/
/*.home #header-wrapper{position: fixed; height: 484px; background-image: url("images/header/home.jpg"); background-repeat: no-repeat; box-shadow: 0 0 150px 0px rgba(0, 0, 0, 0.95) inset; z-index: 200}
#header{opacity: 0.95}
#header nav ul{position: relative; top: 25px; padding: 0; margin: 0;}
#header nav li {list-style-type: none; display: inline-block; font: 700 19px 'Source Sans Pro', sans-serif; text-transform: uppercase; margin: 0 0 0 25px; padding: 0}
#header nav #nav-home {margin-left: 10px}
#header nav #nav-dm {margin-left: 35px}
#header nav a{text-decoration: none; color: black; margin: 0; padding: 0}
#header nav a:hover{text-decoration: underline;}
#header-text{position: relative; top: 150px; font: 36px sans-serif; text-transform: uppercase; font-weight: bold; }*/
/*------------------------------*\
#header #header-text
\*------------------------------*/
#header #header-text-wrapper{position: absolute; top: 26%; width: 100%; overflow: hidden; margin-top: -13px;}
#header #header-text{position: relative; color: white; font-weight: 600; max-width: 1100px; margin: 0 auto}
#header-text .first-line{font: 400 28px "GTSectra", sans-serif; text-shadow: 2px 1px rgba(8, 8, 8, 0.75); text-transform: capitalize;}
#header-text .second-line{font-size: 4.7em; font-family: "GTSectra", serif; padding-top: 0.15em; font-weight: 400; text-shadow: 2px 1px rgba(8, 8, 8, 0.75);}
#header-text .third-line{
font: 40px/45px 'GoodFoot';
color: white;
width: 660px;
margin: 45px auto 0;
}
/*------------------------------*\
#main
\*------------------------------*/
#main-wrapper{position: relative; z-index: 100; background-color: white }
#main-wrapper main{text-align: center;}
h1{font-family: "GTSectra", serif; font-weight: 400; font-size: 31px; padding-top: 17px}
.article{position: relative;}
.page-template-page-no-title article{padding-top: 55px;}
.entry-thumbnail{max-width: 100%}
.entry-thumbnail img{width: 100%;height: 100%;}
/*------------------------------*\
#lists
\*------------------------------*/
.entry-content ul{
margin: 1.2em 0 1.6em 3em;
}
.entry-content ol{
margin: 1.2em 0 1.6em 1em;
}
.entry-content ol p{
margin-left: 1.5em;
}
.entry-content li{
position: relative;
line-height: 1.5em;
margin: 0.4em 0 ;
}
.entry-content ul>li:before{
content: "";
position: absolute;
width: 6px;
height: 6px;
background-color: #555;
border-radius: 50%;
display: block;
left: -1.8em;
top: 0.75em;
}
/*------------------------------------------------------------------------ about-us ------------------------------------------------------------------------*\*/
/*.page-about-us .content{
width: 100%;
max-width: 100%;
}*/
.page-about-us #header{
text-align: center;
z-index: 102;
}
.page.page-about-us #main-wrapper{background-position: center; background-color: black; background-size: cover; background-repeat: no-repeat;}
.page.page-about-us #main-wrapper main{
padding-bottom: 120px;
}
#video-wrapper {
/*position: absolute;*/
position: relative;
width: 100vw;
left: calc( 50% - 50vw - 8px);
top: 0;
overflow: hidden;
background-color: black;
height: calc(100vh - 76px);
/*min-height: 640px;*/
/*max-height: 1037px;*/
}
.page-about-us #header-text .first-line{
width: calc( 100% - 9.5em );
}
#about-us-video{
position: absolute;
min-width: 100%;
min-height: 100%;
top: -9999px;
bottom: -9999px;
left: -9999px;
right: -9999px;
margin: auto;
}
.page.page-about-us .entry-content{text-align: center;}
.page.page-about-us #header-text-wrapper{margin-top: 110px; margin-bottom: 150px; }
.page.page-about-us #header-text-wrapper p{ position: relative; }
.page.page-about-us #header-text-wrapper #header-text{position: relative; color: white; font-weight: 600; max-width: 1100px; margin: 0 auto}
.page.page-about-us p{font: 40px/45px 'GoodFoot'; color: white; width: 660px; margin: 45px auto 0;}
.page.page-about-us .first-p{width: 700px; max-width: 72%; }
.page.page-about-us #scroll-down-arrow-wrapper{}
.page.page-about-us .entry-content{
max-width: 1375px;
float: none;
margin-left: auto;
margin-right: auto;
}
b.line {
display: inline-block;
}
.video-section {
position: relative;
}
#senior-team {
/*z-index: 0;*/
position: relative;
margin-bottom: 0;
}
#senior-team h3{
font-size: 53px;
color: #fff;
padding-top: 106px;
}
#senior-team p{
font-family: 'Source Sans Pro', sans-serif;
font-size: 23px;
font-weight: normal;
width: 80%;
}
#senior-team .member{
position: relative;
width: 25%;
float: left;
margin-top: 75px;
}
#senior-team .member .photo-wrapper{
position: relative;
width: 100%;
max-width: 160px;
margin: 0 auto;
}
#senior-team .member .photo{
/*position: absolute;*/
top: 0;
width: 100%;
padding-bottom: 100%;
background-size: contain;
}
#senior-team .member-dulce .photo{
background-image: url( 'images/team/dulce-320x320.png' );
}
#senior-team .member-lorcan .photo{
background-image: url( 'images/team/lorcan-320x320.png' );
}
#senior-team .member-juraj .photo{
background-image: url( 'images/team/juraj-320x320.png' );
}
#senior-team .member-aarvin .photo{
background-image: url( 'images/team/aarvin-320x320.png' );
}
#senior-team .name{
font-size: 30px;
line-height: 19px;
color: #fff;
font-weight: 300;
font-family: "GT Sectra", serif;
text-align: center;
margin-top: 1em;
margin-bottom: 0.8em;
}
#senior-team .position{
color: #fff;
font-size: 16px;
font-family: 'muli-light', sans-serif;
}
/*-------------------------------------------------------------------- digital-marketing --------------------------------------------------------------------*/
.page-digital-marketing #header-text-wrapper .first-line{
color: #181818 !important;
}
.page-digital-marketing #header-video-image {
background-image: url( 'videos/digital-marketing-1920.jpg' );
}
.page-digital-marketing #header #header-text-wrapper{
width: 50%;
top: 29%;
text-align: right;
overflow: visible;
/*outline: 1px solid blue;*/
}
.page-digital-marketing #header #header-text{
width: 100%;
max-width: 580px;
margin-right: 0;
text-align: center;
/*outline: 1px solid red;*/
}
.page-digital-marketing #header-text .first-line{
font-size: 35px;
text-transform: none;
text-align: left;
padding-left: 50px;
}
.page-digital-marketing #header-text .second-line{
font-size: 86px;
padding-top: 0;
margin-bottom: 0.45em;
}
.page-digital-marketing #header-text .third-line{
margin: 0 auto;
width: 100%;
padding-left: 30px;
}
@media screen and (max-width: 1280px) {
.page-digital-marketing #header-video-image {
background-image: url( 'videos/digital-marketing-1280.jpg' );
}
}
@media screen and (max-width: 1020px) {
.page-digital-marketing #header #header-text-wrapper{
width: 75%;
}
.page-digital-marketing #header #header-text{
width: 66.67%;
margin-right: auto;
margin-left: 0;
padding-left: 17px;
}
.page-digital-marketing #header-text .first-line{
font-size: 28px;
}
.page-digital-marketing #header-text .second-line{
font-size: 70px;
padding-top: 5px;
margin-bottom: 0.25em;
}
.page-digital-marketing #header-text .third-line{
font-size: 32px;
padding-left: 20px;
white-space: nowrap;
}
}
@media screen and (max-width: 750px) {
.page-digital-marketing #header-text .first-line{
font-size: 22px;
text-align: center;
padding-left: 11px;
width: 200px;
text-align: left;
margin: 0 auto;
}
.page-digital-marketing #header-text .second-line{
font-size: 56px;
padding-top: 2px;
margin-bottom: 0.3em;
}
.page-digital-marketing #header-text .third-line{
font-size: 25px;
width: 200px;
white-space: initial;
text-align: left;
line-height: 1.2em;
padding-left: 11px;
}
}
@media screen and (max-width: 520px) {
.page-digital-marketing #header #header-text-wrapper{
top: 42px;
}
.page-digital-marketing #header #header-text{
padding-left: 10px;
}
}
@media screen and (max-width: 400px) {
.page-digital-marketing #header #header-text-wrapper{
top: 10px;
}
.page-digital-marketing #header #header-text{
width: 100%;
/*padding-left: 10px;*/
}
.page-digital-marketing #header-text .first-line{
font-size: 19px;
padding-left: 15px;
text-align: left;
margin: 0;
}
.page-digital-marketing #header-text .second-line{
font-size: 40px;
padding-left: 0;
/*padding-top: 5px;
margin-bottom: 0.25em;*/
text-align: left;
padding-left: 5px;
}
.page-digital-marketing #header-text .third-line{
display: block;
padding-left: 10px;
margin-left: 0;
font-size: 19px;
width: 160px;
/*font-size: 22px;
padding-left: 10px;*/
/*white-space: nowrap;*/
}
}
/*------------------------------*\
#subnav
\*------------------------------*/
/*
.subnav-item #subnav a
*/
#subnav{padding: 0; z-index: 200;
/* position: absolute;
top: 0;
width: 100%; */
}
#subnavplaceholder{
/* position: relative;
height: 137px; */
}
article{z-index: 100}
#subnav a{display: inline-block; height: 96px; vertical-align: top; text-decoration: none; transition: background 0.3s;}
#subnav a{width: 7.7%}
#subnav a.subnav-item-em{width: 11.8%; min-width: 106px;}
#subnav a.subnav-item-adw{min-width: 60px;}
#subnav a.subnav-item-sm{min-width: 85px;}
#subnav a.subnav-wm-item-ms{width: 116px;}
#subnav a.subnav-wm-item-cm{width: 136px;}
.subnav-item{padding: 0 3% 0; min-width: 80px}
.subnav-dm-item{;padding: 0 3% 0; min-width: 50px}
#subnav a.current-menu-item,
#subnav a:hover{opacity: 1; background-color: #eee; transition: background 0.3s;}
.subnav-icon{position: relative; height: 35px; width: 35px; margin: 18px auto 6px;}
.subnav-dm-item .subnav-icon{background-image: url("images/sprite-sheet-dm.png"); background-size: 154px 75px; }
.subnav-wm-item .subnav-icon{background-image: url("images/sprite-sheet-wm.png"); background-size: 154px 77px; }
.subnav-text{position: relative; text-transform: uppercase; font: 300 16px 'Oswald', sans-serif; color: #a110c6; margin: 2px auto; width: 100%; white-space: nowrap; text-decoration: none;}
.page-web-design .subnav-text{color: #666;}
.subnav-item-seo .subnav-icon{background-position: 0 0}
.subnav-item-adw .subnav-icon{background-position: -36px 0}
/*.subnav-item-cm .subnav-icon{background-position: -73px 0}*/
.subnav-item-em .subnav-icon{background-position: -109px 0}
.subnav-item-sm .subnav-icon{background-position: -109px -36px}
.subnav-item-str .subnav-icon{background-position: -36px -36px}
.subnav-item-cro .subnav-icon{background-position: -73px -36px }
/*.subnav-item-rt .subnav-icon{background-position: -109px -36px}*/
.subnav-wm-item-wd .subnav-icon{background-position: -7px -3px}
.subnav-wm-item-ms .subnav-icon{background-position: -45px -3px}
.subnav-wm-item-cm .subnav-icon{background-position: -81px -3px}
.subnav-wm-item-eco .subnav-icon{background-position: -116px -3px}
/*------------------------------*\
#wm-content
\*------------------------------*/
.wm-content-block {
position: relative;
height: 640px;
text-align: left;
overflow: hidden;
}
.wm-content-block .content {
height: 100%;
}
.wm-content-block h2 {
width: 44%;
}
.wm-content-block .wm-content-text,
.wm-content-block h2 {
position: relative;
float: right;
}
.wm-content-block h2 {
text-transform: uppercase;
/*font: 300 43px 'Oswald', sans-serif;*/
line-height: 1.3em;
padding: 110px 0 1em;
margin: 0 ;
color: #454444;
}
.wm-content-text {
clear: both;
position: absolute;
width: 44%;
margin: 0;
}
.wm-content-text p {
font-size: 17px;
line-height: 35px;
padding-bottom: 24px;
text-align: justify;
color: #454444;
letter-spacing: 0.02em;
}
#web-block{
background-color: white;
}
#mob-block{
background-color: #1ab4cc;
}
#eco-block{
background-color: black;
}
#eco-block p{
color: white;
}
#eco-block, #eco-block h2{
color: white;
}
#con-block{
background-color: #96c93e;
}
.wm-content-icon {
position: absolute;
background-repeat: no-repeat;
background-size: 100%;
background-position: center;
width: 50%;
height: 100%;
}
#web-block .wm-content-icon{
background-image: url("images/wm/web.png");
}
#mob-block .wm-content-icon{
background-image: url("images/wm/mob.png");
}
#eco-block .wm-content-icon{
background-image: url("images/wm/eco.png");
}
#con-block .wm-content-icon{
background-image: url("images/wm/con.png");
}
/*------------------------------*\
#dm-content
\*------------------------------*/
/*.page-digital-marketing .page {
margin-top: -55px;
}
.dm-content-block {
position: relative;
height: 640px;
text-align: left;
overflow: hidden;
}
.dm-content-block .content {
height: 100%;
}
.wm-content-block h2,
.dm-content-block h2 {
text-transform: uppercase;
font: 300 43px 'Oswald', sans-serif;
line-height: 1em;
padding: 107px 0 50px;
margin: 0 ;
color: #454444;
}
.dm-content-block h2 {
width: 55.5%;
}
.dm-content-block.left-block .dm-content-text,
.dm-content-block.left-block h2 {
position: relative;
float: left;
}
.dm-content-block.right-block .dm-content-text,
.dm-content-block.right-block h2 {
position: relative;
float: right;
z-index: 190;
}
.dm-content-text {
clear: both;
position: absolute;
width: 55.5%;
margin: 0;
}
.wm-content-text p,
.dm-content-text p {
font-size: 17px;
line-height: 35px;
padding-bottom: 24px;
text-align: justify;
color: #454444;
letter-spacing: 0.02em;
}
#str-block{
background-color: #a110c7;
}
#str-block h2,
#adw-block h2,
#str-block p,
#adw-block p{
color: white;
}
#seo-block,
#em-block,
#sm-block{
background-color: #e7eef0;
background-image: url('images/dm/sky-bg.jpg');
background-position: center;
background-size: 100%;
}
#seo-block{
}
#adw-block{
background-color: black;
}
#em-block{
}
#cro-block{
background-color: white;
z-index: 2;
}
#sm-block{
}
.dm-content-icon {
position: absolute;
bottom: 0;
background-repeat: no-repeat;
background-size: 100%;
height: 100%;
background-position: center bottom;
z-index: 100;
}
#str-block .dm-content-icon{
background-image: url("images/dm/str.png");
width: 57.8%;
right: -3.29%;
}
#seo-block .dm-content-icon{
background-image: url("images/dm/seo.png");
width: 38.36%;
left: 11.4%;
}
#adw-block .dm-content-icon{
background-image: url("images/dm/adw.png");
width: 54.7%;
right: -2.5%;
}
#cm-block .dm-content-icon{
background-image: url("images/dm/cm.png");
width: 42.36%;
left: -1.2%;
}
#em-block .dm-content-icon{
background-image: url("images/dm/em.png");
width: 48.2%;
left: -2%;
}
#sm-block .dm-content-icon{
background-image: url("images/dm/sm.png");
width: 47.92%;
left: -3.7%;
}
#cro-block .dm-content-icon{
background-image: url("images/dm/cro.png");
width: 32%;
right: 10.65%;
bottom: -9px;
}
#rt-block .dm-content-icon{
background-image: url("images/dm/rt.png");
width: 76.64%;
left: -2.07%;
}
.cloud1,
.cloud2,
.cloud3,
.cloud4{
background-image: url("images/dm/clouds.png");
background-size: 300%;
width: 300px;
height: 216px;
position: absolute;
}
.cloud2{
background-position: 300px 0;
}
.cloud2{
background-position: 600px 0;
}
#seo-block .cloud1{
left: 4.5%;
bottom: 22%;
}
#seo-block .cloud2{
left: 42%;
top: 35.7%;
}
#seo-block .cloud3{
right: 15.8%;
top: 5.2%;
}
#seo-block .cloud4{
right: 6%;
bottom: 13.1%;
}
#em-block .cloud1{
left: 38%;
bottom: 33.3%;
}
#em-block .cloud2{
left: 5.7%;
top: 12.4%;
}
#em-block .cloud3{
right: 6%;
top: 20.6%;
}
#sm-block .cloud1{
left: 4.5%;
top: 20%;
}
#sm-block .cloud2{
right: 10%;
bottom: 15%;
}
#sm-block .cloud3{
left: 35%;
top: 5%;
}*/
/*-------------------------------------------------------------------- blog / archive --------------------------------------------------------------------*\*/
#header-wrapper.header-no-image{height: 0;}
#header-wrapper.header-no-image #header{background-image: none !important;}
#blog-home.main-wrapper-anchor{position: relative; top: -103px;}
/*------------------------------*\248 - 158px, 258- 188px
#older-posts-list, #category list
\*------------------------------*/
.nothing-found{padding-bottom: 3em; }
.page-blog #main-wrapper, .archive #main-wrapper{padding-top: 27px}
.h-wrapper{height: 101px; line-height: 101px; text-align:center; margin: 10px; position: relative; top: -25px}
.page-blog h1, .archive h1{display: inline-block; vertical-align: middle; line-height: 31px; width: 600px; padding: 8px 0 0 }
#older-posts-list, #category-list{z-index: 20; position: absolute; font-size: 20px; font-weight: 800; }
.list-caption{text-transform: uppercase; color: #5d5d5d; cursor: pointer; padding: 17px 30px 16px 50px; border: 1px solid #cdcccc; position: absolute; background-repeat: no-repeat; text-align: left; }
.list-caption .icon{position: absolute; width: 22px; height: 22px; background-image: url("images/sprite-sheet-global.png"); background-size: 537px 500px; background-position: -266px -76px; left: 20px; }
#category-list.toggled .list-caption .icon,
#older-posts-list.toggled .list-caption .icon{background-position: -233px -71px; left: 20px; }
#older-posts-list .list-wrapper, #category-list .list-wrapper{border: 1px solid #cdcccc; border-top: none; position: relative; text-align: left; height: 0; background-color: white; }
#older-posts-list ul, #category-list ul{text-transform: uppercase; font-weight: 600; height: 0; overflow: hidden}
#older-posts-list.toggled ul, #category-list.toggled ul{height: 150px; overflow: auto;}
#older-posts-list li, #category-list li{margin: 10px 20px; width: 195px}
#older-posts-list li{width: 195px}
#older-posts-list a, #category-list a{text-decoration: none; color: #5d5d5d; }
#older-posts-list ::-webkit-scrollbar, #category-list ::-webkit-scrollbar {background-color: white; width: 22px}
#older-posts-list ::-webkit-scrollbar-thumb, #category-list ::-webkit-scrollbar-thumb{background-color: #a1a1a1; border: 5px solid transparent; border-radius: 20px; background-clip: content-box;}
#older-posts-list ::-webkit-scrollbar-track, #category-list ::-webkit-scrollbar-track{border-left: 1px solid #cdcccc;}
#older-posts-list .list-wrapper, #older-posts-list .list-wrapper ul, #category-list .list-wrapper, #category-list .list-wrapper ul {border-color: transparent; opacity: 0; transition: 0.3s height, 0.3s opacity; margin-top: 0; margin-left: 0;}
#older-posts-list.toggled .list-wrapper, #older-posts-list.toggled .list-wrapper ul, #category-list.toggled .list-wrapper, #category-list.toggled .list-wrapper ul {height: 230px; border-color: #cdcccc; opacity: 1;}
/*---#older-posts-list---*/
#older-posts-list .list-caption{width: 160px}
#older-posts-list .list-wrapper{top: 55px; width: 240px;}
/*---#category-list---*/
#category-list{right: 10px; }
#category-list .list-caption{border-right: none; width: 161px; position: relative}
/*------------------------------*\
#search
\*------------------------------*/
.page-blog .search-form, .archive .search-form{position: absolute; right: 10px; width: 53px; height: 53px; z-index: 20; overflow: hidden; border: 1px solid #cdcccc; background-color: white; transition: 0.3s width}
.page-blog .search-form.toggled, .archive .search-form.toggled{width: 225px; transition: 0.3s width}
.page-blog .search-form .search-field, .archive .search-form .search-field{height: 53px; width: 200px; position: absolute; left: 0; padding: 0 15px; border: none; outline: none; color: #5d5d5d}
.search-submit{position: absolute; right: 0; top: 0; width: 53px; height: 53px; border: none; font-size: 0; background-repeat: no-repeat;
background-image: url("images/sprite-sheet-global.png");
background-size: 537px 500px;
background-position: -121px -16px;
}
.page-blog .search-submit, .archive .search-submit{top: 0 !important;}
/*------------------------------*\
#blog-posts-wrapper
\*------------------------------*/
.page-blog .entry-content, .archive .entry-content, .search .entry-content{padding-bottom: 16px;}
#blog-posts-wrapper{margin: 36px -10px 0 -10px; z-index: 10}
.blog-post{position: relative; width: 330px; height: 365px; margin: 16px 10px 10px 10px; background-color: #f5f5f5; float: left; overflow: hidden; }
.blog-thumbnail{position: relative; display: block; width: 335px; height: 173px; background-image: url("images/blog-post.png"); background-size: 100%}
.blog-thumbnail img{position: absolute; left: 0}
.blog-thumbnail-shadow{position: absolute; width: 100%; height: 173px; top: 0;}
.blog-post .blog-thumbnail-shadow{-webkit-box-shadow: 0 0 32px 30px rgba(0, 0, 0, 0.3) inset;; box-shadow: 0 0 32px 30px rgba(0, 0, 0, 0.3) inset; }
.blog-post:hover .blog-thumbnail{-webkit-filter: grayscale(100%); filter: grayscale(100%); filter: gray; filter: url("data:image/svg+xml;utf8,#greyscale");}
.blog-post h3 a, .date-author a, .blog-description-text a{text-decoration: none; color: black; transition: color 0.2s}
.blog-post h3 a:hover, .date-author a:hover{color: #6D6E71; transition: color 0.2s}
.blog-thumbnail .icon{float: left; position: relative; width: 13px; height: 25px; margin-top: 18px; margin-left: 16px; background-image: url("images/DAMNGOOD-logo-w.png"); background-size: 100% 100%}
.blog-description{margin: 14px 28px; text-align: left;}
.blog-description h3{text-transform: uppercase; font-weight: bold; line-height: 22px; font-size: 1em; margin-top: 1.3em; margin-bottom: 0; font-family: 'Source Sans Pro', sans-serif;}
.blog-description .date-author{line-height: 2.9em; font-size: 0.8em; margin-bottom: 0.2em}
.blog-description-text{margin-top: 10px; font-size: 0.8em; line-height: 1.9em;}
.blog-description-text a p{color: #686868; line-height: 19px; font-size: 12px;}
.posts-navigation{position: relative; margin: 40px 0; font-size: 1.1em; text-align: center;}
.posts-navigation .nav-previous, .posts-navigation .nav-next{display: inline-block; text-transform: uppercase; font-weight: 600; padding: 1px 66px; margin-top: 3px}
.posts-navigation .nav-previous a, .posts-navigation .nav-next a{text-decoration: none; color: black; transition: color 0.2s}
.posts-navigation .nav-previous a:hover, .posts-navigation .nav-next a:hover{color: #6D6E71; transition: color 0.2s}
.posts-navigation .nav-previous{background: url('data:image/svg+xml;utf8,'); background-position: 10px 2px; padding-left: 30px; transition: background-position 0.2s}
.posts-navigation .nav-next{background: url('data:image/svg+xml;utf8,'); background-position: -20px 2px; padding-right: 30px; transition: background-position 0.2s}
.posts-navigation .nav-previous:hover{background-position: 0px 2px}
.posts-navigation .nav-next:hover{background-position: -10px 2px}
/*------------------------------*\
#single post / #page
\*------------------------------*/
.single-post .entry-content h1 ,.single-post .entry-content h2 ,.single-post .entry-content h3 ,.single-post .entry-content h4 ,.single-post .entry-content h5{margin: 1em 0 0.25em ; padding: 0; line-height: 1.5em; }
.single-post .entry-content h1 {font-size: 36px}
.single-post .entry-content h2 {font-size: 29px}
.single-post .entry-content h3 {font-size: 23px}
.single-post .entry-content h4 {font-size: 19px}
.single-post .entry-content h5 {font-size: 15px}
.single-post .entry-content p{padding: 0; margin: 11px auto 0; }
@media screen and (min-width: 1240px) {
.single-post .content{ max-width: calc( 1400px - 282px );}
.single-post .post .entry-sidebar{ width: 22.5%; }
.single-post .post .entry-header,
.single-post .post .entry-content {
width: 66%;
float: left;
}
}
.single-post .entry-content img{
max-width: 100%;
height: auto;
}
.page, .post{text-align: left}
.post-sup-header{position: relative; width: 100%; height: 55px; padding: 55px 0 }
.back-to-category{font-size: 20px; font-weight: 800; text-decoration: none; text-transform: uppercase; color: #5d5d5d; cursor: pointer; padding: 17px 30px 16px 50px; border: 1px solid #cdcccc; position: absolute; background-repeat: no-repeat; background: url('data:image/svg+xml;utf8,'); background-position: 20px 20px; text-align: left;}
.back-to-category .category-name{color: black}
.page .entry-content, .post .entry-content, .archive .entry-content {text-align: justify;}
.page .search-submit, .page .search-field, .post .search-submit, .post .search-field, .archive .search-submit, .archive .search-field{position: absolute; height: 55px; z-index: 20; overflow: hidden; border: 1px solid #cdcccc; background-color: white; transition: 0.3s width}
.page .search-field, .post .search-field, .archive .search-field{right: 52px; padding: 0 15px}
.page .search-submit, .post .search-submit, .archive .search-submit{right: 0; width: 53px; top: 55px;}
.page .attachment-post-header-thumbnail, .post .attachment-post-header-thumbnail, .archive .attachment-post-header-thumbnail, .page .wp-post-image, .archive .wp-post-image{margin-bottom: 43px}
.page h1.entry-title, .post h1.entry-title, .archive h1.entry-title{font-family: 'Source Sans Pro', sans-serif; font-weight: bold; font-size: 36px; color: black; padding: 0; line-height: 1em}
.page .entry-meta, .page .entry-meta a, .post .entry-meta, .post .entry-meta a, .archive .entry-meta, .archive .entry-meta a{color: #525252; margin: 45px 0; text-transform: uppercase; text-decoration: none; transition: color 0.2s}
.page .entry-meta a:hover, .post .entry-meta a:hover, .archive .entry-meta a:hover{color: #111; transition: color 0.2s}
.page blockquote, .post blockquote {background: #f7f7f7; border-left: 6px solid #dcdcdc; margin: 1.5em 0 1.5em 55px; padding: 0.5em 37px 0.5em 37px; quotes: "\201C""\201D""\2018""\2019"; font-size: 22px; font-weight: 600}
.page blockquote:before, .post blockquote:before {color: #ccc; content: open-quote; font-size: 4em; line-height: 0.1em; margin-right: 0.25em; vertical-align: -0.4em; }
.page blockquote:after, .post blockquote:after {color: #ccc; content: close-quote; font-size: 4em; line-height: 0.1em; margin-left: 0.25em; vertical-align: -0.4em; }
.page blockquote p, .post blockquote p {display: inline; }
.page .entry-header, .page .entry-content, .single .entry-content{width: 100%; float: left}
.archive .entry-header, .archive .entry-content, .page-blog .entry-header, .page-blog .entry-content, .search .entry-header, .search .entry-content { width: 100%; float: none;}
.page-blog #main.content {
width: 100%;
}
.post .entry-header, .post .entry-content{width: 73%; float: left;}
.post .entry-sidebar{width: 18%; float: right;}
.page .entry-sidebar h2, .post .entry-sidebar h2{font-size: 26px; font-weight: 600; text-transform: uppercase; margin-bottom: 1.1em; padding: 0}
.page .entry-sidebar li, .post .entry-sidebar li{margin: 14px 0}
.page .entry-sidebar li a, .post .entry-sidebar li a{font-size: 15px; font-weight: 600; text-transform: uppercase; color: black; text-decoration: none; transition: color 0.2s}
.page .entry-sidebar li a:hover, .post .entry-sidebar li a:hover{color: #6D6E71; transition: color 0.2s}
.page .entry-footer, .post .entry-footer{margin: 55px 0}
.page .entry-footer a, .post .entry-footer a{font-size: 15px; font-weight: 600; text-transform: uppercase; color: black; text-decoration: none; transition: color 0.2s}
.page .entry-footer a:hover, .post .entry-footer a:hover{color: #6D6E71; transition: color 0.2s}
.page .cat-links, .page .tags-links, .post .cat-links, .post .tags-links{margin: 1.5em }
#blog-wrapper{padding: 25px 0 105px; background-color: #e7e7e7;}
#blog h2{background-color: #e7e7e7; top: 33px;}
#blog .h2-line{top: -91px;}
.blog-item-wrapper{width: 666px}
#blog #blog-left{float: left}
#blog #blog-right{float: right}
.blog-item{position: relative; width: 666px; height: 344px; background-image: url("images/blog-post.png"); background-size: 100%; color: white; font-size: 21px; line-height: 2em;}
.blog-item:hover{-webkit-filter: grayscale(100%); filter: grayscale(100%); filter: gray; filter: url("data:image/svg+xml;utf8,#greyscale"); }
.blog-item a img{width: 100%; height: 100%;}
.blog-item-top-wrapper{position: absolute; width: 100%; height: 35px; top: 0; text-align: center;}
.blog-item-top{width: 92%; position: relative; margin: 10px auto; }
.blog-item-top .icon, .blog-item-bottom .title{display: inline-block}
.blog-item-top .icon{float: left; position: relative; width: 27px; height: 51px; margin-top: 13px; background-image: url("images/sprite-sheet-global.png");background-size: 537px 500px; background-position: -231px -4px;}
.blog-item-top .title{color: white; float: right; text-transform: uppercase; margin-top: 4px; white-space: nowrap; overflow: hidden; width: 90%; text-align: left; font-weight: bold;}
.blog-item-bottom-wrapper{position: absolute; width: 100%; height: 35px; bottom: 10px; text-align: center; display: none}
.blog-item-bottom{width: 92%; position: relative; margin: 0 auto; border-top: 1px solid white; font-weight: bold; font-size: 17px;}
.blog-item-bottom .date, .blog-item-bottom .author{color: white; display: inline-block}
.blog-item-bottom .date{float: left}
.blog-item-bottom .author{float: right;}
.blog-item:hover .blog-item-bottom-wrapper{display: block}
.blog-thumbnail-shadow{position: absolute; width: 100%; height: 100%; top: 0; -webkit-box-shadow: 0 0 85px 65px rgba(0,0,0,0.6) inset; box-shadow: 0 0 85px 65px rgba(0,0,0,0.6) inset; }
/*------------------------------*\
dgd-social-icons styling
\*------------------------------*/
#post-social-icons{
position: absolute;
display: inline-block;
margin: -26px 0 0 20px;
}
.post-social-icon-wrapper {
position: relative;
float: left;
width: 40px;
height: 50px;
/*outline: 1px solid red;*/
text-align: center;
}
.post-social-icon-wrapper .counter{
color: #000;
position: relative;
margin: 0 auto 6px;
overflow: hidden;
white-space: nowrap;
font-size: 15px;
font-weight: bold;
}
.post-social-icon-wrapper.linked-in-wrapper a.icon{
background-position: 0px -20px
}
.post-social-icon-wrapper.facebook-wrapper a.icon{
background-position: -26px -20px
}
.post-social-icon-wrapper.twitter-wrapper a.icon{
background-position: -51px -20px
}
.post-social-icon-wrapper.googleplus-wrapper a.icon{
background-position: -77px -20px
}
.post-social-icon-wrapper a.icon{
/*outline: 1px solid blue;*/
position: relative;
margin: 0 auto;
bottom: 0;
display: block;
width: 25px;
height: 25px;
background-image: url("images/sprite-sheet-global.png");
background-size: 102px 95px;
transition: opacity 0.2s;
}
#post-social-icons:hover a.icon{
opacity: 0.7;
}
.post-social-icon-wrapper a.icon:hover{
opacity: 1 !important;
}
#jp-relatedposts .jp-relatedposts-items .jp-relatedposts-post .jp-relatedposts-post-title a{color: black; font-weight: bold !important; text-decoration: none;}
/*-------------------------------------------------------------------- contact --------------------------------------------------------------------*\
/*------------------------------*\
#header-map
\*------------------------------*/
#header-map{position: absolute; top: 0; width: 100%; z-index: 100}
#header-map .gm-style .gmnoprint .gmnoprint{opacity: 0.6; top: -9px !important}
.toggle-map{position: absolute;
top: 280px;
margin-left: -177px;
display: inline-block;
background-color: transparent;
width: 355px;
height: 71px;
padding: 0 23px;
font-size: 14px;
letter-spacing: 1px;
text-transform: uppercase;
color: white;
text-decoration: none;
line-height: 1.6em;
letter-spacing: 2px;
/*border-radius: 6px;*/
border: 1px solid white;
z-index: 99;
background-color: rgba(0, 0, 0, 0);
-webkit-transition:background-color 1s;
-moz-transition:background-color 1s;
transition:background-color 1s;
cursor: pointer}
.toggle-map.map-visible{background-color: rgba(0,25,40,0.8);
}
/*.toggle-map-span{display: none; top: 430px;}*/
/*------------------------------*\
#contact sidebar
\*------------------------------*/
.page-contact .sidebar-top{line-height: 1.6em !important; font: 200 22px 'Source Sans Pro', sans-serif;}
.page-contact .sidebar-bottom{font: 200 22px 'Source Sans Pro', sans-serif;}
/*-------------------------------------------------------------------- 404 --------------------------------------------------------------------*\*/
.error404 #header-wrapper{height: 76px !important;}
.page-thank-you #header-wrapper{height: 76px !important;}
.page-thank-you-subscriber #header-wrapper{height: 76px !important;}
.error404 .entry-content .content{padding-top: 50px;}
.page-thank-you .entry-content .content{padding-top: 50px;}
.page-thank-you-subscriber .entry-content .content{padding-top: 50px;}
.error404 .text-wrapper{position: absolute; right: 190px;}
.page-thank-you .text-wrapper{position: absolute; right: 5%; max-width: 50%;}
.page-thank-you-subscriber .text-wrapper{position: absolute; right: 5%; max-width: 50%;}
.error404 .bot-404{float: left; margin: 30px 60px 150px 150px}
.page-thank-you .bot-thanks{float: left; margin: 30px 60px 150px 150px}
.page-thank-you-subscriber .bot-thanks{float: left; margin: 30px 60px 150px 150px}
.error404 h1{font-size: 112px; text-align: left; padding-top: 1.3em;}
.page-thank-you h1{font-size: 112px; text-align: left; padding-top: 0.8em;}
.page-thank-you-subscriber h1{font-size: 112px; text-align: left; padding-top: 0.8em;}
.error404 p{font-size: 45px; text-align: left; padding-top: 0.7em;}
.page-thank-you p{font-size: 45px; text-align: left; padding-top: 0.7em; line-height: 1.2em;}
.page-thank-you-subscriber p{font-size: 45px; text-align: left; padding-top: 0.7em; line-height: 1.2em;}
/*--------------------------------------------------------------
# FAQ
--------------------------------------------------------------*/
.page-privacy-policy .content>p{
padding-bottom: 1em;
}
#faq-h1{
text-align: left;
/*font-size: 30px;*/
line-height: 0.83em;
/*font-weight: 300;*/
margin-top: 2.1em;
margin-bottom: 1.5em;
}
#faq-accordion{
position: relative;
float: left;
width: 100%;
text-align: left;
padding-bottom: 2em;
margin-top: 30px;
}
.accordion-title{
position: relative;
display: block;
width: 100%;
font-size: 26px;
background-color: #adaaab;
color: #fff;
/*height: 73px;*/
padding: 0.69em 4em 0.69em 1.42em;
box-sizing: border-box;
cursor: pointer;
transition: background-color 0.3s;
}
.accordion-title:after{
content: "";
position: absolute;
width: 0;
right: 1.5em;
height: 0;
top: 50%;
margin-top: -6px;
border-left: 11px solid transparent;
border-right: 11px solid transparent;
border-bottom: 11px solid white;
transition: transform 0.3s;
}
.accordion-title.active{
background-color: #000;
/*color: #fff;*/
}
.accordion-title.active:after{
transform: rotateX(180deg);
}
.accordion-text{
position: relative;
width: 100%;
box-sizing: border-box;
padding: 1em 1.68em;
font-size: 22px;
line-height: 1.5em;
/*height: 0;*/
/*color: #000;*/
transition: all 0.5s;
max-height: 0;
overflow: hidden;
}
.accordion-text div{
position: relative;
top: 2em;
transition: all 0.5s;
}
.accordion-title.active+.accordion-text{
/*height: auto;*/
max-height: 1800px;
}
.accordion-title.active+.accordion-text div{
top: 0;
}
#faq-side{
position: relative;
float: right;
width: 500px;
}
#faq-side-image{
width: 100%;
padding-bottom: 100%;
background-image: url('images/faq.jpg');
background-size: 100%;
}
.page-privacy-policy p{
font-size: 17px;
line-height: 35px;
text-align: justify;
}
@media screen and (max-width: 1100px){
.page-privacy-policy p{
line-height: 25px;
}
}
.accordion-title {
font: 300 30px 'Oswald', sans-serif;
}
@media screen and (max-width: 400px){
.accordion-title {
font-size: 18px;
}
}
/*------------------------------*\
DEVELOPING
\*------------------------------*/
/*------------------------------*\
RESPONSIVE
\*------------------------------*/
@media screen and (max-width: 1520px) {
.content{max-width: 1100px; padding: 0 10px}
#mainContent .checkbox-wrapper{width: 35%;}
#colophon .content{padding: 0;}
.dm-content-text{
margin: 0 3%;
}
.left-text-col{margin: 0 30px}
.icon-col a {margin: 0 20px;}
#blog-posts-wrapper{margin: 36px -23px 0 -23px;}
.blog-post{width: 335px; margin: 36px 23px 10px 23px;}
.blog-item-wrapper{width: 50%}
.blog-item{width: 520px; height: 269px; margin: -19px auto 0; font-size: 16px;}
.blog-item-top .icon{width: 22px; height: 39px; background-size: 322px 144px; background-position: -138px -2px;}
.wpcf7-list-item {margin-right: 0}
/*span.wpcf7-list-item {display: inline-block; width: 47%;}*/
.wm-content-block h2,
.wm-content-text {width: 49%; margin-right: 3%; }
.wm-content-icon {width: 44%; }
.error404 .bot-404{width: 35%; margin: 30px 3% 150px 3.5%}
.page-thank-you .bot-thanks{width: 35%; margin: 30px 3% 150px 3.5%}
.page-thank-you-subscriber .bot-thanks{width: 35%; margin: 30px 3% 150px 3.5%}
.error404 h1{font-size: 98px;}
.page-thank-you h1{font-size: 98px;}
.page-thank-you-subscriber h1{font-size: 98px;}
.error404 p{font-size: 39px;}
.page-thank-you p{font-size: 39px;}
.page-thank-you-subscriber p{font-size: 39px;}
.error404 .text-wrapper{ right: 10%;}
.page-thank-you .text-wrapper{ right: 10%;}
.page-thank-you-subscriber .text-wrapper{ right: 10%;}
}
@media screen and (max-width: 1190px) {
article.content.post{padding: 0 48px;}
.beta-base .bodyContainer td.body div.text div, .page-contact .entry-content label, .page-website-audit .entry-content label, .page-lets-chat .entry-content label{
margin-left: 0
}
}
@media screen and (max-width: 1150px) {
#blog-posts-wrapper{width: 765px; margin: 0 auto;}
.page-blog h1, .archive h1{width: 410px;}
#older-posts-list{left: 80px}
.page-blog #category-list, .archive #category-list, .page-blog .search-form, .archive .search-form{right: 80px;}
/* .page-contact article .entry-content{width: 730px;}
.page-contact #secondary.widget-area{width: 320px; font-size: 20px;}
.page-contact #secondary .icon {top: 8px; margin-right: 9px; } */
}
@media screen and (max-width: 1100px) {
/* .dm-content-block{height: 489px; }
.dm-content-block h2{font-size: 34px; padding: 2.6em 0 0.7em; margin: 0 55px 0 80px; }
.dm-content-text{margin: 0 80px; width: 47%;} */
.page.page-about-us p {
width: 60%;
}
.wm-content-text p,
.dm-content-text p{ line-height: 25px;}
.page-blog .entry-content, .archive .entry-content{width: 717px; float: none}
#blog-posts-wrapper {width: 764px; margin: 36px -23px 0 -23px;}
#older-posts-list{left: 0}
.page-blog #category-list, .archive #category-list, .page-blog .search-form, .archive .search-form{right: 0; }
#category-list .list-caption { width: 182px;}
.h-wrapper{top: 55px}
.page-blog h1, .archive h1 {width: 100%; padding: 0}
/*.text-col{width: 450px; margin: 70px auto 30px; position: relative; float: none; padding-left: 120px}
.icon-col{width: 655px; margin: 0 auto; position: relative; float: none;}
*/
.page-contact #secondary.widget-area{font-size: 20px;}
.page-contact #secondary .icon {top: 8px; margin-right: 9px; }
.page-contact .entry-content input,
/* .error404 .bot-404{width: 320px; margin: 80px 30px 150px 40px}
/* .page-thank-you .bot-thanks{width: 320px; margin: 80px 30px 150px 40px}
/* .page-thank-you-subscriber .bot-thanks{width: 320px; margin: 80px 30px 150px 40px}
.error404 h1{font-size: 82px;}
.page-thank-you h1{font-size: 82px;}
.page-thank-you-subscriber h1{font-size: 82px;}
.error404 p{font-size: 33px; padding-top: 30px;}
.page-thank-you p{font-size: 33px; padding-top: 30px;}
.page-thank-you-subscriber p{font-size: 33px; padding-top: 30px;}
*/
}
@media screen and (max-width: 1076px) {
.blog-item{width: 403px; height: 208px;}
.blog-item-top .icon {width: 15px; height: 31px; margin-top: 8px; background-size: 312px 140px; background-position: -135px -2px; }
.blog-item-bottom-wrapper{height: 35px; bottom: 0px;}
.blog-item-top, .blog-item-bottom{font-size: 13px;}
.blog-item-bottom{width: 96%; }
}
/* @media screen and (max-width: 1040px) {
.subnav-item{padding: 14px 32px 0}
.subnav-item-em{padding: 14px 30px 0;}
} */
@media screen and (max-width: 1020px) {
#header-wrapper{height: 347px; max-height: 100vh;}
#header-map{height: 347px; max-height: 100vh}
/*#header #header-text-wrapper{top: 31%;}*/
#header-text .second-line{font-size: 3.5em; padding-top: 0.5em; }
#header-text .third-line{line-height: 1.8em; margin: 0.5em auto 0; }
#header #scroll-down-arrow-wrapper{bottom: 6%;}
.toggle-map{ top: 250px;
width: 250px;
height: 55px;
margin-left: -125px;}
.toggle-map-span{top: 274px;}
.dm-content-block{padding-top: 82px; height: auto;}
.dm-content-block h2{padding: 0; width: 100%; text-align: center;}
.dm-content-block.left-block .dm-content-text,
.dm-content-block.right-block .dm-content-text{position: relative; width: 76%; margin: 0 12%; float: none; }
.dm-content-text p{text-align: center;}
.dm-content-icon{left: 0;
right: 0;
margin: 0 auto;
}
.dm-content-block h2, .dm-content-text{float: none;}
.dm-content-icon{padding-bottom: 38% !important;
height: 0 !important;
bottom: auto !important;
position: relative;
}
#str-block .dm-content-icon,
#seo-block .dm-content-icon,
#adw-block .dm-content-icon,
#cm-block .dm-content-icon,
#em-block .dm-content-icon,
#sm-block .dm-content-icon,
#cro-block .dm-content-icon,
#rt-block .dm-content-icon{
left: 0;
right: 0;
}
#adw-block .dm-content-icon, #sm-block .dm-content-icon {width: 65%;}
.wm-content-block{padding-top: 82px; height: auto;}
.wm-content-block h2{padding: 0; margin: 50px 0 27px; width: 100%; text-align: center;}
.wm-content-block .wm-content-text{width: 76%; margin: 0 12% 5%; float: none; }
.wm-content-text p{text-align: center;}
.wm-content-icon{position: relative;
height: 100%;
padding-bottom: 26.8%;
left: 0;
right: 0;
margin: 0 auto;
}
.wm-content-block .wm-content-text, .wm-content-block h2{float: none;}
.error404 h1{font-size: 88px;}
.page-thank-you h1{font-size: 88px;}
.page-thank-you-subscriber h1{font-size: 88px;}
.error404 p{font-size: 31px;}
.page-thank-you p{font-size: 31px;}
.page-thank-you-subscriber p{font-size: 31px;}
}
@media screen and (max-width: 960px) {
.page.page-about-us p{font-size: 35px; line-height: 39px;}
article.content.post{padding: 0 35px;}
}
@media screen and (max-width: 920px) {
.page-contact article .entry-content{width: 93%; margin: 0 3.5%; float: none;}
.page-contact #secondary.widget-area{display: none;}
.wm-content-icon{
width: 400px;
height: 273px;
padding-bottom: 0;
}
.page.page-about-us h2{font-size: 30px; margin: 35px auto 10px}
.page.page-about-us p{}
.page.page-about-us #scroll-down-arrow-wrapper{margin: 20px auto 40px;}
}
@media screen and (max-width: 850px) {
/*.subnav-wm-item{padding: 10px 30px 0}*/
/*.subnav-wm-item-cm{padding: 10px 20px 0}*/
.page blockquote, .post blockquote{font-size: 20px}
#seo-block .cloud2,
#seo-block .cloud4,
#em-block .cloud1,
#sm-block .cloud1{display: none; }
.error404 h1{font-size: 79px;}
.page-thank-you h1{font-size: 79px;}
.page-thank-you-subscriber h1{font-size: 79px;}
.error404 p{font-size: 25px;}
.page-thank-you p{font-size: 25px;}
.page-thank-you-subscriber p{font-size: 25px;}
}
@media screen and (max-width: 845px) {
.blog-item-wrapper{width: 100%}
#blog-right{margin-top: 76px;}
/*#subnav a.subnav-wm-item {padding: 14px 2% 9px; width: 20%;}*/
}
@media screen and (max-width: 770px) {
.subnav-item-seo, .subnav-item-sm{border-left-width: 0}
.subnav-item-em, .subnav-item-rt{border-right-width: 0}
.dm-content-block{padding-top: 30px;}
.wm-content-block h2,
.dm-content-block h2{font-size: 28px; }
.post .entry-header, .post .entry-content {
width: 100%;
float: none;
}
.post .entry-sidebar {
display: none;
}
.page.page-about-us p{font-size: 29px; line-height: 35px;}
article.content.post{padding: 0 30px;}
}
@media screen and (min-width: 741px) {
#subnav.fixed{position: fixed; top: 76px; width: 100%; background-color: white; left: 0; right: 0; }
/*#subnav.fixed a{padding-top: 0; padding-bottom: 0; height: 92px; }*/
/*#subnav.fixed a .subnav-icon{margin-top: 5px; }*/
.anchor{position: relative; top: -200px;}
#subnav{
position: absolute;
top: 0;
width: 100%;
}
#subnavplaceholder{position: relative; height: 96px; }
}
@media screen and (max-width: 740px) {
.page-blog .entry-content, .archive .entry-content{width: 484px;}
#blog-posts-wrapper {width: 484px; margin: 0}
.blog-post {margin: 47px auto 0; float: none;}
#category-list .list-caption{border-left-width: 0;}
.error404 .bot-404{margin-left: 0;}
.page-thank-you .bot-thanks{margin-left: 0;}
.page-thank-you-subscriber .bot-thanks{margin-left: 0;}
.error404 h1{font-size: 67px;}
.page-thank-you h1{font-size: 67px;}
.page-thank-you-subscriber h1{font-size: 67px;}
.error404 p{font-size: 24px;}
.page-thank-you p{font-size: 24px;}
.page-thank-you-subscriber p{font-size: 24px;}
#mainContent .inf-half {width: auto; display: block; }
}
@media screen and (max-width: 670px) {
/*#header-text .second-line{font-size: 2.7em; padding-top: 0.5em; }*/
/*.subnav-text{font-size: 0.75em !important;}*/
#header nav ul{width: 500px}
.page.page-about-us h2, .page.page-about-us p{padding: 0 0}
.page.page-about-us #header-text-wrapper {margin-top: 60px;}
.page.page-about-us #scroll-down-arrow-wrapper {margin: 15px auto 25px; }
.error404 h1{font-size: 58px;}
.page-thank-you h1{font-size: 58px;}
.page-thank-you-subscriber h1{font-size: 58px;}
#subnav a.subnav-dm-item{width: 26%}
.subnav-item{padding: 0 2% 0}
#subnav a.subnav-item-str{min-width: 106px;}
#adw-block .dm-content-icon, #sm-block .dm-content-icon {width: 75%;}
#mainContent .checkbox-wrapper{width: 40%;}
}
@media screen and (max-width: 650px) {
.beta-base .bodyContainer td.body div.text div,
.page-contact .entry-content label,
.page-website-audit .entry-content label,
.page-lets-chat .entry-content label {
margin-left: 10px
}
.page-contact .entry-content .float-left, .page-website-audit .entry-content .float-left, .page-lets-chat .entry-content .float-left,
.page-contact .entry-content .float-right, .page-website-audit .entry-content .float-right, .page-lets-chat .entry-content .float-right {
width: calc( 50% - 12px );
}
}
@media screen and (max-width: 550px) {
article.content.post{padding: 0 25px;}
#mainContent .checkbox-wrapper{width: 90%; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;}
}
@media screen and (max-width: 540px) {
#subnav a.subnav-wm-item {padding: 14px 2% 0; width: 40%;}
.error404 .text-wrapper{ right: 8%;}
.page-thank-you .text-wrapper{ right: 8%;}
.page-thank-you-subscriber .text-wrapper{ right: 8%;}
}
@media screen and (max-width: 520px) {
#header-text .first-line{font-size: 1.6em;}
#header-text .second-line{font-size: 2.7em;}
#header-text .third-line{font-size: 1em; line-height: 1.5em;}
.dm-content-block{padding-top: 10px;}
.wm-content-block h2,
/*.dm-content-block h2{font-size: 20px; margin:28px 10% 15px; width: 80%; line-height: 26px}*/
#menu-toggle, .main-navigation.toggled ul{right: 50px}
#header nav ul{width: 350px}
#header nav ul a{ line-height: 46px; padding-left: 38px}
#header nav .show-sub-menu div{margin: 12px 0 13px 5px}
#header .sub-menu a{height: 100%; line-height: 46px; padding-left: 56px}
.page-blog #main-wrapper, .archive #main-wrapper {padding-top: 0px; }
.page-blog .entry-content, .archive .entry-content, #blog-posts-wrapper, .h-wrapper {width: 335px; margin-left:auto; margin-right:auto;}
#older-posts-list, #category-list, .search-form{position: absolute; ; width: 100%;}
.page .search-submit, .post .search-submit{top: 0;}
.page-blog #older-posts-list,
.archive #older-posts-list,
.page-blog #category-list,
.archive #category-list,
.single #category-list,
.page-blog .search-form,
.archive .search-form,
.single .search-form
{
position: relative;
height: 56px;
display: block;
top: auto;
margin-top: 5px;
}
#older-posts-list .list-caption,
#category-list .list-caption{border: 1px solid #cdcccc; width: 255px;}
.page .search-submit{border-width: 0 0 0 1px;}
.page-blog .search-form{height: 53px;}
#category-list .list-wrapper{width: 238px}
.page-blog .search-form, .archive .search-form, .page-blog .search-form.toggled, .archive .search-form.toggled, #category-list .list-wrapper, #older-posts-list .list-wrapper{width: 100%; }
.page-blog .search-form .search-field, .archive .search-form .search-field{width: 85%;}
.h-wrapper {top: 20px; }
#category-list{z-index: 30;}
#older-posts-list{z-index: 40;}
.single .search-form{display: none; }
.posts-navigation .nav-previous{padding: 1px 20px 1px 35px;}
.posts-navigation .nav-next {padding: 1px 35px 1px 20px;}
.text-col{padding-left: 0; width: 370px;}
.left-text-col, .right-text-col{ margin: 0 15px}
.page blockquote, .post blockquote{font-size: 18px}
.page-contact .entry-content .float-left, .page-contact .entry-content .float-right,
.page-website-audit .entry-content .float-left, .page-lets-chat .entry-content .float-left, .page-website-audit .entry-content .float-right, .page-lets-chat .entry-content .float-right{width: 100%; float: none;}
.page-contact .entry-content .float-left input, .page-contact .entry-content .float-right input,
.page-website-audit .entry-content .float-left input, .page-lets-chat .entry-content .float-left input, .page-website-audit .entry-content .float-right input, .page-lets-chat .entry-content .float-right input{width: 100%; padding: 0 2%;}
span.wpcf7-list-item {width: 100%;}
.wm-content-icon{width: 80%; height: 0; padding-bottom: 48.7%; }
#em-block .cloud2{display: none; }
.page.page-about-us #main-wrapper main{
height: inherit;
min-height: inherit;
}
.page-contact .entry-content input,
.error404 .text-wrapper{ right: 4%;}
.page-thank-you .text-wrapper{ right: 4%;}
.page-thank-you-subscriber .text-wrapper{ right: 4%;}
.page-contact .entry-content .wpcf7-submit, .page-website-audit .entry-content .wpcf7-submit, .page-lets-chat .entry-content .wpcf7-submit, .infusion-submit button {
width: 100%;
}
.page-contact .entry-content input,
.error404 .text-wrapper {
right: 0;
}
}
@media screen and (max-width: 505px) {
.page-blog #older-posts-list {
margin-top: 32px
}
}
@media screen and (max-width: 500px) {
.page.page-about-us #header-text-wrapper{margin-bottom: 100px;}
.page.page-about-us p {
width: 67%;
}
.blog-item {width: 342px; height: 177px; }
.page .search-field, .post .search-field{width: 100%; padding-right: 53px; right: 0;}
.error404 .text-wrapper{ position: relative; right: inherit; text-align: center;}
.page-thank-you .text-wrapper{ position: relative; right: inherit; text-align: center; max-width: 80%; margin-left: 10%; }
.page-thank-you-subscriber .text-wrapper{ position: relative; right: inherit; text-align: center; max-width: 80%; margin-left: 10%; }
.error404 .bot-404{float: none; margin: 30px auto 75px; width: 194px;}
.page-thank-you .bot-thanks{float: none; margin: 30px auto 75px; width: 194px;}
.page-thank-you-subscriber .bot-thanks{float: none; margin: 30px auto 75px; width: 194px;}
.error404 h1{font-size: 50px; text-align: center; padding-top: 0;}
.page-thank-you h1{font-size: 50px; text-align: center; padding-top: 0;}
.page-thank-you-subscriber h1{font-size: 50px; text-align: center; padding-top: 0;}
.error404 p{font-size: 20px; text-align: center; padding-top: 0;}
.page-thank-you p{font-size: 20px; text-align: center; padding-top: 0;}
.page-thank-you-subscriber p{font-size: 20px; text-align: center; padding-top: 0;}
.page-thank-you .entry-content .content{text-align: center;}
.page-thank-you-subscriber .entry-content .content{text-align: center;}
}
@media screen and (max-width: 480px) {
article.content.post{padding: 0 21px;}
}
@media screen and (max-width: 450px) {
#post-social-icons{
margin: 0 0 -30px;
position: relative;
width: 100%;
}
}
@media screen and (max-width: 400px) {
#header-text .second-line{font-size: 2em;}
p,
.dm-content-text p,
.wm-content-text p{font-size: 17px}
#header-text .third-line
{line-height: 1.5em; font-size: 14px;
letter-spacing: 1px;}
#prev-page-button{left: 20px;}
#next-page-button{left: 70px;}
#header-wrapper{height: 174px}
#header-map{height: 174px;}
#header #header-text-wrapper {top: 15%;}
#header #header-text{margin-top: 15px; }
/*#header-text .second-line{margin-top: 13px; }*/
#header-text .third-line{display: none}
#header nav ul{width: 100%}
.left-text-col, .right-text-col{ float: left;}
.toggle-map, .toggle-map-span{top: 104px;}
.page.page-about-us h2 {font-size: 21px;}
}
@media screen and (max-width: 385px) {
#header-text .first-line{font-size: 1.4em; position: relative; top: 5px }
#header-text .second-line{font-size: 2.4em;}
}
@media screen and (max-width: 370px) {
.content{padding: 0;}
.blog-post {width: 304px;}
.page-blog .entry-content, .archive .entry-content, #blog-posts-wrapper, .h-wrapper {width: 320px; margin-left:auto; margin-right:auto;}
#older-posts-list .list-caption,
#category-list .list-caption{width: 238px;}
.page-blog .search-form{height: 53px; width: 318px;}
.post .entry-header, .post .entry-content {
width: 90%;
padding: 0 5%;
}
#header-text .second-line{font-size: 1.8em;}
.page.page-about-us p{font-size: 24px; line-height: 24px;}
.page.page-about-us p {
width: 75%;
}
}
@media screen and (max-width: 320px) {
#header-text .second-line{font-size: 1.7em;}
body{width: 320px}
#header nav{width: 320px}
/*.dm-content-block h2{font-size: 1.5em; padding: 0 0 0.3em;}*/
/*.subnav-text{padding: 3px 0 0 0}*/
.page-contact .entry-content .wpcf7-submit, .page-website-audit .entry-content .wpcf7-submit , .page-lets-chat .entry-content .wpcf7-submit {width: 274px;}
}
@media screen and (max-height: 360px) {
#header-text .third-line{display: none}
}
@media screen and (min-width: 600px) and (max-width: 920px) and (min-height: 1150px){
.page.page-about-us h2{font-size: 37px}
.page.page-about-us h2{margin: 50px auto 15px;}
.page.page-about-us p{font-size: 22px;}
}
/*------------------------------*\
#header images
\*------------------------------*/
.page-privacy-policy #header{background-image: url("images/header/web-mobile.jpg"); background-position: center;}
/*.page-digital-marketing #header, .parent-page-digital-marketing #header{background-image: url("images/header/digital-marketing2-2500.jpg"); background-position: center top;}*/
.page-blog #header, .parent-page-blog #header, .archive #header, .single-post #header{background-image: url("images/header/blog.jpg"); background-position: right bottom;}
.page-contact #header, .parent-page-contact #header, .page-website-audit #header, .page-lets-chat #header, .page-lets-chat #header, .parent-page-website-audit #header{background-image: url("images/header/contact.jpg"); background-position: left center;}
/*.page.page-about-us #main-wrapper{background-image: url("images/header/about-us.jpg")}*/
@media screen and (max-width: 1024px) {
/*.page.page-about-us #video-wrapper{background-image: url("images/header/about-us-1040.jpg");}*/
/*.page.page-about-us #video-wrapper video{display: none;}*/
}
@media screen and (max-width: 1020px) {
.page-privacy-policy #header{background-image: url("images/header/web-mobile-1040.jpg")}
/*.page-digital-marketing #header, .parent-page-digital-marketing #header{background-image: url("images/header/digital-marketing2-1040.jpg")}*/
.page-blog #header, .parent-page-blog #header, .archive #header, .single-post #header{background-image: url("images/header/blog-1040.jpg")}
.page-contact #header, .parent-page-contact #header, .page-website-audit #header, .page-lets-chat #header, .page-lets-chat #header, .parent-page-website-audit #header{background-image: url("images/header/contact-1040.jpg");}
}
@media screen and (max-width: 520px) {
.page-privacy-policy #header{background-image: url("images/header/web-mobile-540.jpg")}
/*.page-digital-marketing #header, .parent-page-digital-marketing #header{background-image: url("images/header/digital-marketing2-540.jpg")}*/
.page-blog #header, .parent-page-blog #header, .archive #header, .single-post #header{background-image: url("images/header/blog-540.jpg")}
.page-contact #header, .parent-page-contact #header, .page-website-audit #header, .page-lets-chat #header, .page-lets-chat #header, .parent-page-website-audit #header{background-image: url("images/header/contact-540.jpg");}
/*.page.page-about-us #video-wrapper{background-image: url("images/header/about-us-540.jpg");}*/
}
@media screen and (max-width: 400px) {
.page-privacy-policy #header{background-image: url("images/header/web-mobile-400.jpg")}
/*.page-digital-marketing #header, .parent-page-digital-marketing #header{background-image: url("images/header/digital-marketing2-400.jpg")}*/
.page-blog #header, .parent-page-blog #header, .archive #header, .single-post #header{background-image: url("images/header/blog-400.jpg")}
.page-contact #header, .parent-page-contact #header, .page-website-audit #header, .page-lets-chat #header, .page-lets-chat #header, .parent-page-website-audit #header{background-image: url("images/header/contact-400.jpg");}
/*.page.page-about-us #video-wrapper{background-image: url("images/header/about-us-400.jpg");}*/
}
/*------------------------------*\
RETINA IMAGES
\*------------------------------*/
@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi){ /* 1.5 dpr */
#nav-man{background-image: url("images/sprite-sheet-global-2x.png");}
#scroll-down-arrow{background-image: url("images/sprite-sheet-global-2x.png");}
footer .icon{background-image: url("images/sprite-sheet-global-2x.png");}
.icon-col a{background-image: url("images/sprite-sheet-global-2x.png");}
.subnav-dm-item .subnav-icon{background-image: url("images/sprite-sheet-dm-2x.png");}
.subnav-wm-item .subnav-icon{background-image: url("images/sprite-sheet-wm-2x.png");}
#web-block .wm-content-icon{background-image: url("images/wm/web-2x.png"); }
#mob-block .wm-content-icon{background-image: url("images/wm/mob-2x.png"); }
#eco-block .wm-content-icon{background-image: url("images/wm/eco-2x.png"); }
#con-block .wm-content-icon{background-image: url("images/wm/con-2x.png"); }
.blog-thumbnail{background-image: url("images/blog-post-2x.png");}
.blog-thumbnail .icon{background-image: url("images/DAMNGOOD-logo-w-2x.png");}
.blog-item{background-image: url("images/blog-post-2x.png");}
.blog-item-top .icon{background-image: url("images/sprite-sheet-global-2x.png");}
.icon-col a{background-image: url("images/sprite-sheet-global-2x.png"); }
}
@media (-webkit-min-device-pixel-ratio: 2.5), (min-resolution: 240dpi){ /* 2.5 dpr */
#nav-man{background-image: url("images/sprite-sheet-global-3x.png");}
#scroll-down-arrow{background-image: url("images/sprite-sheet-global-3x.png");}
footer .icon{background-image: url("images/sprite-sheet-global-3x.png");}
.icon-col a{background-image: url("images/sprite-sheet-global-3x.png");}
.subnav-dm-item .subnav-icon{background-image: url("images/sprite-sheet-dm-3x.png");}
.subnav-wm-item .subnav-icon{background-image: url("images/sprite-sheet-wm-3x.png");}
#web-block .wm-content-icon{background-image: url("images/wm/web-3x.png"); }
#mob-block .wm-content-icon{background-image: url("images/wm/mob-3x.png"); }
#eco-block .wm-content-icon{background-image: url("images/wm/eco-3x.png"); }
#con-block .wm-content-icon{background-image: url("images/wm/con-3x.png"); }
.blog-thumbnail{background-image: url("images/blog-post-3x.png");}
.blog-thumbnail .icon{background-image: url("images/DAMNGOOD-logo-w-3x.png");}
.blog-item{background-image: url("images/blog-post-3x.png");}
.blog-item-top .icon{background-image: url("images/sprite-sheet-global-3x.png");}
.icon-col a{background-image: url("images/sprite-sheet-global-3x.png"); }
}
/*Blog Post*/
.blog-intro {font-size: 20px; line-height: 35px; color: #525252;}
.intro-italic { font-style: oblique;}
.single-post .entry-content{
font-size: 17px !important;
letter-spacing: 0.5px;
line-height: 28px;
}
.single-post .entry-content p,
.p1 {
padding-bottom: .5em !important;
color: #2f2f2f;
}
.blog-para-indent{padding-left: 5%;}
.heading-purple {color: #903CE2;
}
@media screen and (max-width: 1020px){
.entry-title {font-size: 33px !important;}
.blog-intro {font-size: 18px; line-height: 31px; color:}
.single-post .entry-content{
font-size: 16px !important;
letter-spacing: 0.5px;
line-height: 27px;
}
.single-post .entry-content p,
.p1 {
padding-bottom: .4em !important ;
}
}
@media screen and (max-width: 960px){
.entry-title {font-size: 28px !important;}
.blog-intro {font-size: 17px; line-height: 29px; color:}
.single-post .entry-content{
letter-spacing: 0.5px;
line-height: 26px;
}
.single-post .entry-content p,
.p1 {
padding-bottom: .4em !important ;
}
}
/*------------------------------*\
#Subscribe form
\*------------------------------*/
#blog-subscribe h3{
font-size: 1.1em;
/*font-weight: bold;*/
margin-top: 2.5em;
/*margin-bottom: 1em;*/
}
#blog-subscribe input[type=text],
#blog-subscribe input[type=email]{
width: 96%;
border: 2px solid #a0a0a0;
border-radius: 3px;
padding: 0 2%;
/*font-size: 21px;*/
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
line-height: 38px;
height: 38px;
margin-top: 12px!important;
text-align: left;
}
#blog-subscribe .wpcf7-form-control-wrap.email input{
margin-bottom: 12px;
}
#blog-subscribe label[for=policy-acceptance] span{
font-size: 15px;
line-height: 1.2em;
}
#blog-subscribe .wpcf7-acceptance .wpcf7-list-item{
margin-left: 0;
}
#blog-subscribe input[type=checkbox] {
display: inline-block;
outline: none !important;
}
#blog-subscribe input[type=checkbox]:focus:before{
border-color: black;
}
/*#blog-subscribe input[type=checkbox]~label{
display: block;
margin-top: 8px;
position: relative;
}
#blog-subscribe input[type=checkbox]~label span{
position: relative;
display: block;
left: 30px;
width: 75%;
width: calc( 96% - 30px );;
top: -21px;
line-height: 1.3em;
text-align: justify;
margin-bottom: -50px;
}*/
#blog-subscribe input[type=checkbox]:before{
content: "";
display: inline-block;
width: 18px;
height: 18px;
position: relative;
border: 2px solid #a0a0a0;
border-radius: 3px;
margin: -2px 4px 0px -4px;
vertical-align: text-top;
line-height: 25px;
color: #1e4c54;
font-size: 30px;
text-align: center;
}
#blog-subscribe input[type=checkbox]:checked:before{
border: 2px solid #a0a0a0;
background-color: #9f23c4;
}
#blog-subscribe .wpcf7-submit:disabled {
background-color: #aeacac;
}
#blog-subscribe .wpcf7-submit {
width: 96%;
height: 40px;
line-height: 40em;
font: 300 20px 'Oswald', sans-serif;
display: inline-block;
background-color: #913ce2;
padding: 0 33px;
margin: 20px 0 0 0;
color: white;
text-decoration: none;
letter-spacing: 0.04em;
border-width: 0;
border-radius: 6px;
transition: background-color 0.1s;
}
#blog-subscribe .wpcf7-response-output{
margin: 0;
width: 96%;
box-sizing: border-box;
font-size: 1.1em;
line-height: 1.1em;
padding: 0.6em 1em;
border-radius: 6px;
}
/*------------------------------*\
#developing
\*------------------------------*/
/*#header nav ul {opacity: 0.8}*/
/*#subnav a{background-color: #555;}*/
/*#subnavplaceholder{background-color: red}*/
/*.content{outline: 1px solid green}*/
.comments-area.content{
text-align: left;
}
.comments-title{
font-size: 28px;
font-weight: normal;
text-transform: none;
margin-bottom: 1em;
}
#comments-count{
position: relative;
top: -0.7em;
display: inline-block;
background-color: #54E8CC;
color: #207163;
border-radius: 15px;
line-height: 15px;
padding: 2px 7px;
text-align: center;
font-size: 14px;
}
.comment-body{
position: relative;
border: 1px solid #DBE3E3;
margin-bottom: 30px;
margin: 35px 0px;
padding: 20px;
text-align: left;
}
.children .comment{
margin-left: 40px;
}
.children .comment-body:before{
content: "";
z-index: 1;
position: absolute;
height: 30px;
width: 30px;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
background-color: #fff;
margin-top: -16px;
margin-left: -16px;
border-width: 1px;
border-style: solid;
border-color: inherit;
top: 0;
left: 50%;
border-right-width: 0;
border-bottom-width: 0;
overflow: hidden;
left: 60px;
}
.comment-meta{
position: absolute;
width: calc( 100% - 40px );
}
.comment-meta .fn{
position: absolute;
top: 0;
left: 90px;
color: #4DBDEB;
font-size: 16px;
font-weight: bold;
z-index: 1;
}
.comment-metadata a{
position: absolute;
/*width: 100%;*/
text-align: right;
top: 0;
box-sizing: border-box;
right: 0;
color: #5D6769;
text-decoration: none;
z-index: 1;
/*outline: 1px solid red;*/
}
.comment-metadata a:hover{
text-decoration: underline;
}
.comment-author.vcard .avatar{
border-radius: 50%;
}
.comment-awaiting-moderation{
position: absolute;
top: 17px;
left: 90px;
font-style: italic;
color: #aaa;
font-size: 14px;
}
.comment-content{
position: relative;
padding-top: 40px;
padding-left: 90px;
padding-bottom: 50px;
text-align: justify;
}
.reply{
position: absolute;
width: 100px;
bottom: 30px;
left: 50%;
margin-left: -50px;
text-align: center;
/*outline: 1px solid red;*/
}
.reply a{
color: #aaa;
}
.reply svg{
position: absolute;
left: 0;
top: -4px;
}
.comment-respond #reply-title{
display: none;
}
#commentform{
text-align: left;
padding-bottom: 50px;
}
#commentform .comment-notes{
margin-left: 20px;
color: #888;
}
#commentform label{
/*position: absolute;*/
display: none;
}
#commentform textarea,
#commentform input:not(#submit){
width: 100%;
/*outline: 4px solid red;*/
position: relative;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
overflow: auto;
outline: none;
white-space: normal;
border: 1px solid #eee;
padding: 0 20px;
margin: 0 0 10px ;
}
#commentform input:not(#submit){
max-width: 300px;
}
#commentform input[required]{
content: "*";
outline: 5px solid red !important
display: block !important;
}
#commentform textarea{
padding: 20px;
min-height: 80px;
margin: 0 !important;
/*font-family: Arial, Helvetica, Verdana, Tahoma, sans-serif !important;*/
/*font-size: 14px;*/
/*line-height: 1.6em;*/
}
#commentform #submit{
display: inline-block;
background-color: #913ce2;
width: 300px;
height: 35px;
padding: 0 33px;
margin: 0;
color: white;
text-decoration: none;
letter-spacing: 0.04em;
border-width: 0;
border-radius: 6px;
transition: background-color 0.1s;
font: 300 20px 'Oswald', sans-serif;
cursor: pointer;
}
/***************************************************************************************************************/
/***************************************************************************************************************/
/******************************************** REDESIGN *****************************************************/
/***************************************************************************************************************/
/***************************************************************************************************************/
.content-1820 {
position: relative;
margin: auto;
max-width: 1820px;
min-width: 320px;
position: relative;
margin: auto;
width: calc(100% - 200px);
max-width: 1820px;
}
.content {
width: calc(100% - 200px);
}
h2,
h4,
h5{
font-family: "GTSectra", serif;
font-weight: normal;
font-size: 40px;
}
.purple-block h1,
h3{
font-family: "GTSectra", serif;
font-weight: normal;
font-size: 76px;
}
.intro {
font-family: 'muli-light', sans-serif;
font-size: 22px;
}
p {
font-family: 'muli-light', sans-serif;
font-size: 20px;
line-height: 1.5em;
letter-spacing: 0.2px;
}
.dm-content-block a {
font-family: 'muli-light', sans-serif;
font-size: 13px;
color: #ff07f8;
text-decoration: none;
}
/*h4 {
font-family: "GTSectra", serif;
font-weight: normal;
font-size: 36px;
}*/
h6 {
font-family: "GTSectra", serif;
font-weight: normal;
font-size: 71px;
}
.intro{
margin: 42px auto 0;
padding-bottom: 0;
width: 80%;
max-width: 1115px;
line-height: 1.8em;
}
.page-digital-marketing .second-block{
background-color: #000;
color: #fff;
position: relative;
padding-top: 170px;
/*height: 750px;*/
/*width: 1803px;*/
}
.page-digital-marketing .second-block .content-wide{
height: 100%;
}
.page-digital-marketing .second-block .line{
position: absolute;
right: 0;
top: 0;
display: block;
width: 1px;
height: 100%;
background-color: #9e22c0;
}
.page-digital-marketing .second-block .h-line{
display: none;
}
.dm-content-block{
position: relative;
width: 25%;
float: left;
box-sizing: border-box;
padding: 170px 40px 130px;
text-align: center;
}
.dm-content-block h2,
.dm-content-block h4 {
letter-spacing: -1px;
font-weight: 300;
padding-bottom: 0;
margin-bottom: 1em;
line-height: 1.3em;
}
.dm-content-block a{
display: block;
text-transform: uppercase;
margin-top: 40px;
}
.arrow-purple {
background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='utf-8'?%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;' xml:space='preserve'%3E%3Cpath d='M505.4,273.2c0.1-0.1,0.2-0.3,0.3-0.4c0.2-0.2,0.3-0.4,0.5-0.6c0.1-0.2,0.3-0.4,0.4-0.6c0.1-0.1,0.2-0.3,0.3-0.4 c0.2-0.2,0.3-0.4,0.4-0.6c0.1-0.1,0.2-0.3,0.3-0.4c0.1-0.2,0.3-0.4,0.4-0.7c0.1-0.1,0.2-0.3,0.2-0.4c0.1-0.2,0.3-0.4,0.4-0.7 c0.1-0.1,0.2-0.3,0.2-0.4c0.1-0.2,0.2-0.4,0.3-0.6c0.1-0.2,0.2-0.3,0.2-0.5c0.1-0.2,0.2-0.4,0.3-0.6c0.1-0.2,0.2-0.4,0.2-0.6 c0.1-0.2,0.1-0.4,0.2-0.5c0.1-0.2,0.2-0.4,0.2-0.7c0.1-0.2,0.1-0.3,0.2-0.5c0.1-0.2,0.2-0.5,0.2-0.7c0-0.1,0.1-0.3,0.1-0.4 c0.1-0.3,0.1-0.5,0.2-0.8c0-0.1,0.1-0.3,0.1-0.4c0.1-0.3,0.1-0.6,0.2-0.8c0-0.1,0-0.3,0.1-0.4c0.1-0.3,0.1-0.6,0.1-0.8 c0-0.2,0-0.3,0.1-0.5c0-0.3,0.1-0.5,0.1-0.8c0-0.2,0-0.4,0-0.6c0-0.2,0-0.4,0-0.6c0-0.4,0-0.8,0-1.2c0,0,0-0.1,0-0.1 c0,0,0-0.1,0-0.1c0-0.4,0-0.8,0-1.2c0-0.2,0-0.4,0-0.6c0-0.2,0-0.4,0-0.6c0-0.3-0.1-0.5-0.1-0.8c0-0.2,0-0.3-0.1-0.5 c0-0.3-0.1-0.5-0.1-0.8c0-0.1,0-0.3-0.1-0.4c-0.1-0.3-0.1-0.6-0.2-0.8c0-0.1-0.1-0.3-0.1-0.4c-0.1-0.3-0.1-0.5-0.2-0.8 c0-0.1-0.1-0.3-0.1-0.4c-0.1-0.2-0.2-0.5-0.2-0.7c-0.1-0.2-0.1-0.3-0.2-0.5c-0.1-0.2-0.2-0.4-0.2-0.6c-0.1-0.2-0.1-0.4-0.2-0.5 c-0.1-0.2-0.2-0.4-0.2-0.6c-0.1-0.2-0.2-0.4-0.3-0.6c-0.1-0.2-0.2-0.3-0.2-0.5c-0.1-0.2-0.2-0.4-0.3-0.7c-0.1-0.1-0.2-0.3-0.2-0.4 c-0.1-0.2-0.3-0.5-0.4-0.7c-0.1-0.1-0.2-0.2-0.2-0.4c-0.1-0.2-0.3-0.5-0.4-0.7c-0.1-0.1-0.2-0.2-0.2-0.4c-0.2-0.2-0.3-0.4-0.5-0.7 c-0.1-0.1-0.2-0.3-0.3-0.4c-0.2-0.2-0.3-0.4-0.5-0.6c-0.1-0.2-0.3-0.3-0.4-0.5c-0.1-0.2-0.3-0.3-0.4-0.5c-0.3-0.3-0.6-0.6-0.9-0.9 l0,0L402.1,135.5c-10-10-26.2-10-36.2,0c-10,10-10,26.2,0,36.2l58.7,58.7h-399C11.5,230.4,0,241.9,0,256c0,14.1,11.5,25.6,25.6,25.6 h399l-58.7,58.7c-10,10-10,26.2,0,36.2c10,10,26.2,10,36.2,0l102.4-102.4C504.8,273.8,505.1,273.5,505.4,273.2z' stroke='%23ff07f8' fill='%23ff07f8'/%3E%3C/svg%3E");
}
.dm-content-block a .arrow{
position: relative;
left: -1em;
top: 0.2em;
height: 16px;
width: 1px;
display: inline-block;
transition: left 0.3s, width 0.3s;
background-size: 100% 100%;
}
.dm-content-block a:hover .arrow{
left: -5px;
width: 16px;
}
.page-web-design .second-block .icon,
.page-digital-marketing .second-block .icon{
position: relative;
width: 56px;
height: 55px;
background-image: url("images/new-sprite-sheet.png");
background-size: 360px 660px;
background-repeat: no-repeat;
background-position-y: -2px;
margin: 0 auto 20px;
}
.dm-content-block.google .icon{
background-position-x: -33px;
}
.dm-content-block.seo .icon{
background-position-x: -93px;
}
.dm-content-block.social .icon{
background-position-x: -153px;
}
.dm-content-block.email .icon{
background-position-x: -219px;
width: 72px;
}
.dm-content-block.resp-design .icon,
.dm-content-block.custom-dev .icon,
.dm-content-block.wordpress .icon,
.dm-content-block.ecommerce .icon{
background-position-y: -150px;
width: 80px;
height: 60px;
}
.dm-content-block.resp-design .icon{
background-position-x: -34px;
}
.dm-content-block.custom-dev .icon{
background-position-x: -125px;
}
.dm-content-block.wordpress .icon{
background-position-x: -209px;
width: 61px;
}
.dm-content-block.ecommerce .icon{
background-position-x: -270px;
width: 60px;
}
.grey-text {
color: #afafaf;
display: block;
}
.new-block-left-wrapper {
background-color: #000;
color: #fff;
text-align: left;
padding-top: 160px;
padding-bottom: 135px;
}
.new-block-left-wrapper .content-text {
position: relative;
width: 42%;
text-align: justify;
z-index: 10;
}
.new-block-left-wrapper h3 {
margin-bottom: 30px;
line-height: 1.07em;
width: 100%;
letter-spacing: -0.03em;
box-sizing: border-box;
text-align: center;
}
.new-block-left-wrapper h4 {
margin-bottom: 35px;
text-align: center;
}
.new-block-left-wrapper h3 .white-text {
margin-left: -3.8em;
display: inline-block;
}
html:not(.no-js) h3 .white-text[data-aos=fade-right] {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
html:not(.no-js) h3 .grey-text[data-aos=fade-left] {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
html:not(.no-js) h4[data-aos=fade-up] {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
.new-block-left-wrapper p {
padding-bottom: 35px;
line-height: 1.55em;
text-align: center;
}
.new-block-left-wrapper .content-image-wrapper .image {
position: absolute;
background-size: contain;
top: 0;
background-repeat: no-repeat;
}
.new-block-left-wrapper .content-image-wrapper .image.woman,
.new-block-left-wrapper .content-image-wrapper .image.arrow-target {
margin-right: 0;
transition: margin 0.4s ease 0s, transform 0.4s ease 0s, opacity 0.4s ease 0s;
}
.new-block-left-wrapper .content-image-wrapper:hover .image.woman {
margin-right: 10px;
margin-left: -10px;
}
.new-block-left-wrapper .content-image-wrapper:hover .image.arrow-target {
margin-right: -10px;
margin-left: 10px;
}
.new-block-left-wrapper .image.face {
/*background-image: url( "images/dm/ai-face.jpg" );*/
background-image: url( "images/dm/face/digital-marketing-face.jpg" );
background-position: 65% center;
width: 55%;
height: 100%;
right: 0;
top: -70px;
padding-bottom: 0;
/*position: relative;*/
}
.new-block-left-wrapper .image.face .streak{
position: absolute;
width: 8%;
height: 30px;
background-size: contain;
background-repeat: no-repeat;
}
.new-block-left-wrapper .image.face .streak-a{
background-image: url( "images/dm/face/streak1.png" );
}
.new-block-left-wrapper .image.face .streak-b{
background-image: url( "images/dm/face/streak2.png" );
}
.new-block-left-wrapper .image.face .streak-c{
background-image: url( "images/dm/face/streak3.png" );
}
.new-block-left-wrapper .image.face .streak-1{
left: 25%;
width: 6%;
top: 1%;
}
.new-block-left-wrapper .image.face .streak-2{
left: 70%;
width: 4%;
top: 1%;
}
.new-block-left-wrapper .image.face .streak-3{
left: 40%;
width: 4%;
top: 10%;
}
.new-block-left-wrapper .image.face .streak-4{
left: 67%;
width: 5%;
top: 17%;
}
.new-block-left-wrapper .image.face .streak-5{
left: 41%;
width: 6%;
top: 21%;
}
.new-block-left-wrapper .image.face .streak-6{
left: 13%;
width: 4%;
top: 29%;
}
.new-block-left-wrapper .image.face .streak-7{
left: 25%;
width: 5%;
top: 37%;
}
.new-block-left-wrapper .image.face .streak-8{ /**/
left: 67%;
width: 6%;
top: 30%;
}
.new-block-left-wrapper .image.face .streak-9{ /**/
left: 74%;
width: 4%;
top: 53%;
}
.new-block-left-wrapper .image.face .streak-10{
left: 26%;
width: 7%;
top: 50%;
}
.new-block-left-wrapper .image.face .streak-11{
left: 33%;
width: 9%;
top: 60%;
}
.new-block-left-wrapper .image.face .streak-12{
left: 5%;
width: 5%;
top: 64%;
}
.new-block-left-wrapper .image.face .streak-13{
left: 35%;
width: 5%;
top: 77%;
}
.new-block-left-wrapper .image.face .streak-14{
left: 23%;
width: 5%;
top: 82%;
}
.new-block-left-wrapper .image.face .streak-15{
left: 0%;
width: 4%;
top: 77%;
}
.new-block-left-wrapper .image.face .streak-16{
left: 25%;
width: 4%;
bottom: -20px;
}
.new-block-left-wrapper .image.face .streak-17{
left: 75%;
width: 4%;
bottom: -20px;
}
.new-block-left-wrapper .button-link {
position: relative;
left: 0;
right: 0;
margin: 190px auto 0;
font-size: 14px;
}
.new-block-left-wrapper .button-link .arrow {
position: relative;
font-size: 2.5em;
left: -5px;
top: -4px;
line-height: 1em;
font-size: 0px;
transition: left 0.3s, font-size 0.3s, top 0.3s;
}
.new-block-left-wrapper .button-link:hover .arrow {
left: 3px;
font-size: 2.5em;
top: 0;
}
.page-digital-marketing .page {
margin-top: -55px;
}
.page-digital-marketing .quote-block.black-block{
padding-top: 0;
padding-bottom: 0;
}
.page-digital-marketing .quote-block h3{
color: #e5e5e5;
}
.page-digital-marketing .quote-block h3 .darker{
color: #888;
}
.page-digital-marketing .black-block {
padding-bottom: 50px;
}
.page-digital-marketing .black-block h6 {
margin-bottom: 88px;
}
.page-digital-marketing .black-block h5 {
color: #afafaf;
display: inline-block;
margin: 0 1em;
transition: color 0.3s;
cursor: pointer;
}
.page-digital-marketing .black-block h5:first-child {
margin-left: 0;
}
.page-digital-marketing .black-block h5:last-child {
margin-right: 0;
}
.page-digital-marketing .black-block h5:hover,
.page-digital-marketing .black-block h5.active {
color: #fff;
}
.page-digital-marketing .black-block{
position: relative;
padding-bottom: 266px;
}
.digital-strategy .bg {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
/*width: 120%;
left: -20%;*/
background-repeat: no-repeat;
background-position: bottom center;
}
.digital-strategy .bg.board {
background-size: 100% auto;
background-image: url( "images/dm/chess-board.jpg" );
}
.digital-strategy .bg.piece {
background-size: 11.66% auto;
background-position: 26.2% 100%;
background-image: url( "images/dm/king-piece.png" );
}
.digital-strategy .texts {
position: relative;
z-index: 10;
width: 63.67%;
margin-left: auto;
padding-right: 100px;
padding-right: calc( 50vw - 910px );
box-sizing: border-box;
}
.page-digital-marketing .black-block .ds-paragraph {
max-width: 820px;
margin: 40px auto 20px;
opacity: 0;
display: none;
}
.page-digital-marketing .black-block .ds-paragraph p ~ p{
margin-top: 1em;
}
.page-digital-marketing .black-block .button-link {
margin: 50px auto;
}
.page-digital-marketing .black-block .ds-paragraph.active {
opacity: 1;
display: block;
}
.page-digital-marketing .black-block .ds-paragraph.active {
min-height: 240px;
}
.page-digital-marketing .entry-content,
.page-digital-marketing .entry-content > div{
background-color: #000;
}
/*.page-digital-marketing .entry-content,
.page-digital-marketing #design-wrapper,
.page-digital-marketing .second-block,
.page-digital-marketing .quote-block {
background-color: #e3e3e3;
color: #1a1a1a;
}
*/
/*------------------------------*\
Google Ads, Seo, Social media
\*------------------------------*/
.parent-page-digital-marketing .first-section{
-webkit-background-size: cover;
background-size: cover;
background-position: center;
background-color: #c423a5;
background-repeat: no-repeat;
}
.page-pay-per-click-management .first-section{
background-size: contain;
background-position: right bottom;
background-repeat: no-repeat;
}
.parent-page-digital-marketing .first-section .content{
width: 945px;
margin-left: 16.5%;
}
.parent-page-digital-marketing .first-section h2{
font-size: 37px;
line-height: 1.57em;
}
.parent-page-digital-marketing .first-section h1{
font-size: 55px;
}
.parent-page-digital-marketing .first-section .intro{
font-size: 20px;
line-height: 1.6em;
}
.page-pay-per-click-management .first-section {
background-image: url("images/DGD_google-ads-bg.jpg");
}
.page-seo .first-section{
background-image: url("images/DGD_SEO-header-bg.jpg");
background-position: left top;
background-color: #2b292c;
}
.page-ai-search .entry-content {
overflow: hidden;
}
.page-ai-search .first-section{
background-image: url("images/DGD_AI-Search-header-bg.jpg");
background-position: center top;
background-color: #2b292c;
}
.page-social-media .first-section{
background-image: url("images/DGD_Social-header-bg.jpg");
background-position: right top;
background-color: #26acb8;
}
.page-email-marketing .first-section{
background-image: url("images/DGD_Email-header-bg.jpg");
background-position: right top;
background-color: #c423a5;
}
.parent-page-digital-marketing .second-section{
background-color: #000;
color: #fff;
}
.parent-page-digital-marketing .second-section .content-1820{
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
-ms-align-items: stretch;
align-items: stretch;
}
.parent-page-digital-marketing .dm-content-block{
flex-grow: 1;
flex-shrink: 1;
flex-basis: 25%;
width: 25%;
text-align: center;
padding: 0 35px 60px !important;
margin-bottom: 70px;
}
.parent-page-digital-marketing .dm-content-block h2{
padding-right: 0;
padding-left: 0;
line-height: 1.3em;
}
.parent-page-digital-marketing .first .dm-content-block{
border-bottom: 3px solid #9f23c4;
}
.parent-page-digital-marketing .dm-content-block.heading-block{
align-self: center;
border-bottom: none;
}
.parent-page-digital-marketing .dm-content-block.heading-block .icon{
position: relative;
width: 68px;
height: 68px;
background-image: url("images/new-sprite-sheet.png");
background-size: 360px 660px;
background-repeat: no-repeat;
background-position: -221px -71px;
margin: 0 auto 15px;
}
.parent-page-digital-marketing .dm-content-block.heading-block.second .icon{
background-position: -146px -71px;
}
.parent-page-digital-marketing .button-link{
margin: 0 auto;
}
.parent-page-digital-marketing .google-section {
background-color: #9f23c3;
}
.parent-page-digital-marketing .google-section .content-image-wrapper{
position: relative;
width: 49%;
float: left;
}
.parent-page-digital-marketing .google-section .content-image-wrapper.bottom{
display: none;
}
.parent-page-digital-marketing .google-section .image{
position: relative;
background-size: contain;
width: 100%;
padding-bottom: 63.3%;
background-position: center;
max-width: 600px;
margin: 0 auto;
}
.page-pay-per-click-management .google-section .image{
background-image: url("images/ppc-screen.jpg");
}
.page-seo .google-section .image,
.page-ai-search .google-section .image {
background-image: url("images/seo-ads-screen.jpg");
}
.page-social-media .google-section .image{
background-image: url("images/social-media-screen.jpg");
}
.page-email-marketing .google-section .image{
background-image: url("images/email-illustration.jpg");
max-width: 500px;
}
.parent-page-digital-marketing .google-section .content-text{
float: right;
width: 51%;
}
.parent-page-digital-marketing .google-section h3{
margin-bottom: 0.3em;
}
.parent-page-digital-marketing .google-section p {
width: 550px;
max-width: 100%;
margin: 0 auto;
}
.parent-page-digital-marketing .google-section .arrow-list {
width: 40%;
float: left;
margin-left: 45px;
margin-top: 10px;
}
.parent-page-digital-marketing .google-section .arrow-list.right {
float: right;
margin-right: 40px;
}
.parent-page-digital-marketing .process-section h6 {
margin-bottom: 1em;
}
.parent-page-digital-marketing .process-section p {
max-width: 80%;
width: 800px;
margin: 0 auto;
}
.ads-cycle-wrapper,
.seo-cycle-wrapper,
.social-media-cycle-wrapper,
.email-marketing-cycle-wrapper {
position: relative;
width: 843px;
height: 843px;
margin: 185px auto 140px;
}
.ads-cycle-wrapper .image,
.seo-cycle-wrapper .image,
.social-media-cycle-wrapper .image,
.email-marketing-cycle-wrapper .image{
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
background-image: url("images/ppc-cycle.jpg");
background-repeat: no-repeat;
-webkit-background-size: contain;
background-size: contain;
}
.seo-cycle-wrapper .image{
background-image: url("images/seo-cycle.jpg");
}
.social-media-cycle-wrapper .image{
background-image: url("images/social-media-cycle.jpg");
}
.email-marketing-cycle-wrapper .image{
background-image: url("images/email-cycle.jpg");
}
.ads-cycle-wrapper .label,
.seo-cycle-wrapper .label,
.social-media-cycle-wrapper .label,
.email-marketing-cycle-wrapper .label{
position: absolute;
z-index: 1;
font-size: 25px;
line-height: 1.5em;
white-space: nowrap;
width: auto;
}
.ads-cycle-wrapper .center ,
.seo-cycle-wrapper .center ,
.social-media-cycle-wrapper .center,
.email-marketing-cycle-wrapper .center {
position: absolute;
z-index: 1;
font-family: "GTSectra", serif;
font-size: 40px;
width: 100%;
height: 1em;
top: 50%;
margin-top: -0.5em;
vertical-align: middle;
}
.email-marketing-cycle-wrapper .center,
.social-media-cycle-wrapper .center {
margin-top: -1em;
}
.ads-cycle-wrapper .label-right,
.seo-cycle-wrapper .label-right,
.social-media-cycle-wrapper .label-right,
.email-marketing-cycle-wrapper .label-right {
left: 100%;
top: calc( 50% - 1.5em );
text-align: left;
margin-left: 0.7em;
}
.ads-cycle-wrapper .label-left,
.seo-cycle-wrapper .label-left,
.social-media-cycle-wrapper .label-left,
.email-marketing-cycle-wrapper .label-left {
right: 100%;
top: calc( 50% - 1.5em );
text-align: right;
margin-right: 0.7em;
}
.ads-cycle-wrapper .label-top,
.seo-cycle-wrapper .label-top,
.social-media-cycle-wrapper .label-top,
.email-marketing-cycle-wrapper .label-top{
width: 100%;
text-align: center;
top: -2.5em;
}
.ads-cycle-wrapper .label-bottom,
.seo-cycle-wrapper .label-bottom,
.social-media-cycle-wrapper .label-bottom,
.email-marketing-cycle-wrapper .label-bottom{
width: 100%;
text-align: center;
bottom: -2em;
}
.seo-cycle-wrapper .label-bottom{
bottom: -3em;
}
.page-seo .ads-cycle-wrapper .label-bottom,
.seoe-seo .ads-cycle-wrapper .label-bottom{
bottom: -3.5em;
}
ul.arrow-list{
margin-left: 0;
}
ul.arrow-list li{
text-align: left;
font-size: 20px;
line-height: 1.3em;
margin: 0.85em 0 0.85em 40px;
font-family: 'muli-light', sans-serif;
}
ul.arrow-list > li:before{
content: "";
position: absolute;
width: 30px;
height: 1.3em;
display: block;
left: -40px;
top: 0.1em;
background-color: transparent;
background-image: url("images/new-sprite-sheet.png");
background-size: 360px 660px;
background-repeat: no-repeat;
background-position: -30px -92px;
border-radius: 0;
}
/*------------------------------*\
Web design
\*------------------------------*/
html {
/*scroll-behavior: smooth;*/
}
#video-wrapper {
z-index: 1;
}
.page-template-page-video #main{
position: relative;
z-index: 2;
}
.page-template-page-video #header-wrapper {
position: absolute;
}
.page-template-page-video #video-wrapper {
margin-top: 76px;
}
.page-template-page-video #main .entry-content{
z-index: 2;
}
.page-template-page-video #header-text-wrapper{
position: relative;
z-index: 1100;
}
.page-template-page-video #header-text{
height: calc(100vh - 76px);
display : flex;
align-items : center;
text-align: center;
}
.page-template-page-video #header-text-wrapper .first-line{
font-size: 100px;
line-height: 128px;
color: #fff;
text-shadow: none;
font-weight: 300;
font-family: "GT Sectra", serif;
text-align: center;
opacity: 0.53;
top: 0;
width: 100%;
padding-top: 0;
}
#header-video{
position: absolute;
min-width: 100%;
min-height: 100%;
top: -9999px;
bottom: -9999px;
left: -9999px;
right: -9999px;
margin: auto;
position: fixed;
z-index: 2;
}
#header-video-image {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-size: cover;
background-position: center;
z-index: 1;
}
.page-web-design #header-video-image {
background-image: url( 'videos/web-design-rocket.jpg' );
}
.page-web-design .entry-content,
.page-web-design #design-wrapper,
.page-web-design .second-block,
.page-web-design .quote-block,
.webhosting-block {
background-color: #e3e3e3;
color: #1a1a1a;
}
.page-web-design #design-wrapper h3 {
text-align: center;
line-height: 1.2em;
}
.page-web-design #design-wrapper h3 .grey-text {
color: #737373;
left: -150px;
position: relative;
}
.page-web-design #design-wrapper h4 {
font-size: 40px;
letter-spacing: 0px;
line-height: 1.3em;
color: #737373;
font-weight: 300;
text-align: center;
}
.page-web-design .quote-block,
.page-digital-marketing .quote-block.black-block {
margin-top: 70px;
padding-bottom: 0 !important;
padding-top: 100px;
}
.quote-block {
text-align: left;
}
.page-digital-marketing .dm-content-block,
.page-web-design .dm-content-block{
padding-top: 10px;
}
.quote-block h3 {
letter-spacing: -0.03em;
line-height: 1.2em;
font-weight: 300;
font-family: "GTSectra";
color: #3b3a3a;
opacity: 0.63;
}
.quote-block h3 .darker {
color: #121212;
}
#design-wrapper,
#reach-wrapper {
background-color: #000;
color: #fff;
text-align: left;
padding-top: 150px;
padding-bottom: 26px;
}
#design-wrapper .content-text {
position: relative;
width: 42%;
text-align: justify;
z-index: 10;
}
#design-wrapper h2 {
margin-bottom: 30px;
line-height: 1.07em;
width: 100%;
letter-spacing: -0.03em;
box-sizing: border-box;
}
#design-wrapper h4 {
margin-bottom: 35px;
}
#design-wrapper h2 .white-text {
margin-left: -3.8em;
display: inline-block;
}
html:not(.no-js) h2 .white-text[data-aos=fade-right] {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
html:not(.no-js) h2 .grey-text[data-aos=fade-left] {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
html:not(.no-js) h4[data-aos=fade-up] {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
#design-wrapper p {
padding-bottom: 35px;
line-height: 1.55em;
text-align: center;
}
#design-wrapper .phone {
position: absolute;
background-size: 100%;
top: 0;
background-repeat: no-repeat;
}
#design-wrapper .content-image-wrapper .phone-1 {
margin-right: 0;
transition: margin 0.4s ease 0s, transform 0.4s ease 0s, opacity 0.4s ease 0s;
}
#design-wrapper .content-image-wrapper:hover .phone-1 {
margin-right: 10px;
}
#design-wrapper .content-image-wrapper .phone-2 {
margin-right: 0;
transition: margin 0.4s ease 0s, transform 0.4s ease 0.05s, opacity 0.4s ease 0.05s;
}
#design-wrapper .content-image-wrapper:hover .phone-2 {
margin-right: 0;
}
#design-wrapper .content-image-wrapper .phone-3 {
margin-right: 0;
transition: margin 0.4s ease 0s, transform 0.4s ease 0.1s, opacity 0.4s ease 0.1s;
}
#design-wrapper .content-image-wrapper:hover .phone-3 {
margin-right: -10px;
}
#design-wrapper .phone-1 {
background-image: url( "images/home/mobile-phones-2.png" );
width: 16.26%;
padding-bottom: 32.5%;
right: 24.18%;
}
#design-wrapper .phone-2 {
background-image: url( "images/home/mobile-phones-3.png" );
width: 15.44%;
padding-bottom: 31.2%;
right: 15.93%;
top: 16px;
}
#design-wrapper .phone-3 {
background-image: url( "images/home/mobile-phones-1.png" );
width: 14.67%;
padding-bottom: 29.2%;
right: 6.87%;
top: 32px;
}
#design-wrapper .button-link {
position: relative;
left: 0;
right: 0;
margin: 190px auto 0;
font-size: 14px;
}
#design-wrapper .button-link .arrow {
position: relative;
font-size: 2.5em;
left: -5px;
top: -4px;
line-height: 1em;
font-size: 0px;
transition: left 0.3s, font-size 0.3s, top 0.3s;
}
#design-wrapper .button-link:hover .arrow {
left: 3px;
font-size: 2.5em;
top: 0;
}
.webhosting-block {
position: relative;
background-color: #000;
color: #fff;
text-align: center;
padding-top: 11%;
padding-bottom: 7%;
overflow-x: hidden;
}
.webhosting-block .center {
position: relative;
z-index: 10;
}
.webhosting-block h3{
line-height: 1.2em;
color: #aaa;
margin-bottom: 0.65em;
}
.webhosting-block h3 .grey-text{
color: #444;
}
.webhosting-block p {
color: #b1b1b1;
font-size: 1.7em;
line-height: 1.9em;
margin-bottom: 2em;
}
.webhosting-block .button-link {
/*margin-top: 150px;*/
margin-top: 10vw;
}
.hosting-bg {
position: absolute;
left: 0;
height: 90%;
top: 5%;
width: 35%;
background-repeat: no-repeat;
background-position: right top;
background-image: url( "images/hosting-left.jpg" );
}
.hosting-bg.right-bg {
transform: scaleX(-1);
left: auto;
right: 0;
transform: translate3d(100px,0,0) scaleX(-1) !important;
}
.hosting-bg.right-bg.aos-animate {
transform: translate3d(0,0,0) scaleX(-1) !important;
}
/* Contact page */
.page-contact #main{
background-color: #000;
color: #fff;
font-family: 'Source Sans Pro', sans-serif;
padding-top: 62px;
padding-bottom: 1px;
}
.page-contact .dgd-icon{
left: 5px;
}
.page-contact h3{
font-size: 35px;
padding-left: 43px;
padding-top: 5px;
padding-bottom: 1em;
}
.page-contact p{
font-size: 18px;
margin-bottom: 6px;
}
.page-contact h5{
font-family: 'Source Sans Pro', sans-serif;
font-size: 22px;
display: inline-block;
margin: 28px 30px 10px 0;
float: left;
}
.page-contact .interests-left,
.page-contact .interests-right{
float: left;
margin-top: 18px;
margin-right: 24px;
}
.page-contact .interests-left .interest,
.page-contact .interests-right .interest{
display: block;
}
.page-contact .interest label{
margin: 10px 0 4px 3px
}
/***************************************************************************************************************/
/* REDESIGN - RESPONSIVENESS */
/***************************************************************************************************************/
@media screen and (max-width:2300px) {
.hosting-bg {
width: 40%;
}
.page-digital-marketing .black-block{
position: relative;
padding-bottom: 150px;
}
.page-pay-per-click-management .first-section{
background-position: 270px bottom;
}
.page-social-media .first-section{
background-position: right -250px top;
background-size: auto 100%;
}
.page-email-marketing .first-section{
background-position: right -280px top;
}
}
@media screen and (max-width:2020px) {
.digital-strategy .texts {
padding-right: 100px;
}
}
@media screen and (max-width:2005px) {
.new-block-left-wrapper .content-text,
#design-wrapper .content-text {
width: 50%;
}
.digital-strategy .bg.board {
background-size: 120% auto;
}
.digital-strategy .bg.piece {
background-size: 14% auto;
background-position: 21% 100%;
}
}
@media screen and (max-width:1920px) {
.hosting-bg {
background-position: right bottom;
width: 40%;
background-size: 1000px;
}
}
@media screen and (max-width:1900px) {
.page-social-media .first-section{
background-position: right -400px top;
/*
background-image: url("images/DGD_Social-header-bg.jpg");
background-color: #26acb8;
background-size: auto 100%;
*/
}
}
@media screen and (max-width:1800px) {
.new-block-left {
width: calc(100% - 200px);
}
.new-block-left-wrapper h3 {
margin-bottom: 18px;
}
.new-block-left-wrapper h4 {
margin-bottom: 28px;
}
ul.arrow-list li{
font-size: 18px;
margin-left: 36px;
}
ul.arrow-list > li:before{
width: 27px;
left: -36px;
background-size: 324px 594px;
background-position: -27px -83px;
}
.page-seo .first-section {
background-position: center top;
background-size: auto 130%;
}
.page-pay-per-click-management .first-section {
background-position: center top;
}
.page-social-media .first-section{
background-position: left top;
}
.parent-page-digital-marketing .first-section .content{
margin-left: 3.5%;
margin-top: -21px;
}
.parent-page-digital-marketing .google-section .arrow-list {
margin-left: 30px;
}
#design {
width: calc(100% - 200px);
}
#design-wrapper h2 {
margin-bottom: 18px;
}
#design-wrapper h4 {
margin-bottom: 28px;
}
.page-pay-per-click-management .first-section{
background-position: 150px bottom;
}
}
@media screen and (max-width:1745px) {
#design-wrapper,
#reach-wrapper {
padding-bottom: 40px;
}
#design-wrapper .phone {
margin-top: 10px;
}
}
@media screen and (max-width:1700px) {
.page-digital-marketing .black-block h5 {
margin: 0 0.5em;
}
}
@media screen and (max-width:1630px) {
.hosting-bg {
background-position: right center;
width: 37%;
background-size: 800px;
}
.webhosting-block .center {
width: 500px;
margin: 0 auto;
}
.webhosting-block .center br{
display: none;
}
}
@media screen and (max-width:1600px) {
.parent-page-digital-marketing .first-section .content{
width: 810px;
}
.page-social-media .first-section{
background-position: 40% bottom;
}
}
@media screen and (max-width:1500px) {
h2,
h5 {
font-size: 36px;
}
.purple-block h1,
h3 {
font-size: 65px;
}
.intro {
font-size: 20px;
}
p {
font-size: 18px;
}
h4 {
font-size: 32px;
}
h6 {
font-size: 55px;
}
.button-link {
font-size: 13px;
}
.new-block-left-wrapper .button-link,
.button-link {
font-size: 13px;
}
.new-block-left-wrapper .content-text {
width: 45%;
}
.new-block-left-wrapper .button-link {
margin-top: 145px;
}
.page-pay-per-click-management .google-section .content-image-wrapper,
.page-social-media .google-section .content-image-wrapper {
margin-top: 40px;
}
.black-block,
.purple-block,
.white-block,
.dm-content-block{
padding: 160px 0 150px;
}
.page-digital-marketing .black-block {
padding-bottom: 115px;
}
.page-digital-marketing .intro,
.parent-page-digital-marketing .intro {
max-width: calc( 100% - 200px );
}
.dm-content-block {
width: 50%;
padding: 140px 60px 120px;
transition-delay: 0.2s !important;
}
.dm-content-block.seo,
.dm-content-block.email {
transition-delay: 0.6s !important;
}
.page-digital-marketing .dm-content-block {
/*height: 610px;*/
}
.page-digital-marketing .second-block .h-line{
position: absolute;
bottom: 0;
display: block;
width: 150%;
left: -25%;
height: 1px;
background-color: #9e22c0;
}
.page-digital-marketing .second-block .social .h-line,
.page-digital-marketing .second-block .seo .line{
display: none;
}
.page-digital-marketing .second-block{
overflow: hidden;
}
.page-digital-marketing .second-block .icon {
margin-bottom: 20px;
}
.digital-strategy .bg.board {
background-size: 2250px auto;
background-position-x: 0px;
}
.digital-strategy .bg.piece {
background-size: 262.5px auto;
background-position: 200px 100%;
}
.dm-content-block:nth-child(odd) {
padding-left: 0;
padding-right: 30px;
clear: left;
}
.dm-content-block:nth-child(even) {
padding-left: 10px;
padding-right: 0;
}
.page-digital-marketing .black-block h6 {
margin-bottom: 66px;
}
.new-block-left-wrapper .image.woman {
width: calc( 18.8% * 1.4 );
padding-bottom: calc( 29% * 1.4 );
right: calc( 28% * 0.9 );
top: 20px;
/*top: 35px;*/
}
.new-block-left-wrapper .image.arrow-target {
width: calc( 20.5% * 1.4 );
padding-bottom: calc( 20.5% * 1.4 );
/*right: calc( 8.8% * 0 );*/
right: 0;
top: 0;
}
.page-web-design #design-wrapper h3 .grey-text {
left: -20%;
}
#design-wrapper .button-link, .button-link {
font-size: 13px;
}
#design-wrapper .phone-1 {
width: calc(296% / 15);
right: calc(440% / 16);
padding-bottom: calc(600% / 15);
}
#design-wrapper .phone-2 {
width: calc(281% / 15);
right: calc(290% / 18);
padding-bottom: calc(570% / 15);
}
#design-wrapper .phone-3 {
width: calc(267% / 15);
right: calc(125% / 20);
padding-bottom: calc(540% / 15);
}
#design-wrapper .content-text {
width: 45%;
}
#design-wrapper .button-link {
margin-top: 145px;
}
}
@media screen and (max-width:1450px) {
.page-email-marketing .first-section{
background-position: 30% bottom;
background-size: auto 80%;
}
}
@media screen and (max-width:1400px) {
.page-digital-marketing .black-block h5 {
font-size: 32px;
}
.page-web-design .quote-block,
.page-digital-marketing .quote-block.black-block {
padding-top: 40px;
}
}
@media screen and (max-width:1350px) {
.ads-cycle-wrapper ,
.seo-cycle-wrapper ,
.social-media-cycle-wrapper ,
.email-marketing-cycle-wrapper {
width: 60%;
height: 0;
margin: 140px auto 120px;
padding-bottom: 60%;
}
.ads-cycle-wrapper .center ,
.seo-cycle-wrapper .center ,
.social-media-cycle-wrapper .center ,
.email-marketing-cycle-wrapper .center {
font-size: 30px;
}
.ads-cycle-wrapper .label ,
.seo-cycle-wrapper .label ,
.social-media-cycle-wrapper .label ,
.email-marketing-cycle-wrapper .label {
font-size: 22px;
}
.hosting-bg {
/*background-position: right center;*/
width: 41%;
background-size: 800px;
}
.webhosting-block .center {
width: 450px;
}
}
@media screen and (max-width:1300px) {
.parent-page-digital-marketing .first-section .content{
width: 770px;
margin-left: 0;
}
}
@media screen and (max-width:1270px) {
.hosting-bg.right-bg {
display: none;
}
.webhosting-block p {
font-size: 1.5em;
}
.hosting-bg {
width: calc( 100% - 420px );
background-size: 900px;
}
.webhosting-block .center {
margin-right: 5%;
width: 450px;
}
}
@media screen and (max-width:1250px) {
.parent-page-digital-marketing .google-section .arrow-list.left,
.parent-page-digital-marketing .google-section .arrow-list.right {
width: 80%;
margin: 0 10%;
float: none;
}
.parent-page-digital-marketing .second-section .content-1820 {
-webkit-flex-wrap: wrap;
-moz-flex-wrap: wrap;
-ms-flex-wrap: wrap;
-o-flex-wrap: wrap;
flex-wrap: wrap;
}
.parent-page-digital-marketing .google-section .content-text.first {
float: none;
width: 100%;
}
.parent-page-digital-marketing .dm-content-block{
flex-basis: 33.333%;
width: 33.333%;
text-align: center;
padding: 0 3% 60px !important;
margin-bottom: 70px;
}
.parent-page-digital-marketing .dm-content-block.heading-block{
flex-basis: 100%;
width: 100%;
padding-bottom: 0 !important;
margin-bottom: 0;
}
.page-digital-marketing .second-block .icon{
width: 50px;
height: 50px;
background-size: 324px 594px;
background-position-y: -2px;
margin: 0 auto 32px;
}
.page-digital-marketing .black-block {
padding-bottom: 75px;
}
.digital-strategy .bg.board {
background-size: 2000px auto;
background-position-x: -100px;
}
.digital-strategy .bg.piece {
background-size: 233px auto;
background-position: 78px 100%;
}
.page-digital-marketing .black-block h5 {
font-size: 25px;
}
.dm-content-block.google .icon{
background-position-x: -30px;
}
.dm-content-block.seo .icon{
background-position-x: -84px;
}
.dm-content-block.social .icon{
background-position-x: -138px;
}
.dm-content-block.email .icon{
background-position-x: -197px;
width: 65px;
}
.page-web-design .second-block .icon{
background-size: 327px 600px;
}
.dm-content-block.resp-design .icon,
.dm-content-block.custom-dev .icon,
.dm-content-block.wordpress .icon,
.dm-content-block.ecommerce .icon{
background-position-y: -136px;
width: 73px;
height: 55px;
}
.dm-content-block.resp-design .icon{
background-position-x: -31px;
}
.dm-content-block.custom-dev .icon{
background-position-x: -114px;
}
.dm-content-block.wordpress .icon{
background-position-x: -190px;
width: 55px;
}
.dm-content-block.ecommerce .icon{
background-position-x: -245px;
width: 55px;
}
.webhosting-block .center {
font-size: 0.8em;
}
.page-social-media .first-section{
background-size: auto 80%;
}
}
@media screen and (max-width:1200px) {
#design-wrapper .phone {
margin-top: 50px;
}
.page-web-design .quote-block,
.page-digital-marketing .quote-block.black-block {
padding-top: 30px;
}
.page-web-design .second-block,
.page-digital-marketing .second-block {
padding-top: 88px;
}
#design-wrapper,
#reach-wrapper {
padding-top: 137px;
}
.page-web-design .quote-block,
.page-digital-marketing .quote-block.black-block {
margin-top: 37px;
}
.quote-block h3 {
font-size: 55px;
}
.page-web-design .second-block .icon,
.page-digital-marketing .second-block .icon {
margin-bottom: 20px;
}
.dm-content-block h2,
.dm-content-block h4 {
margin-bottom: 0.9em;
}
.page-web-design .dm-content-block{
padding-bottom: 20px;
padding-top: 40px;
}
.page-digital-marketing .second-block .button-link,
.page-web-design .second-block .button-link {
margin-top: 120px;
}
.page-digital-marketing .dm-content-block {
padding-bottom: 20px;
padding-top: 40px
}
}
@media screen and (max-width:1230px) and (min-width: 921px),
screen and (max-width:750px){
.page-contact h5 {
display: block;
margin-bottom: 0;
float: none;
}
.interests-wrapper {
margin-bottom: 30px
}
}
@media screen and (max-width:1100px) {
.content-1820,
.content {
width: calc(100% - 120px);
}
.digital-strategy .texts {
padding-right: 60px;
}
h2,
h5 {
font-size: 32px;
}
.purple-block h1,
h3 {
font-size: 58px;
}
.intro {
font-size: 18px;
}
p {
font-size: 17px;
}
h4 {
font-size: 28px;
}
.button-link {
font-size: 12px
line-height: 57px;
width: 256px;
height: 57px
}
.new-block-left-wrapper .button-link,
.button-link {
font-size: 12px;
}
.new-block-left-wrapper {
padding-top: 140px;
}
.new-block-left {
width: calc(100% - 120px);
}
.new-block-left-wrapper .content-text {
width: 50%;
}
.new-block-left-wrapper .image {
/*width: calc(296% / 12.9);
padding-bottom: calc(600% / 12.9);
right: calc(440% / 19);*/
}
.button-link {
line-height: 57px;
width: 256px;
height: 57px;
}
.new-block-left-wrapper .button-link {
margin-top: 66px;
}
.black-block,
.purple-block,
.white-block,
.dm-content-block{
padding: 140px 0 130px;
}
/* .page-digital-marketing .dm-content-block {
padding-top: 140px;
padding-bottom: 120px;
}
*/
.page-digital-marketing .black-block {
padding-bottom: 95px;
}
.page-digital-marketing .second-block .icon{
width: 45px;
height: 44px;
background-size: 288px 528px;
background-position-y: -2px;
margin-bottom: 14px;
}
.dm-content-block.google .icon{
background-position-x: -26px;
}
.dm-content-block.seo .icon{
background-position-x: -74px;
}
.dm-content-block.social .icon{
background-position-x: -122px;
}
.dm-content-block.email .icon{
background-position-x: -175px;
width: 58px;
}
.page-web-design .second-block .icon{
background-size: 300px 550px;
}
.dm-content-block.resp-design .icon,
.dm-content-block.custom-dev .icon,
.dm-content-block.wordpress .icon,
.dm-content-block.ecommerce .icon{
background-position-y: -125px;
width: 67px;
height: 50px;
}
.dm-content-block.resp-design .icon{
background-position-x: -28px;
}
.dm-content-block.custom-dev .icon{
background-position-x: -104px;
}
.dm-content-block.wordpress .icon{
background-position-x: -174px;
width: 51px;
}
.dm-content-block.ecommerce .icon{
background-position-x: -225px;
width: 50px;
}
.page-digital-marketing .dm-content-block {
/*height: 570px;*/
}
.dm-content-block a {
margin-top: 30px;
}
.page-web-design #design-wrapper h3 .grey-text {
text-align: left;
left: -1%;
}
#design-wrapper .button-link, .button-link {
font-size: 12px;
}
#design-wrapper,
#reach-wrapper {
padding-top: 140px;
}
#design {
width: calc(100% - 120px);
}
#design-wrapper .content-text {
width: 50%;
}
#design-wrapper .phone-1 {
width: calc(296% / 12.9);
padding-bottom: calc(600% / 12.9);
right: calc(440% / 19);
}
#design-wrapper .phone-2 {
width: calc(281% / 12.9);
padding-bottom: calc(570% / 12.9);
right: calc(290% / 26);
top: 8px;
}
#design-wrapper .phone-3 {
width: calc(267% / 12.9);
padding-bottom: calc(540% / 12.9);
right: 0;
top: 20px;
}
.button-link {
line-height: 57px;
width: 256px;
height: 57px;
}
#design-wrapper .button-link {
margin-top: 66px;
}
.page-pay-per-click-management .first-section {
background-image: url("images/DGD_google-ads-bg-1100.jpg");
}
.page-seo .first-section {
background-image: url("images/DGD_SEO-header-bg-1100.jpg");
background-size: cover;
padding-bottom: 195px;
}
.page-social-media .first-section {
background-image: url("images/DGD_Social-header-bg-1100.jpg");
background-position: right bottom;
}
.page-email-marketing .first-section{
background-image: url("images/DGD_Email-header-bg-1100.jpg");
background-position: right -80px bottom;
}
.parent-page-digital-marketing .first-section .content{
width: 600px;
margin-top: -46px;
margin-left: 3.5%;
}
.parent-page-digital-marketing .first-section h2{
font-size: 32px;
}
.parent-page-digital-marketing .first-section h1{
font-size: 48px;
}
.parent-page-digital-marketing .first-section .intro{
font-size: 18px;
max-width: 100%;
width: 82%;
}
.page-web-design .second-block .icon,
.page-digital-marketing .second-block .icon{
margin: 0 auto 10px;
}
}
@media screen and (max-width:1020px) {
.page-template-page-video #header-text-wrapper .first-line{
font-size: 81px;
line-height: 104px;
}
.page-pay-per-click-management .first-section{
background-position: right -180px bottom -70px;
}
}
@media screen and (max-width:1010px) {
.hosting-bg {
width: calc( 100% - 340px );
background-size: 880px;
}
.webhosting-block .center {
width: 380px;
}
}
@media screen and (max-width:1000px) {
.page-social-media .first-section{
background-position: right -40% bottom;
}
}
@media screen and (max-width:1000px) and (min-width:921px) {
.interests-left,
.interests-right {
float: none;
width: 100%;
}
.interests-right {
margin-top: 0 !important;
}
}
@media screen and (max-width:959px) {
.content-1820,
.content {
width: calc(100% - 100px);
}
.page-digital-marketing .black-block h5 {
min-width: 34%;
margin: 0;
padding: 0 0.8em;
line-height: 1.6em;
box-sizing: border-box;
}
.page-digital-marketing .black-block h5:nth-child(odd) {
text-align: right;
}
.page-digital-marketing .black-block h5:nth-child(even) {
text-align: left;
}
h2,
h5 {
font-size: 30px;
}
.purple-block h1,
h3 {
font-size: 52px;
}
.intro {
font-size: 17px;
}
p {
font-size: 16px;
}
h4 {
font-size: 27px;
}
h6 {
font-size: 49px;
}
.button-link {
font-size: 11px;
}
.new-block-left-wrapper .button-link,
.button-link {
font-size: 11px;
}
.new-block-left-wrapper {
padding-top: 106px;
}
.new-block-left-wrapper .image {
/*top: 34px;*/
}
.new-block-left-wrapper p {
padding-bottom: 25px;
}
.black-block,
.purple-block,
.white-block,
.dm-content-block{
padding: 120px 0 110px;
}
.page-digital-marketing .intro,
.parent-page-digital-marketing .intro,
.page-digital-marketing .black-block .ds-paragraph{
max-width: calc( 100% - 100px );
}
.page-digital-marketing .black-block .ds-paragraph{
max-width: calc( 100% - 50px );
}
.page-digital-marketing .second-block .icon{
width: 39px;
height: 39px;
background-size: 252px 462px;
background-position-y: -1px;
}
.dm-content-block.google .icon{
background-position-x: -23px;
}
.dm-content-block.seo .icon{
background-position-x: -65px;
}
.dm-content-block.social .icon{
background-position-x: -107px;
}
.dm-content-block.email .icon{
background-position-x: -153px;
width: 50px;
}
.page-web-design .second-block .icon{
background-size: 257px 471px;
}
.dm-content-block.resp-design .icon,
.dm-content-block.custom-dev .icon,
.dm-content-block.wordpress .icon,
.dm-content-block.ecommerce .icon{
background-position-y: -107px;
width: 57px;
height: 43px;
}
.dm-content-block.resp-design .icon{
background-position-x: -24px;
}
.dm-content-block.custom-dev .icon{
background-position-x: -89px;
}
.dm-content-block.wordpress .icon{
background-position-x: -149px;
width: 44px;
}
.dm-content-block.ecommerce .icon{
background-position-x: -193px;
width: 43px;
}
/*.page-digital-marketing .dm-content-block {
padding-top: 120px;
padding-bottom: 100px;
}*/
.page-digital-marketing .black-block h6 {
margin-bottom: 50px;
}
.page-digital-marketing .black-block .ds-paragraph {
margin: 24px auto 20px;
}
.new-block-left-wrapper .image.woman {
width: calc( 18.8% * 1.7 );
padding-bottom: calc( 29% * 1.7 );
right: calc( 28% * 0.7 );
top: 20px;
/*top: 35px;*/
}
.new-block-left-wrapper .image.arrow-target {
width: calc( 20.5% * 1.4 );
padding-bottom: calc( 20.5% * 1.4 );
/*right: calc( 8.8% * 0 );*/
right: -1%;
top: 0;
}
.page-pay-per-click-management .first-section {
background-image: url("images/DGD_google-ads-bg-960.jpg");
}
.page-seo .first-section {
background-image: url("images/DGD_SEO-header-bg-960.jpg");
padding-bottom: 230px;
background-position: right top;
}
.page-ai-search .first-section{
background-image: url("images/DGD_AI-Search-header-bg-960.jpg");
padding-bottom: 230px;
background-position: right top;
}
.page-social-media .first-section {
background-image: url("images/DGD_Social-header-bg-960.jpg");
background-position: right -30px bottom;
background-size: auto 65%;
}
.page-email-marketing .first-section{
background-image: url("images/DGD_Email-header-bg-960.jpg");
}
.parent-page-digital-marketing .google-section .content-text,
.parent-page-digital-marketing .google-section .content-image-wrapper {
float: none;
width: 100%;
}
.parent-page-digital-marketing .google-section .content-image-wrapper.bottom{
display: block;
}
.parent-page-digital-marketing .google-section .content-image-wrapper.top{
display: none;
}
.parent-page-digital-marketing .second-section .content-1820 {
display: block;
}
.parent-page-digital-marketing .first-section .intro{
font-size: 20px;
line-height: 32px;
margin-top: 48px;
/*
font-size: 18px;
max-width: 100%;
width: 82%;
*/
}
.parent-page-digital-marketing .first-section .intro .hiding-part{
display: none;
}
.parent-page-digital-marketing .dm-content-block{
width: 100%;
float: none;
margin-bottom: 0;
}
.parent-page-digital-marketing .dm-content-block p{
width: 90%;
max-width: 500px;
margin-right: auto;
margin-left: auto;
}
.parent-page-digital-marketing .first .dm-content-block {
border: none;
}
.parent-page-digital-marketing .first .dm-content-block:last-child {
border-bottom: 3px solid #9f23c4;
margin-bottom: 70px;
}
#design-wrapper .button-link, .button-link {
font-size: 11px;
}
#design-wrapper,
#reach-wrapper {
padding-top: 106px;
}
#design-wrapper .phone-1 {
top: 34px;
}
#design-wrapper .phone-2 {
top: 43px;
}
#design-wrapper .phone-3 {
top: 55px;
}
#design-wrapper p {
padding-bottom: 25px;
}
.page-pay-per-click-management .first-section{
background-position: right -140px bottom -120px ;
}
}
@media screen and (max-width:959px) and (min-width:600px) {
.parent-page-digital-marketing .google-section .arrow-list.left,
.parent-page-digital-marketing .google-section .arrow-list.right {
width: 46%;
margin: 0 2%;
}
.parent-page-digital-marketing .google-section .arrow-list.left {
float: left;
}
.parent-page-digital-marketing .google-section .arrow-list.right {
float: right;
}
.parent-page-digital-marketing .google-section .content-image-wrapper {
clear: both;
}
}
@media screen and (max-width:900px) {
.ads-cycle-wrapper .center ,
.seo-cycle-wrapper .center ,
.social-media-cycle-wrapper .center ,
.email-marketing-cycle-wrapper .center {
font-size: 25px;
}
.ads-cycle-wrapper .label ,
.seo-cycle-wrapper .label ,
.social-media-cycle-wrapper .label ,
.email-marketing-cycle-wrapper .label {
font-size: 20px;
}
/*
.webhosting-block .center {
width: 70%;
margin-left: 25%;
top: -20px;
}
.hosting-bg {
background-position: left 130%;
bottom: 0;
top: unset;
left: 0;
}
.hosting-bg.right-bg {
display: block;
top: 0;
bottom: unset;
background-position: left -90%;
}*/
#senior-team .member {
width: 40%;
}
#senior-team .member:nth-child(odd) {
margin-left: 10%;
}
}
@media screen and (max-width: 850px) {
.page-pay-per-click-management .first-section {
background-image: url("images/DGD_google-ads-bg-700.jpg");
background-position: right bottom;
background-size: auto 680px;
}
.page-seo .first-section {
background-image: url("images/DGD_SEO-header-bg-700.jpg");
background-position: center top;
background-size: auto 115%;
}
.page-ai-search .first-section{
background-image: url("images/DGD_AI-Search-header-bg-700.jpg");
background-position: center top;
background-size: cover;
}
.page-social-media .first-section {
background-image: url("images/DGD_Social-header-bg-700.jpg");
background-position: center bottom;
background-size: auto 80%;
}
.page-email-marketing .first-section{
background-image: url("images/DGD_Email-header-bg-700.jpg");
background-size: auto 90%;
background-position: center bottom -40px;
}
.parent-page-digital-marketing .first-section{
padding-top: 130px;
padding-bottom: 400px;
}
.parent-page-digital-marketing .first-section .content{
width: 100%;
margin-left: 0;
margin-right: 0;
padding-left: 20px;
padding-right: 20px;
box-sizing: border-box;
}
.parent-page-digital-marketing .first-section h1{
font-size: 42px;
padding-top: 10px;
}
.parent-page-digital-marketing .first-section .intro{
font-size: 17px;
line-height: 32px;
width: 90%;
}
}
@media screen and (max-width: 800px) {
h2,
h5 {
font-size: 25px;
}
h4 {
font-size: 25px;
}
.new-block-left-wrapper p {
padding-bottom: 15px;
}
.new-block-left-wrapper .content-image-wrapper {
position: relative;
height: 325px;
left: 0;
width: 100%;
margin-bottom: 150px;
}
.new-block-left-wrapper .image.face {
width: 100%;
top: 0;
}
.new-block-left-wrapper .button-link {
margin-top: 54px;
}
.new-block-left-wrapper .content-text {
width: 100%;
left: 0;
}
.new-block-left-wrapper .image {
/*width: 146.34px;
padding-bottom: 292.5px;
right: calc(50% + 10px);
top: 0;*/
}
.black-block,
.purple-block,
.white-block,
.dm-content-block{
padding: 110px 0 100px;
}
/*.page-digital-marketing .dm-content-block {
padding-top: 110px;
padding-bottom: 90px;
}*/
.page-digital-marketing .dm-content-block {
/*height: 500px;*/
}
.new-block-left-wrapper .image.woman {
width: calc( 18.8% * 1.6 );
padding-bottom: calc( 29% * 1.6 );
/*right: calc( 28% * 0.9 );*/
right: auto;
left: 20%;
top: 0px;
/*top: 35px;*/
}
.new-block-left-wrapper .image.arrow-target {
width: calc( 20.5% * 1.6 );
padding-bottom: calc( 20.5% * 1.6 );
/*right: calc( 8.8% * 0 );*/
right: 20%;
top: -20px;
/*top: 14px;*/
}
/* .new-block-left-wrapper .image.woman,
.new-block-left-wrapper .image.arrow-target {
outline: none;
}
*/
#design-wrapper p {
padding-bottom: 15px;
}
#design-wrapper .content-image-wrapper {
position: relative;
height: 325px;
left: 0;
width: 100%;
}
#design-wrapper .button-link {
margin-top: 54px;
}
#design-wrapper .content-text {
width: 100%;
left: 0;
margin-top: 26px;
}
#design-wrapper .phone {
margin-top: 15px;
}
#design-wrapper .phone-1 {
width: 146.34px;
padding-bottom: 292.5px;
right: calc(50% + 10px);
top: 0;
}
#design-wrapper .phone-2 {
width: 138.96px;
padding-bottom: 280.8px;
right: calc(50% - 70px);
top: 6px;
}
#design-wrapper .phone-3 {
width: 132.03px;
padding-bottom: 262.8px;
top: 15px;
right: calc(50% - 150px);
}
.quote-block h3{
font-size: 44px;
}
.page-web-design .second-block,
.page-digital-marketing .second-block {
padding-top: 75px;
}
.page-web-design .second-block .icon, .page-digital-marketing .second-block .icon {
margin-bottom: 12px;
}
.dm-content-block h2,
.dm-content-block h4 {
margin-bottom: 0.7em;
}
.page-digital-marketing .second-block .button-link,
.page-web-design .second-block .button-link {
margin-top: 80px;
}
.parent-page-digital-marketing .second-section{
padding-top: 120px;
}
.parent-page-digital-marketing .second-section .heading-block h2{
font-size: 30px;
margin-bottom: 55px;
}
}
@media screen and (max-width:750px) {
.ads-cycle-wrapper ,
.seo-cycle-wrapper ,
.social-media-cycle-wrapper ,
.email-marketing-cycle-wrapper {
width: 80%;
/*height: 0;
margin: 140px auto 120px;*/
margin-top: 180px;
padding-bottom: 80%;
}
.ads-cycle-wrapper .center ,
.seo-cycle-wrapper .center ,
.social-media-cycle-wrapper .center ,
.email-marketing-cycle-wrapper .center {
font-size: 25px;
top: -100px;
}
.ads-cycle-wrapper .label ,
.seo-cycle-wrapper .label ,
.social-media-cycle-wrapper .label ,
.email-marketing-cycle-wrapper .label {
font-size: 20px;
}
.ads-cycle-wrapper .label-right,
.seo-cycle-wrapper .label-right,
.social-media-cycle-wrapper .label-right,
.email-marketing-cycle-wrapper .label-right{
left: auto;
right: 26%;
top: calc( 50% - 3.2em );
text-align: right;
}
.ads-cycle-wrapper .label-left,
.seo-cycle-wrapper .label-left,
.social-media-cycle-wrapper .label-left,
.email-marketing-cycle-wrapper .label-left{
right: auto;
left: 26%;
top: calc( 50% + 0.2em );
text-align: left;
}
.ads-cycle-wrapper .label-top,
.seo-cycle-wrapper .label-top,
.social-media-cycle-wrapper .label-top,
.email-marketing-cycle-wrapper .label-top{
top: -2em;
}
/*
.webhosting-block .center {
width: 80%;
margin-left: 10%;
top: -20px;
}
.hosting-bg {
width: 100%;
background-size: 400px auto;
background-position: left 120%;
}
.hosting-bg.right-bg {
background-position: left -70%;
}*/
.page-template-page-video #header-text-wrapper .first-line{
font-size: 65px;
line-height: 83px;
}
}
@media screen and (max-width:720px) {
.hosting-bg.left-bg {
width: 70%;
min-width: 380px;
height: 350px;
position: absolute;
bottom: 0;
top: auto;
background-size: 570px;
background-position: top right;
}
.webhosting-block .center {
margin-top: -80px;
width: 440px;
margin-bottom: 200px;
}
.parent-page-digital-marketing .new-block-left-wrapper .content-1820{
margin-top: -80px;
margin-bottom: -160px;
}
}
@media screen and (max-width: 700px) {
.new-block-left-wrapper .image.woman {
width: calc( 18.8% * 1.9 );
padding-bottom: calc( 29% * 1.9 );
left: 15%;
}
.new-block-left-wrapper .image.arrow-target {
width: calc( 20.5% * 1.9 );
padding-bottom: calc( 20.5% * 1.9 );
right: 15%;
}
.webhosting-block .center br{
display: none;
}
.show-under-700 {
display: inline-block;
}
.page-digital-marketing .black-block h5 {
min-width: 0;
}
.page-digital-marketing .black-block .ds-paragraph{
max-width: 100%;
}
.digital-strategy .bg.board {
background-size: 1500px auto;
background-position-x: -75px;
}
.digital-strategy .bg.piece {
background-size: 174.75px auto;
background-position: 58.5px 100%;
}
}
@media screen and (max-width: 650px) {
.new-block-left-wrapper .content-image-wrapper {
height: 0;
padding-bottom: 63.3%;
}
#senior-team .member {
width: 50%;
}
#senior-team .member:nth-child(odd) {
margin-left: 0;
}
.page-pay-per-click-management .first-section {
background-image: url("images/DGD_google-ads-bg-700.jpg");
background-position: right bottom;
background-size: contain;
}
}
@media screen and (max-width: 630px) {
.page-digital-marketing .black-block h5 {
width: 100%;
text-align: center !important;
margin: 0 !important;
padding: 0 !important;
}
}
@media screen and (max-width:620px) {
.webhosting-block {
overflow-x: hidden;
}
.webhosting-block .center {
width: 90%;
margin-left: auto;
margin-right: auto;
}
}
@media screen and (max-width: 600px) {
.content-1820,
.content {
width: calc(100% - 90px);
}
.new-block-left {
width: calc(100% - 90px);
max-width: calc(100% - 90px);
}
h6 {
font-size: 42px;
}
.black-block,
.purple-block,
.white-block,
.dm-content-block{
padding: 90px 0 80px;
}
/*.page-digital-marketing .dm-content-block {
padding-top: 90px;
padding-bottom: 70px;
}*/
.page-digital-marketing .intro{
width: calc( 100% - 90px );
max-width: calc( 100% - 90px );
}
.page-digital-marketing .dm-content-block {
height: 550px;
}
.new-block-left-wrapper .image.woman {
width: calc( 18.8% * 2.2 );
padding-bottom: calc( 29% * 2.2 );
left: 9%;
}
.new-block-left-wrapper .image.arrow-target {
width: calc( 20.5% * 2.2 );
padding-bottom: calc( 20.5% * 2.2 );
right: 9%;
}
#design {
width: calc(100% - 90px);
max-width: calc(100% - 90px);
}
#design-wrapper .phone {
margin-top: 10px;
}
#design-wrapper .content-text{
margin-top: 7px;
}
.quote-block h3 {
font-size: 52px;
}
}
@media screen and (max-width: 580px) {
.page-digital-marketing .h5-wrapper {
width: 100%;
max-width: 370px;
margin: 0 auto;
}
.page-digital-marketing .black-block h5 {
margin: 0 1em;
line-height: 1.6em;
}
.ads-cycle-wrapper ,
.seo-cycle-wrapper ,
.social-media-cycle-wrapper ,
.email-marketing-cycle-wrapper {
width: 90%;
padding-bottom: 90%;
}
#senior-team h3 {
font-size: 45px;
padding-top: 80px;
}
#senior-team p {
font-size: 20px;
width: 100%;
line-height: 35px;
}
.page.page-about-us #main-wrapper main {
padding-bottom: 70px;
}
.parent-page-digital-marketing .first-section h2{
font-size: 28px;
}
.parent-page-digital-marketing .first-section h1{
font-size: 37px;
}
.interests-left,
.interests-right {
float: none;
width: 100%;
}
.interests-right {
margin-top: 0 !important;
}
}
@media screen and (max-width: 550px) {
.digital-strategy .texts {
width: 100%;
padding-left: 60px;
}
.page-digital-marketing .black-block {
padding-bottom: 170px;
}
.digital-strategy p {
text-shadow: -1px 1px 1px black;
}
.digital-strategy .bg.board {
background-size: 1000px auto;
background-position-x: 55%;
}
.digital-strategy .bg.piece {
background-size: 116.5px auto;
background-position: calc( 55% - 105px ) 100%;
}
#senior-team .member {
width: 100%;
float: none;
}
}
@media screen and (max-width: 530px) {
.page-digital-marketing .dm-content-block,
.dm-content-block {
width: 100%;
height: auto;
padding-bottom: 40px;
}
.dm-content-block,
.dm-content-block.seo,
.dm-content-block.email {
transition-delay: 0s !important;
}
.page-digital-marketing .second-block .social .h-line,
.page-digital-marketing .second-block .h-line {
display: block;
}
.page-digital-marketing .second-block .seo .line,
.page-digital-marketing .second-block .line {
display: none;
}
.dm-content-block,
.dm-content-block:nth-child(odd),
.dm-content-block:nth-child(even) {
padding-left: 0;
padding-right: 0;
padding-bottom: 30px;
}
.new-block-left-wrapper .image.woman {
width: calc( 18.8% * 2.6 );
padding-bottom: calc( 29% * 2.6 );
left: 2%;
}
.new-block-left-wrapper .image.arrow-target {
width: calc( 20.5% * 2.6 );
padding-bottom: calc( 20.5% * 2.6 );
right: 2%;
}
.new-block-left-wrapper h3 .white-text {
margin-left: -100px;
}
.page-web-design .second-block .icon, .page-digital-marketing .second-block .icon {
margin-bottom: 20px;
}
.dm-content-block h2,
.dm-content-block h4 {
margin-bottom: 0.6em;
}
.page-web-design .dm-content-block {
padding-bottom: 30px;
}
.page-web-design .second-block .button-link {
margin-top: 53px;
}
}
@media screen and (max-width: 500px) {
.page-digital-marketing .black-block {
padding-bottom: 210px;
}
.page-pay-per-click-management .first-section {
background-image: url("images/DGD_google-ads-bg-500.jpg");
}
.page-seo .first-section {
background-image: url("images/DGD_SEO-header-bg-500.jpg");
background-size: cover;
background-position: center bottom -100px;
padding-top: 80px;
padding-bottom: 390px;
}
.page-ai-search .first-section{
background-image: url("images/DGD_AI-Search-header-bg-500.jpg");
background-size: cover;
background-position: center bottom -100px;
padding-top: 80px;
padding-bottom: 390px;
}
.page-social-media .first-section {
background-image: url("images/DGD_Social-header-bg-500.jpg");
background-position: center bottom -80px;
background-size: auto 100%;
}
.page-email-marketing .first-section{
background-image: url("images/DGD_Email-header-bg-500.jpg");
}
.parent-page-digital-marketing .first-section h2 {
width: 235px;
}
.page-seo .first-section h1 {
width: 300px;
margin: 0.3em auto 0;
line-height: 1.4em;
}
}
@media screen and (max-width: 450px) {
.ads-cycle-wrapper .label ,
.seo-cycle-wrapper .label ,
.social-media-cycle-wrapper .label ,
.email-marketing-cycle-wrapper .label {
font-size: 17px;
line-height: 1.3em;
}
.ads-cycle-wrapper .label-right ,
.seo-cycle-wrapper .label-right ,
.social-media-cycle-wrapper .label-right ,
.email-marketing-cycle-wrapper .label-right {
top: calc( 50% - 2.8em );
right: 25%;
}
.ads-cycle-wrapper .label-left ,
.seo-cycle-wrapper .label-left ,
.social-media-cycle-wrapper .label-left ,
.email-marketing-cycle-wrapper .label-left {
left: 25%;
}
.parent-page-digital-marketing .first-section{
padding-bottom: 350px;
}
.page-pay-per-click-management .first-section {
background-position: left bottom -70px;
background-size: auto 100%;
}
.page-social-media .first-section {
background-position: center bottom -150px;
}
.page-email-marketing .first-section{
background-size: auto 75%;
}
}
@media screen and (max-width: 400px) {
.content-1820,
.content {
width: calc(100% - 52px);
min-width: auto;
}
.digital-strategy .texts {
padding-right: 30px;
padding-left: 30px;
}
.digital-strategy .texts {
margin-right: 26px;
padding-left: 26px;
}
h2,
h5 {
font-size: 24px;
}
.purple-block h1,
h3 {
font-size: 42px;
}
h6 {
font-size: 30px;
}
.new-block-left {
max-width: calc(100% - 52px);
width: calc(100% - 52px);
}
.new-block-left-wrapper {
padding-top: 84px;
}
.page-digital-marketing .intro,
.page-digital-marketing .black-block .ds-paragraph{
max-width: calc( 100% - 52px );
width: calc( 100% - 52px );
}
.new-block-left-wrapper .image.woman {
width: calc( 18.8% * 3.1 );
padding-bottom: calc( 29% * 3.1 );
left: -26px;
}
.new-block-left-wrapper .image.arrow-target {
width: calc( 20.5% * 3.1 );
padding-bottom: calc( 20.5% * 3.1 );
right: 0;
}
#design {
max-width: calc(100% - 52px);
width: calc(100% - 52px);
}
#design-wrapper,
#reach-wrapper {
padding-top: 84px;
}
.page-about-us .content {
width: 100%;
}
#video-wrapper {
left: 0;
}
.page-about-us #header-text .first-line {
width: 80%;
}
#senior-team p {
width: 90%;
}
#senior-team .member {
margin-top: 50px;
}
#senior-team .name {
margin-top: 0.7em;
margin-bottom: 0.5em;
}
.page-template-page-video #header-text-wrapper .first-line{
font-size: 47px;
line-height: 60px;
}
.page-email-marketing .first-section{
background-position: left 50px bottom -40px;
}
}
@media screen and (max-width: 390px) {
.page-digital-marketing .black-block {
padding-bottom: 250px;
}
}
@media screen and (max-width: 370px) {
.page-digital-marketing .black-block h5 {
margin: 0 0.6em;
}
}
@media screen and (max-width: 350px) {
.page-pay-per-click-management .first-section {
background-position: left bottom -70px;
background-size: 160% auto;
}
.page-seo .first-section {
background-position: left 70% bottom -200px;
}
}
body.group-blog #scroll-down-arrow-wrapper {
display: none;
}
.display-mobile {
display: none;
}
@media (max-width: 767px) {
.display-mobile {
display: block;
}
.display-desktop {
display: none !important;
}
}
@media screen and (max-width: 550px) {
.page-pay-per-click-management .first-section {
padding-top: 85px;
padding-bottom: 355px;
}
.parent-page-digital-marketing .first-section .intro {
margin-top: 30px;
}
}
@media screen and (max-width: 767px) {
.page-pay-per-click-management.parent-page-digital-marketing .first-section.purple-block {
background-size: 100% auto;
background-size: 500px auto;
background-position: center bottom;
padding-bottom: 350px;
}
}
@media screen and (max-width: 500px) {
.page-pay-per-click-management.parent-page-digital-marketing .first-section.purple-block {
padding-top: 85px;
padding-bottom: 290px;
background: #c22ca3;
position: relative;
overflow: hidden;
}
.page-pay-per-click-management.parent-page-digital-marketing .first-section.purple-block:before {
content: " ";
position: absolute;
width: 100%;
height: 100%;
background: url("images/DGD_google-ads-bg-500.jpg") no-repeat center bottom;
background-size: 450px auto;
bottom: -90px;
left: 0;
}
.page-seo.parent-page-digital-marketing .first-section h2 {
width: 100%;
font-size: 25px;
padding-left: 0;
}
.page-seo .first-section h1 {
width: 100%;
margin: 0;
line-height: 1.4em;
}
.parent-page-digital-marketing.page-seo .first-section {
background-image: url(images/DGD_SEO-header-bg-500.jpg);
background-size: 500px auto;
background-position: center bottom -190px;
}
.parent-page-digital-marketing.page-social-media .first-section {
background: url(images/DGD_Social-header-bg-700.jpg) no-repeat scroll center bottom #26acb8;
background-size: 500px auto;
padding-top: 80px;
padding-bottom: 330px;
}
.parent-page-digital-marketing .first-section {
padding-top: 80px;
padding-bottom: 260px;
}
}
@media screen and (max-width: 400px) {
.page-seo.parent-page-digital-marketing .first-section h2 {
width: 235px;
margin: 0 auto;
padding: 0;
}
}
@media screen and (max-width: 450px) {
.page-pay-per-click-management .first-section {
background-position: center bottom;
background-size: 100% auto;
}
.parent-page-digital-marketing .first-section .content {
padding-left: 25px;
padding-right: 25px;
}
.parent-page-digital-marketing .first-section .intro {
width: 100%;
}
.page-pay-per-click-management.parent-page-digital-marketing .first-section.purple-block {
position: relative;
overflow: hidden;
background: #c22ca3;
padding-bottom: 230px;
}
.page-pay-per-click-management.parent-page-digital-marketing .first-section.purple-block:before {
content: " ";
position: absolute;
width: 100%;
height: 100%;
background: url("images/DGD_google-ads-bg-500.jpg") no-repeat center bottom;
background-size: 100% auto;
bottom: -90px;
left: 0;
}
.parent-page-digital-marketing .first-section {
padding-bottom: 250px;
background-size: 450px auto;
background-position: right bottom -150px;
}
.page-social-media.parent-page-digital-marketing .first-section {
padding-bottom: 250px;
background-size: 450px auto;
background-position: center bottom -50px;
}
.page-email-marketing.parent-page-digital-marketing .first-section {
background-size: auto 90%;
background-position: center bottom -40px;
}
}
@media screen and (max-width: 450px) and (min-width: 400px) {
.page-pay-per-click-management.parent-page-digital-marketing .first-section.purple-block {
padding-bottom: 300px;
}
}
@media (max-width: 767px) {
#wpcf7-f530-o1 .gdpr {
display: flex;
flex-direction: row;
align-content: center;
justify-content: flex-start;
flex-wrap: wrap;
}
#wpcf7-f530-o1 .gdpr .title {
flex: 0 0 100%;
text-align: center;
}
#wpcf7-f530-o1 .gdpr .wpcf7-form-control-wrap {
width: auto;
}
#wpcf7-f530-o1 .gdpr .clearfix {
flex: 0 0 100%;
}
#wpcf7-f530-o1 .gdpr .left {
width: 40px;
}
#wpcf7-f530-o1 .gdpr .right {
width: calc( 100% - 40px );
margin-left: 0;
}
#wpcf7-f530-o1 .gdpr .left .wpcf7-list-item-label {
font-size: 0;
}
#wpcf7-f530-o1 .gdpr input[type=checkbox] + .wpcf7-list-item-label:before {
margin-left: -18px;
margin-top: 4px;
}
#wpcf7-f530-o1 .gdpr .description {
margin-top: 18px;
}
}
@media (max-width: 800px) {
article.post.type-post .entry-thumbnail {
max-width: none;
margin-left: -50px;
margin-right: -50px;
}
}
#colophon {
position: relative;
overflow: hidden;
}
#colophon:after {
content: " ";
position: absolute;
width: 100%;
height: 500px;
bottom: -500px;
background-color: #000;
}
.case-study-lp{
position: relative;
display: block;
width: 100%;
height: calc( 25vh - 19px );
min-height: 120px;
display: block;
margin: 0;
padding: 0;
}
.case-study-lp a{
position: absolute;
display: block;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 2;
}
.case-study-lp .bg{
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background-image: url('images/case-study-lp-1.png');
background-size: cover;
background-position: center;
-webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
filter: grayscale(100%);
z-index: 1;
opacity: 0.35;
transition: opacity 0.3s;
}
.case-study-lp h2{
font-size: 43px;
line-height: 32px;
color: #fff;
font-family: 'Oswald', sans-serif;
font-weight: 300;
text-align: left;
position: relative;
display: block;
width: 64%;
top: 36%;
left: 20%;
padding: 0;
margin: 0;
transition: opacity 0.1s;
}
.case-study-lp p{
display: none;
}
.case-study-lp p.case-study-lp-tagline{
font-size: 17px;
line-height: 35px;
color: #fff;
text-align: left;
position: relative;
display: block;
width: 64%;
top: 36%;
left: 20%;
margin-top: 10px;
z-index: 10;
transition: opacity 0.1s;
}
.case-study-lp a:hover .bg{
opacity: 1;
filter: none;
}
.case-study-lp a:hover h2,
.case-study-lp a:hover p.case-study-lp-tagline{
opacity: 0;
}
/*-------------------------------------------------------------------- Case Studies --------------------------------------------------------------------*\*/
/*html,*/
/*body,*/
/*#main-wrapper,*/
/*#main,*/
/*#main article.content,*/
.entry-content{
/*height: 1px;*/
min-height: 100%;
}
.parent-page-case-studies .content{
max-width: none;
padding: 0;
}
.parent-page-case-studies .screen{
/*position: relative;*/
width: 100%;
height: 100%;
/*height: auto;*/
min-height: calc( 100vh - 76px );
background-color: #222;
}
.parent-page-case-studies .box{
width: 100%;
}
.parent-page-case-studies #screen-1-1{
background-image: url('images/case-studies/cold-move-devices-bg.jpg');
background-size: cover;
background-position: center 65%;
overflow: hidden;
}
.parent-page-case-studies #screen-1-1 #laptop,
.parent-page-case-studies #screen-1-1 #tablet,
.parent-page-case-studies #screen-1-1 #mobile{
position: absolute;
height: 100%;
width: 100%;
background-size: cover;
background-position: center 65%;
}
.parent-page-case-studies #screen-1-1 #laptop{
background-image: url('images/case-studies/cold-move-devices-laptop.png');
}
.parent-page-case-studies #screen-1-1 #tablet{
background-image: url('images/case-studies/cold-move-devices-tablet.png');
background-position: right 65%;
transition: 1s transform ease-out;
}
.parent-page-case-studies #screen-1-1:not(.initiated) #tablet{
transform: translateX(80%);
}
.parent-page-case-studies #screen-1-1 #mobile{
background-image: url('images/case-studies/cold-move-devices-mobile.png');
background-position: left 65%;
transition: 1s transform ease-out;
}
.parent-page-case-studies #screen-1-1:not(.initiated) #mobile{
transform: translateX(-80%);
}
.parent-page-case-studies .box-1-2-1,
.parent-page-case-studies .box-1-2-2{
position: relative;
min-height: 50%;
}
.parent-page-case-studies .box-1-2-1{
background-color: #fff;
}
.parent-page-case-studies .box-1-2-1 .wrapper{
max-width: 1400px;
margin: 0 auto;
text-align: left;
}
.parent-page-case-studies .box-1-2-1 .left{
float: left;
width: 60%;
text-align: left;
position: relative;
}
.parent-page-case-studies .box-1-2-1 .purple-line{
position: absolute;
float: left;
right: 0;
top: 0;
width: 0;
height: 100%;
}
.parent-page-case-studies .box-1-2-1 .purple-line div{
position: relative;
width: 3px;
height: 100%;
top: -50px;
padding-bottom: 70px;
background-color: #a110c6;
}
.parent-page-case-studies .box-1-2-1 h2{
font-size: 55px;
line-height: 1em;
color: #000;
font-family: 'Oswald', sans-serif;
font-weight: 300;
padding: 0;
margin-top: 1.45em;
margin-bottom: 1em;
}
.parent-page-case-studies .box-1-2-1 p{
font-size: 18px;
line-height: 35px;
text-align: justify;
margin-bottom: 25px;
}
.parent-page-case-studies .box-1-2-1 .right{
float: right;
width: 40%;
text-align: left;
position: relative;
}
.parent-page-case-studies .box-1-2-1 .right p{
font-size: 60px;
line-height: 74px;
color: #000;
font-weight: 300;
margin-top: -0.2em;
text-align: left;
margin-bottom: 80px;
}
.parent-page-case-studies .box-1-2-1 .clearfix{
margin-bottom: 50px;
}
.parent-page-case-studies .box-1-2-2{
display: block;
height: 500px;
min-height: 500px;
min-height: calc( 100vh - 76px );
/*background-image: url('images/case-studies/cold-move-box-1-2-2.jpg');*/
background-color: #ddd;
background-size: cover;
background-position: center;
}
.parent-page-case-studies .box-1-2-2 #tablet-2,
.parent-page-case-studies .box-1-2-2 #mobile-2{
position: absolute;
height: 100%;
width: 100%;
background-size: contain;
background-repeat: no-repeat;
background-position: center 65%;
}
.parent-page-case-studies .box-1-2-2 #tablet-2{
background-image: url('images/case-studies/box-1-2-2-tablet.png');
transition: 1s transform ease-out;
}
.parent-page-case-studies #screen-1-2:not(.initiated) .box-1-2-2 #tablet-2{
transform: translateX(80%);
}
.parent-page-case-studies .box-1-2-2 #mobile-2{
background-image: url('images/case-studies/box-1-2-2-mobile.png');
transition: 1s transform ease-out;
}
.parent-page-case-studies #screen-1-2:not(.initiated) .box-1-2-2 #mobile-2{
transform: translateX(-80%);
}
.parent-page-case-studies .box-1-3-1{
background-color: #fff;
height: auto;
min-height: 300px;
min-height: calc( 33.3vh - 76px );
}
.parent-page-case-studies .box-1-3-1 .wrapper{
text-align: left;
max-width: 1410px;
margin: 0 auto;
padding-bottom: 110px;
padding-bottom: 10vmin;
}
.parent-page-case-studies .box-1-3-1 h2{
font-family: 'Oswald', sans-serif;
font-weight: 300;
font-size: 55px;
line-height: 0.87em;
color: #949393;
margin-top: 1.64em;
margin-bottom: 1.55em;
}
.parent-page-case-studies .box-1-3-1 h3{
font-size: 60px;
line-height: 1.35em;
color: rgb(0,0,0);
text-align: center;
font-weight: 300;
border-bottom: 3px solid #a10fc5;
position: relative;
left: 13%;
width: 87%;
padding-bottom: 0.67em;
letter-spacing: -1px;
margin-bottom: 0.67em;
}
.parent-page-case-studies .box-1-3-1 p{
font-size: 17px;
line-height: 2em;
color: #3e3e3e;
text-align: left;
position: relative;
left: 13%;
width: 71%;
margin-top: 14px;
}
.parent-page-case-studies .box-1-3-2{
background-color: #000;
height: auto;
min-height: 300px;
min-height: calc( 33.3vh - 76px );
color: #fff;
}
.parent-page-case-studies .box-1-3-2 .wrapper{
padding-top: 70px;
padding-top: 8vmin;
padding-bottom: 110px;
padding-bottom: 12vmin;
}
.parent-page-case-studies .box-1-3-2 .photo-mark{
position: relative;
background-image: url('images/case-studies/mark-boulton.jpg');
width: 185px;
height: 185px;
border-radius: 50%;
margin: 0 auto 45px;
background-size: 100%;
}
.parent-page-case-studies .box-1-3-2 .testimonial{
font-size: 31px;
letter-spacing: 1px;
line-height: 1.27em;
color: #29b4ca;
text-align: center;
}
.parent-page-case-studies .box-1-3-2 .name{
display: block;
font-size: 31px;
letter-spacing: 1px;
text-align: center;
margin: 1em auto 0;
}
.parent-page-case-studies .box-1-3-2 .role{
font-size: 23px;
line-height: 1.33em;
font-style: italic;
}
.parent-page-case-studies .box-1-3-2 .company{
font-size: 23px;
line-height: 1.33em;
margin: 4px auto 0;
display: block;
}
.parent-page-case-studies .box-1-3-3{
position: relative;
min-height: 50%;
}
.parent-page-case-studies .box-1-3-3{
background-color: #fff;
}
.parent-page-case-studies .box-1-3-3 .wrapper{
max-width: 1400px;
margin: 0 auto;
text-align: right;
}
.parent-page-case-studies .box-1-3-3 .right{
float: right;
width: 60%;
text-align: left;
position: relative;
}
.parent-page-case-studies .box-1-3-3 .purple-line{
position: absolute;
float: right;
right: 0;
top: 0;
width: 0;
height: 100%;
}
.parent-page-case-studies .box-1-3-3 .purple-line div{
position: relative;
width: 3px;
height: 100%;
top: -50px;
background-color: #a110c6;
}
.parent-page-case-studies .box-1-3-3 h2{
width: 100%;
font-size: 55px;
line-height: 1em;
color: #000;
font-family: 'Oswald', sans-serif;
font-weight: 300;
padding: 0;
text-align: right;
margin-top: 1.45em;
margin-bottom: 1em;
}
.parent-page-case-studies .box-1-3-3 p{
font-size: 18px;
line-height: 35px;
text-align: justify;
margin-bottom: 25px;
}
.parent-page-case-studies .box-1-3-3 .left{
float: left;
width: 40%;
text-align: left;
position: relative;
}
.parent-page-case-studies .box-1-3-3 .left p{
font-size: 60px;
line-height: 74px;
color: #000;
font-weight: 300;
margin-top: -0.2em;
text-align: left;
margin-bottom: 80px;
}
.parent-page-case-studies .box-1-3-3 .clearfix{
margin-bottom: 50px;
}
.parent-page-case-studies .entry-content{
position: relative;
}
.parent-page-case-studies article{
height: 5000px;
height: 500vh;
}
.parent-page-case-studies .screen{
position: fixed;
top: 0;
margin-top: 76px;
}
/*#screen-1-1{*/
.parent-page-case-studies .screen[id$="-1"] {
position: relative;
z-index: 10;
}
.parent-page-case-studies .screen[id$="-2"] {
z-index: 9;
}
.parent-page-case-studies .screen[id$="-3"] {
z-index: 8;
}
.parent-page-case-studies .screen[id$="-4"] {
z-index: 7;
}
.parent-page-case-studies .screen[id$="-5"] {
z-index: 6;
}
.parent-page-case-studies .screen[id$="-6"] {
z-index: 5;
}
.parent-page-case-studies .screen[id$="-7"] {
z-index: 4;
}
.parent-page-case-studies .screen[id$="-8"] {
z-index: 3;
}
.parent-page-case-studies .screen[id$="-9"] {
z-index: 2;
}
.parent-page-case-studies .screen[id$="-10"] {
z-index: 1;
}
.parent-page-case-studies .screen[id$="-11"] {
z-index: 0;
}
.parent-page-case-studies .screen.isGone{
position: relative !important;
z-index: 0;
margin-top: 0;
}
.parent-page-case-studies .screen.isMoving{
position: relative !important;
margin-top: 0;
}
* {
/*box-shadow: inset 0 0 30px 1px blue;*/
}