/**
 * 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:#282828; height:100%;}
u { text-decoration: underline;} 
h1 {color:gray; text-align:center; font-size:2em; padding: 20px 0px 20px 0px; font-family: 'Quicksand', sans-serif;}
h2 {color:red; text-align:left; font-size:1.5em; margin:5px 0px; font-family: 'Quicksand', sans-serif; }
h3 {color:gray; text-align:left; font-size:1.5em; margin:5px 0px; font-family: 'Quicksand', sans-serif; }
h4 {color:red; text-align:left; font-size:1em; margin:5px 0px; font-family: 'Quicksand', sans-serif; }
h5 {color:gray; text-align:left; font-size:.8em; margin:5px 0px; font-family: 'Quicksand', sans-serif; }

p  {color:#606060; text-align:left; font-size:1.5em; padding: 10px 10px 10px 0px; }
a:visited {color:#999999;}
a:link {color:#999999;}
a:hover {color:gray;   }
a:active {color:red;}


hr {border: 1px #999999 solid; margin:40px 0px;}

.centertext {text-align:center;}
.inline {display:inline;}
.centerimg {display:block; margin-left:auto; margin-right:auto; max-width:100%;}


.red {color:red; }


.boxred {padding:10px 10px; border: 2px red solid;  margin:5px 20px;}
.boxgray {padding:20px 15px; border: 5px gray solid; margin:5px 20px; }
.boxgray img {display:inline;}





ul.circle {list-style-type:disc;  font-size:24px; color:gray; padding: 10px 30px; }


.section {margin-top:100px;  }




/**floats**/
div.clear { clear: both; }
.floatright {float:right;   }
.floatleft  {float:left; }






/**content**/



#wrapper  { background-color:transparent;  margin-left:auto; margin-right:auto;    margin-top:110px; margin-bottom:10px;   height:auto; width:90%  }
#wrapper p {max-width:1000px;  }





#accounts  {margin-left:auto; margin-right:auto;   max-width:1200px;  height:auto;    }
#accounts img {padding: 70px 0px 0px 0px;   display:block;  max-width:100%}
#accounts a {text-align:left;   text-decoration:none;  }
#accounts h1 {margin:60px 0px 20px 0px; text-align:left;}








#wrapper2  { width:100%; background-color:transparent;   margin-top:130px; height:auto; }
#wrapper2  ul li { display:inline-block; margin:25px .25%;      width:19%; height:auto;             }
#wrapper2  ul li a { display:block;     font-family: 'Quicksand', sans-serif;                 }
#wrapper2  a:link {text-align:left;   display:block; font-size:.9em; text-decoration:none;}
#wrapper2  ul li img {width:100%;   }
#wrapper2 h1 {margin:30px 0px 0px 0px; text-align:left;} 









#stock {width:auto;  overflow:hidden;  margin-top:130px;  text-align:center;  margin-left:1%; margin-right:1%; 
 
 
 }
#stock p {text-align:center; font-size:1.2em;}
#stock a {    }
.box{ 




			display: inline-block;
			position:  relative;
			width: 19%;
			margin: .5% .5% ;
			float: left;
			
		}
		.box:before{
			content: "";
			display: block;
			padding-top: 75%; /* initial ratio of 1:1*/
		}

.innerbox{ 
			/* Positioning */
			position:  absolute;
			top: 0;
			left: 0;
			bottom: 0;
			right: 0;

			/* Styling */
			border:1px black solid;
			background: transparent;
			padding: 15px;
			text-align: center;
			vertical-align: middle;
			text-transform: uppercase;
			color: #fff;
		}
.innerbox img { max-height:85%; max-width:100%;}



.lightbox {
  /** Hide the lightbox */
  display: none;

  /** Apply basic lightbox styling */
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100%;
  text-align: center;
  top: 0;
  left: 0;
  background: gray;
  background-color:rgba(0, 0, 0, 0.85);
  
  
  
}

.lightbox img {
  /** Pad the lightbox image */
  max-width: 100%;
  max-height: 90%;
  

  position: relative;
  top: 50%;
  transform: translateY(-50%);
  -ms-transform: translateY(-50%); /* IE 9 */
-webkit-transform: translateY(-50%); /* Safari and Chrome */
-o-transform: translateY(-50%); /* Opera */
-moz-transform: translateY(-50%); /* Firefox */
  
  
  
  
}


.lightbox:target {
  /** Show lightbox when it is target */
  display: block;

  /** Remove default browser outline style */
  outline: none;
}








/**NAVIGATION**/


#topbar {width:100%; height:50px; background:#111111; position:fixed; top:0px; padding-top:10px; z-index:999;  }
#topbar a{ padding:10px;  }
 
#topbar .left {float:left; }
#topbar .right {float:right; display:inline; }
#topbar .right a img {width:1.5em; height:1.5em; }



.logo {  z-index:999; color:red;  }
.logo a {font-size:1.5em; color:red; text-decoration:none; font-family: 'Cinzel', serif;  }
.logo a:hover {color:green;}





#menu-bar {top:50px; height:auto;  width:100%;  background:#111111;  position:fixed; z-index:999 }

 
 
#menu-bar ul {margin-top:0px;}
#menu-bar ul li {padding:10px 10px;  display:inline-block; font-family: 'Quicksand', sans-serif;}
#menu-bar ul li a { font-size:1.2em;  font-family: 'Quicksand', sans-serif;     text-decoration:none;}

 
#menu-bar ul li:hover {background-color:#333333;}
#menu-bar ul li:active {background-color:#333333;}
#menu-bar ul li:visited {color:red;}
















/**gifs**/


#gifs {   height:auto;   width:auto; background-color:transparent;  margin-left:auto; margin-right:auto;   margin-top:80px; height:auto;  }
#gifs img {margin:5px; max-width:23%;   display:inline;}
#gifs p {max-width:80%;}





/**dvds tutorial**/

#tutorial {margin-left:auto; margin-right:auto;   max-width:70%;   height:auto;     }
#tutorial .tutorialimg img{max-width:500px;  }
#tutorial img {max-width:100%;}

#dvds  {margin-left:auto; margin-right:auto;   max-width:70%; height:auto;   }
#dvds a img {max-width:100%;}

#buy {padding:120px 0px 0px 0px;  }


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


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

.imageexpand {width:100%; height:auto; margin-right:auto; margin-left:auto; display:block; }
.floatwrapper {  padding:20px 15px; display:inline;   }




/**index**/

 

.indexpage  { position:absolute;  float:left; width:70%; margin-top:110px; }
.indexpage img {   display:inline; margin:20px 5px; width:45%; }
 

.indexpage2  {   float:right; width:20%; margin:90px 0px 0px 0px; }
.indexpage2 img {   display:inline; margin:20px 0px; max-width:100%; }



















/**data**/


#spacedata  {margin-left:auto; margin-right:auto;   max-width:80%;  height:auto;   }
 
#wxdata  {margin-left:auto; margin-right:auto;   width:1000px; height:auto;     }



#nwsradar  {float:left; margin-right:20px;}





#spc1 {  font-family:"Segoe Print", Trebuchet MS, Arial, sans-serif; font-size:26px; float:left; margin-right:20px;}
#spc1 ul li {display:block; margin:10px 0px;  }

#sfcsat  {   }
#sfcsat ul {display:inline;}
#sfcsat ul li {display:inline;}




#meso   {  display:inline;    }
#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  {  }
#models ul {padding:20px 0px 0px 0px;}
#models ul li {display:inline; text-align:left; padding: 5px 10px;}
#models ul li p  {display:block; text-align:left;  }
#models ul li a {text-decoration:none;}








#info  {margin-left:auto; margin-right:auto;   max-width:70%;   height:auto;    }






/**lenspages**/

#gear  {margin-left:auto; margin-right:auto;   max-width:70%;       }
#gear img {max-width:100%;}



.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; }
















@media all and (max-width: 1300px) {





#topbar {position:static;     }






#menu-bar {   position:static;}



#wrapper  {  margin-top:20px;  }
#wrapper2  {  margin-top:20px;  }
#wrapper2  ul li { display:inline-block; margin:25px .25%;      width:30%; height:auto;             }


.indexpage  {  position:static;   margin:0px; }

.indexpage2  {    margin:0px; }



.box{ width: 24%; margin: .5% .5% ;}
#stock p { font-size:.9em;}




@media all and (max-width: 600px) {


.box{ width: 32%; margin: .5% .5% ;}
#stock p { font-size:.9em;}



#wrapper2  ul li { display:inline-block; margin:25px .25%;      width:48%; height:auto;             }


 }