Site Wide Media Query option is ghosted

Hello,
I am new to Dreamweaver CS6 and I am trying to set up media queries for my website design.
When I got to Modify>Media Queries> the dialog box has the option for either "Site Weide" or "This Document". However the "Site Wide" option is ghosted and I can't select it. I have tried a variety of different HTML documents (HTML 4 and HTML 5) but nothing works.
Can anyone help me solve this problem?
Thank You.

Have you defined your site in DW? You should do that in order for 'Site-Wide' media-query to work. Here's a walkthrough that you can follow to define your site in DW: http://tv.adobe.com/watch/learn-dreamweaver-cs5/gs01-defining-a-new-site/
Yes - the video is for CS5 and 5.5. But it is no different to CS6 too!

Similar Messages

Site-wide media query file

Let's say one has a style sheet for detail pages on one's website, say "detail.css", designed for desktop monitors.
Now one creates a sitewide media query file, e.g., mq-detail.css
which looks like this to refer to the tablet and phone style sheets:
/* detail-tablet */
@import url("detail-tab.css") only screen and (min-width:321px) and (max-width:768px);
/* detail-phone */
@import url("detail-phone.css") only screen and (max-width:320px);
Then how does one refer to the desktop style sheet? If I simply use "detail.css" with a minimum width of 769px, then some browsers like IE8 will not reference any style sheet.
Would this line in mq-detail.css   work:

If the screen width is >768 px, will "detail.css" be used for all browsers: that is the goal.

cma cma wrote:
I understand the concept but it is unclear how to implement it. In what files does one put these two lines?
<link rel="stylesheet" href="css/global.css" type="text/css" media="screen"/>
<link rel="stylesheet" href="css/mobile.css" type="text/css" media="screen"/>
The links above go on every page of my site as they are needed. The global.css for desktop AND mobile. The mobile.css contains the media queries css which are used to change the css in the global.css file specifically for mobile devices.
cma cma wrote:
David Powers' excellent tutorial talks about a number of mobile query issues but he does not discuss using the Site-wide media query file. Do you and Nancy dispense with that step and put all your media queries and CSS links in every html page?
There isn't any site wide media query file. That would be just a general css file that both desktop and mobile share, in my view. You only change what is necessary for mobile devices in a dedicated media queries file or you can include them in the general css file.
cma cma wrote:
He also says:
To ensure a level playing field with all devices that support media queries, just add the following line to the <head> of each web page:   #
<meta name="viewport" content="width=device-width, initial-scale=1">
Yes, that line of code needs to be present on all the website pages.
cma cma wrote:
Then Mr. Powers says to use "only"
media="only screen and (min-width: 401px) and (max-width: 600px)"
Havent read through the tutorial so can't really comment on that one only to say everyone has slightly different approaches to building pages. I tend to look at my design and see where it starts to break down then use media query break points based on that rather than any view port width.
cma cma wrote:
and finally:
use an Internet Explorer conditional comment to serve a special set of rules to older versions of IE like this:   #

You can use an IE conditional comment IF that is whats needed to get IE8 to work with your design....depends what css you are using. The more advanced techniques will not work in older browsers.

Media query issues

Hi,
After following all procedures of setting up the pages, the folders, etc. I want to INSERT or MODIFY the only one Media Query which is inside a CSS file. I use the one of almost default settings. I just have changed in the phone layout, 6 columns instead of 5.
When I go to Insert or Modify > Media query, a messagge shows up:
"The administrator of media query is not compatible with the fluid grid design." (It is translation from the spanish)
WHat does it mean? I tried updating the software but there are just Action scripts updating, I guess nothing to do with DW and media queries. Any help? I am using Dreamweaver CS6.
Thx a lot.
MARIO V.

In the English version of Dreamweaver CS6, the message you're seeing says "The Media Query Manager is not currently compatible with Fluid Grid Layouts". Selecting Insert > Media Queries opens the Media Query Manager, which creates a site-wide media query file.
The Fluid Grid Layouts create all the media queries in the main style sheet, whereas a site-wide media query file imports separate style sheets like this:
/* Desktop */
@import url("main.css");
/* Phone */
@import url("phone.css") only screen and (max-width:480px);
/* Tablet */
@import url("tablet.css") only screen and (min-width:481px) and (max-width:768px);
As the message says, they're not compatible. In fact, the Media Query Manager and site-wide media query files have been removed from Dreamweaver CC. You now control media queries through the @Media pane in the CSS Designer (which is not available in Dreamweaver CS6).
To insert or modify a media query in a fluid grid layout in Dreamweaver CS6, you need to edit the style sheet manually. It's one of the main drawbacks of the way fluid grid layouts were implemented in CS6.

In dreamweaver site-wide query option file grayed out

in dreamweaver site-wide query option file grayed out
Why won't this button option work, I cannot get the site-wide query to highlight, please help anyone, thanks.

You need to have a defined site in order for DW to correctly work with your files...
http://tv.adobe.com/watch/learn-dreamweaver-cs5/gs01-defining-a-new-site/
Once defined, you will always work from the Dreamweaver Files panel to ensure the program can manage your files correctly.

Media query does not work on my iPad (Was: media query question)

I am coding a site for mobile/tablet/desktop and while my desktop and iphone respond to the CSS, my ipad does not. The changes I make to the tablet in dreamweaver take, but when they go live the ipad does not respond. Obviously my media query must be incorrect but I cannot figure out the issue. Any help is much appreciated.
http://gbetza.mydomain.com/webservice2/test/KathrynFee/2014/profile.html
Thank you.

Yes. That's inevitable because smart phones are getting bigger while tablets are getting smaller & bigger. There is always going to be some crossover. Think of it this way, when a tablet behaves like a mobile device, it takes on the mobile layout. When tablet behaves more like a desktop, it takes the desktop layout.
Similarly, a wide smartphone in landscape mode is apt to look like your tablet layout.
See FluidGrid Example below:
http://alt-web.com/FluidGrid/Fluid2.html
Desktop = 4-col layout
Tablet = 2-col layout
Mobile = 1-col layout
For illustration purposes, I added a thick gold border to the Tablet layout only.
/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */
@media only screen and (min-width: 481px) and (max-width:768px) {
.gridContainer {width: 92%; border: 16px solid gold}
Nancy O.

Boy what a screw job when the program freezes in the middle of site wide fo

Boy what a screw job when the program freezes in the middle of site wide folder name changes.
Then you never know what did get changed or not until you wade thru every possible one.
And you cant just redo change the folder name, cuz the folder name did change.
Further, every attempt locks the program.
lost on broken links...
OK I'm talking about changing a folder name: ceaseless freezing
OK Now when it does work, none of the
AC_RunActiveContent.js
updated. What a mess
DW CS3
Mac OSX.4.11

you can force quit the front-most application in Mac OS X v10.5 or later by pressing Command-Option-Shift-Esc for three seconds.

Media Query not working...

My media query for screen size of a minimum of 480 px is not working. The Global CSS takes over. I can't find the reason why.
It seems the brackets are in place correctly. Can anyone see where the problem might be? All the other queries work.
thanks
____________________ sorry, it is a long CSS file
@charset "UTF-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/
img, object, embed, video {
/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
    width:100%;
    Dreamweaver Fluid Grid Properties
    dw-num-cols-mobile:        5;
    dw-num-cols-tablet:        9;
    dw-num-cols-desktop:    13;
    dw-gutter-percentage:    20;
    Inspiration from "Responsive Web Design" by Ethan Marcotte
    http://www.alistapart.com/articles/responsive-web-design
    and Golden Grid System by Joni Korpi
    http://goldengridsystem.com/
.fluid {
    position: relative;
.fluidList {
    list-style: none;
    list-style-image: none;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
    padding-bottom: 0;
    padding-left: 0;
    padding-right: 0;
/* Mobile Layout: 480px and below. */
.gridContainer {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
    clear: none;
    float: none;
#top {
    float: left;
    text-align: left;
.tagline {
    width: 100%;
    clear: both;
    margin-left: 0;
    /* [disabled]margin-top: 50px; */
    /* [disabled]top: 50px; */
    position: static;
    display: block;
    float: left;
    text-align: left;
    font-family: Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", sans-serif;
    font-style: italic;
#mainNav {
    width: 100%;
    float: left;
    display: block;
    background-color: #30434D;
#navMenu {
    clear: none;
    margin-left: 0;
    position: static;
    background-color: #30434D;
    font-style: normal;
    font-weight: 400;
    font-family: questrial;
    font-size: 18px;
#menuChoices {
.menuItem {
    color: #FFFFFF;
    font-family: questrial;
    font-size: 24px;
    font-weight: 400;
    padding-top: 0px;
    padding-bottom: 0px;
    width: 100%;
    clear: both;
    margin-left: 0;
    display: block;
    font-style: normal;
    height: 40px;
    line-height: 40px;
    float: left;
#SEHCMbutton a:link {
    background-color: #FC6719;
    color: #FFFFFF;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    text-align: center;
    text-decoration: none;
#SEHCMbutton {
    float: left;
    background-color: #FC6719;
    color: #FFFFFF;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 30px;
    text-align: center;
    margin-bottom: 30px;
    display: block;
    width: 95%;
#SEHCMbutton a:visited {
    background-color: #FC6719;
    color: #FFFFFF;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    text-align: center;
    text-decoration: none;
#SCVHpdfList {
    float: none;
.fluid.SCVHsubMenuItems a:link {
    color: #303E48;
    background-color: #CED1D3;
    display: block;
    height: 30px;
    line-height: 30px;
    text-decoration: none;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 400;
.fluid.SCVHsubMenuItems a:hover {
    color: #FFFFFF;
    background-color: #303E48;
    display: block;
    height: 30px;
    line-height: 30px;
    text-decoration: none;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
#div2 {
    display: block;
    clear: both;
    position: relative;
    float: left;
    width: 100%;
    background-color: #FC6719;
#SubHead {
    clear: both;
    float: left;
    position: relative;
    width: 100%;
    background-repeat: repeat-x;
    background-color: #FC6719;
    text-align: center;
#mainSubHead {
    text-align: center;
    width: 100%;
    clear: none;
    margin-left: 0;
    position: static;
    color: #FFFFFF;
    font-style: normal;
    font-weight: 400;
    font-family: questrial;
    font-size: 25px;
#div3 {
width: 100%;
#div4 {
clear: both;
margin-left: 0;
width: 100%;
#mainContent {
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 200;
    font-size: 15px;
    text-align: left;
    width: 65%;
    float: left;
    clear: both;
    padding-left: 25px;
    padding-right: 0px;
    padding-bottom: 0px;
    margin-bottom: 25px;
    margin-top: 0px;
    padding-top: 25px;
.content {
.contentStyle {
    padding-left: 30px;
    width: 85%;
    padding-right: 20px;
    margin-left: 0;
#mainAside {
    clear: none;
    position: static;
    height: auto;
    margin-left: auto;
    float: none;
    margin-right: auto;
#mainFooter {
    float: left;
    clear: both;
    background-color: #06A7E2;
    display: block;
    position: relative;
    width: 100%;
#footerLogo {
    padding-top: 15px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
#footerInfo {
    float: none;
    clear: none;
    color: #FFFFFF;
    font-style: normal;
    font-weight: 200;
    font-family: source-sans-pro;
    margin-left: auto;
    margin-right: auto;
    padding-top: 15px;
    text-align: center;
    font-size: 12px;
#asideBrochure {
    width: 100%;
    margin-left: 0;
    clear: both;
    text-align: center;
#asideVideo {
    width: 100%;
    margin-left: 0;
    text-align: center;
.lightLinks {
    color: #FFFFFF;
    font-style: normal;
    font-weight: 400;
    font-family: questrial;
    font-size: 18px;
    text-align: center;
    text-decoration: none;
.lightLinks a:link{
    color: #FFFFFF;
    font-style: normal;
    font-weight: 400;
    font-family: questrial;
    font-size: 18px;
    text-decoration: none;
.lightLinks a:hover{
    color: #3192D8;
    font-style: normal;
    font-weight: 400;
    font-family: questrial;
    font-size: 18px;
    text-decoration: none;
    text-align: center;
#thermalDiffLabel {
#thermDiffLabel {
    color: #30434D;
    font-style: normal;
    font-weight: 400;
    font-family: source-sans-pro;
    padding-top: 10px;
    padding-bottom: 0px;
    font-size: 16px;
#thermDiffPict {
#atuLabel {
    color: #30434D;
    font-style: normal;
    font-weight: 400;
    font-family: source-sans-pro;
    font-size: 16px;
    padding-top: 10px;
#atuPict {
#digitalLabel {
    color: #30434D;
    font-style: normal;
    font-weight: 400;
    font-family: source-sans-pro;
    font-size: 16px;
    padding-top: 10px;
#digitalPict {
#navChoices {
#navList {
    float: left;
    clear: both;
#PAnav {
    background-color: #30434D;
    width: 100%;
    display: block;
    clear: none;
#PAchoices {
#PAList {
    float: left;
    background-color: #30434D;
    color: #FFFFFF;
    font-style: normal;
    font-weight: 400;
    font-family: questrial;
    font-size: 18px;
    text-align: center;
    position: relative;
    width: 100%;
.PAmenuItem {
    display: block;
    height: 35px;
    line-height: 35px;
    letter-spacing: 0.3px;
.PAmenuItem a:link {
    display: block;
    height: 35px;
    line-height: 35px;
    color: #FFFFFF;
    text-decoration: none;
.PAmenuItem a:visited {
    display: block;
    height: 35px;
    line-height: 35px;
    color: #FFFFFF;
    text-decoration: none;
.PAmenuItem a:hover {
    display: block;
    height: 35px;
    line-height: 35px;
    color: #FFFFFF;
    text-decoration: none;
    background-color: #06A7E2;
.PAmenuItem a:active {
    display: block;
    height: 35px;
    line-height: 35px;
    color: #FFFFFF;
    text-decoration: none;
    background-color: #06A7E2;
.SubPageContentArea {
    color: #FFFFFF;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 200;
    font-size: 14px;
    text-align: left;
    letter-spacing: 0.06em;
#topContent {
    width: 100%;
    color: #30434D;
    font-style: normal;
    font-weight: 200;
    font-family: source-sans-pro;
    font-size: 14px;
#pageContent {
    width: 100%;
    display: block;
    clear: both;
#asideNavArea {
    color: #FCFDFF;
    width: 30%;
    float: left;
    clear: right;
    padding-left: 15px;
    margin-left: 5px;
    margin-top: 25px;
    margin-bottom: 15px;
    background-color: #CED1D3;
#bottomContentArea {
    background-image: url(/images/grayTexture2.png);
    background-repeat: repeat;
    width: 100%;
    display: block;
    clear: both;
.bottomContent {
    color: #FFFFFF;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 200;
    font-size: medium;
    padding-left: 15px;
    display: block;
#aboutPict {
#sectionPict {
    width: 100%;
#sideNavHolder {
    width: 200px;
    height: 300px;
    background-color: #B6C4CE;
    -webkit-box-shadow: 3px 3px 5px #303E48;
    box-shadow: 3px 3px 5px #303E48;
#bottomContentText {
#sectionPict img {
    width: 100%;
#greenMemLog img {
#indexContentArea {
    float: left;
    width: 100%;
    display: block;
#asideArea {
    width: 100%;
    float: left;
    background-color: #CED1D3;
    height: 200px;
    clear: both;
#mainAnim {
    width: 100%;
    display: block;
    float: left;
    clear: both;
    height: 200px;
    margin-bottom: 15px;
#slideShow {
    width: 100%;
#bottomContent {
    clear: none;
    background-image: url(images/grayTexture2.png);
    background-repeat: repeat;
    display: block;
    width: 100%;
    padding-top: 25px;
    padding-bottom: 25px;
    float: left;
#sectionPhoto {
#sectionPhoto img {
    width: 100%;
    display: block;
    clear: both;
#bottomContent2 {
    width: 250px;
    display: block;
    float: left;
    clear: left;
    margin-left: auto;
    margin-right: auto;
#bottomContent1 {
    width: 90%;
    clear: none;
#sectionVideo {
    width: 95%;
    float: left;
    margin-left: 15px;
    text-align: left;
    margin-top: 15px;
    display: block;
#sectionVideo img {
    display: block;
    float: left;
    width: 100%;
#Thermalnav {
    width: 0px;
.Thermalmenuitem {
    display: block;
    background-color: #06A7E2;
    color: #FFFFFF;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    text-decoration: none;
    height: 30px;
    padding-left: 15px;
    border-color: #FFFFFF;
    border-bottom-width: thin;
    border-bottom-style: dotted;
.Thermalmenuitem a:hover {
    display: block;
    background-color: #FC6719;
    color: #FFFFFF;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    text-decoration: none;
    height: 30px;
    padding-left: 15px;
.Thermalmenuitem a:link {
    display: block;
    color: #FFFFFF;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    text-decoration: none;
    height: 30px;
    padding-left: 15px;
.Thermalmenuitem a:visited {
    display: block;
    color: #FFFFFF;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    text-decoration: none;
    height: 30px;
    padding-left: 15px;
.Thermalmenuitem a:active {
    display: block;
    color: #FFFFFF;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    text-decoration: none;
    height: 30px;
    padding-left: 15px;
    background-color: #303E48;
#ThermalList {
#thermalLinks {
    margin-top: 15px;
    display: block;
    width: 400px;
    margin-left: auto;
    margin-right: auto;
#ThermalLinks {
    display: block;
    margin-top: 20px;
    clear: both;
    text-align: center;
    margin-bottom: 20px;
    float: left;
    width: 100%;
#SquareIcon {
    clear: both;
    width: 125px;
    float: left;
#LinearIcon {
    width: 140px;
    clear: none;
    float: left;
    margin-left: 20px;
#mainParagraph {
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 200;
    text-align: left;
    float: left;
    clear: both;
    width: 98%;
    margin-top: 15px;
    margin-bottom: 20px;
#leftSpacer {
    width: 10%;
    height: 500px;
    display: block;
    float: left;
#ThermalVideo {
    float: left;
    width: 100%;
    border: thin solid #000000;
#ThermalChoose {
    text-align: left;
    background-color: #FC6719;
    color: #FDFDFD;
    display: block;
    height: 35px;
    line-height: 35px;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    width: 100%;
    float: left;
    padding-left: 10px;
#SquareDiffuserSection {
    width: 100%;
    background-color: #06A7E2;
    color: #FFFFFF;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    font-size: 22px;
    text-align: left;
    display: block;
    height: 35px;
    float: left;
#SquareDiffText {
    float: left;
    width: 90%;
    margin-left: 15px;
    margin-top: 20px;
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 200;
    margin-bottom: 25px;
    text-align: left;
#squareDiffuserPicts {
    width: 100%;
    clear: both;
#SCVH {
    float: none;
    width: 150px;
    margin-left: auto;
    margin-right: auto;
    clear: none;
    display: block;
.Labels   {
    color: #06A7E2;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    text-align: center;
    vertical-align: bottom;
#SCAH   {
    float: none;
    clear: none;
    display: block;
    width: 150px;
    margin-left: auto;
    margin-right: auto;
#brochureThumb   {
    visibility: hidden;
#SquareDiffSectTitle   {
    color: #FFFFFF;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    padding-left: 15px;
#SquarePict   {
    clear: left;
    width: 250px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
#brochureLink   {
    visibility: hidden;
#bottomContent3   {
    float: left;
    width: 90%;
.zeroMargin_mobile   {
margin-left: 0;
.hide_mobile   {
display: none;
#SCAHbutton {
    float: left;
    width: 100%;
    clear: both;
    margin-bottom: 10px;
#SCVHbutton {
    float: left;
    clear: both;
    width: 100%;
    margin-bottom: 10px;
#SCbutton {
    float: left;
    clear: both;
    width: 100%;
    margin-bottom: 10px;
#SCVHbuttText {
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 200;
    width: 90%;
    clear: left;
    float: left;
    margin-left: 10px;
    text-align: center;
#SCbuttText {
    position: relative;
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 200;
    width: 90%;
    float: left;
    clear: left;
    margin-left: 15px;
    text-align: center;
#SC {
    width: 150px;
    margin-left: auto;
    margin-right: auto;
    float: none;
    clear: none;
    display: block;
#SCAHbuttText {
    width: 90%;
    float: left;
    clear: left;
    margin-left: 15px;
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 200;
    text-align: center;
#sqDiffPict {
    width: 150px;
    margin-top: 20px;
#LAD {
    width: 150px;
    margin-left: auto;
    margin-right: auto;
    float: none;
    display: block;
#LADbuttonText {
    float: left;
    clear: left;
    width: 90%;
    text-align: center;
#VAC {
    width: 150px;
    margin-left: auto;
    margin-right: auto;
    float: none;
    display: block;
#VACbuttonText {
    float: left;
    clear: left;
    width: 95%;
    text-align: center;
#VACH {
    width: 150px;
    margin-left: auto;
    margin-right: auto;
    float: none;
    display: block;
#VACHbuttonText {
    float: left;
    clear: left;
    width: 95%;
    text-align: center;
#LADbutton   {
    width: 100%;
#VACbutton {
    width: 100%;
    float: left;
    clear: left;
#VACHbutton {
    float: left;
    clear: left;
    width: 100%;
#LinearDiffusers {
    color: #FC6719;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    font-size: 22px;
    margin-bottom: 12px;
    padding-left: 15px;
#LinearDiffPict {
    margin-left: 5px;
    float: right;
    width: 45%;
#SquareDiffPict {
    float: right;
    color: #06A7E2;
    width: 40%;
#SquareDiffPict img {
    width: 170px;
#LinearDiffPict img {
    width: 175px;
#PHseries {
    width: 200px;
    float: left;
    clear: none;
    margin-bottom: 15px;
    margin-top: 20px;
    margin-left: auto;
    margin-right: auto;
#AirTerminalPicts {
    float: left;
    clear: both;
    background-color: #E6EBEE;
    display: block;
    width: 100%;
#PTseries {
    width: 200px;
    float: left;
    clear: left;
    margin-right: auto;
    margin-bottom: 25px;
    margin-top: 20px;
    margin-left: auto;
#ATUpicts {
    text-align: center;
    padding-left: 10px;
    margin-bottom: 20px;
#PHbuttonText {
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 200;
    text-align: left;
    padding-left: 12px;
#PTbuttonText {
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 200;
    padding-left: 12px;
    text-align: left;
#ModelPhSeries {
    padding-left: 5%;
    color: #FC6719;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    font-size: 22px;
#ATUVideo {
    width: 95%;
    margin-bottom: 20px;
    float: left;
    display: block;
    clear: both;
#mainParagraphATU {
    float: none;
    width: 95%;
    padding-bottom: 15px;
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 200;
#ATUsectionVideo {
    margin-top: 35px;
    margin-left: 10px;
    width: 100%;
    float: left;
#mainParagraphPH {
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 200;
    margin-bottom: 15px;
#PHatuSeries {
    float: right;
#ATUSectTitle {
    padding-left: 10px;
    width: 95%;
    color: #FFFFFF;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    font-size: 22px;
    line-height: 30px;
#ATUplace {
    width: 100%;
#ATUSection {
    float: left;
    width: 100%;
    background-color: #06A7E2;
#PHDuct {
    margin-top: 35px;
    float: left;
    display: block;
    width: 100%;
#PHductSection {
    float: left;
    background-color: #E6EBEE;
    clear: left;
    width: 100%;
#PHductCaption {
    float: left;
    clear: left;
    color: #FFFFFF;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 400;
    font-size: 22px;
    width: 100%;
    background-color: #303E48;
    line-height: 50px;
#PHaccessText {
    margin-top: 20px;
    float: left;
    width: 100%;
#PHdownloadTitle {
    background-color: #FC6719;
    color: #FFFFFF;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    line-height: 35px;
    font-size: 18px;
#PHpdfList {
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 400;
    line-height: 50px;
#PHdownloads {
    float: left;
    clear: right;
    width: 100%;
    margin-top: 35px;
    margin-bottom: 20px;
#Ductpict {
    float: left;
    display: block;
    width: 100%;
.PHdata a:active {
    color: #06A7E2;
    text-decoration: none;
#PHaccessories {
    float: left;
.PHdata a:visited {
    color: #303E48;
    text-decoration: none;
.PHdata a:hover {
    color: #06A7E2;
    text-decoration: none;
.PHdata a:link {
    color: #303E48;
    text-decoration: none;
.PHdata {
    border-bottom: 6px solid #E6EBEE;
    background-color: #FFFFFF;
#PHimage {
    width: 150px;
#PTseries2 {
    float: right;
#Ductpict2 {
    width: 510px;
    float: left;
#PHductCaption2 {
    width: 510px;
    float: left;
    background-color: #303E48;
    height: 40px;
    color: #FFFFFF;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    line-height: 40px;
    font-size: 22px;
#DigitalContent {
    text-align: left;
    margin-top: 20px;
    background-color: #E6EBEE;
    float: left;
    width: 90%;
#digiPicts {
    background-color: #E6EBEE;
    display: block;
    clear: left;
    width: 300px;
#SEHCMbutton a:hover {
    background-color: #06A7E2;
    color: #FFFFFF;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    text-align: center;
    display: block;
#EdgeSVCH {
    float: left;
    margin-left: 10px;
#SCVHanim   {
    float: left;
    margin-top: 35px;
    width: 95%;
    margin-bottom: 10px;
#SVCHanimPict {
    float: left;
    width: 100%;
#SCVHhowToButt {
    float: left;
.fluid.SCVHsubMenuItems {
    color: #303E48;
    background-color: #CED1D3;
    display: block;
    width: 100%;
    text-align: center;
    height: 30px;
    line-height: 30px;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 200;
#SCVHsub {
    margin-bottom: 10px;
.fluid.SCVHsubMenuItems2 {
    background-color: #CED1D3;
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 400;
    text-align: center;
    height: 30px;
    display: block;
.fluid.SCVHsubMenuItems2 a:link {
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 400;
    text-decoration: none;
    line-height: 30px;
    display: block;
.fluid.SCVHsubMenuItems2 a:hover {
    background-color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 400;
    text-decoration: none;
    line-height: 30px;
    display: block;
    color: #FFFFFF;
.fluid.SCVHsubMenuItems2 a:visited {
    background-color: #CED1D3;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 400;
    text-decoration: none;
    line-height: 30px;
    display: block;
    color: #303E48;
.SCVHlist a:link {
    color: #303E48;
    text-decoration: none;
    display: block;
    background-color: #FFFFFF;
    height: 30px;
    line-height: 30px;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    border-bottom: medium solid #E6EBEE;
.SCVHlist a:hover {
    color: #FFFFFF;
    background-color: #06A7E2;
    display: block;
.SCVHlist a:visited {
    color: #303E48;
    background-color: #FFFFFF;
    display: block;
#SCVHchartPict {
    float: left;
    text-align: center;
    width: 300px;
#SCVHdata {
    margin-top: 25px;
    text-align: left;
    width: 90%;
    float: left;
#SCVHbottomData {
    margin-top: 15px;
    width: 300px;
    float: left;
#SCVHchartPict img {
#SCVHchartGraphic {
    width: 100%;
#SCVHdimGraphic {
    width: 100%;
#SCVHdimenPict {
    margin-top: 20px;
    width: 300px;
#SCVHvideo {
    width: 95%;
#LADimages {
    float: right;
    width: 200px;
    margin-left: 20px;
#LAD3D {
    float: right;
#LADusePict {
    float: right;
    clear: right;
    margin-top: 50px;
#MidContent {
    float: left;
    text-align: left;
    margin-top: 20px;
#CoAnda {
    margin-top: 25px;
    border: thin solid #FFFFFF;
    float: left;
    width: 300px;
    padding-left: 15px;
#VACinduction {
    float: right;
    margin-left: 10px;
#PAproducts {
    width: 100%;
    clear: both;
    display: block;
    float: left;
#SlideShow {
    width: 100%;
    float: left;
    height: 400px;
    display: block;
#ProductWrapper {
    width: 300px;
    display: block;
    clear: both;
    float: left;
.fluid.PromoBlocks {
    width: 225px;
    display: block;
    clear: both;
#SQdiffPict {
    width: 100%;
#ATUpict {
    width: 100%;
#DigiDiffPict {
    width: 100%;
@media only screen and (min-width:480px){
#PAproducts {
    width: 100%;
    clear: both;
    display: block;
    float: left;
#mainAnim {
    width: 100%;
    display: block;
    float: left;
    clear: both;
    height: 270px;
    margin-bottom: 15px;
/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */
@media only screen and (min-width: 600px) {
.fluid.SCVHsubMenuItems2 a:link {
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 400;
    text-decoration: none;
    line-height: 30px;
    display: block;
.fluid.SCVHsubMenuItems2 a:hover {
    background-color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 400;
    text-decoration: none;
    line-height: 30px;
    display: block;
    color: #FFFFFF;
.fluid.SCVHsubMenuItems2 {
    background-color: #CED1D3;
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 400;
    text-align: left;
    height: 30px;
    display: block;
    padding-left: 10px;
    font-size: 13px;
    width: 240px;
    float: left;
    clear: right;
#DigitalPicts {
    float: left;
    display: block;
#SEHCMbutton {
    float: left;
    margin-left: 15px;
    background-color: #FC6719;
    color: #FFFFFF;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 40px;
    text-align: center;
    display: block;
    width: 62%;
.gridContainer {
    width: 100%;
    padding-left: 0%;
     padding-right: 0%;
    clear: none;
    float: none;
    margin-left: auto;
#top {
    text-align: left;
    float: left;
.tagline {
width: 100%;
clear: both;
margin-left: 0;
#menuChoices {
#div2 {
    width: 100%;
    background-color: #FC6719;
    height: 380px;
#SubHead {
    position: static;
    height: 40px;
    width: 100%;
#mainSubHead {
    clear: both;
    margin-left: 0;
    position: static;
    height: 40px;
    width: 100%;
    line-height: 40px;
#div3 {
width: 100%;
#div4 {
clear: both;
margin-left: 0;
width: 100%;
#mainContent {
.content {
.contentStyle {
    width: 88.6792%;
    margin-left: 0;
#mainAside {
    margin-left: auto;
    position: static;
    height: auto;
    display: block;
    width: 700px;
    margin-right: auto;
#mainFooter {
#footerLogo {
    margin-left: 25px;
    text-align: left;
#footerInfo {
    margin-left: 25px;
    text-align: left;
    width: 400px;
#asideBrochure {
    clear: both;
    float: left;
#asideVideo {
    margin-left: 0;
    float: left;
    text-align: center;
.lightLinks {
    text-align: center;
    line-height: 16px;
#thermalDiffLabel {
#thermDiffLabel {
    width: 330px;
    padding-top: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
#thermDiffPict {
#atuLabel {
    padding-top: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
    width: 330px;
#atuPict {
#digitalLabel {
    width: 330px;
    padding-top: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
#digitalPict {
.mainSubHead {
    color: #FFFFFF;
    background-color: #F60;
    display: block;
    font-family: questrial;
    font-size: 30px;
    margin: auto;
    height: 80px;
    line-height: 40px;
    font-style: normal;
    font-weight: 400;
#navList {
#PAnav {
#PAchoices {
#PAList {
    position: relative;
    margin-left: auto;
    margin-right: auto;
.PAmenuItem {
    float: left;
    position: relative;
    display: block;
    width: 115px;
    clear: right;
    font-size: 13px;
    padding-left: 10px;
.SubPageContentArea {
    padding-bottom: 20px;
    text-align: left;
#topContent {
#pageContent {
    width: 100%;
#asideNavArea {
#bottomContentArea {
.bottomContent {
#aboutPict {
#sectionPict {
#sideNavHolder {
#bottomContentText {
#indexContentArea {
#asideArea {
    line-height: 30px;
    width: 150px;
    height: 700px;
    float: left;
    clear: none;
#mainAnim {
    height: 425px;
    width: 100%;
    float: left;
#bottomContent {
#sectionPhoto {
#bottomContent2 {
    float: left;
    clear: left;
    width: 250px;
    margin-left: auto;
    margin-right: auto;
#bottomContent1 {
    float: left;
    width: 575px;
    margin-left: 5px;
#sectionVideo {
    width: 580px;
    float: left;
    margin-left: 15px;
.mainParagraphs {
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 200;
    font-size: 15px;
    text-align: left;
#ThermalList {
#thermalLinks {
#ThermalLinks {
    float: left;
    clear: both;
    width: 150px;
    margin-bottom: 10px;
#SquareIcon {
    width: 100px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 15px;
    float: none;
#LinearIcon {
    float: none;
    width: 120px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 15px;
    clear: left;
#mainParagraph {
    float: left;
    clear: both;
    width: 98%;
    margin-top: 0px;
#leftSpacer {
#ThermalVideo {
    width: 70%;
    margin-top: 20px;
    margin-left: 15px;
    border-width: thin;
#ThermalChoose {
    margin-top: 0px;
    text-align: center;
    line-height: 1.5em;
    height: 50px;
#SquareDiffuserSection {
    height: 35px;
#SquareDiffText {
    width: 575px;
    margin-top: 20px;
    margin-bottom: 25px;
    margin-left: 15px;
    padding-left: 8px;
    text-align: left;
#squareDiffuserPicts {
    width: 600px;
    margin-top: 15px;
    margin-left: 15px;
#SCVH {
    display: block;
    width: 150px;
    float: none;
    margin-left: 0px;
    margin-right: 0px;
#SCVHanim   {
    float: left;
    margin-top: 35px;
    width: 50%;
.fluid.SCVHsubMenuItems {
    color: #303E48;
    background-color: #CED1D3;
    display: block;
    height: 30px;
    line-height: 30px;
    width: 220px;
    font-size: 14px;
    text-align: left;
    padding-left: 10px;
    float: left;
    clear: right;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
#SCVHdimGraphic {
    width: 600px;
#SCVHdimenPict {
    margin-top: 20px;
#SCAH {
    display: block;
    width: 150px;
    margin-left: 0px;
    margin-right: 0px;
#SCbutton {
    float: left;
    width: 175px;
    clear: right;
    position: relative;
    margin-left: 25px;
#PHDuct {
    margin-top: 35px;
    float: left;
    display: block;
#PHductCaption2 {
    width: 510px;
    float: left;
    background-color: #303E48;
    height: 40px;
    color: #FFFFFF;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    line-height: 40px;
    font-size: 22px;
#brochureThumb {
    visibility: visible;
#SquareDiffSectTitle {
    width: 500px;
    height: 35px;
    text-align: left;
    color: #FFFFFF;
    margin-left: 20px;
    line-height: 35px;
#SquarePict {
    width: 225px;
    margin-bottom: 10px;
    margin-left: auto;
    margin-right: auto;
    clear: left;
#LADbutton   {
    width: 175px;
    float: left;
#brochureLink {
    visibility: visible;
#bottomContent3 {
    width: 595px;
    float: left;
    clear: left;
    margin-left: 15px;
.hide_tablet {
display: none;
.zeroMargin_tablet {
margin-left: 0;
#SCVHbutton {
    float: left;
    width: 175px;
#SCVHbuttText {
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 200;
    width: 90%;
    float: left;
    clear: right;
    text-align: left;
#SCAHbuttText {
    float: left;
    clear: right;
    width: 90%;
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 200;
    position: relative;
    text-align: left;
#SCbuttText {
    position: relative;
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 200;
    width: 90%;
    float: left;
    clear: none;
    display: block;
    text-align: left;
#SC {
    width: 150px;
    float: none;
    margin-left: 0px;
    margin-right: 0px;
#SCAHbutton {
    float: left;
    width: 175px;
    clear: right;
    position: relative;
    margin-left: 25px;
    margin-bottom: 20px;
#sqDiffPict {
    width: 190px;
    margin-top: 20px;
#LinearDiffusers {
    color: #FC6719;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    font-size: 22px;
    padding-left: 15px;
    margin-bottom: 12px;
    float: left;
    width: 100%;
#VACbutton {
    width: 175px;
    float: left;
    clear: right;
    margin-left: 25px;
#VACHbutton {
    float: left;
    width: 175px;
    clear: right;
    margin-left: 25px;
#VACbuttonText {
    float: left;
    clear: left;
    width: 90%;
    padding-left: 10px;
    text-align: left;
#LADbuttonText {
    float: left;
    clear: left;
    width: 90%;
    padding-left: 10px;
    text-align: left;
#VACHbuttonText {
    float: left;
    clear: left;
    width: 90%;
    padding-left: 10px;
    text-align: left;
#LAD {
    width: 150px;
    margin-left: 0px;
#VAC {
    width: 150px;
    margin-left: 0px;
#VACH {
    width: 150px;
    margin-left: 0px;
#linearPict {
    float: left;
    clear: right;
    margin-left: 0px;
#linearPict img {
    width: 150px;
    display: block;
#SquareDiffPict {
    color: #06A7E2;
    float: right;
    text-align: center;
    width: 25%;
#LinearDiffPict {
    margin-left: 5px;
    float: right;
    width: 25%;
#ATUsectionVideo {
    margin-top: 35px;
    width: 95%;
    float: left;
    margin-left: 40px;
#ATUVideo {
    width: 62%;
    margin-bottom: 20px;
    float: left;
    clear: right;
    margin-left: 15px;
#mainParagraphATU {
    float: left;
    width: 200px;
#PHseries {
    width: 200px;
    float: left;
    margin-left: 10%;
    clear: none;
    margin-bottom: 25px;
    margin-top: 20px;
#PHductCaption {
    float: left;
    clear: left;
    color: #FFFFFF;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 400;
    font-size: 22px;
    width: 100%;
    background-color: #303E48;
    line-height: 50px;
#PHdownloads {
    float: left;
    clear: right;
    width: 250px;
    margin-left: 30px;
    margin-top: 35px;
#PHatuSeries {
    float: right;
#PHimage {
    width: 225px;
#PHaccessText {
    margin-top: 20px;
#ATUSectTitle {
    padding-left: 40px;
#PTseries2 {
    float: right;
#PTseries {
    width: 200px;
    float: left;
    clear: right;
    margin-right: auto;
    margin-bottom: 25px;
    margin-top: 20px;
    margin-left: 35px;
#digiPicts {
    float: right;
    background-color: #E6EBEE;
#DigitalContent {
    text-align: left;
    margin-top: 20px;
    background-color: #E6EBEE;
    margin-left: 30px;
#Ductpict {
    width: 511px;
    float: left;
    display: block;
    clear: right;
#Ductpict2 {
    width: 510px;
    float: left;
#DigitalPicts {
    float: right;
#SCVHsub {
    width: 100%;
    margin-bottom: 15px;
#EdgeSVCH {
    float: right;
    margin-left: 20px;
#SVCHanimPict {
    float: left;
    width: 100%;
#SCVHchartPict {
    float: right;
    margin-left: 20px;
    width: 350px;
#SCVHbottomData {
    margin-top: 15px;
    width: 600px;
    float: left;
    clear: both;
#SCVHvideo {
    width: 100%;
#CoAnda {
    margin-top: 25px;
    border: thin solid #FFFFFF;
    float: left;
    width: 500px;
    padding-left: 15px;
#SlideShow {
    width: 100%;
    height: 455px;
    float: left;
#ProductWrapper {
    width: 600px;
    margin-left: auto;
    margin-right: auto;
    display: block;
.fluid.PromoBlocks {
    width: 180px;
    float: left;
    margin-top: 20px;
    margin-left: 15px;
    clear: none;
    display: block;
#SQdiffPict {
    display: block;
#ATUpict {
    display: block;
#DigiDiffPict {
    width: 100%;
    display: block;
/* additional media query of min 600px*/
/* Desktop Layout: 769px to a max of 1232px. Inherits styles from: Mobile Layout and Tablet Layout. */
@media only screen and (min-width:800px){
.gridContainer {
    width: 100%;
    max-width: 1920px;
    padding-left: 0;
    padding-right: 0;
    margin: auto;
    clear: none;
    float: none;
    margin-left: auto;
#top {
    float: left;
.tagline {
width: 79.3103%;
margin-left: 1.2987%;
clear: none;
#mainNav {
.menuItem {
    clear: none;
    background-size: auto 40px;
    padding-bottom: 0px;
    padding-right: 0px;
    padding-top: 0px;
#top img {
    text-align: left;
    background-repeat: no-repeat;
    float: left;
    margin-left: 10px;
#SEHCMbutton {
    float: left;
    margin-left: 35px;
    background-color: #FC6719;
    color: #FFFFFF;
    font-family: questrial;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    display: block;
    width: 62%;
#div2 {
    text-align: center;
    width: 100%;
    background-color: #FC6719;
    background-repeat: repeat-x;
    clear: both;
#SlideShow {
    width: 100%;
    height: 555px;
    float: left;
#SubHead {
    position: static;
    margin-left: auto;
    height: 45px;
    width: 100%;
    top: 586px;
    left: 0px;
    background-color: #FC6719;
#mainSubHead {
    margin-left: 0;
    clear: both;
    position: static;
    height: 45px;
    width: 100%;
    #SCVHsub {
    width: 100%;
    margin-bottom: 15px;
.fluid.SCVHsubMenuItems {
    color: #303E48;
    background-color: #CED1D3;
    display: block;
    height: 30px;
    line-height: 30px;
    font-size: 15px;
    text-align: left;
    padding-left: 15px;
    width: 250px;
    #SCVHlist a:link {
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    text-decoration: none;
#SCVHpdfList {
    float: none;
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 400;
#SCVHlist {
    height: 25px;
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    background-color: #FFFFFF;
    border-bottom-style: solid;
    border-bottom-color: #E6EBEE;
#SCVHanim   {
    float: left;
    margin-top: 35px;
    width: 511px;
#SCVHdimGraphic {
    float: right;
#SCVHdimenPict {
    margin-top: 20px;
    width: 800px;
    float: right;
#div3 {
width: 100%;
#div4 {
margin-left: 1.2987%;
clear: none;
width: 29.8701%;
#mainContent {
.content {
.contentStyle {
    width: 55%;
    margin-left: 0;
    float: left;
#mainAside {
    position: relative;
    width: 325px;
    float: left;
    clear: right;
    display: block;
    margin-left: 30px;
#mainFooter {
#footerLogo {
    margin-left: 25px;
#footerInfo {
    line-height: 30px;
    display: block;
    height: 30px;
    float: none;
    clear: none;
    text-align: left;
    width: 400px;
#asideBrochure {
    width: 325px;
    margin-left: 0;
    clear: none;
    float: left;
#asideVideo {
    width: 325px;
    margin-left: 0;
    float: left;
.mainSubHead {
    color: #FFFFFF;
    background-color: #F60;
    display: block;
    font-family: questrial;
    font-size: 30px;
    margin: auto;
    height: 40px;
    line-height: 40px;
    font-style: normal;
    font-weight: 400;
.lightLinks {
#thermalDiffLabel {
#thermDiffLabel {
    width: 280px;
    padding-top: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
#thermDiffPict {
#atuLabel {
    padding-top: 10px;
    /* [disabled]padding-right: 10px; */
    padding-bottom: 10px;
    padding-left: 10px;
    width: 280px;
#atuPict {
#digitalLabel {
    padding-top: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
    width: 280px;
#digitalPict {
    padding-bottom: 2px;
#navChoices {
#navList {
#PAnav {
    background-color: #30434D;
    display: block;
#PAchoices {
#PAList {
    display: block;
    margin-left: auto;
    margin-right: auto;
    float: left;
.PAmenuItem {
    padding-left: 10px;
    width: 150px;
    font-size: 15px;
.mainSubHead {
    color: #FFFFFF;
    display: block;
    font-family: questrial;
    font-size: 30px;
    margin: auto;
    font-style: normal;
    font-weight: 400;
#AboutUsText {
    padding-left: 15px;
    width: 92%;
#pageContent {
#asideNavArea {
#bottomContentArea {
.bottomContent {
#aboutPict {
#sectionPict {
#sideNavHolder {
#bottomContentText {
#indexContentArea {
#asideArea {
    height: 725px;
    width: 275px;
    float: left;
    clear: right;
    padding-bottom: 25px;
#mainAnim {
    width: 100%;
    display: block;
    height: 555px;
    float: left;
#bottomContent {
#sectionPhoto {
#bottomContent1 {
    float: left;
    width: 800px;
    margin-left: 15px;
#bottomContent2 {
    clear: right;
    margin-left: 20px;
    float: left;
#sectionVideo {
    margin-left: 5%;
    width: 800px;
#ThermalList {
#thermalLinks {
#ThermalLinks {
    width: 200px;
    text-align: center;
#SquareIcon {
    margin-left: auto;
    margin-right: auto;
    width: 125px;
    display: block;
    float: none;
#LinearIcon {
    margin-left: auto;
    margin-right: auto;
    display: block;
    width: 145px;
    float: none;
    clear: both;
#mainParagraph {
    color: #303E48;
    font-family: source-sans-pro;
    font-style: normal;
    font-weight: 200;
    text-align: left;
    float: none;
    clear: both;
    width: 754px;
    margin-top: 10px;
    margin-bottom: 40px;
#leftSpacer {
#ThermalVideo {
    display: block;
    float: left;
    clear: right;
    margin-top: 20px;
    width: 534px;
    margin-left: 30px;
    margin-right: auto;
#ThermalChoose {
#SquareDiffuserSection {
    display: block;
    float: left;
    clear: both;
    width: 100%;
    padding-left: 5%;
    height: 35px;
#SquareDiffText {
    width: 750px;
    float: left;
    margin-left: 5%;
    margin-bottom: 30px;
    text-align: left;
#squareDiffuserPicts {
    margin-left: 5%;
    width: 800px;
    margin-bottom: 30px;
    clear:

Too much to check through but You are using the following conditionals:
1) Standard CSS.
This is the CSS that will load at any res. If you set a style here it will load in the two conditional's below as well.
2) @media screen and (min-width:990px)
     This is telling the browser to load these styles when the screen is over 990px's wide but you have not excluded anything using max-width so any styles from 1) will be carried over. You could try overwriting them with      !important but its messy and would make more sense to extract the styles from 1)
3) @media screen and (min-width:1100px)
     This is telling the browser to load these styles when the screen is over 1100px but like 2) you are not ignoring anything under this width so it will pick up your base styles as well as your conditional styles from 2)

ORACLE 8I EXPORT의 QUERY OPTION 기능

제품 : ORACLE SERVER
작성날짜 : 2000-09-19
Oracle 8i EXPORT의 Query Option 기능
====================================
Oracle 8i에서는 export 작업 수행 시 Query Option을 이용하여 테이블의
부분적인 추출이 가능하다.
SQL> select empno, ename, job, sal from emp order by job;
EMPNO ENAME JOB SAL
7788 SCOTT ANALYST 3000
7902 FORD ANALYST 3000
9999 홍길동 ANALYST 2000
7369 SMITH CLERK 800
7876 ADAMS CLERK 1100
7934 MILLER CLERK 1300
7900 JAMES CLERK 950
7566 JONES MANAGER 2975
7782 CLARK MANAGER 2450
7698 BLAKE MANAGER 2850
7839 KING PRESIDENT 5000
7499 ALLEN SALESMAN 1600
7654 MARTIN SALESMAN 1250
7844 TURNER SALESMAN 1500
7521 WARD SALESMAN 1250
위와 같이 구성된 EMP 테이블에서 만일 'MANAGER'로 JOB을 가진 사원중 SAL
컬럼이 2500이상인 레코드를 export하고 싶다면, 다음과 같이 수행하면 된다.
% exp scott/tiger tables=emp query=\"where job=\'MANAGER\' and sal\>=2500\"
Export: Release 8.1.5.0.1 - Production on Tue Sep 19 16:14:15 2000
About to export specified tables via Conventional Path ...
. . exporting table EMP 2 rows
exported
Export terminated successfully without warnings.
한글 컬럼에 대해서도 동일한 where 조건에 지정이 가능하다.
% exp scott/tiger tables=emp query=\"where ename like \'홍%\'\"
V8.1.5 버젼에서 제공되는 Query 옵션의 특징:
1. 테이블 레벨의 export 명령어에서만 가능하다.
2. Direct 옵션과 함께 사용될 수 없다.
3. Nested 테이블을 갖는 테이블에는 적용할 수 없다.
4. Partition 테이블에 대한 export에도 적용가능하다.
5. Import 명령에는 적용되지 않는다.

Thanks Guys,
I am still a bit lost though...
It may be simply a matter of me finding Oracle 8i so I can do what I need to do.
Where can I get Orcale 8i from? Does anybody have it? The oracle site only has a version back to 9.2 I queried with a employee from Oracle University here in Australia, and he suggested asking in the forums.
Just so you know what I'm trying to do:
Data Server:
Running Aix with Oracle 7.14... actually could be 7.41 - I'll check today.
This system will not be upgraded to any later version of Orcale, because systems are in place, and core systems at our other sites have to be the same. (my project is a local one)
Web Server:
Running XP profession with IIS and using ASP (active server pages)
Currently running Oracle 10g, and ASP code connects to the local database on this machine via an ODBC connection.
At the moment, I have scripts on the Aix server that dumps data from Oracle 7.x into a .csv file.
Then, I have scripts that copy those csv files to the XP server, and they are imported to the local Oracle 10g database.
To display this data on the website, I use ASP via the odbc connection to query the local database on the XP server.
As said in my previous post, there must be an easier way to do this.
I need a local database on the XP server too, and am thinking the best way is to downgrade to 8i.
Can anybody tell me where I can get 8i to try this out? I have been trying to reasearch this for a while now without luck. Any help would be appreciated, and thanks for those who have replied so far.
-Tom

Cf8/9 - Best method for a site wide pop-up?

I'm curious what developers here use for a site wide pop-up? cfwindow looks like a good option because of the the modal option. I'm looking to pass in a few values to the pop-up window and call it from anywhere in my site. Does anyone have any examples of how they've implemented something like this?

Sounds no different than site wide images, stylesheets, function libraries, or other such things. Create a folder in the web root and put the template there. Then use absolute addressing when calling it.

ANN: Site-Wide Management in Dreamweaver Tutorial Series

http://www.projectseven.com/products/menusystems/pmm3/tutorials/site-wide/
Dreamweaver Templates, Library Items and Server-Side Includes allow you to manage repeating sections of your web pages in a central file. This series of tutorials listed below will help you to deploy your Pop Menu Magic 3 menu using any of these methods. They will also serve as a general foundation in understanding the most popular site-wide techniques deployable in a Dreamweaver-managed site.
The tutorials are relevant for Dreamweaver versions MX2004 up to and including Dreamweaver Creative Cloud.
Al Sparber - PVII
Responsive Dreamweaver Menus | Galleries | Widgets
Since 1998

Unfortuantely sourcelabs.com does not give the option of testing IE11 on windows 7 so I cant be of much help here.
One thing you might want to try is floating the <li> tags - add the below to your css stylesheet.
li {
float: left;
margin: 0;
padding: 0;
list-style: none;
width: 20%;
David Powers is pretty good when it comes to his tutorials and they are usually thoroughly tested. As I say in a simulated windows 8.1 envrionment in IE11 the nav looks fine BUT of course its better to test in the real thing.
EDITED: Try the below combination of css if you have no success finding a solution:
#mainnav ul {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
#mainnav li {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
    float: left;
    width: 20%;
     background-color: #4D4D4D;
     text-align: center;
#mainnav a {
    display: block;
    width: 100%;
    background-color: #4D4D4D;
    color: #FFFFFF;
    text-transform: uppercase;
    padding-top: 6px;
    padding-bottom: 6px;

Media query

Hi everyone
I m having a little program with a website which I m putting together. The site is at this url address. http://www.dreamaustraliastudytours.com.au/Test/index102/index.html. '
So far I have built up the following media query: @media only screen and (max-width:320px). The problem I m struggling to remedy is when I view the site on my iphone 5 the width does beyond the container.
body {
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
font-size: 13px;
.wrapper {
width: 100%;
max-width: 320px;
Any thoughts what I'm missing???
Also is there a way to hide the body background image when the site is being viewed in a mob phone or tablet device???
Thank you in advcance

At and below a width of 320px, the style rules within the media query function as they should, i.e. the menu-bar stacks as in
At widths greater than 320px, the rest of the style rules kick in. This is what you are seeing on your iPhone because the iPhone has a width greater than 320px. That the menu-bar is squashed is because of the lack of real-estate in smaller screens.
If you do not wish to use a framework like bootstrap, may I suggest that you start your layout off with the iPhone in mind, that is for mobile devices and consequently use media queries to cater for larger screen sizes. I think that you will find that this is a lot easier that the way that you have gone about it, desktop first.

Media query is affecting tablet as well as phone

HI,
I'm on DW CS6 on an iMac intel. I am (with trepidation) using media query to style my content for a mobile phone device. The basic issue is that even though I am setting media query to have an 800px max screen (see mobile.css),the css is also affecting my ipad rendering of the site as well.
Is there a way to counter this?
http://www.frankbright.com/mobile.css
To give some context, I am scaling my regular site so that it also appears ok on an ipad as is. I know this can work because I used to use fixed css containers of (780 px width) and with no media query, the ipad adjusted the size quite well on its own. And I am close to doing that here anyways through compromises etc.
I am somewhat familiar with fluid grid layouts and I've even taken an online course on them, but that will take some time to set up so this is hopefully a current solution (I hope !).
Also, I tried to re-style the navigation to simply use a background color on the hover (and no image) and I even set the css like this -- #navcontainer img {display:none;} This didn't seem to work for whatever reason.
I appreciate any help or tips anyone could offer.
Many Thanks,
Frank B.

David_Powers wrote:
In my experience, even when you use orientation in a media query for the iPad and iPhone, the page still zooms when you switch from portrait to landscape, and you have to tap the page to rescale it. However, I notice that doesn't happen with your sample page.
Is that because you're running JavaScript to create equal height columns, or does the secret lie in the empty script immediately inside the body? Or is it because you're just supremely brilliant?
No. It's because we spent 3 months researching the various articles on responsive design and managed to reinvent the technique to our standards
The key is to use the right media queries (a combinnation of device independent and device dependent) along with exceptions for various devices and orientations. The zoom factor is equalized not through script but by use of a specific viewport meta tag. Using the tag makes pixel density irrelevant for the most part.

Error message: (translated from Dutch) "Cannot find corresponding style page for media query"

Error message: (translated from Dutch) "Cannot find corresponding style page for media query"(see image)
I cannot find what is wrong with this page: steun sesem
This message does not appear on the other pages of this site..
What do I wrong??
Thanks in advance!
Martien

There are two things that are probably causing this error.
Line 22 in your HTML looks like this:
</style><!--[if lt IE 9]>
You need to remove the closing style tag:
</style><!--[if lt IE 9]>
Also in sesem.css, there's a missing closing brace on line 486:
.footer {
font-size: 1.1em;
line-height: 1.4em;
color: #878787;
text-align: center;
} // <---- Missing closing brace
/* Desktop Layout: 769px to a max of 1232px. Inherits styles from: Mobile Layout and Tablet Layout. */
There are other problems in your CSS, but fixing those two items should put you back on the right track.

Site-wide Error Handler issue

I'm having a strange one. I'm using CF 9.0, and I have a Site-wide Error Handler set up, with the relative path set correctly.When run-time errors occur, it is calling the template exactly as expected, except for one thing.
In addition to the error template (which shows a nice user-friendly page), I am also getting the default ColdFusion error information following.
So...error occurs, it is throwing to the error template as expected, but then also pushing out the default error page.
It does not do this on CF7 with identical code, so I am thinking that perhaps there is a setting on CF9 Administator that I'm not clicking. But search as I might, I only see the Site-wide Error Handler field.
Any suggestions? This is driving me batty.

ianskinner wrote:
What do you get if you turn on "Robust Exception Information"?
You are presuming that since your test error is a DSN error and this extra message is about a DSN error, that they are the same error. That is an unproven correlation. Or at least you have not show us the proof.
Robust Exception Information is enabled on the Cold Fusion Administrator. I don't know why it wasn't showing earlier, but now when I run the test page I get the following:
The web site you are accessing has experienced an unexpected error.
Please contact the website administrator.
The following information is meant for the website developer for debugging purposes.
Error Occurred While Processing Request
Datasource doesNotExist could not be found.
The error occurred in \\srv238\wwwroot\rjr\errorhandling\cferror_test.cfm: line 11
9 : This query calls a non-existent datasource, triggering an error to be handled. --->
10 :
11 : <cfquery name="testQuery" datasource="doesNotExist">
12 : select * from nothing
13 : </cfquery>
DATASOURCE
doesNotExist
Resources: Check the ColdFusion documentation to verify that you are using the correct syntax.
Search the Knowledge Base to find a solution to your problem.
Browser
Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; GTB6.3; .NET CLR 1.1.4322; InfoPath.2; .NET CLR 2.0.50727; .NET CLR 3.0.04506.30; .NET CLR 3.0.04506.648; .NET CLR 3.5.21022; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; MS-RTC EA 2)
Remote Address
172.21.10.142
Referrer
Date/Time
30-Dec-09 01:21 PM
Stack Trace (click to expand)

Supported OData Query Options

Hi all,
OData supports query options like $filter=cityfrom eq 'SINGAPORE' or $select=...
(A full list can be found [here|http://www.odata.org/media/16352/%5Bms-odata%5D.pdf])
1) Which options are supported by Gateway?
2) What is the "Gateway Solution" to filter the result of the GetList/Query command for a specific entity?
(e.g. return all flights with city of departure equal to 'Singapore')
Best Regards,
Florian

Hi Ron Sargeant
Problem is when i apply filter and data has a Slash ("\") for e.g company\ali.naveed
its give me error.
http://192.168.59.229:8080/gateway/odata/sap/EmployeeDataList;v=1/Employee?$filter= DomainAndUsername eq 'company\ali.naveed'
if i query without Slash ("\") for example in email its working.
/Employee?$filter= Email eq '[email protected]'
what is process to fetch data which contain a slash("\")?
Regard
Ali

Site Wide Media Query option is ghosted

Similar Messages

Maybe you are looking for