@charset "utf-8";

.promise{
background: #c61919 !important; /*the colour of the button*/
text-align: center ;
}

.disabledgateway{
opacity: 0.5;
-webkit-filter: grayscale(10);
}

#showcurrency{text-align:center;}
#currency{

    border: 1px solid #A24040;
    white-space: nowrap;
    width: 20%;
    max-width:20%;
    display: inline-table;
    padding: 5px;
    border-radius: 10px;
    margin:1px;
    cursor: pointer;
}

.clickedcurrency
{
    border: 2px solid #007B28 !important;
    width:100%;
    background: white;
}

.clickednocurrency
{
    border: 1px solid #A24040;
    width:100%;
}
.padding-top{padding-top:10px;}

#confirmationdiv{
    padding: 10px;


    background: white;
    border-left: 1px aqua;
    border-right:  1px aqua; 
    border-bottom: 1px aqua;
    border-radius: 10px;
    width: 270px;

}

h09{
    text-align: center;

font-size: 20px;

font-weight: bold;}

.editbutton
{
    
cursor:pointer; /*forces the cursor to change to a hand when the button is hovered*/
padding:10px 20px; /*add some padding to the inside of the button*/
background: #727272; /*the colour of the button*/
border:1px dotted white; /*required or the default border for the browser will appear*/
/*give the button curved corners, alter the size as required*/
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 100px;
/*give the button a drop shadow*/
-webkit-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
/*style the text*/
color:white;
font-size:1.1em;
display:inline;
width:40%;

}
.editbutton:hover { 
background-color :#972d32; /*make the background a little darker*/
/*reduce the drop shadow size to give a pushed button effect*/
-webkit-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
}

.paybutton
{
    
cursor:pointer; /*forces the cursor to change to a hand when the button is hovered*/
padding:10px 20px; /*add some padding to the inside of the button*/
background: #c61919 !important; /*the colour of the button*/
border:1px dotted white; /*required or the default border for the browser will appear*/
/*give the button curved corners, alter the size as required*/
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 100px;
/*give the button a drop shadow*/
-webkit-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
/*style the text*/
color:white;
font-size:1.1em;
display:inline;
width:40%;
}
.paybutton:hover { 
background-color :#972d32; /*make the background a little darker*/
/*reduce the drop shadow size to give a pushed button effect*/
-webkit-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
}


.confirmbutton
{
    
cursor:pointer; /*forces the cursor to change to a hand when the button is hovered*/
padding:10px 20px; /*add some padding to the inside of the button*/
background: #c61919; /*the colour of the button*/
border:1px dotted white; /*required or the default border for the browser will appear*/
/*give the button curved corners, alter the size as required*/
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 100px;
/*give the button a drop shadow*/
-webkit-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
/*style the text*/
color:white;
font-size:1.1em;
}



.confirmbutton:hover { 
background-color :#972d32; /*make the background a little darker*/
/*reduce the drop shadow size to give a pushed button effect*/
-webkit-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
}

#showpack{text-align:center;}
#pack{

    border: 1px solid #A24040;
    white-space: nowrap;
    width: 39%;
    max-width:39%;
    display: inline-table;
    padding: 5px;
    border-radius: 10px;
    margin:1px;
    cursor: pointer;
}

.clickedpack
{
    border: 2px solid #007B28 !important;
    width:100%;
    background: white;
}

.clickednot
{
    border: 1px solid #A24040;
    width:100%;
}
h1092
{
    -border-bottom:2px solid #A24040;
    width:100%;
    float:left;
    padding-bottom:3px;
}
h1093
{
    border-bottom: 2px solid #A24040;
    width: 100%;
    float: center;
    padding-bottom: 3px;
    font-size: 2p;
}

input, select {
	margin: 0 auto;
	display: block;
	width:270px;
	font-size: 14px;
	color: #000;
	border: 1px solid #DADADA;
	border-radius: 100px;
	padding: 10px;
}
#usl 
{padding-top:2%;}
#labels
{display: inline-block;width: 310px;text-align: center;
}

select, #afterverify {
	width: 290px;
}


#formdiv{
      background-color:#FAFAFA;
      padding:2% 1% 2% 1%;
      width:100%;
      height:100%;
      

}
#form{
    margin: 0 auto;
      background-color:#FAFAFA;
      padding:2% 1% 2% 1%;
      width:335px;
      border:1px dotted black; /*required or the default border for the browser will appear*/
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;

}

#afterverify{
cursor:pointer; /*forces the cursor to change to a hand when the button is hovered*/
padding:5px 20px; /*add some padding to the inside of the button*/
background: #34925E; /*the colour of the button*/
border:1px dotted white; /*required or the default border for the browser will appear*/
/*give the button curved corners, alter the size as required*/
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
/*give the button a drop shadow*/
-webkit-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
/*style the text*/
color:white;
font-size:1.1em;
}

#afterverify:hover, #submitButton:focus{
background-color :#34925E; /*make the background a little darker*/
/*reduce the drop shadow size to give a pushed button effect*/
-webkit-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
}
select, #afterclick {
	width: 290px;
}




#afterclick{
cursor:pointer; /*forces the cursor to change to a hand when the button is hovered*/
padding:5px 20px; /*add some padding to the inside of the button*/
background: grey; /*the colour of the button*/
border:1px dotted white; /*required or the default border for the browser will appear*/
/*give the button curved corners, alter the size as required*/
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
/*give the button a drop shadow*/
-webkit-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
/*style the text*/
color:white;
font-size:1.1em;
}

#afterclick:hover, #submitButton:focus{
background-color :grey; /*make the background a little darker*/
/*reduce the drop shadow size to give a pushed button effect*/
-webkit-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
}

select, #clickme {
	width: 290px;
}

#clickme{
cursor:pointer; /*forces the cursor to change to a hand when the button is hovered*/
padding:10px 20px; /*add some padding to the inside of the button*/
background: #c61919; /*the colour of the button*/
border:1px dotted white; /*required or the default border for the browser will appear*/
/*give the button curved corners, alter the size as required*/
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
/*give the button a drop shadow*/
-webkit-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
/*style the text*/
color:white;
font-size:1.1em;
}

#clickme:hover, #submitButton:focus{
background-color :white; /*make the background a little darker*/
color: #c61919;
/*reduce the drop shadow size to give a pushed button effect*/
-webkit-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
}
select, #submit {
	width: 290px;
}



select, #submit_v {
	width: 290px;
}




#submit_v{
cursor:pointer; /*forces the cursor to change to a hand when the button is hovered*/
padding:10px 20px; /*add some padding to the inside of the button*/
background: #c61919; /*the colour of the button*/
border:1px solid #33842a; /*required or the default border for the browser will appear*/
/*give the button curved corners, alter the size as required*/
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
/*give the button a drop shadow*/
-webkit-box-shadow: 0 0 4px rgba(0,0,0, .75);
-moz-box-shadow: 0 0 4px rgba(0,0,0, .75);
box-shadow: 0 0 4px rgba(0,0,0, .75);
/*style the text*/
color:white;
font-size:1.1em;
}

#submit_v:hover, #submitButton:focus{
background-color :#972d32; /*make the background a little darker*/
/*reduce the drop shadow size to give a pushed button effect*/
-webkit-box-shadow: 0 0 1px rgba(0,0,0, .75);
-moz-box-shadow: 0 0 1px rgba(0,0,0, .75);
box-shadow: 0 0 1px rgba(0,0,0, .75);
}
select, #submit {
	width: 290px;
}




#submit{
cursor:pointer; /*forces the cursor to change to a hand when the button is hovered*/
padding:10px 20px; /*add some padding to the inside of the button*/
background: #c61919; /*the colour of the button*/
border:1px dotted white; /*required or the default border for the browser will appear*/
/*give the button curved corners, alter the size as required*/
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
/*give the button a drop shadow*/
-webkit-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
/*style the text*/
color:white;
font-size:1.1em;
}

#submit:hover, #submitButton:focus{
background-color :#972d32; /*make the background a little darker*/
/*reduce the drop shadow size to give a pushed button effect*/
-webkit-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
}

.symbol {
    font-size: 0.9em;
    font-family: Times New Roman;
    border-radius: 1em;
    padding: .1em .6em .1em .6em;
    font-weight: bolder;
    color: white;
    background-color: #4E5A56;
}
p.big {
    line-height: 200%;
}

.icon-info { background-color: #3229CF; }
.icon-error { background: #e64943; font-family: Consolas; }
.icon-tick { background: #13c823; }
.icon-excl { background: #ffd54b; color: black; }

.icon-info:before { content: 'i'; }
.icon-error:before { content: 'x'; }
.icon-tick:before { content: '\002713'; }
.icon-excl:before { content: '!'; }

.notify {
    width:500px;
    background-color:#e3f7fc; 
    color:#555; 
    border:.1em solid;
    border-color: #8ed9f6;
    border-radius:10px;
    font-family:Tahoma,Geneva,Arial,sans-serif;
    font-size:1.1em;
    padding:10px 10px 10px 10px;
    margin:10px;
    cursor: default;
}

.notify-yellow { background: #fff8c4; border-color: #f7deae; }
.notify-red { background: #ffecec; border-color: #fad9d7; }
.notify-green { background: #e9ffd9; border-color: #D1FAB6; }

#finalqrdiv img {
    width:85%;
}
/*pay complete button //// */
.pay_complete {
cursor: pointer;
padding: 10px 20px;
background: #c61919 !important;
border: 1px dotted white;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 100px;
-webkit-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
box-shadow: 1px 2px 19px -2px rgba(0,0,0,0.75);
color: white;
font-size: 1.1em;
display: inline;
width: 75%;
margin-top: 10px;
}