/* Updated On : 11/14/2016 | 02:21 PM */ body { margin: 0; padding: 0; letter-spacing: 0.7px; line-height: 1.6; color: #4d4d4d; font-family: 'Josefin Sans', sans-serif; font-size: 16px; font-weight: 500; } .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { line-height: 1.4; } a, a:hover, a.btn-effect, a.btn-effect::after, input, #top-menu .submenu-button::after, #top-menu .submenu-button::before { -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -ms-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; } .theNavigationBar { width: 100%; top: 15px; left: 0; text-align: center; position: relative; left: 0; } .main-navigation { clear: both; display: block; font-size: 12px; text-transform: uppercase; letter-spacing: 1px; } .main-navigation ul { list-style: none; margin: 0; padding-left: 0; } .main-navigation ul li { position: relative; margin: 0 auto; display: inline-block; } .main-navigation ul:not(.sub-menu) > li { -webkit-transition: top .3s ease-in-out, opacity .3s ease-in-out; transition: top .3s ease-in-out, opacity .3s ease-in-out; } .main-navigation li a:not(:last-child):after { content: "\f107"; font-family: FontAwesome; margin: 0 0 0 10px; line-height: 1; } .main-navigation ul ul li a:not(:last-child):after { content: "\f105"; margin: 0 0 0 10px; float: right; line-height: inherit; } .main-navigation a { display: block; text-decoration: none; padding: 1.5em; border-top: 2px solid transparent; -o-transition: border-top .3s ease-in-out; -moz-transition: border-top .3s ease-in-out; -webkit-transition: border-top .3s ease-in-out; transition: border-top .3s ease-in-out; } .main-navigation ul ul { float: left; position: absolute; top: 62px; left: auto; z-index: 99999; display: none; opacity: 0; background: #6c6c6c; text-transform: none; text-align: left; transition: display 0s linear 0.2s, opacity 0.2s linear, transform 0.2s linear; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } .main-navigation ul ul ul { left: 100%; top: 0; display: none; opacity: 0; transition: display 0s linear 0.2s, opacity 0.2s linear, transform 0.2s linear; -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); } .main-navigation ul ul a { padding: 1em 1.5em; } .main-navigation ul ul li {} .main-navigation li:hover > a {} .main-navigation ul ul:hover > a {} .main-navigation ul ul a:hover { color: #ffffff; } .main-navigation ul li:hover > ul, .main-navigation ul li:focus > ul, .main-navigation ul li:active > ul, .main-navigation ul li.focus > ul { display: block; opacity: 1; transition-delay: 0s; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .main-navigation ul ul li:hover > ul, .main-navigation ul ul li:focus > ul, .main-navigation ul ul li:active > ul, .main-navigation ul ul li.focus > ul { display: block; opacity: 1; transition-delay: 0s; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .main-navigation ul li:hover > a, .main-navigation ul li.focus > a, .main-navigation li.current-menu-item > a, .main-navigation li.current-menu-parent > a, .main-navigation li.current-page-ancestor > a, .main-navigation .current_page_item > a, .main-navigation .current_page_parent > a { border-top: 2px solid #cea525; } ul.sub-menu .submenu-right { right: 100%; } ul.sub-menu .submenu-left { left: 100%; } /* Small menu */ .menu-toggle { display: none; } .site-main .comment-navigation, .site-main .posts-navigation, .site-main .post-navigation, .site-main .pagination, .site-main .woocommerce-pagination { margin: 0 -4em 1.5em; background: rgba(0, 0, 0, 0.03); overflow: hidden; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; font-weight: 400; } .site-main .pagination .nav-links { padding: 1.5em; text-align: center; } .site-main .pagination .nav-links > span, .page-links > span.page-links-number, .woocommerce-pagination .page-numbers span { display: inline-block; background: #cecece; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; line-height: 1; padding: 0.5em 0.8em; margin: 1px 0; } .woocommerce-pagination .page-numbers li { display: inline-block; } .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%; } .post-navigation .nav-previous, .post-navigation .nav-next, .posts-navigation .nav-previous, .posts-navigation .nav-next, .comment-navigation .nav-previous, .comment-navigation .nav-next { padding: 5px; } .posts-navigation .nav-previous a, .posts-navigation .nav-next a, .comment-navigation .nav-previous a, .comment-navigation .nav-next a { text-transform: uppercase; letter-spacing: -1px; } .post-navigation .nav-next { border-left: 1px solid rgba(0, 0, 0, 0.03); } .post-navigation .meta-nav { display: inline-block; width: 90%; text-transform: uppercase; letter-spacing: -1px; } .post-navigation .nav-previous .meta-nav { padding-left: 10px; } .post-navigation .nav-next .meta-nav { padding-right: 10px; } /*menu*/ .subtitle { margin: 0 0 2em 0; } .fancy { line-height: 0.4; text-align: center; } .fancy span { display: inline-block; position: relative; } .fancy span:before, .fancy span:after { content: ""; position: absolute; height: 5px; border-top: 1px solid #ad2737; top: 0; width: 600px; } .fancy span:before { right: 100%; margin-right: 15px; } .fancy span:after { left: 100%; margin-left: 15px; } /*masonary grid*/ * { box-sizing: border-box; } /* force scrollbar */ /* clear fix */ .grid:after { content: ''; display: block; clear: both; } /* grid-item */ .grid-sizer, .grid-item { width: 48.06%; margin: 1%; } .grid-item { float: left; box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.2); transition: box-shadow 0.3s ease-in-out; border-radius: 3px; } .blog-content-left:hover { box-shadow: 0 1px 4px 3px rgba(0, 0, 0, 0.15); } .grid-item img { display: block; max-width: 100%; margin: 0 0 15px; } /*masonary grid*/ /*ul,*/ h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; } a { text-decoration: none; transition: 1s; } img, figure { max-width: 100%; height: auto; } a:focus, a:hover { outline: none; border: none; text-decoration: none; } /* Our Site Button(a Tag) */ a.btn-effect { background: none; border: 1px solid transparent; -moz-border-image: -moz-linear-gradient(right, #ad2737 0%, #ae1558 100%); -webkit-border-image: -webkit-linear-gradient(right, #ad2737 0%, #ae1558 100%); border-image: linear-gradient(to right, #ad2737 0%, #ae1558 100%); border-image-slice: 1; color: #FFF; display: inline-block; font-size: 14px; font-weight: 700; padding: 10px 20px; position: relative; text-transform: uppercase; text-decoration: none; } a.btn-effect::before, a.btn-effect::after { background: linear-gradient(to right, #ad2737, #ae1558); content: ''; position: absolute; z-index: -1; } a.btn-effect:hover { color: #fff; border: 1px solid transparent; -moz-border-image: -moz-linear-gradient(right, #ad2737 0%, #ae1558 100%); -webkit-border-image: -webkit-linear-gradient(right, #ad2737 0%, #ae1558 100%); border-image: linear-gradient(to right, #ad2737 0%, #ae1558 100%); border-image-slice: 1; } .btn-effect::after { height: 0; left: 50%; top: 50%; width: 0; } .btn-effect:hover:after { height: 100%; left: 0; top: 0; width: 100%; z-index: -999; } /* Our Site Button(a Tag) End */ /* Start header */ .header-top { width: 100%; position: absolute; background-color: #fff; position: relative; z-index: 999; } /* Main-Menu */ .logo { position: relative; font: 24px verdana; float: left; line-height: 1.4; max-width: 250px; margin: 15px 0 0; } .logo a { color: #ad2737; font-size: 24px; font-style: italic; } .logo img { width: 100%; max-width: 200px; height: auto; max-height: 60px; } nav { position: relative; width: 100%; margin: 0 auto; } /* box-toper End */ /* footer */ #main-footer { background: #e1e1e1; padding: 30px 0; } .footer-menu { width: 100%; text-align: center; margin: 15px auto; } .footer-menu ul { margin: 0; padding: 0; list-style: none; } .footer-menu ul li { display: inline-block; padding: 0 15px; position: relative; text-transform: uppercase; font-size: 14px; font-weight: 700; } .footer-menu ul li:first-child:after, .footer-menu ul li:first-child:before { display: none; } .footer-menu ul li a { color: #4d4d4d; transition: 0.3s; } .footer-menu ul li a:hover { color: #ad2737; } .footer-social-icon { width: 100%; text-align: center; display: block; margin: 20px auto; } .footer-social-icon ul { margin: 0; padding: 0; list-style: none; } .footer-social-icon ul li { padding: 0 32px; display: inline-block; } .footer-social-icon a { color: #4d4d4d; } .footer-social-icon span { font-size: 20px; background: #4d4d4d; color: #FFF; padding: 5px 8px; transition: 0.3s; } .footer-social-icon span.fa-facebook { padding: 5px 10px; } .footer-social-icon span.fa-pinterest-p { padding: 5px 10px; } .footer-social-icon span:hover { background: #ad2737; } .footer-copyrights { margin: 25px 0 3px; color: #d3d9da; text-align: center; font-size: 14px; } .footer-copyrights p, a { color: #4d4d4d; margin: 0; } .footer-copyrights a:hover, .footer-copyrights a:focus { color: #ad2737; outline: none; text-decoration: none; } /* End footer */ /* blog-title bar */ #blog-title-top { width: 100%; display: block; position: relative; padding: 20px 0; border-bottom: 1px solid #E1E1E1; overflow: hidden; } .blog-title { width: 100%; text-align: left; } .blog-title h2 { margin: 0 auto; font-weight: 700; font-size: 24px; float: left; padding-top: 10px; } .blogsub-title { width: 100%; text-align: center; margin: 18px 0; font-weight: 600; } .blogsub-title a { display: inline-block; } /* blog-title bar end */ /* Inner-pages */ /* Blog page */ #blogcontent { padding: 30px 0; } .blog-content-left h2 { font-size: 20px; font-weight: 700; margin: 0 0 10px; transition: 0.5s; display: inline-block; color: #465a65; } .blog-content-left h2:hover { color: #ad2737; } .blog-content-left ul { margin: 0; padding: 0; list-style: none; } .blog-content-left ul li:first-child { padding: 0; } .blog-content-left ul li { display: inline-block; padding: 0 10px 18px; font-size: 14px; font-weight: 500; color: #4d4d4d; } .blog-content-left p { margin: 0 0 20px; display: inline; } .blog-content-left ul li a { position: inherit; padding: 0; color: #4d4d4d; background: none; transition: 0.5s; font-size: 14px; font-weight: 500; } .blog-info-text { padding: 12px 15px; z-index: 999; position: relative; } .blog-content-left a { color: #ad2737; font-size: 14px; font-weight: 700; } .blog-content-left a:hover { color: #ad2737; } .blog-sidebar input { position: relative; display: inline-block; max-width: 100%; margin: 0 0 15px; padding: 6px 20px 6px 14px; background: transparent; border-radius: 0px; border: none; border: 1px solid #a1c0c8; box-shadow: inherit; color: #829298; letter-spacing: 1px; outline: 0; } .blog-sidebar input:focus { border: 1px #ff3d2e solid; } .blog-sidebar { padding: 30px 0; } .blog-sidebar aside { padding: 0 0 30px; } .blog-sidebar h2 { color: #ad2737; margin: -4px 0 10px; display: block; font-weight: 500; font-size: 20px; } .blog-sidebar h2:after { content: '\f111 \f111 \f111'; font-family: 'FontAwesome'; display: block; font-size: 8px; margin: 10px 0 0; color: #e1e1e1; } .blog-sidebar .right-side { margin: 0 0 5px; display: inline-block; } .blog-sidebar .widget ul { padding: 0; list-style: none; } .blog-sidebar .widget ul li { padding: 0 0 8px; text-align: left; } .blog-sidebar .widget ul li .blog-media-right { display: table-cell; padding-right: 18px; } .blog-sidebar .widget ul li .blog-media-right img { max-width: 60px; min-height: 60px; } .blog-sidebar .widget ul li .blog-media-left { display: table-cell; vertical-align: top; } .blog-sidebar .widget ul li .blog-media-left p { margin: -5px 0 4px; } .blog-sidebar .widget ul li .blog-media-left span { font-size: 14px; opacity: 0.8; } .blog-sidebar .widget ul li a { color: #465a65; display: inline-block; transition: 0.5s; font-weight: 400; font-size: 14px; } .blog-sidebar .widget ul li a:hover { color: #ad2737; } .blog-sidebar ul { margin: 0; padding: 0; list-style: none; } .blog-sidebar ul li { padding: 5px 0; } .blog-sidebar ul li a { color: #465a65; display: inline-block; transition: 0.5s; font-weight: 700; } .blog-sidebar ul li a:hover { color: #ad2737; } .blog-sidebar .widget_categories ul li a { content: ''; display: block; width: 0; background: #ff3d2e; transition: width .3s; } .blog-sidebar .widget_categories ul li a:hover::after { width: 100%; transition: width .3s; } .blog-content-part { padding: 0 0 15px; } /*For-blog-page css*/ .blog-content-part .blog-img { margin: 0 0 15px; } /*For-blog-page css End*/ /*box-shodow-inset effect in hover*/ .blog-content-left { margin: 0px 0 15px; overflow: hidden; position: relative; z-index: 99; } .blog-content-left:after { content: ''; position: absolute; transition: 0.3s; top: 0; bottom: 0; left: 0; right: 0; } /*images shodow*/ .blog-img { max-height: 245px; width: 100%; overflow: hidden; position: relative; margin: 10px 0 0; display: inline-block; } .bloginner-content-part .blog-img { margin: 0px 0 20px } .blog-img a:after { content: ''; position: absolute; transition: 0.3s; top: 0; bottom: 0; left: 0; right: 0; } /*box-shodow-inset effect in hover end*/ .blog-img img { width: 100%; overflow: hidden; } .blog-info { position: relative; margin: 10px 0 10px; } .blog-slider .owl-carousel { overflow: hidden; margin: 10px 0 0; } .blog-slider .blog-img { margin: 0 0 10px; } .blog-btn-link a { color: #FFF; position: absolute; top: 0; left: 0; background: #272f32; padding: 15px 30px; z-index: 9999; } /* single post Next Prev Button CSS Start */ .navigation.post-navigation { clear: both; display: inline-block; margin: 0 0 30px; } .meta-nav-prev, .meta-nav-next { color: #4d4d4d; font-weight: 700; padding: 3px 13px; transition: all 0.3s ease 0s; float: left; } .meta-nav-next { float: right; } .meta-nav-next:hover, .meta-nav-prev:hover { background: #ad2737; color: #fff; } /* pagination */ .page-numbers { display: inline-block; padding: 6px 14px; margin: 0 7px 0 0; text-decoration: none; font-weight: 600; transition: 0.3s; } .page-numbers.current, a.page-numbers:hover { background: #ad2737; color: #fff; text-decoration: none; } .page-numbers > li { list-style: none; float: left; } .page-numbers.prev { border-bottom-left-radius: 4px; border-top-left-radius: 4px; } .page-numbers.next { right: 0; border-bottom-right-radius: 4px; border-top-right-radius: 4px; } .page-numbers .next:after, .page-numbers .next:before { content: none; } div#respond h3 { padding-bottom: 25px; } /* Blog page End */ /* Blog page Single */ #blog-innerpage-content { padding: 0 0 30px; } #blog-innerpage-content .bloginner-content-part { padding: 30px 0 0; } #blog-innerpage-content .bloginner-content-part { border: none; } #blog-innerpage-content .bloginner-content-part p { margin: 0 0 25px; } #blog-innerpage-content .bloginner-content-part blockquote p { opacity: 0.8; margin: 0; } #blog-innerpage-content .bloginner-content-part blockquote { font-style: italic; border-left: 5px solid #ad2737; padding: 10px; } .bloginner-content-part .title-data { margin: 0 0 15px; } .bloginner-content-part .title-data h2 { font-size: 16px; font-weight: 700; margin: 0 0 10px; transition: 0.5s; display: block; color: #465a65; } .bloginner-content-part .title-data ul { margin: 0; padding: 0; list-style: none; } .bloginner-content-part .title-data ul li { display: inline-block; padding: 0 10px 5px 0; font-size: 14px; color: #78909c; } .bloginner-content-part ul li a { position: inherit; padding: 0; color: #78909c; background: none; transition: 0.5s; } .bloginner-content-part ul li a:hover { color: #ad2737; } /*commnet-part*/ .comment-part { padding: 20px 0; } .comment-part h3 { margin-bottom: 13px; font-size: 16px; font-weight: 700; display: inline-block; } .comment-info { margin: 25px 0; } .comment-info .comment-info-left { vertical-align: top; } .comment-info .comment-info-right { vertical-align: top; } .comment-info img { max-width: 46px; display: block; float: left; clear: both; margin: 0 10px 0 0; } .comment-info strong { display: inline-block; } .comment-info a { color: #ad2737; float: right; transition: 0.5s; font-weight: 600; } .comment-info span { display: block; font-size: 12px; opacity: 0.8; overflow: hidden; margin: 0 0 17px; } .comment-info p { overflow: hidden; margin-bottom: 0; padding: 0 0 20px; max-width: 86%; } /* post form */ .leave-reply-form { width: 100%; clear: both; display: inline-block; } .bloginner-content-part h3 { position: relative; display: inline-block; margin: 0 0 20px; } /* commnet input box */ .leave-reply-form h2 { margin: 0 0 30px; } .group { position: relative; } input[type=text], input[type=email], input[type=number], input[type=password], input[type=file], input[type=reset], textarea { margin: 10px 0; } input, textarea { display: inline-block; width: 100%; padding: 6px 12px; color: #4d4d4d; background: transparent; border-radius: 0px; border: 1px solid #e1e1e1; box-shadow: inherit; } textarea { width: 100%; } input:focus { outline: none; border-bottom: 1px solid #ad2737; } textarea:focus { border-bottom: 1px solid #ad2737; outline: none; } button, html input[type=button], input[type=reset], input[type=submit] { Background-color: #4d4d4d; width: auto; color: #fff; } button, html input[type=button]:hover, input[type=reset]:hover, input[type=submit]:hover { Background-color: #ad2737; } /* LABEL */ label { color: #4d4d4d; opacity: 0.8; left: 10px; top: 10px; transition: 0.2s ease all; -moz-transition: 0.2s ease all; -webkit-transition: 0.2s ease all; } /* active state */ input:focus ~ label, input:valid ~ label { top: -30px; color: #ad2737; } textarea:focus ~ label, textarea:valid ~ label { top: -30px; color: #ad2737; } /* active state */ input:focus ~ .bar:before, input:focus ~ .bar:after { width: 50%; } textarea:focus ~ .bar:before, textarea:focus ~ .bar:after { width: 50%; } /* HIGHLIGHTER */ .highlight { position: absolute; height: 60%; width: 100px; top: 25%; left: 0; pointer-events: none; opacity: 0.5; } /* active state */ input:focus ~ .highlight { -webkit-animation: inputHighlighter 0.3s ease; -moz-animation: inputHighlighter 0.3s ease; animation: inputHighlighter 0.3s ease; } textarea:focus ~ .highlight { -webkit-animation: inputHighlighter 0.3s ease; -moz-animation: inputHighlighter 0.3s ease; animation: inputHighlighter 0.3s ease; } /* post button */ .leave-reply-form p.form-submit { display: inline-block; background: #ad2737; border: none; color: #fff; z-index: 99; cursor: pointer; display: inline-block; vertical-align: middle; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; position: relative; -webkit-transition-property: color; transition-property: color; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; transition: 0.1s; } .leave-reply-form p.form-submit:before { content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; left: 0; right: 0; background: #4d4d4d; -webkit-transform: scaleY(1); transform: scaleY(1); -webkit-transform-origin: 50%; transform-origin: 50%; -webkit-transition-property: transform; transition-property: transform; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } .leave-reply-form p.form-submit:hover:before { -webkit-transform: scaleY(0); transform: scaleY(0); } .leave-reply-form p.form-submit:hover, .leave-reply-form p.form-submit:focus, .leave-reply-form p.form-submit:active { color: white; } .form-submit input { padding: 10px 38px; border: none; background: none; color: #fff; } .form-submit:hover { border: none; } /* commnet input box */ /* custom logo Start */ .logged-in-as { margin-bottom: 22px; } /* custom logo End */ /* Blog page single End */ /* main-screen mobile menu css */ /*Bread Crumbs*/ .breadCumbs { text-align: right; } #breadcrumbs { list-style: none; margin: 10px 0; overflow: hidden; } #breadcrumbs li { display: inline-block; vertical-align: middle; margin-right: 5px; font-size: 14px; } #breadcrumbs .separator { font-size: 15px; font-weight: 500; color: #ad2737; } /*breadcrumbs*/ /* new menu button css(.menu) */ .header-top { box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.3); } .fixed-header { position: fixed; } .header-top.fixed-header { -webkit-animation-name: slideInDown; animation-name: slideInDown; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes slideInDown { from { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes slideInDown { from { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .menu { cursor: pointer; position: relative; width: 24px; height: 40px; float: right; margin: 15px 0 0; } .menu-global { backface-visibility: hidden; position: absolute; left: 0; border-top: 3px solid #ad2737; width: 100%; transition: all 0.55s ease-in-out; } .menu-top { top: 11px; } .menu-middle { top: 18px; } .menu-bottom { top: 25px; } .menu-top-click { backface-visibility: hidden; top: 20px; transform: rotate(50deg); transition: all 0.55s ease-in-out; border-color: #465a65; } .menu-middle-click { opacity: 0; } .menu-bottom-click { backface-visibility: hidden; top: 20px; transform: rotate(-410deg); transition: 0.55s; border-color: #465a65; } /* new menu button css(.menu) End */ /*menu-button click-open ul code*/ .blog-sidebar .widget ul li a.rsswidget { display: block; } input[type="search"].search-field { border: 1px solid #c6c6c6; outline: 0; width: 100%; padding-left: 5px; border-right: transparent; height: 36px; } .search-submit::before { content: '\f002'; font-size: 16px; font-family: 'FontAwesome'; } .screen-reader-text { display: none; } .sidebar-content .search-form { position: relative; } button.search-submit { position: absolute; right: 0%; top: 0; border: 0; padding: 0; width: 36px; height: 36px; background: #ad2737; color: #fff; text-align: center; transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -webkit-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; } .search-form label { width: 100%; } form.search-form { position: relative; } /* blog-calender-table*/ .screen-reader-text { display: none; } #today > a { color: #fff; } .blog-sidebar table { width: 100%; } .blog-sidebar th { color: #61757c; } .blog-sidebar td { opacity: 0.8; font-size: 14px; } .blog-sidebar td, .blog-sidebar th { text-align: center; border: 1px solid #a1c0c8; padding: 5px 0 5px 0px; } .blog-sidebar #today { background: #ad2737; color: #FFF; } /* blog-img*/ .blog-sidebar .widget_text img { width: 100%; height: auto; margin: 10px 0 15px; } /*select-box*/ .widget select { display: inline-block; max-width: 100%; margin: 10px 0 0; padding: 6px 20px 6px 14px; background: transparent; border-radius: 0px; border: none; border: 1px solid #a1c0c8; box-shadow: inherit; color: #829298; letter-spacing: 1px; outline: 0; cursor: pointer; } .widget .tagcloud a:hover { color: #ad2737; } /* navbar-menu(ul) */ .widget ul.menu { width: auto; height: auto; float: left; } .widget ul.menu li a { font-size: 20px; } .widget ul.sub-menu li { padding: 0 0 0; } .widget ul.sub-menu li a,footer .widget ul.menu li a { font-size: 14px; } .widget ul.sub-menu { margin: 5px 0 0; } .widget .widget-title a:hover { color: #ad2737; } /*For-blog-page css End*/ .astrology-search-form label { margin-bottom: 30px; width: 100%; } .astrology-search-form .search-field { border: 1px solid #a1c0c8; color: #829298; } /*comments css*/ .comment-body { overflow: hidden; margin: 2% 0; } .admin img { float: left; margin-right: 15px; width: auto; } .comment-metadata a { color: #212121; padding-top: 1%; font-size: 14px; line-height: 25px; } .comment-content p { font-size: 14px; line-height: 25px; color: #545454; } .reply { padding-top: 1%; display: inline-block; overflow: hidden; transition: all 0.3s ease 0s; } .reply a.comment-reply-link{ padding: 5px 15px 4px; font-weight: bold; } .reply a.comment-reply-link:hover{ background: #ad2737; color: #fff; } [class*="depth-"]{ padding-left: 1.75em; } .comment .children > li { padding-left: 1.75em; } /* Media Query Start */ @media screen and (min-width:1025px) { #top-menu, #top-menu ul, #top-menu ul li, #top-menu ul li a, #top-menu #box-top-mobile { border: 0; list-style: none; display: block; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #top-menu:after, #top-menu > ul:after { content: "."; display: block; clear: both; visibility: hidden; height: 0; } #top-menu #box-top-mobile { display: none; } #top-menu { width: 100%; float: left; } #top-menu > ul { float: right; margin-right: 30px; } #top-menu > ul > li { display: inline-block; } #top-menu > ul > li > a { padding: 18px 15px; margin: 5px 0; font-size: 14px; text-decoration: none; color: #465a65; border-top: 2px solid transparent; transition: border-top .3s ease-in-out; } #top-menu > ul > li.has-sub > a { padding-right: 11px; } #top-menu ul ul li.has-sub > a { padding-right: 15px; } #top-menu > ul > li:hover > a, #top-menu ul li.active a { border-top: 2px solid #ad2737; } ul.sub-menu .submenu-right { right: 100%; } ul.sub-menu .submenu-left { left: 100%; } #top-menu > ul > li.has-sub:hover > a:before { top: 23px; height: 0; } #top-menu ul { padding-left: 0; } #top-menu ul ul { position: absolute; left: -9999px; z-index: 9999999; visibility: inherit; opacity: inherit; height: inherit; opacity: 0; transition: display 0s linear 0.2s, opacity 0.2s linear, transform 0.2s linear; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } #top-menu ul ul { position: absolute; left: -9999px; z-index: 9999999; visibility: inherit; opacity: inherit; height: inherit; opacity: 0; transition: display 0s linear 0.2s, opacity 0.2s linear, transform 0.2s linear; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } /* top-arrow icon */ #top-menu ul ul:after { position: absolute; right: 5px; content: ""; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: border-color 0.2s ease; -moz-transition: border-color 0.2s ease; -ms-transition: border-color 0.2s ease; -o-transition: border-color 0.2s ease; transition: border-color 0.2s ease; background: #ad2737; top: -6px; left: 10px; z-index: -999; } /* top-arrow icon end */ #top-menu ul ul li { height: 0; -webkit-transition: all .25s ease; -ms-transition: all .25s ease; width: auto; background: #FFF; transition: width 1s; -webkit-transition: width 1s; /* Safari 3.1 to 6.0 */ transition: all 0.50s ease; } #top-menu ul ul li:hover { opacity: 1; transition-delay: 0s; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } #top-menu li:hover > ul { left: auto; opacity: 1; transition-delay: 0s; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } #top-menu li:hover > ul > li { height: auto; } #top-menu ul ul ul { margin-left: 100%; top: 0; height: auto; opacity: 0; transition: visibility 0s linear 0.2s, opacity 0.2s linear, transform 0.2s linear; -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); } #top-menu ul ul ul:after { position: absolute; right: 5px; content: ""; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: border-color 0.2s ease; -moz-transition: border-color 0.2s ease; -ms-transition: border-color 0.2s ease; -o-transition: border-color 0.2s ease; transition: border-color 0.2s ease; background: #ad2737; top: 10px; left: -6px; z-index: -999; } #top-menu ul ul li a { padding: 12px 12px; width: 185px; font-size: 14px; text-align: left; text-decoration: none; color: #fff; font-weight: 400; transition: all .0s ease; background: #ad2737; } #top-menu > ul > li.has-sub > a::after, #top-menu ul ul li.has-sub > a:after { position: relative; top: -2px; right: 0; width: 5px; height: 5px; margin-left: 5px; margin-right: 3px; border-bottom: 1px solid #4d4d4d; border-right: 1px solid #4d4d4d; content: ""; display: inline-block; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } #top-menu ul ul li.has-sub > a:after { position: absolute; top: 18px; right: 8px; border-color: #fff; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(-45deg); } #top-menu ul ul li:last-child > a, #top-menu ul ul li.last-item > a { border-bottom: 0; } #top-menu ul ul li:hover > a, #top-menu ul ul li a:hover { color: #fff; } #top-menu ul ul > li.has-sub:hover > a:before { top: 17px; height: 0; } #top-menu ul ul ul { padding-top: 0px; } #top-menu ul ul ul li.active a { border-left: 1px solid #333; } #top-menu > ul > li.has-sub > ul > li.active > a, #top-menu > ul ul > li.has-sub > ul > li.active> a { border-top: 1px solid #333; } #top-menu > ul { margin: 0; } #top-menu ul { width: auto; display: block !important; height: auto; opacity: 0; margin-right: 0px; transition: 0.55s; visibility: collapse; } #top-menu ul.open { margin-right: 30px; opacity: 1; visibility: visible; } .menu-opened #top-menu ul { transition: 0.5s; } } @media screen and (max-width:1200px) { /*blog-page*/ .blog-content-left2 ul li .news-content { max-width: 220px; } .blog-content-left2 ul li { margin-right: 10px; } .blog-padd { padding: 30px 0px; } .blog-content-left2 ul li .news-info a { padding: 10px 56px; } /*blog-page End*/ } @media screen and (max-width: 1024px) { .menu-toggle, .main-navigation.toggled .nav-menu { display: block; background: #ffffff; } .main-navigation { text-transform: inherit; } .theNavigationBar { top: 0; padding: 0; z-index: 99; } .menu-toggle { width: 100%; padding: 1em; text-align: left; color: #6c6c6c; border-radius: 0; font-size: 14px; line-height: 1.8; } .menu-toggle i { float: right; margin-top: 5px; } .menu-toggle:hover, .menu-toggle:focus { background: #ffffff; color: #6c6c6c; } .main-navigation.toggled .menu-toggle { background: #cea525; color: #ffffff; } .main-navigation ul { display: none; } .main-navigation ul li { display: block; } .main-navigation ul ul li a:not(:last-child):after { content: "\f107"; margin: 0 0 0 10px; float: none; } .main-navigation ul ul, .main-navigation ul ul ul { float: none; position: relative; top: 0; left: 0; right: 0; visibility: visible; opacity: 1; display: block; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); padding-left: 5%; z-index: 9; background: none; } .main-navigation a { border-bottom: 1px solid rgba(0, 0, 0, .05); text-align: left; color: #6c6c6c; padding: 1em; } .main-navigation ul ul a { width: 100%; } .menuOpen { overflow-x: hidden; } .header-top { height: 70px; z-index: 99999; width: 100%; display: inline-block; } .button { margin: -20px 0 0; } .main-menu { width: 100%; overflow: hidden; overflow-x: hidden; } /*menu css */ .logo a { font-size: 18px; } #top-menu, #top-menu ul, #top-menu ul li, #top-menu ul li a, #top-menu #menu-button { margin: 0; padding: 0; outline: 0; font-weight: normal; list-style: none; line-height: 1; display: block; position: initial; text-decoration: none; color: #ffffff; font-size: 13px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -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; } #top-menu ul.offside { width: 100%; display: block; height: auto; margin: 0; opacity: inherit; clear: both; border-bottom: 3px solid #ad2737; transition: transform 0.9s cubic-bezier(0.645, 0.045, 0.355, 1); overflow: auto; max-height: calc(100vh - 130px); } #top-menu ul { position: relative; text-align: left; background: rgba(255, 255, 255, 1); } #top-menu ul li, #top-menu ul ul li, #top-menu ul li:hover > ul > li { width: 100%; height: auto; opacity: 1; position: relative; } #top-menu ul.offside.open li:hover a, #top-menu ul.offside.open ul li a:hover { border-color: #dadada; } #top-menu .sub-menu li.has-sub::after { display: none; } #top-menu li:hover > ul { padding: 0; } #top-menu ul li a, #top-menu ul ul li a { width: 100%; color: #4d4d4d; } #top-menu > ul > li > a { padding: 0 20px; margin: 0; line-height: 40px; height: 40px; border: none; border-top: 1px solid rgba(0, 0, 0, 0.1); } #top-menu > ul > li > a::after { border: 0; } #top-menu > ul > li, #top-menu.align-center > ul > li, #top-menu.align-right > ul > li { float: none; display: block; z-index: 2; position: relative; } #top-menu li > ul { left: auto; background-color: transparent; box-shadow: none; height: auto; transition: transform 0.9s cubic-bezier(0.645, 0.045, 0.355, 1); } #top-menu ul ul { opacity: 1; visibility: visible; transform: inherit; } #top-menu ul ul li a { font-size: 12px; line-height: 40px; border: 0; padding: 0 15px; background: transparent; border-top: 1px solid rgba(0, 0, 0, 0.1); } #top-menu ul ul li a:before, #top-menu ul ul li ul li a:before { content: ''; padding: 0 5px 0 10px; } #top-menu ul ul li ul li a:before { content: ''; } #top-menu ul ul li ul li a { padding: 0 0 0 25px } #top-menu ul ul, #top-menu ul ul ul { position: relative; top: 0; left: 0; right: auto; width: 100%; padding: 0; margin: 0px 0 0px; } #top-menu > ul > li.has-sub > a::after, #top-menu ul ul li.has-sub > a::after { display: none; } #top-menu .submenu-button { position: absolute; z-index: 10; right: 0; top: 0; display: block; border-left: 1px solid rgba(120, 120, 120, 0.15); height: 40px; width: 45px; cursor: pointer; } #top-menu .submenu-button::after, #top-menu .submenu-button::before { content: ''; display: block; position: absolute; background: #000000; transform: rotate(45deg); } #top-menu .submenu-button::after { top: 20px; left: 16px; width: 1px; height: 5px; } #top-menu .submenu-button::before { left: 10px; top: 22px; width: 5px; height: 1px; } #top-menu .submenu-button.submenu-opened::after { transform: rotate(-60deg); } #top-menu .submenu-button.submenu-opened::before { transform: rotate(145deg); } /*menu-new-code End*/ } @media screen and (max-width:991px) { /* footer */ .footer-contact { margin: 0 20px; } /*blgo-page*/ .blog-content-left2 ul li .news-content { max-width: 230px; } } @media screen and (max-width:767px) { header{line-height: 0;} /*sidebar and content position change*/ .responsiveLayout{ display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -moz-box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; /* optional */ -webkit-box-align: start; -moz-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; align-items: flex-start; } .responsiveLayout .content { -webkit-box-ordinal-group: 1; -moz-box-ordinal-group: 1; -ms-flex-order: 1; -webkit-order: 1; order: 1; } .container .sidebar { -webkit-box-ordinal-group: 2; -moz-box-ordinal-group: 2; -ms-flex-order: 2; -webkit-order: 2; order: 2; } /*menu*/ .header-top .col-xs-12 { padding: 0; } #top-menu .logo { left: 15px; } #top-menu .menu { right: 15px; } /* footer */ .socail-icons, .socail-card { text-align: center; float: none; } .socail-card ul li:last-child { padding-right: 10px; } .socail-icons ul li:first-child { padding-left: 10px; } .footer-copyrights p { display: block; } .footer-menu ul li::before, .footer-menu ul li::after { display: none; } .footer-menu ul li { padding: 0; display: block; margin: 0 auto; } .footer-social-icon ul li { padding: 0 10px; } /* footer End */ .grid-sizer, .grid-item { width: 100%; } }