.product { background-color: rgba(248, 248, 248, 1); box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.05); border: 2px solid rgba(0, 0, 0, 0.02); border-radius: 15px; padding: 60px 20px; } .product:hover { background: rgba(243, 115, 19, 1); color: #FFF; } .product:hover h5 { color: #FFF; } .product:hover svg, .product:hover path { fill: #FFF; } .product .icon { position: absolute; bottom: 0; right: 15px; opacity: 0.32; } .product .icon svg, .product .icon path { fill: rgba(102, 102, 102, 1); } .btn-outline.btn-warning.btn-svg { border-color: transparent; padding-left: 0; width: auto; } .btn-outline.btn-warning.btn-svg:hover { padding-left: 20px; } .btn-outline.btn-warning.btn-svg:hover svg, .btn-outline.btn-warning.btn-svg:hover path { fill: #FFF; } .title-border { position: relative; display: block; background-color: #F48943; width: 122px; height: 6px; margin: 12px auto 0; } .title-border:after { content: ''; display: block; position: absolute; left: 20px; width: 20px; height: 6px; background-color: #3f3f3f; } .acymailing_module_form .acymailing_introtext { font-size: 14px; } table.acymailing_form { width: 100%; } .inputbox { border: 1px solid #aaaaaa; color: #aaaaaa; font-size: 16px; margin: 10px 0; padding: 10px; } table.acymailing_form .button { font-size: 18px; padding: 10px; text-transform: uppercase; width: 100%; background: #F37313; border: none; } table.acymailing_form .button:hover { background: #000000; color: #FFF; } .modal-backdrop { height: 100%; position: fixed; z-index: 100; } .modal-dialog { margin-top: 10%; z-index: 999; } .blog-featuredoutsourcing .pull-left { float: right !important; width: 450px; max-width: 100%; margin-left: 20px; border: none; } .blog-featuredoutsourcing p { text-align: justify; } .consultingpage .main_body { padding: 0; } .consultingpage .main_body .container-fluid { padding-right: 15px; } .consultingpage .page-header h2 { margin-top: 40px; } .readmore .btn { display: inline-block; color: #FFF; font-size: 18px; border: none; background: #F37313; padding: 10px 20px; } .readmore .btn:hover { background: #333; } .homemodule.mcs_module p { text-align: justify; } .homemodule.mcs_module .col-sm-6 { border-right: 1px #ccc solid; } .homemodule.mcs_module .col-sm-6:last-child { border: none; } .customhomebanner ul { font-size: 28px; line-height: 42px; padding: 0; list-style: none; } @media screen and ( max-width: 767px) { .customhomebanner ul { font-size: 22px; line-height: 34px; } } @media screen and ( max-width: 540px) { .customhomebanner ul { font-size: 18px; line-height: 28px; } } .spinner-dots span { background-color: #f48943; } .slideshow-preloader { position: absolute; bottom: 0; left: 0; right: 0; top: 0; display: flex; align-items: center; justify-content: center; } .slideshow .carousel-item { padding-top: 52.083%; } .slideshow.inner-banner .carousel-item { padding-top: 36%; } .bg-opacity { background-color: rgba(0, 0, 0, 0.5); color: #FFF; } .bg-opacity h1 { color: #FFF; } @media (min-width: 1200px) { .slideshow .carousel-item { padding-top: 40%; } .slideshow.inner-banner .carousel-item { padding-top: 26%; } } .slideshow .carousel-item .container { position: absolute; bottom: 0; top: 0; transform: translateX(-50%); margin-left: 50%; } .slideshow .carousel-item img { position: absolute; bottom: 0; } @media (max-width: 1200px) { .inner-banner .carousel-item img { right: 0; max-width: 140%; } .slideshow .fs-60 { font-size: 40px!important; } .slideshow .fs-55 { font-size: 40px!important; } .slideshow .fs-45 { font-size: 35px!important; } .slideshow .fs-40 { font-size: 30px!important; } } @media (max-width: 991px) { .slideshow .fs-60 { font-size: 30px!important; } .slideshow .fs-55 { font-size: 30px!important; } .slideshow .fs-50 { font-size: 30px!important; } .slideshow .fs-45 { font-size: 25px!important; } .slideshow .fs-40{ font-size: 25px!important; } .slideshow .fs-35 { font-size: 20px!important; } .slideshow .fs-30 { font-size: 20px!important; } .slideshow .fs-28 { font-size: 20px!important; } } @media (max-width: 667px) { .slideshow .carousel-item { padding-top: 62.083%; } .slideshow .carousel-item img { height: 100%; max-width: none; } .slideshow .fs-60 { font-size: 22px!important; } .slideshow .fs-55 { font-size: 21px!important; } .slideshow .fs-50 { font-size: 21px!important; } .slideshow .fs-45 { font-size: 18px!important; } .slideshow .fs-40{ font-size: 17px!important; } .slideshow .fs-35 { font-size: 17px!important; } .slideshow .fs-30 { font-size: 16px!important; } .slideshow .fs-25 { font-size: 16px !important; } } .slideshow .carousel-item img { opacity: 0; transition: .2s linear; } .slideshow .carousel-item.active img { opacity: 1; } .slideshow .carousel-item .caption { position: absolute; bottom: 26px; background-color: rgba(0, 0, 0, 0.6); color: #FFF; padding: 8px 10px; margin-left: -15px; } .slideshow .carousel-item .caption h1 { position: relative; font-size: 13px; line-height: 20px; color: #FFF; font-weight: 500; margin: 0; } .slideshow .carousel-item .caption h1 a { display: inline-block; color: #FFF; border-bottom: 1px solid #FFF; } @media (min-width: 540px) { .slideshow .carousel-item .caption { bottom: 40px; padding: 15px 20px; } .slideshow .carousel-item .caption h1 { font-size: 17px; line-height: 30px; } } @media (min-width: 768px) { .slideshow .carousel-item .caption { bottom: 80px; } .slideshow .carousel-item .caption h1 { font-size: 20px; line-height: 35px; } .slideshow .carousel-item .caption h1 a { border-bottom: 2px solid #FFF; } } @media (min-width: 992px) { .slideshow .carousel-item .caption { padding: 25px 30px; margin-left: 0; } .slideshow .carousel-item .caption h1 { font-size: 22px; line-height: 38px; } } .slideshow .carousel-indicators { bottom: 10px; } @media (min-width: 540px) { .slideshow .carousel-indicators { bottom: 15px; } } @media (min-width: 768px) { .slideshow .carousel-indicators { bottom: 35px; } } .slideshow .carousel-indicators li { width: 35px; height: 3px; border: 1px solid #000; opacity: 0.7; margin: 0 4px; } @media (min-width: 768px) { .slideshow .carousel-indicators li { width: 65px; height: 5px; margin: 0 10px; } } .slideshow .carousel-indicators li.active { background-color: #F47421; opacity: 0.8; } .langChanger { position: absolute; right: 10px; } @media (min-width: 768px) { .bgshadow::before { content: ""; width: 100%; height: 100%; position: absolute; left: 15px; top: 15px; background-color: rgba(0, 0, 0, 1); z-index: 1; border-radius: 0 0 30px 0; padding: 0; } .bgshadow img { position: relative; z-index: 2; width: 100%; border-radius: 0 0 20px 0; } } .bgsvg { position: relative; overflow: hidden; } .bgsvg svg { position: absolute; top: 0; } .aigentbanner { background: rgb(13,47,121); background: radial-gradient(circle, rgba(13,47,121,1) 0%, rgba(12,0,57,1) 100%); } .aigentbanner .caption { background-color: rgba(0, 0, 0, 0.6); color: #FFF; } /* It's supposed to look like a tree diagram */ .overflow-x-auto { overflow-x: auto; /* Enables horizontal scrolling */ width: 100%; /* Ensures it takes full width */ max-width: 100%; /* Prevents overflow beyond parent */ } .tree, .tree ul, .tree li { list-style: none; margin: 0; padding: 0; position: relative; } .tree { text-align: center; } .tree, .tree ul { display: table; } .tree ul { width: 100%; } .tree li { display: table-cell; padding: 40px 0; vertical-align: top; } /* _________ */ .tree li:before { outline: solid 1px #666; content: ""; left: 0; position: absolute; right: 0; top: 0; } .tree li:first-child:before {left: 50%;} .tree li:last-child:before {right: 50%;} .tree code, .tree span { background-color: #F37313; border-radius: 10px; display: inline-block; margin: 0 5px 40px; padding: 15px; position: relative; color: #FFF; } .tree li li { margin-bottom: 0; padding-bottom: 0; } .tree li li span { min-height: 128px; display: flex; align-items: center; margin-bottom: 0; } /* If the tree represents DOM structure */ .tree code { font-family: monaco, Consolas, 'Lucida Console', monospace; } /* | */ .tree ul:before, .tree code:before, .tree span:before { outline: solid 1px #666; content: ""; height: 40px; left: 50%; position: absolute; } .tree ul:before { top: -40px; } .tree code:before, .tree span:before { top: -40px; } /* The root node doesn't connect upwards */ .tree > li {margin-top: 0;} .tree > li:before, .tree > li:after, .tree > li > code:before, .tree > li > span:before { outline: none; } .btn-right-fixed { position: fixed; right: -53px; top: 50%; z-index: 9999; font-size: 18px; background-color: #F37313; color: #fff; padding: 10px 20px; border-radius: 0; rotate: -90deg; width: 150px; text-align: center; } .btn-right-fixed:hover { background-color: #b35101; color: #fff; } .btn-fixed-whatsapp, .btn-fixed-bookcall { position: fixed; bottom: 20px; right: 20px; box-shadow: 0px 0px 10px #999; border-radius: 50%; border: 3px #fff solid; z-index: 99; } .btn-fixed-bookcall { bottom: 75px; right: 20px; } .btn-fixed-whatsapp:hover{ opacity: .8; } .chat_area { position: fixed; right: 20px; bottom: 20px; z-index: 111; } .channels { position: relative; bottom: 50px; transform: translateY(200%); transition: transform 0.3s ease; } .channels a { display: block; margin: 5px 0; padding: 5px; border-radius: 50%; background: #f5f6fa; } .button_area button { position: fixed; right: 20px; bottom: 20px; width: 50px; height: 50px; border: none; border-radius: 50%; padding: 5px; } .chat_area.open .closebtn { transform: rotate(540deg); } .chat_area.open .open_channels { display: none; } .chat_area.open .channels { transform: translateY(0%); } .bgpattren { background-image: url('../images/pattern1.png'); background-repeat: repeat; } .bgpattren2 { background-image: url('../images/pattern2.png'); background-repeat: repeat; }