#mainwebsite span.smaller {
    font-size: 0.7em;
}
@media screen and (max-width: 1200px) {
    .featurebox8 a {
        width: 55%;
    }
    .vis19, .vis19b {
        width: 40%;
        float: left;
        margin-left: 20px;
    }

    ul.home44 {
        margin-left: 0;
    }
    ul.homeprom li {
        margin: 10px 30px 30px 0;
    }
    ul.homeprom li a {
        width: 330px;
        min-height: 260px;
    }

    ul.home44 li a {
        margin: 0 5px 30px 20px;
        width: 300px;
    }
    ul.homeprom5 li {
        margin: 10px 30px 30px 40px;
    }
  ul.homeprom5 li a {
        width: 510px;
        min-height: 260px;
    }
    .idoptions {
        margin: 10px 10px 30px 0;
        width: 32%;
        min-height: 700px;
    }
    .registrationtop, .faqemp {
        background-size: 70%;
    }

    .col1home {
	float: none;
	width: 100%;
}

.col2home {
	float: none;
	width: 100%;
}
.boxtwitter {
	width: 90%;
	margin: 0 auto;
	

}
#content-main ul.homepromo21 {
	margin-left: 30px;

}
#content-main ul.homepromo21 li {

}



#content-main ul.homepromo21 li a {
/*	padding: 200px 10px 10px 10px;
	width: 400px;
	margin: 0 40px 40px 0;
	float: left;
	border: 1px solid #c9c9c9;
	text-align: center;
	font-size: 1.1em;
	box-shadow: 3px 3px 3px #f0f0f0;
	font-weight: bold;*/
}


}
/*-----------------------------------------------------------------*/
@media screen and (max-width: 1130px) {
    .electiondate, .electiondate2 {
        font-size: 1.2em;
    }
    .headertwo {
        width: auto;
    }
    .visother {
        float: right;
        width: 130px;
        margin-right: 15px;
        margin-top: 40px;
    }
    .visotherf {
        float: none;
        width: auto;
        margin-right: 15px;
        margin-top: 35px;
        margin-left: 30px;
        position: relative;
        clear: both;
    }
    ul.homeprom li{
        margin: 10px 40px 30px 0;
    }
    ul.homeprom li a {
        width: 300px;
        min-height: 260px;
    }

        ul.homeprom5 li {
        margin: 10px 30px 30px 0;
    }
  ul.homeprom5 li a {
        width: 475px;
        min-height: 260px;
    }
    .i
    .option1, .option2, .option3 {
        background-size: auto 180px;
    }
    .vis19f {
        height: 360px;
    }

.bigpromo {
margin: 0 auto;
width: auto;
padding: 10px 10% 10px 45%;
}
.bigpromowrap {
	background: transparent url('../images/promotop4mobile.jpg') top left no-repeat;
	background-size: auto 200px;
	min-height: 200px;
}
a.newad,
a.introebra {
	font-size: 2em;
}


}
/*-----------------------------------------------------------------*/
@media screen and (max-width: 1070px) {
    /*.vis19f, .vis19, .vis19b {
        height: 551px;
    }*/
    .visother {
        float: none;
        width: auto;
        margin-right: 0;
        margin-left: 30px;
        margin-top: 10px;
        clear: both;
    }
    ul.homeprom2 {
        width: 100%;
        clear: both;
        margin-left: 50px;
    }
    ul.homeprom li a {
        width: 260px;
    }
    ul.homeprom li {
        margin: 1em 0.5em;
    }
            ul.homeprom5 li {
        margin: 10px 30px 30px 0;
    }
  ul.homeprom5 li a {
        width: 400px;
        min-height: 260px;
    }

    .registrationtop, .faqemp {
        margin-bottom: 10px;
        height: 200px;
    }
    .fixreg {
        clear: both;
        max-width: 100%;
    }
}
/*-----------------------------------------------------------------*/
@media screen and (max-width: 1030px) {

.top-bar-section2 li a:not(.button) {
        padding: 0 10px
    }

    .top-bar2 {
        height: 70px;
    }
#topnavlist2 {
            float: none;
        }
      #topnavlist li, #topnavlist2 li {
        border-right: 1px solid #8D8D8D;
    }

    #topnavlist a, #topnavlist2 a {
        width: auto;
        padding:  15px;
        min-height: 70px;
        font-size: 0.85em;
        font-weight: bold;

    }
    #topnavlist a:focus, #topnavlist2 a:focus, #topnavlist a:hover, #topnavlist2 a:hover{

    min-height: 70px;

}

    #topnavlist li:first-child {
        max-width: 105px;
        text-align: center;
    }
    #topnavlist li:nth-child(2) {
        max-width: 100px;
        text-align: center;
    }
    #topnavlist li:first-child a, #topnavlist li:nth-child(2) a {
        line-height: 1.5em;
    }

    #topnavlist li.current a {

        min-height: 70px;
    }

}



/*--------------------------------------------------------------------------------------*/
@media screen and (max-width: 1000px) {
    .inline a {
        margin-left: 30px;
        margin-right: 30px;
    }
    #content-main .three {
        width: 33%;
    }

    #content-main a.actionbut {
        width: 350px;
    }
    .homebox, .homebox2 {
        min-height: 280px
    }


    .breadsocial .two, .breadsocial .four {
        width: 100%;
    }
    .breadsocial .socialmedia, .breadsocial form {
        float: right;
        white-space: nowrap
    }
    .breadsocial button.tiny {
        float: none
    }
    .vis19, .vis19b {
        min-height: 400px;
        /*background: #b683bb url('../img/home/vis21.png') 210px 70px;*/
        background-repeat: no-repeat;
    }

/*Health and safety page */

#content-main ul.saf3 li {
    margin: 0 5px 30px 0;
    /*width: 250px;*/
    padding: 180px 5px 0 5px;
    display: block;
}
/*END - Health and safety page */
}


/*-----------------------------------------------------------------*/
@media screen and (max-width: 960px) {
    /*.featurebox7 {
    font-size: 1.5em;
    background-image: #dedede url(../img/home/feature7.jpg) top center no-repeat;
}*/


    .option1, .option2, .option3 {
        background-size: auto 160px;
    }
    .registrationtop, .faqemp {
        background-size: auto 250px;
    }

    .pesn {
    margin-left: 40px;
    max-width: 400px;
    float: right;
}

.box2019cand {
    float: none;
    width: 95%;
}
}

/*-----------------------------------------------------------------*/
@media screen and (max-width: 950px) {

ul.homeprom5 li {
        margin: 10px 30px 30px 0;
    }
  ul.homeprom5 li a {
        width: 395px;
        min-height: 260px;
    }

 }

/*------------------------------------X-----------------------------*/
@media screen and (max-width: 935px) {


    #content-main a.actionbut {
        width: 230px
    }
    .breadback .social .six {
        width: 100%;
        margin-top: -15px
    }
    #toppage1.breadback, .breadback {
        padding-top: 20px;
    }
    .vis19, .vis19b {
        width: 42%;
        background-size: auto 100px;
        padding: 20px 10px 10px 5px;
    }
    li.padright {
        padding-right: 100px;
    }
    .vis19 ul li, .vis19b ul li {
        margin-bottom: 10px;
        font-size: 1em;
    }
}

/*-----------------------------------------------------------------*/
@media screen and (max-width: 900px) {

     ul.homeprom5 {
        margin: 10px 20px;

    }
    ul.homeprom5 li a {
        width: 540px;
    }

    .waysvote5 {
    margin: 10px 25px 30px 0;
   width: 100%;
   float: none;
   padding: 20px 15px 10px 15px;
   min-height: 50px;

}


}
/*-----------------------------------------------------------------*/
@media screen and (max-width: 872px) {

    p.home {
        font-size: 1.2em;
        padding-top: 15px;
    }
    img.ready {
        width: 100%;
    }
    .bon14 {
        background: transparent url('../img/bon14.png') 95% 0% no-repeat;
    }
    #subscribe p {
        margin-top: -20px;
        margin-left: 20px
    }
    #toppage1 .three {
        width: auto;
    }
    #id.mybox {
        background: none
    }
    #bill.mybox {
        background: none
    }
    .bon11 {
        padding-right: 0
    }
    .featuretext {
        float: left;
        width: 75%;
        clear: both;
    }
    .waysvote2, .waysvote3 {
        margin: 10px 25px 30px 0;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        width: 100%;
        float: none;
        padding: 15px 10px 15px 300px;
        min-height: 200px;
    }
    .electiondayways {
        background: url(../img/electionday.png) top left no-repeat;
        background-size: 270px;
    }
    .advanceways {
        background: url(../img/advanceways.png) top left no-repeat;
        background-size: 270px;
    }
    .rooffice {
        background: url(../img/rooffice.png) top left no-repeat;
        background-size: 270px;
    }
    .votemail {
        background: url(../img/votema.png) top left no-repeat;
        background-size: 270px;
    }

    h2.homevote {
    width: auto;
    height: auto;
    line-height: 1.1em;
}
/*#content-main ul.saf3 li {
    width: 220px;
}*/


}
/*-----------------------------------------------------------------*/
@media screen and (max-width: 800px) {

.idoptions {
	 margin: 10px 30px 30px 0;
	 width: 100%;
	 float: left;
	 padding: 210px 10px 15px 10px;
	 min-height: 20px;
}

.option1, .option2, .option3 {
	 background-size: auto 200px;
}

.featurebox8 a {
	 width: 80%;
	 margin: 0 auto 20px auto;
	 padding: 380px 0 15px 15px;
	 background-size: auto 400px;
	 min-height: 100px;
	 float: none;
}

.featurebox8 a:hover, .featurebox8 a:focus {
	 background-size: auto 400px;
}

.itsourvote {
	 margin-top: -30px;
	 width: 200px;
}

.vis19, .vis19b {
	 width: 80%;
	 float: none;
	 margin: 10px auto;
	 background-image: none;
	 height: auto;
}

.registrationtop, .faqvotingtop, .faqregistrationtop, .faqidtovotetop, .faqpollingstations, .faqemp {
	 background-size: auto 200px;
	 width: 250px;
}

#content-main a.reg19but {
	 max-width: 250px;
}

 .pesn {
	margin-left: 10px;
	max-width: 90%;
}

#content-main .verticalbuttons a {
    padding: 20px 20px;
    margin: 10px 15px 30px 5px;
    width: 230px;
}

#content-main ul.saf3 li {
    margin: auto 20px;
    width: 300px;
    padding: 180px 5px 30px 5px;
    display: block;
    text-align: center;
}

.col1com, .col2com {
	float: none;
	width: 100%;
	margin-left: 0;

}
}
/*-----------------------------------------------------------------*/
@media screen and (max-width: 760px) {
    /*p.socialmedia  {
        border-top: 2px solid #5EFFBA;
    }*/
    #topnavlist.open li, #topnavlist2.open li {
        display: table !important;

    }
    #topnavlist.open li > a, #topnavlist2.open li > a {
        display: table-cell !important;
        vertical-align: middle;
    }
    #topnavlist.open li, #topnavlist2.open li {
        height: 3em !important;
    }
    #topnavlist2 li.has-dropdown, #topnavlist2 ul.mainwebsite, #topnavlist2 ul.mainwebsite li, #topnavlist2 ul.mainwebsite li a {
        border: none;
    }
    #topnavlist2 li.has-dropdown:hover, #topnavlist2 li.has-dropdown:focus {
        background-color: #000;
    }
    #topnavlist2 #mainwebsiteaction.has-dropdown {
        background-color: #61459b;
    }
    #topnavlist2 #mainwebsiteaction.open {
        background-color: #000 !important;
    }
    #mainwebsite {
        font-weight: bold;
        font-size: 0.8em;
        display: block;
        width: 100%;
    }
    #mainwebsite span.smaller {
        font-size: 0.75em;
    }
    #topnavlist2 li.has-dropdown #mainwebsite:after {
        border-width: 5px 0px 5px 6px;
        border-color: transparent transparent transparent #fff;
    }
    #topnavlist2 li.has-dropdown.open #mainwebsite:after {
        border-width: 6px 5px 0 5px;
        border-color: #ffffff transparent transparent transparent;
        /* linked to instructions of word3.css  => .top-bar-section2 .has-dropdown > a:after, #mainwebsite:after { */
        /*
        border-width: 5px 0px 5px 6px;
        border-color: transparent transparent transparent #fff;
        */
    }
    #topnavlist2 ul.mainwebsite li a {
        border-bottom: 1px solid #666;
        border-left: 1px solid #666;
        border-right: 1px solid #666;
        color: #666;
        text-align: left;
    }
    .top-bar2 {
        height: 91px;
    }
    #topnavlist {
        border-bottom: 1px solid #4D4D4D;
    }
    #topnavlist.open {
        height: auto;
    }
    .top-bar2 {
        padding-left: 0.9375em;
        padding-right: 0.9375em;
    }
    #topnavlist a, #topnavlist2 a {
        padding: 0px 14px;
    }
    #topnavlist li a:hover, #topnavlist2 li a:hover, #topnavlist li a:focus, #topnavlist2 li a:focus, #topnavlist li a:active, #topnavlist2 li a:active, #topnavlist li a:active, #topnavlist2 li a:active {
        background-color: #000;
    }
    #topnavlist li.current a, #topnavlist2 li.current a {
        background-color: #000;
    }
    #topnavlist li:first-child, #topnavlist li:nth-child(2) {
        max-width: none;
        text-align: left;
    }
    /*#topnavlist li:first-child a, #topnavlist li:nth-child(2) a {
        line-height: 45px;
    }*/
    #topnavlist ul li.has-dropdown:hover ul, #topnavlist2 ul li.has-dropdown:hover ul, #topnavlist ul li.has-dropdown:focus ul, #topnavlist2 ul li.has-dropdown:focus ul, #topnavlist ul li.has-dropdown:active ul, #topnavlist2 ul li.has-dropdown:active ul {
        left: 169px;
        top: 0px;
    }
    .top-bar2 {
        height: auto;
        background: none;
        padding: 0;
    }
    /* Mobile Menu Test */
    #active a {
        background-color: #8080C0 !important;
    }
    #active li a {
        background-color: #ebdcc7;
        color: black;
    }
    #active li a:hover {
        background-color: rgba(0, 0, 0, 0);
        border-top-color: transparent;
        background-color: #a64595;
        color: black;
    }
    #topnavlist .divider, #topnavlist2 .divider {
        display: none;
    }
    .nav-button {
        display: block;
        margin: 0 0 5px 0;
        height: 45px;
        width: 100%;
        padding: 5px;
        /*background-color: #61459b;*/
        background-color: #000;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: 21px, 100%;
        cursor: pointer;
        border: 0 none;
        border-bottom: 1px solid rgba(255, 255, 255, .1);
        z-index: 999;
        color: white;
        border: 1px solid #cccccc;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
    }
    /*
.nav-button:hover {
    background-color: rgba(0,0,0,.1);
}
.nav-button:focus {
    background-color: rgba(0,0,0,1);
}
    */
    .sidebutton {
        float: left;
        margin-left: 43px;
        margin-top: 25px;
    }
    #sidebutton1 {
        margin-top: 25px;
    }
    .nav-button.open {
        /*background-color: #61459b;*/
        background-color: #000;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: 21px, 100%;
    }
    .homebox, .homebox2 {
        margin-bottom: 20px;
        min-height: 280px
    }
    #content-main a.actionbut {
        width: 200px;
        clear: both;
    }
    /* Navigation Bar------ */
    #navdiv {
        height: 45px;
        background-color: #fff;
        box-shadow: none;
        border: none;
    }
    #topnavlist, #topnavlist2 {
        width: 100%;
        float: none;
        background-color: #61459b; /* change the menu color */
        display: block;
        height: 0px;
        margin: 0;
        padding: 0;
        overflow: hidden;
        z-index: 998;
        clear: both;
        border: none;
    }
    #topnavlist2 {
        height: 0px;
    }
    #topnavlist li, #topnavlist2 li {
        left: -9999px;
        width: 100%;
        text-align: left;
        display: none;
        /* GR:   2019-06-20  added  */
        min-height: 1.4em;
        /*border-bottom: 1px solid #fff; rgba(0,0,0,.2);*/
        border-top: 2px solid #fff; /*rgba(255,255,255,.1); */
    }
    #topnavlist li a:hover, #topnavlist li a:focus {
        /* GR:   2019-06-20  added  */
        min-height: 1.4em;
    }
    #topnavlist a, #topnavlist2 a {
        background: #61459b;
    }
    #topnavlist li a, #topnavlist2 li a {
        display: block;
        width: 100%;
        text-shadow: -1px -1px 0 rgba(0, 0, 0, .15);
        color: white;
        text-decoration: none;
        /* GR: 2019-06-20  move to li above
        border-bottom: 1px solid rgba(0,0,0,.2);
        border-top: 1px solid rgba(255,255,255,.1);
        */
    }
    #topnavlist > li:first-child, #topnavlist2 > li:first-child {
        border-top: 1px solid rgba(0, 0, 0, .2);
    }
    /* Toggle the navigation bar open  */
    #navdiv.open {
        height: auto;
    }
    #topnavlist.open {
        height: auto;
    }
    #topnavlist2.open, #mainwebsiteul.open {
        height: auto;
        border-top: 2px solid #fff;
    }
    #topnavlist.open li, #topnavlist2.open li {
        left: 0px;
        display: block;
    }
    #topnavlist2 ul#mainwebsiteul.open {
        position: relative;
        margin: 0;
        left: 0px;
    }
    #mainwebsiteul.open label {
        display: none;
    }
    #mainwebsiteul.open a {
        text-shadow: none;
        border-top: 1px solid black;
        padding: 0 15px;
    }
    #topnavlist2 ul.dropdown, #topnavlist2 ul li {
        background-color: #4d4d4d;
        color: white;
    }
    #mainwebsiteul.open a:hover, #mainwebsiteul.open a:focus {
        background-color: #4d4d4d;
        color: white;
        left: 0px;
        position: relative;
    }
    /* Submenus  optional .parent class indicates dropdowns */
    #topnavlist > li:hover > a, #topnavlist2 > li:hover > a, #topnavlist > li > a:focus, #topnavlist2 > li > a:focus, #topnavlist > li > a:active, #topnavlist2 > li > a:active {
        /*
        background: rgba(0,0,0,.5);
        border-bottom-color: transparent;
        background-color: #61459b;
        */
    }
    #topnavlist ul, #topnavlist2 ul {
        position: relative;
        left: 0;
    }
    #topnavlist li ul, #topnavlist2 li ul {
        background: rgba(0, 0, 0, .5);
        border-top: 0 none;
        padding: 0;
    }
    #topnavlist li ul a, #topnavlist2 li ul a {
        border: 0 none;
        color: black;
        background-color: white;
        padding: 10px 5%;
        font-weight: normal;
    }
    #topnavlist2 ul.dropdown ul.dropdown {
        display: none;
    }
    .top-bar-section2 ul ul .has-dropdown > a:after {
        border: none;
    }
    #menubutton span {
        display: inline-block;
        width: 0;
        height: 0;
        margin-left: 10px;
        border-style: solid;
        border-width: 5px 0 5px 6px;
        border-color: transparent transparent transparent #ffffff;
    }
    #navdiv.open #menubutton span {
        border-width: 6px 5px 0 5px;
        border-color: #ffffff transparent transparent transparent;
    }
/*    #content-main a.socialbutt {
        width: 350px;
        padding: 15px 3px 16px 70px;
    }*/
    .optionsregister {
        border: 1px solid #ABABAB;
        margin: 10px 30px 30px 0;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        width: 95%;
        float: none;
        padding: 10px 15px;
        min-height: auto;
    }

/*#content-main ul.saf3 li {
    width: 200px;
}*/

.bigpromo {
margin: 0 auto;
text-align: center;
padding: 0;
}
.bigpromowrap {
	/*background-image: none;
	background-color: #dee8ee;
	min-height: 170px;*/
	background: transparent url('../images/promotop4mobile.jpg') top right no-repeat;
	background-size: auto;
	min-height: 170px;
}
a.newad,
a.introebra {
display: inline-block;
width: 70%;
margin-top: 20px;
  padding: 30px;
  color: #005e63;
  font-size: 2em;
  text-decoration: none;
  border: 1px solid #646464;
  box-shadow: 3px 3px 3px #949494;
  background: #e2e2e2;
  animation: none;
}

a.newad:hover,
a.introebra:hover {
	border: none;
	color: #009ba6;
}
}
/*-------------------------------------------------------------------------------------*/
@media screen and (max-width: 673px) {
    .bon14 {
        background: none;
    }
    .homebox, .homebox2 {
        margin-bottom: 20px;
        min-height: 300px
    }
    img.mobile {
        width: 100%;
    }
    .waysvote2, .waysvote3 {
        padding: 15px 10px 15px 220px;
    }

    .waysvote4 {
        margin: 10px 25px 30px 0;
        width: 100%;
        float: none;
        padding: 180px 10px 15px 15px;
        min-height: 200px;
    }

    .electiondayways4 {
        background: url(../img/electionday5.png) top center no-repeat;

}
   .electiondayways, .advanceways, .rooffice, .votemail {
        background-size: 200px;
    }
    .downloadinfographic p {
        border: 1px solid #cecece;
        background-color: #eaeaea;
        box-shadow: 5px 5px 5px #888888;
        padding: 5px 10px;
        float: none;
        display: block;
    }
    ul.homeprom {
        margin: 20px 80px;
    }
    ul.homeprom5 {
        margin: 20px 90px;

    }
     ul.homeprom5 li a {
        width: 260px;}

    /*Moved here from @media screen and (max-width: 515px) on 2019-09-03-T-0853 AB*/
    .electiondate {
        width: 100%;
        margin: 0 0 10px 0;
        font-size: 1.3em;
        border-right: none;
        text-align: center;
    }
    .electiondate2 {
        width: 100%;
        margin: 0;
        font-size: 1.3em;
        text-align: center;
    }
    .headertwo {
        padding-left: 0;
        width: 100%;
    }
    /*#content-main ul.saf3 li {
       width: 180px;
    }*/
}/*/@media screen and (max-width: 673px)*/




/*-----------------------------------------------------------------------------------*/
@media screen and (max-width: 625px) {
    #content-main, #content-main .one, #content-main .two, #content-main .three, #content-main .four, #content-main .five, #content-main .six, #content-main .seven, #content-main .eight, #content-main .nine, #content-main .ten, #content-main .eleven, #content-main .twelve, #bottompage .four {
        width: 100%;
    }
    h2.paddown, h2.paddown2 {
        padding-bottom: 0px;
    }
    .header1 .four {
        width: 100%;
        text-align: center;
    }
    p.home {
        font-size: 1.2em;
        padding-top: 5px;
        margin-top: 10px;
        background-color: #cfcfcf;
    }
    img.ready {
        width: 250px;
        margin-top: 0px;
    }
    .top-bar-section ul {
        width: 100%;
        display: block;
    }
    .top-bar-section > ul > .divider, .top-bar-section > ul > [role="separator"] {
        height: 0px;
    }
    .top-bar-section ul li {
        float: none;
        border-bottom: 1px #4D4D4D solid;
    }
    .bon14 {
        background: none;
    }
    a.buttonlink, .row a.buttonlink {
        width: 100%;
    }
    .backreg {
        background-image: none;
    }
    .back3 {
        width: 100%;
    }
    #subscribe p {
        margin-top: 0px;
    }
    ul.homebul {
        margin-left: 20px;
    }
    #content-main a.actionbut {
        width: 250px;
    }
    .homebox2 {
        min-height: 320px;
    }
    .indent2 {
        margin: 0;
    }
    #topmenu2 li a {
        margin-bottom: 5px;
    }
    .registrationtop {
        background: url(../img/registrationtop.jpg) top left no-repeat;
        background-size: auto 250px;
        width: 100%;
        float: none;
        height: 250px
    }
    #content-main a.reg19but {
        max-width: 300px;
        margin: 20px auto;
    }
    a.standalone {
        padding: 200px 10px 10px 10px;
        margin: 0 0 40px 18px;
        width: 95%;
        display: block;
        background: #e0e0e0 url('../img/home/adsicon.png') top center no-repeat;
        font-size: 1.2em;
    }
    a.standalone:hover, a.standalone:focus {
        /*background: #ecffff url('../img/home/adsicon.png') top left no-repeat;*/
        opacity: 0.8;
    }
    .standalone h3 {
        font-size: 1.5em;
    }

/*#content-main ul.saf3 li {

    float: none;
    margin-bottom: 30px;
    width: 300px;
    padding: 180px 30px 0 30px;
}
#content-main ul.saf3 {
    margin: 20px 0 40px 20px;
}*/

.healthsaf h2 {
    font-size: 1.5em;
    margin-top: 20px;
}

.saf1 {
    padding: 210px 0 20px 0;
    background: url('../img/safety/img1.png') top center no-repeat;
    background-size: 200px;

}
}/*/@media screen and (max-width: 625px)*/
/*------------------------------------------------------------------------------*/
 @media screen and (max-width: 585px) {


      .width95 {
            width: 95%;
      }

      ul.homeprom6 li a {

    width: 350px;

    }

    .vicshadow {
    	max-width: 90%;

    }

    .marginbott {
    	margin-bottom: 20px;
    }
}

@media screen and (max-width: 515px) {


    /*
    ---Moved to 673px---
        .electiondate {
            width: 100%;
            margin: 0 0 10px 0;
            font-size: 1.3em;
            border-right: none;
            text-align: center;

        }

        .electiondate2 {
            width: 100%;
            margin: 0;
            font-size: 1.3em;
            text-align: center;
        }

        .headertwo {
            padding-left: 0;
            width: 100%;
        }*/
}/*/@media screen and (max-width: 515px)*/
/*------------------------------------------------------------------------------*/
@media screen and (max-width: 480px) {
    #subscribe p {
        margin-top: -15px;
    }
    h1 {
        font-size: 1.6em;
    }
    h2 {
        font-size: 1.4em;
    }
    h3 {
        font-size: 1.3em;
    }
    h4 {
        font-size: 1em;
        font-weight: 600;
    }
    h5 {
        font-size: 0.9em;
    }
    h6 {
        font-size: 0.8em;
    }
    h1.ways2, h1.ways3 {
        background: none;
    }
/*    #content-main a.socialbutt {
		color: #131313;
		background-color: #e9e9e9;
	}*/

    #content-main .inline a.homeID, #content-main .inline a.homevote, #content-main .inline a.homefirst, #content-main .inline a.homeaccess, #content-main .inline a.homefaq, #content-main .inline a.homefirstf {
        border: 1px solid #c2c2c2;
        margin: 15px 0px 0 45px;
        width: 163px;
    }
    .faq2 p {
        margin-bottom: 10px;
        margin-left: 5px;
        padding-left: 5px;
    }
    .faq2 ul {
        margin-left: 25px;
    }
    #content-main a.actionbut {
        width: 200px;
    }
    #toppage1.breadback {
        padding-bottom: 10px
    }
/*    #content-main a.socialbutt {
        width: 300px;
    }*/
    /*.featurebox7a {

    background-size: auto 455px;
}*/

	.waysvote3 {
        padding: 180px 15px 10px 15px;
    }
    .electiondayways {
        background: url(../img/electionday2.png) top center no-repeat;
        background-size: auto;
    }
    .advanceways {
        background: url(../img/advanceways2.png) top center no-repeat;
        background-size: auto;
    }
    .rooffice {
        background: url(../img/rooffice2.png) top center no-repeat;
        background-size: auto;
    }
    .votemail {
        background: url(../img/votema2.png) top center no-repeat;
        background-size: auto;
    }
    .featurebox8 a {
        width: 90%;
        margin: 0 auto 20px auto;
        padding: 250px 0 0 5px;
        background-size: auto 250px;
        min-height: 100px;
        float: none;
    }
    .featurebox8 a:hover, .featurebox8 a:focus {
        background-size: auto 250px;
    }
    .itsourvote {
        margin-top: -20px;
        width: 150px;
    }
    .vis19, .vis19b {
        width: 90%;
        float: none;
        margin: 10px auto;
    }

    .vis19b p.textfib {
        float: none;
        margin-left: 20px;
    }

    ul.listvisbf {
        margin-left: 40px;
    }
    .waysvote2 {
        padding: 190px 15px 10px 15px;
    }
    .registrationtop, .faqvotingtop, .faqregistrationtop, .faqidtovotetop, .faqpollingstations, .faqemp {
        float: none;
        background-size: auto 200px;
        height: 200px;
        margin: 0 0 20px 10px;
    }
    ul.homeprom, ul.homeprom5 {
        margin: 20px 50px;
    }
    ul.homeprom5 {
        margin: 20px 20px 20px 60px;
    }
    a.newad,
    a.introebra {

  font-size: 1.5em;

}

#content-main ul.homepromo21 li a {
	width: 320px;
	}

#content-main ul.homepromo21 {
	margin-left: 10px;
}

#content-main a.phearing {
	float: none;
	}
	
}
/*-----------------------------------------------------------------*/
@media screen and (max-width: 401px) {
    /*p.socialmedia  {
    border-top: 2px solid #4682b4;
}*/
    #spreadword {
        background-color: #e4c4bf;
        background-image: none;
        min-height: 50px;
    }
    /*#toppage1.breadback {background:none} */
    .breadc {
        margin: 0 auto;
        background-color: #e7e7e7;
        border-bottom: 1px solid #a8a8a8;
        min-height: 30px;
        font-size: 0.9em;
    }
    #content-main a.related3 {
        margin: 0 20px 20px 5px;
    }
    .faqvotingtop, .faqregistrationtop, .faqidtovotetop, .faqpollingstations {

        margin: 10px auto;
        background-size: auto 260px;
        height: 260px;
    }


}
/*-----------------------------------------------------------------*/

@media only screen and (max-width: 331px){/* - - - - - - - - - - - - - - -*/
	.follow h2 {
		width: 100%;
		text-align: center;
	}
	.inline a {
		width: 180px;
		margin-left: 25px;
	}
	.homebox, .homebox2 {
		margin-bottom: 20px;
		min-height: 320px;
		background-image: none;
	}
	.textreg {
		padding: 0px;
	}
	#subscribe p {
		margin-top: -20px;
		padding: 5px 5px 5px 5px;
		line-height: 1.3em;
	}
	#subscribe p > .bigfont, #spreadword p > .bigfont2 {
		font-size: 1.2em;
		font-weight: 600;
		line-height: 1.2em;
	}
	img.ready {
		width: 100%;
	}
	.registrationtop {
		/*background: url(../img/registrationtop.jpg) top center no-repeat;*/
		background-size: auto 180px;
		height: 180px;
		margin: 0 0 20px 0;
	}
	ul.homeprom, ul.homeprom5 {
		margin: 20px;
	}
	#content-main a.largewidth {
		width: 95%;
	}

	#content-main ul.saf3 {
		margin: 20px 0 40px 0;
	}
}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - end-of-331px*/

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
                         START: Media queries moved out of world3.css 2021-03-04
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
    /* *.abMinHeightN
       *.abMinHeight
            .abMinHeightN
                To set heights for items
            .abMinHeight
                An overall class to allow rules to be applied to
                all .abMinHeight items
       ========================================================================== */
            /*Let heights collapse back to normal when viewed narrow*/
            @media only screen and (max-width: 800px) {

            .abMinHeight > * { min-height: 1em; }

            }/*@media only screen and (max-width: 800px)*/



    /* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
                                                           .eDatePart1 & .eDatePart2
    A revised version of .electiondate and .electiondate2
    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
        @media only screen and (max-width: 800px){/*---------------------800px*/
            .eDatePart1:before {
                content: "";
                display: table;
                clear: both;
                margin-bottom: 10px;
            }

            .eDatePart1 {
                text-align: center;
                margin-left: 0;
            }

            .headertwo {
                padding-left: 0;
                float: none;
            }
        }/*-------------------------------------------------------end-of-800px*/

        @media only screen and (max-width: 580px){/*---------------------580px*/
            .eDatePart1 {
                line-height: 1.5;
            }

            .eDatePart2 {
                border-left: none;
                padding-left: 0;
                margin-left: 0;
                display: block;
            }
        }/*-------------------------------------------------------end-of-580px*/



    /* .breadwrap below 900px
            In Chrome, responsive, below 900px, the following rule is needed
            to stop this DIV forcing out the RH side and leaving a gap between
            content and the browser edge.
            2019-06-17-T-1712 | Alan
       ========================================================================== */

            @media screen and (max-width: 900px) {

                .breadwrap {
                    width: auto;
                }

            }/*/@media screen and (max-width: 900px)*/



    /* ==========================================================================
       GE43 AB
       ========================================================================== */
            /*From world3*/
                /*.waysvote3 {
                    .
                    .
                    .
                   min-height: 600px;
                }*/
                    @media (max-width: 872px) {

                        .waysvote3.abTaller {
                            min-height: inherit;
                        }

                    }



    /* *.abThreeChilds
       ========================================================================== */
        @media only screen and (max-width: 800px) {

            ul.abThreeChilds > li {
                width: auto;
                float: none;
            }

        }/*@media only screen and (max-width: 800px)*/
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
                           END: Media queries moved out of world3.css 2021-03-04
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */




/*--------------------------------------------------------------------------*/ @media print {
    p.home {
        font-size: .9em;
    }
    .bon11 {
        padding-right: 0;
        /*make a complaint page */
        background: none;
    }
    .breadback {
        background: none;
    }
    .breadsocial {
        display: none;
    }
    .follow img {
        width: 35px;
    }
    .homebox2 {
        float: none;
    }
    #bottompage {
        background: none;
    }
    #content-main .homebox a.actionbut {
        width: 200px;
        clear: both;
    }
    #logoec {
        width: 80%;
    }
    #logorv {
        width: 120%;
    }
    #navdiv, .social {
        display: none;
    }
    #subscribe p {
        margin-top: -20px;
        margin-left: 20px;
    }
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																	  Responsive
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
	@media only screen and (max-width: 1100px){/* - - - - - - - - - - - - -*/
		/*Changes for social media footer 2022-01-12*/
			.footFlex {
				padding-bottom: 200px;
			}
			.footFlex::after {
				position: absolute;
				bottom: 0;
				right: 0;
				left:0;
				right:0;
				margin-left: auto;
				margin-right: auto;
			}
	}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - end-of-1100px*/
	@media only screen and (max-width: 900px){/* - - - - - - - - - - - - - - -*/
		/*Reduce the footprint of the 2ndry nav*/
		#rightNav nav ul li a {
			padding: 0.2em 0.38em;
		}
		/*Phone and email*/
			.contactdl dt {
				float: none;
				clear: none;
				text-align: left;
				margin-bottom: 0.62em;
			}

			.contactdl dd {
				float: none;
				margin: 0;
				padding: 0 0 0.5em 0;
				margin-bottom: 1.38em;
				width:100%;
			}
	}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - end-of-900px*/
	@media only screen and (max-width: 899px){/* - - - - - - - - - - - - - - -*/
		/*What's New*/
			.neuf {
				width: 100%;
				min-height: inherit;
				display: inherit;
				align-items: inherit;
				padding-right: 0;
			}
			
			h2.neufh2 {
				width: 100%;
			}
			
			.neuf h2, .neuffra h2 {
				width: 100%;
				font-size: 1.5em;
				background: #902A8C;
				background-image: none;
				padding: 10px;
				text-align: center;
				margin: 0;
			}
			
			
	}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - end-of-899px*/
	@media only screen and (max-width: 880px){/* - - - - - - - - - - - - - - -*/
		/*The second NAV UL in #natt*/
			#natt #secondNavButton,
			#natt #secondNavButton:hover {
				background: #2C7C82 !important;
			}

			.secondNav li a,
			#natt .secondNav li a:hover {
				background: #2C7C82 !important;
			}

			/*...and now, when clicked*/
			#natt ul.firstNav_closed.open > li > a {
				background: #1B4450 !important;
			}
		/*The second NAV UL in #natt*/
			#natt #secondNavButton,
			#natt #secondNavButton:hover {
				background: #1B4450 !important;
			}
			.secondNav li a,
			#natt .secondNav li a:hover {
				background: #1B4450 !important;
			}
			/*...and now, when clicked*/
			#natt ul.firstNav_closed.open > li > a {
				background: #1B4450 !important;
			}
		/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																				.wrapvis
		VIS button-like link
		- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
			.wrapvis {
				float: none;
				width: 100%;
				max-width: inherit;
				margin-left: 0;
				margin-right: 0;
			}
	}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - end-of-880px*/
	@media only screen and (max-width: 730px){/* - - - - - - - - - - - - - - -*/
		/*Further reduce the footprint of the 2ndry nav*/
		#rightNav nav ul li a {
			font-size: 106%;
		}
		.boundaryImg {
			margin-bottom: 0.62em;
		}
		.boundaryImg a.theImage {
			float: none;
			margin-left: 0;
			max-width: 100%;
		}
		.boundaryImg a.theImage:hover span:not([aria-hidden]) {
			background: #902a8c;
		}
		/*Stack the map buttons vertically*/
		#content-main p.viewer {
			display: block;
			justify-content: inherit;
		}
		#content-main p.viewer > a:nth-of-type(1) {
			margin-right: auto;
			margin-left: auto;
			margin-bottom: 1.62em;
		}
		#content-main p.viewer > a:nth-of-type(2) {
			margin-right: auto;
			margin-left: auto;
		}
	}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - end-of-730px*/
	@media only screen and (max-width: 660px){/* - - - - - - - - - - - - - - -*/
		.boxpromo, .boxright {
			float: none;
			width: 100%;
		}
		.boxnav {
			float: none;
			width: 100%;
			margin: 20px;

		}
		#content-main ul.visnav li a {
			min-height: 130px;
			margin-right: 20px;
		}
		.clearmobile {
			clear: both;
			display: block;
		}
	}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - end-of-660px*/
	@media only screen and (max-width: 625px){/* - - - - - - - - - - - - - - -*/
		/*625px:
		The main template CSS switches to one column...*/

		/*Demote the visual prominence / more strongly associate the img copy
		  with the img by RH justifying.*/
		.boundaryImg a.theImage p {
			text-align: right;
		}
		.boundaryImg a.theImage:hover,
		.boundaryImg a.theImage:focus span:not([aria-hidden]) {
			background: #902a8c;
		}
		/*Reduce presence a little of strapline for this MQ*/
		.titlebot {
			font-size: 95%;
			line-height: 1.5;
			padding: 0.62em;
		}
		/*Reduce presence a little for this MQ*/
		h1 {
			font-size: 162%;
		}
		#content-main #rightNav nav ul {
			border-left: none;
			border-right: none;
		}
		#breadcrumbs {
			margin-bottom: 0.62em;
		}
		/*span.progDev (added by JS) shows the chevron. We don't want that
		  chevron on the last LI (the one with no A tag). We also don't want the chevron on a narrow
		  screen when we only have ONE LI, so use the .noShow class (added by JS)*/
		ul#breadcrumb li:last-of-type span.progDev::after,
		ul#breadcrumb li.noShow span.progDev::after {
			display: none;
		}
		div#rightNav nav ul li[aria-current] > a {
			background-color:#902A8C;
			border: 1px solid #902a8c;
			border-bottom: none;
		}
		div#rightNav nav ul li[aria-current]:last-child > a {
			border: 1px solid #902a8c;
		}
		/*Now we have width from columns un-stacking, put the map buttons back
		  side by side*/
		#content-main p.viewer {
			display: flex;
			justify-content: space-evenly;
		}
		/*Just gap from L button to right...*/
		#content-main p.viewer > a:nth-of-type(1) {
			margin-right: 0.31em;
			margin-left: inherit;
			margin-bottom: 0;
		}
		/*...and R button to left*/
		#content-main p.viewer > a:nth-of-type(2) {
			margin-left: 0.31em;
			margin-right: inherit;
		}
		/*"Menu" top right alongside the logo
			General and Closed*/
				.navRow {
					background: #fff;
				}
				#firstNavButton[aria-expanded="false"] {
			  		border-radius: 0 !important;
				}
				a.homeLogo img {
					width: 100%;
				}
				a.homeLogo {
					height: auto !important;
				}
				.homeLogo,
				#natt #firstNavButton {
					display: block;
				}
				.navRow > .row {
					display: flex;
				}
				.navRow > .row > a,
				#natt {
					flex: 1;
				}
				#natt .firstNav {
					height: 100%;
				}
				#natt nav button {
					font-size: 116%;
				}
				#natt nav button span {
					margin-left: -1.0em;
				}
		/*"Menu" top right alongside the logo)
			Open*/
				.mobopen #natt nav button {
					font-size: 138%;
				}
				.mobopen #natt nav button span {
					margin-left: 0;
				}
				#firstNavButton[aria-expanded="true"] {
			  		border-radius: 0 !important;
				}
				.mobopen #natt nav {
					width: 100%;
					height: inherit;
				}
				.mobopen #natt nav button {
					width: 100%;
					float: none;
				}
				.mobopen > a,
				.mobopen #natt {
					flex: inherit;
				}
				.navRow > .row.mobopen {
					display: inherit;
				}
		/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
																	.members img
		CSS designed for images that are 180px wide.
		- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
			.members .personBio {
				float: none;
				max-width: 100%;
				border: none;
				background: none;
				padding: 0;
				margin-left: 0;
			}
			.members .personBio img {
				max-width: inherit;
				margin: auto;
				display: block;
			}
			.members .personBio span[aria-hidden] {
				display: block;
				padding: 0;
			}
			.members .personBio span[aria-hidden] span {
				border: 1px solid #d0d0d0;
				background: #fafafa;
				display: inline-block;
				/*max-width: 180px;*/
				width: 180px;
			}
		/*What's New*/
			.neuf ul {
				margin-right: 1.62em;
				display: inherit;
			}
			.neuf ul li {
				margin-bottom: 0.62em;
			}
	}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - end-of-625px*/
	@media only screen and (max-width: 525px){/* - - - - - - - - - - - - - - -*/
		/*525px and lower loose all but the last LI > A breadcrumb by:
			(i) losing them all...*/
		ul#breadcrumb li {
			position: absolute;
			top: -999em;
		}
		/*	(ii) ...and then returning only the last LI > A (so ignoring earlier
		  	LI > As and the last LI (no A)*/
		ul#breadcrumb li.noShow {
			position: relative;
			top: inherit;
		}
		ul#breadcrumb li.noShow {
			margin-left: 1em;
		}
		/*For this special "Last LI Only" look, add back a chevron in front of it
		  to denote there is stuff above it/it is below stuff*/
		ul#breadcrumb li.noShow::after {
			color: #a0a0a0;
			font-family: "Material Icons";
			content: "\e5cc";
			font-size: 162%;
			display: block;
			position: absolute;
			top: -0.462em;
			left: -0.85em;
		}
		/*Footer logo swap to below the footer copy*/
		#bottompage {
			background-position: 50% 100%;
		}
		#bottompage .row {
			padding-bottom: 200px;
			padding-right: 0;
		}

		/*Now we add the province back to the bread - only for the existing
		  boundaries pages -- we get two chevrons, so lose one*/
		ul#breadcrumb li span.dupe::after {
			display: none;
		}
		ul#breadcrumb li.noShow::after {
			left: -1.0162em;
		}

		/*Changes for social media footer 2022-01-12*/
			#bottompage .row {
				padding-bottom: 0;
			}
			.footFlex {
				display: inherit;
				justify-content: inherit;
			}
			.socialA a {
				display: block;
				margin-left: auto;
				margin-right: auto;
				max-width: 62%;
				margin-top: 0;
			}
	}/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - end-of-525px*/