/*Reset Styles*/
html{color:#000;text-align:left;background:#FFF}div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit}del,ins{text-decoration:none}li{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:baseline}sub{vertical-align:baseline}legend{color:#000}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit}input,button,textarea,select{*font-size:100%}select,input,button,textarea,button{font:99% arial,helvetica,clean,sans-serif}table{font-size:inherit;font:100%}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;}
/*Reset Styles*/


body {background-color:#ffffff; margin:0; overflow-x:hidden; font-family:'Poppins', Helvetica, sans-serif; font-weight:400; font-size:13px; color:#666666; text-rendering:optimizeSpeed;}
input[type=text], input[type=password], input[type=email], input[type=tel] {height:45px; width:100%; display:inline-block; padding:.375rem .75rem; font-size:1rem; line-height:1.5; color:#495057; background-color:#fff; background-clip:padding-box; border:1px solid #ced4da; border-radius:.25rem; transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;}
p {padding:0 0 15px 0;}


body {background-repeat:no-repeat; background-attachment:fixed;}
.site-container {width:90%; margin:0 auto; position:relative;}

.section {padding-bottom:50px; overflow:hidden;}
.section-boxed {text-align:center;}
h2.section-title {clear:both; display:inline-block; position:relative; font-size:29px; margin:0 0 30px; margin-top:0px; z-index:1; padding-bottom:7px; font-weight:700; color:#333333; text-transform:uppercase;}
h2.section-title::before {display:block; position:absolute; content:''; width:100%; background-color:#f5f5f5; height:2px; bottom:0;}
h2.section-title::after {display: block; position: absolute; content: ''; width: 30px; background-color: #ff6f61; height: 2px; bottom: 0;}
.cta-button {box-shadow:0px 10px 10px -8px rgba(0,0,0,.22); display: inline-block; position: relative; padding: .8em 2.1em; margin-bottom: .75em; margin-right: .25em; font-size: 1em; line-height: 1.2; border: 0; outline: 0; border: 2px solid #ffffff; text-shadow: none; background-color: #ff6f61; border-radius: 30px; -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; transition: all 0.3s ease-in-out; text-decoration: none; color:#ffffff; cursor:pointer;}
.cta-button:hover {background:#ffffff; color:#222;}
.cta-button a {color:#ffffff; text-decoration:none;}
.cta-button a:hover {text-decoration:none;}
.cta-button.highlighted-btn {border-color:#ffffff;}
.cta-button.highlighted-btn:hover {background:#f26456;}
.cta-button.highlighted-btn:hover a {color:#ffffff;}
.current-page-ancestor a, .current_page_item a {color:#3f209e !important;}

header {height:85px; width:100%; background:#ffffff; position:fixed; z-index:999; -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,.08); -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,.08); box-shadow: 0px 0px 10px 0px rgba(0,0,0,.08);}
header.expanded {box-shadow:none;}
header .site-container {width:100%;}
header #logo {height:105px; width:105px; display:block; margin:0 auto; position:relative; z-index:2;}
header #logo a {display:block; padding:10px 0; width:100%;}
header #logo img {height:105px;}
header #burger-menu {position:absolute; right:-10px; top:32px; margin:0; padding:0; margin-right:5%;}

/*Nav Element*/
header #cja-designs-menu {display:none; background:#ffffff; position:relative; top:-20px;}
header #cja-designs-menu ul {padding:50px 0 20px 0;}
#cja-designs-menu .mm-navbar {height:55px; --mm-color-background:#ffffff;}
#cja-designs-menu a {color:#666666; padding:15px 0;}
#cja-designs-menu ul {display:flex; flex-direction:column; justify-content:center; align-items:center;}
#cja-designs-menu ul li {list-style:none; font-family:"Poppins", sans-serif; font-weight: 600; padding:10px 0; text-transform:uppercase; font-size:20px;}
#cja-designs-menu ul li a {text-decoration:none;}
/*Nav Element*/

/*Footer*/
footer {background:#fcfcfc; border-top:2px solid #f2f2f2; font-size:12px; clear:both; padding-bottom:10px; overflow:hidden;}
footer .cja-container {padding:20px 0 0 0;}
footer #ftr-social {text-align:center; padding-bottom:10px;}
footer #ftr-social .social-link a {color:#333333; padding:0 10px; text-decoration:none;}
footer #ftr-social .social-link a:hover {color:#3f209e;}
footer .footer-post-copyright {text-align:center; color:#aaaaaa;}
/*Footer*/

/*Scroll To Top Icon*/
.scrollToTop {bottom:100px; right:20px;}
.scrollToTop {background:rgba(0, 0, 0, 0) url("https://web.archive.org/web/20220913202925im_/http://ocnprt.com/q-stoneworks/wp-content/uploads/2019/05/scrolltotop.png") no-repeat scroll 0 0; bottom:60px; display:none; height:45px; position:fixed; right:15px; text-indent:-4500px; width:45px; z-index:100;}
/*Scroll To Top Icon*/
    
/*Homepage Intro*/
#homepage-intro {padding-top:150px;}
#homepage-intro h2 {font-family:"Poppins", sans-serif; font-weight:800; color:#000000; font-size:32px; text-align:center; word-break:keep-all;}
#homepage-intro h2 span {font-weight:400; color:#2c1e59; display:block; line-height:27px; font-size:18px; margin-bottom:15px;}
#homepage-intro .subtitle {font-family:"Poppins", sans-serif; font-weight:300; color:#000000; font-size:14px; line-height:20px; text-align:center; margin-top:15px;}

#homepage-intro #homepage-intro-image {width:65%; margin:0 auto;}
#homepage-intro #homepage-intro-image img {max-width:100%; -webkit-box-shadow: 0px 0px 25px 0px rgba(0,0,0,.1); -moz-box-shadow: 0px 0px 25px 0px rgba(0,0,0,.1); box-shadow: 0px 0px 25px 0px rgba(0,0,0,.1); border:18px solid #fff; border-radius:1000px; background:#ffffff; position:relative; left:-18px;}
#homepage-intro #homepage-intro-text {padding-bottom:20px; text-align:center; padding-top:15px; width:90%; margin:0 auto;}
#homepage-intro #homepage-intro-text p {padding-bottom:8px; line-height:20px; font-weight:400;}
#homepage-intro #homepage-intro-text ul {list-style:none;}
#homepage-intro #homepage-intro-text ul li {list-style:none; margin-bottom:12px;}
#homepage-intro #homepage-intro-text ul li .highlight {font-weight:bold;}
#homepage-intro .homepage-intro-cta {clear:both; padding-top:10px;}
/*Homepage Intro*/


/*Homepage Skills*/
#homepage-skills {background:#2c1e59; padding-top:40px;}
#homepage-skills  h2 {color:#ffffff;}
#homepage-skills #homepage-skills-container {clear:both; overflow:hidden; text-align:left;}
#homepage-skills #homepage-skills-container .homepage-skill-box-inner {display:flex; flex-direction:row;}
#homepage-skills #homepage-skills-container .homepage-skill-box-inner .homepage-skill-box-icon {flex:0 0 50px; text-align:center;}
#homepage-skills #homepage-skills-container .homepage-skill-box-inner p {padding:0;}
#homepage-skills #homepage-skills-container i {color:#ff6f61; font-size:27px; position:relative; top:6px;}
#homepage-skills #homepage-skills-container h3 {color:#000000; font-size:18px; margin-bottom:5px; font-weight:600;}
#homepage-skills #homepage-skills-container .homepage-skill-box {position:relative; background:#ffffff; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px; margin-bottom:20px; -webkit-border-top-left-radius: 40px;
-webkit-border-bottom-right-radius: 40px; -moz-border-radius-topleft: 40px; -moz-border-radius-bottomright: 40px; border-top-left-radius: 40px; border-bottom-right-radius: 40px;}
#homepage-skills .cta-button {margin:0 auto; width:200px; display:block; text-align:center;}
#homepage-skills #homepage-skills-container .homepage-skill-box .homepage-skill-box-inner {padding:20px;}
#homepage-skills h2.section-title::after {display: block; position: absolute; content: ''; width: 30px; background-color: #ff6f61; height: 2px; bottom: 0;}
/*Homepage Skills*/


/*Homepage Portfolio*/
#homepage-portfolio .section-boxed {padding-top:40px;}
#homepage-portfolio .portfolio-item {text-align:center; margin-bottom:15px; position:relative;}
#homepage-portfolio .portfolio-item a {display:block; overflow:hidden; width:; margin:auto 5%; position:relative;}
#homepage-portfolio .portfolio-item img {max-width:100%;}
#homepage-portfolio .portfolio-item .portfolio-item-overlay {background:rgb(0,0,0,0.3); position:absolute; left:0; top:0; height:100%; width:100%;}
#homepage-portfolio .portfolio-item .portfolio-item-desc {position:absolute; bottom:15px; left:auto; right:auto; margin:0 auto; text-align:center; width:100%; color:#ffffff; font-family:"Poppins", sans-serif; font-weight: 400; font-size:11px;}
#homepage-portfolio .portfolio-item .portfolio-item-desc::before {content:''; width:40%; border-top:1px solid #ffffff; height:2px; display:block; margin:0 auto; padding-bottom:8px; opacity:0.4;}
#homepage-portfolio .portfolio-item .portfolio-item-desc .item-type {width:75%; margin:0 auto;}
/*Homepage Portfolio*/


/*Portfolio Single Pages*/
#portfolio-single {padding-top:150px;}
#portfolio-single h2.section-title {clear:both; display:inline-block; position:relative; font-size:29px; margin-top:0px; z-index:1; padding-bottom:7px; font-weight:700; color:#333333; text-transform:uppercase;}
#portfolio-single h2.section-title::before {display:block; position:absolute; content:''; width:100%; background-color:#f5f5f5; height:2px; bottom:0;}
#portfolio-single h2.section-title::after {display: block; position: absolute; content: ''; width: 30px; background-color: #ff6f61; height: 2px; bottom: 0;}
#portfolio-single .portfolio-single-details .portfolio-single-weblink {display:block; font-size:12px; text-transform:lowercase; font-weight:normal; clear:both; padding-bottom:15px; margin:15px 0;}
#portfolio-single .portfolio-single-details .portfolio-single-weblink a {color:#ffffff; background:#2c1e59; border-radius:20px; padding:10px 20px; text-decoration:none;}
#portfolio-single .portfolio-single-details .portfolio-single-weblink a:hover {background:#ff6f61;}
#portfolio-single .portfolio-single-details .portfolio-single-weblink a i {padding-right:5px;}
#portfolio-single .portfolio-single-details #return-link a {color:#2c1e59;}
#portfolio-single .portfolio-single-details h2 {display:none;}
#portfolio-single .portfolio-single-details ul {list-style:none; text-align:left; border-top:1px solid #ebebeb; padding-top:20px;}
#portfolio-single .portfolio-single-details ul li {list-style:none; border-bottom:1px solid #ebebeb; padding-bottom:20px; margin-bottom:20px;}
#portfolio-single .portfolio-single-details ul li span {font-family:"Poppins", sans-serif; font-weight: 600; color:#ff6f61;}
#portfolio-single .portfolio-single-hero img {max-width:100%; display:none;}


#portfolio-single .portfolio-single-further {clear:both; margin-top:30px;}
#portfolio-single .portfolio-single-further img {max-width:100%;}
#portfolio-single .portfolio-single-further .portfolio-single-further-examples span {margin-bottom:45px; font-size:14px; font-family:"Poppins", sans-serif; font-weight: 400; display:block; padding-top:15px;}
#portfolio-single .portfolio-single-further .portfolio-single-further-examples span em {font-weight:600; color:#ff6f61;}

#portfolio-single .portfolio-mobile-img img {max-width: 100%;}
/*Portfolio Single Pages*/


.portfolio-single-further-examples .portfolio-single-weblink {display:block; font-size:12px; font-weight:normal; clear:both; padding-bottom:15px; margin:15px 0;}
.portfolio-single-further-examples .portfolio-single-weblink a {color:#ffffff; background:#2c1e59; border-radius:20px; padding:10px 20px; text-decoration:none;}
.portfolio-single-further-examples .portfolio-single-weblink a:hover {background:#ff6f61;}
.portfolio-single-further-examples .portfolio-single-weblink a i {padding-right:5px;}


@media only screen and (min-width:768px) { 
  /*Homepage Portfolio*/
  #homepage-portfolio .portfolio-container {display:flex; flex-direction:row; flex-wrap:wrap;}
  #homepage-portfolio .portfolio-container .portfolio-item {flex:0 0 50%;}
  /*Homepage Portfolio*/  

}

@media only screen and (min-width:992px) { 
	#site-content-contain {padding-top:100px;}	
	.cja-container {width:992px; margin:0 auto; position:relative;}


  /*Nav Element*/
  header #burger-menu {display:none !important;}
  header #cja-designs-menu {display:block; background:#ffffff; position:absolute; top:0; right:10px; height:85px;}
  header #cja-designs-menu ul {padding:0; display:flex; flex-direction:row; height:85px; justify-content:space-evenly; width:420px;}
  header #cja-designs-menu ul li.active, header #cja-designs-menu ul li.active a {color:#ff6f61;}
  header #cja-designs-menu ul li {cursor: pointer;}
  header #cja-designs-menu ul li:hover {opacity:0.8;}
  #cja-designs-menu ul li{}
  #cja-designs-menu .mm-navbar {height:55px; --mm-color-background:#ffffff;}
  #cja-designs-menu a {color:#666666; padding:15px 0;}
  #cja-designs-menu ul {display:flex; flex-direction:column; justify-content:center; align-items:center;}
  #cja-designs-menu ul li {list-style:none; font-family:"Poppins", sans-serif; font-weight: 600; text-transform:uppercase; font-size:16px; padding:0;}
  /*Nav Element*/


  /*Homepage Intro*/
  #homepage-intro h2 {font-size:34px;}
  #homepage-intro h2 span {line-height:39px; font-size:22px;}
  #homepage-intro .subtitle {width:60%; margin:0 auto;}
  #homepage-intro-container {display:flex; flex-direction:row; width:830px; margin:0 auto; align-items:center;}
  #homepage-intro #homepage-intro-text {text-align:left; margin-top:0;}
  #homepage-intro #homepage-intro-image img {max-width:65%;}  
  /*Homepage Intro*/


  /*Homepage Skills*/
  #homepage-skills #homepage-skills-container {display:flex; flex-direction:row; flex-wrap:wrap; justify-content:space-evenly;}
  #homepage-skills #homepage-skills-container .homepage-skill-box {flex:0 0 30.3%; margin-bottom:30px; padding:0; align-content: center;}
  /*Homepage Skills*/


  /*Homepage Portfolio*/  
  #homepage-portfolio .portfolio-container .portfolio-item {flex:0 0 33.3%;}
  #homepage-portfolio #portfolio-intro .section-boxed .site-container {display: flex; flex-direction:row; align-items:center;}
  #homepage-portfolio #portfolio-intro .portfolio-details {flex:0 0 50%; text-align:left;}
  /*Homepage Portfolio*/    

  /*Portfolio Single Pages*/
  #portfolio-single .portfolio-mobile-img, #portfolio-single .portfolio-mobile-ttl {display:none !important;}
  #portfolio-single {display:flex; flex-direction:row; flex-wrap:wrap;}
  #portfolio-single h2 {display:inline-block !important;}
  #portfolio-single .portfolio-single-details {flex:0 0 45%; text-align:left;}
  #portfolio-single .portfolio-single-hero {flex:0 0 50%; margin-left:5%;}
  #portfolio-single .portfolio-single-hero img {display:block;}
  #portfolio-single .portfolio-single-further {flex:1 1 100%; width:80%;}
  #portfolio-single .portfolio-single-further {display:flex; justify-content:space-between; flex-wrap:wrap; }
  #portfolio-single .portfolio-single-further img {max-width:100%;}
  #portfolio-single .portfolio-single-further .portfolio-single-further-examples {width:400px;}

 #portfolio-single .portfolio-single-further.buyagift {align-items:center;}
 #portfolio-single .portfolio-single-further.buyagift.sect-campaigncoded {align-items:unset;}
  #portfolio-single .portfolio-single-further .portfolio-single-further-examples.promo-banner {width:70%;}
  #portfolio-single .portfolio-single-further .portfolio-single-further-examples.promo-banner.fw {width:100%;}
  #portfolio-single .portfolio-single-further .portfolio-single-further-examples.promo-banner.split {width:50%;}
  #portfolio-single .portfolio-single-further .portfolio-single-further-examples.paidsocial {width:27%;}
  #portfolio-single .portfolio-single-further .portfolio-single-further-examples.paidsocial.split {width:47%;}
  #portfolio-single .portfolio-single-further .portfolio-single-further-examples.crm {width:31%;}
  #portfolio-single .portfolio-single-further .portfolio-single-further-examples.crm-40 {width:40%;}
  #portfolio-single .portfolio-single-further .portfolio-single-further-examples.campaigncoded {width:22%;}  
  /*Portfolio Single Pages*/  
}

@media only screen and (min-width:1200px) { 
  header #cja-designs-menu {right:20px;}
  header #cja-designs-menu ul {width:500px;}
  .cja-container {width:1200px;}
  #cja-designs-menu ul li {font-size:16px;}

  /*Portfolio Single Pages*/
  #portfolio-intro .section-boxed .site-container {width:85%; margin:0 auto;}
  /*Portfolio Single Pages*/  
}



* {
  margin: 0;
  padding: 0; 
}

/* Icon 1 */

#burger-menu {
  width: 50px;
  height: 45px;
  position: relative;
  margin: 50px auto;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}

#burger-menu span {
  display: block;
  position: absolute;
  height: 4px;
  width: 70%;
  background: #462798;
  border-radius: 4px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

#burger-menu span:nth-child(1) {
  top: 0px;
}

#burger-menu span:nth-child(2) {
  top: 12px;
}

#burger-menu span:nth-child(3) {
  top: 24px;
}

#burger-menu.open span:nth-child(1) {
  top: 18px;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}

#burger-menu.open span:nth-child(2) {
  opacity: 0;
  left: -60px;
}

#burger-menu.open span:nth-child(3) {
  top: 18px;
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
}