/*#############################################################
  # Name: TradingToolsBox   p_trbx.css (properties)                    #
  # Date: 2019-08-26                                         #
  # Description:                                              #
  # Author: Yelena & Sergey Gavrilkin                                 #
  # URL: https://tradingtoolsbox.com                               #
  #############################################################*/
  
* {margin:0; padding:0}  /* do not remove !!! 2012-12-07 */

/********************************************
           3D image gallery                 *
******************************** ***********/
/*
#first_img
{
  display: none;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 1px;
}  */

html
{
  overflow: -moz-scrollbars-vertical;
  overflow-x: auto;
  overflow-y: scroll;
  background-color:	#d9d9d9; /*E8E6E4		 #E1E0DE; #ADA9A4;#B5B1AC; #D1D17E;  #F0E3A4;*/
 /* zbackground-image:  url('../img/MF_top_gradnt.png');
  zbackground-repeat:repeat-x;  */

}
body
{
  color: #404040; /*#000000;  dark khaky */
  font: 14px/1.231 arial,helvetica,clean,sans-serif;
    /*font-family:   'Raleway', sans-serif;*/
    /*zmin-width: initial;*/
  /***************** IE6 :hover fix *********************************
    more info at http://www.devinrolsen.com/fix-css-pseudo-hover/
  ******************************************************************* /
  behavior: url('css/cssHoverFix.htc'); /*describe path as it to PHP
  */
}

img
{
  display: block;
  border: 0 none;
}
h1 {
  font-size: 30px;
  font-family: arial,helvetica,clean,sans-serif;
 /* xtext-transform: uppercase; */
  color: #8c8c8c;  /* #999999;    */
  font-weight: 300;
  margin-bottom: 30px;
}
h2 {
  font-size: 24px;
  xtext-transform: uppercase;
  color: #8c8c8c;
  font-weight: 400;
  margin-bottom: 30px;
}
h4 {
  font-size: 20px;
  line-height: 1.375em;
  color: #808080;
  font-weight: 400;
  /*margin-bottom: 8px; used in modal no margin !! */
  /*word-break: break-all;*/
}
h5 {
  font-size: 16px;
  line-height: 1.375em;
  color: #808080;
  font-weight: 500;
  margin-bottom: 10px;
}
h6 {
    font-size: 14px;
    line-height: 1.375em;
    color: #808080;
    font-weight: 500;
    margin-bottom: 10px;
}
/*h1 {font: italic bold 2.8em Georgia, serif, sans-serif;}
h2 {font: italic bold 1.2em Verdana, sans-serif;  }
h3 {font: normal bold 1.1em Verdana, sans-serif;  }
h4 {font: normal bold 1.0em Verdana, sans-serif;  }   */

h6+ul { margin-top: 0; }

a {
  color: #4682B4;  /*# 696969 #808000; #696969;  #B0862D  wasB38600;  */
  font-weight: bold; 
  text-decoration: none;
  cursor: pointer;
}

a:hover 
{
	color:  #0066ff; /*#B0862D*/
}

/***********************************************************/
.pull-right {
  float: right;
}
.pull-left {
  float: left;
  padding-right: 2px;
}
/******* cleaning float *******************/
/* <br style="clear:clear: both;"/>inline */
/* <div class="clear"></div> inline       */
/*.clear { clear: both; }     */
/*.clearl {	clear: left; }   */
/******************************************/


.clear { font-size: 0; clear: both; }
.clearl {	font-size: 0; clear: left; }
.clearr {	font-size: 0; clear: right; }

.header_line {   /*line on the top */
	position: relative;
	border-top: solid 2px 	#CCCCCC;
	margin-bottom: 25px;    
}

 /* important all pages  */
.top_panel, .bot_panel, .cli_panel
{
  /*zwidth: 970px;*/
  max-width: 1000px;
  position: relative;
  background-color: transparent;
 /* xmargin-left: auto;     /!**IE6 doesn't recognize :auto **!/
  xmargin-right: auto;
  xmargin-bottom: 1px;*/
  margin: auto;
  border: none;
}
div.cli_panel
{
  overflow: hidden;
 /* zborder: 1px solid gray; */
  background-repeat: repeat-x;
  background-color:  #f2f2f2;  /* gray  FEFEF2ivory */
}
div.top_panel
{
  height: 60px;
}
div.bot_panel  /*** div.bot_panel  footer Panel **/
{
  margin-top: 1px;
  /*border: 1px solid gray; */
 /* zheight: 74px; */   /*height of footer */
  background-color:	#e6e6e6;  /* a6a6a6; nav*/
  /*zbackground-image:  url('../img/MF_top_gradnt.png');
   zbackground-repeat:repeat-x;*/
  cursor: default;
}

@media (max-width: 600px) {

  .top_panel h1, .top_panel img{
    font-size: 20px;
    color: #666666;
    font-weight: 500;

  }
  .top_panel img{
    width: 35px;
    height:25px;
    /* transform:scale(0.77);
     transform-origin:0% 0%;*/

  }
  #btn_funreg, #btn_funlog{
     zposition: absolute;
     font-size: 14px;
      /*-ms-transform:scale(0.77);
      -ms-transform-origin:0% 0%;*/
   }
}
@media (max-width: 400px) {

    .top_panel h1, .top_panel img{
        /*for IE */
        -ms-transform:scale(0.8);
        -ms-transform-origin:0% 0%;
        /*-ms-transform:translateX(10px) translateY(25px);   */
    }

    #btn_funlog {
        /* z-ms-transform: rotate(45deg);  Internet Explorer */
        font-size:12px;
        -ms-transform:translateX(10px) translateY(25px);
        -moz-transform:translateX(10px) translateY(25px);
        -webkit-transform:translateX(10px) translateY(25px);
    }
    #btn_funreg {
        font-size:12px;
        -ms-transform:translateX(10px) translateY(25px);
        -moz-transform:translateX(10px) translateY(25px);
        -webkit-transform:translateX(10px) translateY(25px);
    }
    /*z#btn_funlog {-ms-top: 19px; right: 18px; }
    z#btn_funreg {-ms-top: 11px; right: 82px; }*/
    /*#btn_funlog {
        position: -webkit-absolute;
        top: 20px;
        right:18px;

    }*/

        /*-ms-transform:scale(0.77);
        -ms-transform-origin:0% 0%;*/

}



/***********Special design for all pages use*************/
div.blab_msg
{
  position: absolute;
  font-size: 1px;
  color: transparent;
}
div.blab_msg h1
{
  margin: 0px;
  font-size: 1px;
  font-style:normal;
}

div.warn_msg
{
  padding: 10px;
  background-color: white;
  font: bold 10px arial, serif, sans-serif;
  font-size: 1.2em;
  text-align: center;
  color: red;
}
div.msg_msg
{
  padding: 10px;
  background-color: white;
  font: normal 13px Arial, serif, sans-serif;
  text-align: center;
  color: black;
}

/*need */
span.spacer
{
    font-size: 0;
}

/*Need this*/
div.five  /*for directions on the top of page needed*/
{
    padding-left:20px;
    /*margin-top: 8px;*/
    font:  11px/25px Verdana, sans-serif;     /* 11px/20px font/line height*/
    letter-spacing: 4px;
    color: #A9A9A9;
}
div.six  /*for directions on the top of page needed*/
{
    text-align:center;
    /*margin-top: 8px;*/
    padding:20px;
    margin-bottom:10px;
    /*color: #A9A9A9;*/
}
@media (max-width: 600px) {
    /*home page*/
    div.five     {
        /*padding-left: 20px;*/
        font:  10px Verdana, sans-serif;
        color: #8c8c8c;
        letter-spacing: 1px;
        margin-top: 10px;
        margin-bottom: 8px;
    }
    div.six h6    {
        font-size: 12px;
        /*color: red;*/

    }


}
/*Need this above end*/
span.six /*title FAQ*/
{
    font:  normal bold 12px Verdana, sans-serif;
    letter-spacing: 4px;
    color: 	#767676;
}


/*******************************************
      Video Spin Home page
********************************************/
* {
  box-sizing: border-box;
}
 /******  small box menu on home page  *******************/

/* Create two columns/boxes that floats next to each other <nav> not class*/
nav {
  /*float: left; if use two column another on the right*/
  width: 80%;
  display: block;
  height: auto;
  background-color: #a6a6a6; /**/
  padding: 12px;
  /*margin: 10px;*/
  margin-left: auto;
  margin-right: auto;
  font-size: 13px;
    /*outline: #8c8c8c solid 10px;*/
  /*font-style:normal;*/
}

/* Style the list inside the menu */
nav ul {
  list-style-type: none;
  padding: 0;
  color: #e6e6e6;
  line-height: 24px;

}
/*
nav li:first-child
{
  line-height: 40px;
} */
nav ul a
{
  text-decoration: none;
  color: #e6e6e6; /* #cccccc;  */
  /*ztext-shadow: #8c8c8c 1px 1px;*/
  /*text-shadow: #33517A 2px 2px;  */
}
nav ul a:hover
{
  color: #595959;
  /*text-decoration: underline;  */
}

/******  small box menu on home page ends *****************************/
/******  nav  menu on product details page  - horizontal ***************/
/******  nav bar class use on product details **************************/
.nav {
    background-color:  #a6a6a6;
    list-style-type: none;
    text-align: center;
    width: 90%;
    margin-top: 40px;
    margin-bottom: 10px;
    margin-left: auto;
    margin-right: auto;
    /*margin: 40px 50px 5px 50px ;*/
    padding: 0;
}

.nav li {
    display: inline-block;
    font-size: 13px;
    padding: 15px;

}
.nav li a{
    color: #e6e6e6;

}
.nav li a:hover
{
    color: #595959;
    /*text-decoration: underline;  */
}
/******  nav  menu on product details page ends *******************/
/******  used on home page,         *******************/
article {
  float: left;
  padding: 20px;
  width: 33.3%;
  /*zbackground-color: #f1f1f1;*/
  zheight: 260px; /* only for demonstration, should be removed */
}

section {
  background-color: #cccccc;
    margin-left: auto;
    margin-right: auto;
}
/* Clear floats after the columns */
section:after {
  content: "";
  display: table;
  clear: both;

}


/*******************************************
      Product_Gallery page  + home page
********************************************/

/* Content video home*/
.portfolio {
  position: relative;
  background-color: transparent;
  padding: 3px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  /*padding: 8px 5px 8px 10px;*/
  margin-bottom: 25px;
  width: 100%;    /*image responsive scale up and down use width 100% height auto*/
  height: auto;
  cursor: default; /*cursor on image*/
  /*zmargin-right: 15px;px*/
  /*zztransform: translate(-10%, -20%);*/
}
/*.portfolio video {vertical-align: middle;}*/

/********************  text over image *************/
/***don't remove need not overlap with links below***/

.video-text {
    position: relative;
    max-width: 800px;
    margin: 0 auto;
}
.video-text .text {
    position: absolute;
    top: 4%;
    color: #b3b3b3;
    width: 100%;
    zpadding: 2px;
    text-align: center;
    font-size: 16px;

}
 .text2 {
    position: absolute;
    top: 12%;
    color: #00A801;
    width: 100%;
    zpadding: 2px;
    text-align: center;
    font-size: 18px;

}
/*/!********************************************************************/
/**         list style Product gallery/ providers, quotes selection ****/

/***********************************************************************/
 ul.product {
    list-style-type: none;
    /*padding: 0px;*/
    margin-left: auto;
    margin-right: auto;
}
ul.product  li {
    border: 2px solid white;
    border-right:none;
    border-left:none;
    margin-top: -1px; /* Prevent double borders */
    /*zbackground-color: #e6e6e6;*/
    padding: 10px;
}
ul.product li:first-child {
    zbackground-color: yellow;
    /*border: 2px solid red;*/
    border-top: none;
}


/*****   row   ****************/
.row {
  margin: 8px 10px;
}
/* Add padding BETWEEN each column Colummn of 4*/
.row,
.row > .column4 {
  padding: 8px;
}
/* Add padding BETWEEN each column */
/*.row2,
.row2 > .column {
  padding-left: 5px;
}*/

/* The expanding image container for Tabbed Gallery
 iMPORTANT display NONE*/
.row2 {
  position: relative;
  /*zmargin: 8px 10px;*/
  /*zdisplay: none;*/

}
/*  clear floats  ***********/
.row:after {
  content: "";
  display: table;
  clear: both;
}

.row2:after {
  content: "";
  display: table;
  clear: both;
}

/*****   column   ****************/
/* Style column common for pages: Home page manage by .left,.right .middle  */

/******** used in  home page with video text     ******************/
.column, .column2 {

  float: left;  /*no float text wrap when resize*/
  height: auto;
  padding: 5px;
  opacity: 1.0;
}


/* Style the images inside the grid product gallery */
img.column2 {
  opacity: 1.0;
  margin-left:12px;
  margin-bottom:12px;
  float: right;
  height: auto;
  cursor: default;
  max-width: 100%;

}
/*this column  used in Product Gallery  for image ****/
/* The grid: Four equal columns that floats next to each other */
.column4  {
  float: left;
  width: 25%;
  padding: 10px;
}

/* Style the images inside the grid */
.column4 img {
  opacity: 0.8;
  cursor: zoom-in;
  /*cursor: pointer;*/
  /*border: 1px solid #ccc;*/
}

.column4 img:hover {
  opacity: 1.0;
}
/*  make column adjustment  */
.left {
 width:70%;

}
.right {
  width:30%;

}
.middle {
  width:30%;

}

/***********Home  page, products,  Responsive goes here and below *****************/
/* Responsive layout - makes the two columns/boxes stack on top of each other instead of next to each other, on small screens */

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

    /*.column.left{
      width: 70%;
    }
    .column.right{
      width: 30%;
    }*/
    .column2 {
        width: 50%;
    }
    .column4 {
        width: 25%;
    }
    /*home page*/
    .row2 h2  {
        font-size: 22px;
        /*color: green;*/
    }


}


/* Responsive layout - makes a two column-layout instead of four columns */
 /*home page*/



/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 700px) {
  .column  {
    width: 100%;      /**/
    text-align:center;
  }
 /* .column2 {
    width: 70%;
  }*/
  .column4  {
    width: 50%;
  }
    .column video {
        width: 90%;
    }
    article h2 {
        font-size: 18px;
        margin-bottom: 12px;
    }
    nav {
        width: 100%;
        /*float:none;*/
    }
    nav ul a{
        text-align:center;
        /*color: white;*/
        color: #ffff00;
        font-size: 13px;
        line-height: 30px;
    }
   /* .nav {
        width: 100%;
    }*/
 /*below page Products _ibddl and fxddl menu */

    .nav {
         margin: 15px;
    }

    .nav li {
        display: block;
        font-size: 12px;
        padding: 10px;
    }
    .nav li a{
        text-align:center;
        color: #ffff00;
        font-size: 12px;
        width: 50%;
    }
    .nav h6{
        text-align:center;
        /*color: red;*/
        margin-bottom:2px;
        font-size: 14px;

    }

    /*home page*/
    .row2 ul li{
    font-size: 12px;
    /*xmargin-bottom: 10px;*/
  }

    /*product page ibddl and fxddl*/
    .listdesign  {
        font-size: 12px;
    }

}

@media (max-width: 600px) {
    /*home page*/
    article{
        width: 100%;
        height: auto;
    }
    article h2 {
        font-size: 18px;
        margin-bottom: 10px;
    }
    article p {
        font-size: 14px;
    }


    /*text over video*/

    .video-text .text{
        /*color: green;*/
        font-size: 13px;
    }
    .text2 {
        /*zcolor: #cccccc;*/
        font-size: 15px;
        /*color:red;*/
    }
    .row2 h5 {
        font-size: 14px;   /*home page;*/
        line-height: 1.275em;
    }


}

 /*used in home page*/

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

    .listdesign h6 {
        font-size: 12px;
    }
    /*home page*/
    .row2 h2 {
        font-size: 18px;
        /*color:red;*/
    }

    /*home page;*/
    .row2 h5 {
        font-size: 13px;
        line-height: 1.2em;
        font-weight: 500;
    }

    .video-text .text{
        color: #cccccc;
        font-size: 10px;
        /*color:red;*/
    }
     .text2{
        /*zcolor: #cccccc;*/
        font-size: 11px;
        /*color:red;*/
    }
     /*product image gallery*/
    .six h4 {
        font-size: 16px;   /*ibddl, fxddl page;*/
        font-weight: 500;
    }



}
/* Responsive layout -for zoom image don't show on small screens also see video.js  img zoom*/
@media screen and (min-width: 1024px) {
img.column2 {
  cursor: zoom-in;
  }
}
/*product details doesn't  zoom on small screens */
@media screen and (min-width: 600px) {
    .portfolio a, .portfolio img  {
        cursor: zoom-in;
    }
   /* .nav {
        width: 100%;
    }*/
}

/******************************************************/
/***************Responsive image grid******************/
/*************  Product details  **********************/
/*************describe column vertically******/
.row_grid {
    display: -ms-flexbox; /* IE10 */
    display: flex;
    -ms-flex-wrap: wrap; /* IE10 */
    flex-wrap: wrap;
    padding: 0 4px;
    background-color: #969696;

}
.column_grid {
    -ms-flex: 25%; /* IE10 */
    flex: 25%;
    max-width: 25%;
    padding: 2px 4px;

}

.column_grid img {
    margin-top: 8px;
    vertical-align: middle;
    width: 100%;
    /*zcursor: zoom-in;*/
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 600px) {
    .column_grid {
        -ms-flex: 50%;
        flex: 50%;
        max-width: 50%;
    }
}
@media screen and (max-width: 480px) {
    .column_grid {
        -ms-flex: 100%;
        flex: 100%;
        max-width: 100%;

    }
}


/*******************************************
    Product - Gallery page
********************************************/

/* Closable button inside the expanded image */
.closebtn {
  position: absolute;
  top: -14px;
  right: 6px;
  color: #666633;
  font-size: 32px;
  font-weight: bold;
  cursor: pointer;
  z-index: 100;    /*don't remove */
}
.closebtn:hover {
  color: #cc9900;
}
/* The VerticalTab */
/* Style the tab content */
.tabcontent {
  /*zfloat: left;*/
  padding: 0 12px;
  border-left: none;
  height: auto;
  display: none;
    -webkit-animation: fadeEffect 1s;
    animation: fadeEffect 1s;
  /*zheight: 500px;*/
  /*zborder: 1px solid #ccc;*/
  /*XXXwidth: 50%;  commented*/
}
/* Expanding image text not used right (img.title) */
#imgtext {
  position: absolute;
  top: 15px;
  right: 225px;
  color: red;
  zcolor: #cc5200;
  font-size: 20px;
}

/* for Tabbed Gallerry text  not used*/
/*#side {
 position: relative;
 padding: 10px 10px 10px 25px;
 color:  #808080;
 font-size: 14px;
 font-weight: bold;
}*/



/*******************************************
      All pages styling    check what to remove
********************************************/
/********     highlight text    *************/
span.one
{
  font: italic bold 0.95em Verdana, sans-serif;
	color: #CC7A29;	 /*orange */
}


span.seven /*buy paypal page */
{   
  font: normal normal 10px Verdana, sans-serif;
  color: #5A5A5A;      /*#6F9C0E; #CC7A29; */
  cursor: default;
}
span.eight /*th toolbox */
{  
 font: italic bold 0.9em Verdana, sans-serif; 
 color: #B4B4B4; /*#ffffff;*/
 position:relative;
 left: 150px;
}
/*span.notes
{	
  position:relative;
   margin-left: 35px;
  font: 10px/1.231 arial,helvetica,clean,sans-serif;
}*/

span.help 
{
  cursor:help
}

span.point_link  /*details link in talbe */
{
  cursor: pointer;
  font: 11px/1.231 'ColaborateRegular',Arial,sans-serif; 
  margin: auto;
  text-align: center;   
  color: 	#0059b3;
}
/*details link in table Right */
/*span.point_link_R
{
  cursor: pointer;
  font:  italic normal 11px 'ColaborateRegular',Arial,sans-serif;  
  margin: auto;  /!* put image in center of cell *!/
  float: right;
  padding-right: 90px;
  color: 	#B3C0DC!important; /!*blue *!/
  text-decoration: none;    
} */
span#print_break
{
  font: 0px tahoma, arial, sans-serif;
  color: transparent;
}
span.block /*not used ?*/
{
  display:block;
}

/******* Nice Horizontal Line on Faq page **************/
div.hr1 {   /*Horizontal line */
  position: relative;
  left:42px;  /*positioning HR */
  height: 18px;
  width: 89%;
  color: 	#D3D3D3;
  border:0;
  box-shadow:inset 0 12px 12px -12px rgba(0,0,0,0.5);
}
div.hr1 hr
{
  display: none;    /*not show black hr line itself */
}
div.hr2 {   /*Horizontal line with image */
  position: relative;
  margin-top: 0px;
  height: 15px;
  background: transparent url(../img/horiz_line1.png) no-repeat scroll center;
}
div.hr2 hr
{
  display: none;    /*not show black hr line itself */
}

/**************************************************
            Footer  menu and  use in other pages
***************************************************/

/******* Footer Information  **************/
#finfo1
{
  font: normal 8px/1.231 Tahoma, sans-serif;
  float:right;
  color:#8c8c8c;
}


.bot_row::after {
  content: "";
  clear: both;
  display: table;
}
.bot_row  {
  background-color: #4d4d4d;
  font-size: 10px;
  color:#cccccc;
}

[class*="col-"] {
  float: left;
  padding: 15px;
}
/* For mobile phones: */
[class*="col-"] {
    width: 100%;
}
/*if make bigger then 400 px column take 100%*/
@media only screen and (min-width: 420px) {
    /* For tablets: */
    .col-s-1 {width: 8.33%;}
    .col-s-2 {width: 16.66%;}
    .col-s-3 {width: 25%;}
    .col-s-4 {width: 33.33%;}
    .col-s-5 {width: 41.66%;}
    .col-s-6 {width: 50%;}
    .col-s-7 {width: 58.33%;}
    .col-s-8 {width: 66.66%;}
    .col-s-9 {width: 75%;}
    .col-s-10 {width: 83.33%;}
    .col-s-11 {width: 91.66%;}
    .col-s-12 {width: 100%;}
}
@media only screen and (min-width: 780px) {
    /* For desktop: 768*/
    .col-1 {width: 8.33%;}
    .col-2 {width: 16.66%;}
    .col-3 {width: 25%;}
    .col-4 {width: 33.33%;}
    .col-5 {width: 41.66%;}
    .col-6 {width: 50%;}
    .col-7 {width: 58.33%;}
    .col-8 {width: 66.66%;}
    .col-9 {width: 75%;}
    .col-10 {width: 83.33%;}
    .col-11 {width: 91.66%;}
    .col-12 {width: 100%;}
}
/*lena addition for footer */
@media only screen and (max-width: 580px) {
    /* For tablets: */
    .col-m-1 {width: 8.33%;}
    .col-m-2 {width: 16.66%;}
    .col-m-3 {width: 25%;}
    .col-m-4 {width: 33.33%;}
    .col-m-5 {width: 41.66%;}
    .col-m-6 {width: 50%;}
    .col-m-7 {width: 58.33%;}
    .col-m-8 {width: 66.66%;}
    .col-m-9 {width: 75%;}
    .col-m-10 {width: 83.33%;}
    .col-m-11 {width: 91.66%;}
    .col-m-12 {width: 100%;}
}
 /*
html {
  font-family: "Lucida Sans", sans-serif;
}
  */
.bot_header {
  /*background-color: #4d4d4d;*/
  color: #bfbfbf;
  padding: 5px;
}

.bot_menu ul {
  list-style-type: none;
  margin: 0;
  padding: 0;

  /*background-color: #4d4d4d;*/
}

.bot_menu li {
  padding: 2px; /* 8px;  */
  color:#bfbfbf;
 /* xmargin-bottom: 7px;
  xbackground-color: #33b5e5;
  zcolor: #ffffff;*/
  /*zbox-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);*/
}
.bot_menu a:hover
{
  color:  #4682B4; /*#B0862D*/
}
.bot_menu li a {
  padding: 2px; /* 8px;  */
  /*xmargin-bottom: 7px;*/
  /*xbackground-color: #33b5e5;*/
  color:#bfbfbf;
  font-weight: bold;
  font-size: 11px;
  /*zbox-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);*/
}
  /*************** social icons footer *******************/
 .social img  {
  display: inline;
  float: right;
  border: 0;
  margin: 0px 10px 0px 0px;
  vertical-align: middle;
}
 /************  responsive for footer  ********************/
@media screen and (max-width: 700px) {


    /*.col-3  footer  can't change width already defined in pallete above */
    .col-3 img {
        width:30px;
        height:30px;
    }
    .col-3 ul li a {
        font-size: 10px;
    }
    .col-3 p {
        font-size: 8px;
        padding-left: 2px;
        /*xdisplay:none;*/
    }
 /* .col-12 img{
    width:20px;
    height:20px;

  }*/
    /*.bg-image{
        width:auto;
        height:20px;

    }*/

}

/*****************************/
/******   svg icons  check later  *********/
/*****************************/
/*.icon-pinterest{
  display: inline-block;
  width: 1em;
  height: 1em;
  stroke-width: 0;
  stroke: currentColor;
  fill: currentColor;
}*/
/*****************************/
/******   end footer *********/
/*****************************/

/*****************************/
/************Paypal and login *************/
/*******************************************/
#ses_inf
{
  position: absolute;
  padding: 2px 4px 3px 4px;
  top: 11px;
  right: 85px;
  font: bold 12px Arial, sans-serif;
  color: #52527a;
  background-color: #ffffff;
  border: 1px solid #8585ad;
  display: none;
}
#txt_pbd
{
  position: absolute;
  right: 240px;
  bottom: 2px;
  font-family: Tahoma, Arial, sans-serif;
  font-size: 13px;
  font-style:italic;
  color: 	#999966; 	/*#898989;  olive */     
}
#ses_inf, #txt_pbd
{
  cursor: default;
}
.btn_fun
{ 
  position: absolute;
  ztop: 0;   /*described below*/
  zright:0;
  font: 500 14px Verdana, Arial, sans-serif;
  color: black;
  outline: none;
  text-decoration: none;
}

.btn_fun:hover
{
  color: #339966;
 /* ztext-decoration: underline;  */
}

#btn_funlog { top: 11px; right: 18px; }
#btn_funreg { top: 11px; right: 82px; }

#luserddl
{
  display: none;
  z-index: 1800;
  bottom: 4px;
  right: 18px;
}

.flat_input, .flat_btn
{
  border: 1px solid #E0D394;
}
.gap4px
{
  font-size:0;
  height:4px;
}
#mask
{
  position:absolute;
  left: 0;
  top: 0;
  z-index: 8000;
  background-color: #000;
  display: none;
}
#bnow_mask
{
  position: absolute;
  left: 4px;
  top: 192px;
  width: 182px;
  height: 68px;
  z-index: 8000;
  background-color: #000;
}
#bnow_spin
{
  position: absolute;
  left: 62px;
  top: 120px;
  height: 65px;
  width: 85px;
  border: 1px solid silver;
  z-index: 8000;
  background-color: #FFFFFF; /* white */
  display: none;
}

#fm_iv
{
  display: none;
  position: absolute;
  border:1px solid black;
  z-index:9100;
}
#fmdw_title
{
  padding: 3px 36px 3px 8px; /* 36px added for bc("button close") */
  border-bottom: 1px solid #999966;  /*   and correct line 2235 */
  background-color: #f8f2d3;
}

#fmdw_title a
{
  background-color: transparent;
  color: gray;
  font: 11px tahoma, arial,helvetica,clean,sans-serif;
  text-decoration: none;
}
span#mdw_stitle
{
  font: bold 11px arial, helvetica, clean, sans-serif;
  color: black;
  cursor: default;
}

div.bc
{
  position: absolute;
  right: 3px;
  top: 3px;
  width: 24px;
  height: 16px;
  zbackground: url('../img/bc.png');
}

/*******************************************
    Purchase Pop-Up window scroll box      *
*******************************************/
.form_ie6
{
    font-size: 0; /* required for IE6 otherwise extra margin/paddimg added at the top */
}
div#fm_ppl
{
    position: relative; /* required !!! */
    width: 614px;  /* 470px */
    height: 430px; /* 345px */
    background-color: white;
    font: normal 12px Tahoma, Arial, sans-serif;
    color: black;
}
#p_ppltop
{
    padding-top:4px;
    padding-bottom:3px;
    text-align:left;
    height: 60px;
    font: 11px Arial, sans-serif;
    color: black;
}
#p_ppltop_info
{
    padding-left: 15px;
}

#p_pplimg_abs
{
    position: absolute;
    top: 58px;
    right: 8px;
    width: 150px;
    height: 150px;
    background-color: black;
}
#p_prodimg /* if placed inside "form" will be centered-horz, so  absolute not needed*/
{
    width: 150px;
    height: 150px;
    margin: 15px 20px 5px 20px;
    border: 0;
    background-color: transparent;
    text-align: center;
    vertical-align: middle;
}
#ppl_ptag
{
    margin: 5px 10px 15px;
    text-align: center;
    cursor: default;
    font-weight: bold;
}
.AI150X150 /* "anchor image 150x150px" */
{
    width: 150px;
    height: 150px;
    vertical-align: middle;
    color: white;
}
#p_pplprod
{
    position: absolute;
    overflow: hidden;
    top: 68px;
    left: 8px;
    width: 190px;
    height: 265px;  /*148px;*/
    background-color: #F4EBBC;
    text-align: center;
    border: 1px solid #F4EBBC;
}
#p_pplinf
{
    position: absolute;
    overflow: hidden;
    top: 68px;
    right: 8px;
    border: 1px solid #F4EBBC;
    width: 406px;    /*254px;*/
    height: 265px;  /* 295px;*/
    background-color: #F4EBBC;
    text-align: center;
    color: black;
    font: 11px Arial, sans-serif;
}

#p_pplb1
{
    zposition: absolute;
    position:fixed;
    width: 464px;  /* 464px */
    height: 82px;  /* 57px */
    left: 2px;
    bottom: 2px;
    background-color: #F4EBBC;
    border: 1px solid #DCDCDC;
    font: 11px Arial, sans-serif;
}

#p_refund
{
    position: absolute;
    width: 596px;   /* 464px */
    height: 80px;  /* 57px */
    left: 8px;
    bottom: 8px;
    border-bottom: 2px solid #F4EBBC;
    text-align: left;
    font: 11px Arial, sans-serif;
}


div.ppl_notes
{
    padding: 2px 25px;
}

#ppl_prod_name
{
    height: 20px;
    padding-top: 4px;
    padding-left: 4px;
    background-color: #F4EBBC;
    text-align: left;
    font: bold 12px Tahoma, Arial, sans-serif;
}

#ppl_memo_eula
{
    margin-right: 4px;
    padding: 0px 8px;
    height:206px;
    line-height:120%;
    text-align: left;
    overflow: auto;
    background-color:	#FFFFFF;
    border: 1px solid #505050; /*#DCDCDC;*/
}

#attn
{
    background-color:	#F6EFC9;/*#EEEEEE;gray */
}


/*********** read policy buttons *********/
#btn_terms a:link,
#btn_terms a:visited /*buy */
{
    cursor: pointer;
    font:  normal bold 10px 'ColaborateRegular',Arial,sans-serif;
    text-decoration:none;
    color:#FFFFFF;
    background-image: url('../img/green_button.png');
    background-repeat:no-repeat;
    background-position:center center;
    padding: 0px 3px 1px 3px;
    border:1px solid #7bb510;
    border-color:	#62910D	#6FA30E	#7bb510	#88BC28;
}

#btn_terms a:hover,
#btn_terms a:active
{
    color: #FFD700;/*yellw */
    border:1px solid #CCAC00;
}

/*************************************************/

div.note_txt
{
    zposition: relative;
    padding: 5px;
    background-color: black;
    color: #DD0000;
    color: white;
    text-align: center;
}


div.note_txt1
{
    position: relative;  /* IE6 Disappearing Border fix */
    margin: 8px 15px;
    padding: 4px;
    border: 1px solid #DCDCDC;
    color: black; /*#FEFEF2;*/
    font: 11px tahoma,arial,sans-serif;
    text-align: center;
}

img.bcimg
{
    background-image: url('../img/bc.jpg');
}




/*********** Product description page ibddl ******/
/********** *******************************************************
       Graph browser forex and stocks -products details pages
/***************************************************************/

/*div.graph_forex, div.graph_stock   /!*graph bacgrnd right now not used maybe later*!/
{
  position: relative;
  margin:30px auto;    /!*top bottom 10px, left-right auto to center image*!/
  /!*width: 680px;*!/
  /!*height: 159px;*!/
  width: 100%;    /!*image responsive scale up and down use width 100% height auto*!/
  height: auto;
  border:2px double #D6DDE6;
  cursor: zoom-in;
}*/
/*
div.graph_stock   /!*graph bacgrnd stock*!/
{
  background:  #FEFEF2 url('../img/fm_ibddl/LULU.STK.png') no-repeat center center;
}
div.graph_forex   /!*graph bacgrnd stock*!/
{
  background:  #FEFEF2 url('../img/fm_ibddl/USD.JPY.FX.png') no-repeat center center;
}
*/



/**************************************************/


/*******************************************************
*          product page ibddl and fxddl                *
*******************************************************/

.listdesign
{
  margin: 0;
  padding: 0 15px;
  position:relative;          /*IE fix bullet disapear  position relative */
}

.listdesign ul
{
  margin: 6px 0;
  padding-left: 5px;
  list-style: none outside;
  cursor: default;
}

.listdesign li
{
  margin-bottom: 5px;
  padding-bottom: 6px;/*between lines in list*/
  padding-left:14px;  /*between bullets and list */
	/*bullets */
  background: url('../img/bullet4.gif') no-repeat  0 5px;
  /*background-image: url('../img/bullet4.gif');
  background-repeat: no-repeat;
  background-position: 0 4px;*/ /* vert bullet's offset from the top*/
}

.listdesign li li { margin-bottom: 5px; padding-bottom: 1px;}
.listdesign li a 	{	padding-left: 15px ; font-weight: bold; font-size:12px; }
/*.listdesign_title
{
  margin: 8px 0px 0px 5px;
  padding: 1px 3px 2px 25px;
  font-weight: bold;
}*/

/*.im3224 { background: #EBEBE7;padding: 0;	border: 2px solid red; }
.icons a.im18x5 {	display: block;	float: left; margin-top: 2px;	border: 2px solid #EBEBE7; background: #EBEBE7;}
.icons a.im18x5:hover { border: 2px solid #CCCCC1;}
.icons .im18x5 img { background-color: white; display: block; width: 180px; height: 150px;}
.scroll { margin-left: 2px; overflow:auto; }*/

#hm_right1ZZZ 
{
  position:absolute;
  right:0;
  height:100%;
}
.algn_centerZZZ
{
text-align:center;
}

.div_hcenter { width: 50%; margin: auto;}
.div_hcenter80 {width: 80%; margin: 0 auto;}
.ul_inline { display: inline;}

div.aa_disclaimer0   /* ibddl disclaimer need on top of page*/
{
    position: relative;  /* IE6 Disappearing Border fix */
    /*margin: 0px 72px 12px 72px;*/
    margin: 0 12px 12px 12px;
    border-bottom: 1px solid #CCB; /*SIDEBAR VERTICAL LINE */
    color: gray; /*#FEFEF2;*/
    font:  9px tahoma, arial, sans-serif;
    text-align: center;
}


div.disclaimer
{
    position: relative;  /* IE6 Disappearing Border fix */
    margin: 20px 35px 2px 35px;	/*important for cross browsers */
    padding: 5px 6px 5px 16px;
    border:1px solid silver;
    font: 9px/1.231 arial,helvetica,clean,sans-serif;
    /*font: 9px tahoma, arial, helvetica,clean,sans-serif;*/
}


/*div.aa_fe_limit
{
  position: relative;  /!* IE6 Disappearing Border fix *!/
  margin: 2px 36px 12px 36px;
  padding: 6px 6px 6px 26px;
  border:1px solid silver;
  background-color: #F4EBBC;/!*#F0E3A4;*!/
  color: black; /!*#FEFEF2;*!/
  font: 11px tahoma, arial, sans-serif;
}*/

/*div.aa_fe_limit h4
{
  padding: 0px 6px 0px 10px;
}*/

div.disclaimer,
div.aa_disclaimer0,
.ul_compact,
    /*#ibacion_cntr*/
{
    cursor: default;

}
/*compact notice, disclaimer for product details */
.ul_compact
{
    margin: 15px;	/*important for cross browsers */
    padding-left: 25px; /*important for cross browsers */
    text-align: left;
    font: 11px tahoma,arial,sans-serif;
    /*background-color: #ffffcc;*/
}



/*******************************************************
*           price comparisson table  order page 1       *
*******************************************************/

.columns {
    float: left;
    width: 33.3%;
    padding: 8px; /*between top panels */
}

.price {
    list-style-type: none;
    border: 1px solid #eee;
    margin: 0;
    padding: 0;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}

.price:hover {
    box-shadow: 0 8px 12px 0 rgba(0,0,0,0.2)
}

.price .header {
    background-color: #bfbfbf;
    color: white;
    font-size: 18px;
}

.price li {
    border-bottom: 1px solid #eee;
    zpadding: 10px 10px 17px 10px;
    padding: 10px 10px 16px;
    text-align: center;
    font-size: 13px;
    /*color: darkgreen;*/
}

.price .grey {
    background-color: #d9d9d9;
    font-size: 18px;
}

 /*button generic can use on other pages*/
.button {
    background-color: #4CAF50;
    color: white;
    padding: 8px 15px;
    zpadding: 5px 10px;
    margin: 8px 0;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    width: 100%;
    opacity: 0.95;
    font-size: 12px;
    /*text-shadow: 0 1px 0 #fff;*/

}

.button:hover {
    opacity:1;
    background-color: #45a049;
    color: white;
}


@media only screen and (max-width: 600px) {
    .columns {
        width: 100%;
    }
    .price li {

        padding: 6px 6px 10px ;
        text-align: center;
        font-size: 12px;
        /*color: darkgreen;*/
    }
    /*order */
    .row h4 {
        font-size: 16px;
        font-weight: 600;
        /*color:red;*/
    }
    .row td {
        font-size: 11px;
        padding: 6px;
        /*color: mediumvioletred;*/
    }
}



/*comparison table on  Order Page with id instead of table*/

#subscription {
    font-family: Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
    zborder: 1px solid #ddd;
    zmargin-left:auto;
    zmargin-right:auto;
}

#subscription td, #subscription th {
   border: 1px solid #ddd;
    padding: 8px;
    width: 25%;
    text-align: center;
    zpadding: 10px;
    font-size: 14px;
}

#subscription tr:nth-child(even){background-color: #e6e6e6;}
/*th:first-child, td:first-child {
    text-align: left;
}*/
#subscription tr:hover {background-color: #bfbfbf;}

#subscription th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: center;
    background-color: #bfbfbf;
    color: white;
    font-size: 18px;
}

.fa-check {
    color: green;
}

.fa-remove {
   color: #ff9980;  /* #4d4d4d;*/
}
.fa-question-circle {
    color:  #666666;
    font-size: 24px;
}
.fa-info-circle {
    color:  #4d4d4d;
}




/*********** buy button  order page submit  for Marketfryer check to remove*********/
/*tr#btn_buy a:link,
tr#btn_buy a:visited /!*buy *!/
{
  cursor: pointer;
  zdisplay: inline;
  font: normal bold 11px 'ColaborateRegular',Arial,sans-serif;
  text-decoration: none;
  color: #FFFFFF;
  background-image: url('../img/green_button.png');
  background-repeat: no-repeat;
  background-position: center center;
  padding: 4px 6px 4px 6px;
  border:1px solid #7bb510;
  /!*zborder-color:	#62910D	#6FA30E	#7bb510	#88BC28;*!/
}

tr#btn_buy a:hover,
tr#btn_buy a:active
{
  color: #FFD700;/!*yellw *!/
  border:1px solid #CCAC00;
}*/
/************ End of table   ***************/

div.div_chkbox
{
  margin-top: 5px;
  margin-right: 4px;
  background-color: #B9FF90;
}

/**** begin Vert-aligned check box in ppl 2012-09-12 ****/
.div_chkbox label
{
  display: block;
  zfloat: left;
  padding-right: 0px;
	padding-top: 2px;
	padding-bottom: 2px;
}
.div_chkbox input
{
  vertical-align: middle;
}
.div_chkbox label span
{
  vertical-align: middle;
}
/**** end Vert-aligned check box  2012-09-12 ****/



/************************************************/
/*          Tooltips                            */
/************************************************/
  /*used in .js */
.trigger:hover
{
  color: #cc9900; /*#CC9900;  */
}


/*mf tooltip*/
.tooltip
{
    display:none;
    z-index: 6000;
    position: absolute;
    padding: 5px 0;
    width: 220px;
    height: 80px;
    background-color: #555;
    color: #fff;
    /*ztext-align: center;*/
    border-radius: 6px;  /*box rounded*/
    transition: opacity 0.3s;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent transparent;
    opacity: 1;
}

.tooltip h6
{
  /*header of tooltip also in .js*/
  color:#fff;
  font-size: 13px;
  font-weight: bold;
  /*text-shadow: 2px 2px 1px rgba(0, 0, 0, 0.75);*/
  margin-bottom: 2px;
  text-align:center
}
/*.tooltip h1, h2, h3
{
  font-family: 'ColaborateRegular',Arial,sans-serif;
}*/
.tooltip p {                     /* text of tooltip */
  margin-top: 0px;   /*top margin between paragraph and header */
  line-height: 98%;
    font-size: 12px;
    color:white;
	/*color: 		#5A86D5!important;*/
}
/************ End of Poped UP Tooltips   ***************/
/*****************************************************/
/*          Modal Box    pages:  about,  data- providers   */
/*****************************************************/

/* The Modal (background) */
/* Set a style for all buttons */
button {
    background-color: #46a049;
    color: white;
    padding: 12px 15px;
    zpadding: 5px 10px;
    margin: 8px 0;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    /*zwidth: 100%;*/
    opacity: 0.8;
    font-size: 13px;
    /*text-shadow: 0 1px 0 #fff;*/
}
button:hover {
    opacity:1;
    background-color: #3e8e41;   /* change*/
}

/* Float cancel and delete buttons and add an equal width */
.cancelbtn, .linkbtn {
    float: left;
    width: 50%;
}

/* Add a color to the cancel button */
.cancelbtn {
    background-color: #ccc;
    color: black;
}

/* Add a color to the delete button */
.linkbtn {
    background-color: #3366ff;
}

/* Add padding and center-align text to the container */
/*not used*/
/*.container {*/
    /*padding: 10px;  /!*was 50 px*!/*/
    /*text-align: center;*/
    /*background-color: gray;*/
/*}*/


/* The Modal (background) */
/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: -10px; /* for top positioning of popup window */
    zpadding-top:100px;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.modal-header {
    padding: 6px 10px 6px 10px;
    background-color: #3366ff;
    color: white;
}

/* Modal Content/Box */
.modal-content {
    position: relative;

    background-color: #fefefe;
    margin: auto;
    padding: 0;
   margin: 15% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */
    /*margin: 25%;*/
   zpadding: 10px;
    border: 1px solid #888;
    width: 50%; /* was 50% Could be more or less, depending on screen size */
    zopacity: 1.0;
    /*text-shadow: 0 1px 0 #fff;*/
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    -webkit-animation-name: animatetop;
    -webkit-animation-duration: 0.4s;
    animation-name: animatetop;
    animation-duration: 0.4s
}
/* Add Animation */
@-webkit-keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}

@keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}




/* Style the horizontal ruler */
/*hr {
    border: 1px solid #f1f1f1;
    margin-bottom: 25px;
}*/

/* The Modal Close Button (x) */

.close_modal {
    color: white;
    float: right;
    font-size: 28px;
    font-weight: bold;
}
.close_contact {
    color: white;
    float: right;
    font-size: 28px;
    font-weight: bold;
}


.close_modal:hover,
.close_modal:focus {
    color: #000; /*#cc9900; */
    text-decoration: none;
    cursor: pointer;
}
.close_contact:hover,
.close_contact:focus {
    color: #000; /*#cc9900; */
    text-decoration: none;
    cursor: pointer;
}
/* Clear floats */
.clearfix::after {
    content: "";
    clear: both;
    display: table;
}
 /* design with white stripes and grety bacgr */
.stripe_design   {
    border: 2px solid white;
    border-right:none;
    border-left:none;
    margin-top: -1px; /* Prevent double borders */
    /*zbackground-color: #e6e6e6;*/
    padding: 20px;
}
/******  design page for data providers     *******************/


.col1 {
    float: left;
    padding: 8px;
    width: 25%;
    /*margin:10px;*/
    /*zbackground-color: #f1f1f1;*/
    zheight: 260px; /* only for demonstration, should be removed */
}
.col2 {
    float: left;
    padding: 5px;
    width: 75%;
    /*zbackground-color: #f1f1f1;*/
    zheight: 260px; /* only for demonstration, should be removed */
}




/* Change styles for modal's cancel button and delete button on extra small screens */
@media screen and (max-width: 600px) {
    .cancelbtn, .linkbtn {
        width: 100%;
    }

    .modal-content {
        transform: translate(0%, 60%);
        width: 100%;
    }

    /*Hor, Vertical to correct position instead of margin*/
    /*color: green;*/
    .col2 p {
        font-size: 12px;
    }
    button {
        font-size: 11px;
        font-weight: 400;
    }
   /*  check later */
    section h5 {
        font-size: 14px;
        /*font-weight: 500;*/
        color: #666666;
    }
}









/*############################################################
 # Name: MarketFryer   L0_Body.css (properties)              #
 # Date: 2011-10-20                                          #
 # Description:                                              #
 # Author: Yelena and Sergey Gavrilkin                       #
 # URL: http://marketfryer.com                               #
 ############################################################*/


/**************  all pages important  ***********/


#buf0 #buf1 { margin: 0px; padding: 0px;}
#buf0 { display:none;}
#content { z-index:-1000;}

#nav_gap
{
  /***********************************************************************
  * IE always sets a DIV to a minimum height that is enough to fit the   *
  * characters of the current font. If you set smaller or larger font    *
  * sizes in IE, the height of the DIV will be decreased or increased    *
  * accordingly, but, if you set "font-size: 0px" inside the DIV, it's   *
  * possible to set the high of container to any desired value >= 0.     *
  ***********************************************************************/
  font-size: 0; /*otherwise IE set the height to NOT exceed font's height*/
  position: relative;
  background: transparent;
  height: 6px;
}
/**************************************************************/
/*                   top navigatin menu                       */
/**************************************************************/

*html #menu_bar li a /* resolves IE6 problems don't remove css antology  */
{
  width: 100%;
}
/******************* Main navigation menu      content ****/
/************** Responsive tom menu   *******************************/
/*see menu in one line or drop down change size 400px or 600px*/
/*@media screen and (max-width: 400px) {
  #menu_bar ul  {
    width: 25%;
    font-size: 8px;
    position: relative;
    float: left;
    display: grid;
  }
}*/
/*@media screen and (max-width: 700px) {

  #menu_bar ul  {
    width: 100%;
    font-size: 4px;
    position: relative;
  }
}*/

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

  ul#navk li#ts10, ul#navk li#ts20,
  ul#navk li#ts40, ul#navk li#ts50 {
    width: 94px;
    position: relative;
    font-size: 10px;
    zheight: 32px;
  }
}

  /*makes 2 lines of navigation bar */
@media screen and (max-width: 400px) {

    ul#navk li#ts10, ul#navk li#ts20,
    ul#navk li#ts40, ul#navk li#ts50 {
        width: 128px;
        position: relative;
        font-size: 10px;
    }
}
/*makes 2 lines of navigation bar for IE don't remove*/
@media screen and (max-width: 280px) {

    ul#navk li#ts10, ul#navk li#ts20,
    ul#navk li#ts40, ul#navk li#ts50 {
        width: 94px;
        position: relative;
        font-size: 8px;
        /*-ms-transform:scale(0.5);*/
        /*-ms-transform-origin:0% 0%;*/
    }
}
#menu_bar
{
  position: relative;
  height: 29px;  /* "mnu_mp.png".sprites.height=24 !!!  never remove this */
  background:  url('../img/mnu_mp_arw.png') repeat-x 0 0;
  font: 300 11px/1.231 arial,helvetica,clean,sans-serif;
  /*font-size: 11px;   second level menu overwrite below */
  /*zoverflow: hidden;*/  /*doesn't show drop down menu  */
  z-index: 1600; /*important here menu overlay */
}
/****  All levels menu rules *****/
#menu_bar ul,
#menu_bar li
{
  list-style-type: none;
}
#menu_bar ul
{
  /*bad_position: relative; /*nonono don't use relative position: will shift content down */
  zmargin-left: -2px; /* adjust menu's left edge gap*/
}
#menu_bar li
{
  display: inline;  /*Important - horizontal menu */    /*for IE6 inline*/
  float: left;     /*horizontal menu */
}

/*****  style all menu’s anchor tags *****/
#menu_bar a
{
  position: relative;
  display: block;
  border-width: 0px;
  text-decoration: none;
  color: #fff; /*   xwhite */
  font-weight: bold;
  cursor: pointer;
  line-height: 29px;    /*important for IE */
  text-align: center;
}
 /**** all levels menu hover *****/

#menu_barZ li a:hover,
#menu_barZ .sub_level li a:hover
{
  zcolor: #FDE6AB; /* yellow */
}

/*assign some styles to only top level list items */
ul#navk li     /*must be:  li a  - for IE otherwise moves right if ts00, but float second level*/
{
  width: 124px;  /*!!!buttons main menu important here to avoid extra space between buttons */
  position: relative;	  /* important for IE*/
  display: block;       /* fix */
}
ul#navk li a
{
  text-align: center;
  background: url('../img/mnu_mp_arw.png'); /*for all levels anchor -for submenu override below */
}

/*******  Special conditions for the top level navigation  ***********/

/*applies to all levels */

ul#navk li#ts10 a,
ul#navk li#ts20 a,
ul#navk li#ts30 a,
ul#navk li#ts40 a,
ul#navk li#ts50 a,
ul#navk li#ts60 a,
ul#navk li#ts70 a
{
  display: block;	/* serg: must be "block"  */
  zheight: 29px;   /* if more IE6 fills the extra with black (24-20 = 4) */
}
ul#navk li#ts00
{
  display: none;   /* mandatory for IE6: hides "ts0" button */
}

/*** top level  background for active button ***/
ul#navk li#ts10.on a,
ul#navk li#ts20.on a,
ul#navk li#ts30.on a,
ul#navk li#ts40.on a,
ul#navk li#ts50.on a,
ul#navk li#ts60.on a,
ul#navk li#ts70.on a
{
  display: block;
  background-position: 0px -58px;
  xcolor: #FEF3D5; /*light yellow for active button*/
}

/*** top level hover background for inactive button ***/
ul#navk li#ts10.off a:hover,
ul#navk li#ts10.off:hover a,
ul#navk li#ts10.off_trk a,

ul#navk li#ts20.off a:hover,
ul#navk li#ts20.off:hover a,
ul#navk li#ts20.off_trk a,

ul#navk li#ts30.off a:hover,
ul#navk li#ts30.off:hover a,
ul#navk li#ts30.off_trk a,

ul#navk li#ts40.off a:hover,
ul#navk li#ts40.off:hover a,
ul#navk li#ts40.off_trk a,

ul#navk li#ts50.off a:hover,
ul#navk li#ts50.off:hover a,
ul#navk li#ts50.off_trk a,

ul#navk li#ts60.off a:hover,
ul#navk li#ts60.off:hover a,
ul#navk li#ts60.off_trk a,

ul#navk li#ts70.off a:hover,
ul#navk li#ts70.off:hover a,
ul#navk li#ts70.off_trk a
{
  background-position: 0px -29px;
}

/*** top level hover for active buttons ***/

ul#navk li#ts10.on a:hover,
ul#navk li#ts10.on:hover a,
ul#navk li#ts10.on_trk a,

ul#navk li#ts20.on a:hover,
ul#navk li#ts20.on:hover a,
ul#navk li#ts20.on_trk a,

ul#navk li#ts30.on a:hover,
ul#navk li#ts30.on:hover a,
ul#navk li#ts30.on_trk a,


ul#navk li#ts40.on a:hover,
ul#navk li#ts40.on:hover a,
ul#navk li#ts40.on_trk a,

ul#navk li#ts50.on a:hover,
ul#navk li#ts50.on:hover a,
ul#navk li#ts50.on_trk a,

ul#navk li#ts60.on a:hover,
ul#navk li#ts60.on:hover a,
ul#navk li#ts60.on_trk a,

ul#navk li#ts70.on a:hover,
ul#navk li#ts70.on:hover a,
ul#navk li#ts70.on_trk a
{
  background-position: 0px -58px;
}

/*******  Special conditions for the second and third level navigation  *******/

/****  hides 2 level menu -> another way -> ul.sub_level ***/

ul.sub_level li ul
{
  display: none;
}

/***  Second level menu style ****/
/*hide/show second level panels  another way to ->li:hover .sub_levelz*/
ul#navk li:hover div ul,
ul#navk li:hover ul
{
  xxxdisplay: inline;    /**IE6 hack to get sub menu links to behave correctly**/
  display: block;
  z-index: 2;
}
ul#navk li li
{
  list-style: none;
  display: list-item;
  width: 100%;
}
/*assign some styles to second and third level list items-*/
ul#navk .sub_level li a  /*another way -> #menu_bar1 ul ul li a    */
{
  text-align:left;
  ztext-indent: 10px !important;  /*all major browser first do this*/
  text-indent: 16px;           /*for IE bug-> text indent doubles */
  white-space: nowrap;
  font-size: 11px;
  line-height: 26px;
  background: 	#5E5E5E; /* for sublevel background is here !! */
  border-left: 3px solid 	#5E5E5E;
  border-bottom: 1px solid #2F2F2F; /* black*/
  zborder-bottom: 0px;
  float: left;
  width: 135px;   /*width second level submenu-all */
}
/*assign different width for second level menu */

ul#navk li#ts20 .sub_level li a  /*overwrite width for second submenu tab   */
{
  width: 195px;   /*width second level submenu */
}
ul#navk li#ts40 .sub_level li a  /*overwrite width for third submenu tab   */
{
  width: 160px;   /*width second level submenu */
}
ul#navk li#ts50 .sub_level li a  /*overwrite width for fourth submenu tab   */
{
  width: 160px;   /*width second level submenu */
}

/*** Second,  Third and thereafter. submenu levels color and hover:  ***/

/*ul#navk .sub-level li a:hover, /!* no any effect ?? *!/*/
ul#navk .sub_level li a#arrow:hover
{
  border-left: 3px solid #5E5E5E;
  background:	#5E5E5E url('../img/active_arw.png') no-repeat -2px 4px;
}

/********Last few styles are for creative preference and bug squashing really:******/

/*RESET STYLES*  removes flickering* !!!!*/
li:hover .sub_level .sub_level
{
  display: none;
}

.sub_level li:hover .sub_level
{
  display: inline;   /**IE6 hack to get sub menu links to behave correctly**/
  position: absolute;
  left: 0px;
  top: 0px; /*IE6 sub-submenu position */
}
/**************************************************************************************/

/* html #menu_bar ul li a{ /*IE6 hack to get sub menu links to behave correctly*
display: inline-block;
}
/* Holly Hack for IE \*
* html #menu_bar {height: 1%;} /*Holly Hack for IE7 and below*/
/* ######### CSS classes applied to down and right arrow images  ######### */

/***********************************************************************************
 *  begin SERG: drop-down menu handler to close-up on mouseClick IE6,8 tested OK   *
 ***********************************************************************************/
/*#navk li div ul,*/
#navk li .ddh_h
{
  xxposition: relative;
  display: none;
}
#navk .ddh
{
  position: relative;
  display: block;
  margin: 0 auto;
  /*zfilter: inherit;   /* for IE8 jQuery.Fadeout: not works, even worse: it break IE6*/
  /*zopacity: inherit;  /* for IE8 jQuery.Fadeout: not works, even worse: it break IE6*/
}
/*** enf SERG: drop-down menu handler to close-up on mouseClick *******/

/*****************************************************************************
 *        begin SERG: replacement for behavior:url(css/cssHoverFix.htc)      *
 *****************************************************************************/
#navk ul
{
  position: absolute; /* a must for IE6 */
  display: none;
}

#navk li:hover div ul,    /* need with ddh */
#navk li.on_trk div ul,   /* need with ddh */
#navk li.off_trk div ul,  /* need with ddh */

#navk li:hover ul,
#navk li.on_trk ul,
#navk li.off_trk ul
{
  display: none;
}

#navk li:hover div ul,   /* need with ddh */
#navk li.on_trk div ul,  /* need with ddh */
#navk li.off_trk div ul, /* need with ddh */

#navk li:hover ul,
#navk li.on_trk ul,
#navk li.off_trk ul,
{
  display: block;
}
/*** end SERG: replacement for behavior:url(css/cssHoverFix.htc) *******/


/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
/****************** *popup login /register window buttons ???? ***********************/

ul#nav_tb
{
    position: relative;
    height: 20px; /* need for IE6 in FF ok*/
    margin-left: auto;
    margin-right: auto;
    padding: 1px 10px 1px 10px; /* top-right-bottom-left */
    list-style: none; /* disable bullets */
}

ul#nav_tb a
{
    cursor:pointer;
    text-decoration: none;
}

ul#nav_tb li
{
    float: left;
    display: inline;
    padding-left: 14px;
    padding-right: 10px;
    padding-top: 1px;
    padding-bottom: 1px;
}

ul#nav_tb li a
{
    background: url(../img/mnu_22.png); /* height 22px, width 78px */
    width: 78px;
    /*padding-top: 5px;	   adjust: text padding from top*/
    /*             */
    padding-top: 4px;   /*correlatad with line 2503 heigh 22px */
    text-align: center;
}

ul#nav_tb li span
{
    color: white; /* (font color) do the image replacement*/
}

ul#nav_tb li#fml_ts1 a,
ul#nav_tb li#fml_ts2 a
{
    position: relative;
    display: block;	/* serg: must be "block"  */
    /* height: 17px;   /* adjust: if more, the extra height will be added (17 = 22-5) */
    height: 22px;    /*login btn corrupted if 17 px using sprite lena*/
    color: #666600; /* brown-like*/
}

ul#nav_tb li#fml_ts1.off a,
ul#nav_tb li#fml_ts2.off a
{
    background-position: 0px -44px;
    color: silver;
}

ul#nav_tb li#fml_ts1.on a:hover,
ul#nav_tb li#fml_ts1.on:hover a,
ul#nav_tb li#fml_ts1.on_trk a,
ul#nav_tb li#fml_ts2.on a:hover,
ul#nav_tb li#fml_ts2.on:hover a,
ul#nav_tb li#fml_ts2.on_trk a
{
    background-position: 0px -22px;
    color: #4d4d00;  /* brown-like*/
}

ul#nav_tb li#fml_ts1.off a:hover,
ul#nav_tb li#fml_ts1.off:hover a,
ul#nav_tb li#fml_ts1.off_trk a,
ul#nav_tb li#fml_ts2.off a:hover,
ul#nav_tb li#fml_ts2.off:hover a,
ul#nav_tb li#fml_ts2.off_trk a
{
    background-position: 0px 0px;
    color: gray;
}






/*******************************************************************
 *      --- Popup Contact Form by html-form-guide.com ---          *
 * Customize all the aspects of the form in this style sheet       *
 * All the style elements use form id selector "#contactus".       *
 * So, including this stylesheet should not affect any other       *
 * elements od website at all       SERG!!!                        *
 *******************************************************************/
#fm_log
{
  display: none;
  overflow: hidden; /* ensure the childs to be painted only inside the boundaries*/
  z-index: 9000;
  width: 460px;
  position: absolute;
  margin-right: auto;
  border: 1px solid black;
  background:  #EFEFDF;           /*NOTE: cap_container2.background should be same for IE6*/
  font-family: Arial, sans-serif;
  font-size: 10pt;
}

#cap_container2
{
  border: none;              /* part 1 for IE6, otherwise will show "1px top line" */
  background:  #EFEFDF;      /* part 2 for IE6, otherwise will show "1px top line" */
}

#fm_log a, :focus
{
  outline: none;
}

#bzmask
{
  z-index: 9010;
  position: absolute;
  left: 0;
  top: 24px;
  background-color: #000;
  display: none;
}

#fm_log #fmdw_title span
{
  font: bold 11px arial, helvetica, clean, sans-serif;
  color: black;
  cursor: default;
}

#btn_pane
{
  background-color:#f8f2d3;
  padding-bottom: 3px;  /*  */
}

#txt_wait /* showing "Wait.." */
{
  position: absolute;
  right: 24px;
  vertical-align:middle;
  margin:5px;
  visibility: hidden;
  font-family: Arial, sans-serif;
  font-size: 10pt;
  font-weight: bold;
}

#spinholder
{
  visibility: hidden;
  position: absolute;
  top: 33px;
  right: 10px;
}
/*
.container
{
  margin: 2px;
  padding: 6px 11px 6px 11px;
  border:1px solid #ccc;
}
*/
#contactus .container1, .container9, .container8
{
  /* will override "container1" properties*/
  margin: 8px;
  padding: 1px 6px 3px 6px; /* top-right-bottom-left */
  font-family : Arial, Verdana, sans-serif;
  font-size: 0.95em;
}

#log_inputs
{
  padding-top: 6px;
}

#contactus .cap_container
{
  margin: 6px 1px 1px 1px; /* top-right-bottom-left */
  padding: 6px 4px 6px 4px; /* top-right-bottom-left */
  border:1px solid #999966;  /*and correct line 945 */
}

.container1 label
{
  float: left;
  display: block;
  width: 10em;
  margin-left: 1px; /* set edit-box position */
  padding: 3px 6px 0px 0px; /* top-right-bottom-left */
  font-family : Arial, Verdana, sans-serif;
  font-size: 0.95em;
  text-align: right;
  color: #000;
}

.container1 .flat_input
{
  padding : 2px;
  width:220px;
  font-family : Verdana, Arial, sans-serif;
  font-size: 0.95em;
}

.container8 label
{
  float: left;
  display: block;
  width: 20em;
  margin-left: 1px; /* set edit-box position */
  padding: 3px 3px; /* top-right-bottom-left */
  font: normal  11px/1.0em Verdana, sans-serif;
  color: #555;
}

.container8 .flat_input
{
  padding : 2px;
  width: 120px;
  font-family: Arial, sans-serif;
  font-size: 12px;
}

.container8 img
{
  float: left;
  margin: 0px 20px 0px 10px;
}

.container9 label
{
  /****************************************************************************
    http://www.impressivewebs.com/ie6-ghost-text-bug-with-multiple-solutions/
    -------------------------------------
    What is the IE6 Ghost Text Bug?
    -------------------------------------
    Due to a bizarre rendering error in IE6, a well-organized,
    W3C-compliant web page that contains clean, semantic markup,
    and that looks perfectly fine in all other browsers
    (IE7, Firefox, Opera, Safari, etc.), will sometimes display
    duplicate text in a DIV that is floated and is followed by an
    HTML comment. The consensus is that the bug occurs when multiple
    comments are placed between a series of floated DIV tags,
    with the actual bug taking place inside the final floated DIV.

  float: left;
  zzzfloat: left;
  zdisplay: block;

  *****************************************************************************/
  width: 20em;
  margin-left: 1px; /* set edit-box position */
  padding: 0px 6px; /* top-right-bottom-left */
  font: normal  11px/1.0em Verdana, sans-serif;
}

.container9 .flat_input
{
  padding : 2px;
  width: 97%;
  font-family: Arial, sans-serif;
  font-size: 12px;
}


#contactus #log_hint
{
  font-family : Verdana, Arial, sans-serif;
  font-size: 0.95em;
  width: 8em;
  border: 1px solid #8a8a5c;
  border-radius: 5px;
}

#contactus .flat_input[disabled="disabled"]  /* for FF (IE6 looks ok) */
{
  color: silver;
  background-color: transparent;
}

#contactus .smalltxt
{
  padding-top: 3px;
  font: bold 0.8em arial, helvetica, clean, sans-serif;
  text-align: center;
}

#cap_imgdiv
{
  float: left;
  margin-left: 4px;
}

#cap_input
{
  float: right;
  padding: 2px 8px 2px 6px;
}

#cap_input label
{
  font: bold 0.8em arial, helvetica, clean, sans-serif;
  color: black;
  width: 4em;
}

#contactus #cap_img
{
  width: 140px;
  height: 34px;
  border: 1px solid #8a8a5c;
  border-radius: 5px;
}

#fm_log_main .error
{
  margin: 1px 1px 1px 1px; /* top-right-bottom-left */
  padding: 0px 2px 0px 2px; /* top-right-bottom-left */
  background-color : #ffff00;
  font-family: Verdana, Arial, sans-serif;
  font-size: 0.8em;
  color: #900;
  border:1px  #4d4d33;   /*DBA901; */
}

#fm_log_main .error ul
{
  margin: 10px 30px;
}

#contactus #aa
{
  margin-left: 3px;
  color: #446600;
}

#contactus textarea
{
  height:100px;
  width:310px;
}

#contactus11 .error
{
  margin-left: 4px;
  margin-right: 4px;
  background-color : #ffff00;
  font-family: Verdana, Arial, sans-serif;
  font-size: 0.8em;
  color: #900;
  border:1px solid #DBA901;
}

#fm_log_main h2
{
  font-family: Arial, sans-serif;
  font-size: 14pt;
  color:#333;
}

#fm_log_reginfo p
{
  border:1px solid #DBA901;
  margin: 8px 14px 0px 14px;
  padding: 6px 8px;
  font: 8pt/12pt Veranda, Arial, clean, sans-serif;
  text-align: justify;
  color: black;
  line-height: 14px;
}

#fm_log_reginfo p .note1
{
  font-weight: bold;
}

#fm_log_reginfo p .note2
{
  color: gray;
  font-weight: bold;
  text-decoration: underline;
}

/* spam_trap: This input is hidden. This is here to trick the spam bots*/
#contactus .spmhidip
{
  display:none;
  width:10px;
  height:3px;
}

div#tool_bar    /*login window */
{
  position: relative;
  height: 25px;  /* "mnu_mp.png".sprites.height=24 */
  font-family:  Arial, Helvetica, sans-serif;
  font-size: 11px;
}



/*#############################################################
  # Name: MarketFryer  fm_privacy.css (properties)            #
  # Date: 2012-07-01                                          #
  # Description:                                              #
  # Author: Yelena Gavrilkina                                 #
  # URL: http://marketfryer.com                               #
  #############################################################*/

/************ Purchase Info Page  Legal Privacy  ****************/

.clear:after {
  CONTENT: "."; display: block; height: 0; clear: both; visibility: hidden;
}

.main_info {
   margin-left: 50px;
   margin-right: 50px;
   margin-bottom: 20px;
   border: none;
}

.main_info h1
{
  margin: 0px 40px 20px 60px !important;   /*IE6 */
  margin: 0px 40px 0px 60px;
  font-size: 20px;    /*don't change */
  color: #8c8c8c;    /*title color */
	/*text-shadow: 1px 1px 1px rgba(0,0,0,.75); */
	/* title shadow don't remove */
}

.main_info p {
  color: black;  /* for answers */
  font: 12px tahoma, arial, sans-serif;
 line-height: 125%;
}


/*details link in table Right */
/*span.img_link_R
{
  cursor: pointer;
  float: right;
  padding-right: 100px;
}*/
/**************************************************
       Privacy Policy list-design  separate page   *
**************************** **********************/
div.privacy
{
 position: relative;  /* IE6 Disappearing Border fix */
 margin: 0 40px 15px 48px;
 color: black; /*#FEFEF2;*/
 font: 12px tahoma, arial, sans-serif;
}
div.privacy h4
{
  font: normal bold 12px Verdana, sans-serif; /*as in p.css */
}
div.privacy ul
{
  padding-left: 2px ; /*important for cross browsers */
  list-style-type: none;   /*used bulets in HTML */
}
div.privacy li {
 padding-left: 5px;  /*between bullets and list */
}
@media only screen and (max-width: 600px) {
    div.privacy   {
        /*width: 100%;*/
        /*padding: 6px 6px 10px ;*/
        /*text-align: center;*/
        margin:  5px ;
        font-size: 12px;
        /*font-weight: 600;*/
    }

}
/*******************************************
      Info simple text
**************************** *************/

p#info  /* text on the top*/
{
  font: 12px/1.45 Verdana, sans-serif;
  padding: 2px 65px 10px 60px !important;
  padding: 2px 65px 0px 60px;
}

/*#############################################################
  # Name: MarketFryer print_pages.css (properties)            #
  # Date: 2012-07-01                                          #
  # Description:                                              #
  # Author: Yelena Gavrilkina                                 #
  # URL: http://marketfryer.com                               #
  #############################################################*/

#prn_center
{
  padding: 10px 0px;
  margin: 10px auto;
  width:580px;
}

#prn_center h1,
#prn_center h2,
#prn_center h3
{
  color: black;
  text-align: center;
  font-family: Arial, sans-serif;
  font-weight: bold;
  font-style: normal;
}

#prn_center h1{ font-size: 12pt;}
#prn_center h2{ font-size: 10pt;}
#prn_center h3{ font-size: 8pt;}
#prn_center h4{ font-size: 8pt/12pt;}
#prn_center p{ font: 10pt Arial,  sans-serif; text-align: center; color: black; line-height: 20px;}
#prn_center hr{ margin: 0px; color: silver; background-color: gray;}

.msg_center
{
  padding: 10px 20px;
  background-color: white;
  text-align: center;
  line-height: 20px;
  color: black;
  font: 11px tahoma, arial, sans-serif;
  cursor: default;
}

div.prn_info1
{
  position: relative;  /* IE6 Disappearing Border fix */
  margin: 6px;
  padding: 6px;
  border-top: 1px solid #DCDCDC;
  border-bottom: 1px solid #DCDCDC;
  background-color: #EFEFDF;
  color: black; /*#FEFEF2;*/
  font: 11px tahoma, arial, sans-serif;
  text-align: center;
}

div.prn_info1 h4
{
  padding: 0px 6px 0px 10px;
}
div.prn_info1 .zul_compact
{
  margin: 2px;	/*important for cross browsers */
  padding: 0px 0px 0px 22px; /*important for cross browsers */
  text-align: left;
}




/*******************************************************
*           Legal Info  table                          *
*******************************************************/
.legal_table
{
    margin-bottom: 5px;
    margin-left:0px;
    width:50%;
    cursor: default;
    color: #000000;
}
.legal_table th
{
    font: 12px/1.220 arial,helvetica,clean,sans-serif;
    font-weight: bold;
    text-align: left;
}
.legal_table td
{
    font: 11px/1.1 arial,helvetica,clean,sans-serif;
    vertical-align: top;
}
.legal_table td.Left
{
    width: 100%;
    background-color: #DFE7F2;
}
.legal_table td.Middle
{
    width: 25%;
    border-left: 1px solid #D6DDE6;
    border-right: 1px solid #D6DDE6;
    border-top-width: 0px;
    border-bottom-width: 0px;
}
.legal_table td.Right
{
    width: 25%;
}
.legal_table td, .legal_table th
{
    padding: 2px 10px 2px 10px;   /* 'cellpadding' equivalent */
}

/****** Shadow text  *************/
div.desc_text
{
    text-align: center;
    font-weight: bold;
    width: 640px;
    padding-top: 1px;
    font-size: 18px;
    color: #F0FFF0;  /* HoneyDew */
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.75);
}
div.desc_text h1
{
    font: italic bold 1.3em Georgia, serif, sans-serif;
}
div.desc_text h2
{
    font: italic bold 0.9em Georgia, serif, sans-serif;
}



 /**************   Contact Us Form  *******************/
/******************************************************/
 /*using same as modal positioning different*/
/*using close_modal see in modal for closing form*/
.form {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
 /*.position {
     position: relative; /!* Stay in place *!/
 }*/
/*.form-header1 {
    position: relative;
    padding: 6px 2px 1px 2px;
    background-color: #b3b3b3;
    color: white;
}*/
/*.form_container {
    border-radius: 5px;
    padding: 10px;
    margin-right: auto;
    margin-left: auto;
    zwidth: 50%;
    zbackground-color: #cccccc; /!*#f2f2f2; *!/
}*/

/* Modal Content/Box */
.form-content {
    /*xposition: relative;*/
    border-radius: 5px;
    background-color: #cccccc;;
    margin: auto;
    padding: 20px;
    zmargin: 15% auto 15% auto; /* 5% from the top, 15% from the bottom and centered */
    /*margin: 25%;*/

    border: 1px solid #888;
    width: 50%; /* was 50% Could be more or less, depending on screen size */
    /*zopacity: 1.0;*/
    /*text-shadow: 0 1px 0 #fff;*/
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    -webkit-animation-name: animatetop2;
    -webkit-animation-duration: 0.4s;
    /*-webkit-transform: scale(1.2) rotate(10deg);*/
    animation-name: animatetop2;
    animation-duration: 0.4s;
    font-size: 12px;
     zcolor:white;
}
/* Add Animation */
@-webkit-keyframes animatetop2 {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}

@keyframes animatetop2 {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}
/* Add a background color and some padding around the form */




/* Style inputs with type="text", select elements and textareas */
/** {box-sizing: border-box;}  have above */
/*input[type=text], select, textarea*/
input, select, textarea {
    width: 100%; /* Full width */
    padding: 8px; /* Some padding */
    border: 1px solid #ccc; /* Gray border */
    border-radius: 4px; /* Rounded borders */
    box-sizing: border-box; /* Make sure that padding and width stays in place */
    margin-top: 5px; /* Add a top margin */
    margin-bottom: 8px; /* Bottom margin */
    resize: vertical; /* Allow the user to vertically resize the textarea (not horizontally) */
    font-size: 12px;
}
.overlay {
    zposition: relative;
    margin: 40px auto 10px;  /*for relative*/
    padding:20px;
    width: 80%;
    max-width: 800px;
    background: #ececec;
    color: #141414;
    border-width: 1px;
    border-style: solid;
    border-top-color: #dfdfdf;
    border-right-color: #d8d8d8;
    border-bottom-color: #cbcbcb;
    border-left-color: #d8d8d8;
    border-radius: 4px;
    box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.5);
    outline: none;
    zfloat:left;
}
label {
    font-size: 11px;
    font-weight: bold;

}
/*required to fill  field asterisk*/
.required:after {
    content:" *";
    color: red;
    font-weight: bold;
}
/*for responsive*/
div #myCaptcha {
    /*safari, chrome browsers */
    -webkit-transform:scale(0.77);
    -webkit-transform-origin:0 0;
    /*firefox browser */
    -moz-transform:scale(0.77);
    -moz-transform-origin:0;
    /*opera */
    -o-transform:scale(0.77);
    -o-transform-origin:0;

    /*internet explorer*/
    -ms-transform:scale(0.77);
    -ms-transform-origin:0% 0%;
    filter: progid:DXImageTransform.Microsoft.Matrix(M11=1.1,M12=0,M21=0,M22=1.1,SizingMethod='auto expand');
    /*general */
    ztransform:scale(0.77);
    ztransform-origin:0 0;
}

/***********Responsive for contact form  *****************/
/*@media only screen and (max-width : 480px) {
    div #myCaptcha{
        -ms-transform:scale(0.55);
        -ms-transform-origin:50% 50%;
        width:auto !important;
        zheight:150px;
    }
}*/

@media only screen and (max-width : 540px) {
    div #send{
        /*internet explorer*/
        -ms-transform:scale(0.90);
        -ms-transform-origin:0% 0%;
        /*safari, chrome browsers */
        -webkit-transform:scale(0.90);
        -webkit-transform-origin:0 0;
        /*firefox browser */
        -moz-transform:scale(0.92);
        -moz-transform-origin:0;
    }
}

/* Chrome only: */
@media (max-width: 500px) and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) {
    div.form-content  {
        /*margin: 15px 0;*/
        width: 100%;
    }
}
/* IE 10 and above: */
@media (max-width: 500px) and (-ms-high-contrast: none),  (-ms-high-contrast: active) {
    div.form-content  {
       transform:translateY(20px);
        width: 100%;
    }
}
@media (max-width: 320px) {
    div.form-content  {
        margin: 15px 0;
        font-size: 8px;
        width: 100%;
        /*-ms-transform:scale(0.70);*/
        /*-ms-transform:translateY(50px);*/
        /*ztransform: scaleY(0.90) scaleX(0.90);*/
    }
    div label, input, select {
        font-size: 11px;

    }
    /*internet explorer*/
    div #myCaptcha {
        -ms-transform: scale(0.7);
    }
}



/***********      FAQS     *****************/
/*******************************************/
/* Style the tab */

/*@media only screen and (max-width : 540px) {
  div.tab{
        /!*internet explorer*!/
        -ms-transform:scale(0.90);
        -ms-transform-origin:0% 0%;
        /!*safari, chrome browsers *!/
        -webkit-transform:scale(0.90);
        -webkit-transform-origin:0 0;
        /!*firefox browser *!/
        -moz-transform:scale(0.3);
        -moz-transform-origin:0;
    }
}*/

/*@media screen and (max-width: 600px) {

    ul.tab li a
     {
        /!*width: 128px;*!/
        zposition: relative;
        font-size: 12px;
        width:100%;
    }
}*/
/* Style the tabs for FAQS using JS */

.topnav {
    overflow: hidden;
    background-color: #ccc;
    padding: 20px 10px 0 10px;
    text-align: center;
}

.topnav a {
    float: left;
    display: block;
    color: #737373;
    text-align: center;
    padding: 10px 16px;
    text-decoration: none;
    font-size: 14px;

    transition: 0.3s;
    font-weight: 600;

}

.topnav a:hover {
    background-color: #bfbfbf;
    color: black;
}

.topnav a.active {
    background-color: #f2f2f2;
    color: #527a7a;  /*orangered*/
}

.topnav .icon {
    display: none;
}

@media screen and (max-width: 640px) {
    .topnav a:not(:first-child) {display: none;}
    .topnav a.icon {
        float: right;
        display: block;
    }
}

@media screen and (max-width: 640px) {
    .topnav.responsive {position: relative;}
    .topnav.responsive .icon {
        position: absolute;
        right: 10px;
        top: 20px;
    }
    .topnav.responsive a {
        float: none;
        display: block;
        text-align: left;
    }
}



/* Style the tab content to show using JS*/
/*****************************************/

.faqs_tabcontent {
    display: none;
    padding: 50px;
    text-align: center;
    margin-top:10px;
    /*zpadding: 6px 12px;*/
    -webkit-animation: fadeEffect 1s;
    animation: fadeEffect 1s;

    padding: 50px;
    /*text-align: center;*/
}

/* add this to the CSS */
.faqs_tabcontent.active {
    display: block;
}


/* Style the close button  commented in HTML for now*/
.topright {
    float: right;
    cursor: pointer;
    font-size: 28px;
    /*margin-bottom: 5px;*/
}

.topright:hover {color: red;}

/* important to show first link  */
div[class*="faqs_tabcontent"]:first-of-type {
    display: block;
}
@-webkit-keyframes fadeEffect {
    from {opacity: 0;}
    to {opacity: 1;}
}

@keyframes fadeEffect {
    from {opacity: 0;}
    to {opacity: 1;}
}

/*#############################################################
  #FAQS content                                               #
                                                              #

  #############################################################*/


/*<h1>Pure CSS Accordion Menu</h1>*/

/*This is for folding FAQS items */
.accordionMenu {
    width: 700px;
    /*zmargin:0 auto;*/
    margin-left:auto;
    margin-right:auto;

}


.accordionMenu input[type=radio] {
    display: none;
}
.accordionMenu label {
    display: block;
    height: 50px;
    line-height: 47px;
    padding: 0 25px 0 10px;
    background:#85adad; /* #2C97DE;  */
    font-size: 14px;
    color: #FFF;
    position: relative;
    cursor: pointer;
    border-bottom: 1px solid #e6e6e6;;
}
.accordionMenu label:after {
    display: block;
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 5px 10px;
    border-color: transparent transparent transparent #ffffff;
    position: absolute;
    right: 10px;
    top: 20px;
    z-index: 10;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.accordionMenu .faqs_content {
    max-height: 0;
    height: 0;
    overflow: hidden;
    -webkit-transition: all 2s ease-in-out;
    -moz-transition: all 2s ease-in-out;
    -ms-transition: all 2s ease-in-out;
    -o-transition: all 2s ease-in-out;
    transition: all 2s ease-in-out;

}
.accordionMenu .faqs_content .inner {
    font-size: 1.0rem;
    color: #527a7a;
    line-height: 1.5;
    background: white;
    padding: 20px 10px;
}

.accordionMenu input[type=radio]:checked + label:after {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
}

.accordionMenu input[type=radio]:checked + label + .faqs_content {
    max-height: 2000px;
    height: auto;

}

@media screen and (max-width: 780px) {
    .accordionMenu {
        width: 550px; /**/
        text-align: center;
    }
}
@media screen and (max-width: 640px) {
    .accordionMenu {
        width: 450px; /**/
        text-align: center;
    }
}
@media screen and (max-width: 520px) {
    .accordionMenu {
        width: 340px; /**/
        text-align: center;
        /*overflow-x: auto;*/
    }
}






/***********      Quotes shopping cart     *****************/
/******************************************************************/

.product-container{ display: inline-block; margin: 10px; text-align: center; border: 1px solid #e4e4e4; padding: 10px; background-color: #f4f4f4; width: 250px; }

.product-image { width: 150px;  height: 150px; display: inline-block; border: 1px solid #E4E4E4; border-radius: 5px; }
.product-image img { width: 100%; }

.removeProduct { color: #333; }

.shopping-basket { background-color: #333; color: #FFF; padding: 10px;}

#shoppingCartTotal { float: right; margin-right: 5px;}
#shoppingCart:link, #shoppingCart:visited { color: #FFF; }
#shoppingCart:hover { color: #FF0; }

#shoppingCartDetailsMessage {background-color: #f4f4f4; padding: 15px; border: 1px solid #CCC; border-radius: 0  0 5px 5px;}
table { width: 100%; }
th { text-align: left; font-size: 20px; }



/***********      Quotes shopping cart       *****************/
/***********                                  *****************/
/***********      Quotes shopping cart        *****************/






















/*#############################################################
  # Name: MarketFryer faq_new.css (properties)            #
  # Date: 2021-03-21                                         #
  # Description:                                              #
  # Author: Yelena Gavrilkina                                 #
  # URL: http://marketfryer.com                               #
  #############################################################*/
/* Style the tab */



/* Fade in tabs */
/*
@-webkit-keyframes fadeEffect {
    from {opacity: 0;}
    to {opacity: 1;}
}
*/

/*@keyframes fadeEffect {
    from {opacity: 0;}
    to {opacity: 1;}
}*/




/*****************************************************/
/*****         Sample for responsive           *******/
/*****************************************************/
/*Resize the browser window. When the width of this document
 is 600 pixels or less,*/

/*for all pages print in black not working specify page*/
/*
@media print {
    body {
        color: black;
    }
*/

/* for IE */
/*body {
    background-color: tan;
}

@media screen and (min-width:600px) and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    body {
        background-color: blue;
    }
}

@media screen and (min-width:768px) and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    body {
        background-color: olive;
    }
}

@media screen and (min-width:998px) and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    body {
        background-color: aqua;
    }
}*/
/*/!* IE9 *!/
@media all and (monochrome:0) {
    body {
        background: blue\9 !important;
    }
}*/
/*@media screen {
    * {
        background: silver
    }
}*/
/*/!* IE9 *!/
@media all and (monochrome:0) {
    body {
        background: blue\9 !important;
    }
}*/