/**
 * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
 * http://cssreset.com
 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
	
}












/**MY AREA**/


/**basic**/

html, body { background:#333333;  }
u { text-decoration: underline;} 
h1 {color:gray; text-align:center; font-size:44px; padding: 20px 0px 20px 0px; font-family: 'Quicksand', sans-serif;}
h2 {color:red; text-align:left; font-size:28px; margin:5px 0px; font-family: 'Quicksand', sans-serif; }
h3 {color:gray; text-align:left; font-size:20px; margin:5px 0px; font-family: 'Quicksand', sans-serif; }




p  {color:gray; text-align:left; font-size:22px; padding: 10px 10px 10px 0px; }
a:visited {color:white;}
a:link {color:#999999;}
a:hover {color:gray;   }

hr {border: 1px #999999 solid; margin:40px 0px;}
div.clear { clear: both; }


.centerimg {display:block; margin-left:auto; margin-right:auto;}


.highlight { color:red; }
.centertext {text-align:center;}

.floatright {float:right; clear:right; margin:0px 0px 30px 30px; }

.floatleft  {float:left; clear: right;  padding:0px 30px;}

.red {color:red; }

.inline {display:inline;}


/**index**/

.bg  {  z-index:10; position:fixed; width: 100%; height: 100%; position: absolute; top: 0px; left: 0; }


#index  { max-width:900px; background-color:transparent;   margin-left:100px;  padding:70px 0px 0px 0px; z-index:998;   }
#index img { padding:50px 0px 0px 0px;}








/**content**/

#accounts  { max-width:1250px; background-color:transparent;    margin-left:auto; margin-right:auto;   padding:90px 130px; z-index:990;  overflow: auto; }
#accounts form {display:inline; padding: 5px 5px 150px 5px; }
#accounts a:link {text-align:left;   display:block; }
#accounts ul li {padding:30px 0px; display:block;   text-align:left; font-size:24px; margin:5px 0px; font-family: 'Quicksand', sans-serif;  }
#accounts img {padding: 80px 0px 0px 0px;   display:block;  max-width:100%; height:auto;}
#accounts p {max-width:1000px; margin-top:5px; }
#accounts ul li iframe {padding:70px 0px 0px 0px;}
#accounts h1 {margin:60px 0px;}
#accounts p a:link {display:inline;}

#accounts2  { max-width:1800px; background-color:transparent;    margin-left:auto; margin-right:auto;   padding:90px 130px; z-index:990;  overflow: auto; }
#accounts2 ul li { display:inline-block;   margin:10px 10px;  padding:10px;  width:20%; height:auto;  text-align:left;          }
#accounts2 ul li a { display:block;  font-size:30px; margin:5px 0px; font-family: 'Quicksand', sans-serif;                 }
#accounts2 img { width:100%; height:auto;  }
#accounts2 div {text-align:center; }

#wrapper  {max-width:1200px; background-color:transparent;    margin-left:auto; margin-right:auto;   padding:90px 110px;  z-index:990;  overflow: auto;  }
#wrapper p {max-width:900px;}
#wrapper img {max-width:100%; height:auto;}
#wrapper .tutorialimg img{max-width:500px;  }



.section {margin-top:100px;  }


.ads a{font-size:24px; text-decoration:none; }
.ads ul li {display:inline; padding:10px 10px;}
.ads img {width:60px;}
.ads ul { margin:5px 0px; width:auto; padding:10px 0px; border-bottom: 1px gray solid; width:850px; }



ul.circle {list-style-type:disc;  font-size:24px; color:gray; padding: 10px 30px; }
.imageexpand {width:100%; height:auto; margin-right:auto; margin-left:auto; display:block; }
#buy {padding:120px 0px 0px 0px;  }

.floatwrapper {  padding:20px 15px; display:inline;   }

.box1 {padding:10px 10px; border: 2px red solid;  margin:5px 20px;}
.box2 {padding:20px 15px; border: 5px grey solid; margin:5px 20px; }
.box2 img {display:inline;}

.gumdiv { width:450px;  height:450px; }
.gumdivsa { width:500px;  }


.linethrough {text-decoration:line-through; }


.dvdpp  {display:inline-block; padding:5px 15px; width:auto; }
.dvdpp form {display:inline; padding:5px 15px;}
.dvdpp h2 {display:inline; font-size:22px;}





.centertext2 {text-align:left; height:auto;  }
.centertext2 img {margin-left:auto; margin-right:auto; max-width:600px; }
.normalimg {max-width:600px; }








#gifs { max-width:1700px;  margin:0px auto 0px auto; padding: 80px 120px; }
#gifs img {margin:5px; text-align:left; display:inline;}




.psbanner {position:fixed; top:100px; left:0px;  z-index:999;  }







/**data**/


#wxdata  { position:relative; width:960px;    margin-left:auto; margin-right:auto; }
#wxdata form {display:inline;  }
#wxdata img {display:inline; }
#wxdata a:link {  }





#spc1 {position:absolute;  left: 10px; top: 120px;  font-family:"Segoe Print", Trebuchet MS, Arial, sans-serif; font-size:26px; }
#spc1 ul li {display:inline; padding: 2px 2px 2px 2px; }


#sfcsat  {position: absolute;  left: 20px; top: 200px;    }
#sfcsat ul {display:inline;}
#sfcsat ul li {display:inline;}


#nwsradar  {position:absolute; left: 20px; top: 455px; width: 500px; }






#meso   {position: absolute; left: 650px; top: 450px; z-index:995; }
#meso ul li a {display:block; text-align:left;  font-family:  Arial, sans-serif; font-size:16px;  }
#meso ul li  {display:block; text-align:left; padding:2px;  }
#meso ul li p  {display:block; text-align:left; padding: 0px;  }




#models  {position: absolute; left: 650px; top: 625px;   margin-top: 5px;  font-family:  Arial, sans-serif; font-size:16px; }
#models ul {padding:20px 0px 0px 0px;}
#models ul li {display:block; text-align:left; padding: 5px 0px;}
#models ul li p  {display:block; text-align:left;  }









/**NAVIGATION**/






.left {position:absolute; left:0px; margin-top:10px; width:50%;  }
.right {position:absolute; right:0px; margin-top:10px; width:50%; text-align:right; }

.left li {display:inline; margin:10px 10px;   }
.right li {display:inline; margin:10px 10px;  }


#socialmedia  {position:fixed;  top:40%;  right:5px;  background:transparent; z-index:999;   height:80px; }
#socialmedia ul li {display:block;}



.accountsfooter {width:100%; height:auto; background:#333333; position:fixed; bottom:0px; left:0px; padding:5px 0px;}
.accountsfooter a{ text-align:left; font-size:20px;   font-family: 'Quicksand', sans-serif; padding:5px 10px; display:inline-block;}





.a2  {position:fixed; text-decoration:none;  top:65%; left:10%;  font-size: 60px;  font-family: 'Fredericka the Great', cursive; z-index:999;  }
.a3  {position:fixed; text-decoration:none;  top:25%; left:10%;  font-size: 60px;  font-family: 'Fredericka the Great', cursive; z-index:999;}
.a4  {position:fixed; text-decoration:none;  top:55%; left:10%;  font-size: 60px;  font-family: 'Fredericka the Great', cursive; z-index:999;  }
.a5  {position:fixed; text-decoration:none;  top:5%; left:10%;  font-size: 60px;  font-family: 'Fredericka the Great', cursive; z-index:999;  }
.a6  {position:fixed; text-decoration:none;  top:35%; left:10%;  font-size: 60px;  font-family: 'Fredericka the Great', cursive; z-index:999;  }
.a7  {position:fixed; text-decoration:none;  top:15%; left:10%;  font-size: 60px;  font-family: 'Fredericka the Great', cursive; z-index:999;  }
.a8  {position:fixed; text-decoration:none;  top:45%; left:10%;  font-size: 60px;  font-family: 'Fredericka the Great', cursive; z-index:999;  }

.indexnav a {color: #C0C0C0  ; }
.indexnav  a:hover {color:gray;   }



#menu-bar {height:auto;
  width: 100%; top:0px; left:0%;
  margin: 0px 0px 0px 0px;

  line-height: 100%;
  background: #8B8B8B;
  background: linear-gradient(top, #404040, #7A7A7A  );
  background: -ms-linear-gradient(top,  #404040, #7A7A7A);
  background: -webkit-gradient(linear, left top, left bottom, from(#404040), to(#7A7A7A));
  background: -moz-linear-gradient(top, #7A7A7A,  #333333 );  position:fixed;
  z-index:999;
}
#menu-bar li {
  margin: 3px 1px 3px 0px;
  padding: 0px 2px 0px 2px;
  float: left;
  position: relative;
  list-style: none;
}
#menu-bar a {
  font-weight: normal;
font-family: 'Quicksand', sans-serif;
  font-style: normal;
  font-size: 22px;
  color: #C7C7C7;
  text-decoration: none;
  display: block;
  padding: 10px 20px 15px 20px;
  margin: 0;
  margin-bottom: 3px;
  text-shadow: 9px 6px 5px #000000;
}

#menu-bar .active a, #menu-bar li:hover > a {
  background: transparent;
  color: #050505;
  text-shadow: 2px 2px 3px #FFFFFF;
}

#menu-bar ul a:hover {
  background: #0399D4 !important;
  color: #FFFFFF !important;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  text-shadow: 2px 2px 3px #FFFFFF;
}
#menu-bar li:hover > ul {
  display: block;
}
#menu-bar ul {
  background: #DDDDDD;
  background: linear-gradient(top,  #FFFFFF,  #CFCFCF);
  background: -ms-linear-gradient(top,  #FFFFFF,  #CFCFCF);
  background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#CFCFCF));
  background: -moz-linear-gradient(top,  #FFFFFF,  #CFCFCF);
  display: none;
  margin: 0;
  padding: 0;
  width: 185px;
  position: absolute;
  top: 30px;
  left: 0;
  border: solid 1px #B4B4B4;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -webkit-box-shadow: 2px 2px 3px #222222;
  -moz-box-shadow: 2px 2px 3px #222222;
  box-shadow: 2px 2px 3px #222222;
}
#menu-bar ul li {
  float: none;
  margin: 0;
  padding: 0;
}
#menu-bar ul a {
  padding:10px 0px 10px 15px;
  color:#424242 !important;
  font-size:12px;
  font-style:normal;
font-family: 'Quicksand', sans-serif;
  font-weight: normal;
  text-shadow: 2px 2px 3px #FFFFFF;
}
#menu-bar {
  display: inline-block;
}
  html[xmlns] #menu-bar {
  display: block;
}




@media screen and (max-width: 900px) {
     #menu-bar {
        position:absolute;
    }
    
     .accountsfooter { position:static; }

}