/* Theme Name: Atlantaa Theme URI: Author: fokatdeal Author URI: https://www.mindstick.com/ Description: atlantaa is a unique, clean and professional-looking WordPress theme. This theme is customizable to change various elements through customizer and through dashboard which give full control over its look and appearance. This is included with touch slider, about section, service section and blog section,portfolio on the homepage. It is based on Bootstrap Framework, and comes with fontawesome icons to make your website stunning and creative. Version: 2.5 License: GNU General Public License v2.0 or later License URI: http://www.gnu.org/licenses/gpl.html/ Text Domain: atlantaa Tags: custom-logo, custom-menu, featured-images, threaded-comments, translation-ready */ /*==================================================== [Table of contents] 1. TYPOGRAPHY 1.1. BUTTONS 2. SHORTCODES 3. GLOBAL CSS 4. PRELOADER 5. HEADER 5.1. MAIN NAV 5.2. MOBILE NAV(offcanvas) 5.3. HEADER VARAITONS 6. SECTION HEADER 7. SIMPLE SLIDER 8. ADVANCED SLIDER 9. SERVICES 9.1. SERVICES VARAITONS 10. ABOUT US(tabbed) 10.1. ABOUT US VARAITONS 11. PORTFOLIO 11.1. PORTFOLIO VARAITONS 12. IMAGE WITH CONTENT 13. CALL TO ACTION 14. GOTO TOP 15. PAGE TITLE 16. POPULAR ARTICLES 17. CATEGORIES ARTICLES 18. TAG CLOUDS 19. SINGLE POST(Article) 33.1. SINGLE POSTS VARAITONS 20. PAGINATION 21. SIDEBAR 22. BLOG DETAILS 37.1. AUTHOR-INFO 37.2. RELATED-POST 37.3. COMMENTS-BOX 37.4. COMMENT-FORM 23. FOOTER =========================================*/ body,h1,h2,h3,h4,h5,h6,.ft-fm-1{ font-family: 'Montserrat', sans-serif; } p,.ft-fm-2,.single-p-post .info{ font-family: 'Roboto', sans-serif; } ul, li,ol { list-style: none; padding: 0; margin: 0; } html{ text-rendering: optimizeLegibility !important; -webkit-font-smoothing: antialiased !important; -moz-osx-font-smoothing: grayscale !important. } body{ background-color: #fff; font-size: 14px; color: #8c8c8c; font-weight: 400; } ::selection{ color: #fff; } ::-moz-selection{ color: #fff; } ul, ol{ margin: 0; padding: 0; } li{ list-style: none; } ul.list-inline{ margin-left: 0; } h1,h2,h3,h4,h5,h6,p{ margin: 0; -webkit-transition: color .3s; transition: color .3s; } h2{ font-size: 36px; } h3{ font-size: 24px; } h4{ font-size: 20px; } h5{ font-size: 17px; } p{ font-size: 16px; line-height: 1.71; color: #8c8c8c; } a{ color: #8c8c8c; -webkit-transition: background .3s, color .3s, opacity .3s; transition: background .3s, color .3s, opacity .3s; } .logos a{ font-size: 18px; font-weight: 700; color: #04bffe; line-height:30px; } .logos{ padding: 22px 0; } .logos.img-logos{ padding: 22px 0; } a:hover, a:active{ outline: none; text-decoration: none; } /*menu*/ .main-navigation { clear: both; display: block; float: left; width: 100%; } .main-navigation ul { display: none; list-style: none; margin: 0; padding-left: 0; } .main-navigation ul ul { box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2); float: left; position: absolute; background: #fff; top: 100%; left: -999em; z-index: 99999; } .main-navigation ul ul ul { left: -999em; top: 0; } .main-navigation ul ul li:hover > ul, .main-navigation ul ul li.focus > ul { left: 100%; } .main-navigation ul ul a { width: 251px; line-height: 35px; } .main-navigation ul li:hover > ul, .main-navigation ul li.focus > ul { left: auto; } .main-navigation li { float: left; position: relative; } .main-navigation a { display: block; text-decoration: none; font-weight: 300; color: #8c8c8c; text-transform: uppercase; padding: 0 14px; } /* Small menu. */ .menu-toggle, .main-navigation.toggled ul { display: block; } @media screen and (min-width: 993px) { .menu-toggle { display: none; } .main-navigation ul { display: block; } .main-navigation .menu-all-pages-container{ margin-top: 40px; } } @media screen and (max-width: 993px) { .main-navigation .menu-toggle{ margin-top: 50px; float: right; background-color: black; border: none; } .main-navigation.toggled ul{ display: grid; } .main-navigation .menu-all-pages-container{ margin-top: 100px; } .main-navigation .menu-all-pages-container .nav-menu{ margin-left: -160px; background: #eaeaea; } .main-navigation .menu-all-pages-container .nav-menu li a{ padding-top: 10px; padding-bottom: 10px; } .main-navigation .menu-all-pages-container .nav-menu li{ border-bottom: 1px solid #e0e0e0; } .main-navigation .menu-toggle:focus{ outline: 1px solid #04bffe; } } .btn{ border: none; line-height: 40px; padding: 0 25px; font-weight: 500; font-size: 12px; background-color: #fff; -webkit-transition: .3s; transition: .3s; -webkit-box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.16); box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.16); } .btn:hover, .btn:focus, .btn:active{ outline: none; opacity: 1; background-color: #fff; } .btn:active{ -webkit-box-shadow: none; box-shadow: none; } .btn.btn-primary:hover, .btn.btn-primary:focus{ color: #fff; -webkit-box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.16); box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.16); } .btn.btn-default:hover, .btn.btn-default:focus{ background-color: #fff; -webkit-box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.16); box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.16); } .btn.btn-primary{ padding: 0 30px; color: #fff; } .btn.btn-info { border: 2px solid #e0e0e0; background: none; box-shadow: none; color: #666666; font-size: 14px; font-weight: 400; line-height: 36px; padding: 0 15px; } .btn.btn-info:hover, .btn.btn-info:focus{ color: #fff; } .btn.btn-border{ border: 1px solid; font-size: 14px; } .btn.btn-link, .btn.btn-link:hover, .btn.btn-link:focus{ color: #8c8c8c; padding: 0; border: none; -webkit-box-shadow: none; box-shadow: none; background: none; text-decoration: none; } .btn.btn-link.btn-lg, .btn.btn-link.btn-xlg{ font-size: 16px; padding: 0; } .btn.btn-link:hover, .btn.btn-link:focus{ opacity: .7; } .btn.btn-border:hover, .btn.btn-border:focus{ color: #fff; } .btn.btn-warning, .btn.btn-warning:hover, .btn.btn-warning:focus{ background-color: #4481eb; color: #fff; -webkit-box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.16); box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.16); } .btn.btn-danger, .btn.btn-danger:hover, .btn.btn-danger:focus{ background-color: #ef5350; color: #fff; -webkit-box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.16); box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.16); } .btn.btn-success, .btn.btn-success:hover, .btn.btn-success:focus{ background-color: #7cb342; color: #fff; -webkit-box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.16); box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.16); } .btn.btn-lg { line-height: 45px; padding: 0 35px; font-size: 14px; } .btn.btn-xlg { line-height: 55px; padding: 0 35px; font-size: 16px; } .btn.btn-sm { line-height: 32px; } .btn-no-shadow{ -webkit-box-shadow: none; box-shadow: none; } .btn-primary.disabled{ -webkit-transition: .3s; transition: .3s; } .btn-primary.disabled.focus, .btn-primary.disabled:hover{ color: #fff; } button.btn{ position: relative; } button:hover, button:focus{ outline: none; } input:hover, input:active, textarea:hover, textarea:active{ outline: none; } input,textarea{ border: none; border-bottom: 2px solid #e0e0e0; line-height: 40px; font-size: 16px; } section{ overflow: hidden; position: relative; background-position: center center; -webkit-background-size: cover; background-size: cover; } .text-left{ text-align: left !important; } /*----- End of Typography ------*/ .white{ color:#eaeaea; } /*================================== = SHORTCODES = ==================================*/ .img-res{width: 100%; } .overflow-hid{ overflow: hidden; } .overflow-vis{ overflow: visible; } .p-0{ padding:0 !important; } .p-t-0{ padding-top: 0 !important; } .p-b-0{ padding-bottom: 0 !important; } .m-0{ margin:0 !important; } .m-t-0{ margin-top:0 !important; } .m-b-0{ margin-bottom:0 !important; } .text-color-white{ color: #fff; } .ft-wt-thin{ font-weight: 100; } .ft-wt-light{ font-weight: 300; } .ft-wt-regular{ font-weight: 400; } .ft-wt-medium{ font-weight: 500; } .ft-wt-bold{ font-weight: 700; } .ft-wt-ut-bold{ font-weight: 900; } .relative{ position: relative; } .display-inb{ display: inline-block; } .display-b{ display: block; } /*Major bg Color*/ .has-bg *, .bgcolor-major-gradient *, .bgcolor-major-gradient .section-title, .bgcolor-major-gradient .section-subtitle, .bgcolor-major *, .bgcolor-major .section-title, .bgcolor-major .section-subtitle{ color: #fff; } .has-bg .section-title span:before, .bgcolor-major-gradient .section-title span:before, .bgcolor-major .section-title span:before{ background-color: #fff; } .has-bg ::selection, .bgcolor-major-gradient ::selection, .bgcolor-major ::selection{ background: rgba(0,0,0,.3); color: #fff; } .has-bg ::-moz-selection, .bgcolor-major-gradient ::-moz-selection, .bgcolor-major ::-moz-selection{ background: rgba(0,0,0,.3); color: #fff; } .logos h1{ margin-top: 18px; } @media(max-width:992px){ .logos h1{ margin-top: 8px; } } @media(max-width:768px){ .logos h1{ margin-top: 11px; } } .footer-logo.bgcolor-major-gradient{ background: none; } .bgcolor-major-gradient-overlay, .bgcolor-major-overlay{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10; -webkit-transition: .3s; transition: .3s; } .bg-color-text{ color: #fff !important; } .bgcolor-major-overlay{ background-color: rgba(251,56,95,.9); opacity: 0; } .single-post-v2:hover .bgcolor-major-overlay{ opacity: 1; } a.btn{ z-index: 10; } footer.bgcolor-gray, .bgcolor-gray{ background-color: #f5f5f5; } footer.bgcolor-white, .bgcolor-white{ background-color: #fff; padding: 30px 15px 0 15px; margin: 0 15px; } .bg-gradient-dark{ background-color: #232732; -webkit-background-size: cover; background-size: cover; background-position: center center; color: #fff; } .bg-gradient-dark .section-title{ color: #fff; } .bg-gradient-dark .section-header .section-subtitle { color: #bfbfbf; } .bg-gradient-dark:after{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; background-image: -moz-linear-gradient( 135deg, rgba(34, 39, 51, 0.88) 0%, rgba(34, 40, 52, 0.88) 100%); background-image:-webkit-linear-gradient( 135deg, rgba(34, 39, 51, 0.88) 0%, rgba(34, 40, 52, 0.88) 100%); background-image: -o-linear-gradient( 135deg, rgba(34, 39, 51, 0.88) 0%, rgba(34, 40, 52, 0.88) 100%); background-image: -ms-linear-gradient( 135deg, rgba(34, 39, 51, 0.88) 0%, rgba(34, 40, 52, 0.88) 100%); background-image: linear-gradient( 135deg, rgba(34, 39, 51, 0.88) 0%, rgba(34, 40, 52, 0.88) 100%); } .bg-gradient-dark .container{ position: relative; z-index: 10; } .social-page a{ color:#fff; } /*Bootstrap Grid clear-problem*/ .clear-problem >div:nth-child(3n+1) { clear: left; } .hidden{ display: none; } .visible{ display: block; } .hori-vert-center{ position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .m-b-10{margin-bottom: 10px;} .m-b-20{margin-bottom: 20px;} .m-b-30{margin-bottom: 30px;} .m-b-35{margin-bottom: 35px;} .m-b-40{margin-bottom: 40px;} .m-b-50{margin-bottom: 50px;} .m-b-60{margin-bottom: 60px;} .m-b-70{margin-bottom: 70px;} .m-b-80{margin-bottom: 80px;} .m-b-90{margin-bottom: 90px;} .m-b-100{margin-bottom: 100px;} .m-b-110{margin-bottom: 110px;} .m-b-120{margin-bottom: 120px;} .m-b-130{margin-bottom: 130px;} .m-b-140{margin-bottom: 140px;} .m-b-150{margin-bottom: 150px;} .m-b-200{margin-bottom: 200px;} .m-t-10{margin-top: 10px;} .m-t-20{margin-top: 20px;} .m-t-30{margin-top: 30px;} .m-t-40{margin-top: 40px;} .m-t-50{margin-top: 50px;} .m-t-60{margin-top: 60px;} .m-t-70{margin-top: 70px;} .m-t-80{margin-top: 80px;} .m-t-90{margin-top: 90px;} .m-t-100{margin-top: 100px;} .m-t-110{margin-top: 110px;} .m-t-120{margin-top: 120px;} .m-t-130{margin-top: 130px;} .m-t-140{margin-top: 140px;} .m-t-140{margin-top: 140px;} .m-t-150{margin-top: 150px;} .m-t-200{margin-top: 200px;} .m-r-30{margin-right: 30px;} .m-r-5{margin-right: 5px;} .p-b-10{padding-bottom: 10px;} .p-b-20{padding-bottom: 20px;} .p-b-30{padding-bottom: 30px;} .p-b-40{padding-bottom: 40px;} .p-b-50{padding-bottom: 50px;} .p-b-60{padding-bottom: 60px;} .p-b-70{padding-bottom: 70px;} .p-b-80{padding-bottom: 80px;} .p-b-90{padding-bottom: 90px;} .p-b-100{padding-bottom: 100px;} .p-b-110{padding-bottom: 110px;} .p-b-120{padding-bottom: 120px;} .p-b-130{padding-bottom: 130px;} .p-b-140{padding-bottom: 140px;} .p-b-150{padding-bottom: 150px;} .p-t-10{padding-top: 10px;} .pt-15{padding-top:15px;} .p-t-20{padding-top: 20px;} .p-t-30{padding-top: 30px;} .p-t-40{padding-top: 40px;} .p-t-50{padding-top: 50px;} .p-t-60{padding-top: 60px;} .p-t-70{padding-top: 70px;} .p-t-80{padding-top: 80px;} .p-t-90{padding-top: 90px;} .p-t-100{padding-top: 100px;} .p-t-110{padding-top: 110px;} .p-t-120{padding-top: 120px;} .p-t-130{padding-top: 130px;} .p-t-140{padding-top: 140px;} .p-t-150{padding-top: 150px;} .p-t-200{padding-top: 200px;} .border-bt{ padding-bottom: 40px !important; border-bottom: 1px solid #e0e0e0; } /*----- End of shortcodes ------*/ .fluid{ padding-right: 15px; padding-left: 15px; margin-right: auto; width: 100%; margin-left: auto; } .major-portfolio{ padding:30px 0px 50px 0px; background-color: #f5f5f5; } /*========================================= = GLOBAL CSS = =========================================*/ .owl-dots{ text-align: center; margin-top: 30px; } .owl-dots>div{ display: inline-block; } .owl-dot span { padding: 3px; float: left; margin-left: 10px; border-radius: 10px; border: 1px solid; -webkit-transition: .3s; transition: .3s; } .owl-dot.active span{ background: none !important; -webkit-transform: scale(1.8); transform: scale(1.8); } .owl-item { -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translateZ(0) scale(1.0,1.0); transform: translateZ(0) scale(1.0,1.0); } /*input aimation*/ .input { position: relative; z-index: 1; display: block; } .input:after { content: ""; position: absolute; left: 0; bottom: 0; width: 0; height: 2px; -webkit-transition: .3s; transition: .3s; } .input-textarea:after{ bottom: 6px; } .input-field { -webkit-transition: background-color 0.25s, border-color 0.25s; transition: background-color 0.25s, border-color 0.25s; } .input-label { width: 100%; text-align: left; position: absolute; bottom: 100%; left: 0; pointer-events: none; overflow: hidden; margin: 0; font-size: 16px; font-weight: 400; color: #bdbdbd; -webkit-transform: translate3d(0, 2em, 0); transform: translate3d(0, 2em, 0); -webkit-transition: -webkit-transform 0.25s, font-size .25s; transition: transform 0.25s , font-size .25s; -webkit-transition-timing-function: ease-in-out; transition-timing-function: ease-in-out; } .input-label-content { -webkit-transition: -webkit-transform 0.25s; transition: transform 0.25s; -webkit-transition-timing-function: ease-in-out; transition-timing-function: ease-in-out; } .input-field:focus + .input-label, .input-filled .input-label { color: #8B8C8B; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); font-size: 13px; } .input-field:focus + .input-label .input-label-content, .input-filled .input-label-content { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } .input:focus:after, .input-filled.input:after { width: 100%; } /*End input animation*/ #page-wrap { position: relative; overflow: hidden; background-color: #fff; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .section-common-space{ padding: 100px 0; color:#fff;} /* TOOLTIP **************************/ .tooltip.bottom .tooltip-arrow{ border-bottom-color: #424242 !important; } .tooltip.top .tooltip-arrow{ border-top-color: #424242 !important; } .tooltip.left .tooltip-arrow{ border-left-color: #424242 !important; } .tooltip.right .tooltip-arrow{ border-right-color: #424242 !important; } .tooltip-inner { padding: 5px 8px; background-color: #424242; border-radius: 2px; font-size: 11px; } blockquote { padding: 5px 30px; margin: 0 0 30px; font-size: 16px; border-left: 6px solid; color: #757575; font-style: italic; } /*----- End of Global css ------*/ /*========================================= = PRELOADER = =========================================*/ .pace { -webkit-pointer-events: none; pointer-events: none; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .pace-inactive { display: none; } .pace .pace-progress { position: fixed; z-index: 2000; top: 0; right: 100%; width: 100%; height: 4px; } .pace .pace-activity { display: block; position: fixed; z-index: 2000; top: 15px; right: 15px; width: 20px; height: 20px; border: solid 3px transparent; border-radius: 10px; -webkit-animation: pace-spinner 400ms linear infinite; -moz-animation: pace-spinner 400ms linear infinite; -ms-animation: pace-spinner 400ms linear infinite; -o-animation: pace-spinner 400ms linear infinite; animation: pace-spinner 400ms linear infinite; } @-webkit-keyframes pace-spinner { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @-moz-keyframes pace-spinner { 0% { -moz-transform: rotate(0deg); transform: rotate(0deg); } 100% { -moz-transform: rotate(360deg); transform: rotate(360deg); } } @-o-keyframes pace-spinner { 0% { -o-transform: rotate(0deg); transform: rotate(0deg); } 100% { -o-transform: rotate(360deg); transform: rotate(360deg); } } @-ms-keyframes pace-spinner { 0% { -ms-transform: rotate(0deg); transform: rotate(0deg); } 100% { -ms-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes pace-spinner { 0% { transform: rotate(0deg); transform: rotate(0deg); } 100% { transform: rotate(360deg); transform: rotate(360deg); } } .wp-caption.alignnone{ width: 100% !important; } .wp-caption.aligncenter{ width: 100% !important; } .wp-caption-text { display: none; } .gallery-caption { } .bypostauthor { } .alignright { } .alignleft { } .preloader { position: fixed; width: 100%; height: 100%; background-color: #fff; z-index: 999; opacity: 1; visibility: visible; -webkit-transition: all .3s linear; transition: all .3s linear; } .preloader-hide { opacity: 0; visibility: hidden; } .preloader .tb { height: 100%; } .preloader .loading-wrap { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; } .preloader .loading-wrap img{ max-width: 80px; display: inline-block; margin-bottom: 15px; } .preloader .p-loading { position: relative; display: block; font-size: 14px; color: #777; letter-spacing: 6px; text-transform: uppercase; font-weight: 700; } /*--------- End of preloader -----------*/ /*========================================= = HEADER = =========================================*/ #header{ position: absolute; color: #fff; width: 100%; z-index: 99; background-color: #fff; } #header>.container{ position: relative; } /*sticky-header*/ #header.sticky-header, #header.sticky-header.static-header{ position: fixed; z-index: 1000; background-color: #fff; -webkit-animation: fadeInDown .5s; animation: fadeInDown .5s; } .offcanvas #header, #header.sticky-header{ -webkit-box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.15); box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.15); } #header.sticky-header .logos{ display: table; line-height: 60px; } #header .logos{ display: block; -webkit-transition: none; transition: none; } #header .logos img{ max-width: 150px; } /*For Fixed menu*/ #header.sticky-header .scroll-logos.logos .standard-logo, #header.sticky-header .scroll-logos.logos .retina-logo, #header.sticky-header .scroll-logos.logos .retina-logo.fixed-logo, #header .scroll-logos.logos .fixed-logo{ display: none; } #header.sticky-header .scroll-logos.logos .fixed-logo{ display: inline-block; } /*For Retina logo*/ #header .retina-logo { display: none; } @media only screen and (-webkit-min-device-pixel-ratio: 1.5),only screen and (-moz-min-device-pixel-ratio: 1.5),only screen and (-o-min-device-pixel-ratio: 1.5),only screen and (min-device-pixel-ratio: 1.5) { #header.sticky-header .scroll-logos.logos .fixed-logo, #header .standard-logo { display: none; } #header.sticky-header .scroll-logos.logos .retina-logo.fixed-logo, #header .retina-logo { display: block; } } /* MAIN NAV **************************/ /* MOBILE NAV **************************/ .mobile-nav .submenu-hidden { display: none; } .offcanvas-toggler, .mobile-nav{ display: none; } .offcanvas-toggler.active > i#offcanvas-closer { display: block; font-size: 25px; } .offcanvas-toggler.active > i#offcanvas-opener { display: none; } .offcanvas-toggler > i#offcanvas-opener { display: block; } .offcanvas-toggler > i { display: none; padding: 0 0 0 10px; font-size: 30px; background: transparent; margin: 0; line-height: 60px; cursor: pointer; color: #fff; -webkit-transition: all .3s; transition: all .3s; } .offcanvas-overlay { content: ""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; opacity: 0; visibility: hidden; background-color: rgba(0,0,0,.8); z-index: 0; -webkit-transition: all .3s; transition: all .3s; } body.offcanvas .offcanvas-overlay { opacity: 1; visibility: visible; z-index: 990; } .mobile-nav { width: 420px; height: 100%; position: fixed; top: 0; right: -100%; color: #fff; background-color: #fff; z-index: 999; overflow-y: scroll; -webkit-transition: right .3s; transition: right .3s; -webkit-transition-timing-function: ease-in-out; transition-timing-function: ease-in-out; } .offcanvas .mobile-nav { right: 0; } .offcanvas { width: 100%; height: 100%; } .mobile-nav { padding: 80px 30px 30px 50px; background: #fff; } .mobile-nav ul>li { border: 0; position: relative; } .mobile-nav ul li.has-child>a:after { content: "\e91b"; font-family: "icomoon"; font-size: 20px; margin-left: 10px; float: right; } .mobile-nav ul li.has-child.children-open>a:after { content: "\e91c"; } .mobile-nav ul>li a { display: block; padding: 15px 0; color: #000; text-transform: uppercase; -webkit-transition: all .3s; transition: all .3s; } .mobile-nav ul>li a:hover, .mobile-nav ul>li a:focus, .mobile-nav ul>li a:active, .mobile-nav ul>li.active>a, .mobile-nav ul>li.children-open>a{ background: none; } .mobile-nav ul>li ul>li:last-child{ border-bottom: none; } .mobile-nav ul>li .mobile-nav-toggler { display: inline-block; position: absolute; top: 5px; right: 0; padding: 10px 20px; cursor: pointer; color: #000; font-size: 24px; } .mobile-nav ul>li>ul .mobile-nav-toggler { color: #757575; top: -5px; } .mobile-nav ul>li .mobile-nav-toggler .open{ display: none; } .mobile-nav ul>li .mobile-nav-toggler .close { display: inline; opacity: 1; } .mobile-nav ul>li .mobile-nav-toggler.collapsed .open{ display: inline; } .mobile-nav ul>li .mobile-nav-toggler.collapsed .close { display: none; } .mobile-nav ul>li ul { padding-left:30px; } .mobile-nav ul>li ul>li a { color: #757575; font-size: 14px; padding: 15px 0; } /* HEADER VARAITONS **************************/ /*transparent header*/ #header.transparent-header{ background-color: transparent; } #header.sticky-header.transparent-header{ background-color: #fff; } #header.transparent-header .main-nav>ul>li>a{ color: #fff; } #header.transparent-header .main-nav>ul>li>a:before{ background-color: #fff; } #header.transparent-header.sticky-header .main-nav>ul>li>a{ color: #8c8c8c; } /*static-header*/ #header.static-header{ position: relative; } #header.static-header .main-nav>ul>li>a{ color: #fff; opacity: 1; } #header.static-header .main-nav>ul>li.active>a:before, #header.static-header .main-nav>ul>li:hover>a:before, #header.static-header .main-nav>ul>li:focus>a:before{ background-color: #fff; } /*box-header*/ #header.box-header{ background-color: transparent; } #header.box-header .box-header-wrap{ background: #fff; border-radius: 2px; margin-top: 20px; padding: 0 30px 0 25px; } #header.no-shadow .box-header-wrap { border-radius: 2px 2px 0 0; box-shadow: none; } #header.sticky-header.box-header{ background-color: #fff; } #header.sticky-header.box-header .logos{ background: none; padding: 0; } #header.box-header .main-nav>ul>li>a{ opacity: 1; } #header.box-header .main-nav>ul>li>a:before{ bottom: 25px; top: inherit; } #header.box-header.sticky-header .box-header-wrap{ margin-top: 0; padding: 0; } #header.box-header .offcanvas-toggler>i{ color: #000; } #header.box-header.sticky-header .main-nav>ul>li>a:before{ bottom: 15px; } /* Event header */ #header.event-header.static-header { background: #fff; } #header.event-header .main-nav>ul>li>a { font-size: 14px; color: #243b55; font-weight: 700; } /*------- End of Header -------*/ /*======================================================= = START OF COMPONENTS = ========================================================*/ *================= SECTION HEADER ================*/ .section-header{ margin-bottom: 60px; } .section-title{ color: #04bffe; position: relative; padding-bottom: 20px; margin-bottom: 60px; text-transform: uppercase; } .tabbed-about-us .details .title.font-color { color:#fff; } .title-seprater:before{ border: 3px solid #fff; background: #4481eb; bottom: -5px; content: ""; height: 14px; left: 0; margin: 0 auto; position: absolute; right: 0; width: 14px; z-index: 3; box-shadow: 0 0 3px 3px rgba(0, 60, 230, 0.4); } .title-seprater{ position: relative; } .title-seprater:after{ bottom: 0; content: ""; height: 4px; left: 0; margin: 0 auto; position: absolute; right: 0; border: 1px solid #4481eb; width: 130px; } .title-seprater.white-sep{ color:#fff; } .title-seprater.white-sep:before{ background:#fff; border: 3px solid #4481eb; } .title-seprater.white-sep:after{ border: 1px solid #fff; } .title-seprater.black-sept:before{ background:#000; border: 3px solid #536dfe; } .title-seprater.black-sep:after{ border: 1px solid #000; } /*section-header*/ .section-title{ text-transform: uppercase; /*margin-bottom: 30px;*/ text-align:center; } .section-subtitle{ font-size: 22px; font-weight: 300; text-align:center; } /*------ End of section header ------*/ /*================= SIMPLE SLIDER ================*/ .advanced-slider .owl-dot span{ background-color: #fff; border-color: #fff; } .advanced-slider .owl-controls .owl-nav>div:hover{ opacity: 1; background: none; } .advanced-slider .owl-controls .owl-nav>div.owl-next{ right: 15px; } /* SLIDER ANIMATION *********************/ /*fadeIn*/ .owl-item.active .atlantaa-fadeIn{ display: block !important; -webkit-animation: fadeIn .8s ease-in-out .5s both; animation: fadeIn .8s ease-in-out .5s both; } .owl-item.active .atlantaa-fadeIn-delay{ display: block !important; -webkit-animation: fadeIn .8s ease-in-out .8s both; animation: fadeIn .8s ease-in-out .8s both; } .owl-item.active .atlantaa-fadeIn-delay2{ display: block !important; -webkit-animation: fadeIn .8s ease-in-out 1.3s both; animation: fadeIn .8s ease-in-out 1.3s both; } .owl-item.active .atlantaa-fadeIn-delay3{ display: block !important; -webkit-animation: fadeIn .8s ease-in-out 1.8s both; animation: fadeIn .8s ease-in-out 1.8s both; } /*fadeInUp*/ .owl-item.active .atlantaa-fadeInUp{ display: block !important; -webkit-animation: fadeInUp .8s ease-in-out .5s both; animation: fadeInUp .8s ease-in-out .5s both; } .owl-item.active .atlantaa-fadeInUp-delay{ display: block !important; -webkit-animation: fadeInUp .8s ease-in-out .8s both; animation: fadeInUp .8s ease-in-out .8s both; } .owl-item.active .atlantaa-fadeInUp-delay2{ display: block !important; -webkit-animation: fadeInUp .8s ease-in-out 1.3s both; animation: fadeInUp .8s ease-in-out 1.3s both; } .owl-item.active .atlantaa-fadeInUp-delay3{ display: block !important; -webkit-animation: fadeInUp .8s ease-in-out 1.8s both; animation: fadeInUp .8s ease-in-out 1.8s both; } /*fadeInDown*/ .owl-item.active .atlantaa-fadeInDown{ display: block !important; -webkit-animation: fadeInDown .8s ease-in-out .5s both; animation: fadeInDown .8s ease-in-out .5s both; } .owl-item.active .atlantaa-fadeInDown-delay{ display: block !important; -webkit-animation: fadeInDown .8s ease-in-out .8s both; animation: fadeInDown .8s ease-in-out .8s both; } .owl-item.active .atlantaa-fadeInDown-delay2{ display: block !important; -webkit-animation: fadeInDown .8s ease-in-out 1.3s both; animation: fadeInDown .8s ease-in-out 1.3s both; } .owl-item.active .atlantaa-fadeInDown-delay3{ display: block !important; -webkit-animation: fadeInDown .8s ease-in-out 1.8s both; animation: fadeInDown .8s ease-in-out 1.8s both; } /*fadeInLeft*/ .owl-item.active .atlantaa-fadeInLeft{ display: block !important; -webkit-animation: fadeInLeft .8s ease-in-out .5s both; animation: fadeInLeft .8s ease-in-out .5s both; } .owl-item.active .atlantaa-fadeInLeft-delay{ display: block !important; -webkit-animation: fadeInLeft .8s ease-in-out .8s both; animation: fadeInLeft .8s ease-in-out .8s both; } .owl-item.active .atlantaa-fadeInLeft-delay2{ display: block !important; -webkit-animation: fadeInLeft .8s ease-in-out 1.3s both; animation: fadeInLeft .8s ease-in-out 1.3s both; } .owl-item.active .atlantaa-fadeInLeft-delay3{ display: block !important; -webkit-animation: fadeInLeft .8s ease-in-out 1.8s both; animation: fadeInLeft .8s ease-in-out 1.8s both; } /*fadeInRight*/ .owl-item.active .atlantaa-fadeInRight{ display: block !important; -webkit-animation: fadeInRight .8s ease-in-out .5s both; animation: fadeInRight .8s ease-in-out .5s both; } .owl-item.active .atlantaa-fadeInRight-delay{ display: block !important; -webkit-animation: fadeInRight .8s ease-in-out .8s both; animation: fadeInRight .8s ease-in-out .8s both; } .owl-item.active .atlantaa-fadeInRight-delay2{ display: block !important; -webkit-animation: fadeInRight .8s ease-in-out 1.3s both; animation: fadeInRight .8s ease-in-out 1.3s both; } .owl-item.active .atlantaa-fadeInRight-delay3{ display: block !important; -webkit-animation: fadeInRight .8s ease-in-out 1.8s both; animation: fadeInRight .8s ease-in-out 1.8s both; } /*fadeInLeftBig*/ .owl-item.active .atlantaa-fadeInLeftBig{ display: block !important; -webkit-animation: fadeInLeftBig .8s ease-in-out .5s both; animation: fadeInLeftBig .8s ease-in-out .5s both; } .owl-item.active .atlantaa-fadeInLeftBig-delay{ display: block !important; -webkit-animation: fadeInLeftBig .8s ease-in-out .8s both; animation: fadeInLeftBig .8s ease-in-out .8s both; } .owl-item.active .atlantaa-fadeInLeftBig-delay2{ display: block !important; -webkit-animation: fadeInLeftBig .8s ease-in-out 1.3s both; animation: fadeInLeftBig .8s ease-in-out 1.3s both; } .owl-item.active .atlantaa-fadeInLeftBig-delay3{ display: block !important; -webkit-animation: fadeInLeftBig .8s ease-in-out 1.8s both; animation: fadeInLeftBig .8s ease-in-out 1.8s both; } /*fadeInRightBig*/ .owl-item.active .atlantaa-fadeInRightBig{ display: block !important; -webkit-animation: fadeInRightBig .8s ease-in-out .5s both; animation: fadeInRightBig .8s ease-in-out .5s both; } .owl-item.active .atlantaa-fadeInRightBig-delay{ display: block !important; -webkit-animation: fadeInRightBig .8s ease-in-out .8s both; animation: fadeInRightBig .8s ease-in-out .8s both; } .owl-item.active .atlantaa-fadeInRightBig-delay2{ display: block !important; -webkit-animation: fadeInRightBig .8s ease-in-out 1.3s both; animation: fadeInRightBig .8s ease-in-out 1.3s both; } .owl-item.active .atlantaa-fadeInRightBig-delay3{ display: block !important; -webkit-animation: fadeInRightBig .8s ease-in-out 1.8s both; animation: fadeInRightBig .8s ease-in-out 1.8s both; } /*flipInX*/ .owl-item.active .atlantaa-flipInX{ display: block !important; -webkit-animation: flipInX .8s ease-in-out .5s both; animation: flipInX .8s ease-in-out .5s both; } .owl-item.active .atlantaa-flipInX-delay{ display: block !important; -webkit-animation: flipInX .8s ease-in-out .8s both; animation: flipInX .8s ease-in-out .8s both; } .owl-item.active .atlantaa-flipInX-delay2{ display: block !important; -webkit-animation: flipInX .8s ease-in-out 1.3s both; animation: flipInX .8s ease-in-out 1.3s both; } .owl-item.active .atlantaa-flipInX-delay3{ display: block !important; -webkit-animation: flipInX .8s ease-in-out 1.8s both; animation: flipInX .8s ease-in-out 1.8s both; } .owl-item.active .atlantaa-zoomIn{ display: block !important; -webkit-animation: zoomIn .8s ease-in-out .5s both; animation: zoomIn .8s ease-in-out .5s both; } .owl-item.active .atlantaa-zoomIn-delay{ display: block !important; -webkit-animation: zoomIn .8s ease-in-out .8s both; animation: zoomIn .8s ease-in-out .8s both; } .owl-item.active .atlantaa-zoomIn-delay2{ display: block !important; -webkit-animation: zoomIn .8s ease-in-out 1.3s both; animation: zoomIn .8s ease-in-out 1.3s both; } .owl-item.active .atlantaa-zoomIn-delay3{ display: block !important; -webkit-animation: zoomIn .8s ease-in-out 1.8s both; animation: zoomIn .8s ease-in-out 1.8s both; } /* ADVANCED SLIDER **************************/ .advanced-slider-wrapper{ padding: 0; color: #fff; } .advanced-slider .item .item-content{ padding: 0; height: 840px; height: 100vh; background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; } .advanced-slider .item .item-content>.container{ display: table; height: 100%; position: relative; z-index: 100; } .advanced-slider .item .item-content>.container>div{ display: table-cell; vertical-align: middle; } .advanced-slider .title{ font-size: 48px; text-transform: capitalize; } .advanced-slider .details { color: #fff; font-size: 20px; font-weight: 300; margin-top: 20px; margin-bottom: 15px; line-height: 1.6; } .advanced-slider .btn { line-height: 50px; font-size: 16px; padding: 0 40px; margin-right: 30px; font-weight: 700; -webkit-box-shadow: 0px 25px 55px 0px rgba(0, 0, 0, 0.21); box-shadow: 0px 25px 55px 0px rgba(0, 0, 0, 0.21); } .advanced-slider.owl-carousel .owl-nav{ position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 100%; /* margin-left: -40px; */ } .advanced-slider.owl-carousel .owl-nav>button{ position: initial; -webkit-transform: initial; transform: initial; font-size: 14px; margin-top: 0; width: 36px; height: 36px; line-height: 36px; border: 2px solid #fff; border-radius: 10%; text-align: center; opacity: .5; } .advanced-slider.owl-carousel .owl-nav>button.owl-next{ position: absolute; right:15px; left: unset; top: 0; font-size: 20px; padding-left: 3px; line-height: 1.6; }.advanced-slider.owl-carousel .owl-nav>button.owl-prev{ position: absolute; left:15px; right: unset; top: 0; font-size: 20px; padding-right: 3px; line-height: 1.6; } .advanced-slider .owl-dots { position: absolute; bottom: 40px; left: 50%; transform: translate(-50%,-50%); } .advanced-slider .icon-angle-left:before{ /*content: "\e91c";*/ } .advanced-slider .icon-angle-right:before { /*content: "\e91b";*/ } .advanced-slider .title{ font-size: 48px; text-transform: capitalize; color: #ffffff; } .advanced-slider .details p { color: #fff; font-size: 20px; font-weight: 300; margin-top: 20px; margin-bottom: 15px; line-height: 1.6; } /*------ End of simple slider ------*/ /*================== HERO SECTION ==================*/ .hero-section{ padding: 226px 0 200px; } .conference-info { font-size: 22px; font-weight: 500; } .conference-info i { margin-right: 6px; } .conference-info span { margin-right: 20px; } .hero-section .title { margin-top: 28px; margin-bottom: 35px; } .hero-section .button-group a.btn { line-height: 60px; padding: 0 57px; border-radius: 2px; font-size: 16px; font-weight: 700; } .hero-section .button-group a.btn.btn-info { border-color: rgba(255, 255, 255, .2); color: #fff; padding: 0 30px; } .hero-section .button-group a.btn.btn-info i{ width: 25px; height: 25px; font-size: 10px; border: 1px solid #fff; line-height: 22px; border-radius: 30px; display: inline-block; margin-right: 10px; } .hero-section .button-group a.btn.btn-info:hover, .hero-section .button-group a.btn.btn-info:focus { background: #fff; color: #243b54; } .hero-section .button-group a.btn.btn-info:hover i, .hero-section .button-group a.btn.btn-info:focus i{ border-color: #243b54; color: #243b54; } .button-group .btn:not(:last-child) { margin-right: 18px; } /*================== EVENTS TAB ==================*/ .events-tab .tabs-nav>li>a{ font-weight: 700; color: #243b55; } .events-tab .tabs-nav>li.active a{ color: #fff; } /*------ End of events tab ------*/ /*================== SERVICES ==================*/ .features-item{ background-color: #fff; margin: 20px 0; padding: 40px; -webkit-transition: .3s; transition: .3s; } .features-item:hover{ -webkit-box-shadow: 0px 10px 40px 0px rgba(0, 0, 0, 0.22); box-shadow: 0px 10px 40px 0px rgba(0, 0, 0, 0.22); } .features-icon{ font-size: 30px; width: 70px; height: 70px; margin: 0 auto 20px; padding: 14px 0; background: #ffffff; border-radius: 50%; border: 2px solid #f0f0f0; -webkit-box-shadow: 0 0 0 10px #fff; box-shadow: 0 0 0 10px #fff; color: #bdbdbd; -webkit-transition: .3s; transition: .3s; } .features-info h4 { margin-bottom:15px; } .features-info .title { color: #04bffe; font-weight: 700; } /* SERVICES VARAITONS **************************/ /*services-v2*/ .features-item-v2{ padding: 0; background: transparent; color: #fff; z-index: 10; margin-bottom: 80px; } .features-item-v2:hover{ -webkit-box-shadow: none; box-shadow: none; } .features-item-v2 .icon{ font-size: 50px; line-height: 1; -webkit-transition: .3s; transition: .3s; } .features-item-v2 .features-info .title{ color: #fff; font-weight: 400; } .features-item-v2 .features-info p{ color: #bfbfbf; font-size: 18px; font-weight: 300; } .features-item.features-item-v2:hover .features-info p{ color: #bfbfbf; } /*------ End of services ------*/ /*================== ABOUT US ==================*/ .tabbed-about-us .img-wrapper img{ -webkit-box-shadow: 0px 40px 70px 0px rgba(0, 0, 0, 0.22); box-shadow: 0px 40px 70px 0px rgba(0, 0, 0, 0.22); } .tabbed-about-us .img-wrapper .img-one{ position: absolute; top: 0; left: 0; display: none; } .tabbed-about-us .img-wrapper .img-two{ position: absolute; top: 120px; left: 138px; display: none; } .tabbed-about-us .img-wrapper .img-three{ width:100%; } .tabbed-about-us .details-wrapper{ padding-left: 30px; } .tabbed-about-us .details .title{ text-transform: uppercase; color: #04bffe; margin-bottom: 30px; } .tabbed-about-us .details p{ margin-bottom: 30px; } .tabbed-about-us .details p:last-child{ margin-bottom: 0; } .pie-title-center { display: inline-block; position: relative; text-align: center; } .circle>span{ display: block; position: absolute; font-size: 16px; font-weight: 700; top: 50%; left: 0; right: 0; margin-top: -20px; line-height: 40px; } .circle>span:after { content: '%'; margin-left: 0.1em; } .tabbed-about-us .work-progress{ margin-top: 60px; } .img-wrapper{ position: relative; } .video-des .img-wrapper:before{ content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: block; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .video-des .img-wrapper:hover:before{ background-color: rgba(0, 0, 0, 0.73); z-index: 1; } .video-des .img-wrapper .tube-icon{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 70px; height: 70px; font-size: 30px; text-align: center; border-radius: 50%; z-index: 2; padding-top: 13px; padding-left: 5px; background: rgba(0, 0, 0, 0.81); -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .video-des .img-wrapper:hover .tube-icon{ background-color: #fff; } .video-des .img-wrapper:hover .tube-icon span{ color:#000; } .video-des .img-wrapper .tube-icon span{ vertical-align: middle; } /*================== PORTFOLIO ==================*/ /*portfolio 2 grid*/ .col-2.portfolio-items .item{ width: 49.99%; } /*portfolio 3 grid*/ .col-3.grid-port{ width: 30%; margin: 15px; } .grid-port{ float: left; } /*portfolio 4 grid*/ .col-4.portfolio-items .item{ width: 24.98%; } /*portfolio 5 grid*/ .col-5.portfolio-items .item{ width: 19.99%; } .col-5.portfolio-items .item .caption, .col-6.portfolio-items .item .caption{ padding: 20px; } /*portfolio 6 grid*/ .col-6.portfolio-items .item{ width: 16.666666667%; } .portfolio, .portfolio .section-header *, .item-filter>li{ color: #fff; } .portfolio .section-header .section-title span:before{ background-color: #fff; } .portfolio .details p{ font-size: 16px; margin-bottom: 10px; } .item-filter{ margin-bottom: 40px; text-align: center; text-transform: uppercase; } .item-filter>li{ line-height: 40px; padding: 0 25px; color: #fff; border-radius: 30px; margin-right: 10px; font-size: 12px; display: inline-block; letter-spacing: .5px; cursor: pointer; -webkit-transition: .3s ease-in; transition: .3s ease-in; } .item-filter>li:hover, .item-filter>li.active{ background-color: #fff; opacity: 1; -webkit-box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.16); box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.16); } .portfolio-items{ margin: -15px; } .portfolio-items .item img{ width: 100%; -webkit-transition: .3s; transition: .3s; } .portfolio-items .item{ float: left; padding: 15px 0; box-sizing: border-box; } .portfolio-items .item.item-p{ padding: 0; width: 100%; } .portfolio-items .item figure{ position: relative; border-radius: 2px; } .portfolio-items .item .caption{ position: absolute; opacity: 0; -webkit-box-shadow: 0px 25px 55px 0px rgba(0, 0, 0, 0.21); box-shadow: 0px 25px 55px 0px rgba(0, 0, 0, 0.21); -webkit-transition: .3s; transition: .3s; } .portfolio-items .item .caption .tag { font-size: 12px; } .portfolio-items-v2.col-4.portfolio-items .item .caption .title{ font-size: 16px; } .portfolio-items-v2.col-4.portfolio-items .item figure .caption{ padding-right: 60px; } .portfolio-items-v2.col-4.portfolio-items .item .caption .popup { font-size: 22px; } .portfolio-items .item .caption .title{ color: #04bffe; font-weight: 700; text-transform: uppercase; font-size:18px; } .portfolio-items .item .caption .btn{ color: #fff; } .portfolio-items .item figure:hover .caption{ bottom: -15px; left: -15px; opacity: 1; } .portfolio-items .item figure .caption .icon-zoom{ font-size: 25px; position: absolute; right: 20px; top: 27px; } .portfolio-nav{ position: relative; } .port-prev, .port-next{ position: absolute; top: 0; font-size: 25px; } .port-next{ right: 15px; } .port-prev{ left: 15px; } .port-btn{ left: 50%; top: 0; position: absolute; transform: translate(-50%,5px); } .port-btn svg { fill: #626262; } .port-prev:hover, .port-next:hover{ color: #000; } .port-btn svg:hover { fill: #000; } /* PORTFOLIO filter **************************/ .item-filter-v2{ /*max-width: 770px;*/ background-color: #fff; padding: 12px 30px; border-radius: 2px; text-align:center; -webkit-box-shadow: 0px 1px 6px rgba(0,0,0,.1); box-shadow: 0px 1px 6px rgba(0,0,0,.1); } .item-filter.item-filter-v2>li{ padding: 0; background-color: transparent; color: #a6a6a6; font-weight: 700; position: relative; margin-right: 50px; } .item-filter.item-filter-v2>li:last-child{ margin-right: 0; } .item-filter.item-filter-v2>li:before { content: ""; position: absolute; bottom: 5px; left: 0; width: 0; height: 1px; background: #fff; -webkit-transition: .3s; transition: .3s; } .item-filter.item-filter-v2>li:hover, .item-filter.item-filter-v2>li.active{ -webkit-box-shadow: none; box-shadow: none; } .item-filter.item-filter-v2>li:hover:before, .item-filter.item-filter-v2>li.active:before { width: 50%; } .portfolio-items-v2 .item figure{ overflow: hidden; -webkit-transition: .3s; transition: .3s; } .portfolio-items-v2 .item:hover figure{ -webkit-box-shadow: 0px 25px 55px 0px rgba(0, 0, 0, 0.21),0px 16px 28px 0px rgba(0, 0, 0, 0.22); box-shadow: 0px 25px 55px 0px rgba(0, 0, 0, 0.21),0px 16px 28px 0px rgba(0, 0, 0, 0.22); } .portfolio-items-v2.portfolio-items .item figure .caption { top: 0; bottom: 0; left: 0; right: 0; text-align: left; padding: 30px 20px; } .portfolio-items-v2.portfolio-items .item figure:hover img{ -webkit-transform: rotate(5deg) scale(1.2); transform: rotate(5deg) scale(1.2); } .portfolio-items-v2.portfolio-items .item .caption .tag, .portfolio-items-v2.portfolio-items .item .caption .title, .portfolio-items-v2.portfolio-items .item .caption .popup{ color: #fff; } .portfolio-items-v2.portfolio-items .item .caption .tag{ font-size: 14px; } /* Magnific Popup Customisation for Portfolio **********/ .mfp-fade.mfp-bg { opacity: 0; -webkit-transition: all 0.4s ease-out; transition: all 0.4s ease-out; } .mfp-fade.mfp-bg.mfp-ready { opacity: 0.75; } .mfp-bottom-bar { display: none; } .mfp-fade.mfp-bg.mfp-removing { opacity: 0; } .mfp-arrow-right::after, .mfp-arrow-left::after { font-family: 'FontAwesome'; border: none !important; color: #fff; font-size: 65px; -webkit-transition: .5s; transition: .5s; } .mfp-arrow-right::after { content: "\f105" !important; } .mfp-arrow-left::after { content: "\f104" !important; } .mfp-arrow-right::before , .mfp-arrow-left::before { border: none !important; } .mfp-arrow { height: 60px; } .mfp-arrow::before, .mfp-arrow::after, .mfp-arrow .mfp-b, .mfp-arrow .mfp-a { margin-top: 15px; top: -1px !important; } img.mfp-img { padding: 40px 0px 0; } .mfp-fade.mfp-wrap .mfp-content { opacity: 0; transform: scale(0.95); -webkit-transition: all 0.4s ease-out; transition: all 0.4s ease-out; } .mfp-fade.mfp-wrap.mfp-ready .mfp-content { transform: scale(1); opacity: 1; -webkit-transition: all 0.4s ease-out; transition: all 0.4s ease-out; } .mfp-fade.mfp-wrap.mfp-removing .mfp-content { opacity: 0; transform: scale(0.95); -webkit-transition: all 0.4s ease-out; transition: all 0.4s ease-out; } /*------ End of portfolio ------*/ /*================== GOTO TOP ==================*/ .go-top { position: fixed; bottom: -100px; right: 30px; font-size: 20px; background: #F50057; border: none; color: #fff; -webkit-box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.21),0px 5px 10px 0px rgba(0, 0, 0, 0.22); box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.21),0px 5px 10px 0px rgba(0, 0, 0, 0.22); width: 48px; height: 48px; display: block; padding: 0; text-align: center; border-radius: 30px; -webkit-transition: .3s; transition: .3s; z-index: 100; } .go-top i{ display: block; } .go-top.active{ bottom: 50px; } /*------ End of goto top ------*/ /*================== PAGE TITLE ==================*/ .page-title-bg{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: -2; background-position: center center; -webkit-animation: onlyscale 50s infinite; animation: onlyscale 50s infinite; } @-webkit-keyframes onlyscale { 0%{ -webkit-transform: scale(1); transform: scale(1); } 100%{ -webkit-transform: scale(1.5); transform: scale(1.5); } } @keyframes onlyscale { 0%{ -webkit-transform: scale(1); transform: scale(1); } 100%{ -webkit-transform: scale(1.5); transform: scale(1.5); } } .page-title{ padding: 160px 0 190px 0; color: #fff; position: relative; -webkit-background-size: cover; background-size: cover; background-position: center center; margin-bottom: -125px; z-index: 10; } .page-title:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .page-title .breadcrumb{ background-color: rgba(0,0,0,.1); padding: 12px 15px; font-size: 12px; text-transform: uppercase; } .breadcrumb>li>a{ opacity: .7; color: #04bffe;; } .breadcrumb>li>a:hover{ opacity: 1; } /*------ End of page title ------*/ /*================== CONTACT US ==================*/ .contact-infobox { border: 1px solid #dcdcdc; padding: 50px 20px; text-align: center; } .contact-infobox p { color: #fff; } .contact-infobox i { width: 80px; height: 80px; border: 3px solid #fff; color: #fff; text-align: center; font-size: 30px; line-height: 75px; margin-bottom: 20px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } .contact-infobox:hover i { background: #04bffe; border: 3px solid #04bffe; color: #ffffff; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } .contact-form-row .form-control { height: 45px; margin-bottom: 30px; } .contact-form-row .btn { margin-bottom: 30px; color: #000; } .contact-textarea { text-align: left; } .contact-textarea textarea { height: 100% !important; } .form-control:focus { border-color: #04bffe; outline: 0; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(244, 76, 71, 0.45); box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(244, 76, 71, 0.45); } /*=============== POPULAR ARTICLES ===============*/ .most-popular article{ position: relative; } .most-popular .img-wrapper{ overflow: hidden; position: relative; border-radius: 3px; } .most-popular .img-wrapper:before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: #000; -webkit-transition: .3s; transition: .3s; opacity: 0; border-radius: 3px; } .most-popular img{ width: 100%; -webkit-transition: .5s; transition: .5s; } .most-popular article:hover .img-wrapper:before{ opacity: 1; } .most-popular article:hover img{ -webkit-transform: scale(1.15); transform: scale(1.15); opacity: .5; } .most-popular img{ width: 100%; } .most-popular article .info{ position: absolute; top: 50%; left: 0; z-index: 10; -webkit-transform: translateY(-50%); transform: translateY(-50%); background: rgba(255, 255, 255,.85); margin-right: 60px; padding: 23px 30px 23px 35px; border-radius: 0 2px 2px 0; -webkit-transition: .3s; transition: .3s; } .most-popular article:hover .info{ background: rgba(255, 255, 255,1); } .most-popular article .tag{ position: absolute; top: 50%; left: -18px; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 33px; height: 33px; line-height: 33px; text-align: center; border-radius: 30px; color: #fff; font-size: 18px; } .most-popular article .title{ font-size: 16px; line-height: 1.25; color: #000; font-weight: 500; } /* Popular articles Varaitons **********************/ .most-popular-v2 article .info{ padding: 22px; border-radius: 0 2px 2px 0; background: rgba(0,0,0,.8); } .most-popular-v2 article .info .bgcolor-major-gradient-overlay{ z-index: -1; opacity: 0; } .most-popular-v2 article:hover .info .bgcolor-major-gradient-overlay{ opacity: 1; } body .most-popular-v2 article .title, body .most-popular-v2 article .title:hover, body .most-popular-v2 article .title:focus{ color: #fff; } .most-popular-v2 .img-wrapper:before{ display: none; } .most-popular-v2 article:hover img{ opacity: 1; } /*------ End of popular articles ------*/ /*============= CATEGORIES ARTICLES =============*/ .categories>li{ font-size: 16px; margin-bottom: 10px; } .categories .count{ float: right; } /*------ End of categories articles ------*/ /*================ TAG CLOUDS ===============*/ .tag-clouds .tag{ margin-top: 10px; margin-right: 5px; line-height: 32px; } /*------ End of tag clouds ------*/ /*============== SOCIAL FEEDBACK =============*/ .social-center{ margin: 0 auto; position: relative; max-width: 350px; padding-left: 46px; } .social-feedback { width: 50%; float: left; overflow: hidden; text-align: left; } .social-feedback>div { float: left; } .social-feedback .icon { width: 36px; height: 36px; line-height: 36px; text-align: center; border-radius: 20px; color: #fff; margin-top: 8px; margin-right: 10px; } .social-feedback.facebook .icon{ background: #336497; } .social-feedback.facebook, .social-feedback.facebook p{ color: #336497; } .social-feedback.twitter .icon{ background: #25b5e6; } .social-feedback.twitter, .social-feedback.twitter p{ color: #25b5e6; } .social-feedback.youtube .icon{ background: #d34a38; } .social-feedback.youtube, .social-feedback.youtube p{ color: #d34a38; } .social-feedback.vimeo .icon{ background: #55accc; } .social-feedback.vimeo, .social-feedback.vimeo p{ color: #55accc; } .social-feedback.dribbble .icon{ background: #f284a7; } .social-feedback.dribbble, .social-feedback.dribbble p{ color: #f284a7; } .social-feedback.gplus .icon{ background: #cf5741; } .social-feedback.gplus, .social-feedback.gplus p{ color: #cf5741; } /*------ End of social feedback ------*/ /*============== SINGLE POST(Article) ============*/ .single-p-post{ margin-bottom: 20px; position: relative; z-index: 11; -webkit-transition: all .3s; transition: all .3s; } .single-p-post .img-wrapper{ overflow: hidden; position: relative; margin-bottom: -80px; z-index: -1;1160 box-shadow: 0px 25px 55px 0px rgba(0, 0, 0, 0.21), 0px 16px 28px 0px rgba(0, 0, 0, 0.22) } .single-p-post .img-wrapper:before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: #000; -webkit-transition: .3s; transition: .3s; z-index: -1; border-radius: 3px; } .single-p-post img{ width: 100% !important; -webkit-transition: .5s; transition: .5s; } .single-p-post:hover .img-wrapper:before{ opacity: 1; } .single-p-post:hover img{ -webkit-transform: scale(1.13); transform: scale(1.13); opacity: .5; } .single-p-post .tag{ position: absolute; top: -15px; display: inline-block; line-height: 30px; font-size: 12px; padding: 0 10px; color: #fff; text-transform: uppercase; font-weight: 500; border-radius: 2px; } .single-p-post .tag i{ padding-right: 5px; } .single-p-post .info{ background: #fff; border-radius: 3px; transition: all .3s; } .single-p-post .title{ color: #212121; line-height: 1.2; font-size: 16px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; display: -webkit-box; margin-bottom: 10px; -webkit-transition: .3s; transition: .3s; } .single-p-post.small .title{ font-size: 14px; } .single-p-post .article-info{ overflow: hidden; } .single-p-post.post-details-effect .article-info{ max-height: 0; opacity: 0; -webkit-transition: max-height .7s ease, opacity .7s ease; transition: max-height .7s ease, opacity .7s ease; } .single-p-post.post-details-effect:hover .article-info{ max-height: 300px; opacity: 1; } .single-p-post .article-info ul{ font-size: 13px; margin-bottom: 10px; } .single-p-post .article-info ul>li{ display: inline-block; } /*.single-p-post .article-info ul>li:after { content: " / "; }*/ .single-p-post .article-info ul>li:last-child:after { display: none; } .single-p-post .article-info .author-name a{ font-weight: 400; display: inline-block; } .single-p-post .article-info .btn{ line-height: 26px; padding: 0 20px; border: 2px solid #e0e0e0; box-shadow: none; text-transform: uppercase; font-weight: 700; font-size: 11px; } .single-p-post.single-p-post-index{ margin-bottom: 40px; } .single-p-post.single-p-post-index .info{ padding: 30px 20px 20px; } /* Single Posts Varaitons ******************/ .img-wrapper{ margin-bottom: 25px; } .single-post-v2 .tag{ font-size: 16px; font-weight: 700; display: block; margin-bottom: 10px; text-transform: uppercase; } .single-post-v2 .title{ margin-bottom: 15px; } .single-post-v2 .title a { color: #151414; word-break: break-all; } .single-post-v2 .intro p{ font-size: 18px; color: #666666; font-weight: 300; margin-bottom: 20px; } .single-post-v2 .article-info{ color: #a6a6a6; text-transform: uppercase; } .single-post-v2 .article-info ul li { display: inline-block; margin-right: 20px; } .single-post-v2 .article-info ul li a{ color: #a6a6a6; } .single-post-v2 .article-info ul li i.fa { margin-right: 5px; } .single-post-v2 .img-wrapper { overflow: hidden; } .single-post-v2 .img-wrapper img{ width: 100%; } .single-post-v2 .img-wrapper .btn{ border: 2px solid #fff; color: #fff; z-index: 15; text-transform: uppercase; -webkit-transform: translate(-50%, -50%) scale(0); transform: translate(-50%, -50%) scale(0); -webkit-transition: .3s; transition: .3s; } .single-post-v2 .img-wrapper .btn:hover, .single-post-v2 .img-wrapper .btn:focus{ background-color: #fff; border-color: #fff; } .single-post-v2 .bgcolor-major-gradient-overlay{ opacity: 0; } .single-post-v2:hover .bgcolor-major-gradient-overlay{ opacity: 1; } .single-post-v2:hover .img-wrapper .btn{ -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); } .sub-leading-post.single-post-v2 .info{ margin-top: 0; background: #fff; padding: 40px; } .blog-view-all .btn{ border: 2px solid #e0e0e0; position: relative; z-index: 100; overflow: hidden; background: none; } .blog-view-all .btn .bgcolor-major-gradient-overlay{ opacity: 0; z-index: -1; } .blog-view-all .btn:hover .bgcolor-major-gradient-overlay, .blog-view-all .btn:focus .bgcolor-major-gradient-overlay{ opacity: 1; } /*------ End of single post ------*/ /* Featured posts slider *****************/ .featured-post{ position: relative; } .featured-post .info{ position: relative; padding: 30px; margin: 0 20px; -webkit-box-shadow: 0px 1px 6px rgba(0,0,0,.1); box-shadow: 0px 1px 6px rgba(0,0,0,.1); transition: all .3s ease; } .featured-post:hover .info{ } .featured-posts-slider .item { background: #fff; } .featured-posts-slider .item>.row { display: table; } .featured-posts-slider .item>.row>div { display: table-cell; float: none; vertical-align: middle; } .featured-posts-slider .info{ padding: 0 35px 0 50px; } .featured-posts-slider .info .tag{ font-size: 16px; font-weight: 700; text-transform: uppercase; display: block; margin-bottom: 10px; } .featured-posts-slider .info .title a{ color: #151414; } .featured-posts-slider .info .article-info{ margin-top: 12px; } .featured-posts-slider .info .article-info li:not(:last-child){ margin-right: 20px; } .featured-posts-slider .info .article-info li { display: inline-block; color: #a6a6a6; text-transform: uppercase; } .featured-posts-slider .info .article-info li i{ margin-right: 5px; } .featured-posts-slider .customnav { padding-left: 50px; padding-bottom: 20px; } .featured-posts-slider .customnav>span { display: inline-block; width: 30px; height: 30px; line-height: 30px; text-align: center; border: 2px solid #e0e0e0; border-radius: 30px; font-size: 10px; color: #e0e0e0; -webkit-transition: .3s; transition: .3s; } .featured-posts-slider .customnav>span:not(:last-child){ margin-right: 10px; } .featured-posts-slider .customnav>span:hover{ color: #fff; -webkit-box-shadow: 0px 25px 55px 0px rgba(0, 0, 0, 0.21),0px 16px 28px 0px rgba(0, 0, 0, 0.22); box-shadow: 0px 25px 55px 0px rgba(0, 0, 0, 0.21),0px 16px 28px 0px rgba(0, 0, 0, 0.22); } .featured-posts-slider .owl-dots{ position: absolute; left: 33.33333333%; margin-left: 40px; bottom: 30px; } .featured-posts-slider .owl-dots .owl-dot>span{ border-color: #fff; background: #fff; } /* Pagination **************************/ ul.pagination{ margin-top: 60px; margin-bottom: 0; } ul.pagination>li>a { border: none; padding: 5px 17px 4px; font-size: 18px; margin: 0 2px; background: none; border-radius: 2px; color: #000; } ul.pagination>li>a:hover, ul.pagination>li>a:focus{ background-color: #04bffe; background-color: #04bffe; color:#fff; } .pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover { z-index: 3; color: #fff; cursor: default; background-color: #04bffe; } ul.pagination>li.active>a{ color: #fff; } .btn.load-more{ font-weight: 700; } .load-more i.fa{ margin-right: 15px; } /*================== SIDEBAR ==================*/ .sidebar{ padding: 30px; background-color: #fff; border-radius: 2px; overflow: hidden; } .sidebar-v2{ padding-left: 15px; padding-top: 0; } /*----- End of sidebar ------*/ /*================== BLOG DETAILS ==================*/ .blog-single-wrapper{ background: #fff; margin: 0 15px; overflow: hidden; padding-left: 15px; padding-top: 30px; } .page-wrapper{ margin: 0 0px; overflow: hidden; padding-left: 15px; padding-top: 0px; } .page-wrapper .sidebar-v2{ padding-right: 15px; } /* post-info*/ .post-img{ width: 100%; height: 450px; -webkit-background-size: cover; background-size: cover; background-position: 0 0; } .post-caption{ background: #fff; padding: 50px 40px 20px 40px; border-radius: 2px 2px 0 0; margin-top: -160px; position: relative; } .post-caption .title{ color: #212121; } .post-caption .post-tag { position: absolute; top: -15px; display: inline-block; line-height: 30px; font-size: 12px; padding: 0 10px; color: #fff; text-transform: uppercase; font-weight: 700; border-radius: 2px; } ul.post-meta>li:after { content: " /"; } ul.post-meta>li:last-child:after { display: none; } ul.post-meta>li { display: inline-block; font-size: 16px; } .post-info-wrapper{ background: #fff; padding: 0 0 2px 2px; border-radius: 0 0 2px 2px; } .post-info{ background: #fff; padding: 20px 40px 40px; border-radius: 2px 2px 0 0; } .post-info p{ font-size: 15px; } .post-info p, .post-info h1,.post-info h2, .post-info h3, .post-info h4, .post-info h5, .post-info h6 { color: #212121; } .post-img-v2,.page-img-v2,.search-no{ margin-bottom: 35px; } .post-info-v2 .tag{ font-size: 16px; text-transform: uppercase; font-weight: 700; } .post-info-v2 .title{ font-size: 30px; margin-top: 8px; } .post-info-v2 .title, .post-info-v2 .title a{ color: #151414; } .post-info-v2 .article-info { margin-top: 20px; } .post-info-v2 .article-info ul>li { display: inline-block; text-transform: uppercase; color: #a6a6a6; margin-right: 20px; } .post-info-v2 .article-info ul>li a{ color: #a6a6a6; } .post-info-v2 .article-info ul>li i{ margin-right: 5px; } .post-info-v2 p { font-size: 18px; font-weight: 300; color: #666666; } .post-info-v2 blockquote { border-left-color: #e0e0e0; border-width: 2px; position: relative; padding: 0 22px; margin: 50px; } .post-info-v2 blockquote:before { content: "\f10d"; font-family: fontawesome; position: absolute; top: -8px; left: -56px; font-size: 33px; } .post-info-v2 .tag-clouds .tag{ font-size: 14px; font-weight: 400; text-transform: capitalize; color: #a6a6a6; } .post-info-v2 .tag-clouds .tag:hover{ color: #fff; } .related-post-wrapper-v2{ padding: 0; } .img-with-content{ display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; } .img-with-content .content{ display: table-cell; padding-right: 35px; } .img-with-content .img{ display: table-cell; } #searchsubmit{ color: #fff; background-image: -webkit-linear-gradient( 135deg, #04bffe 0%, #4481eb 100%); border-radius: 10px; } #s{ width: 70%; } #searchsubmit: hover { color: #fff; background-color: #ff8100; } /* author-info */ .author-info{ background: #fff; padding: 35px 40px; border-radius: 2px; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; } .author-img{ display: table-cell; margin-right: 30px; } .author-img img{ border-radius: 40px; } .author-content{ display: table-cell; } .author-content .degination{ color: #212121; font-size: 14px; font-weight: 600; margin-bottom: 5px; } .author-content h3{ font-weight: 600; } ul.author-social li{ margin-right: 10px; display: inline-block; } ul.author-social li a { width: 24px; height: 24px; line-height: 24px; text-align: center; background: #bdbdbd; border-radius: 30px; display: inline-block; font-size: 12px; color: #fff; -webkit-transition: .3s; transition: .3s; } /*.author-info-v2*/ .author-info-v2{ padding: 35px 0; } related-post ************************* .related-post-wrapper{ background: #fff; padding: 35px 40px 10px; border-radius: 2px; } .related-post .single-p-post .info{ left: 15px; right: 15px; } .related-post .owl-nav{ position: absolute; top: -47px; right: 0; } .related-post .owl-nav>div{ float: left; margin-left: 5px; opacity: .5; -webkit-transition: .3s; transition: .3s; } .related-post .owl-nav>div:hover{ opacity: 1; } .related-post-v2{ margin-bottom: -15px; } .related-post-v2 .single-p-post:hover{ -webkit-box-shadow: none; box-shadow: none; } .related-post-v2 .single-p-post{ margin-bottom: 0; } /*related-post-wrapper-v2*/ .related-post-wrapper-v2{ padding: 15px 0; } /* comments-box **************************/ .comments-box{ background: #fff; padding: 35px 40px 10px; border-radius: 2px; } .commentlist li:not(:last-child){ margin-bottom: 40px; } .commentlist li .child{ margin-left: 80px; margin-top: 40px; } .comment-meta { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; } .comment-author img{ border-radius: 60px; width: 90px; margin: 32px 16px -32px 0px; } .comment-author{ margin-right: 22px; font-weight: 700; color: #212121; margin-bottom: -15px; font-size: 20px; } .comment-author span{ display: block; color: #bdbdbd; font-weight: 400; font-size: 12px; } .comment-reply{ margin-top: 10px; display: block; font-size: 12px; font-weight: 700; } .thumbs-option { font-size: 20px; } .thumbs-option span { margin-left: 10px; } .thumbs-option .count{ letter-spacing: -2px; } /*comments-box-v2*/ .comments-box-v2{ padding: 15px 0; } /* comment-form **************************/ .comment-form{ background: #fff; padding: 40px; border-radius: 2px; } /* .comment-form .section-title.mini-title{ margin-bottom: 20px; } */ .comment-form .input-field{ width: 100%; } .comment-form .input { width: 48%; float: left; } .comment-form .input:first-child { margin-right: 2%; } .comment-form .input:nth-child(2) { margin-left: 2%; } .comment-form .input-textarea{ width: 100%; } .comment-form .input-textarea:after { bottom: 6px; } .comment-author-v2{ font-size: 18px; font-weight: 400; margin-bottom: 5px; } .comment-author-v2 span{ display: inline-block; font-size: 14px; margin-left: 8px; } .comment-form .input-field:focus{ border-bottom: 2px solid #04bffe; } /*comment-form-v2*/ .comment-form-v2{ padding: 15px 0; } .comment .children{ margin-left: 40px; } /*------- End of single details -------*/ /*======================================================= = //End of blog = ========================================================*/ /*======================================================= = START OF 404 = ========================================================*/ .error-page body{ background: transparent; color: #fff; } .error-wrap h1{ font-size: 60px; font-weight: 700; } .error-wrap .btn.btn-info{ color: #fff; border-color: #fff; } .error-wrap .btn.btn-info:hover, .error-wrap .btn.btn-info:focus{ color: #666666; background-color: #fff; border-color: #fff; } .error-wrap .btn.btn-link{ font-size: 16px; margin-left: 40px; color: #fff; } .error-wrap .team-social{ margin-top: 200px; } .error-wrap .team-social li>a{ width: 36px; height: 36px; line-height: 36px; color: #fff; background-color: rgba(255,255,255,0.1); } .error-wrap .team-social li>a:hover{ background-color: #fff; } .error-wrap footer{ background: #f2f3f7; padding: 38px 0; } .error-wrap footer p{ color: #666666; } .error-wrap footer a{ font-weight: 700; } /*======================================================= = //End of 404 = ========================================================*/ /*========================================= = Footer = =========================================*/ footer{ padding: 45px 0px 0px 0px; color: #8c8c8c; background: #fff; } footer .copyright a{ font-weight: 700; } .footer-logo{ display: inline-block; padding: 40px 18px; border-radius: 0 0 3px 3px; } .made-by{ font-size: 12px; font-style: italic; } /*For shortcode and Other pages*/ .all-buttons a.btn:not(:last-child){ margin-right: 15px; } /*Preset Switcher*/ .style-chooser { width: 300px; right: 0px; position: fixed; top:105px; bottom: 0; z-index: 100; -webkit-transition: right 400ms; transition: right 400ms; box-shadow: 0 2px 50px rgba(0,0,0,0.15); } .style-chooser .btn{ font-size: 15px; font-weight: 700; } .style-chooser.active { right: -300px; } .style-chooser .toggler { position: absolute; top: 0; left: -48px; display: inline-block; background: #00aeef; width: 48px; height: 48px; line-height: 48px; text-align: center; font-size: 24px; color: #fff; border-radius: 4px 0 0 4px; } .style-chooser-inner { position: relative; background: #fff; padding: 20px; height: 100%; overflow-y: auto; overflow-x: hidden; } .style-chooser-inner .info { margin-bottom: 40px; } .style-chooser-inner .info h4 { font-size: 16px; text-align: center; margin: 30px 0 15px 0; letter-spacing: 2px; } .style-chooser-inner .info p{ font-size: 14px; line-height: 1.6; text-align: center; opacity: .8; } .style-chooser-inner h4.tittle{ font-size: 16px; text-align: center; border-bottom: 1px solid #eee; padding-bottom: 15px; margin-bottom: 15px; } .style-chooser-inner ul.demo { list-style: none; padding: 0; } .style-chooser-inner ul.demo img { width: 100%; } .style-chooser-inner ul.demo li { display: block; -webkit-box-sizing: border-box; box-sizing: border-box; margin-bottom: 10px; } .style-chooser-inner ul.demo li.active a { background-color: #444; } .style-chooser-inner ul.demo li.active a img { opacity: .3; } .style-chooser-inner ul.demo li a { display: block; text-align: center; color: #fff; position: relative; overflow: hidden; } .style-chooser-inner ul.demo img { width: 100%; -webkit-transition: 2s; transition: 2s; } .style-chooser-inner ul.demo li:hover img{ -webkit-transform: scale(1.3); transform: scale(1.3); -webkit-transition: 2s; transition: 2s; } .style-chooser-inner ul.demo li strong{ font-size: 12px; font-weight: 700; text-transform: uppercase; padding: 10px; text-align: center; display: block; color: #000; opacity: .7; } .style-chooser-inner ul li:last-child{ margin-bottom: 0; } ul.preset-list { display: block; margin-bottom: 20px; overflow: hidden; } ul.preset-list li { display: inline-block; float: left; height: 36px; width: 40px; margin-bottom: 10px; } ul.preset-list li:last-child{ margin-bottom: 0; } ul.preset-list>li img { width: 30px; } .font-color p{ color:#fff; } .our-skill{ text-align:center; } .our-skill h3{ font-size: 30px; font-weight: 500; letter-spacing: 1px; } .work-progress .each-item.text-left{ float:left !important; } /*----------Footer----------*/ .footer{ color:#fff; padding: 80px 0 40px; width: 100%; background:#232732; background-size: cover; position: relative; z-index: 0; }.footer:after { content: ""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: linear-gradient( 135deg, rgba(34, 39, 51, 0.88) 0%, rgba(34, 40, 52, 0.88) 100%); opacity: .9; z-index: -1; } .useful, .contact , .instagram, .information{ padding-bottom: 40px; } .useful h3, .contact h3, .instagram h3, .information h3{ font-size: 20px; color:#fff; letter-spacing: 1px; padding-bottom:30px; } .contact h5, .information p{ font-size: 14px; line-height: 1.4; color: #fff; padding: 12px 0; font-weight: 300; } .contact h5{ display: inline-flex; } .contact h5:hover{ color:#04bffe; } .contact h5 i{ padding-right: 20px; padding-left: 10px; font-size:15px; color:#04bffe; } .footer-social-icon{ padding-top: 20px; } .footer-social-icon i{ width: 30px; margin-left: 5px; height: 30px; text-align: center; background: #04bffe; border: 1px solid #04bffe; border-radius: 2px; padding: 7px 0; transition: 1s all; } .footer-social-icon i:hover{ background:transparent; border:1px solid #04bffe; } .useful h6{ font-size: 14px; padding: 12px 0; color: #d4d4d4; } .useful h6:hover{ color:#04bffe; } .useful h6 i{ font-size: 14px; padding-right: 10px; color: #d4d4d4; } .useful h6:hover i{ color:#04bffe; } .instagram ul li{ display: inline-block; width: 80px; padding: 0px 1px; } .instagram ul li a img{ width: 100%; } .instagram.insta-blog ul li{ width:100px; } /*---------- timeline ---------------*/ .main-timeline{ position: relative; } .main-timeline:before{ content: ""; width: 3px; height: 100%; background: #d6d5d5; position: absolute; top: 0; left: 50%; } .main-timeline .timeline{ padding-right: 30px; position: relative; } .main-timeline .timeline:before, .main-timeline .timeline:after{ content: ""; display: block; width: 100%; clear: both; } .main-timeline .timeline:first-child:before, .main-timeline .timeline:last-child:before{ content: ""; width: 13px; height: 13px; border-radius: 50%; border: 2px solid #d6d5d5; background: #fff; margin: 0 auto; position: absolute; top: 0; left: 0; right: -3px; } .main-timeline .timeline:last-child:before{ top: auto; bottom: 0; } .main-timeline .timeline-icon{ width: 18px; height: 18px; border-radius: 50%; background: #fff; border: 2px solid #d6d5d5; box-sizing: content-box; margin: auto; position: absolute; top: 0; left: 0; bottom: 0; right: -4px; } .main-timeline .timeline-icon:before{ content: ""; display: block; width: 8px; height: 8px; border-radius: 50%; margin: auto; position: absolute; top: 0; left: 0; bottom: 0; right: 0; } .main-timeline .year{ display: inline-block; padding: 8px 20px; margin: 0; font-size: 14px; color: #fff; text-align: center; position: absolute; top: 50%; right: 30%; transform: translateY(-50%); } .main-timeline .year:before{ content: ""; border-right: 18px solid #04bffe; border-top: 18px solid transparent; border-bottom: 18px solid transparent; position: absolute; top: 0; left: -18px; } .main-timeline .timeline-content{ width: 46.5%; margin: 0 20px 0 0; background: #f1f1f1; position: relative; } .main-timeline .timeline-content:after{ content: ""; border-left: 20px solid #f1f1f1; border-top: 20px solid transparent; border-bottom: 20px solid transparent; position: absolute; top: 50%; right: -20px; transform: translateY(-50%); } .main-timeline .timeline-content .timeline-header{ padding: 15px; } .main-timeline .timeline-content .inner-timeline{ position: relative; } .main-timeline .timeline-content .inner-timeline .timeline-social{ position: absolute; left: 0; top: 50%; transform: translate(-50%,-50%); font-size: 30px; background-color: #fff; color: #000; width: 70px; height: 70px; text-align: center; border-radius: 50%; padding: 20px 0; box-shadow: 0px 0px 10px 1px #dadada; transition: 0.5s all linear; } .main-timeline .timeline-content .inner-timeline:hover .timeline-social{ color: #fff; } .main-timeline .timeline-content .timeline-header, .main-timeline .timeline-content .inner-timeline:hover .timeline-social, .main-timeline .timeline-icon:before, .main-timeline .year{ background-color: #04bffe; } .main-timeline .timeline:nth-child(2n) .timeline-content .inner-timeline .timeline-social{ right: 0; position: absolute; left: inherit; transform: translate(50%,-50%); } .main-timeline .title{ float: left; font-size: 24px; font-weight: bold; color: #fff; margin: 0 20px 20px 0; } .main-timeline .post{ display: inline-block; font-size: 14px; color: #fff; margin-top: 6px; } .main-timeline .description{ font-size: 14px; color: #000; line-height: 24px; margin: 0; padding: 15px 50px; } .main-timeline .timeline:nth-child(2n){ padding: 0 0 0 30px; } .main-timeline .timeline:nth-child(2n) .year{ right: auto; left: 30%; } .main-timeline .timeline:nth-child(2n) .year:before{ border: 18px solid transparent; border-right: none; border-left: 18px solid #04bffe; left: auto; right: -18px; } .main-timeline .timeline:nth-child(2n) .timeline-content{ float: right; margin: 0 0 0 20px; } .main-timeline .timeline:nth-child(2n) .timeline-content:after{ border-left: none; border-right: 20px solid #f1f1f1; right: auto; left: -20px; } @media only screen and (max-width: 1200px){ .main-timeline .year{ right: 25%; } .main-timeline .timeline:nth-child(2n) .year{ left: 25%; } } @media only screen and (max-width: 990px){ .main-timeline .year{ right: 18%; } .main-timeline .timeline:nth-child(2n) .year{ left: 18%; } } @media only screen and (max-width: 767px){ .main-timeline:before{ left: 10px; } .main-timeline .timeline{ padding: 0 0 0 30px; margin-bottom: 20px; } .main-timeline .timeline:last-child{ margin-bottom: 0; } .main-timeline .timeline:first-child:before, .main-timeline .timeline:last-child:before{ display: none; } .main-timeline .timeline-icon{ margin: 0; position: absolute; top: 7px; left: 0; } .main-timeline .year, .main-timeline .timeline:nth-child(2n) .year{ display: block; font-weight: bold; margin: 0 0 32px 30px; z-index: 1; position: relative; top: auto; left: auto; right: auto; transform: none; } .main-timeline .timeline:nth-child(2n) .year:before{ border-left: none; border-right: 18px solid #04bffe; right: auto; left: -18px; } .main-timeline .timeline-content{ padding: 20px; } .main-timeline .timeline-content, .main-timeline .timeline:nth-child(2n) .timeline-content{ width: auto; float: none; margin: 0 0 0 30px; } .main-timeline .timeline-content:after, .main-timeline .timeline:nth-child(2n) .timeline-content:after{ border: none; border-bottom: 20px solid #f2f2f2; border-left: 20px solid transparent; border-right: 20px solid transparent; top: -20px; left: 50%; right: auto; transform: translateX(-50%); } .main-timeline .timeline-content .inner-timeline .timeline-social{ display: none; } .main-timeline .description { padding: 10px 0; } } @media only screen and (max-width: 480px){ .main-timeline .title{ float: none; margin: 0; } .main-timeline .year, .main-timeline .timeline:nth-child(2n) .year{ margin-left: 20px; } .main-timeline .timeline-content, .main-timeline .timeline:nth-child(2n) .timeline-content{ margin-left: 10px; } .main-timeline .post{ margin: 5px 0; } } /*------ Project-detials -------*/ .project-detials{ color:#000; padding: 15px 0; } .project-info h3, .Related-Projects h3, .project-detials h3{ padding-bottom: 5px; border-bottom: 1px solid; display: inline-block; } .project-detials p{ margin: 20px 0; } .project-info{ color: #000; } .project-info-box{ padding: 15px 0; } .project-info-box h4{ color:#000; padding: 10px 0; } .project-info-box li{ padding:5px 0; line-height: 2; } .project-info-box p{ display: initial; position: absolute; color: #000; line-height: 1.4; padding-top: 5px; } .project-info-box .aside-text { display: inline-block; width: 120px; font-weight: 700; color: #333; } .project-info-box li i { position: relative; top: 1px; width: 14px; text-align: center; margin-right: 7px; } .Related-Projects{ color: #000; padding: 50px 15px; } /*------ Breadcrumbs -------*/ .breadcrumb { padding: 30px 16px 0; text-align: center; margin-top: -25px; list-style: none; background-color: transparent; } .breadcrumb ul li { display: inline; font-size: 18px; color:#cacaca; } .breadcrumb ul li+li:before { padding: 8px; color: #fff; content: "/\00a0"; } .breadcrumb ul li a { color: #fff; text-decoration: none; } .breadcrumb ul li a:hover { color: #4481eb; /* text-decoration: underline;*/ } .section-content{ padding:100px 0; } .custom-logo{ border: 0; padding: 0 } .article-info .author-name{ color:#8c8c8c; } .search-form label{ border: 1px solid rgba(244, 244, 244, 0.8); background: #ffffff; box-shadow: 1px 1.7px 2px 0px rgba(0, 0, 0, 0.1); border-radius: 0; line-height: 48px; height: auto; padding: 0 20px; display: block; position: relative; } .search-form .form-control { border: 0; box-shadow: none; font-weight: 400; padding:13px 0; height:auto; } .search-form input[type=submit]{ background: transparent none repeat scroll 0 0; content: '\f002'; border: medium none; color:#8d8d8d; font-size: 18px; position: absolute; right:0; width: auto; top: 0; height: 100%; padding: 0 20px; font-family: 'fontawesome'; transition: all .3s ease; } .search-form input[type=submit]:hover{ color: #333; } .search-form{ position: relative; } .widget{ margin-bottom: 50px; } .gallery-item{ display: inline-block; width: calc(100%/3); padding: 3px; } img { max-width: 100%; height: auto; } .footer .widget h4{ font-size: 20px; color: #fff; letter-spacing: 1px; padding-bottom: 30px; } .widget .cat-item .widget_pages { line-height: 2.0; position: relative; text-align: right; padding: 1px 10px; clear: both; margin: 2px 0; text-transform: capitalize; transition: all .3s ease; font-size: 16px; } .widget_categories li,.widget_archive li{ position: relative; text-align: right; padding: 1px 10px; clear: both; margin: 2px 0; text-transform: capitalize; transition: all .3s ease; font-size: 16px; } .widget .cat-item::after,.widget_cat li,.widget_archive li::after{ content: ""; display: table; clear: both; } .sidebar .widget .cat-item a{ float: left; clear: both; } .widget_categories li a,.widget_archive li a{ float: left; clear: both; } .widget_recent_entries ul li .post-date, .rss-date{ display: block; } table thead tr{ background-color: lightgray; } table ,td,th{ border: 1px solid #000; text-align: center; } table { border-collapse: collapse; border-spacing: 0; width: 100%; background-color: transparent; } td, th { padding: 0.4em; } td{ font-weight: 400; } td a,th,tbody td{ color:#000; } #prev a,#next a,th{ color:#4481eb; } #prev a:hover,#next a:hover{ color:#000; } .widget li{ font-size: 16px; padding-top: 10px; } .post-date,.recentcomments{ color:#cac8c8; } .comment-reply-link{ color:#04bffe; margin-top: 10px; display: block; font-size: 14px; font-weight: 700; margin-left: 112px; } .commentlist .children { margin-left: 80px; margin-top: 40px; margin-bottom: 40px; } .comment-author-v2 a{ display: block; width:80px; } .comment-metadata{ margin-top: 28px; } .comment-content{ margin: -43px 0 -15px 100px; padding: 12px; } .post-img-v2 img{ width:100%; } .comment-author{ text-transform: capitalize; margin-top: -6px; } .comment-reply-title{ margin-top: 72px; } .submit{ width: } .says{ visibility: hidden; } .tagcloud a { border: 2px solid #e0e0e0; background: none; box-shadow: none; color: #666666; font-size: 14px !important; font-weight: 400; line-height: 36px; padding: 0 15px; border-radius: 30px; display: inline-block; margin-top: 10px; margin-right: 5px; text-transform: capitalize; transition: all .3s ease; } .tagcloud a:hover { color:#fff; background-color: #04bffe; border-color: #04bffe; } .bgcolor-gray .section-common-space{ background-image: url("/assets/img/header-img.jpg "); } .footer .tagcloud a { color:#fff; border: 2px solid #d4d4d4; } .footer .widget .search-form input[type=search]{ background: transparent; color: #fff; } .footer .widget .search-form input[type=submit]{ color: #fff; } .footer .widget .search-form input[type=submit]:hover{ color: #ccc; transition: 0.5s ease all; } .footer .widget .search-form ::-moz-placeholder{color:#fff;opacity:1} .footer .widget .search-form :-ms-input-placeholder{color:#fff} .footer .widget .search-form ::-webkit-input-placeholder{color:#fff} .footer .widget .search-form label{ background:transparent; } .footer .cat-item a{ float: left; clear: both; left: 0; } .footer .cat-item ,.footer li{ position: relative; clear:both; } .footer .children{ padding: 0 15px; } .footer .widget li a{ color:#fff; font-size: 14px; } .footer .widget li a:hover{ color:#04bffe; } .footer table ,.footer td,.footer th{ border: 1px solid #fff; text-align: center; } .footer td a,.footer th,.footer tbody td{ color:#fff; } .footer #prev a,.footer #next a,.footer th{ color:#4481eb; } .footer #prev a:hover,.footer #next a:hover{ color:#ccc; } .footer caption{ color: #ccc; } .footer .widget li{ padding:5px; } .footer .postform,.footer select{ display: block; background: transparent; width: 100%; padding: 10px; } .footer .postform option,.footer option{ background: transparent; color:#000; } .postform, select{ display: block; background: #fff; width: 100%; padding: 10px; } .screen-reader-text { display: none; } .nav-links .page-numbers{ border: none; padding: 5px 17px 4px; font-size: 18px; margin: 0 2px; background: none; border-radius: 2px; color: #000; transition: .3s all ease; } .page-numbers.current,.page-numbers:hover{ background-color: #04bffe; color:#fff; } .major-color a{ color:#04bffe; } .major-color a:hover{ color: #8c8c8c; } .page-img-v2 img{ width:100%; } .m-b-30 p{ margin-bottom: 30px; } .post-info-v2 ul li,.section-content ul li{ list-style-type: disc; font-size: 18px; font-weight: 300; margin: 0; line-height: 1.71; color: #666666; font-family: 'roboto', sans-serif; margin-left: 20px; } .post-info-v2 ol,.section-content ol,.post-info-v2 ul,.section-content ul{ margin:20px 0; } .post-info-v2 ol li,.section-content ol li{ list-style-type: decimal; font-size: 18px; font-weight: 300; margin: 0; line-height: 1.71; color: #666666; font-family: 'roboto', sans-serif; margin-left: 20px; } .post-info-v2 .article-info li{ font-size: 15px; margin:0; } .post-info-v2 .tag-clouds a { font-size: 14px; font-weight: 400; text-transform: capitalize; color: #a6a6a6; margin-top: 10px; margin-right: 5px; line-height: 32px; border: 2px solid #e0e0e0; background: none; box-shadow: none; padding: 0 15px; display: inline-block; border-radius: 30px; transition: all .3s ease; } .post-info-v2 .tag-clouds a:hover { color: #fff; border-color: #04bffe; background-color: #04bffe; } .error h2{ font-size: 60px; font-weight: 700; color: #fb781f; } .error .btn.btn-info{ background-color: #fb781f; color: #fff; } .error .btn.btn-info:hover{ background-color: #222734; border-color:#222734; } .error h3{ color:#222734 } .section-content{ padding: 100px 0; } .section-content p{ font-size: 18px; font-weight: 300; color: #666666; } .section-content blockquote{ border-left-color: #e0e0e0; border-width: 2px; position: relative; padding: 0 22px; margin: 50px; } .section-content blockquote:before { content: "\f10d"; font-family: fontawesome; position: absolute; top: -8px; left: -56px; font-size: 33px; color:#04bffe; } .single-p-post .meta-comments{ color:#8c8c8c; margin:0 10px; } .footer .textwidget p{ color:#fff; } .widget .textwidget p{ font-size: 16px; font-family: 'Montserrat', sans-serif; } .bg-gradient-dark1{ background-color:#232732; } .bg-gradient-dark1 h2{ color:#fff; } .rippleria-ink { position: absolute; background: rgba(255, 255, 255, .2); border-radius: 100%; transform: scale(0); -webkit-transform: scale(0); z-index: 10 } .rippleria-dark .rippleria-ink { background: rgba(0, 0, 0, .2) } @keyframes rippleria { 100% { opacity: 0; transform: scale(2.5) } } @-webkit-keyframes rippleria { 100% { opacity: 0; -webkit-transform: scale(2.5) } } .comment-form-comment{ margin-top:40px; } .comment-form input, .comment-form textarea { border: none; border-bottom: 2px solid #e0e0e0; line-height: 40px; font-size: 16px; border: none; border-bottom: 2px solid #e0e0e0; line-height: 30px; font-size: 16px; display: block; margin-bottom: 30px; width: 100%; } .comment-form .submit{ background-color: #04bffe; line-height: 45px; padding: 0 35px; font-size: 14px; color: #fff; border: 0px; border-radius: 30px; width: 155px; } .comment-form .label { display: inline-block; max-width: 100%; margin-bottom: 5px; color: #b9b9b9; font-size: 21px; } h1, h2, h3, h4, h5, h6{ font-weight: 600; margin: 0 0 25px; color:#04bffe; } .text-light-gray { color: #d6d5d5; } .page-content ul, .page-content li{ list-style-type: inherit; list-style-position: inside; list-style-image: inherit; margin: 10px 0; padding: 0 } .page-content ol{ margin: 10px 0; padding: 0 } .page-content ul ul, .page-content ol ol{ padding-left:30px } /* Accessibility */ /* Text meant only for screen readers. */ .skip-link.screen-reader-text { display: block; border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */ } .skip-link.screen-reader-text:focus { background-color: #f1f1f1; border-radius: 3px; box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; clip-path: none; color: #21759b; display: block; font-size: 14px; font-weight: bold; height: auto; right: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; /* Above WP toolbar. */ } /* Do not show the outline on the skip link target. */ #content[tabindex="-1"]:focus { outline: 0; } #header.sticky-header.box-header .logos .site-description { margin-top:-15px !important; } .logos .site-description{ font-size: 12px; } /* .main-nav ul li.has-child.on-focus .dropdown li.has-child.on-focus > .dropdown.left-indent , .main-nav ul li.on-focus .dropdown li.on-focus > .dropdown-items , .main-nav > ul > li.on-focus > ul { opacity: 1; visibility: visible; -webkit-transform: scale(1, 1); transform: scale(1, 1); color: #04bffe; } */ @media only screen and (max-width: 601px) { .img-logos{ } .logos .site-description { font-size: 9px; margin-top: -15px; } #header.box-header.sticky-header .box-header-wrap { margin-top: 0px; } body.offcanvas .offcanvas-overlay { opacity: 1; visibility: visible; z-index: 990; } .offcanvas-overlay { content: ""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; opacity: 0; visibility: hidden; background-color: rgba(0,0,0,.8); z-index: 0; -webkit-transition: all .3s; transition: all .3s; } .offcanvas-toggler > i { display: none; padding: 0 0 0 10px; font-size: 30px; background: transparent; margin: 0; line-height: 60px; cursor: pointer; color: #fff; -webkit-transition: all .3s; transition: all .3s; } #header.box-header .offcanvas-toggler>i#offcanvas-opener { color: #000; margin-top: 20px; } .mobile-nav.offcanvas-toggler> i#offcanvas-closer { display: block; font-size: 25px; } .comment-author { margin-right: 22px; font-weight: 700; color: #212121; margin-bottom: -15px; font-size: 20px; } .comment-metadata { margin-top: -30px; margin-left: 69px; } .comment-content { margin: -26px 0 0px 58px; padding: 12px; } .comment-reply-link { color: #04bffe; margin-top: 0px; display: block; font-size: 14px; font-weight: 700; margin-left: 70px; } } h2.trail-browse { display: none; } .comment .fn{ color: #04bffe; } @media screen and (max-width: 992px){ .blog.logged-in { margin-top: -46px !important; } /* Additional */ .title-seprater:before { transform: rotate(0deg) !important; } @media screen and (max-width: 782px){ body { margin-top: -50px; } } .comment-form textarea:focus { outline: 2px solid #04bffe; }