@import 'reset.css';
@import 'fonts.css';
@import 'cusel.css';

html, body{
	background:url(../img/bg/history-bg.jpg) 50% -31px no-repeat #000;
}

.layoutWrapper{
	position:relative;
	min-height:100%;
	min-width:1000px;
	max-width:1560px;
	margin:0 auto;
	overflow:hidden;
	z-index:15;
}
.row{
    position:relative;
	width:960px;
	margin:0 auto;
}

.menuWrapper{
    position:fixed;
	width:100%;
    height:88px;
    left:0;
    top:-88px;
    padding:0 0 30px 0;
	font-size:0;
	line-height:0;
	z-index:105;
}
.menuOverlay{
    position:fixed;
    display:none;
    width:100%;
    height:100%;
    left:0;
    top:0;
    background:url(../img/bg/menu-overlay.png);
    z-index:104;
}
.menuOverlay.active{
    display:block;
}
.menuWrapper .menu-toggle{
    display:block;
    position:absolute;
    bottom:0;
    left:50%;
    width:73px;
    height:30px;
    color:#fff;
    font:12px/30px 'pf_din_text_cond_promedium', sans-serif;
    text-transform:uppercase;
    text-decoration:none;
    text-align:center;
    margin-left:407px;
    background:url(../img/bg/history-menu.png) 0 0 no-repeat;
    overflow:hidden;
}
.menuWrapper .menu-toggle.active{
    background:url(../img/bg/history-menu.png) 0 -30px no-repeat;
}
.menuWrapper .main-menu,
.menuWrapper .sub-menu{
    position:relative;
    list-style-type: none;
    margin:0;
    padding:0;
    line-height:100%;
    z-index:10;
}
.menuWrapper .main-menu{
    height:42px;
    font:19px 'pf_din_text_cond_promedium', sans-serif;
    background:url(../img/bg/main-menu.gif) 0 0 repeat-x;
    text-transform: uppercase;
}
.menuWrapper .main-menu li,
.menuWrapper .sub-menu li{
    float:left;
}
.menuWrapper .main-menu li a,
.menuWrapper .sub-menu li a{
    color:#fff;
    text-decoration:none;
}
.menuWrapper .main-menu > li{
	height:42px;
    border-left:1px solid #af080e;
    z-index:5;
}
.menuWrapper .main-menu > li:last-child > a{
	padding-right:27px!important;
	margin-right:-12px;
	background:url(../img/bg/recommend.png) 100% 50% no-repeat;
}
.menuWrapper .main-menu > li > a{
    display:block;
    padding:11px 18px;
}
.menuWrapper .main-menu > li:hover > a{
	color: #810001;
}
.menuWrapper .main-menu > li.active{
    background: url(../img/bg/v_a_menu_li.png) 0 0 repeat-y;
	padding:0 0 0 9px;
	margin:0 0 0 -9px;
	border-left:0;
	z-index:10;
}
.menuWrapper .main-menu > li.active > a{
	position:relative;
	background: url(../img/bg/v_a_menu_a.png) 100% 0 repeat-y;
	padding-right:27px;
	margin-right:-9px;
}
.menuWrapper .main-menu > li.active + li{
	z-index:5;
}
.menuWrapper .main-menu > li.active:hover > a{
	color:#fff;
}
.menuWrapper .sub-menu{
	position:absolute;
	left:0;
	top:41px;
	height:48px;
    background:#191919;
    font:16px 'pf_din_text_cond_proregular';
    padding:0 13px;
    color:#828282;
	text-transform: none;
}
.menuWrapper li.active .sub-menu{
	display:block!important;
}
.menuWrapper li:hover .sub-menu{
	z-index:15;
}
.menuWrapper .sub-menu:before,
.menuWrapper .sub-menu:after{
	content:"";
	display:block;
	position:absolute;
	width:6px;
	height:6px;
	bottom:-6px;
	overflow:hidden;
}
.menuWrapper .sub-menu:before{
	left:0;
	background:url(../img/bg/sub-arr-left.png) 0 0 no-repeat;
}
.menuWrapper .sub-menu:after{
	right:0;
	background:url(../img/bg/sub-arr-right.png) 0 0 no-repeat;
}
.submenuWrapper{
	display:none;
	background:#1a1b1c;
	overflow:hidden;
}
.menuWrapper .main-menu .sub-menu{
	display:none;
	position:absolute;
	width:100%;
	margin:0 -6px;
	padding:0 6px;
}
.menuWrapper .sub-menu li{
	background:none;
	z-index:5;
}
.menuWrapper .sub-menu li:first-child{
	margin-left:20px;
}
.menuWrapper .sub-menu li.active{
	z-index:10;
}
.menuWrapper .sub-menu li a{
    display:block;
    padding:15px 12px!important;
    color:#d1d1d1;
}
.menuWrapper .sub-menu li a:hover{
	color:#fff;
}
.menuWrapper .sub-menu li.active,
.menuWrapper .sub-menu li.active a{
    color:#fff;
}

header.layout{
	padding:35px 0;
	height:105px;
    overflow:hidden;
	clear:both;
}
header.layout .logos{
	clear:both;
}
header.layout .logo{
    width:370px;
    float:left;
    padding:9px 20px 50px 20px;
}
header.layout .services{
    position:relative;
    overflow:hidden;
    text-align:right;
	margin-top:20px;
}

header.layout .services .sponsor{
    clear:right;
    margin:20px 0 30px 0;
}
header.layout .services .sponsor img{
    vertical-align: middle;
    margin:0 0 0 20px;
}

div.fix-tabs-info{
    display:block;
	position:fixed;
    width:895px;
    height:60px;
    left:50%;
	top:216px;
	margin-left:-335px;
	line-height:0;
	font-size:0;
    padding:0 8px 0 0;
    background:url(../img/bg/history-period-menu-shadow.png) -40px 0 no-repeat;
    z-index:103;
}
div.fix-tabs-info menu{
    float:left;
	list-style-type:none;
	margin:0 0 0 8px;
	padding:0;
	color:#858585;
	text-transform:uppercase;
    font-size:0;
    line-height:0;
    background:url(../img/bg/history-info-menu.gif) 0 0 repeat-x;
}
div.fix-tabs-info menu li{
    position:relative;
	display:inline-block;
    margin-right:-10px;
    padding:0 0 0 18px;
	font:14px/30px 'pf_din_text_cond_promedium', sans-serif;
    background:url(../img/bg/history-info-menu-sep.png) 0 0 no-repeat;
    z-index:5;
}
div.fix-tabs-info menu li a{
    padding:0 26px 0 9px;
    background:url(../img/bg/history-period-menu.png) 100% 0 no-repeat;
}
div.fix-tabs-info menu li.active{
    background:#cd000a;
    color:#fff;
    background:url(../img/bg/history-period-menu-a-l.png) 0 0 no-repeat;
    z-index:10;
}
div.fix-tabs-info menu li.active a{
    color:#fff;
    background:url(../img/bg/history-period-menu-a.png) 100% 0 no-repeat;
}
div.fix-tabs-info menu li.active.last a{
    background:url(../img/bg/history-period-menu-a-last.png) 100% 0 no-repeat;
}
div.fix-tabs-info menu li:first-child{
	padding:0 27px;
    margin:0 0 0 -8px;
    background:url(../img/bg/history-info-menu-left.png) 0 0 no-repeat;
}
div.fix-tabs-info a{
	display:block;
	color:#1a1b1c;
	text-decoration:none;
    padding-right:18px;
    background:url(../img/bg/history-period-menu.png) 100% 0 no-repeat;
}

div.fix-tabs-period{
    position:fixed;
    width:96px;
    left:50%;
    top:216px;
    padding:0 6px;
    margin-left:-480px;
    z-index:103;
}
div.fix-tabs-period menu{
	list-style-type:none;
	margin:0;
	padding:0;
}
div.fix-tabs-period menu > li{
    font:20px/30px 'pf_din_text_cond_promedium', sans-serif;
    color:#929191;
}
div.fix-tabs-period menu > li a{
    color:#dadada;
    text-decoration:none;
}
div.fix-tabs-period menu > li > menu{
    margin:0 2px 15px;
}
div.fix-tabs-period menu > li > menu > li{
    font:14px/15px 'pf_din_text_cond_promedium', sans-serif;
    margin:0 0 2px;
}
div.fix-tabs-period menu > li > menu > li.active{
    background:url(../img/bg/history-period.png) 3px 0 no-repeat;
}
div.fix-tabs-period menu > li > menu > li a{
    padding:0 7px;
}

nav.footer{
    position:fixed;
    display:block;
    width:100%;
    left:0;
    bottom:0;
    margin:0;
    padding:0;
    background:#2d3032;
    z-index:103;
}
nav.footer a{
    position:relative;
    display:inline-block;
    color:#8d8d8d;
    padding:0 0 0 40px;
    margin:0 15px 0 5px;
    font:14px/30px 'pf_din_text_cond_promedium', sans-serif;
    text-decoration:none;
    background:url(../img/bg/history-switch.png) 0 50% no-repeat;
}
nav.footer a:hover{
    color:#fff;
}
nav.footer a span.icon{
    display:block;
    position:absolute;
    width:40px;
    height:30px;
    left:0;
    top:0;
}
nav.footer a.event span.icon{
    background:url(../img/bg/history-event.png) 0 50% no-repeat;
}
nav.footer a.main-event span.icon{
    background:url(../img/bg/history-main-event.png) 0 50% no-repeat;
}
nav.footer a.active span.icon{
    background-position:80% 50%;
}

.contentWrapper{
	padding:0 0 55px 0;
}
.contentWrapper .row section.period{
	padding:256px 0 0;
	margin-left:144px;
	color:#dadada;
}
.contentWrapper .row + .row section.period{
	padding:156px 0 0;
	background: url(../img/bg/history-timeline.gif) 50% 0 repeat-y;
}
section.period .headline{
    background:#1a1b1c;
    padding:40px;
    font:14px/20px 'pf_din_text_cond_proregular', sans-serif;
    color:#dadada;
    border-bottom:3px solid #c90118;
}
section.period .headline .preamble{
    font:16px/18px 'pf_din_text_cond_proregular', sans-serif;
    width:498px;
    margin:-150px -40px 30px 30px;
    float:right;
}
section.period .headline h2{
    font: normal 30px/30px 'pf_din_text_cond_promedium', sans-serif;
    margin:0 0 15px 0;
    text-transform:uppercase;
}
section.period .headline .preamble h3{
    font: 16px/18px 'pf_dindisplay_proMdIt', sans-serif;
    text-align:right;
    margin:0 15px 15px 0;
}
section.period .headline .preamble p{
    margin:0;
    padding:0;
}
section.period .headline .preamble p.strong{
    font-size:30px;
    line-height:30px;
}
section.period .headline .preamble p .figure-line{
    position:relative;
    display:inline-block;
    background:#dd000b;
    vertical-align:top;
    margin:0 0 1px 0;
    padding:0 10px;
}
section.period .headline .preamble p .figure-line .r{
    display:block;
    position:absolute;
    top:0;
    right:-7px;
    width:7px;
    height:100%;
    background:url(../img/bg/sel-corner.png) 100% 0 no-repeat;
}
section.period .timeline{
    background:url(../img/bg/history-timeline.gif) 50% 0 repeat-y;
    padding:30px 0 0;
    overflow:hidden;
	clear:both;
}
section.period .timeline .item{
    width:384px;
    font:14px/18px 'pf_din_text_cond_proregular', sans-serif;
    background:#dadada;
    color:#1a1b1c;
    margin:0 0 25px 0;
}
section.period .timeline .item.dark{
    background:#393b3e;
    color:#dadada;
}
section.period .timeline .item.red{
    background:#dd000b;
    color:#fff;
}
section.period .timeline .item.left{
    float:left;
    clear:left;
}
section.period .timeline .item.right{
    float:right;
    clear:right;
}
section.period .timeline .item.left + .item.right{
    margin-top:66px;
}
section.period .timeline .item h2{
    position:relative;
    font: normal 50px/50px 'pf_din_text_cond_promedium', sans-serif;
    padding:15px 0;
    margin:-15px 0;
    
}
section.period .timeline .item.left h2{
    position:relative;
    padding-right:41px;
    margin-right:-41px;
    background:url(../img/bg/h2-history-left.png) 100% 50% no-repeat;
}
section.period .timeline .item.left.dark h2{
    background-image:url(../img/bg/h2-history-left-dark.png)
}
section.period .timeline .item.right.dark h2{
    background-image:url(../img/bg/h2-history-right-dark.png)
}
section.period .timeline .item.left.red h2{
    background-image:url(../img/bg/h2-history-left-red.png)
}
section.period .timeline .item.right.red h2{
    background-image:url(../img/bg/h2-history-right-red.png)
}
section.period .timeline .item.right h2{
    position:relative;
    padding-left:41px;
    margin-left:-41px;
    background:url(../img/bg/h2-history-right.png) 0% 50% no-repeat;
}
section.period .timeline .item h2::before{
    position:absolute;
    display:block;
    top:50%;
    content:'';
    width:18px;
    height:18px;
    margin-top:-9px;
    background:url(../img/bg/history-event.png) 50% 50% no-repeat;
}
section.period .timeline .item.red h2::before{
    background:url(../img/bg/history-main-event.png) 50% 50% no-repeat;
}
section.period .timeline .item.left h2::before{
    right:-27px;
}
section.period .timeline .item.right h2::before{
    left:-27px;
}
section.period .timeline .item h2::after{
    position:absolute;
    display:block;
    content:'';
    width:48px;
    height:6px;
    left:0;
    top:0;
    background:#dd000b;
}
section.period .timeline .item.right h2::after{
    left:41px;
}
section.period .timeline .item.red h2::after{
    background:#fff;
}
section.period .timeline .item .photo{
    position:relative;
    font-size:0;
    line-height:0;
}
section.period .timeline .item .info{
    padding:35px;
}
section.period .timeline .item .header{
    padding:35px;
}
section.period .timeline .item .info .header{
    padding:0;
}
section.period .timeline .item p.photo-desc{
    float:right;
    max-width:260px;
    font-size:16px;
    line-height:16px;
    padding:0;
    margin:-15px -20px 0 0;
    text-align:right;
}
section.period .timeline .item .info .header p.photo-desc{
    margin-top:-2px;
}

section.period .timeline .incut{
    clear:both;
    font:14px/20px 'pf_din_text_cond_proregular', sans-serif;
    background:#dadada;
    color:#1a1b1c;
    margin:0 0 25px 0;
    padding:35px;
    color:#0c0c0d;
    border-top:3px solid #c90118;
}
section.period .timeline .incut.last{
    margin:0;
}
section.period .timeline .incut h2{
    font:30px/30px 'pf_din_text_cond_promedium', sans-serif;
    margin:0 0 20px 0;
}

section.popup{
    display:none;
    position:absolute;
    width:1510px;
    top:60px;
    left:50%;
    height:918px;
    margin-left:-755px;
    background:url(../img/bg/history-popup.png) 25px 0 no-repeat;
    z-index:102;
}
section.popup header{
    position:absolute;
    width:100%;
    left:0;
    top:0;
    opacity:0.6;
    text-align:center;
    font:230px/100% 'pf_din_text_cond_promedium', sans-serif;
    color:#3e4144;
}
section.popup a.close{
    position:absolute;
    width:21px;
    height:21px;
    left:0;
    top:20px;
    background:url(../img/bg/close.png) 0 0 no-repeat;
    z-index:10;
}
section.popup .content{
    position:relative;
    width:816px;
    padding:225px 0 0 144px;
    margin:0 auto;
}
section.popup .content .tab-item{
    display:none;
}
section.popup .content .tab-item .years{
    overflow:hidden;
    font:16px/24px 'pf_din_text_cond_proregular', sans-serif;
    color:#fff;
}
section.popup .content .tab-item .years a{
    float:left;
    width:86px;
    color:#fff;
    margin:0 -4px 1px 0;
    text-decoration:none;
    text-align:center;
    background:url(../img/bg/history-year.png) 50% 0 no-repeat;
}
section.popup .content .tab-item .years a.active{
    background:none;
    color:#66696e;
}
section.popup .content .achivements{
    width:580px;
    padding:0 40px;
    text-align:center;
    font:24px/30px 'pf_din_text_cond_proregular', sans-serif;
    color:#dadada;
}
section.popup .content .achivements .achivements-content{
    height:650px;
}
section.popup .content .achivements h3{
    font:100px/125px 'pf_din_text_cond_proregular', sans-serif;
    margin:0 0 25px 0;
    background:url(../img/bg/h3-achivements.png) 50% 100% no-repeat;
}
section.popup .content .staff .s-content{
    position:absolute;
    left:193px;
    top:272px;
    width:846px;
    height:665px;
    background:url(../img/bg/history-staff.png) 0 0 no-repeat;
}
section.popup .content .staff .s-content + .s-content{
	display:none;
}
section.popup .content .staff .s-content ul.tb{
    position:absolute;
    width:210px;
    top:0;
    left:20px;
    list-style-type:none;
    z-index:10;
}
section.popup .content .staff .s-content ul.tb li{
    display:block;
    width:202px;
    height:91px;
    margin:0 0 7px 0;
    padding:0 0 0 8px;
}
section.popup .content .staff .s-content ul.tb li img{
    opacity:0.2;
}
section.popup .content .staff .s-content ul.tb li.active{
    background:url(../img/bg/history-staff-tab.png) 0 0 no-repeat;
}
section.popup .content .staff .s-content ul.tb li.active img{
    opacity:1;
}
section.popup .content .staff .s-content ul.tb li + li{ margin-left:-24px; }
section.popup .content .staff .s-content ul.tb li + li + li{ margin-left:-48px; }
section.popup .content .staff .s-content ul.tb li + li + li + li{ margin-left:-72px; }
section.popup .content .staff .s-content ul.tb li + li + li + li + li{ margin-left:-96px; }
section.popup .content .staff .s-content ul.tb li + li + li + li + li + li{ margin-left:-120px; }
section.popup .content .staff .s-content ul.tb li + li + li + li + li + li + li{ margin-left:-144px; }
section.popup .content .staff .s-content ul.tb li + li + li + li + li + li + li + li{ margin-left:-168px; }
section.popup .content .staff .s-content .s-content-tab{
    position:relative;
    margin:45px 200px;
    height:575px;
    font:12px/18px Arial, sans-serif;
    color:#66686c;
    overflow:hidden;
    z-index:20;
}
section.popup .content .staff .s-content .s-content-tab {
	color:#fff;
}
section.popup .content .staff .s-content .s-content-tab + .s-content-tab{ display:none; }
section.popup .content .staff .s-content .s-content-tab h3{
    font:30px/36px 'pf_din_text_cond_proregular', sans-serif;
    color:#fff;
    margin:0 0 10px 0;
}
section.popup .content .staff .s-content .s-content-tab p{
    margin:0 0 15px 0;
}

section.popup .content .playmakers{
    
}
section.popup .content .playmakers .item{
    padding:10px 20px;
    overflow:hidden;
}
section.popup .content .playmakers .item .position{
    width:120px;
    float:left;
    text-align:left;
    font:18px/24px 'pf_din_text_cond_proregular', sans-serif;
    color:#9b9c9e;
}
section.popup .content .playmakers .item .person{
    font:16px/24px 'pf_din_text_cond_proregular', sans-serif;
    overflow:hidden;
    color:#fff;
}

section.popup .content .tables .table_wrapper{
	width:660px;
	color:#dadada;
}
section.popup .content .tables table.decor{
    width:100%;
    border-collapse:collapse;
    font:12px Arial, sans-serif;
    color:#dadada;
}
section.popup .content .tables table.decor th{
    color:#858585;
    font-weight:normal;
}
section.popup .content .tables table.decor th,
section.popup .content .tables table.decor td{
    padding:5px 15px;
}
section.popup .content .tables table.decor tbody tr td{
    background:#3d4043;
    border-left:1px solid #37393c;
    border-top:1px solid #37393c;
    text-align:left;
    vertical-align:middle;
}
section.popup .content .tables table.decor tbody tr:first-child td{
    background:url(../img/bg/history-table-first.png) 0 0 repeat-x #3d4043;
    border-top:0;
}
section.popup .content .tables table.decor tbody tr td:first-child{
    border-left:0;
}

.popupOverlay{
    position:fixed;
    display:none;
    width:100%;
    height:100%;
    left:0;
    top:0;
    background:url(../img/bg/over4.png);
    z-index:100;
}
.popupOverlay.active{
    display:block;
}

section.popup .content .tables .table_wrapper{
    height:650px;
}
section.popup .content .tables .table_wrapper .head-form-wrapper{
	display:inline-block;
	width:100%;
	margin:0 0 24px 0;
}
section.popup .content .tables .table_wrapper .season{
    float:right;
	visibility:hidden;
    font-size:13px;
    padding-top:10px;
	color:#f4f4f4;
}
section.popup .content .tables .table_wrapper .season span.name{
    font:16px 'pf_din_text_cond_proregular';
    vertical-align:middle;
}
section.popup .content .tables .table_wrapper .season .cusel{
    width:100px!important;
    margin-left:5px;
}
section.popup .content .tables .table_wrapper .season span.name{
    font:16px 'pf_din_text_cond_proregular';
    vertical-align:middle;
}
section.popup .content .tables .table_wrapper .season .cusel .cuselFrameRight{
	background-color:#1e1f22;
}
section.popup .content .tables .table_wrapper .head-form-wrapper .options{
	float:left;
	padding-top:10px;
}
section.popup .content .tables .table_wrapper .head-form-wrapper .options input[type="radio"]{
	vertical-align:middle;
	margin:0 10px 0 0;
	padding:0;
}
section.popup .content .tables .table_wrapper .head-form-wrapper .options label{
	padding:3px 0 3px 25px;
	margin:0 30px 0 0;
	color:#818181;	
	background:url(../img/bg/radio.png) 0 -45px no-repeat;
	font:16px 'pf_din_text_cond_proregular';
	color:#f3f3f3;
	cursor:pointer;
}
section.popup .content .tables .table_wrapper .head-form-wrapper .options input[type="radio"]{
	display:none;
}
section.popup .content .tables .table_wrapper .head-form-wrapper .options label.active,
section.popup .content .tables .table_wrapper .head-form-wrapper .options input[type="radio"]:checked + label{
	background:url(../img/bg/radio.png) -48px 1px no-repeat;
	color:#ff0000;
}

section.popup .content .tables .table_wrapper .table_season{
	display:none;
}


.gl-tabs > ul{
    overflow:hidden;
    list-style-type:none;
	margin:0 0 15px 0;
}
.gl-tabs > ul li{
    float:left;
	background:#2d3032!important;
	padding:0!important;
	margin:0!important;
	text-align:center;
}
.gl-tabs > ul.i-2 li{
	width:50%;
}
.gl-tabs > ul li a{
    display: block;
    color:#b2b2b2!important;
    text-decoration:none;
    font:15px/100% 'pf_din_text_cond_proregular';
    text-transform: uppercase;
    padding:14px 20px 20px;
	margin-left:1px;
	background:#2d3032;
	border-top:6px solid #4f5257;
}
.gl-tabs > ul li.ui-state-active{}
.gl-tabs > ul li.ui-state-active a{
    color:#303134;
	padding:20px;
	border:0;
	background:url(../img/bg/tab.gif) 0 0 repeat-x #45474b;
}
.gl-tabs .cnt{
    clear:left;
}