:root {
     /*---gray colors----*/
  --b100: #000; 
  --b90: #111;
  --b80: #222;
  --b70: #333;
   --b60: #444;
   --b50: #555;
     --b40: #666;
        --b30: #777;
   --b20: #888;
  --w100: #fff; 
   --w95: #f3f3f3; 
  --w90: #eee;
  --w80: #ddd;
  --w70: #ccc;
   --w60: #bbb;
   --w50: #aaa;
     --w40: #999;
    /*---main colors----*/
  --c1:#CDA349;/*-talaie-*/
  --c2:#e1dbc8; /*-kerem-*/
  --c3:#6cb16c;/*-green-*/
--c4:#f0efeb; /*-light gray-*/
--c5:#c04c4c; /*-red-*/
--c6:#34c300; /*-green sharp-*/
--c7:#118312; /*-success-*/
--c8:#d5c318; /*-warning-*/
--c9:#44a3c2; /*-blue-*/
}
html {
    scroll-behavior: smooth;
}
* {
}
body {
    font-family: iranyekan, sans-serif;
    font-weight: normal;
    margin: 0;
    direction: rtl;
    color: var(--b50);
    background-color: var(--w100);
}
body.oh{
    overflow:hidden;
}
a {
    color:var(--b100);
    cursor:pointer;
    outline:none !important;
}
a:hover,a:focus {
     color:var(--b100);
    text-decoration:none;
}
::selection {
    background: var(--b100);
    color: var(--w100);
    text-shadow: none;
}
::-webkit-selection{
background:var(--b100);
  color: var(--w100);
  text-shadow: none;
}
::-webkit-input-placeholder { /* Edge */
    color: #aaa;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #aaa;
}
::placeholder {
    color: #aaa;
}
::-webkit-scrollbar {
    background-color: transparent;
    width: 3px;
}
::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.15);
}
    ::-webkit-scrollbar-thumb:hover {
        background-color: rgba(0, 0, 0, 0.5);
    }
    ::-webkit-scrollbar-thumb:active {
        background-color: rgba(0, 0, 0, .7);
    }
/* Chrome, Safari, Edge, Opera */
input.noarrow::-webkit-outer-spin-button,
input.noarrow::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.row {
    margin: 0;
    padding: 0;
}
.m-container {
    margin:0 auto;
    width:100%;
    padding:0 246px;
}
.c-container {
    margin:0 auto;
    width:100%;
    padding:0 40px;
    max-width:1140px;
}
.f-container {
    margin:0 auto;
    width:100%;
    padding:0 40px;
}
.f2-container {
    margin:0 auto;
    width:100%;
    padding:0 105px;
}
.h-container {
    margin:0 auto;
    width:100%;
    padding:0 246px 0 40px;
}
.h-container.side {
    padding:0 40px 0 246px;
}
.m-container:before, 
.m-container:after,
.c-container:before, 
.c-container:after,
.f-container:before, 
.f-container:after,
.f2-container:before, 
.f2-container:after,
.h-container:before, 
.h-container:after,
.row:before, 
.row:after{
    content: " ";
    display: table;
    clear:both;
}
.main-inner-row.bar-added{
    margin-top:40px;
}
.inner-row{
    margin-top:136px;
}
@media (max-width: 2499px) {
    }
@media (max-width: 1479px) {
    .m-container,
    .f2-container,
    .h-container, 
    .h-container.side {
            padding: 0 40px;
        }
}
@media (max-width: 1199px) {
   .inner-row{
    margin-top:96px;
}
}
@media (max-width: 1199px) {
   .inner-row{
    margin-top:88px;
}
}
@media (max-width: 767px) {
    .m-container,
    .c-container,
    .f-container,
    .f2-container,
    .h-container,
    .h-container.side {
        padding: 0 15px;
    }
    .main-inner-row {
        margin-top: 52px;
    }
        .main-inner-row.bar-added {
            margin-top: 82px;
        }
    .inner-row {
        margin-top: 0;
    }
}
/*_____________Inner________________*/
.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px 15px;
    background-color:transparent;
    color: var(--b100);
    font-size: 15px;
    font-weight: 400;
    transition: all 0.3s;
    cursor: pointer;
    border:1px solid  var(--b100);
     border-radius:90px;
     white-space:nowrap;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
     white-space:nowrap;
}
.button:hover,
.button:focus{
    text-decoration:none;
     outline:0;
     color: var(--b100);
}
    .button.disabled {
        color: var(--w60);
        background-color: var(--b40);
        cursor: not-allowed;
        border-color: var(--b40);
        border-radius: 0px;
    }
.button.light {
    color: var(--w100);
border:1px solid  var(--w100);
}
.button.light:hover,
.button.light:focus{
     color: var(--w100);
}
.button.darkbg {
    color: var(--w100);
border:1px solid  var(--c1);
background-color:var(--c1);
}
.button.darkbg:hover,
.button.darkbg:focus{
     color: var(--w100);
}
.button.graybg {
    color: var(--w100);
border:1px solid  var(--w50);
background-color:var(--w50);
}
.button.graybg:hover,
.button.graybg:focus{
     color: var(--w100);
}
.button.lightbg {
    color: var(--b100);
border:1px solid  var(--w100);
background-color:var(--w100);
}
.button.lightbg:hover,
.button.lightbg:focus{
     color: var(--b100);
}
    .button .icon {
        margin: 0 5px 0 15px;
        font-size:24px;
            transition: all 0.3s;
    }
.button:hover .icon{
      margin: 0 20px 0 0;
}
.button.lg {
        padding: 8px 45px;
    font-size: 17px;
    font-weight: 400;
}

.button.sm {
        padding: 6px 15px;
    font-size: 13px;
}
.button.no-border {
    border-color:transparent
}
.line-btn {
    color: var(--b100);
    display: inline-flex;
    white-space:nowrap;
    align-items:center;
    transition: all .3s;
    cursor: pointer;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border-bottom:2px solid var(--b100);
    padding-bottom:2px;
    font-size:15px;
    font-weight:500;
}
.line-btn.sm {
    border-bottom:1px solid var(--b100);
    padding-bottom:0px;
    font-size:13px;
}
.line-btn .icon{
    font-size:20px;
    margin-left:5px;
}
.line-btn:hover {
    color: var(--b100);
     border-color:var(--b100);
}
.line-btn.light {
    color: var(--w100);
    border-bottom:2px solid var(--w100);
}
.line-btn.light:hover {
    color: var(--w100);
     border-color:var(--w100);
}
            .page-sections{
                display:flex;
                flex-direction:column;
            }
            .page-sections>*{
             min-width:100%;
            }
    .page-sections .first-sec{
               order:1;
            }
               .page-sections .second-sec{
               order:2;
            }
.page-sections .third-sec{
               order:3;
            }
.page-sections .forth-sec{
               order:4;
            }
.page-sections .fifth-sec{
               order:5;
            }
.page-sections .sixth-sec{
               order:6;
            }
.arrow-btn{
    display:inline-flex;
    align-items:center;
    color:var(--b100);
    transition:all 0.3s;
}
.arrow-btn:hover{
    color:var(--c1);
}
.arrow-btn .txt{
    font-size:14px;
    font-weight:500;
}
.arrow-btn .icon{
    font-size:24px;
    margin-right:5px;
}
@media (max-width: 1199px) {
}
@media (max-width: 991px) {
}
@media (max-width: 767px) {
    .button {
        padding: 5px 15px;
        font-size: 13px;
    }
        .button .icon {
            font-size: 22px;
        }
        .button.lg {
            padding: 7px 30px;
            font-size: 15px;
        }
        .button.sm {
        padding: 4px 15px;
    font-size: 11px;
}

    .line-btn {
        font-size: 13px;
    }
        .line-btn.sm {
            font-size: 11px;
        }
        .line-btn .icon {
            font-size: 18px;
            margin-left: 5px;
        }
    .sec-row {
        margin: 50px 0;
    }
        .sec-row.sec-bm-row {
            margin-bottom: 0;
        }
        .sec-row .sec-head {
            margin-bottom: 15px;
        }
            .sec-row .sec-head .head {
                font-size: 15px;
            }
            .sec-row .sec-head .head-en {
                font-size: 24px;
            }
            .arrow-btn .txt{
    font-size:12px;
}
.arrow-btn .icon{
    font-size:20px;
}
}
    /*_______________MODAL / FORM______________*/
    .modal {
        text-align: center;
        background-color: rgba(0, 0, 0, 0.10);
    }
    .modal-open {
        /*overflow: scroll;*/
    }
@media screen and (min-width: 768px) {
    .modal:before {
        display: inline-block;
        vertical-align: middle;
        content: " ";
        height: 100%;
    }
    .modal-dialog.md-dialog {
        width: 720px;
    }
}
@media screen and (min-width: 991px) {
         .modal-dialog.md-dialog {
   width:850px
    }
}
    .modal:before {
        display: inline-block;
        vertical-align: middle;
        content: " ";
        height: 100%;
    }
    .modal-dialog {
        display: inline-block;
        vertical-align: middle;
    }
    .modal-content {
        background-color: var(--w100);
        border: 1px solid var(--c1);
        border-radius:15px;
    }
    .modal-header {
        padding:15px;
        border: none;
        border-bottom:1px solid var(--w70);
        display:flex;
        align-items:center;
    }
    .modal-header.nb {
        border-bottom:none
    }
    .modal-header .head-con {
     flex-grow:1;
     display:flex;
     align-items:center;
    font-weight:500;
    font-size:18px;
    margin-left:15px;
}
        .modal-header .close {
            color: var(--b100);
        }
     .modal-header .close .icon {
         display:block;
            font-size: 24px;  
            cursor: pointer
        }
    .modal-body {
        text-align: right;
        padding: 30px;
    }
        .modal-body .modal-desc {
            font-size: 14px;
            font-weight:300;
            margin-bottom:20px;
        }
           .modal-body .modal-desc.desc-lg {
            font-size: 18px;
            font-weight:700;
        }
.modal-bottom-row {
          border-top:1px solid var(--w70);
          padding:15px;
          text-align:right;
        }
.modal-bottom-row .inf{
     display:inline-block;
color:var(--b100);
font-size:14px;
font-weight:300;
text-decoration:underline;
}
  .my-form-row {
        margin-bottom:15px;
        display:flex;
        width:100%;
        }
    .my-form-row .form-col {
  flex:1 0 0;
  overflow:hidden;
  margin-left:15px;
  display:flex;
  align-items:center;
  position:relative;
        }
      .my-form-row .form-col:last-child {
     margin-left:0;
        }
    .my-form-row .form-col .form-label {
 position:absolute;
 top:5px;
 right:10px;
  font-size:12px;
  font-weight:300;
  color:var(--w50);
  text-align: left;
    padding-left: 15px;
        }
        .my-form-row .form-col .form-input {
 flex-grow:1;
  font-size:14px;
  font-weight:400;
  border:1px solid var(--w50);
    background-color:transparent;
    color:var(--b100);
  border-radius:0;
  padding:25px 10px 3px 10px;
  text-align:right;
    outline: none;
    width:100%;
    resize:none;
        }
                .my-form-row .form-col .form-input:focus {
  border:1px solid var(--b100);
        }
    .my-form-row.light .form-col .form-label {
  color:var(--w40);
        }
        .my-form-row.light .form-col .form-input {
  border:1px solid var(--b40);
    background-color:var(--b70);
    color:var(--w100);
        }
                .my-form-row.light .form-col .form-input:focus {
  border:1px solid var(--w60);
        }
  .my-form-row .form-col .form-val{
padding: 25px 10px 3px 10px;
   font-size: 14px;
  flex-grow:1;
  background-color:#f2f2f2;
  width:100%;
   color:var(--b100);
        }
    .my-form-row .form-col .form-items{
  flex-grow:1;
  display:flex;
        }
        .my-form-row .form-col .form-items .form-item{
align-items:center;
  display:flex;
  margin-left:15px;
     font-size: 16px;
        }
.my-form-row .form-col .form-items .form-item input{
margin-left:5px;
        }
  .my-form-row .form-col .form-con{
  flex-grow:1;
        }
  .my-form-row.btn-form-row {
justify-content:center;
margin-top:20px;
margin-bottom:0;
}
  .my-form-row.btn-form-row.btn-right {
justify-content:flex-start;
}
  .my-form-row.btn-form-row .button {
padding: 7px 15px;
}
  .my-form-row .main-btn {
 min-width:120px;
 max-width:200px;
 flex-grow:3;
}
    .my-form-row .cancel-btn {
 margin-left:15px;
  min-width:90px;
}
    .tab-content>.tab-pane {
    display: none;
    visibility: hidden;
}
    .tab-content>.active {
    display: block;
    visibility: visible;
}
            .msg-box{
                position:fixed;
                z-index:2000;
                top:90px;
                right:50%;
                width:360px;
                margin-right:-180px;
                transition:all 0.3s;
            }
            .msg-box.in{
            }
            .msg-box .msg-con{
               width:100%;
               padding:30px 15px;
               background-color:#ddd;
                color:var(--w100);
               margin-bottom:10px;
               paint-order:markers;
               position:relative;
               display:flex;
               align-items:center;
-webkit-box-shadow: 4px 4px 10px 0px rgba(0,0,0,0.47);
-moz-box-shadow: 4px 4px 10px 0px rgba(0,0,0,0.47);
box-shadow: 4px 4px 10px 0px rgba(0,0,0,0.47);
            }
 .msg-box .msg-con.warning{
               background-color:var(--c8);
               color:var(--b100);
            }
 .msg-box .msg-con.success{
               background-color:var(--c7);
            }
 .msg-box .msg-con.alert{
               background-color:var(--c5);
            }
        .msg-box .msg-con:after{
             content:'';
             position:absolute;
             right:0;
             bottom:0;
             background-color:var(--b100);
             height:5px;
             opacity:0.6;
             animation:slide 4s;
             z-index:2;
            }
        .msg-box .msg-con:before{
             content:'\ea49';
             display:block;
              font-family: 'icomoon';  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
              font-size:28px;
                 margin-left:10px;
            }
            .msg-box .msg-con.warning:before{
             content:'\eab5';
            }
          .msg-box .msg-con.success:before{
             content:'\e9f9';
            }
.msg-box .msg-con.alert:before{
             content:'\e9bf';
            }
.msg-box .msg-con .txt{
            font-size:15px;
            font-weight:300;
            }
@keyframes slide {
    0% {
        width: 0%;
    }
    100% {
          width: 100%;
    }
}
@media (max-width:991px) {
    .sm-full{
        padding:0 !important
    }
}
@media (max-width:767px) {
    .modal-dialog {
        width: 90%;
    }
    .modal-header {
        padding: 10px;
    }
        .modal-header .head-con {
            font-size: 14px;
            margin-left: 10px;
        }
        .modal-header .close .icon {
            font-size: 20px;
        }
    .modal-body {
        padding: 15px 10px;
    }
        .modal-body .modal-desc {
            font-size: 12px;
            margin-bottom: 15px;
        }
            .modal-body .modal-desc.desc-lg {
                font-size: 15px;
            }
    .modal-bottom-row {
        padding: 10px;
    }
        .modal-bottom-row .inf {
            font-size: 10px;
        }
    .ship-map-row {
        height: 280px;
    }
    .my-form-row {
        margin-bottom: 10px;
    }
        .my-form-row .form-col {
            margin-left: 10px;
            flex-direction: column;
            align-items: flex-start;
        }
            .my-form-row .form-col:last-child {
                margin-left: 0;
            }
            .my-form-row .form-col .form-label {
                font-size: 10px;
            }
            .my-form-row .form-col .form-input {
                font-size: 12px;
                padding: 20px 10px 3px 10px;
            }
            .my-form-row .form-col .form-val {
                       font-size: 12px;
        padding: 23px 10px 3px 10px;
            }
            .my-form-row .form-col .form-items .form-item {
                margin-left: 10px;
                font-size: 12px;
            }
                .my-form-row .form-col .form-items .form-item input {
                    margin-left: 3px;
                }
        .my-form-row.btn-form-row {
            margin-top: 15px;
        }
            .my-form-row.btn-form-row .button {
                padding: 6px 11px;
            }
        .my-form-row .main-btn {
            min-width: 90px;
            max-width: 150px;
            flex-grow: 3;
        }
        .my-form-row .cancel-btn {
            margin-left: 10px;
            min-width: 90px;
        }
    .msg-box {
        top: 75px;
        right: 50%;
        width: 80%;
        margin-right: -40%;
    }
        .msg-box.in {
        }
        .msg-box .msg-con {
            padding: 15px 15px;
            margin-bottom: 10px;
        }
            .msg-box .msg-con:before {
                font-size: 24px;
                margin-left: 10px;
            }
            .msg-box .msg-con .txt {
                font-size: 12px;
            }
}