/* Jeff Robinson Digital Media - responsive design */

/* containers */
html { }
body { height:100%; width:100%; margin:0px; padding:0px; background:rgb(245,245,245); }
#divOuterContainer { max-width:1000px; position:relative; margin-left:auto; margin-right:auto; background:white;  border-left:1px solid rgb(230,230,230); border-right:1px solid rgb(230,230,230); }
#divPage { padding:0%; vertical-align:top; text-align:left; font-size:0.95em; line-height:120%; font-family:arial, verdana, sans-serif; color:white;  }

/* general settings */
img { display:block; position:relative; top:0px; left:0px; border:0px; }
a { text-decoration:none; color:black}
a:hover { text-decoration:underline; }
div { position:relative; top:0px; left:0px; }
p { position:relative; top:0px; left:0px; }
h1 { position:relative; top:0px; left:0px; margin-top:0px; font-size:20px; }
h2 { position:relative; top:0px; left:0px; margin-top:0px; font-size:16px; }
h3 { position:relative; top:0px; left:0px; margin-top:0px; font-size:14px; }
h4 { position:relative; top:0px; left:0px; margin-top:0px; font-size:11px; }
ul { list-style-type:square; position:relative; padding-left:4%; }
li { width:88%; }
.nowrap { white-space: nowrap; }

/* div size & positions */
#divMasthead { width:100%; /* background-image:url("./graphics/masthead_background.jpg"); */ }
#divFooter { width:100%; /* background-image:url("./graphics/footer_background.jpg"); */ }
#divIntro { border-top:1px solid white;}
#divMarketing, #divDigital { margin-top:1px; }
#divIntro { width:100%; padding:2% 0% 2% 0% }
#divIntro p{ width:90%; left:5%; }
#divServices, #divFooter { margin-top:1px; }
#divWebsites, #divVideo { position:relative; top:0px; left:0; }
#divServices ul { line-height:150%; }
/* #divServices li { display:block; text-align:left; padding:0px; } */
#divServices p, #divServices ul { top:10px; left:20px; }
#divIntroImages { }

/* positional classes */
.introImage2 { position:relative; top:0px; left:0px }
.divFPServices { min-height:200px; width:100%; }
.divFPServicesHeader { height:35px; width:100%; padding:25px 0px 0px 0px; } 
.mastheadBackground { width:100%; }
.footerBackground { position:relative; top:0px; left: 0px; width:100%; }
.footerContact { position:absolute; top:0px; left:5%; width:300px }

/* colour styles */
#divIntro { background-color:rgb(50,50,50) }
.divFPServices { background-color:rgb(120,125,130); padding:0px 0px 25px 0px}
.divFPServicesHeader { background-color:rgb(50,50,50); border-bottom:1px solid rgb(180,180,180); }


/* text styles */
#divIntro p { line-height:150%; }
.FPServicesHeader, .divFooterHeading { position:relative; left:5%; }
.divFPServicesHeader { font-size:1.5em; line-height:20px  }
.footerText { right:10px; }
.introImages { width:100%; }

/* the following changes text sizes */

@media screen and (min-width:300px) {
#divPage { font-size:0.75em; }
.footerContact { position:absolute; top:0px; left:5%; width:200px }
}

@media screen and (min-width:400px) {
#divPage { font-size:0.85em; }

}

@media screen and (min-width:650px) {
#divPage { font-size:0.95em; }
.footerContact { position:absolute; top:0px; left:5%; width:300px }
}