/* Theme Name: Filmy Flix Theme URI: https://filmyflix.space/ Author: Afnan Shaikh --------------------------------------------------------------*/ /*-------------------------------------------------------------- 1.0 Normalize --------------------------------------------------------------*/ html { font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } body { margin: 0 } article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary { display: block } audio, canvas, progress, video { display: inline-block; vertical-align: baseline; } audio:not([controls]) { display: none; height: 0; } [hidden], template { display: none } a { background-color: transparent } a:active, a:hover { outline: 0 }.related-posts article.post abbr[title] { border-bottom: 1px dotted } b, strong { font-weight: bold } dfn { font-style: italic } h1 { font-size: 2em } mark { background: #ff0; color: #000; } small { font-size: 80% } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em } sub { bottom: -0.25em } img { border: 0 } svg:not(:root) { overflow: hidden } figure { margin: 1em 40px } hr { box-sizing: content-box; height: 0; background: linear-gradient(to right, #00ffff, #0093ff); } pre { overflow: auto } code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; } button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; } button { overflow: visible } button, select { text-transform: none } button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; } button[disabled], html input[disabled] { cursor: default } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } input { line-height: normal } input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto } input[type="search"] { -webkit-appearance: textfield; box-sizing: content-box; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none } #commentform .comment-form-cookies-consent label { padding: 0; cursor: pointer; margin-left: 7px; line-height: 18px; vertical-align: top; } #commentform .comment-form-cookies-consent input { width: 18px; height: 18px; -webkit-appearance: checkbox; } fieldset { border: 0; margin: 0; padding: 0; } legend { border: 0; padding: 0; } textarea { overflow: auto } optgroup { font-weight: bold } table { border-collapse: collapse; border-spacing: 0; } td, th { padding: 0 } /*-------------------------------------------------------------- 2.0 Font Icons --------------------------------------------------------------*/ @font-face { font-family: 'sociallyviral'; src: url('fonts/sociallyviral.eot'); src: url('fonts/sociallyviral.eot?#iefix') format('embedded-opentype'), url('fonts/sociallyviral.woff') format('woff'), url('fonts/sociallyviral.ttf') format('truetype'), url('fonts/sociallyviral.svg') format('svg'); font-weight: normal; font-style: normal; } [class^="icon-"]:before, [class*=" icon-"]:before { font-family: "sociallyviral"; font-style: normal; font-weight: normal; speak: none; display: inline-block; text-decoration: inherit; width: 1em; margin-right: 0; text-align: center; font-variant: normal; text-transform: none; line-height: 1em; margin-left: 0; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-angle-double-right:before { content: '\e800'; } .icon-angle-double-left:before { content: '\e801'; } .icon-down-dir:before { content: '\e802'; } .icon-angle-up:before { content: '\e803'; } .icon-search:before { content: '\e804'; } .icon-youtube-play:before { content: '\e805'; } .icon-clock:before { content: '\e806'; } .icon-youtube-play-1:before { content: '\e807'; } .icon-google-plus:before { content: '\e808'; } .icon-plus:before { content: '\e809'; } .icon-twitter:before { content: '\e80a'; } .icon-chat:before { content: '\e80b'; } .icon-calendar:before { content: '\e80c'; } .icon-tags:before { content: '\e80d'; } .icon-star:before { content: '\e80e'; } .icon-star-empty:before { content: '\e80f'; } .icon-star-half:before { content: '\e810'; } .icon-star-half-alt:before { content: '\e811'; } .icon-facebook:before { content: '\e812'; } .icon-user:before { content: '\e813'; } .icon-globe:before { content: '\e814'; } .icon-menu:before { content: '\e816'; } /*-------------------------------------------------------------- 2.1 Typography --------------------------------------------------------------*/ body, button, input, select, textarea { font-family: "Roboto", sans-serif; color: #707070; font-size: 16px; font-size: 1rem; line-height: 1.5; } h1, h2, h3, h4, h5, h6 { margin: 0; clear: both; color: #e7e7e7; font-weight: normal; margin-bottom: 12px;font-family: 'Open Sans',sans-serif!important; color: #e7e7e7;font-size: 17px; } h1 { font-size: 38px; line-height: 1.1; } h2 { font-size:28px line-height: 1.1; } h3 { font-size: 30px; line-height: 1.3; } h4 { font-size: 28px; line-height: 1.4; } h5 { font-size: 17px; line-height: 1.4; } h6 { font-size: 20px; line-height: 1.4; } p { margin-bottom: 1.5em; margin-top: 0; } b, strong { font-weight: bold } dfn, cite, em, i { font-style: italic } blockquote { margin: 0 1.5em } address { margin: 0 0 1.5em } pre { background-color: rgba(185, 192, 202, 0.05); border-top: 1px solid rgb(185 192 202 / 29%); font-family: "Courier 10 Pitch", Courier, monospace; font-size: 15px; margin-bottom: 1.6em; max-width: 100%; overflow: auto; padding: 1.6em; border-radius: 8px; text-align: center!important; font-family: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace!important;text-transform: uppercase!important; font-weight: 800!important; padding: 1rem 0.5rem 0.75rem!important; } code, kbd, tt, var { font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; font-size: 15px; font-size: 0.9375rem; } abbr, acronym { border-bottom: 1px dotted #666; cursor: help; } mark, ins { background: #fff9c0; text-decoration: none; } small { font-size: 75% } big { font-size: 125% } /*-------------------------------------------------------------- 3.0 Elements --------------------------------------------------------------*/ html { box-sizing: border-box } *, *:before, *:after { /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http: //css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */ box-sizing: inherit; } body, .sidebar.c-4-12, #header #s { background-color: #09090b; } blockquote { position: relative; font-style: italic; font-family: Georgia; font-size: 20px; } blockquote:before, blockquote:after, q:before, q:after { content: "" } blockquote:before { content: '\e800'; font-family: sociallyviral; position: absolute; content: '"'; font-size: 58px; top: -14px; left: -40px; } blockquote, q { quotes: "" "" } hr { background-color: #ccc; border: 0; height: 1px; margin-bottom: 1.5em; } .entry-content ul, .entry-content ol { margin: 0 0 1.5em 2em; padding: 0; } ul { list-style: disc; padding: 0; margin: 0; } ol { list-style: decimal } li > ul, li > ol { margin-bottom: 0; margin-left: 1.5em; } dt { font-weight: bold } dd { margin: 0 1.5em 1.5em } img { height: auto; /* Make sure images are scaled correctly. */ max-width: 100%; /* Adhere to container width. */ ; ; ; ; } table { margin: 0 0 1.5em; width: 100%; } /*-------------------------------------------------------------- 4.0 Forms --------------------------------------------------------------*/ button, input[type="button"], input[type="reset"], input[type="submit"] { border: 1px solid; border-color: #ccc #ccc #bbb; background: #e6e6e6; color: rgba(0, 0, 0, .8); font-size: 12px; font-size: 0.75rem; line-height: 1; padding: .6em 1em .4em; } button:hover, input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover { box-shadow: none } 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 { box-shadow: none } input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], textarea { color: #ffffff!important; border: 1px solid #00a1ff; background: #18181b;line-height: 20px; width: 99.5%; } input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, textarea:focus { color: #111 } input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"] { padding: 3px } textarea { padding-left: 3px; } /*-------------------------------------------------------------- 5.0 Navigation --------------------------------------------------------------*/ /*-------------------------------------------------------------- 5.1 Links --------------------------------------------------------------*/ a { color: #ffffff; text-decoration: none; -webkit-transition: color 0.25s ease-in; -moz-transition: color 0.25s ease-in; -ms-transition: color 0.25s ease-in; -o-transition: color 0.25s ease-in; transition: color 0.25s ease-in; } a:hover, a:focus, a:active { color: #555; outline: 0; } a:hover, .post-info a:hover, .single_post .post-info a:hover, .copyrights a:hover, #navigation.footer-navigation ul li a:hover { color: #Ffff } /*-------------------------------------------------------------- 5.2 Menus --------------------------------------------------------------*/ a#pull { display: none } .primary-navigation { clear: both; display: block; float: left; width: 100%; background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);} .primary-navigation ul { list-style: none; margin: 0; padding-left: 0; } .primary-navigation li { float: left; position: relative; } .primary-navigation a { text-decoration: none } .primary-navigation ul ul { box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2); float: left; position: absolute; top: 1.5em; left: -999em; z-index: 99999; } .primary-navigation ul ul ul { left: -999em; top: 0; } .primary-navigation ul ul a { width: 200px } .primary-navigation ul ul li { } .primary-navigation li:hover > a { } .primary-navigation ul ul :hover > a { } .primary-navigation ul ul a:hover { } .primary-navigation ul li:hover > ul { left: auto } .primary-navigation ul ul li:hover > ul { left: 100% } .primary-navigation .current_page_item > a, .primary-navigation .current-menu-item > a, .primary-navigation .current_page_ancestor > a { } .menu-item-has-children > a:after { content: "\e802"; font-family: sociallyviral; position: absolute; right: 19px; } .primary-navigation#navigation .menu-item-has-children > a { padding-right: 38px } .primary-navigation { display: block; float: right; width: 100%; text-align: left; max-width: 1170px; } .primary-navigation a { color: #222222; font-weight: bold; text-align: left; text-decoration: none; padding: 8px 25px; -webkit-transition: none; -moz-transition: none; transition: none; } .primary-navigation a { padding: 12px 18px; font-weight: normal; color: #FFF; text-transform: uppercase; font-size: 14px; } .primary-navigation#navigation ul li:hover { background: rgba(0, 0, 0, 0.08) } .primary-navigation#navigation ul li:hover a { color: #fff!important } .primary-navigation a .sub { font-size: 11px; font-weight: normal; color: #9B9B9B; } .primary-navigation#navigation { float: left } .primary-navigation#navigation ul { margin: 0 auto; min-height: 54px;} .primary-navigation#navigation ul li { float: left; line-height: 28px; position: relative; border-right: 1px solid rgba(255, 255, 255, 0.22); -webkit-transition: background 0.25s ease-in; -moz-transition: background 0.25s ease-in; -ms-transition: background 0.25s ease-in; -o-transition: background 0.25s ease-in; transition: background 0.25s ease-in; font-family: 'Roboto'; border-radius: 10px 10px 10px 10px } .primary-navigation#navigation ul li a, .primary-navigation#navigation ul li a:link, .primary-navigation#navigation ul li a:visited { display: inline-block } .primary-navigation#navigation > ul > .current a { background: transparent; color: #5a5a5a !important; } .primary-navigation#navigation ul li li { border-bottom: 0 } .primary-navigation#navigation ul ul { position: absolute; width: 265px; padding: 20px 0 0 0; padding-top: 0; z-index: 400; font-size: 12px; color: #798189; border-top: 1px solid rgba(255, 255, 255, 0.22); display: none; top: 54px; background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%); } .primary-navigation#navigation ul ul li { padding: 0; border-right: 0; width: 100%; } .primary-navigation#navigation ul ul a, .primary-navigation#navigation ul ul a:link, .primary-navigation#navigation ul ul a:visited { padding: 13px 45px 13px 20px; position: relative; width: 100%; border-left: 0; background: transparent; border-right: 0; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; border-bottom: 0; margin: 0; } .primary-navigation#navigation ul ul li:first-child a { } .primary-navigation#navigation ul ul li:last-child a { border-bottom: none } .primary-navigation#navigation ul ul ul { left: 265px; top: -1px; } .site-main .comment-navigation, .site-main .posts-navigation, .site-main .post-navigation { margin: 0 0 25px; float: left; } .pagination ul { list-style-type: none; padding: 0; margin: 0; } .nav-next a, .nav-previous a, .pagination a, .pagination .current { float: left; padding: 15px 15px;background: linear-gradient( 305deg, #3e424f 0%, rgba(20, 27, 46, .6) 100%) !important;border: 1px solid #759eb1;border-radius:4px -webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05); box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05); line-height: 1; font-size: 18px; text-transform: uppercase; min-width: 48px; text-align: center; margin-bottom: 5px; } .nav-previous { float: left } .nav-next { float: right } .posts-navigation { clear: both; width: 100%; float: left; background: #27272a; padding: 25px;} .pagination .current { color: #f47555 } .pagination a, .pagination .current { margin-right: 1px; background: linear-gradient(305deg , #3e424f 0%, rgba(20, 27, 46, .6) 100%)!important ;border: 1px solid #759eb1;!important border-radius: 5px;!importat } .page-numbers.dots { display: none } .page-links a { min-width: 40px; line-height: 40px; display: inline-block; text-align: center; background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%); ; color: #fff; margin-left: 10px; } .wp-block-categories li a{ color: #434343; text-decoration: none; -webkit-transition: color 0.25s ease-in; -moz-transition: color 0.25s ease-in; -ms-transition: color 0.25s ease-in; -o-transition: color 0.25s ease-in; transition: color 0.25s ease-in; margin: 0 4px 4px -2px!important; display: inline-block!important; height: 25px!important; line-height: 22px!important; text-decoration: none!important; padding: 0 10px 0 21px!important; text-shadow: 1px 1px 0 rgba(255,255,255,.4)!important; white-space: nowrap!important; position: relative!important; border-color: transparent!important; border: none!important; transition: none!important; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiV4G2vsOUh9Sfu6cgZ2gPL5y6WPt8Ke8XokFeuh0HCwODZcrS26IeAt3LvxnH3FomuY2GEMnBrvqAdjTR1adEUHz37He_UxpjXiEB3BM5h4FU25BjqLp7MSOiCPCgTjdyA4is1aA7c6XR-b7n7CJdi5eSy44EZCOyyaqMvWN9CnXeVcrZbd9WSAyfQdL4h/s1600/silver-left.png) no-repeat!important; font-size: 10px; float: left; } /*-[ Toggle menu ]---------------------------*/ .toggle-menu ul ul { display: none } .toggle-menu .toggle-menu-item-parent { position: relative } .toggle-menu .toggle-caret { position: absolute; top: 0; right: 0; text-align: center; cursor: pointer; line-height: inherit; } .toggle-menu .toggle-caret .fa { width: 20px; text-align: center; font-size: inherit; color: inherit; line-height: 20px; } .toggle-menu .active > .toggle-caret .fa:before { content: "\f068" } /*minus*/ .toggle-menu .toggle-caret:hover .fa { } /*-------------------------------------------------------------- 6.0 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; } .screen-reader-text:hover, .screen-reader-text:active, .screen-reader-text:focus { background-color: #f1f1f1; nowhitespace: afterproperty; nowhitespace: afterproperty; nowhitespace: afterproperty; nowhitespace: afterproperty; 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. */ } /*-------------------------------------------------------------- 7.0 Alignments --------------------------------------------------------------*/ .alignleft { display: inline; float: left; margin-right: 1.5em; border-radius: 5px;!IMPORTANT; } .alignright { display: inline; float: right; margin-left: 1.5em; } .aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; } /*-------------------------------------------------------------- 8.0 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; } .clear:after, .entry-content:after, .comment-content:after, .site-header:after, .site-content:after, .site-footer:after { clear: both } /*-------------------------------------------------------------- 9.0 Widgets --------------------------------------------------------------*/ .widget { margin: 0 0 1.5em } /* Make sure select elements fit in widgets. */ .widget select { max-width: 100% } /* Search widget. */ .widget_search .search-submit { display: none } /* Calender Widget */ #wp-calendar { margin-bottom: 0; background-color: #fff; border: 1px solid #F0EDE9; } #wp-calendar td { text-align: center; padding: 7px 0; border-top: 1px solid #F0EDE9; border-right: 1px solid #F0EDE9; } #wp-calendar caption { font-size: 16px; padding-bottom: 10px; font-weight: bold; } #wp-calendar #prev { text-align: left; padding-left: 12px; } #wp-calendar #next { text-align: right; padding-right: 12px; } #wp-calendar thead th { padding: 10px 0; text-align: center; } /*-------------------------------------------------------------- 10.0 Content --------------------------------------------------------------*/ /*-------------------------------------------------------------- 10.1 Posts and pages --------------------------------------------------------------*/ .sticky { display: block } .hentry { margin: 0 0 1.5em } .single .byline, .group-blog .byline { display: inline } .page-content, .entry-content, .entry-summary { margin: 1.5em 0 0 } .page-links { clear: both; margin: 0 0 1.5em; } .single_post { border-radius: 8px; border-top: 1px solid rgb(185 192 202 / 43%); background: #1e283fb0; float: left; width: 100%; padding: 25px; box-sizing: border-box; margin-top: 11px; box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05); margin-bottom: 30px; } .breadcrumb { margin: 20px 0 5px 0; font-size: 14px; color: #a4a4a4; } .breadcrumb a { font-size: 14px; color: #a4a4a4; } .breadcrumb a:hover { color: #f47555 } .breadcrumb div { display: inline-block; margin-right: 10px; } #content_box { width: 67%; float: left; margin-bottom: 10px; padding: 0; } .single article.post { width: 100%; } .entry-header > h1 { margin-top: 0; padding-top: 0; font-family: 'Aldrich' !important; } .single .entry-header > h1 { margin-bottom: 10px; font-size: 30px; font-weight: normal;} .post-tags { float: left; width: 100%; margin-bottom: 25px; } .related-posts article.latestpost .entry-title { display: block; margin-bottom: 7px; font-weight: 700; font-size: 15px !important; color: #ffffff; line-height: 22px !important; text-align: center; font-family: "alef" !important; padding: 4px; box-sizing: border-box; margin-bottom: 0; min-height: 145px; } .latestpost .entry-title a, .latestPost .entry-title a { transition: color 0.3s ease; } .latestpost .entry-title a:hover, .latestPost .entry-title a:hover { color: gray; } .related-posts article.post header { margin-bottom: 0; min-height: 105px; } .related-posts article.post:nth-of-type(2), .related-posts article.post:nth-of-type(3n+5) { margin-right: 3.04% } .related-posts article.post:nth-of-type(3n) { margin-right: 0 } .related-posts article.post:nth-of-type(4) { clear: left } .related-posts h4, #respond h4, #respond h3, .total-comments, .postauthor h4, .postauthor-top, .comments-title { text-transform: uppercase;margin-bottom: 20px!important; font-weight: 600; font-family: aldrich !important; font-size: 22px; margin-top: 10px; line-height: 1; } h1.page-title { margin-bottom: 20px; font-size: 24px; margin-top: -15px; } /*-------------------------------------------------------------- 10.2 Asides --------------------------------------------------------------*/ .blog .format-aside .entry-title, .archive .format-aside .entry-title { display: none } .sidebar.c-4-12 { float: right; width: 30.7%; line-height: 20px; max-width: 344px; padding: 22px; background-color: rgba(185, 192, 202, 0.05);border-top: 1px solid rgba(185, 192, 202, 0.15); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border-radius: 6px; } #sidebar .widget { border-radius: 5px; width: 100%; font-size: 16px; color: #707070; margin-bottom: 30px; display: inline-block; padding: 15px; background: #333333;border: 1px solid #00a1ff;} #sidebar .widget { position: relative; padding: 10px; background: linear-gradient(135deg, #3e577b80, #2c3e50); overflow: hidden; z-index: 1 !important; } #sidebar .widget::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(318deg, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0.3) 50%, rgba(255, 255, 255, 0) 75%); z-index: 2; animation: centerShine 1s infinite; pointer-events: none; } @keyframes centerShine { 0% { opacity: 0.3; transform: scale(1); } 50% { opacity: 0.4; transform: scale(1.2); } 100% { opacity: 0.3; transform: scale(1); } } #sidebar .widget * { position: relative; z-index: 3; } .widget > h3 { font-size: 18px; color: #555555; line-height: 18px; margin: 0 0 30px 0; padding: 0; text-transform: uppercase; } .widget .widget-title { font-weight: 500 } .widget ul { list-style-type: none; margin: 0; padding: 0; } .widget_categories li, .widget_archive li, .widget_pages li, .widget_meta li, .widget_recent_entries li, .widget_rss li, .widget_nav_menu li { width: 100%; padding: 5px 0; list-style-type: square; margin-left: 18px; } .oddad { float: left } .evenad { float: right } .sidebar.c-4-12 .advanced-recent-posts li.vertical-small { display: inline-block; padding: 0 0 15px 0; margin-bottom: 15px; width: 100%; } .sidebar.c-4-12 .advanced-recent-posts li.vertical-small:last-of-type { margin: 0; padding: 0; } .sidebar.c-4-12 .advanced-recent-posts img { float: left } .sidebar.c-4-12 .advanced-recent-posts .horizontal-container-inner img { margin-right: 15px } .sidebar.c-4-12 .advanced-recent-posts li.horizontal-small { padding: 15px 0; overflow: hidden; } .sidebar.c-4-12 .advanced-recent-posts li.horizontal-small:first-of-type { padding-top: 0 } .sidebar.c-4-12 .advanced-recent-posts li.horizontal-small:last-of-type { padding-bottom: 0 } .sidebar.c-4-12 .advanced-recent-posts li.horizontal-small .post-data { overflow: hidden } .sidebar.c-4-12 .advanced-recent-posts li.horizontal-small .post-info { margin-top: 5px } .widget .vertical-small .post-data { float: left; width: 100%; padding: 15px; box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #sidebar .widget.vertical-small .post-data { background: #fff } .widget .vertical-small .post-title { clear: both; margin-bottom: 5px; float: left; width: 100%; font-size: 20px; line-height: 28px; } .widget .vertical-small .post-info { width: 100%; float: left; margin-bottom: 10px; } .post-info > span, .widget .vertical-small .post-info > span { margin-right: 35px } .post-info > span:last-of-type { margin-right: 0 } .single .thecategory { padding: 8px 15px 8px 12px; margin-left: 0; margin-bottom: 15px; float: left; background-color: #33bcf2; color: #fff; } .single .thecategory a { color: inherit } .tagcloud a { background: linear-gradient(107.15deg, #1e283f 0%, rgba(20, 27, 46, .6) 100%); border-radius: 4px padding: 5px 10px; display: inline-block; color: #ffffff; font-size: 14px !important; margin: 0 0 4px 0; -webkit-transition: background 0.25s ease-in; transition: background 0.25s ease-in; } .tagcloud a:hover { background: #33bcf2 } #commentform input#submit { line-height: 1; background: linear-gradient(107.15deg, #1e283f 0%, rgba(20, 27, 46, .6) 100%); text-transform: uppercase; padding: 12px 15px;border-radius: 4px; border: 1px solid #00a1ff!important;;color: #fff; text-decoration: none; float: left; cursor: pointer; display: inline-block; border: none; transition: all 0.2s linear; font-weight: normal; font-size: 18px; margin-top: 5px; text-shadow: none; } #commentform input#submit:hover { background-color: #33bcf2 } /*-------------------------------------------------------------- 10.21 Author Box --------------------------------------------------------------*/ .author-wrap { border: 1px solid #E9E9E9; min-height: 162px; padding-right: 20px; margin-bottom: 30px; } .postauthor img { float: left; margin: 0 20px 0 0; width: 21.968%; } .postauthor h5 { font-weight: normal; font-size: 20px; padding: 0; margin: 20px 0 0 0; line-height: 1; text-transform: capitalize; color: #555; display: inline-block; } .postauthor p { overflow: hidden } .postauthor, .related-posts, #comments { float: left; width: 100%; } #comments {padding:10px; border: 1px solid #3f3f46; border-radius: 8px;} /*-------------------------------------------------------------- 10.3 Comments --------------------------------------------------------------*/ .comment-content a { word-wrap: break-word } .bypostauthor { display: block } #comments label { min-width: 80px; display: inline-block; } .comment-form-comment label { margin-bottom: 5px } .comment-list { list-style-type: none; padding: 0; margin: 0; } .comment-list li { margin: 0 0 25px 0; padding-left: 0; float: left; width: 100%; position: relative; } .comment-list li { list-style-type: none } .comment-list li .children { margin-top: 20px ;float: left;width: 100%;margin-left: 0;} #comments .avatar { float: left; margin-right: 20px; margin-top: 7px; } .comment-meta { position: relative } .comment-metadata a { color: #a4a4a4; font-size: 12px; text-transform: capitalize; position: absolute; right: 0; top: 0; } .comment-metadata time { margin-right: 30px } .comment-metadata a:hover { color: #F47555 } .comment-content { overflow: hidden } .comment-content p:last-child { margin-bottom: 0 } .reply { margin-top: 0px; padding-bottom: 0px; overflow: hidden; float: right; } .reply a { padding: 0; color: #a4a4a4; font-size: 12px; } .reply a:hover { color: #F47555 } .says {display:none;} /*-------------------------------------------------------------- 11.0 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 } /*-------------------------------------------------------------- 12.0 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% } /*-------------------------------------------------------------- 12.1 Captions --------------------------------------------------------------*/ .wp-caption { margin-bottom: 1.5em; max-width: 100%; } .wp-caption img[class*="wp-image-"] { display: block; margin: 0 auto; } .wp-caption-text { text-align: center } .wp-caption .wp-caption-text { margin: 0.8075em 0 } /*-------------------------------------------------------------- 12.2 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.33% } .gallery-columns-4 .gallery-item { max-width: 25% } .gallery-columns-5 .gallery-item { max-width: 20% } .gallery-columns-6 .gallery-item { max-width: 16.66% } .gallery-columns-7 .gallery-item { max-width: 14.28% } .gallery-columns-8 .gallery-item { max-width: 12.5% } .gallery-columns-9 .gallery-item { max-width: 11.11% } .gallery-caption { display: block } /*----------------------------------- 404 Page ------------------------------------*/ .error404 .site-content, .search-no-results .site-content { margin-top: 20px; padding-bottom: 100px; } h1.big { font-size: 100px } /*----------------------------------- Main Content ------------------------------------*/ .main-container { width: 100%; max-width: 1170px; margin: 0 auto; clear: both; display: block; padding: 0; } .container { max-width: 1170px; margin: 0 auto; } /*-[header]-----------------------------------*/ #masthead { background: linear-gradient(107.15deg, #1e283f 0%, rgba(20, 27, 46, .6) 100%); -webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05); box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05); text-align: center; margin-bottom: 10px; } .single #masthead, .page-template-default #masthead, .page-template-page-blog #masthead { margin-bottom: 0 } .site-branding { width: 30%; margin: 0 0 -9px 17px; overflow: hidden; float: left; display: inline-block; } #logo { float: left; display: inline-block; line-height: 1; position: relative; margin-bottom: 25px; margin-top: 29px; } #logo.text-logo { margin: 32px 0; font-size: 2em; } #logo a { float: left; line-height: 2; margin: -12px 0px; color: #fff; } #masthead .header-search { float: none; width: 100%; max-width: 453px; margin-bottom: 25px; margin-top: 29px; margin-left: auto; margin-right: auto; display: inline-block; text-align: left; } #masthead #searchform { width: 100%; float: left; } #masthead #s { margin: 0 !important; width: 100%; background: linear-gradient(36deg, #1e283f 0%, rgb(12 20 45) 100%); border: 1px solid #00a1ff; border-radius: 10px; } .header-social { float: right; display: inline-block; margin-right: 25px; margin-bottom: 25px; margin-top: 29px; } .header-social a { padding: 12px 0px 9px; float: left; font-size: 20px; line-height: 1; width: 42px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-right: 3px; text-align: center; } .header-social a.header-facebook { background: #375593 } .header-social a.header-twitter { background: #0eb6f6 } .header-social a.header-google-plus { background: #dd4b39 } .header-social a.header-youtube-play { background: #e32c26 } .header-social a svg { fill: #fff } .header-social a:last-child { margin-right: 0 } .header-social a i { color: #fff } .header-social a i:before { margin-right: 0 } #main{margin-top: 15px;} .post-cards { --cards: 2; display: grid; grid-template-columns: repeat(var(--cards),minmax(0,1fr)); grid-gap: 20px; grid-row-gap: 0px; margin: auto 10px } @media screen and (min-width: 480px) { .post-cards { --cards: 3 } } @media screen and (min-width: 768px) { .post-cards { --cards: 4 } .related-posts>.clear { --cards: 4 } } @media screen and (min-width: 1024px) { .post-cards { --cards: 5; margin: auto 30px!important; gap: 24px grid-row-gap: 0px; } } .latestpost { width: 100%; float: left; margin-bottom: 30px; margin-right: 2.6%; background: #27272a; border: 1px solid #00a1ff; border-radius: 10px; overflow: hidden; background: linear-gradient(107.15deg, #1e283f 0%, rgba(20, 27, 46, .6) 100%); } .home article.post:nth-of-type(6n) { clear: left } .paged article.post:nth-of-type(2), .paged article.post:nth-of-type(3n+5) { margin-right: 2.6% } .paged article.post:nth-of-type(6n) { clear: none } .paged article.post:nth-of-type(3n+1) { clear: left } .paged article.post:nth-of-type(3n) { margin-right: 0 } .search-area article.post:nth-of-type(2), .search-area article.post:nth-of-type(3n+5), .content-archive article.post:nth-of-type(2), .content-archive article.post:nth-of-type(3n+5) { margin-right: 2.6% } .search-area article.post:nth-of-type(3n), .content-archive article.post:nth-of-type(3n) { margin-right: 0 } .related-posts article.post:nth-of-type(2), .related-posts article.post:nth-of-type(3n+5) { margin-right: 3.04% } .featured-thumbnail { float: left; max-width: 100%; width: 100%; } #featured-thumbnail { float: left; max-width: 100%; display: block; position: relative; width: 100%; } .featured-thumbnail img { margin-bottom: 0; width: 100%;float: left; aspect-ratio: 2/3; } .featured-thumbnail img:hover { opacity: 0.7; } .entry-title a{color:#fff} .latestpost .title { display: block; margin-bottom: 7px; } .latestpost.featuredpost .title { margin-bottom: 0px } .latestpost header { padding: 12px 2px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-bottom: 0; min-height: 182px; overflow: hidden; } .latestpost.featuredpost header { min-height: 118px } .post-info { display: block; color: #A4A4A4; float: left; clear: both; width: 100%; font-size: 13px; text-transform: capitalize; line-height: 2; } .single .post-info { margin-bottom: 20px } .post-info a, .single_post .post-info a { color: #A4A4A4 } .post-info > span:last-child { margin-right: 0 } .post-info i { margin-right: 3px } .post-info > span { margin-right: 35px } .post-info > span:first-child i:before { margin-left: 0 } .post-label { position: absolute; top: 0; right: 0; padding: 0 15px; line-height: 44px; background: #33BCF2; color: #fff; float: left; } .post-label svg { float: left; fill: #fff; } .post-label span { margin-left: 5px; line-height: 21px; } .no-results .page-content { margin-bottom: 50px; float: left; margin-top: 0; width: 284px; } /*-[ Search Form ]------------------*/ #searchform { padding: 0; float: left; clear: both; width: 100%; position: relative; } .article #searchform { max-width: 300px } #searchform .sbutton, #searchform #searchsubmit { right: 0; top: -2px; padding: 9px 0; float: right; border: 0; width: 42px; height: 42px; cursor: pointer; text-align: center; padding-top: 10px; color: #a4a4a4; -webkit-transition: all 0.25s linear; -moz-transition: all 0.25s linear; transition: all 0.25s linear; background: #494949; fill: #fff; z-index: 10; position: absolute; border: 0; vertical-align: top; text-shadow: none; border-radius: 10px; } #searchform .icon-search { font-size: 20px; top: 0px; color: #FFF; background: #494949; position: absolute; right: 0; padding: 0; height: 42px; width: 42px; text-align: center; line-height: 42px; z-index: 100; cursor: pointer; border-radius: 10px; margin: 0px -1px 0px 0px; border: 1px solid #00a1ff; background: linear-gradient(36deg, #1e283f 0%, rgb(12 20 45) 100%); } #s { width: 100%;border-radius: 10px; background: linear-gradient(36deg, #1e283f 0%, rgb(12 20 45) 100%); float: left; padding: 8px 0; text-indent: 10px; color: #a4a4a4;border: 1px solid #00a1ff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; height: 42px; outline: none; font-size: 14px; } .site-footer { position: relative; overflow: hidden; clear: both; background: linear-gradient(107.15deg, #1e283f 0%, rgba(20, 27, 46, .6) 100%); -webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05); box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05); } .site-footer { position: relative; overflow: hidden; clear: both; -webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05); box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05); } .site-info.container { width: 100%; clear: both; padding-bottom: 29px; padding-top: 38px; color: #A4A4A4; font-size: 14px; font-weight: normal; overflow: hidden; } .copyrights a { color: #A4A4A4; border-bottom: 1px dotted; } a.toplink { font-size: 40px; line-height: 15px; position: absolute; top: 50%; left: 50%; margin-left: -13px; margin-top: -18px; color: #A4A4A4; } a.toplink i { line-height: 15px } .copyrights { float: left } #navigation.footer-navigation { float: right } #navigation.footer-navigation ul { list-style-type: none } #navigation.footer-navigation ul.sub-menu { display: none!important } #navigation.footer-navigation ul li { display: inline-block; padding-right: 12px; padding-left: 12px; border-right: 1px solid #D2D2D2; line-height: 1; } #navigation.footer-navigation ul li:last-of-type { border-right: 0; padding-right: 0; } #navigation.footer-navigation ul li:first-child { padding-left: 0 } #navigation.footer-navigation ul li:last-child { padding-right: 0; border-right: 0; } #navigation.footer-navigation ul li a { color: #A4A4A4 } #navigation.footer-navigation ul li a:after { display: none } .menu-primary-container li { position: relative } .menu-primary-container ul.sub-menu { margin: 4px 0 -7px 10px } /*----------------------------------- Responsive ------------------------------------*/ @media screen and (max-width: 1230px) { .main-container, .site-info.container { width: 96% } .oddad, .evenad { width: 45% } } @media screen and (max-width: 980px) { .site-branding { width: 100%; margin: 0; float: none; text-align: center; } #logo { float: none } #logo, #logo.text-logo { margin-bottom: 0; margin-top: 15px; } #masthead { text-align: left } #masthead .header-search { margin-left: 25px; margin-top: 10px; margin-bottom: 20px; } .header-social { margin-top: 10px; margin-bottom: 20px; } article.latestpost .entry-title { font-size: 22px; line-height: 1.4; } .post-info > span { margin-right: 10px }      .single .entry-header > h1 { font-size: 24px; line-height: 1.4; font-weight: 600; } .postauthor img { padding: 20px; padding-right: 0; padding-bottom: 0; box-sizing: content-box; } } @media screen and (max-width: 865px) { .primary-navigation { width: 100%; border: none !important; display: none; } .primary-navigation .menu a, .primary-navigation .menu .fa > a, .primary-navigation .menu .fa > a { color: #fff!important; background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%); ; } .primary-navigation .menu { display: block!important; float: none; background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%); ; margin-bottom: 45px; } .primary-navigation ul ul { visibility: visible!important; opacity: 1!important; position: relative; left: 0!important; border: 0; width: 100%; } .primary-navigation ul li li { background: transparent; border: 0; } nav.primary-navigation { height: auto } nav.primary-navigation li, .primary-navigation ul li li { width: 100%!important; float: left; position: relative; } .primary-navigation ul li:after { display: none } .primary-navigation ul li:before { display: none } nav.primary-navigation li a { border-bottom: 1px solid rgba(0, 0, 0, 0.1)!important; width: 100%!important; box-sizing: border-box; } nav.primary-navigation a { text-align: left; width: 100%; text-indent: 25px; } a#pull { display: block; width: 100%; border-radius: 0px 0px 3px 3px; position: relative; background: #3e577b; color: #ffffff; padding: 10px 0; text-indent: 15px; float: left; } a#pull:after { content: "\e816"; display: inline-block; position: absolute; right: 15px; top: 10px; font-family: 'sociallyviral'; } .primary-navigation ul .sfHover a, .primary-navigation ul li:hover, .primary-navigation ul .sfHover ul li { background: transparent } .primary-navigation#navigation ul ul.toggle-submenu { position: static; width: 100%; border-top: 0; box-shadow: none; } /*-[ Responsive Navigation ]--------------------------------*/ .main-container,.site-footer { position: relative; left: 0; transition: left 500ms ease; } .mobile-menu-active .main-container,.mobile-menu-active .site-footer { left: 300px; transition: left 500ms ease; } .primary-navigation.mobile-menu-wrapper { display: block; position: fixed; top: 0; left: -300px; width: 300px; height: 100%; border-right: 1px solid rgba(0, 0, 0, 0.2); overflow: auto; transition: left 500ms ease; -webkit-backface-visibility: hidden; } .mobile-menu-active .primary-navigation.mobile-menu-wrapper { left: 0 } .primary-navigation ul li { width: 100%; display: block; } .primary-navigation ul li:hover { background: none } .primary-navigation ul li a, .primary-navigation ul ul a { padding: 9px 0; width: 100%; border: none; } .primary-navigation ul ul { position: static; width: 100%; border: none; } .primary-navigation ul ul li { background: none; width: 100%; } .primary-navigation i { display: inline } .primary-navigation ul ul a { padding: 9px 18px !important } .primary-navigation ul ul ul a { padding: 9px 27px !important } .primary-navigation ul ul ul ul a { padding: 9px 36px !important } .primary-navigation .toggle-caret { display: block; width: 50px; height: 42px; line-height: 42px; color: #ffffff; border-left: 1px solid rgba(0, 0, 0, 0.2); } /*.primary-navigation .menu-item-has-children > a:after { content: '' }*/ .copyrights { float: none; text-align: center; } #navigation.footer-navigation { float: none } #navigation.footer-navigation ul { text-align: center; width: 100%; margin-top: 10px; } a.toplink { top: 13% } #content_box { width: 100%; float: none; margin-bottom: 30px; overflow: hidden; } article.latestpost .entry-title { font-size: 18px } .sidebar.c-4-12 { width: 100%; float: none; margin: 0 auto; } #commentform .comment-form-cookies-consent label { clear: both; width: 100%; margin-left: 0; } } @media screen and (max-width: 768px) { #masthead .header-search { max-width: 46% } } @media screen and (max-width: 640px) { .single_post { padding: 25px 2%; border-radius: 8px; border-top: 1px solid rgb(185 192 202 / 43%); } .related-posts article.post:nth-of-type(odd), .search-area article.post:nth-of-type(odd), .content-archive article.post:nth-of-type(odd) { margin-right: 4% } .related-posts article.post:nth-of-type(even), .search-area article.post:nth-of-type(even), .content-archive article.post:nth-of-type(even) { margin-right: 0 } .related-posts article.post:nth-of-type(4) { clear: none } .related-posts #featured-thumbnail, .related-posts .featured-thumbnail { float: none } .related-posts .featured-thumbnail img { min-width: 100% } } @media screen and (max-width: 550px) { #masthead .header-search { margin-left: 10px } .header-social { margin-right: 10px } .comment-metadata a { position: static } } @media screen and (max-width: 550px) { #masthead .header-search { max-width: 100%; margin-left: 0; padding: 0 30px; margin-bottom: -5px; margin-top: -10px; } article.post { width: 100% } .featured-thumbnail { overflow: hidden; } #masthead .header-social { width: 100%; text-align: center; margin-right: 0; padding: 0 30px; } .header-social a { display: inline-block; float: none; } .related-posts article.post { width: 100% } } .buttontg:hover { background-color: #e7e7e7; border: 2px solid #555; color: #000; } .buttontg { background-color: #009de1; color: #fff; align-items: center; border: 1px solid #e7e7e7; border-radius: 4px; } h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6 { color: #fff; } .button { color: #fff; padding: 8px 6px; text-align: center; text-decoration: none; display: inline-block; font-size: 14px; margin: 2px 1px; -webkit-transition-duration: 0.4s; transition-duration: 0.4s; cursor: pointer; } button { color: #fff; padding: 8px 6px; text-align: center; text-decoration: none; display: inline-block; font-size: 14px; margin: 2px 1px; -webkit-transition-duration: 0.4s; transition-duration: 0.4s; cursor: pointer; } .button5 { background: linear-gradient(107.15deg, #1e283f 0%, rgba(20, 27, 46, .6) 100%); color: #fff; border: 1px solid #00a1ff; border-radius: 4px; margin-bottom: 4px; } .button4k { background-color: #FFAA2C; color: black; border-color: #EDBA26; align-items: center; border: 1px solid #e7e7e7; border-radius: 4px; } .alert { padding: 5px; background-color: #3e577b; margin-bottom: 20px; margin-top: 10px; width: 90%; } .alert { position: relative; padding: 10px; border-top: 1px solid rgb(185 192 202 / 39%);    background-color: #364459; color: white; text-align: center; margin-bottom: 20px; margin-top: 10px; width: 90%; border-radius: 10px; overflow: hidden; font-size: 14px; } .alert::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient( 135deg, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0) 75% ); z-index: 1; animation: centerShine 2s infinite; pointer-events: none; /* Click events को रोकने के लिए */ } @keyframes centerShine { 0% { opacity: 0.3; transform: scale(1); } 50% { opacity: 0.6; transform: scale(1.2); } 100% { opacity: 0.3; transform: scale(1); } } .alert span, .alert a { position: relative; z-index: 2; } .alert a { color: yellow; text-decoration: none; } .alert { border-radius: 5px; } .closebtn { margin-left: 15px; margin-top: 4.5px; color: #fff; font-weight: 700; float: right; font-size: 22px; line-height: 20px; cursor: pointer; transition: 0.3s; } .latestpost .entry-title, .latestPost .entry-title a { font-weight: normal; font-size: 15px; color: #ffffff; line-height: 22 px; } .latestpost .entry-title { display: block; margin-bottom: 7px; font-weight: 700; font-size: 15px !important; color: #ffffff; line-height: 22px !important; text-align: center; font-family: "alef" !important; } .latestpost { position: relative; overflow: hidden; } .latestpost * { position: relative; z-index: 2; } .related-posts { margin-top: 20fdpx; clear: both; float: left; width: 100% } .related-posts>.crd { --cards: 2; display: grid; grid-template-columns: repeat(var(--cards),minmax(0,1fr)); grid-gap: 20px; } .related-posts .latestPost .title,.related-posts .latestPost .title a { font-family: alef!important; font-size: 15px!important; font-weight: 700; line-height: 22px!important; } .related-posts article header { margin-bottom: 0; border-top: 0; min-height: 120px; border-top: 0 } @media screen and (min-width: 768px){ .related-posts>.crd { --cards: 4 ; } } .navigation{ margin: 15px 0px 15px; padding: 25px; border-radius: 20px 10px 5px 5px; background: linear-gradient(107.15deg, #1e283f 0%, rgba(20, 27, 46, .6) 100%); border-top: 1px solid rgba(185, 192, 202, 0.15); } .disabled { margin: 0px 0px 0px 4px; } .dots { padding: 10px 13px; border-radius: 6px; color: #fff; background: #494949; } .navigation li a, .navigation li a:hover, .navigation li.active a, .navigation li.disabled { color: #fff; text-decoration:none; padding: 10px 15px; } .navigation li { display: inline; display: inline-masonry; } .navigation li a, .navigation li a:hover, .navigation li.active a, .navigation li.disabled { background: linear-gradient(305deg, #3e424f 0%, rgba(20, 27, 46, .6) 100%); border-radius: 5px; border: 1px solid #759eb1; cursor: default; line-height: 3em;    padding: 10px 14px; } .navigation li a:hover, .navigation li.active a { background-color: #33bcf2; border: 1px solid #00a1ff; } .container { position: relative; overflow: hidden; width: 100%; padding-top: 56.25%; margin-top: 0px; } /* Then style the iframe to fit in the container div with full height and width */ .responsive-iframe, iframe { position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%; }