/*! HTML5 Boilerplate v8.0.0 | MIT License | https://html5boilerplate.com/ */

/* main.css 2.1.0 | MIT License | https://github.com/h5bp/main.css#readme */
/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */
/*
@import url("../font/stylesheet.css");
@import url("../font/dostyle.css");
*/
@import url("../font/font.css");
html {
  color: #222;
  font-size: 1em;
  line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * Vendor-prefixed and regular ::selection selectors cannot be combined:
 * https://stackoverflow.com/a/16982510/7133471
 *
 * Customize the background color to match your design.
 */

::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio,
canvas,
iframe,
img,
svg,
video {
  vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
  resize: vertical;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide visually and from screen readers
 */

.hidden,
[hidden] {
  display: none !important;
}

/*
 * Hide only visually, but have it available for screen readers:
 * https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 *
 * 1. For long content, line feeds are not interpreted as spaces and small width
 *    causes content to wrap 1 word per line:
 *    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
 */

.sr-only {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
  /* 1 */
}

/*
 * Extends the .sr-only class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */

.sr-only.focusable:active,
.sr-only.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  white-space: inherit;
  width: auto;
}

/*
 * Hide visually and from screen readers, but maintain layout
 */

.invisible {
  visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix::before,
.clearfix::after {
  content: " ";
  display: table;
}

.clearfix::after {
  clear: both;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */
}

@media print,
  (-webkit-min-device-pixel-ratio: 1.25),
  (min-resolution: 1.25dppx),
  (min-resolution: 120dpi) {
  /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   https://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
  *,
  *::before,
  *::after {
    background: #fff !important;
    color: #000 !important;
    /* Black prints faster */
    box-shadow: none !important;
    text-shadow: none !important;
  }

  a,
  a:visited {
    text-decoration: underline;
  }

  a[href]::after {
    content: " (" attr(href) ")";
  }

  abbr[title]::after {
    content: " (" attr(title) ")";
  }

  /*
   * Don't show links that are fragment identifiers,
   * or use the `javascript:` pseudo protocol
   */
  a[href^="#"]::after,
  a[href^="javascript:"]::after {
    content: "";
  }

  pre {
    white-space: pre-wrap !important;
  }

  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }

  /*
   * Printing Tables:
   * https://web.archive.org/web/20180815150934/http://css-discuss.incutio.com/wiki/Printing_Tables
   */
  thead {
    display: table-header-group;
  }

  tr,
  img {
    page-break-inside: avoid;
  }

  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }

  h2,
  h3 {
    page-break-after: avoid;
  }
}

:root{
	--e_blue:#0025FF;
	--glob_blue:#06063C;
}




.flex_column {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.flex_row {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.f_around {
  justify-content: space-around;
}

.f_center {
  justify-content: center;
}


body{
	/*
	background-image: url('../img/d_bg.png');
	background-repeat: no-repeat;
	background-size: auto 100% ;
	background-size: 100% 100%;
	*/
	
	min-height:100vh;
	background-color: var(--glob_blue);/* Initial background color */
	/*
	  background-image: url('../img/ng_stars_desktop2x.png');
	  background-repeat: no-repeat;
	  background-size: 100% auto; 
	  background-position: center 90px;
	  background-blend-mode: overlay;*/
   
}

.codes_container{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 10px;
gap: 20px;

width: 520px;
height: 81px;

background: #0025FF;

flex: none;
order: 0;
flex-grow: 0;

margin-bottom: 75px;
    margin-top: 121px;
}

.codes_txt_1{
font-family: 'Proxima Nova Rg';
font-style: normal;
font-weight: 600;
font-size: 14px;
line-height: 12px;
color: #FFFFFF;

}


.codes_txt_2{
	/* ОБМІНЯТИ КОДИ НА ПОДАРУНКИ */


font-family: 'Proxima Nova Bl';
font-style: normal;
font-weight: 900;
font-size: 16px;
line-height: 12px;
/* identical to box height, or 75% */
text-decoration-line: underline;
text-transform: uppercase;

/* WHITE */
color: #FFFFFF;


/* Inside auto layout */
flex: none;
order: 1;
flex-grow: 0;
cursor:pointer;
}

.megogo_container{display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 10px;
gap: 20px;

width: 520px;
height: 81px;

background: #0025FF;

flex: none;
order: 0;
flex-grow: 0;
}


.megogo_txt_1{
font-family: 'Proxima Nova Bl';
font-style: normal;
font-weight: 600;
font-size: 18px;
line-height: 12px;
color: #FFFFFF;
color:#FCE444

}

.megogo_txt_2{


font-family: 'Proxima Nova Bl';
font-style: normal;
font-weight: 900;
font-size: 19px;
line-height: 12px;
/* identical to box height, or 75% */
text-decoration-line: underline;
text-transform: uppercase;

/* WHITE */
color: #FFFFFF;
text-transform: uppercase;   border: 5px solid white;    padding: 10px;	
}







#desktop_logo{
		
	background-image: url('../img/p_logo.png');
	background-size:100% 100%;
	width:43px;
	height:43.5px;
	    
	    margin-left: 39px;
	
}
#desktop_logo2{
		
	background-image: url('../img/p_logo22.png');
	background-size:100% 100%;
	width:59px;
	height:59px;
	    
	    margin-left: 39px;
	
}
#desktop_logo2_m{
		
	background-image: url('../img/p_logo22.png');
	background-size:100% 100%;
	width:20px;
	height:20px;
	    
	   
	
}









#kv_main_mob{
		
	background-image: url('../img/kv_main_mob.png');
	background-image: url('../img/kv_main_mob_v2.png?v=2');
	background-size:100% 100%;
	width:359px;
	height:354.5px;
	width:340.5px;
	height:377px;
	
	
	    
	    
	
}



#kv_sec_mob{
		
	background-image: url('../img/kv_sec_mob.png');
	background-size:100% 100%;
	width:375px;
	height:300px;
	    
	    
	
}

#winners_kv_sec_mob{
		
	background-image: url('../img/winners_kv_sec_mob.png');
	background-size:100% 100%;
	width:370.5px;
	height:620px;
	    
	    
	
}
#support_kv_sec_mob{
		
	background-image: url('../img/support_kv_sec_mob.png');
	background-size:100% 100%;
	width:370.5px;
	height:415px;
	    
	    
	
}

#checkout_kv_sec_mob{
		
	background-image: url('../img/checkout_kv_sec_mob.png');
	background-size:100% 100%;
	width:370.5px;
	height:415px;
	 margin-top: 70px;   
	    
	
}

#faq_kv_sec_mob{
		
	background-image: url('../img/faq_kv_sec_mob2.png');
	background-size:100% 100%;
	width:370.5px;
	height:640px;
	    
	    
	
}






#nav {
 /*
  padding-left: 10%;
  padding-right: 10%;
  */
  display: flex;
  align-items: center;
  justify-content: space-between;
  z-index: 1;
 /* position: absolute;*/
    width: 100%;
	
	height: 60px;
	background: var(--e_blue);


font-family: 'Proxima Nova Bl';
font-family: 'Proxima Nova Ebld';
font-style: normal;
font-weight: 900;
font-size: 16px;
line-height: 19px;
text-transform: uppercase;

color: #FFFFFF;
z-index:3;
position:relative;


}

.nav_link {

	margin-left:32px;
	cursor:pointer;

}


.nav_underline_active {
  
  position: relative;
  color: #FCE444;
}

.nav_link:hover {
  
  position: relative;
  color: #FCE444;
}

.nav_link:hover::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0px; 
  width: 100%;
  height: 1px; 
  background-color: #FCE444; 
}
.nav_underline_active::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0px; 
  width: 100%;
  height: 1px; 
  background-color: #FCE444; 
}

.proxima_black{
	font-family: 'Proxima Nova Bl';
}

.proxima_regular{
	font-family: 'Proxima Nova Rg';
}

.proxima_semibold{
	font-family: 'Proxima Nova Sb';
}

#footer_main{
	/*
position: fixed;
bottom:0;*/
position:relative;
height:125px;
    width: 100%;
background: #0E0E96;

/*
	  background-image: url('../img/footer_desktop_bg.png');
	  background-repeat: no-repeat;
	  background-size: 100% auto; 
	  background-position: center;*/
z-index:1;
}


#footer_main_mob{
position: fixed;
bottom:0;
min-height:145px;
/*height:215px;*/
    width: 100%;
background: #0E0E96;

	 display:flex;
	 flex-direction:column;
	 align-items:center;
	 justify-content:space-evenly;
}

#kv_main_desktop,#kv_main_cab{
height:659px;
    width: 1100px;
	  background-image: url('../img/kv_main_desktop2x_v2.png');
	  background-repeat: no-repeat;
	  background-size: 100% 100%; 
z-index:0;
transform-origin: left;
}


#kv_main_cab{
width:1123px;
    height: 951px;
    height: 860px;
	  background-image: url('../img/kv_cab_desktop2x_v2.png');
	  background-repeat: no-repeat;
	  background-size: 100% 100%; 
z-index:0;
transform-origin: bottom;
}

.text_chance{
	/* 1 */


font-family: 'Proxima Nova Ebld';
font-style: normal;
font-weight: 800;
font-size: 34.4057px;
line-height: 42px;

color: #FFFFFF;



/* Inside auto layout */
flex: none;
order: 0;
flex-grow: 0;

}


#kv_main_desktop{
height:608.5px;
    width: 1107.5px;
	  background-image: url('../img/kv_main_desktop2x_v3.png');
	  background-repeat: no-repeat;
	  background-size: 100% 100%; 
z-index:0;
transform-origin: bottom;
}

 
#be_m{
width:196px;
    height: 159px;
	  background-image: url('../img/be_popup_m.png');
	  background-repeat: no-repeat;
	  background-size: 100% 100%; 
	position:absolute;
	right: -73px;
    bottom: -99px;
}
 
#ch_m{
width:220px;
    height: 129.5px;
	  background-image: url('../img/ch_popup_m.png');
	  background-repeat: no-repeat;
	  background-size: 100% 100%; 
	position:absolute;
	right: -73px;
    bottom: -105px;
}
 
#btn_b_tg{
    width: 165.71px;
    height: 167.5px;
    background-image: url(../img/btn_add2x.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    position: absolute;
    right: -50px;
    bottom: -105px;
	cursor:pointer;
}


#be_counter_d{
    width: 147.5px;
    height: 65.5px;
    background-image: url(../img/be_counter_d.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    position: absolute;
    left: 13%;
    top: 22%;
	
}


#be_counter_m{
    width: 61px;
    height: 22.5px;
    background-image: url(../img/be_counter_m.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    position: absolute;
    left: 3%;
   top: calc(9% - 2.5px);
	
}

#be_counter_d_txt{
	transform: rotate(-4.8deg);
	font-family: 'Proxima Nova Bl';
	font-style: normal;
	font-weight: 900;
	font-size: 18px;
	line-height: 22px;

	text-transform: uppercase;
	position:absolute;
	color:#FFFFFF;
	bottom: 19px;
    right: 11.8px;
}

#be_counter_m_txt{
	
font-family: 'Proxima Nova Bl';
    font-style: normal;
    font-weight: 900;
    font-size: 10px;
    line-height: 12px;
    text-transform: uppercase;
    position: absolute;
    color: #FFFFFF;
    bottom: 2px;
    right: 3.8px;
}

#ch_counter_d{
    width: 148.5px;
    height: 59px;
    background-image: url(../img/ch_counter_d.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    position: absolute;
   right: 12%;
    top: 23%;
	
}

#ch_counter_m{
    width: 61px;
    height: 20px;
    background-image: url(../img/ch_counter_m.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    position: absolute;
        right: 2%;
    top: 9%;
	
}


#ch_counter_d_txt{
	transform: rotate(4.8deg);
	font-family: 'Proxima Nova Bl';
	font-style: normal;
	font-weight: 900;
	font-size: 18px;
	line-height: 22px;

	text-transform: uppercase;
	position:absolute;
	color:#FFFFFF;
	bottom: 12px;
    right: 11.8px;
}

#ch_counter_m_txt{
	
font-family: 'Proxima Nova Bl';
    font-style: normal;
    font-weight: 900;
    font-size: 10px;
    line-height: 12px;
    text-transform: uppercase;
    position: absolute;
    color: #FFFFFF;
    bottom: 2px;
    right: 3.8px;
}


#btn_b_tg_area_click{
	position:absolute;
	bottom:0;
	width:100px;
	height:100px;
	cursor:pointer;
	    margin-left: 30px;
}

#btn_b_tg_area_click2{
	margin-top: 5px;
    position: absolute;
    top: 0;
    width: 115px;
    height: 42px;
    cursor: pointer;
	    
}

#be_message_popup_text,#ch_message_popup_text{
	width: 75%;
}


.popups_ball{
	

    width: 131px;
    height: 139px;
    background-image: url(../img/popups_ball.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    position: absolute;
    bottom: -94px;
    right: 100px;
	cursor:pointer;

}

.btn_b_tg_area_click_popup{
	position:absolute;
	bottom:0;
	width:100px;
	height:86px;
	cursor:pointer;
}

.btn_b_tg_area_click_popup2{
	position:absolute;
	top:0;
	width: 115px;
    height: 45px;
	cursor:pointer;
}



#snow_main{
position: fixed;
bottom:125px;
height:100vh;
    width: 100%;
	  background-image: url('../img/bg_snow_bottle2x.png');
	  background-repeat: no-repeat;
	  background-size: 100% auto; 
	  background-position: center bottom;
z-index:0;
}

#snow_main_mob{
position: fixed;
bottom:245px;
height:100vh;
    width: 100%;
	  background-image: url('../img/bg_mob_snow2x.png');
	  background-repeat: no-repeat;
	  background-size: 100% auto; 
	  background-position: center bottom;
z-index:0;
}


#desk_legal{
	/* Акція під назвою «Вигравай призи на зимовому!» діє з 01.11.24 по 31.01.25 на всій території України,  окрім ТОТ та територій проведення бойових дій. Вигляд продукту та подарунків може відрізнятись  від зображеного. *Мається на увазі сертифікат на відпочинок на двох на два дні в одному з готелів, розташованих у підніжжя гори Буковель. Детальніше на сайті pepsi.ua */

position: absolute;
width: 550px;
width: 50%;
height: 48px;
right: calc(50% - 550px/2 - 346px);
right: 10%;
top: 45px;

font-family: 'Proxima Nova Rg';
font-style: normal;
font-weight: 400;
font-size: 11px;
line-height: 12px;
color: #FFFFFF;


}

#desk_legal2{
	width: 781px;
    height: 33px;
    font-family: 'Proxima Nova Rg';
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 15px;
    text-align: center;
    color: #FFFFFF;
    flex: none;
    order: 0;
    flex-grow: 0;
    text-transform: none;
}


.scale{
	scale:1.0;
}

.btn_b_tg{
	    left: 15px;
    
	
	position:relative;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;


width: 252.21px;
height: 56.38px;

/* ELECTRIC BLUE */
background: #0025FF;
box-shadow: 0px 1.44371px 2.88743px rgba(0, 0, 0, 0.27);
}


.btn_y_tg{
    z-index: -1;
    position: absolute;
    width: 257.11px;
    height: 56.38px;
   left: 8.86px;
    top: 4.83px;
background: #FFED00;
box-shadow: 0px 1.44371px 2.88743px rgba(0, 0, 0, 0.27);

}
.btn_w_vb{
    z-index: -1;
    position: absolute;
    width: 257.11px;
    height: 56.38px;
   left: 8.86px;
    top: 4.83px;
background: #FFFFFF;
box-shadow: 0px 1.44371px 2.88743px rgba(0, 0, 0, 0.27);

}



.btn_tg_before{
	/* Frame 1984077845 */

/* Auto layout */
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
/*padding: 7.76711px 7.11985px;*/
gap: 6.47px;

width: 172px;
height: 40px;

background: #FF1400;
border-radius: 3.55203px;

/* Inside auto layout */
flex: none;
order: 1;
flex-grow: 0;




font-family: 'Pepsi Owners';
font-style: normal;
font-weight: 300;
font-size: 24px;
line-height: 40px;
/* or 143% */
/* leading-trim and text-edge are draft CSS properties.

Read more: https://drafts.csswg.org/css-inline-3/#leading-trim
*/
leading-trim: both;
text-edge: cap;
text-align: center;
text-transform: uppercase;

color: #FFF200;


/* Inside auto layout */
flex: none;
order: 1;
flex-grow: 0;

	
}


.btn_vb_before{
	/* Frame 1984077844 */

/* Auto layout */
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
gap: 6.47px;

width: 172px;
height: 40px;

background: #FCE444;
border-radius: 3.55203px;

/* Inside auto layout */
flex: none;
order: 0;
flex-grow: 0;



font-family: 'Pepsi Owners';
font-style: normal;
font-weight: 300;
font-size: 24px;
line-height: 40px;
/* or 143% */
/* leading-trim and text-edge are draft CSS properties.

Read more: https://drafts.csswg.org/css-inline-3/#leading-trim
*/
leading-trim: both;
text-edge: cap;
text-align: center;
text-transform: uppercase;

color: #000000;


/* Inside auto layout */
flex: none;
order: 1;
flex-grow: 0;


}

.tg_text{
	/* В Telegram */
white-space: nowrap;
/*
width: 114px;
height: 22px;*/
/*
font-family: 'Proxima Nova Bl';
font-style: normal;
font-weight: 900;
font-size: 18px;
line-height: 22px;*/
/* identical to box height */
text-transform: uppercase;

/* Yellow */
color: #FFED00;
/* Inside auto layout */
flex: none;
order: 1;
flex-grow: 0;

font-family: 'PepsiOwners-Compressed';
font-style: normal;
font-weight: 300;
font-size: 24.424px;
line-height: 41px;

}
.vb_text{
	white-space: nowrap;
	/* В Telegram */

/*width: 114px;
height: 22px;*/
/*
font-family: 'Proxima Nova Bl';
font-style: normal;
font-weight: 900;
font-size: 18px;
line-height: 22px;*/
/* identical to box height */
text-transform: uppercase;

/* Yellow */
color: #000000;
/* Inside auto layout */
flex: none;
order: 1;
flex-grow: 0;


font-family: 'PepsiOwners-Compressed';
font-style: normal;
font-weight: 300;
font-size: 24.424px;
line-height: 41px;

}

.footer_main_star{
width: 40px;
height: 40px;
background: url('../img/footer_main_star.png');
/*transform: matrix(1, -0.08, 0.1, 0.99, 0, 0);*/
background-size: 100% 100%; 
position:absolute;

}

.mtg_ico{
width: 27.43px;
height: 27.43px;
background: url('../img/mtg_ico.png');
/*transform: matrix(1, -0.08, 0.1, 0.99, 0, 0);*/
flex: none;
order: 0;
flex-grow: 0;
background-size: 100% 100%; 
margin-right:8px;
}

.mweb_ico{
width: 27.43px;
height: 27.43px;
background: url('../img/mweb_ico.png');
/*transform: matrix(1, -0.08, 0.1, 0.99, 0, 0);*/
flex: none;
order: 0;
flex-grow: 0;
background-size: 100% 100%; 
margin-right:8px;
}
.mvb_ico{
width: 27.43px;
height: 27.43px;
background: url('../img/mvb_ico.png');
/*transform: matrix(1, -0.08, 0.1, 0.99, 0, 0);*/
flex: none;
order: 0;
flex-grow: 0;
background-size: 100% 100%; 
margin-right:8px;
}

#hl_d{
width: 575.5px;
height: 295.5px;
background: url('../img/headline_desk_2x.png');
background-size: 100% 100%; 

}

#prize_d{
width: 874px;
height: 381px;
background: url('../img/prize.png');
background: url('../img/new_prize.png');
background-size: 100% 100%; 
    margin-top: -129px;
    margin-left: 95px;

}

#main_d_container,#end_of_promo_sec_main_m{
	position: relative;
    z-index: 1;
	/*margin-top: 70px;*/
	/*margin-top: -27px;*/
    display: flex;
    width: 100%;
}


#main_d_container
{
	min-height: calc(100vh - 60px - 125px);
}

.txt_main_before{


font-family: 'Proxima Nova Bl';
font-style: normal;
font-weight: 900;
font-size: 13.0569px;
line-height: 16px;
text-align: center;
text-transform: uppercase;

/* WHITE */
color: #FFFFFF;
margin-bottom:50px;

}

.abo_d{
	
	/* або */


font-family: 'Proxima Nova Bl';
font-style: normal;
font-weight: 900;
font-size: 14.0581px;
line-height: 17px;
text-transform: uppercase;

/* ELECTRIC BLUE */
color: #0025FF;

margin-bottom:10px;
margin-top:10px;

}

.btn_fix{
	margin-left:-24px;
}

#container_d_btn{
	/*position: absolute;
       left: 7%;
    top: 22%;*/
    transform: rotate(-2deg);
	z-index:2;
}

.label_input{
	/* Введіть номер телефону одержувача в Новій Пошті */
align-self:flex-start;
margin-top:20px;
margin-bottom:12px;
font-family: 'Proxima Nova Rg';
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 16px;
color: #FFFFFF;


}

.input_g{
	
display: flex;
flex-direction: row;
align-items: center;
/*padding: 10px 16px;*/
padding-left:16px;
gap: 21px;
width: 517px;
height: 32px;

background: #FFFFFF;
/*box-shadow: inset 0px 3px 10px rgba(14, 14, 150, 1);*/


font-family: 'Proxima Nova Sb';
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 18px;

border-radius:10px;


}


.f_textarea {
  width: 287px;
  height: 317px;

display: flex;
flex-direction: row;
align-items: flex-start;
padding: 26px 16px;
gap: 21px;


background: #FFFFFF;
border: 2px solid #0025FF;
/
/*box-shadow: inset 0px 3px 10px rgba(14, 14, 150, 0.31);*/
border-radius:10px;
}





/*faq*/

#faq_container{



box-sizing: border-box;

display: flex;
flex-direction: column;
align-items: center;
padding: 16px;
gap: 16px;

width:600px;

background: #0E0E96;
box-shadow: 1px 5px 10px rgba(0, 0, 0, 0.19);
border-radius: 10px;

}



.question_container{
	position:relative;
	/* Frame 127 */

/* Auto layout */
display: flex;
flex-direction: row;
align-items: center;
padding: 15px;
gap: 15px;

width: 600px;


background: #0025FF;
border-radius: 4px;

/* Inside auto layout */
flex: none;
order: 0;
/*align-self: stretch;*/
flex-grow: 0;
margin-bottom:10px;



color: #FFF200;


}
.question{
	text-align: left;
	width:95%;
}
.arrow {
     /* margin-right: 15px;*/
   /* margin-bottom: 8px;*/
   width: 14.5px;
  height: 8.5px;
  
}




	  
	  
	.arrow::before {
  position: absolute;
  content:'';
  width: 14.5px;
  height: 8.5px;
  background-image: url('../img/faq_close_2x.png');
	background-size: 100% 100%;
  transition: transform .25s;
}

.arrow.down::before {
	
	background-image: url('../img/faq_open_2x.png');
	width: 14.5px;
  height: 8.5px;
  /*transform: rotate(180deg);*/
  transition: transform .25s;
  
}  

.question_text{
	    width: 86%;
  
      padding-left: 15px;
 /* Протягом якого періоду триває Акція? */

/*
font-family: 'Proxima Nova Bl';
font-style: normal;
font-weight: 800;
font-size: 16px;
line-height: 16px;*/

font-family: 'PepsiOwners-Regular';
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 18px;
/* identical to box height */

/* Як знайти Код? */




/* Inside auto layout */
flex: none;
order: 0;
flex-grow: 0;
color: white;

}

.question_text_active{
	color: #FFF200;
}

.answer_text{
	    width: 95%;
  padding-left: 15px;
  display:none;
 /* Акція проводиться з «00» год. «00» хв. 01 квітня  2025 року до «23» год. «59» хв. 31 травня 2025 року включно. Останній день реєстрації кодів в Акції – «23» год. «59» хв. 31 травня 2025 року за київським часом. */

font-family: 'Proxima Nova Rg';
font-family: 'Proxima Nova Bold';
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 17px;

color: rgba(14, 14, 150, 0.4);


/* Frame 155 */

/* Auto layout */
flex-direction: column;
align-items: flex-start;
padding: 8px 16px;
/* WHITE */
background: #FFFFFF;
/* shadow pepsi */
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.08);
border-radius: 4px;

/* Inside auto layout */
flex: none;
order: 0;
flex-grow: 0;




}



/*faq*/


.select2-container {
    width: 100% !important; /* Ensures full-width */
    font-size: 16px;        /* Custom font size */
	height: 38px !important;
	max-width:340px !important
}

/* Dropdown arrow */
.select2-container .select2-selection__arrow b {
    border-color: #333 transparent transparent transparent; /* Custom arrow color */
}

/* Custom background and border */
.select2-container--default .select2-selection--single {
    background-color: #f8f8f8;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 5px;
}

.select2-container .select2-selection--single {
height: 38px !important;
padding: 5px 16px;
gap: 21px;
background: #FFFFFF;
box-shadow: inset 0px 3px 10px rgba(14, 14, 150, 0.31);

}

.select2-container--default .select2-selection--single{
	border-radius:10px !important;
}

.save_np_button{
align-self:flex-start;
margin-top:20px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
padding: 0px 24px;
padding: 0px 5px;
gap: 4px;

width: 280px;
height: 48px;

background: #FCE444;
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.08);
border-radius:4.35px;
/*
font-family: 'Proxima Nova Bl';
font-style: normal;
font-weight: 900;
font-size: 18px;
line-height: 22px;*/
font-family: 'PepsiOwners-Compressed';
font-style: normal;
font-weight: 300;
font-size: 24.09px;
line-height: 41px;
/* identical to box height, or 122% */
display: flex;
align-items: center;
text-align: center;
text-transform: uppercase;

/* BLACK */
color: #000000;


}


#instr_d_container{
	/* інструкція */

position: absolute;
width: 510.78px;
height: 80px;
left: 836.98px;
top: 561px;


}


#win_view_d {
  background-image: url('/img/win_view2x_d.png');
  width: 481.5px;
  height: 130.5px;
  background-size: 100% 100%;
 /* right: 30px;
  top: 6px;
  position: absolute;*/

}

#footer_other{
margin-top: auto;
/*height:209px;*/
    width: 100%;
background: #0025FF;

	  /*background-image: url('../img/footer_desktop_bg.png');
	  background-repeat: no-repeat;
	  background-size: 100% auto; 
	  background-position: center;*/
	  display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 1;
    /* position: absolute; */
   
    font-family: 'Proxima Nova Ebld';
    font-style: normal;
    font-weight: 900;
    font-size: 16px;
    line-height: 19px;
    text-transform: uppercase;
    color: #FFFFFF;
    z-index: 3;
       padding-top: 10px;
	       padding-bottom: 10px;
	  
	  
	box-shadow: 0px -2px 4px rgba(0, 0, 0, 0.25);  
	  
z-index:0;
}


#footer_other_m{
margin-top: auto;
/*height:55px;*/
padding-top:10px;
padding-bottom:10px;
    width: 100%;
background: #0025FF;

	  /*background-image: url('../img/footer_desktop_bg.png');
	  background-repeat: no-repeat;
	  background-size: 100% auto; 
	  background-position: center;*/
	  display: flex;
	  flex-direction:column;
    align-items: center;
    justify-content: space-around;
    z-index: 1;
    /* position: absolute; */
   
    font-family: 'Proxima Nova Bl';
    font-style: normal;
    font-weight: 900;
    font-size: 7px;
    line-height: 11px;
   /* text-transform: uppercase;*/
    color: #FFFFFF;
    z-index: 3;
   
	  
		  
	box-shadow: 0px -2px 4px rgba(0, 0, 0, 0.25);    
	  
	  
z-index:0;
}

.text_ball{
    position: absolute;
    bottom: -20px;
    right: 9px;
    width: 132px;
    height: 12px;
    font-family: 'Proxima Nova Ebld';
    font-style: normal;
    font-weight: 300;
    font-size: 7px;
    line-height: 12px;
    text-align: center;
    text-transform: uppercase;
    color: #FFF200;
    flex: none;
    order: 0;
    flex-grow: 0;

}

#checkout_m{
	min-height: calc(100vh - 43px);
	flex-direction:column;
}

#snow_checkout{
/*position: fixed;*/
height:100vh;
    width: 100%;
	  background-image: url('../img/bg_snow_checkout.png');
	  background-repeat: no-repeat;
	  background-size: 100% auto; 
	  background-position: center bottom;
z-index:0;
margin-top:-24%
}



#mob_menu_content_container {
  position: absolute;
  /* top:37px; */
  top: 0px;
  width: 100vw;
  /* height:calc(100vh - 37px); */
  height: calc(100vh);
  left: 0;
  right: 0;
  
  z-index: 50;
  
background-color:#0025FF;
  padding-top: 15px;
  padding-bottom: 15px;
 
}

#mob_menu {
  justify-content: flex-end;
  padding-right: 0px;
  width: 100%;
  z-index: 1000;
  height:43px;


}


#mob_menu_container {
  height: 43px;
  width: 100%;
background-color: #0025FF;
  cursor: pointer;
 /* margin-bottom: -38px;*/
  z-index: 3;
}


#d_brgr {
  background-image: url('/img/dburger.png');
  width: 29px;
  height: 26.5px;
  background-size: 100% 100%;
  right: 16px;
  top: 6px;
  position: absolute;

}

#snow_chekout_m,#snow_feedback_m {
  background-image: url('/img/snow_checkout_m2x.png');
  width: 375px;
  height: 632px;
  background-size: 100% 100%;
  margin-top: -50%;

}

#feedbackm, #cabm,#winnersm,#shopm {
    display: flex;
    z-index: 1;
    width: 100%;
    background-color: #0E0E96;
    background-color: #000000;
}
#winnersm {
background-image: url(../img/blur_popup.png);
    background-position: bottom;
    background-size: 100% 100%;
}

#sec_faq_m{
	 
	 
}

#feedbackm{
	        background-image: url(../img/bg_sec_supp.png);
        background-repeat: no-repeat;
        background-size: 100% 100%;
       /*background-position: bottom;*/
       background-position-y: -60px;
}

#checkoutm{
	        background-image: url(../img/bg_sec_supp.png);
        background-repeat: no-repeat;
        background-size: 100% auto;
       background-position: bottom;
}
#cabm{
	        background-image: url(../img/cab_m_bg.png);
        background-repeat: no-repeat;
        background-size: 100% 100%;
       background-position: top;
}
#shopm{
	        background-image: url(../img/bg_shop_m.png);
        background-repeat: no-repeat;
        background-size: 100% auto;
       background-position: bottom;
}

#sec_faq_m{
	
	/*
	        background-image: url(../img/bg_shop_m.png);
        background-repeat: no-repeat;
        background-size: 100% auto;
       background-position: top;*/
}


#menu_close {
  background-image: url('/img/mclose.png');
  width: 29px;
  height: 29px;
  background-size: 100% 100%;
  right: 30px;
  top: 6px;
  position: absolute;

}

#cab_m_top {
  background-image: url('/img/cab_m_top.png');
  width: 367.5px;
  height: 447px;
  
  
  background-image: url('/img/cab_m_top2.png');
  width: 375px;
  height: 752.5px;
  background-size: 100% 100%;
  
}

#win_view_m {
  background-image: url('/img/win_view2x_mob.png');
  width: 342px;
  height: 92.5px;
  background-size: 100% 100%;
 /* right: 30px;
  top: 6px;
  position: absolute;*/

}
#root_m {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.nav_link_m {


text-align: center;

color: #F5F5F5;


margin-bottom: 54px;


font-family: 'Proxima Nova Bl';
font-style: normal;
font-weight: 900;
font-size: 20.4076px;
line-height: 37px;
/* identical to box height, or 183% */
text-transform: uppercase;

/* WHITE */
color: #FFFFFF;




}


#popup_cd{
padding: 32px;
gap: 14px;

width: 458px;
height: 270px;
/* GLOBE BLUE */
background: #0E0E96;
/* shadow pepsi */
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.08);

	
	left: 0;
    right: 0;
    margin: auto;
    top: 34.3%;
    position: fixed;
}

.popup_overlay {
  background: #000000;
  opacity: 0.75;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  z-index: -1;
  width: 100%;
  height: 100%;

}

#message_popup{	
border: 1px solid yellow;
	z-index:50;
padding: 32px;
gap: 14px;

width: 458px;
height: 270px;
/* GLOBE BLUE */
/*background: #0E0E96;*/
/* shadow pepsi */
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.08);

	
	left: 0;
    right: 0;
    margin: auto;
    top: 22.3%;
    position: fixed;
	
	
	
/* Pop-ups market 7 */


/*background: #000000;*/
border: 1.06294px solid #FFFFFF;
box-shadow: 0px 0.531469px 1.59441px rgba(0, 0, 0, 0.08);
border-radius: 5.31469px;


}


.star_overlay{
	background-image: url('../img/bg_main_left.png');
    background-size: contain;    
	position:absolute;
	top:0;
	left:0;
	bottom:0;
	right:0;
	z-index:0;
}

.star_overlay_shop{
	background-image: url('../img/star_overlay_shop.png');
    background-size: contain;    
	position:absolute;
	top:0;
	left:0;
	bottom:0;
	right:0;
	z-index:0;
}

.popup_bg{
	position: relative;
    z-index: 1;
}

.popup_container{
	border: 1px solid yellow;
	z-index:50;
padding: 32px;
gap: 14px;

width: 458px;
height: 320px;
/* GLOBE BLUE */
background: #0E0E96;
background: #000000;
/* shadow pepsi */
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.08);

	
	left: 0;
    right: 0;
    margin: auto;
    top: 22.3%;
    position: fixed;
	
	font-family: 'Proxima Nova Rg';
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 18px;

leading-trim: both;
text-edge: cap;
text-align: center;

/* WHITE */
color: #FFFFFF;

border: 2px solid #FFFFFF;box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.08);border-radius: 10px;
}


.bg_blur_popup{
	background-image: url(https://pepsilays2025.s3.eu-west-1.amazonaws.com/img/blur_popup.png);
    background-position: bottom;
    background-size: 100% 100%;
}

.bot_popup_frame{
	/* Frame 1984077935 */

box-sizing: border-box;

/* Auto layout */
display: flex;
flex-direction: column;
align-items: center;
padding: 20px 16px;
gap: 16px;



background: #0025FF;
border: 1px solid #FFFFFF;
border-radius: 10px;

/* Inside auto layout */
flex: none;
/*order: 1;*/
flex-grow: 0;
position:relative;
margin-bottom:15px;
margin-top:15px;
width:85%;
}


.bot_popup_prize_img {

  background-image: url('/img/bot_popup_prize_img.png');
  width: 98px;
  height: 127px;
  background-size: 100% 100%;
  position: absolute;
 top: -57px;
    right: -67px;
  
  
  
}

#message_popup_text{

	/* Для входу, введіть свій e-mail */


font-family: 'Proxima Nova Rg';
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 18px;

leading-trim: both;
text-edge: cap;
text-align: center;

/* WHITE */
color: #FFFFFF;

}

#code_reg_reply{
	/* Popup Подарунки */


/* Auto layout */
display: flex;
flex-direction: column;
align-items: center;
padding: 48px 32px 32px;
gap: 17px;
isolation: isolate;

width: 786px;
/*height: 288px;*/

/* ELECTRIC BLUE */
background: #0025FF;
border: 9px solid #FFFFFF;
/* shadow pepsi */
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.08);

/* Inside auto layout */
flex: none;
order: 0;
flex-grow: 0;
z-index: 0;

font-family: 'Proxima Nova Rg';
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 18px;
leading-trim: both;
text-edge: cap;
text-align: center;

/* WHITE */
color: #FFFFFF;

    z-index: 50;



background: #000000;
border: 1.06294px solid #FFFFFF;
box-shadow: 0px 0.531469px 1.59441px rgba(0, 0, 0, 0.08);
border-radius: 5.31469px;


}


.popup_close_u,
.popup_close {

  background-image: url('/img/cross_close_popup_b.png');
  width: 24.5px;
  height: 24px;
  background-size: 100% 100%;
  position: absolute;
  top: 13px;
  right: 13px;
  z-index: 1;
  cursor: pointer;
}


.popup_close_w {

  background-image: url('/img/cross_close_popup_w.png');
  width: 24.5px;
  height: 24px;
  background-size: 100% 100%;
  position: absolute;
  top: 13px;
  right: 13px;
  z-index: 1;
  cursor: pointer;
}

.popup_close_w:hover {
	cursor:pointer
}
.popup_close_u:hover,
.popup_close:hover ,
{

background-image: url('/img/cross_close_popup_y.png');}


#popup_header{

	display: flex;
    flex-direction: column;
    justify-content: center;
	width: 100%;
	height: 48px;

	background: #2AD2C9;

}

.txt_big{
	margin-top:40px;
	font-family: 'Futura PT';
	font-style: normal;
	font-weight: 700;
	font-size: 20px;
	line-height: 26px;
	text-align: center;
	text-transform: uppercase;
	color: #4B1900;
}
.txt_sm{
	margin-top:14px;
	font-family: 'Futura PT';
	font-style: normal;
	font-weight: 450;
	font-size: 16px;
	line-height: 21px;
	text-align: center;
	color: #4B1900;
}

#c_cd{
	/*right: 0;*/
    width: 1160px;
    bottom: 50px;
    left: -315px;
    transform: scale(0.4);
    position: absolute;
    margin: auto;
}

#t1{
	font-size: 24px;
	line-height: 27px;
	text-align: center;
	text-transform: uppercase;
	color: white;
	font-weight: 700;

}

#t2{
	
	font-size: 24px;
	line-height: 22px;text-align: center;color: white;;margin-top:20px;
	
	


}

#t3{
	font-size: 24px;
	line-height: 27px;text-align: center;color: white;margin-top:15px;
	
}

.mobile {
  display: none;
}

.snowflake{
		background-image: url('../img/snowflake.png');
		height:32px;
		width:32px;
		background-repeat: no-repeat;
		background-size: auto 100% ;
		background-size: 100% 100%;
}

.instr_d{
		background-image: url('../img/instr_d_2x.png');
		height:67px;
		width:485px;
		background-repeat: no-repeat;
		background-size: auto 100% ;
		background-size: 100% 100%;
		
		    position: absolute;
    /*left: 150px;*/
    left: 66px;
    top: 40px;
}
.instr_m{
		background-image: url('../img/instr_m_2x.png');
		height:47.5px;
		width:347.5px;
		background-repeat: no-repeat;
		background-size: auto 100% ;
		background-size: 100% 100%;
		
		
}



.popup_logo1{
		background-image: url('../img/popup_logo1.png');
		
		width:569px;
		height:114.5px;
		background-repeat: no-repeat;
		background-size: auto 100% ;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}


.reg_code_mob{
		background-image: url('../img/reg_code_m.png');
		
		width:210px;
		height:26px;
		background-repeat: no-repeat;
		background-size: auto 100% ;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}


.reg_code_d{
		background-image: url('../img/reg_code_d.png');
		
		width:293px;
		height:26px;
		background-repeat: no-repeat;
		background-size: auto 100% ;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

.registered_code_d{
		background-image: url('../img/registered_code_d.png');
		
		width:288px;
		height:20.5px;
		background-repeat: no-repeat;
		background-size: auto 100% ;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

.reg_code_table2{
	/* Frame 1984077851 */

/* Auto layout */
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
padding-left:10.2162px;
gap: 9.29px;

width: 280px;
height: 32px;

background: #FFFFFF;
border-radius: 5.0968px;

/* Inside auto layout */
flex: none;
order: 0;
flex-grow: 0;

	
}

#right_support_d{
		background-image: url('../img/right_support.png');
		
		width:710.5px;
		height:769px;
		background-repeat: no-repeat;
		background-size: auto 100% ;
		background-size: 100% 100%;
		position:absolute;
		right:0;
		bottom:0;
		
		   
}

#right_faq_d{
		background-image: url('../img/right_faq.png');
		
		width:626px;
		height:932px;
		background-repeat: no-repeat;
		background-size: auto 100% ;
		background-size: 100% 100%;
		position:absolute;
		right:0;
		bottom:0;
		
		
		   
}

#mob_cab_ch{
		background-image: url('../img/mob_cab_img_ch.png');
		
		width:309.5px;
		height:213px;
		background-repeat: no-repeat;
		background-size: auto 100% ;
		background-size: 100% 100%;
		position: relative;
		   
}

.delivery_filled,.no_gifts{
	/* Дякуємо за надані дані для відправки. Будь ласка, перевір їх ще раз та, за потреби, онови. */


font-family: 'Proxima Nova Rg';
font-style: normal;
font-weight: 400;
font-size: 20px;
line-height: 22px;
/* or 110% */
text-align: center;

/* WHITE */
color: #FFFFFF;



}

#left_support_d{
		background-image: url('../img/left_support.png');
		
		width:596.5px;
		height:767.5px;
		background-repeat: no-repeat;
		background-size: auto 100% ;
		background-size: 100% 100%;
		position:absolute;
		left:0;
		bottom:0;
		
		   
}


#left_faq_d{
		background-image: url('../img/left_faq.png');
		
		width:540px;
		height:905px;
		background-repeat: no-repeat;
		background-size: auto 100% ;
		background-size: 100% 100%;
		position:absolute;
		left:0;
		bottom:0;
		
		   
}

#right_shop_d{
		background-image: url('../img/right_support.png');
		
		width:710.5px;
		height:769px;
		background-repeat: no-repeat;
		background-size: auto 100% ;
		background-size: 100% 100%;
		position:absolute;
		right:0;
		bottom:0;
		
		   
}


#right_checkout_d{
		background-image: url('../img/right_checkout.png');
		width:462.5px;
		height:888px;
		
		background-repeat: no-repeat;
		background-size: auto 100% ;
		background-size: 100% 100%;
		position:absolute;
		right:0;
		top:0px;
		
		   
}

#left_checkout_d,#left_shop_d{
		background-image: url('../img/left_support.png');
		
		width:596.5px;
		height:767.5px;
		background-repeat: no-repeat;
		background-size: auto 100% ;
		background-size: 100% 100%;
		position:absolute;
		left:0;
		bottom:0;
		
		   
}

#left_checkout_d{
		background-image: url('../img/left_checkout.png');
		
		width:422px;
		height:848px;
		background-repeat: no-repeat;
		background-size: auto 100% ;
		background-size: 100% 100%;
		position:absolute;
		left:0;
		top:0;
		
		   
}



#left_winners_d{
		background-image: url('../img/left_winners.png');
		
		width:734px;
		height:990.5px;
		background-repeat: no-repeat;
		background-size: auto 100% ;
		background-size: 100% 100%;
		position:absolute;
		left:0;
		top:0;
		
		   
}


#right_winners_d{
		background-image: url('../img/right_winners.png');
		width:618px;
		height:959px;
		
		background-repeat: no-repeat;
		background-size: auto 100% ;
		background-size: 100% 100%;
		position:absolute;
		right:0;
		top:0px;
		
		   
}

#sec_faq_d,#sec_checkout_d,#sec_main_d,#feedbackd,#cabd,#winnersd,#shopd,#end_of_promo_sec_main_d{
	    min-height: calc(100vh - 60px);
    display: flex;
    flex-direction: column;
	background-color:#000000;
	/*
		background-image: url('../img/blur_bg2x.png');
	  background-repeat: no-repeat;
	  background-size: 100% 100%; 
	  background-position: center 90px;*/
	  
	  
	  
	  background-image: url(../img/blur_bg_full.png);
    background-repeat: no-repeat;
    background-size: 150% 150%;
    background-position: center 340px;
}

.checkout_gift_container{

display: flex;
flex-direction: column;
align-items: flex-end;
padding: 24px 20px;
gap: 16px;



background: #0E0E96;
border-radius: 10px;
}

#win_container_d{
	
	/* Виграні подарунки */

box-sizing: border-box;

/* Auto layout */
display: flex;
flex-direction: column;
align-items: center;
padding: 16px;


/*
background: #0E0E96;
box-shadow: 1px 5px 10px rgba(0, 0, 0, 0.19);
border-radius: 10px;
*/

box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: center;
align-items: center;

width: 656px;
height: 689px;
/*top: 60px;*/
/*
background: rgba(14, 14, 150, 0.95);
border: 2px solid #0025FF;
box-shadow: 1px 5px 10px rgba(0, 0, 0, 0.19);
*/
}

#shop_container_d{

box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: center;
align-items: center;

width: 1309px;
height: 689px;
/*top: 60px;*/

background: rgba(14, 14, 150, 0.95);
border: 2px solid #0025FF;
box-shadow: 1px 5px 10px rgba(0, 0, 0, 0.19);

}

.shop_header{
	/* Frame 153 */

/* Auto layout */
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: flex-start;
width:100%;


height: 45px;

background: #0025FF;




font-family: 'Proxima Nova Sb';
font-style: normal;
font-weight: 600;
font-size: 14px;
line-height: 12px;
/* identical to box height, or 86% */

/* WHITE */
color: #FFFFFF;
align-self: flex-start;





}

.shop_header_container{

/* Frame 153 */

/* Auto layout */
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
/*padding: 10px 24px;*/
gap: 20px;

width: 100%;
height: 86px;

/* ELECTRIC BLUE */
background: #0025FF;
border-radius: 10px;

/* Inside auto layout */
flex: none;
order: 0;
align-self: stretch;
flex-grow: 0;


}

.text_shop{
	font-family: 'Proxima Nova Ebld';
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 22px;
text-transform: uppercase;

/* WHITE */
color: #FFFFFF;


/* Inside auto layout */
flex: none;
order: 0;
align-self: stretch;
flex-grow: 0;
}

.gift_container{
	display:flex;
	flex-direction: column;
	margin-top:30px;
	margin-bottom:30px;
	
}

.gifts{
	display:flex;
}

.gifts_header{
	/* Стакани  за 5 кодів: */


font-family: 'Proxima Nova Bl';
font-style: normal;
font-weight: 900;
font-size: 22px;
line-height: 21px;
/* or 100% */

/* Yellow */
color: #FFFFFF;
margin-bottom:15px;

}

.gift{
	margin-right:10px;
}

.gift_size_d{
	
	width:110px;
	height:110px;
	    
}
.bbgift{
	/*
	background-color:#0025FF;
	position:absolute;
	bottom:0;
	left:0;
	z-index:-1;
	width:95%;
	height:95%;*/
}

.remains{
font-family: 'Proxima Nova Rg';
font-style: normal;
font-weight: 600;
font-size: 10px;
line-height: 14px;
leading-trim: both;
text-edge: cap;

/* WHITE */
color: #FFF200;
white-space: nowrap;
	
	align-self:flex-start;
	margin-left:5px;


}

.gift_name{
	/* Дизайн №1,  залишилось 4 одиниці */

font-family: 'Proxima Nova Ebld';
font-style: normal;
font-weight: 900;
font-size: 12px;
line-height: 14px;

leading-trim: both;
text-edge: cap;

color: #FFFFFF;
white-space: nowrap;
	
	
	align-self:flex-start;
	margin-left:5px;

}

.gifts{
	height: unset;
    background: unset;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    min-width: 350px;
}

.gift{
	display: flex
					;
    flex-direction: column;
    align-items: center;
}

#shoptop_m{
	position: relative;
	background-image: url('../img/shoptop_m.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		
		width:351px;
		height:269px;
		   
}
#shoptop_d{
	position: relative;
	background-image: url('../img/shoptop_d.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		
		width:1337.5px;
		height:369.5px;
		   
}

#i3d_keychain_for_beshketniy{
	position: relative;
	background-image: url('../img/gifts/3d_keychain_for_beshketniy_not_available.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#i3d_keychain_for_chemniy{
	position: relative;
	background-image: url('../img/gifts/3d_keychain_for_chemniy_not_available.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#i3d_keychain_pepsi_bottle{
	position: relative;
	background-image: url('../img/gifts/3d_keychain_pepsi_bottle.png');	
	background-image: url('../img/gifts/3d_keychain_pepsi_bottle_not_available.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}


.i3d_keychain_for_beshketniy{
	position: relative;
	background-image: url('../img/gifts/3d_keychain_for_beshketniy_not_available.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

.i3d_keychain_for_chemniy{
	position: relative;
	background-image: url('../img/gifts/3d_keychain_for_chemniy_not_available.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

.i3d_keychain_pepsi_bottle{
	position: relative;
	background-image: url('../img/gifts/3d_keychain_pepsi_bottle.png');	
	background-image: url('../img/gifts/3d_keychain_pepsi_bottle_not_available.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#flat_keychain_for_beshketniy_design1{
	position: relative;
	background-image: url('../img/gifts/flat_keychain_for_beshketniy_design1.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#flat_keychain_for_beshketniy_design2{
	position: relative;
	background-image: url('../img/gifts/flat_keychain_for_beshketniy_design2.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#flat_keychain_for_chemniy_design1{
	position: relative;
	background-image: url('../img/gifts/flat_keychain_for_chemniy_design1.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#flat_keychain_for_chemniy_design2{
	position: relative;
	background-image: url('../img/gifts/flat_keychain_for_chemniy_design2.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#glass_for_beshketniy_design1{
	position: relative;
	background-image: url('../img/gifts/glass_for_beshketniy_design1.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#glass_for_beshketniy_design2{
	position: relative;
	background-image: url('../img/gifts/glass_for_beshketniy_design2.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#glass_for_beshketniy_design3{
	position: relative;
	background-image: url('../img/gifts/glass_for_beshketniy_design3.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#glass_for_chemniy_design1{
	position: relative;
	background-image: url('../img/gifts/glass_for_chemniy_design1.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#glass_for_chemniy_design2{
	position: relative;
	background-image: url('../img/gifts/glass_for_chemniy_design2.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#glass_for_chemniy_design3{
	position: relative;
	background-image: url('../img/gifts/glass_for_chemniy_design3.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#soft_toy_for_beshketniy{
	position: relative;
	background-image: url('../img/gifts/soft_toy_for_beshketniy.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#soft_toy_for_chemniy{
	position: relative;
	background-image: url('../img/gifts/soft_toy_for_chemniy.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#glass2{
	position: relative;
	background-image: url('../img/glass2_2x.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#glass3{
	position: relative;
	background-image: url('../img/glass3_2x.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#glass4{
	position: relative;
	background-image: url('../img/glass4_2x.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#glass5{
	position: relative;
	background-image: url('../img/glass5_2x.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#socks1{
	position: relative;
	background-image: url('../img/socks1_2x.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#socks2{
	position: relative;
	background-image: url('../img/socks2_2x.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#sweetshot{
	position: relative;
	background-image: url('../img/sweetshot2x.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		margin-bottom: 15px;
		   
}

#shop_img2{
	position: absolute;
	background-image: url('../img/shop_img2.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		width:70.5px;
		height:71px;
		left:-50px;
		   
}

#shop_img3{
	position: absolute;
	background-image: url('../img/shop_img3.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		width:106.5px;
		height:124px;
		right:50px;
		   
}

#shop_img4{
	position: absolute;
	background-image: url('../img/shop_img4.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		width:147px;
		height:172px;
		left: -420px;
		top: -120px;
}

#shop_img5{
	position: absolute;
	background-image: url('../img/shop_img5.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		width:135.5px;
		height:142px;
		right: -400px;
		top: -220px;
		   
}
#shop_img6{
	position: absolute;
	background-image: url('../img/shop_img6.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		width:96.5px;
		height:72.5px;
		right: -130px;
		top: -220px;
		   
}



#shop_img7{
	position: absolute;
	background-image: url('../img/shop_img7.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		width:53px;
		height:52.5px;
		left: -130px;
		top: -30px;
		   
}


#checkout_i1{
	position: absolute;
	background-image: url('../img/checkout_i1.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		width:77.5px;
		height:75px;
	right: -30px;
    top: -34px;
		   
}

#checkout_i2{
	position: absolute;
	background-image: url('../img/checkout_i2.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		width:30.5px;
		height:28px;
		left: -16px;
    top: -15px;
		   
}

#checkout_i3{
	position: absolute;
	background-image: url('../img/checkout_i3.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		width:42px;
		height:59px;
		right: 0px;
    top: 420px;
		   
}

#checkout_i4{
	position: absolute;
	background-image: url('../img/checkout_i4.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		width:34px;
		height:39px;
		left: 0px;
    top: -60px;
		   
}


#faq_m_top{
	
	background-image: url('../img/faq_top_stars.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		width:325px;
		height:43px;
	margin-top: 11px;
    margin-bottom: -25px;
    margin-left: 50px;	   
}

#winners_top_m{
	
	background-image: url('../img/winners_top_m.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		width:303px;
		height:56.5px;
	margin-top: 11px;
    margin-bottom: -25px;
    
}

#faq_top_d{

	background-image: url('../img/faq_top_d.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		width:463.5px;
		height:254.5px;
		margin-top:41px;
		margin-bottom:31px;
		
}

#winners_top_d{

	background-image: url('../img/winners_top_d.png');	
		background-repeat: no-repeat;
		background-size: 100% 100%;
		width:494.5px;
		height:292px;
		
		margin-bottom:5px;
		
}

.shopstatus_d{
/* Frame 355 */

box-sizing: border-box;

/* Auto layout */
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
padding: 19.1508px 20.6239px;
gap: 14.73px;

width: 469.39px;
height: 56.57px;

background: #0F0F42;
/* ELECTRIC BLUE */
border: 1.47314px solid #0025FF;
border-radius: 7.22137px;

/* Inside auto layout */
flex: none;
order: 0;
flex-grow: 0;


/* 15.06.2025 13:31:00 */


font-family: 'Proxima Nova Ebld';
font-style: normal;
font-weight: 800;
font-size: 21.6641px;
line-height: 18px;
/* identical to box height, or 82% */

color: #FFFFFF;


/* Inside auto layout */
flex: none;
order: 0;
flex-grow: 0;


}


.shop_drop_frame{
	/* Frame 326 */

	box-sizing: border-box;

	/* Auto layout */
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	padding: 10px 24px;
	gap: 14.73px;

	width: 109px;
	height: 34.15px;

	background: #0E0E96;
	border: 1.47314px solid #0025FF;
	border-radius: 7.22137px;

	/* Inside auto layout */
	flex: none;
	order: 0;
	flex-grow: 0;
	
	/* 01.12.25 */


font-family: 'Proxima Nova Ebld';
font-style: normal;
font-weight: 800;
font-size: 16px;
line-height: 18px;
/* or 110% */
display: flex;
align-items: center;

color: #FFFFFF;


margin-right:10px;
}


.st_text{
	font-family: 'Proxima Nova Ebld';
font-style: normal;
font-weight: 800;
font-size: 26.6641px;
line-height: 24px;
/* identical to box height, or 82% */

color: #FFFFFF;
text-transform:uppercase;
}

.btn_exchange{
	    text-align: center;

display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
padding: 4px;

width: 86px;
height: 26px;

/* WHITE */
background: #FFFFFF;
border-radius: 2px;

/* Inside auto layout */
flex: none;
order: 1;
flex-grow: 0;


font-family: 'Proxima Nova Rg';
font-style: normal;
font-weight: 600;
font-size: 14px;
line-height: 18px;
/* identical to box height, or 129% */

/* Navy Blue */
color: #06063C;    margin-top: 10px;

align-self:flex-start;
	margin-left:5px;
	
	background: #0025FF;
	color:white;
cursor:pointer;
}

.size_container{
	/* Frame 168 */
margin-bottom:15px;
box-sizing: border-box;

/* Auto layout */
display: flex;
flex-direction: row;
align-items: center;
padding: 8px 11px;


width: 98%;
height: 42px;

/* ELECTRIC BLUE */
background: #0025FF;
/* WHITE */
border: 1px solid #FFFFFF;
/* shadow pepsi */
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.08);

/* Inside auto layout */
flex: none;
order: 1;
flex-grow: 0;

	justify-content:space-between;
}

.btn_shop_popup{
	/* Frame 167 */

/* Auto layout */
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;


width: 86px;
height: 26px;

/* Yellow */
background: #FFED00;
border-radius: 2px;





font-family: 'Proxima Nova Rg';
font-style: normal;
font-weight: 600;
font-size: 14px;
line-height: 18px;
/* identical to box height, or 129% */

/* Navy Blue */
color: #06063C;




}














.frame_win{	/* Frame 163 */

width: 96%;
height: 310px;
}

.win_header{
	/* Переможці відпочинку у Буковелі */

height: 18px;


font-family: 'PepsiOwners-Regular';
font-style: normal;
font-weight: 400;
font-size: 16px;
line-height: 18px;
text-transform: uppercase;

color: #0025FF;
color: #FFFFFF;
color: #FFF200;

/* Inside auto layout */
flex: none;
order: 0;
flex-grow: 0;
margin-bottom: 4px;
}


.winners_data_container
{
	width: 100%;
    height: 320px;
    overflow: auto;
    margin-top: 14px;	
	/* 00.00 */


font-family: 'Proxima Nova Bl';
font-style: normal;
font-weight: 900;
font-size: 12px;
line-height: 14px;
text-transform: uppercase;
color: #0E0E96;



	
}

.winners_row{
	
 justify-content: center;   
font-family: 'Proxima Nova Ebld';
font-style: normal;
font-weight: 100;
font-size: 12px;
line-height: 14px;
text-transform: uppercase;

color: #0E0E96;
width:100%;
margin-top: 8px;
}
.winner_header_row{

font-family: 'Proxima Nova Ebld';
font-style: normal;
font-weight: 900;
font-size: 12px;
line-height: 14px;
text-transform: uppercase;
color: #FFFFFF;
width:100%;
}
.winner_date,.winner_code, .winner_name{
	margin-right:2%;
	/* Frame 155 */

/* Auto layout */
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
/*
padding-top: 10px;
padding-bottom: 10px;*/

height: 35px;
background: #FFFFFF;
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.08);

width:max(30%,194px);
text-align:center;

border-radius:4px;
 overflow-wrap: anywhere;
 word-break: break-word;
}

.winners_data_container {
  justify-content: flex-start !important;
}
/*
.winners_data_container {
  justify-content: flex-start !important; 
  align-items: stretch !important;
  overflow: auto;          
  position: relative;     
  box-sizing: border-box;
}

.winners_data_container > *:first-child {
  margin-top: 0 !important;
}

.winner_header_row,
.winners_row {
  flex: 0 0 auto;
}

*/


.c_scroll::-webkit-scrollbar {
      width: 5px;
    }
    .c_scroll::-webkit-scrollbar-track {
    border-right: 2px solid rgba(14, 14, 150, 0.95);
    border-left: 2px solid rgba(14, 14, 150, 0.95);
   
    background-color:  #0025FF;

     
    }
    .c_scroll::-webkit-scrollbar-thumb {
           background-color:#0025FF;
    border-radius: 2px;
	width:5px;
       
      
       
    }
.btn_gray{
	background-color: #90A9D5;
	color: #06063C;
}

.total_gifts{
	/* 5 */

font-family: 'Proxima Nova Ebld';
font-style: normal;
font-weight: 800;
font-size: 16px;
line-height: 12px;
/* identical to box height, or 75% */

color: #FFF200;


/* Inside auto layout */
flex: none;
order: 1;
flex-grow: 0;

	
}

@media screen and (orientation:landscape) { 	
background-size: auto 100% ;

 }
 
 

  #root_m {
    display: none;
  }
      #root_d {
    min-height:680px;
	min-width:1440px;
  }
@media screen and (max-width: 1000px) {
	
	.shop_drop_frame{
		width:171px;
		margin-right:0px;
	}
	
	#shop_drops_container_m{
		width: 350px;
		align-self: center;
	}
	
	.winners_data_container
	{
		
		    margin-top: 8px;	
	}
	
	.winner_date,.winner_code, .winner_name{
		
		
		height: 28px;
		
	}
	.win_header{
		font-size: 10px;
		line-height: 14px;
		
	}
	
	
	.winner_date,.winner_code, .winner_name{}
	.winners_row, .winner_header_row{
		font-size:10px;
		line-height:12px;
		
	}
	
	.st_text{
		font-size:20px;
	}
	.shop_header{
		font-size:12px;
	}
	
	.btn_exchange{
		width:121px;
		align-self:center;
		margin-left:0;
	}	
	.remains{
		
		align-self:center;
		margin-left:0;
	}
	.gift_name{
		
		align-self:center;
		margin-left:0;
	}
	.gift_size_d{
		
		width:143px;
		height:143px;
		
	}
	.popups_ball{
		right: 40px;
	}
	
	#be_m{
	width:98px;
    height: 79.5px;
	bottom: -48px;
	right:0px;
	
	}
	
	
	#ch_m{
	width:110px;
    height: 64.75px;
	bottom: -51px;
	right:0px;
	
	}
	
	#be_message_popup_text,#ch_message_popup_text{
		width:100%;
	}
	
	
	#faq_container{
		width: 96%;
	}
	
	.question_container{
		width:90%;
	}
	.answer_text{
		    width: 90%;
		
	}
	#desktop_logo{
		margin-left:16px;
	}
	
	.megogo_container,.codes_container{
		width:95%
	}
	
	.codes_container{
		margin-bottom: 50px;
    margin-top: 10px;
	}
	
	.remains{
		white-space: pre-wrap;
	}
	
	.gift_size_d{
		
		height:134px;
		width:134px;
		
	}
	.nav_link{
		margin-left:5px;
		margin-right:5px;
		text-transform:uppercase;
	}
	

	#win_container_d,#shop_container_d{
		width:100%;
	}
	
	
	#desk_legal_m{
		    text-align: center;
    /*margin: auto;*/
    bottom: 0;
    left: 0;
    right: 0;
    
    width: 83%;
    /*height: 48px;*/
    /* left: calc(50% - 550px / 2 - 346px); */
    /* top: 45px; */
    font-family: 'Proxima Nova Rg';
    font-style: normal;
    font-weight: 400;
    font-size: 7px;
    line-height: 12px;
    color: #FFFFFF;
	}
	#hl_d{
		width:254.9px;
		height:130.6px;
	}
	#prize_m2,#prize_m{
		width:375px;
		height:216px;
		margin-left:unset;
		margin-top:unset;
		/*background: url('../img/mob_prize2x.png');
		background: url('../img/new_mob_prize2x.png');*/
		background: url('../img/new_new_mob_prize2x.png');
background-size: 100% 100%; 
	}
			
	
	body{
		    background-color: var(--glob_blue);
    background-image: url(../img/ng_stars_desktop2x.png);
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: center 90px;
	}
	
.select2-container {
    width: calc(100% - 0px) !important; /* Ensures full-width */
    font-size: 16px;        /* Custom font size */
	height: 36px !important;
	max-width: 367px !important;
	
	font-family: 'Proxima Nova Sb';
	font-style: normal;
	font-weight: 400;
	font-size: 14px;
	line-height: 18px;
	color: black !important;
}

/* Dropdown arrow */
.select2-container .select2-selection__arrow b {
    border-color: #333 transparent transparent transparent; /* Custom arrow color */
}

/* Custom background and border */
.select2-container--default .select2-selection--single {
    background-color: #f8f8f8;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 5px;
}

.select2-container .select2-selection--single {
height: 36px !important;
padding: 5px 16px;
gap: 21px;
background: #FFFFFF;
box-shadow: inset 0px 3px 10px rgba(14, 14, 150, 0.31);

}


.select2-container--default .select2-selection--single{
	border-radius:4.86px !important;
}
	
	.mobile {
    display: block;
  }
      #root_d {
    display: none;
  }
  
  .input_g{
	  width:347px;
	  height:36px;
	  padding:unset;
	  padding-left:16px;
line-height: 16px;
border-radius:4.86px;





  }
  
  
.input_checkout{
	width: calc(100% - 16px) !important;
}

  #root_m {
    display: flex;
	background-color:#0E0E96;
	min-height: max(100vh, 806px);
	background-color: var(--glob_blue);
        background-image: url(../img/bg_desktop_full.png);
        background-repeat: no-repeat;
        background-repeat: repeat-y;
        background-size: 100% auto;
        background-position: center 45px;
		    
			position:relative;
  }
	
		
	#t2{
		margin-top: 15px;line-height: 21px;
	}	
	
	#t3{
		margin-top: 15px;
	}	
	#t2,#t3{
		
		font-size:20px;
	}
		
	#popup_cd{
			
width: 307px;
height: 259px;
			top: 20.3%;
	}
	
	#message_popup{
			
width: 307px;
height: 259px;
			top: 20.3%;
	}
	
	.popup_container{			
width: 307px;
height: 320px;
			top: 20.3%;position: absolute;}	
	#code_reg_reply{			
width: 307px;
height: 320px;
			top: 20.3%;
			    padding: unset;
    padding-top: 48px;
    padding-bottom: 49px;
			position: absolute;
			
			}
	
	#c_cd{
	right: 0;
    width: 1182px;
    bottom: 30px;
    left: -403px;
    transform: scale(0.27);
    position: absolute;
    margin: auto;
	}	

.btn_b_tg{
	    left: 15px;
    
	
	position:relative;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;


width: 149px;
height: 33px;

/* ELECTRIC BLUE */
background: #0025FF;
box-shadow: 0px 1.44371px 2.88743px rgba(0, 0, 0, 0.27);
}




.btn_tg_before{
	/* Frame 1984077845 */

/* Auto layout */
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
/*padding: 7.76711px 7.11985px;*/
gap: 6.47px;

width: 172px;
height: 40px;

background: #FF1400;
border-radius: 3.55203px;

/* Inside auto layout */
flex: none;
order: 1;
flex-grow: 0;




font-family: 'Pepsi Owners';
font-style: normal;
font-weight: 300;
font-size: 20px;
line-height: 29px;
/* or 143% */
/* leading-trim and text-edge are draft CSS properties.

Read more: https://drafts.csswg.org/css-inline-3/#leading-trim
*/
leading-trim: both;
text-edge: cap;
text-align: center;
text-transform: uppercase;

color: #FFF200;


/* Inside auto layout */
flex: none;
order: 1;
flex-grow: 0;

	
}


.btn_vb_before{
	/* Frame 1984077844 */

/* Auto layout */
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
gap: 6.47px;

width: 172px;
height: 40px;

background: #FCE444;
border-radius: 3.55203px;

/* Inside auto layout */
flex: none;
order: 0;
flex-grow: 0;



font-family: 'Pepsi Owners';
font-style: normal;
font-weight: 300;
font-size: 20px;
line-height: 29px;
/* or 143% */
/* leading-trim and text-edge are draft CSS properties.

Read more: https://drafts.csswg.org/css-inline-3/#leading-trim
*/
leading-trim: both;
text-edge: cap;
text-align: center;
text-transform: uppercase;

color: #000000;


/* Inside auto layout */
flex: none;
order: 1;
flex-grow: 0;


}

.btn_y_tg{
    z-index: -1;
    position: absolute;
   
width: 149px;
height: 33px;
   left: 8.86px;
    top: 4.83px;
background: #FFED00;
box-shadow: 0px 1.44371px 2.88743px rgba(0, 0, 0, 0.27);

}
.btn_w_vb{
    z-index: -1;
    position: absolute;
    
width: 149px;
height: 33px;
   left: 8.86px;
    top: 4.83px;
background: #FFFFFF;
box-shadow: 0px 1.44371px 2.88743px rgba(0, 0, 0, 0.27);

}

.tg_text{
	/* В Telegram */
white-space: nowrap;
width: unset;
height: unset;
/*
font-family: 'Proxima Nova Bl';
font-style: normal;
font-weight: 900;
font-size: 12px;
line-height: 22px;*/

font-family: 'PepsiOwners-Compressed';
font-style: normal;
font-weight: 300;
font-size: 20px;
line-height: 29px;
/* identical to box height */
text-transform: uppercase;

/* Yellow */
color: #FFED00;
/* Inside auto layout */
flex: none;
order: 1;
flex-grow: 0;

}
.vb_text{
	white-space: nowrap;
	/* В Telegram */

width: unset;
height: unset;
/*
font-family: 'Proxima Nova Bl';
font-style: normal;
font-weight: 900;
font-size: 12px;
line-height: 22px;*/

font-family: 'PepsiOwners-Compressed';
font-style: normal;
font-weight: 300;
font-size: 20px;
line-height: 29px;
/* identical to box height */
text-transform: uppercase;

/* Yellow */
color: #000000;
/* Inside auto layout */
flex: none;
order: 1;
flex-grow: 0;

}

.mtg_ico{
width: 16.08px;
height: 16.08px;
background: url('../img/mtg_ico.png');
/*transform: matrix(1, -0.08, 0.1, 0.99, 0, 0);*/
flex: none;
order: 0;
flex-grow: 0;
background-size: 100% 100%; 
margin-right:8px;
}

.mweb_ico{
width: 16.08px;
height: 16.08px;
background: url('../img/mweb_ico.png');
/*transform: matrix(1, -0.08, 0.1, 0.99, 0, 0);*/
flex: none;
order: 0;
flex-grow: 0;
background-size: 100% 100%; 
margin-right:8px;
}
.mvb_ico{
width: 16.08px;
height: 16.08px;
background: url('../img/mvb_ico.png');
/*transform: matrix(1, -0.08, 0.1, 0.99, 0, 0);*/
flex: none;
order: 0;
flex-grow: 0;
background-size: 100% 100%; 
margin-right:8px;
}

.txt_main_before {
    font-family: 'Proxima Nova Bl';
    font-style: normal;
    font-weight: 900;
    font-size: 10.0569px;
    line-height: 16px;
    text-align: center;
    text-transform: uppercase;
    color: #FFFFFF;
    margin-bottom: 15px;
}
#main_d_container{
margin-top: 10px;
        min-height: calc(100vh - 43px);
		bottom: 0;
    
}

#end_of_promo_sec_main_m {
margin-top: 70px;
        /*min-height: calc(100vh - 43px);*/
		
    position: absolute;
}


.f_textarea {
  width: 287px;
  height: 317px;
  
  
  /* Frame 116 */
/* Auto layout */
display: flex;
flex-direction: row;
align-items: flex-start;
padding: 26px 16px;


background: #FFFFFF;
/* ELECTRIC BLUE */
border: 2px solid #0025FF;
/* inner shadow */
box-shadow: inset 0px 3px 10px rgba(14, 14, 150, 0.31);
border-radius:4.86px;
}
/*end_mob_orientation*/
}


#landscapeWarning {
   
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.98);
    color: white;
    font-size: 24px;
    text-align: center;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: Arial, sans-serif;
	 display: none;
}

/* Optional: Landscape-specific style */
@media (orientation: landscape) {
    #landscapeWarning {
       /* display: flex;  Shows the overlay when in landscape */
    }
}





/*spinner*/
@keyframes lds-spinner {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@-webkit-keyframes lds-spinner {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}


.lds-css {
  position: absolute;
  z-index: 10000;
  width: 100%;
  height: 100%;
  background: white;
  border-radius: 10px;
  opacity: 0.5;
  
  top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.lds-spinner {
  position: relative;
  margin: auto;
  right: 0;
  left: 0;
  top: 22%;
}

.lds-spinner div {
  left: 94px;
  top: 48px;
  position: absolute;
  -webkit-animation: lds-spinner linear 1s infinite;
  animation: lds-spinner linear 1s infinite;
  background: #62B66F;
  width: 12px;
  height: 24px;
  border-radius: 40%;
  -webkit-transform-origin: 6px 52px;
  transform-origin: 6px 52px;
}

.lds-spinner div:nth-child(1) {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-animation-delay: -0.916666666666667s;
  animation-delay: -0.916666666666667s;
}

.lds-spinner div:nth-child(2) {
  -webkit-transform: rotate(30deg);
  transform: rotate(30deg);
  -webkit-animation-delay: -0.833333333333333s;
  animation-delay: -0.833333333333333s;
}

.lds-spinner div:nth-child(3) {
  -webkit-transform: rotate(60deg);
  transform: rotate(60deg);
  -webkit-animation-delay: -0.75s;
  animation-delay: -0.75s;
}

.lds-spinner div:nth-child(4) {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  -webkit-animation-delay: -0.666666666666667s;
  animation-delay: -0.666666666666667s;
}

.lds-spinner div:nth-child(5) {
  -webkit-transform: rotate(120deg);
  transform: rotate(120deg);
  -webkit-animation-delay: -0.583333333333333s;
  animation-delay: -0.583333333333333s;
}

.lds-spinner div:nth-child(6) {
  -webkit-transform: rotate(150deg);
  transform: rotate(150deg);
  -webkit-animation-delay: -0.5s;
  animation-delay: -0.5s;
}

.lds-spinner div:nth-child(7) {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  -webkit-animation-delay: -0.416666666666667s;
  animation-delay: -0.416666666666667s;
}

.lds-spinner div:nth-child(8) {
  -webkit-transform: rotate(210deg);
  transform: rotate(210deg);
  -webkit-animation-delay: -0.333333333333333s;
  animation-delay: -0.333333333333333s;
}

.lds-spinner div:nth-child(9) {
  -webkit-transform: rotate(240deg);
  transform: rotate(240deg);
  -webkit-animation-delay: -0.25s;
  animation-delay: -0.25s;
}

.lds-spinner div:nth-child(10) {
  -webkit-transform: rotate(270deg);
  transform: rotate(270deg);
  -webkit-animation-delay: -0.166666666666667s;
  animation-delay: -0.166666666666667s;
}

.lds-spinner div:nth-child(11) {
  -webkit-transform: rotate(300deg);
  transform: rotate(300deg);
  -webkit-animation-delay: -0.083333333333333s;
  animation-delay: -0.083333333333333s;
}

.lds-spinner div:nth-child(12) {
  -webkit-transform: rotate(330deg);
  transform: rotate(330deg);
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
}

.lds-spinner {
  width: 200px !important;
  height: 200px !important;
  -webkit-transform: translate(-100px, -100px) scale(1) translate(100px, 100px);
  transform: translate(-100px, -100px) scale(1) translate(100px, 100px);
}

/*spinner*/



.state_auth,.state_no_auth{
	display:none;
}

.state_no_auth{
	font-family: 'Proxima Nova Ebld';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 22px;
    
    color: #FFFFFF;
}