/*RESET*/
    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, font, 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 {margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;vertical-align: baseline;background: transparent;}
    body {color:#000;background: #000;line-height: 1; font-family:arial, Helvetica, Sans-Serif;font-size:12px;height: 100%; width: 100%;}
    ol, ul {list-style:none;} table {border-collapse: collapse;border-spacing: 0;} 

/*Clear Floats*/
    .group:after, .dropDown li:after, .twoCol .rightCol h3:after{content: ".";display: block;clear: both;visibility: hidden;line-height: 0;height: 0;}
   
/*Main Sprite*/
    .social, #slideshow .figcaption a,#blogPosts .date, #head .nav li a, #head .nav .dropDown a.arw, h3 a, #brandSelector,.subNav li{background-image:url(../Images/city-grounds-sprite.png);background-repeat:no-repeat;display:block}
        .facebook{height:16px;width:16px;background-position:0 0;text-indent:-9999px}
        .twitter{height:16px;width:16px;background-position:-25px 0;text-indent:-9999px}
        .yelp{width:40px;height:16px;background-position:-48px 0;text-indent:-9999px}
        .mail{width:19px;height:16px;background-position:-99px 0;text-indent:-9999px}
        
/*General Style*/
    @font-face
    {
        font-family:"Rockwell";
        src:url(../Resources/Fonts/Rockb.TTF)
    }
    
    a{color:#ee0000;text-decoration:none}
    
    del{color:#666}
    
    .right{float:right;}
    
    .hr{background:#b2b2b2;height:1px;margin:0 0 20px 0;clear:both;}
    
    h3{padding:10px 12px 3px;margin:10px 0;color:#fff;text-transform:uppercase;font-size:19px;background:#000;overflow:auto}
        h3 a{color:#fff;float:left;padding-right:25px;background-position:-1000px -1000px}
        h3 a:hover{background-position:right -273px;text-decoration:none}
        h3 .sale{background:#b0b491 url(../Images/sale-bg.png) repeat-x;margin:-8px -12px 0 0;padding:7px 11px 3px 11px;border:1px solid #999c7b;}
    
    .spotlight .feature, #blogPosts .postDetail,#slideshow .figcaption{background:url(../Images/opacity80blk.png) repeat;}
    
    .field{clear:both;position:relative}
        .field label{position:absolute;top:5px;left:4px;font-size:11px;font-weight:bold;color:#686868}
        .field input{border:1px solid #000;float:left;width:150px;height:19px}
    
    .dropDown{position:absolute;top:32px;left:0;background:#fff;border:1px solid #000;border-top:none;display:none;z-index:9900;padding:20px;width:160px;box-shadow:1px 4px 3px rgba(0,0,0,.5);-moz-box-shadow:1px 4px 3px rgba(0,0,0,.5);-webkit-box-shadow:1px 4px 3px rgba(0,0,0,.5)}
        .double .dropDown{width:340px}
        #head .nav .dropDown a{background-image:none;text-transform:none;border: none}
        #head .nav .dropDown li{display:block;float:none}
        #head .nav .dropDown li a{color:#555;font-size:12px;padding:7px 7px 7px 0;float:left;}
        #head .nav .dropDown li a:hover{padding-right:26px;color:#000;}
        .dropDown .sale{float:right;padding:0 20px 20px 20px;margin-left:15px;border-left:1px solid #000;width:120px;}
        .dropDown .sale img{display:block;margin-bottom:12px}
        .dropDown .sale .desc{color:#555}
        .dropDown .sale a:hover .desc{color:#000}
        .dropDown .sale .price{display:block;margin:6px 0 12px;overflow:auto}
        .dropDown .sale .price del{float:left;margin-right:10px}
        .dropDown .sale .price strong{float:left;color:#e80000}
        #head .nav .dropDown .sale a{color:#555;font-size:12px;padding:0;clear:both;}
        #head .nav .dropDown .sale a:hover{color:#000;}
        .sale a:hover{text-decoration:underline}
        .dropDown .arw{margin:6px 0 12px}
        .dropDown ul{float:left;width:160px} 
        .dropDown li{border-bottom:1px solid #b1b1b1}
        .dropDown li.last{border-bottom:none}
        .dropDown h4{text-transform:uppercase;font-size:15px;margin-bottom:10px}
        
    #searchBox{width:180px;height:24px;float:right;}
    
/*Structure*/
    .bgWrap{background:#eee url(../Images/city-grounds-bg.jpg) no-repeat top center;padding:10px 0 15px;}

    .wrap{width:980px;padding:10px 10px 25px 10px;margin:0 auto 10px;background:#fff;border-bottom:5px solid #000;}
    
    #head{margin-bottom:10px;position:relative;z-index:10}
        #head h1{float:left;margin:10px 0 12px 10px}
        #head .nav{clear:both;background:#000;padding-right:12px}
            #head .nav ul{float:left}
            #head .nav li{float:left;position:relative}
            #head .nav li a{display:block;color:#fff;font-size:19px;padding: 8px 30px 4px 12px;text-transform:uppercase;background-position: right -187px;border:1px solid #000;border-bottom:none;}
            #head .nav a:hover, #head li.hover a{text-decoration:none;background-color:#fff;color:#000;background-position: right -230px;}
            #head .nav .right a:hover{color:#fff;background:none}
            #head .right ul{margin:0 -1px 22px 0;float:right}
            #head .right li {float:left;margin-right:1px;}
            #head .right li a{font-size:11px;padding:2px 10px;background-color:#000;color:#fff}
            #head .right li a.social{background-color:transparent !important;padding:0;margin-right:8px}
            #head .right li a:hover{background-color:#666}
            .nav .right{color:#fff;padding-top:10px}
            .nav .right a{color:#999;}
            .nav .right a:hover{text-decoration:none;color:#ee0000;}
            #head .cart{clear:both;background-position:-169px 0;padding:5px 0 5px 25px;float:left;color:#000;font-size:11px;margin-right:10px}
                #head .cart:hover{background-position: -270px 0}
            #head .field{float:right;clear:right}
            #head .search{width:26px;height:24px;background-position:-129px 0;float:left;text-indent:-9999px}
    
    #main{position:relative;z-index:5}
    
    #ankle{width:980px;margin:0 auto;}
        #ankle #brandSelector{clear:left;float:left;margin:5px 25px 0 0;padding:12px 40px 12px 12px;background-color:#000;background-position:right -300px;color:#fff;}
        #ankle #brandSelector:hover{background-color:#666;color:#000;cursor:pointer}
        #ankle h3{color:#000 !important;background:none;padding-left:0;margin:0 0 0 0;float:left;}
        #ankle h3 a{color:#000 !important;background-image:none !important;}
        #ankle ul{float:left;margin-top:-15px}
        #ankle li{float:left;padding:10px 0px}
        #ankle li a{display:block;padding:0 14px}
        #ankle li:hover{border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#dfdfdf}
    
    #foot{background:#000;padding:20px 0}
        #foot a{color:#9c9c9c}
        #foot a:hover{color:#fff}
        .container{width:980px;margin:0 auto}
        #foot li{float:left;padding-left:8px}
        #foot .btmLink li{padding: 0 15px 0 0;font-size:15px}
        #foot .btmLink {text-transform:uppercase;float:left}
        #foot .btmLink a{color:#fff;}
        #foot .btmLink a:hover{color:#666}
        .socialLinks {float:left;margin:3px 0 0 16px}
            .socialLinks ul, .socialLinks span{float:left;color:#666;padding-right:12px}
        .copyright {color:#323c3d;clear:both;padding-top:40px;}
        
/*Home*/
    #slideshow{height:400px;width:980px;position:relative;overflow:hidden;}
        #slideshow .slides a{display:block;position:absolute;top:0;left:0;width:980px;height:400px;}
        #slideNav {position:absolute;bottom:0;right:0;z-index:20}
        #slideNav li{padding:0 6px;float:left;}
        #slideNav a{display:block;text-align:center;width:20px;padding:8px 0;font-size:17px;color:#fff;background:none;font-weight:bold;background:url(../Images/buttonBg.png) repeat;}
        #slideNav .on a, #slideNav a:hover{background:#000;}
        #slideNav .on a{cursor:default}
        
    .productList{margin:-10px 0 10px 1px;width:981px;}
        .productList li{padding:0 22px 20px 23px;margin-left:-1px;float:left;height:190px;width:150px;line-height:14px;border:1px solid #aaaaaa;border-top:none;position:relative;z-index:0}
        .productList li.last{width:149px}
        .productList li:hover{z-index:1;border-color:#000}
        .productList li strong, .productList li .price{display:block;margin:3px 0}
        .productList li a{float:left;clear:left;color:#555555}
        .productList li a:hover{color:#000;text-shadow:1px 1px #ddd;text-decoration:none}
        .productList li img{display:block;margin:0 auto}
        .productList .price del{float:left;margin-right:10px;color#aaaaaa}
        .productList .price {color:#e80000;margin:0;display:inline;font-weight:normal}
        
    #spotlights{}
        .spotlight {margin-right:10px;float:left;position:relative;width:485px;color:#fff}
        .end{margin-right:0}
            .spotlight h4{top:26px;left:24px;font-size:22px;font-family:"Rockwell", Rockwell, Georgia, Serif;position:absolute;text-transform:uppercase;font-weight:normal;}
            .spotlight .feature{padding: 0 24px;line-height:16px;position:absolute;top:75px;left:0;width:178px;color:#bebbb7;}
                .spotlight .feature h5{color:#fff;font-family:Rockwell, "Rockwell", Georgia, Serif;margin:16px 0 4px;}
                .spotlight .feature img{border:5px solid #fff;float:right;margin-right:-138px}
                .spotlight .feature a{color:#bebbb7;float:left;clear:left;margin:5px 0 10px 0}
                .spotlight .feature a:hover{color:#fff;text-decoration:none}
            .spotlight .bottomFeature{position:absolute;bottom:0;left:0;background:#000;width:455px;font-family:Rockwell, "Rockwell", Georgia, Serif;padding:12px 15px;}
                .bottomFeature a{color:#999}
                .bottomFeature a:hover{color:#fff;text-decoration:none}
                
    #blogPosts{}
        #blogPosts li{width:317px;height:320px;margin-left:14px;float:left;position:relative}
        #blogPosts .firstPost{margin-left:0}
        #blogPosts .date{position:absolute;color:#000;right:5px;top:20px;font-family:Trade Gothic, Arial;z-index:3;background-position:0 -103px;padding:18px 16px 0 4px;font-size:10px;width:67px;height:56px;text-transform:uppercase}
        #blogPosts .postDetail{width:305px;height:320px;position:absolute;z-index:2;top:0;left:0;padding-left:12px;color:#fff;display:none;text-transform:uppercase}
            .postDetail .postTitle{font-size:45px;padding:34px 0 42px 0;width:174px;display:block}
            .postDetail .postComments{position:absolute;bottom:20px;right:0;font-style:italic;font-size:16px;border:5px solid #fff;border-right:0;background:#000;padding:14px 12px;font-family:Georgia, Palentino, Serif;}
        #blogPosts a:hover .postDetail{display:block;text-decoration:none}
        #blogPosts a{text-decoration:none}
        
    /*Subpage*/
    
    .leftCol{width:172px;border:1px solid #000;float:left;padding:16px 10px 16px 12px}
        
        .leftCol h2{padding-bottom:2px;border-bottom:1px solid #b2b2b2;font-size:19px;color:#000;text-transform:uppercase}
        
        .subNav{margin-bottom:26px}
            .subNav li{padding-left:12px;background-position: 0 -275px }
            .subNav li.on, .subNav li.leaf{background-position:-33px -238px}
            .subNav li.on li.leaf{background:none}
            .subNav a{color:#555555;padding:6px 0;display:block;border-bottom:1px solid #b2b2b2}
            .subNav li li{background:none}
            .subNav li.on li a{font-size:11px;color:#555}
            .subNav li.on li.leaf a,.subNav li.on li a:hover{color:#000}
            .subNav a:hover, .subNav .on a{color:#000}
        .brandList{}
            .brandList li{text-align:center;padding:14px 0}
    
    .rightCol{width:772px;float:right;}
        .subpage-banner img{border:1px solid #000}
        .breadcrumbs{display:block;margin:10px 0 20px;background:#000;color:#fff;padding:7px 8px}
            .breadcrumbs li{float:left;padding-right:2px}
            .rightCol .breadcrumbs a, .fullCol .breadcrumbs a{color:#999999;}
            .rightCol .breadcrumbs a:hover, .fullCol .breadcrumbs a:hover{color:#fff}
        .rightCol h2, .fullWidth h2, .fullCol h2{font-size:20px;margin:0 0 18px 10px;text-transform:uppercase}
            .rightCol h3{margin-left:-10px;clear:both}
            .rightCol h2.withTopMargin {margin-top:18px;}
        .contentArea{line-height:18px;padding-left:10px}
            .fullCol .contentArea{padding-left:0;}
        .contentArea ul {list-style:disc outside;padding-left:15px;}
        .contentArea ol {padding-left:15px;list-style:decimal outside;}
        .profile{padding-right:20px;margin-top:28px;border:1px solid #000;background:#000;color:#fff;line-height:15px}
            .profile img{padding-right:26px;float:left;}
            #main .profile h4{padding:20px 0 0 0;font-size:20px;margin:0;text-transform:uppercase;margin-bottom:3px}
            #main .profile h5{}
            .profile ul{}
            .profile li{padding:2px;}
            .profile .locations a{color:#999}
                .profile .locations a:hover{color:#fff}
        .gallery-thumbs{margin:9px 0 24px;}
            .gallery-thumbs a{float:left;margin-right:6px;border:1px solid #000}
        .q-a{width:480px;padding:0 20px 0 12px;float:left;}
            #main .q-a h4{font-size:20px;text-transform:uppercase;}
            .q-a table{width:100%;}
            .q-a td{padding:10px 0;border-bottom:1px solid #b2b2b2;line-height:16px}
        .quick-links{width:220px;padding:0 15px 0 20px;border-left:1px solid #b2b2b2;float:right;}
            #main .quick-links h4{font-size:20px;text-transform:uppercase;margin-bottom:10px;}
            .quick-links ul{}
            .quick-links li{margin-bottom:24px;line-height:16px;}
            .quick-links b, .quick-links strong{display:block;margin-bottom:5px}
            .quick-links a{color:#555}
            .quick-links a:hover{color:#000}
        
        .rightCol h4{font-size:14px;margin:15px 0 10px;}
        .rightCol h5{font-size:12px;margin:10px 0 5px}
        .rightCol a{color:#555}
            .rightCol a:hover{color:#000}
            
    /*Locations*/
        .locations a, .contact a, .hours a{display:block;margin-top:3px;}
         #main .locations h5, #main .contact h5, #main .hours h5{font-size:16px;text-transform:uppercase}
        .profile .locations{width:275px;margin:12px 0;padding:12px 0;border:1px solid #333;border-style:solid none;float:left}
            #main .profile .locations h5{margin-top:0;}
        .profile .contact{float:left;padding:0 12px 15px 0;border-right:1px solid #333333;margin-right:12px}
        .profile .hours{float:left}
        
    .fullWidth{padding-top:25px;min-height:600px}
    
    
    /*Two Col*/
    .twoCol{}
        .twoCol .leftCol{padding-top:6px}
            .twoCol .leftCol h2{border-bottom:0;padding-bottom:0;margin:10px 0}
            .twoCol .leftCol ul{margin:5px 0;}
            .twoCol .leftCol li{display:block;}
            .twoCol .leftCol a{color:#000;border-bottom:1px solid #ccc;display:block;padding:5px 0;}
                .twoCol .leftCol a:hover{color:#666}
            .twoCol .leftCol ul ul{padding-left:15px;}
        .twoCol .rightCol{}
            .twoCol .rightCol h2{margin:10px 0}
            .twoCol .rightCol h3 cufon{float:left;}
            .twoCol .rightCol h3{overflow:hidden}
            .twoCol .rightCol h3 a{float:left;font-size:11px;line-height:18px;margin:3px 10px 0;background:none !important;padding:0;color:#fff;}
            
    
    /*Three Col*/
    .threeCol{}
        .threeCol h3{margin:0 0 6px 0}
        .threeCol .col1{width:217px;margin-right:16px;float:left;line-height:14px}
            .threeCol .col1 a{color:#000;font-weight:bold;text-decoration:underline;}
                .threeCol .col1 a:hover{text-decoration:none}
        .threeCol .col2{width:430px;margin-right:16px;float:left;}
        .threeCol .col3{width:301px;float:left;}
        .threeCol h4{font-size: 20px;margin: 6px 0;text-transform: uppercase;}
    
    /*Colorbox*/
    #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9998; overflow:visible;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative; overflow:visible;}
#cboxLoadedContent{overflow:auto;}
#cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
#cboxTitle{margin:0;display:none !important}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
#cboxOverlay{background:#333}
#colorbox{}
    #cboxTopLeft{width:21px; height:21px; background:transparent url(../images/controls.png) -100px 0 no-repeat;}
    #cboxTopRight{width:21px; height:21px; background:transparent url(../images/controls.png) -129px 0 no-repeat;}
    #cboxBottomLeft{width:21px; height:21px; background:transparent url(../images/controls.png) -100px -29px no-repeat;}
    #cboxBottomRight{width:21px; height:21px; background:transparent url(../images/controls.png) -129px -29px no-repeat;}
    #cboxMiddleLeft{width:21px; background:transparent url(../images/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:transparent url(../images/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:transparent url(../images/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:transparent url(../images/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff;}
        #cboxLoadedContent{margin-bottom:28px;padding-top:30px;}
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; bottom:0; left:0px; background:url(../images/controls.png) -75px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious.hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; bottom:0; left:27px; background:url(../images/controls.png) -50px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext.hover{background-position:-50px -25px;}
        #cboxLoadingOverlay{background:url(../images/loading_background.png) center center no-repeat;}
        #cboxLoadingGraphic{background:url(../images/loading.gif) center center no-repeat;}
        #cboxClose{position:absolute; top:-20px; right:-15px; background:url(../images/controls.png) -25px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxClose.hover{background-position:-25px -25px;}


.cboxIE #cboxTopLeft{filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=Images/borderTopLeft.png, sizingMethod='scale');}
.cboxIE #cboxTopCenter{filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=Images/borderTopCenter.png, sizingMethod='scale');}
.cboxIE #cboxTopRight{filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=Images/borderTopRight.png, sizingMethod='scale');}
.cboxIE #cboxBottomLeft{filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=Images/borderBottomLeft.png, sizingMethod='scale');}
.cboxIE #cboxBottomCenter{filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=Images/borderBottomCenter.png, sizingMethod='scale');}
.cboxIE #cboxBottomRight{filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=Images/borderBottomRight.png, sizingMethod='scale');}
.cboxIE #cboxMiddleLeft{filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=Images/borderMiddleLeft.png, sizingMethod='scale');}
.cboxIE #cboxMiddleRight{filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=Images/borderMiddleRight.png, sizingMethod='scale');}