@charset "UTF-8";
/*
Project: La Bonne Reduc
Version: 1.0 / 2015
*/

/* --- RESET ------------------------------------------------------- */
* {-webkit-tap-highlight-color: rgba(0,0,0,0); padding: 0; margin: 0; -webkit-touch-callout: none; -webkit-user-select: none;}
ul, ol, li {list-style: none; list-style-position: outside;}
ol ol, ul ul, ol ul, ul ol {margin: 0; margin: 0;}
a:focus {outline:none;}
img     {border: none;}
html body * div.clear  {background: none; border: 0; clear: both; display: block; float: none; font-size: 0; list-style: none; margin: 0; padding: 0; overflow: hidden; visibility: hidden; width: 0; height: 0;}
h1, h2, h3, h4, h5, h6 {}
*, *:before, *:after   {box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
*::-webkit-scrollbar { width: 0 !important }

/* --- BASE --------------------------------------------------------- */
html      {}
body      {font-family:"Open Sans", "HelveticaNeue", Helvetica; overflow-y: scroll; color:#5c5363; background-color:#FFF; font-size:18px;
	-webkit-touch-callout: none;       /* prevent callout to copy image, etc when tap to hold */
	-webkit-text-size-adjust: none;    /* prevent webkit from resizing text to fit */
	-webkit-user-select: none;         /* prevent copy paste, to allow, change 'none' to 'text' */
  -moz-user-select: none;
  -webkit-backface-visibility: hidden;
  margin:0px;}  
input[type="text"] {-webkit-user-select:auto !important; -webkit-appearance: textfield; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); outline:none;}
input:focus        {-webkit-tap-highlight-color: rgba(255, 255, 255, 0);-webkit-user-modify: read-write-plaintext-only;}
a     {color:#000; text-decoration: none;}
.autocomplete-suggestions {display:none !important}


/* --- FONT --------------------------------------------------------- */
@font-face {
  font-family: "Open Sans";
  src: url('font/OpenSans-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: "Open Sans";
  src: url('font/OpenSans-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "Open Sans";
  src: url('font/OpenSans-Semibold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: "Open Sans";
  src: url('font/OpenSans-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: "Open Sans";
  src: url('font/OpenSans-ExtraBold.ttf') format('truetype');
  font-weight: 800;
  font-style: normal;
}



/* --------------------------------------------------------------------------------------- */
/* --- COMMON --------------------------------------------------------------------------- */
  
  /* --- CONTAINER ------------------------------------------------------------- */
  body        {width:100%; height:100%; position:absolute; overflow-x:hidden; overflow-y:hidden}
  body.search {width:auto; height:auto; min-height:800px; z-index:110; position:relative; top:0px; padding:0px;}
  body::-webkit-scrollbar {width: 0 !important }
  body::-moz-scrollbar    {width: 0 !important }
  .wrapper                {}
  
  /* --- MAIN ------------------------------------------------------------overflow:auto; ------ */
  .wrapper-main  {display:block; position:absolute; overflow:hidden; padding-top:92px;height:100%; width:100%; padding-bottom:0px;}
  .main          {height:100%; width:100%; transition-duration:.4s;}
  .page          {display:block; position:absolute; width:100%; height:100%; overflow:auto; -webkit-overflow-scrolling: touch;}
  .page .content {-webkit-backface-visibility: hidden}
  .page .link    {color:#666; border-bottom:1px dashed #666}
  #page-homeoffers    {left:0%}
  #page-homeshops     {left:0%}
  #page-homefavshops  {left:0%}
  #page-home     {left:0%;}
  #page-shop     {left:100%;}
  #page-code     {left:200%;}
  #page-settings {left:300%;}
  #page-search   {left:500%;} /* no-transition slide overflow:hidden; -webkit-transform: translate3d(0, 0, 0); */
  #page-info     {left:400%;} /* no-transition slide */
  
  
  /* --- TITLE -----------------------.title      {display:table; font-size:16px; position:absolute; top:0px;}
  .title span {display:table-cell; vertical-align:middle;}------------------------------------ */
  .page h2    {display:block; background-color:#F2F2F2; color:#666; font-size:14px; font-weight:400; line-height:22px; padding:10px 10px 8px 10px; }
  .page h2 i  {font-style:normal; color:#999; font-weight:300;}
  .message    {display:block; color:#666; font-size:18px; line-height:28px; font-weight:300; text-align:center; padding:20px 15px;}
  .message i  {color:#aaa; font-style:normal;}
  
  /* --- SLIDES LEFT / RIGHT --------------------------------------------------- */
  .wrapper-container {position:relative; width:760px; height:100%; margin:35px auto 0px auto;}
  .container   {display:block; position:absolute; top:0px; margin:0px; width:100%;}
  .slide--4    {transform: translate3d(400%, 0, 0); -webkit-transform: translate3d(400%, 0, 0);} /* no-transition slide */
  .slide--3    {transform: translate3d(300%, 0, 0); -webkit-transform: translate3d(300%, 0, 0);}
  .slide--2    {transform: translate3d(200%, 0, 0); -webkit-transform: translate3d(200%, 0, 0);}
  .slide--1    {transform: translate3d(100%, 0, 0); -webkit-transform: translate3d(100%, 0, 0);}
  .slide-0     {transform: translate3d(0%, 0, 0);  -webkit-transform: translate3d(0%, 0, 0);}
  .slide-1     {transform: translate3d(-100%, 0, 0); -webkit-transform: translate3d(-100%, 0, 0);}
  .slide-2     {transform: translate3d(-200%, 0, 0); -webkit-transform: translate3d(-200%, 0, 0);}
  .slide-3     {transform: translate3d(-300%, 0, 0); -webkit-transform: translate3d(-300%, 0, 0);}
  .slide-4     {transform: translate3d(-400%, 0, 0); -webkit-transform: translate3d(-400%, 0, 0);}
  .offset      {margin-top:1600px;}
  .slide-notransition-search {transition:none; transform: translate3d(-500%, 0, 0); -webkit-transform: translate3d(-500%, 0, 0);}
  .slide-notransition-info   {transition:none; transform: translate3d(-400%, 0, 0); -webkit-transform: translate3d(-400%, 0, 0);}
  .transition  {}  


/* --------------------------------------------------------------------------------------- */
/* --- VARIOUS --------------------------------------------------------------------------- */
  .btn {cursor:pointer;}
  .hidden {display:none !important;}
  /*
  .btn:hover {opacity:0.6}
  .main li:hover {cursor:pointer; opacity:0.6}
  .main li.active {background-color:#e1e1e1;}
  .main li.active {background-color:#F1F1F1;}
  */
  .btn.active     {opacity:0.4}
  
  .btn-share-facebook.active  {background-color:#4c73c0; opacity:1;}
  .btn-share-twitter.active   {background-color:#35c3f9; opacity:1;}
  .btn-share-email.active     {background-color:#faca46; opacity:1;}


/* --------------------------------------------------------------------------------------- */
/* --- HEADER --------------------------------------------------------------------------- */
   
  /* --- HEADER ------------------------------------------webkit-box-shadow: inset 0px -10px 25px 0px rgba(0,0,0,0.05); ------transition: background-color 0.5s ease-in-out;---transition:height 0s ease-in-out;-------------- */
  header      {display:block; position:fixed; height:176px; width:100%; background-color:#4896d8; z-index:10; overflow:hidden;  }
  header h1   {padding: 0; text-align: center; font-size: 16px; margin: 0px 50px 0px 50px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; -webkit-box-flex: 1; box-flex: 1; color:#FFF; line-height:40px; font-weight:300; height:36px; padding-top:5px;}
  .ico-top-back     {position:absolute; left:0px; z-index:10}
  .ico-top-settings {position:absolute; right:0px; z-index:10}
  .btn-top-done     {float:right; padding-right:15px; padding-top:15px; padding-bottom:12px; color:rgba(255,255,255,0.9); font-size:14px; line-height:inherit; height:50px;}
  .btn-top-done span {border:1px solid rgba(255,255,255,0.4); padding:5px 10px; border-radius:3px;}
  .ico-top-info     {float:right; top:3px;}
  
  /* --- SECTIONS ------------------------------------ ------------------------- */
  .section        {text-align:center; font-size:12px; top:0px; width:100%; height:100px; position:relative;}
  .section-shop   {width:80px; position:absolute; left:5%; top:10px;}
  .section-search {width:80px; position:absolute; right:5%; top:10px;}
  .section .text {padding-top:6px; opacity:0.6; color:#FFF; line-height:13px}
  .section-center {display:block; background-color:#FFF; border-radius:90px; width:90px; height:90px; margin:0px auto; text-align:center; vertical-align:middle; position:relative;}
  .section-center img {float:none; position:absolute; top:0; bottom:0; left:0; right:0; max-width:82px; margin:auto; background-color: transparent;}
  
  /* --- META ------------------------------------------------------------- */
  .meta-section  {display:block;}
  #btn-section-fav {position:absolute; right:10px; top:110px; overflow:hidden; height:40px; line-height:14px; width:200px;}
  .fav-text-add, .fav-text-added, .fav-text-removed {display:block; margin-top:6px; transform:margin; transition-duration:.4s; -webkit-transform:margin; -webkit-transition-duration:.4s; position:absolute; right:0px;}
  .fav-text-add.hiddenscroll {display:block; margin-top:-100px;transition-duration:0.6s;}
  .fav-text-added.hiddenscroll {display:block; margin-top:-100px;transition-duration:0.6s;}
  .fav-text-removed.hiddenscroll {display:block; margin-top:-100px;transition-duration:0.6s;}
  .fav-text-add {display:inline-block; background-color:#e64141; float:right; color:#FFF; padding:0px 6px 0px 10px; margin-top:4px; height:32px; line-height:32px; margin-left:6px; margin-bottom:6px; box-shadow:inset -28px 0px 0px 0px #d72222; border:0px solid #000; border-radius:3px; font-weight:500; font-size:13px;}
  .fav-text-added, .fav-text-removed {font-size:12px; color:#999; line-height:15px;}
  
  
  
  /* --- VARIOUS HEADERS --------------------------------------------------- */ 
  .ios7 header              {padding-top:16px; height:192px;}
  .ios7 .wrapper-main       {padding-top:192px}
  .ios7 #search             {top:18px;}
  .ios7 .submenu            {top:68px;}
  .ios7 .ico-top-back       {top:21px;}
  .ios7 .ico-top-settings   {top:21px;}
  .ios7 .shop-logo          {top:71px}
  .ios7 .shop-title         {top:89px}
  .ios7 #btn-section-fav    {top:126px;}
  .ios7 .meta-box-update    {top:131px;}
  .ios7 #btn-search-cancel  {top:22px;}
  
  body header .bg {width:100%; background-color:#299cc7; position:absolute; top:0px; z-index:-1}
        
      /* --- HOME --------------------------------------------------- */ 
      .home header             {height:90px;}
      .home .wrapper-main      {padding-top:90px} 
      .home header .bg         {height:90px; background:-webkit-linear-gradient(top,  #0ea9d7 0%,#028cbf 100%); background: linear-gradient(to bottom,  #0ea9d7 0%,#028cbf 100%);}
      .ios7.home header        {padding-top:16px; height:106px;}
      .ios7.home .wrapper-main {padding-top:106px}
      .ios7.home header .bg    {height:106px; background:-webkit-linear-gradient(top,  #0ea9d7 0%,#028cbf 100%); background: linear-gradient(to bottom,  #0ea9d7 0%,#028cbf 100%);}
      
      /* --- SHOP --------------------------------------------------- */ 
      .shop header             {height:150px;}
      .shop .wrapper-main      {padding-top:150px} 
      .shop header .bg         {height:106px;}
      .ios7.shop header        {padding-top:16px; height:168px;}
      .ios7.shop .wrapper-main {padding-top:168px} 
      .ios7.shop header .bg    {height:122px;}
      
      /* --- SETTINGS ----------------------------------------------- */ 
      .settings header               {height:50px;}
      .settings .wrapper-main        {padding-top:50px} 
      .settings header .bg           {height:50px; background-color:#e64141 !important}
      .ios7.settings header          {padding-top:16px; height:60px;}
      .ios7.settings .wrapper-main   {padding-top:66px} 
      .ios7.settings header .bg      {height:66px;}
      
      /* --- SEARCH ----------------------------------------------- */ 
      .search header             {height:56px;}
      .search .wrapper-main      {padding-top:56px} 
      .search header .bg         {height:56px;}
      .ios7.search header        {padding-top:16px; height:66px;}
      .ios7.search .wrapper-main {padding-top:72px} 
      .ios7.search header .bg    {height:72px;}
      
  

/* --------------------------------------------------------------------------------------- */
/* --- LIST OFFERS ---------------------------------------------------------------------- */

  /* --- LIST ------------------------------------------------------------- */
  .list-offers                  {margin:10px 10px 10px 10px; background-color:#FFF; border-radius:5px; padding:5px 0px; box-shadow:inset 64px 0px 0px 0px #f6F6F6; -webkit-transform: translateZ(0);}
  .list-offers li               {display:table; background-color:#FFF; padding:8px 10px 8px 6px; overflow:hidden; width:100%; box-sizing:border-box; position:relative; box-shadow:inset 64px 0px 0px 0px #f6F6F6; border-bottom:1px solid #E9E9E9;}
  .list-offers li:last-child    {border-bottom:0px solid #000}
  .list-offers .value           {display:table-cell; height:50px; width:52px;}
  .list-offers .ico-right       {display:table-cell; vertical-align:middle; width:20px;}
  .list-offers .ico-arrow-gray  {height:20px; width:15px; background-position:-45px 0px;}
  .list-offers .title           {display:table-cell; position:relative; padding-left:16px; font-size:14px; vertical-align:middle; padding-right:2px; line-height:18px}
  .list-offers                  {-webkit-transform: translate3d(0, 0, 0);}
  .list-offers .logo            {display:table-cell; width:55px; position:relative; vertical-align:middle;}
  .list-offers .logo img        {width:100%; vertical-align:middle;}
  #page-homeoffers .list-offers {margin-top:10px;}
  #page-homeoffers .ico-right   {display:none;}
  .list-offers li.active  .ico-arrow-gray  {transform: translate3d(40px, 0, 0); transition-duration:.5s;}
  .list-offers li.active .title {font-weight:600; color:#000}
  .list-offers .update          {display:block; clear:both; font-size:11px; color:#CCC}
  .list-offers.list-new-offers li .title {padding-top:5px;}
  
  /* --- VALUES [CIRCLE] -------------------------------------------------- */
  .value           {display:table-cell; vertical-align:middle; color:#333; text-align:center; font-size:18px; font-weight:700; line-height:20px;}
  .freedel .value  {}
  .long .value     {font-size:11px; line-height:14px; font-weight:bold; text-overflow: ellipsis; overflow: hidden; -webkit-box-flex: 1; box-flex: 1;}
  .off .value      {line-height:20px}

/* --------------------------------------------------------------------------------------- */
/* --- LIST SHOPS ----------------------------------------------------------------------- */

  .list-shops                  {display:block; margin:10px 10px 10px 10px; background-color:#FFF; border-radius:5px;padding:2px 0px; -webkit-transform: translateZ(0);}
  .list-shops li               {display:table; padding:5px 5px 5px 15px; position:relative; cursor:pointer; border-bottom:1px solid #f1f1f1; width:100%; height:48px;}
  .list-shops li:last-child    {border-bottom:0px solid #000}
  .list-shops li.empty          {color:#AAA}
  .list-shops .ico-right       {display:table-cell; vertical-align:middle; width:20px;}
  .list-shops .ico-arrow-gray  {height:20px; width:15px;}
  .list-shops .ico-fav         {height:40px; width:50px;}
  .list-shops .logo            {display:table-cell; vertical-align:middle; width:100px; overflow:hidden; line-height:10px;}
  .list-shops .logo img        {width:100%;}
  .list-shops .title           {display:table-cell; position:relative; vertical-align:middle; padding-left:10px;font-size:14px; line-height:14px;}
  .list-shops .meta            {display:none; color:#DDD; font-style:normal; font-size:14px; margin:0px; vertical-align:middle; width:40px;}
  .list-shops li.fav .title    {font-weight:500}
  .list-shops li.fav           {}
  #page-settings .list-shops .title {margin-right:45px;}
  .list-shops li.active  .ico-arrow-gray  {transform: translate3d(40px, 0, 0); transition-duration:.5s;}
  .list-shops li.active .title {font-weight:600; color:#000}



/* --------------------------------------------------------------------------------------- */
/* --- OFFER ---------------------------------------------------------------------------- */

  /* --- OFFER ------------------------------------------------------------- */
  .offer              {padding:15px 10px 15px 15px; background-color:#FFF; margin:20px 10px; border-radius:3px; overflow:hidden;}
  .offer .offer-top   {display:block; }
  .offer .title       {font-size:16px; line-height:22px; color:#000; font-weight:bold; }
  .offer .description {font-size:13px; line-height:18px; margin-top:10px; padding-bottom:10px;}
  .offer .meta        {display:block; font-size:12px; color:#777777; font-weight:400; height:30px; border-top:1px solid #E9E9E9; padding:6px}
  .offer .meta .date  {color:#BBB}
  .offer .meta-date   {float:left; margin-right:20px;}
  .offer .meta-like   {float:right; color:#77bb5c}
  
  /* --- BTN ------------------------------------------------------------- */
  .btn-bottom  {display:block; margin:12px -5px; position:relative;}
  .btn-offer   {background-color:#e64141; color:#FFF; height:46px; line-height:46px; text-align:center; width:71%; margin:0px auto; display: block; float:left; font-size:14px; z-index:10; text-transform:uppercase}
  .btn-offer.coupon {font-weight:bold; font-stretch:condensed; background-color:#EEE; border:3px dashed #999; line-height:40px; color:#333; margin-right:5px; margin-left:-5px; font-size:16px; text-overflow: ellipsis; cursor: text; white-space: nowrap; overflow: hidden}
  .btn-offer i {margin-right:5px;}
  .btn-share   {border:1px solid #CCC; color:#666; height:46px; line-height:46px; text-align:center; width:24%; margin:0px auto; font-size:12px; display:block; float:left; z-index:10; float:right; font-weight:normal; margin-right:5px;}
  .btn-share i {margin-top:4px; margin-left:10px; margin-right:2px;}
  .btn-copied   {background-color:#51b244; color:#FFF; height:46px; line-height:46px; text-align:left; width:29%; margin:0px auto; font-size:14px; display:block; float:left; z-index:10; text-overflow:ellipsis}
  .btn-copied i {margin-top:4px; margin-left:8px; margin-right:0px;}
  
  /* --- SOCIAL SHARE ------------------------------------------------------ */
  .zone-share          {display:block; width:100px; height:40px; position:absolute; right:5px; line-height:32px; z-index:1; transform: translate3d(0px, -112px, 0); -webkit-transform: translate3d(0, -112px, 0); transition-duration:.4s; font-size:11px;}
  .zone-share.hide     {display:block; transform: translate3d(0, -400px, 0); -webkit-transform: translate3d(0, -400px, 0)}
  .btn-share-social    {width:100%; font-size:11px; font-weight:normal !important; margin-top:4px;}
  .btn-share-facebook  {background-color:#3b5998; color:#FFF;}
  .btn-share-twitter   {background-color:#00acee; color:#FFF;}
  .btn-share-email     {background-color:#ddb028; color:#FFF;}  
  .btn-share-social i  {margin-top:3px; margin-left:6px; margin-right:1px;}


  /* --- RATE THIS APP --------------------------------------------------------------------- */
	#popup-rate {background-color:rgba(0, 0, 0, 0.7); display: block; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 101;}
	.popup-rate-container       {background-color:#FFF; border-radius:8px; margin:60px 3% 0px 3%; padding:20px; color:#666;}
	.popup-rate-container p     {padding-bottom:8px; font-size:16px; line-height:20px;}
	.popup-rate-container p.end {padding-bottom:20px;}
	.btn-popup                  {background-color:#4896d8; -webkit-border-radius:3px; border-radius:3px; display:inline-block; color:#ffffff; font-size:18px; font-weight:normal; padding:12px 11px; text-decoration:none; margin-bottom:10px; width:100%; text-align:center;}
	.btn-popup-gray             {background-color:#E6E6E6; -webkit-border-radius:3px; border-radius:3px; display:inline-block; color:#AAA; font-size:18px; font-weight:normal; padding:12px 11px; text-decoration:none; margin-bottom:10px; width:100%; text-align:center}
	.btn-popup.active           {background-color:#178eb5;}
	.btn-popup-gray.active      {background-color:#DDD; color:#333}
	

/* --------------------------------------------------------------------------------------- */
/* --- LOADING ---------------------------------------------------------------------------- */

	div.loading {display:table; margin:40px auto; height:44px; width:auto; position:relative; line-height:20px;}
	div.loading span {display:block; float:left; font-size:15px; color:#999; white-space:nowrap; height:36px}
	div.loading .icon.loading  {background: url(img/spinner_ball.png) no-repeat; width: 20px; height: 20px; background-size: 100%; margin-right:10px;}
	div.loading .icon.loading.active {animation: rotate 0.8s linear infinite; -webkit-animation: rotate 0.8s linear infinite;}
	@keyframes rotate           { 0%{ transform: rotate(0deg); } 100%{ transform: rotate(360deg); } }
	@-webkit-keyframes rotate   { 0%{ -webkit-transform: rotate(0deg); } 100%{ -webkit-transform: rotate(360deg); } }


/* --------------------------------------------------------------------------------------- */
/* --- TEXT ----------------------------------------------------------------------------- */

  .page .text-content   {font-size:13px; padding:0px 15px 15px 15px; line-height:18px; max-width:600px; margin:10px 10px; background-color:#FFF; border-radius:3px; -webkit-transform: translateZ(0);}
  .page .text-content p {padding-bottom:10px;}
  .page .text-content ul {border:0px solid #000; padding:0px; margin-bottom:0px; margin-top:-5px; margin-left:10px;}
  .page .text-content h2 {font-weight:bold; font-size:17px; color:#000; background-color:transparent; padding:10px 0px 5px 0px; height:auto; }
  .page .text-content h3 {color:#000; font-size:13px;}
    .entry ul, .entry ol, .entry dl { margin-bottom: 10px; height:auto; }
    .entry ul     {list-style: disc; list-style-position: inside; margin-left:0px; width:100%; display:block; padding-top:5px; padding-bottom:20px}
    .entry ul ul  {padding-top:2px;}
    .entry li     {list-style: inherit; list-style-position: inside; margin-left:20px;margin-bottom:4px;}
    .entry strong {font-weight:600}
    .entry a      {color:#21aad5; font-weight:600}
  
  
/* --------------------------------------------------------------------------------------- */
/* --- HOWTO ---------------------------------------------------------------------------- */

  #howto        {background:url(img/bg_howto.png) #373737 no-repeat bottom left; background-size:90%; min-height:100%;padding-top:30px; position:absolute; z-index:200; width:100%;}
  .howto_box    {display:block; background-color:#FFF; margin:0px 20px; border-radius:5px; overflow:hidden;}
  .howto_box h5 {padding:12px; background-color:#ecf1f2; font-size:18px; font-weight:lighter;}
  .howto_box p  {padding:12px; font-size:16px; line-height:24px; color:#666}
  .btn-continue {background-color:#54baaf; color:#FFF; padding:0px 18px; float:right; border-radius:5px; margin:4px 12px 12px 0px; transition-duration:.4s; line-height:36px; font-size:16px !important;}
  .howto_box.active {transform: translate3d(-400%, 0, 0); -webkit-transform: translate3d(-400%, 0, 0); transition-duration:.5s;}
  .howto_box.active .btn-continue {background-color:#267B28}
  .btn-pass        {display:block; width:124px; position:absolute; bottom:10px; right:0px; text-decoration:underline; color:#EEE; padding:16px; line-height:18px; transition-duration:.4s; font-size:13px !important; text-align:right;}
  .btn-pass.active {transform: translate3d(200%, 0, 0); -webkit-transform: translate3d(200%, 0, 0); transition-duration:.5s;}



/* --------------------------------------------------------------------------------------- */
/* --- 2016 ----------------------------------------------------------------------- */
  
  body {background-color:#e1e1e1}
  
  /* --- FILTER ------------------------------------------------------------ */
  .on-home, 
  .on-shop, 
  .on-search, 
  .on-settings          {display:none !important;}
  .home .on-home         {display:block !important}
  .shop .on-shop         {display:block !important}
  .settings .on-settings {display:block !important}
  .search .on-search     {display:block !important}
  
  /* --- HEADER ------------------------------------------------------------ */
  header {overflow:visible; background:none;}
  .ico-top-back     {position:absolute; left:0px; top:5px; z-index:10}
  .ico-top-settings {position:absolute; right:0px; top:5px; z-index:10}
  
  /* --- SEARCH ------------------------------------------------------------- */
  #search  {top:0px;}
  .searchbox .search-pretext {color:rgba(255,255,255,0.7); font-size:13px; height:36px; line-height:38px; margin-top:10px; padding-left:10px;}
  .searchbox.active .search-field {background:url(img/sprite_icons.png) rgba(255,255,255,1) no-repeat right -546px; background-size:300px 600px; margin-right:90px;}
  body.search .searchbox .search-field {background:url(img/sprite_icons.png) rgba(255,255,255,1) no-repeat right -546px; background-size:300px 600px; margin-right:90px;}
  body.shop .searchbox .search-field {margin-right:50px; margin-left:50px;}
  body.search .search-pretext {display:none;}
  .searchbox .search-field {display:block; background:url(img/sprite_icons.png) rgba(255,255,255,0.2) no-repeat right -496px; background-size:300px 600px; border-radius:3px; margin:10px 10px 0px 10px; position:relative; height:36px; margin-right:50px;}
  .searchbox .search-cancel {display:block; position:absolute; right:0px; top:6px; height:40px; padding:12px 12px 6px 10px; font-size:14px; color:#FFF; text-align:center; width:90px; line-height:inherit;}
  .searchbox input {display:block; border:0px; height:34px; padding:4px 8px 2px 12px; box-sizing: inherit; -moz-box-sizing: inherit; -webkit-box-sizing: inherit; position:relative; width:100%; background-color:transparent; z-index:3; font-size:16px; color:#333; font-family:"Open Sans", "HelveticaNeue", Helvetica; text-transform:lowercase}
  
  /* --- SUBMENU ------------------------------------------------------------ */
  .submenu {position:absolute; top:52px; color:#FFF; width:100%;}
  .submenu li {width:31%; float:left; text-align:center; font-size:12px; font-weight:bold; color:rgba(255,255,255,0.5); height:36px; line-height:34px;}
  .submenu li:last-child {width:38%;}
  .submenu li.active {color:#FFF;}
  .submenu li.selected {color:#FFF;}
  .submenu li.selected span {border-bottom:2px solid #FFF; padding:2px 2px;}
  
  /* --- FILTER ------------------------------------------------------------ */
  .filter {display:block; font-size:12px; min-height:26px; margin:10px auto 0px auto;; display:block;}
  .filter li {display:inline-block; padding:6px 12px 6px 12px; border-right:1px solid #CCC; width:49%; text-align:right;}
  .filter li:last-child {border-right:0px; text-align:left; padding-right:0px;}
  .filter li span {border-bottom:2px solid transparent; padding:2px 2px; color:#AAA}
  .filter li.selected span {border-bottom:2px solid #999; padding:2px 2px; color:#666}
  .filter li.active {color:#000;}
  
  /* --- BOX ------------------------------------------------------------ */
  .box                     {background-color:#FFF; border-radius:3px; min-height:50px; margin-top:10px; margin-left:10px; margin-right:10px; padding:8px 10px 6px 10px; overflow:hidden;}
  .box h2                  {text-transform:uppercase; font-size:12px; font-weight:bold; line-height:16px; padding-bottom:8px; color:#333; padding-top:2px;}
  .box-likeapp h2          {color:#FFF; padding:0px; background-color:transparent;}
  .box-likeapp             {background-color:#f14313; overflow:hidden; padding-right:0px;}
  .box-likeapp .text       {color:#FFF; font-size:13px; line-height:18px; padding-bottom:6px; margin-right:30px;}
  .box-likeapp .text strong {font-weight:700; margin-right:3px}
  .box-likeapp .ico-close  {float:right; margin-left:10px; margin-top:2px; opacity:0.6}
  .box-likeapp .btn-common {background-color:#FFF; color:#000; padding:0px 10px 0px 8px; color:#333; height:32px; line-height:32px; text-transform:uppercase; font-weight:bold; border:0px solid #000; margin:0px 0px 2px 6px;}
  .box-favshops            {min-height:80px;}
  .box-favshops h2         {padding:0px 0px 10px 0px; background-color:transparent;}
  .box-favshops .ico-cible {display:block; float:left;}
  .box-favshops .text      {font-size:13px;}
  
  /* --- STEPS ------------------------------------------------------------ */
  .step_likeapp_start {transform:margin; transition-duration:.4s; position:relative; float:left; width:100%; padding-right:10px;}
  .step_likeapp_no    {transform:margin; transition-duration:.4s; position:relative; float:left; width:100%;}
  .step_likeapp_yes   {transform:margin; transition-duration:.4s; position:relative; float:left; width:100%;}
  .step_likeapp_start.hiddenscroll {margin-top:-200px;}
  .step_likeapp_no.hiddenscroll    {margin-top:-200px;}
  .step_likeapp_yes.hiddenscroll   {margin-top:-200px;}
  
  /* --- HOME ------------------------------border:1px solid #e1e1e1;------------------------------ */
  .favshop-empty             {position:relative;}
  .favshop-empty.active      {transform: translate3d(-200%, 0, 0); -webkit-transform: translate3d(-200%, 0, 0); transition-duration:.5s;}
  .favshop-list              {height:84px; overflow:hidden;}
  .favshop-list li           {width:78px; height:78px; margin-right:6px; margin-bottom:10px; border-radius:70px; line-height:76px;  box-sizing:border-box; float:left; padding: 6px 2px 10px}
  .favshop-list li img       {width:100%; }
  .favshop-list li.ico_right {border:0px; width:10px; float:right; padding:0px; margin-right:0px; line-height:78px; margin-left:0px;}
  
  .favshop-list              {max-height:92px; height:auto; overflow:hidden;}
  .favshop-list li           {width:80px; height:40px; margin-right:6px; margin-bottom:6px; border-radius:0px; line-height:15px; box-sizing:border-box; float:left; padding:0px 0px 6px 0px}
  .favshop-list li.ico_right {border:0px; width:10px; float:right; padding:0px; margin-right:0px; line-height:38px; margin-left:0px;}
  
  /* --- BEST OFFERS ------------------------------------------------------------ */
  .box-best-offers {background-color:#FFF; border-radius:3px; min-height:50px; margin-top:10px; margin-left:10px; margin-right:10px; padding:10px 0px 5px 0px; overflow:hidden; margin-bottom:20px;}
  .box-best-offers h2 {background:transparent; text-transform:uppercase; font-size:12px; font-weight:bold; line-height:16px; padding-bottom:10px; color:#333; padding-top:2px; border-bottom:1px solid #f1f1f1}
  .box-best-offers .list-offers   {margin:0px; padding:0px}
  .box-best-offers li {border-radius:0px;}
  .box-best-offers li:last-child  {border-bottom:1px solid #f1f1f1}
  .box-best-offers .btn-common {margin-right:10px; margin-top:10px;}
  
  /* --- SHOP ------------------------------------------------------------ */
  .shop-logo {display:block; width:76px; height:76px; position:absolute; top:55px; left:15px; border:1px solid #CCC}
  .shop-logo img {width:95%;}
  .shop-title  {color:#FFF; font-size:20px; position:absolute; left:102px; top:73px; font-weight: 500; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; -webkit-box-flex: 1; box-flex: 1; width:200px;}
  .meta-box-update {position:absolute; left:100px; top:115px; font-size:10px;color:#AAA; width:70px;}
  .message-empty {background:url(img/bg_empty_shop.png) no-repeat center 100px; height:300px; background-size:200px 200px}
  
  /* --- BTN ------------------------------------------------------------ */
  .btn    {border-radius:3px; font-weight:500; font-size:13px; }
  .btn-no {background-color:rgba(255,255,255,0.4); float:right;  height:32px; line-height:32px; color:#000; padding:0px 10px 0px 8px; margin-left:8px; color:#333; text-transform:uppercase; font-weight:bold;}
  .btn-yes {background-color:rgba(255,255,255,1); float:right; color:#000; padding:0px 10px 0px 8px; margin-left:8px; color:#333; height:32px; line-height:32px; text-transform:uppercase; font-weight:bold;}
  .btn-common {border:1px solid #d4d4d4; float:right; padding:0px 10px; overflow:hidden; color:#999; margin-top:5px; margin-bottom:5px; height:32px; line-height:32px;}
  .btn-addfav-list    {margin-right:10px; display:inline-block; background-color:#e64141; float:right; color:#FFF; padding:0px 10px 0px 10px; margin-top:4px; height:32px; line-height:32px; margin-left:6px; margin-bottom:6px; box-shadow:inset 30px 0px 0px 0px #d72222;}
  
  /* --- HOVER ------------------------------------------------------------ */
  
  
  
  
  
/* --------------------------------------------------------------------------------------- */
/* --- RESPONSIVE ----------------------------------------------------------------------- */ 
  
  @media all and (min-width: 620px) {
   header h1           {font-size:18px;}
   .page h2            {font-size:14px; background-color:transparent; padding-top:6px; padding-bottom:12px; font-weight:400; color:#999}
   .list-shops li      {height: 60px;}
   .list-shops .title  {height: 60px; margin-left: 140px; margin-right: 25px; font-size:16px;}
   .list-shops .logo   {height: 52px; width: 126px;}
   .list-offers .title {font-size:16px;}
   .offer              {border:1px solid #DDD; width:400px; margin:0px auto; border-radius:8px;padding-bottom:60px; padding-top:15px;}
   .offer .offer-top   {display:table;}
   .offer .title       {display:table-cell; position:relative; text-align:left; min-height:60px; height:auto; vertical-align:middle; font-size:18px;}
   .offer .description {margin:15px auto; text-align:left; font-size:16px; line-height:22px;}
   .btn-offer          {width:71%}
   .btn-copied i       {margin-left:15px}
   .btn-share          {width:25%}
   div.loading span    {font-size:16px}
   .page               {padding:10px 16%;}
   .list-shops .meta   {display:table-cell; vertical-align:center;}
   .message            {max-width:600px; margin:0px auto; font-size:20px;}
   .popup-rate-container {margin:70px auto; width:360px}
   #howto          {background-size:30%;}
   
   /* -------------------------------------------- 2016 ---- */
   .content-text    {max-width:520px; margin:0px auto 10px auto;}
   .shop-title      {width:400px; font-size:20px;}
   .submenu li      {font-size:16px; font-weight:600; }
   .filter          {font-size:16px; padding-bottom:10px;}
   .favshop-list    {height:56px;}
   .favshop-list li {width:120px; height:auto; padding:4px;}
   .favshop-list li.ico_right {line-height:50px;}
   .btn               {font-size:16px; height:36px; line-height:36px;}
   .btn-top-done      {padding-top:7px;}
   .box-likeapp h2    {color:#FFF; font-weight:bold; font-size:16px; line-height:18px; padding:0px 0px 5px 0px;}
   .box-likeapp .text {font-size:16px; line-height: 20px;}
   .box-likeapp .btn-common {margin-left:10px;}
   #btn-section-fav span    {font-size:13px;}
   .favshop-empty .text {font-size:16px; line-height:20px;}
   .box                 {margin-bottom:20px;}
   .searchbox .search-pretext {font-size:14px;}
   
  /* --- HEADER SIZE BIGGER ------------------------------------ */ 
  .submenu            {top:62px;}
  .ios7 header              {padding-top:16px;}
  .ios7 #search             {top:18px;}
  .ios7 .submenu            {top:78px;}
  .ios7 .ico-top-back       {top:21px;}
  .ios7 .ico-top-settings   {top:21px;}
  .home header             {height:110px;}
  .home .wrapper-main      {padding-top:110px} 
  .home header .bg         {height:110px;}
  .ios7.home header        {padding-top:16px; height:126px;}
  .ios7.home .wrapper-main {padding-top:126px}
  .ios7.home header .bg    {height:126px;}
  
   
  }
  
  @media all and (min-width: 1000px) {
    .page               {padding:10px 22%;}
  }