/*
Theme Name: CustomizePress
Theme URI: https://customizepress.ca
Author: Gary
Author URI: N/A
Description: Web design for CustomizePress
Version: 3.1.0
License: 
License URI: 
Tags: web design vancouver, web design coquitlam, web design company
Text Domain: customizepress

This theme, like WordPress, is licensed under the GPL.

*/


* {
	margin:0;
	padding:0;
}



/* Body, h, p, pre, ul, ol, a
   ===================================================== */
    
html {
	scroll-behavior: smooth;
}

body {
	font-family: 'Quicksand', sans-serif;
	margin: 0 auto -30px;
	font-size:17px;
	background:#F9F9F9;
	color:#433F3F;
}



.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
	font-family: 'Quicksand', sans-serif;
	line-height:1.5;
	color: #433F3F;
}

.wp-block-image img {
    max-width: 100%;
    height: auto;
}

.cp-content p {

  color: #333333;
    text-shadow: 0 1px 0 #ebebeb;
    border-bottom: 1px solid #e8e8e8;
    border-left: none;
    border-right: none;
    padding:1em 1em 2em;
    font-weight: 100;
    line-height: 1.5;
}

.cp-content a, .main-content a {
  color: #248a6d;
  text-shadow: 0 1px 0 #e7f9f4;
  text-decoration: none;
  border-bottom: 1px dashed #33c79d;
  display: inline-block;
  position: relative;
  padding: 0 .2em;
  transition: all 250ms;
  z-index: 1000;
}

.cp-content a:before, .main-content a:before {
  content: "";
  z-index: -1;
  width: 100%;
  height: 0%;
  background: rgba(68, 207, 168, 0.16);
  bottom: 0;
  left: 0;
  position: absolute;
  transition: height 250ms;
}

.cp-content a:hover, .main-content a:hover {
  border-color: transparent;
}

.cp-content a:hover:before, .main-content a:hover:before {
  height: 100%;
}


a {
    text-decoration: none !important;
}

.main-content {
    margin: 50px auto;
}

.main-content ul {
    padding-left: 30px;
    list-style: none;
}

.main-content li {
    margin-bottom: 10px;
}

.main-content li:before {
    font-family: 'FontAwesome';
    content: "\f058";
    margin: 0 10px 0 -25px;
    color: #53c9b1;
}

.effect2
{
  position: relative;
padding-left:0;
padding-right:0;
}

.effect2:before, .effect2:after
{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  -webkit-box-shadow: 0 15px 10px #777;
  -moz-box-shadow: 0 15px 10px #777;
  box-shadow: 0 15px 10px #777;
  -webkit-transform: rotate(-3deg);
  -moz-transform: rotate(-3deg);
  -o-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  transform: rotate(-3deg);
}

.effect2:after
{
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}

@media only screen and (max-width:991px) {
.effect2:before, .effect2:after {
  bottom: 15px;
}
}

/* scroll to top */

#topBtn {
	display: none;
	position: fixed;
	bottom: 20px;
	right: 30px;
	z-index: 99;
	font-size: 18px;
	border: none;
	outline: none;
	background: #dfc358;
	color: white;
	cursor: pointer;
	border-radius: 100%;
	width: 50px;
	height: 50px;
}

#topBtn:hover {
  background-color: #555;
}

#topBtn i {
	font-size: 5.0rem;
}

/* Modal */

.modal-header {
    background: #41a2ce;
}

.modal-header  h4{
    color: #fff;
}

.modal-title {
	text-align: center;
	font-size: 14px;
}

.modal-body {
	padding:0;
        overflow:scroll;
}

.padding-modal-body {
    padding: 20px;
}

#threeModal .modal-body,
#fourModal .modal-body,
#fiveModal .modal-body {
	background:#f9f9f9;
}

#threeModal .padding-modal-body,
#fourModal .padding-modal-body,
#fiveModal .padding-modal-body {
	background:#fff;
}


/* Header - Navigation */


.admin-bar .navbar-fixed-top {
    top: 32px;
}

.navbar-default {
    background-color: transparent;
    border-color: transparent;
}

.navbar-brand {
  padding: 0px;
}
.navbar-brand>img {
  height: 100%;
  width: auto;
  padding-left: 50px;
}

.navbar-nav {
    float: right;
    margin: 0;
}

.company-name {
	font-size:1.7rem;
	position:relative;
	left:105px;	
	top: -44px;
	color:#FF9933;
	letter-spacing: 1px;
}

.company-name .second-letter {
	color:#30BF56;
	letter-spacing: 1px;
}

.slogan {
	color: #fff;
    display: block;
    font-size: 1.2rem;
    line-height: 1.4;
}

.navbar-default .navbar-nav>li>a {
    color: #fff;
}
.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover {
    color: #FF5722;
    transition:all .5s;
}

button.navbar-toggle {
    display: none;
}

nav.navbar.navbar-default.navbar-fixed-top.darkHeader {
    background: linear-gradient(90deg, rgb(63, 48, 80) 0%, rgba(88, 169, 212, 0.7) 25%, rgba(88, 169, 212, 0.7) 75%, rgb(60, 48, 80) 100%);
    height: 40px;
}


/*  Animation on navigation */


@-webkit-keyframes device {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  20% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  25% {
    -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg);
  }
  35% {
    -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg);
  }
  40% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
}
@keyframes device {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  20% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  25% {
    -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg);
  }
  35% {
    -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg);
  }
  40% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
}
@-webkit-keyframes screen {
  5% {
    width: 160px;
    height: 110px;
    border-radius: 6px;
    box-shadow: inset 0 0 0 6px white;
    border: 2px solid #888;
  }
  10% {
    width: 160px;
    height: 110px;
    border-radius: 6px;
    box-shadow: inset 0 0 0 8px white, inset 8px 0 0 6px white, inset -8px 0 0 6px white;
    border: 2px solid #888;
  }
  20% {
    width: 160px;
    height: 110px;
    border-radius: 6px;
    box-shadow: inset 0 0 0 8px white, inset 8px 0 0 6px white, inset -8px 0 0 6px white;
    border: 2px solid #888;
  }
  25% {
    width: 90px;
    height: 50px;
    border-radius: 8px;
    box-shadow: inset 0 0 0 4px white, inset 5px 0 0 5px white, inset -5px 0 0 5px white;
    border: 2px solid #888;
  }
  35% {
    width: 90px;
    height: 50px;
    border-radius: 8px;
    box-shadow: inset 0 0 0 4px white, inset 5px 0 0 5px white, inset -5px 0 0 5px white;
    border: 2px solid #888;
  }
  40% {
    width: 160px;
    height: 110px;
    border-radius: 6px;
    box-shadow: inset 0 0 0 8px white, inset 8px 0 0 6px white, inset -8px 0 0 6px white;
    border: 2px solid #888;
  }
  50% {
    width: 160px;
    height: 110px;
    border-radius: 6px;
    box-shadow: inset 0 0 0 8px white, inset 8px 0 0 6px white, inset -8px 0 0 6px white;
    border: 2px solid #888;
  }
  55% {
    width: 160px;
    height: 110px;
    border-radius: 6px;
    box-shadow: inset 0 0 0 6px white;
    border: 2px solid #888;
  }
}
@keyframes screen {
  5% {
    width: 160px;
    height: 110px;
    border-radius: 6px;
    box-shadow: inset 0 0 0 6px white;
    border: 2px solid #888;
  }
  10% {
    width: 160px;
    height: 110px;
    border-radius: 6px;
    box-shadow: inset 0 0 0 8px white, inset 8px 0 0 6px white, inset -8px 0 0 6px white;
    border: 2px solid #888;
  }
  20% {
    width: 160px;
    height: 110px;
    border-radius: 6px;
    box-shadow: inset 0 0 0 8px white, inset 8px 0 0 6px white, inset -8px 0 0 6px white;
    border: 2px solid #888;
  }
  25% {
    width: 90px;
    height: 50px;
    border-radius: 8px;
    box-shadow: inset 0 0 0 4px white, inset 5px 0 0 5px white, inset -5px 0 0 5px white;
    border: 2px solid #888;
  }
  35% {
    width: 90px;
    height: 50px;
    border-radius: 8px;
    box-shadow: inset 0 0 0 4px white, inset 5px 0 0 5px white, inset -5px 0 0 5px white;
    border: 2px solid #888;
  }
  40% {
    width: 160px;
    height: 110px;
    border-radius: 6px;
    box-shadow: inset 0 0 0 8px white, inset 8px 0 0 6px white, inset -8px 0 0 6px white;
    border: 2px solid #888;
  }
  50% {
    width: 160px;
    height: 110px;
    border-radius: 6px;
    box-shadow: inset 0 0 0 8px white, inset 8px 0 0 6px white, inset -8px 0 0 6px white;
    border: 2px solid #888;
  }
  55% {
    width: 160px;
    height: 110px;
    border-radius: 6px;
    box-shadow: inset 0 0 0 6px white;
    border: 2px solid #888;
  }
}
@-webkit-keyframes screen_before {
  5% {
    top: 1px;
    left: calc(50% - 2px);
    height: 4px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  7% {
    top: 1px;
    left: calc(50% - 2px);
    height: 4px;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  7% {
    top: calc(50% - 2px);
    left: calc(100% - 8px);
    height: 4px;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  10% {
    top: calc(50% - 2px);
    left: calc(100% - 8px);
    height: 4px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  20% {
    top: calc(50% - 2px);
    left: calc(100% - 8px);
    height: 4px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  25% {
    top: calc(50% - 6px);
    left: calc(100% - 6px);
    height: 12px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  35% {
    top: calc(50% - 6px);
    left: calc(100% - 6px);
    height: 12px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  40% {
    top: calc(50% - 2px);
    left: calc(100% - 8px);
    height: 4px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  50% {
    top: calc(50% - 2px);
    left: calc(100% - 8px);
    height: 4px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  52% {
    top: calc(50% - 2px);
    left: calc(100% - 8px);
    height: 4px;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  52% {
    top: 1px;
    left: calc(50% - 2px);
    height: 4px;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  55% {
    top: 1px;
    left: calc(50% - 2px);
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes screen_before {
  5% {
    top: 1px;
    left: calc(50% - 2px);
    height: 4px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  7% {
    top: 1px;
    left: calc(50% - 2px);
    height: 4px;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  7% {
    top: calc(50% - 2px);
    left: calc(100% - 8px);
    height: 4px;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  10% {
    top: calc(50% - 2px);
    left: calc(100% - 8px);
    height: 4px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  20% {
    top: calc(50% - 2px);
    left: calc(100% - 8px);
    height: 4px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  25% {
    top: calc(50% - 6px);
    left: calc(100% - 6px);
    height: 12px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  35% {
    top: calc(50% - 6px);
    left: calc(100% - 6px);
    height: 12px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  40% {
    top: calc(50% - 2px);
    left: calc(100% - 8px);
    height: 4px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  50% {
    top: calc(50% - 2px);
    left: calc(100% - 8px);
    height: 4px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  52% {
    top: calc(50% - 2px);
    left: calc(100% - 8px);
    height: 4px;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  52% {
    top: 1px;
    left: calc(50% - 2px);
    height: 4px;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  55% {
    top: 1px;
    left: calc(50% - 2px);
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@-webkit-keyframes screen_after {
  0% {
    width: 8px;
    height: 8px;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  7% {
    width: 8px;
    height: 8px;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  10% {
    width: 8px;
    height: 8px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  20% {
    width: 8px;
    height: 8px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  25% {
    width: 4px;
    height: 4px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  35% {
    width: 4px;
    height: 4px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  40% {
    width: 8px;
    height: 8px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  50% {
    width: 8px;
    height: 8px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  55% {
    width: 8px;
    height: 8px;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  100% {
    width: 8px;
    height: 8px;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
}
@keyframes screen_after {
  0% {
    width: 8px;
    height: 8px;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  7% {
    width: 8px;
    height: 8px;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  10% {
    width: 8px;
    height: 8px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  20% {
    width: 8px;
    height: 8px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  25% {
    width: 4px;
    height: 4px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  35% {
    width: 4px;
    height: 4px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  40% {
    width: 8px;
    height: 8px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  50% {
    width: 8px;
    height: 8px;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  55% {
    width: 8px;
    height: 8px;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  100% {
    width: 8px;
    height: 8px;
    -webkit-transform: scale(0);
            transform: scale(0);
  }
}
@-webkit-keyframes body {
  0% {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
  }
  5% {
    -webkit-transform: scaleY(0);
            transform: scaleY(0);
  }
  50% {
    -webkit-transform: scaleY(0);
            transform: scaleY(0);
  }
  55% {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
  }
}
@keyframes body {
  0% {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
  }
  5% {
    -webkit-transform: scaleY(0);
            transform: scaleY(0);
  }
  50% {
    -webkit-transform: scaleY(0);
            transform: scaleY(0);
  }
  55% {
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
  }
}

.device {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-animation-name: device;
          animation-name: device;
margin-top: 50px;
    height: 120px;
}
.device *::before,
.device *::after {
  position: absolute;
  content: '';
}
.device,
.device *,
.device *::before,
.device *::after {
  -webkit-animation-duration: 12s;
          animation-duration: 12s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}
.device__screen {
  position: relative;
  margin: 0 0 2px;
  background: #444;
  width: 160px;
  height: 110px;
  border-radius: 6px;
  box-shadow: inset 0 0 0 6px white;
  border: 2px solid #888;
  -webkit-animation-name: screen;
          animation-name: screen;
}
.device__screen::before {
  width: 4px;
  height: 4px;
  border-radius: 4px;
  background: #888;
  top: 1px;
  left: calc(50% - 2px);
  -webkit-animation-name: screen_before;
          animation-name: screen_before;
}
.device__screen::after {
  border-radius: 100%;
  border: 2px solid #888;
  width: 8px;
  height: 8px;
  top: calc(50% - 4px);
  left: 1px;
  -webkit-animation-name: screen_after;
          animation-name: screen_after;
}
.device__body {
  position: relative;
  width: 180px;
  height: 6px;
  background: white;
  border-radius: 6px;
  border: 2px solid #888;
  -webkit-animation-name: body;
          animation-name: body;
}
.device__body::before {
  top: -2px;
  left: calc(50% - 13px);
  width: 26px;
  height: 2px;
  border-radius: 0 0 6px 6px;
  border: 2px solid #888;
}

h4.responsive-gadgets-change {
    text-align: center;
    padding-top: 30px;
}


.new-nav-cta {
    background-color: #e4f2f9;
}

.new-nav-cta .btn-container {
    padding-top: 25px;
}

.new-nav-cta .cp-btns {
    background-color: #5babd2;
    margin: 50px auto;
}

/* To allow Mega Menu's long sub-menu to scroll on mobile devices */

@media only screen and (max-width:767px) {
.navbar-fixed-top {
    position:relative;
}
}

.nav-image   {
    margin-top: 30px;
    border: 3px solid #476675;
}


.new-nav-cta .btn-container {
   padding-top: 25px;
}

.new-nav-cta {
    background-color: #e4f2f9 !important;
}

@media only screen and (max-width:767px) {
.new-nav-cta {
    background-color: transparent !important;
}

.new-nav-cta .btns {
   padding:0 10px;
}

}

.new-nav-cta .btns {
   background-color: #5babd2;
}

h4.responsive-gadgets-change {
    text-align: center;
}

/* Nav for pages */

.page-template .navbar-default,
.blog .navbar-default,
.single-post .navbar-default {
    background: linear-gradient(90deg, rgb(63, 48, 80) 0%, rgba(88, 169, 212, 0.7) 25%, rgba(88, 169, 212, 0.7) 75%, rgb(60, 48, 80) 100%);
    height: 40px;
}

/* Footer  */

    
#footer-sidebar3  a:visited { 
   color:#337ab7;
}


#customizepress-footer  {
	background: #262626;
	background-image: -moz-linear-gradient(45deg, #3f3251 2%, #002025 100%);
	background-image: -webkit-linear-gradient(45deg, #3f3251 2%, #002025 100%);
	background-image: linear-gradient(45deg, #3f3251 2%, #002025 100%);
	margin-top:0px;
	font-size:1.5rem;
	margin-bottom:-25px;
}


#footer-sidebar  {
	border:none;
	box-sizing:border-box;
	height:280px;
}

#footer-sidebar1, #footer-sidebar2, #footer-sidebar3  {	
	width:100%;	
	color: #888;
        line-height:1.7;
	margin: 0 0 30px;
}

#footer-sidebar ol, 
#footer-sidebar ul {
    padding: 0;
    list-style-type: none;
}

footer .textwidget li {
    border-bottom: 1px dotted rgb(60, 60, 60);
    padding: 0 0 15px;
    margin-bottom: 15px;
}

footer .textwidget li:last-child {
    border:none;
}

#customizepress-footer .widget-title {
    color: #ccc;
    font-size: 17px;
    font-weight: 400;
    line-height: 24px;
    text-transform: uppercase;
    padding-bottom: 15px;
    padding-left:0;
    margin-top:30px;
}

.menu-footer-navigation-container ul {
	list-style:outside none none;
	margin-left:0;
	padding:0;
}

.menu-footer-navigation-container ul {
	color:#888888;
	line-height:1.7;
}

.menu-footer-navigation-container a:hover {
	color:#32CB8E;
	text-decoration:none;
}

.menu-footer-navigation-container li a {
    border-bottom: 1px dotted rgb(60, 60, 60);
    display: block;
    padding: 4px 0 6px 5px;
    color:#888888;
}

.footer-logo {
  display:none;
}


ul.location-list li span.location-name {
  color:darkseagreen;
  display: block;
  padding-bottom: 10px;
}

ul.location-list li span.get-direction {
  display: block;
  padding-top: 10px;
}

ul.location-list li span.location-name a {
  color:darkseagreen;
}

.powered-customizepress {
    color: #777;
}


/* Footer Socia Media Bar Area  */

.social-bar {
background-color: #2c2c2c;
    height: 60px;
    width: 100%;
    padding-top: 20px;
    text-align: center;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.03) 25%, rgba(255, 255, 255, 0.03) 75%, rgba(255, 255, 255, 0) 100%);
}


/* Wrapper */
.icon-button {
	border-radius: 2.6rem;
	cursor: pointer;
	display: inline-block;
	font-size: 3.3rem;
	height: 2.6rem;
	line-height: 2.6rem;
	margin: 0 25px;
	position: relative;
	text-align: center;
	-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
	width: 2.6rem;
top: -3px;
}

/* Circle */

.icon-button span {
	border-radius: 0;
	display: block;
	height: 0;
	left: 50%;
	margin: 0;
	position: absolute;
	top: 50%;
	-webkit-transition: all 0.3s;
	   -moz-transition: all 0.3s;
	     -o-transition: all 0.3s;
	        transition: all 0.3s;
	
}

.icon-button:hover span {
	width: 5.7rem;
	height: 5.7rem;
	border-radius: 5.7rem;
	margin: -2.8rem;
	
}

/* Icons */

.icon-button i {
	background: none;
	color: white;
	height: 2.6rem;
	left: 0;
	line-height: 2.6rem;
	position: absolute;
	top: 0;
	-webkit-transition: all 0.3s;
	   -moz-transition: all 0.3s;
	     -o-transition: all 0.3s;
	        transition: all 0.3s;
	width: 2.6rem;
	z-index: 10;
}

.twitter span {
	background-color: #4099ff;
}
.facebook span {
	background-color: #3B5998;
}
.google-plus span {
	background-color: #db5a3c;
}
.tumblr span {
	background-color: #34526f;
}
.instagram span {
	background-color: #517fa4;
}
.youtube span {
	background-color: #bb0000;
}
.yelp span {
	background-color: #cb2027;
}


.icon-button .fa-twitter {
	color: #4099ff;
	
}
.icon-button .fa-facebook {
	color: #3B5998;
}
.icon-button .fa-tumblr {
	color: #34526f;
}
.icon-button .fa-linkedin {
	color: #db5a3c;
}
.icon-button .fa-instagram {
	color: #517fa4;
}
.icon-button .fa-youtube {
	color: #bb0000;
}

.icon-button .fa-yelp {
	color: #cb2027;
}

.icon-button:hover .fa-twitter,
.icon-button:hover .fa-facebook,
.icon-button:hover .fa-linkedin,
.icon-button:hover .fa-tumblr,
.icon-button:hover .fa-instagram,
.icon-button:hover .fa-youtube,
.icon-button:hover .fa-yelp {
	color: white;
	text-decoration:none;
}


/* Footer Copyright Area  */

.copyright-bar  {
	color:#555;
	margin:0 auto;
	text-align:center;
	padding:30px 10px;
}

/* Plugins */

.agoogle-review-link a {
    color: #8a6869;
}

body:not(.page-id-2264) .grecaptcha-badge {
visibility: hidden;
opacity: 0;
}

/* Front Page */


.home #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-current-menu-item > a.mega-menu-link {
    border-color: transparent;
}


body .vertical-centered-box {
  position: absolute;
  width: 100%;
  height: 100%;
  text-align: center;
}
body .vertical-centered-box:after {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -0.25em;
}
body .vertical-centered-box .content {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  vertical-align: middle;
  text-align: left;
  font-size: 0;
}

#particles-background,
#particles-foreground {
  left: -51%;
  top: -51%;
  width: 202%;
  height: 202%;
  -webkit-transform: scale3d(0.5, 0.5, 1);
  -moz-transform: scale3d(0.5, 0.5, 1);
  -ms-transform: scale3d(0.5, 0.5, 1);
  -o-transform: scale3d(0.5, 0.5, 1);
  transform: scale3d(0.5, 0.5, 1);
}
#particles-background {
  background: #2c2d44;
  background-image: -moz-linear-gradient(45deg, #3f3251 2%, #002025 100%);
  background-image: -webkit-linear-gradient(45deg, #3f3251 2%, #002025 100%);
  background-image: linear-gradient(45deg, #3f3251 2%, #002025 100%);
  z-index:-1;
}

lesshat-selector {
  -lh-property: 0; } 
@-webkit-keyframes rotate{ 0% { -webkit-transform: rotate(0deg);} 100% { -webkit-transform: rotate(360deg);}}
@-moz-keyframes rotate{ 0% { -moz-transform: rotate(0deg);} 100% { -moz-transform: rotate(360deg);}}
@-o-keyframes rotate{ 0% { -o-transform: rotate(0deg);} 100% { -o-transform: rotate(360deg);}}
@keyframes rotate{ 0% {-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-ms-transform: rotate(0deg);transform: rotate(0deg);} 100% {-webkit-transform: rotate(360deg);-moz-transform: rotate(360deg);-ms-transform: rotate(360deg);transform: rotate(360deg);}}
[not-existing] {
  zoom: 1;
}
lesshat-selector {
  -lh-property: 0; } 
@-webkit-keyframes fade{ 0% { opacity: 1;} 50% { opacity: 0.25;}}
@-moz-keyframes fade{ 0% { opacity: 1;} 50% { opacity: 0.25;}}
@-o-keyframes fade{ 0% { opacity: 1;} 50% { opacity: 0.25;}}
@keyframes fade{ 0% { opacity: 1;} 50% { opacity: 0.25;}}
[not-existing] {
  zoom: 1;
}
lesshat-selector {
  -lh-property: 0; } 
@-webkit-keyframes fade-in{ 0% { opacity: 0;} 100% { opacity: 1;}}
@-moz-keyframes fade-in{ 0% { opacity: 0;} 100% { opacity: 1;}}
@-o-keyframes fade-in{ 0% { opacity: 0;} 100% { opacity: 1;}}
@keyframes fade-in{ 0% { opacity: 0;} 100% { opacity: 1;}}
[not-existing] {
  zoom: 1;
}

/* content over particles background */

.overlap-content {
    height: 600px;
    padding-top:170px;
  -webkit-flex-flow: column wrap;
  -ms-flex-flow: column wrap;
  flex-flow: column wrap;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack:center;
  -webkit-justify-content:center;
  -ms-flex-pack:center;
  justify-content:center;
}

.vertical-center {
	text-align: center;
	position: relative;
	color:#fff;
}

.overlap-content h1 {
	font-size:5rem;
	text-shadow: 0px 1px 0px #c0c0c0, 0px 2px 0px #b0b0b0, 0px 3px 0px #a0a0a0, 0px 4px 0px #909090, 0px 5px 10px rgba(0, 0, 0, 0.6);
	color: #fff;
}

.overlap-content p {
	font-size:2.0rem;
	color: aquamarine;
}

.main-wrapper-head {
  width: 100%;
  max-width: 900px;
  margin: 100px auto;
  text-align: center;
}

.cp-badge {
  position: relative;
  margin: 1.5em 3em;
  width: 4em;
  height: 6.2em;
  border-radius: 10px;
  display: inline-block;
  top: 0;
  transition: all 0.2s ease;
}
.cp-badge:before, .cp-badge:after {
  position: absolute;
  width: inherit;
  height: inherit;
  border-radius: inherit;
  background: inherit;
  content: "";
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}
.cp-badge:before {
  transform: rotate(60deg);
}
.cp-badge:after {
  transform: rotate(-60deg);
}
.cp-badge:hover {
  top: -4px;
}
.cp-badge .circle {
  width: 60px;
  height: 60px;
  position: absolute;
  background: #fff;
  z-index: 10;
  border-radius: 50%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}
.cp-badge .circle i.fa {
  font-size: 2em;
  margin-top: 8px;
}
.cp-badge .font {
  display: inline-block;
  margin-top: 1em;
}
.cp-badge .ribbon {
	position: absolute;
	border-radius: 4px;
	padding: 2px 5px 2px;
	width: 100px;
	z-index: 11;
	color: #fff;
	bottom: 12px;
	left: 50%;
	margin-left: -50px;
	font-size: 14px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.27);
	text-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);
	text-transform: uppercase;
	background: linear-gradient(to bottom right, #555 0%, #333 100%);
}


.teal {
  background: linear-gradient(to bottom right, #4DB6AC 0%, #00796B 100%);
  color: #34a297;
}

.blue {
  background: linear-gradient(to bottom right, #4FC3F7 0%, #2196F3 100%);
  color: #259af3;
}

.blue-dark {
  background: linear-gradient(to bottom right, #1976D2 0%, #283593 100%);
  color: #1c68c5;
}

.gold {
    background: linear-gradient(to bottom right, #e2cdfa 0%, #684f84 100%);
    color: #684f84;
}

.social-head {
  text-align: center;
  margin: 50px auto;
}
.social-head a {
	text-decoration: none;
	display: inline-block;
	width: 45px;
	height: 45px;
	border-radius: 50%;
	background: #ffffff0d;
	border: .5px dashed #f8f8f8;
	color: #999;
	margin: 5px;
}
.social-head a:hover {
  background: #222;
}
.social-head a .icons {
  margin-top: 12px;
  display: inline-block;
  font-size: 20px;
}

/* HP - Featurettes / Competitive advantages / Testimonials */

.competition-circle-wrapper {
    display: inline-block;
    margin-right: 25px;
    margin-bottom: 100px;
    float: left;

}

.competitive-icon {
   font-size: 25px;
    background: #eaf9ff;
    padding: 20px;
    -webkit-border-radius: 1100%;
    -moz-border-radius: 100%;
    -o-border-radius: 100%;
    border-radius: 100%;
    border: 3px solid #ffffff;
    color: #3cb8fa;
    box-shadow: 0 1px 10px rgba(0, 0, 0, 0.46);
    text-align: center;
    display: table-cell;
    vertical-align: middle;
    width: 30px;
    height: 30px;
    -moz-transition: .5s;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
}

.fix-editor {
    display: none;
}

.competition-content {
	color: #fff;
	padding-right: 30px;
	margin-bottom: 70px;
    
}

.first-cc {
	margin-top: -20px;
}

.last-cc p {
    border-bottom: none;
}

.competitive-advantages h2 {
    font-size: 18px;
    text-transform: uppercase;
}

.competitive-advantages .cp-content p {
}


/* Awards & Testimonials */


section.competitive-advantages {
    padding: 0 0 50px;
    margin-top:50px;
}

.competitive-advantages .cp-content {
    padding: 0 50px;
}

.testimonials-home {
    border: 1px ridge #ececec;
    height: 450px;
}

.testimonials-home p {
	padding-bottom:15px;
}


.testimonials-home .first-letter {
    font-size: 2.5em;
    line-height: .5;
    position: relative;
    top: 10px;
}

.testimonials-home img {
	border: 5px solid #fff;
	margin-top: 50px;
	width:100%;
	max-width: 150px;

}

.strong-rating span.star {
    display: inline-block;
    margin: 0;
    max-height: none;
    max-width: none;
    padding: 0;
}

.strong-rating span.star:before {
    color: #FFB900;
}

span.star:before {
    font-family: FontAwesome;
    content: "\f005";
    display: inline-block;
    font-size: 1.25em;
    padding: 0 4px;
    transition: color 0.3s ease;
}

.testimonial-name {
    margin: 10px 0;
    padding-top: 15px;
}

img.best-website-badge {
	border: none;
	margin-top: 40px;
	border-top: 1px solid #e8e8e8;
	padding-top: 30px;
}


.powered-by-google {
    text-align: center;
    background: #eaf9ff;
    padding: 10px;
    margin-bottom: 130px;
    border: 1px solid #ececec;
    border-top: none;
}



/* CTA Button - Animated */

.cta-btn {
  background-color: #f9f9f9;
  width:100%;
  height:100px;
}

.btn-container {
  text-align: center;
  margin-top: 50px;
}

.cp-btns {
  height: 50px;
  line-height: 50px;
  background-color: #5babd2;
  border-radius: 8px;
  color: #fff;
  font-weight: normal;
  text-decoration: none;
  text-align: center;
  display: inline-block;
  position: relative;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px transparent;
  -webkit-transform: translateY(-6px);
  -ms-transform: translateY(-6px);
  transform: translateY(-6px);
  -webkit-animation-name: hover;
  animation-name: hover;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
	padding: 0 70px;
	text-transform: uppercase;
}

@media only screen and (max-width:385px) {
.cp-btns  {
font-size: 16px;
}
}


.cp-btns:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: '';
  top: 100%;
  left: 5%;
  height: 10px;
  width: 90%;
  opacity: 0;
  background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.35) 0%, transparent 80%);
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform, opacity;
  transition-property: transform, opacity;
  opacity: .4;
  -webkit-transform: translateY(6px);
  -ms-transform: translateY(6px);
  transform: translateY(6px);
  -webkit-animation-name: hover-shadow;
  animation-name: hover-shadow;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-delay: .3s;
  animation-delay: .3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
}
.cp-btns:hover {
	background-color: #4990b5;
	color: #fff;
	text-decoration: none;
	transition: 1s all;
}

@keyframes hover {
  50% {
    -webkit-transform: translateY(-3px);
    -ms-transform: translateY(-3px);
    transform: translateY(-3px);
  }
  100% {
    -webkit-transform: translateY(-6px);
    -ms-transform: translateY(-6px);
    transform: translateY(-6px);
  }
}
@-webkit-keyframes hover-shadow {
  0% {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
    opacity: .4;
  }
  50% {
    -webkit-transform: translateY(3px);
    transform: translateY(3px);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
    opacity: .4;
  }
}
@keyframes hover-shadow {
  0% {
    -webkit-transform: translateY(6px);
    -ms-transform: translateY(6px);
    transform: translateY(6px);
    opacity: .4;
  }
  50% {
    -webkit-transform: translateY(3px);
    -ms-transform: translateY(3px);
    transform: translateY(3px);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(6px);
    -ms-transform: translateY(6px);
    transform: translateY(6px);
    opacity: .4;
  }
}
@-webkit-keyframes hover {
  50% {
    -webkit-transform: translateY(-3px);
    transform: translateY(-3px);
  }
  100% {
    -webkit-transform: translateY(-6px);
    transform: translateY(-6px);
  }
}
@keyframes hover {
  50% {
    -webkit-transform: translateY(-3px);
    -ms-transform: translateY(-3px);
    transform: translateY(-3px);
  }
  100% {
    -webkit-transform: translateY(-6px);
    -ms-transform: translateY(-6px);
    transform: translateY(-6px);
  }
}

/* banner image */

section.hp-portfolio {
    background: #fff;
}

section.hp-portfolio img {
    width: 100%;
}


/* responsive gadget */

.responsive-parallax-display {
    padding: 50px;
    background: #f0f0f0;
    background: -moz-linear-gradient(-45deg, #f0f0f0 30%, #cadae5 100%);
    background: -webkit-linear-gradient(-45deg, #f0f0f0 30%, #cadae5 100%);
    background: linear-gradient(135deg, #f0f0f0 30%, #cadae5 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0f0f0', endColorstr='#cadae5',GradientType=1 );
    background-blend-mode: screen;
    margin: 0 0 50px;
}

.responsive-parallax-display h3 {
	text-align:center;
	font-size: 18px;
	margin-top: 0;
	color: #84787d;
}


/* Responsive gadget */


.service-graphic {
  font-size: 8px;
  padding: 1em;
  position: relative;
  margin:50px auto 100px;
  
}
@media screen and (min-width: 38em) {
  .service-graphic {
    font-size: 12px;
  }
}
.service-graphic .monitor {
  width: 28.75em;
  height: 17.5em;
  position: relative;
  background: #f8f8f8;
  border: 0.625em solid #1f1f1f;
  border-radius: 0.625em;
  border: 1.25em solid #1f1f1f;
  margin: 0 auto;
}
@media screen and (min-width: 38em) {
  .service-graphic .monitor {
    border: 1.25em solid #1f1f1f;
  }
}
.monitor > div {
  position: absolute;
}
.monitor:before,
.monitor:after,
.laptop:before {
  content: "";
  position: absolute;
  left: 50%;
}
.monitor:before,
.laptop:before {
  top: -0.25em;
  margin: -0.188em 0 0 -0.188em;
  width: 0.25em;
  height: 0.25em;
  border-radius: 0.25em;
  background: #d8dbe1;
  top: -0.625em;
}
.screen:after {
  width: 0.5em;
  height: 0.5em;
  border-radius: 0.5em;
  margin: 0 0 -0.25em -0.25em;
  background: #e8ebf0;
  bottom: -0.625em;
}
.monitor .content {
  width: 26.25em;
  height: 15em;
  left: 50%;
  margin-left: -13.125em;
  overflow: hidden;
  background: #f2f9ff;
}
.monitor .content:before,
.laptop .screen:before,
.phone .screen:before,
.ipad .screen:before {
  content: "";
  position: absolute;
  right: -5.625em;
  width: 12.5em;
  height: 18.75em;
  transform: rotate(45deg);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%);
  z-index: 5;
}
.browser {
	width: 15em;
	height: 11.25em;
	position: absolute;
	left: 50%;
	top: 50%;
	margin: -5.625em 0 0 -7.5em;
	background: #fffdef;
	border: 1px solid #f3eed7;
	border-top: 1.25em solid #e2daa1;
	border-radius: 0.313em;
}
.browser-content {
  overflow: hidden;
  height: 9.938em;
}
.btns {
  position: absolute;
  top: -1.25em;
  left: 0.438em;
}
.btns:before {
  content: "";
  position: absolute;
  left: 2.188em;
  top: 0.313em;
  height: 0.625em;
  width: 11.563em;
  background: #fff;
  border-radius: 3px;
}
.btns > li {
  display: inline-block;
  vertical-align: middle;
  list-style: none;
  width: 0.313em;
  height: 0.313em;
  border-radius: 0.313em;
  background: #f8f8f8;
  margin-right: 0.25em;
}
.screen .txt {
  margin: 0.625rem auto;
  width: 85%;
  text-align: center;
  font-size: 0;
}
.screen .txt > li {
  background: #aed0e4;
  width: 100%;
  height: 0.938em;
  margin-bottom: 0.363em;
  font-size: 1rem;
}
.screen .txt > li.big {
  height: 3.75em;
}
.screen .txt,
.phone .txt {
  animation: scroll 4s 1s cubic-bezier(0.25, 0.1, 0.25, 1) infinite;
}
@keyframes scroll {
  20%,
  60% {
    transform: translateY(-62%);
  }
  80% {
    margin-top: -50px;
  }
}
.screen .txt > .third {
  height: 2.25em;
  width: 30%;
  margin-right: 5%;
  display: inline-block;
}
.screen .txt > li:nth-child(5),
.screen .txt > li:nth-child(10),
.screen .txt > li:nth-child(13),
.screen .txt > li:nth-child(18),
.screen .txt > li:nth-child(21) {
  margin-right: 0;
}
.base {
  width: 5.625em;
  height: 3.1em;
  bottom: -3.9em;
  left: 50%;
  margin-left: -2.8125em;
  background: #e8ebf0;
  bottom: -4.3em;
  z-index: -1;
}
.base:before,
.base:after,
.grey-shadow:before,
.grey-shadow:after {
  content: "";
  position: absolute;
  top: 0;
}
.base:before {
  border-left: 0.813em solid transparent;
  border-right: 0px solid transparent;
  border-bottom: 3.125em solid #e8ebf0;
  left: -0.77em;
}
.base:after {
  border-right: 0.813em solid transparent;
  border-left: 0px solid transparent;
  border-bottom: 3.125em solid #e8ebf0;
  right: -0.77em;
}
.base > div {
  position: absolute;
}
.grey-shadow {
  width: 5.625em;
  height: 0.75em;
  background: #d8dbe1;
  top: 0;
}
.grey-shadow:before {
  border-left: 3px solid transparent;
  border-right: 0px solid transparent;
  border-bottom: 0.75em solid #d8dbe1;
  left: -3px;
}
.grey-shadow:after {
  border-right: 3px solid transparent;
  border-left: 0px solid transparent;
  border-bottom: 0.75em solid #d8dbe1;
  right: -2px;
  z-index: 1;
}
.foot {
  background: #e8ebf0;
}
.foot.top {
  width: 7.25em;
  height: 0.313em;
  bottom: -0.3em;
  left: 50%;
  margin-left: -3.625em;
}
.foot.top:before,
.foot.top:after,
.foot.bottom:before {
  content: "";
  position: absolute;
  top: 0px;
}
.foot.top:before {
  border-left: 16px solid transparent;
  border-right: 0px solid transparent;
  border-bottom: 5px solid #e8ebf0;
  left: -16px;
}
.foot.top:after {
  border-right: 1em solid transparent;
  border-left: 0px solid transparent;
  border-bottom: 5px solid #e8ebf0;
  right: -1em;
}
.foot.bottom {
  width: 9.375em;
  height: 0.313em;
  bottom: -0.625em;
  left: 50%;
  margin-left: -4.688em;
}
.laptop {
  width: 14.688em;
  height: 9.688em;
  background: #f8f8f8;
  border: 0.75em solid #1f1f1f;
  border-radius: 0.625em 0.625em 0 0;
  position: absolute;
  top: 14.5em;
  right: 1.875em;
  right: 50%;
  margin-right: -19.5em;
  z-index: 10;
}
.laptop:before {
  top: -0.3em;
}
.laptop > div {
  position: absolute;
}
.laptop > .screen {
  width: 13.188em;
  height: 8.188em;
  left: 0;
  margin-left: 0;
  background: #f4fffe;
  overflow: hidden;
}
.btm {
  width: 18.5em;
  height: 0.625em;
  bottom: -1.188em;
  left: 50%;
  margin-left: -9.25em;
  border-radius: 0 0 20px 20px;
  background: #1f1f1f;
  z-index: 1;
}
.btm:before {
  content: "";
  position: absolute;
  width: 2.625em;
  height: 0.25em;
  left: 50%;
  top: 0;
  margin-left: -1.313em;
  border-radius: 0 0 0.313em 0.313em;
  background: #d8dbe1;
}
.btm:after {
  display: none;
  content: "";
  position: absolute;
  width: 100%;
  height: 0.25rem;
  background: #bababa;
  top: 0.5rem;
  border-bottom-right-radius: 7.5rem 2.5rem;
  border-bottom-left-radius: 7.5rem 2.5rem;
}
.phone {
  width: 4.125em;
  height: 8.75em;
  position: absolute;
  top: 15.75em;
  left: 1em;
  left: 50%;
  margin-left: -20.5em;
  border-radius: 0.5em;
  background: #1f1f1f;
  border: 1.563em solid #1f1f1f;
  border-left: 0.313em solid #1f1f1f;
  border-right: 0.313em solid #1f1f1f;
  margin-left: ;
}
.phone:before,
.phone:after {
  content: "";
  position: absolute;
  left: 50%;
  background: #e8ebf0;
}
.phone:before {
  background: #474e5d;
  width: 1.25em;
  height: 0.25em;
  margin-left: -0.625em;
  top: -0.75em;
  border-radius: 2px;
}
.phone:after {
  width: 0.625em;
  height: 0.625em;
  border-radius: 0.625em;
  bottom: -1.125em;
  margin-left: -0.313em;
}
.phone .screen {
  width: 3.5em;
  height: 5.625em;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  background: #fffdef;
}
.phone .txt > li {
  height: 1.125em;
}
.screen .txt > li.txt-half {
  width: 46%;
  margin-right: 8%;
  display: inline-block;
}
.screen .txt > li.txt-half:nth-of-type(even) {
  margin-right: 0;
}
.ipad {
  width: 8.75em;
  height: 12.75em;
  position: absolute;
  top: 11.7em;
  left: 6em;
  left: 50%;
  margin-left: -15.5em;
  border-radius: 0.5em;
  background: #1f1f1f;
  border: 1.563em solid #1f1f1f;
  border-left: 0.313em solid #1f1f1f;
  border-right: 0.313em solid #1f1f1f;
}
.ipad:before,
.ipad:after {
  content: "";
  position: absolute;
  left: 50%;
  background: #e8ebf0;
}
.ipad:before {
  background: #474e5d;
  width: 1.25em;
  height: 0.25em;
  margin-left: -0.625em;
  top: -0.75em;
  border-radius: 2px;
}
.ipad:after {
  width: 0.625em;
  height: 0.625em;
  border-radius: 0.625em;
  bottom: -1.125em;
  margin-left: -0.313em;
}
.ipad .screen {
  width: 8em;
  height: 9.8em;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  background: #fff6f4;
}
.ipad .content {
  width: 100%;
  left: 0%;
  margin-left: 0px;
}
.ipad li.txt-half {
  height: 35px;
}


/* shakey btns */


.btn-fade, .btn-bounce, .btn-overlay, .btn-shake {
  border: none;
  display: block;
  max-width: 300px;
  width: 100%;
  padding: 20px;
  color: #796b6f;
  margin-bottom: 30px;
  transform-style: preserve-3d;
  cursor: pointer;
  border-radius: .27em;
  box-shadow: 0px 5px 24px rgba(34, 34, 34, 0.3);
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 1.5rem;
  font-weight: 400;
  margin-left: auto;
  margin-right: auto;
}
.btn-fade:focus, .btn-bounce:focus, .btn-overlay:focus, .btn-shake:focus {
  outline: none;
}

.hp-button-group {
  margin-top: 50px;
  margin-left: auto;
  margin-right: auto;
  text-align:center;
}
.hp-button-group h1 {
  margin-bottom: 70px;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-family: 'Lato', sans-serif;
  font-size: 2.4em;
  font-weight: 200;
}

.rotate {
  padding-top: 15px;
  max-width: 300px;
  margin-left: auto;
  margin-right: auto;
}

.btn-fade {
  background: #fffdf1;
}
.btn-fade:hover {
  background: #fbf6da;
  transition: 300ms ease-in;
}
.btn-bounce {
  background: #f2f9ff;
}
.btn-bounce:hover {
  animation: bounce 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}
.btn-overlay {
  background: #f4fffe;
  position: relative;
  overflow: hidden;
}
.btn-overlay:after {
  content: '';
  position: absolute;
  width: 115%;
  height: 200px;
  background: #affff8;
  transform: translateY(-45%) skew(25deg) scale(0);
  left: -5%;
  transition: 200ms ease-in-out;
}
.btn-overlay:hover:after {
  transform: translateY(-45%) skew(25deg) scale(1);
}
.btn-overlay span {
  position: relative;
  z-index: 1;
}
.btn-shake {
  background: #fff6f4;
}
.btn-shake:hover {
  animation: shake 100ms linear;
  animation-iteration-count: 5;
}

@keyframes bounce {
  from {
    transform: scale(1.1);
  }
  to {
    transform: scale(1);
  }
}
@keyframes shake {
  from {
    transform: rotate(5deg);
  }
  to {
    transform: rotate(0);
  }
}

/* paragraph why choose us */


.hp-paragraph h2 {
  position: relative;
  font-family: 'Open Sans', sans-serif;
  font-size: 1em;
  font-weight: 400;
  text-transform: uppercase;
  color: #959595;
}
.hp-paragraph h2:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -10px;
  border-bottom: 3px solid #e2cef9;
  width: 30px;
}

.hp-paragraph ul {
  list-style: none;
  margin: 4em 0 0;
  padding: 0;
}
.hp-paragraph ul::after {
  clear: both;
  content: "";
  display: table;
}
.hp-paragraph ul li {
  margin-bottom: 2em;
}
@media only screen and (min-width: 700px) {
 .hp-paragraph ul li {
    float: left;
    width: 47.5%;
    margin-right: 5%;
  }
 .hp-paragraph ul li:nth-child(2n) {
    margin-right: 0;
  }
}
.hp-paragraph ul li h3 {
	position: relative;
	z-index: 1;
	margin: 0;
	line-height: 2.5em;
	font-weight: 300;
	letter-spacing: 1px;
}
.hp-paragraph ul li h3:before {
  content: "";
  position: absolute;
  z-index: -1;
  background-color: #e2cef9;
  width: 2.5em;
  height: 2.5em;
  border-radius: 50%;
}
.hp-paragraph ul li h3 span {
  padding-left: 15px;
}
.hp-paragraph ul li p {
	padding-left: 15px;
    line-height: 1.6875em;
    padding: 20px 0 0;
    border-bottom: none;
}

/* Home Page Blog Section */

.blog-section {
	box-sizing: border-box;
	font-size: 14px;
	font-weight: 400;
	padding: 100px 0;
	background: #f0f0f0;
    background: -moz-linear-gradient(-45deg, #f0f0f0 30%, #cadae5 100%);
    background: -webkit-linear-gradient(-45deg, #f0f0f0 30%, #cadae5 100%);
    background: linear-gradient(135deg, #f0f0f0 30%, #cadae5 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0f0f0', endColorstr='#cadae5',GradientType=1 );
    background-blend-mode: screen;
}


.u-clearfix:before,
.u-clearfix:after {
  content: " ";
  display: table;
}

.u-clearfix:after {
  clear: both;
}

.u-clearfix {
  *zoom: 1;
}

.subtle {
  color: #aaa;
}

.card-container {
  margin: 25px auto 0;
  position: relative;
  width: 100%;
}

.card {
  background-color: #fff;
  padding: 30px;
  position: relative;
  box-shadow: 0 0 5px rgba(75, 75, 75, .07);
  z-index: 1;
}

.card-body {
  display: inline-block;
  float: left;
}

.card-number {
  margin-top: 15px;
}

.card-circle {
  border: 1px solid #FFC107;
  border-radius: 50%;
  display: inline-block;
  line-height: 22px;
  font-size: 12px;
  height: 25px;
  text-align: center;
  width: 25px;
  color: #FF5722;
}

.card-author {
  display: block;
  font-size: 12px;
  letter-spacing: .5px;
  margin: 15px 0 0;
  text-transform: uppercase;
}

.card-title {
	font-size: 22px;
	font-weight: 300;
	margin: 10px 0;
}

.card-title h2 {
    font-size: 14px;
}

.card-description {
  display: inline-block;
  font-weight: 300;
  line-height: 22px;
  margin: 10px 0;
}

.card-read {
  cursor: pointer;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 6px;
  margin: 5px 0 20px;
  position: relative;
  text-align: right;
  text-transform: uppercase;
}

.card-read:after {
  background-color: #b8bddd;
  content: "";
  display: block;
  height: 1px;
  position: absolute;
  top: 9px;
  width: 65%;
}


.card-read a {
    text-decoration: none;
}


.card-tag {
  float: right;
  margin: 5px 0 0;
}

.card-media {
  float: right;
}

.card-shadow {
  background-color: #fff;
  box-shadow: 0 2px 25px 2px rgba(0, 0, 0, 1), 0 2px 50px 2px rgba(0, 0, 0, 1), 0 0 100px 3px rgba(0, 0, 0, .25);
  height: 1px;
  margin: -1px auto 0;
  width: 80%;
  z-index: -1;
}

/* homepage extra features */

section.second-section {
    padding-bottom: 70px;
    text-align:center;
}

.fa-round-wrapper {
    width: 95px;
    height: 95px;
    margin: 0 auto;
    border-radius: 100%;
    border:3px solid #ffffff;
    box-shadow: 0 1px 10px rgba(0, 0, 0, 0.46);
}

.fa-round-wrapper1 {
   background: #92D2D1;
}

.fa-round-wrapper2 {
   background: #9DAFD8;
}

.fa-round-wrapper3 {
   background: #A1E7A1;
}

.fa-round-wrapper4 {
   background: #FED2B1;
}

.fa-round-wrapper5 {
   background: #a3d7ef;
}

.fa-round-wrapper6 {
   background: #d19191;
}

.fa-round-wrapper i {
	font-size: 4rem;
	color: #fff;
	line-height: 2.3;
}

.design-features {
   margin-top:70px;
}

section.third-section {
   text-align:left;
   background:transparent;
}




/* CTA homepage */

.information h2{
  font-weight: 100;
  font-size: 30px;
  line-height: 1.3em;
  margin: 15px 0;
}

.information.message p {
    padding: 50px 0;
    color: #333333;
    text-shadow: 0 1px 0 #ebebeb;
}

div.message {
  position: relative;
    padding: 100px 0;
    margin: 0;
    box-shadow: 0 2px 5px rgba(0,0,0,.3);
    background: #BBB;
    color: #585858;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    text-align: center;
}
div.message:hover{
  box-shadow: 0 15px 20px rgba(10,0,10,.3);
  -webkit-filter: brightness(110%);
}

div.message:before{
  content: '';
    font-family: FontAwesome;
    position: absolute;
    display: block;
    top: -21px;
    left: 50%;
    margin: 0 -21px;
    font-size: 20px;
    text-align: center;
    padding: 10px;
    background: inherit;
    box-shadow: 0 3px 15px rgba(3, 169, 244, 0.33);
    color: rgb(255, 186, 0);
    border-radius: 50%;
    border: 2px inset #cbdce600;
    z-index: 2;
    width: 55px;
}

div.message.information:before{content:"\f2a0";}
div.message.information{background: #fff;}


/* Breadcrumbs */
       
    
.customizepress_header_breadcrum_title{
	margin: 50px auto 0;
    background: #eaf9ff;
    text-align: center;
    padding: 15px 15px 30px;
}

@media only screen and (max-width:767px)  {
	.customizepress_header_breadcrum_title{
              margin:0 auto;   
             padding-top:0;           
	}
}

.customizepress_header_breadcrum_title h1{
	color:#555;
}

.breadcrumb {
	font-size: 17px;
	padding: 0;
	position: relative;
	display: inline-block;
	background: none;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	list-style: none;
}

@media only screen and (max-width:767px)  {
.breadcrumb {
	font-size: 14px;
}
}

.breadcrumb li {
	display: inline-block;
}

.breadcrumb li a{
	color:#31A3DD;
}

.breadcrumb > .active {
	color: #000;
}

.breadcrumb > li + li:before {
	padding: 0 5px;
	color: #888;
	content: ">>";
}


/* Breadcrums title starts here */

.customizepress_header_breadcrum_title .products-pricing {
	display: block;
	width: 90%;
	height: auto;
	line-height: 50px;
	margin: 30px auto 20px;
	text-align:center;
	font-family: 'Quicksand', sans-serif;
	text-transform:uppercase;
	font-size: 3rem;
	border-top: none;
	border-bottom: none;
	cursor:pointer;
	user-select: none;
}



.customizepress_header_breadcrum_title .products-pricing span.light {
  color:#fefefe;
  text-shadow:
    0px 1px 0px #c0c0c0,
    0px 2px 0px #b0b0b0,
    0px 3px 0px #a0a0a0,
    0px 4px 0px #909090,
    0px 5px 10px rgba(0, 0, 0, 0.6);
}


.customizepress_header_breadcrum_title .products-pricing:active{
	line-height: 205px;
}

.customizepress_header_breadcrum_title .products-pricing:active span.light{
  color:#fefefe;
  text-shadow:
    0px 0px 0px #c0c0c0,
    0px 0px 0px #b0b0b0,
    0px 0px 0px #a0a0a0,
    0px 0px 0px #909090,
    0px 1px 3px rgba(0, 0, 0, 0.4);
}


/* Global Content - Pages */


.seperatorII {
    height: 3px;
    width: 70px;
    margin: 0 0 25px;
    background: #f88d5e;
}

.button-section {
    margin-top: 50px;
    margin-bottom: 50px;
}

.website-design .button-section .btn {
    padding: 12px 25px;
    font-size: 1.7rem;
    background-color: #459acc;
    color: #fff;
    text-shadow: none;
    border-bottom: none;
    border-width: 2px;
    border-style: outset;
    border-color: azure;
}

.cp-content .cta-button:before, .main-content .cta-button:before {
    content: "";
    z-index: -1;
    width: 100%;
    height: 0%;
    background: rgb(49, 122, 167);
    bottom: 0;
    left: 0;
    position: absolute;
    transition: height 250ms;
}
.website-design .clear-button {
    margin-left: 50px;
}

.new-page-align {
	padding: 50px;
}

.new-page-align h2:first-child {
    padding:0 0 10px 0;
    margin:0;
}

.new-page-align h2,
.new-page-align h1,
.new-page-align h4 {
    padding: 30px 0 0;
}

.new-page-align h2 {
   font-size:24px;
}

blockquote {
    border-left: 5px solid #8E55CE;
    margin: 40px auto;
    padding: 10px 30px;
    width:100%;
    background:#F1F1F2;    
    color: #364755;
	font-family: "Quicksand",Arial,sans-serif;
	font-size: 1.7rem;
	line-height: 1.5;
}

blockquote ol:last-child, blockquote p:last-child, blockquote ul:last-child {
    margin: 0 0 0 0;
}

blockquote.variation-one {
    border-left: 5px solid #8E55CE; 
}

blockquote.variation-two {
    border-left: 5px solid #FF7F00;   
}

blockquote.variation-three {
    border-left: 5px solid #38AB63; 
}

blockquote.variation-four {
    border-left: 5px solid #00D1FE;   
}

blockquote.variation-five {
    border-left: 5px solid #E03817;   
}


.page-ani-btn {
	margin: 50px auto;
}

.page-template .main-content {
    margin: 0 auto;
}

/* About Us Page */

.cool-container {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -moz-perspective: 1000px;
  -webkit-perspective: 1000px;
  perspective: 1000px;
margin: 50px 15px;
}

.render {
  align-self: center;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  -moz-transform: rotateX(50deg) rotateZ(0deg);
  -webkit-transform: rotateX(50deg) rotateZ(0deg);
  transform: rotateX(50deg) rotateZ(0deg);
  font-family: 'Kreon', serif;
  font-weight: 700;
  font-size: 4em;
  color: #f5f5f5;
  text-shadow: white 0.006em 0.006em 0.007em, #9c9c9c 1px 1px 1px, #9c9c9c 1px 2px 1px, #9c9c9c 1px 3px 1px, #9c9c9c 1px 4px 1px, #9c9c9c 1px 5px 1px, #9c9c9c 1px 6px 1px, #9c9c9c 1px 7px 1px, #9c9c9c 1px 8px 1px, #9c9c9c 1px 9px 1px, #9c9c9c 1px 10px 1px, #9c9c9c 1px 11px 1px, #9c9c9c 1px 12px 1px, rgba(16, 16, 16, 0.4) 1px 18px 6px, rgba(16, 16, 16, 0.2) 1px 22px 10px, rgba(16, 16, 16, 0.2) 1px 26px 35px, rgba(16, 16, 16, 0.4) 1px 30px 65px, white -0.15em -0.1em 100px;
}
.render:hover {
  margin-top: -20px;
  text-shadow: white 0.006em 0.006em 0.007em, #9c9c9c 1px 1px 1px, #9c9c9c 1px 2px 1px, #9c9c9c 1px 3px 1px, #9c9c9c 1px 4px 1px, #9c9c9c 1px 5px 1px, #9c9c9c 1px 6px 1px, #9c9c9c 1px 7px 1px, #9c9c9c 1px 8px 1px, #9c9c9c 1px 9px 1px, #9c9c9c 1px 10px 1px, #9c9c9c 1px 11px 1px, #9c9c9c 1px 12px 1px, rgba(16, 16, 16, 0.4) 1px 38px 26px, rgba(16, 16, 16, 0.2) 1px 42px 30px, rgba(16, 16, 16, 0.2) 1px 46px 65px, rgba(16, 16, 16, 0.4) 1px 50px 95px, white -0.15em -0.1em 100px;
}


.cp-testi-section {
    margin: 50px;
}



.cp-testi-section #testimonials {
  list-style: none;
  margin: 0;
  padding: 0;
border:none;
}
.cp-testi-section #testimonials li {
  position: relative;
  width: 100%;
  margin-bottom: 10px;
  float: left;
  background-color: #fff;
}
.cp-testi-section #testimonials li .insides {
  clear: both;
}
.cp-testi-section #testimonials li .insides .testimonial {
  position: relative;
  padding: 10px 15px 10px;
}
.cp-testi-section #testimonials li .insides .testimonial .name {
  display: block;
  font-size: 15px;
  line-height: 20px;
  font-weight: 700;
  margin-bottom: 5px;
  text-transform: uppercase;
  color: #e74c3c;
}
.cp-testi-section #testimonials li .insides .testimonial .text {
  display: block;
  color: #777;
  line-height: 20px;
  font-size: 13px;
  font-weight: 500;
}
.cp-testi-section #testimonials li .insides .photo {
  float: left;
  margin: 8px 10px;
}
.cp-testi-section #testimonials li .insides .photo img {
  max-width: 100px;
  border-radius: 100%;
  border: 2px solid transparent;
  -webkit-transition: border-color .3s ease;
  transition: border-color .3s ease;
}

ul#testimonials li::before {
    content: none;
}


/* Service Page */

.service-page {
            background-image: url("https://customizepress.ca/wp-content/uploads/2019/02/website-services-background.jpg");
            background-attachment: fixed;
            background-size: cover;
            padding:5% 0;
        }
        .service-page h1{
            color:#fff;
            font-size:35px;
            text-align: center;
            text-transform: capitalize;
        }
        .service-page .service_box{
            margin:20px 0;
            padding:40px 20px;
            text-align: center;
            border-radius:5px;
            background:rgba(59, 63, 66,0.7);
            transition: all 0.30s ease 0s;
        }
        .service-page .service_box:hover{
            background:#62a0bb;
        }
        .service-page .service_box .service_icon{
            width:70px;
            height:70px;
            margin: 0 auto;
            font-size:35px;
            background: #fff;
            line-height:70px;
            border-radius:50px;
            transform: translateY(0);
            transition: all 0.30s ease 0s;
        }
        .service-page .service_box:hover .service_icon{
            transform: translateY(-100%);
        }
        .service-page .service_box .service_icon i{
            color:#333;
        }
        .service-page .service_box h3{
            position: relative;
            top:40px;
            margin:0;
            color:#fff;
            font-size:23px;
            text-transform:uppercase;
            transform: translateY(0%);
            transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55) 0s;
        }
        .service-page .service_box:hover h3{
            top:-40px;
        }
        .service-page .service_box  p{
            color:#fff;
            margin:0;
            opacity:0;
            transition: all 0.30s linear 0s;
        } 

        .service-page .service_box  .service-excerpts {
            margin-bottom:20px;
        }


        .service-page .service_box:hover p {
            opacity:1;
        }
        .service-page a {
            color:#fff;
          
        }

.service-page .cta-btn {
   background:transparent;
}


/* Web Design Page */

.page-template section.second-section {
    background: #f1f1f1;
    padding-top: 50px;
    padding-bottom: 100px;
    margin-top: 30px;
}

section.fourth-section {
    background: url(https://customizepress.ca/wp-content/uploads/2017/11/web-design-background-1-min.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    text-align: center;
    padding: 75px 0px;
    color: #fff;
    font-size: 2.3rem;
    line-height: 2.20;
    padding-left: 30px;
    padding-right: 30px;
}



.page-template .powered-by-google {
	margin-bottom: 0; 
}

/* Social Media Marketing page */

.social-media-imgicon img {
    width: 200px;
    margin-top: 35px;
}

.social-media-imgicon {
    border-bottom: 1px solid #eee;
    margin-bottom: 30px;
    padding-bottom: 30px;
}

.social-media-imgicon:last-of-type {
    border-bottom: none;
    padding-bottom:0;
}

/* Graphic Design Page */

.page-template-page-graphic-design .graphic-design-img {
    padding: 15px;
    margin: 0 auto;
}

.graphic-second-img {
    margin: 50px auto !important;
    -ms-transform: rotate(7deg);
    -webkit-transform: rotate(7deg);
    transform: rotate(7deg);
}



/* Pricing Page */


.page-template-page-pricing .products-pricing {
    line-height: 150px;
    margin: 50px auto 0;
    text-align: center;
    font-size: 4rem;
    border: 1px solid #ddd;
    background: #e4f6ff;
    text-transform: uppercase;
}

.products-pricing span.light {
    color: #fefefe;
    text-shadow: 0px 1px 0px #c0c0c0, 0px 2px 0px #b0b0b0, 0px 3px 0px #a0a0a0, 0px 4px 0px #909090, 0px 5px 10px rgba(0, 0, 0, 0.6);
}

.products-pricing span.dark {
    color: #C3BDEB;
    text-shadow: 0px 1px 0px #665aa8, 0px 2px 0px #594f93, 0px 3px 0px #4c437e, 0px 4px 0px #403869, 0px 5px 10px rgba(0, 0, 0, 0.4);
}

.page-template-page-pricing .modal .products-pricing {
	margin: 0 auto;
	line-height: 120px;
	font-size: 3rem;    
}



/* ----- New Pricing table ----- */

.comparison {
  max-width: 960px;
  margin: 0 auto;
  margin-bottom: 20px;
  margin-top: 30px;
  font-size: 14px;  
  text-align: center;
  padding: 10px;
}

.comparison table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  table-layout: auto;
}

.comparison td,
.comparison th {
  border-right: 1px solid #E8E8E8;
  empty-cells: show;
  padding: 10px;
  border-top: 1px solid #E8E8E8;
  border-bottom: 1px solid #E8E8E8;
  color: #808080;
  font-size: 15px;
  text-align:center;
}

.comparison tbody tr:nth-child(odd) {
  display: none;
}

.comparison .compare-row {
  background: #F7F7F7;
}

.fa-check {
  color: #69C7F1;
}

.comparison th {
  font-weight: normal;
  padding: 0;
  border-top: 0px solid #E8E8E8;
  border-bottom: 0px solid #E8E8E8;
}

.comparison tr td:first-child {
  text-align: left;
  padding: 15px;
  border-left: 1px solid #E8E8E8;
  border-top: 1px solid #E8E8E8;
}

.comparison .product,
.comparison .tl {
  color: #FFF;
  padding: 10px;
  font-size: 14px;
}

.comparison .tl2 {
  border-right: 0;
}

.comparison .product {
  background: #69C7F1;
  height: 40px;
  font-size: 16px;
}

.comparison .product-one {
  border-top-left-radius: 5px; 
  border-left:0px;
}

.comparison .product-two {
  background:#a49dd4;
}

.comparison .product-three {
  border-top-right-radius: 5px; 
  border-right:0px;
 background: #53cab2;
}

.comparison .price-info {
  padding: 15px;
}

.comparison .price-now,
.comparison .price-now span {
  color: #808080;
}

.comparison .price-now span {
  font-size: 20px;
  color: #545454;
}

.comparison .price-now p {
  font-size: 14px;
  text-align: center;
  line-height: 16px;
  display: inline;
}

.comparison .price-buy {
  background: #EC671A;
  padding: 10px 20px;
  font-size: 14px;
  display: inline-block;
  color: #fff;
  text-decoration: none;
  border-radius: 3px;
  text-transform: uppercase;
  margin: 5px 0 10px 0;
  letter-spacing: 1px;
  cursor: pointer;
  -webkit-transition: .3s all ease;
  transition: .3s all ease;
}

.comparison .price-buy:hover {
  background: #E84D00;
}

.btn-column {
	background: #f9f9f9;
}

@media screen and (min-width: 721px) and (max-width: 1000px) {
  .table_ul li {
    letter-spacing: 0px;
  }
  .comparison .price-now span {
    font-size: 32px;
  }
  .comparison .price-now p {
    display: block;
  }
}


/* Pricing Blocks */


.pricing-blocks .products-pricing {
	background: transparent;
	border: none;
	margin: 0 auto;
	line-height: 0;
	padding: 50px 0 100px;
}

.pricing-blocks {
	min-width: 320px;
	font-size: 16px;
	font-weight: 300;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	-webkit-backface-visibility: hidden;
	position: relative;
	padding: 50px 20px;
	margin: 20px auto 50px;
}

.pricing-blocks .pricing {
	text-align: center;
	border: 1px solid #dddddd;
	color: #433f3f;
	font-size: 14px;
	padding-left: 0;
	margin-bottom: 30px;
	background: #f7fdff;
}
.pricing-blocks .pricing img {
	display: block;
	margin: auto;
	width: 32px;
}
.pricing-blocks .pricing li:first-child,
.pricing-blocks .pricing li:last-child {
	padding: 20px 13px;
}
.pricing-blocks .pricing li {
	list-style: none;
	padding: 13px;
}
.pricing-blocks .pricing li + li {
	border-top: 1px solid #dddddd;
}
.pricing-blocks .pricing big {
	font-size: 22px;
}
.pricing h3 {
	margin-bottom: 0;
  font-size: 36px;
}
.pricing-blocks .pricing span {
	font-size: 12px;
	color: #999;
	font-weight: normal;
}
.pricing-blocks .pricing li:nth-last-child(2) {
	padding: 30px 13px;
}
.pricing-blocks .pricing button {
	width: auto;
	margin: auto;
	font-size: 15px;
	font-weight: bold;
	border-radius: 50px;
	color: #fff;
	padding: 9px 24px;
	opacity: 1;
	transition: opacity .2s ease;
  border: none;
  outline: none;
}
.pricing-blocks .pricing button:hover {
	opacity: .9;
}
.pricing-blocks .pricing button:active {
	box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1);
}
/* pricing color */

.p-green big,
.p-green h3 {
	color: #e13c4c;
}
.p-green button {
	background: #e03c4c;
}
.p-yel big,
.p-yel h3 {
	color: #ffbb42;
}
.p-yel button {
	background: #ffbb42;
}
.p-red big,
.p-red h3 {
	color: #4c7737;
}
.p-red button {
	background: #4c7737;
}
.p-blue big,
.p-blue h3 {
	color: #3f4bb8;
}
.p-blue button {
	background: #3f4bb8;
}




/* Portfolio Page */

.portimg-section {
	margin-top: 50px;
    margin-bottom: 0;
}

.portimg-section .products-pricing {
	margin-top: 0;
    margin-bottom: 70px !important;
    padding: 20px;
    line-height: 1.5;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    font-size: 3rem;
    margin-left: auto;
    margin-right: auto;
    text-align:center;
}

.cp-portimg-wrapper {
    width: 100%;
    margin: 0 auto 50px;
    background: #f9f9f9;
    border: 1px solid #dedede;
    outline: none;
    box-sizing: border-box;
    max-width: 613px;
}


.cp-portimg-wrapper.effect2:hover {
    background: #01abf1;
    transition: all 1s;
}

.cp-portimg-wrapper.effect2:hover h3 {
    color: #fff;
    transition: all 1s;
}

.cp-portimg-wrapper.effect2:hover:before, 
.cp-portimg-wrapper.effect2:hover:after {
    box-shadow: 0 0 0 #777;
    transition: all 1s;
}

.portheadline-bottom {
    border-top: 1px solid #dedede;
}

.portheadline-bottom h3 {
   margin: 0;
    padding: 15px;
    background: rgba(203, 239, 255, 0.22);
    text-align: center;
    font-size: 16px;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
}

@media all and (min-width: 768px) and (max-width: 1200px) {
.portheadline-bottom h3 {
    font-size: 14px;
}

}

.portfolio-divider {
	width:75%;
	margin: 75px auto;
}

.video-intro-wrap {
    text-align: center;
    padding: 50px 50px 75px;
    box-sizing: border-box;
    margin-bottom: 30px;
    margin-top: 0px;
    overflow: hidden;
}

.video-intro {
  	position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}

.video-intro iframe,
.video-intro object,
.video-intro embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* SEO bar in featured page */

.cp-seo-link {
	display:none;
}

.cp-seo-link h4 {
	background: #eff6fa;
    color: #fb675b;
    width: 100%;
    padding: 10px 0;
    text-align: center;
    margin: 0 auto;
    font-size: 1.3rem;
    border: 1px solid #dedede;
    border-bottom: navajowhite;
    font-family: 'Quicksand', sans-serif;
    text-transform: unset;
}

.highlighted-link {
	color:#ff7368;
}

.cpport-1519 .cp-seo-link,
.cpport-1081 .cp-seo-link,
.cpport-1061 .cp-seo-link {
	display:block;
	margin-top: -25px;
}

.elm-button {
	padding: 10px;
}

.modal-portfolio {
	width:100%;
}

.modal-portfolio .modal-title {
	color: white;
    padding: 20px 0;
    text-align: center;
    font-size: 20px;
    text-transform: uppercase;
}

.modal-portfolio .modal-body {
	background: #fff !important;
	padding: 15px;
}

.modal-portfolio .modal-header {
background:#50778A;
}


.modal-port-hyperlink a span {
    color: #f63e28;
    margin: 0 5px;
}

.portimg-section h6 {
	padding: 0;
	font-size: 16px;
	font-weight: 800;
}

.portimg-section a.btn.btn-info.btn-lg {
    color: #fff;
    background: darkseagreen;
    border-color: #eee;
    width: 50%;
    padding: 20px;
    text-transform: uppercase;
    font-size: 2rem;
    position: relative;
    left: -23px;
    top: 30px;
	margin-bottom: 70px;
}

.portimg-section a.btn.btn-info.btn-lg:hover {
    background: #4492b5;
}



.portimg-section blockquote {
	padding-left:20px !important;
	width:100% !important;
}


.portimg-section blockquote span {
	color:#50778a;
	display:block;
	margin-top: 15px;
}


.portimg-section h4 {
	padding-left:0;
}


.upper-section-portfolio .col-md-5 {
	text-align:center;
}

.website-overview-portfolio ul {
    padding: 10px 25px;
    list-style-type: square;
}


.website-overview-portfolio .paypal_btn {
    float: none; 
    margin: -100px auto 0;
}

.portimg-section .close {
	font-size: 51px;
	opacity:1;
	color:#fff;
}

.portimg-section .close:hover {
	opacity:.5;
	color:#555;
}

.portfolio-featurettes {
	text-align: center;
	padding-bottom: 75px;
	margin-top: -75px;
}

/* Social on Portfolio Page */

.social-on-modal {
    text-align: center;
    position: relative;
    top: 35px;
    left: -23px;
    padding-bottom: 30px;
}

.social-on-modal img {
   width: 35px;
    margin-right: 10px;
    padding-bottom: 15px !important;
    border-bottom: none !important;
}

#myModal-1152 .portimg-section a.btn.btn-info.btn-lg,
#myModal-991 .portimg-section a.btn.btn-info.btn-lg {
	pointer-events: none;
}

.cpport-1871 .portheadline-bottom h3 {
	background: #00a2ff;
    color: #fff;
}

#myModal-1871 h4 {
	display:none;
}

#myModal-1871 .portimg-section blockquote {
	text-align: center;
    border-right: 5px solid #8E55CE;
}


/* Google Review Direct Link */

@keyframes move {
	0% { 
		background-position: 0 60%, 0 50%;
	}
	100% { 
	  background-position: 0 60%, 100% 50%;
	}
}

.container-review {
	background-color: #263645;
	background-size: 125%, 50% 100%;
	background-position: 0 60%, 0 100%;
	animation: move 5s linear infinite;
	height: 700px;
	border: 2px solid #263645;
	border-right: 0;
	border-left: 0;
	padding: 15px 30px;
    
}

.container-review h1 {
  text-align: center;
  font-weight: 600;
  color:#fff;
  margin-bottom:30px;
}

.container-review p {
  text-align: center;
  color:#fff;
  margin: 50px auto;
}

.container-review ul {
  color:#fff;
}

.container-review a {
  color: #ff8300;
}


.container-review #map {
  height: 400px;
  width:70%;
  margin:0 auto;
}
.container-review .controls {
  background-color: #fff;
  border-radius: 2px;
  border: 1px solid transparent;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
  box-sizing: border-box;
  font-family: Roboto;
  font-size: 15px;
  font-weight: 300;
  height: 29px;
  margin-left: 17px;
  margin-top: 10px;
  outline: none;
  padding: 0 11px 0 13px;
  text-overflow: ellipsis;
  width: 60%;
}

.container-review .controls:focus {
  border-color: #4d90fe;
}

.r-map-wrapper {
	margin-top:0px;
}

.review-link {
background: blanchedalmond;
    padding: 5px;
}


/* Opt-in Page */

.page-template-page-optin-classified nav,
.page-template-page-optin-classified footer {
	display:none;
}

.page-template-page-optin-classified {

background:url(https://customizepress.ca/wp-content/uploads/2019/02/optin-wall.jpg) 25%;

}

.optin-wrapper {
margin:0 auto;

}

.optin-wrapper ul {
color:#000;
margin-left:70px;
line-height:2.5;
list-style-image: url(https://customizepress.ca/wp-content/uploads/2019/02/arrow-small.png);

}

@media only screen and (max-width:991px) {
	.optin-wrapper ul {
		line-height:3.5;
	}
}

@media only screen and (max-width:767px) {
	.optin-wrapper ul {
		line-height:2.5;
	}
}

.optin-wrapper h4 {
padding: 0 50px 0;
    margin: 0 auto 20px;
    line-height: 1.4;
    text-transform:none;
    font-size:3rem;
}

.optin-content {
	margin:80px auto 0;
}

.book-align {
text-align:right;
}

@media only screen and (max-width:767px) {

	.book-align {
		text-align:center;
	}
}


@media only screen and (max-width:767px) {

	.list-align {
		margin-top:10px;
	}
}

.optin-title {
	background:#25A79C;
	color:#fff;
	padding:30px;
	text-align:center;
	font-size:5rem;
}


.book-cover {
	width:340px;
	box-shadow:0 10px 30px -8px;
	margin-bottom:70px;
}


#mc_embed_signup form {

background:beige;
text-align: center;
    padding: 45px 0 !important;
    margin-top: -17px;
}



@media only screen and (max-width:1301px) {
	#mc_embed_signup form {
		padding: 25px !important;
	}
}

@media only screen and (max-width:991px) {
	#mc_embed_signup form {
		padding: 45px !important ;
	}
}


#mc_embed_signup input.email {
	height:57px !important;
	width:60% !important;
	margin: 0 0 20px !important;
}

@media only screen and (max-width:767px) {
#mc_embed_signup input.email {
	width:100% !important;
}
}

#mc_embed_signup .button {
	height:auto !important;
	padding:12px !important;
	line-height:none !important;
	background-color:maroon !important;
	font-size:17px !important;
}

.spam-info {
	float:center;
}

@media only screen and (max-width:767px) {

	.spam-info {
	  margin-top:20px;
	}
}

.protected-spam {
	margin-right:12px;
	width:25px;
}


/* Sitemap Page */

.sitemap-services {
    margin-top: 70px;
}

.sitemap-services p {
	color: #000000;
    font-size: 1.7rem;
    line-height: 1.5;
    margin: 30px 10px 20px;
    padding: 0 30px;
    word-wrap: break-word;
}

.sitemap-html-left {
    background: #eee;
   padding-bottom:50px;
}

.sitemap-html-right {
   background:floralwhite;
   padding-bottom:50px;
}

@media only screen and (min-width:767px) {
.sitemap-html-right,
.sitemap-html-left  {
    height: 1050px;
}

}

a.second-level-sitemap {
}

a.first-level-sitemap {
    color: darkolivegreen;
}

.sitemap-html-right h4 {
    border-bottom: 1px solid #e8e3d9;
    padding-bottom: 20px;
    margin-bottom: 30px;
}

/* Contact Page */

.contact-container {
background-image:url("https://customizepress.ca/wp-content/uploads/2019/02/contact-page-bg-min.jpg");
background-size:cover;
overflow-x: hidden;
}

.contact-card {
    z-index: 1;
    position: relative;
    max-width: 500px;
    height:100%;
    margin: 0 auto 100px;
    margin-top:100px;
    background-color: white;
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	-moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
    -webkit-transition: all 0.7s ease-in-out;
    -moz-transition:    all 0.7s ease-in-out;
    -o-transition:      all 0.7s ease-in-out;
    -ms-transition:     all 0.7s ease-in-out;

}
.contact-card.active
{
    height:100%;
}
.contact-card .banner
{
    z-index: 2;
    position: relative;
    margin-top: -154px;
    width:100%;
    height:150px;
    background-image: url("https://customizepress.ca/wp-content/uploads/2019/02/contact-banner.jpg");
    background-size: cover;
    border-bottom: solid 1px lightgrey;
  
    -webkit-transition: all 0.7s ease-in-out;
    -moz-transition:    all 0.7s ease-in-out;
    -o-transition:      all 0.7s ease-in-out;
    -ms-transition:     all 0.7s ease-in-out;
}

.contact-card .banner.active
{
    height: 0;
  
}

.contact-card .photo
{
    z-index: 3;
    position: relative;
    border-radius: 50%;
    height: 150px;
    width: 150px;
    background-color: white;
    margin: 0 auto;
    background-image: url("https://customizepress.ca/wp-content/uploads/2019/02/contact-web-design-company.jpg");
    background-size: cover;
    background-position: 50% 50%;
    top:75px;
    -webkit-box-shadow: inset 0px 0px 5px 1px rgba(0,0,0,0.3);
    -moz-box-shadow: inset 0px 0px 5px 1px rgba(0,0,0,0.3);
    box-shadow: inset 0px 0px 5px 1px rgba(0,0,0,0.3);
    -webkit-transition: top 0.7s ease-in-out, background 0.15s ease;
    -moz-transition:    top 0.7s ease-in-out, background 0.15s ease;
    -o-transition:      top 0.7s ease-in-out, background 0.15s ease;
    -ms-transition:     top 0.7s ease-in-out, background 0.15s ease;
}

.contact-card .photo.active
{
    top:-80px;
}
.contact-card ul
{
    list-style: none;
    text-align: center;
    padding-left: 0;
    margin-top:100px;
    margin-bottom:40px;
    font-size: 20px;
    -webkit-transition: all 0.7s ease-in-out;
    -moz-transition:    all 0.7s ease-in-out;
    -o-transition:      all 0.7s ease-in-out;
    -ms-transition:     all 0.7s ease-in-out;
}

.contact-card ul.active
{
    opacity:0;
    visibility: hidden;
}

.contact-card i
{
    font-size: 25px;
    display: inline-block;
    margin-top:10px;
    margin-left: 40px;
    margin-right: 150px;
    width: 300px;;
    text-align: left;
    color: #C7D0E1;
}

button.contact
{
    margin: 0 auto;
    text-align: center;
    margin-top: -15px;
    width: 100%;
    height: 35px;
    display: block;    
    border:none;
    background-color: transparent;
    font-family: inherit;
    color: white;
    background-color: #C7D0E1;
    font-size:12px;
    text-transform: uppercase;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition:    all 0.3s ease-in-out;
    -o-transition:      all 0.3s ease-in-out;
    -ms-transition:     all 0.3s ease-in-out;
}

button.contact:hover
{
    cursor: pointer;
    background-color:#979da8;
}

button.contact:focus
{
    outline: 0;
}

.social-media-banner
{
    max-width: 500px;
    height: 60px;
    margin-top: 25px;
    text-align: center;
    -webkit-transition: all 1.5s ease-in-out;
    -moz-transition: all 1.5s ease-in-out;
    -o-transition: all 1.5s ease-in-out;
    -ms-transition: all 1.5 ease-in-out;
    width: 100%;
    background: #012f4c;
    padding-top: 20px;
}

.social-media-banner.active
{
    opacity:0;
    visibility: hidden;
        -webkit-transition: all 0.1s ease-in-out;
    -moz-transition:    all 0.1s ease-in-out;
    -o-transition:      all 0.1s ease-in-out;
    -ms-transition:     all 0.1s ease-in-out;
}

.social-media-banner a i
{
    display: inline;
    
    width: auto;
    margin-right:15px;
    margin-left: 10px;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition:    all 0.3s ease-in-out;
    -o-transition:      all 0.3s ease-in-out;
    -ms-transition:     all 0.3s ease-in-out;
}

.social-media-banner a i:hover
{
    color:#979da8;
}

.wpcf7-form
{
    height: 0;
    overflow: hidden;
    width: 100%;
     z-index:-1;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition:    all 0.5s ease-in-out;
    -o-transition:      all 0.5s ease-in-out;
    -ms-transition:     all 0.5s ease-in-out;
     transition: all 0.5s ease-in-out;
}

.wpcf7-form.active
{
    height: 100%;
    z-index: 3;
    -webkit-transition: all 1s ease-in-out;
    -moz-transition:    all 1s ease-in-out;
    -o-transition:      all 1s ease-in-out;
    -ms-transition:     all 1s ease-in-out;
     transition: all 1s ease-in-out;
     margin-top: -80px;
    text-align: center;
}

.wpcf7-form input {
    width: 100%;
    text-transform: capitalize;
    margin: 0 auto;
    padding: 0 10px;
    font-family: inherit;
    border: 1px solid #dadee5;
    height: 35px;
    display: block;
        -webkit-transition: all 0.2s ease-in-out;
    -moz-transition:    all 0.2s ease-in-out;
    -o-transition:      all 0.2s ease-in-out;
    -ms-transition:     all 0.2s ease-in-out;
}
.wpcf7-form input:focus, .wpcf7-form textarea:focus {
    border: 1px solid grey;
    outline: none;
    
}
::-webkit-input-placeholder 
{
 font-size: 12px;
 text-transform: uppercase;
 text-align: center;
 font-weight:500;
}

.wpcf7-form textarea
{
    width: 100%;
    height:70px;
    text-transform: capitalize;
    background-color: white;
    margin: 0 auto;
    padding: 0 10px;
    display: block;
    border: 1px solid #dadee5;
    font-family: inherit;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition:    all 0.3s ease-in-out;
    -o-transition:      all 0.3s ease-in-out;
    -ms-transition:     all 0.3s ease-in-out;
}

input.wpcf7-form-control.wpcf7-submit {
    background: #C7D0E1;
    color: #fff;
}

@media only screen and (max-width:400px) {
.contact-card {
	padding:20px;
}
}

div.wpcf7-mail-sent-ok {
    border: 1px solid #01d0fc !important;
}

/* 404 Page */

.error404 {
  background: radial-gradient(#000, #352c2c);
  color: white;
  overflow: hidden;
  height: 100%;
  user-select: none;
}

.error404 #customizepress-footer {
  display:none;
}
.error-page .static {
  width: 100%;
  height: 100%;
  position: relative;
  margin: 0;
  padding: 0;
  top: -100px;
  opacity: 0.05;
  z-index: 230;
  user-select: none;
  user-drag: none;
}

.error-page .error {
  text-align: center;
  font-family: 'Gilda Display', serif;
  font-size: 95px;
  font-style: italic;
  text-align: center;
  width: 100px;
  height: 60px;
  line-height: 60px;
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  left: -60px;
  right: 0;
  animation: noise 2s linear infinite;
  overflow: default;
}

.error-page .error:after {
  content: '404';
  font-family: 'Gilda Display', serif;
  font-size: 100px;
  font-style: italic;
  text-align: center;
  width: 150px;
  height: 60px;
  line-height: 60px;
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  opacity: 0;
  color: blue;
  animation: noise-1 .2s linear infinite;
}

.error-page .info {
  text-align: center;
  font-family: 'Gilda Display', serif;
  font-size: 15px;
  font-style: italic;
  text-align: center;
  width: 200px;
  height: 60px;
  line-height: 60px;
  margin: auto;
  position: absolute;
  top: 140px;
  bottom: 0;
  left: 0;
  right: 0;
  animation: noise-3 1s linear infinite;
}

.error-page .error:before {
  content: '404';
  font-family: 'Gilda Display', serif;
  font-size: 100px;
  font-style: italic;
  text-align: center;
  width: 100px;
  height: 60px;
  line-height: 60px;
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  opacity: 0;
  color: red;
  animation: noise-2 .2s linear infinite;
}

@keyframes noise-1 {
  0%, 20%, 40%, 60%, 70%, 90% {opacity: 0;}
  10% {opacity: .1;}
  50% {opacity: .5; left: -6px;}
  80% {opacity: .3;}
  100% {opacity: .6; left: 2px;}
}

@keyframes noise-2 {
  0%, 20%, 40%, 60%, 70%, 90% {opacity: 0;}
  10% {opacity: .1;}
  50% {opacity: .5; left: 6px;}
  80% {opacity: .3;}
  100% {opacity: .6; left: -2px;}
}

@keyframes noise {
  0%, 3%, 5%, 42%, 44%, 100% {opacity: 1; transform: scaleY(1);}  
  4.3% {opacity: 1; transform: scaleY(1.7);}
  43% {opacity: 1; transform: scaleX(1.5);}
}

@keyframes noise-3 {
  0%,3%,5%,42%,44%,100% {opacity: 1; transform: scaleY(1);}
  4.3% {opacity: 1; transform: scaleY(4);}
  43% {opacity: 1; transform: scaleX(10) rotate(60deg);}
}

.error-page a {
    position: relative;
    display: block;
    color: wheat;
    background: red;
    margin-top: 50px;
}


/* Index - blog  */

.sidebar-align {
	margin-top:50px;
}

.widget-area-right.widget-1 {
    padding: 0 30px;
}

.blog-page-align {
	margin-top:50px;
}

.blog-card {
  transition: height 0.3s ease;
  -webkit-transition: height 0.3s ease;
  background: #fff;
  border-radius: 3px;
  box-shadow: 0 3px 7px -3px rgba(0, 0, 0, 0.3);
  margin: 0 auto 40px;
  overflow: hidden;
  position: relative;
  font-size: 14px;
  line-height: 1.45em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.blog-card:hover .details {
  left: 0;
}
.alt_post .blog-card:hover .details {
  right: 0;
}
.alt_post .blog-card .details {
  right: -100%;
  left: inherit;
}
.blog-card .photo {
  height: 210px;
  position: relative;
}
.alt_post .blog-card .photo.photo1 {
  background-size: cover;
}
.blog-card .photo.photo1 {
  background-size: cover;
}
.blog-card .details {
  transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  background: rgba(0, 0, 0, 0.6);
  box-sizing: border-box;
  color: #fff;
  font-family: "Open Sans";
  list-style: none;
  margin: 0;
  padding: 10px 15px;
  height: 210px;
  /*POSITION*/
  position: absolute;
  top: 0;
  left: -100%;
}
.blog-card .details > li {
  padding: 3px 0;
}
.blog-card .details li:before, .blog-card .details .tags ul:before {
  font-family: FontAwesome;
  margin-right: 10px;
  vertical-align: middle;
}
.blog-card .details .author:before {
  content: "\f007";
}
.blog-card .details .date:before {
  content: "\f133";
}
.blog-card .details .tags ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.blog-card .details .tags ul:before {
  content: "\f02b";
}
.blog-card .details .tags li {
  display: inline-block;
  margin-right: 3px;
}
.blog-card .details a {
  color: inherit;
  border-bottom: 1px dotted;
}
.blog-card .details a:hover {
  color: #75D13B;
}
.blog-card .description {
  padding: 10px;
  box-sizing: border-box;
  position: relative;
}
.blog-card .description h1 {
  font-family: "Roboto";
  line-height: 1em;
  margin: 0 0 10px 0;
  font-size: 2.5rem;
}
.blog-card .description h2 {
  color: #9b9b9b;
  font-family: "Open Sans";
  line-height: 1.2em;
  text-transform: uppercase;
  font-size: 1em;
  font-weight: 400;
}

.blog-headline {
	width: 100%;
	background: #e4f6ff;
	border-top: 0;
	border-bottom: 0;
	margin: 50px auto 0;
	text-align: center;
	padding: 50px 15px;
}

@media only screen and (max-width:767px) {
	.blog-headline {
		padding:30px;
                margin-top: 0 !important;
	}
}

.blog-card .description p {
  position: relative;
  margin: 0;
  padding-top: 20px;
}
.blog-card .description p:after {
  content: "";
  background: #2CB9FE;
  height: 6px;
  width: 40px;
  /*POSITION*/
  position: absolute;
  top: 6px;
  left: 0;
}

p.summary {
    height: 60px;
    overflow: hidden;
}
.blog-card .description a {
  color: #2CB9FE;
  margin-bottom: 10px;
  margin-top:15px;
  float: right;
  font-weight:bolder;
}
.blog-card .description a:after {
  transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  content: "\f061";
  font-family: FontAwesome;
  margin-left: -10px;
  opacity: 0;
  vertical-align: middle;
}
.blog-card .description a:hover:after {
  margin-left: 5px;
  opacity: 1;
}

@media screen and (min-width: 600px) {
  .blog-card {
    height: 210px;
    max-width: 90%;
  }
  .blog-card:hover .photo {
    -webkit-transform: rotate(5deg) scale(1.3);
            transform: rotate(5deg) scale(1.3);
  }
  .alt_post .blog-card:hover .photo {
    -webkit-transform: rotate(-5deg) scale(1.3);
            transform: rotate(-5deg) scale(1.3);
  }
  .alt_post .blog-card .details {
    padding-left: 30px;
  }
  .alt_post .blog-card .description {
    float: right;
  }
  .alt_post .blog-card .description:before {
    -webkit-transform: skewX(5deg);
            transform: skewX(5deg);
    right: -15px;
    left: inherit;
    height:210px;
  }
  .alt_post .blog-card .photo {
    float: right;
  }
  .blog-card .photo {
    transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    float: left;
    height: 100%;
    width: 40%;
  }
  .blog-card .details {
    width: 40%;
  }
  .blog-card .description {
    float: left;
    width: 60%;
    z-index: 0;
  }
  .blog-card .description:before {
    -webkit-transform: skewX(-5deg);
            transform: skewX(-5deg);
    content: "";
    background: #fff;
    width: 100%;
    height:210px;
    z-index: -1;
    /*POSITION*/
    position: absolute;
    left: -15px;
    top: 0;
    bottom: 0;
  }
}

.post-nav {
    margin: 70px auto;
}

h4.sidebar-caption {
    text-align: center;
    margin: 10px auto 50px;
    border-bottom: 1px solid #eee;
    padding-bottom: 30px;
}


.effect2.widget.strong-testimonials-view-widget::before,
 .effect2.widget.strong-testimonials-view-widget::after {
	display:none;
}



/* Single - Post */

.single-post {
  background: #fff;
  line-height: 1.5;
  color: #433F3F;
  overflow-x: hidden;
}

.site-branding h2 {
	margin: 0;
	font-size: 16px;
	color: #64625C;
	text-transform: uppercase;
	letter-spacing: 3px;
}

.single-post .site-content h4 {
    padding-left: 0;
}

.single-post .site-content h6 {
    text-align: center;
    font-size: 24px;
}

.single-post .site-content p {
   margin:30px 0 20px;
}

.single-pos .site-contentt a {
  padding-bottom: 2px;
  color: #0073aa;
  text-decoration: none;
  transition: all .15s ease-in-out;
}

.single-post .site-content ul {
list-style-type: square;
}


.single-post .site-content ol {
padding:0;
}


.single-post .site-content li {
margin-left:30px;
}

.single-post blockquote.variation-two, 
.single-post blockquote.variation-three {
    margin: 30px auto;
    width: 100%;
    padding: 15px;
}

.single-post pre {
    width: 100%;
    margin: 30px auto;
}

.single-post .site-content a:hover {
  color: #00a0d2;
  border-bottom-color: #A34040;
}

.single-post  #page {
  margin: 100px auto 50px;
  max-width: 900px;
}

@media only screen and (max-width:767px) {
.single-post  #page {
  margin: 50px auto 60px;

}
}

.single-post .site-header {
  text-align: center;
}

.single-post .site-header:after {
  display: block;
  content: '';
  margin: 50px auto;
  max-width: 400px;
  border-bottom: 1px solid #D6CCC7;
}

.single-post h1.site-title {
  margin: 0 0 35px 0;
  font-size: 3rem;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 2px;
  line-height: 1.3;
}

@media only screen and (max-width:500px) {
	.single-post h1.site-title {
	  font-size: 2.3rem;
	}
}

.single-post h1.site-title a {
  border: none;
}

.single-post p.site-description {
  margin: 0;
  font-size: 16px;
  color: #64625C;
  text-transform: uppercase;
  letter-spacing: 3px;
}

.single-post .site-main {
  margin: auto;
  max-width: 90%;
}

.single-post .site-main .entry-title,
.single-post .site-main .entry-meta {
  text-align: center;
}

.single-post .site-main img {
    max-width: 600px;
    margin: 35px auto 30px;
	width:100%;
}

.single-post h1.entry-title {
  margin: 60px 0 5px 0;
  font-size: 36px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.single-post .entry-meta .posted-on {
  margin: 0;
  color: #64625C;
  font-size: 18px;
  font-style: italic;
}

.single-post .entry-content {
  margin-top: 435px;
  font-size: 22px;
}

.single-post .entry-content > p:first-of-type:first-line {
  text-transform: uppercase;
}

.single-post .entry-footer {
  margin: 50px auto 0;
  padding: 30px 0;
  font-size: 18px;
  font-style: italic;
  border-top: 1px solid #D6CCC7;
  border-bottom: 1px solid #D6CCC7;
  text-align:center;
}
.single-post .entry-footer p {
  margin: 0;
  
}

.single-post .comment-area {
  margin-top: 90px;
}

.single-post h2.comment-title {
  font-size: 36px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 2px;
  text-align: center;
}
.single-post h2.comment-title:after {
  display: block;
  content: '';
  margin: 30px auto 60px;
  max-width: 300px;
  border-bottom: 1px solid #D6CCC7;  
}

.single-post ul.comment-list {
  margin: 0;
  padding: 0;
}

.single-post ul.comment-list li {
  margin-bottom: 60px;
  list-style-type: none;
}

.single-post ul.comment-list li a {
  display: inline-block;
  padding-bottom: 0px;
  margin-bottom: 5px;
}

.single-post .comment-author {
  font-size: 22px;
  font-weight: bold;
}
.single-post .comment-author a {
  border-bottom: none;
}

.single-post .comment-meta {
  font-size: 16px;
  margin:10px auto;
}

.single-post .comment-content {
  font-size: 18px;
}

.single-post .reply {
  font-size: 18px;
  margin-top: 30px;
}

.single-post .comment-respond {
  margin-top: 90px;
}

.single-post .comment-reply-title,
.single-post .comment-respond input[type="text"] {
  display: block;
  margin-bottom: 5px;
}

.single-post .comment-reply-title {
  color: #64625C;
}

.single-post .comment-respond input[type="text"] {
  width: 100%;
  margin-bottom: 20px;
  padding: 10px;
  background: #F6F4ED;
  border: 1px solid #D6CCC7;
}

.single-post .comment-respond textarea {
  width: 100%;
  padding: 10px;
  height: 200px;
  background: #F6F4ED;
  border: 1px solid #D6CCC7;
}

.single-post .comment-respond button {
  margin-top: 20px;
  padding: 15px 30px;
  background: transparent;
  border: 1px solid #D6CCC7;
  font-family: "Old Standard TT", Times New Roman, serif;
  font-size: 16px;
  line-height: 1.5;
  color: #433F3F;
  cursor: pointer;
  transition: background .15s ease-in-out;
}
.single-post .comment-respond button:hover {
  background: #D6CCC7;
}

.comments-area {
    display: none;
}


/* Media Queries */


@media only screen and (max-width:1024px) {

	.overlap-content h1 {
		font-size: 3.5rem;
	}

	.main-wrapper-head {
		margin: 70px auto 50px;

	}
	
	
	.competition-circle-wrapper {
		height: 140px;
	}	
	
}


@media only screen and (max-width:991px) {

.navbar {
   margin-bottom:0;
}
	.new-page-align h1 {
		font-size: 28px;
	}
	
	
	.render {
	  font-size: 3.7em;
	 text-align:center;
	}	
	
	
	.cp-testi-section {
	   padding-left:0;
	   padding-right:0;
	   margin:50px auto;
	}
	
	.ppc-img {
		margin: 50px auto;
	}	
	
	.button-section {
		margin-top: 50px;
		margin-bottom: 50px;
		text-align: center;
	}
	
	.strong-view {
		margin: 50px auto 0;
	}
	
	.social-media-imgicon {
		text-align:center;
	}	
	
	.upper-section-portfolio img {
		border-bottom:1px solid #eee;
		padding-bottom:30px;
	}
	
	.website-overview-portfolio {
		padding-top:30px;
	}
	
	.portimg-section blockquote {
		margin-left:0;
	}
	
	.portimg-section a.btn.btn-info.btn-lg {
		width:100%;
	}

	.portimg-section a.btn.btn-info.btn-lg:hover {
		width:100%;
	}

  .website-overview-portfolio .paypal_btn {
		   width:100%;
   }	

}	


@media only screen and (max-width:767px) {

	.new-page-align h1 {
		font-size: 24px;
	}

	.overlap-content h1 {
		font-size: 2.5rem;
		padding-top: 30px;
		text-shadow: none;
	}

	.main-wrapper-head {
		margin: 30px auto 0;
	}

	.social-head {
		margin: 20px auto;
	}

	.vertical-center {
		top: -120px;
	}

	.company-name {
		left: 55px;
	}

	.navbar-brand>img {
		padding-left: 0;
	}

	section.second-section {
		padding-top: 0;
	}

	#footer-sidebar {
		height:auto;
	}

	.icon-button:hover span {
		width: 1.6rem;
		height: 1.6rem;
		border-radius: 1.6rem;
		margin: -0.8rem;
	}

	/* Icons */
	.icon-button i {
	  height: 1.6rem;
	  line-height: 1.6rem;
	  width: 1.6rem;
	}

	.pinterest {
		display: none; 
	}


	.testimonials-home {
		height: auto;
		padding-bottom: 30px;
		text-align:center;
	}  
  
  
	.btn-fade {
		margin-top: 70px !important;
	}

	.btn-fade, .btn-bounce, .btn-overlay, .btn-shake {
		margin-bottom: 50px;
	}    


	.testimonials-home {
		background: #f9fdff;
	} 

	.new-page-align {
		padding:0 15px;
		margin: 30px auto 50px;
	}

	.new-page-align h2 {
		font-size:2.5rem;
	}

	.new-page-align h2:first-child {
		padding:0 0 10px;
		margin:0 auto;
	}

	.render {
		font-size: 2.8em;
		text-align:center;
	}

	.cool-container {
		margin: 10px auto 20px;
	}

	.customizepress_header_breadcrum_title .products-pricing {
		font-size:3rem;
                line-height: 1.5;
                margin: 10px auto 15px;
	}
	
	section.fourth-section {
		padding-left: 0;
		padding-right: 0;
	}
	
	.title-align {
		padding: 0;
		padding-top: 50px;
	}	
	
	
  .table_ul {
    padding: 0px;
  }
  .table_ul li {
    font-size: 10px;
    line-height: 16px;
    padding: 3px 0;
  }
  .comparison {
    max-width: 100%;
  }
  .comparison td:first-child,
  .comparison th:first-child {
    display: none;
  }
  .comparison tbody tr:nth-child(odd) {
    display: table-row;
    background: #F7F7F7;
  }
  .comparison .row {
    background: #FFF;
  }
  .comparison td,
  .comparison th {
    border: 1px solid #CCC;
    border-top: none;
    padding: 10px;
  }
  .price-info {
    border-top: 0 !important;
    padding: 10px 0 !important;
  }
  .price-info p {
    line-height: 8px;
    font-size: 8px !important;
  }
  .comparison .compare-row {
    background: #ffffff;
  }
  .comparison .price-now p {
    display: block;
  }
  .comparison .price-now span {
    font-size: 24px;
  }
  .comparison .qbse {
    font-size: 1.2em;
  }
  .comparison td {
    font-size: 14px;
  }
  .comparison th {
    font-size: 14px;
  }	
  
  /* portfolio page */
  
  .portimg-section .products-pricing {
    width:80%;
    font-size:2.5rem;
	}


	.portimg-section a.btn.btn-info.btn-lg,
	.social-on-modal {
		left:0;
	}

	.portimg-section a.btn.btn-info.btn-lg {
		margin-bottom:40px;
	}

	.modal-port-hyperlink a {
		display: block;
		margin: 10px auto;
		font-size: 18px;
		border-top: 1px solid #eeeeee;
		padding-top: 15px;
		padding-left: 15px;
	}

	.modal-port-hyperlink a span {
		display:none;
	}

	#myModal-1519 .modal-body {
		padding:0;
	}
	
	.cp-portimg-wrapper {
		margin: 0 auto 75px;

	}	


 
}

@media only screen and (max-width:500px) {

	.overlap-content h1 {
		font-size: 1.8rem;
	}

	.overlap-content p {
		font-size: 1.5rem;
	}
	
	
	.competition-circle-wrapper {
		height:0;
		margin-bottom: 70px;
	}	

	.competitive-advantages .cp-content p {
		padding-top: 40px;
	}

	.first-cc {
		margin-top: 0;
	}

	.competition-content {
		padding-right: 0;
	}

	.competitive-advantages h3 {
		padding-top: 20px;
	}

	.competitive-advantages .cp-content {
		padding: 0 20px;
	}
	
	
	
	img.best-website-badge {
		border-top: none;
	}	
	
	.responsive-parallax-display {
		margin:0;
	}	
	
	
	.responsive-parallax-display {
		padding: 50px 15px;
	}	
	
	.hp-paragraph ul {
		margin: 2em 0 0;
	}	
	
	.hp-paragraph ul li h3 {
		padding: 20px 0;
		font-size: 14px;
		font-weight: 600;
	}	
	
	
	.blog-section {
		padding: 50px 0 100px;	

	}
	
	.cp-btns {
		padding: 0 30px;
	}	
	
	
	footer a.icon-button.yelp {
		display: none;
	}	
	
	.icon-button {
		top:3px;
	}
	
	.copyright-bar {
		padding: 30px 0px;
	}
	
        .customizepress_header_breadcrum_title {
             padding-bottom: 0;
       }
	
	.customizepress_header_breadcrum_title .products-pricing {
		font-size:2.3rem;

	}	
	
	
	.website-design .button-section .btn {
		display: block;
		margin-bottom: 30px;
	}		
	
	.website-design .clear-button {
		margin-left: 0;
	}	
	
	
	.metaslider {
		display: none;
	}
	
	.ppc-img {
		display:none;
	}		
	
	.portimg-section .products-pricing {
		margin-bottom: 30px;
		font-size: 1.7rem;
		font-weight: 700;
	}
	
	.video-intro-wrap {
		padding: 0 !important;
	}
	
}	

@media only screen and (max-width:375px) {
	

	.overlap-content p {
		display:none;
	}

	.cp-content {
		text-align: center;
	}

	.competition-circle-wrapper {
		float: none;
               margin: 0 auto 70px;
	}

	.competitive-advantages .cp-content p {
		padding-top: 0;
	}

	.competitive-advantages h3 {
		padding-top: 40px;
	}
	
	.comparison {
		padding:0;
	}

	.comparison .product, .comparison .tl {
		font-size: 14px;
		padding: 10px 0;
	}

	.modal-title {
		font-size: 16px;
	}

       .contact-card .banner  {
              height: 200px;
       }	

       .contact-card .photo {
              top: 110px;
        }
	

}

@media only screen and (max-width:350px) {

	#particles-background, #particles-foreground {
		display:none;
	}

	.overlap-content {
		height: auto;
		background: #2e4c5a;
		padding-top: 50px;
		margin-top: -15px;
	}

	.navbar-default {
		background: #487488;
	}

	.company-name {
		top: -35px;
	}

	.slogan {
		display:none;
	}

	a.icon-button.google-plus {
		display: none;
	}	

}

@media only screen and (max-width:360px) {
      .overlap-content {
         height: 550px;
     }
}

@media only screen and (min-width: 1200px) {
	.ppc-img {
		margin: 30px auto 0;
	}
}

@media only screen and (min-width: 992px) {
	.ppc-img {
		margin: 70px auto 0;
	}

       section.section-below-nav {
	       margin-top:75px;
       }

       .overlap-content {
         padding-top:75px;
      }

        .card {
           min-height:485px;
        }
}

@media only screen and (min-width:1025px) {
      .overlap-content {
          height: 767px;
      }
	
	section.competitive-advantages {
    margin-top:100px;
}
}


@media only screen and (min-width: 767px) {
 .cp-testi-section #testimonials li {
    background-color: transparent;
    width: 50%;
    float: left;
    margin-bottom: 5px;
  }
  .cp-testi-section #testimonials li:hover .photo img {
    border-color: rgba(26, 188, 156, 0.78);
  }
  .cp-testi-section #testimonials li:nth-child(even) .insides {
    border-radius: 0 100px 100px 0;
    margin-right: 0;
    margin-left: 5px;
  }
  .cp-testi-section #testimonials li:nth-child(even) .photo {
    float: right;
  }
  .cp-testi-section #testimonials li:nth-child(even) .testimonial {
    text-align: right;
  }
  .cp-testi-section #testimonials li .insides {
    height: 120px;
    margin-right: 5px;
    background-color: #fff;
    border-radius: 100px 0 0 100px;
  }
  .cp-testi-section #testimonials li .photo {
    float: left;
    margin: 8px 10px;
  }
  .cp-testi-section #testimonials li .photo img {
    max-width: 100px;
    border-radius: 100%;
    border: 2px solid transparent;
    -webkit-transition: border-color .3s ease;
    transition: border-color .3s ease;
  }
}


@media only screen and (max-width: 1024px) and (min-width: 768px)  {
 section.section-below-nav {
  margin-top:0;
background: #2c2d44;
background-image: -moz-linear-gradient(45deg, #3f3251 2%, #002025 100%);
background-image: -webkit-linear-gradient(45deg, #3f3251 2%, #002025 100%);
background-image: linear-gradient(45deg, #3f3251 2%, #002025 100%);
}
#particles-background, #particles-foreground {
   display:none;
}
.overlap-content {
   height:700px;
}

.powered-by-google {
margin-bottom: 0px;
}

.last-cc {
    display: none;
}
.competition-content.second-cc p {
    border-bottom: none;
}


}


@media only screen and (min-width: 1025px) {
#particles-background, #particles-foreground {
    top: -425px;
    height: 1700px;
}
}
