/*FONT*/
@font-face {
    font-family: 'futura';
    src: url('../font/futura.eot');
    src: local('☺'),  url('../font/futura.woff') format('woff'),  url('../font/futura.ttf') format('truetype'),  url('../font/futura') format('svg');
    font-weight: normal;
    font-style: normal;
}
 @font-face {
    font-family: '../font/dinmediumalternate';
    src: url('../font/dinmediumalternate.eot');
    src: local('☺'),  url('../font/dinmediumalternate.woff') format('woff'),  url('../font/dinmediumalternate.ttf') format('truetype'),  url('../font/dinmediumalternate') format('svg');
    font-weight: normal;
    font-style: normal;
}
/*END FONT*/


/*Style Rotate Box*/
.rotate-box {
    width:660px;
}
.rotate-box .info-box {
    width:660px;
    height:370px;
}
.rotate-box .ui-tabs .ui-tabs-panel {
    width:660px;
    height:370px;
    padding:0;
}
.rotate-box a, .rotate-box a:hover, .rotate-box a:visited, .rotate-box a:link, .rotate-box a:active, .rotate-box .ui-state-default a, .rotate-box .ui-state-default a:link {
    color:#ffffff;
}
.rotate-box .ui-tabs .ui-tabs-panel.box-1 {
    background: url(../images/ygg-660x370.jpg) no-repeat;
}
.rotate-box .ui-tabs .ui-tabs-panel.box-2 {
    background: url(../images/pp-660x370.jpg) no-repeat;
}
.rotate-box .ui-tabs .ui-tabs-panel.box-3 {
    background:url(../images/ssl-660x370.jpg) no-repeat;
}
.rotate-box .ui-tabs .ui-tabs-panel.box-4 {
    background:url(../images/phineas&ferb-660x370-r1.jpg) no-repeat;
}
.rotate-box .ui-tabs .ui-tabs-panel.box, .rotate-box .ui-corner-all {
    padding:0;
    border:none;
}
.rotate-box .tab li {
    width:120px;
    overflow:hidden;
    height:27px;
    font-size:12px;
    line-height:18px;
}
.rotate-box .ui-widget-header {
    background:none;
}
.rotate-box ul.tab {
    padding-left:0px;
    margin:0px;
    height:27px;
    padding-top:5px;
    overflow:hidden;
}
.rotate-box .additional-info {
    float:right;
    margin:90px 40px 0 0;
    border:solid 2px;
    border-radius:6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    -khtml-border-radius: 6px;
    width:378px;
    height:200px;
    background-color:#ffffff;
    padding:15px;
    -moz-box-shadow: 3px 3px 5px #666666;
    -webkit-box-shadow:5px 5px 5px #666666;
    box-shadow: 3px 3px 5px #666666;
    clear:both;
    display:none;
    background-color:#ffffff;
}

.rotate-box .additional-info .additional-info-content{
    height:180px;
}
.rotate-box .additional-info-1 {
    border-color:#ec0090;
}
.rotate-box .additional-info-2 {
    border-color:#008e4b;
}
.rotate-box .additional-info-3 {
    border-color:#70d0f6;
}
.rotate-box .additional-info-4 {
    border-color:#ffcc33;
}
.rotate-box .info-text {
    font:normal 11px/16px 'dinmediumalternate', Arial, Gadget, sans-serif;
    padding-right:140px;
    margin-bottom:10px;
    height:120px;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 200px;
}
.rotate-box .additional-info-1 .info-text {
    background: url(../images/ygg-130x109.jpg) no-repeat right top;
}
.rotate-box .additional-info-2 .info-text {
    background: url(../images/pp-130x109-3.jpg) no-repeat right top;
}
.rotate-box .additional-info-3 .info-text {
    background: url(../images/ssl-130x109.jpg) no-repeat right top;
}
.rotate-box .additional-info-4 .info-text {
    background: url(../images/phineas&ferb-130x109-r1.jpg) no-repeat right top;
}
.rotate-box .additional-info h5{
    display: block;
    font:bold 14px/20px 'DIN-MediumAlternate', Arial, Helvetica, sans-serif;
    height: 20px;
    margin: 0;
    overflow: hidden;
    padding: 0;
}
.rotate-box .additional-info h6 {
    font:bold 12px/18px 'dinmediumalternate', Arial, Helvetica, sans-serif;
    margin:0 0 10px;
    padding:0;
    display:block;
}
.rotate-box .buttons {
    font:normal 19px/19px 'futura', Verdana, Geneva, sans-serif;
}
.rotate-box .buttons a {
    background:url(../images/buttons-bg.jpg) repeat-x left top;
    height:32px;
    padding:4px 25px 4px;
    margin-right:5px;
    color:#ffffff;
    text-decoration:none;
    text-transform:uppercase;
    -moz-box-shadow: 1px 1px #000000;
    -webkit-box-shadow: 1px 1px #000000;
    box-shadow: 1px 1px #000000;
}
.rotate-box .buttons a:hover {
    background:url(../images/buttons-bg.jpg) repeat-x left bottom;
}
.rotate-box .ui-tabs .ui-tabs-nav li {
    border:none;
    color:#ffffff;
    margin:0;
    position:relative;
    font:bold 12px/18px 'dinmediumalternate', Helvetica, Arial, sans-serif;
}
.rotate-box .scroll {
    overflow: hidden;
    white-space: nowrap;
    width: 110px;
    text-overflow: ellipsis;
    color:#ffffff;
    display: inline-block;
}
.rotate-box .scroll span {
    padding:0px 2px;
}
.rotate-box div.ui-tabs .ui-tabs-nav li.ui-tabs-selected {
    padding-bottom:0px;
    z-index:10;
}
.rotate-box .ui-tabs .ui-tabs-nav li.tab-all {
    margin:0 0 0 -5px;
    padding:0;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    -moz-box-shadow: 5px 0px 5px #a9a9a9;
    -webkit-box-shadow: 5px 0px 5px #a9a9a9;
    box-shadow: 5px 0px 5px #a9a9a9;
}
.rotate-box .ui-tabs .ui-tabs-nav li.tab-1.tab-all {
    background-color:#ec0090;
    width:148px;
    margin-left:10px;
    z-index:5;
}
.rotate-box .ui-tabs .ui-tabs-nav li.tab-2 {
    background-color:#008e4b;
    width:148px;
    z-index:4;
}
.rotate-box .ui-tabs .ui-tabs-nav li.tab-3 {
    background-color:#71cff4;
    width:148px;
    z-index:3;
}
.rotate-box .ui-tabs .ui-tabs-nav li.tab-4 {
    background-color:#ffcc33;
    width:148px;
    z-index:2;
}
.ui-tabs .ui-tabs-nav li a {
    float: left;
    padding: 4px 1em;
    text-decoration: none;
    width:115px;
}