
   @font-face {
		font-family: IRANSans;
		font-style: normal;
		font-weight: normal;
		src: url('font/IRANSansWeb.eot');
		src: url('font/IRANSansWeb.eot?#iefix') format('embedded-opentype'),url('font/IRANSansWeb.woff2') format('woff2'),url('font/IRANSansWeb.woff') format('woff'),url('font/IRANSansWeb.ttf') format('truetype')
	}
	
@font-face {
      font-family: 'insta';
      src: url('./font/insta.eot?22168112');
      src: url('./font/insta.eot?22168112#iefix') format('embedded-opentype'),
           url('./font/insta.woff?22168112') format('woff'),
           url('./font/insta.ttf?22168112') format('truetype'),
           url('./font/insta.svg?22168112#insta') format('svg');
      font-weight: normal;
      font-style: normal;
    }
     
     
    .demo-icon
    {
      font-family: "insta";
      font-style: normal;
      font-weight: normal;
      speak: none;
     
      display: inline-block;
      text-decoration: inherit;
      width: 1em;
      margin-right: .2em;
      text-align: center;
      /* opacity: .8; */
     
      /* For safety - reset parent styles, that can break glyph codes*/
      font-variant: normal;
      text-transform: none;
     
      /* fix buttons height, for twitter bootstrap */
      line-height: 1em;
     
      /* Animation center compensation - margins should be symmetric */
      /* remove if not needed */
      margin-left: .2em;
     
      /* You can be more comfortable with increased icons size */
      /* font-size: 120%; */
     
      /* Font smoothing. That was taken from TWBS */
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
     
      /* Uncomment for 3D effect */
      /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
    }

body {
  overflow: hidden;
}


/* Preloader */

#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #fff;
  /* change if the mask should have another color then white */
  z-index: 99;
  /* makes sure it stays on top */
}

#status {
  width: 200px;
  height: 200px;
  position: absolute;
  left: 50%;
  /* centers the loading animation horizontally one the screen */
  top: 50%;
  /* centers the loading animation vertically one the screen */
  /* path to your loading animation */
  background-repeat: no-repeat;
  background-position: center;
  margin: -100px 0 0 -100px;
  /* is width and height divided by two */
}

  .container {
	  text-align: center;
	  font-family: IRANSans;
	  magin-top:30%;
	  z-index: 999;
	  position: relative;
	 }
  .explod {
	    direction: rtl;
    text-align: right;
}
 
.col-md-12.headpage i {
    color: #237bdc;
    font-size: 37px;
}
.col-md-12.headpage {
    margin: 3 %;
    background: white;
   
    padding: 5%;
    /* -webkit-box-shadow: 1px 11px 22px -2px rgba(199,197,199,1); */
    -moz-box-shadow: 1px 11px 22px -2px rgba(199,197,199,1);
    box-shadow: 1px 11px 14px -2px rgb(204, 201, 201);
    border-radius: 4px;
    font-size: 16px;
    color: #818181;
    font-weight: 600;
}
.mar {
	 margin: -10% 4% 4px;
}
.blueline {
    background: #237BDC;
    position: absolute;
    width: 100%;
    height: 17%;
    top: 0;
    z-index: 998;
    /* border-left: 5px solid; */
    margin: 0 auto;
    left: 0;
    border-radius: 0 0 100% 100%;
}
.rofi {
    margin: 2% 5%;
}
.rofi span {
    float: left;
}
span.vahed {
    font-size: 11px;
}