﻿div.divOnlineBaskets{border-top:1px solid #817f80;color:#817f80;padding:1% 0;}
div.divOnlineBaskets a{vertical-align:middle;font-size:1.1em;margin-right:.5%;color:#817f80;}
div.divOnlineBaskets a:hover{color:#91278c;}
div.divOnlineBaskets a.Selected{vertical-align:middle;font-size:1.1em;margin-right:.5%;color:#cc9c0e;}
.FaqOnline{width:50%;margin:0 auto;border:1px solid #333;display:table;}

div.divOnlineOrder{width:23%;float:right;margin:1%;position:relative}
div.divOnlineOrder img{width:100%;border-radius:4px;display:block;border:5px solid #000;margin-bottom:5%;}
div.divOnlineOrder a{text-align:center !important;color:#807e7f;display:block;}

div.divOnlineOrderimg{position:relative}

div.divOnlinedetail{}
div.divOnlinedetail p.TitleOnlinedetail{color:#817f80;line-height:3em}
div.divOnlinedetail div.Inputdetail textarea{width:98%;border:2px solid #817f80;padding:1%;margin-bottom:3%}
div.divOnlinedetail div.Inputdetail input{width:98%;border:2px solid #817f80;padding:1%;margin-bottom:3%}
div.divOnlinedetail div.Inputdetail2{width:33.333%;float:right;}
div.divOnlinedetail div.Inputdetail2 input{width:70%;border:2px solid #817f80;margin:0 2%;padding:1%;margin-bottom:3%;}
div.divBackbtn {
    position: fixed;
    bottom: 5%;
    left: 3%;
    padding: 0 .8%;
    font-size: 1.1em;
    border-radius: 17px;
    background: #f77575;
    z-index: 100000000;
}
div.divNextbtn {
    position: fixed;
    bottom: 5%;
    right: 3%;
    padding: 0 .8%;
    font-size: 1.1em;
    border-radius: 17px;
    background: #f77575;
    color: #fff;
    z-index: 100000000;
}
/**/
/*File Upload*/
div#divAll div.divContentOnline{width:90%;margin:0 auto;position:relative}
.box p{background:#e6d27e;color:#fff;line-height:2em}
.box {
    border-radius:7px;
  position:relative;
  display: block;
  width:18%;float:right;
  height: 300px;
  margin:1%;text-align:center;
  background-color: white;
  box-shadow:0px 0px 0px 2px rgb(217 217 217);
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  overflow: hidden;
background: url('/images/flu.png');
background-repeat: no-repeat;
background-position: center center;
}
.box2{
    background: url('/images/plus.png') !important;
}
.box3{
    position: relative;
    display: block;
    width: 18%;
    float: right;
    height: 300px;
    margin: 1%;
    background-color: white;
    border-radius: 50%;
    box-shadow: 0px 0px 0px 2px rgba(95,95,95,1);
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    overflow: hidden;
    background: url('/images/file.png');
    background-repeat: no-repeat;
    background-position: center center;
}
.box4 {
    position: relative;
    display: block;
    width:100px;
    height:32px;
    float: right;
    background-color: white;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    overflow: hidden;
    background: url('/images/upfile.jpg');
    background-repeat: no-repeat;
    background-position: center center;
}
.upload-options {
  position:absolute;
  top:0;
  height:100%;
  width:100%;
  cursor: pointer;
  overflow: hidden;
  text-align: center;
  transition: background-color ease-in-out 150ms;
}
.upload-options:hover {
  background-color:"";
}
.upload-options input {
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  z-index: -1;
}
.upload-options label {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  font-weight: 400;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
  overflow: hidden;
}
.upload-options label::after {
  font-family: "Material Icons";
  position: absolute;
  font-size: 2.5rem;
  color: #e6e6e6;
  top: calc(50% - 2.5rem);
  left: calc(50% - 1.25rem);
  z-index: 0;
}
.upload-options label span {
  display: inline-block;
  width: 50%;
  height: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  vertical-align: middle;
  text-align: center;
}
.upload-options label span:hover i.material-icons {
  color: lightgray;
}

.js--image-preview {
  height:100%;
  width: 100%;
  position: relative;
  overflow: hidden;
  background-image: url("");
    background-size: cover;
}
.js--image-preview::after {
  /*content: "photo_size_select_actual";*/
  font-family: "Material Icons";
  position: relative;
  font-size: 4.5em;
  color: #e6e6e6;
  top: calc(50% - 3rem);
  left: calc(50% - 2.25rem);
  z-index: 0;
}
.js--image-preview.js--no-default::after {
  display: none;
}
.js--image-preview:nth-child(2) {
  background-image: url("");
}

i.material-icons {
  transition: color 100ms ease-in-out;
  font-size: 2.25em;
  line-height: 55px;
  color: white;
  display: block;
}

.drop {
  display: block;
  position: absolute;
  background: rgba(95, 158, 160, 0.2);
  border-radius: 100%;
  transform: scale(0);
}

.animate {
  -webkit-animation: ripple 0.4s linear;
          animation: ripple 0.4s linear;
}

@-webkit-keyframes ripple {
  100% {
    opacity: 0;
    transform: scale(2.5);
  }
}

@keyframes ripple {
  100% {
    opacity: 0;
    transform: scale(2.5);
  }
}

/*Reviw Order*/

table.Orw {border-collapse: collapse;width:85%;margin:0 auto;border:10px solid #000}
    table.Orw th, table td {width:25%}
    table.Orw tr {
        border-bottom: 1px solid #dcdcdc;
    }


table.Orw tr th {
    background-color: #000;
    color:#fff;
    width: 50%;
vertical-align:middle;
}

    table.Orw tr td {
        width: 50%;padding:3%;
    }

    table.Orw tr:first-child td {
        background-color: #fff;
    }


/*drop Down*/
.btn {
	height: 50px;
	width: 150px;
	background: blueviolet;
	color: white;
	border: none;
	outline: none;
}

.dropdown-menu {
	display: none;
	flex-flow: column;
	background: #f2f2f2;
	height: 150px;
}

.dropdown-item {
	display: grid;
	place-items: center;
	color: #333;
	flex: 1;
}

.dropdown-item:hover {
	cursor: pointer;
	background: blueviolet;
	color: white;
}

.btn:hover {
	cursor: pointer;
	filter: brightness(120%);
}

.active {
    color: #cc9c0e; /*display: flex;*/
}

.dropdown-menu:hover {
	display: flex;
}

div.divonlinereview div.divoreviewIn{float:right;width:50%}
div.divonlinereview h1{color:#807e7f;line-height:3em}
div.divonlinereview h2{color:#807e7f;line-height:3em}
div.divonlinereview div.divoreviewIn input{width:50%;border:2px solid #817f80;padding:1%;}
div.divonlinereview div.divoreviewIn p{color:#817f80;line-height:2em;}
div.divonlinereviewIn{width:85%;margin:0 auto;}
/*TextBox*/
.inputWithIcon input[type="text"] {width: 100%;border: 1px solid #bbbaba;border-radius: 4px;margin-bottom:3%;outline: none;padding: 8px;box-sizing: border-box;transition: 0.3s;font-family:IranSansLight;font-size:1rem;line-height: 1.60;}
.inputWithIcon input[type="text"]:focus {border-color: dodgerBlue;}
.inputWithIcon input[type="text"] {padding-left: 60px;font-family:IRANSans;}
.inputWithIcon {position: relative;width:50%;margin:0 auto;}
.inputWithIcon i {position: absolute;left:0;top:0px;padding: 9px 20px;color: #aaa;transition: 0.3s;border-right:1px solid #bbbaba;font-size: 1.143rem;line-height: 1.375;width:15px}
.inputWithIcon input[type="text"]:focus + i {color:dodgerBlue}
.inputWithIcon.inputIconBg i {background-color: #aaa;color: #fff;padding: 9px 4px;border-radius: 4px 0 0 4px;}
.inputWithIcon.inputIconBg input[type="text"]:focus + i {color:#fff;background-color: dodgerBlue;}
.inputWithIcon2{width:100%}
