@import url('https://fonts.googleapis.com/css?family=Khand:400,600|Libre+Franklin:300');
html { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; }
body {overflow-x: hidden;}

/*** bootstrap flexbox hack ***/
.vertical-align {
  display: flex;
  flex-direction: row;
}
.vertical-align > [class^="col-"],
.vertical-align > [class*=" col-"] {
  display: flex;
  align-items: center;     /* Align the flex-items vertically */
  justify-content: center; /* Optional, to align inner flex-items
                              horizontally within the column  */
}
/* Extra small devices (767px and down) */
@media (max-width: 767px) {
    .row.vertical-align {
        display: block; /* Turn off the flexible box layout */
    }
}
/*** end of bootstrap flexbox hack ***/

.blue, .name {color:rgb(61, 88, 116);}
.bluebg {background-color:rgb(61, 88, 116);color:white;}
.yellow {color:rgb(234, 187, 61);}
.yellowbg {background-color:rgb(234, 187, 61);}
.graybg {background:rgb(231,233,225);}
.light-graybg {background: #f6f5f3;}

.brown {color:#38332c}
.lbrown {color:#968f84}
.beige {color:#ddd7ce}

body {display:block;font-family:'Libre Franklin', sans-serif;color:#38332c; }
a:hover, a:focus {text-decoration:none;}

h1, h2 {background:#38332c; color:#ddd7ce;padding:3px 5px;display:inline-block;margin:0;margin-bottom:1px;font-family:'Khand', serif;}
h1, h2, h3 {font-family:'Khand', serif; padding-bottom: 0px;}
h2 {font-size:2em;}

#join .bluebg { min-height: 560px; }
.dl, #join [type=submit] {background:rgb(234, 187, 61);display:inline-block;padding:7px 15px;color:#38332c;font-family:'Khand', serif;font-weight:500;}
.dl:hover {color:#fff;}
.dl .octicon {font-size:1.4em;position:relative;left:2px;top:-4px;margin:-2px;display:inline-block;padding-top:7px;vertical-align:middle;}
.dl.large {font-size:2em;text-transform:uppercase;padding:10px 20px;margin:10px;}

.dl-bar { color: rgb(221, 215, 206); }
.dl-bar:hover { color: rgb(221, 215, 206); text-decoration: underline; }

.alert {text-center;top:0;left:0;width:100%;z-index:10;text-align:center;color:white;background:rgb(61,88,116);margin:0;
box-shadow:0 -3px 6px -3px rgba(0,0,0,.5) inset, 0 3px 6px -3px rgba(0,0,0,.5) inset;max-height:0px;overflow:hidden;padding:0;transition:all .3s;}
.alert .overlay {opacity:.5;}
.alert p {font-size:1.5em;}
.alert.show {padding:20px;max-height:100px;}


header {width:100%;z-index:1;font-family:'Khand', serif;padding:0;margin:0;margin-bottom:-68px;font-size:1.2em;/*overflow-x:hidden;*/position:relative;}
header .main-logo {max-width:200px; /** logo temp **/ max-height: 50px; margin-top: 7px;}
header .col-md-8, header .col-md-4 {position:relative;}
header .col-md-8:after {content:'';position:absolute;top:0;right:-1985px;height:68px;width:2000px;background:rgba(61, 88, 116, .7);}
header .col-md-4 {background:rgba(61, 88, 116, .7);height:68px;padding-right:0}
header .col-md-4:after {content:'';background:rgba(61, 88, 116, .7);height:68px;width:15px;position:absolute;right:-15px;}
header .col-md-4:before {content:'';background:rgba(61, 88, 116, .7);height:68px;width:2000px;position:absolute;left:-2000px;}
header .left-trick, header .gap-fill {position:relative;background:rgba(61, 88, 116, .7)}
header .left-trick {float:left;height:68px;width:20px;margin-bottom:-20px;}
header .gap-fill {overflow:hidden;height:68px;margin-bottom:-20px;}

.firefox header .col-md-8:after,
.firefox header .col-md-4,
.firefox header .col-md-4:after,
.firefox header .col-md-4:before,
.firefox header .left-trick,
.firefox header .gap-fill { height: 69px; }

header ul {padding:0;margin:0;float:right;line-height:normal;margin-top:-1px;}
header li {display:inline-block;text-transform:uppercase;position:relative;vertical-align:bottom;background:rgba(61, 88, 116, .7);}
header li:last-child {padding-top:12px;padding-bottom:5px}
header li a, header li a:hover {color:white;text-decoration:none;}
header li a {padding:19px 15px 13px;display:inline-block;}
header li a:hover {color: rgb(234, 187, 61);}
header li > .bottom {position:absolute;height:11px;background:rgba(61, 88, 116, .7);width:100%;line-height:normal;}
header li:last-child .bottom {bottom:-11px}
header li.active > .bottom {background:transparent;}
header li.active > .bottom:before {position:absolute;content:'';left:0;top:0;width:50%;height:11px;
    border:11px solid rgba(61,88,116,.7);border-right:11px solid transparent;border-bottom:0;}
header li.active > .bottom:after {position:absolute;content:'';right:0;top:0;width:50%;height:11px;
    border:11px solid rgba(61,88,116,.7);border-left:11px solid transparent;border-bottom:0;}


/*** dropdown ***/
.strt-dropdown-menu {
    position: absolute;
    background: rgba(61, 88, 116, 0.9) !important;
   /* padding: 15px;*/
    z-index: 1000;
    display: none;
}
.strt-dropdown li { background: transparent; }
.strt-dropdown li:last-child { padding-top: 0px; padding-bottom: 0px; }
.strt-dropdown li a { padding: 10px 15px 10px; }
header .strt-dropdown li .template-label { display: none; }

/*** mobile menu ***/
.sra-mobile-menu-container { position: absolute; right: 20px; height: 100%; display: none; cursor: pointer; z-index: 100; }
.sra-mobile-menu-btn { position: absolute; top: 50%; transform: translateY(-50%); right: 0; color: #fff; font-size: 32px;}

.main {min-height:100px;position:relative;}

@media screen and (min-width: 768px) {
    header .strt-dropdown:hover > .strt-dropdown-menu { display: block; }
}

@media screen and (max-width: 767px) {
    header .col-md-4 { text-align: left; }
    header .col-md-4:after { display: none; }
    header .col-md-8:after { display: none; }
    header .sra-mobile-menu-container { display: inline-block; }
    /*header :not(.dl):not(.overlay) { background: rgba(61, 88, 116, .7) !important; }*/
    .main-nav { max-height: 0; transition: 0.4s max-height ease-in; overflow: hidden; }
    .main-nav ul.menu li { display: block; }
    .strt-dropdown-menu { position: static; max-height: 0px; transition: 0.3s max-height ease-in; overflow: hidden;  }}



footer {background:rgb(61, 88, 116);padding:80px 0;color:white;}
footer a, footer a:hover {color:white;text-decoration:none;}
footer h2 {padding:0;background:transparent;color:white;padding-bottom:20px;display:block;}

footer input, footer textarea, footer select {border:1px solid white; background:transparent;}
footer button.dl {border:0;font-size:1.2em;padding:7px 25px; float: right;}
footer p.error {color:rgb(234, 187, 61);text-align:right;display:none;}
footer input.error {border:1px solid red;}
footer input , footer select {width:100%;margin-bottom:10px; padding:7px}
footer textarea {width:100%;margin-bottom:10px;padding:7px;resize:none;height:173px;}
footer select {background-color:rgb(61, 88, 116);}
footer select option{color:rgb(118, 118, 118);}
footer ul {padding:0;margin-left:-10px;}
footer li{display:inline-block;border-left:1px solid white;padding:0 10px;padding-left:10px;text-transform:uppercase;}
footer li:last-child {display:none;}
footer li:first-child {border:0;}

/*** footer nav ***/
footer .footer-nav .strt-dropdown span.octicon { display: none; }
footer .footer-nav .strt-dropdown-menu { display: inline;margin-left: 0px;position: static;padding: 0; }
footer .footer-nav .strt-dropdown-menu li { display: inline-block; }
footer .footer-nav .strt-dropdown-menu li:first-child { border-left: 1px solid #fff; }
footer .footer-nav #strt-about-link,
footer .footer-nav #sra-contact-link { display: none; }
footer .footer-nav li.strt-dropdown { padding-right: 0px; }
footer .footer-nav li.strt-dropdown > a { padding-right: 5px; }
footer .footer-nav li.strt-dropdown li a { padding: 10px 0px 10px; }

.overlay {position:absolute;top:0;left:0;height:100%;width:100%;}
.grid {background:url('grid.png');}
.desaturate {background:rgba(255,255,255,.1)}


/** home page **/

.hero {padding:160px 0 80px;background-image:url('factory.jpg');background-size:cover;background-position:center;position:relative;}
.hero .container {padding:0 7%;}
.hero h1, .hero h2, a {position:relative;}
.hero h1, .hero h2 {font-size:4em;padding: 3px 10px;margin-bottom:3px; padding-bottom: 0px;}
.hero a {font-size:1.8em;margin-top:10px;}

.hero.strt-hero { background-image: url('SRA-website-banner-weaving.jpg'); }

.about h1 {font-size: 36px;}
.about p {padding:20px 10%; line-height:30px; text-align: justify; padding-bottom: 0px;}


.half-blue, .half-yellow {position:relative; padding: 70px 0px;}

.half-blue .col-md-7, .half-yellow .col-md-7, .about {padding:40px;}
.about {padding: 60px 40px;}
.video .col-md-9 {padding:40px 40px 40px 20px;}
.video p {padding:10px 0px 10px 0px;margin-top:7px; line-height:30px;}


.video .factory a {display:block;padding:190px;background-size:cover;background-position:center;}
/*.video .col-md-10 h2 {background:rgba(56,51,44,.7); font-size:3em;margin-top:130px;}*/

.half-blue a, .half-yellow a {background:rgb(61, 88, 116);color:white;}

.half-blue {background-image:url('field.jpg');background-size:cover;background-position:center -100px;}
.half-blue.strt-bg { background-image: url('SRA-website-img-ricefields2.jpg'); background-position: center; }
.half-blue p {background:rgba(255,255,255,.6);padding:35px;margin-top:7px; line-height:30px;}

@media only screen and (max-width: 1170px) {
    .half-blue { background-position:center; }
}

@media only screen and (max-width: 768px) {
	.half-blue { background-position:center; }
}

.half-yellow {position:relative; padding: 50px 0px; background: rgba(234, 187, 61, 1);}
.half-yellow .col-md-7 {background:rgba(234, 187, 61, 1);padding-left:30px; padding-top: 80px; padding-bottom: 50px;}
.half-yellow p {margin-top:20px; line-height:30px; padding:10px 0px 20px 0px}
.half-yellow .screen {background:url('screen.jpg');height:100%;position:absolute;top:0;left:0;z-index:2;background-size:cover;background-position:center;}
.half-yellow .grain {background:url('SRA-website-img-grains.jpg');height:100%;position:absolute;top:0;left:0;z-index:2;background-size:cover;background-position:center;}


/** sra values */
.sra-values {
    padding: 60px;
    text-align: center;
}

.sra-values-container { display: flex; flex-wrap: wrap; justify-content: center; padding-top: 20px; }
.sra-value-item { }
.sra-value-item .sra-value-icon-block  {
    width: 100px;
    height: 100px;
    margin: 30px;
    background: #e9bc3d;
    position: relative;
}
.sra-value-item .sra-value-icon-block img {
    width: 100%;
    max-width: 80%;
    padding: 10px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}
.sra-value-item p { font-weight: 600; }

/* dev committee page */

.development .hero {background-image:url('harvesting.jpg');background-position:center -100px; text-align: center;}
.about-devcomm { padding: 60px 40px; }
.about-devcomm h2 { font-size: 36px; }
.about-devcomm p {padding:20px 10%; line-height:30px; text-align: justify; padding-bottom: 0px;}
.about-devcomm p a:hover { text-decoration: underline; }

/** about the committee **/
.about-org-numbers { margin: 40px 10% 0px; }
.about-org-numbers:after {clear: both;}
.about-org-numbers > div { width: 20%; }
.about-org-numbers img { background-color:rgb(234, 187, 61); padding: 4px; max-width: 49px; }
.about-org-numbers h4 { font-size: 0.9em; font-weight: 700; width: 100%; margin-left: auto; margin-right: auto;}
.about-org-numbers h4 span { font-weight: 300; }

@media only screen and (max-width: 768px) {
    .about-org-numbers { text-align: left; }
    .about-org-numbers > div { width: 100%; }
    .about-org-numbers div { margin-top: 30px; margin-bottom: 30px; }
    .about-org-numbers h4 {display: inline-block; text-align: left; margin-left: 10px;width: 180px;}
}
@media only screen and (max-width: 480px) {
    .about-org-numbers {margin: 20px 1%; text-align: center;}
    .about-org-numbers h4 {text-align: center; margin-left: auto; display: block;}
}
@media only screen and (max-width:375px) {
    .about p {text-align: left;}
}

/*** logos bar ***/
.about-logo-bar { background: #e7e8e2; padding-top: 30px; padding-bottom: 30px; text-align: center;}
.about-logo-bar img { width: 100%; max-width: 110px; margin: 10px 14px; max-height: 52px; }

/*** logo ticker css ***/
.logo-bar-container  { overflow: hidden; width: 98% !important; max-width: 98% !important; }
.logo-bar-wrapper { width: 6000px;  text-align: left; position: relative; height: 72px;}
#logo-bar-ticker, #logo-bar-ticker2 {
    display: inline-block; width: 2000px; position: relative; text-align: left; position: absolute; top: 0px; left: 0px;
}
#logo-bar-ticker, #logo-bar-ticker2 a { vertical-align: middle; }

@media only screen and (max-width: 1200px) { 
    .about-logo-bar img { max-width: 120px; margin: 10px 20px; } 
    .about-logo-bar .logo-bar-container { width: 98%; max-width: 900px; }
}
@media only screen and (max-width: 992px) { 
    .about-logo-bar img { margin: 10px 20px; }    
}
@media only screen and (max-width: 480px) { 
    .about-logo-bar img { margin: 15px 20px; }    
}
@media only screen and (max-width: 375px) { 
    .about-logo-bar img { margin: 15px 15px; max-width: 100px;}   
}


/** member organization slider **/
.member-orgs {background:#f3f4f0;text-align:center;padding:40px;}
.member-orgs h2 {font-size: 36px;}
.member-orgs p.caveat {font-size: 0.9em; opacity: 0.6;}
.htrt-dc-slider-container {padding: 40px; overflow: hidden; width: 100%;position: relative;margin-left: auto; margin-right: auto; transition: all .5s ease-in-out;}
.htrt-dc-slide-wrapper {width: 100%;transform: translate3d(0,0,0); transition: transform .5s ease-in-out;}
.htrt-dc-slide {padding: 0px 80px; width: 100%; float: left;}
.htrt-dc-slide .htrt-dc-logo {padding: 30px;}
.htrt-dc-slide .htrt-dc-logo img {width: 100%; max-width: 300px;}
.htrt-dc-slide .htrt-dc-info {padding: 30px;text-align: justify; } 
.htrt-dc-slide .htrt-dc-info p {line-height: 1.9} 
.htrt-dc-slide .htrt-dc-info p a {color: #38332c; color: #23527c;}
.htrt-dc-slide .htrt-dc-info p a:hover {color: #38332c; color: #23527c; text-decoration: underline; }
.htrt-dc-slide .htrt-dc-info p span {display: block; margin-top: 10px; font-style: italic; font-weight: 600; font-size: 0.9em;} 
.htrt-dc-slide-arrow {position: absolute;top:50%;transform:translateY(-50%);cursor: pointer;}
.htrt-dc-slide-arrow.left-arrow {left:10px;}
.htrt-dc-slide-arrow.left-arrow img {transform: rotate(-180deg);}
.htrt-dc-slide-arrow.right-arrow {right:10px;}

@media only screen and (max-width:1184px) {
    .htrt-dc-slide {padding: 0px 30px;}
}
@media only screen and (max-width:992px) {
    .row.vertical-align {
        display: block; /* Turn off the flexible box layout */
    }
    .htrt-dc-slider-container {padding: 0px 10px;}
    .htrt-dc-slide {padding-bottom: 0px;}
    .htrt-dc-slide .htrt-dc-logo {padding-bottom: 0px; padding-top: 50px;}
    .htrt-dc-slide .htrt-dc-logo img {width: auto; max-width: none; height: 90px;}
    /*.htrt-dc-slide-arrow {top:16%;}*/
    .htrt-dc-slide-arrow img {width: 30px;}
    .htrt-dc-slide-arrow.left-arrow {left:0px;}
    .htrt-dc-slide-arrow.right-arrow {right:0px;}
}

@media only screen and (max-width:480px) {
    .member-orgs {padding:40px 20px;}
    .htrt-dc-slide .htrt-dc-logo img.long {width: 100%; height: auto;}
    .htrt-dc-slide .htrt-dc-info {padding: 30px 10px 0px 10px; } 
    .htrt-dc-slide-arrow.left-arrow {left:0px;}
    .htrt-dc-slide-arrow.right-arrow {right:0px;}
}

@media only screen and (max-width:375px) {
    /*.htrt-dc-slide-arrow {top:10%;}*/
    .htrt-dc-slide .htrt-dc-info {text-align: left; } 
}

.bios {padding-top:40px;text-align: center;}
.bios .col-md-6,
.bios .col-sm-6,
.bios .col-xs-6 {margin-bottom:0px;text-align:center;}
.bios .member-img {/*padding-bottom:220px;*/border:3px solid rgb(61, 88, 116);width:220px;display:inline-block;margin-bottom:20px;
background-size:cover;background-position:center;}
.bios .member-img img { width: 100%; height: auto; }
.bios .name {font-size:2.5em;font-family:'Khand', sans-serif;font-weight:600}
.bios h3, .bios h4 {margin:0;padding:0;margin-bottom:10px;}
.bios h2 {font-size: 36px;}
.bios h3 {font-family:'Khand';font-size:1.4em;font-weight: 600;margin-bottom: 2px;}
.bios h4 {font-size:1.2em;}
.bios p {text-align:justify; line-height:30px; margin-top:20px; padding-bottom:40px; display: none;}
.bios br {display:none !important;}
.bios .col-md-6,
.bios .col-sm-6,
.bios .col-xs-6 {padding:50px;}
.bios .row:last-child .col-md-6 {/*padding-bottom:0;margin-bottom:0;*/}
.bios .row:last-child p {border-bottom:0;}

.bios-row p span {display: block; margin-top: 10px; font-style: italic; font-weight: 600; font-size: 0.9em;} 
.bios-row {display: flex; flex-direction: row;}
.bios-row div.divider {width: calc(100% - 100px); height: 3px; background: rgb(234, 187, 61);position: absolute; bottom: 50px; left: 50px; display: none !important;}
.bios-row:last-child .divider {display: none;}

/** Updated Bios layout **/
.bios-row { font-size: 0; vertical-align: top; text-align: left; display: flex; flex-direction: row; flex-wrap: wrap; margin-bottom: 50px; }
.bios .strt-org-rep { margin: 0 -1px; padding: 50px 20px; font-size: 14px; display: inline-block; float: none; vertical-align: top; text-align: center; position: relative; }
.bios .strt-org-rep .strt-org-rep-bio-btn { background: #eac745; padding: 6px; font-family: 'Khand'; color: #38332c; font-weight: 700; position: absolute; left: 50%; bottom: 15px; transform: translateX(-50%); display: inline-block; width: 100px; }
.bios .strt-org-rep .strt-org-rep-bio-btn:hover { text-decoration: none; color: #fff; }
.bios .member-img { width: 100%; }
.bios .name { font-size: 2.0em; }
.bios h3 { font-size: 1.2em; }

#strt-org-rep-full-bio { padding-right: 0 !important; }
#strt-org-rep-full-bio .modal-dialog { max-width: 480px; margin: 15px auto; }
#strt-org-rep-full-bio .modal-content { border-radius: unset; }
#strt-org-rep-full-bio .modal-header { padding: 0; position: relative; border-bottom: none; }
#strt-org-rep-full-bio .modal-header .close { position: absolute; top: 10px; right: 15px; z-index: 10; font-size: 2.5em; }
#strt-org-rep-full-bio .modal-body { background: #f6f5f3; text-align: center; padding: 10% 15%; position: relative; }
#strt-org-rep-full-bio .modal-body .full-bio-container { max-width: 350px; margin: 0 auto; }
#strt-org-rep-full-bio .modal-body .member-img img { width: 100%; }
#strt-org-rep-full-bio .modal-body h3.name { font-weight: 700; margin-bottom: 0; font-size: 2.0em; }
#strt-org-rep-full-bio .modal-body h3.title { font-weight: 700; margin-top: 0; margin-bottom: 0; font-size: 1.2em; }
#strt-org-rep-full-bio .modal-body h4.company { font-size: 1.2em; margin-top: 0; }
#strt-org-rep-full-bio .modal-body p.full-bio { text-align: justify; }
#strt-org-rep-full-bio .modal-body p span { display: block; margin-top: 10px; font-style: italic; font-weight: 600; font-size: 0.9em; text-align: left; }
#strt-org-rep-full-bio .modal-body img.full-bio-arrow { max-width: 25px; position: absolute; top: 410px; opacity: 0.7; cursor: pointer; }
#strt-org-rep-full-bio .modal-body img.full-bio-arrow:hover { opacity: 1; }
#strt-org-rep-full-bio .modal-body img.full-bio-arrow.left-arrow { left: 3%; transform: scale(-1);  }
#strt-org-rep-full-bio .modal-body img.full-bio-arrow.right-arrow { right: 3%; }

@media only screen and (max-width: 992px) {
    .bios .row:last-child .col-md-6:nth-child(1) p {/*border-bottom:3px solid rgb(234, 187, 61);*/}
    .bios p {/*padding-bottom: 50px !important; min-height: auto;*/}
}

@media only screen and (max-width: 768px) {
	.bios-row {display: block;}
    .bios-row:last-child .col-md-6:first-child .divider,
    .bios-row:last-child .col-sm-6:first-child .divider,
    .bios-row:last-child .col-xs-6:first-child .divider {display: inline;}
    .bios-row:last-child .col-md-6:last-child .divider,
    .bios-row:last-child .col-sm-6:last-child .divider,
    .bios-row:last-child .col-xs-6:last-child .divider {display: none;}
    .bios .member-img { max-width: 250px; }
}

@media only screen and (max-width:375px) {
    .bios p {text-align: left; } 
}

.co-chairs { background: #fafafa; }
.co-chairs .strt-org-rep h4 { max-width: 246.5px; margin-left: auto; margin-right: auto; }

.join .dl.large {color: #fff; background-color:rgb(61, 88, 116); padding-left: 40px; padding-right: 40px; }
.join .dl.large:hover { background: rgba(61, 88, 116, 0.9); }
.join, .members-must {padding:45px 20px;}
.join h3, .members-must h3 {font-size:2em;text-transform:uppercase;}
.members-must h3 {background:#38332c; color:ddd7ce;padding:3px 5px;display:inline-block;margin:0;margin-bottom:1px;font-family:'Khand', serif;}
.members-must h3 span {margin-left: 0px !important;}
.members-must .row {margin-top:40px;margin-bottom:40px;}
.members-must .text-center .row div {text-align:left;margin-bottom:40px;}
.members-must .text-center {text-align: center;}
.members-must img {background:#38332c;padding:3px;}
.members-must .row span {display:inline-block;max-width:70%;margin-left:20px;text-transform:uppercase;font-family:'Khand', sans-serif;vertical-align:middle;font-weight:600;}
.members-must .row {margin-bottom: 0px !important;}

#join {color:white;font-family:'Khand', sans-serif;}
#join .input {float:right;width:80%;}
#join .input input, #join .input textarea , #join .input select {width:100%;resize:none;border:1px solid white;background:transparent;
    padding:10px;font-family:'Libre Franklin', sans-serif;}
#join .input select{background-color:rgb(61, 88, 116);}
#join .input textarea {height:160px;}
#join .hs-form-field, #join .hs_submit {clear:both;margin-top:20px;}
#join .hs_submit input {border:0;}
#join .hs_submit {text-align:right;padding-top:30px;}
#join label {font-size:1.1em;padding-top:10px;font-weight:400;}
#join .close {color:white;opacity:.9;font-size:2em;}


#logoslider {white-space:nowrap;overflow:hidden;padding:0px 5px;margin-top:60px;margin-bottom:60px;}
#logoslider div {display:inline-block;}
.logo-window {overflow:hidden;width:86%;vertical-align:middle;position:relative;}
.logo-window::after {content:""; height:100%;width:50px; position:absolute;background:linear-gradient(to right, rgba(231, 233, 225, 0), rgb(231,233,225));z-index:50;top:0px;right:0px;}
.logo-window::before {content:""; height:100%;width:50px; position:absolute;background:linear-gradient(to left, rgba(231, 233, 225, 0), rgb(231,233,225));z-index:50;top:0px;left:0px;}

.logoleft svg, .logoright svg {display:inline-block;height:60px;position:relative;top:2px;vertical-align:middle;}
.logoleft,.logoright {width:7%;height:80px;cursor:pointer;text-align:center;}
.logocont {position:relative;left:0px;}
.logoanimleft {transition:left 1.8s;}
.logo {margin:0 40px 0px;height:160px; width:200px;background-position:center;background-repeat:no-repeat;background-size:contain}




@media only screen and (max-width:992px){
    body {font-size:14px;}
    body p {font-size:1.2em;}
    body h2 {font-size:5em;}
    body .dl {font-size:2.6em;}

    header a {font-size:1.5em!important;}
    header{background:rgb(61, 88, 116);text-align:center;}
    header ul {text-align:center;float:none;margin:0;padding:0;z-index:3;position:relative;}
    header *:not(.dl):not(.overlay) {background:transparent;}
    header .overlay {z-index:-1;}
    header .gap-fill, header .left-trick {display:none;}
    header .bottom:after, header .bottom:before {display: none;}
    header { font-size: 0.9em; }
    header .container { width: 100%; }
    header .col-md-4:after,
    header .col-md-8::after { background: transparent; }

    .about p {padding: 20px 0%;}

    .half-yellow, .half-blue {font-size:.7em;}
    .members-must .row span {max-width:60%;}
    footer button.dl {float: left;}
}

@media only screen and (max-width:600px){
    .hero h1 { background: rgba(56, 51, 44, 0.9); }
    .members-must .row span {max-width:100%; width: 100%; margin-left: 0px; margin-top: 10px;}
    .members-must h3 span {width: auto !important; margin-top: 0px !important;}
}


/* YT VID */
.vidlink.vid-image div {padding-bottom: 56.2%;background-position: center;background-size: 100%;line-height:100%;position:relative;height:0px;}
.vidlink.vid-image div:after {content:'';width:30px;height:30px;background:blue;position:absolute;top:0px;left:0px;
  width:100%;height:100%;background:rgba(0,0,0,.4);z-index:1;}
.vidlink.vid-image i {height:0px;display:block;vertical-align:middle;padding-top:40px;padding-top: calc(28% - 60px);font-size:120px;position:relative;z-index:2;color:rgba(255,255,255,.8);}


.lp_overlay, .yt-overlay {position:fixed;top:0;left:0;z-index:10;background:rgba(0,0,0,.8);width:100%;height:100%;text-align:center;display:none;color:white;overflow:scroll;}
.lp_overlay>div, .yt-overlay>div {display:inline-block;width:40%;background:#42444F;padding:20px;border-radius:10px;margin-top:60px;position:relative;}
#lp_overlay input {width:80%;display:block;margin:15px auto;font-size:18px;padding:4px;border-radius:5px;border:1px solid gray;}
.lp_overlay .xbut, .yt-overlay .xbut {position:absolute;right:20px;top:20px;color:white;cursor:pointer;}
.lp_overlay iframe, .yt-overlay iframe {margin-top:120px;}
#lp_vid>p {color:white;margin-top:5px;}

/*** Dev Committee Testimonials ***/
.testimonials { display: flex; flex-direction: row; }
.testimonials h2 { text-transform: uppercase; margin-bottom: 20px; font-size: 36px; }
.testimonials .strt-quote-img { background-image: url(SRA-website-img-palmoil.jpg); background-size: cover; background-position: center; }
.testimonials .strt-quote-info-container { padding: 80px 120px;  }
.testimonials .strt-quote-info { position: relative; z-index: 0; }
.testimonials .strt-quote-info .strt-quote-bg { position: absolute; max-width: 120px; bottom: -50px; right: -50px; z-index: -1; }
.testimonials .strt-quote-info p { line-height: 2; }
.testimonials .strt-quote-info h3 { line-height: 1; font-size: 1.2em; color: #3f5876; margin-bottom: 0; font-weight: 700; font-family: "Libre Franklin", sans-serif; }
.testimonials .strt-quote-info h4 { line-height: 1; font-weight: 700; font-size: 1.0em; margin-bottom: 7px; margin-top: 6px; }
.testimonials .strt-quote-info h5 { line-height: 1; font-size: 1.0em; margin-top: 0; padding-right: 120px; }

.testimonials .strt-quote-arrow { position: absolute; top: 50%; transform: translateY(-50%); cursor: pointer; }
.testimonials .strt-quote-arrow.left-arrow { left: -70px; }
.testimonials .strt-quote-arrow.right-arrow { right: -70px; }
.testimonials .strt-quote-slider-container { overflow: hidden; width: 100%; position: relative; margin-left: auto; margin-right: auto; transition: all .5s ease-in-out; }
.testimonials .strt-quote-slider-container .strt-quote-slide-wrapper { width: 100%; transition: 0.5s ease all; }
.testimonials .strt-quote-slide-wrapper .strt-quote-slide { width: 100%; float: left; }

@media screen and (max-width: 991px) {
    .testimonials { display: block; }
    .testimonials .strt-quote-img { display: none; }
    .testimonials .strt-quote-info .strt-quote-bg { opacity: 0.6; }
}

@media screen and (max-width: 768px) {
    .testimonials .strt-quote-info-container { padding: 80px 15%; }
    .testimonials .strt-quote-info .strt-quote-bg { right: 0; }
    .testimonials .strt-quote-info h5 { padding-right: 0;}
    .testimonials .strt-quote-arrow.left-arrow { left: -15%; }
    .testimonials .strt-quote-arrow.right-arrow { right: -15%; }
}

/* Mailchimp Form Css */

.mailchimp-contact-form{
    padding: 0px 0px;
    margin: 0px auto;
    background-color: transparent !important;
}
.mailchimp-contact-form form{
    margin: 0px !important;
}
.mailchimp-contact-form .form-heading{
    display:block;
    width:100%;
}
.mailchimp-contact-form .form-heading h2{
    font-size: 28px !important;
    background-color: transparent;
    color: #000;
    margin-left: 10px !important;
}
.mailchimp-contact-form .indicates-required{
    display:none;
}
.mailchimp-contact-form .helper_text{
    background-color:transparent !important;
}
.mailchimp-contact-form .mc-field-group.message_field{
    width:96% !important;
}
.mailchimp-contact-form .mc-field-group.message_field input{
    min-height:140px !important;
}
.mailchimp-contact-form .mc-field-group{
    width: 47% !important;
    display: inline-grid !important;
    margin: 0px 10px !important;
    padding-bottom: 6px !important;
    font-family:'Libre Franklin', sans-serif;
}
.mailchimp-contact-form .mc-field-group label{
    margin-bottom:7px !important;
}
.mailchimp-contact-form .mc-field-group input , 
.mailchimp-contact-form .mc-field-group select{
    min-height:40px;
    border-radius: unset !important;
}
.mailchimp-contact-form .mc-field-group select{
    width:100% !important;
    background-color: rgb(61, 88, 116);
    color: #fff;
    border: 1px solid #ABB0B2;
}
.mailchimp-contact-form .mc-field-group.news-check ul li{
    display:flex !important;
    align-items:center;
    border-left:0px !important;
}
.mailchimp-contact-form .mc-field-group.news-check ul li input{
    width:17px !important;
}
.mailchimp-contact-form .mc-field-group.news-check ul li label{
    margin: 4px 0px 0px 8px !important;
}
.mailchimp-contact-form .form-submit-btn{
    text-align:right;
    width: 95%;
    margin: 0px auto;
}
#mc_embed_signup_footer .button{
    clear: both;
    background-color: #aaa;
    border: 0 none;
    border-radius: 4px;
    transition: all 0.23s ease-in-out 0s;
    color: #FFFFFF;
    cursor: pointer;
    display: inline-block;
    font-size: 15px;
    font-weight: normal;
    height: 32px;
    line-height: 32px;
    margin: 0 5px 10px 0;
    padding: 0 22px;
    text-align: center;
    text-decoration: none;
    vertical-align: top;
    white-space: nowrap;
    width: fit-content;
}
.mailchimp-contact-form .form-submit-btn input{
    min-height: 40px;
    border-radius: unset !important;
    background-color: rgb(234, 187, 61) !important;
    color:#141414 !important;
    font-family:'Libre Franklin', sans-serif;
}
@media screen and (max-width: 1024px) {
    .mailchimp-contact-form{
        max-width: 100%;
        width: 100% !important;
    }
    .mailchimp-contact-form .mc-field-group{
        width: 45% !important;
        margin: 0px 10px;
    }
}

/* Mailchimp Popup Form */
.popup-contact-form{
    width: 100% !important;
    background-color: transparent !important;
}
.popup-contact-form form{
    margin:0px !important;
}
.popup-contact-form .helper_text{
    padding:0px !important;
}
.popup-contact-form .mc-field-group.message_field input{
    min-height:80px;
}
.popup-contact-form .mc-field-group{
    font-family:'Libre Franklin', sans-serif;
    padding-bottom:7px !important;
}
.popup-contact-form .mc-field-group label , 
.popup-contact-form .mc-field-group strong{
    color:#fff;
}
.popup-contact-form .mc-field-group input , 
.popup-contact-form .mc-field-group select{
    min-height:35px;
    border-radius: unset !important;
    border-color:#fff !important;
    color: #141414 !important;
}
.popup-contact-form .mc-field-group.news-check strong{
    font-size: 1.1em;
    padding-top: 10px;
    font-weight: 400;
}
.popup-contact-form .mc-field-group.news-check ul li{
    display:flex !important;
    align-items:center;
}
.popup-contact-form .mc-field-group.news-check ul li input{
    width:17px !important;
}
.popup-contact-form .mc-field-group.news-check ul li label{
    margin: 4px 0px 0px 8px !important;
    padding-top:0px !important;
}
.popup-contact-form .form-submit-btn{
    text-align:right;
    width: 100%;
    margin: 0px auto;
}
.popup-contact-form .form-submit-btn input{
    min-height: 40px;
    border-radius: unset !important;
    background-color: rgb(234, 187, 61) !important;
}

/* Mailchimp Popup Form */
.news_popup_card{
    position: fixed;
    top: unset;
    bottom:-520px;
    right: 20px;
    box-shadow: 0px 10px 10px #000 !important;
    z-index: 10000 !important;
    background-color:transparent;
    transition:0.4s linear;
}
.news_popup_card_open{
    top:unset !important;
    transition:0.4s linear;
    bottom:0px;
}
.news_popup_card .news_popup_close{
    color: #fff;
    display: block;
    float: right;
    font-size: 22px;
    line-height: 14px;
    font-weight: 400;
    text-decoration: none!important;
    font-family: Helvetica,Arial,sans-serif!important;
    vertical-align: middle;
    cursor: pointer;
    position: absolute;
    margin: auto;
    top: -28px !important;
    right: 0px !important;
    background: rgba(0, 0, 0, 0.5);
    padding: 7px;
}
.subscribe-contact-form{
    width:100% !important;
    max-width:300px;
    margin:0px auto;
    /*padding:50px 0px;*/
}
.subscribe-contact-form form{
    margin:0px !important;
    background-color:#eabc3e;
}
.title-area{
    background-color: rgba(61,88,116,1);
    color: #fff;
    /*padding: 20px 10px;*/
    position:relative;
}
.top-image img{
    width:100%;
}
.title-area::after {
    top: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-top-color: inherit;
    border-width: 150px;
    border-top-width: 30px;
    margin-left: -150px;
    color:rgba(61,88,116,1);
}
.title-area h2{
    padding: 5px !important;
    font-size: 28px !important;
    margin: 20px 10px 0px 10px !important;
}
.title-area p{
    margin:0px !important;
    padding: 10px 10px;
    font-size: 17px;
    line-height: 20px;
    
}
.subscribe-contact-form .helper_text{
    display:none !important;
}
.all-fields-container{
    padding: 45px 10px 10px 10px;
}
.mc-field-group{
    margin:0px !important;
    width:100% !important;
}
.subscribe-contact-form input , .subscribe-contact-form select{
    height:37px;
    border-radius:0px !important;
}
.subscribe-form-btn{
    padding-bottom:15px;
}
.subscribe-form-btn input{
    width: 92% !important;
    margin: 0px 10px !important;
    background-color:rgba(61,88,116,1) !important;
    height:37px !important;
    border-radius:0px !important;
    text-transform:uppercase;
}


/* Mailchimp Feedback Form Css */

.mailchimp-feedback-form{
    padding: 0px 0px;
    margin: 0px auto;
    background-color: transparent !important;
    width: 100% !important;
}
.mailchimp-feedback-form form{
    margin: 0px !important;
}
.mailchimp-feedback-form .form-heading{
    display:block;
    width:100%;
}
.mailchimp-feedback-form .form-heading h2{
    font-size: 28px !important;
    background-color: transparent;
    color: #000;
    margin-left: 10px !important;
}
.mailchimp-feedback-form .indicates-required{
    display:none;
}
.mailchimp-feedback-form .helper_text{
    background-color:transparent !important;
}
.mailchimp-feedback-form .mc-field-group.message_field{
    width:100% !important;
}
.mailchimp-feedback-form .mc-field-group.message_field input{
    min-height:110px !important;
}
.mailchimp-feedback-form .mc-field-group{
    width: 49% !important;
    display: inline-grid !important;
    margin: 0px 2px !important;
    padding-bottom: 6px !important;
    font-family:'Libre Franklin', sans-serif;
}
.mailchimp-feedback-form .mc-field-group label{
    margin-bottom:7px !important;
}
.mailchimp-feedback-form .mc-field-group input , 
.mailchimp-feedback-form .mc-field-group select{
    min-height:40px;
    border-radius: unset !important;
}
.mailchimp-feedback-form .mc-field-group select{
    width:100% !important;
    color: #000;
}
.mailchimp-feedback-form .mc-field-group.news-check ul li{
    display:flex !important;
    align-items:center;
}
.mailchimp-feedback-form .mc-field-group.news-check ul li input{
    width:17px !important;
}
.mailchimp-feedback-form .mc-field-group.news-check ul li label{
    margin: 4px 0px 0px 8px !important;
}
.mailchimp-feedback-form .form-submit-btn{
    text-align:right;
    width: 100%;
    margin: 0px auto;
}
.mailchimp-feedback-form .form-submit-btn input{
    min-height: 40px;
    border-radius: unset !important;
    background-color: rgb(234, 187, 61) !important;
    color:#141414 !important;
    font-family:'Libre Franklin', sans-serif;
    width:100% !important;
}
@media screen and (max-width: 1024px) {
    .mailchimp-feedback-form{
        max-width: 100%;
        width: 100% !important;
    }
    .mailchimp-feedback-form .mc-field-group{
        width: 48.5% !important;
        margin: 0px 10px;
    }
}
@media screen and (max-width: 767px) {
.mailchimp-feedback-form .mc-field-group.message_field{
    width:100% !important;
}
.podcast-sec .play-icon {
    width: 40%;
}
.listen-here h6{
    margin: 5px;
    font-size: 8px !important;
}
}

/* Thankyou page Css */

.tahnkyou-section{
    padding:80px 0px 80px 0px;
    max-width: 1170px;
    margin: 0px auto;
}
.tahnkyou-section p{
    font-size: 18px;
    padding-top: 20px;
}
.tahnkyou-section .backHome-btn{
    margin-top:40px;
}
.tahnkyou-section .backHome-btn a{
    background-color: #eac745;
    padding: 10px 14px;
    min-height: 50px;
    height: 50px;
    display: inline-flex;
    align-items: center;
    color: #141414;
    font-size: 17px;
    font-weight: 700;
}
.tahnkyou-section .backHome-btn:hover a{
    color:#fff;
}
@media screen and (max-width: 991px) {
    .about-content{
     /*   margin:20px;*/
        

}
}
@media screen and (max-width: 1024px) {
    .tahnkyou-section{
        max-width: 550px;
}
}


.strt-container {
    position: relative;
    width: 100%;
    overflow-x:hidden; 
}

.podcast-sec p {
    padding-left: 0 !important;
    padding-right: 0;
}
.podcast-sec .about-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 12px;
}
.social-left{
    padding-right: 50px !important;
}
.listen-here h6{
    font-weight: 600;
    font-size: 12px;
    color: #000;
}

.strt-dropdown-submenu {
    position: absolute;
    background: rgba(61, 88, 116, 0.9) !important;
    z-index: 1000;
    display: none;
    width: 100%;
    left: 100%;
    top: 0px;
    
}

ul.strt-dropdown-menu li {
    padding-right: 15px;
    padding-left: 15px;
}

.strt-dropdown li a {
    display: flex;
}

.octicon-chevron-right:after {
    content: "\f078";
}

.octicon-chevron-right:before {
    display: none !important;
}

.submenu-li:hover .strt-dropdown-submenu{ display: block;}

@media screen and (max-width: 768px) {
.strt-dropdown-submenu {
    background-color: #384c60 !important; 
    position: initial;
}

}