/*==============Reset-CSS =============*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { margin:0; padding:0; }
table { border-collapse:collapse; border-spacing:0; }
fieldset, img { border:0; }
ul { list-style:none; }
input { border: none; height: 18px; outline:none; }
* { outline:none !important; }
a { text-decoration: none; outline:none; cursor: pointer; }
a:hover , a:active, a:focus{ text-decoration: none !important; outline:none; }
.clear { clear: both; }
img { border:none; }

/*======================================*/
@font-face {font-family: 'sans-ll';src: url('/fonts/front/IRANSansWeb(FaNum)_UltraLight.eot');
  src: url('/fonts/front/IRANSansWeb(FaNum)_UltraLight.eot?#iefix') format('eot'),
  url('/fonts/front/IRANSansWeb(FaNum)_UltraLight.woff2') format('woff2'),
  url('/fonts/front/IRANSansWeb(FaNum)_UltraLight.woff') format('woff'),
  url('/fonts/front/IRANSansWeb(FaNum)_UltraLight.ttf') format('ttf');
  font-weight: 200;
}
@font-face {font-family: 'sans-l'; src: url('/fonts/front/IRANSansWeb(FaNum)_Light.eot');
  src: url('/fonts/front/IRANSansWeb(FaNum)_Light.eot?#iefix') format('eot'),
  url('/fonts/front/IRANSansWeb(FaNum)_Light.woff2') format('woff2'),
  url('/fonts/front/IRANSansWeb(FaNum)_Light.woff') format('woff'),
  url('/fonts/front/IRANSansWeb(FaNum)_Light.ttf') format('ttf');
  font-weight: 300;
}
@font-face {font-family: 'sans-m'; src: url('/fonts/front/IRANSansWeb(FaNum)_Medium.eot');
  src: url('/fonts/front/IRANSansWeb(FaNum)_Medium.eot?#iefix') format('eot'),
  url('/fonts/front/IRANSansWeb(FaNum)_Medium.woff2') format('woff2'),
  url('/fonts/front/IRANSansWeb(FaNum)_Medium.woff') format('woff'),
  url('/fonts/front/IRANSansWeb(FaNum)_Medium.ttf') format('ttf');
  font-weight: 500;
}
@font-face {font-family: 'sans-b';src: url('/fonts/front/IRANSansWeb(FaNum)_Bold.eot');
  src: url('/fonts/front/IRANSansWeb(FaNum)_Bold.eot?#iefix') format('eot'),
  url('/fonts/front/IRANSansWeb(FaNum)_Bold.woff2') format('woff2'),
  url('/fonts/front/IRANSansWeb(FaNum)_Bold.woff') format('woff'),
  url('/fonts/front/IRANSansWeb(FaNum)_Bold.ttf') format('ttf');
  font-weight: bold;
}
@font-face {font-family: 'num'; src: url('/fonts/front/IRANSansWeb(FaNum).eot');
  src: url('/fonts/front/IRANSansWeb(FaNum).eot?#iefix') format('eot'),
  url('/fonts/front/IRANSansWeb(FaNum).woff2') format('woff2'),
  url('/fonts/front/IRANSansWeb(FaNum).woff') format('woff'),
  url('/fonts/front/IRANSansWeb(FaNum).ttf') format('ttf');
  font-weights: 500;
}
/*===================================*/
body{font-family:'sans-m','Quicksand', sans-serif;height:  1500px; direction: rtl}
body *{direction: rtl}

.header-area.header-stick{ width: 100%; height: auto;-webkit-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear; padding: 10px 0;position: absolute;z-index: 20}
.header-area.navbar-fixed { position: fixed !important; top: 0; left: 0; width: 100%; background-color: white; -webkit-box-shadow: 0px 4px 6px 0px rgba(12, 0, 46, 0.06); box-shadow: 0px 4px 6px 0px rgba(12, 0, 46, 0.06);}
.header-area.header-stick .navbar-brand{font-family: 'Baloo Chettan 2', sans-serif, cursive; color: #ffffff; /*text-shadow: 1px 2px rgba(17, 98, 152, 0.3);*/ font-size: 35px}
.header-area.header-stick .navbar-brand a{color: #ffffff;}
.header-area.navbar-fixed .navbar-brand{ color: #154f77; /*text-shadow: 1px 2px rgba(104,104,104,0.3) ;*/}
.header-area.navbar-fixed .navbar-brand a{color: #12181e;}
.header-area .navbar-nav .nav-link{ font-size:17px; font-family:'sans-l' ; color: #ffffff; padding: 7px 15px; transition: all .4s; border: 1px solid transparent; border-radius: 3px; margin: 0 3px}
.header-area.navbar-fixed .navbar-nav .nav-link{color: #686868;}
.header-area .navbar-dark .nav-link:focus, .header-area .navbar-dark .nav-link:hover , .header-area .navbar-nav .nav-item.active .nav-link{ color: #154f77; box-shadow: 0 0 7px rgba(255,255,255,0.5); background: rgba(255,255,255,0.94)}
.header-area.navbar-fixed .nav-link:focus, .header-area.navbar-fixed .nav-link:hover , .header-area.navbar-fixed .navbar-nav .nav-item.active .nav-link{ color: #2cb4e7; box-shadow: 0 0 7px rgba(21, 131, 188, 0.5)
}

.main-box{width: 100%;height: auto;-webkit-transition: background .3s,border .3s,-webkit-border-radius .3s,-webkit-box-shadow .3s; transition: background .3s,border .3s,-webkit-border-radius .3s,-webkit-box-shadow .3s;  -o-transition: background .3s,border .3s,border-radius .3s,box-shadow .3s; transition: background .3s,border .3s,border-radius .3s,box-shadow .3s;  transition: background .3s,border .3s,border-radius .3s,box-shadow .3s,-webkit-border-radius .3s,-webkit-box-shadow .3s; }
.main-box-inter{min-height: 850px; position: relative; z-index: 1; padding-top: 200px; background-image: -moz-linear-gradient( 40deg, rgb(0, 152, 231) 0%, rgb(20, 172, 231) 100%); background-image: -webkit-linear-gradient( 40deg, rgb(0, 152, 231) 0%, rgb(20, 172, 231) 100%); background-image: -ms-linear-gradient( 40deg, rgb(63,14,73) 0%, rgb(145,114,202) 100%); width: 100%; position: relative;padding-bottom: 50px}
.main-background{ display: block; background: url(/img/front/bg.png) no-repeat ; width: 100%; height:1100px;position: absolute; top: 0px; right: 0px; background-size: cover}
.main-box-inter > svg{position: absolute;bottom: -29px;height: 350px;width: 100%;left: 0;}
.main-box-inter .container{position: relative; z-index: 1;}
.main-box-inter .container .table-wrap, .main-box-inter .container .mobile-wrap{ background: rgba(255,255,255,1); border-radius: 10px;min-height: 100px; height: auto;padding: 15px 20px; box-shadow: 0 0 7px rgba(0,0,0,0.2)}
.pad-left{ padding-left: 0px}
.pad-right{ padding-right: 0px}

.table-wrap header h2{ font-size: 18px; color:#154f77;border-bottom: 1px solid #aaa;padding: 7px 0 15px }
.table-wrap header h2 span{ display: inline-block; float: left; color: #454545; font-size: 13px;font-family: 'sans-l'}
.table-wrap header h2 span span{ direction: ltr; padding-right: 7px}
.table-wrap .table tbody tr th .flags:before,.table-wrap .table tbody tr th .flags:after {content: ""; position: absolute; width: 0; border-left: 150px solid transparent; border-right: 150px solid transparent}
.table-wrap .table td, .table-wrap .table th{ vertical-align: middle}
.table-wrap .table thead tr th{ border-top:none; color: #252525; text-align: center}
.table-wrap .table tbody tr th ,.table-wrap .table tbody tr td{ color: #252525; padding: .2rem;font-family: 'sans-l'; text-align: center}
.table-wrap .table thead tr th:nth-child(1),.table-wrap .table tbody tr th{ text-align: right;}
.table-wrap .table tbody tr th img{ margin-left: 20px}
.table-wrap .table tbody tr td >label{ font-weight: 600;color:#454545 }
.table-wrap .table tbody tr td label{ display: block; margin-bottom: 0px; font-size: 15px}
.table-wrap .table tbody tr td p label.green-text{ color:#22ce03; font-size: 10px ;font-family: 'sans-m' }
.table-wrap .table tbody tr td p label.green-text:before{ content: ""; width: 7px; height: 7px; display: inline-block; background: url(/img/front/up.png) no-repeat center top; margin-left: 5px}
.table-wrap .table tbody tr td p label.red-text{ color:#f31717 ;font-size: 10px;font-family: 'sans-m'}
.table-wrap .table tbody tr td p label.red-text:before{ content: ""; width: 7px; height: 7px; display: inline-block; background: url(/img/front/down.png) no-repeat center bottom; margin-left: 5px}

.mobile-wrap header h3{font-size: 20px; color:#154f77;padding: 7px 0 15px; font-family: 'sans-b' }
.mobile-wrap header p{ font-size: 17px; color: #252525; margin-top: 20px;font-family: 'sans-l'; line-height: 30px}
.mobile-wrap img{ display: block; margin: 30px auto}
.mobile-wrap .googleplay , .mobile-wrap .appstore{ display: inline-block; width: 160px; height: 45px;  margin-bottom: 10px;transition: all .5s; }
.mobile-wrap .googleplay svg , .mobile-wrap .appstore svg{position: relative;top: 0px;transition: all .3s;}
.mobile-wrap .googleplay svg:hover , .mobile-wrap .appstore svg:hover{ top: -3px;}

.about-box{ padding-top: 60px; text-align: center; background: url(/img/front/about-bg.png) no-repeat center bottom;background-size: cover}
.about-box .container h3{ color: #154f77; font-size: 25px; margin-bottom: 30px; display: inline-block; padding: 0 5px 7px 0; border-bottom: 2px solid #154f77; font-family: 'sans-m'}
.about-box .container p{ line-height: 35px; color: #252525; padding: 15px 180px 100px ; font-family: 'sans-l';font-size: 17px}
.about-box .container p strong{ font-weight: 600; color:#151515 }

footer{ background: url(/img/front/footer-bg.jpg) repeat ; padding: 30px 0 0;border-top: 10px solid #282629; position: relative }
@media(min-width:1024px){footer .container{ padding: 0 200px}}
footer .container h4{ color: #ffffff; margin-bottom: 50px; text-align: center;display: block;  text-shadow: 1px 1px 1px #000000;background:url(/img/front/footer-bg.jpg) repeat; border-radius: 5px; position: absolute; top: -35px ; padding: 15px 30px; font-family: 'sans-m'; font-size: 18px }
footer .container section{ color: #ffffff; float: left; margin-top: 20px;font-family:'Quicksand'}
footer .container section span.title{margin-bottom: 10px; display: block; font-size: 18px ; border-bottom: 1px solid #9f8f7f;color: #9f8f7f; font-family: 'sans-l'; }
footer .container section p{ line-height: 29px; font-size: 15px; font-weight: 400;margin-bottom: 20px; direction: ltr; }
footer .container section span.email{ margin-top: 10px; }
footer .copy-right{background: #181818; padding: 15px 0; text-align: center; width: 100%; margin-top: 20px; border-top: 1px solid #252525}
footer .copy-right p{ font-size: 10px ; color: #cccccc;font-family:'Quicksand'}

/*================= Media ==================*/

@media(min-width: 767px) and (max-width:979px) {
    .header-area{ background: url(/img/front/footer-bg.jpg) repeat; border-bottom:7px solid #1c1c1c; position: relative !important; }
    .navbar{ padding: 0 15px;}
    .navbar-dark .navbar-toggler{ border: none; cursor: pointer}
    .header-area .navbar-dark .navbar-nav .nav-link{color: #ffffff; margin-top: 5px; font-size: 15px}
    .header-area.navbar-fixed .navbar-dark .navbar-nav .nav-link{ color: #ffffff}
    .header-area .navbar-dark .nav-link:focus, .header-area .navbar-dark .nav-link:hover, .header-area .navbar-nav .nav-item.active .nav-link {color: #154f77;}
    .main-box-inter{ padding-top: 70px}
    .main-box-inter .container .row > div{ padding: 0 15px;}
    .mobile-wrap{ margin-bottom: 20px; text-align: center }
    .table-wrap .table thead tr th{ font-size: 14px}
    .table-wrap .table tbody tr th{ font-size: 15px}
    .table-wrap .table tbody tr th img{ margin-left: 10px}
    .main-background{ height: 1000px}
    .about-box .container p{ padding: 0px 10px 100px; font-size: 16px}
}

@media(max-width: 767px){
    .header-area{ background: url(/img/front/footer-bg.jpg) repeat; border-bottom:7px solid #1c1c1c; position: relative !important; }
    .navbar{ padding: 0 15px;}
    .navbar-dark .navbar-toggler{ border: none; cursor: pointer}
    .header-area .navbar-dark .navbar-nav .nav-link{color: #ffffff; margin-top: 5px; font-size: 15px}
    .header-area.navbar-fixed .navbar-dark .navbar-nav .nav-link{ color: #ffffff}
    .main-box-inter{ padding-top: 50px}
    .main-box-inter .container .row > div{ padding: 0 15px;}
    .mobile-wrap{ margin-bottom: 20px; text-align: center }
    .table-wrap header h2{text-align: center;}
    .table-wrap header h2 span{ float: none; margin-top: 10px}
    .table-wrap .table thead tr th{ font-size: 13px}
    .table-wrap .table tbody tr th{ font-size: 14px}
    .table-wrap .table tbody tr th img{ margin-left: 10px}
    .main-background{ height: 1000px}
    .about-box .container p{ padding: 0px 10px 100px; font-size: 16px}
}