.coupon { 
    color:#d32d2d;
}

.RowBoxCcode .BoxCode {
    color: #fff59e;
}

  
.code1 .BoxCode { 
    /*color:#fff !important; */ 
    border-left: dotted 2px #d32d2d;
    border-top: dotted 2px #d32d2d;
    border-bottom: dotted 2px #d32d2d;
}

.code1 .BtnCopy{ 
    background:#d32d2d !important; 
    color:#fff !important;
} 
   
.code2 .BoxCode { 
    /*color:#fff !important;  */
    border-left: dotted 2px #ffcc00;
    border-top: dotted 2px #ffcc00;
    border-bottom: dotted 2px #ffcc00;
}

.code2 .BtnCopy{ background:#ffcc00 !important; color:#6a401a !important;}

   
.RowBoxCcode .BtnCopy:hover {
  background: #000;
  }
  
.popup-close {
	background-color:#a71242;
} 
.popup-inner {
	/*border:2px solid #e39e04;*/
	color:#fff;
}        

/* ------ */

html, body {
    height:100%;
    padding:0px; 
    margin:0px;
}

* {
  -webkit-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0; }


.coupon{ font-size:2em; font-weight:900;}

a{ text-decoration:none;}

.RowBoxCcode {
  display: block;
  width: 80%;
  height: 45px;
  line-height: 40px;
  margin: 0px auto;
  margin-bottom:16px;
  position: relative;
  text-transform: uppercase;
  font-weight: 700; }

.RowBoxCcode .BoxCode {
  display: block;
  width: 60%;
  height: 45px;

  margin: 0px;
  position: relative;
  float: left;
  font-size: 20px;
  font-weight: 600;
  border-radius:4px 0px 0px 4px;}

.RowBoxCcode .BtnCopy {
  display: block;
  width: 40%;
  height: 45px;
  line-height: 45px;
  margin: 0px;
  position: relative;
  float: left;
  font-size: 16px;
  cursor: pointer; 
  border-radius:0px 4px 4px 0px;}

 .RowBoxCcode .BtnCopy:hover > .BoxCode {
  color: #fff !important; }



/* Outer */
.popup {
	width:100%;
	height:100%;
	display:none;
	position:fixed;
	top:0px;
	left:0px;
	background:rgba(0,0,0,0.85);
	z-index:999999 !important;

}

/* Inner */
.popup-inner {
	max-width:950px;
	width:90%;
	padding:4vh 2vh 4vh 2vh;
	position:absolute;
	top:50%;
	left:50%;
	-webkit-transform:translate(-50%, -50%);
	transform:translate(-50%, -50%);
	box-shadow:0px 2px 6px rgba(0,0,0,1);
	border-radius:5px;
    background-color: #011223;
	font-size:16px;
}

.popup-inner h2{ margin-bottom:0px !important;}

.popup-inner p{ padding:5px 0px 5px 0px;}

/* Close Button */
.popup-close {
	width:30px;
	height:30px;
	padding-top:4px;
	display:inline-block;
	position:absolute;
	top:15px;
	right:15px;
	transition:ease 0.25s all;
	-webkit-transform:translate(50%, -50%);
	transform:translate(50%, -50%);
	border-radius:1000px;
	background:#011223;
	font-family:'Montserrat', sans-serif;
	font-size:20px;
    font-weight: 600;
	text-align:center;
	line-height:100%;
	color:#fff;
}

.popup-close:hover {
	-webkit-transform:translate(50%, -50%) rotate(180deg);
	transform:translate(50%, -50%) rotate(180deg);
	background:#1a1a1e;
	text-decoration:none;
}	

   .layer1 {
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
    padding: 5px; 
    float: center; 
    width: 100%; 
	text-align:center;

   }
   
   .layer1 img{ width:100%;}

   .clear {
    clear: left; 
   }

.popup-inner .btn{
    border: 1px solid #d32d2d; 
    color:#fff; 
    background-color:#d32d2d;
}

.popup-inner p{ padding:5px 0px 5px 0px;}
.popup-inner .btn:hover{transform: scale(0.96); transition: transform .2s; }



.popup-inner .btn:hover{transform: scale(0.96); transition: transform .2s; }

.popup-inner .btn{ margin-top:0px; display:flex; width:80%; text-align:center; margin:0 auto; justify-content: center; font-size:20px !important; 
padding:12px !important;}

.popup2 img{ width:100%}
.popup2 .RowBoxCcode {
  /*margin: 12px auto;*/}

.popup-inner1 {
	max-width:950px;
	width:90%;
	padding:4vh 2vh 4vh 2vh;
	position:absolute;
	top:50%;
	left:50%;
	-webkit-transform:translate(-50%, -50%);
	transform:translate(-50%, -50%);
	box-shadow:0px 2px 6px rgba(0,0,0,1);
	border-radius:5px;
    background-color: #011223;
	 font-size:16px;
}

.popup-inner1 h2{ margin-bottom:0px !important;}

.popup-inner1 p{ padding:5px 0px 5px 0px;}
.popup-inner1 .btn:hover{transform: scale(0.96); transition: transform .2s; }
.popup-inner1 .btn{
    border: 1px solid #ffcc00; 
    color:#6a401a; 
    background-color:#ffcc00;
}


.popup-inner1 .btn:hover{transform: scale(0.96); transition: transform .2s; }

.popup-inner1 .btn{ margin-top:0px; display:flex; width:80%; text-align:center; margin:0 auto; justify-content: center; font-size:20px !important; 
padding:12px !important;}


  
  /* CSS RESPONSIVE ------------*/

@media screen and (max-width: 667px) {

.RowBoxCcode {
    display: block;
    width: 80%;
    height: 60px;
    line-height: 55px;
    padding-top: 0px; }

.RowBoxCcode .BoxCode {
    width: 65%;
    height: 55px;

    font-size: 20px; }

.RowBoxCcode .BtnCopy {
    width: 35%;
    height: 55px;
    line-height: 55px;
    font-size: 16px;
	white-space:nowrap;
}
.layer1 img{ width:80%;}
}

	
@media screen and (max-width: 450px) {
	
	.RowBoxCcode, .popup-inner .btn { width: 100%;}
	.RowBoxCcode .BtnCopy {font-size: 14px;}
    .RowBoxCcode .BoxCode {width: 60%;font-size: 16px;}

.RowBoxCcode .BtnCopy {
    width: 40%;
}	

}