/* vars */
@font-face {
  font-family: 'pouya';
  src: url(./pouya.ttf);
 }

* {
  padding: 0;
  margin: 0;
  outline: none; }

body {
  font-family: 'vazirmatn', sans-serif;


  /*font-family: 'Varela Round', 'IRANSans-web', sans-serif;*/
  font-weight: 100 !important;
  color: #555;
  font-size: 1em;
  line-height: 2;
  background: #14253E; }

.underline-span {
  border-bottom: 1px solid #777; }

.infolink {
  text-decoration: none;
  color: inherit;
  border-bottom: 1px dotted #656565;
  cursor: help; }


#top-section {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
    align-content: center;
  width: 100%;
  min-height: 100vh;
  height: auto;
  background: #071a35;
  color: #fff;
  position: relative;
  overflow: hidden;
  z-index: 1; }
  #top-section #top-section-center-container {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	align-content: center;
	padding-top: 1rem;
	padding-bottom: 4rem;
	max-width: 100%;
    z-index: 10; }
    #top-section #top-section-center-container #top-section-center {
      display: block;
      width: 35em;
      max-width: 96%;
      text-align: center; }
@media screen and (max-width: 640px) {
    #top-section #top-section-center-container #top-section-center {
      display: block;
      width: 35em;
      max-width: 80%;
      text-align: center; }
}
      #top-section #top-section-center-container #top-section-center .welcometext {
        font-weight: 300;
        font-size: 1.44em;
        line-height: 2.7; }
        @media screen and (max-width: 998px) {
          #top-section #top-section-center-container #top-section-center .welcometext {
            font-size: 1.1em; } }
      #top-section #top-section-center-container #top-section-center #big-center-name {
              font-family: 'pouya', 'vazirmatn', sans-serif;
        font-size: 4em;
        text-transform: uppercase;
        font-weight: 300;
        margin-bottom: 0.25rem;
        line-height: 1.2; }
        @media screen and (max-width: 998px) {
          #top-section #top-section-center-container #top-section-center #big-center-name {
            font-size: 1.7em; } }
      #top-section #top-section-center-container #top-section-center h2 {
        font-weight: 100 !important;
        text-transform: uppercase;
        
        line-height: 1.5 !important;
        font-size: 1.1em; }
        @media screen and (max-width: 998px) {
          #top-section #top-section-center-container #top-section-center h2 {
            font-size: 1.1em; } }
        @media screen and (max-width: 640px) {
          #top-section #top-section-center-container #top-section-center h2 {
            font-size: 1em; } }
      #top-section #top-section-center-container #top-section-center .intro-social-icons {
        margin: 0.5em 0; }
        #top-section #top-section-center-container #top-section-center .intro-social-icons a {
          color: rgba(255, 255, 255, 0.8);
          text-decoration: none; }
          #top-section #top-section-center-container #top-section-center .intro-social-icons a i {
            font-size: 1.6em;
            margin: 0.12em;
            transition: color 0.3s, text-shadow 0.3s; }
          #top-section #top-section-center-container #top-section-center .intro-social-icons a:hover {
            color: white; }
            #top-section #top-section-center-container #top-section-center .intro-social-icons a:hover i {
              text-shadow: 0 0.2em 0.2em rgba(0, 0, 0, 0.2); }
      #top-section #top-section-center-container #top-section-center #main-profile-pic {
        display: block;
        width: 9em;
        height: 9em;
        border-radius: 9em;
        margin: 0.8em auto;
        box-shadow: 0 1em 2em -0.5em rgba(0, 0, 0, 0.3);
        margin-top: -1em;
        transition: box-shadow 0.4s; }
        #top-section #top-section-center-container #top-section-center #main-profile-pic:hover {
          box-shadow: 0 1em 2.5em -0.4em rgba(0, 0, 0, 0.4); }
  #top-section #top-section-bg div {
    display: block;
    position: absolute;
    height: 150vh;
    top: -10em; }
  #top-section #top-section-bg #tsbg1 {
    width: 12%;
    background: #0b2449;
    right: 0;
    z-index: 3;
    -webkit-transform: rotate(11deg);
        -ms-transform: rotate(11deg);
            transform: rotate(11deg);
    opacity: 0.9; }
  #top-section #top-section-bg #tsbg2 {
    width: 17%;
    background: #081d3b;
    right: 10%;
    z-index: 2;
    -webkit-transform: rotate(6deg);
        -ms-transform: rotate(6deg);
            transform: rotate(6deg); }
  #top-section #top-section-bg #tsbg3 {
    width: 6%;
    background: #0a2042;
    right: 12%;
    z-index: 4;
    -webkit-transform: rotate(19deg);
        -ms-transform: rotate(19deg);
            transform: rotate(19deg);
    top: -30em;
    height: 200vh;
    opacity: 0.6;
    position: fixed; }
  #top-section #top-section-bg #tsbg4 {
    width: 10%;
    background: #0a2042;
    right: 22%;
    z-index: 4;
    -webkit-transform: rotate(6deg);
        -ms-transform: rotate(6deg);
            transform: rotate(6deg);
    opacity: 1; }
  #top-section #top-section-bg #tsbg5 {
    width: 22%;
    background: #0b2348;
    right: 38%;
    -webkit-transform: rotate(14deg);
        -ms-transform: rotate(14deg);
            transform: rotate(14deg);
    z-index: 4; }
  #top-section #top-section-bg #tsbg6 {
    width: 9%;
    background: #081d3b;
    right: 48%;
    -webkit-transform: rotate(9deg);
        -ms-transform: rotate(9deg);
            transform: rotate(9deg);
    z-index: 5;
    opacity: 0.6;
    position: fixed; }
  #top-section #top-section-bg #tsbg7 {
    width: 10%;
    background: #0a2042;
    right: 68%;
    -webkit-transform: rotate(20deg);
        -ms-transform: rotate(20deg);
            transform: rotate(20deg);
    position: fixed;
    z-index: 4;
    top: -33em;
    height: 200vh;
    opacity: 0.8; }
  #top-section #top-section-bg #tsbg8 {
    width: 22%;
    background: #071a35;
    right: 69%;
    z-index: 3;
    -webkit-transform: rotate(9deg);
        -ms-transform: rotate(9deg);
            transform: rotate(9deg);
    opacity: 0.6; }
  #top-section #top-section-bg #tsbg9 {
    width: 9%;
    background: #0a2042;
    right: 88%;
    -webkit-transform: rotate(7deg);
        -ms-transform: rotate(7deg);
            transform: rotate(7deg);
    position: fixed;
    z-index: 5;
    opacity: 0.8; }
  @media screen and (max-width: 998px) {
    #top-section #top-section-bg #tsbg1 {
      width: 30% !important; }
    #top-section #top-section-bg #tsbg2 {
      display: none !important; }
    #top-section #top-section-bg #tsbg3 {
      width: 30% !important; }
    #top-section #top-section-bg #tsbg4 {
      display: none !important; }
    #top-section #top-section-bg #tsbg7 {
      display: none !important; }
    #top-section #top-section-bg #tsbg8 {
      width: 25% !important; }
    #top-section #top-section-bg #tsbg6 {
      display: none !important; }
    #top-section #top-section-bg #tsbg9 {
      width: 22% !important; } }