Responsive Sheffield Blue v2.0

[wmorris]

This was the only file that messed with until the header was missing:

/**
 * responsive_tablet.css
 *
 * @package templateSystem
 * @copyright Copyright 2003-2007 Zen Cart Development Team
 * @copyright Portions Copyright 2003 osCommerce
 * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
 * Added by rbarbour (ZCAdditions.com), Responsive DIY Template Default for 1.5.x (65)
 * Modified by Anne (Picaflor-Azul.com) Responsive Sheffield Blue v1.0
 */

/* Breakpoints are the point at which your sites content will respond to, to provide your visitors with the best possible layout to consume the information. */
/* 2.1 by default includes no breakpoints (ie. min-width or max-width) */
/* The orientation media query expression allows us to target specific styles based on the current screen or device orientation. We have 2 expressions; landscape and portrait which allows us to change a pages layout based on the browsers current orientation. */
/* A browser or device determines the orientation by listening to the width and height of the window. If the: */
/* height is larger than the width, the window is in portrait mode. */
/* width is larger than the height, the window is in landscape mode. */


/* 2.1 ALL TABLETS - ORIENTATION:LANDSCAPE */
@media only screen and (orientation:landscape)  {
div#headerWrapper {}
body{margin:0;padding:0;background:none;}
#top-inner-wrapper{margin-left:10px;}
#logo, #tagline{margin-left:10px;}
.ffCcol1{position:relative;left:20px;}
#navSuppWrapper{margin:0;}
#mobile-nav1{display:none;}
#home-images{margin:0 auto;width:99%;}
.image_carousel .panel{height:auto !important;}
.addthis_sharing_toolbox {margin-left:19%;width:80%;overflow:hidden;}

#top-middle{padding-top:0;background:none;}
#top-middle .onerow-fluid{border-radius:0;}
.ribbon:before, .ribbon:after, .ribbon1:before, .ribbon1:after, .ribbon2:before, .ribbon2:after{display:none;}
.ribbon1-content:before, .ribbon2-content:after, .ribbon2-content:before{border-width:0;}
.ribbon1 .ribbon1-content:before, .ribbon2 .ribbon2-content:after, .ribbon .ribbon-content:before, .ribbon .ribbon-content:after{border-width:0;}
.ribbon2{width:auto;}
#menu{width:100%;left:0;}
#navSuppWrapper{background:none;}
#footer-bottom a, #footer-bottom, #siteinfoLegal, #siteinfoLegal a{color:#444;}
ul#col_1, ul#col_2, ul#col_3{margin-left:20px;}
#flex-navSupp .ribbon{width:100%;}
#custom-tab-text {width:60%;}
#bannerSix{background:#fff;}
#cur-lan-header1{display:none;}
ul.slimmenu li .sub-collapser:before, ul.slimmenu1 li .sub-collapser:before{margin-right:0;}
ul.slimmenu li a{padding:12px 20px;}
.centerBoxContentsAlsoPurch, .centerBoxContentsProducts, .centerBoxContentsNew, .centerBoxContentsFeatured, .centerBoxContentsSpecials {width:45% !important;}
#pi-right{padding:20px;}

}

/* 2.1 ALL TABLETS - ORIENTATION:PORTRAIT (DEFAULT LAYOUT) */
@media only screen and (orientation:portrait)  {
div#headerWrapper {margin-bottom:0;}
.onerow-fluid>[class*="col"]{float:none;display:block;width:auto;margin:0;}
img.listingProductImage{max-width:200px;}
#headerWrapper,div#logoWrapper {height:auto;}
#logoWrapper{}
div#logo IMG {clear:both;}
.centerColumn{padding:0 30px;margin-top:0px;border-right:0px solid #dbdbce;border-left::0px solid #dbdbce;}
.cartProductDisplay {text-align:left;padding:5px;}
.cartQuantity INPUT {width:75%!important;}
td.productListing-data INPUT {width:20%!important;}
.leftBoxContainer, .rightBoxContainer {margin:0.5em;}
input[type="text"],input[type="password"],select {width:95%;}
div#advSearchDefault.centerColumn fieldset {clear:both;float:none;width:95%;}
.cartProductDisplay IMG,span#cartImage.back {display: none;visibility: hidden;}
.cartProductDisplay {text-align:left;padding:5px;}
.cartProductDisplay ul,span#cartProdTitle {text-align:left;padding:0px;margin:0;} 
div#checkoutBillto.back, div#checkoutShipto.forward,div#accountLinksWrapper {clear:both;float:none;width:95%;}
th#thcol1,th#thcol3,td#tdcol1,td#tdcol3,.minWidthHide {display:none;visibility:hidden;}
.minWidthShow {display:block;visibility:visible;}
body {margin:0;padding:0;background:none;}
a#foo2_next, a#foo1_next{right:0;}
#logo, #tagline{margin-left:10px;}
.banner span{font-size:140%;}
#menu{width:100%;margin-top:-165px;}
ul.slimmenu{position:relative;z-index:1000;background:#417db9;}
#navMainWrapper{position:relative;z-index:10;margin-top:-70px;width:75%;float:right;}
#navMainSearch input[type=text]{width:140px;}
.slide-out-div{top:230px !important;}
.ad{max-width:220px;}
#home-text{margin:30px auto 0 auto;width:100%;}
#home-images{margin:0 auto;width:95%;padding-bottom:0;}
#top-middle{border:none;}
.flexFooterCol{width:100% !important;}
.ffCcol4 h4{text-align:center;}
#pi-left{float:none;background:none;border:none;text-align:center;width:97%;}
.addthis_toolbox{width:50%;margin:0 auto;}
.top-specials{display:none;}
#top-inner-wrapper{margin-left:10px;}
#navSuppWrapper{margin:0;border:none;margin-top:80px;}
#mobile-nav1{display:none;}
.ffCcol4 .flexFooterColText{width:43%;margin:0 auto;}
#cur-lan-header{float:left;top:30px;margin-left:10px;}
#cur-lan-header1{float:left;top:30px;margin-left:10px;position:relative;}
.currency_header{width:65%;}
.lang_header{width:20%;}
.content-slider{margin-top:0;}
.view{width:30%;}
.view-tenth h2{font-size:120%;margin:5px 10px 0 10px;}
.view a.info{margin-top:0;}
.menu-collapser{width:10%;float:right;margin-top:-20px;}
ul.slimmenu li .sub-collapser, ul.slimmenu1 li .sub-collapser{background:#000;}
.image_carousel .panel{height:auto !important;}
.addthis_sharing_toolbox {margin-left:37%;padding-bottom:10px;}

#top-middle{padding-top:0;background:none;}
#top-middle .onerow-fluid{border-radius:0;}
.ribbon:before, .ribbon:after, .ribbon1:before, .ribbon1:after, .ribbon2:before, .ribbon2:after{display:none;}
.ribbon1-content:before, .ribbon2-content:after, .ribbon2-content:before{border-width:0;}
.ribbon1 .ribbon1-content:before, .ribbon2 .ribbon2-content:after, .ribbon .ribbon-content:before, .ribbon .ribbon-content:after{border-width:0;}
.ribbon2{width:auto;}
#menu{width:100%;left:0;position:absolute;top:-100px;background:none;margin-top:0;}
#navSuppWrapper{background:none}
#footer-bottom a, #footer-bottom, #siteinfoLegal, #siteinfoLegal a{color:#444;}
ul#col_1, ul#col_2, ul#col_3{margin-left:20px;}
#flex-navSupp .ribbon{width:100%;left:0;}
#custom-tab-text {width:60%;}
i.fa.fa-instagram {}
.tp-hide{display:none;}
#navMainWrapper i:hover{color:#171717;}
.stripe{margin-top:-60px;}
#navMainSearch{top:-10px;z-index:1;}
.menu-shop{margin-left:0;}
.section h4{margin-top:20px;margin-bottom:20px;}

#flex-navSupp .ribbon-content {display:none;}

#navSuppWrapper{background:#1f4f7d;}
#flex-navSupp .onerow-fluid{background:#1f4f7d;border-radius:0;-webkit-border-radius:0;-moz-border-radius:0;}
#flex-navSupp .onerow-fluid a{color:#fff;}
#flex-navSupp .onerow-fluid a:hover{color:#000;}
#siteinfoLegal, #footer-bottom{background:#1f4f7d;color:#fff;}
#siteinfoLegal a, #footer-bottom a{color:#fff;}
#siteinfoLegal a:hover, #footer-bottom a:hover{color:#000;}
#col_3 i{background:#000;}
#pi-right{padding:0;overflow:hidden;padding-bottom:30px;border-left:none;border-right:none;width:100%;}
#productName{text-align:center;}
#productAttributes{margin:10px auto;width:90%;}
ul.slimmenu li > ul, ul.slimmenu1 li > ul{width:auto;}
ul.slimmenu li.aboutus-li ul li{width:auto;}
ul.slimmenu li.customer-service-li ul li{width:auto;}
.a2a_kit.a2a_kit_size_42.a2a_default_style {width:35%;margin:0 auto;}
input.cssButton.submit_button.button.button_in_cart, .button_in_cart:hover{width:40% !important;margin:0 auto;}
#shippingEstimatorContent input[type=text]{width:42% !important;}
#flex-navSupp ul li span {text-align:left;}
.flexFooterCol h4{margin-top:30px;}
.ffCcol4 i{padding:5px;background:#000;}
.ffCcol4 i:hover{padding:5px;background:#fff;color:#000;}
#bannerSix{background:#1f4f7d;}
#flex-navSupp .flexFooterCol.ffCcol1 {left:0;}

}

/* ----------- iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
/* Styles */

}

/* ----------- iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */
}

/* ----------- iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
}

/* ----------- iPad 3 (portrait) ----------- */
@media
only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape)
and (-webkit-min-device-pixel-ratio : 2) {
/* Styles */
}

@media
only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait)
and (-webkit-min-device-pixel-ratio : 2) {
/* Styles */
}

Ok, I was able to fix the tablet layout. But still No header on the Desktop. You can see it here http://www.morrisgiftshop.biz. You can able see part of the bottom of the logo. I uploaded the original files of CSS's but no change.

[picaflor-azul]

Ok, I was able to fix the tablet layout. But still No header on the Desktop. You can see it here http://www.morrisgiftshop.biz. You can able see part of the bottom of the logo. I uploaded the original files of CSS's but no change.

I would recommend putting back on the original stylesheet.css file from the template package and then turning on all of the header elements, etc so that you are starting from something that looks like the demo. Then, make your changes one by one and make any css adjustments as you go.

Thanks,

Anne

[wmorris]

I would recommend putting back on the original stylesheet.css file from the template package and then turning on all of the header elements, etc so that you are starting from something that looks like the demo. Then, make your changes one by one and make any css adjustments as you go.

Thanks,

Anne

Anne, I did that three times no change.

[picaflor-azul]

Anne, I did that three times no change.

You must not be overwriting the files. Did you turn on the search header, currencies, etc? Did you put on the entire template package files?

Thanks,

Anne

[wmorris]

You must not be overwriting the files. Did you turn on the search header, currencies, etc? Did you put on the entire template package files?

Thanks,

Anne

Yes, all the header (Currencies, Languages, etc) are turned on. But, I am missing the white back ground of the header.

[wmorris]

Anne,

I have re-uploaded all the files and still get the same thing here is the image:

[wmorris]

Well I did something in stylesheet.css what am I missing?

[wmorris]

Anne,

I have re-uploaded all the files and still get the same thing here is the image:

Anyone?

[monkeyjr47906]

Anne, I did that three times no change.

I figured this out recently, when you don't have a tagline specified it cuts off the header.