/* Global Styling */ @import url(https://fonts.googleapis.com/css?family=Raleway:400,200italic,200,100,100italic,300,300italic,400italic,500,500italic,600,600italic,700,700italic,800); /* font-family: 'Raleway', sans-serif; */ @import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,600,300,300italic,400italic,600italic,700italic,800,800italic); /*Table Of Contents /* CSS Document Table Of Content +General Styling and Tags *body + @font-face + #home - header -navbar-nav - .rev_slider_wrapper + #about-us - #what-we-do - #counters - #counters - #our-team - #company-history + #portfolio - #portfolio-info - #pricing-table + #pricing - #pricing-table - #happy-clients + #blog - #blog-post - #blog-text + #contact-us - #contact-form - #contact-address + footer */ /*loader start */ .loader { height: 100%; width: 100%; position: fixed; overflow: hidden; z-index: 1200; background: #ffffff; } .cssload-loader { width: 54px; height: 54px; position: absolute; left: 50%; transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); top: 50%; } .cssload-inner { position: absolute; width: 100%; height: 100%; box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; } .cssload-inner.cssload-one { left: 0%; top: 0%; animation: cssload-rotate-one 1.15s linear infinite; -o-animation: cssload-rotate-one 1.15s linear infinite; -ms-animation: cssload-rotate-one 1.15s linear infinite; -webkit-animation: cssload-rotate-one 1.15s linear infinite; -moz-animation: cssload-rotate-one 1.15s linear infinite; border-bottom: 3px solid rgba(247, 50, 70, 0.97); } .cssload-inner.cssload-two { right: 0%; top: 0%; animation: cssload-rotate-two 1.15s linear infinite; -o-animation: cssload-rotate-two 1.15s linear infinite; -ms-animation: cssload-rotate-two 1.15s linear infinite; -webkit-animation: cssload-rotate-two 1.15s linear infinite; -moz-animation: cssload-rotate-two 1.15s linear infinite; border-right: 3px solid rgb(247, 50, 70); } .cssload-inner.cssload-three { right: 0%; bottom: 0%; animation: cssload-rotate-three 1.15s linear infinite; -o-animation: cssload-rotate-three 1.15s linear infinite; -ms-animation: cssload-rotate-three 1.15s linear infinite; -webkit-animation: cssload-rotate-three 1.15s linear infinite; -moz-animation: cssload-rotate-three 1.15s linear infinite; border-top: 3px solid rgb(247, 50, 70); } @keyframes cssload-rotate-one { 0% { -webkit-transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg); -moz-transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg); transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg); } 100% { -webkit-transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg); -moz-transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg); transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg); } } @-o-keyframes cssload-rotate-one { 0% { -o-transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg); } 100% { -o-transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg); } } @-webkit-keyframes cssload-rotate-one { 0% { -webkit-transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg); } 100% { -webkit-transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg); } } @-moz-keyframes cssload-rotate-one { 0% { -moz-transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg); } 100% { -moz-transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg); } } @keyframes cssload-rotate-two { 0% { -webkit-transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg); -moz-transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg); transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg); } 100% { -webkit-transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg); -moz-transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg); transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg); } } @-o-keyframes cssload-rotate-two { 0% { -o-transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg); } 100% { -o-transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg); } } @-webkit-keyframes cssload-rotate-two { 0% { -webkit-transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg); } 100% { -webkit-transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg); } } @-moz-keyframes cssload-rotate-two { 0% { -moz-transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg); } 100% { -moz-transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg); } } @keyframes cssload-rotate-three { 0% { -webkit-transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg); -moz-transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg); transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg); } 100% { -webkit-transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg); -moz-transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg); transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg); } } @-o-keyframes cssload-rotate-three { 0% { -o-transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg); } 100% { -o-transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg); } } @-webkit-keyframes cssload-rotate-three { 0% { -webkit-transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg); } 100% { -webkit-transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg); } } @-moz-keyframes cssload-rotate-three { 0% { -moz-transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg); } 100% { -moz-transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg); } } /*loader start */ body { margin: 0; padding: 0; position: relative; font-size: 15px; font-family: 'Open Sans', sans-serif; color: #1b1b1b; -webkit-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; } .buttons { display: inline-block; vertical-align: middle; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); transform: translateZ(0); -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; position: relative; -webkit-transition-property: color; -o-transition-property: color; -moz-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; -o-transition-duration: 0.3s; -moz-transition-duration: 0.3s; transition-duration: 0.3s; padding: 16px 50px; -webkit-border-radius: 0; border-radius: 0; font-size: 14px; font-family: 'Open Sans', sans-serif; } .wrenchboard-promo-description { color: #333; font-size: 16px; font-family: "suntrustregular","FS Albert",sans-serif; font-weight: 500; margin-top: 5px; display: block; padding-right: 25px; padding-left: 25px; padding-bottom: 15px; } [class^="icon-"], [class*=" icon-"] { font-family: 'icomoon'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; min-width: 1em; display: inline-block; text-align: center; font-size: 16px; vertical-align: middle; position: relative; top: -1px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .buttons:before { content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background: #2098d1; -webkit-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); -moz-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 100% 50%; -ms-transform-origin: 100% 50%; -o-transform-origin: 100% 50%; -moz-transform-origin: 100% 50%; transform-origin: 100% 50%; -webkit-transition-property: transform; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; -o-transition-property: transform, -o-transform; -moz-transition-property: transform, -moz-transform; transition-property: transform, -webkit-transform, -moz-transform, -o-transform; -webkit-transition-duration: 0.3s; -o-transition-duration: 0.3s; -moz-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; -moz-transition-timing-function: ease-out; transition-timing-function: ease-out; } .buttons:hover, .buttons:focus, .buttons:active { color: white; } .buttons:hover:before, .buttons:focus:before, .buttons:active:before { -webkit-transform: scaleX(1); -ms-transform: scaleX(1); -o-transform: scaleX(1); -moz-transform: scaleX(1); transform: scaleX(1); } .fade { -webkit-transition: opacity 500ms linear !important; -o-transition: opacity 500ms linear !important; -moz-transition: opacity 500ms linear !important; transition: opacity 500ms linear !important; } h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; line-height: normal; font-weight: 400; font-family: 'Raleway', sans-serif; } h2 { margin-bottom: 20px; text-align: center; font-size: 48px; line-height: 64px; margin: 15px auto 0; } h3 { font-size: 26px; font-weight: 500; } h4 { font-size: 18px; text-transform: capitalize; font-weight: 600; } .logon-box .jpui.input { width: 100%; font-size: 1rem; color: #717171; background: 0 0; border: none; border-bottom-width: medium; border-bottom-style: none; border-bottom-color: currentcolor; padding: 5px; margin: 4px 0; border-bottom: 1px solid #ccc; } .logon-box .welcomeBoxHeader { font-size: 1.5rem; color: #414042; font-weight: 400; font-size: 30px; margin: 0; outline: 0; } p { padding: 0; margin: 0; font-family: 'Open Sans', sans-serif; font-size: 15px; font-weight: 400; line-height: normal; } .p-margin { margin-left: 10%; margin-right: 10%; padding-bottom: 15px; } ul, ol { margin: 0; padding: 0; list-style: none; } a, a:hover, a:focus { text-decoration: none; outline: none; color: inherit; } .padding-one { padding-top: 55px; padding-bottom: 85px; } .padding-two { padding-top: 25px; padding-bottom: 25px; } .padding-one-top { padding-top: 85px; } .padding-40 { padding-top: 40px; padding-bottom: 40px; } .padding-20 { padding-top: 20px; padding-bottom: 20px; } .padding-three { padding-top: 30px; padding-bottom: 30px; } .padding-top-80 { padding-top: 80px; } .padding-top-40 { padding-top: 40px; } hr { width: 96px; border: 1px solid #1b1b1b; margin: 0 auto 30px; } .margin-0 { margin-left: 0; margin-right: 0; } .margin-100-top { margin-top: 100px; } .margin-100-bottom { margin-bottom: 100px; } .margin-60-top { margin-top: 60px; } .margin-20-bottom { margin-top: 20px; } .margin-right-plus { margin-right: 15px; } /*Home styling start */ /*header styling start */ .navbar { color: #1b1b1b; min-height: 10px; } .shrink { -webkit-transition: all 300ms linear; -moz-transition: all 300ms linear; -o-transition: all 300ms linear; transition: all 300ms linear; } .navbar-default { background: transparent; border: none; } .navbar-brand > img { -webkit-transition: all 300ms linear; -moz-transition: all 300ms linear; -o-transition: all 300ms linear; transition: all 300ms linear; width: 100%; } .shrink .navbar-brand > img { width: 117px; } .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover { background: transparent; color: #f73246; } .shrink.navbar-default .navbar-nav > .active > a, .shrink.navbar-default .navbar-nav > .active > a:focus, .shrink.navbar-default .navbar-nav > .active > a:hover { background: #f73246; color: #FFFFFF; } .navbar-default .navbar-nav > .active > a:focus { background: transparent; } .navbar .navbar-nav { margin-right: 0; } .navbar .navbar-nav > li a { color: #1b1b1b; font-size: 14px; font-family: 'Raleway', sans-serif; line-height: 60px; -webkit-transition: all 300ms linear; -moz-transition: all 300ms linear; -o-transition: all 300ms linear; transition: all 300ms linear; } .navbar .navbar-nav > li:hover a { color: #f73246; } .shrink.navbar-default { background-color: #ffffff; -webkit-box-shadow: 0 2px 10px -1px rgba(87, 97, 100, 0.35); box-shadow: 0 2px 10px -1px rgba(87, 97, 100, 0.35); } .shrink .navbar-nav > li a { line-height: 52px; padding-top: 10px; padding-bottom: 10px; } .shrink .side-menu-button { top: 19px; } /* The side navigation menu */ .side-menu-button { position: relative; cursor: pointer; background-color: #f73246; padding: 7px 14px; -webkit-border-radius: 4px; border-radius: 0; color: #ffffff; -webkit-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; z-index: 2; display: inline-block; float: right; top: 28px; right: 4px; } .side-menu-button:hover { color: #ffffff; background: #1b1b1b; } .side-menu-button.actives { background: transparent; } .side-menu-button.actives .fa { color: #f85464; font-size: 36px; -webkit-transition: all 300ms linear; -moz-transition: all 300ms linear; -o-transition: all 300ms linear; transition: all 300ms linear; } .side-menu-button.actives .fa:hover { color: #6a6a6a; } .sidenav { height: 100%; /* 100% Full-height */ width: 0; /* 0 width - change this with JavaScript */ position: fixed; /* Stay in place */ z-index: 1; /* Stay on top */ top: 0; right: 0; background-color: rgba(255, 255, 255, 0.9); /* Black*/ overflow-x: hidden; /* Disable horizontal scroll */ padding-top: 0; /* Place content 60px from the top */ -webkit-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; } .mySideBar { width: 100%; } .mySideBar > ul.nav { position: relative; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .sidenav ul li { display: block; text-align: center; } /* The navigation menu links */ .sidenav ul > li a { color: #6a6a6a; font-size: 42px; font-family: 'Raleway', sans-serif; padding: 8px; text-align: center; display: inline-block; -webkit-transition: all 0.4s linear; -moz-transition: all 0.4s linear; -o-transition: all 0.4s linear; transition: all 0.4s linear; } /* When you mouse over the navigation links, change their color */ .sidenav ul > li.active a { color: #f73246; } .nav > li > a:focus, .nav > li > a:hover { background: transparent; } /* Position and style the close button (top right corner) */ .sidenav .closebtn { position: absolute; top: 0; right: 25px; font-size: 36px; margin-left: 50px; border: none; color: #fff; } /*header styling end */ /*Slider styling start */ .tparrows.tp-leftarrow::before { content: "\f104"; font-family: FontAwesome; } .tparrows.tp-rightarrow:before { content: "\f105"; font-family: FontAwesome; } #slider1 h2 { line-height: normal; font-weight: 300; color: #1b1b1b; font-family: 'Raleway', sans-serif; } #slider1 h2.red { font-size: 58px; font-weight: 700; color: #f73246; } #slider1 .slider-button { display: inline-block; vertical-align: middle; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); transform: translateZ(0); -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; position: relative; -webkit-transition-property: color; -o-transition-property: color; -moz-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; -o-transition-duration: 0.3s; -moz-transition-duration: 0.3s; transition-duration: 0.3s; padding: 16px 50px; -webkit-border-radius: 0; border-radius: 0; font-size: 14px; font-family: 'Open Sans', sans-serif; background: #1b1b1b; color: #FFFFFF; } #slider1 .slider-button.red{ background: #f73246; } #slider1 .slider-button:before { content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; background: rgba(255, 255, 255,0.2); -webkit-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); -moz-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 100% 50%; -ms-transform-origin: 100% 50%; -o-transform-origin: 100% 50%; -moz-transform-origin: 100% 50%; transform-origin: 100% 50%; -webkit-transition-property: transform; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; -o-transition-property: transform, -o-transform; -moz-transition-property: transform, -moz-transform; transition-property: transform, -webkit-transform, -moz-transform, -o-transform; -webkit-transition-duration: 0.3s; -o-transition-duration: 0.3s; -moz-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; -moz-transition-timing-function: ease-out; transition-timing-function: ease-out; } #slider1 .slider-button:hover, #slider1 .slider-button:focus, #slider1 .slider-button:active { color: #FFFFFF; } #slider1 .slider-button:hover:before, #slider1 .slider-button:focus:before, #slider1 .slider-button:active:before { -webkit-transform: scaleX(1); -ms-transform: scaleX(1); -o-transform: scaleX(1); -moz-transform: scaleX(1); transform: scaleX(1); } /*Slider styling end */ /*Home styling End */ /*About us styling start */ #what-we-do .what-we-do-features h3 { font-weight: 500; margin-bottom: 15px; -webkit-transition: all 500ms linear; -o-transition: all 500ms linear; -moz-transition: all 500ms linear; transition: all 500ms linear; line-height: 60px; } #what-we-do .what-we-do-features:hover > h3 { color: #f73246; cursor: pointer; } #what-we-do .what-we-do-features p { margin-left: 0; margin-right: 0; line-height: 26px; } #what-we-do .what-we-do-features h3 > span { display: inline-block; width: 50px; height: 50px; margin-right: 30px; position: relative; -webkit-transition: all 500ms ease-in-out; -o-transition: all 500ms ease-in-out; -moz-transition: all 500ms ease-in-out; transition: all 500ms ease-in-out; background: #f73246; text-align: center; -webkit-border-radius: 50%; border-radius: 50%; } #what-we-do .what-we-do-features h3.text-right > span { margin-right: 0; margin-left: 30px; } #what-we-do .what-we-do-features h3 i { color: #ffffff; display: block; line-height: 50px; } #what-we-do .what-we-do-features:hover h3 > span { -webkit-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); -moz-transform: translateY(-10px); transform: translateY(-10px); background: #1b1b1b; } #what-we-do #mobile-img { position: relative; } #what-we-do #mobile-img > img { position: relative; width: 100%; height: 100%; } #what-we-do #mobile-slider { position: absolute; top: 89px; left: 51px; width: 265px; height: 469px } #what-we-do #mobile-slider .item img { display: block; cursor: move; } /*About us styling end */ /* Pricing table styling Start */ #counters { background: url("../images/pricing-table.jpg") no-repeat fixed center; -o-background-size: cover; background-size: cover; color: #ffffff; } #counters .outer-circle { padding: 4px; -webkit-border-radius: 50%; display: inline-block; border: 2px solid transparent; -webkit-transition: all 300ms linear; -moz-transition: all 300ms linear; -o-transition: all 300ms linear; transition: all 300ms linear; } #counters .outer-circle:hover { border-color: #f73246; } #counters .icons { cursor: pointer; -webkit-border-radius: 50%; border-radius: 50%; border: 2px solid #fff; display: inline-block; width: 100px; height: 100px; -webkit-transition: all 300ms linear; -moz-transition: all 300ms linear; -o-transition: all 300ms linear; transition: all 300ms linear; } #counters .outer-circle:hover .icons { cursor: pointer; background: #f73246; border-color: transparent; } #counters .icons > i { font-size: 50px; display: inline-block; -webkit-border-radius: 100%; border-radius: 50%; background: transparent; line-height: 100px; } #counters .numscroller { font-size: 40px; font-weight: 400; } #counters p { font-size: 20px; font-family: 'Raleway', sans-serif; } /* Pricing table styling End */ /* Our team start */ /* Tabs container */ .r-tabs { position: relative; } /* Tab element */ .r-tabs .r-tabs-nav .r-tabs-tab { position: relative; cursor: pointer !important; } /* Tab anchor */ .r-tabs .r-tabs-nav .r-tabs-anchor { display: inline-block; text-decoration: none; font-size: 14px; font-weight: bold; color: #fff; cursor: pointer; } /* Disabled tab */ .r-tabs .r-tabs-nav .r-tabs-state-disabled { opacity: 0.5; } /* Tab panel */ .r-tabs .r-tabs-panel { background-color: white; border-bottom: 4px solid white; -webkit-border-bottom-right-radius: 4px; border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; border-bottom-left-radius: 4px; } /* Accordion anchor */ .r-tabs .r-tabs-accordion-title .r-tabs-anchor { display: block; padding: 10px; color: #fff; font-weight: bold; text-decoration: none; font-size: 14px; -webkit-border-top-right-radius: 4px; border-top-right-radius: 4px; -webkit-border-top-left-radius: 4px; border-top-left-radius: 4px; } /* Active accordion anchor */ .r-tabs .r-tabs-accordion-title.r-tabs-state-active .r-tabs-anchor { background-color: #fff; color: #00c5ad; } /* Disabled accordion button */ .r-tabs .r-tabs-accordion-title.r-tabs-state-disabled { opacity: 0.5; } /* Info bar */ .info { display: inline-block; margin-top: 10px; margin-right: 10px; padding: 10px 20px; width: 300px; line-height: 100%; font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace; font-size: 14px; color: #00c5ad; border: 2px solid #00ab94; -webkit-border-radius: 3px; border-radius: 3px; background-color: #fff; cursor: pointer; } #our-team .hovereffect { width: 100%; height: 100%; float: left; overflow: hidden; position: relative; text-align: center; cursor: pointer; } #our-team .hovereffect .overlay { width: 100%; position: absolute; overflow: hidden; left: 0; top: auto; bottom: 0; padding: 10px 10px; height: 4.75em; background: #f73246; color: #ffffff; -webkit-transition: -webkit-transform 0.35s; transition: -webkit-transform 0.35s; -moz-transition: transform 0.35s, -moz-transform 0.35s; -o-transition: transform 0.35s, -o-transform 0.35s; transition: transform 0.35s, -webkit-transform 0.35s, -moz-transform 0.35s, -o-transform 0.35s; -webkit-transform: translate3d(0, 100%, 0); -moz-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } #our-team .hovereffect img { display: block; position: relative; -webkit-transition: -webkit-transform 0.35s; transition: -webkit-transform 0.35s; -moz-transition: transform 0.35s, -moz-transform 0.35s; -o-transition: transform 0.35s, -o-transform 0.35s; transition: transform 0.35s, -webkit-transform 0.35s, -moz-transform 0.35s, -o-transform 0.35s; width: 100%; } #our-team .hovereffect:hover img { -webkit-transform: translate3d(0, -10%, 0); -moz-transform: translate3d(0, -10%, 0); transform: translate3d(0, -10%, 0); } #our-team .hovereffect a.info { display: inline-block; text-decoration: none; padding: 7px 14px; text-transform: uppercase; color: #fff; border: 1px solid #fff; margin: 50px 0 0 0; background-color: transparent; } #our-team .hovereffect a.info:hover { -webkit-box-shadow: 0 0 5px #fff; box-shadow: 0 0 5px #fff; } #our-team .hovereffect p.icon-links a { float: right; color: #3c4a50; font-size: 1.4em; } #our-team .hovereffect:hover p.icon-links a:hover, #our-team .hovereffect:hover p.icon-links a:focus { color: #252d31; } #our-team .hovereffect h2, #our-team .hovereffect p.icon-links a { -webkit-transition: -webkit-transform 0.35s; transition: -webkit-transform 0.35s; -moz-transition: transform 0.35s, -moz-transform 0.35s; -o-transition: transform 0.35s, -o-transform 0.35s; transition: transform 0.35s, -webkit-transform 0.35s, -moz-transform 0.35s, -o-transform 0.35s; -webkit-transform: translate3d(0, 200%, 0); -moz-transform: translate3d(0, 200%, 0); transform: translate3d(0, 200%, 0); } #our-team .hovereffect p.icon-links a span:before { display: inline-block; padding: 8px 10px; speak: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } #our-team .hovereffect:hover .overlay, #our-team .hovereffect:hover h2, #our-team .hovereffect:hover p.icon-links a { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } #our-team .hovereffect:hover h2 { -webkit-transition-delay: 0.05s; -moz-transition-delay: 0.05s; -o-transition-delay: 0.05s; transition-delay: 0.05s; } #our-team .hovereffect:hover p.icon-links a:nth-child(3) { -webkit-transition-delay: 0.1s; -moz-transition-delay: 0.1s; -o-transition-delay: 0.1s; transition-delay: 0.1s; } #our-team .hovereffect:hover p.icon-links a:nth-child(2) { -webkit-transition-delay: 0.15s; -moz-transition-delay: 0.15s; -o-transition-delay: 0.15s; transition-delay: 0.15s; } #our-team .hovereffect:hover p.icon-links a:first-child { -webkit-transition-delay: 0.2s; -moz-transition-delay: 0.2s; -o-transition-delay: 0.2s; transition-delay: 0.2s; } .r-tabs .r-tabs-nav .r-tabs-state-active img { -webkit-transform: translate3d(0, -10%, 0); -moz-transform: translate3d(0, -10%, 0); -ms-transform: translate3d(0, -10%, 0); -o-transform: translate3d(0, -10%, 0); transform: translate3d(0, -10%, 0); } .r-tabs .r-tabs-nav .r-tabs-state-active .overlay { -webkit-transform: translate3d(0, 0, 0) !important; -moz-transform: translate3d(0, 0, 0) !important; transform: translate3d(0, 0, 0) !important; } #our-team #tab-1 > div, #our-team #tab-2 > div, #our-team #tab-3 > div, #our-team #tab-4 > div { margin-left: 0; margin-right: 0; } .triangle-border.top::after { /* top: -13px; */ bottom: -76px; left: 45%; border-width: 0 17px 20px 18px; } .triangle-border::after { position: absolute; bottom: -13px; left: 47px; border-width: 13px 13px 0; border-style: solid; border-color: #fff transparent; display: block; width: 0; } .triangle-border.top:before { /* top: -20px; */ bottom: -76px; left: 44%; /* right: 40px; */ border-width: 0 21px 25px 21px; } .triangle-border:before { position: absolute; bottom: -20px; left: 40px; border-width: 20px 20px 0; border-style: solid; border-color: #c4c4c4 transparent; display: block; width: 0; } .r-tabs .r-tabs-nav .r-tabs-state-active .triangle-border:before { content: "" !Important; } .r-tabs .r-tabs-nav .r-tabs-state-active .triangle-border:after { content: "" !Important; } /*.r-tabs .r-tabs-nav .r-tabs-state-active .arrow { display: block !important; } */ #our-team .our-team-border { border: 1.8px solid #c4c4c4; } #our-team .our-team-border p { line-height: 32px; } #our-team .our-team-social { margin-top: 25px; } #our-team .our-team-social > li > a > i.fa { -webkit-transition: all 500ms linear; -moz-transition: all 500ms linear; -o-transition: all 500ms linear; transition: all 500ms linear; } #our-team .our-team-social > li > a > i.fa:hover, #our-team .our-team-social > li > a > i.fa:active { background: #f73246; color: #ffffff; } #our-team .our-team-social > li { display: inline-block; } #our-team .our-team-social > li > a > i.fa { -webkit-border-radius: 4px; border-radius: 4px; border: 1px solid #c4c4c4; line-height: normal; display: inline-block; text-align: center; padding: 10px 25px 10px 10px; } .progress { background: #ffffff; border: 1px solid #c4c4c4; -webkit-border-radius: 4px; border-radius: 4px; height: 40px; padding: 3px 0 3px 6px; margin: 10px 0 0 0; } .progress-bar { -webkit-transition: none !important; -moz-transition: none !important; -o-transition: none !important; transition: none !important; } .progress:first-child { margin: 0; } .progress-bar-custom { background: #f73246; font-size: 14px; -webkit-border-radius: 4px; border-radius: 4px; } .progress-bar-custom > span { display: block; position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%); text-align: left; margin-left: 10px; } /* Our team end */ /*Compay history start */ #company-history { background: url(../images/timeline.jpg) no-repeat fixed center; -o-background-size: cover; background-size: cover; } #company-history h2, #company-history p { color: #ffffff; } #company-history .company-p { margin-bottom: 40px; } #company-history .timline-year { background: #dddddd; width: 100px; height: 100px; margin: 0 auto; text-align: center; position: relative; clear: both; -webkit-border-radius: 50%; border-radius: 50%; } #company-history .timline-year h3 { position: relative; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); font-family: 'Open Sans', sans-serif; font-weight: 500; } /* ----------------------------------------------- * Timeline * --------------------------------------------- */ .timeline { list-style: none; padding: 10px 0; font-weight: 300; color: #ffffff; position: relative; } .timeline h3 { color: #ffffff; position: absolute; top: -10%; } .timeline:before { top: 0; bottom: 0; position: absolute; content: " "; width: 2px; background: #ffffff; left: 50%; margin-left: -1.5px; } .timeline > li { margin-bottom: 20px; position: relative; width: 50%; float: left; clear: left; -webkit-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; } .timeline > li:before, .timeline > li:after { content: " "; display: table; } .timeline > li:after { clear: both; } .timeline > li:before, .timeline > li:after { content: " "; display: table; } .timeline > li:after { clear: both; } .timeline > li > .timeline-panel { width: 90%; float: left; background: rgba(255, 255, 255, 0.1); position: relative; padding: 12px 40px; -webkit-border-radius: 5px; border-radius: 5px; -webkit-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; } .timeline > li:hover .timeline-panel { background: #f73246; border: none; } .timeline > li > .timeline-panel:after { position: absolute; top: 27px; right: -14px; display: inline-block; border-top: 14px solid transparent; border-left: 14px solid rgba(255, 255, 255, 0.1); border-right: 0 solid rgba(255, 255, 255, 0.1); border-bottom: 14px solid transparent; content: " "; -webkit-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; } .timeline > li:hover .timeline-panel:after { border-top-color: transparent; border-left-color: #f73246; border-right-color: #f73246; border-bottom-color: transparent; } .timeline > li > .timeline-badge { color: #ffffff; width: 24px; height: 24px; line-height: 50px; text-align: center; position: absolute; top: 16px; right: -12px; z-index: 100; } .timeline > li.timeline-inverted > .timeline-panel { float: right; } .timeline > li.timeline-inverted > .timeline-panel:after { border-left-width: 0; border-right-width: 14px; left: -14px; right: auto; } .timeline-badge > a { color: #b2b2b2; -webkit-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; } .timeline > li:hover .timeline-badge > a { color: #f73246; } .timeline > li > .timeline-panel:hover .timeline-badge > a { color: #f73246; } .timeline-title { margin-top: 0; color: inherit; } .timeline-heading h4 { font-size: 24px; font-weight: 400; color: #ffffff; } .timeline-body > p, .timeline-body > ul { margin-bottom: 0; } .timeline-body > p { padding: 14px 0; } .timeline-footer { padding: 0; color: rgba(255, 255, 255, 0.5); } .timeline-footer p { margin-bottom: 0; } .timeline-footer > a { cursor: pointer; text-decoration: none; } .timeline > li.timeline-inverted { float: right; clear: right; } .timeline > li:nth-child(2) { margin-top: 60px; } .timeline > li.timeline-inverted > .timeline-badge { left: -12px; } .no-float { float: none !important; } /*Compay history end */ /* portfolio start */ #portfolio #owl-demo .hovereffect { width: 100%; height: 100%; float: left; overflow: hidden; position: relative; text-align: center; cursor: default; } #portfolio #owl-demo .hovereffect .overlay { width: 100%; height: 100%; position: absolute; overflow: hidden; left: 0; background-color: rgba(217, 50, 67, 0.8); top: -200px; opacity: 0; filter: alpha(opacity=0); -webkit-transition: all 0.1s ease-out 0.5s; -o-transition: all 0.1s ease-out 0.5s; -moz-transition: all 0.1s ease-out 0.5s; transition: all 0.1s ease-out 0.5s; } #portfolio #owl-demo .hovereffect:hover .overlay { opacity: 1; filter: alpha(opacity=100); top: 0; -webkit-transition-delay: 0s; -o-transition-delay: 0s; -moz-transition-delay: 0s; transition-delay: 0s; } #portfolio #owl-demo .hovereffect img { display: block; position: relative; -webkit-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -moz-transition: all 0.2s ease-in; transition: all 0.2s ease-in; } #portfolio #owl-demo .hovereffect:hover a.info { -webkit-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); -moz-transform: translateY(0px); transform: translateY(0px); -webkit-transition-delay: 0.3s; -o-transition-delay: 0.3s; -moz-transition-delay: 0.3s; transition-delay: 0.3s; } #portfolio #owl-demo .item { margin: 3px; } #portfolio #owl-demo .item img { display: block; width: 100%; height: auto; } #portfolio #owl-demo .overlay .owl-captions { position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%); color: #ffffff; } #portfolio #owl-demo .overlay .owl-captions i { display: block; margin-bottom: 18px; } #portfolio #owl-demo .overlay .owl-captions i.fa { font-size: 32px; } #portfolio #owl-demo .overlay .owl-captions h3 { color: #ffffff; margin-bottom: 18px; } #portfolio .owl-theme .owl-controls .owl-buttons { background: #ffffff; } #portfolio .owl-theme .owl-controls .owl-page span { background-color: rgba(255, 255, 255, 0); border: 1px solid #222222; } #portfolio .owl-theme .owl-controls .owl-page.active span { background-color: #222222; } #portfolio #owl-demo .item { margin: 0; } /* portfolio end */ /*pricing table start */ #pricing-table .pricing-table { padding-top: 0; } .price { list-style-type: none; border: none; padding: 0; background: #6a6a6a; color: #ffffff; position: relative; width: 263px; margin: 0 auto; -webkit-transition: all 300ms linear; -moz-transition: all 300ms linear; -o-transition: all 300ms linear; transition: all 300ms linear; } .price.price-selected { background: #f73246; } .price.price-selected li { border-color: #ffffff; } .price:hover { background: #f73246; } .price::before { border-left: 131px solid #ffffff; border-right: 132px solid #ffffff; border-bottom: 65px solid #6a6a6a; display: inline-block; content: ""; -webkit-transition: all 300ms linear; -moz-transition: all 300ms linear; -o-transition: all 300ms linear; transition: all 300ms linear; } .price:hover::before { border-left: 131px solid #ffffff; border-right: 132px solid #ffffff; border-bottom: 65px solid #f73246; } .price.price-selected::before { border-left: 131px solid #ffffff; border-right: 132px solid #ffffff; border-bottom: 65px solid #f73246; } .price.price-selected .header { border: 1px solid #f73246; } .price:hover li { border-color: #ffffff; } /* Add shadows on hover */ .price .header { background-color: #ffffff; font-size: 46px; -webkit-border-radius: 50%; border-radius: 50%; padding: 16px 11px; display: inline-block; color: #1b1b1b; position: absolute; top: -30px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); -moz-transform: translateX(-50%); -webkit-transition: all 300ms linear; -moz-transition: all 300ms linear; -o-transition: all 300ms linear; transition: all 300ms linear; border: 1px solid #6a6a6a; } .price:hover .header, .price.price-selected .header { border: 1px solid #f73246; color: #f73246; } .price .btn.buttons { background: transparent; -webkit-border-radius: 0; border-radius: 0; border: 1px solid #ffffff; color: #ffffff; } .price .btn.buttons:before { background-color: #ffffff; } .price .btn.buttons:hover, .price .btn.buttons:focus, .price .btn.button:active { color: #1b1b1b; } /* List items */ .price li { border-bottom: 1px solid #7a7a7a; padding: 20px; text-align: center; -webkit-transition: all 300ms linear; -moz-transition: all 300ms linear; -o-transition: all 300ms linear; transition: all 300ms linear; } /* Grey list item */ .price .grey { text-transform: uppercase; } .price .grey span { display: block; font-family: 'Raleway', sans-serif; text-transform: uppercase; padding-left: 0; } .price .grey p:first-child { font-weight: 600; margin-bottom: 10px; } .price .grey p:nth-child(2) { font-size: 12px; font-weight: 300; margin-bottom: 30px; } /* The "Sign Up" button */ .button { border: none; color: white; padding: 10px 25px; text-align: center; text-decoration: none; font-size: 18px; } /*pricing table end */ /* Happy clients styling */ #happy-clients { background: url(../images/happy-clients.jpg) no-repeat fixed center; -o-background-size: cover; background-size: cover; color: #ffffff; } #happy-clients h2 { margin-bottom: 35px; } #happy-clients .client-img { height: 160px; width: 160px; margin: 0 auto 30px; } #happy-clients .client-img img { height: 100%; width: 100%; -webkit-border-radius: 50%; border-radius: 50%; } #happy-clients .p-margin { margin-bottom: 30px; } #happy-clients h5 { font-size: 14px; font-family: 'OpenSans', sans-serif; color: #f73246; font-weight: 700; margin-bottom: 10px; } #happy-clients .owl-theme .owl-controls .owl-page span { background-color: rgba(255, 255, 255, 0); border: 1px solid #ffffff; } #happy-clients .owl-controls .owl-page.active span { background-color: #f73246; } /* Happy clients styling End */ /* Blog styling start */ #blog-slider { padding-top: 20px; } #blog-slider .item { border: 1px solid #c8c8c8; padding-bottom: 1px; } #blog-slider .item img { display: block; width: 100%; height: 100%; -webkit-transition: all 300ms linear; -o-transition: all 300ms linear; -moz-transition: all 300ms linear; transition: all 300ms linear; } #blog-slider .blog-img { border-bottom: 12px solid #f73246; height: 241px; position: relative; z-index: 3; overflow: hidden; } #blog-slider .item:hover img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); -moz-transform: scale(1.1); transform: scale(1.1); } #blog-slider .blog-img i { color: #ffffff; font-size: 15px; padding: 14px; background: #f73246; -webkit-border-radius: 50%; border-radius: 50%; position: absolute; right: 7px; bottom: -11px; display: inline-block; z-index: 1; } #blog-slider h3 { margin-bottom: 10px; } #blog-slider .item:hover h3 { color: #f73246; -webkit-transition: all 300ms linear; -o-transition: all 300ms linear; -moz-transition: all 300ms linear; transition: all 300ms linear; } #blog-slider .blog-slider-descp p:nth-child(2) { margin-bottom: 14px; } #blog-slider .blog-slider-descp p:nth-child(2) > span { color: #f73246; } #blog-slider .blog-slider-descp p:nth-child(3) { line-height: 30px; margin-bottom: 14px; } #blog-slider .blog-slider-descp p:last-child { font-weight: 700; font-family: 'Raleway', sans-serif; } #blog-slider .item:hover p:last-child { color: #f73246; -webkit-transition: all 300ms linear; -o-transition: all 300ms linear; -moz-transition: all 300ms linear; transition: all 300ms linear; } #blog-slider .blog-border { border-bottom: 1px solid #c8c8c8; padding-bottom: 1px; } #blog-slider .blog-slider-descp { padding: 25px 20px; background-color: #ffffff; border-bottom: 1px solid #c8c8c8; } #blog-slider .owl-theme .owl-controls .owl-page span { background-color: rgba(255, 255, 255, 0); border: 1px solid #303030; } #blog-slider .owl-controls .owl-page.active span { background-color: #f73246; } #blog-text { background: url(../images/blog-text.jpg) no-repeat no-repeat fixed center; -o-background-size: cover; background-size: cover; color: #ffffff; } #blog-text h2 { color: #f73246; font-size: 100px; } #blog-text p { margin-bottom: 20px; margin-left: 20%; margin-right: 20%; } #blog-text p span { color: #f73246; } #blog-text #blog-text-slider.owl-theme .owl-controls .owl-page span { background-color: rgba(255, 255, 255, 0); border: 1px solid #ffffff; } #blog-text #blog-text-slider .owl-controls .owl-page.active span { background-color: #f73246; } /* Inner Pages Top*/ /* Blog styling end */ /* contact us styling start */ .form-control { -webkit-border-radius: 0; border-radius: 0; border-color: #c8c8c8; /* padding-top: 20px; padding-bottom: 20px;*/ padding-top: 2px; padding-bottom: 2px; width: 100%; } form .buttons { background: transparent; position: relative; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); -moz-transform: translateX(-50%); transform: translateX(-50%); border: 2px solid #f73246; color: #f73246; margin-top: 25px; } form .buttons:hover, form .buttons:active { background: transparent; border-color: #f73246; } form .buttons:before { background: #f73246; } form textarea.form-control { resize: none; margin-top: 16px; min-height: 200px; } /*map styling start */ #map { display: block; width: 100%; height: 600px; } .pin { width: 32px; height: 32px; -webkit-border-radius: 50% 50% 50% 0; border-radius: 50% 50% 50% 0; background: #f73246; position: absolute; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); left: 50%; top: 50%; margin: -20px 0 0 -20px; } .pin:after { content: ""; width: 14px; height: 14px; margin: 9px 0 0 9px; background: #e6e6e6; position: absolute; -webkit-border-radius: 50%; border-radius: 50%; } .bounce { -webkit-animation-name: bounce; -moz-animation-name: bounce; -o-animation-name: bounce; animation-name: bounce; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-duration: 1s; -moz-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; } @-webkit-keyframes bounce { 0% { opacity: 0; -webkit-transform: translateY(-2000px) rotate(-45deg); -moz-transform: translateY(-2000px) rotate(-45deg); -o-transform: translateY(-2000px) rotate(-45deg); transform: translateY(-2000px) rotate(-45deg); } 60% { opacity: 1; -webkit-transform: translateY(30px) rotate(-45deg); -moz-transform: translateY(30px) rotate(-45deg); -o-transform: translateY(30px) rotate(-45deg); transform: translateY(30px) rotate(-45deg); } 80% { -webkit-transform: translateY(-10px) rotate(-45deg); -moz-transform: translateY(-10px) rotate(-45deg); -o-transform: translateY(-10px) rotate(-45deg); transform: translateY(-10px) rotate(-45deg); } 100% { -webkit-transform: translateY(0) rotate(-45deg); -moz-transform: translateY(0) rotate(-45deg); -o-transform: translateY(0) rotate(-45deg); transform: translateY(0) rotate(-45deg); } } @-moz-keyframes bounce { 0% { opacity: 0; -webkit-transform: translateY(-2000px) rotate(-45deg); -moz-transform: translateY(-2000px) rotate(-45deg); -o-transform: translateY(-2000px) rotate(-45deg); transform: translateY(-2000px) rotate(-45deg); } 60% { opacity: 1; -webkit-transform: translateY(30px) rotate(-45deg); -moz-transform: translateY(30px) rotate(-45deg); -o-transform: translateY(30px) rotate(-45deg); transform: translateY(30px) rotate(-45deg); } 80% { -webkit-transform: translateY(-10px) rotate(-45deg); -moz-transform: translateY(-10px) rotate(-45deg); -o-transform: translateY(-10px) rotate(-45deg); transform: translateY(-10px) rotate(-45deg); } 100% { -webkit-transform: translateY(0) rotate(-45deg); -moz-transform: translateY(0) rotate(-45deg); -o-transform: translateY(0) rotate(-45deg); transform: translateY(0) rotate(-45deg); } } @-o-keyframes bounce { 0% { opacity: 0; -webkit-transform: translateY(-2000px) rotate(-45deg); -moz-transform: translateY(-2000px) rotate(-45deg); -o-transform: translateY(-2000px) rotate(-45deg); transform: translateY(-2000px) rotate(-45deg); } 60% { opacity: 1; -webkit-transform: translateY(30px) rotate(-45deg); -moz-transform: translateY(30px) rotate(-45deg); -o-transform: translateY(30px) rotate(-45deg); transform: translateY(30px) rotate(-45deg); } 80% { -webkit-transform: translateY(-10px) rotate(-45deg); -moz-transform: translateY(-10px) rotate(-45deg); -o-transform: translateY(-10px) rotate(-45deg); transform: translateY(-10px) rotate(-45deg); } 100% { -webkit-transform: translateY(0) rotate(-45deg); -moz-transform: translateY(0) rotate(-45deg); -o-transform: translateY(0) rotate(-45deg); transform: translateY(0) rotate(-45deg); } } @keyframes bounce { 0% { opacity: 0; -webkit-transform: translateY(-2000px) rotate(-45deg); -moz-transform: translateY(-2000px) rotate(-45deg); -o-transform: translateY(-2000px) rotate(-45deg); transform: translateY(-2000px) rotate(-45deg); } 60% { opacity: 1; -webkit-transform: translateY(30px) rotate(-45deg); -moz-transform: translateY(30px) rotate(-45deg); -o-transform: translateY(30px) rotate(-45deg); transform: translateY(30px) rotate(-45deg); } 80% { -webkit-transform: translateY(-10px) rotate(-45deg); -moz-transform: translateY(-10px) rotate(-45deg); -o-transform: translateY(-10px) rotate(-45deg); transform: translateY(-10px) rotate(-45deg); } 100% { -webkit-transform: translateY(0) rotate(-45deg); -moz-transform: translateY(0) rotate(-45deg); -o-transform: translateY(0) rotate(-45deg); transform: translateY(0) rotate(-45deg); } } /*contact-address */ #contact-address { color: #222222; } .address-details h2 { -webkit-transition: all 500ms linear; -moz-transition: all 500ms linear; -o-transition: all 500ms linear; transition: all 500ms linear } .address-details p { font-size: 18px; -webkit-transition: all 500ms linear; -moz-transition: all 500ms linear; -o-transition: all 500ms linear; transition: all 500ms linear } .address-details:hover h2 { color: #f73246; } .address-details:hover p { color: #f73246; } /* contact us styling end */ /*=========================================*/ /* Blog WIth All Versions*/ /*=========================================*/ .blog-wrap { background-color: #fff; width: 100%; position: relative; overflow: hidden; } .blog-wrap .blog-content { display: table-cell; padding: 6.5em 0; } .blog-content-bg { background-color: #fff; margin: 0 auto; padding: 30px 30px 5px; position: relative; top: -60px; width: 95%; } .blog-item-v3 { border-bottom: 1px solid #d1d2d2; padding-bottom: 70px; margin-bottom: 70px; } .blog-item-v3 > img { margin-bottom: 35px; } .blog-item-v3 .blog-content { padding: 0; } .no-margin { margin: 0; border: none; } #area-main h3 { color: #1b1d1f; } #area-main p { color: #1b1d1f; margin-bottom: 10px; } #area-main .buttons { background: #f73246; color: #fff; } #area-main .buttons:before { background: #1b1d1f;; } #area-main a.readmore { color: #fff; padding: 10px 35px; background: #1b1d1f; border: 1px solid transparent; display: inline-block; text-decoration: none; margin-top: 20px; } #area-main a.readmore:hover, #area-main a.readmore:focus { border: 1px solid #f73246; } #area-main ul.blog-author { margin: 20px 0 25px; } #area-main ul.blog-author li { display: inline-block; } #area-main ul.blog-author li a { color: #696969; font-size: 14px; margin-right: 15px; } #area-main ul.blog-author li a .fa { margin-right: 5px; } #area-main ul.blog-author li a:hover, #area-main ul.blog-author li a:focus { color: #f73246; } .morepost-wrap { margin-top: 75px; border-top: 1px solid #d1d2d2; } .morepost-wrap2 { border-top: 1px solid #d1d2d2; border-bottom: 1px solid #d1d2d2; padding-bottom: 25px; } .morepost-wrap a:hover, .morepost-wrap2 a:hover { color: #f73246; } .morepost-wrap .morepost, .morepost-wrap2 .morepost { font-size: 16px; color: #696969; margin-top: 25px; display: inline-block; position: relative; } .morepost-wrap2 .morepost .fa-long-arrow-left, .morepost-wrap .morepost .fa-long-arrow-left { right: 0; } .morepost-wrap2 .morepost:hover .fa-long-arrow-left, .morepost-wrap .morepost:hover .fa-long-arrow-left { opacity: 1 !important; filter: alpha(opacity=100); color: #f73246; right: 100%; } .morepost-wrap2 .morepost .fa-long-arrow-left, .morepost-wrap2 .morepost .fa-long-arrow-right, .morepost-wrap .morepost .fa-long-arrow-left, .morepost-wrap .morepost .fa-long-arrow-right { color: transparent; position: absolute; text-shadow: 0 0 transparent; top: 25%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; opacity: 0 !important; filter: alpha(opacity=0); } .morepost-wrap2 .morepost .fa-long-arrow-right, .morepost-wrap .morepost .fa-long-arrow-right { left: 0; margin-left: 5px; } .morepost-wrap2 .morepost:hover .fa-long-arrow-right, .morepost-wrap .morepost:hover .fa-long-arrow-right { opacity: 1 !important; filter: alpha(opacity=100); color: #f73246; left: 110%; } .blog-content-pic img { width: 100%; } .blog-item .blog-content { padding: 0; margin: 35px 0; } .blog-item .blog-content p { margin-bottom: 25px; } .blog-item blockquote { color: #f73246; } .blog-item .post-tag { border: 1px solid #d9d9d9; padding: 5px; margin-bottom: 70px; } #area-main .tag-cloud li { display: inline-block; margin: 6px; } #area-main .tag-cloud li a { display: block; } #area-main .tag-cloud li a, .blog-reply a.btn-rep { background: #efefef; color: #1b1d1f; font-size: 12px; padding: 8px 15px; text-transform: uppercase; } #area-main .tag-cloud li a:hover, #area-main .tag-cloud li a:focus, .blog-reply a.btn-rep:hover, .blog-reply a.btn-rep:focus { background: #f73246; color: #fff; -webkit-transition: all 500ms linear; -moz-transition: all 500ms linear; -o-transition: all 500ms linear; transition: all 500ms linear; } .social-link li { display: inline-block; } .social-link li a { width: 44px; height: 44px; display: block; border: 1px solid #1b1d1f; -webkit-border-radius: 50%; border-radius: 50%; color: #1b1d1f; -webkit-transition: all 500ms linear; -moz-transition: all 500ms linear; -o-transition: all 500ms linear; transition: all 500ms linear; } .social-link li a:hover { border-color: #f73246; background: #f73246; color: #fff; } .social-link li a i { line-height: 42px; font-size: 20px; } .blog-reply { padding: 10px; border: 1px solid #f3f3f3; position: relative; margin: 20px 0; } .blog-reply h4 { color: #1b1d1f; margin-bottom: 8px; text-transform: capitalize; } .blog-reply a.btn-rep { position: absolute; top: 0; right: 0; } .blog-item .post-comment h3 { margin-bottom: 35px; margin-top: 70px; } .blog-item .post-comment form .form-control, .contact form .form-control { height: 50px; } .blog-item .post-comment form .form-control, .contact form .form-control, .blog-item .post-comment form textarea, .contact form textarea, .index_3 .form-inline .form-control, .index_3 .form-inline textarea { padding: 15px; font-size: 14px; color: #4c4c4c; border: 1px solid #d0d0d0; width: 100%; -webkit-border-radius: 0; border-radius: 0; } .blog-item .post-comment form textarea, .contact form textarea { margin: 30px 0; min-height: 210px; } .blog-item .post-comment form input[type="submit"], .contact form input[type="submit"] { background: #f73246; border: 1px solid transparent; font-weight: bold; color: #fff; height: 50px; width: 185px; position: relative; -webkit-transition: all 300ms linear; -moz-transition: all 300ms linear; -o-transition: all 300ms linear; transition: all 300ms linear; } .blog-item .post-comment form input[type="submit"]:hover, .contact form input[type="submit"]:hover { background: #1b1d1f; } .widget { margin-bottom: 40px; color: #1b1d1f; } .widget h4, .widget img { margin-bottom: 25px; } .widget > img { width: 100%; } .search_box input { border: 1px solid #d9d9d9; height: 53px; padding-left: 15px; position: relative; width: 100%; font-size: 14px; } .search_box i { border-left: 1px solid #d9d9d9; bottom: 0; color: #d9d9d9; font-size: 24px; height: 53px; padding: 15px; position: absolute; right: 15px; top: 0; cursor: pointer; } ul.category li { margin-top: 15px; display: block; } ul.category li a { color: #1b1d1f; font-size: 16px; border-bottom: 1px solid #d9d9d9; padding-bottom: 15px; display: block; text-transform: capitalize !important; } ul.category li a:hover, ul.category li a:focus { color: #f73246; } ul.category li a .date { color: #f73246; font-size: 12px; display: block; } .innerpage-banner { background: url(../images/blog-banner.jpg) no-repeat center center / cover; padding-top: 200px; max-height: 440px; color: #1b1d1f; } .innerpage-banner h2 { margin-bottom: 0; } .tagline { color: #1b1d1f; text-transform: uppercase; font-size: 14px; } /*=========================================*/ /* Blog Ends */ /*=========================================*/ /*footer stylin start */ footer { background-color: #f73246; color: #ffffff; padding: 20px 0; } footer p { line-height: 30px; } footer ul, footer li, footer a { padding: 0; margin: 0; } footer ul > li > a { padding: 7px 5px; border: 1px solid #ffffff; -webkit-border-radius: 50%; border-radius: 50%; -webkit-transition: all 500ms linear; -o-transition: all 500ms linear; -moz-transition: all 500ms linear; transition: all 500ms linear; } footer ul > li > a:hover { background-color: #1b1b1b; border-color: #1b1b1b; } /*footer stylin end */ /*media query */ @media screen and (max-width: 1199px) { .margin-100-bottom { margin-bottom: 50px; } /*what we do */ #what-we-do #mobile-img { display: block; width: 280px; height: 500px; margin-left: auto; margin-right: auto; margin-top: 53px; } #what-we-do #mobile-slider { top: 69px; left: 40px; width: 206px; height: 357px; } #what-we-do .info #what-we-do #mobile-slider .item img { display: block; cursor: move; height: 357px; } #what-we-do #mobile-img { width: 230px; height: 350px; } #what-we-do #mobile-slider { top: 48px; left: 33px; width: 170px; } #what-we-do #mobile-slider .item img { height: 255px; width: 100%; } #what-we-do .what-we-do-features > h3 { font-size: 18px; line-height: 53px; margin-bottom: 10px; } #what-we-do .what-we-do-features h3 > span { width: 45px; height: 45px; margin-right: 15px; } #what-we-do .what-we-do-features h3.text-right > span { margin-left: 15px; } #what-we-do .what-we-do-features h3 > span > i { line-height: 45px; } #what-we-do .what-we-do-features p { font-size: 13px; line-height: normal; } /*what we do end */ /*our team */ #our-team-tabs li:nth-child(3), #our-team-tabs > li:nth-child(4) { margin-top: 60px; } #our-team .hovereffect img { width: 100%; } /* our team end */ /* pricing table styling start */ .price.price-4 { margin-top: 60px; } #happy-clients .client-img { width: 120px; height: 120px; } /* pricing table styling end */ } @media screen and (max-width: 991px) { /*navbar start */ .navbar .navbar-nav > li a { font-size: 12px; } .side-menu-button{ right:-3px;; } /*navbar end */ /* pricing table */ .price.price-3 { margin-top: 60px; } /* pricing table end */ /*what we do start */ #what-we-do #mobile-img { margin-top: 105px; } /*what we do end */ /*counter start */ #counters #counter-main .counter-margin-3, #counters #counter-main .counter-margin-4 { margin-top: 40px; } /*counter end */ /*Our team start */ #our-team .hovereffect h3 { font-size: 22px; } #our-team .hovereffect p { font-size: 13px; } #our-team .hovereffect img { width: 100%; } .triangle-border.top:before { left: 43%; } /*Our team end */ } @media screen and (max-width: 767px) { .tparrows { display: none; } .forcefullwidth_wrapper_tp_banner, #slider1 { height: 400px !Important; overflow: hidden; } p { font-size: 13px !important; } h2 { font-size: 30px; margin-bottom: 20px; } hr { margin-bottom: 20px; } h3 { font-size: 20px !important; } .buttons { padding: 11px 34px; } .margin-60-top { margin-top: 30px; } /*nav */ .navbar-header { padding-bottom: 12px; } .navbar-header > .navbar-brand { padding-top: 11px; padding-bottom: 10px; } .navbar-brand > img, .shrink .navbar-brand > img { width: 105px; } .shrink .side-menu-button, .side-menu-button { top: 15px; right: 4px; } .sidenav ul > li a { font-size: 30px; } /*nav */ /* what we do start */ .margin-100-top { margin-top: 50px; } #what-we-do .what-we-do-features { text-align: center; } #what-we-do #mobile-img { margin-top: 0; } #what-we-do #device { margin-top: 50px; margin-bottom: 50px; } #what-we-do .what-we-do-features h3 { line-height: normal; } #what-we-do .what-we-do-features h3.text-right { text-align: center; } #what-we-do .what-we-do-features h3.text-right > span.pull-right { float: none !important; } #what-we-do .what-we-do-features h3 > span { display: block; margin-left: auto; margin-right: auto; margin-bottom: 10px; } #what-we-do .what-we-do-features h3.text-right > span { margin-left: auto; margin-right: auto; } #what-we-do .what-we-do-features p.text-right { text-align: center; } /* what we do end */ /*counter start */ #counters #counter-main .counter-margin-2 { margin-top: 40px; } #counters .numscroller { font-size: 25px; } #counters .icons { height: 80px; width: 80px; } #counters .icons > i { font-size: 32px; line-height: 80px; } /*counter end */ /*our team */ #our-team .hovereffect img { width: 100%; } #tab-1 > .margin-60-top, #tab-2 > .margin-60-top, #tab-3 > .margin-60-top, #tab-4 > .margin-60-top { margin-top: 11px; } .r-tabs .r-tabs-nav .r-tabs-state-active img { -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none; } #our-team .hovereffect p { display: none; } #our-team .hovereffect h3 { font-size: 16px !important; } #our-team .hovereffect:hover img { -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none; } #our-team .progess-bars { margin-top: 30px !important; } #our-team .hovereffect .overlay { height: auto !important; position: static; padding: 6px; } .triangle-border.top:before { border-width: 0; } .triangle-border.top::after { border-width: 0; height: 31px; width: 2px; background: #c4c4c4; left: 50%; bottom: -26px; } #our-team .our-team-social { text-align: center; } /* our team end */ /*company history start */ ul.timeline:before { left: 40px; } ul.timeline > li { margin-bottom: 0; position: relative; width: 100%; float: left; clear: left; } ul.timeline > li > .timeline-panel { width: 83%; } ul.timeline > li > .timeline-badge { left: 28px; margin-left: 0; top: 16px; } ul.timeline > li > .timeline-panel { float: right; } ul.timeline > li > .timeline-panel:before { border-left-width: 0; border-right-width: 15px; left: -15px; right: auto; } .timeline > li > .timeline-panel:after { border-left-width: 0; border-right-width: 14px; left: -14px; right: auto; } .timeline > li.timeline-inverted { float: left; clear: left; margin-top: 30px; margin-bottom: 30px; } .timeline > li.timeline-inverted > .timeline-badge { left: 28px; } #company-history .timline-year { margin: -10px; background: transparent; color: #fff; } /*company history end */ /* pricing table */ .price.price-2 { margin-top: 60px; } #pricing-table .tables.margin-60-top { margin-top: 60px; } /* pricing table end*/ /*blog start */ #happy-clients .client-img { width: 100px; height: 100px; } #blog-text h2 { font-size: 60px; } #area-main .blog-item { padding-bottom: 60px; } /*blog end */ /* contact us */ .address-details:nth-child(2), .address-details:nth-child(3) { margin-top: 30px; } .address-details h2 { margin-bottom: 10px; } /* contact us end */ /* map setting */ #map { height: 300px; } /* map setting */ /*footer */ footer .col-sm-6 { text-align: center; float: none !important; margin-left: auto !important; margin-right: auto !important; } footer .pull-right { float: none !important; margin-left: auto; margin-right: auto; margin-top: 10px; } /*footer */ } @media screen and (max-width: 480px) { /* slider styling start */ #slider1 .slider-button{ font-size: 7px !important; line-height: normal !important; } #slider1 .slider-button.red{ margin-left: 15px !important; } /* slider styling end */ /* what we do */ #what-we-do #device { overflow: hidden; } #what-we-do #mobile-img { width: 280px; height: 500px; } #what-we-do #mobile-slider { top: 69px; left: 40px; width: 206px; } #what-we-do #mobile-slider .item img { display: block; cursor: move; height: 357px; } /* what we do */ /* our team */ #our-team .hovereffect h3 { font-size: 8px !Important; } /* our team */ /* timeline start */ ul.timeline > li > .timeline-panel { width: 78%; } /* timeline end */ }