/* --------------------------
base styles 
-------------------------- */

body {
	background-image: none;
	background-color: white;
}

.page{
margin:10px;
}

.about
{
	margin: 20px;
}

.container
{
   width:100%;
   margin-right: auto;
   margin-left: auto;*zoom:1;
}


.header {
	display: table; 
	margin:0 auto;
	background-color: white;
	width:100%;
	text-align:center;
}

.header1
{
	background-color:black;
	width:100%;
	display: none;
}
.header2
{
	width: 100%;
    margin: 0 auto;
    margin-left: 2%;
	background-color:white;
	float: left;
	display: block;
}
.header2 img {
    width: 175px;
    float: left;
}

.header2 a:link {
    font-size: 18px;
}
.header2 a:visited {
    font-size: 18px;
}

.btn-primary {
	color: #ffffff;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
	background-color: #229ac8;
	background-image: linear-gradient(to bottom, #23a1d1, #1f90bb);
	background-repeat: repeat-x;
	border-color: #1f90bb #1f90bb #145e7a;
    text-align: center;
    height: 30px;
    line-height:30px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px; /* future proofing */
    -khtml-border-radius: 5px; /* for old Konqueror browsers */    
}

.call
{
	font-size: 20px;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
}
.content {
    margin-right: auto;
    margin-left: auto;*zoom:1;
	width:98%;	
	background-color: white;	
}
	.product-image 
	{
		height:100px;
        margin: 5px 5px 10px 0px;
	}

    .accessories-image 
    {
		width: 60px;
        float:left; 
        margin: 0px 5px 10px 0px;    
    }

/*
    .cart-button a
    {
        display: block;
        font-weight: bold;
        color: black;
        margin:3px;
    }
*/
	.cart-button
	{        
        
        margin-left: 80px;
        margin-top: 10px;
        margin-bottom: 10px;
/*		border:1px solid #00A2FF; */
        width:200px;
/*        height:30px;*/
/*        line-height:32px; */
/*        background-color: #eee;*/
		
	}
	.cart-button:hover
	{
		cursor: pointer;
		background-color: #ddd
	}
	
	.col1,.col2,.col3,.smcol1,.smcol2,.smcol3,.smcol4
	{
		float: left;
		margin-bottom: 1em;
		margin: .5%;		
		border:1px solid #ddd;
		width:95%;
	}
	.ccol1,.ccol2,.ccol3
	{
		float: left;
		margin-bottom: 1em;
		margin-left: 3%;
	}
	.ccol1 { display:none; }
	.ccol2 { width: 280px; }	
	
	.scol1
	{ 
        width: 200px;
		float: left;
		margin: 1%; 		
		height:100%;
        display:none;
	}

    .left {
        width:210px;
        margin: 1px;
		height:100%;
        float:left;
        display:none;        
    }
	
	.right
	{ 	
		margin-left: 1px;                 
		width: 100%;           
	}		

    .sign
	{ 
        float:left;
        margin-left:10px;                  
        margin-bottom: 10px;
        width:95%;
        
        border-bottom:1px solid #ddd;
	}		

	.inner{
		margin-left: 1%;				
	}

	@media (min-width:900px)
{
		
/* --------------------------
wide screen 
-------------------------- */

body {
	background-image: url(graphics/led.png);
	background-repeat: repeat;
	background-color: white;
}

	.container
	{
		width: 940px;
	}

	.header,.content
	{
		width: 940px;
		float: none;
	}
	
	.header1
	{
		float: right;
		display: block;
	}	
	.header2
	{
		display: none;
	}
	.header3
	{
		display: none;
	}

	.content
	{
		overflow: hidden;
		float: none;
	}

	.smcol1 { width: 210px; }
	.smcol2 { width: 210px; }
	.smcol3 { width: 210px; }
	.smcol4 { width: 210px; }

	.col1 { width: 280px; height:250px;}
	.col2 { width: 280px; height:250px;}
	.col3 { width: 280px; height:250px;}

	.ccol1 { display:block; width: 560px; height: 420px;}
	
	.left { display:block; }
    .right { margin-left: 220px; width: 65%; }
	

}