/************************************************************************************
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:#87b7de;
	 
}
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{
}
.winner{
	background:#56a7d5 url(https://omanoasis.com/immuno/assets/images/winnerimmuno.png) no-repeat top center;
	}

.obg{
}
.offbg{
	background:#87b7de url(https://omanoasis.com/ramadan2021/assets/images/buy-ramadan.jpg) no-repeat top center;
	background-size:contain;
    min-height:700px;
}
.winooffer{
	background:#87b7de url(https://omanoasis.com/ramadan2021/assets/images/buy-ramadan-ar.jpg) no-repeat top center;
	background-size:contain;
    min-height:700px;
}
.wrapper{
	width:1400px;
	margin:0 auto 0 auto;
	position:relative;
}
.lang{
	width:135px;
	height:40px;
	float:right;
}
.client-bg{
	width:272px;
	float:right;
	margin-top:3.2%;
	clear:both;
}
.client-bg img{
	width:100%;
	height:auto;
}
.topregg{
	width:100%;
	height:63px;
	margin-top:0%;
	float:left;
	background:url(https://omanoasis.com/season2020/assets/images/top.png) no-repeat top center;}
.topreggar{
	width:100%;
	height:63px;
	margin-top:3%;
	float:left;
	background:url(https://omanoasis.com/season2020/assets/images/topar.png) no-repeat top center;}
.rt-mainbox{
	width:350px;
	position:absolute;
	padding:10px;
	float:left;
	box-sizing:border-box;
	-webkit-box-shadow: 0px 50px 36px -23px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 50px 36px -23px rgba(0,0,0,0.5);
    box-shadow: 0px 50px 36px -23px rgba(0,0,0,0.5);
	z-index:999;
}
.wn-mainbox{
	width:510px;
	margin:0 auto;
	z-index:999;
}
.wn-winbox{
	width:1138px;
	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:fixed;
    bottom:0;
	background:url(https://omanoasis.com/season2020/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:50%;
	padding:10px;
	font-size:12px;
	color:#333;
	font-family:Arial, Helvetica, sans-serif;
	}
.ftr-btm-rt{
	width:45%;
	float:left;
	font-family:Arial, Helvetica, sans-serif;
	color:#fff;
	padding:10px;
	font-size:12px;
	margin-top:10px;
}
.ftr-btm-rt .two{
	background:url(pinkarrow.jpg) no-repeat left #d20b2f;
	min-height:80px;
	width:35%;
	float:left;
	border-radius:10px;}
	
.ftr-btm-rt .two p{
	padding:10px 5px 0 40px;}
.ftr-btm-rt .one{
	min-height:80px;
	width:60%;
	float:left;}
.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%;
}
	

/*==============Contest Style End ====================*/