/* Font-Awesome Live URL */ @import url('https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css'); @import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,700,600italic,700italic,800,800italic); @import url('https://fonts.googleapis.com/css?family=Fira+Sans:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i&display=swap'); /***********************************************/ /* CSS @imports must be at the top of the file */ /* Add them above this section */ /***********************************************/ /* ========================================================================== HS COS Boilerplate v1.5.0 ========================================================================== */ /* These includes are optional, but helpful. */ /* HTML 5 Reset */ article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; } audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; } audio:not([controls]) { display: none; } /* Support migrations from wordpress */ .wp-float-left { float: left; margin: 0 20px 20px 0; } .wp-float-right { float: right; margin: 0 0 20px 20px; } /* Responsive Google Maps */ #map_canvas img, .google-maps img { max-width: none; } /* line height fix for reCaptcha theme */ #recaptcha_table td {line-height: 0;} .recaptchatable #recaptcha_response_field {min-height: 0;line-height: 12px;} /* ========================================================================== Index: 1. BASE STYLES - Variables - Macros - Base - Typography 2. COS STRUCTURE - Structure - Header - Content - Footer 3. MAIN NAVIGATION - Custom Menu Primary - Mobile Menu 4. TEMPLATE MODULE CLASSES - Common Template Classes - Site Pages - Landing Pages - System Pages 5. COS COMPONENTS - Blog - Forms - Buttons 6. MISCELLANOUS 7. MOBILE MEDIA QUERIES ========================================================================== */ /* ========================================================================== 1. BASE STYLES ========================================================================== */ /* ========================================================================== Variables ========================================================================== */ /** * Find the most consistently used font styles, colors, and container widths * for your site and assign them to the jinja variables below for easy use * and reference. * * Apply the variable as shown below. Ignore the jingja comment tags. * * */ /* Colors */ /* */ /* */ /* */ /* */ /* */ /* */ /* */ /* */ /* */ /* */ /* Section Background Colors */ /* */ /* */ /* Typography */ /* */ /* */ /* */ /* */ /* Containers */ /* Used on '.page-center' in 'Base' and in the 'Portrait tablet to landscape and desktop' media query */ /* ========================================================================== Macros ========================================================================== */ /** * Create jinja macros for CSS3 properties that need browser prefixes. * * Apply the style as shown below on it's own CSS property line. * Ignore the jinja comment tags. * * */ /** * Example of how to apply the above macro (ignore the jinja comment tags): * * a { * color: red; * font-size: 12px; * * } */ /* ========================================================================== Base ========================================================================== */ /** * Box Sizing * * Applies a natural box layout model to all elements so that width and padding * are essentially combined, making responsive styles easier to manage. */ *, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } html, body { min-height: 100%; margin: 0; padding: 0; } /* Website background color and default font styles */ body { background: #fff; color: #898989; font-family: 'Open Sans', Arial, Sans-Serif; font-size: 16px; line-height: 32px; } /** * Page Center * * Apply .page-center to full-width modules. */ .container-fluid .row-fluid .page-center { float: none; max-width: 1170px; margin: 0 auto; } a { color: #222222; text-decoration:none; letter-spacing:1px; } a:hover, a:focus { color: #ff6489; text-decoration:none; } hr { background-color: #ccc; border: medium none; color: #ccc; height: 1px; margin: 30px 0; } /* Highlighted Text */ ::-moz-selection { color: #fff; background: #212529; text-shadow: none; } ::selection { color: #fff; background: #212529; text-shadow: none; } /* Corrects width issues in table elements created via the wysiwyg editor */ table tr td img {     max-width: initial; } /* Custom HubL div For Background Image */ .row-fluid [class*="span"] { min-height: 1px; } /* ========================================================================== Typography ========================================================================== */ /* Basic text */ p { font-size: 16px; line-height: 32px; letter-spacing: 1px; margin: 0; } small {} strong {} em { letter-spacing: 1px; } cite {} code {} pre {} sup, sub { position: relative; font-size: 75%; line-height: 0; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } /* Headings */ h1, h2, h3, h4, h5, h6 { color: #212529; font-family: 'Fira Sans', Arial, Sans-Serif; letter-spacing: 1px; margin: 0 0 0px 0; text-rendering: optimizelegibility; } h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { margin-top: 0px; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: inherit; text-decoration: none; outline: none !important; } h1 { font-size: 50px; line-height: 60px; } h2 { font-size: 40px; line-height: 50px; } h3 { font-size: 35px; line-height: 45px; } h4 { font-size: 28px; line-height: 38px; } h5 { font-size: 22px; line-height: 32px; } h6 { font-size: 18px; line-height: 28px; } /* Lists */ ul, ol { padding: 0; margin: 0; } li { margin: 15px 0; } li:last-child { margin: 15px 0 0 0; } ul.unstyled, ol.unstyled { list-style: none; margin: 0; padding: 0; } .text-center { text-align: center; } .text-left { text-align: left; } .text-right { text-align: right; } /* Quotes */ blockquote span { letter-spacing: 1px; } blockquote { border-left: 2px solid #ff6489; padding-left: 20px; font-size: 16px; font-weight: 600; margin-bottom: 30px; margin-top: 30px; margin-left: 0px; } /* ========================================================================== 2. COS STRUCTURE ========================================================================== */ /* ========================================================================== Structure ========================================================================== */ /* The outer wrappers of your website */ .header-container-wrapper, .body-container-wrapper, .footer-container-wrapper { background-color: #ffffff; max-width: 100%; width: 100%; } /* The inner wrappers of your website */ .header-container, .body-container, .footer-container { max-width: 100%; width: 100%; } /* Modules - Paddings */ .container-fluid .row-fluid .padding10tb { padding: 10px 0px; } .container-fluid .row-fluid .padding20tb { padding: 20px 0px; } .container-fluid .row-fluid .padding30tb { padding: 30px 0px; } .container-fluid .row-fluid .padding40tb { padding: 40px 0px; } .container-fluid .row-fluid .padding60tb { padding: 60px 15px; } .container-fluid .row-fluid .padding80tb { padding: 80px 0px; } .container-fluid .row-fluid .padding100tb { padding: 100px 0px; } /* ========================================================================== Header ========================================================================== */ .header-container-wrapper {} .header-container {} /* Logo styling */ .header-container .hs_cos_wrapper_type_logo {} .header-container .hs_cos_wrapper_type_logo a {} .header-container .hs_cos_wrapper_type_logo a img {} /* ========================================================================== Content ========================================================================== */ .body-container-wrapper {} .body-container {} /* Unique Pages ========================================================================== */ /* Homepage */ /* Contact Us */ /* About Us */ /* Modular & Reusable Components ========================================================================== */ /* Callouts */ /* Social Media Custom Icons */ /* Additional Menus aside from the Main Nav */ /* ========================================================================== Footer ========================================================================== */ .footer-container-wrapper { background-color: !important; max-width: 100%; width: 100%; } .footer-container { max-width: 100%; width: 100%; } .footer-container.container-fluid { padding: 0px 0px; } .footer-bg h4 { padding: 0 0 15px 0 !important; } .footer-icons ul { margin-bottom: 0px; } .footer-icons li { display: inline-block; list-style: none; margin-bottom: 0; margin-top: 30px; text-align: left; width: 42px; } .footer-icons li:last-child { width: 32px; } .footer-links-col p { margin-bottom: 10px; } .footer-links-col p a { position: relative; color: #898989; } .footer-links-col .last-child p { margin-bottom: 0; } .footer-links-col p a:before { background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489); background-clip: border-box; -webkit-background-clip: text; -webkit-text-fill-color: transparent; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; content: "\f101"; font-family: 'fontawesome'; font-size: 20px; color: #ff6489; text-align: left; padding-right: 10px; } .footer-addr-col ul { display: table; margin-bottom: 20px; } .footer-addr-col ul:last-child { display: table; margin-bottom: 0px; } .footer-addr-col ul li a, .footer-addr-col ul li { color: #898989; display: table-cell; letter-spacing: 1px; vertical-align: top; } .footer-addr-col ul li a { word-break: break-all; white-space: normal; } .footer-addr-col ul li:first-child { width: 45px; } .footer-container.container-fluid .cell-wrapper.layout-widget-wrapper { border: 0 none !important; padding: 0 0 0 0 !important; } .footer-container.container-fluid .widget-span.widget-type-rich_text h3, .footer-container.container-fluid .widget-span.widget-type-raw_jinja h3 { background-color: transparent; border: 0; padding: 0; margin: 0; } .footer-container.container-fluid .widget-span.widget-type-rich_text { margin: 0; } .footer-container.container-fluid p, .footer-container.container-fluid p a { color: #999999; padding: 0 0 15px 0 !important; margin: 0; } .footer-container.container-fluid .hs-rss-byline { padding-top: 5px; } .footer-addr-col ul li img { vertical-align: middle; } .footer-container.container-fluid span, .contact-footer li a, .contact-footer li { color: #999999; vertical-align: sub; } .contact-footer li a:hover { color: #ff6489; } .contact-footer ul li { display: table-cell; letter-spacing: 1px; } .contact-footer ul li:first-child { width: 50px !important; vertical-align: middle; } .contact-footer ul { margin-bottom: 15px; } .contact-footer ul:last-child { margin-bottom: 0 !important; } .hs-footer-company-copyright { color: #898989; letter-spacing: 1px; } /* Copyright Content Center Align */ .widget-type-page_footer span { margin: 0 auto; text-align: center; } .fa-ul-footer ul { display: table-cell; padding-left: 0; margin-left: 0; list-style-type: none; } .fa-ul-footer ul li { display: table-cell; position: relative; margin-right: 0px; } .fa-ul-footer ul li span a:before { background: rgba(238, 238, 238, 0.08) none repeat scroll 0 0; border-radius: 50%; color: #eeeeee; display: inline-block; font-family: "FontAwesome"; font-size: 18px; height: 40px; line-height: 40px; margin-right: 10px; text-align: center; width: 40px; } .fa-ul-footer ul li:first-child span a:before{ content: "\f09a"; } .fa-ul-footer ul li:nth-child(2) span a:before { content: "\f099"; } .fa-ul-footer ul li:nth-child(3) span a:before{ content: "\f0e1"; } .fa-ul-footer ul li:nth-child(4) span a:before { content: "\f0d5"; } .fa-ul-footer ul li:nth-child(5) span a:before { content: "\f16d"; } .fa-ul-footer ul li span a:hover:before { background: #ff6489 none repeat scroll 0 0; transition: 500ms ease-in; } .copyright-bg { border-top: 1px solid #eeeeee; margin-top: 20px; padding-top: 20px; } /* FOOTER POPULAR POSTS */ .footer-container.container-fluid .widget-span.widget-type-raw_jinja h3 { margin-bottom: 5px; } .footer-post-item { display: inline-flex; margin-bottom: 15px; } .footer-post-item-text .post-summary p { padding: 0 !important; } .footer-post-item-image .hs-featured-image-wrapper { width: 100px; } .footer-post-item-image .hs-featured-image-wrapper .hs-featured-image { border-width: 0; display: inline-block; float: left; margin: 0 !important; } .footer-post-item-text { float: right; padding: 0 0px 0 15px; } .footer-post-item-text h4 { color: #eeeeee; font-size: 16px; font-weight: 400; margin-bottom: 0px; } /* ========================================================================== 3. MAIN NAVIGATION ========================================================================== */ /* POSITION IN MENU */ .pos-rel { position: relative; } .menu-pos-abs { position: absolute; top: 0; } /* SUB PAGES MENU COLOR */ .dark-menu-bg .menu-bg .row-fluid { background-color: #222222; padding: 0; } .dark-menu-bg .custom-menu-primary .hs-menu-wrapper > ul > li{ color: #ffffff; } .dark-menu-bg .custom-menu-primary .hs-menu-wrapper > ul > li > a { color: #ffffff; } .dark-menu-bg .custom-menu-primary .hs-menu-wrapper > ul > li > a:hover{ color: #ff6489; } /* Dark Bg menu dropdown arrow */ .dark-menu-bg li.hs-menu-depth-1.hs-item-has-children:after { color: #ffffff; } li.hs-menu-depth-1.hs-item-has-children:focus:after, li.hs-menu-depth-1.hs-item-has-children:active:after, li.hs-menu-depth-1.hs-item-has-children:hover:after { color: #ff6489; } .dark-menu-bg li.hs-menu-depth-2.hs-item-has-children:after { color: #212529; } li.hs-menu-depth-2.hs-item-has-children:focus:after, li.hs-menu-depth-2.hs-item-has-children:active:after, li.hs-menu-depth-2.hs-item-has-children:hover:after { color: #ff6489; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children:hover > ul.hs-menu-children-wrapper { opacity: 0; visibility: hidden; } /* Breadcrumb */ .custom-breadcrumb .hs-breadcrumb-menu { margin-top: 20px; } .custom-breadcrumb > div { color: #ff6489; /*display: table;*/ font-size: 14px; font-weight: 600; letter-spacing: 1px; float: right; text-align: right; margin: 0px auto 0 auto; } .hs-breadcrumb-menu-divider::before, .custom-breadcrumb .hs-breadcrumb-menu-item.last-crumb a:before { content: ""; padding: 0; } .custom-breadcrumb .hs-breadcrumb-menu-item a:before, .custom-breadcrumb ul li:first-child a:before { color: #ff6489; content: "\f101"; float: right; font-family: fontawesome; font-size: inherit; font-weight: 600; padding: 0 10px 0 0; } .custom-breadcrumb ul li a { color: #ff6489; } .custom-breadcrumb .hs-breadcrumb-menu-divider:before { padding-right: 10px; } .custom-breadcrumb .hs-breadcrumb-menu-item { padding: 0px 0 0px 0px; margin: 0; } .custom-breadcrumb .hs-breadcrumb-menu-item.first-crumb { padding-left: 0; } /* ========================================================================== Custom Menu Primary ========================================================================== */ /* Set ul background color */ /* Set li background Color */ /* Set link Color */ /* Set link Hover Color */ .menu-bg .row-fluid { background-color: transparent; padding: 0; } .menu-bg .widget-type-linked_image { float: left; line-height: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul { float: right; } /* Parent List */ .custom-menu-primary .hs-menu-wrapper > ul{ background:#ffffff; } .custom-menu-primary .hs-menu-wrapper > ul > li{ background:#ffffff; color: #212529; letter-spacing: 1px; } .custom-menu-primary .hs-menu-wrapper > ul > li > a { color: #212529; } .custom-menu-primary .hs-menu-wrapper > ul > li > a:hover{ color: #ff6489; } /* Child List */ .custom-menu-primary .hs-menu-wrapper > ul { background: transparent !important; } .custom-menu-primary .hs-menu-wrapper > ul ul{ background: #ffffff !important; padding: 0 15px; } .custom-menu-primary .hs-menu-wrapper > ul ul li{ background: transparent; border-bottom: 1px dotted #eeeeee; letter-spacing: 1px; text-align: left; } .custom-menu-primary .hs-menu-wrapper > ul ul li:last-child{ border-bottom: 0px solid #666666; padding-bottom: 0; } .custom-menu-primary .hs-menu-wrapper > ul ul li a{ color: #9e9e9e; transition: all 300ms ease 0s; } /* Override max width on menu links */ .custom-menu-primary .hs-menu-wrapper > ul li a, .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li a, .hs-menu-wrapper .hs-item-has-children.hs-menu-depth-1 .hs-item-has-children.hs-menu-depth-2 .hs-item-has-children.hs-menu-depth-3 > a, .hs-menu-wrapper .hs-item-has-children.hs-menu-depth-1 .hs-item-has-children.hs-menu-depth-2 > a, .hs-menu-wrapper .hs-item-has-children.hs-menu-depth-1 > a, .hs-menu-wrapper .hs-item-has-children.hs-menu-depth-1 .hs-item-has-children.hs-menu-depth-2 .hs-item-has-children.hs-menu-depth-3 > ul li a, .hs-menu-wrapper .hs-item-has-children.hs-menu-depth-1 .hs-item-has-children.hs-menu-depth-2 > ul li a, .hs-menu-wrapper .hs-item-has-children.hs-menu-depth-1 > ul li a { display: block !important; overflow: visible !important; max-width: none !important; width: auto !important; } .hs-menu-wrapper .hs-item-has-children.hs-menu-depth-1 .hs-item-has-children.hs-menu-depth-2 .hs-item-has-children.hs-menu-depth-3 > ul li a, .hs-menu-wrapper .hs-item-has-children.hs-menu-depth-1 .hs-item-has-children.hs-menu-depth-2 > ul li a, .hs-menu-wrapper .hs-item-has-children.hs-menu-depth-1 > ul li a { padding-bottom: 8px !important; padding-top: 8px !important; padding-left: 0px !important; padding-right: 0px !important; transition: all 300ms ease 0s; width: 100% !important; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li a { font-size: 14px; font-weight: 600; padding: 24px 25px !important; text-transform: uppercase; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li { background-color: transparent; display: inline-block; list-style: outside none none; padding: 0px; } .custom-menu-primary .hs-menu-wrapper.hs-menu-flow-horizontal > ul li { display: inline-flex !important; display: -webkit-inline-flex !important; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li, .hs-menu-wrapper.hs-menu-flow-horizontal > ul li:last-child { margin: 0; } .hs-menu-children-wrapper li { width: 100%; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul > li ul { background-attachment: scroll; background-clip: border-box; background-image: none; background-origin: padding-box; background-position-x: 0; background-position-y: 0; background-repeat: repeat; background-size: auto auto; } .hs-menu-depth-2.hs-item-has-children .hs-menu-children-wrapper { left: 200px !important; top: 0px !important; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper { left: 0; min-width: 215px; opacity: 0; position: absolute; top: 80px; transition: opacity 0.4s ease 0s; visibility: hidden; box-shadow: 0px 5px 12px -8px #999999; -webkit-box-shadow: 0px 5px 12px -8px #999999; -moz-box-shadow: 0px 5px 12px -8px #999999; z-index: 99 !important; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children:last-child ul.hs-menu-children-wrapper { left: -115px; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children, .hs-item-has-children { position: relative; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children:hover > ul.hs-menu-children-wrapper { opacity: 1 !important; visibility: visible !important; } .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-3.hs-item-has-children a { font-size: 12px !important; } .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-2.hs-item-has-children a { font-size: 13px !important; } .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-3:active > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-3:focus > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-3:hover > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-2:active > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-2:focus > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-2:hover > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-2.hs-item-has-children:active > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-2.hs-item-has-children:focus > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-2.hs-item-has-children:hover > a { color: #ff6489 !important; padding-left: 8px !important; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-1.hs-item-has-children:active > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-1.hs-item-has-children:focus > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-1.hs-item-has-children:hover > a { color: #ff6489; } /* menu dropdown arrow */ li.hs-menu-depth-1 > a { padding: 20px 15px 20px 15px !important; } li.hs-menu-depth-1.hs-item-has-children > a { position: relative; padding: 20px 28px 20px 12px !important; } li.hs-menu-depth-1.hs-item-has-children:after { color: #212529; content: "\f0d7"; font-size: inherit; font-family: fontawesome; padding-left: 5px; position: absolute; right: 10px; top: 23px; } li.hs-menu-depth-1.hs-item-has-children:focus:after, li.hs-menu-depth-1.hs-item-has-children:active:after, li.hs-menu-depth-1.hs-item-has-children:hover:after { color: #ff6489; } li.hs-menu-depth-2.hs-item-has-children a { position: relative; } li.hs-menu-depth-2.hs-item-has-children:after { color: #212529; content: "\f0da"; font-size: inherit; font-family: fontawesome; padding-left: 5px; position: absolute; right: 15px; top: 8px; } li.hs-menu-depth-2.hs-item-has-children:focus:after, li.hs-menu-depth-2.hs-item-has-children:active:after, li.hs-menu-depth-2.hs-item-has-children:hover:after { color: #ff6489; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children:hover > ul.hs-menu-children-wrapper { opacity: 0; visibility: hidden; } /* Fix menu disappearing on desktop after toggling mobile menu */ @media screen and (min-width:768px) { .custom-menu-primary .hs-menu-wrapper { display: block !important; } .custom-menu-primary .hs-menu-wrapper.hs-menu-flow-horizontal > ul { display: inline-flex; } .top-menu .hs-menu-wrapper.hs-menu-flow-horizontal > ul { display: inline-flex; } } /* ========================================================================== Mobile Menu - Hubspot Standard Toggle Menu ========================================================================== */ /** * Special Note * * When the menu is open, a class of .mobile-open is applied to the body. You can * use this for custom styling on any element when the menu is in the open position. */ .mobile-trigger, .child-trigger{ display: none; /* Hide button on Desktop */ } @media (max-width: 767px){ /* Variables ========================================================================== */ /* Set Mobile Menu Background Color */ /* Set Link Color */ /* Set Link Hover Color */ /* * Menu Reset * * Remove styling from desktop version of custom-menu-primary. Place any * additional CSS you want removed from the mobile menu in this reset */ .custom-menu-primary { float: none; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li { display: table-cell; list-style: outside none none; padding: 0px 0 0; } .custom-menu-primary .hs-menu-wrapper { background-color: transparent !important; width: 100%; } .custom-menu-primary .hs-menu-wrapper > ul ul li{ border-bottom: 1px dotted rgba(0, 0, 0, .35); padding: 0; } .custom-menu-primary, .custom-menu-primary .hs-menu-wrapper > ul, .custom-menu-primary .hs-menu-wrapper > ul li, .custom-menu-primary .hs-menu-wrapper > ul li a { background-color: transparent !important; background-image: none; border: 0 none; border-radius: 0; bottom: auto; box-shadow: none; color: #212529 !important; display: block; float: none; font-size: 14px !important; font-weight: normal; height: auto; left: auto; line-height: 1.2; margin: 0; max-width: none; padding: 0; position: static; right: auto; text-align: left; text-decoration: none; text-indent: 0; top: auto; width: 100%; } .top-menu .hs-menu-wrapper.hs-menu-flow-horizontal > ul { display: inline-flex !important; line-height: 0; } .top-menu .hs-menu-wrapper.hs-menu-flow-horizontal > ul li { display: table; } .custom-menu-primary .hs-menu-wrapper .hs-item-has-children.hs-menu-depth-1 .hs-item-has-children.hs-menu-depth-2 .hs-item-has-children.hs-menu-depth-3, .custom-menu-primary .hs-menu-wrapper .hs-item-has-children.hs-menu-depth-1 .hs-item-has-children.hs-menu-depth-2, .custom-menu-primary .hs-menu-wrapper .hs-item-has-children.hs-menu-depth-1, .custom-menu-primary .hs-menu-wrapper .hs-item-has-children.hs-menu-depth-1 .hs-item-has-children.hs-menu-depth-2 .hs-item-has-children.hs-menu-depth-3 > ul li:hover a, .custom-menu-primary .hs-menu-wrapper .hs-item-has-children.hs-menu-depth-1 .hs-item-has-children.hs-menu-depth-2 > ul li:hover a, .custom-menu-primary .hs-menu-wrapper .hs-item-has-children.hs-menu-depth-1 > ul li:hover a { display: block !important; } .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-3:active > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-3:focus > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-3:hover > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-2:active > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-2:focus > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-2:hover > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-2.hs-item-has-children:active > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-2.hs-item-has-children:focus > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-2.hs-item-has-children:hover > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-1.hs-item-has-children:active > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-1.hs-item-has-children:focus > a, .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal .hs-menu-item.hs-menu-depth-1.hs-item-has-children:hover > a { color: #ff6489 !important; } /* Toggle Button ========================================================================== */ .mobile-trigger{ display: inline-block !important; /* Show button on mobile */ cursor: pointer; /* Mouse pointer type on hover */ position: absolute; /*******************************************/ top: -62px; /* Position Button at right of screen */ right: 15px; /*******************************************/ width: auto; /* Button width */ height: auto; /* Button height */ padding: 5px 10px 7px 10px; background: #ff6489; /* Background color */ border: 1px solid #212529; font-size: 16px; font-weight: normal; text-align: left; text-transform: uppercase; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; color: #212529; } .mobile-trigger:active, .mobile-trigger:focus, .mobile-trigger:hover{ text-decoration: none; /* Removes link text underline on button */ color:#ff6489; background-color: #212529; border-color: #ff6489; } /* Change button when menu is open */ .mobile-open .mobile-trigger{ color:#ff6489; background-color: #ffffff; border-color: #ff6489; } /* Toggle Button Icon ========================================================================== */ .mobile-trigger i{ background-color: #212529; /* Icon color */ display: inline; position: relative; top: -4px; } .mobile-trigger i:before, .mobile-trigger i:after{ background-color: #212529; /* Icon color */ position: absolute; content: ''; } .mobile-trigger i, .mobile-trigger i:before, .mobile-trigger i:after{ width: 22px; /* Icon line width */ height: 2px; /* Icon line height */ -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; background-color: #ffffff; /* Icon color */ display: inline-block; } .mobile-trigger i:before{ top: -6px; /* Position top line */ } .mobile-trigger i:after{ top: 6px; /* Position bottom line */ } .mobile-trigger:hover i, .mobile-trigger:hover i:before, .mobile-trigger:hover i:after, .mobile-open .mobile-trigger i, .mobile-open .mobile-trigger i:before, .mobile-open .mobile-trigger i:after{ background-color: #ff6489; /* Icon color */ } .top-menu .mobile-trigger span.fa { color: #ffffff; } .top-menu .mobile-trigger:focus span.fa, .top-menu .mobile-trigger:active span.fa, .top-menu .mobile-trigger:hover span.fa { color: #ff6489; } /* Child Toggle Button ========================================================================== */ .child-trigger{ display: block !important; /* Hide button on Desktop */ cursor: pointer; /* Mouse pointer type on hover */ position: absolute; top: 0px; right: 0px; width: 55px !important; /* Button width */ min-width: 55px !important; height: 48px !important; /* Button height */ padding: 0 !important; border-left: 1px dotted rgba(255, 255, 255, .20); } .child-trigger:hover{ text-decoration: none; } .child-trigger i{ position: relative; top: 50%; /* Centers icon inside button */ margin: 0 auto !important; } .child-trigger i:after{ position: absolute; content: ''; } .child-trigger i, .child-trigger i:after{ width: 10px; /* Icon line width */ height: 1px; /* Icon line height */ background-color:#212529; /* Icon color */ display: block !important; } .child-trigger i:after{ -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); } .child-trigger.child-open i:after{ -webkit-transform: rotate(-180deg); -ms-transform: rotate(-180deg); transform: rotate(-180deg); } .child-trigger.child-open i{ -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } /* Menu Styles on Mobile Devices ========================================================================== */ .custom-menu-primary.js-enabled{ position: relative; padding-top: 44px; /* Makes room for button */ margin: 10px 0 10px 0; } /* Hide menu on mobile */ .custom-menu-primary.js-enabled .hs-menu-wrapper, .custom-menu-primary.js-enabled .hs-menu-children-wrapper{ display: none; overflow: visible !important; } /* Make child lists appear below parent items */ .custom-menu-primary ul.hs-menu-children-wrapper{ visibility: visible !important; opacity: 1 !important; position: static !important; display: none; } /* Mobile Menu Styles */ .custom-menu-primary.js-enabled .hs-menu-wrapper{ width: 100%; position: relative; /**************************************************************/ top: 0; /* Positions the menu to drop from the very top of the screen */ left: 0; /**************************************************************/ padding: 0; } .custom-menu-primary .hs-menu-wrapper{ background-color:#ffffff; /* Menu background color set off global menuColorMobile variable */ width: 100%; /* Full screen width */ } /* Level 1 Menu List Styles */ .custom-menu-primary .hs-menu-wrapper > ul > li{ position: relative; } .custom-menu-primary .hs-menu-wrapper > ul > li a{ font-size: 14px; /* Font size of top level list items */ line-height: 24px; overflow: visible; } /* Level 1 and Higher Menu List Styles */ .custom-menu-primary .hs-menu-wrapper > ul{ border: 1px dotted rgba(0, 0, 0, .35);/* Adds transparent dark highlights to top of top level list items */ } .custom-menu-primary .hs-menu-wrapper > ul li{ border-bottom: 1px dotted rgba(0, 0, 0, .35);/* Adds transparent dark highlights to top of top level list items */ } .custom-menu-primary .hs-menu-wrapper > ul li:last-child { border-bottom: 0px dotted rgba(0, 0, 0, .35);/* Adds transparent dark highlights to top of top level list items */ } .custom-menu-primary .hs-menu-wrapper > ul li a{ padding: 10px 10px; color:#212529; /* link color set by global mobile-aColor variable */ } /* Level 2 and Higher Menu List Styles */ .custom-menu-primary .hs-menu-wrapper > ul ul li{ background-color: #ffffff; color: #212529; } .custom-menu-primary .hs-menu-wrapper > ul ul li a{ text-indent: 2px; /* Indent Child lists */ font-size: 13px !important; /* Font size of child lists */ } /* Level 3 and Higher Menu List Styles */ .custom-menu-primary .hs-menu-wrapper > ul ul ul li a{ text-indent: 2px; /* Indent Child lists */ } .custom-menu-primary .hs-menu-wrapper > ul ul ul ul li a{ text-indent: 2px; /* Indent Child lists */ } } /* ========================================================================== 4. TEMPLATE MODULE SELECTORS ========================================================================== */ /* Common Template Selectors ========================================================================== */ body.one-column {} body.two-column {} body.three-column {} .content-wrapper {} .main-content {} .sidebar{} .sidebar.right{} .sidebar.left{} /* Common One Column Selectors */ body.site-page.one-column, body.landing-page.one-column, body.error-template.one-column, body.password-template.one-column, body.subscription-template.one-column {} body.site-page.one-column .main-content, body.landing-page.one-column .main-content, body.error-template .main-content, body.password-template .main-content, body.subscription-template .main-content {} /* Common Two Column Selectors */ body.site-page.two-column, body.landing-page.two-column, body.blog {} body.site-page.two-column .main-content, body.landing-page.two-column .main-content, body.blog .blog-content {} /* Common Three Column Selectors */ body.site-page.three-column, body.landing-page.three-column {} body.site-page.three-column .main-content, body.landing-page.three-column .main-content {} /* Site Pages ========================================================================== */ /* One Column Template */ body.site-page.one-column {} body.site-page.one-column .content-wrapper {} body.site-page.one-column .main-content {} /* Two Column Template */ body.site-page.two-column {} body.site-page.two-column .content-wrapper {} body.site-page.two-column .main-content {} body.site-page.two-column .sidebar.right {} /* Three Column Template */ body.site-page.three-column {} body.site-page.three-column .content-wrapper {} body.site-page.three-column .main-content {} /* ======================== Corporate page-1 Style Starts ================================================== */ .content-width{ width: 100%; margin: 0 auto!important; float: none!important; padding: 0 15px; max-width: 1170px; } .section-space { padding-bottom: 100px; padding-top: 100px; } .image-center { margin: 0 auto; } .image-right { margin: 0 0 0 auto; } .image-left { margin: 0 auto 0 0; } .image-radius { border-radius: 5px; } .center { text-align: center; } .left { text-align: left; } .right { text-align: right; } .column-center { float: none !important; margin: 0 auto !important; } .parallax { background-attachment: fixed; } .pad-left { padding-left: 35px; } .pad-right { padding-right: 35px; } .heading-bottom { margin-bottom: 15px; } .content-top-space { padding-top: 15px; } .content-top-space1 { padding-top: 20px; } .content-top-space2 { padding-top: 25px; } .content-top-space3 { padding-top: 50px; } .content-top-space4 { margin-top: 60px; } .content-bottom-space { padding-bottom: 20px; } .image-bottom { margin: 0 0 25px 0; } .underline-ul { line-height: 16px; margin: 0 auto 10px; text-align: center; } .bgimage-property { background-position: center center; background-repeat: no-repeat; background-size: cover; } .readmore p a { color: #ff6489; font-family: 'Fira Sans', Arial, Sans-Serif; font-size: 16px; font-weight: 600; letter-spacing: 1px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .readmore p a:hover { color: #212529; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .readmore p a:hover:after { padding-left: 10px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .readmore p a:after { content: "\f101"; font-family: fontawesome; font-size: 15px; padding-left: 5px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .content-ul { padding-left: 0; margin-bottom: 0; } .content-ul li { list-style: none; } .intro-content p { font-size: 18px; font-weight: 400; line-height: 32px; letter-spacing: 1px; margin: 10px auto 0 auto; text-align: center; width: 50%; } .word-break { word-break: break-all; } .btn p a { border: 1px solid transparent; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; color: #ffffff; cursor: pointer; font-family: 'Fira Sans', Arial, Sans-Serif; font-size: 16px; font-weight: 600; line-height: 24px; letter-spacing: 1px; outline: none; padding: 15px 40px; } .btn.price-btn-2 p, .btn.price-btn-1 p { line-height: 55px; } .btn.price-btn-1 p a { background-color: #222222; color: #ffffff; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .btn.price-btn-2 p a, .btn.btn-1 p a { background-color: #ff6489; color: #ffffff; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; position: relative; } .btn.btn-2 p a { background-color: #9f70ed; color: #ffffff; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; position: relative; } .btn-2 p a, .btn-1 p a { border: none; display: inline-block; text-align: center; cursor: pointer; outline: none; overflow: hidden; position: relative; margin: 0 auto; z-index: 10; } .btn.btn-1 p a:focus, .btn.btn-1 p a:hover { background-color: #ffffff; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.20); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .btn p a.focus, .btn p a:focus { box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 5px 8px 15px rgba(0, 0, 0, 0.20); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .btn.btn-2 p a:focus, .btn.btn-2 p a:hover { color: #ffffff; background-color: #ff6489; } .btn-top { margin-top: 35px; } .subs-btn { background: rgba(0,0,0,0.5) linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; background: -moz-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* IE10+ */ } .btn-1 p a { background: rgba(0,0,0,0.5) linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; background: -moz-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* IE10+ */ margin: 0 auto; border-radius: 5px; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } /* Back to top Button */ #return-to-top { position: fixed; bottom: 20px; right: 20px; background: #ff6489; box-shadow: 1px 2px 3px #000000; width: 50px; height: 50px; display: block; text-decoration: none; -webkit-border-radius: 35px; -moz-border-radius: 35px; border-radius: 35px; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; z-index: 9; } #return-to-top i { color: #ffffff; margin: 0; position: relative; left: 16px; top: 8px; font-size: 19px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } #return-to-top:hover { background: #9f70ed; } .section-bg-1 { background-color: #FFFFFF; } .section-bg-2 { background-color: #F6F6F6; } .webpage-container p, .webpage-container h1, .webpage-container h2, .webpage-container h3, .webpage-container h4, .webpage-container h5, .webpage-container h6 { margin: 0; } .webpage-container a:hover { color: inherit; } .title-bottom { margin: 0 0 50px 0; } img { border: 0 none; max-width: 100%; vertical-align: text-bottom; } .introcontent p { color: #898989; font-size: 15px; font-weight: 600; line-height: 25px; letter-spacing: 1px; text-align: center; } /* LANDING PAGE CSS STARTS */ /*========== HEADER START =============*/ /*========== HEADER END ============*/ /*===WEBSITE PAGE==*/ /*========================================== HEADER START ===========================================*/ .header-bg { padding-bottom: 180px; padding-top: 260px; } .header-head h1 { font-size: 50px; font-weight: 600; line-height: 60px; letter-spacing: 1px; margin-bottom: 20px; } .header-content p { font-size: 16px; font-weight: 600; letter-spacing: 1px; line-height: 32px; } .header-head .btn-1 p a { color: #ffffff; font-size: 16px; font-weight: 600; letter-spacing: 1px; } /* ALL PAGE HEADER */ .page-header-div h1 { color: #ffffff; font-size: 50px; font-weight: 600; line-height: 60px; letter-spacing: 1px; } /*========================================== HEADER END ===========================================*/ /*========================================== SERVICES START ===========================================*/ .services-col { border: 1px solid #f8f8f8; background-color: #ffffff; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 40px 20px 40px; position: relative; text-align: center; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } .services-col:hover .services-col-img:before { opacity: 1; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } .services-col:hover { box-shadow: 0px 0px 15px #f2f2f2; -webkit-box-shadow: 0px 0px 15px #f2f2f2; -moz-box-shadow: 0px 0px 15px #f2f2f2; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } .services-col-img:before { border-radius: 7px; -webkit-border-radius: 7px; -moz-border-radius: 7px; box-shadow: 0px 0px 8px #898989; -webkit-box-shadow: 0px 0px 8px #898989; -moz-box-shadow: 0px 0px 8px #898989; content: ""; width: 80px; height: 80px; position: absolute; left: 0; right: 0; margin: 0 auto; top: 15px; text-align: center; transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; opacity: 0; } .services-col-img { border-radius: 5%; -webkit-border-radius: 5%; -moz-border-radius: 5%; text-align: center; margin: 0 auto 20px; position: relative; z-index: 9; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } .services-col-top { margin-top: 30px; } .services-col:hover .services-col-content p, .services-col:hover .services-col-content h4 { -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } /*========================================== SERVICES END ===========================================*/ /*========================================== ABOUT US START ===========================================*/ img { border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; height: auto; } .sub-uline { line-height: 8px; margin-bottom: 10px; text-align: left; } .counter-space25 { padding-top: 25px; } .abt-space25 { margin-top: 25px; } .aboutpoints { margin-left: 0px !important; } .abt-top { margin-top: 40px; } .br-left { border-left: 1px solid #ff6489; padding-left: 15px; } .aboutpoints .count p { color: #ff6489; font-size: 30px; font-weight: 600; line-height: 40px; letter-spacing: 1px; } .aboutpoints .counter-head p { color: #212529; font-size: 18px; font-weight: 600; line-height: 24px; letter-spacing: 1px; margin-top: 10px; } .counter-right { padding-right: 0px; } .abt-img img { z-index: 9; } .abt-img { position: relative; z-index: 9; background-clip: padding-box; -webkit-backface-visibility: hidden; box-shadow: 1px 1px 1px transparent; outline: 1px solid transparent; -webkit-background-clip: padding-box; -webkit-transform-origin: 51% 51%; } .abt-img:before { background: rgba(0,0,0,0.5) linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; background: -moz-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* IE10+ */ content: ""; position: absolute; left: 0px; right: 0px; top: 0px; margin: 0 auto; border-radius: 5px; width: 100%; height: 100%; transform: translateZ(-1px) rotate(5deg); -webkit-transform: translateZ(-1px) rotate(5deg); -moz-transform: translateZ(-1px) rotate(5deg); -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; z-index: -1; background-clip: padding-box; -webkit-backface-visibility: hidden; box-shadow: 1px 1px 1px transparent; outline: 1px solid transparent; -webkit-background-clip: padding-box; -webkit-transform-origin: 51% 51%; } /*========================================== ABOUT US END ===========================================*/ /*========================================== OUR PACKAGE START ===========================================*/ .package-col { background-color: #f6f6f6; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 60px 30px; text-align: center; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .package-col-center { background-color: #f6f6f6; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 60px 30px; text-align: center; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .package-col:hover, .package-col-center:hover { box-shadow: 0 3px 8px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 3px 8px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 3px 8px rgba(0, 0, 0, 0.20); text-align: center; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .package-col .package-tag p { border-bottom: 1px solid #eeeeee; color: #ff6489; font-size: 45px; line-height: 55px; letter-spacing: 1px; padding-bottom: 15px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .package-col-center .package-tag p { border-bottom: 1px solid #c19fc1; color: #ff6489; font-size: 45px; line-height: 55px; letter-spacing: 1px; padding-bottom: 15px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .package-col-center .package-tag p , .package-col-center .package-head-col h4 , .package-col-center .package-content p { color: #ffffff; } .package-head-col h4 { padding-bottom: 10px; } .package-head-col { padding: 0 0px 0px; } .package-tag p span { font-size: 18px; } .package-tag p span:first-child { vertical-align: super; } .package-tag p span:last-child { vertical-align: inherit; } .package-content p { color: #212529; letter-spacing: 1px; padding: 20px 0px 0; } .package-content p span { font-weight: 700; } .package-content p:first-child { padding: 20px 0px 0; } /*========================================== OUR PACKAGE END ===========================================*/ /*========================================== OUR PORTFOLIO START ===========================================*/ .portfolio-div { padding: 0 30px; } .portfolio-img { position: relative; z-index: 9; } .portfolio-img img { z-index: 9; } .portfolio-img:before { background: rgba(0,0,0,0.5) linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; background: -moz-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* IE10+ */ content: ""; position: absolute; left: 0px; right: 0px; top: 0px; margin: 0 auto; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; width: 100%; height: 100%; transform: translateZ(-1px) rotate(5deg); -webkit-transform: translateZ(-1px) rotate(5deg); -moz-transform: translateZ(-1px) rotate(5deg); -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; z-index: -1; background-clip: padding-box; -webkit-backface-visibility: hidden; box-shadow: 1px 1px 1px transparent; outline: 1px solid transparent; -webkit-background-clip: padding-box; -webkit-transform-origin: 51% 51%; } .portfolio-content { display: block; position: relative; } .portfolio-content h4 { padding-top: 150px; } .portfolio-pad-top { padding-bottom: 25px; padding-top: 25px; } .btn-bot { position: absolute; bottom: -128px; } .owl-theme .owl-controls .owl-buttons div { border-radius: 5px !important; bottom: 105px; position: absolute; right: 0px; background-color: #ff6489 !important; } .owl-theme .owl-controls .owl-buttons .owl-prev { right: 40px; } .owl-theme .owl-controls .owl-buttons .owl-next { right: 0px; } /*========================================== OUR PORTFOLIO END ===========================================*/ /*========================================== OUR TEAM START ===========================================*/ .team-col-br-lb { border-radius: 5px 0 0 5px; -webkit-border-radius: 5px 0 0 5px; -moz-border-radius: 5px 0 0 5px; } .team-col-br-rb { border-radius: 0 5px 5px 0; -webkit-border-radius: 0 5px 5px 0; -moz-border-radius: 0 5px 5px 0; } .team-col { display: block; overflow: hidden; position: relative; -moz-transition: all .5s ease-in-out; -webkit-transition: all .5s ease-in-out; -ms-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out; } .team-col img { border-radius: 0; } .team-col-content { bottom: 15px; left: 0px; margin-bottom: 0; position: absolute; right: 0; text-align: center; background: rgba(0,0,0,0.5) linear-gradient(90deg, rgba(255,100,137,0.5), #ff6489) repeat scroll 0 0; background: -moz-linear-gradient(90deg, #ff6489, rgba(255,100,137,0.5)) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(90deg, #ff6489, rgba(255,100,137,0.5)) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(90deg, #ff6489, rgba(255,100,137,0.5)) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(90deg, rgba(255,100,137,0.5), #ff6489) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(90deg, #ff6489, rgba(255,100,137,0.5)) repeat scroll 0 0; /* IE10+ */ border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 20px !important; margin: 0px auto 0 auto !important; -moz-transition: all .5s ease-in-out; -webkit-transition: all .5s ease-in-out; -ms-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out; z-index: 100; width: 90% !important; } .team-col-content p, .team-col-content h4 { -moz-transition: all .5s ease-in-out; -webkit-transition: all .5s ease-in-out; -ms-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out; } .team-col .team-col-content p, .team-col .team-col-content h4 { color: #ffffff; -moz-transition: all .5s ease-in-out; -webkit-transition: all .5s ease-in-out; -ms-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out; } .team-col:hover .team-col-content { background: rgba(0,0,0,0.5) linear-gradient(90deg, rgba(255,100,137,0.8), rgba(159,112,237,0.8)) repeat scroll 0 0; background: -moz-linear-gradient(90deg, rgba(159,112,237,0.8), rgba(255,100,137,0.8)) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(90deg, rgba(159,112,237,0.8), rgba(255,100,137,0.8)) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(90deg, rgba(159,112,237,0.8), rgba(255,100,137,0.8)) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(90deg, rgba(255,100,137,0.8), rgba(159,112,237,0.8)) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(90deg, rgba(159,112,237,0.8), rgba(255,100,137,0.8)) repeat scroll 0 0; /* IE10+ */ bottom: 15px; -moz-transition: all .5s ease-in-out; -webkit-transition: all .5s ease-in-out; -ms-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out; } .team-col:hover .team-icons { bottom: 20px; position: static; opacity: 1; -moz-transition: all .5s ease-in-out; -webkit-transition: all .5s ease-in-out; -ms-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out; } .team-col-content h4 { margin-bottom: 5px; } .team-icons { bottom: 20px; margin-top: 20px; opacity: 0; position: absolute; left: 0; right: 0; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .team-icons ul { margin-bottom: 0px; } .team-icons li { display: inline-block; list-style: none; text-align: left; margin: 0; width: 42px; } .team-icons li:last-child { width: 32px; } .team-grp-col { text-align: center; } .team-col { display: inline-block !important; float: none !important; margin-left: 0px !important; margin-right: -5px; text-align: center; } /*========================================= OUR TEAM END ===========================================*/ /*========================================== OUR CLIENTS START ===========================================*/ .clients-col > div { display: table; margin: 0 auto !important; text-align: center; } .clients-col .clients-img { margin-bottom: 20px; width: 17.9% !important; } .clients-col img { opacity: 0.5; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } .clients-col img:hover { opacity: 1; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } /*========================================== OUR CLIENTS END ===========================================*/ /*========================================== OUR TESTIMONIAL START ===========================================*/ .testimonial-white .intro-content, .testimonial-white h2 { color: #ffffff; } .testimonial-bg { background-image: url("../../images/1920x1500x1.jpg"); } .testimonial-div { margin: 0 auto; width: 90%; } .testimonial-div p { color: #898989; } .testimonial-name p { color: #ff6489 !important; font-family: 'Fira Sans', Arial, Sans-Serif; font-size: 16px; font-weight: 400; letter-spacing: 1px; } .no-mar-left { margin-left: 0 !important; } .client-content { background-color: #ffffff; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 30px 30px; position: relative; text-align: center; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .client-content:before { border-left: 15px solid #ffffff; border-top: 15px solid #ffffff; border-bottom: 15px solid transparent; border-right: 15px solid transparent; content: ""; position: absolute; bottom: -28px; left: 50px; } .testimonial-top { margin-top: 50px; } .client-content h4 { margin-top: 20px; } .client-img { margin-top: 50px; } .client-img ul { display: table; padding-left: 0px; } .client-img ul li { text-align: left; display: table-cell; vertical-align: middle; } .client-img ul li:first-child { width: 150px; } .owl-carousel.testimonial .owl-item img { width: auto; } /*========================================== OUR TESTIMONIAL END ===========================================*/ /*========================================== CTA START ===========================================*/ a#cta_button_3813597_e04866cc-830a-420d-abb9-0ca29c5c4b15.cta-btn { background: rgba(0,0,0,0.5) linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0 !important; background: -moz-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0 !important; /* FF3.6+ */ background: -webkit-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0 !important; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0 !important; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0 !important; /* Opera 11.10+ */ background: -ms-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0 !important; /* IE10+ */ border: 0 !important; border-radius: 5px !important; -webkit-border-radius: 5px !important; -moz-border-radius: 5px !important; color: #ffffff !important; cursor: pointer !important; display: inline-block !important; font-size: 16px !important; font-weight: 600 !important; padding: 15px 40px 15px 40px !important; letter-spacing: 1px !important; text-transform: uppercase !important; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } a#cta_button_e04866cc-830a-420d-abb9-0ca29c5c4b15:hover, .cta-btn:hover { box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 5px 8px 15px rgba(0, 0, 0, 0.20); -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } a#cta_button_3813597_e04866cc-830a-420d-abb9-0ca29c5c4b15:hover span, .cta-btn:hover span { color: #ffffff !important; } /*========================================== CTA END ===========================================*/ /*========================================== OUR NEWS START ===========================================*/ .news-col { margin: 0px auto 0 auto; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; position: relative; } .news-img1 img { z-index: 9; } .news-img1 { position: relative; z-index: 9; } .news-img1:before { background: rgba(0,0,0,0.5) linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; background: -moz-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* IE10+ */ content: ""; position: absolute; left: 0px; right: 0px; top: 0px; margin: 0 auto; border-radius: 5px; width: 100%; height: 100%; transform: translateZ(-1px) rotate(5deg); -webkit-transform: translateZ(-1px) rotate(5deg); -moz-transform: translateZ(-1px) rotate(5deg); -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; z-index: -1; background-clip: padding-box; -webkit-backface-visibility: hidden; box-shadow: 1px 1px 1px transparent; outline: 1px solid transparent; -webkit-background-clip: padding-box; -webkit-transform-origin: 51% 51%; } .news-date p a { color: #ff6489; display: inline-block; font-family: 'Fira Sans', serif; font-size: 14px; font-weight: 400; letter-spacing: 1px; line-height: 24px; margin-bottom: 0px; text-align: center; } .news-col-top { margin-top: 100px; } .news-content { padding: 25px 0px 0px 0px; } /*========================================== OUR NEWS END ===========================================*/ /*========================================== SUBSCRIBE US START ===========================================*/ .subscribe-padding { padding-bottom: 40px; padding-top: 40px; } .sub-head-top { margin-top: 25px; text-align: center; } .subs-btn-col .subs-btn { border-radius: 0 5px 5px 0; -webkit-border-radius: 0 5px 5px 0; -moz-border-radius: 0 5px 5px 0; position: absolute; right: 15px; top: -61px; } .subs-head form { display: flex; display: -webkit-box; margin: 0 auto; width: 90%; } .subs-head .hs-form .hs-form-field { margin-top: 0!important; margin-right: 0px; width: 100%; } .hubspot-link__container { display: none; } .subs-head .hs_submit.hs-submit { position: relative; } .subs-head .actions { position: absolute; right: 0px; top: 37px; } .subs-head .hs-button.primary, .subs-head input[type="submit"], .subs-head input[type="button"] { background: rgba(0,0,0,0.5) linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; background: -moz-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* IE10+ */ -webkit-border-radius: 0 5px 5px 0; -moz-border-radius: 0 5px 5px 0; border-radius: 0 5px 5px 0; color: #ffffff; height: auto; border: 0; padding: 15px 40px; margin-top: 0 !important; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } .subs-head .hs-button.primary:hover, .subs-head input[type="submit"]:hover, .subs-head input[type="button"]:hover { box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 5px 8px 15px rgba(0, 0, 0, 0.20); -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; border: 0; color: #ffffff; } .subs-head .hs-button.primary:focus, .subs-head input[type="submit"]:focus, .subs-head input[type="button"]:focus { border: 0; } .subs-head input[type="text"], .subs-head input[type="password"], .subs-head input[type="datetime"], .subs-head input[type="datetime-local"], .subs-head input[type="date"], .subs-head input[type="month"], .subs-head input[type="time"], .subs-head input[type="week"], .subs-head input[type="number"], .subs-head input[type="email"], .subs-head input[type="url"], .subs-head input[type="search"], .subs-head input[type="tel"], .subs-head input[type="color"], .subs-head input[type="file"], .subs-head textarea, .subs-head select { box-shadow: 0px 0px 6px -2px #898989; -webkit-box-shadow: 0px 0px 6px -2px #898989; -moz-box-shadow: 0px 0px 6px -2px #898989; border: 0; padding: 15px 10px; } .subs-head .submitted-message { color: #898989; margin: 0 auto 0 auto; letter-spacing: 1px; font-family: 'Open Sans', Arial, Sans-Serif; text-align: center; } /*========================================== SUBSCRIBE US END ===========================================*/ /*========= ABOUT US PAGE START ========= */ /*========================================== ABOUT US PAGE SECTION HEADER START ===========================================*/ .abt-bg-padding { padding-bottom: 80px; padding-top: 80px; } /*========================================== ABOUT US PAGE SECTION HEADER END ===========================================*/ /*========================================== ABOUT US PAGE SECTION ABOUT START ===========================================*/ .sign-name { margin-top: 30px; } .sign-name p { color: #ff6489; font-size: 18px; font-weight: 400; line-height: 28px; letter-spacing: 1px; } /*========================================== ABOUT US PAGE SECTION ABOUT END ===========================================*/ /*========================================== ABOUT US PAGE SECTION COUNTER START ===========================================*/ .abt-div-counter .counter-right { padding-right: 40px; } .abt-div-counter .br-left { border: none; } .abt-div-counter .abt-div { background-color: rgba(34,34,34,0.7); border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 30px 20px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .abt-div-counter .abt-div:hover { background: rgba(0,0,0,0.5) linear-gradient(90deg, rgba(255,100,137,0.8), rgba(159,112,237,0.8)) repeat scroll 0 0; background: -moz-linear-gradient(90deg, rgba(159,112,237,0.8), rgba(255,100,137,0.8)) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(90deg, rgba(159,112,237,0.8), rgba(255,100,137,0.8)) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(90deg, rgba(159,112,237,0.8), rgba(255,100,137,0.8)) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(90deg, rgba(255,100,137,0.8), rgba(159,112,237,0.8)) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(90deg, rgba(159,112,237,0.8), rgba(255,100,137,0.8)) repeat scroll 0 0; /* IE10+ */ box-shadow: 0px 0px 8px #898989; -webkit-box-shadow: 0px 0px 8px #898989; -moz-box-shadow: 0px 0px 8px #898989; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .abt-div-counter i { font-size: 40px; color: #ffffff; } .abt-div-counter .count p { color: #ffffff; font-size: 40px; font-weight: 600; line-height: 50px; letter-spacing: 1px; } .abt-div-counter .counter-head h4 { color: #ffffff; font-size: 18px; font-weight: 600; line-height: 24px; letter-spacing: 1px; margin-bottom: 15px; margin-top: 20px; } /*========================================== ABOUT US PAGE SECTION COUNTER END ===========================================*/ /*========================================== ABOUT US PAGE SECTION TEAM START ===========================================*/ .team-pg-col-img { display: block; overflow: hidden; position: relative; -moz-transition: all .5s ease-in-out; -webkit-transition: all .5s ease-in-out; -ms-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out; } .team-pg-col-content { background: rgba(0,0,0,0.5) linear-gradient(90deg, rgba(255,100,137,0.5), #ff6489) repeat scroll 0 0; background: -moz-linear-gradient(90deg, #ff6489, rgba(255,100,137,0.5)) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(90deg, #ff6489, rgba(255,100,137,0.5)) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(90deg, #ff6489, rgba(255,100,137,0.5)) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(90deg, rgba(255,100,137,0.5), #ff6489) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(90deg, #ff6489, rgba(255,100,137,0.5)) repeat scroll 0 0; /* IE10+ */ border-radius: 5px; -webkit-border-radius: 5px 5px; -moz-border-radius: 5px 5px; left: 18px; right: 0; padding: 40px 20px 30px 20px; position: relative; margin: -20px auto 0 auto; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; z-index: 9; width: 90% !important; } .team-pg-col-content p, .team-pg-col-content h4 { text-align: center; -moz-transition: all .5s ease-in-out; -webkit-transition: all .5s ease-in-out; -ms-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out; } .team-pg-col .team-pg-col-content p, .team-pg-col .team-pg-col-content h4 { color: #ffffff; -moz-transition: all .5s ease-in-out; -webkit-transition: all .5s ease-in-out; -ms-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out; } .team-pg-col:hover .team-pg-col-content { background: rgba(0,0,0,0.5) linear-gradient(130deg, rgba(255,100,137,0.9), rgba(159,112,237,0.9)) repeat scroll 0 0; background: -moz-linear-gradient(130deg, rgba(159,112,237,0.9), rgba(255,100,137,0.9)) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(130deg, rgba(159,112,237,0.9), rgba(255,100,137,0.9)) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(130deg, rgba(159,112,237,0.9), rgba(255,100,137,0.9)) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(130deg, rgba(255,100,137,0.9), rgba(159,112,237,0.9)) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(130deg, rgba(159,112,237,0.9), rgba(255,100,137,0.9)) repeat scroll 0 0; /* IE10+ */ -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .team-pg-col:hover .team-pg-icons { bottom: 40px; -moz-transition: all .5s ease-in-out; -webkit-transition: all .5s ease-in-out; -ms-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out; } .team-pg-col-content h4 { margin-bottom: 5px; } .team-pg-icons { bottom: -55px; margin: 0px auto; padding: 0 10px; position: absolute; left: 0; right: 0; text-align: center; -moz-transition: all 0.2s ease-in-out; -webkit-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .team-pg-icons ul { margin-bottom: 0px; } .team-pg-icons li { display: inline-block; list-style: none; text-align: left; width: 45px; } .team-pg-icons li:last-child { width: 32px; } /*========================================== ABOUT US PAGE SECTION TEAM END ===========================================*/ /*========= ABOUT US PAGE END ========= */ /*========= SERVICES PAGE START ========= */ /*========================================== SERVICE PAGE SECTION SERVICES 2 START ===========================================*/ .services-pg-col { border: 1px solid #f8f8f8; background-color: #ffffff; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 40px 20px 40px 80px; position: relative; text-align: left; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } .services-pg-col:hover { box-shadow: 0px 0px 8px #898989; -webkit-box-shadow: 0px 0px 8px #898989; -moz-box-shadow: 0px 0px 8px #898989; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } .services-pg-col:hover .services-pg-img:before { opacity: 1; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } .services-pg-img:before { border-radius: 7px; -webkit-border-radius: 7px; -moz-border-radius: 7px; box-shadow: 0px 0px 8px #898989; -webkit-box-shadow: 0px 0px 8px #898989; -moz-box-shadow: 0px 0px 8px #898989; content: ""; width: 80px; height: 80px; position: absolute; left: 15px; top: 15px; transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; opacity: 0; } .services-pg-col:hover { box-shadow: 0px 0px 15px #f2f2f2; -webkit-box-shadow: 0px 0px 15px #f2f2f2; -moz-box-shadow: 0px 0px 15px #f2f2f2; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } .services-pg-img { position: absolute; left: -56px; top: 26%; bottom: 0%; margin: auto; } .services-pg-top { margin-top: 30px; } .services-pg-col:hover .services-pg-content p, .services-pg-col:hover .services-pg-content h4 { -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .service-pad-right { padding-right: 55px; } .service-pad-left { padding-left: 55px; } /*========================================== SERVICE PAGE SECTION SERVICES 2 END ===========================================*/ /*========= SERVICES PAGE END ========= */ /*========= SERVICE DETAILS PAGE START ========= */ /*========================================== SERVICE DETAILS PAGE SECTION-1 START ===========================================*/ .services-details-menu ul { list-style: none; padding-left: 0; margin-bottom: 0; } .services-details-menu ul li { border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; margin-bottom: 0; margin-top: 20px; background-color: #f6f6f6; padding: 10px 15px; } .services-details-menu ul li:first-child { margin-top: 0px; } .services-details-menu ul li a { color: #212529; font-family: 'Fira Sans', Arial, Sans-Serif; font-weight: 600; letter-spacing: 1px; padding: 0 0px !important; } .active6 .services-details-menu ul li:nth-child(6), .active5 .services-details-menu ul li:nth-child(5), .active4 .services-details-menu ul li:nth-child(4), .active3 .services-details-menu ul li:nth-child(3), .active2 .services-details-menu ul li:nth-child(2), .active1 .services-details-menu ul li:first-child { background: rgba(0,0,0,0.5) linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; background: -moz-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* IE10+ */ } .active6 .services-details-menu ul li:nth-child(6) a, .active5 .services-details-menu ul li:nth-child(5) a, .active4 .services-details-menu ul li:nth-child(4) a, .active3 .services-details-menu ul li:nth-child(3) a, .active2 .services-details-menu ul li:nth-child(2) a, .active1 .services-details-menu ul li:first-child a { color: #ffffff; } .tab-content-top { margin-top: 40px; } /*========================================== SERVICE DETAILS PAGE SECTION-1 END ===========================================*/ /*========= SERVICE DETAILS PAGE END ========= */ /*========= PORTFOLIO LIST PAGE START ========= */ /*========================================== PORTFOLIO LIST PAGE SECTION PORTFOLIO 2 START ===========================================*/ .portfolio-pg-div { position: relative; } .portfolio-pg-img { position: relative; z-index: 9; } .portfolio-pg-img img { z-index: 9; } .portfolio-pg-img:before { background: rgba(0,0,0,0.5) linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; background: -moz-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* IE10+ */ content: ""; position: absolute; left: 0px; right: 0px; top: 0px; margin: 0 auto; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; width: 100%; height: 100%; transform: rotate(5deg); -webkit-transform: rotate(5deg); -moz-transform: rotate(5deg); -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; z-index: -1; } .portfolio-pg-content { background-color: rgba(255,255,255,0.9); border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 30px 20px; position: absolute; top: 45px; margin: 0 auto !important; left: 0; right: 0; bottom: 45px; opacity: 0; width: 73% !important; z-index: 9; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } .portfolio-pg-div:hover .portfolio-pg-content { opacity: 1; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } .portfolio-pg-top { margin-top: 100px; } .portfolio-pg-div > div { margin: 0 auto; max-width: 80% !important; width: 80% !important; } /*========================================== PORTFOLIO LIST PAGE SECTION PORTFOLIO 2 END ===========================================*/ /*========= PORTFOLIO LIST PAGE END ========= */ /*========= PORTFOLIO DETAILS PAGE START ========= */ /*========================================== PORTFOLIO DETAILS PAGE SECTION START ===========================================*/ .portfolio-details { background-color: #f6f6f6; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 40px 30px; } .details-top-space { margin-top: 10px; } .portfolio-details p span { font-size: 14px; letter-spacing: 1px; } .portfolio-details p span:first-child { float: left; font-weight: 600; width: 52%; } .portfolio-details p span:nth-child(2) { float: left; width: 20px; } .portfolio-details p span:nth-child(3) { float: left; width: 42%; } .details-list, .portfolio-list { margin-top: 20px; } .details-list ul, .portfolio-list ul { display: table; padding-left: 0px; margin-top: 0; margin-bottom: 0; list-style: none; } .details-list ul li:last-child, .portfolio-list ul li:last-child { margin-bottom: 0px; } .details-list ul li, .portfolio-list ul li { display: inline-flex; display: -webkit-flex; letter-spacing: 1px; list-style: none; font-weight: 600; text-align: left; margin-bottom: 15px; padding-left: 0px; margin-top: 0; vertical-align: middle; } .details-list ul li:before, .portfolio-list ul li:before { background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489); background-clip: border-box; -webkit-background-clip: text; -webkit-text-fill-color: transparent; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; font-size: 20px; color: #ff6489; content: "\f101"; font-family: 'fontawesome'; line-height: 25px; vertical-align: top; margin-top: 4px; padding-right: 15px; } .portfolio-details-content { padding-top: 45px; } .portfolio-bg > div { background: rgba(0,0,0,0.5) linear-gradient(130deg, rgba(255,100,137,0.8), rgba(159,112,237,0.8)) repeat scroll 0 0; background: -moz-linear-gradient(130deg, rgba(159,112,237,0.8), rgba(255,100,137,0.8)) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(130deg, rgba(159,112,237,0.8), rgba(255,100,137,0.8)) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(130deg, rgba(159,112,237,0.8), rgba(255,100,137,0.8)) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(130deg, rgba(255,100,137,0.8), rgba(159,112,237,0.8)) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(130deg, rgba(159,112,237,0.8), rgba(255,100,137,0.8)) repeat scroll 0 0; /* IE10+ */ border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 30px; margin: auto; width: 80%; } .portfolio-bg p { color: #ffffff; } .float-right { float: right !important; } .float-left { float: left !important; margin-left: 0px !important; padding-right: 25px; } /*========================================== PORTFOLIO DETAILS PAGE SECTION END ===========================================*/ /*========= PORTFOLIO DETAILS PAGE END ========= */ /*========= FAQ PAGE START ========= */ /*========================================== FAQ START ===========================================*/ .faq-ans { padding: 20px; border-bottom: 1px solid #eeeeee; border-left: 1px solid #eeeeee; border-right: 1px solid #eeeeee; border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px; } .faq-accord { margin-top: 0px; } .faq-top { margin-top: 30px; } .faq-ques { position: relative; } .faq-ques p { background-color: #f6f6f6; color: #212529; border: 1px solid #eeeeee; cursor: pointer; font-family: 'Fira Sans', Arial, Sans-Serif; font-size: 18px; font-weight: 600; line-height: 28px; letter-spacing: 1px; padding: 10px 45px 10px 20px; border-radius: 5px 5px; -webkit-border-radius: 5px 5px; -moz-border-radius: 5px 5px; position: relative; } .faq-ques:after { background-color: #f9f9f9; border: 1px solid #eeeeee; border-radius: 0px 5px 0 0; -webkit-border-radius: 0px 5px 5px 0; -moz-border-radius: 0px 5px 5px 0; content: "\f0d7"; color: #ff6489; cursor: pointer; font-family: fontawesome; padding: 8px 15px 8px; position: absolute; right: 0; top: 0px; } .faq-col:hover .faq-ques p, .faq-col .faq-ques.active p { background-color: #ffffff; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .faq-col .faq-ans { border: 1px solid rgba(255,100,137,0.3); border-top: none; } .faq-col:hover .faq-ques:after { background-color: #ff6489; color: #ffffff; border: 1px solid rgba(255,100,137,0.3); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .faq-col .faq-ques.active:after { background-color: #ff6489; border: 1px solid rgba(255,100,137,0.3); color: #ffffff; content: "\f0d7"; border-radius: 0px 5px 0 0; -webkit-border-radius: 0px 5px 0 0; -moz-border-radius: 0px 5px 0 0; } .faq-col .faq-ques.active p { border: 1px solid rgba(255,100,137,0.3); border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; } .faq-list { margin-top: 20px; } .faq-list-content ul, .faq-list ul { display: table; padding-left: 0px; margin-bottom: 0px; list-style: none; } .faq-list-content ul { margin-bottom: 15px; } .faq-list ul li { display: inline-flex; display: -webkit-flex; letter-spacing: 1px; list-style: none; font-weight: 600; text-align: left; margin-bottom: 15px; padding-left: 0px; margin-top: 0; vertical-align: middle; } .faq-list-content ul:last-child, .faq-list ul li:last-child { margin-bottom: 0; } .faq-list ul li:before { background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489); background-clip: border-box; -webkit-background-clip: text; -webkit-text-fill-color: transparent; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; font-size: 20px; color: #ff6489; content: "\f101"; font-family: 'fontawesome'; line-height: 25px; vertical-align: top; margin-top: 4px; padding-right: 15px; } .faq-list-content ul li:first-child { width: 40px; } .faq-list-content ul li { display: table-cell; letter-spacing: 1px; font-weight: 600; text-align: left; vertical-align: top; } .faq-list-content ul li img { vertical-align: text-top; } .faq-ans { display: none; } .faq-list-content { margin-top: 20px; } .no-margin { margin-left: 0 !important; } /* FAQ SECTION SINGLE COLUMN START */ .accord-ans { padding: 20px; border-bottom: 1px solid #eeeeee; border-left: 1px solid #eeeeee; border-right: 1px solid #eeeeee; border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px; } .accord-col { margin-top: 0px; } .faq-top { margin-top: 30px; } .accord-ques { position: relative; } .accord-ques p { background-color: #f6f6f6; color: #212529; border: 1px solid #eeeeee; cursor: pointer; font-family: 'Fira Sans', Arial, Sans-Serif; font-size: 18px; font-weight: 600; line-height: 28px; letter-spacing: 1px; padding: 10px 45px 10px 20px; border-radius: 5px 5px; -webkit-border-radius: 5px 5px; -moz-border-radius: 5px 5px; position: relative; } .accord-ques:after { background-color: #f9f9f9; border: 1px solid #eeeeee; border-radius: 0px 5px 0 0; -webkit-border-radius: 0px 5px 5px 0; -moz-border-radius: 0px 5px 5px 0; content: "\f0d7"; color: #ff6489; cursor: pointer; font-family: fontawesome; padding: 8px 15px 8px; position: absolute; right: 0; top: 0px; } .faq-col1:hover .accord-ques p, .faq-col1 .accord-ques.active p { background-color: #ffffff; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .faq-col1 .accord-ans { border: 1px solid rgba(255,100,137,0.3); border-top: none; } .faq-col1:hover .accord-ques:after { background-color: #ff6489; color: #ffffff; border: 1px solid rgba(255,100,137,0.3); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .faq-col1 .accord-ques.active:after { background-color: #ff6489; border: 1px solid rgba(255,100,137,0.3); color: #ffffff; content: "\f0d7"; border-radius: 0px 5px 0 0; -webkit-border-radius: 0px 5px 0 0; -moz-border-radius: 0px 5px 0 0; } .faq-col1 .accord-ques.active p { border: 1px solid rgba(255,100,137,0.3); border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; } .accord-col.white-text .faq-list-content ul li a, .accord-col.white-text .faq-list ul li, .accord-col.white-text .accord-ans p { color: #ffffff; } .accord-col.white-text .faq-col1 .accord-ans { background-color: rgba(34,34,34,0.7); border: 1px solid rgba(255,100,137,0.8); border-top: none; } /* FAQ SECTION SINGLE COLUMN END */ /*========================================== FAQ END ===========================================*/ /*========= FAQ PAGE END ========= */ /*========= PRICING PAGE START ========= */ /*========================================== OUR PRICING SECTION START ===========================================*/ .pricing-col { background-color: #f6f6f6; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; box-shadow: 0 3px 8px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 3px 8px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 3px 8px rgba(0, 0, 0, 0.20); padding: 60px 30px; text-align: center; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .pricing-col:hover { box-shadow: 0 3px 10px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 3px 10px rgba(0, 0, 0, 0.20); text-align: center; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .pricing-col .pricing-tag p { border-bottom: 1px solid #eeeeee; color: #ff6489; font-size: 45px; line-height: 55px; letter-spacing: 1px; padding-bottom: 15px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .pricing-col-center .pricing-tag p { border-bottom: 1px solid #c19fc1; color: #ff6489; font-size: 45px; line-height: 55px; letter-spacing: 1px; padding-bottom: 15px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .pricing-head-col h4 { padding-bottom: 10px; } .pricing-head-col { padding: 0 0px 0px; } .pricing-tag p span { font-size: 18px; } .pricing-tag p span:first-child { vertical-align: super; } .pricing-tag p span:last-child { vertical-align: inherit; } .pricing-content p { color: #212529; letter-spacing: 1px; padding: 10px 0px 0; } .pricing-content p span { font-weight: 700; } .pricing-content p:first-child { padding: 20px 0px 0; } .price-top { margin-top: 30px; } .price-list { margin-top: 20px; } .price-list ul { display: table; padding-left: 0px; margin-bottom: 0px; list-style: none; } .price-list ul li { letter-spacing: 1px; font-weight: 600; text-align: left; margin-bottom: 15px; margin-top: 0; display: table; display: -webkit-inline-flex; list-style: none; } .price-list ul li:last-child { margin-bottom: 0; } .price-list ul li:before { background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489); background-clip: border-box; -webkit-background-clip: text; -webkit-text-fill-color: transparent; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; font-size: 18px; color: #ff6489; content: "\f101"; font-family: 'fontawesome'; line-height: 25px; padding-right: 20px; vertical-align: top; margin-top: 4px; } /*========================================== OUR PRICING SECTION END ===========================================*/ /*========= PRICING PAGE END ========= */ /*========= TEAM PAGE START ========= */ /*========================================== TEAM FOUNDER START ===========================================*/ .founder-img { position: relative; z-index: 9; } .founder-img img { border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; z-index: 9; } .founder-top { margin-top: 80px; } .founder-img:before { background: rgba(0,0,0,0.5) linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; background: -moz-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* IE10+ */ content: ""; position: absolute; left: 0px; right: 0px; top: 0px; margin: 0 auto; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; width: 100%; height: 100%; transform: translateZ(-1px) rotate(5deg); -webkit-transform: translateZ(-1px) rotate(5deg); -moz-transform: translateZ(-1px) rotate(5deg); -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; z-index: -1; background-clip: padding-box; -webkit-backface-visibility: hidden; box-shadow: 1px 1px 1px transparent; outline: 1px solid transparent; -webkit-background-clip: padding-box; -webkit-transform-origin: 51% 51%; } .founder-content { padding-top: 50px; } .founder-icons ul { margin-bottom: 20px; margin-top: 0px; padding-left: 0; } .founder-icons li { list-style: none; display: inline-block; padding-right: 15px; margin: 0; } .founder-icons li:last-child { padding-right: 0px; } /*========================================== TEAM FOUNDER END ===========================================*/ /*========================================== OUR TEAM EXPERTS START ===========================================*/ .experts-col { background-color: #f6f6f6; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; } .experts-img { background-color: #ff6489; border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; padding: 50px; position: relative; } .experts-img img { border-radius: 100%; -webkit-border-radius: 100%; -moz-border-radius: 100%; position: absolute; left: 30px; top: 30px; height: 150px !important; width: 150px !important; } .experts-content { padding: 100px 30px 30px; } .experts-content .experts-top5 { margin-top: 5px; } .experts-content .experts-top5 p { color: #ff6489; font-family: 'Fira Sans', serif; font-size: 16px; font-weight: 400; letter-spacing: 1px; } .experts-website, .experts-call { font-size: 14px; font-weight: 600; letter-spacing: 1px; } .experts-website, .experts-call, .experts-icon { margin-bottom: 0; margin-top: 10px; } .experts-icon ul { margin-bottom: 0 !important; } .experts-icon li { list-style: none; display: inline-block; margin: 0; line-height: 16px; } .experts-icon li { padding-right: 15px; } .experts-icon li:last-child { padding-right: 0; } .experts-website p span a, .experts-call p span a { padding-left: 15px; color: #898989; } .experts-call ul li { list-style: none; } .experts-call ul li img { vertical-align: middle; } .experts-website p span a, .experts-call p span a, .experts-website p img, .experts-call p img { display: table-cell; } .experts-website ul li a, .experts-call ul li a { word-break: break-all; } /*========================================== OUR TEAM EXPERTS END ===========================================*/ /*========= TEAM PAGE END ========= */ /*========================================== CONTACT US-1 PAGE SECTION HEADER START ===========================================*/ /*========================================== CONTACT US-1 PAGE SECTION HEADER END ===========================================*/ /*========================================== CONTACT US-1 PAGE SECTION FORM START ===========================================*/ .contact-col-bg > .row-fluid-wrapper.row-depth-1 { width: 50% !important; } .contact-col-bg > .row-fluid-wrapper.row-depth-1:nth-child(1) { float: left!important; } .contact-col-bg > .row-fluid-wrapper.row-depth-1:nth-child(2) { float: right !important; } .full-col-bg { float: left !important; position: inherit; width: 100% !important; } .contact-bg { position: relative; } .contact-width { box-shadow: 0 12px 15px -12px rgba(0,0,0,0.2); -webkit-box-shadow: 0 12px 15px -12px rgba(0,0,0,0.2); -moz-box-shadow: 0 12px 15px -12px rgba(0,0,0,0.2); float: right !important; width: 100% !important; padding: 173px 20px 171px; } .contact-width .content-width { float: left !important; } .contact-padding { padding-bottom: 150px; padding-top: 150px; } .contact-content { margin-top: 0; margin-bottom: 10px; letter-spacing: 1px; } .content-top10 { margin-top: 10px; } .get-touch-col { padding-left: 30px; padding-right: 30px; } .get-touch-col { letter-spacing: 1px; } .get-touch-col ul { list-style: none; padding-left: 0; margin-bottom: 15px; } .contact-top { margin-top: 30px; } .phone-col, .email-col, .location-col { background-color: rgba(255,255,255,0.7); border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; box-shadow: 0 12px 15px -12px rgba(0,0,0,0.2); -webkit-box-shadow: 0 12px 15px -12px rgba(0,0,0,0.2); -moz-box-shadow: 0 12px 15px -12px rgba(0,0,0,0.2); padding: 30px 30px; } .phone-col li, .email-col li, .location-col li { margin-top: 0; } .phone-col p a, .email-col p a, .location-col p a { color: #898989; } /* FORM CSS */ .contact-form .hs-form fieldset.form-columns-3, .contact-form .hs-form fieldset.form-columns-2, .contact-form .hs-form fieldset.form-columns-1, .contact-form .hs-form .hs-form-field { float: left; } .contact-form .hs_cos_wrapper_type_form label, .contact-form .hs_cos_wrapper_type_form .hs-form-field > label { color: #999999; } .contact-form input, .contact-form label { display: block; width: 100%; } .contact-form .hs-form-radio input[type="radio"], .contact-form .hs-form-checkbox input[type="checkbox"], .contact-form input[type="radio"], .contact-form input[type="checkbox"] { display: inline-block; width: 20px !important; } .contact-form .hs_cos_wrapper_type_form input[type="radio"], .contact-form .hs_cos_wrapper_type_form input[type="checkbox"] { margin: 0 10px 0 0; } .contact-form .hs-form-checkbox-display > span, .contact-form .hs-form-radio-display > span { color: #666666; vertical-align: middle; } .contact-form textarea { max-height: 70px; } .contact-form fieldset .hs-input { width: 100% !important; } .contact-form .form-columns-2 > div .input { margin-right: 20px !important; } .contact-form .form-columns-2 > div:last-child .input, .contact-form .form-columns-1 .input { margin-right: 0px !important; } .contact-form .form-columns-3 > div, .contact-form .form-columns-1 > div, .contact-form .form-columns-2 > div { padding-right: 0px !important; } .contact-form .hs_submit { margin-top: 0px; clear: both; } .contact-form .hs_submit .actions { padding-top: 30px; clear: both; } .contact-form .hs-form-field { /* margin-top: 0px !important;*/ } .contact-form .hs-button.primary:focus, .contact-form .hs-button.primary:active, .contact-form input[type="submit"]:focus, .contact-form input[type="button"]:focus { color: #ffffff; } .contact-form .hs_error_rollup { display: block; margin-top: 65px; position: absolute; width: 100%; } .contact-form .hs_error_rollup li { list-style: outside none none; } .contact-form .hs-error-msgs.inputs-list li, .contact-form .hs-error-msgs { margin-bottom: 0 !important; } .contact-form .hs-button.primary, .contact-form input[type="submit"], .contact-form input[type="button"] { background: rgba(0,0,0,0.5) linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; background: -moz-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* IE10+ */ -webkit-border-radius: 5px 5px; -moz-border-radius: 5px 5px; border-radius: 5px 5px; color: #ffffff; height: auto; border: 0; padding: 15px 40px; margin-top: 0 !important; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } .contact-form .hs-button.primary:hover, .contact-form input[type="submit"]:hover, .contact-form input[type="button"]:hover { box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 5px 8px 15px rgba(0, 0, 0, 0.20); -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; border: 0; color: #ffffff; } .contact-form .hs-button.primary:focus, .contact-form input[type="submit"]:focus, .contact-form input[type="button"]:focus { border: 0; } .contact-form input[type="text"], .contact-form input[type="password"], .contact-form input[type="datetime"], .contact-form input[type="datetime-local"], .contact-form input[type="date"], .contact-form input[type="month"], .contact-form input[type="time"], .contact-form input[type="week"], .contact-form input[type="number"], .contact-form input[type="email"], .contact-form input[type="url"], .contact-form input[type="search"], .contact-form input[type="tel"], .contact-form input[type="color"], .contact-form input[type="file"], .contact-form textarea, .contact-form select { box-shadow: 0px 0px 6px -2px #898989; -webkit-box-shadow: 0px 0px 6px -2px #898989; -moz-box-shadow: 0px 0px 6px -2px #898989; border: 0; padding: 12px 10px; } .contact-form select { background-color: transparent !important; border: 1px solid #eeeeee; height: 45px; line-height: 45px; } .contact-form .submitted-message { margin: 0 auto 0 auto; letter-spacing: 1px; font-family: 'Open Sans', Arial, Sans-Serif; text-align: left; } /*========================================== CONTACT US-1 PAGE SECTION FORM END ===========================================*/ /*========================================== PAGE 404 START ===========================================*/ .page-404-head > div { background-color: #ffffff; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; margin: 0 auto; padding: 60px 30px; text-align: center; width: 650px; } .error-title p { color: #212529; font-family: 'Fira Sans', Arial, Sans-Serif; font-size: 50px; font-weight: 600; letter-spacing: 1px; line-height: 60px; margin-bottom: 20px; margin-top: 20px; } .error-content p { color: #898989; font-size: 25px; font-weight: 600; letter-spacing: 1px; line-height: 35px; } /* GOOGLE SEARCH */ .google-search .hs-button.primary:before { bottom: 0; color: #fff; content: ""; font-family: fontawesome; font-size: 13px; font-weight: 400; left: 0; position: relative; right: 0; top: -10px; } .widget-type-google_search .hs-button.primary, .google-search .hs-button.primary { border-radius: 0 5px 5px 0; left: 0; margin-left: -46px; max-height: 38px; padding: 15px; position: relative; right: 0; top: -7px; } .widget-type-google_search .hs-button.primary:hover, .google-search .hs-button.primary:hover { background-color: #212529; border: 1px solid #212529; } .google-search .input input[type="text"], .widget-type-google_search input[type="text"] { margin-top: 17px; max-height: 40px; width: 160px; } .google-search .input { display: inline-flex; } /*========================================== PAGE 404 END ===========================================*/ /*========================================== PAGE 500 START ===========================================*/ .page500-head > div { background-color: #ffffff; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; margin: 0 auto; padding: 60px 30px; text-align: center; width: 650px; } .error500-title p { color: #212529; font-family: 'Fira Sans', Arial, Sans-Serif; font-size: 50px; font-weight: 600; letter-spacing: 1px; line-height: 60px; margin-bottom: 20px; margin-top: 20px; } .error500-content1 p { color: #212529; font-size: 30px; font-weight: 600; letter-spacing: 1px; line-height: 40px; margin-bottom: 30px; } .support-content p, .error500-content2 p { color: #898989; font-size: 16px; font-weight: 600; letter-spacing: 1px; line-height: 26px; } .support-content p span a { color: #ff6489; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .support-content p span a:hover { color: #212529; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .support-content p { margin-top: 20px; } /*========================================== PAGE 500 END ===========================================*/ /*========================================== COMING SOON START ===========================================*/ .coming-section-bg { background: rgba(0,0,0,0.5) linear-gradient(130deg, rgba(159,112,237,0.8), #666666) repeat scroll 0 0; background: -moz-linear-gradient(130deg, #666666, rgba(159,112,237,0.8)) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(130deg, #666666, rgba(159,112,237,0.8)) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(130deg, #666666, rgba(159,112,237,0.8)) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(130deg, rgba(159,112,237,0.8), #666666) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(130deg, #666666, rgba(159,112,237,0.8)) repeat scroll 0 0; /* IE10+ */ } .coming-bg-head > div { text-align: center; } .coming-content p { color: #ffffff; font-family: 'Fira Sans', Arial, Sans-Serif; font-size: 50px; font-weight: 600; letter-spacing: 1px; line-height: 60px; margin-bottom: 0px; margin-top: 20px; } .countdown { color: #ffffff; font-size:60px; line-height: 70px; letter-spacing: 1px; } .count-unit { color: #ffffff; font-size: 16px; line-height: 26px; } .count-unit { margin-top: 10px; } .countdown-width { display: inline; } .countdown-wrap { display: inline-block; padding-right: 40px; } .countdown-wrap, .coming-subs-head { margin-top: 30px; } .coming-subs-head form { display: flex; display: -webkit-box; margin: 0 auto; width: 60%; } .coming-subs-head label, .coming-subs-head .hs-form-field > label { color: #ffffff; } .coming-subs-head .hs-form-field { text-align: left; } .coming-subs-head .hs-form .hs-form-field { margin-top: 0!important; margin-right: 0px; width: 100%; } .countdown-wrap:last-child { padding-right: 0; } .hubspot-link__container { display: none; } .coming-subs-head .hs_submit.hs-submit { position: relative; } .coming-subs-head .actions { position: absolute; right: -2px; top: 37px; } /*.coming-subs-head .hs_submit.hs-submit .actions { position: relative; } .coming-subs-head .actions input { position: absolute; right: -2px; top: 37px; }*/ .coming-subs-head .hs-button.primary, .coming-subs-head input[type="submit"], .coming-subs-head input[type="button"] { background: rgba(0,0,0,0.5) linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; background: -moz-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* IE10+ */ -webkit-border-radius: 0 5px 5px 0; -moz-border-radius: 0 5px 5px 0; border-radius: 0 5px 5px 0; color: #ffffff; height: auto; line-height: 22px; border: 0; padding: 15px 40px; margin-top: 0 !important; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } .coming-subs-head .hs-button.primary:hover, .coming-subs-head input[type="submit"]:hover, .coming-subs-head input[type="button"]:hover { box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 5px 8px 15px rgba(0, 0, 0, 0.20); -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; border: 0; color: #ffffff; } .coming-subs-head .hs-button.primary:focus, .coming-subs-head input[type="submit"]:focus, .coming-subs-head input[type="button"]:focus { border: 0; } .coming-subs-head input[type="text"], .coming-subs-head input[type="password"], .coming-subs-head input[type="datetime"], .coming-subs-head input[type="datetime-local"], .coming-subs-head input[type="date"], .coming-subs-head input[type="month"], .coming-subs-head input[type="time"], .coming-subs-head input[type="week"], .coming-subs-head input[type="number"], .coming-subs-head input[type="email"], .coming-subs-head input[type="url"], .coming-subs-head input[type="search"], .coming-subs-head input[type="tel"], .coming-subs-head input[type="color"], .coming-subs-head input[type="file"], .coming-subs-head textarea, .coming-subs-head select { box-shadow: 0px 0px 6px -2px #898989; -webkit-box-shadow: 0px 0px 6px -2px #898989; -moz-box-shadow: 0px 0px 6px -2px #898989; border: 0; padding: 15px 10px; } .coming-subs-head .submitted-message { color: #ffffff; margin: 0 auto 0 auto; letter-spacing: 1px; font-family: 'Open Sans', Arial, Sans-Serif; text-align: center; } .coming-copyright { border-top: none; padding-top: 15px; padding-bottom: 15px; margin-top: 0; } /*========================================== COMING SOON END ===========================================*/ /*========================================== EMAIL SUBSCRIPTION PAGES START ===========================================*/ /* EMAIL UNSUBSCRIBE START */ .unsubs-pg-head > div { background-color: #ffffff; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; margin: 0 auto; padding: 60px 30px; width: 50%; } .unsubs-pg-head h1 { margin-bottom: 10px; } .unsubs-pg-head form h3 { font-size: 18px; margin-bottom: 10px; } .unsubs-pg-head #content > div { padding-bottom: 0 !important; } .unsubs-pg-head #email-prefs-form input { box-shadow: 0 0 10px -6px #898989; -webkit-box-shadow: 0 0 10px -6px #898989; -moz-box-shadow: 0 0 10px -6px #898989; height: 50px !important; margin-bottom: 0px !important; } /* EMAIL UNSUBSCRIBE END */ /* EMAIL SUBSCRIPTION START */ .subs-update-head > div { background-color: #212529; border-radius: 5px; margin: 0 auto; padding: 30px 20px; width: 600px; } .subs-update-head .page-header p { margin: -15px auto 0; } html body .page-header { margin: 0px; padding-bottom: 0px; } .subs-update-head p.header, .subs-update-head .page-header p, .subs-update-head .page-header h2, .subs-update-head .page-header h1 { color: #ffffff; } .subs-update-head .page-header h1 { margin-bottom: 10px; } .subs-update-head .page-header h2 { margin-bottom: 0px; } .subs-update-head .success { color: #25AE88; font-size: 16px; font-weight: 600; letter-spacing: 1px; margin-top: 10px; } /* EMAIL SUBSCRIPTION END */ /* SUBSCRIPTION PREFERENCES START */ .preference-page { background-color: #212529; border-radius: 5px; padding: 30px 20px; } .preference-page .subscribe-options span, .preference-page p.header, .preference-page .page-header p, .preference-page .page-header h2, .preference-page .page-header h1 { color: #ffffff; letter-spacing: 1px; } .preference-page .page-header h1 { margin-bottom: 10px; } .preference-page .page-header h2 { margin-bottom: 0; } .preference-page .subscribe-options label { margin-left: 0; } .preference-page .email-prefs .item { -moz-user-select: none; cursor: pointer; float: left; margin: 20px 20px 0 0; padding-bottom: 1px; position: relative; width: 48%; } .preference-page .subscribe-options { float: none; margin-bottom: 0px; overflow: hidden; padding-top: 20px; width: 100%; } .preference-page .page-header p { margin-top: -15px; } .preference-page input[type="radio"], .preference-page input[type="checkbox"] { margin: 8px 10px 0 0; vertical-align: middle; } /* SUBSCRIPTION PREFERENCES START */ /*========================================== EMAIL UNSUBSCRIBE PAGE END ===========================================*/ /*========================================== PASSWORD PAGE START ===========================================*/ .pg-prompt-head > div { background-color: #222222; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; margin: 0 auto; text-align: center; padding: 60px 30px; width: 55%; } .pwd-head h2 { margin-bottom: 10px; } .pwd-head h2, .pwd-head p { color: #ffffff; } .pwd-prompt #hs-pwd-widget-password { height: 50px !important; margin-top: 40px !important; } .preference-page .hs-button.primary, .unsubs-pg-head .hs-button.primary, .custom_error_message.pwd-prompt .hs-button.primary { border: 1px solid transparent; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; color: #ffffff; cursor: pointer; font-family: 'Fira Sans', Arial, Sans-Serif; font-size: 16px; font-weight: 600; line-height: 20px; letter-spacing: 1px; outline: none; padding: 15px 40px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .preference-page .hs-button.primary:focus, .preference-page .hs-button.primary:hover, .unsubs-pg-head .hs-button.primary:focus, .unsubs-pg-head .hs-button.primary:hover, .custom_error_message.pwd-prompt .hs-button.primary:hover { box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 5px 8px 15px rgba(0, 0, 0, 0.20); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .preference-page .subscribe-options input[type="radio"], .preference-page .subscribe-options input[type="checkbox"] { margin: -2px 10px 0 0; vertical-align: middle; } .preference-page .email-prefs p.header { margin-left: 0; } /*========================================== PASSWORD PAGE END ===========================================*/ /* Landing Pages ========================================================================== */ /* One Column Template */ body.landing-page.one-column {} body.landing-page.one-column .content-wrapper {} body.landing-page.one-column .main-content {} /* Two Column Template */ body.landing-page.two-column {} body.landing-page.two-column .content-wrapper {} body.landing-page.two-column .main-content {} body.landing-page.two-column .sidebar.right {} /* Three Column Template */ body.landing-page.three-column {} body.landing-page.three-column .content-wrapper {} body.landing-page.three-column .main-content {} /* System Pages ========================================================================== */ /* Error Templates 404, 500 */ body.error-template.one-column {} body.error-template.one-column .content-wrapper {} body.error-template.one-column .main-content {} /* Password template */ body.password-template.one-column {} body.password-template.one-column .content-wrapper {} body.password-template.one-column .main-content {} /* Email Subscribition templates */ body.subscription-template.one-column {} body.subscription-template.one-column .content-wrapper {} body.subscription-template.one-column .main-content {} /* ========================================================================== 5. COS COMPONENTS ========================================================================== */ /* ========================================================================== Blog ========================================================================== */ /* Blog Post and Listing Body Class */ body.blog {} /* Blog Post */ body.hs-blog-post { max-width: 100%; width: 100%; } /* Blog Listing */ body.hs-blog-listing { max-width: 100%; width: 100%; } /* Blog Columns Wrapper */ .blog .content-wrapper { max-width: 100%; width: 100%; } /* Blog Content Column ========================================================================== */ .blog .blog-content { max-width: 100%; width: 100%; } .blog-content .section.post-body ul { display: table; padding-left: 0px; margin-top: 0px; margin-bottom: 0; list-style: none; } .blog-content .section.post-body ul li { display: inline-flex; display: -webkit-flex; letter-spacing: 1px; list-style: none; font-weight: 400; text-align: left; margin-bottom: 15px; padding-left: 0px; margin-top: 0; vertical-align: middle; position: relative; } .blog-content .section.post-body ul li:last-child { margin-bottom: 0; } .blog-content .section.post-body ul li:before { background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489); background-clip: border-box; -webkit-background-clip: text; -webkit-text-fill-color: transparent; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; font-size: 20px; color: #ff6489; content: "\f101"; font-family: 'fontawesome'; line-height: 25px; vertical-align: top; margin-top: 4px; padding-right: 15px; } .blog-content form { background-color: #f9f9f9; border-radius: 5px; padding: 20px; } /* Use this to style the main wrapper for the blog listing pages */ .blog-listing-wrapper { margin: 0 auto; max-width: 100%; width: 100%; } /* Use this to style the main wrapper for the blog post pages */ .blog-post-wrapper {} /* Blog Title v1, v2, v3 */ .blog-category-title-v2, .blog-category-title { border-bottom: 2px solid #222222; font-family: "Roboto",Arial,sans-serif; font-size: 28px; font-weight: 700; line-height: 30px; padding-bottom: 4px; } .blog-category-title { margin-bottom: 40px; margin-top: 20px !important; } .blog-category-title-v2 { margin: 20px 15px 40px 15px !important; } /* Blog Title v4 ========= BLOG LISTING PAGE TITLE STYLE(CATEGORIES SPLITUP) ========= */ .blog-category-title3, .blog-category-title2, .blog-category-title1 { font-family: "Roboto",Arial,sans-serif; margin-bottom: 40px; margin-top: 15px !important; padding-bottom: 3px; } .blog-category-title3 a, .blog-category-title2 a, .blog-category-title1 a { border-radius: 3px; color: #ffffff; font-size: 18px; font-weight: 700; line-height: 30px; letter-spacing: 1px; padding: 4px 15px; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; opacity: 0.75; } .blog-category-title1 { border-bottom: 2px solid ; } .blog-category-title1 a { background-color: ; border: 1px solid ; } .blog-category-title2 { border-bottom: 2px solid #33BDA0; } .blog-category-title2 a { background-color: #33BDA0; border: 1px solid #33BDA0; } .blog-category-title3 { border-bottom: 2px solid #E54E54; } .blog-category-title3 a { background-color: #E54E54; border: 1px solid #E54E54; } .blog-category-title3 a:active, .blog-category-title2 a:active, .blog-category-title1 a:active, .blog-category-title3 a:focus, .blog-category-title2 a:focus, .blog-category-title1 a:focus, .blog-category-title3 a:hover, .blog-category-title2 a:hover, .blog-category-title1 a:hover { color: #ffffff; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; opacity:1; } .blog-category-title3 a:hover:before, .blog-category-title2 a:hover:before, .blog-category-title1 a:hover:before { border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 6px solid #ffffff; content: ""; left: -8px; position: relative; top: 15px; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } /* Blog posts Category Page */ .single-tag-posts-name { border-left: 3px solid ; font-family: "Roboto",Arial,sans-serif; padding-left: 10px; color: #212529; font-size: 28px; font-weight: 400; line-height: 38px; letter-spacing: 1px; margin-bottom: 30px; margin-top: 20px !important; text-transform: uppercase; } .single-tag-posts-name span { padding-left: 10px; border-radius: 3px; color: ; font-size: 28px; font-weight: 700; line-height: 38px; letter-spacing: 1px; text-transform: uppercase; } /* Blog Title v5 ========= BLOG LISTING PAGE TITLE STYLE(CATEGORIES SPLITUP) ========= */ .agencyListing-v5 .blog-category-title1 { margin: 15px 15px 40px 15px !important; } .agencyListing-v5 .blog-category-title3 { margin: 0px 15px 40px 15px !important; } .agencyListing-v5 .blog-category-title2 { margin: 10px 15px 40px 15px !important; } /* =================================== */ .blog-header-bg { background-color:#444444; padding-bottom: 80px; padding-top: 80px; } .hs-blog-header h1, .hs-blog-header h1 a { color: #ffffff; text-align: center; } /* Blog Post Title */ .post-header h2, .post-header h2 a { color: #212529; } .post-header { margin-bottom: 15px; } /* Blog Author and Avatar */ #hubspot-author_data { font-size: 15px; font-weight: 600; line-height: 25px; letter-spacing: 1px; margin-top: 5px; margin-bottom: 15px; } #hubspot-author_data a.author-link { color: #ff6489; } #hubspot-author_data .hs-author-avatar { margin: 10px 0; } #hubspot-author_data .hs-author-avatar img { border: 0 none; height: auto; margin: 0; padding: 0; width: auto; } /* Use this to set up different styling for your blog posts */ .blog-listing-wrapper .post-listing .post-item { background-color: #f9f9f9; border-radius: 5px; padding: 20px 20px; } .blog-post-wrapper .section.post-body h3, .blog-post-wrapper .section.post-body h2 { margin: 30px 0 15px 0; } .blog-post-wrapper .section.post-body a { color: #ff6489; } .blog-post-wrapper .section.post-body a:hover { color: #212529; } .blog-post-wrapper .section.post-body h4 a { font-weight: 400; } .blog-post-wrapper .section.post-body h5 { color: #212529; font-weight: 300; } .blog-post-wrapper .section.post-body p { margin: 0px 0 15px 0; line-height: 30px; } .blog-post-wrapper .section.post-body ul { padding-left: 0px; margin-bottom: 0px; } /* Post Featured Image on Listings Page */ .blog-post-wrapper img.hs-featured-image { border-width: 0; max-height: 100% !important; max-width: 100%; display: inline-block !important; float: none!important; margin: 10px 0px 10px 0px; } .hs-featured-image-wrapper .hs-featured-image-link {} .hs-featured-image-wrapper .hs-featured-image-link img.hs-featured-image{ border-width: 0; max-width: 100%; display: inline-block !important; float: none!important; margin: 0px 0px 20px 0px; } /* Read More Link */ a.more-link { color: #ff6489; } a.more-link { color: #ff6489; font-family: 'Fira Sans', Arial, Sans-Serif; font-size: 16px; font-weight: 600; letter-spacing: 1px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } a.more-link:hover { color: #212529; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } a.more-link:hover:after { padding-left: 10px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } a.more-link:after { content: "\f101"; font-family: fontawesome; font-size: 15px; padding-left: 5px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } /* Blog Topics List */ #hubspot-topic_data { margin-bottom: 10px; } #hubspot-topic_data a.topic-link { background-color: #ffffff; border: 1px solid #dddddd; box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1); -moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1); border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; color: #898989; display: inline-block; font-size: 13px; font-weight: 600; letter-spacing: 1px; margin-right: 10px; padding: 5px 15px; margin-top: 10px; text-align: center; text-transform: uppercase; opacity: 0.7 -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #hubspot-topic_data a.topic-link:hover { background-color: #ff6489; color: #ffffff; opacity: 1; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } /** * Blog Social Sharing icons * * Overrides defaults to better align icons and prevent overlapping */ .hs-blog-social-share { margin: 10px 0 10px 0; padding: 5px 0 0 0; border-top: 1px solid #cccccc; border-bottom: 1px solid #cccccc; height: auto; } /* POST VIEW SOCIAL ICONS */ .blogshare-this2.fixed-share > ul { display: inline-block; list-style: outside none none; } .blogshare-this2 a { color: #fff; display: inline-block; height: 45px; line-height: 45px; text-align: center; width: 45px; } .blogshare-this2.fixed-share li { background-color: ; border-radius: 25%; display: -webkit-inline-box; margin: 0 10px 0 0; opacity: 0.75; } .blogshare-this2.fixed-share li:hover { opacity: 1; } .blogshare-this2 .agency-facebook { background: #0b59aa none repeat scroll 0 0; border-radius: 25%; } .blogshare-this2 .agency-twitter { background: #00aaef none repeat scroll 0 0; border-radius: 25%; } .blogshare-this2 .agency-linkedin { background: #0375b3 none repeat scroll 0 0; border-radius: 25%; } .blogshare-this2 .agency-googleplus { background: #d84d2f none repeat scroll 0 0; border-radius: 25%; } /** * Blog Commments * * Custom styles are listed below, as the COS does not provide default styles. */ .comment.depth-0 { border-top: 1px solid #cccccc !important; } #comments-listing { border-bottom: 1px solid #ccc; margin-bottom: 30px; margin-top: 30px; } .comment { margin: 10px 0; border-top: 1px solid #ccc; padding: 15px 0; } .comment-from h4 { margin-bottom: 5px; } .comment-date { font-size: 13px; text-align: right; } .comment-from { font-weight: bold; } .comment-body { padding: 5px 0 10px 0; } .hs-error-msgs.inputs-list label { color: #ff0000 !important; } .hs_email.field.hs-form-field input, .hs_comment.field.hs-form-field, .hs_comment.field.hs-form-field textarea { width: 100% !important; } .hs_comment.field.hs-form-field label { margin-bottom: 0; } .hs-error-msgs.inputs-list li { margin-bottom: 15px !important; } /* Comments Listing Custom styles */ .custom_listing_comments { letter-spacing: 1px; margin-top: 15px; } /* Comments Listing Success Message */ .hs-common-confirm-message { background-color: #f6f6f6 !important; border: 1px solid #0fa80f !important; border-radius: 5px !important; color: #0fa80f !important; font-size: 15px; margin: 20px 0 !important; padding: 10px 20px !important; } /* =================== BLOG PAGINATION ==================== */ .blog-pagination { display: block; text-align: center; } .blog-pagination ul { list-style: none; padding-left: 0; margin-bottom: 0; margin-top: 30px; } .blog-pagination ul li { background-color: #f6f6f6; border-radius: 50%; cursor: pointer; display: -webkit-inline-box; display: inline-block; padding: 6px 18px; margin: 0 10px 0px 0; } .blog-pagination li i { font-size: 15px; } .blog-pagination ul li:hover { box-shadow: 1px 2px 3px #666666; } .blog-pagination li:hover a, .blog-pagination li:hover i { color: #9f70ed; } .blog-pagination ul li.active { background-color: #ff6489; } .blog-pagination ul li.active a { color: #ffffff; } .hide { display: none !important; } .blog-pagination a { color: #7e7e7e; font-weight: 500; } /* ========================== */ /** * Blog Author Page * * ALWAYS be sure to set styles to these selectors, as the COS does not provide default styles */ .hs-author-profile { background-color: transparent; margin-top: 0px; padding: 0 0 0px 0; } .hs-author-profile h4.hs-author-name { color: #212529; } .post-listing .hs-author-profile { background-color: #f9f9f9; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 20px 20px; } .post-listing .hs-author-profile h4.hs-author-name { margin-bottom: 20px; } .post-listing .hs-author-profile .hs-author-avatar { display: table-cell; margin-right: 15px; float: left !important; width: 150px !important; } .post-listing .hs-author-profile .hs-author-bio { margin-top: 25px; display: table-cell; float: left !important; width: 70% !important; } .hs-author-listing-header { margin-bottom: 20px; margin-top: 40px !important; } .hs-author-profile .hs-author-bio { margin-top: 30px; display: table-cell; } .hs-author-profile .avatar-bio { padding: 20px 20px 0 20px; } .hs-author-profile .hs-author-avatar { display: table-cell; margin-right: 15px; } .hs-author-profile .hs-author-avatar img { border: 0 none; height: auto; margin: 0; padding: 0; width: 150px; } .hs-author-social-section { display: inline-block; margin-top: 10px; } .hs-author-social-section .hs-author-social-label { color: #212529; display: table-cell; margin: 0px 15px 0 0; } .hs-author-social-section .hs-author-social-links { text-align: center; width: 150px; } .blog-post-wrapper.cell-wrapper > p { margin-bottom: 0; } .avatar-img { display: flex; display: -webkit-inline-box; } .fa.fa-google-plus-square.avatar, .fa.fa-linkedin-square.avatar, .fa.fa-twitter-square.avatar, .fa.fa-facebook-square.avatar { font-size: 25px; } /* Author Sidebar */ .hs-author-profile .avatar-bio-sidebar { padding: 0px 0px 0 0px; } .hs-author-profile.hs-author-profile-sidebar { margin-top: 0px; margin-bottom: 0px; } .hs-author-profile .hs-author-avatar.hs-author-avatar-sidebar { display: inline-block; margin-bottom: 10px; margin-right: 0px; } .hs-author-profile .hs-author-bio.hs-author-bio-sidebar { margin-top: 0px; display: inline-block; } .hs-author-profile.hs-author-profile-sidebar .hs-author-name, .avatar-img-sidebar { text-align: left; } /** * Blog All Posts Page * * ALWAYS be sure to set styles to these selectors, as the COS does not provide default styles */ body.hs-content-path-blog-all {} div.post-listing-simple {} div.post-listing-simple .post-item {} h2.post-listing-simple {} h2.post-listing-simple a {} /* Blog Sidebar ========================================================================== */ .blog .blog-sidebar {} /* Blog Modules */ .blog-sidebar > div { border-bottom: 1px solid #eeeeee; padding-bottom: 30px; margin-bottom: 30px; } .blog-sidebar > div:last-child { border-bottom: none; padding-bottom: 0px; margin-bottom: 0px; } .hs-blog-listing .blog-sidebar > div:first-child { border-bottom: none; padding-bottom: 0px; margin-bottom: 0px; } .hs_cos_wrapper_type_blog_subscribe form { padding: 0 0px; } .about-blog { text-align: center; } .about-blog p a { color: #ff6489; } /* rss Listing */ .hs-rss-item.hs-with-featured-image .hs-rss-item-text { float: right; width: 70%; padding-right: 0; } .hs-rss-item.hs-with-featured-image .hs-rss-item-image-wrapper { display: flex; display: -webkit-inline-box; width: 24%; } .hs-rss-item { margin-bottom: 15px; } .hs-rss-description p a { color: ; } .content-wrapper .widget-span.widget-type-raw_jinja .layout-widget-wrapper.cell-wrapper, .rss-post-list-blog { margin-bottom: 30px; } .blog-sidebar > div h3 { color: #212529; font-family: 'Fira Sans', Arial, Sans-Serif; font-size: 28px; line-height: 38px; letter-spacing: 1px; margin-bottom: 30px; position: relative; } .blog-sidebar > div h3:before { background-color: #ff6489; bottom: -10px; content:""; position: absolute; height: 2px; width: 50px; } .blog-sidebar .widget-module ul li { display: inline-block; list-style: none; margin: 0 0 10px 0; } .blog-sidebar .widget-module ul li:last-child { margin: 0 0 0px 0; } .blog-sidebar .widget-module ul li a, .blog-sidebar .widget-module ul li { color: #898989; } .blog-sidebar .hs_cos_wrapper_type_post_listing .widget-module ul li:before { background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489); background-clip: border-box; -webkit-background-clip: text; -webkit-text-fill-color: transparent; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; font-size: 20px; color: #ff6489; content: "\f101"; font-family: 'fontawesome'; line-height: 25px; vertical-align: top; margin-top: 4px; padding-right: 15px; } .blog-sidebar .hs_cos_wrapper_type_post_filter .widget-module li { background-color: #f3f3f3; border: 1px solid #dddddd; box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.1); margin-right: 7px; padding: 5px 10px; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; } .rss-post-list-blog .hs-rss-module { padding: 1px 15px 0px 15px; } /* POPULAR POST LISTING */ .sidebar-post-listing-wrapper.blog-listing-wrapper .post-listing .post-item { background-color: transparent; border-radius: 5px; padding: 0px; margin-bottom: 20px; } .blog-listing-wrapper.sidebar-post-listing-wrapper .post-listing .post-item .post-body { float: left; width: 48%; } .blog-listing-wrapper.sidebar-post-listing-wrapper .post-listing .post-item .post-header { float: right; margin-bottom: 0; width: 48%; } .blog-listing-wrapper.sidebar-post-listing-wrapper .post-listing .post-header p a { color: #898989; } .blog-listing-wrapper.sidebar-post-listing-wrapper .post-item:last-child, .blog-listing-wrapper.sidebar-post-listing-wrapper .post-item .hs-featured-image-wrapper .hs-featured-image-link img.hs-featured-image { margin-bottom: 0; } /* POST LISTING CATEGORIES */ .post-listing-category { padding: 15px; } .post-listing-category h3 { color: #212529; float: left; font-size: 18px; letter-spacing: 1px; margin-bottom: 0; padding: 12px 0; text-transform: uppercase; width: 20%; } .post-listing-category ul { display: flex; display: -webkit-inline-box; float: right; list-style: none; margin: 0; padding: 0; } .post-listing-category ul li { padding-right: 15px; } .post-listing-category ul li a { font-size: 16px; color: #212529; letter-spacing: 1px; text-transform: uppercase; } .post-listing-category ul li a:hover { color: ; } .post-listing-category ul li:last-child { padding-right: 0px; } .post-listing-category ul li span { display: none; } /* Post Listing Page Design Common Classes */ .post-item { display: table; margin-bottom: 30px; } .post-item.clearfix:last-child { margin-bottom: 0; } .post-item-image .hs-featured-image-wrapper { width: 100px; } .post-item-image .hs-featured-image-wrapper .hs-featured-image { border-width: 0; display: inline-block; float: left; margin: 0 0 0 0px !important; } .post-item-text { float: right; padding: 0 15px 0 30px; } .post-item-text h4 { color: #212529; font-size: 16px; font-weight: 400; margin-bottom: 0px; } /* ========================================================================== Forms ========================================================================== */ /* All Global Forms ========================================================================== */ /* Form Field */ body .hs-form-field { margin-top: 15px; } /* Descriptions */ body .hs-field-desc { color: ; margin-bottom: 5px; margin-top: 0; } /* Labels */ body label, body .hs-form-field > label { color: ; font-size: 16px; font-weight: 400; line-height: 32px; letter-spacing: 1px; } /* One Line Inputs */ body input[type="text"], body input[type="password"], body input[type="datetime"], body input[type="datetime-local"], body input[type="date"], body input[type="month"], body input[type="time"], body input[type="week"], body input[type="number"], body input[type="email"], body input[type="url"], body input[type="search"], body input[type="tel"], body input[type="color"], body input[type="file"], body textarea, body select { border: none; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; box-shadow: 0px 0px 10px -10px #898989; -webkit-box-shadow: 0px 0px 10px -10px #898989; -moz-box-shadow: 0px 0px 10px -10px #898989; color: #898989 ; font-family: 'Open Sans', Arial, Sans-Serif; font-size: 16px; margin: 5px 0 0px 0; padding: 10px; max-width: 100% !important; width: 100%; } body input[type="text"]:focus, body input[type="password"]:focus, body input[type="datetime"]:focus, body input[type="datetime-local"]:focus, body input[type="date"]:focus, body input[type="month"]:focus, body input[type="time"]:focus, body input[type="week"]:focus, body input[type="number"]:focus, body input[type="email"]:focus, body input[type="url"]:focus, body input[type="search"]:focus, body input[type="tel"]:focus, body input[type="color"]:focus, body input[type="file"]:focus, body textarea:focus, body select:focus { border-color: #66afe9; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6); outline: 0 none; } /* Separate Styles for Multiple Line Inputs */ body textarea { max-height: 70px; } /* Multiple Selection Inputs */ body form.hs-form .hs-form-field ul.inputs-list { border-radius: 5px; color: ; font-size: 16px; margin-bottom: 5px; padding: 0px; list-style: none; } body form.hs-form .hs-form-field ul.inputs-list li { margin-top: 10px; } body input[type="radio"], body input[type="checkbox"] { margin: -2px 10px 0px 0; vertical-align: middle; } /* Required */ body input:focus:required:invalid, body textarea:focus:required:invalid, body select:focus:required:invalid { color: #ff0000; } body input:focus:required:invalid:focus, body textarea:focus:required:invalid:focus, body select:focus:required:invalid:focus { color: #ff0000; } /* Placeholder Text */ ::-webkit-input-placeholder { /* Webkit Browsers */ /* color: #555; opacity: 1; */ } :-moz-placeholder { /* Firefox 18- */ /* color: #555; opacity: 1; */ } ::-moz-placeholder { /* Firefox 19+ */ /* color: #555; opacity: 1; */ } :-ms-input-placeholder { /* IE10 */ /* color: #555; opacity: 1; */ } /* Form Module ========================================================================== */ /* Form Field */ .hs_cos_wrapper_type_form .hs-form-field { margin-top: 15px; } /* Descriptions */ .hs_cos_wrapper_type_form .hs-field-desc { color: ; margin-bottom: 5px; margin-top: 0; } /* Labels */ .hs_cos_wrapper_type_form label, .hs_cos_wrapper_type_form .hs-form-field > label { color: ; font-size: 16px; font-weight: 400; line-height: 32px; letter-spacing: 1px; } /* One Line Inputs */ .hs_cos_wrapper_type_form input[type="text"], .hs_cos_wrapper_type_form input[type="password"], .hs_cos_wrapper_type_form input[type="datetime"], .hs_cos_wrapper_type_form input[type="datetime-local"], .hs_cos_wrapper_type_form input[type="date"], .hs_cos_wrapper_type_form input[type="month"], .hs_cos_wrapper_type_form input[type="time"], .hs_cos_wrapper_type_form input[type="week"], .hs_cos_wrapper_type_form input[type="number"], .hs_cos_wrapper_type_form input[type="email"], .hs_cos_wrapper_type_form input[type="url"], .hs_cos_wrapper_type_form input[type="search"], .hs_cos_wrapper_type_form input[type="tel"], .hs_cos_wrapper_type_form input[type="color"], .hs_cos_wrapper_type_form input[type="file"], .hs_cos_wrapper_type_form textarea, .hs_cos_wrapper_type_form select { border: none; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; box-shadow: 0px 0px 6px -2px #898989; -webkit-box-shadow: 0px 0px 6px -2px #898989; -moz-box-shadow: 0px 0px 6px -2px #898989; color: #898989; font-family: 'Open Sans', Arial, Sans-Serif; font-size: 16px; margin: 5px 0 0px 0; padding: 10px; max-width: 100% !important; width: 100%; } .hs_cos_wrapper_type_form input[type="text"]:focus, .hs_cos_wrapper_type_form input[type="password"]:focus, .hs_cos_wrapper_type_form input[type="datetime"]:focus, .hs_cos_wrapper_type_form input[type="datetime-local"]:focus, .hs_cos_wrapper_type_form input[type="date"]:focus, .hs_cos_wrapper_type_form input[type="month"]:focus, .hs_cos_wrapper_type_form input[type="time"]:focus, .hs_cos_wrapper_type_form input[type="week"]:focus, .hs_cos_wrapper_type_form input[type="number"]:focus, .hs_cos_wrapper_type_form input[type="email"]:focus, .hs_cos_wrapper_type_form input[type="url"]:focus, .hs_cos_wrapper_type_form input[type="search"]:focus, .hs_cos_wrapper_type_form input[type="tel"]:focus, .hs_cos_wrapper_type_form input[type="color"]:focus, .hs_cos_wrapper_type_form input[type="file"]:focus, .hs_cos_wrapper_type_form textarea:focus, .hs_cos_wrapper_type_form select:focus { border-color: #66afe9; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6); outline: 0 none; } /* Multiple Selection Inputs */ .hs_cos_wrapper_type_form form.hs-form .hs-form-field ul.inputs-list { color: ; font-size: 16px; padding: 0; list-style: none; } .hs_cos_wrapper_type_form form.hs-form .hs-form-field ul.inputs-list li { margin-top: 10px; } .hs_cos_wrapper_type_form form.hs-form .hs-form-field ul.inputs-list li input {} .hs_cos_wrapper_type_form input[type="radio"], .hs_cos_wrapper_type_form input[type="checkbox"] { margin: -2px 10px 0 0; vertical-align: middle; } /* Blog Comment Form ========================================================================== */ /* Comment Form BG */ .new-comments form { background-color: #f6f6f6; border-radius: 5px; padding: 15px 30px 30px 30px !important; } .new-comments .actions { margin-left: 0 !important; margin-top: 0 !important; padding-top: 0 !important; padding-left: 0 !important; } .new-comments .hs-form-field, .new-comments .hs-form-field input { width: 97%; } /* Label */ #comment-form .hs-form-field > label, #comment-form label { color: #898989; font-size: 16px; font-weight: 400; line-height: 32px; letter-spacing: 1px; } /* Inputs */ #comment-form input[type="text"] { max-height: 40px; border: none; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; box-shadow: 0px 0px 6px -2px #898989; -webkit-box-shadow: 0px 0px 6px -2px #898989; -moz-box-shadow: 0px 0px 6px -2px #898989; color: #898989; font-family: 'Open Sans', Arial, Sans-Serif; font-size: 16px; margin: 5px 0 0px 0; padding: 10px; max-width: 100% !important; width: 100%; } #comment-form input[type="text"]:focus { border-color: #66afe9; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6); outline: 0 none; } #comment-form textarea { max-height: 70px; } #comment-form textarea:focus { border-color: #66afe9; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6); outline: 0 none; } #comment-form input[type="radio"], #comment-form input[type="checkbox"] { margin: 0 10px 2px 0; width: 20px; /* vertical-align: middle;*/ } /* Error */ body .hs-common-error-message { color: #ff0000 !important; font-size: 16px; line-height: 32px; } /* Blog Subscription Form ========================================================================== */ /* Label */ #hs_form_target_blog_subscription .hs-form-field > label, #hs_form_target_blog_subscription label { color: #898989; font-size: 16px; font-weight: 400; line-height: 32px; letter-spacing: 1px; } /* Inputs */ #hs_form_target_blog_subscription input[type="email"] { border: none; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; box-shadow: 0px 0px 6px -2px #898989; -webkit-box-shadow: 0px 0px 6px -2px #898989; -moz-box-shadow: 0px 0px 6px -2px #898989; color: #898989; font-family: 'Open Sans', Arial, Sans-Serif; font-size: 16px; margin: 5px 0 0px 0; padding: 10px; max-width: 100% !important; width: 100%; } #hs_form_target_blog_subscription input[type="email"]:focus { border-color: #66afe9; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(102, 175, 233, 0.6); outline: 0 none; } #hs_form_target_blog_subscription input[type="radio"], #hs_form_target_blog_subscription input[type="checkbox"] { width: auto; margin-right: 10px; vertical-align: middle; } /* Success Message */ #hs_cos_wrapper_blog_subscription a { padding: 0 0 0 15px; } /* Google Search Form ========================================================================== */ /* Label */ .widget-type-google_search label {} /* Input */ .widget-type-google_search input[type="text"] {} .widget-type-google_search input[type="focus"] {} /* Multi Column Form ========================================================================== */ body .hs-form fieldset.form-columns-1 { max-width: 100% !important; width: 100% !important; } body .hs-form fieldset.form-columns-1 .hs-form-field { max-width: 100% !important; width: 100% !important; } body .hs-form fieldset.form-columns-2 { max-width: 100% !important; width: 100% !important; } body .hs-form fieldset.form-columns-2 .hs-form-field { max-width: 50% !important; width: 50% !important; } body .hs-form fieldset.form-columns-3 { max-width: 100% !important; width: 100% !important; } body .hs-form fieldset.form-columns-3 .hs-form-field { max-width: 33.33% !important; width: 33.33% !important; } /* Multiple Selection Inputs */ body form.hs-form .hs-form-field ul.inputs-list { color: #898989; font-size: 16px; padding: 0px; list-style: none; } body form.hs-form .hs-form-field ul.inputs-list li { margin-top: 10px; } body input[type="radio"], body input[type="checkbox"] { margin: -2px 10px 0 0; vertical-align: middle; } .hs-form-checkbox-display > span, .hs-form-radio-display > span { color: #777777; } body form.hs-form fieldset { max-width: none; } body form.hs-form fieldset .hs-form-field { padding: 0 10px 0 0; } body form.hs-form fieldset[class*="form-columns"] .input { margin-right: 0; } body form.hs-form fieldset[class*="form-columns"] .hs-input, body form.hs-form fieldset[class*="form-columns"] .hs-input[type="radio"] body form.hs-form fieldset[class*="form-columns"] .hs-input[type="checkbox"] { vertical-align: middle; } body form.hs-form fieldset.form-columns-3 .hs-form-field { width: 33.33%; } @media (max-width: 400px) { body form.hs-form fieldset .hs-form-field { padding: 0; } body form.hs-form fieldset.form-columns-3 .hs-form-field, body form.hs-form .form-columns-2 .hs-form-field .hs-input, body form.hs-form .form-columns-3 .hs-form-field .hs-input { width: 100%; } body form.hs-form .form-columns-3 .hs-form-field .hs-input[type="checkbox"] { width: auto; } } /* ========================================================================== Buttons ========================================================================== */ /* All Global Buttons (Excluding CTAs) ========================================================================== */ body .hs-button.primary, body input[type="submit"], body input[type="button"] { -webkit-appearance: none; background: rgba(0,0,0,0.5) linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; background: -moz-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* IE10+ */ border: none !important; border-radius: 5px; color: #ffffff; cursor: pointer; display: inline-block; font-family: 'Fira Sans', Arial, Sans-Serif; font-size: 16px; font-weight: 700; line-height: 24px; padding: 15px 40px 15px 40px; letter-spacing: 1px; margin-top: 25px; text-transform: uppercase; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } body .hs-button.primary:hover, body input[type="submit"]:hover, body input[type="button"]:hover { box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 5px 8px 15px rgba(0, 0, 0, 0.20); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } body .hs-button.primary:focus, body input[type="submit"]:focus, body input[type="button"]:focus { box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 5px 8px 15px rgba(0, 0, 0, 0.20); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } /* Form Module Button ========================================================================== */ .hs_cos_wrapper_type_form .hs-button.primary.large { -webkit-appearance: none; background: rgba(0,0,0,0.5) linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; background: -moz-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* IE10+ */ border: none !important; border-radius: 5px; color: #ffffff; cursor: pointer; display: inline-block; font-family: 'Fira Sans', Arial, Sans-Serif; font-size: 16px; font-weight: 700; line-height: 24px; padding: 15px 40px 15px 40px; letter-spacing: 1px; margin-top: 25px; text-transform: uppercase; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .hs_cos_wrapper_type_form .hs-button.primary.large:hover { box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 5px 8px 15px rgba(0, 0, 0, 0.20); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .hs_cos_wrapper_type_form .hs-button.primary.large:focus { box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 5px 8px 15px rgba(0, 0, 0, 0.20); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } /* Blog Comment Button ========================================================================== */ #add-comment-button.hs-button.primary { -webkit-appearance: none; background: rgba(0,0,0,0.5) linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; background: -moz-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* IE10+ */ border: none !important; border-radius: 5px; color: #ffffff; cursor: pointer; display: inline-block; font-family: 'Fira Sans', Arial, Sans-Serif; font-size: 16px; font-weight: 700; line-height: 24px; padding: 15px 40px 15px 40px; letter-spacing: 1px; margin-top: 25px; text-transform: uppercase; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #add-comment-button.hs-button.primary:hover { box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 5px 8px 15px rgba(0, 0, 0, 0.20); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #add-comment-button.hs-button.primary:focus { box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 5px 8px 15px rgba(0, 0, 0, 0.20); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } /* Blog Subscription Button ========================================================================== */ #hs_form_target_blog_subscription .hs-button.primary.large { -webkit-appearance: none; background: rgba(0,0,0,0.5) linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; background: -moz-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* IE10+ */ border: none; border-radius: 5px; color: #ffffff; cursor: pointer; display: inline-block; font-family: 'Fira Sans', Arial, Sans-Serif; font-size: 16px; font-weight: 700; line-height: 24px; padding: 15px 40px 15px 40px; letter-spacing: 1px; margin-top: 25px; text-transform: uppercase; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #hs_form_target_blog_subscription .hs-button.primary.large:hover { box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 5px 8px 15px rgba(0, 0, 0, 0.20); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #hs_form_target_blog_subscription .hs-button.primary.large:focus { box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 5px 8px 15px rgba(0, 0, 0, 0.20); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } /* Google Search Button ========================================================================== */ .widget-type-google_search .hs-button.primary { -webkit-appearance: none; background: rgba(0,0,0,0.5) linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; background: -moz-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* FF3.6+ */ background: -webkit-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome,Safari4+ */ background: -webkit-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(130deg, #ff6489, #9f70ed) repeat scroll 0 0; /* Opera 11.10+ */ background: -ms-linear-gradient(130deg, #9f70ed, #ff6489) repeat scroll 0 0; /* IE10+ */ border: none !important; border-radius: 5px; color: #ffffff; cursor: pointer; display: inline-block; font-family: 'Fira Sans', Arial, Sans-Serif; font-size: 16px; font-weight: 700; line-height: 24px; padding: 10px 20px 10px 20px; letter-spacing: 1px; margin-top: 25px; text-transform: uppercase; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .widget-type-google_search .hs-button.primary:hover { box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 5px 8px 15px rgba(0, 0, 0, 0.20); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .widget-type-google_search .hs-button.primary:focus { box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.20); -moz-box-shadow: 0 5px 8px 15px rgba(0, 0, 0, 0.20); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } /* CTA Buttons ========================================================================== */ /** * Override global CTA styles by wrapping the CTA module in a module group * that has an ID, and use that ID to prefix your CTA selector. Example shown below. * * All overriding properties require !important tags. */ #module-group-ID .cta_button {} #module-group-ID .cta_button:hover {} #module-group-ID .cta_button:focus {} /* ========================================================================== 6. MISCELLANOUS ========================================================================== */ /** * Styles that do not fit into available sections above can go here. * For example, one would place 3rd party plugin overriding styles here. * * This section is NOT for 'Custom' styles. All custom styles must go in the * proper sections above. * * For instance, custom header and footer styles must go in the HEADER and * FOOTER sections. Custom styles for anything in-between the header and footer * (such as, styles that are unique to the HOMEPAGE only), must go in the * CONTENT section. */ /* ========================================================================== 7. MOBILE MEDIA QUERIES ========================================================================== */ @media (min-width: 992px) and (max-width: 1199px) { #hs_cos_wrapper_post_body td { padding-right: 10px; vertical-align: top; width: 50% !important; } #hs_cos_wrapper_post_body table { width: 100% !important; } /* Website Page Meqia Queries */ .hs-menu-depth-2.hs-item-has-children .hs-menu-children-wrapper { box-shadow: 1px 2px 3px #666666; left: 200px !important; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children:last-child ul.hs-menu-children-wrapper { left: -93px; } .abt-top { margin-top: 0; } .hs_cos_gallery_lightbox_thumbnails .hs_cos_gallery_slide.slick-slide { width: 31% !important; } .countdown-width .countdown-wrap:last-child { padding-right: 0px !important; } .preference-page .email-prefs .item { width: 47.8%; } .team-col-content { padding: 20px 10px !important; } .clients-col .clients-img { width: 17.7% !important; } .pad-right { padding-right: 35px; padding-left: 10px; } .pad-left { padding-left: 35px; padding-right: 10px; } .news-content { padding: 0px 0px 0px 0px; } .phone-col, .email-col, .location-col { padding: 30px 15px; } .contact-width { padding: 175px 20px 175px; } .founder-content { padding-top: 20px; } .portfolio-pg-content { padding: 25px 20px; width: 83% !important; } .portfolio-pg-div > div { max-width: 90% !important; width: 90% !important; } .portfolio-pg-top { margin-top: 70px; } .portfolio-details p span:first-child { width: 57%; } .portfolio-details p span:nth-child(2) { width: 14px; text-align: center; } .portfolio-details p span:nth-child(3) { width: 38%; } } @media (min-width: 1020px) and (max-width: 1024px) { .portfolio-content h4 { padding-top: 50px; } .owl-theme .owl-controls .owl-buttons div { bottom: 45px; } } @media (min-width: 992px) and (max-width: 1019px) { .portfolio-content h4 { padding-top: 40px; } .owl-theme .owl-controls .owl-buttons div { bottom: 35px; } } @media (min-width: 768px) and (max-width: 991px) { .content-wrapper .span8.widget-span.widget-type-cell { margin-bottom: 20px !important; width: 100%; } .content-wrapper .span4.widget-span.widget-type-cell { margin-left: 0; margin-top: 0px; width: 100%; } .content-wrapper .blog-sidebar { margin-top: 20px !important; } .blog-sidebar .widget-span.widget-type-raw_jinja .cell-wrapper.layout-widget-wrapper, .hs-author-profile.hs-author-profile-sidebar { margin: 0 auto 30px auto !important; width: 360px; } #hs_cos_wrapper_post_body td { vertical-align: top; width: 100% !important; } .header-head, #hs_cos_wrapper_post_body table { width: 100% !important; } #hs_cos_wrapper_post_body tr { display: grid; width: 100%; } .blog-content .section.post-body ul li:last-child, table tr td img { margin-bottom: 10px; } .post-listing .hs-author-profile .hs-author-bio { margin-top: 10px; width: 69% !important; } .price-top, .testimonial-top, .sub-head-top, .hs-author-profile .hs-author-bio { margin-top: 0px; } .res-left { text-align: left; } /* Website Page Media Queries */ .menu-icons ul { margin: 0 auto 10px; display: table; } .hs-menu-wrapper.active-branch.flyouts.hs-menu-flow-horizontal { font-size: 0; } .menu-icons, .menu-logo, .hs-menu-wrapper.hs-menu-flow-horizontal > ul { float: none !important; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li a { padding: 24px 25px 24px 12px !important; } .menu-logo { padding: 20px 0 0px 0; } .menu-logo > div { margin: 0 auto; display: block; text-align: center; } .top-menu-space { padding-top: 20px; } .custom-menu-primary { float: none !important; margin: 0 auto !important; text-align: center; width: 100% !important; } li.hs-menu-depth-2.hs-item-has-children::after, li.hs-menu-depth-1.hs-item-has-children::after, .dark-menu-bg li.hs-menu-depth-1.hs-item-has-children::after { font-size: 14px; right: 12px; } .res-width{ max-width: 80% !important; width: 80% !important; margin:0 auto !important; } .res-center { text-align: center !important; } .res-bottom20 { margin-bottom: 20px; } .res-bottom30 { margin-bottom: 30px; } .res-bottom40 { margin-bottom: 40px; } .onecol-res { width: 100% !important; display:block !important; margin-left: 0 !important; margin-right: 0 !important; } .col-6 { width: 50% !important; margin-left: 0!important; margin-right: 0!important; } .center-align { width: 100% !important; margin-left: 0 !important; } .center-align > div { display: table !important; margin: 0 auto !important; width: 360px !important; } .hs_cos_gallery_lightbox_thumbnails .hs_cos_gallery_slide.slick-slide { width: 50% !important; } .pg-prompt-head > div, .unsubs-pg-head > div { width: 65%; } .portfolio-bg > div, .testimonial-div, .subs-head form, .coming-subs-head form, .page500-head > div, .page-404-head > div, .preference-page .email-prefs .item { width: 100%; } .footer-bg .res-width > div { width: 60%; margin: 0 auto; } .team-col { float: left !important; } .clients-col .clients-img { width: 17.7% !important; } .intro-content p, .res-clients-img > div img { width: 90% !important; } .res-clients-img > div { width: 80%; } .news-col-top { margin-top: 55px; } .news-img1 { margin-bottom: 25px; margin-top: 25px; } .founder-img, .abt-img { margin-bottom: 30px; margin-top: 32px; } .faq-top, .abt-top { margin-top: 20px; } .pad-left { padding-left: 0; } .pad-right { padding-right: 0; } .services-pg-img.fa-envelope-o p span::before, .services-pg-img.fa-stack-exchange p span::before, .services-pg-img.fa-eercast p span:before { top: 55px; } .services-pg-img.fa-first-order p span::before { top: 75px; } .service-pad-left { padding-left: 0px; } .portfolio-content h4 { padding-top: 20px; } .btn-bot { position: unset; margin-top: 30px; } .owl-theme .owl-controls .owl-buttons div { bottom: 15px; } .page-header-div { text-align: center; width: 100% !important; } .header-head h1, .header-head .header-content { background-color: rgba(255,255,255,0.8); padding: 15px; } .res-hide { display: none; } .menu-pos-abs .menu-bg { background-color: rgba(34,34,34,0.2); } .contact-padding { padding-bottom: 130px; padding-top: 130px; } .contact-width { padding: 171px 20px; } .founder-content { padding-top: 0px; } .content-top-space4, .founder-top { margin-top: 30px; } .portfolio-pg-content > div:nth-child(2), .portfolio-pg-content > div:nth-child(1) { display: none; } .portfolio-pg-content { background-color: transparent; padding: 30px 20px; width: 85% !important; } .portfolio-pg-content .btn-top { background-color: rgba(255,255,255,0.9); border-radius: 5px; padding: 20px 10px; margin-top: 0; text-align: center; } .portfolio-pg-content .btn-top.btn.btn-1 p a { padding: 15px 30px; } .portfolio-pg-content .btn-top.btn.btn-1 p { line-height: 16px; } .portfolio-pg-top { margin-top: 60px; } .portfolio-details-content { padding-top: 50px; } .portfolio-details { width: 80% !important; } .content-top-space3 { padding-top: 30px; } .details-list, .portfolio-list { margin-top: 10px; } .image-bottom { margin: 0 0 20px 0; } .blog-sidebar > div { margin: 0 auto 30px; width: 360px; } .blog-sidebar > div:last-child { margin: 0 auto 0px; } } /* Screen sizes smaller than site maxWidth (.page-center) ========================================================================== */ @media (max-width: 1170px) { .container-fluid .row-fluid .page-center { padding: 0 15px; } .container-fluid .footer-copyright .row-fluid .page-center { padding: 0 15px; } } /* Landscape tablet and smaller devices ========================================================================== */ @media (max-width: 767px) { .section.post-footer .new-comments { margin-bottom: 40px; } .content-wrapper .blog-sidebar { margin-top: 0px !important; } .content-wrapper .span8.widget-span.widget-type-cell { margin-bottom: 0px !important; } #hs_cos_wrapper_post_body td { padding-right: 10px; vertical-align: top; width: 50% !important; } .header-head, #hs_cos_wrapper_post_body table { width: 100% !important; } .sub-head-top, .hs-author-profile .hs-author-bio { margin-top: 0px; } .hs-author-listing-header { margin-top: 30px !important; } .menu-bg .row-fluid { padding-top: 0px; } /* Website Page Media Queries */ .custom-menu-primary .hs-menu-wrapper > ul { height: 270px !important; overflow: auto; } .menu-icons ul { display: table; margin: 0 auto 10px; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul { float: none !important; } .menu-logo { padding: 20px 0 20px 0; } .top-menu-space { padding-top: 20px; } .top-menu, .custom-menu-primary { float: none !important; margin: 0 auto !important; text-align: center; width: 100% !important; } .custom-menu-primary .hs-menu-item.hs-menu-depth-1:hover, .custom-menu-primary .hs-menu-item.hs-menu-depth-1:active, .custom-menu-primary .hs-menu-item.hs-menu-depth-1:focus, .custom-menu-primary .hs-menu-item.hs-menu-depth-1.hs-item-has-children:hover, .custom-menu-primary .hs-menu-item.hs-menu-depth-1.hs-item-has-children:active, .custom-menu-primary .hs-menu-item.hs-menu-depth-1.hs-item-has-children:focus { width: 100%; } .menu-pos-abs { left: 0; right: 0; } .res-width{ max-width: 100% !important; width: 100% !important; margin:0 auto !important; } .res-center { text-align: center !important; } .res-bottom20 { margin-bottom: 20px; } .res-bottom40 { margin-bottom: 40px; } .res-bottom30 { margin-bottom: 30px; } .onecol-res { width: 100% !important; display:block !important; margin-left: 0 !important; margin-right: 0 !important; } .res-col-6, .col-6 { width: 50% !important; margin-left: 0!important; margin-right: 0!important; } .center-align { width: 100% !important; margin-left: 0 !important; } .center-align > div { display: table !important; margin: 0 auto !important; width: 360px !important; } .hs_cos_gallery_lightbox_thumbnails .hs_cos_gallery_slide { height: 100px; } .mobile-trigger { position: relative !important; } .custom-menu-primary.js-enabled { margin: 10px 0; padding-bottom: 20px; padding-top: 10px; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li a { padding: 12px !important; } /* Both Menu Together Left and Right */ .menu-col { position: relative; } .menu-logo img { width: 160px !important; } .custom-menu-primary.top-menu-2 { position: absolute; right: 15px; top: 87px; width: 44px !important; z-index: 99; } .custom-menu-primary.top-menu-2 ul li a { color: #ffffff !important; } .child-trigger i, .child-trigger i:after { background-color: #ffffff; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul ul, .hs-menu-wrapper.hs-menu-flow-horizontal > ul { background: rgba(34, 34, 34, 1) none repeat scroll 0 0 !important; background-color: rgba(34, 34, 34, 1) !important; } li.hs-menu-depth-2.hs-item-has-children::after, li.hs-menu-depth-1.hs-item-has-children::after { content: ""; } .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal > ul { border-top: 2px solid #ff6489; display: block !important; position: absolute; right: 0; margin: 0 auto; top: -26px; width: 250px; z-index: 1; } .custom-menu-primary.js-enabled { padding-bottom: 0px; } .unsubs-pg-head > div { width: 65%; } .testimonial-div, .preference-page .email-prefs .item { width: 100%; } .page500-head > div, .page-404-head > div { width: 90%; } .coming-subs-head form { width: 80%; } .footer-bg .res-width > div { width: 300px; margin: 0 auto; } .team-col { float: left !important; } .clients-col .clients-img { width: 17.7% !important; } .intro-content p, .res-clients-img > div img { width: 90% !important; } .res-clients-img > div { width: 80%; } .news-col-top { margin-top: 30px; } .news-img1, .abt-img { margin-bottom: 15px; margin-top: 15px; } .news-content { padding: 0px 0px 0px 0px; } .faq-top, .abt-top { margin-top: 20px; } .pad-left { padding-left: 0; } .float-left, .pad-right { padding-right: 0; } .services-pg-img.fa-envelope-o p span::before, .services-pg-img.fa-stack-exchange p span::before, .services-pg-img.fa-eercast p span:before { top: 55px; } .services-pg-img.fa-first-order p span::before { top: 75px; } .abt-div-counter > div.span3 { float: left; margin-left: 0 !important; margin-right: 0 !important; width: 50% !important; } .counter-space25 { padding-top: 0px; } .abt-div-counter > div.span3:nth-child(3) { clear: both; } .res-abt-pad-right { padding-right: 15px; } .res-abt-pad-left { padding-left: 15px; } .portfolio-content h4 { padding-top: 20px; } .btn-bot { position: unset; margin-top: 30px; } .owl-theme .owl-controls .owl-buttons div { bottom: 15px; } .header-bg { padding-bottom: 110px; padding-top: 230px; } .header-head h1, .header-head .header-content { background-color: rgba(255,255,255,0.8); padding: 15px; } .res-hide { display: none; } .menu-pos-abs .menu-bg { background-color: rgba(34,34,34,0.2); } .founder-img:before, .abt-img:before, .portfolio-pg-img:before, .portfolio-img:before { top: 14px; height: 96%; width: 96%; } .news-img1::before { top: 15px; height: 95%; width: 98%; } .portfolio-pg-img, .founder-img { margin-bottom: 15px; margin-top: 15px; } .content-width { padding: 0 30px; } .abt-div { width: 165px !important; } .clients-col > div { display: block; } .abt-div, .clients-col .clients-img { float: left !important; } .clients-col .clients-img { float: left !important; width: 20% !important; } .res-clients-img > div img { width: 90% !important; } .res-clients-img div.span3.widget-span { float: left !important; width: 25% !important; } .no-pad-portfolio.content-width { padding: 0px 15px; } .portfolio-div { padding: 0 15px; } .portfolio-pad-top { padding-bottom: 15px; padding-top: 15px; } .owl-theme .owl-controls .owl-buttons .owl-prev { right: 80px; } .owl-theme .owl-controls .owl-buttons .owl-next { right: 35px; } .section-space { padding-bottom: 80px !important; padding-top: 80px !important; } .subscribe-padding { padding-bottom: 40px !important; padding-top: 40px !important; } .abt-div-counter .abt-div { float: none !important; width: unset !important; } .full-col-bg { position: static; } .contact-padding { padding-bottom: 80px; padding-top: 80px; } .contact-width { padding: 80px 0px; } .contact-col-bg > .row-fluid-wrapper.row-depth-1:nth-child(1), .contact-col-bg > .row-fluid-wrapper.row-depth-1:nth-child(2), .contact-col-bg > .row-fluid-wrapper.row-depth-1, .portfolio-bg > div, .contact-width, .full-col-bg { float: none !important; width: 100% !important; } .founder-content { padding-top: 0px; } .tab-content-top, .content-top-space4, .portfolio-pg-top, .res-portfolio-pg-top, .founder-top { margin-top: 30px; } .portfolio-details-content { padding-top: 35px; } .portfolio-details { width: 80% !important; } .content-top-space3 { padding-top: 30px; } .details-list, .portfolio-list { margin-top: 10px; } .services-details-menu { margin: 0 auto 20px auto !important; width: 300px !important; } .res-col-6 { float: left !important; } .res-service-pad { padding-left: 30px; } .image-bottom { margin: 0 0 15px 0; } .blog-sidebar > div { margin: 0 auto 30px; width: 360px; } .blog-sidebar > div:last-child { margin: 0 auto 0px; } } @media (max-width: 640px) { #hs_cos_wrapper_post_body td { display: table; padding-right: 0; width: 100% !important; } #hs_cos_wrapper_post_body table { width: 100% !important; } #hs_cos_wrapper_post_body tr { display: table; width: 100%; } .post-listing .hs-author-profile .hs-author-bio { margin-top: 10px; width: 65% !important; } .blog-listing-wrapper .post-body.clearfix { display: grid; } .subs-head form, .subs-update-head > div { width: 100%; } .pg-prompt-head > div, .unsubs-pg-head > div { width: 75%; } .founder-img:before { top: 10px; height: 96%; width: 96%; } .founder-img { margin-bottom: 10px; margin-top: 10px; } .sign-name { margin-top: 20px; } } @media (max-width: 575px) { .grecaptcha-badge, #recaptcha_area, .recaptchatable { transform:scale(0.9); -webkit-transform:scale(0.9); transform-origin:0 0 0 !important; -webkit-transform-origin:0 0 0 !important; max-width: 100% !important; max-height: 100% !important; height: 115px; } .pg-prompt-head > div, .unsubs-pg-head > div { width: 75%; } .news-img1::before { top: 7px; height: 97%; width: 98%; } .founder-img::before, .abt-img::before, .portfolio-pg-img::before, .portfolio-img::before { top: 5px; height: 98%; width: 98%; } .portfolio-pg-content { width: 93% !important; } .portfolio-details, .portfolio-pg-div > div { max-width: 100% !Important; width: 100% !Important; } .post-listing .hs-author-profile .hs-author-avatar { margin-right: 0; } .post-listing .hs-author-profile .hs-author-bio { margin-top: 15px; width: 100% !important; } } /* Landscape phones and smaller devices ========================================================================== */ @media (max-width: 479px) { .avatar-img { display: grid; } .hs-author-social-section .hs-author-social-links { text-align: left; } .grecaptcha-badge, #recaptcha_area, .recaptchatable { transform-origin:0 0% 0 !important; -webkit-transform-origin:0 0% 0 !important; height: 115px; } .center-align > div { width: 360px !important; margin: 0 auto !important; } .hs-form input[type="checkbox"], .hs-form input[type="radio"] { width: 0 !important; } body .hs-form fieldset.form-columns-2 .hs-form-field, .hs-form-field input, .form-columns-2 > div { max-width: 100% !important; width: 100% !important; } .intro-content p, body .hs-form fieldset.form-columns-3 .hs-form-field, .form-columns-3 > div { max-width: 100%; width: 100% !important; } .btn-top { margin-top: 30px; } .header-bg { padding-bottom: 50px; padding-top: 160px; } .contact-width, .contact-padding, .abt-bg-padding, .section-space { padding-bottom: 50px !important; padding-top: 50px !important; } .subscribe-padding { padding-bottom: 40px !important; padding-top: 40px !important; } .countdown { font-size: 45px; line-height: 55px; } .header-head h1, .page-header-div h1 { font-size: 35px; line-height: 45px; } .coming-content p, .error500-title p, .error-title p, h2 { font-size: 30px; line-height: 40px; } h3 { font-size: 28px; line-height: 38px; } .blog-sidebar > div h3, .error500-content1 p, h4 { font-size: 22px; line-height: 32px; } .error-content p { font-size: 18px; line-height: 28px; } .intro-content p { font-size: 16px; line-height: 26px; } .title-bottom { margin: 0 0 30px 0; } .content-top-space { padding-top: 10px; } /* Website Page Media Queries */ .coming-subs-head form, .page500-head > div, .page-404-head > div, .pg-prompt-head > div, .unsubs-pg-head > div { width: 100%; } .services-pg-col, .services-col, .portfolio-bg > div, .portfolio-details, .page500-head > div, .page-404-head > div, .pg-prompt-head > div, .unsubs-pg-head > div { padding: 30px 20px; } .unsubs-pg-head h1 { font-size: 18px; line-height: 28px; } .unsubs-pg-head form h3 { font-size: 16px; line-height: 26px; } .subs-update-head .success { font-size: 15px; } .preference-page .hs-button.primary { font-size: 14px; padding: 15px 20px; white-space: normal; word-wrap: break-word; } .pwd-prompt #hs-pwd-widget-password { margin-top: 30px !important; } .error500-content1 p { margin-bottom: 20px; } .blog-content .section.post-body ul li, .details-list ul li, .portfolio-list ul li, .founder-icons ul, .heading-bottom, .faq-ans .res-bottom20, .get-touch-col ul, .price-list ul li, .faq-list-content ul, .faq-list ul li, .error500-title p, .error-title p, .footer-addr-col ul { margin-bottom: 10px; } .footer-bg h4 { padding: 0 0 10px 0 !important; } .footer-icons li { margin-top: 20px; } .footer-addr-col ul li:first-child { width: 35px; } .experts-call ul li:last-child, .price-list, .faq-list-content, .faq-list, .coming-content p { margin-top: 10px; } .service-pad-left { padding-left: 0px; } .services-pg-img { position: relative; top: 0px; left: 0px; right: 0; margin: 0 auto 20px; } .services-pg-img:before { left: 0px; right: 0; top: 15px; margin: 0 auto; } .services-pg-col { text-align: center; } .services-pg-img.fa-first-order p span::before, .services-pg-img.fa-envelope-o p span:before, .services-pg-img.fa-stack-exchange p span::before, .services-pg-img.fa-eercast p span::before { top: -95px; left: -37px; right: 0; margin: 0 auto; } .team-col { float: none !important; } .col-6 { width: 90% !important; border-radius: 5px !important; -webkit-border-radius: 5px !important; -moz-border-radius: 5px !important; } .res-service-bottom, .res-team-bottom { margin-bottom: 30px; } .abt-div { width: 125px !important; } .news-img1::before { top: 5px; height: 97%; width: 100%; } .founder-img::before, .abt-img::before, .portfolio-pg-img::before, .portfolio-img::before { top: 2px; height: 99%; width: 98%; } .coming-subs-head form, .subs-head form { display: block; } .coming-subs-head .actions, .subs-head .actions { position: unset; margin-top: 20px; } .coming-subs-head .hs-button.primary, .coming-subs-head input[type="submit"], .coming-subs-head input[type="button"], .subs-head .hs-button.primary, .subs-head input[type="submit"], .subs-head input[type="button"] { border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; width: 100%; } .sign-name { margin-top: 20px; } .contact-form .form-columns-2 > div .input { margin-right: 0 !important; } .portfolio-details p span:nth-child(2) { text-align: center; } .portfolio-details p span:last-child, .portfolio-details p span:first-child { width: 45%; } .res-col-6 { float: none !important; width: 100% !important; } .res-service-pad { padding-left: 0; } } @media (max-width: 414px) { .blog-sidebar > div, .center-align > div { width: 100% !important; } .countdown-wrap { padding-right: 50px; } .countdown-wrap:nth-child(3) { padding-right: 0; } .col-6 { width: 100% !important; } .abt-div { float: none !important; border-left: none; padding-left: 0; width: auto !important; } .abt-space25 { margin-top: 20px; } .portfolio-pg-content > div:nth-child(2), .portfolio-pg-content > div:nth-child(1) { display: none; } .portfolio-pg-content { background-color: transparent; padding: 0px 0px; top: 125px; bottom: 125px; width: 85% !important; } .portfolio-pg-content .btn-top { background-color: rgba(255,255,255,0.9); border-radius: 5px; padding: 20px 10px; margin-top: 0; text-align: center; } .portfolio-pg-content .btn-top.btn.btn-1 p a { padding: 15px 30px; } .portfolio-pg-content .btn-top.btn.btn-1 p { line-height: 16px; } .single-post-content #hubspot-author_data { margin-bottom: 0; } #hubspot-topic_data a.topic-link { display: inline-block; font-size: 12px; margin-top: 10px; padding: 5px 15px; } } @media (max-width: 380px) { .preference-page .checkbox-row span.fakelabel span { float: none; display: flex; display: -webkit-flex; } .countdown-wrap { padding-right: 30px; } } @media (max-width: 360px) { .grecaptcha-badge, #recaptcha_area, .recaptchatable { transform:scale(0.85); -webkit-transform:scale(0.85); transform-origin:0 0% 0 !important; -webkit-transform-origin:0 0% 0 !important; max-width: 100% !important; height: 100px; } .services-details-menu, .abt-div-counter > div.span3 { float: none; width: 100% !important; } .res-abt-pad-right { padding-right: 0; } .res-abt-pad-left { padding-left: 0; } .abt-res-count-bot30 { margin-bottom: 30px; } .owl-theme .owl-controls .owl-buttons .owl-prev { right: 40px; } .owl-theme .owl-controls .owl-buttons .owl-next { right: 0px; } .footer-bg .res-width > div { width: 100%; margin: 0 auto; } .countdown-wrap { padding-right: 25px; } .portfolio-pg-content { top: 100px; bottom: 100px; } .blog-listing-wrapper.sidebar-post-listing-wrapper .post-listing .post-item .post-body { margin-bottom: 10px; } .blog-listing-wrapper.sidebar-post-listing-wrapper .post-listing .post-item .post-body, .blog-listing-wrapper.sidebar-post-listing-wrapper .post-listing .post-item .post-header { float: none; width: 100%; } } @media (max-width: 330px) { .grecaptcha-badge, #recaptcha_area, .recaptchatable { transform:scale(0.8); -webkit-transform:scale(0.8); transform-origin:0 0% 0 !important; -webkit-transform-origin:0 0% 0 !important; max-width: 100% !important; height: 90px; } .countdown-wrap { padding-right: 40px; width: 120px; } .countdown-wrap:nth-child(3) { padding-right: 40px; } .countdown-wrap:nth-child(2) { padding-right: 0px; } .post-item-text { padding: 0 15px; } .post-item { display: inline-grid; } } @media (max-width: 320px) { .top-menu-2 .hs-menu-wrapper.hs-menu-flow-horizontal > ul { top: -28px; } .owl-theme .owl-controls .owl-buttons .owl-next { right: 5px; } body .hs-button.primary, body input[type="submit"], body input[type="button"], .btn p a { padding: 15px 25px !important; } a#cta_button_3813597_e04866cc-830a-420d-abb9-0ca29c5c4b15.cta-btn { padding: 15px 25px 15px 25px !important; } .experts-call li:last-child p span a { padding-left: 0; } } /* =============================================================================== */