/* * Prefixed by https://autoprefixer.github.io * PostCSS: v7.0.29, * Autoprefixer: v9.7.6 * Browsers: last 2 versions,> 0.5%,ie >= 9 */
/* rokkitt-100 - latin */
 @font-face {
     font-family: 'Rokkitt-Thin';
     font-style: normal;
     font-weight: 100;
     src: url('https://www.saif.com/documents/fonts/Rokkitt-Thin.eot');
    /* IE9 Compat Modes */
     src: local(''), url('https://www.saif.com/documents/fonts/Rokkitt-Thin.eot?#iefix') format('embedded-opentype'), 
    /* IE6-IE8 */
     url('https://www.saif.com/documents/fonts/Rokkitt-Thin.woff2') format('woff2'), 
    /* Super Modern Browsers */
     url('https://www.saif.com/documents/fonts/Rokkitt-Thin.woff') format('woff'), 
    /* Modern Browsers */
     url('https://www.saif.com/documents/fonts/Rokkitt-Thin.ttf') format('truetype'), 
    /* Safari, Android, iOS */
     url('https://www.saif.com/documents/fonts/Rokkitt-Thin.svg#Rokkitt') format('svg');
    /* Legacy iOS */
}
/* rokkitt-200 - latin */
 @font-face {
     font-family: 'Rokkitt-ExtraLight';
     font-style: normal;
     font-weight: 200;
     src: url('https://www.saif.com/documents/fonts/Rokkitt-ExtraLight.eot');
    /* IE9 Compat Modes */
     src: local(''), url('https://www.saif.com/documents/fonts/Rokkitt-ExtraLight.eot?#iefix') format('embedded-opentype'), 
    /* IE6-IE8 */
     url('https://www.saif.com/documents/fonts/Rokkitt-ExtraLight.woff2') format('woff2'), 
    /* Super Modern Browsers */
     url('https://www.saif.com/documents/fonts/Rokkitt-ExtraLight.woff') format('woff'), 
    /* Modern Browsers */
     url('https://www.saif.com/documents/fonts/Rokkitt-ExtraLight.ttf') format('truetype'), 
    /* Safari, Android, iOS */
     url('https://www.saif.com/documents/fonts/Rokkitt-ExtraLight.svg#Rokkitt') format('svg');
    /* Legacy iOS */
}
/* rokkitt-regular - latin */
 @font-face {
     font-family: 'Rokkitt-Regular';
     font-style: normal;
     font-weight: 400;
     src: url('https://www.saif.com/documents/fonts/Rokkitt-Regular.eot');
    /* IE9 Compat Modes */
     src: local(''), url('https://www.saif.com/documents/fonts/Rokkitt-Regular.eot?#iefix') format('embedded-opentype'), 
    /* IE6-IE8 */
     url('https://www.saif.com/documents/fonts/Rokkitt-Regular.woff2') format('woff2'), 
    /* Super Modern Browsers */
     url('https://www.saif.com/documents/fonts/Rokkitt-Regular.woff') format('woff'), 
    /* Modern Browsers */
     url('https://www.saif.com/documents/fonts/Rokkitt-Regular.ttf') format('truetype'), 
    /* Safari, Android, iOS */
     url('https://www.saif.com/documents/fonts/Rokkitt-Regular.svg#Rokkitt') format('svg');
    /* Legacy iOS */
}
/* rokkitt-300 - latin */
 @font-face {
     font-family: 'Rokkitt-Light';
     font-style: normal;
     font-weight: 300;
     src: url('https://www.saif.com/documents/fonts/Rokkitt-Light.eot');
    /* IE9 Compat Modes */
     src: local(''), url('https://www.saif.com/documents/fonts/Rokkitt-Light.eot?#iefix') format('embedded-opentype'), 
    /* IE6-IE8 */
     url('https://www.saif.com/documents/fonts/Rokkitt-Light.woff2') format('woff2'), 
    /* Super Modern Browsers */
     url('https://www.saif.com/documents/fonts/Rokkitt-Light.woff') format('woff'), 
    /* Modern Browsers */
     url('https://www.saif.com/documents/fonts/Rokkitt-Light.ttf') format('truetype'), 
    /* Safari, Android, iOS */
     url('https://www.saif.com/documents/fonts/Rokkitt-Light.svg#Rokkitt') format('svg');
    /* Legacy iOS */
}
/* rokkitt-500 - latin */
 @font-face {
     font-family: 'Rokkitt-Medium';
     font-style: normal;
     font-weight: 500;
     src: url('https://www.saif.com/documents/fonts/Rokkitt-Medium.eot');
    /* IE9 Compat Modes */
     src: local(''), url('https://www.saif.com/documents/fonts/Rokkitt-Medium.eot?#iefix') format('embedded-opentype'), 
    /* IE6-IE8 */
     url('https://www.saif.com/documents/fonts/Rokkitt-Medium.woff2') format('woff2'), 
    /* Super Modern Browsers */
     url('https://www.saif.com/documents/fonts/Rokkitt-Medium.woff') format('woff'), 
    /* Modern Browsers */
     url('https://www.saif.com/documents/fonts/Rokkitt-Medium.ttf') format('truetype'), 
    /* Safari, Android, iOS */
     url('https://www.saif.com/documents/fonts/Rokkitt-Medium.svg#Rokkitt') format('svg');
    /* Legacy iOS */
}
/* rokkitt-600 - latin */
 @font-face {
     font-family: 'Rokkitt-SemiBold';
     font-style: normal;
     font-weight: 600;
     src: url('https://www.saif.com/documents/fonts/Rokkitt-SemiBold.eot');
    /* IE9 Compat Modes */
     src: local(''), url('https://www.saif.com/documents/fonts/Rokkitt-SemiBold.eot?#iefix') format('embedded-opentype'), 
    /* IE6-IE8 */
     url('https://www.saif.com/documents/fonts/Rokkitt-SemiBold.woff2') format('woff2'), 
    /* Super Modern Browsers */
     url('https://www.saif.com/documents/fonts/Rokkitt-SemiBold.woff') format('woff'), 
    /* Modern Browsers */
     url('https://www.saif.com/documents/fonts/Rokkitt-SemiBold.ttf') format('truetype'), 
    /* Safari, Android, iOS */
     url('https://www.saif.com/documents/fonts/Rokkitt-SemiBold.svg#Rokkitt') format('svg');
    /* Legacy iOS */
}
/* rokkitt-700 - latin */
 @font-face {
     font-family: 'Rokkitt-Bold';
     font-style: normal;
     font-weight: 700;
     src: url('https://www.saif.com/documents/fonts/Rokkitt-Bold.eot');
    /* IE9 Compat Modes */
     src: local(''), url('https://www.saif.com/documents/fonts/Rokkitt-Bold.eot?#iefix') format('embedded-opentype'), 
    /* IE6-IE8 */
     url('https://www.saif.com/documents/fonts/Rokkitt-Bold.woff2') format('woff2'), 
    /* Super Modern Browsers */
     url('https://www.saif.com/documents/fonts/Rokkitt-Bold.woff') format('woff'), 
    /* Modern Browsers */
     url('https://www.saif.com/documents/fonts/Rokkitt-Bold.ttf') format('truetype'), 
    /* Safari, Android, iOS */
     url('https://www.saif.com/documents/fonts/Rokkitt-Bold.svg#Rokkitt') format('svg');
    /* Legacy iOS */
}
/* rokkitt-800 - latin */
 @font-face {
     font-family: 'Rokkitt-ExtraBold';
     font-style: normal;
     font-weight: 800;
     src: url('https://www.saif.com/documents/fonts/Rokkitt-ExtraBold.eot');
    /* IE9 Compat Modes */
     src: local(''), url('https://www.saif.com/documents/fonts/Rokkitt-ExtraBold.eot?#iefix') format('embedded-opentype'), 
    /* IE6-IE8 */
     url('https://www.saif.com/documents/fonts/Rokkitt-ExtraBold.woff2') format('woff2'), 
    /* Super Modern Browsers */
     url('https://www.saif.com/documents/fonts/Rokkitt-ExtraBold.woff') format('woff'), 
    /* Modern Browsers */
     url('https://www.saif.com/documents/fonts/Rokkitt-ExtraBold.ttf') format('truetype'), 
    /* Safari, Android, iOS */
     url('https://www.saif.com/documents/fonts/Rokkitt-ExtraBold.svg#Rokkitt') format('svg');
    /* Legacy iOS */
}
/* rokkitt-900 - latin */
 @font-face {
     font-family: 'Rokkitt-Black';
     font-style: normal;
     font-weight: 900;
     src: url('https://www.saif.com/documents/fonts/Rokkitt-Black.eot');
    /* IE9 Compat Modes */
     src: local(''), url('https://www.saif.com/documents/fonts/Rokkitt-Black.eot?#iefix') format('embedded-opentype'), 
    /* IE6-IE8 */
     url('https://www.saif.com/documents/fonts/Rokkitt-Black.woff2') format('woff2'), 
    /* Super Modern Browsers */
     url('https://www.saif.com/documents/fonts/Rokkitt-Black.woff') format('woff'), 
    /* Modern Browsers */
     url('https://www.saif.com/documents/fonts/Rokkitt-Black.ttf') format('truetype'), 
    /* Safari, Android, iOS */
     url('https://www.saif.com/documents/fonts/Rokkitt-Black.svg#Rokkitt') format('svg');
    /* Legacy iOS */
}
 :root {
     --font-header-light: "Rokkitt-Light", "Verdana", Helvetica, Arial, sans-serif;
     --font-header-regular: "Rokkitt-Regular", "Verdana", Helvetica, Arial, sans-serif;
     --font-header-medium: "Rokkitt-Medium", "Verdana", Helvetica, Arial, sans-serif;
     --font-header-semibold: "Rokkitt-SemiBold", "Verdana", Helvetica, Arial, sans-serif;
     --font-header-bold: "Rokkitt-Bold", "Verdana", Helvetica, Arial, sans-serif;
     --header-height: 60px;
     --evergreen: #558712;
     --yellow: #facb47;
     --black: #333333;
     --light-gray-1: #efefef;
     --light-gray-2: #e4e4e4;
     --dark-gray: #5f6a7c;
}
 * {
     font-family: "Verdana", Geneva, Tahoma, sans-serif;
     -webkit-box-sizing: border-box;
     box-sizing: border-box;
}
 *::-moz-selection {
     background-color: var(--dark-gray);
     color: white;
}
 *::selection {
     background-color: var(--dark-gray);
     color: white;
}
 html {
     scroll-padding-top: var(--header-height);
}
 html, body {
     padding: 0;
     margin: 0;
     color: var(--black);
     background: url(https://www.saif.com/images/QuoteAndBuy/pattern.jpg) repeat var(--dark-gray);
     scroll-behavior: smooth;
}
 body {
     min-width: 350px;
}
 h1, h2, h3, h4, h5, h6 {
     font-family: var(--font-header-medium);
     line-height: 1.1em;
}
 p {
     line-height: 1.5em;
}
 a {
     color: var(--evergreen);
     text-decoration: none;
     padding-bottom: 1px;
     border-bottom: 1px solid transparent;
     -webkit-transition: opacity 300ms ease-in-out, border-bottom 300ms ease-in-out;
     transition: opacity 300ms ease-in-out, border-bottom 300ms ease-in-out;
}
 a:hover {
     opacity: 0.75;
     border-bottom: 1px solid var(--evergreen);
}
 section {
     -webkit-transition: border 300ms ease-in-out;
     transition: border 300ms ease-in-out;
}
 section:target {
     border-left: 10px solid var(--yellow);
     border-right: 10px solid var(--yellow);
}
 .bg-light-gray {
     background-color: var(--light-gray-1);
}
 .button {
     text-decoration: none;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     border: 1px solid currentColor;
     color: var(--black);
     cursor: pointer;
     display: -ms-inline-flexbox;
     display: -webkit-inline-box;
     display: inline-flex;
     font-weight: var(--font-semi-bold);
     font-family: var(--font-header-semibold);
     height: 40px;
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
     margin: 0;
     padding: 25px 50px;
     -webkit-transition: all 180ms linear;
     transition: all 180ms linear;
     background-color: var(--yellow);
     min-width: 160px;
     max-width: 400px;
     width: 100%;
     height: 40px;
     font-size: 28px;
     letter-spacing: 0px;
     border-radius: 9999px;
     -webkit-box-shadow: inset 0 -2px 0 0 rgba(0, 0, 0, 0.1);
     box-shadow: inset 0 -2px 0 0 rgba(0, 0, 0, 0.1);
     border: none;
     font-weight: normal;
     -webkit-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
}
 .button:hover {
     -webkit-filter: brightness(.9);
     filter: brightness(.9);
     opacity: 1;
     border-bottom: none;
}
 .button:hover:active {
     -webkit-filter: brightness(1);
     filter: brightness(1);
     -webkit-box-shadow: inset 0 2px 0 0 rgba(0, 0, 0, 0.1);
     box-shadow: inset 0 2px 0 0 rgba(0, 0, 0, 0.1);
}
 .button:disabled, .button[disabled] {
     background: white;
     -webkit-filter: brightness(.9);
     filter: brightness(.9);
     opacity: .5;
}
 header {
     font-size: 1.2em;
}
 header > div {
     height: 100%;
}
 header .container, footer .container {
     margin: auto;
     max-width: 1400px;
     height: 100%;
     padding: 0 20px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: justify;
     -ms-flex-pack: justify;
     justify-content: space-between;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -webkit-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
}
 #phone {
     margin-left: 30px;
}
 #tagline {
     cursor: default;
     pointer-events: none;
     height: 100%;
     display: none;
}
 #logo img {
     width: 80px;
}
 header a, footer a {
     border-bottom: none;
}
 header a:hover, footer a:hover {
     border-bottom: none;
}
 header *, footer * {
     color: white;
}
 header {
     position: fixed;
     width: 100%;
     height: var(--header-height);
     top: 0;
     z-index: 99999;
     background-color: var(--dark-gray);
     -webkit-box-shadow: 1px 0 5px var(--black);
     box-shadow: 1px 0 5px var(--black);
}
 footer {
     font-size: 1.2em;
     padding-bottom: 10px;
     position: relative;
     -webkit-box-shadow: -1px 0 5px var(--black);
     box-shadow: -1px 0 5px var(--black);
     background-color: var(--dark-gray);
     margin-top: -10px;
}
 footer #logo img {
     width: 70px;
}
 main {
     display: block;
     padding: 10px;
     margin: auto;
     padding-top: var(--header-height);
}
 section {
     background-color: white;
}
 section.bg-light-gray {
     border-top: 1px solid var(--light-gray-2);
     border-bottom: 1px solid var(--light-gray-2);
}
 section .container {
     padding: 50px 20px 60px 20px;
     margin: 0 auto 0 auto;
     max-width: 1200px;
}
 section .title {
     color: var(--evergreen);
     margin: 0 auto 10px auto;
     font-family: var(--font-header-bold);
     font-size: 44px;
     font-weight: 300;
     letter-spacing: 0.31px;
     text-align: center;
}
 section h4 {
     font-weight: 500;
     font-size: 1.5em;
     margin: 0;
}
 .flex .flex-item {
     margin: auto;
     text-align: center;
     width: 100%;
     padding: 0 20px;
}
 .loader {
     border: 8px solid var(--light-gray-2);
     border-top: 8px solid var(--evergreen);
     border-radius: 50%;
     width: 80px;
     height: 80px;
     -webkit-animation: spin 2s linear infinite;
     animation: spin 2s linear infinite;
}
 #hero {
     position: relative;
     background-color: var(--light-gray-1);
     color: var(--black);
     border-bottom: 1px solid var(--light-gray-2);
     background: none;
     background-size: cover;
     height: 500px;
     max-width: 1400px;
     margin: auto;
}
 #hero .flex {
     align-items: flex-start;
}
 #hero .heroimg {
     background-size: cover;
     height: 500px;
     width: 50%;
}
 #hero .hero-content {
     margin: 0;
     text-align: left;
     height: 100%;
     width: 50%;
     padding: 40px 3vw 40px 0px;
}
 #hero .title {
     color: var(--evergreen);
     margin: 0;
     font-size: 2.3em;
}
 #hero img {
     display: none;
     height: 100%;
     width: 100%;
     -o-object-fit: cover;
     object-fit: cover;
     -o-object-position: left top;
     object-position: left top;
     pointer-events: none;
     -webkit-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
     z-index: 1;
}
 #hero .title, #hero p {
     color: white;
}
 #hero .title, #hero p {
     text-align: left;
}
 #hero p {
     font-size: 20px;
}
 nav {
     display: none;
     background-color: var(--light-gray-1);
     border-bottom: 1px solid var(--light-gray-2);
}
 nav p {
     display: none;
}
 nav ul {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
     padding: 0;
     margin: 0;
     list-style-type: none;
}
 nav ul li {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: start;
     -ms-flex-pack: start;
     justify-content: flex-start;
     margin: 0;
}
 nav ul li a {
     text-align: left;
     width: 100%;
     display: center;
     color: var(--black);
     font-weight: 600;
     margin: 0;
     border-bottom: none;
}
 nav ul li a:hover {
     opacity: 1;
}
 #why-saif .flex-item {
     padding-top: 35px;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: row;
     flex-direction: row;
     -ms-flex-align: center;
     align-items: center;
     text-align: left;
}
 #why-saif .flex-item img {
     width: 85px;
     -webkit-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
     height: 100%;
     padding-right: 15px;
}
 #how-it-works .container > p {
     margin: 15px auto 0 auto;
     max-width: 860px;
}
 #how-it-works .container {
     text-align: center;
}
 #how-it-works ol {
     list-style-type: none;
     margin-left: 0;
     padding: 0;
}
 #how-it-works ol > li {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-direction: row;
     flex-direction: row;
     -ms-flex-align: center;
     align-items: center;
     padding: 0 10px;
     width: 100%;
     max-width: 400px;
     margin-top: 50px;
     counter-increment: counter;
}
 #how-it-works ol > li p {
     width: 100%;
     max-width: 275px;
     text-align: left;
     padding-left: 15px;
}
 #how-it-works ol > li:before {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     font-size: 2.5em;
     content: counter(counter);
     font-weight: bold;
     background-color: var(--black);
     color: white;
     border-radius: 50%;
     width: 75px;
     height: 75px 
}
 #how-it-works ol:first-child {
     counter-reset: counter;
}
 #how-it-works .button {
     margin-top: 20px;
}
 #why-needed {
     text-align: left;
}
 #why-needed .container p {
     margin: auto;
     margin-top: 15px;
     max-width: 860px;
}
 #why-needed .flex-item {
     width: auto;
     padding: 0;
     margin-top: 50px;
     text-align: left;
}
 #why-needed .testimonial {
     margin: auto;
     margin-top: 35px;
}
 #whats-covered .flex-item {
     width: auto;
     display: flex;
     flex-direction: column;
     background: #fff;
     border: 1px solid #000;
     border-radius: 5px;
     margin: 1%;
     padding: 20px;
     flex-basis: 30%;
     align-self: baseline;
     min-height: 225px;
     text-align: left;
}
 #whats-covered .flex-item img {
     height: 65px;
     width: 65px;
     text-align: left;
}
 #whats-covered h4{
     margin-top: 1rem;
     margin-bottom: 1rem;
}
 #get-your-quote {
     background: #5f6a7c;
}
 #get-your-quote .container {
     padding: 0;
     max-width: 1000px;
}
 #get-your-quote h3 {
     color: #fff;
     font-size: 37px;
     text-align: center;
     font-family: var(--font-header-semibold);
}
 #get-your-quote .flex{
     align-items: center;
}
 #about-saif .title {
     margin-top: 50px;
}
 #about-saif .title, #about-saif p {
     text-align: left;
}
 #about-saif .flex {
     -webkit-box-orient: vertical;
     -webkit-box-direction: normal;
     -ms-flex-direction: column;
     flex-direction: column;
     text-align: left;
     width: auto;
}
 #about-saif iframe {
     max-width: 100%;
     height: 315px;
     width: 100%;
     display: block;
     margin: auto;
     position: relative;
     z-index: 2;
}
 #about-saif .flex-item {
     margin: auto;
     width: 100%;
}
 #about-saif .flex-item .button {
     margin-top: 20px;
}
 #about-saif-video {
     height: 315px;
     width: auto;
     position: relative;
     max-width: 100%;
}
 #about-saif-video .loader-container {
     position: absolute;
     left: 50%;
     top: 50%;
     -webkit-transform: translate(-50%, -50%);
     -ms-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
     z-index: 1;
}
 #about-saif-video img {
     position: absolute;
     top: 0;
     left: 0;
     height: 315px;
     width: 100%;
     -o-object-fit: cover;
     object-fit: cover;
     max-width: 100%;
     z-index: 0;
}
 #faq .accordion__item {
     border: 1px solid #000;
     border-radius: 50px;
     padding: 30px 40px;
     background: #f9f9f9;
     margin: 35px 0;
     box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}
 #faq .accordion__item .accordion__title {
     position: relative;
}
 #faq .accordion__item .accordion__title .accordion__title-text {
     font-family: var(--font-header-semibold);
     font-size: 30px;
}
 #faq .accordion__title:hover{
     cursor: pointer;
}
 #faq .accordion__item .accordion__content {
     height: 0px;
     overflow: hidden;
     font-size: 20px;
     -webkit-transition:height, 0.5s linear;
     -moz-transition: height, 0.5s linear;
     -ms-transition: height, 0.5s linear;
     -o-transition: height, 0.5s linear;
     transition: height, 0.5s linear;
}
 #faq .accordion__item .accordion__content.accordion-active {
     margin-top: 15px;
     -webkit-transition:height, 0.5s linear;
     -moz-transition: height, 0.5s linear;
     -ms-transition: height, 0.5s linear;
     -o-transition: height, 0.5s linear;
     transition: height, 0.5s linear;
}
 .accordion__item .accordion__title .accordion__arrow {
     position: absolute;
     top: 0;
     right: 0;
     display: inline-block;
     vertical-align: middle;
     width: 30px;
     height: 30px;
     text-align: center;
     color: #000;
     line-height: 30px;
     font-size: 30px;
     font-weight: 700;
     margin-right: 5px;
     -webkit-transition: all 0.2s ease-out;
     transition: all 0.2s ease-out;
}
 .accordion__item .accordion__title.accordion-active .accordion__arrow {
     transform: rotate(180deg);
}
@media screen and (min-width: 360px) and (max-width: 767px){
    .testimonial img {
         width: 100% !important;
         height: auto;
    }
    #whats-covered .flex{
        display: block;
    }
    #get-your-quote{
        text-align: center;
        padding: 1px 0 38px 0;
    }
    #faq .accordion__item .accordion__title .accordion__title-text{
        display: block;
        max-width: 85%;
    }
}

 @media (min-width: 768px) {
     .button {
         width: auto;
    }
     .flex {
         display: -webkit-box;
         display: -ms-flexbox;
         display: flex;
    }
     #why-needed .flex-item {
         width: 50%;
         padding: 0 20px;
    }
     #about-saif .title {
         margin-top: 0;
    }
     #about-saif iframe {
         display: block;
         margin: auto;
         height: 315px;
    }
     #about-saif .flex-item {
         margin: 0 auto;
         text-align: left;
         width: 100%;
    }
     #about-saif .flex-item:first-child {
         margin-top: 70px;
    }
     #about-saif .flex {
         -webkit-box-orient: horizontal;
         -webkit-box-direction: normal;
         -ms-flex-direction: row;
         flex-direction: row;
    }
    #faq .accordion__item .accordion__title .accordion__title-text{
        display: block;
        max-width: 90%;
    }
}
 @media (min-width: 1024px) {
     :root {
         --header-height: 80px;
    }
     nav {
         display: block;
    }
     nav ul li {
         margin: 15px 0;
    }
     nav ul li a {
         padding: 10px;
         margin: 0 15px;
         border-bottom: 3px solid transparent;
         -webkit-transition: border-bottom 300ms ease-in-out;
         transition: border-bottom 300ms ease-in-out;
    }
     nav ul li a:hover {
         border-bottom: 3px solid var(--dark-gray);
    }
     nav ul li + li {
         border-left: 2px solid var(--light-gray-2);
         border-top: none;
    }
     #tagline, #phone {
         display: -webkit-box;
         display: -ms-flexbox;
         display: flex;
         -webkit-box-align: center;
         -ms-flex-align: center;
         align-items: center;
    }
     #logo img {
         width: 100px;
    }
     header {
         font-size: 1.4em;
    }
     header .container, footer .container {
         -ms-flex-pack: distribute;
         justify-content: space-around;
         padding: 0 100px;
    }
     #about-saif .flex-item:first-child {
         margin-right: 20px;
    }
}
 @media screen and (max-width: 1200px) {
     #hero .title {
         font-size: 30px;
    }
}
 @media screen and (max-width: 768px) {
     section .container {
         max-width: 90%;
    }
     #hero {
         height: auto;
    }
     #hero .heroimg {
         display: none;
    }
     #hero .hero-content {
         max-width: 90%;
         width: 90%;
         margin: auto;
    }
}
 .hidden {
     visibility: hidden;
}
 .fade-in {
     -webkit-animation: fadeIn 1s forwards;
     animation: fadeIn 1s forwards;
}
 @-webkit-keyframes fadeIn {
     from {
         opacity: 0;
    }
     to {
         opacity: 1;
    }
}
 @keyframes fadeIn {
     from {
         opacity: 0;
    }
     to {
         opacity: 1;
    }
}
 @-webkit-keyframes spin {
     0% {
         -webkit-transform: rotate(0deg);
         transform: rotate(0deg);
    }
     100% {
         -webkit-transform: rotate(360deg);
         transform: rotate(360deg);
    }
}
 @keyframes spin {
     0% {
         -webkit-transform: rotate(0deg);
         transform: rotate(0deg);
    }
     100% {
         -webkit-transform: rotate(360deg);
         transform: rotate(360deg);
    }
}