/* ============ Tab Colors ============== */
.bipod-mount-color { background: #003D4A !important; }
.light-mount-color { background: #D08922 !important; }
.sling-mount-color { background: #7B5C45 !important; }
.weapon-control-mount-color { background: #464700 !important; }
.sling-adapters-color { background: #6E6565 !important; }

.bipod-mount-tab { background: url(images/tab-bipod-mount.png) no-repeat left top !important; }
.light-mount-tab { background: url(images/tab-light-mount.png) no-repeat left top !important; }
.sling-mount-tab { background: url(images/tab-sling-mount.png) no-repeat left top !important; }
.weapon-control-mount-tab { background: url(images/tab-weapon-control-mount.png) no-repeat left top !important; }
.sling-adapters-mount-tab { background: url(images/tab-sling-adapters.png) no-repeat left top !important; }

/*
URLs used to generate the tab button images
Bipod Mount: http://www.tabsgenerator.com/#aD03MDt3PTE5MDtyPTI0O2I9MjtiYWNrPTAwMDAwMDtib3JkZXI9RjBENUJEO2ZvcmUxPTAwM0Q0QTtmb3JlMj0wMDNENEE7ZGlyPTA7Z2d0PTE7
Light Mount: http://www.tabsgenerator.com/#aD03MDt3PTE5MDtyPTI0O2I9MjtiYWNrPTAwMDAwMDtib3JkZXI9RjBENUJEO2ZvcmUxPUQwODkyMjtmb3JlMj1EMDg5MjI7ZGlyPTA7Z2d0PTE7
Sling Mount: http://www.tabsgenerator.com/#aD03MDt3PTE5MDtyPTI0O2I9MjtiYWNrPTAwMDAwMDtib3JkZXI9RjBENUJEO2ZvcmUxPTdCNUM0NTtmb3JlMj03QjVDNDU7ZGlyPTA7Z2d0PTE7
Weapon Control Mount: http://www.tabsgenerator.com/#aD03MDt3PTE5MDtyPTI0O2I9MjtiYWNrPTAwMDAwMDtib3JkZXI9RjBENUJEO2ZvcmUxPTQ2NDcwMDtmb3JlMj00NjQ3MDA7ZGlyPTA7Z2d0PTE7
Sling Adapters: http://www.tabsgenerator.com/#aD03MDt3PTE5MDtyPTI0O2I9MjtiYWNrPTAwMDAwMDtib3JkZXI9RjBENUJEO2ZvcmUxPTZFNjU2NTtmb3JlMj02RTY1NjU7ZGlyPTA7Z2d0PTE7
*/

/* ============ Tabs ============== */
div.content {
    border: #48f solid 3px;
    clear: left;
    padding: 1em;
}
#tabs-icons {
	float: left;
    padding: 0;
    margin: 0;
    padding-top: 10px;
   	width: 210px;
}
#tabs-title {
	float: left;
    padding: 0;
    padding-left: 0%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: auto;
    margin-top: auto;
    height: auto !important;
    min-height: 1em;
    overflow: hidden;
    font-size: 2.5em;
    line-height: 1em;
    text-align: center;
    width: 70%;
}
#tabs-container {
	overflow: hidden;
	width: 73%;
	float: right;
}
ol#tabs {
    min-height: 3em;
    height: auto !important;
    list-style: none;
   	padding: 0;
   	margin: 0;
   	margin-bottom: -18px;
   	margin-right: auto;
    margin-left: auto;
    overflow: hidden;
    background: #000000;    
    width: 100%;
}
ol#tabs li {
    float: left;
    margin: 0;
    padding: 0;
    text-align: center;
    width: 17%;
    background: #000000;
    padding-top: 10px;
    padding-left: 1px;
    padding-right: 1px;
    margin-right: 1%;
    margin-left: auto;
    height: 6em;
}
.tab-image-text {
	float: left; 
	position: absolute;
}
.tab-image {
	width: 100%;
	height: auto;
	z-index: -1;
}
.tab-text {
	position: absolute; 
	top: 0px; 
	left: 0px; 
	margin: 0px; 
	bottom: 0px; 
	padding: 0px;
	padding-bottom: 0px;
	padding-left: 2px;
	z-index: 1;
	width: 95%;
}
ol#tabs a {
    float: left;
    position: relative;
    height: 10em;
    text-decoration: none;
    font-size: 100%;
    margin: 0;
    padding: 0;
    top: 12px; /* 1) Number of pixels to protrude up for selected tab. Should equal (3) MINUS (2) below */
    line-height: 1em;
    color: #F0D5BD;
    font-weight: bold;
    text-align: center;
    margin-right: auto;
    margin-left: auto;
    width: 100%;
}
ol#tabs a span {
	float: left;
	display: inline;
	position: relative;
	text-align: center;
	line-height: 1em;
	padding-top: 5px;
	padding-bottom: 3px; /* 2) Padding within each tab. This value should equal (1) MINUS (3) */
	margin-right: auto;
    margin-left: auto;
    width: 100%;
}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabs a span {float:none;}
/* End IE5-Mac hack */

ol#tabs li:hover { 
	background-position: 0% -125px;
	top: 0;
}

ol#tabs a:hover {
	background-position: 0% -125px;
	top: 0;
}

ol#tabs a:hover span {
	background-position: 100% -125px;
	padding-bottom: 18px; /* 3) Bottom padding of selected tab. Should equal (1) PLUS (2) above */
	top: 0;
}

ol#tabs li.current {
	background-position: 0 -125px;
	top: 0;
}

ol#tabs li.current a {
	background-position: 0 -125px;
	top: 0;
}

ol#tabs li.current a span {
	background-position: 100% -125px;
	padding-bottom: 18px; /* 3) Bottom padding of selected tab. Should equal (1) PLUS (2) above */
	top: 0;
	color: #d45500;
}

@media screen and (min-width: 700px) {
    #tabs-title { font-size: 2.5em; padding-left: 0%; }
    ol#tabs a { font-size: 110%; }
}
@media screen and (min-width: 1050px) {
    #tabs-title { font-size: 2.75em; padding-left: 2%; }
    ol#tabs a { font-size: 130%; }
}
@media screen and (min-width: 1200px) {
    #tabs-title { font-size: 3.0em; padding-left: 6%; }
    ol#tabs a { font-size: 150%; }
}
