/* CSS reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;
}
html,body {
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img { 
	border:0;
}
input{
	border:1px solid #b0b0b0;
	padding:3px 5px 4px;
	color:#979797;
	width:190px;
}
address,caption,cite,code,dfn,th,var {
	font-style:normal;
	font-weight:normal;
}
ol,ul {
	list-style:none;
}
caption,th {
	text-align:left;
}
h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}
q:before,q:after {
	content:'';
}
abbr,acronym { border:0;}

body{
margin: 0;
padding: 0;
border: 0;
overflow: hidden;
height: 100%;
max-height: 100%;  
font-family: 'Open Sans', 'Arial', 'verdana', sans-serif;
font-weight:400;
background:transparent;
color: #000;
font-size: 12px;
cursor:url("../css/callnow.cur"), pointer;}




#framecontent{
position: absolute;
top: 0;
left: 0;
width: 100%;/*Width of left frame div*/
height: 160px;
overflow: hidden;/*Disable scrollbars. Set to "scroll" to enable*/
background: white url(../images/header-bgg.png)0 0 repeat-x;
}


#maincontent{
position: fixed;
left: 0px;
top: 160px;
right: 0;
bottom: 0;
overflow:auto;
background: #fff url(../images/lines.jpg)0 0 repeat;
width:100%;
height:100%;}
#maincontent h1, #maincontent h2{
position: relative;
top:0px;
left: 0px;
margin: 20px 0 20px;
right: 0;
 background: #fff;
height:48px;
line-height:48px;
width:100%;
border-top:1px dotted #ccc;border-bottom:1px dotted #ccc;
text-indent: 30px;
font-size: 22px;
} 
#maincontent h2{font-size: 20px;text-indent: 50px;
position: relative;
top:0px;
left: 30px;
margin: 20px 0 20px;
right: 0;
 background: #fff;
height:48px;
line-height:48px;
width:1100px;
border:1px dotted #ccc;
text-indent:20px;
font-size: 22px;
} 
* html body{/*IE6 hack*/
padding: 160px 0 0 32px;/*Set value to (HeightOfTopFrameDiv 0 0 WidthOfLeftFrameDiv)*/
}

* html #maincontent{/*IE6 hack*/
height: 100%;
width: 100%;}
h1, h2, h3,h4,h5,h6{font-family: 'Oswald','Open Sans Condensed', 'Arial Narrow', arial,verdana, trebuchet,sans-serif;}




/* If an image is wrapped in a link */
.nivoSlider a.nivo-imageLink {
  position: absolute;
  top: 180px;
  left: 0px;
  width:690px;
  height: 264px;
  border: 0px solid green;
  padding: 12px 12px 4px 12px;
  margin: 0px;
  z-index: 60;
  display: none;
}
/* The slices in the Slider */

.nivo-slice {
  display: block;
  position: absolute;
  top:0px;
  z-index: 50;
  height: 264px;
}
/* Caption styles */

.nivo-caption {
  position: absolute;
  left: 10px;
  bottom: 0px;
  background: #000;
  color: #fff;
  width: 690px;
  z-index: 89;
}

.nivo-caption p {
  padding: 5px;
  margin: 0;
}

.nivo-caption a {
  display:inline !important;
}

.nivo-html-caption {
  display: none;
}
/* Direction nav styles (e.g. Next & Prev) */

.nivo-directionNav a {
  position: absolute;
  top: 300px;
  z-index: 99;
  cursor: pointer;
  
}

.nivo-prevNav {
  left: 0px;
}

.nivo-nextNav {
  right: 20px;
}
/* Control nav styles (e.g. 1,2,3...) */

.nivo-controlNav a {
  position: relative;
  z-index: 99;
  cursor: pointer;
}

.nivo-controlNav a.active {
  font-weight: bold;
}

.nivoSlider {
  position: relative;
  top:15px;
  left:15px;
  background: white url(../images/1b-sandiegowebstudiologo1.png) 0 0 no-repeat;
  width: 714px;
  height: 288px;
}

.nivoSlider a {
  border: 0;
}



#slider .nivo-controlNav {
  position: absolute;
  left: 0px;
  bottom: -20px;
}

#slider .nivo-controlNav a {
  display: block;
  width: 10px;
  height: 10px;
  text-indent: -9999px;
  border: 0;
  margin-right: 3px;
  float: left;
}

#slider .nivo-controlNav a.active {
  background-position: -10px 0;
}

.nivoSlider img {
  position: absolute;
  top: 202px;
  left: 46px; 
  display: none;background:white;
}



 
.fm{
  float: right;
  position: absolute;
  top: 0px;
  right: 60px;
}

#mega-wrap {position: absolute;top:100px;margin: 0 ;width:100%;  font-family:'Open Sans',  arial, verdana, sans-serif;color:black;}


ul#mega-menu {position: relative;
margin: 5px 0 0 30px;
padding:0;width:100%;color:#111;  font-family:  'Open Sans', arial, verdana, sans-serif;
}

ul#mega-menu > li {float: left;list-style-type: none;
z-index: 50;font-size: 11px;	text-transform: uppercase;background: url(../images/hbv.png) repeat-y left 0;line-height: 32px;padding-left: 14px;padding-right: 7px;}

#mega-menu > li > a {
display: block;
text-decoration: none;
padding: 9px 10px 7px;
color: #111;
height: inherit;
}
ul#mega-menu  li#lstc {
float: left;
list-style-type: none;
z-index: 50;font-size: 11px;	text-transform: uppercase; line-height: 34px;padding-left: 4px;padding-right: 21px;height: 32px;padding-top:0px;background:transparent; }

ul#mega-menu  li#lstc  em{font-size: 14px;	color:#000;}
ul#mega-menu  li a#lstcr{
float: right;
list-style-type: none;
z-index: 50;font-size: 11px;	text-transform: uppercase;background: url(../images/fm.png)right 12px no-repeat ;line-height: 34px;padding-left: 41px;padding-right: 41px;text-align: right;
}

ul#mega-menu  li#hctext{display:inline;}

ul#mega-menu  li#resourcesm{display:inline;}


ul#mega-menu  li#hcpic a#handmade{
 
list-style-type: none;
 background:transparent url(../images/1sdws-handcoded1x.png)12px 0px no-repeat ; padding: 11px; width:57px;height:36px;
}

ul#mega-menu  li a#handmade1{ 
list-style-type: none;
background:transparent; padding:0px 1px; width:57px;height:34px;font-family: 'Euphoria Script', cursive;color: #003333; 
}


ul#mega-menu > li.drop-item > a span  {  font-family:'Open Sans', arial, verdana, sans-serif;font-size:11px;}


#mega-menu li:hover div {left: 0;}

#mega-menu > li:hover > a {color: #003333;  font-family:'Open Sans', arial, verdana, sans-serif;}
 
div.drop {
position: absolute;
top:50px;
background-color: #FFFFFF;
left: -9999px;
padding: 10px 0;
z-index: 500;
-webkit-box-shadow: 0 5px 5px rgba(0,0,0,.35);
-moz-box-shadow: 0 5px 5px rgba(0,0,0,.35);
box-shadow: 0 5px 5px rgba(0,0,0,.35);
border: 1px solid #DDDDDD;
width: auto;
margin-left:0px;border-top:1px dotted #ccc;
}

div.drop-content {
overflow: hidden;
display: block;
padding: 0;
}

div.divider-line {
display: block;
clear: both;
height: 1px;
width: 180px;
background-color: #DDDDDD;
margin: 3px 0;
}
div.divider-line2 {
display: block;
clear: both;
height: 1px;
width: 180px;
background-color: #DDDDDD;
margin: 28px 0 3px; position:relative;top:24px;
}
div.divider-line3 {
display: block;
clear: both;
height: 1px;
width: 180px;
background-color: #DDDDDD;
margin: 38px 0 12px; position:relative;top:24px;
}
div.divider-line4 {
display: block;
clear: both;
height: 1px;
width: 180px;
background-color: #ddd;
margin: 28px 0 28px; position:relative;top:29px;
}

ul#mmc{
width:1190px;
margin-bottom:10px;
overflow:hidden;
padding-left:40px;
}
li.mmcb{
float:left;
display:inline;width:193px;
}

#quad li	{ width:800px; }

dl {
width:190px;
float:left;
margin:0 20px -5px 0;
}

dt{
font-weight:bold;
font-size:11px;
margin-bottom:-11px;
}

dd{
color:#444;
font-size:11px;
margin:0;
padding-left:10px;
line-height:14px;
background:url('../images/amm.gif') 0 5px no-repeat;
}




.drop dd a, .drop dd a:visited{
color:#000;font-size:11px;margin:0;padding-left:10px;line-height:14px;
}
.drop dd a:hover{color: #00657e;}
.drop a, .drop a:visited{color:#111;}
.drop-content h2, .drop-content h2 a, .drop-content h2 a:visited, .drop-content h2.sec, .drop-content h2.sec a, .drop-content h2.sec a:visited{ color:#CC3300;  font-size: 12px;margin:0;text-transform: uppercase; clear: both;font-weight:400;}
.drop-content h2 a:hover, .drop-content h2.sec a:hover{   color: #00657e; text-decoration: none;text-transform: none;}

.drop-content h2.sec, .drop-content h2.sec a, .drop-content h2.sec a:visited{margin-top:23px;}
.drop-content h2.sec a:hover{margin-top:12px;}
#navcontainer1 {
text-align: right;
padding-top: 6px;
margin-right: 9px;
background: #fff;
}

#navcontainer1 li {
display: inline;
}

#navcontainer1 li a, #navcontainer1 li a:visited {
padding: 18px 8px 6px;
margin-left: 3px;
background: #111;
color: #fff;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
font-size: 15px;
text-decoration: none;
letter-spacing: -1px;
text-transform: uppercase;
}

#navcontainer1 li a:hover {
background: #444;
color: #fff;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
#header{
margin: 0 0 0 30px;
padding: 0;
height: 60px;
width: 100%;
background: #fff;
}

#header h1, #header h1 a:link, #header h1 a,#header h1 a:visited{
font-weight: normal;
font-size: 28px;
text-transform: uppercase;
letter-spacing: -2px;
word-spacing: 5px;
float: left;
color: #333;
display: block;
margin-top: -7px;
font-family: 'Oswald','Open Sans', 'Arial', 'Verdana', sans-serif;
text-decoration: none;
}

#header h1 a:hover{
color: #00657e;
}

h2#sgn{
font-weight:500;
font-size: 15px;
text-transform: uppercase;
color: #555;

display: block;
float: left;
position: absolute;
left: 30px;
top:50px;
text-align: left;
font-family: 'Open Sans Condensed', sans-serif;
}


#badgehm {
float: left;
width: 55px;
height: 63px;background:url(../images/html5bh.png)
0px 0px no-repeat;  position: absolute;
left: 386px;
top:   19px;
}
#badgehc {
float: left;
width: 55px;
height: 63px;background:url(../images/cssbh.png)
0px 0px no-repeat;  position: absolute;
left:456px;
top:   19px;
}
#wrapbq{
position: relative;
top: 16px;
left: 104px;
float: left;
}
#boutique {
text-align: left;
position: absolute; 
left:30px;
top: 70px;
float: left;
font: 500 15px/21px Arial, sans-serif;
}

.s2011 sub {
color: #00657e;
display: inline-block;
font: 500 11px/11px Arial, sans-serif;
left: 0px;
letter-spacing: -1px;
margin: 0px 0 0px 47px;
position: relative;
text-align: left;
top: -3px;
}
.s2011 sub span.gry {
color: #d50000;
margin-left: 5px;
}
.s2011 sub span.grn {
color: green;
margin-left: 12px;
}

#subheader{
margin: 0 auto;
padding: 0px 0px 26px 0px;
position: relative;
top: 102px;
min-height: 34px;
height: 34px;
width: 99.99%;
}






#sfooter {
background: none repeat scroll 0 0 #fff;
border: 1px solid rgba(0, 0, 0, 0.3);
bottom: 0px;
font-family: Arial, Helvetica, sans-serif;
height: 40px;
margin: 0px;
padding: 0 10px;
position: fixed;
width: 100%;z-index:2222;
}
#sfooter:hover {
background: none repeat scroll 0 0 #f8f8f8;
}
#sfooter {
-moz-box-shadow:0px 0px 11px #191919;
-webkit-box-shadow:0px 0px 11px #191919;
box-shadow:0px 0px 11px #191919;
}
#footer_menu {
margin: 0 0 0 30px;
padding: 0;
width:auto;
}
#footer_menu li {
list-style: none;
float: left;
font-size:11px;
padding: 12px 14px 14px 14px;
border-right:1px solid rgba(0, 0, 0, 0.4);
background: #fff;
}

#footer_menu li:hover {
background:#f8f8f8;}

#footer_menu li a, #footer_menu li a:link,#footer_menu li a:visited {
display: block;
color: #000;
text-decoration: none;
}
#footer_menu li a:hover {
color: #222;font-style: italic;
}
#footer_menu li span {
display:none;
}
#sfooter #ficons {
float:right; /* social icons positions */
width:auto;
margin:5px 65px 0px;
padding:0px;
overflow:hidden;
}
#sfooter #ficons li {
margin-right:12px; /* 12px is the space between each one of them */
float:left;
width:24px;
padding:0px;
height:32px;
list-style:none;
_margin-right:0px; /* this is for IE6 only */
}
#roundtotopr {background:transparent;	width: 69px ;height:69px;margin:0;position:absolute; top:425px;right:127px; position:fixed;}
#roundtotopr a, #roundtotopr a:link, #roundtotopr a:visited{position:fixed;background:transparent url(../images/sandiegowebstudio-totop.png)no-repeat;	width: 69px ;height:69px;margin:0;}
#roundtotopr a:hover{position:fixed;background:transparent url(../images/sandiegowebstudio-totop-roundhover.png)no-repeat;	width: 69px ;height:69px;margin:0;}



#frfp {background:transparent;	width: 27px ;height:222px;margin:0;position:absolute; bottom:0px;left:6px; position:fixed;z-index:2223;}
#frfp a, #frfp a:link, #frfp a:visited{position:fixed;background:transparent url(../images/rfp.png)left 22px no-repeat;	width: 27px ;height:220px;margin:0;}
#frfp a:hover{position:fixed;background:transparent url(../images/rfph.png)left 17px no-repeat;	width: 27px ;height:230px;margin:0;}

a, a:visited{	text-decoration:none;}
.clear {clear: both;}
.clear {clear: both;}
.arrowhere{color:#009999;}
em {color: #800000; }
.clr{clear: both;}

.lc{text-transform: lowercase;}
.cc{text-transform: capitalize;}
.uc{text-transform: uppercase;}

a img {border: 0;}
 
 
 
 

 
.w240  h2, h2.w240{width: 340px; float:left;clear:both;margin:0 0 20px;background:white;border:1px dotted #ccc; font-size:20px;line-height:44px;height:44px;position:relative;top:-20px;text-indent: 20px;text-align:left;}

 


/* --- Typography --- */

.grida p {
  line-height: 19px;
  font-size: 12px;
  font-family: Verdana, Geneva, sans-serif;
  padding:20px;
  	text-align: justify;
}

.grida h1 {
  line-height: 48px;
  font-size:20px;
  font-family: Verdana, Geneva, sans-serif;
}

.grida h2 {
  line-height: 44px;height:44px;
  font-size: 18px;
font-family: 'Abel', sans-serif;text-transform: uppercase;text-indent: -20px;font-weight:500;text-align:left;

}

.grida h3, h3.grida {width: 340px; float:left;clear:both;margin:0 0 20px 20px;background:white;border:1px dotted #ccc; font-size:20px;line-height:44px;height:44px;text-indent: 20px;text-align:left;
}

.grida h4 {
  line-height: 32px;
  font-size: 16px;
  font-family: Verdana, Geneva, sans-serif;
}

.grida h5 {
  line-height: 32px;
  font-size: 16px;
  font-family: Verdana, Geneva, sans-serif;
}

.grida h6 {
  line-height: 32px;
  font-size: 16px;
  font-family: Verdana, Geneva, sans-serif;
}

.grida {
  width: 1160px;
  margin: 0 0 20px 30px;background:transparent;
}

.grida-m1 {
  float: left;
  width: 20px;
  height: 1px;
}

.grida-c1 {
  float: left;
  width: 720px;
  background:white;border:1px dotted #ccc;
  padding:10px;
  
}
.grida-c1p {
  float: left;
  width: 690px;
  background:white;border:1px dotted #ccc;
  padding:20px;
  height:274px;
}
.grida-c1pb {
  float: left;
  width: 690px;
  background:white;border:1px dotted #ccc;
  padding:20px;
  height:274px;
  margin-bottom:20px;
}
.grida-c1bl {
  float: left;
  width: 690px;
  background:white;border:1px dotted #ccc;
  padding:0px 20px 20px;
  margin-top:20px;margin-left:30px;height:38px;line-height:38px;font-size:14px;
}
.grida-c1b {
  float: left;
  width: 690px;
  background:white;border:1px dotted #ccc;
  padding:0px 20px 20px;
  margin-top:20px;margin-left:-20px;height:38px;line-height:38px;font-size:14px; 
}

.grida-c1b a, .grida-c1b a:link, .grida-c1b a:visited, .grida-c1bl a, .grida-c1bl a:link, .grida-c1bl a:visited {
font-size:14px;color: #00657e;
}
.grida-c1b a:hover, .grida-c1bl a:hover{
font-size:14px;color: #900000;
}
.grida-m2 {
  float: left;
  width: 30px;
  height: 1px;
}

.grida-c2 {
  float: left;
  width: 340px;
  margin-top:-20px;
}
.grida-c2 h3, h3.grida-c2 {
  float: left;
  width: 340px;
  margin-top:20px;
  text-align:left;margin-left:0px;
}
.grida-c3 {
  float: left;
  width: 340px;
   background:white;border:1px dotted #ccc;
   height:325px;
}
.grida-c3x {
  float: left;
  width: 340px;
   background:white;border:1px dotted #ccc;
   height:345px;
}
.grida-h2b{margin:20px 0 0 0;width:690px;}
 
.grida-c1bt {
  float: left;
  width: 660px;
  background:transparent;border:0px dotted #ccc;
  padding:0px 20px 20px;
  margin-top:20px;margin-left: 0px;height:38px;line-height:38px;font-size:14px; 
}

 

/*
playback timings (ms):
  exclusion.robots: 0.171
  CDXLines.iter: 16.572 (3)
  captures_list: 82.431
  esindex: 0.026
  load_resource: 2172.478
  RedisCDXSource: 6.057
  LoadShardBlock: 55.991 (3)
  PetaboxLoader3.datanode: 651.579 (4)
  PetaboxLoader3.resolve: 1571.116
  exclusion.robots.policy: 0.159
*/