/************************************************************************************
RESET
*************************************************************************************/
html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre,  ul,
dd, dt, li, tbody, tfoot, th, thead, tr, button, del, ins, map, object,
a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span,
strong, sub, sup, tt, var, legend, fieldset {
	margin: 0;
	padding: 0;
}

img, fieldset {
	border: 0;
}
@font-face {

    font-family: "GESSTextLight-Light";

    font-style: normal;

    font-weight: normal;

    src: local("GESSTextLight-Light"), url("GESSTextLight-Light.eot?#iefix") format("embedded-opentype"), url("GESSTextLight-Light.woff") format("woff"), url("GESSTextLight-Light.ttf") format("truetype"), url("GESSTextLight-Light.svg#GESSTextLight-Light") format("svg");

}
/* set image max width to 100% */
 

/* set html5 elements to block */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { 
    display: block;
}
::selection {
	background: #2a7391;
	color:#FFF;  
	}
::-moz-selection {
	background: #2a7391;
	color:#FFF; 
}

/************************************************************************************
GENERAL STYLING
*************************************************************************************/

body {
	color:#fff;
	font-size:12px;
	background-color:#1f184e;
	 
}
a {
	color: #FFF;
	text-decoration: none;
	outline: none;
}

p {
	margin: 0 0 1.2em;
	padding: 0;
}
A:focus{
	outline:none;
}
*:focus{
	outline:none;
}


/* reset webkit search input styles */
input[type=search] {
	-webkit-appearance: none;
	outline: none;
}
input[type="search"]::-webkit-search-decoration, 
input[type="search"]::-webkit-search-cancel-button {
	display: none;
}
/************************************************************************************
FONT FACE
*************************************************************************************/

@font-face {
  font-family: 'Optima';
  src: url('../fonts/Optima.eot?#iefix') format('embedded-opentype'),
       url('../fonts/Optima.woff') format('woff'), 
	   url('../fonts/Optima.ttf')  format('truetype'), 
	   url('../fonts/Optima.svg#Optima') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Optima-Bold';
  src: url('../fonts/Optima-Bold.eot?#iefix') format('embedded-opentype'),  
       url('../fonts/Optima-Bold.woff') format('woff'), 
	   url('../fonts/Optima-Bold.ttf')  format('truetype'), 
	   url('../fonts/Optima-Bold.svg#Optima-Bold') format('svg');
  font-weight: normal;
  font-style: normal;
}

	
/************************************************************************************
STRUCTURE
*************************************************************************************/
.container{
	width:100%;
}
.obgar{
	background:#fff url(../../winwith2019-kwar1.jpg) no-repeat top center;
	background-size:cover;}
.winner{
	background:#fff url(win2020.jpg) no-repeat top center; 
	}
.winnerar{
	background:#fff url(../../../bahrain/assets/images/winbg2019.jpg) no-repeat top center;
	}

.obg{
	background:#b8d432 url(../images/b1.jpg) no-repeat top center;
	background-size:cover;}
.wrapper{
	width:1400px;
	margin:0 auto 0 auto;
	position:relative;
}
.fcoupon{
	width:405px;
	margin:160px auto 0 auto;
	}
.frame    { width:100%; margin:0 auto; position:relative;  	
	min-height:81px;}

header                 { height:85px;z-index:5; }
header .logo           { float:left; margin-left:5%;}
header .log-2          { float:right; padding:0 0 0 23px;}
header .second-row     { padding:0 25px 0 0}
.btn {
	border: none;
	font-size:16px;
	color: inherit;
	background: none;
	cursor: pointer;
	padding: 15px 20px;
	display: inline-block;
	margin: 0px 5px;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 700;
	outline: none;
	position: relative;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
.btn:after {
	content: '';
	position: absolute;
	z-index: -1;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
.btn-2 {
	background: #cb4e4e;
	color: #fff;
	box-shadow: 0 4px #ab3c3c;
	-webkit-transition: none;
	-moz-transition: none;
	transition: none;
}

/* Button 2a */
.btn-2a {
	border-radius: 0 0 5px 5px;
}

.btn-2a:hover {
	box-shadow: 0 4px #F90;
	top: 2px;
}

.btn-2a:active {
	box-shadow: 0 0 #ab3c3c;
	top: 6px;
}

/* Button 2h */
.btn-2h {
	border-radius: 10px;
}

.btn-2h:hover {
	box-shadow: 0 2px #ab3c3c;
	top: 2px;
}

.btn-2h:active {
	box-shadow: 0 0 #ab3c3c;
	top: 6px;
}
ul#language        { text-align:right; display:block; padding:0px 35px 11px 0;}

.lang{
	width:135px;
	height:40px;
	float:right;
}
.client-bg{
	width:141px;
	float:left;
	margin-top:0;
	clear:both;
}
.client-bg img{
	width:100%;
	height:auto;
}
.topregg{
	width:100%;
	height:63px;
	float:left;
	background:url(../images/top.gif) no-repeat top center;}
.topreggar{
	width:100%;
	height:53px;
	float:left;
	background:url(../images/topar.gif) no-repeat top center;}
.rt-mainbox{
	width:400px;
	padding:10px;
	float:left;
	box-sizing:border-box;
	z-index:999;
	left:0px;
	background-color:#fff;
}
.wn-mainbox{
	width:90%;
	margin:0 auto;
	z-index:999;
	background:#fff url(../images/wn.png) top center no-repeat;
	border-radius:15px;
	margin-top:280px;
}
.wn-termbox{
	width:90%;
	margin:0 auto;
	z-index:999;
	background:#fff url(../images/trems.png) top center no-repeat;
	border-radius:15px;
	margin-top:420px;
}
.wn-winbox{
	width:95%;
	margin:0 auto;
	z-index:999;
	
	}
.rt-mainbox h1{
	font-family: 'Optima';
	font-size:50px;
	color:#FFF;
	line-height:48px;
	font-weight:normal;
}
.rt-mainbox h1 span{
	font-family: 'Optima-Bold';
	font-size:50px;
	color:#FFF;
}
.rt-mainbox h2{
	font-family:Helvetica;
	font-size:20px;
	padding:6% 0;
	color:#FFF;
	font-weight:normal;
}
.rt-mainbox span{
	font-family: 'Optima-Bold';
	font-size:28px;
	line-height:36px;
	color:#FFF;
}
.n_error p{
	color:#F00;
	font-weight:bold;}

.n_ok p{
	color:#030;
	font-weight:bold;}
@-webkit-keyframes pulse {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(204,169,44, 0.4);
  }
  70% {
      -webkit-box-shadow: 0 0 0 10px rgba(204,169,44, 0);
  }
  100% {
      -webkit-box-shadow: 0 0 0 0 rgba(204,169,44, 0);
  }
}
@keyframes pulse {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(204,169,44, 0.4);
    box-shadow: 0 0 0 0 rgba(204,169,44, 0.4);
  }
  70% {
      -moz-box-shadow: 0 0 0 10px rgba(204,169,44, 0);
      box-shadow: 0 0 0 10px rgba(204,169,44, 0);
  }
  100% {
      -moz-box-shadow: 0 0 0 0 rgba(204,169,44, 0);
      box-shadow: 0 0 0 0 rgba(204,169,44, 0);
  }
}
.driven-btn{
	width:68.7%;
	margin-top:5%;
	 display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;

  box-shadow: 0 0 0 rgba(204,169,44, 0.4);
  animation: pulse 2s infinite;
}
.driven-btn img{
	width:100%;
	height:auto;
	display:block;
}
.driven-btn:before {
  /*content: '';*/
  cursor:pointer;
  position: absolute;
  border: #e1e1e1 solid 1px;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
}
.driven-btn:hover:before, .driven-btn:focus:before, .driven-btn:active:before {
  -webkit-animation-name: hvr-ripple-out;
  animation-name: hvr-ripple-out;
}

/* Ripple Out */
@-webkit-keyframes hvr-ripple-out {
  100% {
    top: -12px;
    right: -12px;
    bottom: -12px;
    left: -12px;
    opacity: 0;
  }
}
@keyframes hvr-ripple-out {
  100% {
    top: -12px;
    right: -12px;
    bottom: -12px;
    left: -12px;
    opacity: 0;
  }
}

footer{
	width:100%;
	position:absolute;
    bottom:0px;
	background:url(../images/ftbg.jpg) top center;
	background-size:cover;
	border-radius: 20px 20px 0 0;}
.ftr-top{
	width:100%;
}
.ftr-top2{
	width:100%;
	padding:2% 0;
	position:relative;
}
.ftr-top2 h1{
	width:50%;
	height:auto;
	float:left;
	padding-top:1%;
	font-weight:normal;
	font-family: 'Optima';
	font-size:28px;
	color:#000;
}
.ftr-top-textbg{
	width:100%;
	margin:0 auto;
	background: #FFF url(../images/line.jpg) repeat-x center;
}
	
.ftr-top-textbg h1{
	width:90%;
	padding:5.6% 0;
	margin:0 auto;
	text-align:center;
	font-weight:normal;
	font-family: 'Optima';
	font-size:36px;
	color:#000;
	background-color:#FFF;
}
.ftr-top h1 span{
	font-family: 'Optima-Bold';
	color:#165e4c;
	font-size:50px;
	font-weight:normal;
}
.ftr-btm{
	width:100%;
	padding:2px 0;
}
.ftr-btm h2{
	font-family: 'Optima';
	font-size:16px;
	color:#3b3d3c;
	float:left;
	font-weight:normal;
}
.ftr-btm-rt2{
	float:right;
	width:40%;
	padding:10px;
	font-size:12px;
	font-family:Arial, Helvetica, sans-serif;
	color:#333;}
.ftr-btm-rt{
	width:198px;
	float:right;
}
.social-box{
	width:18px;
	float:left;
	margin-left:2%;
	
	display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
}

.social-box:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: '';
  top: 100%;
  left: 5%;
  height: 10px;
  width: 90%;
  opacity: 0;
  background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.35) 0%, transparent 80%);
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, transparent 80%);
  /* W3C */
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform, opacity;
  transition-property: transform, opacity;
}
.social-box:hover, .social-box:focus, .social-box:active {
  -webkit-transform: translateY(-5px);
  transform: translateY(-5px);
  /* move the element up by 5px */
}
.social-box:hover:before, .social-box:focus:before, .social-box:active:before {
  opacity: 1;
  -webkit-transform: translateY(5px);
  transform: translateY(5px);
  /* move the element down by 5px (it will stay in place because it's attached to the element that also moves up 5px) */
}
	
	
/*==============Contest Style Start ====================*/

.contest-head{
	width:100%;
	padding:26px 0;
	background-color:#000;
}
.contest-head-lt{
	width:285px;
	float:left;
}
.contest-head-rt{
	width:340px;
	float:right;
}
.contest-midbg{
	width:100%;
	padding:8% 0;
}

.contest-midbg-lt{
	width:51.5%;
	float:left;
}
.contest-midbg-lt h1{
	font-family: 'Optima-Bold';
	color:#000;
	font-size:61px;
	font-weight:normal;
}
.contest-midbg-lt h2{
	font-family: 'Optima';
	font-size:28px;
	color:#000;
	padding:5% 0 0 0;
	font-weight:normal;		
}

@import "compass/css3";

$nonChecked: #fff;
$checked1: #8fd0f6;
$checked2: #0c6497;
body {
  background: #222;
}

.mar-btm{
	margin-top:10px;
}
.container {
  padding: 5px 0;
  width: 100%;
  
}
input[type="radio"] {
    display:none;
}
input[type="radio"] + label span {
    display:inline-block;
    width: 15px;
    height: 15px;
    margin: -2px 10px 0 0;
    vertical-align:middle;
    cursor:pointer;
    -moz-border-radius:  50%;
    border-radius:  50%;
    border: 1px solid #c9c9c9;
}
input + label:hover {
  cursor: pointer;
}
.light input[type="radio"] + label {
    color: #000;
    text-shadow: 1px 1px 0 #fff;
	font-family: 'Optima';
	font-size:18px;
}
.light input[type="radio"] + label span {
    background-color: $nonChecked;
    background-repeat:no-repeat;
    background-position: 2px 3px;
    background-size: 10px 10px;
}


.light input[type="radio"]:checked + label{color: #555;
}

.light input[type="radio"] + label span,
.light input[type="radio"]:checked + label span {
  -webkit-transition: all 0.4s linear;
  -o-transition: all 0.4s linear;
  -moz-transition: all 0.4s linear;
  transition: all 0.2s linear;
}
.light input[type="radio"]:checked + label span {
 box-shadow: 0 0 2px rgba(0,0,0,0.5);
 -webkit-animation: pop 0.2s linear 1 forwards;
  background-image: url(../images/checkmark.png);
}

@-webkit-keyframes pop /* Safari and Chrome */
{
  0% {
    background-color: $checked2;
  }
  100% {
    background-color: $checked1; 
  }

}

/*================================================================================*/

.textfield_box{
	width:100%;
	margin-top:5%;
}
.textfield_box .form{
	width:48%;
	height:60px;
	padding:3%;
	float:left;
	margin-right:2%;
	box-sizing:border-box;
	border:1px solid #000;
	color:#000;
	margin-bottom:2%;
	font-family: 'Optima';
	font-size:16px;
	font-weight:normal;
}
.textfield_box .button{
	width:48%;
	height:60px;
	background-color:#000;
	border:none;
	outline:none;
	font-family: 'Optima';
	font-size:16px;
	font-weight:normal;
	color:#FFF;
}

.contest-midbg-rt{
	width:39.9%;
	float:right;
}
.contest-midbg-rt img{
	width:100%;
	height:auto;
	display:block;
}
.arrow{
	width:54px;
	float:right;
	margin:0;
}

.thank-bg{
	width:69%;
	margin:10% auto;
	border-bottom:10px solid #165e4c;
	background:url(../images/rtbg.png) repeat;
}
.thank-bg h1{
	width:100%;
	font-family: 'Optima-Bold';
	color:#FFF;
	text-align:center;
	font-size:50px;
	padding:10% 0 3% 0;
	font-weight:normal;
}
.thank-bg h2{
	width:100%;
	font-family:Helvetica;
	color:#FFF;
	text-align:center;
	font-size:25px;
	font-weight:normal;
}

.thank-bg-btmbg{
	width:583px;
	padding:5% 0 5% 0;
	margin:10% auto 0 auto;
	border-top:1px solid #FFF;
	
}
.thank-bg-btmbg-lt{
	font-family: 'Optima';
	font-size:20px;
	color:#FFF;
	float:left;
	margin-left:10%;
	font-weight:normal;
}
.thank-bg-btmbg-rt{
	width:198px;
	float:right;
	margin-right:10%;
}
	
@media (max-width: 767px) {
    .rt-mainbox{
	width:100%;
	position:absolute;
	padding:0px;
	margin-top:40px;
	float:right;
	box-sizing:border-box;
	z-index:999;
	right:0px;
}
.wn-termbox, .wn-mainbox{
	margin-top:10px;
	width:99%;}
header                 
{ height:auto; }
ul#language{
	clear:both;
	width:100%;
	height:80px;}
	
.btn {
	border: none;
	float:left;
	font-size:13px;
	color: inherit;
	background: none;
	cursor: pointer;
	padding: 10px 15px;
	display: inline-block;
	margin: 10px 5px;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight:bold;
	outline: none;
	position: relative;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
.btn:after {
	content: '';
	position: absolute;
	z-index: -1;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
.btn-2 {
	background: #cb4e4e;
	color: #fff;
	box-shadow: 0 6px #ab3c3c;
	-webkit-transition: none;
	-moz-transition: none;
	transition: none;
}

/* Button 2a */
.btn-2a {
	border-radius: 0 0 5px 5px;
}

.btn-2a:hover {
	box-shadow: 0 4px #ab3c3c;
	top: 2px;
}

.btn-2a:active {
	box-shadow: 0 0 #ab3c3c;
	top: 6px;
}

/* Button 2h */
.btn-2h {
	border-radius: 20px;
}

.btn-2h:hover {
	box-shadow: 0 4px #ab3c3c;
	top: 2px;
}

.btn-2h:active {
	box-shadow: 0 0 #ab3c3c;
	top: 6px;
}
    }



@media (max-width: 576px) {
	
	.obg1{
	background:#f803a6 url(../images/mobkw.jpg) no-repeat center 0px;
	}
	
	.obgar{
	background:#ea9301 url(../images/mobkw.jpg) no-repeat center 0px;}
	
	.winner{background:#ea9301 url(../images/b32019mob.jpg) no-repeat center 0px;}

	}