/* fonts */

@font-face {
    font-family: 'Barlow Condensed Bold';
    src: local('Barlow Condensed Bold'), url('../fonts/Barlow Condensed Bold/Barlow Condensed Bold.woff2') format('woff2');
}

@font-face {
    font-family: 'Barlow Condensed Medium';
    src: local('Barlow Condensed Medium'), url('../fonts/Barlow Condensed Medium/barlow-condensed-v4-latin-regular.woff2') format('woff2');
}

@font-face {
    font-family: 'Barlow Medium';
    src: local('Barlow Medium'), url('../fonts/Barlow Medium/Barlow Medium.woff2') format('woff2');
}

@font-face {
    font-family: 'DIN 2014';
    src: local('DIN 2014'), url('../fonts/DIN 2014/DIN 2014.woff2') format('woff2');
}

@font-face {
    font-family: 'DIN 2014 Bold';
    src: local('DIN 2014 Bold'), url('../fonts/DIN 2014 Bold/DIN 2014 Bold.woff2') format('woff2');
}

@font-face {
    font-family: 'Festivo Letters No1 Regular';
    src: local('Festivo Letters No1 Regular'), url('../fonts/Festivo Letters No1 Regular/Festivo Letters No1 Regular.woff2') format('woff2');
}

@font-face {
    font-family: 'proximanova bold';
    src: local('ProximaNova Bold'), url('../fonts/proximanova bold/ProximaNova-Bold.woff2') format('woff2');
}

@font-face {
    font-family: 'proximanova regular';
    src: local('ProximaNova Regular'), url('../fonts/proximanova regular/ProximaNova-Regular.woff2') format('woff2');
}

@font-face {
    font-family: 'proximanova medium';
    src: local('ProximaNova Light'), url('../fonts/proximanova medium/ProximaNova-Light.woff2') format('woff2');
}

@font-face {
    font-family: 'proximanova semibold';
    src: local('ProximaNova Semibold'), url('../fonts/proximanova semibold/ProximaNova-Semibold.woff2') format('woff2');
}


/* Honeypot/referrer fields / css */

input.ghost,
textarea.ghost {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}


/* ends */


/* #indexwholesecwrapper {
    background: linear-gradient(180deg, #FCD646 35%, white 0%);
} */


/* .indexpad {
    padding: 300px;
    background-color: #FCD646;
    position: absolute;
    width: 100%;
    z-index: -111;
} */

.navbarsectionwrap {
    background-color: #003366;
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 999;
    left: 0;
}

.tellstorysectionback {
    background-image: url(../assets/images/AMERICANED_UCLACOMM_001@2x.png), url(../assets/images/blue.png);
    position: fixed;
    top: 10%;
    left: 0px;
    background-repeat: no-repeat, no-repeat;
    background-size: 70% 100%, 30% 100%;
    width: 100%;
    z-index: -1;
    background-position: top right, top left;
    height: 100%;
}

.tellstorysectioninnerback {
    background-color: #E6B800;
    padding: 20px;
    position: fixed;
    bottom: 0;
    z-index: -1;
    width: 100%;
}

.navlinkwrap {
    justify-content: flex-end;
    width: 100%;
}

.navlinkwrap a {
    color: #FAFAFA;
    font-size: 17px;
    font-family: 'proximanova regular';
    padding-left: 0.25rem !important;
    padding-right: 0.25rem !important;
}

.navlinkwrap a i {
    font-size: 21px;
}

.navsocialicon {
    align-self: center;
    color: #FAFAFA;
    margin-left: 10px;
}

.belownav {
    padding: 3px;
    background-color: #205BB9;
}

.navbar-brand {
    width: 300px;
    color: #ffffff;
    font-size: 44px;
    font-family: 'Barlow Condensed Medium';
    padding-bottom: 0;
}

.navbar-brand:hover {
    color: #ffffff;
}

.navbar-brand strong {
    font-family: 'Barlow Condensed Bold';
    background-color: #D84919;
    border-radius: 5px;
    padding: 2px;
    margin: 0 3px;
}

.navbar-brand strong:after {
    content: '';
    position: absolute;
    bottom: 0;
    /* left: 17%; */
    width: 0;
    height: 0;
    border: 25px solid transparent;
    border-top-color: #D84919;
    border-bottom: 0;
    border-left: 0;
    margin-left: -36.5px;
    margin-bottom: -6px;
}

.navbarinnersec {
    max-width: 1100px;
    margin: 0 auto;
}

.nav-item {
    padding: 0 10px;
}

.main-hero-image-wrap {
    background-image: url(../assets/images/AMERICANED_SUTTON_054@2x.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top left;
    width: 100%;
    z-index: -1;
    position: fixed;
    height: 100%;
    top: 10%;
}

.heroimagesecinnerwrap {
    text-align: left;
}

.outerherotextwrap {
    position: relative;
    max-width: fit-content;
    padding: 30px 60px 30px 15px;
}

.innerherotextwrap {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 5px;
    left: -5px;
    z-index: -1;
    background-color: #ffffff;
    opacity: 20%;
    mix-blend-mode: soft-light;
}

.innerherotextwrap1 {
    background-color: #ffffff;
    opacity: 40%;
    mix-blend-mode: soft-light;
    width: 100%;
    height: 100%;
    position: absolute;
    top: -20px;
    left: -30px;
    z-index: -1;
}

.herroinnersecwrap {
    padding: 15% 1% 3%;
}

.mainindexheader {
    font-size: 100px;
    color: #205BB9;
    font-family: 'Barlow Condensed Medium';
}

.mainindexheader strong {
    font-family: 'Barlow Condensed Bold';
}

.herroinnersecwrap p {
    font-size: 28px;
    font-family: 'proximanova regular';
    margin-bottom: 10px;
}

.herroinnersecwrap p span {
    font-family: 'proximanova bold';
}

.herroinnersecwrap button {
    padding: 5px 49px;
    margin-bottom: 20px;
    border: 0;
    background-color: #205BB9;
    font-family: 'proximanova semibold';
    font-size: 26px;
    color: #FAFAFA;
}

.storycardsecwrap {
    max-width: 1000px;
    margin: 0 auto;
}

.storycardimage {
    width: 325px;
    height: 325px;
    overflow: hidden;
    cursor: pointer;
    ;
}

.actionformdiv {
    cursor: pointer;
    background-color: lightgrey;
    max-width: 100%;
    margin: 0 auto;
}

.cardoverlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 15px 0px 0px 10px;
    opacity: 0;
    transition: .5s opacity ease-in-out;
    background: rgb(0 51 102 / 85%);
    mix-blend-mode: multiply;
    display: flex;
    align-items: flex-end;
    padding-bottom: 20px;
}

.cardtext {
    color: white;
    max-width: 250px;
    margin: 0px auto;
    font-size: 15px;
    position: absolute;
    bottom: 0;
    opacity: 0;
    left: 0;
    align-items: flex-end;
    padding-bottom: 20px;
    right: 0;
    transition: .5s opacity ease-in-out;
}

.cardgetlinkref strong i {
    vertical-align: middle;
}

.cardtext:hover {
    opacity: 1;
}

.cardtext p {
    margin-bottom: 0;
}

.cardtext p:nth-child(1) {
    font-family: 'proximanova bold';
    font-size: 25px;
    line-height: 0.4;
}

.cardtext p:nth-child(2) {
    font-family: 'proximanova regular';
    font-size: 21px;
}

.cardtext p:nth-child(3) {
    font-family: 'proximanova medium';
    font-size: 16px;
    margin-bottom: 0;
    -webkit-line-clamp: 5;
    position: relative;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

.cardtext a {
    display: block;
    color: #ffffff;
    text-decoration: none;
    font-family: 'proximanova bold';
    font-size: 18px;
}

.cardtext a strong span {
    vertical-align: middle;
    padding-left: 5px;
}

.cardtext a:hover {
    text-decoration: none;
    color: #ffffff;
}

.actionoverlay {
    background: lightgrey;
    height: 100%;
    padding: 27%;
}

.actiontext {
    color: white;
    font-size: 45px;
    height: 310px;
    text-align: center;
    background-color: #D84919;
    padding: 15% 30%;
}

.nostorieswrap {
    color: white;
    height: 310px;
    display: flex;
    align-items: center;
    font-size: 29px;
    margin-top: 20px;
    text-align: center;
    background-color: #D84919;
    cursor: pointer;
}

.nostorydefaultcardcss {
    justify-content: center;
}

.cardimagewrapper {
    width: 332px;
    height: 325px;
    overflow: hidden;
    margin: 15px 10px;
}

.storycardimage:hover img,
.storycardimage:focus img {
    -webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    transform: scale(1.3);
    transition: 0.5s ease-in-out;
}

.storycardimageaction {
    align-self: flex-end;
    padding: 0px 0px 0px 10px;
}

.storycardimage:hover .cardoverlay {
    opacity: 1;
}


/* 
.storycardimage:hover img {
   
} */

.actionoverlay2 {
    background: lightgrey;
    height: 100%;
    padding: 27%;
}

.actiontext2 {
    color: white;
    font-size: 45px;
    height: 310px;
    background-color: #003366;
    padding: 15% 30%;
    font-family: 'proximanova regular';
    cursor: pointer;
    text-align: center;
}


/* .actiontext2 p:nth-child(1) {
    color: #FAFAFA;
    font-size: 24px;
    
    margin-bottom: 0;
}

.actiontext2 p:nth-child(2) {
    color: #D84919;
    font-size: 24px;
    font-family: 'proximanova bold';
} */

.actionformdiv2 {
    max-width: 100%;
    margin: 0 auto;
}

.storycardimageaction2 {
    align-self: flex-end;
    padding: 0px 0px 0px 10px;
}

.storysharebutton1 {
    text-align: center;
    font-weight: 500;
    cursor: pointer;
    background-color: #205BB9;
    padding: 20px;
}

.storysharebutton1 p {
    margin-bottom: 0;
    color: #FFFFFF;
    font-size: 22px;
    font-family: 'proximanova medium';
    font-weight: 600;
}

.storysharebutton2 p {
    margin-bottom: 0;
    color: #FFFFFF;
    font-size: 21px;
    font-family: 'proximanova medium';
    font-weight: 600;
}

.storysharebutton2 {
    padding: 21px 0px;
    background-color: #205BB9;
    text-align: center;
    font-weight: 500;
    cursor: pointer;
}

.cardbutton1 {
    padding: 0px 7px 0px 8px;
}

.cardbutton2 {
    padding: 0px 7px 0px 8px;
}


/* #tellyourstorycard{
    display: none;
} */

.indexformwrap {
    max-width: 900px;
    margin: 0 auto;
    background-color: #FAFAFA;
}

.indexformouterwrap {
    padding: 70px 0 30px;
    max-width: 700px;
    margin: 30px auto;
}

.innersignupsec {
    display: none;
    background-color: #205BB9;
    text-align: center;
    padding: 10px;
    width: 100%;
    z-index: 99;
    -webkit-animation: slide-down .3s ease-out;
    -moz-animation: slide-down .3s ease-out;
}

#signupid {
    margin-bottom: 0;
}

#signupid input {
    border: 1px solid #d3d3d3;
    display: inline-flex;
    padding: 5px;
}

#signupid button {
    border: none;
    background-color: #FCD646;
    display: inline-flex;
    padding: 4px 30px 5px;
    margin-left: -5px;
    font-family: 'Barlow Condensed Medium';
    font-weight: 600;
    color: #003366;
    font-size: 18px;
}

#signupid .spanx {
    float: right;
    padding-right: 10px;
    font-weight: 500;
    cursor: pointer;
    color: #FAFAFA;
    font-size: 24px;
}

label[for="signup"] {
    color: #FAFAFA;
    font-family: 'DIN 2014';
}

label[for="signupfooter"] {
    color: #FAFAFA;
    font-size: 18px;
    font-family: 'proximanova medium';
}

.innersignupfootersec {
    text-align: center;
    padding: 10px;
    width: 100%;
    z-index: 99;
}

#signupidfooter {
    margin-bottom: 0;
    text-align: end;
}

#signupidfooter input {
    border: 2px solid #E6B800;
    display: inline-flex;
    padding: 5px;
    background-color: transparent;
}

#signupidfooter button {
    border: 1px solid #E6B800;
    background-color: #E6B800;
    display: inline-flex;
    padding: 6px 30px;
    margin-left: -6px;
    font-weight: 600;
    color: #003366;
    font-size: 16px;
}

#indexformsubmitbutton {
    border: 0;
    background-color: #D84919;
    color: #FFFFFF;
    font-size: 20px;
    font-family: 'proximanova semibold';
    padding: 5px 30px;
    font-weight: 600;
}

.footercontainerpad {
    padding: 0;
}

.regiontab {
    align-items: center;
    justify-content: center;
    color: #000000;
    font-size: 16px;
    font-family: 'proximanova semibold';
}

#myTabContent .tab-pane {
    opacity: 1;
}

.mobile-region-dropdown {
    display: none;
}


/* .innerregion {
    
} */

.innerregion a {
    color: #000000;
    font-size: 16px;
    font-family: 'proximanova semibold';
    border: 1px solid #D84919;
    margin: 0 5px;
    padding: 3px 15px;
}

.innerregion a:hover {
    text-decoration: none;
}

.innerregion .active {
    background-color: #D84919;
    color: #ffffff;
}

#ccvideos_section {
    background-color: rgba(255, 255, 255, 20%);
    margin: 40px 0 25px;
    padding: 20px;
}

.ccvideos_index_header {
    font-size: 28px;
    font-family: 'proximanova bold';
    color: #000000;
}

.ccvideos_index_desc {
    font-size: 15px;
    color: #000000;
    font-family: 'proximanova regular';
}

.ccvideos_listen_but {
    background-color: #D84919;
    color: #ffffff;
    font-family: 'proximanova regular';
    border-radius: 1px;
    border: none;
    font-size: 16px;
    padding: 5px 10px;
}


/* polling_results_section.css */

#polling_results_section {
    background-color: rgba(255, 255, 255, 20%);
    margin: 40px 0 25px;
    padding: 20px 5px;
}

.polling_results_index_header {
    font-size: 25px;
    font-family: 'proximanova bold';
    color: #000000;
}

.polling_results_index_desc {
    font-size: 15px;
    color: #000000;
    font-family: 'proximanova regular';
}

.polling_results_but {
    background-color: #D84919;
    color: #ffffff;
    font-family: 'proximanova regular';
    border-radius: 1px;
    border: none;
    font-size: 16px;
    padding: 5px 10px;
    width: 100%;
}


/* end of index.css */


/* community-conversations.css */

.communityconversationssecwrap {
    background-color: #E6B800;
}

.communityconversationsouterwrap {
    padding: 170px 0px 30px;
}

.communityconversationsinnersecwrap {
    max-width: 925px;
    margin: 0 auto;
    position: relative;
    padding: 40px 34px 40px 56px;
}

.communityconversationtextbox1 {
    background-color: #ffffff;
    opacity: 20%;
    mix-blend-mode: soft-light;
    width: 100%;
    height: 100%;
    position: absolute;
    top: -30px;
    left: -30px;
}

.communityconversationtextbox2 {
    background-color: #ffffff;
    opacity: 40%;
    mix-blend-mode: soft-light;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0;
}

.communityconversationsinnersecwrap h3 {
    font-size: 42px;
    font-family: 'proximanova regular';
    color: #000000;
}

.communityconversationsinnersecwrap p {
    margin-bottom: 10px;
    font-size: 20px;
    font-family: 'proximanova regular';
    color: #000000;
}

.ccvsiteinrosection {
    background-color: #F5F5F5;
    padding: 50px 0 10px;
}

.ccvinnersectionwrap {
    max-width: 930px;
    margin: 0 auto;
}

.ccv_individual_wrap h3 {
    font-size: 28px;
    font-family: 'proximanova bold';
    color: #000000;
    margin-bottom: 0;
}

.ccv_individual_wrap p {
    font-size: 16px;
    font-family: 'proximanova regular';
    color: #000000;
    margin-bottom: 0;
}

.ccv_individual_wrap span {
    font-size: 20px;
    font-family: 'proximanova regular';
    color: #000000;
}

.ccvarrow {
    color: #000000;
    opacity: 43%;
    font-family: 'proximanova bold' !important;
    font-size: 16px !important;
    cursor: pointer;
}

.ccvarrow i {
    font-size: 10px;
    margin-left: 4px;
}

.ccvindividualsectionwrap {
    margin-bottom: 80px;
}


/* end of community-coversations.css */


/* edupollingdata.css */

.pollingdatainnermaxwrapper {
    max-width: 1000px;
    margin: 0 auto;
}

.pollingdatasecwrap {
    background-color: #E6B800;
}

.pollingdataouterwrap {
    padding: 170px 0px 30px;
}

.pollingdatainnersecwrap {
    max-width: 925px;
    margin: 0 auto;
    position: relative;
    padding: 40px 34px 40px 56px;
}

.pollingdatatextbox1 {
    background-color: #ffffff;
    opacity: 20%;
    mix-blend-mode: soft-light;
    width: 100%;
    height: 100%;
    position: absolute;
    top: -30px;
    left: -30px;
}

.pollingdatatextbox2 {
    background-color: #ffffff;
    opacity: 40%;
    mix-blend-mode: soft-light;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0;
}

.pollingdatainnersecwrap h3 {
    font-size: 42px;
    font-family: 'proximanova regular';
    color: #000000;
}

.pollingdatainnersecwrap p {
    margin-bottom: 10px;
    font-size: 20px;
    font-family: 'proximanova regular';
    color: #000000;
}

.pollingdatasiteinrosection {
    background-color: #F5F5F5;
    padding: 50px 0;
}

.pollinginnersectionwrap {
    max-width: 930px;
    margin: 0 auto;
}

.pollingdata_individual_wrap h3 {
    font-size: 28px;
    font-family: 'proximanova bold';
    color: #000000;
    margin-bottom: 0;
}

.pollingdata_individual_wrap p {
    font-size: 16px;
    font-family: 'proximanova regular';
    color: #000000;
    margin-bottom: 0;
}

.pollingdata_individual_wrap span {
    font-size: 20px;
    font-family: 'proximanova regular';
    color: #000000;
}

.pollingdataarrow {
    color: #000000;
    opacity: 43%;
    font-family: 'proximanova bold' !important;
    font-size: 16px !important;
    cursor: pointer;
}

.pollingdataarrow i {
    font-size: 10px;
    margin-left: 4px;
}

.pollingdatasectionwrap {
    margin-bottom: 80px;
}

.pollingdataindividualsectionwrap {
    max-width: 960px;
    margin: 0px auto 80px;
}

.carousel-inner {
    max-width: 900px;
    margin: 0 auto;
}

.pollingdataheader {
    padding: 10px 0px 15px;
    max-width: 900px;
    margin: 0 auto;
}

.pollingdataheader h2 {
    font-family: 'proximanova bold';
    font-size: 28px;
    margin-bottom: 0;
}

.pollingdataheader span {
    font-family: 'proximanova regular';
    font-size: 16px;
}

.fa-arrow-left,
.fa-arrow-right {
    color: #FFFFFF;
    font-weight: 900;
    font-size: 20px;
    background-color: #000000;
    padding: 5px;
    border-radius: 50%;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
    opacity: 1;
    background-image: none;
    width: auto;
    height: auto;
}

.carousel-control-prev,
.carousel-control-next {
    opacity: 1;
}


/* end of edupollingdata.css */


/* about.css */


/* #aboutwholesecwrapper {
    background: linear-gradient(180deg, #FCD646 24%, white 0%);
} */

.aboutheroimagesecinnerwrap {
    background-color: #E6B800;
}

.aboutherroinnersecwrap {
    max-width: 1000px;
    margin: 0 auto;
    position: relative;
    padding: 40px 58px;
}

.abouttextbox1 {
    background-color: #ffffff;
    opacity: 20%;
    mix-blend-mode: soft-light;
    width: 100%;
    height: 100%;
    position: absolute;
    top: -30px;
    left: -30px;
}

.abouttextbox2 {
    background-color: #ffffff;
    opacity: 40%;
    mix-blend-mode: soft-light;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0;
}

.siteinrosection {
    background-color: #F5F5F5;
    padding-top: 50px;
}

.firstsiteinnerwrap {
    padding: 30px 30px 50px;
    min-height: 450px;
}

.firstsiteimage img {
    width: 300px;
    margin-bottom: 10px;
}

.firstsitedesc a {
    color: #FFFFFF;
    padding: 10px;
    background-color: #003366;
    text-decoration: none;
    font-size: 18px;
    font-family: 'proximanova semibold';
    font-weight: 600;
}

.firstsitedesc p {
    font-family: 'proximanova regular';
    font-size: 18px;
    color: #000000;
}

.secondsiteinnerwrap {
    min-height: 450px;
    padding: 30px 30px 50px;
}

.secondsitedesc p {
    font-family: 'proximanova regular';
    font-size: 18px;
    color: #000000;
}

.secondsitedesc .mtt-3 {
    margin-top: 3%;
}

.secondsitedesc a {
    color: #FFFFFF;
    padding: 10px;
    background-color: #003366;
    text-decoration: none;
    font-size: 18px;
    font-family: 'proximanova semibold';
    font-weight: 600;
}

.secondsiteimage img {
    width: 300px;
    margin-bottom: 10px;
}

.aboutherrooutersecwrap {
    padding: 170px 0px 30px;
}

.aboutherroinnersecwrap p {
    margin-bottom: 10px;
    font-size: 18px;
    font-family: 'proximanova regular';
    color: #000000;
}

.aboutherroinnersecwrap h3 {
    font-size: 42px;
    font-family: 'proximanova regular';
    color: #000000;
}

.aboutherroinnersecwrap h3 span {
    font-size: 42px;
    font-family: 'proximanova regular';
    color: #000000;
}

.aboutherroinnersecwrapbutton {
    background-color: #205BB9;
    border: none;
    padding: 5px 30px;
    font-size: 24px;
    color: #FAFAFA;
    font-family: 'proximanova semibold';
    margin-bottom: 20px;
}

.sitewrap {
    max-width: 1000px;
    margin: 0 auto;
}

.firstsitewrap {
    padding-left: 0;
    margin-bottom: 10px;
}

.guidelinessectionwrapper {
    background-color: #F5F5F5;
    padding-bottom: 50px;
}

.guidelines-innersection-wrap {
    padding: 50px 80px;
    background-color: #FFFFFF;
}

.guidelinessection {
    max-width: 1000px;
    margin: 0 auto;
}

.innerguidelinessection h5 {
    size: 18px;
    font-family: 'DIN 2014 Bold';
}

.innerguidelinessection p {
    size: 16px;
    font-family: 'DIN 2014';
    color: #020202;
}

.hrsec {
    max-width: 1100px;
    margin: 0 auto;
    background-color: #CCCCCC;
}


/* end of about.css */


/* story-form-css */

.backgroundcolorsec {
    z-index: -1;
    /* background: linear-gradient(180deg, #205BB9 36%, white 0%); */
    background-color: #205BB9;
    padding: 42% 0 0;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
}

.belowbackgroundcolorsec {
    background-color: #FCD646;
    padding: 10px;
    width: 100%;
}

.story-header {
    padding: 90px 0 40px;
}

.story-header h3 {
    font-family: 'proximanova regular';
    font-size: 42px;
    color: #FFFFFF;
}

.story-header p {
    font-family: 'proximanova regular';
    font-size: 18px;
    color: #FFFFFF;
}

.storyforminnerwrap {
    max-width: 1000px;
    margin: 0 auto;
    background-color: #f3f1f1;
    padding: 40px 0;
    margin-bottom: 100px;
}

.story-form-label {
    display: block;
    font-weight: 700;
    font-family: 'proximanova regular';
    margin-top: 10px !important;
    margin-bottom: 0 !important;
}

#blue-section #submit-wrapper .story-form-submit,
#blue-section .submit-wrapper .story-form-submit {
    width: 300px;
    height: 55px;
    background-color: darkgreen;
    color: white;
    font-family: "din-2014", sans-serif;
    font-style: normal;
    font-weight: 800;
    margin: 1.5rem auto 1.5rem auto;
    padding: .75rem;
    font-size: 1.1rem;
    border-radius: 4px;
    border: none;
}

#story-form-left-wrapper .story-form-label,
#story-form-right-wrapper .story-form-label {
    display: block;
    font-weight: 700;
    font-family: 'proximanova regular';
    margin-top: 10px !important;
    margin-bottom: 0 !important;
}

#story-form-left-wrapper input {
    border: 1px solid #003366;
    height: 35px;
}

#story-form-left-wrapper select option:nth-child(1) {
    color: #717171;
}

#story-form-left-wrapper select {
    color: #717171;
}

#story-form-right-wrapper textarea {
    border: 1px solid #003366;
}

#story-form-left-wrapper input[type=checkbox],
input[type=radio] {
    background-color: white;
}

#story-form-bottom-wrapper label {
    font-size: 14px;
    font-weight: 700;
}

#form-area {
    width: 100%;
    height: auto;
    margin: 0 auto 0 auto;
    text-align: center;
    padding: 0 0 0 0;
    background-color: transparent;
}

#form-wrapper {
    width: 1040px;
    height: auto;
    margin: 0 auto 0 auto;
    padding-top: 1rem;
    text-align: center;
    border: none;
}

#form-wrapper input.story-form-field,
#form-wrapper select {
    width: 310px;
    text-align: left;
    font-size: 13px;
    line-height: 23px;
    margin: 0.2rem 0 0.75rem 0;
    border: thin solid grey;
}

#form-wrapper textarea.story-form-field {
    width: 300px;
    height: 530px;
    text-align: left;
    font-size: 13px;
    line-height: 23px;
    margin: 0.2rem 0 0.2rem 0;
    border: thin solid grey;
}

#form-wrapper .story-form-label.checkbox-label {
    margin: 0.2rem 0 0.75rem 0;
}

#form-wrapper form .form-section-wrapper {
    display: inline-block;
    width: 310px;
}

#form-wrapper form #story-form-left-wrapper {
    float: left;
}

#form-wrapper form #story-form-right-wrapper {
    float: right;
}

#form-wrapper form #story-form-bottom-wrapper {
    clear: both;
    width: 110%;
    height: auto;
    text-align: left;
    padding-top: 1rem;
    overflow: auto;
}

#form-wrapper form #story-form-bottom-wrapper #submit-wrapper,
#form-wrapper form #story-form-bottom-wrapper .submit-wrapper {
    width: 100%;
    text-align: center;
    padding: 1rem auto 0 auto;
}

#form-wrapper form #story-form-bottom-wrapper #submit-wrapper #story-form-submit,
#form-wrapper form #story-form-bottom-wrapper .submit-wrapper #story-form-submit {
    width: 175px;
    height: 30px;
    background-color: darkgreen;
    color: #ffffff;
    font-style: normal;
    margin: 6.5rem auto 1.5rem auto;
    font-size: 1.1rem;
    clear: both;
    border: none;
    display: block;
}

#form-wrapper form #story-form-bottom-wrapper label {
    float: left;
    overflow: auto;
}

.story-form-sec {
    max-width: 800px;
    margin: 0 auto;
}

.story-form-field {
    width: 100%;
}

#story .story-form-field {
    height: 100%;
}

#story-form-right-wrapper #story {
    height: 95%;
}

.cardheadshotshadow1 {
    position: absolute;
    top: -45px;
    left: 18px;
    background: #003366;
    width: 100%;
    height: 100%;
    opacity: 18%;
    mix-blend-mode: soft-light;
}

.cardheadshotshadow2 {
    position: absolute;
    top: -22px;
    left: 40px;
    background: #003366;
    width: 100%;
    height: 100%;
    mix-blend-mode: soft-light;
    opacity: 41%;
}

#story-form-left-wrapper select {
    border: 1px solid #003366;
    appearance: none;
    -webkit-appearance: none;
    padding: 5px;
    width: 100%;
    background-color: #ffffff;
    background-size: 10px !important;
    background-image: url('../assets/images/Double_Arrows-512.png');
    background-position: calc(100% - .5rem), 100% 0;
    background-size: 1.5em 1.5em;
    background-repeat: no-repeat;
}

#submit-wrapper {
    margin-top: 20px;
}

#submit-wrapper button {
    background-color: #D84919;
    color: #ffffff;
    font-family: 'proximanova regular';
    padding: 5px 50px;
    border-radius: 1px;
    border: none;
    font-size: 16px;
    font-weight: 700;
}

#imagefile {
    background-color: #ffffff;
}

#videofile {
    background-color: #ffffff;
}

.innerctasignupsec {
    background-color: lightgrey;
    padding: 50px;
    text-align: center;
}

.innerfooterwrap {
    background-color: #003366;
}

.storycardsectionwrapper {
    padding-bottom: 60px;
}

.footerlogohead a {
    color: #FFFFFF;
    font-size: 35px;
    font-family: 'Barlow Condensed Medium';
    text-decoration: none;
    text-transform: uppercase;
}

.abouttellstorybutton {
    position: inherit;
}

.footerlogohead a:hover {
    text-decoration: none;
    color: #FFFFFF;
}

.footerlogohead a strong {
    font-family: 'Barlow Condensed Bold';
    background-color: #D84919;
    border-radius: 5px;
    padding: 2px;
    margin: 0 3px;
}

.footerlogohead a strong:after {
    content: '';
    position: absolute;
    bottom: 0;
    /* left: 17%; */
    width: 0;
    height: 0;
    border: 18px solid transparent;
    border-top-color: #D84919;
    border-bottom: 0;
    border-left: 0;
    margin-left: -23.5px;
    margin-bottom: -12px;
}

.termpolicysec p {
    margin-bottom: 0;
    color: #FFFFFF;
    font-family: 'proximanova bold';
    font-size: 14px;
}

.footertopsec {
    max-width: 1100px;
    margin: 0px auto 10px;
}

.secondsecfooter {
    padding: 40px 0 20px;
    max-width: 1100px;
    margin: 0 auto;
}

.footerhr {
    margin: 0;
    color: #CCCCCC;
    background-color: #CCCCCC;
}

.innerguidelinessection i {
    font-family: 'DIN 2014';
    margin-bottom: 5px;
}

.webuildlink a {
    margin-bottom: 0;
    text-decoration: underline;
    color: #FFFFFF;
    font-family: 'DIN 2014 Bold';
}

.footernavlist {
    list-style-type: none;
    margin-left: 15px;
}

.footernavlist a {
    color: #FAFAFA;
    font-size: 16px;
    padding: 0 5px;
    text-decoration: none;
    font-family: 'proximanova regular';
}

.footernavlist a i {
    font-size: 21px;
}


/* 
.footernavbar-header a {
    color: #000000;
    text-decoration: none;
} */

.footernavbar-header {
    display: flex;
}

.footernavul {
    display: flex;
    padding-left: 0;
}

#consent-share-story {
    margin-right: 5px;
}

#consent-communications {
    margin-right: 5px;
}

#consent-tos {
    margin-right: 5px;
}


/* story-form-css-ends */


/* new iframe storybank-css */

#storybankiframeform {
    height: 1100px;
    width: 100%;
}

#flyoverclose {
    color: #ffffff;
    pointer-events: visible;
    cursor: pointer;
    padding: 5px;
    opacity: 1;
}

.modal-body {
    padding: 0;
    border: none;
}

.modal-content {
    background-color: #ffffff00;
    border: none;
    border-radius: 0;
}

.modal-header {
    border: none;
    background-color: #003366;
}


/*end of new iframe storybank-css */


/* tell elected officials.css */

.tellofficialbackgroundcolorsec {
    z-index: -1;
    /* background: linear-gradient(180deg, #205BB9 36%, white 0%); */
    background-color: #FCD646;
    padding: 42% 0 0;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
}

.storyformsectionwrapper {
    padding-top: 100px;
}

.tellofficial-header {
    max-width: 700px;
    margin: 0 auto;
    padding: 150px 0 5px;
}

.tellofficial-header h3 {
    font-family: 'proximanova regular';
    font-size: 40px;
    color: #000000;
}

.tellofficial-header p {
    font-family: 'proximanova regular';
    font-size: 18px;
    color: #000000;
    margin-bottom: 0;
}

.tellofficialforminnerwrap {
    max-width: 750px;
    margin: 0 auto;
    background-color: #f3f1f1;
    padding: 40px 0;
    margin-bottom: 100px;
}

#electedofficiaform .form-row .form-group input {
    border: 1px solid #003366;
}

#electedofficiaform .form-group textarea {
    border: 1px solid #003366;
    color: #020202;
}

#electedofficiaform select {
    border: 1px solid #003366;
    appearance: none;
    -webkit-appearance: none;
    padding: 5px;
    width: 100%;
    background-color: #ffffff;
    /* border-radius: 5px; */
    background-size: 10px !important;
    background-image: url('../assets/images/Double_Arrows-512.png');
    background-position: calc(100% - .5rem), 100% 0;
    background-size: 1.5em 1.5em;
    background-repeat: no-repeat;
}

.form-control {
    border-radius: 0;
}

.successformoutersec {
    background-color: #FCD646;
    max-width: 900px;
    margin: 0 auto;
    padding: 100px 0;
}

.successformoutersec p:nth-child(1) {
    font-size: 90px;
    margin-bottom: 30px;
    text-align: center;
    margin: 0;
    color: #003366;
    font-family: 'Barlow Condensed Medium';
    font-weight: 600;
}

.successformoutersec p:nth-child(2) {
    font-size: 40px;
    text-align: center;
    margin: 0;
    color: #003366;
    font-family: 'Barlow Condensed Medium';
}

.storyformicons a {
    color: #003366;
}

.storyformicons a:hover {
    color: #003366;
}

#successstoryformsec {
    display: none;
}

.upliftstoriesbackgroundwrap {
    background-color: #E6B800;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    z-index: -1;
}

.successupliftformoutersec {
    background-color: #205BB9;
    max-width: 900px;
    margin: 0 auto;
    padding: 100px 0;
}

.successupliftformoutersec p:nth-child(1) {
    font-size: 90px;
    margin-bottom: 30px;
    text-align: center;
    margin: 0;
    color: #FCD646;
    font-family: 'Barlow Condensed Medium';
    font-weight: 600;
}

.successupliftformoutersec p:nth-child(2) {
    font-size: 40px;
    text-align: center;
    margin: 0;
    color: #FFFFFF;
    font-family: 'Barlow Condensed Medium';
}

.successupliftformicons a {
    color: #FFFFFF;
    margin-left: 10px;
}

.successupliftformicons a:hover {
    color: #FFFFFF;
}

#successupliftformsec {
    display: none;
}


/* stories.css */

.storiesahrebutton {
    display: inline-block;
    padding: 5px 20px;
    color: #FAFAFA;
    font-size: 20px;
    background-color: #D84919;
    font-family: 'proximanova semibold';
    margin-top: 20px;
}

.storiessocial {
    color: #FAFAFA;
    text-decoration: none;
}

.storiessocial:hover {
    color: #FAFAFA;
    text-decoration: none;
}

.storiessocial i {
    color: #FAFAFA;
    text-decoration: none;
    padding-left: 5px;
}

.storieswholesecwrapper {
    background-color: #F5F5F5;
    ;
    /* padding: 15%;
    position: fixed;
    z-index: -1;
    background-color: #003366;
    width: 100%;  */
}

.storiesdetailswrapper {
    background-color: #003366;
}

.storiesinnerdetailswrapper {
    padding: 160px 0 35px;
}

.storiesinnerdetailswrapper .container {
    max-width: 900px;
}

.storysecwrapper {
    max-width: 900px;
    margin: 0 auto;
    padding: 40px 0 0;
}

.storysecwrapper h3 {
    max-width: 400px;
    margin-bottom: 20px;
}

.storiesfn {
    font-family: 'proximanova regular';
    font-size: 42px;
    color: #FAFAFA;
}

.storiesln {
    font-family: 'proximanova regular';
    font-size: 60px;
    color: #FAFAFA;
}

.storiescity {
    font-family: 'proximanova regular';
    font-size: 30px;
    color: #FAFAFA;
}

.storiesstate {
    font-family: 'proximanova regular';
    font-size: 30px;
    color: #FAFAFA;
}

.storiestitle {
    font-family: 'proximanova regular';
    font-size: 20px;
    color: #FAFAFA;
    max-width: 400px;
    margin: 0;
    opacity: 0.8;
    line-height: 1.2;
}

.lineheightp {
    line-height: 0.7;
}

.storiessharebutton {
    padding-bottom: 50px;
    text-align: center;
    margin-top: 35px;
}

.storiessharebutton .storiesviewmore {
    padding: 10px 50px;
    border: 0;
    background-color: #205BB9;
    font-family: 'proximanova semibold';
    font-size: 22px;
    color: #FAFAFA;
    font-weight: 600;
}

.storyvideosec {
    padding-bottom: 40px;
}

.storiessharebutton .storiesviewmore:hover {
    color: #FAFAFA;
    text-decoration: none;
}


/* end of stories.css */


/* ccv-fullcards.css */

.ccvstoriesouterwrapper {
    background-color: #F5F5F5;
}

.cvvstorysecwrapper {
    max-width: 900px;
    margin: 0 auto;
    padding: 170px 0 55px;
}

.ccvstoriesouterwrapper {
    background-color: #F5F5F5;
}

.cvvstoryinnersecwrap h3 {
    font-family: 'proximanova bold';
    font-size: 28px;
    margin-bottom: 0;
}

.cvvstoryinnersecwrap span {
    font-family: 'proximanova regular';
    font-size: 20px;
    margin-bottom: 10px;
}

.cvvstoryinnersecwrap p {
    font-family: 'proximanova regular';
    font-size: 16px;
}

.ccvcardarrow {
    font-family: 'proximanova bold'!important;
    font-size: 16px !important;
    color: #000000;
    opacity: 43%;
    cursor: pointer;
}

.ccvcardarrow i {
    font-size: 12px;
    padding-top: 50px;
    margin-right: 4px;
}


/* end of cvv-fullcards.css */


/* other.css */

#signupid input::placeholder {
    color: #000000;
}

.navbar-toggler-icon {
    display: contents;
    color: #FAFAFA;
    font-size: 34px;
}

#mobilenav {
    height: 100%;
    top: 0;
    position: fixed;
    width: 100%;
    z-index: 999999;
    background-color: #003366;
}

.mobilenavlinkwrap {
    text-align: center;
    padding: 0;
}

.mobilenavlinkwrap .navitems {
    list-style: none;
    list-style-type: none;
    padding: 0 0 20px;
}

.mobilenavlinkwrap .navitems .navlinks {
    list-style: none;
    list-style-type: none;
    color: #FAFAFA;
    font-size: 24px;
    font-family: 'proximanova regular';
    text-decoration: none;
}

.innermobilewrap {
    text-align: center;
    margin: 120px 0 20px;
    border-bottom: 5px solid #205BB9;
    position: relative;
}

.innermobilewrap .navbar-brand {
    margin-right: 0;
}

.mobilecloseicon i {
    font-size: 34px;
    color: #ffffff;
    position: absolute;
    right: 10px;
    top: 20px;
}

.innersocialicon {
    color: #FAFAFA;
    text-decoration: none;
    font-size: 21px;
}

.innersocialicon:hover {
    color: #FAFAFA;
    text-decoration: none;
}

.innersocialicon i {
    color: #FAFAFA;
    text-decoration: none;
    font-size: 24px;
}

#mobilenav {
    display: none;
}

.herroinnersecwrap p {
    color: #081856;
    font-weight: 600;
}

.mobilesharebuttonswrap {
    display: none;
}

#viewmorecards {
    display: none;
    margin-bottom: 10px;
}


/* #story-form-bottom-wrapper input:checked:after  */

*:focus {
    outline: none !important
}

input[type="checkbox"] {
    -webkit-appearance: none;
    background-color: #ffffff !important;
    border: 1px solid #003366 !important;
    /* box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05); */
    padding: 7px;
    margin: -2px 5px;
    border-radius: 3px;
    display: inline-block;
    position: relative;
    height: fit-content;
    margin-top: 5px;
}

input[type="checkbox"]:active {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px 1px 3px rgba(0, 0, 0, 0.1);
}

input[type="checkbox"]:checked:active {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px 1px 3px rgba(0, 0, 0, 0.1);
}

input:checked {
    background-color: #e9ecee;
    border: 1px solid #adb8c0;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05), inset 15px 10px -12px rgba(255, 255, 255, 0.1);
    color: #000000;
}

input:checked:after {
    content: '\2714';
    font-size: 16px;
    position: absolute;
    top: -4px;
    left: 1px;
    color: #99a1a7;
}

#story-form-bottom-wrapper .story-form-label:nth-of-type(odd) {
    display: flex;
}

#story-form-bottom-wrapper .story-form-label:nth-of-type(2) {
    display: flex;
}

.storiesbackgroundcolorsec {
    display: none;
}

.footertopsec {
    padding-top: 20px;
}

.footerlogohead {
    width: 200px;
}

.storiesprofileimg {
    width: 380px;
    height: 380px;
    position: relative;
}

.storiesprofileimg img {
    position: absolute;
}

.storiesprofileimg figcaption {
    font-size: 12px;
    color: #FFFFFF;
    opacity: 52%;
    font-family: 'DIN 2014';
    line-height: 1;
}

.tellofficialbelowbackgroundcolorsec {
    padding: 10px;
    background-color: #205BB9;
}

.mobilesharestories {
    margin-bottom: 10px;
}

.mobileotherstories {
    margin-bottom: 40px;
}


/* other.css ends */


/* thankyou.css */

.storybankthankyousec {
    background-color: #205BB9;
}

.innnerthankyouwrap {
    max-width: 750px;
    margin: 0 auto;
    padding: 200px 0 150px;
}

.innnerthankyouwrap p:first-child {
    color: #FAFAFA;
    font-size: 42px;
    font-family: 'proximanova regular';
    text-align: center;
}

.innnerthankyouwrap p:nth-of-type(2) {
    color: #FAFAFA;
    font-size: 18px;
    font-family: 'proximanova regular';
    text-align: center;
}


/* ends */


/* signup-thankypu.css */

.signupthankyousec {
    background-color: #205BB9;
}

.signupinnnerthankyouwrap {
    max-width: 750px;
    margin: 0 auto;
    padding: 200px 0 150px;
}

.signupinnnerthankyouwrap p:nth-of-type(1) {
    color: #ffffff;
    font-size: 42px;
    font-weight: 700;
    font-family: 'proximanova regular';
    text-align: center;
}

.signupinnnerthankyouwrap p:nth-of-type(2) {
    color: #ffffff;
    font-size: 20px;
    font-family: 'proximanova regular';
    text-align: center;
}

.signupinnnerthankyouwrapbutton {
    text-align: center;
    margin-top: 20px;
}

.signupinnnerthankyouwrapbutton .signupbutton span {
    font-family: 'proximanova semibold';
    color: #FFFFFF;
    font-size: 18px;
    background-color: #D84919;
}

.signupbutton .signupbuttonspan {
    background-color: #D84919;
    display: inline;
    padding: 10px 30px;
}

input.ghost,
textarea.ghost {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

#signupidfooter input {
    color: #FAFAFA;
}

.figurecaption {
    position: absolute;
    bottom: -20px;
    left: 0;
}

.innermobilewrap .navbar-brand {
    width: 250px;
}

.navbar {
    padding-bottom: 0;
}


/* ends */


/* media query */

@media screen and (max-width: 3000px) and (min-width: 2500px) {
    .main-hero-image-wrap {
        top: 4%;
    }
    .tellstorysectionback {
        top: 5%;
    }
}

@media screen and (max-width: 2500px) and (min-width: 1950px) {
    .main-hero-image-wrap {
        top: 5%;
    }
    .tellstorysectionback {
        top: 6%;
    }
}

@media screen and (max-width: 1950px) and (min-width: 1900px) {
    .main-hero-image-wrap {
        top: 8%;
    }
    .tellstorysectionback {
        top: 7%;
    }
}

@media screen and (max-width: 1900px) and (min-width: 1600px) {
    .main-hero-image-wrap {
        top: 9%;
    }
    .tellstorysectionback {
        top: 8%;
    }
}

@media screen and (max-width: 1100px) and (min-width: 1000px) {
    /* index.css */
    .navbarinnersec {
        max-width: 900px;
        margin: 0 auto;
    }
    .storycardsecwrap {
        max-width: 900px;
        margin: 0 auto;
    }
    /* end of index.css */
    /* about.css */
    /* end of about.css */
    /* .heroimagesecinnerwrap{
        max-width: 1000px;
        margin: 0 auto;
    } */
}

@media screen and (max-width: 1000px) and (min-width: 900px) {
    /* index.css */
    .navbarinnersec {
        max-width: 800px;
        margin: 0 auto;
    }
    .storycardsecwrap {
        max-width: 800px;
        margin: 0 auto;
    }
    /* end of index.css */
    /* about.css */
    /* end of about.css */
    /* .heroimagesecinnerwrap{
        max-width: 900px;
        margin: 0 auto;
    } */
    .actiontext2 p:nth-child(1) {
        font-size: 21px;
    }
    label[for="signupfooter"] {
        display: block;
        text-align: center;
    }
}

@media screen and (max-width: 900px) and (min-width: 800px) {
    /* index.css */
    .indexformouterwrap {
        max-width: 300px;
    }
    .navbarinnersec {
        max-width: 700px;
        margin: 0 auto;
    }
    .storycardsecwrap {
        max-width: 700px;
        margin: 0 auto;
    }
    .aboutherroinnersecwrap {
        padding: 10px;
    }
    .guidelinessection {
        padding: 10px;
    }
    /* end of index.css */
    /* about.css */
    /* end of about.css */
    /* story.css */
    .storyformmar {
        margin-left: 5px;
        margin-right: 5px;
    }
    #story-form-bottom-wrapper {
        padding: 10px;
    }
    /* end of story.css */
    /* stories.css */
    .storyinnersecwrap {
        padding: 10px;
    }
    /* end of stories.css */
    /* .heroimagesecinnerwrap{
        max-width: 800px;
        margin: 0 auto;
    } */
    .actiontext2 p:nth-child(1) {
        font-size: 21px;
    }
    .cardoverlay {
        opacity: 1;
    }
    .cardtext {
        opacity: 1;
        max-width: 185px;
    }
    label[for="signupfooter"] {
        text-align: center;
        display: block;
    }
}

@media screen and (max-width: 800px) and (min-width: 600px) {
    #storybankiframeform {
        height: 1440px;
        width: 100%;
    }
    .backgroundcolorsec {
        padding: 71% 0 0;
    }
    .cardoverlay {
        opacity: 1;
    }
    .cardtext {
        opacity: 1;
        max-width: 185px;
    }
    .storyforminnerwrap {
        max-width: 500px;
    }
    .actiontext2 p:nth-child(1) {
        font-size: 21px;
    }
    .story-form-sec {
        max-width: 400px;
    }
    .story-header p {
        padding: 0 30px;
    }
    .footertopsec {
        max-width: 569px;
        margin: 0 auto;
    }
    .innersignupfootersec {
        padding-left: 0;
        text-align: left;
    }
    #signupidfooter {
        text-align: left;
    }
    #signupid #signupname {
        display: none;
    }
    .heroimagesecinnerwrap {
        max-width: 600px;
        margin: 0 auto;
    }
    .firstsitewrap {
        padding-left: 15px;
    }
    .secondsiteinnerwrap {
        min-height: 560px;
    }
    .guidelinessection {
        max-width: 600px;
        margin: 0 auto;
    }
    .footernavul {
        display: block;
    }
    .footernavlist:nth-of-type(1) {
        padding-left: 15px;
    }
    #signupidfooter button {
        margin-top: 5px;
    }
    .navlinkwrap .nav-link {
        padding: 5px !important;
    }
    .indexformwrap {
        max-width: 600px;
    }
    .indexformouterwrap {
        max-width: 500px;
    }
    .tellofficialbackgroundcolorsec {
        padding: 65% 0 0;
    }
    .heroimagesecinnerwrap {
        margin: 0;
    }
    .storycardimageaction2 {
        margin-top: 10px;
        max-width: 325px;
    }
    .storycardimageaction {
        margin-top: 10px;
        max-width: 325px;
    }
    label[for="signupfooter"] {
        display: block;
    }
}

@media screen and (max-width: 600px) and (min-width: 300px) {
    #storybankiframeform {
        height: 1440px;
        width: 100%;
    }
    /* index.css */
    .mobile-region-dropdown {
        display: block;
    }
    .mobileregiontab {
        background-color: #D84919;
        border: 0;
        color: #ffffff;
        padding: 10px 30px;
        font-size: 20px;
        margin-bottom: 15px;
    }
    #myTabContent .tab-pane {
        opacity: 0;
    }
    #myTabContent .active {
        opacity: 1;
        -webkit-animation: fadeIn ease-in-out 0.5s;
        animation: fadeIn ease-in-out 0.5s;
    }
    @-webkit-keyframes fadeIn {
        from {
            opacity: 0;
        }
        to {
            opacity: 1;
        }
    }
    @keyframes fadeIn {
        from {
            opacity: 0;
        }
        to {
            opacity: 1;
        }
    }
    .regiontab {
        margin-bottom: 15px;
        display: none;
    }
    .innerregion {
        margin-bottom: 10px;
    }
    .main-hero-image-wrap {
        background-color: #E6B800;
        background-image: none;
        top: 0;
    }
    .storycardimage img {
        padding: 0 !important;
    }
    .storycardsectionwrapper {
        padding-bottom: 0;
    }
    .outerherotextwrap {
        padding: 10px 20px 10px 10px;
    }
    .navbar {
        padding-bottom: 1px;
    }
    .herroinnersecwrap {
        padding: 40% 1% 10%;
    }
    .abouttextbox2 {
        top: 15px;
        left: 2px;
    }
    .abouttextbox1 {
        top: -15px;
        left: -10px;
    }
    .innerherotextwrap1 {
        background-color: #ffffff;
        opacity: 40%;
        mix-blend-mode: soft-light;
        width: 100%;
        height: 100%;
        position: absolute;
        top: -10px;
        left: -10px;
        z-index: -1;
    }
    .innerherotextwrap {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 5px;
        left: 0px;
        z-index: -1;
        background-color: #ffffff;
        opacity: 20%;
        mix-blend-mode: soft-light;
    }
    .guidelines-innersection-wrap {
        padding: 30px 20px;
    }
    .cardoverlay {
        /* align-items: center; */
        background: rgb(0 51 102 / 70%);
        margin: 15px 0 0 0;
        top: -15px;
        /* height: 100%; */
    }
    .cardimagewrapper {
        width: 100%;
        margin: 0;
        height: 325px;
    }
    .cardtext {
        opacity: 1;
        top: 20px;
        left: 20px;
        max-width: 300px;
        margin: 0 auto;
        line-height: 1.5;
        padding: 30% 0 0;
    }
    .cardtext p:nth-child(1) {
        font-size: 28px;
    }
    .cardtext p:nth-child(2) {
        font-size: 24px;
    }
    .heroimagesecinnerwrap {
        margin: 0;
    }
    .indexpad {
        display: none;
    }
    .innersignupfootersec {
        padding-left: 10px;
        text-align: center;
    }
    #signupidfooter {
        text-align: end;
    }
    #signupid #signupname {
        display: none;
    }
    #signupid button {
        padding: 4px 30px 6px;
    }
    #viewmorecards {
        display: block;
        background-color: transparent;
        padding: 10px 30px;
        text-align: center;
        cursor: pointer;
    }
    #viewmorecards p {
        color: #003366;
        margin-bottom: 0;
        font-size: 20px;
        font-family: 'proximanova semibold';
    }
    .cardoverlay {
        opacity: 1;
    }
    #secondcardswrapper {
        display: none;
    }
    .mobilesharebuttonswrap {
        display: flex;
    }
    .cardbutton1 {
        display: none;
    }
    .cardbutton2 {
        display: none;
    }
    .storycardimageaction {
        margin-bottom: 15px;
        padding: 0;
    }
    .storycardimageaction2 {
        margin-bottom: 15px;
        padding: 0;
    }
    .cardtext p {
        font-size: 40px;
    }
    .cardtext p:nth-child(3) {
        font-size: 16px;
        margin-top: 10px;
        margin-bottom: 10px;
        -webkit-line-clamp: 3;
        position: relative;
        overflow: hidden;
        display: -webkit-box;
        -webkit-box-orient: vertical;
    }
    .cardtext a {
        font-size: 18px;
    }
    .cardtext a strong span {
        vertical-align: text-top;
    }
    .storycardimage {
        width: 100%;
        overflow: hidden;
        margin-bottom: 15px;
    }
    .actionformdiv {
        max-width: 100%;
        width: 100%;
        margin: 0;
    }
    .actiontext {
        width: 100%;
    }
    .actiontext2 {
        height: 300px;
        width: 100%;
        padding: 15% 30%;
    }
    .actionformdiv2 {
        max-width: 100%;
        width: 100%;
        margin: 0;
    }
    .footerlogohead a strong {
        padding: 3px;
    }
    /* .footerlogohead a strong:after {
        border: 25px solid transparent;
        margin-left: -32.5px;
        margin-bottom: -17px;
    } */
    .herroinnersecwrap button {
        width: 100%;
        font-size: 24px;
        padding: 5px 30px;
    }
    .herroinnersecwrap p {
        font-size: 28px;
        line-height: 1.3;
    }
    .storysharebutton2 p {
        font-size: 26px;
    }
    /* #indexwholesecwrapper {
        background: linear-gradient(180deg, #FCD646 750px, white 0px);
    } */
    .mainindexheader {
        font-size: 70px;
    }
    .footertopsec {
        padding: 5px 15px;
        margin: 0;
    }
    .footernavbar-header {
        display: block;
    }
    .footerlogoheader {
        padding-left: 30px;
    }
    .footerlogohead a {
        font-size: 55px;
    }
    label[for="signupfooter"] {
        width: 100%;
        font-size: 20px;
        text-align: left;
        padding-left: 15px;
    }
    #signupemailfooter {
        width: 65%;
    }
    #capandedulogo img {
        width: 100%;
        padding: 10px;
        margin-bottom: 20px;
    }
    .termpolicysec {
        padding-left: 15px;
    }
    .termpolicysec p {
        font-size: 17px;
    }
    .termpolicysec p:nth-of-type(2) {
        font-size: 14px;
        margin-top: 10px;
    }
    .footernavul {
        display: block;
    }
    .footernavlist:first-child {
        margin-left: 15px !important;
    }
    .footerlogohead {
        width: 260px;
    }
    .footerlogohead a strong:after {
        content: '';
        position: absolute;
        bottom: 0;
        width: 0;
        height: 0;
        border: 30px solid transparent;
        border-top-color: #D84919;
        border-bottom: 0;
        border-left: 0;
        margin-left: -34.5px;
        margin-bottom: -21px;
    }
    .footernavlist a {
        font-size: 28px;
    }
    .footernavlist a i {
        font-size: 30px;
    }
    .footernavul .navsocialicon {
        display: inline-block;
        margin-top: 15px;
        font-size: 30px;
    }
    #signupidfooter {
        text-align: inherit;
    }
    .innersignupfootersec {
        padding-left: 0;
    }
    #signupidfooter button {
        margin-top: 5px;
    }
    .indexformouterwrap {
        max-width: 300px;
    }
    .storycardsecwrap {
        max-width: 350px;
    }
    .footercontainerpad {
        padding-left: 15px;
        padding-right: 15px;
    }
    /* end of index.css */
    /* other.css */
    /* end */
    /* about.css */
    /* #aboutwholesecwrapper {
        background: linear-gradient(180deg, #FCD646 15%, white 0%);
    } */
    .backgroundcolorsec {
        padding: 45rem 0px;
    }
    .hrsec {
        display: none;
    }
    .aboutherroinnersecwrap {
        padding: 30px 20px;
        max-width: 360px;
    }
    .aboutherroinnersecwrapbutton {
        width: 100%;
    }
    .aboutherroinnersecwrap h3 {
        font-size: 32px;
        font-weight: 600;
    }
    .aboutherroinnersecwrap h3 span {
        font-size: 32px;
    }
    .firstsitewrap {
        padding: 0 30px;
    }
    .secondsitewrap {
        padding: 0 30px;
    }
    .guidelinessection {
        padding: 0 30px 0;
        margin-top: 0px !important;
    }
    .tellstorysectionback {
        background-color: #205BB9;
        background-image: none;
    }
    .story-header {
        margin: 0;
    }
    .sitewrap {
        border: none;
    }
    .cardtext p:nth-child(1) {
        line-height: 1;
    }
    .firstsitedesc .buttonwrap {
        padding: 10px;
        background-color: #003366;
        text-decoration: none;
        text-align: center;
    }
    /* end of about.css */
    /* story.css */
    .tellofficialbackgroundcolorsec {
        padding: 714px 0 0;
    }
    .storiestitle {
        margin-bottom: 10px;
    }
    .tellofficial-header h3 {
        font-size: 32px;
        color: #000000;
        padding: 0 30px;
    }
    .tellofficial-header h3 span {
        font-size: 32px;
        color: #000000;
        display: block;
    }
    .story-header h3 {
        font-size: 40px;
        margin-top: 20px;
    }
    #electedofficiaform .form-row .form-group input {
        height: 50px;
    }
    #exampleFormControlTextarea1 {
        height: 850px;
    }
    .tellofficial-header p {
        padding: 0 30px;
        margin-bottom: 1rem;
    }
    .tellofficialbelowbackgroundcolorsec {
        padding: 20px;
        background-color: #205BB9;
    }
    .storyformmar {
        margin-left: 5px;
        margin-right: 5px;
    }
    .story-header {
        padding: 0 30px;
    }
    .storyforminnerwrap {
        margin: 0 30px;
    }
    #story-form-left-wrapper input {
        height: 50px;
    }
    .storyformmar .first-form-section {
        padding: 0 20px;
    }
    .storyformmar .second-form-section {
        padding: 0 20px 0px;
    }
    #story-form-right-wrapper #story {
        height: 300px;
    }
    #story-form-bottom-wrapper {
        padding: 0 20px;
    }
    .indexformwrap {
        margin: 0 30px;
    }
    .indexformouterwrap {
        padding: 30px 10px;
    }
    .firstsitedesc a {
        font-size: 24px;
    }
    .secondsitedesc .mtt-3 {
        font-size: 16px;
        margin-top: 0;
    }
    /* end of story.css */
    /* stories.css */
    .storiesprofileimg img {
        position: inherit;
        height: auto;
    }
    .cardheadshotshadow1,
    .cardheadshotshadow2 {
        opacity: 0;
    }
    .figurecaption {
        position: initial;
        margin-top: 10px;
    }
    .storyvideosec iframe {
        height: 170px;
    }
    .mobilestoriesheader .container {
        padding-left: 0;
    }
    .storyinnersecwrap {
        padding: 0 30px;
    }
    .mobilestoriesheader {
        display: block;
    }
    .deskstoriesheader {
        display: none;
    }
    .storieswholesecwrapper {
        background: none;
    }
    .storiesbackgroundcolorsec {
        display: block;
        z-index: -1;
        /* background: linear-gradient(180deg, #205BB9 36%, white 0%); */
        background-color: #003366;
        padding: 560px 0 0;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
    }
    .storiessharebutton .storiesviewmore {
        padding: 4% 25%;
    }
    .storiesinnerbackground {
        padding: 20px;
        background-color: #205BB9;
    }
    .mobilestoriesheader {
        padding: 130px 30px 0;
    }
    .storiesfn {
        font-size: 42px;
    }
    .storiesln {
        font-size: 42px;
    }
    .storiescity {
        font-size: 26px;
    }
    .storiesstate {
        font-size: 26px;
    }
    .footerlogohead {
        margin-top: 20px;
    }
    .storiesahrebutton {
        padding: 5px 30px;
        margin-bottom: 30px;
    }
    .storiesprofileimg {
        width: 100%;
        height: auto;
        float: none;
        margin: 0;
        margin-bottom: 10px;
    }
    .storiessharebutton .storiesviewmore {
        float: none;
    }
    .storiessharebutton .storiesahrebutton {
        margin-bottom: 20px;
    }
    .storiessocial i {
        padding-left: 4px;
    }
    /* end of stories.css */
    /* ccv-page.css */
    .communityconversationtextbox1 {
        top: -15px;
        left: -10px;
    }
    .communityconversationtextbox2 {
        top: 15px;
        left: 2px;
    }
    .communityconversationsinnersecwrap {
        padding: 30px 20px;
        max-width: 360px;
    }
    .communityconversationsinnersecwrap h3 {
        font-size: 27px;
    }
    .communityconversationsinnersecwrap p {
        font-size: 18px;
    }
    /* end of ccv-page.css */
    /* ccv-fullcard.css */
    .cvvstorysecwrapper {
        padding: 170px 20px 55px;
    }
    #ccvideos_section {
        margin: 15px 0 25px;
    }
    .ccvideos_index_header {
        margin-top: 10px;
    }
    /* end of ccv-fullcard.css */
    /* polling data css */
    .polling_results_index_header {
        margin-top: 10px;
    }
    /* end */
}

@media screen and (max-width: 450px) and (min-width: 250px) {
    /* .mobileherotextdiv {
        max-width: 360px;
        margin: 0 auto;
    } */
    .innerherotextwrap1 {
        opacity: 18%;
    }
    .innerherotextwrap {
        opacity: 40%;
    }
}

@media screen and (max-width: 400px) and (min-width: 250px) {
    #signupid button {
        padding: 6px 10px;
    }
    .navbar-brand {
        width: 200px;
    }
    .actiontext2 {
        padding: 12% 7%;
    }
    .mainindexheader {
        font-size: 55px;
    }
    .storysharebutton2 {
        padding: 19px 0;
    }
    .storysharebutton1 {
        padding: 18px 0;
    }
    .storycardsecwrap {
        max-width: 335px;
    }
    .cardtext {
        max-width: 300px;
        margin: 0 auto;
        line-height: 1.4;
        padding: 30% 0 0;
    }
    .firstsiteimage img {
        width: 100%;
    }
    .secondsiteimage img {
        width: 100%;
    }
    .guidelinessection {
        overflow: hidden;
    }
    #signupid button {
        padding: 4px 10px 5px;
    }
    .aboutherroinnersecwrap h3 {
        font-size: 32px;
    }
    .aboutherroinnersecwrap h3 span {
        font-size: 32px;
    }
    .firstsitedesc a {
        font-size: 12px;
    }
    .secondsitedesc a {
        font-size: 12px;
    }
    #signupidfooter input {
        width: 57%;
    }
    .storiessharebutton .storiesviewmore {
        padding: 4% 23%;
    }
}

@media screen and (max-width: 330px) and (min-width: 250px) {
    .innermobilewrap {
        text-align: left;
    }
    .storiessharebutton .storiesviewmore {
        padding: 4% 20%;
    }
    .storiesfn {
        font-size: 40px;
    }
    .storiesahrebutton {
        padding: 5px 10px;
    }
    .footerlogohead a {
        font-size: 50px;
    }
    .navbar-brand {
        width: 170px;
        font-size: 24px;
    }
}