/*---------------------------------------------------------------------------
Preject Name: Otakim
Preject URL: http://www.otakim.com
Version: 1.0
Description: Bootstrap5, HTML5, CSS3 and Fully Responsive Website.
Author: Otakim Team
---------------------------------------------------------------------------*/

/***** Genral CSS Start *****/
html { scroll-behavior: smooth; }
body { padding: 0px; margin: 0px; font-family: 'Rubik', sans-serif; overflow-x: hidden; color: #344f6b; font-weight: 400; line-height: 1.5;}
img {max-width: 100%; width: auto; height: auto;}
a { display: inline-block; text-decoration: none; -webkit-transition: all ease-in-out 0.3s; transition: all ease-in-out 0.3s;}
a:hover, a:focus, button:hover, button:focus { outline: none !important; box-shadow: none !important; text-decoration: none !important; }
p {font-size: 20px; font-weight: 400; line-height: 1.5; margin-bottom: 10px;}
h1, h2, h3, h4, h5, h6, figure, ul { margin: 0; padding: 0px; }
ul {list-style: none; }

.text-blue {color: #344f6b;}
.text-yellow {color: #fcb948;}

h1, .h1 {font-size: 60px; font-weight: 700; line-height: 1.1; color: #344f6b; margin-bottom: 7px;}
h2, .h2 {font-size: 40px; font-weight: 700; line-height: 1.2; color: #344f6b; margin-bottom: 7px;}
h3, .h3 {font-size: 20px; font-weight: 700; line-height: 1.2; color: #344f6b; margin-bottom: 7px;}
/***** Genral CSS End *****/

/***** Banner Section Start *****/
.banner-sec {padding: 45px 0 10px;}
.banner-sec .container {max-width: 1410px;}
.banner-sec h2 {margin-bottom: 20px;}
.banner-sec p {margin-bottom: 30px;}
.banner-sec .banner-img-wrp img {margin-top: -25px; margin-bottom: -25px;}
.banner-sec .banner-detail-wrp {margin: 0 -5px;}
/***** Banner Section End *****/

/***** CTA Section Start *****/
.print-onlinebooklets-sec {padding: 45px 0 75px; background-color: #276BA9;}
.print-onlinebooklets-sec .container {max-width: 1410px;}
.print-onlinebooklets-sec h2 {margin-bottom: 12px;}
.print-onlinebooklets-sec p {color: #fff; font-size: 25px; font-weight: 400; margin-bottom: 0;}
/***** CTA Section End *****/

/***** Print Factory Section Start *****/
.print-factory-sec {padding: 90px 0 135px; background-color: #fff;}
.print-factory-sec .container {max-width: 1410px;}
.print-factory-sec h3 {margin-bottom: 30px;}
.print-factory-sec p {margin-bottom: 25px;}
.print-factory-sec .print-factory-wrap {margin-bottom: 50px;}
.print-factory-sec .print-factory-wrap img {margin-top: -100px; margin-bottom: -40px; max-width: 700px; margin-right: -70px;}
.print-factory-sec .content-box {max-width: 650px;}
/***** Print Factory Section End *****/

/***** Business Section Start *****/
.business-sec {padding: 0;}
.business-sec .product-row [class*="col-"] {padding: 0;}
.business-sec .business-products-item a {display: block; width: 100%;}
.business-sec .business-products-item-img {position: relative; background-color: #F2F3F5; text-align: center; border-radius: 0; overflow: hidden;}
.business-sec .business-products-item-img:before, 
.business-sec .business-products-item-img:after {content: ""; position: absolute; width: 100%; height: 100%; transition: color 0.25s; border: 2px solid transparent; border-radius: 0px; width: 0; height: 0; z-index: 0;}
.business-sec .business-products-item-img:before {top: 5px; left: 5px;}
.business-sec .business-products-item-img:after {bottom: 5px; right: 5px;}
.business-sec a:hover .business-products-item-img:before, 
.business-sec a:hover .business-products-item-img:after {width: calc(100% - 10px); height: calc(100% - 10px);}
.business-sec a:hover .business-products-item-img:before {border-top-color: #216dac; border-right-color: #216dac; transition: width 0.25s ease-out, height 0.25s ease-out 0.25s;}
.business-sec a:hover .business-products-item-img:after {border-bottom-color: #216dac;border-left-color: #216dac; transition: border-color 0s ease-out 0.5s, width 0.25s ease-out 0.5s, height 0.25s ease-out 0.75s;}
/***** Business Section End *****/

/***** Printed gifts Section Start *****/
.cheap-psychometric-sec {padding: 75px 0 50px; background-color: #F9F9F9;}
.cheap-psychometric-sec .container {max-width: 1410px;}
.cheap-psychometric-sec .cheap-psychometric-img-wrap img {margin-top: -70px; margin-bottom: -55px;}
.cheap-psychometric-sec .content-box {max-width: 650px; padding-top: 20px;}
.cheap-psychometric-sec h2 {margin-bottom: 20px;}
.cheap-psychometric-sec p {margin-bottom: 0;}
/***** Printed gifts Section End *****/

/***** Brochures Section Start *****/
.booklet-gift-sec {padding: 90px 0 35px; background-color: #fff;}
.booklet-gift-sec h2 {margin-bottom: 20px;}
.booklet-gift-sec p {margin-bottom: 25px;}
.booklet-gift-sec .psychometric-img-wrap img {margin-top: -50px; max-width: 750px; margin-right: -110px;}
.booklet-gift-sec .container {max-width: 1410px;}
.booklet-gift-sec .content-box {max-width: 950px;}
/***** Brochures Section End *****/

/***** Printed gifts Section Start *****/
.bag-printing-sec {padding: 75px 0 50px; background-color: #F9F9F9;}
.bag-printing-sec .container {max-width: 1410px;}
.bag-printing-sec .cheap-psychometric-img-wrap img {margin-top: -70px; margin-bottom: -55px;}
.bag-printing-sec .content-box {max-width: 650px; padding-top: 20px;}
.bag-printing-sec h2 {margin-bottom: 20px;}
.bag-printing-sec p {margin-bottom: 0;}
/***** Printed gifts Section End *****/

/***** Brochures Section Start *****/
.psychometric-sec {padding: 90px 0 45px; background-color: #fff;}
.psychometric-sec .container {max-width: 1410px;}
.psychometric-sec .content-box {max-width: 850px; padding-top: 20px;}
.psychometric-sec h2 {margin-bottom: 20px;}
.psychometric-sec p {margin-bottom: 25px;}
.psychometric-sec .psychometric-img-wrap img {margin-top: -40px;}
/***** Brochures Section End *****/

/***** Media Quries *****/
@media (max-width: 1365px) {
    h1, .h1 {font-size: 50px; margin-bottom: 5px;}

    .banner-sec .banner-detail-wrp {padding: 10px 0;}

    .booklet-gift-sec .psychometric-img-wrap img {max-width: 100%; margin-right: 0;}
}
@media (max-width: 1199px) {
    .banner-sec {padding: 45px 0 35px;}
    .banner-sec p {margin-bottom: 20px;}

    .print-onlinebooklets-sec {padding: 45px 0 50px;}

    .print-factory-sec {padding: 60px 0 50px;}
    .print-factory-sec .row.align-items-center {align-items: flex-start !important;}
    .print-factory-sec .print-factory-wrap img {margin-top: -50px; margin-bottom: 0; max-width: 100%; margin-right: 0;}

    .cheap-psychometric-sec .content-box {padding-top: 0;}

    .booklet-gift-sec {padding: 50px 0;}
    .booklet-gift-sec .align-items-center {align-items: flex-start !important;}

    .bag-printing-sec {padding: 50px 0;}
    .bag-printing-sec .content-box {padding-top: 0;}
    .bag-printing-sec .cheap-psychometric-img-wrap img {margin-top: -20px; margin-bottom: 0;}

    .psychometric-sec {padding: 50px 0;}
    .psychometric-sec .content-box {padding-top: 0;}
    .psychometric-sec .psychometric-img-wrap img {margin-top: -20px;}

}
@media (max-width: 991px) {
    h1, .h1 {font-size: 40px;}
    h2, .h2 {font-size: 32px;}
    h3, .h3 {font-size: 18px;}

    p {font-size: 18px;}

    .banner-sec {padding: 30px 0 35px;}
    .banner-sec h1 {text-align: center;}
    .banner-sec p {text-align: center; max-width: 650px; margin: 0 auto;}
    .banner-sec .banner-img-wrp img {margin-top: -10px;}

    .print-onlinebooklets-sec {padding: 40px 0 45px; margin-top: 0;}
    .print-onlinebooklets-sec p {font-size: 18px;}

    .print-factory-sec {padding: 45px 0;}
    .print-factory-sec .psychometric-img-wrap {text-align: center; margin: 0;}
    .print-factory-sec .psychometric-img-wrap img {max-width: 600px; margin-top: -50px; margin-bottom: 0;}
    .print-factory-sec .print-factory-wrap {margin-bottom: 30px;}
    .print-factory-sec .print-factory-wrap img {max-width: 600px; margin-top: -50px; margin-bottom: -50px;}


    .business-sec {position: relative;}
    .business-sec .business-products-item {margin-bottom: 0; text-align: center;}
    .business-sec .business-products-content {padding: 40px;}

    .cheap-psychometric-sec {padding: 45px 0;}
    .cheap-psychometric-sec .cheap-psychometric-img-wrap {text-align: center; margin: 0;}
    .cheap-psychometric-sec .cheap-psychometric-img-wrap img {margin-top: -50px; margin-bottom: -10px; max-width: 600px;}

    .booklet-gift-sec {padding: 45px 0;}
    .booklet-gift-sec .psychometric-img-wrap {text-align: center;}
    .booklet-gift-sec .psychometric-img-wrap img {max-width: 600px; margin-top: -40px; margin-bottom: -10px;}

    .bag-printing-sec {padding: 45px 0;}
    .bag-printing-sec .cheap-psychometric-img-wrap img {max-width: 600px; margin-top: -50px; margin-bottom: -50px;}
    .bag-printing-sec .cheap-psychometric-img-wrap {text-align: center; margin: 0;}

    .psychometric-sec {padding: 45px 0;}
    .psychometric-sec .psychometric-img-wrap {text-align: center;}
    .psychometric-sec .psychometric-img-wrap img {max-width: 600px; margin-top: -25px; margin-bottom: 0;}
}
@media (max-width: 767px) {
    .banner-sec .banner-detail-wrp {padding: 0;}
    .print-factory-sec .psychometric-img-wrap img {max-width: 100%;}
    .print-factory-sec .content-box {max-width: unset;}

    .booklet-gift-sec .psychometric-img-wrap img {max-width: 100%;}
    .booklet-gift-sec .content-box {max-width: unset;}

    .cheap-psychometric-sec .cheap-psychometric-img-wrap img {max-width: 100%;}

    .bag-printing-sec .cheap-psychometric-img-wrap img {max-width: 100%;}

    .psychometric-sec .psychometric-img-wrap img {max-width: 100%;}
    .psychometric-sec .content-box {max-width: unset;}

    .print-onlinebooklets-sec h2 {font-size: 30px;}
    .print-onlinebooklets-sec p {font-size: 20px;}

}
@media (max-width: 575px) {
    h1, .h1 {font-size: 30px;}
    h2, .h2 {font-size: 25px;}
    h3, .h3 {font-size: 18px;}
    p {font-size: 16px;}

    .banner-sec {padding: 20px 0 35px; position: relative; z-index: 1; overflow: hidden;}
    .banner-sec h1 {margin-bottom: 10px;}
    .banner-sec p {font-size: 15px; margin-bottom: 8px;}
    .banner-sec .banner-img-wrp img {margin-bottom: -5px; margin-top: -7px;}


    .print-onlinebooklets-sec .content-box {margin: 0 -5px;}
    .print-onlinebooklets-sec p {font-size: 16px; margin-bottom: 8px;}
    .print-onlinebooklets-sec h2 {font-size: 25px;}

    .print-factory-sec {padding: 39px 0 40px;}
    .print-factory-sec .brochures-img-wrap {margin-bottom: 30px;}
    .print-factory-sec p {margin-bottom: 10px;}
    .print-factory-sec .psychometric-img-wrap {margin: 25px 0;}
    .print-factory-sec .psychometric-img-wrap img {margin-top: -30px; margin-bottom: -20px;}
    .print-factory-sec .print-factory-wrap img {margin-top: -50px; margin-bottom: -50px;}

    .business-sec .business-products-content {padding: 20px 20px 10px;}

    .cheap-psychometric-sec {padding: 25px 0 50px;}
    .cheap-psychometric-sec h2 {margin-bottom: 10px;}
    .cheap-psychometric-sec .cheap-psychometric-img-wrap img {margin-top: -30px; margin-bottom: -10px;}

    .booklet-gift-sec {padding: 39px 0 40px;}
    .booklet-gift-sec p {margin-bottom: 8px;}
    .booklet-gift-sec .psychometric-img-wrap img {max-width: 100%; margin-top: -30px; margin-bottom: 0;}

    .bag-printing-sec {padding: 25px 0 50px;}
    .bag-printing-sec h2 {margin-bottom: 10px;}
    .bag-printing-sec .cheap-psychometric-img-wrap img {margin-top: -25px; margin-bottom: -30px;}

    .psychometric-sec {padding: 39px 0 40px;}
    .psychometric-sec p {margin-bottom: 8px;}
    .psychometric-sec .psychometric-img-wrap img {margin-top: -20px; margin-bottom: 5px;}
}