322 comments found.
great theme !
Hey Nguizan,
Thanks for great feedback
We appreciate it a lot 
Good luck with your project!
Hi, I bought this theme in html 5, however I need this theme wordprees, you have this version in WORDOPREES for me to buy?
Hey Tatudopronto,
Thank you for your comment and feedback 
Currently HTML5 Site Template version is the one that is available, but you might customize it with Dreamweaver or Kompozer. Please follow us on ThemeForest, Facebook, Twitter or Google+ to be informed about the WP version.
Please let us know if we can be of further assistance.
Thanks and kind regards
But you have some theme in this multipurpose wordpress that is as close as possible in this theme html 5 I just bought?
Currently on our ThemeForest portfolio we don’t have WP themes, which are close to MultiPurpose HTML5 site template.
Please let us know if we can be of further assistance.
Thanks and kind regards
Hey Tatudopronto,
Thank you for your comment.
We are happy to inform that MultiPurpose WordPress theme (with lot of outstanding features) was finally released and it is available to download now on themeforest 
Please have a look here: http://themeforest.net/item/multipurpose-responsive-wordpress-theme/9219359
Hope it helps!
Please let us know if we can be of further assistance.
Kind regards,
ThemeMotive team
Hi, I want to say here that we have this template in a spanish blog about mattresses online and I am very satisfied. It is very easy to use and its modification options are high. I recommend it.
Hey Viserrres,
Thank you for positive feedback
Seems that on the website you link to, you used one of our free WP theme (Purple Pro), not MultiPurpose HTML5 website template.
Thanks and kind regards
When viewed on a mobile device my secondary navigation show fine. However, the Home menu option does not take you back to the Home page.
www(dot)jmlabaki(dot)com
thanks
Hey,
Thank you for your comment 
After reviewing your website we observed few things to improve:
1) add selected=”selected” (for better usability) for example on books.html
you may use this code instead of your current one:
<select id="sec-nav" name="sec-nav">
<option value="http://www.jmlabaki.com/">Home</option>
<option value="http://www.jmlabaki.com/books.html" selected="selected">Books</option>
<option value="http://www.jmlabaki.com/contact.html">Contact</option>
</select>
2) Please remove the <section class="top"> .... </section> from your source code. Seems that you hide that section in CSS, but it’s better to just remove it from the source code.
3) There is not necessary </li> tag – you migh remove. If you open source code in Firefox then you will see it’s red color.
Please let us know if we can be of further assistance.
Thanks and kind regards
Guuuueeesss who?!
So i am setting up the contact forms. And in the php i didn’t see anywhere to put what server, username, and password i am using to send the mail out from. I was wondering where i would put this information to do so.
P.S. do you take donations for helping people out. I would like to shoot you a little extra dough for helping me.
Thanks,
Justin
Hey Justin,
Thank you for your new comment 
“Field out” is taken from the field “from” on the form here http://thememotive.com/multipurpose/contact.html, so it’s user e-mail. Mails are sending thanks to PHP mail function. It’s common solution, so you don’t need to put e-mail from and then you could easily respond to the e-mail you get when somebody submit the form. We appreciate your great feedback
Would be great to have just 5 star rate from you 
Please let us know if we can be of further assistance.
Thanks and kind regards
Hi,
Is there a way to make the ‘portfolio-with-slider’ slider autoplay?
I’m guessing it a setting in the script.js?
Hey,
Yes, sure it’s possible, you can see it’s even working in the preview.
Settings you may change in script.js here:
var OptionsSlider = {
autoslides: 1,
delay:9000,
change_slide_on_click: 1,
pause_on_hover: 0,
pause_on_action: 1
}
Please make sure you have got autoslides: 1 (it means it’s enabled) and you may change delay:9000 to for example delay:4000, so that slides will be changed every 4 seconds instead of 9.
Please let us know if we can be of further assistance.
Thanks and kind regards
Ah.. just realised there is a pause on hover on it. Hence it wasn’t animating – sorry!
You are welcome 
Hi,
There is are a couple of instances where i need to apply a style to get rid of the box-shadow border on images.
However, I can’t seem to apply it anywhere to work properly as the .img-border:before seems to be overriding it.
Is there a way to to do this?
Thanks!
Hey LeonSMC,
Thank you for your comment 
As for your question, please just remove this part of code in scripts.js:
//fancy borders on images
$(".content img, footer .widget_photos img").not(".content .testimonial img, .hp-services img, .logo, h3 img, button img, .product-meta img, .img-border img").each(function(){
var i = $(this);
i.wrap('<span class="img-border" />');
if(i.hasClass("alignleft")) {
i.removeClass("alignleft");
i.parent().addClass("alignleft");
}
});
or remove just box-shadow part from style.css in this line:
.img-border:before {display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 2; box-shadow: inset 0 0 0 4px rgba(0,0,0,0.1); content: " ";}
Please let us know if we can be of further assistance.
Thanks and kind regards
Good stuff – thanks. It’s only in a couple places that i want to remove it – so would like to keep the box-shadow in general. I’ve tried adding a new class without a box-shadow but and then assigning it to the image but it seems to get overwritten?
Then please add the CSS seletors for which you would like to avoid box-shadow in this part of the already written function in scripts.js (for example there is already there .content .testimonial img, .hp-services img, etc.):
.not(".content .testimonial img, .hp-services img, .logo, h3 img, button img, .product-meta img, .img-border img")
Please let us know if we can be of further assistance.
Thanks and kind regards
Thanks – that works!
Ah.. just realised there is a pause on hover on it. Hence it wasn’t animating – sorry!
You are welcome 
I hope this isn’t another DOH! moment. Is it possible to get word bubbles on the social media icons in the header pretty much like it does exactly in the footer? Thanks again for the help. As always it’s much appreciated.
Hey,
Thank you for your comment 
You can add it easily, please just make one little replace in scripts.js 
from
$("footer .social a").each(function(){
to
$("footer .social a, header .social a").each(function(){
Then the Tooltip in the header will work the same as on the footer.
Please let us know if we can be of further assistance.
Thanks and kind regards
As always worked a treat. Thanks again for your help it is greatly appreciated. You can guarantee i will be purchasing templates from you again!
You are welcome
Thank you for great feedback
We appreciate it a lot 
Hi, Thanks for all of your help again. Your support is great and it seems as if you always have a solution to everyone’s problems. So the problem I am running into this time is; I would like to remove the border that is around the images. It looks like a light gray border. And an example of it is around the image on portfolio-project-half.html. I have looked in the js and css files and tried changing a lot of border options with no avail. I was wondering if you could tell me where this option is so that i may change it.
Thanks again! Justin
Hey Justin,
Thank you for your comment and great feedback. We appreciate it 
As for your question, please just remove this part of code in scripts.js:
//fancy borders on images
$(".content img, footer .widget_photos img").not(".content .testimonial img, .hp-services img, .logo, h3 img, button img, .product-meta img, .img-border img").each(function(){
var i = $(this);
i.wrap('<span class="img-border" />');
if(i.hasClass("alignleft")) {
i.removeClass("alignleft");
i.parent().addClass("alignleft");
}
});
or remove just box-shadow part from style.css in this line:
.img-border:before {display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 2; box-shadow: inset 0 0 0 4px rgba(0,0,0,0.1); content: " ";}
Please let us know if we can be of further assistance.
Thanks and kind regards
DOH! I was looking in jquery.js instead of scripts.js. Sorry! Worked like a charm! Thanks again!
You are welcome 
Notes: jQuery is general library, but all custom scripts are in scripts.js
Please let us know if we can be of further assistance.
Thanks and kind regards
Hi,
First, a friend purchased this template for their non-profit and I am setting it up for them. If you need to see license# let me know and I can email it to you.
I have a problem. All I’ve done so far is change the main color, added their logo to a page and changed the menu style. Now when you scroll down, the page flickers and the sticky/fixed menu doesn’t drop down smoothly like it does before these things were changed. Also, when the sticky header does appear the logo is very very small. You can see the setup here: http://www.fawntbay.org/fawn-newsite/top-header-disabled2.html
I’m using Firefox v24 (current) on Win8. How can I fix these issues?
Thanks for your help.
Hey dutchess,
Thank you for your comment 
1) As for logo image in sticky header, it seems like your native image is higher than standard logo images, so you might please change the height value from 20px to for example 40px in style-headers.css in this line:
header.sticky img {height: 20px; width: auto;}
2) As for sticky header it seems like you have made custom changes in the code structure, so in order to fix it, please:
-remove the <div> on line 23.
-change the </div> on line 219
to
<div class="clear"></div>
Then it will work fine as in the preview 
Please let us know if we can be of further assistance.
Thanks and kind regards
Thanks so much for your help and quick reply. I do have just one more question: Some of the body tags have class=”home” and others don’t. Is there a reason for that?
You are welcome 
Yes, for index page (homepage) it’s recommenred to use “home” class in body as it’s adding some little adjustments for better looking of some elements like latest posts, slider, etc… Thanks to this class you can also have control over the look of the elements for just index page, without changing the style of the same elements on subpages.
The example below will change the font-weight for tabs element only on the index page or pages, which are using the “home” class in the body.
.home .tabbed .tab-content h2 {font-weight: 400;}
Please let us know if we can be of further assistance.
Thanks and kind regards
Hello,
Can U please guide me, I am using boxed version (home7.html), Can u please help me with footer, How to set footer work as full width.
Hey manojdhanda,
Thank you for your comment 
As for your question: Please change the code on line 481
from
<footer>to
</div><footer>
and please also change the code on line 524
from
</footer></div>
to
</footer>
Then the footer will be full width 
Please let us know if we can be of further assistance.
Thanks and kind regards
I must be doing something wrong, slider not working. the site is www.georgeandbakers.com. Can you pls have a look and advice
Hey vessels06,
Thank you for your comment.
We can observe that slider is working now while clicking on it, do you need autoslides feature?
Please let us know if we can be of further assistance.
Thanks and kind regards
hi, How can I get to have opacity on the slider on my site? like on hosting page—> highly customizable on the live preview?
Thanks very much! Aron
I forgot to mention, I use slider7.
Ok, I think I know how to do that
Open photoshop and insert a layer on the picture
I’ve checked you’ve done it the same way! 
Hey Aron,
We just have read your comment
Yes, you could prepare new photo in Photoshop and that will work.
Please let us know if we can be of further assistance.
Thanks and kind regards
Hi, I really love your template. I have a few silly questions: 1) In which line of code do you change the overall page colour? 2) Where is the CSS, do you remove this: https://docs.google.com/a/osmiumservers.com/file/d/0B6oWyNUPrOTFeFpfazcza1MyUDQ/edit?usp=sharing
That’s all, thank you!
Hey Spiroman1,
Thank you very much for your great feedback
That means a lot for us 
Concerning your questions:
1) Please just add style-colors.css in your document head section (if it’s not already added in the template your are editing).
Example:
<link href="style-colors.css" rel="stylesheet" type="text/css" media="screen">
Then just add one of the available and predefinied colors skin class in the body tag, for example:
<body class="color-red">
2) The link you provide demands password. Could you please write what kind of file you asked?
Please let us know if we can be of further assistance.
Thanks and kind regards
Here’s a link that should work: http://i.imgur.com/3NwASOa.png If you can’t see the link again, I’m wanting to remove the secondary menu, of when you scroll down the page and appears at the top.
Thanks for your feedback!
You can remove the sticky header easily by removing just this sticky-enabled no-topbar from html file.
Please let us know if we can be of further assistance.
Thanks and kind regards
Hi,
If I save the contact form as a PHP file instead of a HTML file it stops working properly.. if no details are entered and you hit submit the error messages show but on a blank page and without any styling.
I was just wondering why this would be?
(i can keep the form as a html file but just wanted to understand why this would happen).
Thanks!
Also.. the map element has the ID’map’ but i can find only one line of code in the style sheet that refers to this… where does it know to pull in the code for the Google map?
Sorry for questions!
Hey LeonSMC ,
Thank you for your comments 
Concerning send-contact.php it is PHP file and demands PHP server to work (send the mails) and return the message after sending like on the online preview. It’s part of Ajax contact form – Ajax is PHP + Java Script.
Concerning Google Map there is gmap class in contact.html and in style.css it’s here:
.contact .gmap {height: 300px;}
Please let us know if we can be of further assistance.
Thanks and kind regards
Thank you again for response.
I’m setting up site up on a local Buffalo NAS and keeping it as an intranet. The form SEND is not working and this may be the reason why. When I hit send it just stays saying SENDING… and no email sent.
The NAS has a built in web server but obviously it’s falling down somewhere when trying to send the email.
Thanks!
Yout are welcome
If it is staying on SENDING… then it seems like PHP is not enabled on the server.
Please let us know if we can be of further assistance.
Thanks and kind regards
I thought it was enabled (Web Server with php and MySQL) but will have to check.
PHP elements work on the website so would these work if it was not enabled on the NAS / Webserver?
If PHP elements work fine, then it should work fine. Could you please check it on your local PHP server if it’s working? Did you modify the PHP or scripts.js file? (it might be related to that too), so would be good if you could try if it’s working with the native files. You could also send us your files, so that we can check it on our testing server if needed.
Please let us know if we can be of further assistance.
Thanks and kind regards
How to set home icon on mein menu?
Can We use it with wp?
Hey Manojdhanda 
Thank you for your comment 
As for the icon for the main header menu, please find the example for header h3 below:
1) Please add additional class for home menu item, for example:
<li><a class="home-icon" href="./">Home</a></li>
2) Please add the exemplary code to style-headers.css:
header.h3 li a.home-icon {
background: url("images/home-icon.png") 50% 8px no-repeat;
text-indent: -9999px;
height: 86px;
}
header.h3 nav.mainmenu>ul>li:hover>a.home-icon {
border-bottom: 0;
background: url("images/home-icon.png") 50% 8px no-repeat;
opacity: 0.5;
}
This is HTML5 Site template you may need to convert to WP or other CMS version by yourself if needed and use it for your own one website only.
Please let us know if we can be of further assistance.
Thanks and kind regards
Thank you so much, I am able to add home icon now, Can u please help me with create mega menu for category wise menus like : Products > Product Cetegory 1 > Product Cetegory 2: Product 1,2,3,4 & Product 1,2,3,4 to Product Cetegory2
How to run 5 Testimonial with image, Unable to do. Thanks in advance..
Concerning menu – for more levels you just need to add proper html code.
Here is the working/tested example of li element for header menu with two level links:
<li class="current-menu-item"><a href="./products.html">Products</a>
<ul>
<li><a href="./product-cetegory-1.html">Product Cetegory 1</a>
<ul>
<li><a href="./product-1.html">Product 1</a></li>
<li><a href="./product-2.html">Product 12</a></li>
<li><a href="./product-3.html">Product 13</a></li>
</ul>
</li>
<li><a href="./product-category-2.html">Product Cetegory 2</a>
<ul>
<li><a href="./product-21.html">Product 21</a></li>
<li><a href="./product-22.html">Product 22</a></li>
<li><a href="./product-23.html">Product 23</a></li>
</ul>
</li>
</ul>
</li>
Please do note that comment system is removing lines, so if you would like to have well formatted html then please let us know about your e-mail adress, so that we could send it to you.
The working example is also on the top header (frames / patterns menu items).
If you would like to add five testimonial then it could go in columns (on testimonial for each column), here is the working example:
<section class="columns">
<article class="col5">
<div class="testimonial">
<div>
<p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
<span />
</div>
<img src="images/temp/avatar3.jpg" alt="" />
<p>Michael Brown<br /><span>SDC Industry</span></p>
</div>
</article><article class="col5">
<div class="testimonial">
<div>
<p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
<span />
</div>
<img src="images/temp/avatar3.jpg" alt="" />
<p>Michael Brown<br /><span>SDC Industry</span></p>
</div>
</article><article class="col5">
<div class="testimonial">
<div>
<p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
<span />
</div>
<img src="images/temp/avatar3.jpg" alt="" />
<p>Michael Brown<br /><span>SDC Industry</span></p>
</div>
</article><article class="col5">
<div class="testimonial">
<div>
<p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
<span />
</div>
<img src="images/temp/avatar3.jpg" alt="" />
<p>Michael Brown<br /><span>SDC Industry</span></p>
</div>
</article><article class="col5">
<div class="testimonial">
<div>
<p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
<span />
</div>
<img src="images/temp/avatar3.jpg" alt="" />
<p>Michael Brown<br /><span>SDC Industry</span></p>
</div>
</article>
</section>
Please let us know if we can be of further assistance.
Thanks and kind regards
Not Satisfied Sorry!, I try but found testimonial not slide, all show on page directly, And mega menu not look like best.
Please do note that you didn’t tell us that you need slides, so we thought you may need testimonials in columns, in your case custom code to slide that testimonials will be needed. You may use for example slider from “Our Client” and adjust it for your needs. As for mega menu – there is no feature of typical mega menu currently, but we may add it in the future, that’s why we send you working example of two level menu, which could meybe work for you for now.
Please let us know if we can be of further assistance.
Thanks and kind regards
Unable to set with client slider code, Please give me code from your end for slider testimonials..
Could it be looking like “Our Client” with headline “Testimonials” and then one testimonial per slide, right?
Yes..
Can u please give code asap??
Sure, we are working on that at the moment. Will give you feedback as fast as possible.
Thank you for your patience.
The code is prepared for you, could you please send us e-mail, so that we could send you back the working example (html template).
Thanks and kind regards
email sent
We just sent you the e-mail back.
Please let us know if we can be of further assistance.
Thanks and kind regards
not working, Not sliding???
It’s working on our browsers. Could you please make sure you added the css styles and using the structure from the example. It should work. Slider arrows are close to headline.
Please let us know if we can be of further assistance.
Thanks and kind regards
OH Sorry. I was not add html, Thanks for your support..
Can u please help with slider speed or auto slide settings?
As for the content-slider in this case you will need to add custom code.
Please place this code under line 748 on the current version of scripts.js:
function autoContentSlider() {
window.setInterval(function () {
if(pos > maxLeft) pos--;
else pos = 0;
var moveTo = pos * itemW - offset;
slider.stop(true, true).animate({left: moveTo}, speed);
}, 3000); // repeat forever, polling every 3 seconds
}
autoContentSlider();
Then it should change the slides every 3 seconds 
Please let us know if we can be of further assistance.
Thanks and kind regards
Great Help,
Thank you so much, I am sure to give you more business ever.
You are welcome
Thanks for great feedback, would be fantastic to have 5 star rate from you 
Please let us know if we can be of further assistance. Thanks and kind regards
5 Rates, You are Rock!!!
Hi,
Is there a way to position the pagination so that is sits in the section breadcrumb grey line to the right hand side?
Thanks!
Hey LeonSMC,
Thank you for your comment 
You may need custom code and html structure change:
1) Please update the html structure for breadcrumbs, for example:
<section class="breadcrumb p07">
<div>
<p><a href="#">Home</a> <a href="#">Shortcodes</a> Elements</p>
<div class="wp-pagenavi">
<a href="#" class="previouspostslink">Previous page</a> <span class="current">1</span><a href="#" class="page larger">2</a><a href="#" class="page larger">3</a><a href="#" class="page larger">4</a><a href="#" class="page larger">5</a> <a href="#" class="nextpostslink">Next page</a>
</div>
</div>
</section>
2) Please update/replace the style for breadcumbs in style.css under line 232:
.breadcrumb {border-bottom: 1px solid #e6e6e6; background-color: #ececec; min-height: 43px;}
.breadcrumb div {max-width: 940px; margin: 0 auto;}
.breadcrumb div p {max-width: 940px; margin: 0 auto; padding: 1em 0; color: #999; font-size: 0.846em; float: left;}
.breadcrumb div p a {display: inline-block; margin-right: 5px; padding-right: 14px; background: url("images/bcrumb-arrow.gif") 100% 50% no-repeat; color: #3f3f3f;}
.breadcrumb div p a:hover {color: #999;}
.breadcrumb div .wp-pagenavi {float: right; margin: -30px 0 0 0; padding: 0;}
@media (max-width: 620px) {
.breadcrumb {min-height: 76px;}
.breadcrumb div .wp-pagenavi {margin: 0px;}
}
Then the pagination will be in the breadcrumb section on the right side as you wanted 
Please let us know if we can be of further assistance.
Thanks and kind regards
Fantastic – I was trying to position i using DIV but could not get the CSS to work properly – thankyou!
The only issue is that something in the CSS above seems to knocking the main content out of alignment to the left edge of the screen).
The footer and header seem to be uneffected.
I worked it out – I i was removing the following for some reason when i cut’n’paste which had a effect:
.content {position: relative; overflow: hidden; clear: both; max-width: 940px; margin: 0 auto; padding: 1px 0 40px;}
.boxed .content {max-width: 100%; padding: 1px 30px 40px;}
You are welcome 
We tried the code before comment here, so that’s possible you removed some code for some reason as you wrote. So you fixed all for that moment?
Please let us know if we can be of further assistance.
Thanks and kind regards
All fixed thanks – I added in the above again as it was giving the content it’s styling… i must have deleted it somehow
Thanks
You are welcome 
I am adding photos to my website. They photos look great on all devices, but the photos on small devices, like a smartphone, are cropped. Do I have to use different sizes for the same photo? I am using photos of 600px width (the full width of the main column).
Your demo version does not show the size of the image in the src img code (width, height in px). Is this the standard for html 5 responsive templates? In html 4 it is recommended to add the size of the image in the code.
Thank you
Hey Remsa,
Thank you for your comment 
We couldn’t replicate that issue on the online preview (for example here all looks fine on all mobiles view, so probably it might be your custom image on some custom place/html structure. Then you might please add the class for this image for example class=”custom-img” and add additional style in style.css
.custom-img {max-width: 100%; height: auto;}
Concerning img size attributes, HTML5 is valid without them as well, but if you are sure about the image dimensions you are using in your project then you might add the height and width value (it’s even recommended), like it’s added for the logo image in the header.
Please let us know if we can be of further assistance.
Thanks and kind regards
Hi,
Maybe another stupid question. I would like to change the overall background to actually have a images on the left and right of the page so that it is not just blank space. Is there a way of changing the left and right backgrounds to different images? Can I add a scrolling set of images or logos to these areas? Not sure if this is configurable in the theme or not.
Sorry…new to using this but really like this theme.
Thanks in advance for any help.
Hey,
You are welcome
Thank you for your comment 
According to your question, please open style.css and replace:
body.boxed {background-color: #ededed;}
to for example:
body.boxed {background-color: #ededed; background-image: url('images/exemplary-background-image.jpg');}
where exemplary-background-image.jpg is any file name you would like to use as your background. Please not also that depends on if file dimensions and the result you would like to accomplish you might also consider to add no-repeat or repeat-x or repeat-y.
Please let us know if we can be of further assistance.
Thanks and kind regards
Thanks for the reply. For optimal background is there a size of background image that would work best without repeat? The theme must be designed for a specific size of background if you can let me know what this is it would be helpful.
Thanks again.
The image size depends on your vision and the goal you would like to accomplish for different resolution. If you would like to for example have the image heigh 800px and width 1280px with 1000px transparency in the middle of the image then it will be fully visible on the screen with resolution 1280×800. However for the optimization purpose the best could be and we recommend if you prepare the image in the way the frames are prepared, please have a look for example at images/frames/frame03.png. Then you need to add only repeat-y and prepare the images properly, similar way the frames are prepared. Exemplary code to add then:
body.boxed url("images/exemplary-background-image.jpg") center 0 repeat-y;
Please let us know if we can be of further assistance.
Thanks and kind regards
Great template. I see that there are 7 pages that come with the template. I’ll be adding a few new pages. Now to make these pages responsive – how to I use the media queries again – are they included in a separate css ?
Regards, OG
Hey orbitinggeek,
Thank you for your comment and positive feedback
We appreciate it 
Please note that there are about 100 files (not 7) that come with the template. Media queries are included in the main CSS file style.css (under each selector which is in responsive to make it clear and easier to modify and read the code). If you are using predefinied templates or some little modifications on new pages then responsive mode will also work. If you need to make some bigger custom changes and you want to change something more for responsive mode then we recommend you to please include your new media queries code also in style.css. If you keep it in separate file then it will be one extra necessary HTTP request, which is better to avoid for optimization and loading speed purposes.
Please let us know if we can be of further assistance.
Thanks and kind regards