﻿﻿@import url(http://fonts.googleapis.com/css?family=Oswald);
@import url(http://fonts.googleapis.com/css?family=Asap);
 
.ratings {
    text-align: center;
}
.rates {
    display: inline-block;
    text-align: center;
}
.rates:before {
    display: inline-block;
    height: 100%;
}
.rates .rating {
    display: inline-block;
}
.rates .rate {
    color: #898888;
    display: block;
    font-size: 11px;
    line-height: 20px;
}
span.rating {
    background: url("../../../kuvat/spades.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    display: block;
    height: 20px;
    overflow: hidden;
    text-indent: 999px;
    width: 90px;
	margin:9px auto !important;
}
span.rating.s-0 {
    background-position: 0 -200px;
}
span.rating.s-0-5 {
    background-position: 0 -180px;
}
span.rating.s-1 {
    background-position: 0 -160px;
}
span.rating.s-1-5 {
    background-position: 0 -140px;
}
span.rating.s-2 {
    background-position: 0 -120px;
}
span.rating.s-2-5 {
    background-position: 0 -100px;
}
span.rating.s-3 {
    background-position: 0 -81px;
}
span.rating.s-3-5 {
    background-position: 0 -61px;
}
span.rating.s-4 {
    background-position: 0 -40px;
}
span.rating.s-4-5 {
    background-position: 0 -20px;
}
span.rating.s-5 {
    background-position: 0 0;
}

 #topBrands {
    margin-bottom: 20px;
	font-family: 'Oswald', sans-serif;
}
 #topBrands .row {
    margin: 0;
    padding: 0;
}
 #topBrands .col-md-3,  #topBrands .col-md-8,  #topBrands .col-md-12,  #topBrands .col-xs-12 {
    padding-left: 0;
    padding-right: 0;
}
 #topBrands ul {
    margin: 0;
    position: relative;
	list-style:none;
}
 #topBrands ul li {
    padding-left: 15px;
    position: relative;
}
 #topBrands ul li:before {
    background: none repeat scroll 0 0 #BD1E22;
    content: "";
    height: 6px;
    left: 0;
    position: absolute;
    top: 6px;
    width: 6px;
}
 #topBrands ul:after {
    background-color: #EAE4E4;
    content: "";
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    width: 33%;
}

 #topBrands.categoryPages ul:after {
    background-color: #EAE4E4;
    content: "";
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    width: 41%;
}

 #topBrands .header {
    background-color: #1f8144;
    color: #FEFEFE;
    font-size: 18px;
    height: 35px;
    padding-top: 5px;
    text-align: center;
    z-index: 999;
}
 #topBrands > ul > li {
    margin-bottom: 3px !important;
    position: static;
    text-align: center;
}
 #topBrands ul li:before {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
}
 #topBrands ul li .left {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background-color: #EAE4E4;
    border-color: #EAE4E4 #FFFFFF #EAE4E4 #EAE4E4;
    border-image: none;
    border-style: solid;
    border-width: 1px 3px 1px 1px;
    height: 52px;
    position: relative;
}
 #topBrands ul li .left .hot {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: #FF0000 rgba(255, 255, 255, 0) rgba(255, 255, 255, 0) #FF0000;
    border-image: none;
    border-right: 23px solid rgba(255, 255, 255, 0);
    border-style: solid;
    border-width: 23px;
    color: #FFFFFF;
    font-size: 13px;
    font-weight: bold;
    left: -1px;
    position: absolute;
    top: -1px;
    z-index: 1;
}
.ie8  #topBrands ul li .left .hot {
    border-left-width: 40px;
    border-top-width: 22px;
}
.ie8  #topBrands ul li .left .hot span {
    bottom: -1px;
    right: -13px;
    width: 65px;
}
 #topBrands ul li .left .hot > span {
    bottom: -7px;
    position: absolute;
    right: -15px;
    transform: rotate(-44deg);
    width: 46px;
}
 #topBrands ul li .left .hot span span {
    font-size: 18px;
}
 #topBrands ul li.active .left {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background-color: #DAD4D4;
    border-color: #C3BCBC;
    border-image: none;
    border-style: solid;
    border-width: 1px 3px 1px 1px;
    height: 52px;
    position: relative;
}
 #topBrands ul li.active .left:before {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #C3BCBC;
    border-image: none;
    border-style: solid;
    border-width: 26px 24px 26px 19px;
    content: "";
    position: absolute;
    right: -46px;
    top: -1px;
    z-index: 9999;
}
 #topBrands ul li.active .left:after {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #DAD4D4;
    border-image: none;
    border-style: solid;
    border-width: 27px 24px 27px 20px;
    content: "";
    position: absolute;
    right: -44px;
    top: -2px;
    z-index: 9999;
}
 #topBrands ul li.active .right {
    display: block;
}
 #topBrands ul li .brand {
    padding-top: 7px;
}
 /*#topBrands right .btn {
    background-color: #cb1f1f;
    font-size: 18px;
    line-height: 40px;
    margin:4px auto;
    width: 90px;
	height:40px;
	display:block;
	color:#fff;
}

#topBrands right .btn:hover {background-color:#30bfc9;}
*/
/*
 #topBrands ul li .btn:before {
    background-color: #13BF50;
    color: #FFFFFF;
    font-size: 17px;
} 
*/

 #topBrands ul li .bonus {
    color: #30bfc9;
    font-size: 17px;
    font-weight: bold;
    line-height: 54px;
    text-align: center;
}
#topBrands ul li .bonusInner{
	color: #30bfc9;
    font-size: 17px;
    font-weight: bold;
    text-align: center;
	line-height: 40px;
}
 #topBrands ul li .ratings {
    color: #898888;
    font-size: 11px;
    padding-top: 6px;
    text-align: center;
}
 #topBrands ul li .right {
    display: none;
    padding: 18px 0 18px 24px;
    position: absolute;
    right: 0;
    text-align: left;
    z-index: 55;
}
.ie8  #topBrands ul li .right {
    top: 0;
}
.ie9  #topBrands ul li .right {
    top: 0;
}
 #topBrands ul li .right .header {
    background-color: #BD1E22;
    color: #FEFEFE;
    font-size: 18px;
    height: 35px;
    padding-top: 5px;
    text-align: center;
}
 #topBrands ul li .right a.review {
    float: left;
}
 #topBrands ul li .right a.visit {
    float: right;
    padding-right: 20px;
}
 #topBrands ul li .right .bonus {
    text-align: left;
}
 #topBrands ul li .right span.reason {
    color: #BD1E22;
    display: block;
    font-size: 18px;
    margin-bottom: 10px;
    margin-top: 31px;
}
 #topBrands ul li .right a {
    color: #BD1E22;
    text-decoration: none;
}
 #topBrands ul li .right a:hover {
    color: #FF3B44;
	text-decoration:none;
}
 #topBrands ul li .right ul {
    margin-bottom: 10px;
}
 #topBrands ul li .right ul li {
    position: relative;
    text-align: left;
}
 #topBrands ul li .right ul li:before {
    background: none repeat scroll 0 0 #BD1E22;
}
 #topBrands ul li .right .btn {
    background-color: #1f8144;
    font-size: 22px;
    line-height: 40px;
    width: 185px;
	height:40px;
	color:#fff;
	text-align:center;
	text-decoration:none !important;
}

 #topBrands ul li .right .btn:hover {background-color:#175c49; color:#fff;}
/*
 #topBrands ul li .right .btn:before {
    background-color: #13BF50;
    color: #FFFFFF;
    font-size: 22px;
}
*/

.ie8  #topBrands ul li .right .btn {
    font-size: 22px;
}


@media (max-width: 991px) {
#topBrands ul.brands > li.active {
    min-height: 356px;
    position: relative !important;
}
#topBrands ul li .right {
    background-color: #EAE4E4;
    min-height: 302px;
    padding-top: 0;
    top: 54px !important;
}
#topBrands ul:after {
    display: none;
}
#topBrands ul li .right .header {
    margin-left: -23px;
}
#topBrands ul li.row.active .left:before, #content #topBrands ul li.row.active .left:after {
    border: medium none;
}
#topBrands ul li.row.active .left {
    border-right-width: 1px;
}
#topBrands ul li.row .left {
    border-right-width: 0;
}
#topBrands ul:after {
    height: 0;
}
}
@media (max-width: 768px) {
#topBrands ul li .btn {
    padding-left: 0;
    padding-right: 0;
}
}

.btn {
    background-color: #1f8144;
    font-size: 18px !important;
    line-height: 40px !important;
    margin:4px auto;
    width: 105px;
	height:40px;
	display:block;
	color:#fff;
	text-align:center;
}

.btn:hover {background-color:#175c49; text-decoration:none !important;}

.review_element {background: #fff; width: 1180px; margin:10px auto; padding:10px; height:260px;}
.CasinoReviewElement {width:100%; height:250px; display:block; margin:10px auto; overflow:hidden;}
.LeftSide {float:left; width:55%; height:100%; display:block; /*overflow:hidden;*/}
.LeftSide a.LeftLogoZone {float:left; width:50%; height:87%; display:block; text-decoration:none;}
.LeftSide a.LeftLogoZone:hover {text-decoration:none !important;}
.LeftSide a.LeftLogoZone img{margin:0px auto 15px; display:block;}
.LeftSide a.LeftLogoZone span.BonusText {font-family: 'Oswald', sans-serif; font-size:26px; color:#30bfc9; text-align:center; display:block; margin-top:15px;}
.LeftSide a.LeftLogoZone span.Slots-BonusText {font-family: 'Oswald', sans-serif; font-size:25px; color:#30bfc9; text-align:center; display:block; margin-top:10px;}
.LeftSide .RightInfoZone {float:left; background-color:#E7E4DF; width:50%; height:83%;}
.LeftSide a.RightInfoZone:hover {text-decoration:none !important;}
.LeftSide .RightInfoZone ul.GeneralInfo {line-height:12px; text-align:left; position:relative; list-style:none;}
.LeftSide .RightInfoZone ul.GeneralInfo li {font-family: 'Asap', sans-serif; font-size:13px; color:#000; }
.LeftSide .RightInfoZone > p {font-family: 'Asap', sans-serif; font-size:13px; color:#000; text-align:center; margin-bottom:0; margin-top:10px; text-decoration:underline;}
.LeftSide .RightInfoZone ul.Payments {list-style:none; display:block;}
.LeftSide .RightInfoZone ul.Payments li {float:left; padding:2px;}
.LeftSide .RightInfoZone ul.Payments li img{margin-right:3px;}

.LeftSide a.SlotLeftLogoZone {float:left; width:38%; height:87%; display:block; text-decoration:none;}
.LeftSide a.SlotLeftLogoZone img{margin:15px auto; display:block;}
.LeftSide a.SlotLeftLogoZone span.BonusText {font-family: 'Oswald', sans-serif; font-size:26px; color:#30bfc9; text-align:center; display:block; margin-top:15px;}
.LeftSide a.SlotLeftLogoZone span.Slots-BonusText {font-family: 'Oswald', sans-serif; font-size:20px; color:#30bfc9; text-align:center; display:block; margin-top:10px;}
.LeftSide .Slots-RightInfoZone {float:left; background-color:#E7E4DF; width:62%; height:83%;}
.LeftSide .Slots-RightInfoZone ul.GeneralInfo {line-height:35px; text-align:left; position:relative; list-style:none; margin:5px 10px 0 5px; float:left; width:47%; min-width: 180px;}
.LeftSide .Slots-RightInfoZone ul.GeneralInfo li strong {float:right;}
.LeftSide .Slots-RightInfoZone ul.GeneralInfo li {font-family: 'Asap', sans-serif; font-size:13px; color:#000; margin-bottom:7px;}
.LeftSide .Slots-RightInfoZone ul.GeneralInfo img {margin-right:10px;}

.LeftSide .Slots-RightInfoZone ul.GeneralInfo2 {line-height:35px; text-align:left; margin-top:5px; position:relative; list-style:none; margin-left:5px; float:left; border-left:1px solid lightgray; padding-left:10px; width:47%; min-width: 180px;}
.LeftSide .Slots-RightInfoZone ul.GeneralInfo2 li strong {float:right;}
.LeftSide .Slots-RightInfoZone ul.GeneralInfo2 li {font-family: 'Asap', sans-serif; font-size:13px; color:#000; margin-bottom:7px;}
.LeftSide .Slots-RightInfoZone ul.GeneralInfo2 img {margin-right:10px;}


.LeftSide .Slots-RightInfoZone > p {font-family: 'Asap', sans-serif; font-size:13px; color:#000; text-align:center; margin-bottom:0; margin-top:10px; }
.LeftSide .Slots-RightInfoZone ul.Payments {list-style:none;}
.LeftSide .Slots-RightInfoZone ul.Payments li {float:left; padding:2px;}
.LeftSide .Slots-RightInfoZone ul.Payments li img{margin-right:3px;}


.LeftSide a.BigButton {width:100%; text-align:center; display:block; height:15%; background-color: #1f8144; font-family: 'Oswald', sans-serif; font-size:18px; color:#fff; text-decoration:none; float:left; line-height:32px;}
.LeftSide a.BigButton:hover {background-color:#175c49;}
.RightSide {background-color:#E7E4DF; float:right; display:block; width:44%; height:100%;}

.LeftSide .RightInfoZone ul.GeneralInfo li:before {
    background: none repeat scroll 0 0 #BD1E22;
    content: "";
    height: 6px;
    width: 6px;
	float:left;
	margin-right:10px;
	margin-top:3px;
}
.LeftSide .RightInfoZone ul.GeneralInfo li:after {
    background-color: #EAE4E4;
    content: "";
    height: 100%;
    width: 33%;
	}
	
a.MoneyStrip {width:580px; height:90px; display:block; background-color:#E7E4DF; text-decoration:none; margin:31px auto; font-family: 'Oswald', sans-serif; box-shadow: 2px 2px 2px 2px gray;}	
a.MoneyStrip img {float:left; margin:15px 0 0 10px;}
a.MoneyStrip img.MoneyBag {float:left; position:relative; bottom:20px; margin:0;}
a.MoneyStrip p {color:#000; font-size:26px; float:left; display:inline; margin-top:25px; max-width:190px; text-align:center;}
a.MoneyStrip > span.btn {float:right; text-align:center; margin:25px 3px;}

ul.SidebarList {}
ul.SidebarList li { box-shadow: 2px 2px 2px 2px gray; background-color:#E7E4DF !important; display:block; font-family: 'Oswald', sans-serif; height:100%; max-width: 280px; margin-bottom:15px;}
ul.SidebarList a {display:block; overflow:hidden;}
ul.SidebarList img {float:left; display:block; margin-top:6%;}
ul.SidebarList p {float:left; width:68%; margin-bottom:0 !important; text-align:center;}
ul.SidebarList > li > a > span.btn {float:left; margin:10px 0 0 50px;}

h1.blog-title {color:#1f8144;}

ul.SlotsComparison {width:90%; line-height:12px; text-align:left; position:relative; list-style:none; margin:5px 10px 0 5px; float:left;}
ul.SlotsComparison li {font-family: 'Asap', sans-serif; font-size:13px; color:#000; line-height:35px; margin-bottom:7px;}
ul.SlotsComparison img {margin-right:10px;}

.tablepress thead th {background-color:#1F8144; color:#fff; font-size:18px; text-align:center;}
.tablepress tbody td {color: #30bfc9; font-size: 17px; font-weight: bold; line-height: 54px; text-align: center; font-family: 'Oswald', sans-serif; font-weight:bold; vertical-align:middle !important;}
.tablepress tbody td img {margin:0 auto; display:block;}

/*==================================== Rotating Button Thingie ==============================*/
/*Animation (for the buttons): Roll*/
/*.ie .roll > span:after {
  display: none;
}
.ie .roll:hover > span {
  left: 0;
}
.ie .roll:hover > span:after {
  display: block;
  text-align: center;
  left: -1px;
  top: -1px;
  transition: none;
}*/

.roll.fx:hover {color:#fff;}
.roll {
  position: relative;
  display: inline-block;
  vertical-align: top;
  -webkit-perspective: 400px;
  -moz-perspective: 400px;
  -webkit-perspective-origin: 50% 50%;
  -moz-perspective-origin: 50% 50%;
  color:#fff;
}

.roll > span {
  -moz-animation: roll 5s infinite;
  -webkit-animation: roll 5s infinite;
  left: -1px;
  border: 1px solid #32803c;
  
  display: block;
  position: relative;
  font-weight: bold;
  -webkit-transition: all 400ms ease;
  -moz-transition: all 400ms ease;
  background: #3cb14c;
  -webkit-transform-origin: 50% 0%;
  -moz-transform-origin: 50% 0%;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
}
/*.roll > span {
  background: #3cb14c;
  -webkit-transform: translate3d(0px, 0px, -33px) rotateX(90deg);
  -moz-transform: translate3d(0px, 0px, -33px) rotateX(90deg);
  left: -1px;
}*/

.roll > span:after {
  top: -1px;
  border: 1px solid #244e5e;
  content: attr(data-title);
  display: block;
  width: 100%;
  position: absolute;
  left: 0;
  color: #fff;
  background: #11741d;
  -webkit-transform-origin: 50% 0%;
  -moz-transform-origin: 50% 0%;
  -webkit-transform: translate3d(0px, 100%, 0px) rotateX(-87deg);
  -moz-transform: translate3d(0px, 100%, 0px) rotateX(-87deg);
}
.roll:hover > span {
  background: #11741d;
}
/*Animation (for the buttons): Auto color fade + Change text*/
@-webkit-keyframes roll {
  0%,
  40%,
  100% {
    -webkit-transform: translate3d(0px, 0px, 0) rotateX(0deg);
    -moz-transform: translate3d(0px, 0px, 0) rotateX(0deg);
  }
  50%,
  90% {
    -webkit-transform: translate3d(0px, 0px, -33px) rotateX(90deg);
    -moz-transform: translate3d(0px, 0px, -33px) rotateX(90deg);
  }
}
@-moz-keyframes roll {
  0%,
  40%,
  100% {
    -webkit-transform: translate3d(0px, 0px, 0) rotateX(0deg);
    -moz-transform: translate3d(0px, 0px, 0) rotateX(0deg);
  }
  50%,
  90% {
    -webkit-transform: translate3d(0px, 0px, -33px) rotateX(90deg);
    -moz-transform: translate3d(0px, 0px, -33px) rotateX(90deg);
  }
}
@-ms-keyframes roll {
  0%,
  40%,
  100% {
    -webkit-transform: translate3d(0px, 0px, 0) rotateX(0deg);
    -moz-transform: translate3d(0px, 0px, 0) rotateX(0deg);
  }
  50%,
  90% {
    -webkit-transform: translate3d(0px, 0px, -33px) rotateX(90deg);
    -moz-transform: translate3d(0px, 0px, -33px) rotateX(90deg);
  }
}
/*Animation (for the buttons): 3D Flip*/
/*.ie .fx > span:before {
  display: none;
  transform: rotateX(0deg);
  left: 0px;
  top: 0px;
}
.ie .fx:hover > span,
.ie .fx:focus > span {
  left: 0;
  transform-origin: 50% 50%;
}
.ie .fx:hover > span:before,
.ie .fx:focus > span:before {
  display: block;
  text-align: center;
  left: -1px;
  top: -1px;
  transition: none;
}
.ie .fx:hover > span:after,
.ie .fx:focus > span:after {
  display: none;
}
.ie9 .fx > span:after {
  display: none;
}*/
.fx {
  margin-bottom: 15px;
  height:70px;
  line-height: 70px;
  -webkit-perspective: 1000px;
  -moz-perspective: 1000px;
  perspective: 1000px;
  width:95%;
  margin-left:15px;
}

.fx > span {
  font-size: 26px;
  position: relative;
  display: block;
  text-align: center;
  padding: 0 14px;
  background: #3cb14c;
  border: 1px solid #32803C;
  -webkit-transition: -webkit-transform 0.3s;
  -moz-transition: -moz-transform 0.3s;
  transition: transform 0.3s;
  -webkit-transform-origin: 50% 0;
  -moz-transform-origin: 50% 0;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
}
.fx > span:after {
  text-align: center;
  position: absolute;
  top: -1px;
  left: -1px;
  border: 1px solid #244E5E;
  width: 100%;
  /*height: 100%;*/
  height:70px;
  background: #11741d;
  content: attr(data-btn-text);
  -webkit-transition: background 0.3s;
  -moz-transition: background 0.3s;
  transition: background 0.3s;
  -webkit-transform: rotateX(0deg) translateY(0px);
  -moz-transform: rotateX(0deg) translateY(0px);
  transform: rotateX(0deg) translateY(0px);
  -webkit-transform-origin: 50% 0;
  -moz-transform-origin: 50% 0;
  transform-origin: 50% 0;
}
.fx > span:before {
  position: absolute;
  top: 100%;
  left: -1px;
  border: 1px solid #244E5E;
  width: 100%;
  /*height: 100%;*/
  height:70px;
  background: #31923D;
  content: attr(data-btn-text-flipped);
  -webkit-transition: background 0.3s;
  -moz-transition: background 0.3s;
  transition: background 0.3s;
  -webkit-transform: rotateX(-90deg);
  -moz-transform: rotateX(-90deg);
  -webkit-transform-origin: 50% 0;
  -moz-transform-origin: 50% 0;
}
.fx:hover > span:before,
.fx:focus > span:before,
.fx:hover > span,
.fx:focus > span {
  background: #11741d;
}
/*.fx:hover > span,
.fx:focus > span {
  -moz-transform: rotateX(90deg) translateY(-22px);
  -webkit-transform: rotateX(90deg) translateY(-22px);
}*/
/*Animation (for the buttons): Color fade*/
.clearfix::after{content:"";display:table;clear:both}
