@import "reset.css";

@font-face {
    font-family: "Century Gothic";
    src: url("fonts/century_gothic.eot") /* IE */
}
@font-face {
    font-family: "Century Gothic";
    src: url("fonts/century_gothic.ttf") /* CSS3 browsery */
}


a{
    color:#8b0000;
    text-decoration: underline;
}
a:hover{
    color: #fff;
}
a:visited{
    color: black;
}
a:focus{
    border:none;
}

h1,h2,h3,h4,h5,h6{
    font-family: "Impact";
}
br{
    margin-bottom: 5px;
}
p{
    font-size:14px;
    line-height: 17px;
    margin-bottom: 10px;;
}
h3{
    padding-left: 15px;
    height: 30px;
    line-height: 35px;
}

em{
    font-style: oblique;
    color: #cbcdcf;
}


.headlineTab{
    box-shadow: 0 -2px 2px #000 inset;
    background-color: #8b0000;
    border-radius: 5px 5px 0 0;
}


.clear{
    clear: both;
}

body{
    font-family: "Century Gothic";
    color: white;
    background: url("../img/YGO_background.jpg") top center no-repeat #000;
}

#container{
    position: relative;
    width: 980px;
    margin:auto;
}

#head{
    position: relative;
    height: 370px;
    /*border: 1px solid white;*/
}

#head #logo{
    position: absolute;
    top:230px;
    left: 10px;
}

#head #menu{
    font-family: "Impact";
    position: absolute;
    bottom: 0;
    right: 0px;
    width: 515px;
    height: 33px;
    /*border: 1px solid white;*/
    text-align: center;
    vertical-align: middle;
}

#head #menu a {
    /*border: 1px dotted green;*/
    font-size: 20px;
    line-height: 30px;
    color: white;
    display: inline-block;
    text-decoration: none;
    width: 150px;
    height: 33px;
    margin-left:-53px;
    padding-right: 53px;
    padding:0;
    background: url("../img/menu_element_basic.png") no-repeat top center;
}
#head #menu a.right{
    background-image:url("../img/menu_element_basic_end.png");
    margin-left:-49px;
}

#head #menu a:hover{
    background-image: url("../img/menu_element_active.png");
    text-shadow: 2px 2px 2px #000;
}
#head #menu a.active{
    background-image: url("../img/menu_element_active.png");
    text-shadow: 2px 2px 2px #000;
}

#head #menu a.right:hover{
    background-image: url("../img/menu_element_active_end.png");
}

#content{
    margin:10px 20px 0 10px;
    min-height: 400px;
    width: 966px;
}

#content #leftPanel{
    width: auto;
    /*min-height: 400px;*/
    /*margin-left:20px;*/
    float: left;
    /*border: 1px solid red;*/
}

#content #rightPanel{
    position: relative;
    /*width: 360px;*/
    /*min-height: 400px;*/
    margin-right: 5px;
    float: right;
    /*border: 1px solid red;*/
}

#content #newsSpace{
    float: left;
    margin-top:20px;
    width: 600px;
    height: 236px;
    background-color: #2f2e2e;
    border-radius: 5px;

}
#newsSpace h2{
    padding: 8px;
}

#newsSpace .newsText{
    padding:10px;
    float: right;
    width: 370px;
    float: right;
    margin-right: 10px;
    /*border: 1px solid red;*/
}

#newsSpace .newsImg{
    position: relative;
    width: auto;
}
#newsSpace .newsImg img{
    float: left;
    margin:10px 0 10px 10px;
    width: 183px;
    height: 183px;
    right:10px;
}

#fbWrapper{
    border: 1px solid #2f2e2e;
    border-radius: 5px;
    background-color: #2f2e2e;
    width: 350px;
    height: 595px;
}
#fbHeaderReplacer{
    position: absolute;
    left:0px;
    top:-2px;
    width: 351px;
    height: 42px;
    /*background-color: #000;*/
    z-index: 100;
}
#fbHeaderReplacer h2{
    text-align: center;
    line-height: 38px;
}
div.fb-like-box{
    background-color: #2f2e2e;
}
#fbLikeIframe{
    border:none;
    overflow:hidden;
    width:640px;
    height:600px;
    background-color: #2f2e2e;
    border-radius: 5px;
}



.leftPanelContent{
    width: 600px;
    /*padding: 10px;*/
    background-color: #2f2e2e;
    border-radius: 5px;
}
#gallery{

}
/*uni content pane*/
 .contentPane{
    background-color: #2f2e2e;
    border-radius: 5px;
    width: 925px;
    padding:10px 20px 20px 15px;
    line-height: 18px;
}


#aboutGame p a{
    font-style:italic;
}

#products{

    /*padding-left: 20px;*/
}
#products #pager{
    margin: 10px;
    min-width: 50px;;
    float: right;
    box-shadow: 2px -2px 2px #000 inset;
    display: inline;

    padding: 5px;
    margin-top:0px;
    border-radius: 5px 0 0 5px;

}
#products #pager a{
    display: inline-block;
    text-decoration: none;
    text-align: center;
    box-shadow: 1px 1px 1px #000 inset;;
    line-height: 20px;
    width: 20px;
    height: 20px;
    border-radius: 15px;
    background-color: #2f2e2e;
    margin-right: -3px;
}
#products #pager a.active{
    background-color: #8b0000;
}
#products #pager a:hover{
    background-color: #8b0000;
}


#products .product{
    position: relative;
    width: 470px;
    border-radius: 5px;
    height: 300px;
    float: left;
    margin: 0 0px 10px 10px;
    background-color: #2f2e2e;
    /*border: 1px dotted green;*/
    z-index: 15;
}
.product h2{
    font-size:18px;
    text-align: left;
    border-radius: 5px 5px 0 0;
    padding: 10px 10px;
    background-color: #8b0000;
    color: white;
    box-shadow: 0 -2px 2px #000 inset;
}

.product img{
    position: absolute;
    width: 150px;
    height: 250px;
    right:10px;
    bottom: 10px;
    /*border: 1px dotted green;*/
}

.productDetail{
    font-size: 12px;
    line-height: 18px;
    width: 270px;
    font-weight: 200;
    color: white;
    padding: 10px 20px 0 20px ;
}

.productDetail > p{
    width: 285px;
    height: 150px;
    padding:5px;
    background: #2f2e2e;
    border-radius: 5px;
}

.product .buyCorner{
    position: absolute;
    bottom:0;
    left:0;
    width: 60px;
    height: 60px;
    background-color: #8b0000;
    border-radius: 0 60px 0 5px;
    box-shadow: -2px 2px 2px #000 inset;
    z-index: -1;
}

.product .productBottomLine{
    position: absolute;
    width: 470px;
    height: 40px;
    border-radius:0 0 5px 5px;
    line-height: 40px;
    text-align: center;
    background-color: #1d1a19;
    left:0;
    bottom: 0;
    z-index: -2;
}


.product .buyCorner a{
    display: block;
    color:white;
    text-decoration: none;
    line-height: 77px;
    margin-left: 3px;
    font-weight: 900;
    font-size: 12px;
    transform:rotate(45deg);
    -ms-transform:rotate(45deg); /* IE 9 */
    -moz-transform:rotate(45deg); /* Firefox */
    -webkit-transform:rotate(45deg); /* Safari and Chrome */
    -o-transform:rotate(45deg); /* Opera */
}
/*.productDetail img.priceBg{*/
    /*position:absolute;*/
    /*z-index: 0;*/
    /*bottom:-5px;*/
    /*right: -5px;*/
    /*width:82px;*/
    /*height: 86px;*/
/*}*/
.productDetail .priceBlock{
    font-family: Impact;
    width:82px;
    height: 86px;
    background: url("../img/produkty_cena.png") no-repeat center;
    position:absolute;
    top:220px;
    left:395px;

}
.priceBlock p{
    /*border:1px solid black;*/
    font-size:25px;
    /*font-weight: bold;*/
    text-align: center;
    /*padding:25px;*/
    margin:27px 0px 0px 5px;
    transform:rotate(-30deg);
    -ms-transform:rotate(-30deg); /* IE 9 */
    -moz-transform:rotate(-30deg); /* Firefox */
    -webkit-transform:rotate(-30deg); /* Safari and Chrome */
    -o-transform:rotate(-30deg); /* Opera */
}
.priceBlock p span{
    display:block;
    /*text-align: right;*/
    font-size: 20px;
    margin:5px 0 0 4px;
}

#content #rules{

}
#content .contentPane p{
    margin-bottom: 13px;
}
#content .contentPane h2{
    margin-bottom: 5px;
}
h1{
    font-size:24px;
    margin: 15px 0 15px 0 ;
}

h2{
    font-size:20px;
    font-weight: normal !important;
    border-radius: 0 5px 5px 0;
    color: #cbcdcf;
}

#rules .ruleBlock h2{
    display:inline-block;
    background-color:#8b0000;
    margin-left:-15px;
    box-shadow: -2px 2px 2px #000 inset;
    padding:7px 15px;
    margin-bottom: 10px;
}
#rules .ruleBlock h3{
    font-family: "Century Gothic";
    color:#ffc0cb;
    font-weight: bold;
    text-shadow: 2px 2px 3px #000;
    margin:0 0 0 -15px;
    text-transform: uppercase;
}

#rules .ruleBlock{
    margin:10px 0px;
}
#rules em{
    font-style: italic;
}
#rules .ruleBlock a{
    color:#8b0000;
    font-weight: bold;
}
#rules ul{
    margin-bottom: 10px;
}
#rules ul li{
    list-style-type: disc;
    margin-left: 20px;
}
#rules ul li{
    font-size:14px;
}
#rules ul.numbered li{
    list-style-type: decimal;
    font-weight: bold;
}
#rules ul li p{
    font-weight: 100;
}

#tournaments{
    background-color: #2f2e2e;
    border-radius: 5px;
    width: 925px;
    padding:10px 20px 20px 15px;
    line-height: 18px;
}

#tournaments table{
    font-size: 14px;
    width: 920px;
    border-collapse: collapse;
}


#tournaments table th#nameCol{
    border-radius: 5px 0 0 0; /*left corner radius*/
    width: 20%;
}
#tournaments table th#cityCol{
    width: 20%;
}
#tournaments table th#dateCol{
    width:15%;
}
#tournaments table th#pscCol{
    width: 9%;
}
#tournaments table #streetCol{
    width: 30%;
}
#tournaments table #emailCol{
    border-radius: 0 5px 0 0; /*right corner radius*/
    /*width: 3%;*/
}

#tournaments table thead{
    box-shadow: 0px -2px 2px #000 inset;
}
#tournaments table thead th{
    background-color: #8b0000;
    /*text-align: center;*/
    padding: 4px 15px;
    font-weight: 900;
}
#tournaments a{
    text-decoration: none;
    color:#fff;
}
#tournaments a img{
    width: 16px;

}

#tournaments a.email{
    display: block;
    margin:auto;
    width:16px;
    height: 16px;
    background: url("../img/email_ico.png") no-repeat center;
}
#tournaments a.email:hover{
    background-image: url("../img/email_ico_on.png");
}

#tournaments table td{
    padding: 4px 15px;
}
#tournaments table tr{
    border-bottom: 1px solid black;
}
/*#tournaments table tr.even{*/
    /*background-color: #4d423f !important;*/
/*}*/

#tournaments tr.tournamentDetail td{
    position: relative;
    z-index:10;
    text-indent:0px;
    color:#CCCCCC;
    border-top:1px solid transparent;
    font-style: italic;
    padding-top:0px;
    display:none;
}
#tournaments tr.active{
    background-color: #111 !important;
    border-radius: 0 0 5px 5px;
}
/*rozklikavac*/
#tournaments td span{
    font-size: 10px;
    color:#ffc0cb;
}
#tournaments td span:hover{
    cursor: pointer;
}


div.moreInfo{
    background-color: #cbcdcf;
    width: 960px;
    padding: 10px 0;
    margin-left: -15px;
    margin-bottom: -20px;
    border-radius: 0 0 5px 5px;
    box-shadow: 0px 2px 2px #000 inset;
}
.moreInfo a{
    font-weight: bold;
}

.moreInfo a:visited{
    color: #8b0000;
}
.moreInfo a:hover{
    color: #000;

}
.moreInfo{
    color: #000;
    text-align: center;
}
.moreInfo h2{
    color: #000;
    text-align: center;
}
#footer{
    width: 960px;
    margin-top:10px;
    clear: left;
    text-align: center;
}

#footer img{
    margin-bottom: -8px;
}

#footer p{
    margin-bottom: 5px;
}
#footer a{
    text-decoration: underline;
    color: #CCCCCC;
}
#footer a:hover{
    color:#8b0000;
}
#footer a.iEye:hover{
    color:#0078a3;
}


/* slider modifications */
div#my-slider>div>div>div>ul>li>div>div>div{
    font-family: 'Tahoma';
    font-weight: 900;
    font-size:14px !important;
}

div.slide-arrows a{
    top:150px !important;
}

.corner-bottom-red .slide-wrapper{
    border:none !important;
    box-shadow: none !important;
    background-color: #000 !important;
}