/* Theme Name: Atoz Theme URI: https://dcrazed.com/themes/atoz/ Author: Dcrazed Author URI: https://dcrazed.com/ Description: atoz is a simple and creative personal blog theme for designers, developers who are into blogging. Showcase your freebies easily with this free wordpress blog theme. Version: 1.0.2 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: atoz Tags:blog, three-columns, right-sidebar, custom-logo, full-width-template, theme-options This theme, like WordPress, is licensed under the GPL. /*-------------------------------------------------------------- >>> TABLE OF CONTENTS: ---------------------------------------------------------------- # Normalize # Typography # Elements # Forms # Accessibility # Alignments # Clearings # Widgets # Content ## Posts and pages ## Comments # Infinite scroll # Media ## Captions ## Galleries --------------------------------------------------------------*/ /*-------------------------------------------------------------- # Normalize (bootstrap has reset css) --------------------------------------------------------------*/ /*-------------------------------------------------------------- # Basic --------------------------------------------------------------*/ body, html { font-family: 'Roboto', sans-serif; text-rendering: optimizeLegibility !important; -webkit-font-smoothing: antialiased !important; color: #5a5a5a; } h1 { font-size: 2.6em; line-height: 44px; } h2 { font-size: 2.2em; font-weight: 300; line-height: 42px; } h3 { font-size: 1.8em; font-weight: 400; letter-spacing: normal; line-height: 24px; margin-bottom: 33px; text-transform: uppercase; } h4 { font-size: 1.4em; font-weight: 400; letter-spacing: normal; line-height: 27px; } h5 { font-size: 1em; font-weight: 600; letter-spacing: normal; line-height: 18px; text-transform: uppercase; } h6 { color: #333; font-size: 1em; font-weight: 400; letter-spacing: normal; line-height: 18px; margin: 0 0 14px 0; } p { font-family: 'Roboto', sans-serif; } p.intro { font-size: 16px; margin: 12px 0 0; line-height: 24px; font-family: 'Roboto', sans-serif; } a { color: #FCAC45; } a:hover, a:focus { text-decoration: none; color: #FCAC45; } .section-title hr { border-color: #fcac45; border-width: 4px; width: 60px; float: left; clear: both; } .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } .clearfix { display: inline-block; } * html .clearfix { height: 1%; } .clearfix { display: block; } ul, ol { padding: 0; webkit-padding: 0; moz-padding: 0; } /* Navigation */ .navbar-brand { padding: 0px; /* firefox bug fix */ } .navbar-brand>img { width: 140px; height: auto; } #tf-menu ul { list-style: none; } #tf-menu { padding: 10px; transition: all 0.8s; } #tf-menu.navbar-default { background-color: rgba(0, 0, 0, 0.53); border-color: rgba(231, 231, 231, 0); } #tf-menu a.navbar-brand { text-transform: uppercase; font-size: 22px; color: #fff; font-weight: 900; } #tf-menu.navbar-default ul>li>a { opacity:1; text-transform: uppercase; color: #cdcfd1; font-weight: bold; font-size: 14px; letter-spacing: 1px; position: relative; display: block; padding: 10px 15px; } #tf-menu.navbar-default ul>li:hover{background:#333;} #tf-menu.navbar-default ul>li>a:hover { opacity:0.8; transition: all ease-in-out 400ms; -moz-transition: all ease-in-out 400ms; -webkit-transition: all ease-in-out 400ms } .on { background-color: #222222 !important; padding: 0 !important; } .navbar-brand { padding: 0; } .navbar-brand h3{ font-size:20px; } .navbar-brand span{ vertical-align:-webkit-baseline-middle; vertical-align:-moz-baseline-middle; } .navbar-default ul>.active>a, .navbar-default ul>.active>a:hover, .navbar-default ul>.active>a:focus { color: #FFCC33 !important; background-color: transparent; font-weight: 700; } .navbar-toggle { border-radius: 0; } .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus { background-color: #FCAC45; border-color: #FCAC45; } .navbar-default .navbar-toggle:hover>.icon-bar { background-color: #FFF; } #tf-menu ul { margin:0; } #tf-menu ul li { position: relative; float: left; margin: 0; } #tf-menu ul li.current-menu-item { background: #000; } #tf-menu ul li:hover { background: #000; } #tf-menu ul ul { display: none; position: absolute; top: 100%; left: 0; background: #000; padding: 0; z-index:9; } #tf-menu ul ul li { float: none; width: 250px; padding: 12px; font-size:12px; } #tf-menu ul ul a { line-height: 120%; padding: 10px 15px; color:#fff; } #tf-menu ul ul ul { top: 0; left: 100% } #tf-menu ul li:hover>ul { display: block } /*-------------------------------------------------------------- # Typography --------------------------------------------------------------*/ h1, h2, h3, h4, h5, h6 { clear: both; } p { margin: 0 0 20px; color: #73757d; line-height: 26px; } dfn, cite, em, i { font-style: italic; } abbr, acronym { border-bottom: 1px dotted #666; cursor: help; } mark, ins { background: #fff9c0; text-decoration: none; } big { font-size: 125%; } /*-------------------------------------------------------------- # Elements --------------------------------------------------------------*/ ul, ol { margin: 0 0 1.5em 3em; } li>ul, li>ol { margin-bottom: 0; margin-left: 1.5em; } li { line-height: 22px; } dd { margin: 0 1.5em 1.5em; } img { height: auto; /* Make sure images are scaled correctly. */ max-width: 100%; /* Adhere to container width. */ } figure { margin: 1em 0; /* Extra wide images within figure tags don't overflow the content area. */ } table { margin: 0 0 1.5em; width: 100%; } table{ margin:0 0 20px; padding:0; width:100%; border-collapse:collapse; border-spacing:0; background-color:#fff; border-top:1px solid #ececec} tr th:first-child, tr td:first-child{ border-left-style:solid; border-left-width:1px; border-color:#ececec} tr th:first-child, tr td:first-child{ border-left-style:solid; border-left-width:1px} th{ border-left:medium none; border-style:none solid solid none; border-top:medium none; border-width:medium 1px 1px medium; font-weight:bold; padding:10px; text-align:left; border-color:#ececec} td{border-color:#ececec; border-left:none; border-style:none solid solid none; border-top:medium none; border-width:medium 1px 1px medium; font-size:13px; padding:10px} table tr:nth-child(odd) { background-color: #f7f7f7;} textarea { background: #f5f5f5; border: none; width: 100%; height: 150px; padding-left: 20px; font-weight: 500; margin-bottom: 24px; border-radius: 0; } .tab-content { padding: 20px 0; border-left: 0; border-right: 0; border-bottom: 0; } .nav-tabs { padding-bottom: 16px; border-bottom: 1px solid #ccc; overflow: visible; } .nav-tabs li { display: inline-block; cursor: pointer; } /*Element Reset*/ .breadcrumb, .widget ul { margin-left:0; } /*-------Bootstrap Elements -----------------------*/ .alert { margin-bottom: 24px; border-radius: 0; font-size: 13px; font-weight: 400; letter-spacing: 0.4px; } label { float:none; font-size: 12px; font-weight: 400; text-transform: uppercase; color: #292929; letter-spacing: 1px; display: block; cursor: default; } pre { padding:25px; border-left: 5px solid #FCAC45; } /*-------------------------------------------------------------- # Forms --------------------------------------------------------------*/ .btn { border-radius:2px; border:none; } button, input[type="button"], input[type="reset"], input[type="submit"] { border:none; /* min-width: 150px;*/ font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; border-radius: 10px; text-align: center; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; margin-right: 8px; margin-bottom: 24px; padding: 5px 8px; background: #44484b; color:#fff; } .btn-group>.btn { margin-right:0; } button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover { color:#000; background:#fff; border: 1px solid #000; } button:focus, input[type="button"]:focus, input[type="reset"]:focus, input[type="submit"]:focus, button:active, input[type="button"]:active, input[type="reset"]:active, input[type="submit"]:active { border-color: #aaa #bbb #bbb; } input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"]{ background: #f5f5f5; border: none; width: 100%; height: 50px; padding-left: 20px; font-weight: 500; margin-bottom: 24px; border-radius: 0; } select { height: 50px; background: #f5f5f5; width: 100%; border-radius: 0; border: none; outline: none; padding-left: 20px; position: relative; font-size: 11px; text-transform: uppercase; font-weight: bold; letter-spacing: 1px; color: #777; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; cursor: pointer; } input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="number"]:focus, input[type="tel"]:focus, input[type="range"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="time"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="color"]:focus { color: #111; } .btn-default { color: #fff; background: #fe9c46; } .btn-default:hover { color:#fff; opacity:0.85; } .btn-default.disabled{ background:#fe9c46; } .btn-outline-primary { color: #fff; background-color: transparent; border-color: rgba(255,255,255,0.5); border:1px solid #fff; border-radius: 10px; min-width:140px; } .btn-outline-primary:hover { color: #fff; opacity:0.9; } /*-------------------------------------------------------------- # Accessibility --------------------------------------------------------------*/ /* Text meant only for screen readers. */ .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */ } .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; color: #21759b; display: block; font-size: 14px; font-size: 0.875rem; font-weight: bold; height: auto; left: 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; } /*-------------------------------------------------------------- # Alignments --------------------------------------------------------------*/ .alignleft { display: inline; float: left; margin-right: 2.5em; } .alignright { display: inline; float: right; margin-left: 1.5em; } .aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; } /*-------------------------------------------------------------- # Clearings --------------------------------------------------------------*/ .clear:before, .clear:after, .entry-content:before, .entry-content:after, .comment-content:before, .comment-content:after, .site-header:before, .site-header:after, .site-content:before, .site-content:after, .site-footer:before, .site-footer:after { content: ""; display: table; table-layout: fixed; } .clear:after, .entry-content:after, .comment-content:after, .site-header:after, .site-content:after, .site-footer:after { clear: both; } /*-------------------------------------------------------------- # Widgets --------------------------------------------------------------*/ .widget { margin: 0 0 1.5em; } /* Make sure select elements fit in widgets. */ .widget select { max-width: 100%; } /*---------- Widgets ------------*/ .widget_comment .list-group-item span { display: block; font-style:italic; font-size:12px; } .widget_comment .list-group-item span:after { content:" - " } /*-------------------------------------------------------------- # Content --------------------------------------------------------------*/ /*Custom icon box */ .icons-box2 i { font-size: 64px; width: auto; height: auto; vertical-align: initial; margin-left: 0px; display: block; margin-top: 20px; margin-bottom: 16px; text-align: center; } .icons-box2 { text-align: center; } /*-------------------------------------------------------------- ## Posts and pages --------------------------------------------------------------*/ .sticky { display: block; } .hentry { margin: 0 0 1.5em; } .updated:not(.published) { display: none; } .page-content, .entry-content, .entry-summary { margin: 1.5em 0 0; } .page-links { clear: both; margin: 0 0 1.5em; } /*-------------------------------------------------------------- ## Comments --------------------------------------------------------------*/ .comment-content a { word-wrap: break-word; } .bypostauthor { display: block; } /*-------------------------------------------------------------- # Infinite scroll --------------------------------------------------------------*/ /* Globally hidden elements when Infinite Scroll is supported and in use. */ .infinite-scroll .posts-navigation, /* Older / Newer Posts Navigation (always hidden) */ .infinite-scroll.neverending .site-footer { /* Theme Footer (when set to scrolling) */ display: none; } /* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */ .infinity-end.neverending .site-footer { display: block; } /*-------------------------------------------------------------- # Media --------------------------------------------------------------*/ .page-content .wp-smiley, .entry-content .wp-smiley, .comment-content .wp-smiley { border: none; margin-bottom: 0; margin-top: 0; padding: 0; } /* Make sure embeds and iframes fit their containers. */ embed, iframe, object { max-width: 100%; } /* Make sure logo link wraps around logo image. */ .custom-logo-link { display: inline-block; } .custom-logo-link img{max-width: 150px; object-fit: cover; max-height:150px; } /*-------------------------------------------------------------- ## Captions --------------------------------------------------------------*/ .wp-caption { margin-bottom: 1.5em; max-width: 100%; } .wp-caption img[class*="wp-image-"] { display: block; margin-left: auto; margin-right: auto; } .wp-caption .wp-caption-text { margin: 0.8075em 0; } .wp-caption-text { text-align: center; } /*-------------------------------------------------------------- ## Galleries --------------------------------------------------------------*/ .gallery { margin-bottom: 1.5em; } .gallery-item { display: inline-block; text-align: center; vertical-align: top; width: 100%; } .gallery-columns-2 .gallery-item { max-width: 50%; } .gallery-columns-3 .gallery-item { max-width: 33.33333%; } .gallery-columns-4 .gallery-item { max-width: 25%; } .gallery-columns-5 .gallery-item { max-width: 20%; } .gallery-columns-6 .gallery-item { max-width: 16.66667%; } .gallery-columns-7 .gallery-item { max-width: 14.28571%; } .gallery-columns-8 .gallery-item { max-width: 12.5%; } .gallery-columns-9 .gallery-item { max-width: 11.11111%; } .gallery-caption { display: block; } /* Home Style */ #sb-home { color: #cfcfcf; } #sb-home .overlay { background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.73) 17%, rgba(0, 0, 0, 0.66) 35%, rgba(0, 0, 0, 0.55) 62%, rgba(0, 0, 0, 0.4) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.8)), color-stop(17%, rgba(0, 0, 0, 0.73)), color-stop(35%, rgba(0, 0, 0, 0.66)), color-stop(62%, rgba(0, 0, 0, 0.55)), color-stop(100%, rgba(0, 0, 0, 0.4))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.73) 17%, rgba(0, 0, 0, 0.66) 35%, rgba(0, 0, 0, 0.55) 62%, rgba(0, 0, 0, 0.4) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.73) 17%, rgba(0, 0, 0, 0.66) 35%, rgba(0, 0, 0, 0.55) 62%, rgba(0, 0, 0, 0.4) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.73) 17%, rgba(0, 0, 0, 0.66) 35%, rgba(0, 0, 0, 0.55) 62%, rgba(0, 0, 0, 0.4) 100%); /* IE10+ */ background: linear-gradient(to bottom, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.73) 17%, rgba(0, 0, 0, 0.66) 35%, rgba(0, 0, 0, 0.55) 62%, rgba(0, 0, 0, 0.4) 100%); /* W3C */ filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#cc000000', endColorstr='#66000000', GradientType=0); /* IE6-9 */ height: 750px; background-attachment: fixed; } #sb-home p.lead { color: #e3e3e3; } .content { position: relative; padding: 20% 0 0; } .color { color: #fcac45; } a.fa.fa-angle-down { padding: 10px 15px; color: #fff; border: 2px solid #b4b4b4; border-radius: 50%; font-size: 24px; margin-top: 200px; transition: all 0.5s; } a.fa.fa-angle-down:hover { background: #fcac45; color: #ffffff; border: 2px solid #fcac45; } #sb-home .entry-header span { display: block; margin: 10px 0; } #sb-home .entry-header span .author a { display: block; margin-top: 10px; } #sb-home .entry-header .posted-on { opacity: 0.9; } #sb-home .entry-header .posted-on a { color: #fff; } #sb-home p { font-size: 16px; line-height: 1.6; color: #fff; text-align: center; } #sb-home .wp-caption-text { font-size: 12px; color: #fff; text-align: center; margin-top: 15px; line-height: 1.6; font-style: italic; } #sb-home .heading { padding: 20px; } #sb-home h1 { font-size: 48px; text-transform: uppercase; color: #fff ; font-weight: 400; font-family: 'Oswald', sans-serif; letter-spacing: 2px; text-shadow: none; margin-bottom: 20px; } #sb-home .carousel-caption { top: 30%; bottom: 0; } #sb-home .item { background: #000; height: 100vh; } #sb-home .item img { opacity: 0.6; height: 100vh; width: 100%; object-fit: cover; } #sb-home .item .vcard img { opacity: 1; width: 80px; height: 80px; } #sb-home .item .vcard a { color: #fff; text-transform: uppercase; } #sb-home .carousel-control.left { background-image: none; top: auto; bottom: 10%; font-weight: 100; left: 40%; } #sb-home .carousel-control.right { background-image: none; top: auto; bottom: 10%; right: 40%; } .m-x-auto { margin-right: auto!important; margin-left: auto!important; } .d-block { display: block!important; } /*blog-box*/ #sb-imgbox { padding: 80px 0; background: #fff; } #sb-imgbox h2 { /*color: #44484b; font-size: 38px;*/ font-family: 'Oswald', sans-serif; } #sb-imgbox p { margin-top: 25px; } #sb-imgbox .blog-box-inn { margin-top: 30px; overflow: hidden; border: 1px rgba(254, 156, 70, 0.09) solid; } #sb-imgbox .blog-box-inn .blog-img { height: 240px; width: 100%; overflow: hidden; object-fit: cover; position: relative; transition: all ease-in-out 500ms; -moz-transition: all ease-in-out 500ms; -webkit-transition: all ease-in-out 500ms; border-radius: 4px; } #sb-imgbox .blog-box-inn h2 { color: #000; font-size: 20px; position: relative; font-family: 'Roboto', sans-serif; z-index: 9; text-transform: none; font-weight: 300; background: #fff; display: block; text-align: center; padding: 20px 15px 10px; } a.eq-blocks-title { color: #222328; } #sb-imgbox .blog-box-inn span { color: #d2cece; text-align: right; display: block; font-weight: 400; padding: 10px; background: #fff; position: relative; z-index: 99; } #sb-imgbox .blog-box-inn:hover img { transform: scale(1.1, 1.1); transition: all ease-in-out 500ms; -moz-transition: all ease-in-out 500ms; -webkit-transition: all ease-in-out 500ms; } #sb-imgbox .blog-box-inn p { margin-top: 10px; color: #fe9c46; text-align: center; } #sb-imgbox .blog-box-inn .btn { display: block; border-radius: 0; } #sb-imgbox .blog-box-inn .user-details .author-img { display: block; } #sb-imgbox .blog-box-inn .user-details .author-img span { display: block; text-align: center; color: #44484b; font-size: 12px; text-transform: uppercase; font-weight: bold; padding: 15px; } #sb-imgbox .blog-box-inn .user-details { border: 1px #ccc solid; padding: 20px; } #sb-imgbox .blog-box-inn .user-details p { text-align: justify; } #sb-imgbox .blog-box-inn .user-details ul { margin-top: 20px; } #sb-imgbox .blog-box-inn .user-details ul li .btn { background: #f4cf31; color: #44484b; border: none; border-radius: 15px; margin-right: 50px; } #sb-imgbox .blog-box-inn .user-details ul li .btn:hover { background: #44484b; color: #fff; transition: all ease-in-out 500ms; -moz-transition: all ease-in-out 500ms; -webkit-transition: all ease-in-out 500ms; } #sb-imgbox .blog-box-inn .user-details ul li { margin: auto 10px; } #sb-imgbox .blog-box-inn .user-details ul li a i { font-weight: 600; color: #44484b; font-size: 16px; } .navigation.pagination{width: 100%; display: block; text-align: center;} .nav-links { margin: 0 auto; min-width: 280px; } .nav-links a.page-numbers { border-radius: 50%; background-color: #fff; margin: 0 5px; position: relative; display: inline-block; padding: 6px 12px; margin-left: -1px; line-height: 1.42857143; text-decoration: none; border: 1px #ffd553 solid; color: #44484b; } .nav-links a:hover { background-color: #ffd553; border: 1px #ffd553 solid; color: #fff; transition: all ease-in-out 300ms; -moz-transition: all ease-in-out 300ms; -webkit-transition: all ease-in-out 300ms; } .nav-links span.current { background-color: #ffd553; border: 1px #ffd553 solid; color: #fff; margin: 0 5px; position: relative; display: inline-block; border-radius: 50%; padding: 6px 12px; margin-left: -1px; line-height: 1.42857143; text-decoration: none; } #service { /*background: #ccc;*/ background-size: cover; background-position: center; background-attachment: fixed; background-repeat: no-repeat; color: #cfcfcf; padding: 80px 0; position: relative; } #service:before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; right: 0; width: 100%; height: 100%; background: #fe9c46; opacity: 0.5; } #service .serv-content { padding: 150px 50px 30px } #service .serv-content h4 { color: #fff; font-size: 2vw; font-family: 'Oswald', sans-serif; text-transform: uppercase; font-weight: 500; margin-top: 20px; line-height: 42px; } #service .serv-content p { color: #fff; font-size: 14px; text-align: justify; margin-top: 50px; } #service .serv-content .btn { background: none; border: 2px #fff solid; border-radius: 15px; padding: 8px 25px; color: #fff; } #service .serv-content .btn:hover { border: 2px #fff solid; transition: all ease-in-out 500ms; -moz-transition: all ease-in-out 500ms; -webkit-transition: all ease-in-out 500ms; } /* Contact Section */ #tf-contact { padding: 80px 0; } #tf-contact .form-control { display: block; width: 100%; padding: 6px 12px; font-size: 14px; line-height: 1.42857143; color: #555; background-color: #fff; background-image: none; border: 1px solid #ccc; border-radius: 2px; -webkit-box-shadow: none; box-shadow: none; -webkit-transition: none; -o-transition: none; transition: none; } #tf-contact .form-control:focus { border-color: inherit; outline: 0; -webkit-box-shadow: transparent; box-shadow: transparent; } button.btn.tf-btn.btn-default { float: right; background: #FCAC45; border: 0; border-radius: 0; padding: 10px 40px; color: #ffffff; text-transform: uppercase; } .btn:active, .btn.active { background-image: none; outline: 0; -webkit-box-shadow: none; box-shadow: none; } .btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus { outline: thin dotted; outline: none; outline-offset: none; } /* Footer */ /* Footer */ .footer-bottom { background: #44484b; color: #bdc3c7; padding: 94px 0 41px 0; font-family: 'Roboto', sans-serif; font-weight: 300; } .footer-bottom .foot { font-size: 14px; text-transform: uppercase; color: #999; margin-bottom: 50px; } .footer-bottom ul { margin-bottom: 50px; } .footer-bottom ul li { display: inline-block; } i.fa { height: 30px; width: 30px; border: 2px solid #8c8c8c; font-size: 20px; padding: 4px 5px; border-radius: 50%; color: #fff; transition: all 0.5s; } i.fa:hover { opacity:0.8; padding:4px 8px; color: #ffffff; } .author_social i.fa { color: black; border: none; } .footer-bottom address { font-family: 'Roboto', sans-serif; font-weight: 300; color: #bdc3c7; font-size: 11px; margin-top: 43px; text-transform: uppercase; } .footer-bottom address a { color: #bdc3c7; } .footer-bottom address a:hover { color: #fff; } .footer-bottom .widget-title { font-size: 14px; color: #bdc3c7; background: none; text-transform: uppercase; font-weight: bold; margin-bottom: 30px; border-bottom: 1px solid rgba(255, 255, 255, 0.11); } .footer-bottom .widget ul li { margin: 5px 0; } .footer-bottom .widget_categories ul li { display: block; } .footer-bottom .widget ul li a { font-size: 14px; color: #bdc3c7; font-weight: 300; } .footer-bottom .widget ul li a:hover { color: #fff; } .footer-bottom .recent-po .media-object { max-width: 96px; overflow: hidden; width: 100%; max-height: 108px; object-fit: cover; } .footer-bottom .recent-po .media-body { max-height: 108px; overflow: hidden; } .footer-bottom span.h1 { margin-bottom: 25px; display: block; } /*inner page*/ #inner-page { padding: 120px 0 30px; margin-bottom: 30px; } .image-box {} #inner-page .image-box .blog-box-inn { margin-top: 30px; overflow: hidden; border: 1px #d8d8d8 dotted; } #inner-page .image-box .blog-box-inn .blog-img { height: 400px; width: 100%; overflow: hidden; object-fit: cover; position: relative; transition: all ease-in-out 500ms; -moz-transition: all ease-in-out 500ms; -webkit-transition: all ease-in-out 500ms; } #inner-page .image-box .blog-box-inn h2 { color: #000; font-size: 20px; position: relative; font-family: 'Roboto', sans-serif; z-index: 9; text-transform: none; font-weight: 300; background: #fff; display: block; text-align: center; padding: 20px 15px 10px; } #inner-page .image-box .blog-box-inn span { color: #d2cece; text-align: right; display: block; font-weight: 400; padding: 10px; background: #fff; position: relative; z-index: 99; } #inner-page .image-box .blog-box-inn:hover img { transform: scale(1.1, 1.1); transition: all ease-in-out 500ms; -moz-transition: all ease-in-out 500ms; -webkit-transition: all ease-in-out 500ms; } #inner-page .image-box .blog-box-inn p { margin-top: 10px; color: #fe9c46; text-align: center; } #inner-page .image-box .blog-box-inn .btn { display: block; border-radius: 0; } #inner-page .image-details {} #inner-page .image-details h2 { font-size: 40px; color: #000; font-weight: 300; display: block; line-height: 1.4; text-transform: none; padding-top: 20px; } #inner-page .image-details p { font-size: 14px; color: #000; text-align: justify; line-height: 1.5; padding-top: 30px; } #inner-page .entry-header { text-align: center; } #inner-page .entry-header span { display: block; margin: 10px 0; text-align: center !important; background: none !important; } #inner-page .entry-header span .author img { float: none; } #inner-page .entry-header span .author a { display: block; margin-top: 10px; color: #000; } #inner-page .entry-header .posted-on { opacity: 0.7; } #inner-page .entry-header .posted-on a { color: #999; } #inner-page p { font-size: 14px; line-height: 1.6; color: #6e6e6e; text-align: justify; } #inner-page .social-head ul li { margin: 25% 5px 0 5px; } #inner-page .social-head ul li a { color: #fff; margin-top: 20px; } #inner-page .social-head ul li a .fa-instagram { background: #b5853a; padding: 8px 10px; border-radius: 50%; } #inner-page .social-head ul li a .fa-twitter { background: #6cd9fd; padding: 8px 10px; border-radius: 50%; } #inner-page .social-head ul li a .fa-youtube { background: #ae2e3a; padding: 8px 10px; border-radius: 50%; } #inner-page .social-head ul li a .fa-facebook { background: #51b5fa; padding: 8px 13px; border-radius: 50%; } #inner-page .social-head ul li a:hover .fa { color: #ccc; background: #fff; transform: scale(1.1, 1.1); transition: all ease-in-out 500ms; -moz-transition: all ease-in-out 500ms; -webkit-transition: all ease-in-out 500ms; border: 1px #ccc solid; } .tagcloud { margin-top: 40px; } .tagcloud a { font-size: 100%; color: #a0a0a0; padding: 2px 8px; display: inline-block; border: 1px #a0a0a0 solid; border-radius: 8px; margin: 8px 0; font-size: 12px; } #single-body{padding:80px 0;} #single-body .single-post p{color:#73757d; line-height:2; font-size:14px; margin-bottom:45px;} #single-banner { background-repeat: no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-position: center; padding: 80px 0; height: 560px; position: relative; background-color:#fff5ec; } #single-banner:before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; right: 0; width: 100%; height: 100%; background: #e1e2e8; opacity: 0.7; } .navbar-toggle{min-width:inherit;} #single-banner .content { margin-top:0; padding:4vw 0 0; text-align:center; position: relative; } #single-banner h1 { color: #000; letter-spacing:1px; font-family: 'Oswald', sans-serif; font-weight: 300; font-size:48px; line-height:1.2; max-width:600px; margin:0 auto; } .page #single-banner { height:40vh; } #single-banner .category{background:#fe9c46; display:inline-block; color:#fff; font-size:10px; padding:2px 4px; border-radius:2px; margin-bottom:15px;} #single-banner h5 { color: #fff; font-weight: 400; font-size: 12px; letter-spacing: 0.8px; } #single-banner .breadcrumb { background: none; color: #333; font-size: 14px; padding-left: 0; margin-bottom: 0; font-family: 'Oswald', sans-serif; letter-spacing:1px; } #single-banner .breadcrumb > li > a { color: #333; font-size: 14px; } #single-banner .breadcrumb > .active { color: #666; } #single-banner header { padding: 0; margin:25px 0 15px; } #single-banner header .date-article { color: #000; text-transform: uppercase; font-size: 14px; font-weight: 400; letter-spacing: 0.8px; font-family: 'Oswald', sans-serif; font-style: normal; } #single-banner header .author.vcard a { text-transform: uppercase; font-size: 14px; font-weight: 500; letter-spacing: 0.8px; font-family: 'Oswald', sans-serif; letter-spacing:1px; font-style: normal; color: #000; font-weight: 400; } #single-banner header.entry-header { color: #000; font-family: 'Oswald', sans-serif; letter-spacing:1px; text-transform: none; font-weight: 400; font-style: italic; } .single .single-post figure img{ width:100%; object-fit:cover; max-height:456px; overflow:hidden;} .single .single-post footer.entry-meta-bar { text-transform:uppercase; margin-top: 30px; font-family: 'Oswald', sans-serif; font-size:14px; font-weight:600; color:#73757d; margin-bottom:30px; display:inline-block; float:left; } .single .single-post footer.entry-meta-bar .fa { position: absolute; left: 42px; z-index: 10; color: #e4e7ef; font-size: 18px; margin-top: 4px; margin-right: 30px; } .single .single-post footer.entry-meta-bar a { border: 0px #3b3e8a solid; border-radius: 0; background: none; color: #404040; font-family: 'Oswald', sans-serif; margin-left: 4px; border-radius: 8px; display: inline-block; padding: 4px 8px; margin-bottom: 0; text-transform: uppercase; font-size: 14px; font-weight: 600; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; margin-top:-4px; -ms-user-select: none; user-select: none; background-image: none; } .single .single-post footer.entry-meta-bar a:hover { webkit-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; border: 0px #3b3e8a solid; } .single .single-post .wp-caption-text{color:#73757d; font-style:italic; text-align:right; margin:15px 0 30px; } .single .single-post .wp-caption-text a{color:#73757d; font-style:italic; font-weight:500;} .single .single-post .wp-caption-text a:hover{color:#000; webkit-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out;} .single .share-ico{display:inline-block; float:right; margin:22px 0; } .single .share-ico li{list-style:none; display:inline-block; font-family: 'Oswald', sans-serif; font-size:14px; font-weight:600; color:#73757d; text-transform:uppercase; margin-right:10px;} .single .share-ico i.fa{border-color:#000; color:#000; font-size:12px; border-width:1px; padding: 8px 9px;} .author-box { display: block; float: left; padding: 28px; border: 2px #f0f2f7 solid; border-radius: 8px; margin: 60px 0; } .author-box .avatar { margin: 0rem 2.1rem 4.1rem 0rem; border-radius: 50px; -webkit-border-radius: 50px; } .author-box img.avatar { float: left; border-radius: 50%; display: inline-block; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; width: 100px; height: 100px; object-fit: cover; margin: 0 40px 0 10px; } .author-box .author-description { color: #73757d; font-size: 14px; line-height: 1.8; min-width: 320px; } .author-box .author-box-title { color: #73757d; font-size: 14px; font-family: 'Oswald', sans-serif; text-transform: uppercase; font-weight: 600; margin-bottom: 15px; } .author-box .author-box-title a { background: #fba529; font-family: 'Oswald', sans-serif; color: #fff; padding: 4px 10px; border-radius: 6px; margin-left: 20px; } .widget { margin: 0 0 1.5em; } .widget a:hover { text-decoration: none; } /* Make sure select elements fit in widgets. */ .widget select { max-width: 100%; } .widget p { text-align: center; color: #73757d; font-size: 14px; font-weight: 600; } .widget-title { font-size: 14px; font-weight: 600; color: #404040; background: none; font-family: 'Montserrat', sans-serif; text-transform: none; margin: 30px 0 20px; text-align: left; text-transform: uppercase; border: 0px #00d3f3 dashed; background-color: #f5f5f5; text-align: center; border-radius: 0px; padding: 8px; } .me { border-bottom-color: #d35400; } .n-lt-s { } .n-lt-s input[type='email'] { width: 100%; border: none; box-shadow: none; background: #ededed; border-radius: 0px; } .n-lt-s button { width: 100%; background: #d35400; color: #fff; border: none; } .n-lt-s label { font-size: 12px; font-weight: 300; color: #7f8c8d; text-transform: uppercase; } .tagcloud a { border: 2px #f0f2f7 solid; border-radius: 0; background: none; color: #404040; font-family: 'Montserrat', sans-serif; margin-left: 4px; border-radius: 8px; display: inline-block; padding: 4px 8px; margin-bottom: 0; text-transform: uppercase; font-size: 11px; font-weight: 600; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-image: none; } .tagcloud a:hover { webkit-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; border: 2px #fba529 solid; background: #fba529; border-radius: 15px; color: #fff; } aside .widget_search { margin-bottom: 18px; margin-top: 27px; } aside .widget_search button{min-width:100px;} aside .widget_search .input-group { margin-bottom: 0; margin-top: 25px; } .thumb { display: block; width: 100%; margin: 0; } /* Style to article Author */ .by-author { font-style: italic; line-height: 1.3; color: #aab6aa; } .widget_recent_comments ul li { padding: 26px 0; font-family: 'Montserrat', sans-serif; color: #73757d; font-size: 12px; text-transform: uppercase; font-weight: 600; border: none; letter-spacing: 0.8px; border-bottom: 2px #f3f3f3 solid; margin-bottom: 1px; list-style: none; } .widget_recent_comments ul li:last-child { border-bottom: 0px #f3f3f3 solid; } .widget_recent_comments ul li a { color: #43484d; } .widget_recent_comments ul li a:hover { color: #ec971f; transition: all ease-in .3s; -moz-transition: all ease-in .3s; -webkit-transition: all ease-in .3s; } .widget_recent_comments ul li span { font-weight: 600; font-size: 12px; } .widget_recent_comments ul li .comment-author-link a { color: #73757d; } .widget_recent_entries li img { width: 65px; height: 65px; object-fit: cover; border-radius: 8px; } .widget_recent_entries li img:hover { -webkit-filter: blur(1px); -moz-filter: blur(1px); -o-filter: blur(1px); -ms-filter: blur(1px); filter: blur(1px); -webkit-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; } .widget_recent_entries li a { display: block; margin-left: 0px; } .widget_recent_entries .post-date { font-size: 90%; } .widget_recent_entries ul li .media-body p { color: #193f5d; font-size: 14px; } .widget_recent_entries ul li .media-body p a { font-size: 12px; font-weight: 500; text-transform: uppercase; letter-spacing: 0.8px; font-family: 'Montserrat', sans-serif; text-decoration: none; margin-top: 0px; line-height: 1.8; } .widget_recent_entries ul li .media-body p .by-author { } .widget_recent_entries ul li .media-body p a:hover { color: #3b3e8a; text-decoration: none; transition: all ease-in .3s; -moz-transition: all ease-in .3s; -webkit-transition: all ease-in .3s; } .widget_recent_entries ul li .media-body p { text-align: left; margin: 0; } .widget_recent_entries ul li .media-body p a span { display: block; font-weight: 600; text-transform: uppercase; text-align: left; font-size: 11px; color: #acadb1; text-decoration: underline; } .widget_archive ul { } .widget_archive ul li { padding: 8px 0; font-family: 'Montserrat', sans-serif; letter-spacing: 0.8px; color: #969dad; font-size: 14px; text-transform: none; font-weight: 500; border: none; border-bottom: 0px #dcdde1 solid; margin-bottom: 1px; text-transform: uppercase; list-style: none; } .widget.widget_categories ul li a:before, .widget.widget_archive ul li a:before { content: "\f105"; font-family: FontAwesome; display: inline-block; margin-right: 10px; font-size: 90%; } .widget_archive ul li a { color: #000; } .widget_archive li a:hover { color: #ec971f; transition: all ease-in .3s; -moz-transition: all ease-in .3s; -webkit-transition: all ease-in .3s; } .widget_premium-widget i.fa { color: #8c8c8c; padding: 20px; border: none; } .widget_premium-widget i.fa:hover { color: #000; } aside section { margin-bottom: 40px !important; } aside section:first-child { margin-top: 0px; } aside { padding-left: 40px !important; } aside ul { } aside ul li { padding: 8px 0; font-family: 'Montserrat', sans-serif; letter-spacing: 0.8px; color: #969dad; font-size: 14px; text-transform: none; font-weight: 500; border: none; border-bottom: 0px #dcdde1 solid; margin-bottom: 1px; text-transform: none; list-style: none; } aside ul li a { color: #000; } aside li a:hover { color: #ec971f; transition: all ease-in .3s; -moz-transition: all ease-in .3s; -webkit-transition: all ease-in .3s; } .widget_categories ul .children { padding-left: 25px; } .widget_categories ul li { padding: 8px 0; font-family: 'Montserrat', sans-serif; letter-spacing: 0.8px; color: #969dad; font-size: 14px; text-transform: none; font-weight: 500; border: none; border-bottom: 0px #dcdde1 solid; margin-bottom: 1px; text-transform: uppercase; list-style: none; } .widget_categories ul li a { color: #000; } .widget_categories li a:hover { color: #ec971f; transition: all ease-in .3s; -moz-transition: all ease-in .3s; -webkit-transition: all ease-in .3s; } .widget_tag_cloud .tagcloud a { margin-top: 5px; } .widget_meta ul { list-style: none; } .widget_meta li { padding: 8px 0; } .widget_meta li a { color: #193f5d; font-size: 14px; list-style: none; font-weight: 600; } .widget_meta li a:hover { color: #fc8f2f; transition: all ease-in .3s; -moz-transition: all ease-in .3s; -webkit-transition: all ease-in .3s; } .widget_meta li:hover:before { color: #ec6262; transition: all ease-in .3s; -moz-transition: all ease-in .3s; -webkit-transition: all ease-in .3s; } .widget_meta li:before { content: "-"; padding: 0 10px 0 0; font-weight: bold; color: #bbbbbb; } .widget_social li i { /*background: #666;*/ text-align: center; padding: 0px; font-size: 20px; /*border-radius: 50%;*/ color: #000; } .widget_social li i:hover { color: #ec971f; transition: all ease-in .3s; -moz-transition: all ease-in .3s; -webkit-transition: all ease-in .3s; } .widget_social li { border: none; color: #fff; height: 34px; width: 34px; border-radius: 8px; margin: 8px; background-color: transparent; display: inline-block; } .widget_search .input-group-btn button { padding: 12px 20px; border-top-left-radius: 0; border-bottom-left-radius: 0; } .widget_social li a { height: 34px; width: 34px; display: inline-block; } .widget_social { height: 140px; display: block; } .widget_social .fa { height: 34px; width: 34px; display: inline-block; padding-top: 8px; border-radius: 4px; border:none; color: #fff; } .widget_social li a:hover i.fa{color:#000;} .widget_social .fa-facebook { background: #3fccfd; } .widget_social .fa-facebook:hover { } .widget_social .fa-twitter { background: #3b5998; } .widget_social .fa-google-plus { background: #df4b38; } .widget_social .fa-rss { background: #fba529; } .widget_social .fa-pinterest { background: #3fccfd; } .widget_tag_cloud .tagcloud a { margin-top: 5px; } .widget_meta ul { list-style: none; padding-left: 0; } .widget_meta li { padding: 8px 0; } .widget_meta li a { color: #193f5d; font-size: 14px; list-style: none; font-weight: 600; } .widget_meta li a:hover { color: #ec971f; transition: all ease-in .3s; -moz-transition: all ease-in .3s; -webkit-transition: all ease-in .3s; } .widget_meta li:hover:before { color: #ec971f; transition: all ease-in .3s; -moz-transition: all ease-in .3s; -webkit-transition: all ease-in .3s; } .widget_meta li:before { content: "-"; padding: 0 10px 0 0; font-weight: bold; color: #bbbbbb; } . usrdt { margin-top: -90px; } .usrdt p { margin: 0; } .usrdt .blg-dtl { display: block; margin-top: -30px; margin-bottom: 15px; text-align: center; } .usrdt .blg-dtl img { width: 180px; height: 180px; border: 10px #fff solid; margin-left: 145px; } .usrdt .blg-dtl .lg-nm { color: #000; font-size: 12px; font-weight: 300; } .usrdt .blg-dtl .blg-desig { color: #acacac; font-size: 12px; font-weight: 300; } .usrdt .blg-cnt { color: #acacac; font-size: 12px; font-weight: 300; text-align: center; } .usrdt .blg-an { display: block; padding: 15px; text-align: center; background: #3a3d48; color: #fff; margin-top: 40px; } .usrdt .blg-an:hover { background: #6ad8d5; transition: all ease-in-out .2s; -moz-transition: all ease-in-out .2s; -webkit-transition: all ease-in-out .2s; } .usrdt .sc li a { font-size: 12px; color: #fff; } .usrdt .sc li a .fa-facebook { background: #2685dd; padding: 4px 6px; border-radius: 10px; } .usrdt .sc li a .fa-twitter { background: #06c0fd; padding: 4px 5px; border-radius: 10px; } .usrdt .sc li a .fa-instagram { background: #9c7e5f; padding: 4px 6px; border-radius: 10px; } /*download button*/ .buttonDownload { display: inline-block; position: relative; padding: 16px 50px; border-radius: 25px; background-color: #fe9c46; color: white; font-family: sans-serif; text-decoration: none; text-transform: uppercase; font-size: 12px; text-align: center; text-indent: 15px; margin-top: 30px; margin-bottom:40px; } .buttonDownload:hover { background-color: #333; color: white; transition: all ease-in-out 500ms; -moz-transition: all ease-in-out 500ms; -webkit-transition: all ease-in-out 500ms; } .buttonDownload:before, .buttonDownload:after { content: ' '; display: block; position: absolute; left: 40px; top: 52%; } /* Download box shape */ .buttonDownload:before { width: 10px; height: 2px; border-style: solid; border-width: 0 2px 2px; } /* Download arrow shape */ .buttonDownload:after { width: 0; height: 0; margin-left: 1px; margin-top: -7px; border-style: solid; border-width: 4px 4px 0 4px; border-color: transparent; border-top-color: inherit; animation: downloadArrow 2s linear infinite; animation-play-state: paused; } .buttonDownload:hover:before { border-color: #4CC713; } .buttonDownload:hover:after { border-top-color: #4CC713; animation-play-state: running; } /* keyframes for the download icon anim */ @keyframes downloadArrow { /* 0% and 0.001% keyframes used as a hackish way of having the button frozen on a nice looking frame by default */ 0% { margin-top: -7px; opacity: 1; } 0.001% { margin-top: -15px; opacity: 0; } 50% { opacity: 1; } 100% { margin-top: 0; opacity: 0; } } /*animations*/ .floating { -webkit-animation-name: Floatingx; -webkit-animation-duration: 3s; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: ease-in-out; -moz-animation-name: Floating; -moz-animation-duration: 3s; -moz-animation-iteration-count: infinite; -moz-animation-timing-function: ease-in-out; margin-left: 30px; margin-top: 5px; } @-webkit-keyframes Floatingx { from { -webkit-transform: translate(0, 0px); } 65% { -webkit-transform: translate(0, 15px); } to { -webkit-transform: translate(0, -0px); } } @-moz-keyframes Floating { from { -moz-transform: translate(0, 0px); } 65% { -moz-transform: translate(0, 15px); } to { -moz-transform: translate(0, -0px); } } .scaling { -webkit-animation-name: scalex; -webkit-animation-duration: 3s; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: ease-in-out; -moz-animation-name: scale; -moz-animation-duration: 3s; -moz-animation-iteration-count: infinite; -moz-animation-timing-function: ease-in-out; } @-webkit-keyframes scalex { from { -webkit-transform: scale(0.9); } 65% { -webkit-transform: scale(1.0); } to { -webkit-transform: scale(0.9); } } @-moz-keyframes scale { from { -moz-transform: scale(0.9); } 65% { -moz-transform: scale(1.0); } to { -moz-transform: scale(0.9); } } /* ========================================================================== Chrome Frame prompt ========================================================================== */ .chromeframe { margin: 0.2em 0; background: #fff; color: #000; padding: 0.2em 0; } /* ========================================================================== Author's custom styles ========================================================================== */ #loader-wrapper { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9000; } #loader { display: block; position: relative; left: 50%; top: 50%; width: 150px; height: 150px; margin: -75px 0 0 -75px; border-radius: 50%; border: 3px solid transparent; border-top-color: #3498db; -webkit-animation: spin 2s linear infinite; /* Chrome, Opera 15+, Safari 5+ */ animation: spin 2s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */ z-index: 1001; } #loader:before { content: ""; position: absolute; top: 5px; left: 5px; right: 5px; bottom: 5px; border-radius: 50%; border: 3px solid transparent; border-top-color: #e74c3c; -webkit-animation: spin 3s linear infinite; /* Chrome, Opera 15+, Safari 5+ */ animation: spin 3s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */ } #loader:after { content: ""; position: absolute; top: 15px; left: 15px; right: 15px; bottom: 15px; border-radius: 50%; border: 3px solid transparent; border-top-color: #f9c922; -webkit-animation: spin 1.5s linear infinite; /* Chrome, Opera 15+, Safari 5+ */ animation: spin 1.5s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */ } @-webkit-keyframes spin { 0% { -webkit-transform: rotate(0deg); /* Chrome, Opera 15+, Safari 3.1+ */ -ms-transform: rotate(0deg); /* IE 9 */ transform: rotate(0deg); /* Firefox 16+, IE 10+, Opera */ } 100% { -webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */ -ms-transform: rotate(360deg); /* IE 9 */ transform: rotate(360deg); /* Firefox 16+, IE 10+, Opera */ } } @keyframes spin { 0% { -webkit-transform: rotate(0deg); /* Chrome, Opera 15+, Safari 3.1+ */ -ms-transform: rotate(0deg); /* IE 9 */ transform: rotate(0deg); /* Firefox 16+, IE 10+, Opera */ } 100% { -webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */ -ms-transform: rotate(360deg); /* IE 9 */ transform: rotate(360deg); /* Firefox 16+, IE 10+, Opera */ } } #loader-wrapper .loader-section { position: fixed; top: 0; width: 51%; height: 100%; background: #fff; z-index: 1000; -webkit-transform: translateX(0); /* Chrome, Opera 15+, Safari 3.1+ */ -ms-transform: translateX(0); /* IE 9 */ transform: translateX(0); /* Firefox 16+, IE 10+, Opera */ } #loader-wrapper .loader-section.section-left { left: 0; } #loader-wrapper .loader-section.section-right { right: 0; } /* Loaded */ .loaded #loader-wrapper .loader-section.section-left { -webkit-transform: translateX(-100%); /* Chrome, Opera 15+, Safari 3.1+ */ -ms-transform: translateX(-100%); /* IE 9 */ transform: translateX(-100%); /* Firefox 16+, IE 10+, Opera */ -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000); transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000); } .loaded #loader-wrapper .loader-section.section-right { -webkit-transform: translateX(100%); /* Chrome, Opera 15+, Safari 3.1+ */ -ms-transform: translateX(100%); /* IE 9 */ transform: translateX(100%); /* Firefox 16+, IE 10+, Opera */ -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000); transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000); } .loaded #loader { opacity: 0; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .loaded #loader-wrapper { visibility: hidden; -webkit-transform: translateY(-100%); /* Chrome, Opera 15+, Safari 3.1+ */ -ms-transform: translateY(-100%); /* IE 9 */ transform: translateY(-100%); /* Firefox 16+, IE 10+, Opera */ -webkit-transition: all 0.3s 1s ease-out; transition: all 0.3s 1s ease-out; } /* JavaScript Turned Off */ .no-js #loader-wrapper { display: none; } .no-js h1 { color: #222222; } #content { margin: 0 auto; padding-bottom: 50px; width: 80%; max-width: 978px; } /* ========================================================================== Helper classes ========================================================================== */ /* * Image replacement */ .ir { background-color: transparent; border: 0; overflow: hidden; /* IE 6/7 fallback */ *text-indent: -9999px; } .ir:before { content: ""; display: block; width: 0; height: 150%; } /* * Hide from both screenreaders and browsers: h5bp.com/u */ .hidden { display: none !important; visibility: hidden; } /* * Hide only visually, but have it available for screenreaders: h5bp.com/v */ .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } /* * Extends the .visuallyhidden class to allow the element to be focusable * when navigated to via the keyboard: h5bp.com/p */ .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } /* * Hide visually and from screenreaders, but maintain layout */ .invisible { visibility: hidden; } /*author page*/ /*jumbotron*/ #jumbo .jumbotron { padding: 162px 0 149px 0; background: rgba(0, 0, 0, 0.27); } #jumbo .jumbotron h1 { font-family: 'Roboto', sans-serif; font-size: 30px; font-weight: 700; text-transform: uppercase; color: #fff !important; padding-top: 16px; margin-bottom: 32px; letter-spacing: 2px; } #jumbo .jumbotron p { font-size: 14px; text-transform: none; color: #fff; margin-bottom: 20px; font-weight: 300; display: block; padding-top: 20px; } #jumbo .jumbotron .btn { color: #fff; font-size: 12px; font-weight: 400; text-transform: uppercase; letter-spacing: 2px; padding: 12px 24px; background: #fe7575; border-radius: 25px; border: none; } #jumbo .jumbotron .btn:hover { background: #333; transition: all ease-out 400ms; -moz-transition: all ease-out 400ms; -webkit-transition: all ease-out 400ms; } #jumbo .desig { background: #ffd553; color: #44484b; padding: 8px 10px; border-radius: 15px; text-transform: uppercase; font-size: 12px; margin-bottom: 25px; } #jumbo .entry-header span { display: block; margin: 10px 0; } #jumbo .entry-header span .author a { display: block; margin-top: 10px; font-size: 23px; color: #fff; text-transform: uppercase; font-weight: bold; } #jumbo .entry-header .posted-on { opacity: 0.9; color: #fff; } #jumbo .entry-header .posted-on a { color: #fff; } #jumbo.entry-header p { font-size: 14px; line-height: 1.6; color: #fff; text-align: center; text-transform: none; } #jumbo .wp-caption-text { font-size: 12px; color: #fff; text-align: center; margin-top: 15px; line-height: 1.6; font-style: italic; } #jumbo .heading { border: 4px #fff solid; padding: 30px; } #jumbo .entry-header .entry-title { font-size: 3vw; text-transform: uppercase; color: #fff; font-weight: bold; text-shadow: none; } #jumbo .entry-header .author { margin-top: -80px; } #jumbo .author-social-links-inn { background: rgba(255, 213, 83, 0); padding: 20px; transition: all ease-in-out 500ms; -moz-transition: all ease-in-out 500ms; -webkit-transition: all ease-in-out 500ms; } #jumbo .author-social-links-inn ul li { margin: 10px 20px; } #jumbo .author-social-links-inn ul li a { background: #fff; border-radius: 50%; font-size: 14px; color: #44484b; padding: 8px 10px; } #jumbo .author-social-links-inn ul li a .fa-facebook { padding: 8px 4px; } #jumbo .author-social-links-inn ul li a:hover { background: #44484b; border-radius: 50%; font-size: 14px; color: #fff; transition: all ease-in-out 500ms; -moz-transition: all ease-in-out 500ms; -webkit-transition: all ease-in-out 500ms; } #jumbo .author-social-links-inn span { color: #fff; } .inner-page-head { font-size: 24px; color: #000; text-transform: uppercase; font-weight: bold; margin-top: 100px; } /*single articl*/ .single-articl { padding: 25px; background: #fff; border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px; } .single-articl img { float: left; margin-right: 30px; } .single-articl p { font-size: 14px; line-height: 1.6; color: #333333; text-align: justify; margin-top: 10px; display: inline-block; } .single-articl .entry-header { padding: 20px 0; } .single-articl .entry-header .byline span { display: inline-block; margin: 10px 0; } .single-articl .entry-header span .author img { float: none; } .single-articl .entry-header span .author a { display: inline-block; margin-top: 10px; border-right: 1px #ccc solid; padding: 15px; margin-right: 10px; text-transform: uppercase; font-weight: bold; color: #333333; } .single-articl .entry-header .posted-on { opacity: 0.7; } .single-articl .entry-header .posted-on a { color: #999; } .single-articl .comment-content p { font-size: 14px; line-height: 1.6; color: #6e6e6e; text-align: justify; display: inline-block; margin-top: 10px; } .single-articl .wp-caption-text { font-size: 12px; color: #fe7575; text-align: center; margin-top: 15px; line-height: 1.6; font-style: italic; } .single-articl figure { margin: 20px 0; } .single-articl figure img { margin: 15px 0; max-height: 400px; width: 100%; object-fit: cover; } .single-articl blockquote { background: #fff; border-left: 2px #f4cf31 solid !important; padding: 30px; width: 80%; margin-left: 20%; border-left: none; margin-top: 20px; margin-top: 30px; margin-bottom: 30px; } .single-articl blockquote p { font-size: 16px; color: #000 !important; font-weight: 300; font-style: italic; } /*comments*/ /*---------- Comments ------------*/ .comment-content a { word-wrap: break-word; } .bypostauthor { display: block; } #comments span { margin: 0; } #comments p { padding: 0; font-size: 14px; letter-spacing: 0.6px; line-height: 1.7; } #comments .comments-title { font-size: 20px; } #comments a { color: #404040; } #comments { margin-top: 30px; border-top: 0px #999999 solid; padding-top: 25px; } #comments .comment-reply-title { font-size: 22px; margin-top: 30px; } #comments ol { list-style: none; padding: 0; } #comments ol li { border-left: 0px #ccc solid; padding: 0; word-wrap: break-word; } #comments .comment-author { display: inline-block; font-size: 12px; } #comments .comment-author b { margin-left: 120px; font-size: 12px; color: #404040; text-transform: uppercase; font-weight: 500; letter-spacing: 1px; } #comments .comment-author b a { color: #404040; text-transform: uppercase; } #comments ol li .comment-metadata { display: inline-block; font-size: 12px; } #comments ol li .comment-metadata a { color: #73757d; } #comments .comment-content { position: relative; margin-left: 120px;/*top: -80px; left: 120px;*/ } #comments ol li ol { border-top: 1px #e1e1e1 solid; } #comments ol li ol li { border-bottom: 1px #e1e1e1 solid; word-wrap: break-word; padding-left: 50px; } #comments .comment-body { padding: 50px 20px; } #comments .comment-author .avatar { width: 100px; height: 100px; display: inline-block; border-radius: 50%; object-fit: cover; margin-right: 20px; position: absolute; } #comments .reply { float: right; } #comments .reply a { color: #73757d; text-transform: uppercase; font-weight: 500; font-size: 11px; } #comments .reply a:before { content: "\f075"; font-family: 'FontAwesome'; display: inline-block; margin-right: 5px; color: #73757d; } #comments .comment-form p{margin-bottom:10px;} .site-main .comment-navigation, .site-main .posts-navigation, .site-main .post-navigation { margin: 0 0 1.5em; overflow: hidden; } .comment-navigation .nav-previous, .posts-navigation .nav-previous, .post-navigation .nav-previous { float: left; width: 50%; } .comment-navigation .nav-next, .posts-navigation .nav-next, .post-navigation .nav-next { float: right; text-align: right; width: 50%; } /*social share*/ .shr-tag .btn-default { border-radius: 15px; } .mobile-social-share { background: none repeat scroll 0 0 #fff; display: block !important; min-height: 70px !important; } .mobile-social-share h3 { color: inherit; float: left; font-size: 15px; line-height: 20px; margin: 25px 25px 0 25px; } .share-group { float: right; } .btn-group { display: inline-block; font-size: 0; position: relative; vertical-align: middle; white-space: nowrap; } .mobile-social-share ul { float: right; list-style: none outside none; margin: 0; min-width: 61px; padding: 0; } .share { min-width: 17px; } .mobile-social-share li { display: block; font-size: 18px; list-style: none outside none; margin-bottom: 3px; margin-left: 4px; margin-top: 3px; } .btn-share { background-color: #BEBEBE; border-color: #CCCCCC; color: #333333; } .btn-twitter { background-color: #3399CC !important; width: 51px; color: #FFFFFF!important; } .btn-facebook { background-color: #3D5B96 !important; width: 51px; color: #FFFFFF!important; } .btn-facebook { background-color: #3D5B96 !important; width: 51px; color: #FFFFFF!important; } .btn-google { background-color: #DD3F34 !important; width: 51px; color: #FFFFFF!important; } .btn-linkedin { background-color: #1884BB !important; width: 51px; color: #FFFFFF!important; } .btn-pinterest { background-color: #CC1E2D !important; width: 51px; color: #FFFFFF!important; } .btn-mail { background-color: #FFC90E !important; width: 51px; color: #FFFFFF!important; } .caret { border-left: 4px solid rgba(0, 0, 0, 0); border-right: 4px solid rgba(0, 0, 0, 0); border-top: 4px solid; display: inline-block; height: 0; margin-left: 2px; vertical-align: middle; width: 0; } #socialShare { max-width: 59px; margin-bottom: 18px; } #socialShare>a { padding: 6px 10px 6px 10px; } @media (max-width: 320px) { #socialHolder { padding-left: 5px; padding-right: 5px; } .mobile-social-share h3 { margin-left: 0; margin-right: 0; } #socialShare { margin-left: 5px; margin-right: 5px; } .mobile-social-share h3 { font-size: 15px; } } @media (max-width: 238px) { .mobile-social-share h3 { font-size: 12px; } } /*search imput*/ .field { display: flex; z-index: 9999; margin-top: 50px; width: 95%; } .field>input[type=text], .field>button { display: block; font: 1.2em Myriad Pro; } .field>input[type=text] { flex: 1; padding: 0.8em; border: 0.2em; background: #f5f5f5; border-top-left-radius: 8px; border-bottom-left-radius: 8px; } .field>button { padding: 0.8em 0.8em; background-color: #fe9c46; color: white; border: none; border-top-left-radius: 0; border-top-right-radius: 8px; border-bottom-right-radius: 8px; border-bottom-left-radius: 0; } .field>button:hover { cursor: pointer; background-color:rgba(254, 156, 70, 0.85); } textarea:hover, input:hover, textarea:active, input:active, textarea:focus, input:focus, button:focus { outline: 0px !important; } /*edited on 05/6/17*/ .blog-box-inn img { height: 240px; width: 100%; overflow: hidden; object-fit: cover; position: relative; transition: all ease-in-out 500ms; -moz-transition: all ease-in-out 500ms; -webkit-transition: all ease-in-out 500ms; } .post-categories li{list-style: none; display: inline-block; margin-right: 10px;} .post-categories li a:hover{color: #44484b;transition: all ease-in-out 500ms; -moz-transition: all ease-in-out 500ms; -webkit-transition: all ease-in-out 500ms; } .error404 h1 { color:black !important; font-size:2.6em; font-family:'Roboto', sans-serif; } .error404 p{color:#000 !important;} .admin-bar #tf-menu{ margin-top:28px; }