body{ background-color: #ffffff; } ul{ margin: 0; padding: 0; } ul li{ margin: 0; list-style: none; } a, a:hover, a:focus, a:visited, select, input{ outline: 0; text-decoration: none; /*transition: all 0.5s ease-in-out;*/ } h1{ font: 600 36px "Roboto Condensed"; } h2 a{ font: 600 25px "Roboto Condensed"; color: rgba(51,51,51,0.7); } h2 a:hover{ color:rgba(255,172,58,0.7); transition: all 0.3s ease-in-out; } p{ font: 400 14px "Open Sans"; } a.btn{ font: 600 16px "Roboto Condensed"; } h3{ font: 600 20px "Roboto Condensed"; } h4{ font: 600 24px "Roboto Condensed"; color: #ffffff; text-transform: uppercase; } h5{ font: 600 18px "Roboto Condensed"; color: #212121; } .hero p{ font: 400 18px "Open Sans"; } .figure{ display: block; } .breadcrumb{ margin-bottom: 0; color: #fff; background: rgba(33,33,33,0.7); font: 400 12px "Roboto Condensed"; border-radius: 0; letter-spacing: 2px; } .breadcrumb a{ color: #ffffff; } .breadcrumb span.active{ color: #FFAC3A; } .breadcrumb-item+.breadcrumb-item::before{ color: #ffffff; } /*.breadcrumb{ background: rgba(255,172,58,0.7); }*/ /*-------------------top-header---------*/ .text-widget p{ line-height: 26px; } .top-header{ padding: 20px 0; border-bottom: 1px solid #FFAC3A; } .top-header .logo{ text-align: center; margin-bottom: 20px; } .social-icon-top{ text-align: center; } ul.social-icons li{ display: inline-block; margin-right: 15px; } ul.social-icons li:last-child{ margin-right: 0; text-align: center; } ul.social-icons li a{ color: #ccc; } ul.social-icons li a:hover{ color: #FFAC3A; } /*--------------bottom-header----------------*/ .bottom-header{ text-align: center; } .bottom-header .navbar-light .navbar-nav .active>.nav-link{ color: #FFAC3A; } .bottom-header ul>li>a:hover{ color: #FFAC3A !important; } .bottom-header ul li{ display: inline-block; margin-right: 10px; } .bottom-header ul li a{ color: #333; font: 700 14px 'Roboto Condensed', sans-serif; letter-spacing: 1px; text-transform: uppercase; color: #333; } .bottom-header .navbar-light .navbar-nav .nav-link{ color: #333; padding: 1.3rem 1rem; } .navbar-light .navbar-toggler{ outline: 0; } .searchbox svg{ font-size: 16px; } .navbar-nav .dropdown-menu{ display: block; visibility: hidden; top: 46px; border: none; margin: 0; padding: 0; border-radius: 0; /*border: 1px solid #ddd;*/ border-top: 1px solid #ddd; } .navbar .navbar-nav .dropdown .dropdown-menu a.item-list{ padding: 14px; border-bottom: 1px solid #eee; color: rgba(0, 0, 0, 0.5); background: #ffffff; min-width: 200px; } .navbar .navbar-nav .dropdown .dropdown-menu a.item-list:hover{ color: rgba(0,0,0,0.7); } .navbar-nav li.nav-item:hover .dropdown-menu{ visibility: visible; top: 58px; transition: all 0.5s ease-in-out; } .bottom-header .navbar-nav{ display: inline-block; margin: auto; } .navbar{ padding: 0; webkit-box-shadow: 0 7px 6px -4px rgba(0,0,0,0.2); -moz-box-shadow: 0 7px 6px -4px rgba(0,0,0,0.2); box-shadow: 0 7px 6px -4px rgba(0,0,0,0.2); } /*-------------------banner-----------*/ .banner h1{ color: #ffffff; } .wrapper{ position: relative; } .wrapper .banner-wrap{ position: absolute; top: 32%; width: 100%; } .banner figure img{ width: 100%; height: 550px; object-fit: cover; } .banner .wrapper .hero-content{ position: relative; z-index: 9; width: 60%; margin: auto; } .banner figure{ margin: 0; } .banner figure img{ margin-bottom: 0; } .owl-nav{ margin: 0 !important; } .banner .owl-theme .owl-nav [class*=owl-]{ background: transparent; position: absolute; top: 45%; } .banner .owl-carousel .owl-nav .owl-prev{ left: 0px; visibility: hidden; transition: all 0.5s ease-in-out; background: rgba(255,172,58,0.5); width: 50px; height: 50px; line-height: 50px; /* border-radius: 50px;*/ } .banner .owl-carousel .owl-nav .owl-next{ right: 0px; visibility: hidden; transition: all 0.5s ease-in-out; background: rgba(255,172,58,0.5); width: 50px; height: 50px; line-height: 50px; /* border-radius: 50px;*/ } .banner:hover .owl-carousel .owl-nav .owl-next{ visibility: visible; right: 20px; transition: all 0.5s ease-in-out; } .banner:hover .owl-carousel .owl-nav .owl-prev{ visibility: visible; left: 20px; transition: all 0.5s ease-in-out; } .read-more{ color: #ffffff; padding: 6px 18px; border: 1px solid #ffffff; display: inline-block; text-transform: uppercase; font-family: "Roboto Condensed"; letter-spacing: 2px; } .read-more:hover{ color: #ffac3a; border-color: #ffac3a; } .hero-content p{ margin: 25px 0; font: 400 17px "Open Sans"; color: #ffffff; line-height: 28px; } .hero-content h1{ text-transform: capitalize; } .owl-nav svg{ font-size: 20px; } .banner .owl-theme .owl-dots{ position: absolute; width: 100%; bottom: 55px; } .banner .owl-theme .owl-dots .owl-dot span{ background: #ffffff; } .banner .owl-theme .owl-dots .active span{ background: #ffac3a; } /*----------------main-content-wrapper---------*/ .main-content-wrapper{ padding: 60px 0 30px 0; display: block; } .main-content-wrapper .primary-wrapper{ padding-left: 0; } .main-content-wrapper .secondary-wrapper{ padding-right: 0; } .main-content-wrapper .site-main{ padding-right: 56px; } .meta-blog svg{ color: #ffac3a; margin-right: 4px; } .blog-img-content figure img{ width: 100%; } .blog-list figure{ overflow: hidden; } .blog-list figure img{ width: 100%; transition: all 0.5s ease-in-out; } .blog-list figure:hover img{ transform: scale(1.1); } .wrap-meta{ position: relative; } .entry-meta{ display: inline-block; padding: 15px 30px 15px 15px; position: absolute; bottom: 0; background: #ffffff; } .entry-meta span{ margin-right: 15px; font: 600 14px "Roboto Condensed"; color: #333; } .entry-meta span a{ color: #333; } .share-on{ border-right: 1px solid #ccc; margin-left: 15px; } .share-on h3{ /* text-transform: capitalize;*/ font: 400 22px "Roboto Condensed"; margin-bottom: 30px; } .share-icons{ text-align: center; } .share-icons span { height: 40px; width: 40px; line-height: 40px; text-align: center; border: 1px solid #ccc; display: inline-block; margin-bottom: 20px; font-size: 16px; color: rgba(51,51,51,0.7); } .share-icons:nth-child(4n) a span{ margin-bottom: 0 !important; } .share-icons span:hover{ color: #ffac3a; border-color: #ffac3a; } .blog-text p{ color: #333; text-transform: none; line-height: 30px; } .blog-text h2{ margin-bottom: 20px; } .blog-text a.readmore{ padding: 7px 35px; color: #ffffff; background: #ffac3a; display: inline-block; margin-top: 6px; transition: all 0.5s ease-in-out; border: 1px solid #ffac3a; } .blog-text a.readmore:hover{ background: transparent; color: #ffac3a; } .blog-text a.readmore:hover span{ color: #ffac3a; } .blog-list{ padding-bottom: 55px; border-bottom: 1px solid #ccc; margin-bottom: 55px; } .blog-text{ margin-top: 45px; } .blogger .textwidget figure img{ max-width: 100%; border-radius: 50%; } .main-content-wrapper a.readmore span{ margin-left: 10px; display: inline-block; vertical-align: middle; } /*-------------------top-footer-----------------*/ .top-footer{ padding: 60px 0; background: #212121; } .top-footer .textwidget a{ color: #bebebe; } .top-footer .textwidget a:hover{ color: #ffac3a; } .textwidget p{ text-transform: none; } .textwidget p span{ display: inline-block; min-width: 32px; } .textwidget form input[type=submit]{ background: #ffac3a; text-transform: capitalize; border: none; color: #ffffff; padding: 5px 20px; cursor: pointer; font-family: Roboto Condensed; border: 1px solid #ffac3a; } .textwidget form input[type=submit]:hover{ background: transparent; transition: all 0.5s ease-in-out; } .textwidget form input[type=email]{ border: none; padding: 10px; width: 80%; margin-right: 10px; } .news-letter{ width: 100%; display: flex; } .top-footer h4{ margin-bottom: 30px; } /*-------------------.bottom-footer---------------*/ .bottom-footer{ padding: 20px 0; background: #000; display: block; text-align: center; } .bottom-footer ul{ display: inline-block; text-align: center; } .bottom-footer ul li{ display: inline-block; margin-right: 25px; } .bottom-footer ul li:last-child{ margin-right: 0; } .bottom-footer ul li a{ color: #bebebe; text-transform: uppercase; font: 400 14px "Roboto Condensed"; letter-spacing: 2px; } .bottom-footer ul li a:hover{ color: #ffac3a; } .copyright-area{ color: #ffffff; margin-top: 15px; } .copyright-area a{ color: #ffac3a; } .copyright-area a:hover{ color: rgba(255, 172, 58, 0.7); } .textwidget p{ color: #bebebe; } .textwidget p span svg{ color: #ffac3a; margin-right: 15px; font-size: 16px; } /*---------------------sidebar------------*/ .secondary-wrapper aside{ margin-bottom: 40px; } .widget_search form{ display: flex; margin-bottom: 30px; } .widget_search form .btn{ border: 1px solid #333; background: transparent; border-radius: 0; outline: none; vertical-align: top !important; margin-left: 10px; } .widget_search form .btn:focus{ outline: none; box-shadow: none; } .widget_search form input{ border: 1px solid #333; padding: 0 10px; width: 100%; } .title-sidebar{ text-align: center; padding: 20px 0; } .title-sidebar h3{ text-transform: uppercase; z-index: 9; } .title-sidebar h3 { overflow: hidden; text-align: center; } .title-sidebar h3:before, .title-sidebar h3:after { background-color: #ffac3a; content: ""; display: inline-block; height: 1px; position: relative; vertical-align: middle; width: 50%; } .title-sidebar h3:before { right: 0.5em; margin-left: -50%; } .title-sidebar h3:after { left: 0.5em; margin-right: -50%; } .icons-sidebar{ text-align: center; } .icons-sidebar ul li a{ color: #333; } .post-img{ margin-bottom: 25px; } .post-img figure img{ width: 100%; } .post-img a figure{ overflow: hidden; } .post-img a figure img{ transition: all 0.5s ease-in-out; } .post-img a figure:hover img{ transform: scale(1.1); } .post-img h5 a{ color: rgba(33,33,33,0.7); transition: all 0.5s ease-in-out; } .post-img h5 a:hover{ color: #ffac3a; } .post-img span svg{ color: #333 !important; font-size: 14px; } .secondary-wrapper .post-img span svg{ margin-right: 7px; } .post-img a time{ color: #333; font: 400 14px "Roboto Condensed"; } .list-categories li{ margin-bottom: 20px; } .list-categories li a{ font: 400 14px "Roboto Condensed"; color: #212121; } .list-categories li a:hover{ color: #ffac3a; } .list-categories li a span{ margin-right: 10px; color: #ffac3a; } .list-categories svg{ font-size: 20px; vertical-align: middle; } /*--------------rec-posts-------------------*/ .posted-on a:hover{ color: #ffac3a; } .byline a:hover{ color: #ffac3a; } .comments-link a:hover{ color: #ffac3a; } .wrap-rec-posts{ display: flex; margin-bottom: 20px; } .figure-rec-posts{ width: 30%; margin-right: 15px; } .figure-rec-posts img{ width: 100%; } .rec-post-grid h5 a{ color: #212121; transition: all 0.5s ease-in-out; } .rec-post-grid h5 a:hover{ color: #ffac3a; } .rec-post-grid span svg{ color: #333 !important; font-size: 14px; } .rec-post-grid span time{ color: #333; font: 400 14px "Roboto Condensed"; } .figure-rec-posts{ overflow: hidden; } .figure-rec-posts a img{ transition: all 0.5s ease-in-out; } .figure-rec-posts a:hover img{ transform: scale(1.1); } /*-----------tags-----------------------*/ .tags li{ float: left; } .tags li a{ padding: 7px 13px 5px; border: 1px solid #eee; display: inline-block; margin-right: 10px; margin-top: 10px; text-transform: uppercase; color: #333; transition: all 0.5s ease-in-out; font-size: 14px; } .tags li a:hover{ background: #ffac3a; color: #ffffff; transition: all 0.5s ease-in-out; } .tags-links a:hover{ color: #ffac3a; } .overlay{ width: 100%; height: 100%; top: 0; right: 0; background: rgba(0,0,0,0.6); position: absolute; z-index: 1; } /*-------------------detail-page----------------*/ .detail-page .blog-list figure:hover img{ transform: scale(1); } .page-title{ height: 250px; position: relative; background-repeat: no-repeat; background-size: cover; z-index: 9; display: block; } .page-title h1{ color: #ffffff; display: inline-block; vertical-align: middle; position: relative; z-index: 9; margin-top: 100px; } .page-title h1:after{ content: ''; width: 50px; height: 2px; background: #ffac3a; position: absolute; bottom: 18px; left: 100%; margin-left: 10px; } .detail-page .primary-wrapper .entry-meta{ position: relative; padding-left: 0; } .detail-page .primary-wrapper h3{ letter-spacing: 2px; margin-top: 40px; } .detail-page .primary-wrapper article{ border-bottom: none !important; } /*.detail-page span svg{ margin-right: 15px; }*/ .detail-page .primary-wrapper p{ color: #333; text-transform: none; line-height: 30px; } .entry-meta svg{ color: #ffac3a; } .detail-page .primary-wrapper .entry-meta span svg{ margin-right: 10px; } .detail-page .primary-wrapper .entry-meta a{ font-weight: 400; font-style: italic; color: rgba(33,33,33,0.7); } /*---------------------comment-form------------*/ .comment-form{ width: 100%; } .comment-form h3{ text-transform: uppercase; margin-bottom: 30px; } .comment-form input{ padding: 6px; border: 1px solid #212121; width: 100%; } .comment-form textarea{ width: 100%; padding: 10px; min-height: 250px; margin-top: 30px; border: 1px solid #212121; outline: 0; } .cmt-btn{ margin-top: 20px; } .cmt-btn input[type="submit"]{ float: right; padding: 5px 45px; color: #ffffff; background: #ffac3a; border: none; text-transform: uppercase; font-size: 14px; cursor: pointer; font-weight: 600; width: auto !important; } .cmt-btn input[type="submit"]:hover{ background: rgba(255,172,58,0.7); } /*--------------------------banner-single-----------*/ .single figure img { width: 100%; height: auto; min-height: 300px; max-height: 300px; object-fit: cover; } .single .item .wrapper{ position: relative; } .single .item .wrapper .hero-content{ position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0,0,0,0.5); padding: 20px 15px; top: 70%; } .list{ width: 60%; margin: auto; } .list .primary-wrapper .site-main{ padding-right: 0; } .single .hero-content h5{ color: #ffffff; } .single .hero-content span{ color: #ffffff; } /*----------------------sngle-content-----------------*// .list .share-on{ display: block; } .list .share-on .share-icons{ display: inline-block; margin-right: 20px; margin-bottom: 0; } .single .owl-theme .owl-dots{ bottom: -30px; } .single .owl-theme .owl-dots .owl-dot span{ background: #333; } .single .owl-theme .owl-dots .active span{ background: #ffac3a; } .single .owl-theme .owl-nav{ display: none; } .list .blog-left .share-on{ border-right: 0; } .list .blog-left{ border-left: 1px solid #ffac3a; margin-bottom: 15px; } /*----------------------toTop------------------------*/ .scrollToTop{ width:50px; height:50px; line-height: 50px; text-align:center; /*background: #ffac3a;*/ font-weight: bold; color: #ffac3a; text-decoration: none; position:fixed; bottom: 15px; right: 15px; display:none; z-index: 9999; font-size: 25px; } .scrollToTop:hover{ color: #333; transition: all 0.5s ease-in-out; }