File Editor
Directories:
.. (Back)
admin
images
includes
js
languages
sample
skins
themify
themify-builder
uploads
Files:
404.php
changelog.txt
comments.php
customizer-basic-config.php
customizer-config.php
footer.php
functions.php
header.php
index.php
license.txt
media-queries.css
page.php
rtl.css
search.php
searchform.php
sidebar.php
single-portfolio-expand.php
single-portfolio.php
single-team.php
single.php
style.css
taxonomy-portfolio-category.php
taxonomy.php
theme-class-highlight.php
theme-class-portfolio.php
theme-class-section.php
theme-class-team.php
theme-class-types.php
theme-class.php
theme-config.php
theme-functions.php
theme-modules.php
theme-options.php
Create New File
Create
Edit File: media-queries.css
@media screen and (max-width: 1000px) { /************************************************************************************ STRUCTURE *************************************************************************************/ #pagewrap { max-width: 100%; } .pagewidth, .sidebar-none .loops-wrapper.list-post .section-inner, .single .section-inner, .full_width .post-nav, .full_width .commentwrap { max-width: 94%; } .full_width.sidebar-none .loops-wrapper .section-inner { max-width: 100% !important; } #header.pagewidth { max-width: 100%; width: 100%; } /* IE navigation fix */ .pagewidth #nav-bar { padding: 0 3% \9; left: -3% \9; } /* content */ #content { padding: 7% 0 5%; width: 67.8%; } /* sidebar */ #sidebar { padding: 7% 0 5%; width: 26.2%; } #sidebar .secondary { width: 47.4%; } /************************************************************************************ HEADER *************************************************************************************/ /* reset absolute elements to static */ #header .social-widget, #site-logo, #site-description { position: static !important; float: none; clear: both; } #headerwrap #site-logo { font-size: 2.8em; } /************************************************************************************ MOBILE NAV BUTTON *************************************************************************************/ .mobile-button { position: relative; height: 20px; margin: auto; display: inline-block; cursor: pointer; padding: 20px 0; white-space: nowrap; text-align: left; } .mobile-button:after { padding: 1px; content: ""; width: 100%; height: 100%; position: absolute; top: -1px; left: -1px; z-index: -1; } .mobile-button { color: #fff; text-transform: uppercase; } /* slide menu close */ #headerwrap #menu-icon-close { position: absolute; display: block; text-decoration: none; top: 10px; right: 20px; font-family: serif; font-size: 3em; color: inherit; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; } #headerwrap #menu-icon-close:after { content: "\00d7"; } #headerwrap #menu-icon-close:hover { -webkit-transform: rotate(90deg) scale(1.1); -moz-transform: rotate(90deg) scale(1.1); transform: rotate(90deg) scale(1.1); } /************************************************************************************ MAIN NAV (MOBILE) *************************************************************************************/ /* Mobile Menu Styles */ .sidemenu { height: 100%; width: 300px; padding: 50px 25px 20px; background-color: #000; color: #fff; display: block; overflow-y: scroll; -webkit-overflow-scrolling: touch; position: fixed; top: 0; z-index: 11111; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .admin-bar .sidemenu { top: 32px; } #mobile-menu { right: -300px; } #mobile-menu.sidemenu-on { right: 0; } .sidemenu-active { position: relative; } .sidemenu-active, .sidemenu-active #headerwrap { left: 0; -webkit-transition: left .2s ease-in-out; -moz-transition: left .2s ease-in-out; transition: left .2s ease-in-out; } .sidemenu-right, .sidemenu-right #headerwrap.fixed-header { left: -300px; } .sidemenu-left, .sidemenu-left #headerwrap.fixed-header { left: 300px; } .sidemenu-left #mobile-menu.sidemenu-on { left: 0; } #pagewrap #main-nav-wrap { position: absolute; top: 5px; right: 95px; z-index: 1000; } #pagewrap nav { text-align: center; } /* menu icon */ #menu-icon:before { content: "\f0c9"; font: normal 21px/1em FontAwesome; width: 1em; height: 1em; vertical-align: middle; display: inline-block; margin: -4px 5px 0 0; } /* main nav */ #pagewrap #main-nav { clear: both; text-align: left; width: auto; max-width: none; margin: 0 0 15px; } #pagewrap #main-nav li { clear: both; float: none; padding: 0.5em 0; position: static; display: block; } #pagewrap #main-nav a, #pagewrap #main-nav ul a { font: inherit; font-size: 1.1em; text-transform: inherit; background: none; width: auto; display: block; padding: 0; margin: 0; color: #fff; border: none; letter-spacing: normal; } #pagewrap #main-nav a:hover, #pagewrap #main-nav ul a:hover { background: none; color: #ffcc03; } /* dropdown */ #pagewrap #main-nav ul { position: static; display: block; margin: 0; padding: 0 0 0 1em; background: none; border: none; opacity: 1; visibility: visible; -webkit-transform: none; transform: none; } #pagewrap #main-nav ul:before, #pagewrap #main-nav ul ul:before { display: none; } /* CSS 3 Animation menu elements */ #headerwrap #main-nav li { -webkit-transition: all 400ms ease-in-out; -o-transition: all 400ms ease-in-out; transition: all 400ms ease-in-out; -webkit-transform: translate(40px, 0) !important; -ms-transform: translate(40px, 0) !important; -o-transform: translate(40px, 0) !important; transform: translate(40px, 0) !important; margin-left: 0; opacity: 0; } .mobile-menu-visible #headerwrap #main-nav li { opacity: 1; -webkit-transform: translate(0, 0) !important; -ms-transform: translate(0, 0) !important; -o-transform: translate(0, 0) !important; transform: translate(0, 0) !important; } .mobile-menu-visible #headerwrap #main-nav > li:nth-child(1) { -webkit-transition-delay: 100ms; transition-delay: 100ms; } .mobile-menu-visible #headerwrap #main-nav > li:nth-child(2) { -webkit-transition-delay: 200ms; transition-delay: 200ms; } .mobile-menu-visible #headerwrap #main-nav > li:nth-child(3) { -webkit-transition-delay: 300ms; transition-delay: 300ms; } .mobile-menu-visible #headerwrap #main-nav > li:nth-child(4) { -webkit-transition-delay: 400ms; transition-delay: 400ms; } .mobile-menu-visible #headerwrap #main-nav > li:nth-child(5) { -webkit-transition-delay: 500ms; transition-delay: 500ms; } .mobile-menu-visible #headerwrap #main-nav > li:nth-child(6) { -webkit-transition-delay: 600ms; transition-delay: 600ms; } .mobile-menu-visible #headerwrap #main-nav > li:nth-child(7) { -webkit-transition-delay: 700ms; transition-delay: 700ms; } .mobile-menu-visible #headerwrap #main-nav > li:nth-child(8) { -webkit-transition-delay: 800ms; transition-delay: 800ms; } .mobile-menu-visible #headerwrap #main-nav > li:nth-child(9) { -webkit-transition-delay: 900ms; transition-delay: 900ms; } .mobile-menu-visible #headerwrap #main-nav > li:nth-child(10) { -webkit-transition-delay: 1000ms; transition-delay: 1000ms; } .mobile-menu-visible #headerwrap #main-nav > li:nth-child(11) { -webkit-transition-delay: 1100ms; transition-delay: 1100ms; } .mobile-menu-visible #headerwrap #main-nav > li:nth-child(12) { -webkit-transition-delay: 1200ms; transition-delay: 1200ms; } .mobile-menu-visible #headerwrap #main-nav > li:nth-child(13) { -webkit-transition-delay: 1300ms; transition-delay: 1300ms; } .mobile-menu-visible #headerwrap #main-nav > li:nth-child(14) { -webkit-transition-delay: 1400ms; transition-delay: 1400ms; } .mobile-menu-visible #headerwrap #main-nav > li:nth-child(15) { -webkit-transition-delay: 1500ms; transition-delay: 1500ms; } /************************************************************************************ SECTION *************************************************************************************/ /* section video */ .section-post.video { min-height: 0; } } @media screen and (max-width: 830px) { /************************************************************************************ HIGHTLIGH POST TYPE *************************************************************************************/ /* grid4 */ .loops-wrapper.highlight.grid4 .post { width: auto; margin-left: 0; float: none; } } @media screen and (max-width: 768px) { /************************************************************************************ STRUCTURE *************************************************************************************/ body.full_width .themify_builder_row .row_inner { max-width: 90%; } #content { width: 100%; max-width: 100%; float: none; clear: both; } /* sidebar */ #sidebar { width: 100%; max-width: 100%; float: none; clear: both; } /************************************************************************************ SECTION *************************************************************************************/ /* section */ .section-inner { padding-top: 100px; /* padding space for fixed header */ } /* section message content */ .section-post.message { font-size: 1em; } /************************************************************************************ POST *************************************************************************************/ /* grid4 & grid3 */ .loops-wrapper.grid4 .post, .loops-wrapper.grid3 .post { width: auto; margin-left: 0; float: none; } } @media screen and (max-width: 680px) { /************************************************************************************ HEADING *************************************************************************************/ #pagewrap h1 { font-size: 1.8em; } #pagewrap h2 { font-size: 1.6em; } #pagewrap h3 { font-size: 1.3em; } #pagewrap h4 { font-size: 1.2em; } /************************************************************************************ GRID *************************************************************************************/ .col4-1, .col4-2, .col2-1, .col4-3, .col3-1, .col3-2 { margin-left: 0 !important; width: 100% !important; max-width: 100% !important; } /************************************************************************************ HEADER *************************************************************************************/ #headerwrap { z-index: 998; } /* site logo */ #headerwrap #site-logo { font-size: 2em; } /* social widget */ .social-widget { position: static; float: none; padding: 0; } /************************************************************************************ MAIN NAV (MOBILE) *************************************************************************************/ .admin-bar.no-header #nav-bar, .admin-bar #nav-bar.fixed-nav-bar { top: 0; } /************************************************************************************ LOOPS WRAPPER *************************************************************************************/ .loops-wrapper { margin-left: 0 !important; } /************************************************************************************ POST *************************************************************************************/ .post { width: auto !important; max-width: 100% !important; margin-left: 0 !important; float: none !important; } .loops-wrapper.list-post .post-content { overflow: visible; } .single-portfolio-expanded .post-image, .single-portfolio .post-image, .loops-wrapper.list-post .post-image { max-width: 100%; width: 100%; float: none; margin-right: 0%; } /* grid2-thumb */ .loops-wrapper.grid2-thumb .post-image { width: auto; max-width: auto; min-width: 0; } .loops-wrapper.grid2-thumb .post-content { overflow: visible; } /************************************************************************************ SECTION *************************************************************************************/ /* section title */ .section-title, .section-post.message .section-title { font-size: 2.2em; } .section-subhead, .section-post.message .section-subhead { font-size: 1.2em; } /************************************************************************************ POST NAV *************************************************************************************/ .post-nav .prev, .post-nav .next { display: block; width: 100%; clear: both; margin-bottom: 10px; } /************************************************************************************ COMMENTS *************************************************************************************/ .commentlist { padding-left: 0; } .commentlist .commententry { clear: left; } .commentlist ul, .commentlist ol { margin: 0 0 0 5%; } .commentlist .avatar { float: left; width: 40px; height: 40px; margin: 0 1em 1em 0; } /************************************************************************************ GALLERY *************************************************************************************/ #body .gallery-columns-1 img { max-width: 50px; padding: 3px; } /************************************************************************************ FOOTER *************************************************************************************/ #footer-logo { position: static; } .footer-nav { padding: 0; } #footer .widget { margin: 0; } /************************************************************************************ WOOCOMMERCE SUPPORT *************************************************************************************/ .woocommerce #content div.product div.images, .woocommerce #content div.product div.summary { float: none !important; width: 100% !important; } } @media screen and (min-width: 1001px) { /* ensure #nav is visible on desktop version */ #main-nav { display: block !important; } #menu-icon span { display: none; } }
Save Changes
Rename File
Rename