﻿.BigGreenButton {}
.BigGreenButton  ul {margin: 0; padding:0;}
.BigGreenButton  ul li {float: left; padding: 0; margin: 0; list-style: none;  }
.BigGreenButton  ul li a {display: block; float: left; min-height: 50px; line-height: 50px; text-transform: uppercase; text-decoration: none; text-align:center; font-size: 36px; font-weight: bold; margin-right: 0px; background: #21a60e; background: -webkit-linear-gradient(#6bc762, #196f0b); background: -o-linear-gradient(#6bc762, #196f0b); background: -moz-linear-gradient(#6bc762, #196f0b); background: linear-gradient(#6bc762, #196f0b); color: white; width:300px; font-family:Sans-Serif;}
.BigGreenButton  ul li a:hover {background: #21a60e; color:white; }

.SmallGreenButton {}
.SmallGreenButton  ul {margin:0; padding:0;}
.SmallGreenButton  ul li {float: left; padding: 0; margin: 0; list-style: none;  }
.SmallGreenButton  ul li a {margin-left:20px; display: block; float: left; min-height: 50px; line-height: 50px; text-transform: uppercase; text-decoration: none; text-align:center; font-size: 24px; font-weight: bold; margin-right: 0px; background: #21a60e; background: -webkit-linear-gradient(#6bc762, #196f0b); background: -o-linear-gradient(#6bc762, #196f0b); background: -moz-linear-gradient(#6bc762, #196f0b); background: linear-gradient(#6bc762, #196f0b); color: white; width:150px; font-family:Sans-Serif;}
.SmallGreenButton  ul li a:hover {background: #21a60e; color:white; }


.MediumRedButton {}
.MediumRedButton  ul {margin: 0; padding:0;}
.MediumRedButton  ul li {float: left; padding: 0; margin: 0; list-style: none;}
.MediumRedButton  ul li a {display: block; float:left; min-height: 50px; line-height: 50px; text-transform: uppercase; text-decoration: none; text-align:center; font-size: 24px; font-weight: bold; margin-right: 0px; background: #a51211; background: -webkit-linear-gradient(#fd0000, #a51211); background: -o-linear-gradient(#fd0000, #a51211); background: -moz-linear-gradient(#fd0000, #a51211); background: linear-gradient(#fd0000, #a51211); color: white; width:250px; font-family:Sans-Serif;}
.MediumRedButton  ul li a:hover {background: #a51211; color:white; }

.BigRedButton {}
.BigRedButton  ul {margin: 0; padding:0;}
.BigRedButton  ul li {float: left; padding: 0; margin: 0; list-style: none;  }
.BigRedButton  ul li a {display: block; float: left; min-height: 60px; line-height: 60px; text-transform: uppercase; text-decoration: none; text-align:center; font-size:48px; font-weight: bold; margin-right: 0px; background: #a51211; background: -webkit-linear-gradient(#fd0000, #a51211); background: -o-linear-gradient(#fd0000, #a51211); background: -moz-linear-gradient(#fd0000, #a51211); background: linear-gradient(#fd0000, #a51211); color: white; width:350px; font-family:Sans-Serif;}
.BigRedButton  ul li a:hover {background: #a51211; color:white; }

#UnderContentJoin
{
    float: right;
    padding-right:13px;
      padding-top:7px;
}

.MobileTopJoin
{
     padding-top:5px;
     height:55px;  
     width:350px;
     display:none;       
}


.MobileTopJoin .LoginLink a
{
    font-size:16px;   
    text-decoration:none;     
    float:right;
    padding-top:15px;
}

.MobileTopJoin .LoginLink a:hover
{
    color: #a51211;
}

#LabelRemaining
{
    color:#fd0000;
    font-size:14px;
    font-weight:bold;
}


#BFWrapper {
  visibility: hidden;
  opacity: 0;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 9000;
  background-color: rgba(165,163,162,.90);  
  transition: visibility 0s ease-in-out .5s, opacity .5s ease-in-out;     
}

#BFPopUp {
  position: fixed;
  z-index: 9001;
  top: 50%;
  left: 50%;
  background-color: #fff;
  width: 720px;
  height: 460px;
  margin-top: -240px;
  margin-left: -400px;  
   border: 10px solid #f8fafb;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  padding: 0px 0px 0px 0px;
  background-repeat:no-repeat;  
  -webkit-filter: none;
}

.BFUnknown {
  visibility: visible !important;
  opacity: 1 !important;    
}

#TermsWrapper {
  visibility: hidden;
  opacity: 0;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 9000;
  background-color: rgba(165,163,162,.90);  
  transition: visibility 0s ease-in-out .5s, opacity .5s ease-in-out;     
}

.TermsUnknown {
  visibility: visible !important;
  opacity: 1 !important;    
}

#TermsPopUp {
  position: fixed;
  z-index: 9001;
  top: 50%;
  left: 50%;
  background-color: #fff;
  background-image:url(https://freecdn.belamionline.com/Tour2016/images/warning-image.jpg);
  width: 720px;
  height: 400px;
  margin-top: -240px;
  margin-left: -400px;  
   border: 10px solid #f8fafb;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  padding: 40px 40px 40px 40px;
  background-repeat:no-repeat;  
  -webkit-filter: none;
}

#TermsPopUp .DisclaimerMessage
{
    width:315px;
    font-family:Open Sans;
    font-size:14px;
    line-height:15px;
    color:black;
    text-align:justify;
    margin-top:30px;
    margin-bottom:30px;       
    }
    
#TermsPopUp .Links
{
    width:315px;
    font-family:Open Sans;
    font-size:15px;
    color:black;
    text-align:center;
    margin-top:30px;      
    }

#TermsPopUp .Links a
{
    color:Black;
    text-decoration:underline;
    font-family:Open Sans;
    font-size:16px;
}

#TermsPopUp .BiggerLinks 
{
   width:315px;
    font-family:Open Sans;
    font-size:20px; 
   font-weight:bold; 
    text-align:center;     
     margin-top:10px;      
}

#TermsPopUp .BiggerLinks  a
{  
     color:Black;
    text-decoration:underline;        
}

#TermsPopUp .TermsLogo
{
    border:0px;
    display:block;
}

#TermsPopUp .TermsConfirm {}
#TermsPopUp .TermsConfirm  ul {margin: 0; padding:0;}
#TermsPopUp .TermsConfirm  ul li {float: left; padding: 0; margin: 0; list-style: none;  }
#TermsPopUp .TermsConfirm  ul li a {display: block; float: left; min-height: 85px; line-height: 85px; text-transform: uppercase; text-decoration: none; text-align:center; font-size: 24px; font-weight: bold; margin-right: 0px; background: #21a60e; background: -webkit-linear-gradient(#6bc762, #196f0b); background: -o-linear-gradient(#6bc762, #196f0b); background: -moz-linear-gradient(#6bc762, #196f0b); background: linear-gradient(#6bc762, #196f0b); color: white; width:300px; font-family:Sans-Serif;}
#TermsPopUp .TermsConfirm  ul li a:hover {background: #21a60e; }

#MobileSlide
{
    display:none;
    padding-top:5px;
}

.Logout
{
    width:100%;
    text-align:center;
    margin:15px auto;
    font-size:24px;
    font-weight:bold;
    color:black;
}

.Logout .Subnote
{
    font-size:16px; 
    color:#878787   
}

.SwipeButton
{display:none;
 width:100%;   
   box-sizing: border-box;
   overflow: hidden;
   cursor:grab;
   margin:0px auto;
}

 .swipe-element {
            position: relative;
            width: 100%;
            height: 60px;
        }

        .swipe-front {
            position: absolute;
            width: 100%;
            height: 60px;
            left: 0;
            top: 0;
            margin: 0;
            padding: 8px;
            box-sizing: border-box;
            text-align: center;
            color: white;
            line-height: 22px;
            vertical-align:middle;
            background: #a51211; background: -webkit-linear-gradient(to right, #fd0000, #a51211); background: -o-linear-gradient(to right, #fd0000, #a51211); background: -moz-linear-gradient(to right, #fd0000, #a51211); background: linear-gradient(to right, #fd0000, #a51211); 
            color: white; 
            font-family:Sans-Serif;
            font-size:16px;
            z-index: 1;
            -ms-touch-action: none;
            touch-action: none;
        }

        .swipe-back {
            position: absolute;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            width: 100%;
            height: 60px;
            left: 0;
            top: 0;
            -ms-flex-direction: row;
            -webkit-flex-direction: row;
            flex-direction: row;
            -ms-flex-pack: justify;
            -webkit-justify-content: space-around;
            justify-content: space-around;
            -ms-flex-align: center;
            -webkit-align-items: center;
            align-items: center;
            padding: 0 10px;
            box-sizing: border-box;
        }
                   
        .promote-layer {
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
        }

        .MobileEnabled
        {display:block;}

        .SliderVideo
        {
            width:1180px;
            height: 337px;
            object-fit: cover;
        }

@media only screen and (max-width: 1200px) {
    #TermsPopUp {
        position: fixed;
        z-index: 9001;
        top: 50%;
        left: 50%;
        background-color: #fff;
        background-image: none !important;
        width: 350px !important;
        height: 280px;
        margin-top: -200px;
        margin-left: -200px;
        padding: 10px 10px 10px 10px;
    }

        #TermsPopUp .TermsLogo {
            display: none;
        }

        #TermsPopUp .DisclaimerMessage {
            width: 350px;
            margin-top: 5px;
            margin-bottom: 10px;
        }

        #TermsPopUp .Links {
            width: 350px;
            margin-top:10px;
        }

         #TermsPopUp .BiggerLinks {
            width: 350px;
            margin-top:5px;
        }

        #TermsPopUp .TermsConfirm ul li a {
            width: 350px;
        }
}


@media only screen and (min-width: 768px) and (max-width: 1200px) 
{
.BigGreenButton  ul li a {width:190px;font-size: 26px;}
.SmallGreenButton  ul li a {width:190px;font-size: 26px;}
.MediumRedButton  ul li a {width:190px;font-size: 18px;}
.BigRedButton  ul li a {width:220px;font-size: 36px;}

.MobileEnabled
        {display:block;}

.SliderVideo
        {
            width:748px;
            height: 214px;
            object-fit: cover;
        }


}

@media only screen and (min-width: 480px) and (max-width: 767px) {
.BigGreenButton  ul li a {width:450px;}
.MediumRedButton  ul li a {width:180px;}
.MobileTopJoin {width:350px; display:block;}
.SmallGreenButton  ul li a {width:150px;}

.MobileEnabled
        {display:block;}



#TermsPopUp {
        position: fixed;
        z-index: 9001;
        top: 50%;
        left: 50%;
        background-color: #fff;
        background-image: none !important;
        width: 400px !important;
        height: 260px;
        margin-top: -150px;
        margin-left: -220px;
        padding: 10px 10px 10px 10px;
    }

        #TermsPopUp .TermsLogo {
            display: none;
        }

        #TermsPopUp .DisclaimerMessage {
            width: 400px;
            margin-top: 0px;
            margin-bottom: 10px;
        }

        #TermsPopUp .Links {
            width: 400px;
            margin-top:10px;
        }

         #TermsPopUp .BiggerLinks {
            width: 400px;
            margin-top:5px;
        }

        #TermsPopUp .TermsConfirm ul li a {
            width: 400px;
        }


#MobileSlide
{
    display:block;
}

.releasedate
{display:none;}

.SwipeButton
{display:block;}



.MobileEnabled
        {display:block;}

.BFUnknown {
  visibility: hidden !important;
  opacity: 0 !important;
}
}


@media only screen and (max-width: 479px) {

.BigGreenButton  ul li a {width:310px;}
.MediumRedButton  ul li a {width:150px;}
.MobileTopJoin {width:300px; display:block; }
.BigRedButton  ul li a {width:220px;font-size: 36px;}
    .SmallGreenButton ul li a {
        margin-left: 10px;
        width: 140px;
    }

#MobileSlide
{
    display:block;
}

.releasedate
{display:none;}

.SwipeButton
{display:block;}


.MobileEnabled
        {display:block;}

.BFUnknown {
  visibility: hidden !important;
  opacity: 0 !important;
}

}

  .blur
    {
        -webkit-filter: blur(5px); -moz-filter: blur(5px); -o-filter: blur(5px); -ms-filter: blur(5px); filter: blur(5px);
    }   
