/* ---------- BASE ---------- */

html {
	padding: 0px;
	margin: 0px; 
	border: 0px; 
	height: 100%; 
	min-height: 100%;
	overflow: auto;
}

body {
	font-size: 11px;
	color: #454545;
	font-family: Arial, Helvetica, sans-serif;
	line-height: 135%;
	margin: 0px;
	padding: 0px;
	border: 0px;
	height: 100%;
	min-height: 100%;
	background: #ffffff;
}


ul,ol { list-style:none }
h1,h2,h3,h4,h5,h6,pre,code { font-size: 12px; }
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input { margin:0; padding:0 }
a img,:link img,:visited img { border:none }

/* ---------- TEXT AND LINKS  ---------- */

a { text-decoration: none; color: #146ab4; outline: none; }
a:hover { text-decoration: none; color: #252525;}

p { font-size: 11px; color: #454545; line-height: 135%; padding: 10px 0px 0px; }
h2 { font-size: 21px; color: #146ab4; }
h3 { font-size: 18px; color: #146ab4; }
h4 { font-size: 16px; color: #252525; margin: 10px 0px 20px; }

/* ---------- LAYOUT ---------- */

div#container {
	position: relative;
	/* overflow: hidden; */
	height: auto !important;
	min-height: 100%;
	width: 1004px;
	margin: 0px auto;
}

/************************/

div#top { clear: both; position: relative; margin: 25px 0px; display: table; }

	div#nav {
		margin: 0px 0px 0px 0px; display: table; position: relative; float: left; z-index: 100; height: 51px;
		width: 1000px; background: url(nav_right.gif) no-repeat top right; padding-right: 4px;
	}

	div#logo {
		width: 131px;
		height: 51px;
		position: relative;
		float: left;
	}
	div#logo a { width: 131px; height: 51px; display: block; }
	div#logo a:hover { border: none; }
	div#logo h1 {
		width: 131px;
		height: 51px;
		background: url(nav_logo.gif) no-repeat 0px 0px;
		margin: 0px auto;
	}
		div#logo h1 span {
			width: 131px;
			height: 51px;
			display: block;
			position: relative;
			line-height: 200px;
			overflow: hidden;
		}

	div#nav > ul { display: block; background: url(nav_bg.gif) repeat-x; width: 699px; height: 51px; float: left; }
		div#nav > ul > li { float: left; background: url(nav_separator.gif) no-repeat top right; position: relative; }
		div#nav > ul > li.active {}
			div#nav > ul > li > a {
				font-size: 14px; font-weight: bold; float: left; color: #454545; padding: 18px 30px 18px;
				text-shadow: #ffffff 1px 1px; text-transform: uppercase;
			}
			div#nav > ul > li a:hover, div#nav > ul > li:hover > a { color: #146ab4; }
	
	li.link-1 a { 
		display: block; background: url(nav_home.gif) no-repeat; overflow: hidden; line-height: 150px;
		padding: 0px !important; width: 53px; height: 51px;
	}
	div.n-cart { background: url(nav_bg.gif) repeat-x; width: 170px; height: 51px; float: left; }
		div.n-cart a, input#add, input.checkout {
			display: block; background: url(btn_cart.gif) no-repeat; width: 99px; height: 30px; float: right;
			font-size: 12px; font-weight: bold; color: #ffffff; margin: 7px 5px 0px 0px; padding: 10px 10px 0px 40px; text-align: center;
		}
        body input#add {
            border: none; float: left; height: 40px; line-height: 0px; cursor: pointer;
            padding: 0px 10px 5px 40px; width: 150px; margin: 15px 0px 0px -5px;
        }
        div#backer { display: none; }
    	div#backer a {
			background: url(http://cdn.shopify.com/s/files/1/0102/7022/t/3/assets/backer.png) no-repeat; width: 132px; height: 134px; z-index: 1000;
            display: block; margin: -20px 0px 0px 925px; position: absolute;
            overflow: hidden; line-height: 300px;
		}

div#main { clear: both; position: relative; }
		div.mright { float: right; width: 740px; }
			div.mvideo {
                padding-bottom: 45px; float: left; width: 480px; margin-left: 20px;
                background: url(shadow_video2.gif) no-repeat 50% bottom;
            }
			div.mwidget { float: left; width: 220px; }
            
            .black {
        		background: url(black2.jpg) no-repeat; display: block;
                margin-left:30px;width: 150px; height: 62px; line-height: 150px;
                overflow: hidden;
			}
            .white {
        		background: url(white2.jpg) no-repeat; display: block;
                margin-left:30px;width: 150px; height: 62px; line-height: 150px;
                overflow: hidden;
            
            
			}
            p.preord {
                float: right; font-size: 12px; margin: 0px 0px 30px; padding: 15px;
                text-align: center; width: 480px;
            }
            p.po2 { margin: 10px; text-align: left; width: 365px; }
            /* a.mpreorder {
				background: url(http://cdn.shopify.com/s/files/1/0102/7022/t/3/assets/images.jpg) no-repeat; display: block; margin: 15px auto 45px;
				width: 260px; height: 45px; line-height: 150px; overflow: hidden;
			} */
            a.mpre2 { margin: 5px 0px 0px; }
            a.mpre3 {
                background: url(http://cdn.shopify.com/s/files/1/0102/7022/t/3/assets/images.jpg) no-repeat; width: 260px; height: 45px;
                margin: 15px auto 25px;
            }
		div.mleft { float: left; width: 260px; }
			div.mleft > div { padding: 10px 15px; }
				div.mabout h4 { color: #146ab4; }
    			div.mabout p { padding: 0px; }
				div.mnews div a { margin: 10px 0px 20px 0px; display: block; }
					div.mnews div a p { padding: 0px; color: #757575; }
					div.mnews div a p.small { text-transform: uppercase; font-weight: bold; font-size: 10px !important; padding-top: 5px; }
					div.mnews div a:first-child p { font-size: 13px; color: #353535; }
                    div.mnews div a:hover p { color: #146ab4; }

		div.msocial { clear: both; background: #eeeeee; border-radius: 5px; padding: 10px; width: 984px; display: table; }
			div.msocial > div { float: left; padding: 10px 10px 0px; }
			div.msocial > div.mfeat { float: right; padding: 5px 10px; width: 210px; }
				div.mfeat a.mfeatured {
					background: url(http://cdn.shopify.com/s/files/1/0102/7022/t/3/assets/logo_macworld.gif) no-repeat; overflow: hidden; line-height: 120px;
					width: 81px; height: 38px; display: block; margin-left: 30px;
				}
                div.mfeat a.mf2 { background: url(http://cdn.shopify.com/s/files/1/0102/7022/t/3/assets/logo_pulse2.jpg) no-repeat; }
                div.mfeat a.mf3 { background: url(http://cdn.shopify.com/s/files/1/0102/7022/t/3/assets/logo_pcadvisor2.jpg) no-repeat; }
                div.mfeat a.mf4 { background: url(http://cdn.shopify.com/s/files/1/0102/7022/t/3/assets/logo_fancy3.jpg) no-repeat; }
                div.mfeat a.mf5 { background: url(http://cdn.shopify.com/s/files/1/0102/7022/t/3/assets/logo_macworld_2012.jpg) no-repeat; }
                div.mfeat div.wrap2 { margin: 0px 0px 0px 105px; }
				div.mfeat span { float: left; padding: 10px 5px; }

div#footer { clear: both; margin: 15px 0px; border-top: 1px solid #eeeeee; padding: 10px 10px 30px; }
	div#footer p { float: left; color: #454545; }
    div#footer p.paypal { float: right; }
        div#footer p.paypal a {
            background: url(paypal_logo2.jpg) no-repeat; overflow: hidden; display: block;
            line-height: 100px; height: 35px; width: 85px; margin: -15px 0px 0px;
        }
    div#footer p.omega { float: right; color: #959595; }
		div#footer p.omega a { font-weight: bold; }
	div#footer ul.fnav { width: auto; float: left; }
		div#footer ul.fnav li { float: left; }
		div#footer ul.fnav li a { float: left; color: #757575; font-weight: bold; margin: 10px 0px 0px 15px; font-size: 11px; }
			div#footer ul.fnav li a:hover { color: #252525; }

/* slideshow */

	div.wrap { margin: 0px 0px 20px; height: 388px; background: url(shadow.gif) no-repeat bottom left; }
		div.nivoSlider {
			z-index: 40; width: 1004px; height: 363px; margin: 0px; position: relative;
			background:url(http://cdn.shopify.com/s/files/1/0102/7022/t/3/assets/images/loading.gif) no-repeat 50% 50%; overflow: hidden;
		}
		.nivoSlider > a > img { position: absolute; display: none; width: 1004px; height: 363px; }
		.nivoSlider > a { border: 0; display: block; width: 1004px; height: 363px; position: absolute; }
		.nivo-directionNav { position: absolute; z-index: 1000; top: 0; }
		.nivo-directionNav a {
			display: block;
			width: 72px;
			height: 363px;
			background: url(arrow_left_new.png) no-repeat;
			text-indent: -9999px;
			border: 0;
			position: absolute;
			opacity: 0.4;
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
            filter: alpha(opacity=40);
            -moz-opacity: 0.4;
			cursor: pointer;
		}
		.nivo-directionNav a:hover {
            opacity: 0.8;
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
            filter: alpha(opacity=80);
            -moz-opacity: 0.8;
        }
		a.nivo-nextNav { background: url(arrow_right_new.png) no-repeat; margin-left: 932px; }

    	#slider2 {
			z-index: 40; width: 141px !important; height: 38px !important; margin: 0px; position: relative;
			background:url(http://cdn.shopify.com/s/files/1/0102/7022/t/3/assets/images/loading.gif) no-repeat 50% 50%; overflow: visible;
		}
		#slider2 .nivoSlider > a > img { position: absolute; display: none; width: 81px; height: 38px; }
		#slider2 .nivoSlider > a { border: 0; display: block; width: 81px; height: 38px; position: absolute; }
    	#slider2 .nivo-directionNav a {
			display: block;
			width: 21px;
			height: 28px;
			background: url(small_left.gif) no-repeat;
			text-indent: -9999px;
			border: 0;
			position: absolute;
			opacity: 0.6;
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
            filter: alpha(opacity=60);
            -moz-opacity: 0.6;
			cursor: pointer;
            margin-top: 5px;
            margin-left: -30px;
		}
		#slider2 .nivo-directionNav a:hover {
            opacity: 1;
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
            filter: alpha(opacity=100);
            -moz-opacity: 1;
        }
		#slider2 a.nivo-nextNav {
            background: url(small_right.gif) no-repeat; margin-left: 90px;
        }

		/* The slices and boxes in the Slider */
		.nivo-slice {
			display: block;
			position: absolute;
			z-index: 5;
			height: 100%;
		}
		.nivo-box {
			display: block;
			position: absolute;
			z-index: 5;
		}
		.nivoSlider a.nivo-imageLink {
			position:absolute;
			top:0px;
			left:0px;
			width:100%;
			height:100%;
			border:0;
			padding:0;
			margin:0;
			z-index:6;
			display:none;
		}

/* shopify */

#collection #main { padding: 10px 15px 30px; }
    ul#products { display: table; }
        ul#products li {
                float: left; border: 1px solid #eeeeee; margin: 5px 5px 0px 0px;
                padding: 5px;
        }
        ul#products li h3 {
            border-top: 1px solid #eeeeee; margin: 10px 0 0; padding: 15px 5px 0;
            text-align: center;
        }
        ul#products li p {
            font-weight: normal; text-align: center; font-size: 16px; padding: 5px 0px;
        }

/* product */
div#summary { padding: 15px 15px 30px; display: table; }
    div#images { float: left; width: 480px; }
		div#image {}
		div#thumbs {}
	div#details {
        float: left; width: 420px; margin-left: 20px; border-left: 1px solid #eeeeee;
    }
	div#desc { font-size: 12px; padding: 10px 0px; }
		div#desc p { padding: 10px 20px 0px 20px; font-size: 12px; }
            div#desc ul { margin: 5px 25px; }
                div#desc ul li {
                    padding: 5px 0px 5px 20px;
                    background: url(arrow_grey.gif) no-repeat 2px 9px;
                }
	div#options {
        border-top: 1px solid #eeeeee; margin: 5px 20px 20px; padding: 15px;
    }
	div#variants { float: right; width: 60px; }
		div.selector-wrapper {}
		div#buy { float: left; width: 200px; }
			h2#price { font-size: 24px; font-weight: normal; }
			input#add {}

/* blog */
div.entry { margin: 10px 0px 20px; }
    div.start { margin: 0px; border: none; }
    div.end { margin: 0px 0px 20px; border: none; }
	#main.page div.entry h2.title { margin: 10px 0px 20px; line-height: 100%; }
		div.entry h2.title a {} /* category layout */
	div.entry h5.posted { border-top: 1px solid #eeeeee; padding: 10px 10px 30px; color: #aaaaaa; }
		div.entry h5.posted a { color: #757575; }
	div.entry a.rmore { margin: 10px 0px 20px; display: table; font-weight: bold; text-transform: uppercase; }
    p#closed {
        font-size: 11px; font-weight: bold; color: #aaaaaa; margin: 20px 10px;
    }
/* cart */
#main.cart { padding: 10px 15px 30px; }
    #main h1 { font-size: 21px; color: #146ab4; margin: 10px 0px 20px; }
    p#empty {
        font-weight: bold; color: #aaaaaa; margin: 20px 10px; font-size: 12px;
        padding: 50px 20px 50px 20px; border-left: 1px solid #eeeeee;
    }

div.cart form { border-top:1px solid #146ab4; padding: 40px 0px 20px; }
div.cart form table {
    border-bottom: 1px solid #aaaaaa; padding: 0px 10px 5px; margin: 0px 15px;
}
    div.cart form table th { padding: 10px; text-align: left; }
    div.cart form table td {
        border-top: 1px solid #dddddd; min-width: 60px; padding: 10px;
    }
    div.cart form table td.pic {}
    div.cart form table td.title { width: 400px; }
        div.cart form table td.title h3 { font-size: 14px; }
div.cart #total {}
    #total h3 {
        font-size: 12px; color: #aaaaaa; font-weight: normal; width: 135px;
        margin: 20px 0px 15px 770px; text-align: right; text-transform: uppercase;
    }
    #total h3 span {
        font-size: 20px; font-weight: bold; color: #050505; float: right;
        margin: 0px 0px 0px 10px; display: block;
    }
    #total #checkout {
        margin: 30px 0px 15px; padding: 10px; border-top: 1px dotted #dddddd;
    }
        #total #checkout input.checkout {
            border: none; height: 40px; line-height: 0px; cursor: pointer;
            padding: 0px 10px 5px 40px; width: 150px;
        }
        #total #checkout input.update {
            border: none; font-size: 12px; color: #757575; font-weight: bold;
            float: right; margin: 18px 24px; background: none; cursor: pointer;
        }
    #total .additional-checkout-buttons { padding: 0px 20px; }
        #total .additional-checkout-buttons p {
            margin: -20px 0px 10px; padding: 20px 0px; text-align: center; width: 135px;
        }

/* page */
#main.page { padding: 10px 15px 30px; }
	#main.page h3 { margin: 10px 0px 20px; }
	#main.page p {
        font-size: 12px; padding: 10px 20px 0px 20px; margin-left: 10px;
        border-left: 1px solid #eeeeee;
    }
    #main.page ul, #main.page ol {
        margin: 0px 25px 0px 10px; border-left: 1px solid #eeeeee;
    }
    #main.page ol li { list-style: decimal; margin-left: 50px; padding: 5px 0px 0px 5px; }
    #main.page ul li {
            padding: 5px 0px 0px 20px; margin-left: 25px; 
            background: url(arrow_grey.gif) no-repeat 2px 9px;
        }
    #main.page h1 {}
    #main.page h2 { margin: 50px 10px 10px; display: table; }
    #main.page h3 { color: #000000; font-size: 13px; margin: 20px 10px; display: table; }

    /* faq */
    #main.page a b { font-size: 13px; display: block; margin: 20px 0px 0px; }
    /* contact */
    div.ctext { float: left; width: 540px; margin-bottom: 30px; }
    div.cfacebook { float: left; width: 420px; margin-bottom: 30px; }
    div.ctext2 { float: left; width: 420px; margin-bottom: 30px; }
    div.cwidget { float: left; width: 240px; margin-bottom: 30px; }
    div.cmedia { float: left; width: 300px; margin-bottom: 30px; }
        div.cmedia img { width: 290px; margin-bottom: 5px; }
    div.newmedia {
        padding: 15px 10px 15px 0px; display: table; border-right: 1px solid #eeeeee;
        float: left; margin: 0px 20px 30px 0px; width: 700px;
    }
        div.newmedia img {
            border: 5px solid #eeeeee; float: left; height: 37px;
            margin: 0px 10px 10px 0px; padding: 1px;
        }

    .feedback {
        border-radius: 4px; background: #eeeeee; padding: 10px; width: 420px;
        text-transform: uppercase; margin: 20px 30px -30px;
    }
    #main .feedback p { padding: 0px 10px; margin: 0px; font-weight: bold; color: #202020; }
    #main .feedback p:before { content: '- '; }
    #main .feedback p:first-child { font-weight: normal; color: #757575; text-transform: none; }
    #main .feedback p:first-child:before { content: ''; }
    #contactFormWrapper {
        margin: 20px 5px; padding: 15px; border: 1px solid #eeeeee; width: 460px;
    }
    #main #contactFormWrapper p { border: none; margin: 0px; }
        #contactFormWrapper label { float: left; display: block; width: 100px; padding-top: 5px; }
        #contactFormWrapper input, #contactFormWrapper textarea {
            font-family: Helvetica, Arial, sans-serif; border: 1px solid #dddddd;
            padding: 6px; color: #757575; width: 300px; font-size: 12px;
        }
        #contactFormWrapper textarea { height: 120px; }
#contactFormWrapper input.button {
  background-color: #0092d5;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#0092d5), to(#0574c4));
  /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #0092d5, #0574c4);
  background-image: -moz-linear-gradient(top, #0092d5, #0574c4);
  background-image: -ms-linear-gradient(top, #0092d5, #0574c4);
  background-image: -o-linear-gradient(top, #0092d5, #0574c4);
  background-image: linear-gradient(top, #0092d5, #0574c4);
  border: 1px solid #0983ce;
  border-bottom: 1px solid #0a6abd;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  -webkit-box-shadow: inset 0 1px 0 0 #03a3e5;
  -moz-box-shadow: inset 0 1px 0 0 #03a3e5;
  -ms-box-shadow: inset 0 1px 0 0 #03a3e5;
  -o-box-shadow: inset 0 1px 0 0 #03a3e5;
  box-shadow: inset 0 1px 0 0 #03a3e5;
  color: #fff;
  line-height: 1;
  padding: 9px 0 7px 0;
  text-align: center;
  text-shadow: 0 -1px 0 #0a6abd;
  width: 150px;
}
#contactFormWrapper input.button:hover {
    background-color: #007fd0;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#007fd0), to(#0574c4));
    /* Saf4+, Chrome */
    background-image: -webkit-linear-gradient(top, #007fd0, #0574c4);
    background-image: -moz-linear-gradient(top, #007fd0, #0574c4);
    background-image: -ms-linear-gradient(top, #007fd0, #0574c4);
    background-image: -o-linear-gradient(top, #007fd0, #0574c4);
    background-image: linear-gradient(top, #007fd0, #0574c4);
    -webkit-box-shadow: inset 0 1px 0 0 #03a3e5;
    -moz-box-shadow: inset 0 1px 0 0 #03a3e5;
    -ms-box-shadow: inset 0 1px 0 0 #03a3e5;
    -o-box-shadow: inset 0 1px 0 0 #03a3e5;
    box-shadow: inset 0 1px 0 0 #03a3e5;
    cursor: pointer; }

/* safari/webkit only css */
@media screen and (-webkit-min-device-pixel-ratio:0) {
	div#nav > ul { width: 695px; }
	div.msocial { width: 1004px; }
}

.vid {
    margin-left:auto;
    margin-right:auto;
    margin-bottom:20px;
    width:70%;
    
}