body{margin:0;font-size:16px;font-family: "Manrope", sans-serif;}
h1{color:#262626;font-weight:800;font-size:46px;line-height:56px}
h1 span,h2 span,h3 span{color:#FCC419}
h2{font-size:34px;line-height:44px;font-weight:800}
h3,h4{font-size:20px;line-height:30px;font-weight:800}
h2,h3,h4{color:#000;padding:0;margin:0}
h1,h2,h3,h4,.cta-btn{font-family: "Manrope", sans-serif;}
p{font-size:16px;line-height:26px;font-weight:500;color:#000;font-family: "Manrope", sans-serif;}
p a{color:#50bdcd;text-decoration:none;font-weight:500}
p a:hover{text-decoration:underline;}
.container{width:85%;margin:0 auto}
.container-2{width:87.5%;margin:0 auto}
.container,.container-2,.main-bnr-wrap,.work-brand,.pro-sec,.sec-prom,.pro-gal,.pro-col,.order-sec,.order-steps-wrap,.steps-col,.step-ment,.who-wrap,.why-sec,.quote-sec,.faq-sec,.faq-wrap,.alone-row{height:auto;overflow:hidden;}
.main-bnr-wrap{width:100%;background-color:#c6e2e6;padding:50px 0}
.main-banner-cont{width:85%;display:table;margin:0 auto}
.main-bnr-left,.main-bnr-right{width:50%;display:table-cell;vertical-align:middle;}
.main-bnr-left{padding:50px 50px 50px 0}
.main-bnr-right{padding:50px 0 50px 50px}
.main-bnr-right img{width:100%;height:auto;}
.main-bnr-wrap p{margin:15px 0;color:#262626;font-size:18px}
.main-bnr-wrap ul{padding:0;display:list-item;margin:15px 0 30px 0;}
.main-bnr-wrap ul li{font-size:16px;color:#f0f0f0;line-height:26px;list-style-image: url('http://localhost/creator/img/tick.png');margin:0 0 5px 25px}
.work-brand{width:100%;background-color:#e2f0f2;padding:80px 0;text-align:center;}
.work-brand-head{margin:0 0 50px 0}
.work-brand-head,.work-brand-logo{width:100%;}
.work-brand-logo img{width:auto;height:40px;vertical-align:middle;display:inline-block;margin:0 10px}
.pro-sec,.who-sec{width:100%;padding:80px 0 65px 0;}
.sec-prom{width:100%;}
.sec-prom h2{width:50%;text-align:center;margin:0 auto}
.sec-prom p{width:50%;margin:10px auto 0 auto;text-align:center;}
.pro-gal{width:100%;font-size:0;padding:25px 0 0 0;}
.pro-col{width:22.5%;margin:25px 1.25% 25px 1.25%;display:inline-block;box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);transition: 0.3s;border-radius:8px;}
.pro-col:hover{box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);}
.pro-col img{width:100%;height:auto;}
.pro-col h3{font-size:18px}
.pro-pic,.pro-txt{width:100%;}
.pro-txt{padding:10px;background-color:#fff;text-align:center;}
.order-sec{width:100%;margin:0 0 70px 0;text-align:center;}
.order-steps-wrap{width:100%;text-align:center;display:flex}
.steps-col{flex:1;width:20%;margin:50px 2.5% 20px 2.5%;padding:50px 20px;background-color:#e2f0f2;border-radius:20px}
.steps-col img{width:auto;height:100px;margin:25px 0}
.step-ment{width:100%;}
.who-sec{padding:80px 0;background-color:#99d6f4}
.who-wrap{width:100%;display:table;}
.who-left,.who-right{width:50%;display:table-cell;vertical-align:middle;}
.who-left{padding:0 50px 0 0;}
.who-left img{width:100%;height:auto;border-radius:20px}
.who-right h3{margin:20px 0}
.who-right p{margin:0 0 30px 0}
.why-sec{width:100%;margin:80px 0 60px 0}
.why-us-wrap{width:100%;margin:25px 0 0 0;display:flex}
.why-col{width:28%;margin:20px 2.5% 50px 2.5%;}
.why-col{flex:1;box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);transition: 0.3s;padding:50px;background-color:#e2f0f2}
.why-col:hover,.steps-col:hover{box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);}
.why-col img{width:auto;height:100px;}
.why-col h3{margin:25px 0}
.quote-sec{width:100%;padding:80px 0;border-radius:0 0 200px 0;background-color:#99d6f4}
.quote-left,.quote-right{width:50%;display:table-cell;vertical-align:middle;}
.quote-left{padding:0 50px 0 0;text-align:center;}
.quote-left img{width:50%;height:auto;}
.quote-right{padding:0 0 0 50px}
.quote-right p{margin:30px 0;}
.main-quote-form{width:100%;}
.main-quote-form input[type=text],.main-quote-form input[type=email],.main-quote-form select,.main-quote-form textarea{width:90%;height:auto;padding:18px 22px;margin:12px 0;box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);border:none;border-radius:10px;font-size:16px}
.main-quote-form textarea{height:150px}
.main-quote-form input[type=text]:focus,.main-quote-form input[type=email]:focus,.main-quote-form select:focus,.main-quote-form textarea:focus{box-shadow: 0 0 0 0 rgba(0,0,0,0.2);outline:none;border:1px solid #dedede;}
.main-quote-form textarea{font-family: "Manrope", sans-serif;border-radius:10px;margin:12px 0 25px 0}
.faq-sec{width:100%;margin:80px 0}
.faq-wrap{width:100%;margin:50px 0 0 0}
.faq-list{list-style:none;padding:0}.faq-list li{margin:0 auto 30px;border:1px solid #cdcdcd;padding:27px 30px;text-align:left}.faq-list .faq-heading::before{content:'+';font-size:40px;display:block;position:absolute;right:0;top:-8px;color:#c2c2c2}.faq-list .the-active .faq-heading::before{content:'-'}.faq-heading{position:relative;cursor:pointer;font-size:18px;font-weight:400;margin:0}.faq-heading:hover{color:var(--theme-color)}.faq-text{display:none}.art-box svg{width:100%}.row{display:flex}.row .col{flex-basis:50%}.read{color:#646464;font-size:16px;line-height:1.5;margin-top:25px}
.alone-row{width:100%;height:auto;margin:5px 0;font-size:14px}
.alone-row input[type=file]{margin:7px 0 0 0}
.main-quote-form input[type=file]:focus{border:none;outline:none;}
.main-quote-form input[type=submit]{margin:20px 0 0 0}


@media (min-width: 1300px) {
.container,.container-2,.main-banner-cont{width:1200px;}
}
@media (max-width: 1024px) {
.pro-col{width:30.8%;margin:25px 1.25% 25px 1.25%;}
.why-us-wrap{display:block}
.why-col{width:95%;vertical-align:top;}
.why-col{display:block;}
}
@media (max-width: 900px) {
.main-banner-cont{display:block;}
.main-bnr-left,.main-bnr-right{width:100%;display:block;vertical-align:top;}
.main-bnr-left{padding:50px 0}
.main-bnr-right{padding:0 0 50px 0}
}
@media (max-width: 800px) {
.pro-col{width:46%;margin:25px 2% 25px 2%;}
.steps-col{padding:25px}
.who-wrap{display:block}
.who-left,.who-right{width:100%;display:block;vertical-align:top;}
.who-left{padding:0;}
.who-right{margin:50px 0 0 0}
.quote-left,.quote-right{width:100%;display:block;vertical-align:top;}
.quote-left{padding:0}
.quote-right{padding:0}
}
@media (max-width: 700px) {
.order-steps-wrap{display:block}
.steps-col{width:95%;margin:50px 2.5% 20px 2.5%;display:block;}
}
@media (max-width: 475px) {
.pro-col{width:94%;margin:50px 2%;display:block;}
}


/*
font-family: "Manrope", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
*/

/*
Black: 262626
Orange: f15f5c
Yellow: E9C46A
Skin: FFF1DB
Blue: 536493
Light Blue: c6e2e6;
lightest blue: e2f0f2;
More Blue: 27aaea;
https://www.optimalprint.ca/en
;
*/