/* reset css */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small and, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}

body {
    line-height: 1.5;
	font-family: Arial;
	/*background: url(/images/default-source/default-album/stripe1.png) repeat; */
	background-color: #fff;
    font-size:13px;
}
 h1, h2 {
    margin-top: 0!important;
    margin-bottom: 5%;
	padding-top:5%;
	text-align:center;
	font-size: 200%!important;
    color: #0c50a1;
}

select{
    min-height: 57px;
    border-bottom: 0px;
    color: #ccc;
    padding: 16px 20px;
    color: #333;
    border: 1px solid #ccc;
    background-color: #fff;
	float:right;
	font-size:16px;
	text-transform:capitalize;
}
ol, ul {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

    blockquote:before, blockquote:after,
    q:before, q:after {
        content: '';
        content: none;
    }

table {
    border-collapse: collapse;
    border-spacing: 0;
	text-align:center;
	border-right:0px!important;
}

.shadebackcss {
    background-color: #f6f6f6;
}
.fixheadercss
{
}
.centercontentcssa
{
}
.footercontentcss
{
}


/* sitefinity overrides */
.sfNavList
{
	float:right;
	margin-right:5px;
}
.sfNavHorizontal li
{
background-color: #fff;
border: 1px solid #ccc;
margin-right: 5px;
margin-left: 5px;
}
.sfNavHorizontal a.sfSel, .sfNavHorizontal a.sfSel:hover {
    margin-top: 0px;
    padding-top: 0px;
    background-color: #ccc;
}
.sfNavHorizontal a {
    display: block;
    padding: 0 16px;
    height: 55px;
    line-height: 55px;
    color: #333;
	font-size:16px;
}
.sfPublicWrapper
{
	margin:0 auto;
}
thead tr th
{
	font-weight: bold;
}
th, td
{
	padding: 2%!important;
	text-align: center;
	border-top: 5px solid #fff!important;
    border-left: 5px solid #fff!important;
}
	
/* end of reset css */

.headercss
{
  margin-top:1%;
  margin-bottom:1%;
}
.banner img
{
  width:100%;
}

.tab {
    overflow: hidden;
    background-color: #f1f1f1;
	border-left: 1px solid #ccc;
    border-top: 1px solid #ccc;
	border-right: 1px solid #ccc;
}

/* Style the buttons inside the tab */
.tab button {
    background-color: inherit;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 2% 2%;
    transition: 0.3s;
    font-size: 18px;
	color: #000!important;
	min-height: 50px;
}

/* Change background color of buttons on hover */
.tab button:hover {
    background-color: #ddd;
}

/* Create an active/current tablink class */
.tab button.active {
	background-color: #fff!important;
    border-bottom: 1px solid #fff;
    background: url(/images/default-source/default-album/tab_underline_repeat.jpg) repeat-x;
    background-position: top;
}

/* Style the tab content */
.tabcontent {
    display: none;
    border-top: none;
    border-left: 1px solid #ccc;
    padding-left: 30px;
    border-right: 1px solid #ccc;
    padding-right: 30px;
    border-bottom: 1px solid #ccc;
    padding-bottom: 25px;
}

.tabcontent  h2 {
    margin-top: 35px;
    margin-bottom: 20px;
    font-size: 35px!important;
    font-weight: normal;
    text-align:left;
}

.tabcontent h3 {
    color: #0c50a1;
    font-weight:bold;
    border-bottom:none;
    margin:7px 0;
    font-size: 16px;
}

.tabcontent p {
    margin-bottom: 10px;
    font-size:13px;
    line-height:18px;
}

.tabcontent ul {
    padding-left: 20px;
    list-style: disc;
    margin-bottom: 18px;
    font-size:13px;
    line-height:18px;
}

/*  Accordian Style */

.accordion {
    color: #0c50a1;
    font-weight:bold;
    cursor: pointer;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    transition: 0.4s;
    margin:7px 0;
    font-size: 16px;
}

/*.active, .accordion:hover {
    background-color: #ccc;
}*/

.panel {
   /* padding: 0 18px;*/
    background-color: white;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
}


/*  End Accordian style*/

/* Style the main content */
.maincontentcss
{
	margin-top:1%;
	margin-bottom:1%;
}
.maincontentcss button
{
	width:33.333%;
    border-left: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}
.maincontentcss button.active
{
	border-left:0px;
}

#TD900EE6D011_Col01 .sfNavHorizontal a.sfSel {
    display: none;
}

#cookiesTable,#dynamicDataControllerTable {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
}

.sfContentBlock table td.col_1 {
    max-width:20px;
    word-wrap:break-word;
}

#cookiesTable td, #cookiesTable th,#dynamicDataControllerTable td,#dynamicDataControllerTable th {
    border: 1px solid #ddd;
    padding: 8px !important;
}

#cookiesTable tr:nth-child(even){background-color: #f2f2f2;}

#cookiesTable tr:hover {background-color: #ddd;}

#dynamicDataControllerTable tr:nth-child(even){background-color: #f2f2f2;}

#dynamicDataControllerTable tr:hover {background-color: #ddd;}

#dynamicDataControllerTable .col_5,#dynamicDataControllerTable .col_2,#dynamicDataControllerTable .col_4 {
    text-transform: capitalize;
}

#dynamicDataControllerTable .col_3 {
    text-transform: uppercase;
}


#cookieHtml,#dynamicDataControllerHtml {
display:none;
}
#cookiesTable th,#dynamicDataControllerTable th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    /*background-color: #4CAF50; */
	background-color:#0c50a1;
    color: white;
}

#nav-icon{
	display:none;
}

#overlay{
	display:none;
}

#brandLogo {
    display: none !important;
}
div#brandLogo img {
    width: 23%;
    padding: 0 15px;
    margin-top:-12px;
    max-width:100px;
}

.active{
	display:block !important;
}

/* Language selector style*/

.sf_cols.LanguageMainWrp {
    padding: 40px 30px 0;
}
.sf_cols.LanguageMainWrp h1 {
    text-align: left;
    padding: 0 0 1% 0;
}
.languagecss {
    width: 940px;
    margin-bottom: 10px;
}
.languagecss ul {
    display: inline-block;
    padding-left: 0;
    text-align: left;
    width: 100%;
}
.languagecss li {
    list-style: none;
    text-align: left;
    float: left;
    width: 22%;
    padding: 0;
    margin: 0 10px;
}
.languagecss li a:hover {
    color: #105CB6;
}
.languagecss li a {
    color: #000000;
	text-decoration: underline;
}

/*--- Data Controller policy table style*/
.tabTable {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100% !important;
    margin-top: 15px;
	border-bottom: 0px !important;
}
.tabTable th {
    background-color: #0c50a1;
    color: #fff;
    text-align: left;
    border: 1px solid #ddd;
    padding: 8px !important;
}
.tabTable tr:hover {
    background-color: #ddd;
}
.tabTable tr:nth-child(even) {
    background-color: #f2f2f2;
}
.tabTable td:first-child {
    max-width: 120px;
    word-wrap: break-word;
}

/*----------------------- */

@media only screen and (min-width: 1200px) and (max-width : 4000px)
{
.sfPublicWrapper
{
width: 70%;
max-width: 1200px;
}
}
@media only screen and (min-width: 960px) and (max-width : 1200px)
{
.sfPublicWrapper
{
width: 90%;
max-width: 1200px;
}
}
@media only screen and (min-width: 480px) and (max-width : 960px)
{
body
{
	font-size: 90%;
}
.sfPublicWrapper
{
padding: 2% 2%;
}
.languagecss li 
{
	width: 25%;
}

}
@media all and (max-width:992px){
    div#brandLogo img{
        max-width:70px;
        padding:0 12px;
        margin-top:0;
    }
}
@media all and (max-width:767px){
.navWrapper {

    max-width: 980px;
    margin: 0 auto;
	padding-top: 10px;

}

div#brandLogo{
width:100%;
float: left;
margin-top:10px;
}
div#brandLogo img{
    width:33%;
}
#overlay {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;

  display: none;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.89);
  z-index: 999999;
}
#overlay li a {

	color: #2d2d2d;
	font-size: 28px;
	font-weight: 600;
	text-transform: uppercase;

}
#overlay li a:hover{
    text-decoration: underline;}
.introTxt {

    color: #2d2d2d;
    font-weight: 600;

}
#overlay div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 48vh;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

#overlay ul {
  list-style: none;
  margin: 0;
  padding: 0;
  color: white;
  text-align: center;
}

#overlay ul li {
  margin:20px auto;
}


.tablinks.mobileLinks {
    border: 0;
    background: none;
    width: 100%;
    font-size: 24px;
}
.tablinks.mobileLinks:hover {
    border-bottom: 1px solid #000000;
    border-width: 2px;
}

.tablinks.pepsicoCookies {

    display: none;
}
.tablinks.aboutCookies {

    display: none;
}
.tablinks.privacypolicy {

    width: 100%;
    border-bottom: 1px solid #fff;
    background: url(/images/default-source/default-album/tab_underline_repeat.jpg) repeat-x;
    background-color: rgba(0, 0, 0, 0);
    background-position-x: 0%;
    background-position-y: 0%;
    background-position: top;
}
.tab button.active{
	background-color:none !important;
}
.tab {
    width: 100%;
}
#defaultOpen {
    background-color: inherit !important;
}

/*----------------------------------*/
/*----------------------------------*/

#nav-icon {
  position: relative;
  float:right;
  width: 45px;
  height:35px;
  z-index: 10;
  cursor: pointer;
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  display:block;
  margin-bottom: 20px;
}


#nav-icon span {
  position: absolute;
  display: block;
  width: 50%;
  height: 4px;
  background: #000;
  opacity: 1;
  right: 0;
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

#nav-icon span:nth-child(1) {
  top: 10px;
}

#nav-icon span:nth-child(2) {
  top: 20px;
}

#nav-icon span:nth-child(3) {
  top: 30px;
  right: 0px;
}

#nav-icon.animate-icon span:nth-child(1) {
  top: 18px;
  -webkit-transform: rotate(128deg);
  transform: rotate(128deg);
  right:-3px;
  width: 90%;
}

#nav-icon.animate-icon span:nth-child(2) {
  opacity: 0;
  right: 0;
}

#nav-icon.animate-icon span:nth-child(3) {
  top: 18px;
  width:100%;
  -webkit-transform: rotate(-140deg);
  transform: rotate(-140deg);
  right:-8px;
}

/*responsive table*/
table tr th:nth-child(4) {
   display:none;
}

table tr th:nth-child(5) {
   display:none;
}
table tr td:nth-child(4) {
    display:none;
}
table tr td:nth-child(5) {
    display:none;
}
#cookiesTable td, #cookiesTable th {
    padding: 0px !important;
	text-align: center;
}

/*----------------------------------*/
}


@media only screen and (min-width: 320px) and (max-width : 767px)
{
select
{
min-height: 40px;
padding: 10px 10px;
font-size:12px;
}
}
@media only screen and (min-width: 321px) and (max-width: 480px)
{
.tab button 
{
    font-size: 110%;
}
h1, h2 
{
font-size: 120%!important;

}
select
{
min-height: 40px;
padding: 10px 4px;
font-size:10px;
}
.tabcontent
{
	font-size:120%;
}
table {
    font-size: 80%;
}
body
{
font-size: 70%;
}
.sfPublicWrapper
{
padding: 2% 2%;
}
th, td
{
	padding-top: 2%!important;
	padding-bottom: 2%!important;
	padding-left: 1%!important;
	padding-right: 0!important;
}
.languagecss li 
{
	width: 33.3%;
}
th, td
{
	padding-top: 2%!important;
	padding-bottom: 2%!important;
	padding-left: 1%!important;
	padding-right: 0!important;
}



}



@media only screen and (min-width: 240px) and (max-width: 321px)
{
.tab button 
{
    font-size: 110%;
}
h1, h2 
{
font-size: 120%!important;

}
select
{
min-height: 40px;
padding: 10px 4px;
font-size:10px;
}
.tabcontent
{
	font-size:120%;
}
table {
    font-size: 80%;
}
body
{
font-size: 70%;
}
.sfPublicWrapper
{
padding: 2% 2%;
}
th, td
{
	padding-top: 2%!important;
	padding-bottom: 2%!important;
	padding-left: 1%!important;
	padding-right: 0!important;
}
.languagecss li 
{
	width: 50%;
}
th, td
th, td
{
	padding: 0.5%!important;
}

.tabTable td:first-child {
	max-width:80px;
}

}