/** * Name: Dailist * Version: 1.0 * Author: Themesflat * Author URI: http://www.themesflat.com */ @import url("themify-icons.css"); @import url("font-awesome.css"); @import url("elegant.css"); @import url("shortcodes.css"); @import url("animate.min.css"); @import url("owl.carousel.css"); @import url('https://fonts.googleapis.com/css?family=Montserrat:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i|Playfair+Display:400,400i,700,700i,900,900i'); /** * Reset * Repeatable Patterns * Header * Main Navigation * Mobile navigation * Show Search * Page Title * Flat Main Blog * Flat Subscribe * Footer * Footer Bottom * Main Single * Preloader */ /* Reset -------------------------------------------------------------- */ html { overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } body { line-height: 1; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, caption, canvas, center, cite, code, dd, del, details, dfn, dialog, div, dl, dt, em, embed, fieldset, figcaption, figure, form, footer, header, hgroup, h1, h2, h3, h4, h5, h6, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav,object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, tt, table, tbody, textarea, tfoot, thead, time, tr, th, td, u, ul, var, video { font-family: inherit; font-size: 100%; font-weight: inherit; font-style: inherit; vertical-align: baseline; margin: 0; padding: 0; border: 0; outline: 0; background: transparent; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } ol, ul { list-style: none; } blockquote, q { -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none; quotes: none; } figure { margin: 0; } :focus { outline: 0; } table { border-collapse: collapse; border-spacing: 0; } img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; } legend { white-space: normal; } button, input, select, textarea { font-size: 100%; margin: 0; max-width: 100%; vertical-align: baseline; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } button, input { line-height: normal; } input, textarea { background-image: -webkit-linear-gradient(hsla(0,0%,100%,0), hsla(0,0%,100%,0)); /* Removing the inner shadow, rounded corners on iOS inputs */ } button, input[type="button"], input[type="reset"], input[type="submit"] { line-height: 1; cursor: pointer; /* Improves usability and consistency of cursor style between image-type 'input' and others */ -webkit-appearance: button; /* Corrects inability to style clickable 'input' types in iOS */ border: none; } input[type="checkbox"], input[type="radio"] { padding: 0; /* Addresses excess padding in IE8/9 */ } input[type="search"] { -webkit-appearance: textfield; /* Addresses appearance set to searchfield in S5, Chrome */ } input[type="search"]::-webkit-search-decoration { /* Corrects inner padding displayed oddly in S5, Chrome on OSX */ -webkit-appearance: none; } button::-moz-focus-inner, input::-moz-focus-inner { /* Corrects inner padding and border displayed oddly in FF3/4 www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/ */ border: 0; padding: 0; } *, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* Repeatable Patterns -------------------------------------------------------------- */ *, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } body { font: 14px/24px "Montserrat", sans-serif; background-color: #fff; color: #2c3e50; overflow: hidden; font-weight: 300; } a { text-decoration: none; color: #2c3e50; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } a:hover, a:focus { color: #073f90; text-decoration: none; outline: 0; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } ul, ol { padding: 0; } img { max-width: 100%; height: auto; } b, strong { font-weight: 900; } button, button:hover { border: none;} button, input[type="button"], input[type="reset"], input[type="submit"] { display: inline-block; color: #fff; padding: 0px 27px 0 27px; height: 50px; line-height: 48px; font-size: 14px; color: #fff; background: #073f90; -webkit-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px; -moz-border-radius: 20px; border-radius: 4px; font-weight: 400; font-family: "Montserrat", sans-serif; position: relative; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; letter-spacing: 0.5px; } button.search-submit-form { position: absolute; right: 2px; top: 7px; padding: 0px 10px; color: #2c3e50; background-color: transparent; display: inline-block; height: 29px; line-height: 31px; font-size: 14px; border-color: transparent; border-left: 1px solid #073f90; text-transform: uppercase; font-weight: 700; border-radius: 0; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], input[type="email"] { position: relative; display: block; width: 100%; line-height: 24px; padding: 8px 18px; color: #2c3e50; border: 1px solid #073f90; height: 48px; background-color: transparent; margin-bottom: 19px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } input[type="search"] { width: 250px; margin-bottom: 0px; border-radius: 0px; background-color: #ffffff; } input[type="email"] { padding: 8px 14px; color: #2c3e50; border: 1px solid #073f90; margin-bottom: 20px; } textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus { border: 1px solid #073f90; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } textarea { width: 100%; padding: 11px 18px; height: 173px; } input[type="checkbox"] { display: inline; } textarea:-moz-placeholder, textarea::-moz-placeholder, input:-moz-placeholder, input::-moz-placeholder { color: #fff; opacity: 1; } input:-ms-input-placeholder { color: #fff; } textarea::-webkit-input-placeholder, input::-webkit-input-placeholder { color: #fff; opacity: 1; } /* bootstrap resetting elements */ .btn { background-image: none; } select, textarea, input[type="text"], input[type="submit"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input, .dropdown-menu, .navbar .nav > .active > a, .navbar .nav > .active > a:hover, .navbar .nav > .active > a:focus { -webkit-appearance: none; -moz-appearance: none; appearance: none; text-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none; -o-box-shadow: none; box-shadow: none; color: #727272; } select::-ms-expand { /* IE 8 */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE 5-7 */ filter: alpha(opacity=0); /* Good browsers :) */ opacity:0; } h1, h2, h3, h4, h5, h6 { font-family: 'Montserrat', sans-serif; font-weight: 400; } h1 { font-size: 32px; line-height: 66px; } h2 { font-size: 30px; line-height: 24px; } h3 { font-size: 24px; line-height: 24px; font-weight: 500; } h4 { font-size: 16px; line-height: 24px; } .clearfix { clear: both; } .left { text-align: left; } .center { text-align: center; } .background-color { background-color: #f5f5f5; } /* Header -------------------------------------------------------------- */ .header { background-color: #fff; position: relative; z-index: 9999; box-shadow: 0px 0px 27px 0px rgba(0, 0, 0, 0.07); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; margin-bottom: 15px; } /* Header Fix */ .header.downscrolled { position: fixed; background-color: rgba(255, 255, 255, 1); box-shadow: 0px 0px 27px 0px rgba(0, 0, 0, 0.07); top: -100px; opacity: 0; width: 100%; left: 0; z-index: 9999; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0); filter: alpha(opacity=0); visibility: hidden; -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .header.upscrolled { opacity: 1; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100); filter: alpha(opacity=100); visibility: visible; top: 0; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; -ms-transition: all 0.8s ease-in-out; -o-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } /* logo */ #logo { float: left; margin-top: 38px; margin-left: 52px; } #logo a { font-size: 30px; color: #073f90; font-family: 'Playfair Display'; font-weight: bold; } /* Navigation Wrap */ .nav-wrap { float: right; margin-right: 43px; } /* Main Navigation -------------------------------------------------------------- */ .mainnav, .button-header, .show-search { display: inline-block; } #mainnav ul.menu > li { display: inline-block; position: relative; } #mainnav ul.menu > li { margin-right: 44.5px; } #mainnav ul.menu > li:last-child { margin-right: 46px; } #mainnav ul.menu > li > a { line-height: 100px; font-size: 16px; } /* Submenu */ #mainnav .menu > li > .submenu { opacity: 0; z-index: 9999; position: absolute; width: 250px; background-color: #222; top: 150px; left: 0; visibility: hidden; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #mainnav .menu > li:hover > .submenu { opacity: 1; z-index: 1; top: 100px; visibility: visible; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #mainnav .menu > li > .submenu > li:not(:first-child) { border-top: 1px solid #333; } #mainnav .menu > li > .submenu > li > a { color: #999; display: block; padding: 0px 0px 0px 15px; line-height: 50px; } #mainnav .menu > li > .submenu > li > a:hover { background-color: #073f90; color: #fff; padding-left: 25px; } /* Mobile navigation -------------------------------------------------------------- */ #mainnav-mobi { display: block; margin: 0 auto; width: 100%; position: absolute; left: 0; z-index: 10000; background-color: #2c3e50; } #mainnav-mobi ul { display: block; list-style: none; margin: 0; padding: 0; } #mainnav-mobi ul li { margin:0; position: relative; text-align: left; border-top: 1px solid #ebebeb; cursor: pointer } #mainnav-mobi ul > li > a { text-decoration: none; height: 50px; line-height: 50px; padding: 0 30px; color: #fff; } #mainnav-mobi ul.submenu { top: 100%; left: 0; z-index: 2000; position: relative; background-color: #2c3e50; } #mainnav-mobi > ul > li > ul > li { position: relative; border-top: 1px solid #ebebeb; } #mainnav-mobi ul.submenu > li > a { display: block; text-decoration: none; padding: 0 60px; border-top-color: rgba(255,255,255,.1); -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } #mainnav-mobi > ul > li > ul > li:first-child a { border-top: none; } #mainnav-mobi ul.sub-menu > li > a:hover, #mainnav-mobi > ul > li > ul > li.active > a { color: #fff; } /* Button menu mobile */ .btn-menu { display: none; position: relative; background: transparent; cursor: pointer; float: right; top: 37px; width: 25px; height: 25px; z-index: 9999; -webkit-transition: all ease .238s; -moz-transition: all ease .238s; transition: all ease .238s; } .btn-menu:before, .btn-menu:after, .btn-menu span { background-color: #073f90; -webkit-transition: all ease .238s; -moz-transition: all ease .238s; transition: all ease .238s; } .btn-menu:before, .btn-menu:after { content: ''; position: absolute; height: 2px; width: 25px; left: 0; top: 50%; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } .btn-menu span { position: absolute; width: 25px; height: 2px; left: 0; top: 50%; overflow: hidden; text-indent: 200%; } .btn-menu:before { -webkit-transform: translate3d(0, -7px, 0); transform: translate3d(0, -7px, 0); } .btn-menu:after { width: 25px; -webkit-transform: translate3d(0, 7px, 0); transform: translate3d(0, 7px, 0); } .btn-menu.active:after { width: 25px; } .btn-menu.active span { opacity: 0; } .btn-menu.active:before { -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); } .btn-menu.active:after { -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); } .btn-submenu { position: absolute; right: 20px; top: 0; font: 20px/50px 'FontAwesome'; text-align: center; cursor: pointer; width: 50px; height: 44px; } .btn-submenu:before { content: "\f107"; color: #ffffff; } .btn-submenu.active:before { content: "\f106" } /* Button Header */ .button-header { margin: 0 23px 0 10px; } .button-header a { color: #073f90; font-size: 16px; padding: 12px 25px; border: 1px solid #073f90; border-radius: 25px; position: relative; display: block; background-color: #fff; -webkit-transition: all .8s cubic-bezier(.3,.95,.3,.95); -moz-transition: all .8s cubic-bezier(.3,.95,.3,.95); transition: all .8s cubic-bezier(.3,.95,.3,.95); } .button-header a:before { content: ''; position: absolute; background-color: #073f90; width: 100%; height: 100%; top: 0; left: 0; display: block; opacity: 1; z-index: -1; visibility: visible; border-radius: 25px; -webkit-transition: all .8s cubic-bezier(.3,.95,.3,.95); -moz-transition: all .8s cubic-bezier(.3,.95,.3,.95); transition: all .8s cubic-bezier(.3,.95,.3,.95); } .button-header a:hover:before { opacity: 0; visibility: hidden; transform: scale(1.15); } .button-header a:hover { background-color: #073f90; color: #fff; } .button-header a i { font-size: 12px; margin-right: 17px; margin-left: 3px; } /* Show Search ---------------------------------------------------------------*/ .show-search { float: right; margin-left: 21px; } .show-search > button { background-color: transparent; font-size: 18px; padding: 0; color: #2c3e50; border-color: transparent; height: 35px; line-height: 35px; width: 35px; display: block; border-radius: 50%; margin: 35px 0 30px; position: relative; } .show-search > button:hover { color: #247abb; } .show-search .top-search { position: absolute; visibility: hidden; z-index: 9; right: 13px; top: 150px; width: 250px; opacity: 0; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .show-search .top-search.active { top: 100px; visibility: visible; z-index: 99; opacity: 1; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } /* Page Title -------------------------------------------------------------- */ .page-title { padding: 38px 0 56px; position: relative; text-align: center; color: #ffffff; } .page-title .page-title-heading { font-family: 'Playfair Display'; font-weight: bold; font-size: 36px; line-height: 72px; margin-bottom: 10px; } .page-title ul.breadcrumbs li { display: inline-block; font-size: 16px; } .page-title ul.breadcrumbs li:not(:first-child) { padding-right: 0px; padding-left: 5px; } .page-title ul.breadcrumbs li a { color: #ffffff; padding-right: 5px; } .page-title ul.breadcrumbs li a:hover { text-decoration: underline; } .page-title ul.breadcrumbs li span { font-size: 12px; } /* Flat Main Blog -------------------------------------------------------------- */ .flat-main-blog { padding: 70px 0 80px; } /* Article Blog Post */ article.blog-post { background-color: #ffffff; box-shadow: 0px 7px 16px 0px rgba(0, 0, 0, 0.09); min-height: 430px; } article.blog-post .featured-post { padding: 10px; } article.blog-post .featured-post a { display: block; position: relative; overflow: hidden; } article.blog-post .featured-post a .overlay { position: absolute; width: 100%; height: 100%; left: 0; top: 0; opacity: 0; background-color: rgba(76, 161, 175, 0.5); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } article.blog-post .featured-post a img { -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } article.blog-post:hover .featured-post a .overlay { opacity: 1; } article.blog-post:hover .featured-post a img { transform: scale(1.15); } article.blog-post .content-post { padding: 0 20px 5px; position: relative; } article.blog-post .content-post .entry-post ul.entry-meta { margin: 2px 0 0 2px; } article.blog-post .content-post .entry-post ul.entry-meta li.topic { float: left; font-family: 'Playfair Display'; } article.blog-post .content-post .entry-post ul.entry-meta li.date { text-align: right; line-height: 23px; } article.blog-post .content-post .entry-post ul.entry-meta li a { color: #c2c2c2; font-size: 12px; } article.blog-post .content-post .entry-post h2.entry-title { font-size: 18px; font-weight: 500; margin-top: 9px; margin-bottom: 20px; } article.blog-post .content-post p { font-size: 14px; left: 21px; right: 25px; position: absolute; top: 93px; } article.blog-post .content-post .author-post { color: #c2c2c2; font-size: 12px; margin-top: 20px; line-height: 30px; position: absolute; top: 181px; } article.blog-post .content-post .author-post a:not(:hover) { color: #c2c2c2; } .height50 { height: 50px; } /* Flat Subscribe -------------------------------------------------------------- */ .flat-subscribe { background: url("../images/blog/bg-01.png") top center no-repeat; padding: 47px 0 56px; } .flat-subscribe .subscribe-text { font-size: 16px; line-height: 72px; color: #ffffff; letter-spacing: 0.06px; } .flat-subscribe .subscribe-form form .subscribe-content .input-field input { border-color: transparent; border-bottom: 1px solid #fff; color: #fff; height: 40px; font-size: 16px; height: 50px; padding: 17px 1px 0; } .flat-subscribe .subscribe-form form .subscribe-content .input-field { position: relative; margin-top: 2px; } .flat-subscribe .subscribe-form form .subscribe-content button { background-color: transparent; position: absolute; right: 12px; top: 13px; color: #fff; padding: 0; } .flat-subscribe .subscribe-form form .subscribe-content button span { font-size: 18px; } /* Footer -------------------------------------------------------------- */ footer, .footer-bottom { background-color: #2c3e50; } footer { padding: 56px 0 59px; color: #fff; } /* Widget About */ .widget-about .logo-ft { margin-bottom: 4px; } .widget-about .logo-ft a { font-size: 30px; font-family: 'Playfair Display'; font-weight: bold; color: #073f90; line-height: 72px; } .widget-about p { font-size: 14px; } /* Widget Categories */ .widget-categories { margin-left: -1px; } .widget-categories h3.widget-title, .widget-contact h3.widget-title { margin-bottom: 24px; margin-top: 28px; } .widget-categories ul.one-half { float: left; padding-right: 30px; } .widget-categories ul.one-half li a { color: #fff; font-size: 14px; } .widget-categories ul.one-half li a:hover { color: #073f90; } /* Widget Contact */ .widget-contact h3.widget-title { margin-bottom: 26px; margin-left: 3px; } .widget-contact ul.contact-infomation li { font-size: 14px; padding-left: 29px; position: relative; } .widget-contact ul.contact-infomation li:before { content: '\f041'; position: absolute; font-family: 'fontawesome'; top: 0px; left: 1px; font-weight: 400; } .widget-contact ul.contact-infomation li.phone:before { content: '\f095'; } .widget-contact ul.contact-infomation li.email:before { content: '\f003'; } /* Widget Map */ .widget-map { margin-top: 21px; } /* Footer Bottom -------------------------------------------------------------- */ .footer-bottom { border-top: 1px solid #4a5867; padding: 19px 0; } .footer-bottom .copyright { color: #c2c2c2; float: left; } .footer-bottom .copyright a:not(:hover) { color: #c2c2c2; } .footer-bottom ul.social-ft { float: right; } .footer-bottom ul.social-ft li { display: inline-block; margin-left: 31px; } .footer-bottom ul.social-ft li:first-child { margin-left: 0px; } .footer-bottom ul.social-ft li a:not(:hover) { color: #c2c2c2; } /* Main Single -------------------------------------------------------------- */ .main-single { padding: 80px 0 80px; } /* Article Post Single */ article.post-single .featured-post { box-shadow: 0px 7px 16px 0px rgba(0, 0, 0, 0.09); margin-bottom: 30px; } article.post-single .featured-post img { border-radius: 6px; } article.post-single .entry-post { padding: 71px 85px 25px; box-shadow: 0px 6px 16px 0px rgba(0, 0, 0, 0.09); text-align: center; border-radius: 10px; } article.post-single .entry-post .entry-header { padding-bottom: 25px; margin-bottom: 24px; border-bottom: 1px solid #ededed; } article.post-single .entry-post .entry-header h2.entry-title { font-weight: bold; font-family: 'Playfair Display'; margin-bottom: 28px; } article.post-single .entry-post .entry-header .entry-meta-post li { font-size: 12px; color: #c2c2c2; font-weight: 300; } article.post-single .entry-post .entry-header .entry-meta-post li.topic { font-family: 'Playfair Display'; font-weight: 400; } /* Entry Post */ .entry-post .entry-content { padding: 0 70px 45px; } .entry-post .entry-content .entry-answer .question { font-size: 16px; font-weight: 400; } .entry-post .entry-content .entry-answer { margin-bottom: 12px; padding: 0 15px; } .entry-post .entry-content .entry-answer .reply span { line-height: 36px; } .entry-post ul.social { padding-top: 27px; position: relative; } .entry-post ul.social:before { content: ''; position: absolute; top: 0; left: 50%; width: 370px; height: 1px; background-color: #ededed; margin-left: -185px; } .entry-post ul.social li { display: inline-block; padding: 0 16px 0 15px; } .entry-post ul.social li a:not(:hover) { color: #c2c2c2; } /* Main Single Comment */ .main-single-comment { padding-top: 77px; } /* Comment Area */ .comment-area .comment-title { font-weight: bold; font-family: 'Playfair Display'; margin-bottom: 63px; } .comment-area ol.comment-list li.comment:not(:last-child) { margin-bottom: 30px; } .comment-area article.comment-body .comment-image { width: 70px; border-radius: 50%; overflow: hidden; float: left; margin-right: 31px; } .comment-area article.comment-body .comment-content { overflow: hidden; } .comment-area article.comment-body .comment-content .comment-metadata { color: #c2c2c2; font-size: 12px; line-height: 16px; } .comment-area article.comment-body .comment-content h5 { font-weight: 500; font-size: 16px; margin: 6px 0 4px; } .comment-area article.comment-body .comment-content .comment-author { color: #c2c2c2; } .comment-area article.comment-body .comment-content .comment-author a { color: #2c3e50; } .comment-area article.comment-body .comment-content p { margin: 22px 0 24px; } .comment-area article.comment-body .comment-content .comment-like ul { float: left; } .comment-area article.comment-body .comment-content .comment-like ul li { display: inline-block; padding-right: 18px; } .comment-area article.comment-body .comment-content .comment-like ul li a i { font-size: 16px; margin-right: 9px; } .comment-area article.comment-body .comment-content .comment-like .comment-reply { float: right; } .comment-area .load-more { text-align: center; margin-top: 56px; font-weight: 400; } .comment-area .load-more a { padding: 13px 0 11px; display: block; border: 1px solid #ededed; border-radius: 4px; font-size: 16px; font-weight: 400; } .comment-area .load-more a:hover { color: #fff; background-color: #073f90; } /* Comment Respond */ .comment-respond { margin-top: 46px; } .comment-respond .comment-reply-title { font-family: 'Playfair Display'; font-weight: bold; margin-bottom: 24px; font-size: 24px; } .comment-respond form .comment-form-email, .comment-respond form .comment-form-title { float: left; width: 50%; } .comment-respond form .comment-form-email { padding-right: 15px; } .comment-respond form .comment-form-title { padding-left: 15px; } .comment-respond form div input, .comment-respond form div textarea { border-radius: 4px; } .comment-respond form div input { height: 50px; margin-bottom: 16px; color: #2c3e50; } .comment-respond form div input, .comment-respond form div textarea { border-color: #ededed; } .comment-respond form div input:focus, .comment-respond form div textarea:focus { border-color: #c2c2c2; } .comment-respond form div textarea { margin-bottom: 6px; height: 130px; } .comment-respond form div label { font-weight: 400; font-size: 16px; margin-bottom: 3px; } .comment-respond form .submit-form { margin-top: 26px; } .comment-respond form .submit-form button { border-radius: 35px; padding: 0px 56px 0 56px; font-size: 16px; letter-spacing: -0.1px; position: relative; z-index: 99; } .comment-respond form .submit-form button:before { content: ""; position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; border-radius: 30px; background: #073f90; border: 0px solid #073f90; opacity: 1; visibility: visible; z-index: -2; -webkit-transition: all .8s cubic-bezier(.3,.95,.3,.95); -moz-transition: all .8s cubic-bezier(.3,.95,.3,.95); transition: all .8s cubic-bezier(.3,.95,.3,.95); } .comment-respond form .submit-form button:hover:before { opacity: 0; transform: scale(1.2); visibility: hidden; } .comment-respond form .submit-form button:hover, .comment-respond form .submit-form button:visited { color: #fff; background-color: #2c3e50; } /* Reviewer */ .reviewer { margin-left: 69px; padding-left: 30px; margin-top: 3px; border-left: 1px solid #c2c2c2; } .reviewer .reviewer-image img { border-radius: 7px; } .reviewer .reviewer-info { margin: 27px 0 15px; } .reviewer .reviewer-info h5 { margin-bottom: 4px; font-size: 16px; } .reviewer .reviewer-info span { font-size: 12px; color: #c2c2c2; } .reviewer .reviewer-info .social-re { margin-top: 11px; } .reviewer .reviewer-info .social-re li { font-size: 12px; } .reviewer .review-content p { font-size: 12px; } .reviewer .reviewer-info .social-re li { display: inline-block; margin-right: 8px; } .reviewer .reviewer-info .social-re li a:not(:hover) { color: #c2c2c2; } /* Preloader -------------------------------------------------------------- */ .preloader { width: 100%; height: 100%; background-color: #fff; position: fixed; top: 0; left: 0; z-index: 99999; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .clear-loading { text-align: center; margin: 0 auto; position: absolute; top: 50%; left: 50%; margin-top: -50px; margin-left: -50px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .loading-effect-2 { width: 100px; height: 100px; } .loading-effect-2 > span, .loading-effect-2 > span:before, .loading-effect-2 > span:after { content: ""; display: block; border-radius: 50%; border: 2px solid #073f90; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .loading-effect-2 > span { width: 100%; height: 100%; top: 0; left: 0; border-left-color: transparent!important; -webkit-animation: effect-2 2s infinite linear; -moz-animation: effect-2 2s infinite linear; -ms-animation: effect-2 2s infinite linear; -o-animation: effect-2 2s infinite linear; animation: effect-2 2s infinite linear; } .loading-effect-2 > span:before { width: 75%; height: 75%; border-right-color: transparent!important; } .loading-effect-2 > span:after { width: 50%; height: 50%; border-bottom-color: transparent!important; } @-webkit-keyframes effect-2 { from { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes effect-2 { from { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } }