@font-face 
	{
	font-family: 'superstar';
	src: url('unibet_pro_110815_edit-webfont.eot') format('eot'),
	url('unibet_pro_110815_edit-webfont.woff') format('woff'), url('unibet_pro_110815_edit-webfont.ttf') format('truetype'), url('unibet_pro_110815_edit-webfont.svg') format('svg');
	font-weight: normal;
	font-style: normal;
	}
@font-face 
	{
	font-family: 'Franchise';
	src: url('franchise-bold.eot') format('eot'),
    url('franchise-bold.woff') format('woff'), url('Franchise-Bold.ttf') format('truetype'), url('Franchise-Bold.otf') format('otf'), url('franchise-bold.svg') format('svg');
	font-weight: normal;
	font-style: normal;
	}   
html {
	bottom:0;
	height: 100%;
}
html {
	padding:0;
	margin:0;
	height: 100%;
	background-color:#2a2a2a;
	overflow-y: scroll;
}
body {
    padding:0;
    margin:0;
    /* Remove any browser-default margins. */
    margin: auto;
    min-height: 100% !important;
    height: 100%; 
    background-color: #2a2a2a;  
}
/* NAVBAR TOP ---------------------------------------- */
#topbar-spacing {
	height: 4.1vw;
    width: 100%;
  	}
#topbar {
    overflow: hidden;
    background-color: #fff;
    z-index: 9999;
    position: fixed;
    width: 100%;
    -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
  	}
.content {
  	padding: 16px;
}
.sticky {
  	position: fixed;
  	top: 0;
  	width: 100%;
}
.logo {
    width: 13%;
    padding: 0.4%;
    padding-left: 0;
    float: left;
    margin-left: 10%;
}
.logo img {
    vertical-align: middle;
}    
.nav-buttons {
    float: right;
    width: 50%;
    margin-right: 10%;
    padding: 0.8%;
}
.nav-button {
  	border-radius: 1.607rem;
  	border: none;
  	text-align: center;
  	padding: 1.5% 3.5%;
  	width: auto;
  	transition: all 0.5s;
  	cursor: pointer;
  	margin: 0;
    margin-left: 1.5%;
}
.nav-button span { /*Buttons text */
  	cursor: pointer;
  	display: inline-block;
  	position: relative;
  	transition: 0.5s;
    font-size: 0.9vw;
    font-weight: 600;
}
.reg-button {
  	background-color: #fde811;
  	color: #333;
    float: right;
}
.reg-button:hover {
  	background-color: #ffeb4a;
}
.login-button {
  	background-color: #008d70;
  	color: #fff;
    float: right;
}
.login-button:hover {
  	background-color: #008d70;
}
/* ADDITIONAL LOGO */
.yes, .YES {
    display: none !important;
	}
.no, .NO {
    display: block;
	}
.additional-logo {
    width: 15%;
	position:absolute;
    top:6vw;
    right:2%;
	}
.additional-logo-mobile {
	display:none;
	}
.additional-logo img {
    width:100%;
	}
/* NAVBAR TOP END */
#image {
    width: 100%;
    height: auto;
    background-image: url('1-background.jpg');
    background-size: cover; 
    background-position: top;
}
#image-mob {
    display: none;
}
#container {
    width: 80%;
    margin: 0 auto;
    height: auto;
}
#text {
    width: 40%;
  	position: relative;
    padding: 7.1% 0;
    left: 0;
    text-align:center;
}
h2 {
   	color: #fff;
    font-size:3.04vw;
    margin:0;
    line-height:100%;
    font-family: 'Franchise';
    padding-bottom: 4%;
    font-weight: 400;
    text-transform: uppercase;
    text-align:center;
}
h1 {
   	color:white;
    font-size:5vw;
    margin:0;
    line-height:90%;
    font-family: 'Franchise';
    font-weight: normal;
    text-transform: uppercase;
    text-align:center;
}
h3 {
   	color:white;
    font-size:7vw;
    margin:0;
    line-height:85%;
    font-family: 'Franchise';
    font-weight: normal;
    text-transform: uppercase;
    text-align:center;
}
.partners h1 {
    letter-spacing: -1px;
}
.text-placeholder {
	display:none;
}
/* BUTTON ---------------------------------------- */
.button {
  	border-radius: 1.607rem;
  	background-color: #fde811;
  	border: none;
  	color: #333;
  	text-align: center;
  	font: 1.3vw 'Roboto';
    font-weight: 600;
  	padding: 4% 8%;
  	width: auto;
  	transition: all 0.5s;
  	cursor: pointer;
  	margin: 0 auto 2% auto;
}
.button span {
 	cursor: pointer;
 	display: inline-block;
  	position: relative;
  	transition: 0.5s;
}
.button:hover {
    background-color: #ffeb4a;
}  /*
.button span:after {
  	content: '\000BB';
  	position: absolute;
  	opacity: 0;
  	top: 0;
 	right: -25px;
  	transition: 0.5s;
}
.button:hover span {
  	padding-right: 30px;
}
.button:hover span:after {
  	opacity: 1;
  	right: 0;
}*/
.r180 {
    transform: rotate(180deg);
    font-size: 20px !important;
    position: relative;
    display: inline-block;
    font-family: 'Courier';
    margin-left: 10px;
}
/* BUTTON END */
#text p {
	margin: 0 auto;
    width: 35%;
    color: white;
    font-family: 'Roboto';
    text-decoration: underline;
    font-size: 0.7vw;
    padding-top: 2%;
    line-height: 120%;
    cursor: pointer;
    text-align:center;
}
#text p span{
    font-size: 0.75vw;
    padding: 2px 0 0 8px;
}
/* STEPS -------------------------------------------- */
#steps-container {
	background-color: rgba(51, 51, 51, 0.9);
    width: 100%;
}
#steps-wrapper {
    width: 80%;
    margin: 0 auto;
    padding: 1.8% 0 1.1% 0;
    overflow:hidden;
}	
#steps {
    width: 33.3%;
    float:left;
}
.steps-numbers {
    width: 20%;
    float:left;
    vertical-align:center;
} 
.steps-numbers p { /* Steps numbers*/
    background-image: url('casinohuone-square.svg');
    background-repeat: no-repeat;
    background-size: 86%;
    background-position: 50% 0%;
    color:#008d70;
    font-family: 'Franchise';
    font-size:4vw;
    margin:0;
    line-height:80%;
    font-weight: 100; 
    vertical-align: middle;
    text-align:center;
    /*border: solid 3px #afadab;
    border-radius: 0%;*/
    padding: 20% 20% 20% 20%;
   -webkit-transition:  .40s ease-in-out;
   -moz-transition:  .40s ease-in-out;
   -ms-transition:  .40s ease-in-out;
   -o-transition:  .40s ease-in-out;
   	transition:  .40s ease-in-out;
}
.steps-numbers p:hover { /* Steps numbers hover*/
   -webkit-transition:  .40s ease-in-out;
   -moz-transition:  .40s ease-in-out;
   -ms-transition:  .40s ease-in-out;
   -o-transition:  .40s ease-in-out;
   	transition:  .40s ease-in-out;
   	transform: scale(1.1);	
}
.steps-content { 
    width: 70%;
    float:right;
    margin: 0 5%;
}
.steps-content p { /* Steps text */
    color:white;
    font-family: 'Roboto', sans-serif;
    font-size:1vw;
    margin:0;
    line-height:130%;
    font-weight: 100; 
}
h4.steps-heading { /* Steps heading */
	font: 1.7vw 'Fjalla One';
    color:white;
    padding-bottom: 1%;
    font-weight: 400;
    margin:0;
}
/* STEPS END */
/* PARTNERS -------------------------------------------- */
.partnersyes, .partnersYES  
    {
    display: none;
    }     
.partnersno, .partnersNO 
    {
    display: block;
    }

#partners-container {
	background-color: rgb(51, 51, 51);
    width: 100%;
    height: auto;
    clear: both;
}
.partners {
    width: 90%;
    margin: 0 auto;
    text-align: center;
    padding: 3.5% 0 3.5% 0;
}
.casinohuone-symbol {
	width: 4%;
    margin: 0 auto 1% auto;
}
.partners p {
    color:white;
    font-family: 'Roboto', sans-serif;
    font-size:1.4vw;
    margin:0 auto;
    line-height:130%;
    font-weight: 100; 
    width: 50%;
}
.button2 {
  	border-radius: 1.607rem;
  	background-color: #fde811;
  	border: none;
  	color: #333;
  	text-align: center;
  	font: 1.1vw 'Roboto';
    font-weight: 700;
  	padding: 1.5%;
  	width: auto;
  	padding-right: 3%;
  	padding-left: 3%;
  	transition: all 0.5s;
  	cursor: pointer;
  	margin: 2% 0 0 0;
    clear: both;
}/*
.button2 span {
 	cursor: pointer;
 	display: inline-block;
  	position: relative;
  	transition: 0.5s;
}
.button2:hover {
    background-color: #ffeb4a;
}  
.button2 span:after {
  	content: '\00bb';
  	position: absolute;
  	opacity: 0;
  	top: 0;
 	right: -25px;
  	transition: 0.5s;
}
.button2:hover span {
  	padding-right: 30px;
}
.button2:hover span:after {
  	opacity: 1;
  	right: 0;
}
/* PARTNERS END */
/* AWARDS -------------------------------------------- */
#awards-container {
	background-color: #008d70;
    width: 100%;
    height: auto;
    clear: both;
}
.awards {
    width: 54%;
    margin: 0 auto;
    padding: 3%;
}
.awards img {
    width: 100%;
    margin: 0 auto;
    text-align: center;
    vertical-align: middle;
} 
/*#awards-wrapper {
    width: 100%;
    margin: 0 auto;
    overflow:hidden;
}	
#awards {
    width: 33.3%;
    float: left;
    position: relative;
}
.awards-image {
    width: 30%;
    float:left;
} 
.awards-image img{
	display:block;
    max-height: 76px;
}
.awards-content { 
    width: 70%;
    float:right;
    position: absolute;               
   	top: 50%;                      
   	transform: translate(40%, -50%)
}
.awards-content p {
    color:white;
    font-family: 'Roboto', sans-serif;
    font-size:1.2vw;
    margin:0;
    line-height:130%;
    font-weight: 100; 
    padding-left: 4%;
    padding-right: 8%;
}
/* AWARDS END */
/* FOOTER -------------------------------------------- */
#payments-container {
	background-color: rgb(51,51,51);
    width: 100%;
    height: auto;
    clear: both;
    border-top: thin inset #888888;
}
.payments {
    width: 35%;
    margin: 0 auto;
    padding: 2%;
}
.payments img {
    width: 100%;
    margin: 0 auto;
    text-align: center;
}
#terms-container {
	background-color: rgb(51,51,51);
    width: 100%;
    height: auto;
    clear: both;
}
.terms {
    width: 80%;
    margin: 0 auto;
    padding: 0 0 2%;
}
.terms span {
    font: 1vw 'Roboto';
    color: #999999;
    font-weight: bold;
    text-align: left;
}
.terms p {
    font: 0.8vw 'Roboto';
    color: #999999;
    text-align: left;
}
#footer-container {
	background-color: rgb(51,51,51);
    width: 100%;
    height: auto;
    clear: both;
    border-top: 1px solid rgba(0,0,0,.176);
    overflow: hidden;
}
#footer-box {
   	background-color: rgb(51,51,51);
    width: 80%;
    margin: 0 auto;
    height: auto;
    position: relative;
    overflow: hidden;       
}
.authority {
    width: 164px;
    padding: 20px 0;
    float: left;
}
.authority img {
    height: 30px;
    display: inline-block;
}
.social {
    width: 164px;
    padding: 20px 0;
    float: right;
}
.social img {
    height: 24px;
    padding-left: 6px;
    display: inline-block;
    -webkit-transition:  .30s ease-in-out;
    -moz-transition:  .30s ease-in-out;
    -ms-transition:  .30s ease-in-out;
    -o-transition:  .30s ease-in-out;
   	transition:  .30s ease-in-out;
}
.social img:hover {
	opacity: 0.6;
    -webkit-transition:  .30s ease-in-out;
    -moz-transition:  .30s ease-in-out;
    -ms-transition:  .30s ease-in-out;
    -o-transition:  .30s ease-in-out;
   	transition:  .30s ease-in-out;
}
/* Return to top arrow */
#return-to-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background:#008d70;
    width: 46px;
    height: 46px;
    display: block;
    text-decoration: none;
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
    border-radius: 40px;
    display: none;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;*/
    box-shadow:  0 0 6px  rgba(0,0,0,0.3);
	-moz-box-shadow: 0 0 6px  rgba(0,0,0,0.3);
	-webkit-box-shadow: 0 0 6px  rgba(0,0,0,0.3);
	-o-box-shadow: 0 0 6px  rgba(0,0,0,0.3);
}
#return-to-top i {
    color: #fff;
    margin: 0;
    position: relative;
	left: 16px;
    top: 27%;
    font-size: 16px;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
#return-to-top:hover {
    background: rgba(0, 0, 0, 0.9);
    background:#515151;
}
#return-to-top:hover i {
    color: #fff;
    top: 10px;
}

@media only screen and (max-width: 768px) and (orientation : landscape)
{
#topbar-spacing 
    {
    height: 5.2vw;
    }    
.logo {
    width: 22%;
    margin-left: 7%;
}
.nav-buttons {
    margin-right: 7%;
}    
.nav-button {
    padding: 1.8% 3%;
}    
.nav-button span {
    font-size: 1.6vw;    
}
#container {
    width: 86%;
}
h2 {
    font-size: 2vw;
} 
/* BUTTON ---------------------------------------- */
.button {
    font: 2.2vw 'Roboto';
    padding: 4%;
    width: auto;
    padding-right: 8%;
    padding-left: 8%;
}
.button2 {
    font: 1.8vw 'Roboto';
    padding: 2%;
    padding-right: 4%;
    padding-left: 4%;    
}
/* BUTTON END */
#text p {
    width: 100%;
    font-size: 1.2vw;
    padding-top: 4%;
}
.terms {
    width: 86%;
}
.terms span {
    font: 1.7vw 'Roboto';
}
.steps-content p {
    font-size: 1.4vw;
}    
#steps-wrapper {
    width: 86%;
}
h4.steps-heading {
    font: 2vw 'Roboto';    
}
.partners h1 {
    font: 2.5vw 'Roboto';
}
.partner-logo {
    width: 10.5%;
    max-width: 10.5%;
} 
.partner-logo__img {
    max-height: 50px;
}
.payments {
    width: 55%;    
}
#footer-box {
    background-color: rgb(51,51,51);
    width: 86%;
}
.authority {
    width: 146px;
    padding: 15px 0;
}        
.authority img {
    height: 30px;
}
.social {
    width: 146px;
}    
.social img {
    height: 20px;
}    
}

@media only screen and (max-width: 768px) and (orientation : portrait)
{
/* NAV TOPBAR ------------------------------------------------ */  
.logo {
    width: 34%;
    margin-left: 0;
    padding: 0.7%;
}
.nav-buttons {
    width: 52%;
    margin-right: 0.5%;
}
.nav-button span {
    font-size: 3vw;
}
.nav-button {
    padding: 5% 10%;
    margin-left: 2.5%;
}
#topbar-spacing {
    height: 10.5vw;
}
.additional-logo-mobile {
    width: 40%;
    margin: 0 auto;
    display:block;
    margin-top: 1%;
    margin-bottom:-10%;
	}
.additional-logo-mobile img {
    width: 100%;
	}
#image {
    background-image:url('1-bg-mobile.jpg');
    height: auto;
    background-size: 100%; 
    background-position: top;
    background-repeat: no-repeat;
}
#image-mob {
    display: block;
    height: 20%;
    margin-top: 0%;
} 
#image-mob img{
    width: 100%;
    margin-bottom: -5px;
}     
#container {
    height: auto;
    padding-top: 2%;
    padding-bottom: 50%;
}    
#text {
 	-webkit-transform: translateY(0%);
  	-ms-transform: translateY(0%);
  	transform: translateY(0%);
    width: 100%;
}
h2 {
    font-size: 8vw;
    margin: 0 auto;
    line-height: 100%;
    padding-bottom: 3%;
    text-align: center;
}    
h1 {
   text-align: center;
   font-size: 12vw !important;
   padding-bottom: 1%;
} 
h3 {
   text-align: center;
   font-size: 16vw !important;
   padding-bottom: 1%;
} 
.button {
    font: 5vw 'Roboto';
    padding: 5% 14%;
    margin: 0 auto;
    display: block;
    margin-top: 2%;
}
#text p {
    margin: 0 auto;
    width: 40%;
    text-align: center; 
    font-size: 1.8vw;
    padding-top: 3%;
}   
#text p span{
    font-size: 2vw;
    padding: -1px 0px;
}
/* STEPS ------------------------------------------------ */  
#steps-container { 
    background-color: rgba(51, 51, 51, 1);
    border-bottom: 0.15em solid rgba(0,0,0,.176);
}    
#steps-wrapper {
    margin: 0 auto;
    overflow:none;
    padding-bottom: 10%;
}
#steps {
	background-color: none;
    width: 100%;
    float:none;
}
.steps-numbers {
    width: 16%;
    float:none;
    vertical-align:center;
    padding: 10% 0 3% 0;
    margin: 0 auto;
}
.steps-numbers p {
    font-size:10vw;
    margin:0;
    vertical-align: middle;
    text-align:center;
    padding: 25%;
    background-size: 100%;
}
.steps-content {
    width: 80%;
    float:none;
    margin: 0 auto;
    text-align: center;
}
.steps-content p {
    color:white;
    font-family: 'Roboto', sans-serif;
    font-size:4.5vw;
    margin:0;
    line-height:130%;
    font-weight: 100; 
}
h4.steps-heading {
	font-size: 6.5vw;
    padding-bottom: 1%;
    font-weight: 900;
}
/* STEPS END */ 
/* PARTNERS -----------------------------------------------*/     
.partners {
    padding: 13% 0;
}  
.casinohuone-symbol {
	width: 14%;
    margin: 0 auto 2% auto;
}
.partners p {
	font-size: 4.5vw;
    width: 90%;
    line-height:130%;
    }
.button2 {
    font: 4vw 'Roboto';
    padding: 4% 10%;
    margin-top: 4%;
}
/* PARTNERS END */ 
/* AWARDS -------------------------------------------- */
.awards {
    width: 58%;
    margin: 0 auto;
    padding: 3%;
}
#awards {
    width: 33.3%;
    float:left;
}
.awards-image {
    width: 27%;
    float:left;
	padding-left: 0%;
} 
.awards-content { 
    width: 62%;
    float:right;
    margin: 0 5%;
    display:table;
    height: 4vh;
}
.awards-content p { /* Steps text */
    color:white;
    font-family: 'Roboto', sans-serif;
    font-size:2.2vw;
    margin:0;
    line-height:130%;
    font-weight: 100; 
    vertical-align:middle;
    display:table-cell;
}
/* AWARDS END */
/* FOOTER -----------------------------------------------*/       
.awards {
    width: 92%;
    padding: 4% 3%;
}
.payments {
    width: 90%;
    margin: 0 auto;
    padding: 5%;
}    
.terms {
    width: 90%;
}
.terms span {
    font: 4vw 'Roboto';
}
.terms p {
    font: 2.6vw 'Roboto';
}
#footer-box {
    width: 90%;
}    
.social {
    width: 124px;
    padding: 22px 0;
}    
.social img {
    height: 20px;
}
.authority {
    padding: 15px 0;
} 
#return-to-top {
    bottom: 50px;
}    
}
