/* --------------------------------------------------- Undo - Styles for Mobile Devices --------------------------------------------------- */ /* Standard 980 (devices and browsers) */ @media only screen and (min-width: 1004px) and (max-width: 1230px) { /*----------------------------------------------------------------------------- ----------------------------- 1 - Layout -------------------------------------- -----------------------------------------------------------------------------*/ header { width: 990px; padding: 0px;} .top-header { width: 990px; padding: 0px;} .header-sub { width: 980px; padding: 0 5px;} .wrap { width: 980px; padding: 0 5px;} .logo-icon { margin-left: 5px;} #searchform2 { margin-right: 13px;} /*----------------------------------------------------------------------------- ----------------------------- 3 - Content ------------------------------------- -----------------------------------------------------------------------------*/ /* -- Home Featured Posts -- */ ul.featured-home-posts { margin-bottom: 40px;} ul.featured-home-posts li{ width: 240px; height: 197px; margin: 0 0 0 20px;} ul.featured-home-posts li img { width: 240px; height: 133px;} ul.featured-home-posts li.big { width: 460px; height: 383px; } ul.featured-home-posts li.big img { width: 460px; height: 315px; } ul.featured-home-posts li h2 { font-size: 12px; padding:18px 35px 0 10px; } ul.featured-home-posts li.big h2 { font-size: 15px; padding:18px 40px 0 10px;} /*----------------------------------------------------------------------------- ----------------------------- 3.b - Shop ------------------------------------- -----------------------------------------------------------------------------*/ ul.products li { width: 229px !important; margin: 0 8px 30px 8px !important; } ul.products li img { width: 230px; height: 230px;} a.add_to_cart_button { width: 207px !important; } .woocommerce .added:before { top: -165px !important;} /*----------------------------------------------------------------------------- ----------------------------- 4 - Sidebar -------------------------------------- -----------------------------------------------------------------------------*/ .sidebar-midle { display: none;} /*----------------------------------------------------------------------------- ----------------------------- 8 - Footer -------------------------------------- -----------------------------------------------------------------------------*/ .footer-content { width: 980px; padding: 25px 5px 0 5px;} .footer-content-bottom { width: 980px; padding: 25px 5px;} .footer-bottom { width: 980px; padding: 0 5px;} .footer-content-bottom .widget { margin-left: 20px; } div.footer-posts { width: 320px; } ul.footer-posts { width: 320px; } ul.footer-posts li { width: 120px; margin-right: 30px;} ul.footer-posts li img { width: 120px; height: 75px; margin-top: -25px;} ul.footer-posts li:last-child { display: none;} } /* Tablet Portrait size to standard 960 (devices and browsers) */ @media only screen and (min-width: 760px) and (max-width: 1000px) { /*----------------------------------------------------------------------------- 1 - Layout ----------------------------------------------------------------------------- */ html body { background-color: #f1f1f1;} header { width: 710px; } .top-header { width: 650px; padding: 0 30px; position: inherit;} .header-sub { width: 650px; height: auto; padding: 0 30px 30px 30px;} .wrap { width: 650px; padding: 0 30px; } .logo-icon { margin-left: 0px;} .logo { display: block; float: none; margin-left: auto; margin-right: auto; padding-top: 45px; margin-top: 0px !important;} #background { display: none;} /*----------------------------------------------------------------------------- 2 - Header ----------------------------------------------------------------------------- */ .box728 { display: none;} /* -- Search -- */ #searchform2 { display: none; } /*----------------------------------------------------------------------------- ----------------------------- 3 - Content ------------------------------------- -----------------------------------------------------------------------------*/ /* -- Home Featured Posts -- */ ul.featured-home-posts { margin-bottom: 20px;} ul.featured-home-posts li{ width: 325px; height: 267px; margin: 0 0 0 0;} ul.featured-home-posts li img { width: 325px; height: 180px;} ul.featured-home-posts li.big { width: 650px; height: 542px; } ul.featured-home-posts li.big img { width: 650px; height: 445px; } ul.featured-home-posts li h2 { font-size: 13px; padding:18px 35px 0 30px; } ul.featured-home-posts li.big h2 { font-size: 18px; padding:18px 40px 0 30px;} /*----------------------------------------------------------------------------- ----------------------------- 3.b - Shop ------------------------------------- -----------------------------------------------------------------------------*/ ul.products li { width: 299px !important; margin: 0 25px 30px 0 !important; } ul.products li img { width: 300px; height: 300px;} a.add_to_cart_button { width: 277px !important; } .woocommerce .added:before { top: -235px !important;} /*----------------------------------------------------------------------------- 4 - Sidebar ----------------------------------------------------------------------------- */ .sidebar { display: none;} .sidebar-midle { display: none;} /*----------------------------------------------------------------------------- 6 - Menu ----------------------------------------------------------------------------- */ .jquerycssmenu { display: none;} .mobileMenu { display: none;} /*----------------------------------------------------------------------------- 8 - Footer ----------------------------------------------------------------------------- */ .footer-content { width: 650px; padding: 25px 30px 0 30px;} .footer-content-bottom { width: 650px; padding: 25px 30px 25px 30px;} .footer-bottom { width: 650px; padding: 0 30px;} .company-info { width: 620px; float: left;} } /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ @media only screen and (min-width: 480px) and (max-width: 760px) { /*----------------------------------------------------------------------------- 1 - Layout ----------------------------------------------------------------------------- */ html body { background-color: #f1f1f1;} header { width: 450px; } .top-header { width: 390px; padding: 0 30px; position: inherit;} .header-sub { width: 390px; height: auto; padding: 0 30px 30px 30px;} .wrap { width: 390px; padding: 0 30px;} .logo { display: block; float: none; margin-left: auto; margin-right: auto; padding-top: 45px; margin-top: 0px !important;} #background { display: none;} /*----------------------------------------------------------------------------- 2 - Header ----------------------------------------------------------------------------- */ .box728 { display: none;} /* -- Search -- */ #searchform2 { display: none;} /*----------------------------------------------------------------------------- 3 - Content ----------------------------------------------------------------------------- */ /* -- Home Featured Posts -- */ ul.featured-home-posts { margin-bottom: 0px;} ul.featured-home-posts li{ width: 390px; height: 320px; margin: 0 0 0 0;} ul.featured-home-posts li img { width: 390px; height: 216px;} ul.featured-home-posts li.big { width: 390px; height: 325px; margin-bottom: 58px; } ul.featured-home-posts li.big img { width: 390px; height: 267px; } ul.featured-home-posts li h2 { font-size: 15px; padding:18px 35px 0 10px; } ul.featured-home-posts li.big h2 { font-size: 15px; padding:18px 40px 0 10px; font-weight: bold;} /* -- Blog 2 with pagination -- */ .blog-content { width: 390px; } .blog-post { width: 390px; height: 370px; } .home-post { width: 390px; height: 300px; } .single-media img { width: 390px; height: 210px;} .content { width: 390px;} .widget-left { width: 390px;} .widget-right { width: 390px; float: left;} .widget-first img { width: 390px; height: 226px;} ul.widget-list { width: 390px; } ul.widget-list li { width: 390px; } .widget-list img { width: 55px; height: 55px; } ul.widget-list .meta-date { width: 240px; height: 24px; } .post iframe { width: 100%; height: 210px; } .entry img { width: auto;} img.alignleft { float: none; width: auto !important;; margin: 20px 0 10px 0;} img.alignright { float: none; width: auto !important;; margin: 20px 0 10px 0;} /* -- Pagination -- */ .wp-pagenavi, .defaultpag { width: 365px; } /* -- Banners -- */ .box468, .box468-top { display: none;} .box250_md { display: block; margin-left: 70px; } /* -- Accordion -- */ .accordionButton, .accordionButton1, .accordionButton2, .accordionButton3 { width: 350px; } .accordionContent { width: 390px; } .accordionContent ul.tags { width: 390px; } /* -- Single - Latest posts -- */ ul.single-posts { width: 390px; } ul.single-posts li { width: 164px; float: left; height: 180px;} ul.single-posts li img { width: 164px; height: 103px; margin-top: -25px;} /* -- slider -- */ .blog-slider img { width:390px; height:auto;} /*----------------------------------------------------------------------------- ----------------------------- 3.b - Shop ------------------------------------- -----------------------------------------------------------------------------*/ ul.products li { width: 390px !important; margin: 0 0 40px 0 !important; } ul.products li img { width: 390px; height: 390px;} a.add_to_cart_button { width: 368px !important; } .woocommerce .added:before { top: -325px !important;} /*----------------------------------------------------------------------------- 4 - Sidebar ----------------------------------------------------------------------------- */ .sidebar { display: none;} .sidebar-midle { display: none;} /*----------------------------------------------------------------------------- 5 - Comments ----------------------------------------------------------------------------- */ #comments { width: 390px; } ul.comment { width: 390px;} .comment li { width: 360px;} #respond { width: 390px; } #commentform textarea { width: 225px; height:159px; } body.logged-in #commentform textarea { width: 390px !important; } #commentform #author, #commentform #email, #commentform #url { width:125px; height:30px; border-radius: 3px; border-radius: 3px; } /*----------------------------------------------------------------------------- 6 - Menu ----------------------------------------------------------------------------- */ .jquerycssmenu { display: none;} .mobileMenu { display: none;} /*----------------------------------------------------------------------------- 7 - Contact form ----------------------------------------------------------------------------- */ .one_half_c, .one_half_last_c { float:left; width:380px; margin-right:0px; clear: both; } .one_half_last_c { margin-right:0;} .one_full_c { float:left; width:380px;} /* -- Contact Form -- */ #contactform #contactName, #contactform #emaill, #contactform #subject { width:380px;} #contactform #subject { width: 380px;} #contactform textarea { width: 380px;} /*----------------------------------------------------------------------------- 8 - Footer ----------------------------------------------------------------------------- */ .footer-content { width: 390px; padding: 25px 30px 0 30px;} .footer-content-bottom { width: 390px; padding: 25px 30px 25px 30px;} .footer-bottom { width: 390px; padding: 0 30px;} .footer-posts { display: none;} .footer-content .widget { } .company-info { width: 360px; margin: 0; } ul.footer-menu { display: none;} .copyright { text-align: center; float: none; margin: 0;} /*----------------------------------------------------------------------------- 9 - shortcodes ----------------------------------------------------------------------------- */ /* -- Columns -- */ .one_half, .one_half_last { float:left;width:390px; margin-bottom:10px; margin-right:0; } .one_half_last { margin-right:0;} .one_third, .one_third_last { float:left; width:390px; margin-bottom:10px; margin-right:0; } .one_third_last { margin-right:0;} } /* All Mobile Size (devices) */ @media only screen and (max-width: 479px) { /*----------------------------------------------------------------------------- 1 - Layout ----------------------------------------------------------------------------- */ html body { background-color: #f1f1f1;} header { width: 300px; } .top-header { width: 240px; padding: 0 30px; position: inherit;} .header-sub { width: 240px; height: auto; padding: 0 30px 30px 30px;} .wrap { width: 240px; padding: 0 30px;} .logo { display: block; float: none; margin-left: auto; margin-right: auto; padding-top: 45px; margin-top: 0px !important;} #background { display: none;} /*----------------------------------------------------------------------------- 2 - Header ----------------------------------------------------------------------------- */ .box728 { display: none;} /* -- Search -- */ #searchform2 { display: none;} /*----------------------------------------------------------------------------- 3 - Content ----------------------------------------------------------------------------- */ /* -- Home Featured Posts -- */ ul.featured-home-posts { display: none;} /* -- Blog 2 with pagination -- */ .blog-content { width: 240px; } .blog-post { width: 240px; height: 320px; } .home-post { width: 240px; height: 230px; } .single-media img { width: 240px; height: 129px;} .content { width: 240px;} .widget-left { width: 240px;} .widget-right { width: 240px; float: left;} .widget-first img { width: 240px; height: 139px;} ul.widget-list { width: 240px; } ul.widget-list li { width: 240px; } .widget-list img { width: 55px; height: 55px; } ul.widget-list .meta-date { width: 240px; height: 24px; } .post iframe { width: 100%; height: 129px; } .entry img { width: auto;} img.alignleft { float: none; width: auto !important;; margin: 20px 0 10px 0;} img.alignright { float: none; width: auto !important;; margin: 20px 0 10px 0;} /* -- Pagination -- */ .wp-pagenavi, .defaultpag { width: 240px; padding-right: 0; } /* -- Banners -- */ .box468, .box468-top { display: none;} .box250_md { display: block; } /* -- Accordion -- */ .accordionButton, .accordionButton1, .accordionButton2, .accordionButton3 { width: 200px; } .accordionContent { width: 240px; } .accordionContent ul.tags { width: 240px; } /* -- Single - Latest posts -- */ ul.single-posts { width: 240px; } ul.single-posts li { width: 230px; float: left; height: 220px; margin-right: 0;} ul.single-posts li img { width: 230px; height: 145px; margin-top: -25px;} /* -- slider -- */ .blog-slider img { width:240px; height:auto;} /*----------------------------------------------------------------------------- 4 - Sidebar ----------------------------------------------------------------------------- */ .sidebar { display: none;} .sidebar-midle { display: none;} /*----------------------------------------------------------------------------- 5 - Comments ----------------------------------------------------------------------------- */ #comments { width: 240px; } ul.comment { width: 240px;} .comment li { width: 210px;} #respond { width: 238px; } #commentform textarea { width: 233px; height:159px; float: left;} body.logged-in #commentform textarea { width: 240px !important; } #commentform #author, #commentform #email, #commentform #url { width:235px; height:30px; border-radius: 3px; border-radius: 3px; } #commentform .submitcomm { margin: 25px 0 0 0; display: block; width: 100%;} /*----------------------------------------------------------------------------- 6 - Menu ----------------------------------------------------------------------------- */ .jquerycssmenu { display: none;} .mobileMenu { display: none;} /*----------------------------------------------------------------------------- 7 - Contact form ----------------------------------------------------------------------------- */ .one_half_c, .one_half_last_c { float:left; width:240px; margin-right:0px; clear: both; } .one_half_last_c { margin-right:0;} .one_full_c { float:left; width:240px;} /* -- Contact Form -- */ #contactform #contactName, #contactform #emaill, #contactform #subject { width:232px;} #contactform #subject { width: 232px;} #contactform textarea { width: 232px;} #contactform .sendemail { margin: 25px 0 0 0; width: 100%; } /*----------------------------------------------------------------------------- 8 - Footer ----------------------------------------------------------------------------- */ .footer-content { display: none;} .footer-content-bottom { width: 240px; padding: 25px 30px 25px 30px;} .footer-bottom { width: 300px; } .footer-posts { display: none;} .footer-content .widget { display: none;} .footer-links li { width: 100%; margin-left: 0px;} .company-info { width: 210px; margin: 0; } ul.footer-menu { display: none;} .copyright { text-align: center; float: none; margin: 0;} /*----------------------------------------------------------------------------- 9 - shortcodes ----------------------------------------------------------------------------- */ /* -- Columns -- */ .one_half, .one_half_last { float:left;width:240px; margin-bottom:10px; margin-right:0; } .one_half_last { margin-right:0;} .one_third, .one_third_last { float:left; width:240px; margin-bottom:10px; margin-right:0; } .one_third_last { margin-right:0;} }