/*
CSS file created with:Instantblueprint - Create a web project framework in seconds.
http://instantblueprint.com
Project: Simple
File: css/style.css
Last edited: January 16, 2016, 5:52 pm
*/
* {

  -webkit-user-select: none; /* Safari 3.1+ */
  -moz-user-select: none; /* Firefox 2+ */
  -ms-user-select: none; /* IE 10+ */
  user-select: none; /* Standard syntax */

}

@font-face {
    font-family: 'r';
    src: url('../Export/RobHeb-Regular.otf') format('opentype'); 
    font-weight:400;
  }

  @font-face {
    font-family: 'r';
    src: url('../Export/RobHeb-Black.otf') format('opentype'); 
    font-weight:900;
  }

  @font-face {
    font-family: 'r';
    src: url('../Export/RobHeb-Bold.otf') format('opentype'); 
    font-weight:700;
  }

  @font-face {
    font-family: 'r';
    src: url('../Export/RobHeb-ExtraBold.otf') format('opentype'); 
    font-weight:800;
  }
  
  @font-face {
    font-family: 'r';
    src: url('../Export/RobHeb-Light.otf') format('opentype'); 
    font-weight:300;
  }
  
  @font-face {
    font-family: 'r';
    src: url('../Export/RobHeb-Thin.otf') format('opentype'); 
    font-weight:200;
  }

  @font-face {
    font-family: 'r';
    src: url('../Export/RobHeb-Medium.otf') format('opentype'); 
    font-weight:500;
  }
  

/*  Main  */
body {
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;
 background:#FFF;
 color:rgba(0,0,0,0.87);
 font-family: 'r';
 font-size: 10px;
 direction: rtl;
}

#wrapper {
 margin:0 auto;
 padding:16px;
 max-width:960px; /*  Change to desired width :)  */
}

.font-test-section {
  color:rgba(0,0,0,0.80);
  background:rgba(0,0,0,0.05);
  margin-bottom:8px;    
}

.negative {
  color:#eee;
  background:rgba(0,0,0,0.80);
  margin-bottom:8px;    
}
.negative a {
  color:#eee;
  text-decoration: underline;
}

.sm {
  font-size: 14px;
  line-height: 145%;
  padding: 16px;
}

.md {
  font-size: 24px;
  line-height: 135%;
  padding: 16px;

}

.lg {
  font-size: 30px;
  line-height: 135%;
  padding: 16px;

}

.xl {
  font-size: 64px;
  line-height: 98%;
  letter-spacing: -0.02em;
  padding: 16px;

}
.xxl {
  font-size: 128px;
  line-height: 90%;
  padding: 16px;
  letter-spacing: -.03em;

}
.xxxl {
  font-size: 188px;
  line-height: 76%;
  padding: 56px 16px;
  letter-spacing: -.03em;

}

.f100 {
  font-weight:100;
  padding: 16px;

}

.f200 {
  font-weight:200;

}

.f300 {
  font-weight:300;
}


.f400 {
  font-weight:400;
}

.f500 {
  font-weight:500;
}


.f600 {
  font-weight:600;
}

.f700 {
  font-weight:700;
}


.f800 {
  font-weight:800;
}

.f900 {
  font-weight:900;
}
.button-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 16px;
}
.button-wrap {
  background:rgba(0,0,0,0.80);
  color:rgba(255,255,255,1);
  padding: 16px 32px;
  border-radius: 80px;
}
.button-outline {
  background:transparent;
  padding: 16px 32px;
  border-radius: 80px;
  border: 1px solid rgba(0,0,0,0.80);
}

.button-flex {
  display: flex;
  flex-direction: row;
  gap: 16px;
}

@media (max-width: 768px) {
  .xxxl {
    font-size: 72px;
  }
  .xxl {
    font-size: 64px;
  }
  .xl {
    font-size: 30px;
  }
  .lg {
    font-size: 24px;
  }
  .button-wrap {
    font-size: 16px;
    padding: 6px 18px;
  }
  .button-outline {
    font-size: 16px;
    padding: 6px 18px;
  }
}