:root { --pink: #d60c8c; --dark-pink: #97005e; --light-pink: #ef9ed1; --blue: #0047bb; --dark-blue: #071d49; --light-blue: #9ca5b6; --green: #2DAD5B; --dark-green: #1D753D; --yellow:#F5C600; --dark-yellow: #eaab00; --grey: #555458; --inner-width: 1245px; --button-hover:#e6c19d; --narrow: 824px } @font-face { font-family: 'Gotham Book'; src: url("../fonts/Gotham-Book.ttf") format('ttf'), url('../fonts/GothamBook.woff2') format('woff2'), url('../fonts/GothamBook.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Gotham Bold'; src: url("../fonts/Gotham-Bold.ttf") format('ttf'), url('../fonts/GothamBold.woff2') format('woff2'), url('../fonts/GothamBold.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; } body, html{width:100%; height: 100%; margin: 0px; padding: 0px; color:var(--grey); scroll-behavior: smooth} body{background-color: #fff; font-size:18px; font-family: 'Gotham Book', sans-serif; overflow-x: hidden} div{background-repeat: no-repeat; background-position: center; background-size: cover; position: relative} button{border:0px} h1, h2, h3{font-weight:500; line-height: normal; font-family: 'Gotham Bold'; padding-top: 30px} h1{font-size:44px; color:var(--dark-pink); font-weight: 900} h2{font-size:30px; color:var(--grey)} h3{font-size:20px; color:var(--grey)} h4{font-size:18px; color: var(--grey)} h5{font-size:14px; color: var(--grey)} a{text-decoration: none; color: #313130; transition:all 300ms ease} img{max-width: 100%} a, a:active, a:focus{outline: none;} fieldset{} fieldset label{display: block} fieldset label input{margin: 0 5px 0 0} #interestFields, #keywordFields{column-count: 2; max-width: 1200px; margin: 0 auto 15px; border-color:deeppink; padding: 15px 30px} .fixedwidth{max-width: 1245px; padding: 0; margin: 0 auto} .yellow{color:var(--yellow) !important} .grey{color:var(--grey) !important} .pink{color:var(--dark-pink)!important} .blue{color:var(--blue)!important} .green{color:var(--green)!important} .red{color: crimson} .center{text-align: center!important} .bold{font-weight:700!important} .button{color:#fff; padding: 15px 30px; display:inline-block; cursor: pointer; font-weight:700; margin: 5px 5px 0 0} .sitemaplink{color: var(--pink) !important; font-size:11px; padding: 0px !important; margin: 10px 0 0 !important} .alignnone{margin: 30px auto} #donateapplet{margin: 30px auto; max-width: 500px} #donateapplet > div{border:1px solid var(--dark-pink); box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.75); background: #fff} .required:not(.choices):not(select):not(.wfAutosuggest){padding: 10px !important} input[type=text], input[type=email], input[type=tel], input[type=date], input[type=number], input[type=password]{ padding: 10px !important; color:#000 !important; height:inherit !important; margin: 5px 0 !important; border:1px solid var(--pink) !important; width:100% !important; max-width:100% !important; min-width:290px !important; box-sizing: border-box !important } select{padding:10px !important; border:1px solid var(--pink) !important; height:inherit !important; box-sizing: border-box !important} textarea{font-family: 'Open Sans', sans-serif; border:1px solid var(--pink) !important} input[type=checkbox]{width:26px; height: 26px} input[type=password]{max-width:200px !important; margin: 15px 0} main{min-height: 600px; line-height: 1.5em} main iframe{max-width: 100%} article iframe{display: block; margin: 0 auto} /* gradients */ .gradpink{ background: rgb(214,12,140); background: -webkit-linear-gradient(left, rgba(214,12,140,1) 0%, rgba(151,0,94,1) 100%); background: -o-linear-gradient(left, rgba(214,12,140,1) 0%, rgba(151,0,94,1) 100%); background: linear-gradient(to right, rgba(214,12,140,1) 0%, rgba(151,0,94,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d60c8c', endColorstr='#97005e',GradientType=1 ); transition:all 200ms ease } .gradpink:hover{ background: -moz-linear-gradient(left, rgba(214,12,140,1) 0%, rgba(181,6,116,1) 100%); background: -webkit-linear-gradient(left, rgba(214,12,140,1) 0%,rgba(181,6,116,1) 100%); background: linear-gradient(to right, rgba(214,12,140,1) 0%,rgba(181,6,116,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d60c8c', endColorstr='#b50674',GradientType=1 ); transform:translate(0px, -3px);box-shadow: 2px 2px 5px 2px rgba(0,0,0,0.1) } .gradyellow{ background: rgb(245,198,0); background: -moz-linear-gradient(left, rgba(245,198,0,1) 0%, rgba(234,171,0,1) 100%); background: -webkit-linear-gradient(left, rgba(245,198,0,1) 0%,rgba(234,171,0,1) 100%); background: linear-gradient(to right, rgba(245,198,0,1) 0%,rgba(234,171,0,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5c600', endColorstr='#eaab00',GradientType=1 ); transition:all 200ms ease } .gradyellow:hover{ background: rgb(245,198,0); background: -moz-linear-gradient(left, rgba(245,198,0,1) 0%, rgba(238,180,0,1) 100%); background: -webkit-linear-gradient(left, rgba(245,198,0,1) 0%,rgba(238,180,0,1) 100%); background: linear-gradient(to right, rgba(245,198,0,1) 0%,rgba(238,180,0,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5c600', endColorstr='#eeb400',GradientType=1 ); transform:translate(0px, -3px); box-shadow: 2px 2px 5px 2px rgba(0,0,0,0.1) } .gradblue{ background: rgb(0,71,187); background: -moz-linear-gradient(left, rgba(0,71,187,1) 0%, rgba(7,29,73,1) 100%); background: -webkit-linear-gradient(left, rgba(0,71,187,1) 0%,rgba(7,29,73,1) 100%); background: linear-gradient(to right, rgba(0,71,187,1) 0%,rgba(7,29,73,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0047bb', endColorstr='#071d49',GradientType=1 ); transition:all 200ms ease } .gradblue:hover{ background: rgb(0,71,187); background: -moz-linear-gradient(left, rgba(0,71,187,1) 0%, rgba(3,53,138,1) 100%); background: -webkit-linear-gradient(left, rgba(0,71,187,1) 0%,rgba(3,53,138,1) 100%); background: linear-gradient(to right, rgba(0,71,187,1) 0%,rgba(3,53,138,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0047bb', endColorstr='#03358a',GradientType=1 ); transform:translate(0px, -3px);box-shadow: 2px 2px 5px 2px rgba(0,0,0,0.1) } .gradgreen{ background: rgb(45,173,91); background: -moz-linear-gradient(left, rgba(45,173,91,1) 0%, rgba(29,117,61,1) 100%); background: -webkit-linear-gradient(left, rgba(45,173,91,1) 0%,rgba(29,117,61,1) 100%); background: linear-gradient(to right, rgba(45,173,91,1) 0%,rgba(29,117,61,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2dad5b', endColorstr='#1d753d',GradientType=1 ); transition:all 200ms ease } .gradgreen:hover{ background: rgb(45,173,91); /* Old browsers */ background: -moz-linear-gradient(left, rgba(45,173,91,1) 0%, rgba(36,143,75,1) 100%); background: -webkit-linear-gradient(left, rgba(45,173,91,1) 0%,rgba(36,143,75,1) 100%); background: linear-gradient(to right, rgba(45,173,91,1) 0%,rgba(36,143,75,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2dad5b', endColorstr='#248f4b',GradientType=1 ); transform:translate(0px, -3px);box-shadow: 2px 2px 5px 2px rgba(0,0,0,0.1) } .gradgrey{ background: rgb(45,45,45); background: linear-gradient(0deg, rgba(45,45,45,1) 0%, rgba(142,142,142,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d60c8c', endColorstr='#97005e',GradientType=1 ); transition:all 200ms ease } .gradgrey:hover{ background: rgb(45,45,45); background: linear-gradient(0deg, rgba(45,45,45,1) 0%, rgba(142,142,142,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d60c8c', endColorstr='#b50674',GradientType=1 ); transform:translate(0px, -3px);box-shadow: 2px 2px 5px 2px rgba(0,0,0,0.1) } .narrowcontent2{max-width: 824px; margin: 30px auto} .narrowcontent h1, .narrowcontent h2, .narrowcontent h3, .narrowcontent h4{max-width: var(--narrow); margin-left: auto; margin-right: auto} .narrowcontent p, .narrowcontent table, .narrowcontent hr, .narrowcontent ul, .narrowcontent ol{max-width: var(--narrow); margin-left: auto; margin-right: auto} .wp-block-columns{max-width: var(--narrow); margin: 0 auto} .pagination{max-width:1080px; margin: 60px auto} .pagination a, .pagination .current{display:inline-block; padding: 2px 16px; background-color: #fff; border-radius:4px} .smoke{background: #000; opacity: 0.5; position: absolute; left:0px; top:0px; width:100%; height: 100%} .font44{font-size: 44px} .spacetext{text-transform:uppercase; letter-spacing: 3px} .flex{display:flex; justify-content: center; align-items: center} .flex > div{flex-grow: 1} .center{text-align: center} .post-edit-link{background-color:var(--teal); display: inline-block; padding: 4px 12px; color:#fff; font-size:12px; transition:all 0.3s ease; margin: 20px 0; border-radius:10px} .post-edit-link:hover{background-color: var(--button-hover) !important; text-decoration: underline} .followus{font-weight:700; padding-bottom: 10px} #loginform{margin: 40px 0} #loginform input{padding:15px} #loginform label{display: block} #wp-submit{background-color: var(--pink); border:0px; transition:all 300ms ease; padding: 15px 40px !important} #wp-submit:hover{background-color: var(--dark-pink)} #topLoginBar{background:#071D49; color: #fff; position: relative; z-index: 101} #topLoginBar > div{max-width:1245px; margin: 0 auto; text-align: right; position: relative} #topLoginBar a{color: #fff; font-size:12px; letter-spacing: 1px; display:inline-block; padding: 0 35px 6px 0; margin: 0px; transition:all 300ms ease} #topLoginBar a:hover{opacity: 0.6} footer{width:100%; color:#000; background-image: url("../img/bg-texture.jpg"); padding-top: 80px; z-index: 1} #footerInner{width:100%; max-width:1245px; margin: 0 auto 50px; display: flex; justify-content: space-between; align-items: center} #footerInner > div{flex-grow:1; width:100%; max-width:48%} #footerInner > div:nth-of-type(1){font-size: 14px; line-height:1.5em; padding-left: 10px} #footerInner > div:nth-of-type(2){text-align: right} #footerInner ul{list-style: none; padding: 0px; margin:0px; font-size:16px} #footerInner ul a{display:block; padding: 2px 0} #footerInner a:hover{text-decoration: underline} .socials > div{padding-bottom:5px; display: inline-block; font-size:24px; margin-left: 10px} .socials a{background:#97105E; color:#fff; border-radius:80px; display: inline-block; width:43px; height:43px; text-align: center} .socials > div:nth-of-type(1) i{position: absolute; top:9px; left:14px} .socials > div:nth-of-type(2) i{position:absolute; top:9px; left:11px} .socials > div:nth-of-type(3) i{position:absolute; top:10px; left:10px} .socials > div:nth-of-type(4) i{position:absolute; top:10px; left:12px} .socials a:hover{opacity: 0.8} .creditouter{background-color: #071D49; color:#fff; padding: 15px 0} .credit{display:flex; justify-content: space-between; align-items: center; max-width: 1245px; margin: 0px auto} .credit > div{flex-grow:1; max-width:50%; font-size:1.4rem} .credit > div:first-of-type a{display: inline-block; padding: 0 15px 0 0} .credit > div:nth-of-type(2){text-align:center} .credit > div:nth-of-type(3){text-align:right} .credit a{color: #fff} #error{color:crimson; padding-bottom: 10px} .errorfield{border:1px solid crimson} .hero{background: #efefef; background-position: center; background-repeat: no-repeat; background-size: cover} .hero img{object-fit:contain; width:100%} .herocaption{position: relative} .herocaption > div{position: absolute; left:10%; bottom:-40px; max-width:425px; background-color: #fff; padding: 15px 30px; color: var(--dark-pink); font-weight:700; font-size:40px; line-height: 50px; z-index: 2} .cookiebar{position: fixed; bottom:30px; left:0px; width:100%; padding: 30px; z-index: 20; font-size:14px; display:none} .cookiebar > div{display:flex; box-shadow: 4px 3px 5px 5px rgba(0,0,0,0.14); padding:20px; justify-content: space-between; align-items: center; background: #fff} .cookiebar > div > div{width:100%} .cookiebar > div > div:last-of-type{max-width: 200px; text-align: right} .cookiebar a{text-decoration: underline; color:#000} .cookiebutton{display: inline-block; padding: 10px 25px; color:#fff; cursor:pointer; transition:all 200ms ease} .cookiebutton:hover{opacity:0.9} .videoWrapper { position: relative; padding-bottom: 56.25%; /* 16:9 */ height: 0; background-color: #000 } .videoWrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } #masthead{display: flex; justify-content: center; align-items: center; flex-wrap:nowrap; align-content: space-between; z-index: 10; font-size:14px; max-width:var(--inner-width); margin: 0px auto; padding: 10px 0 0; width:98%; font-weight:600} #masthead > div{flex-grow:1} #masthead > div:first-of-type{padding-left: 20px; max-width:270px} #masthead > div:last-of-type{text-align:right; padding-right: 20px} #mastheadfloat{position: fixed; width:100%; top:-400px; left:0px; background: #fff; box-shadow: 5px 5px 15px 0px rgba(0,0,0,0.2); transition:all 300ms ease; z-index: 20; } #mastheadfloat > div{display: flex; justify-content: center; align-items: center; flex-wrap:nowrap; align-content: space-between; font-size:14px; padding: 10px 0; width:100%; font-weight:600; max-width: 1245px; margin: 0 auto} #mastheadfloat > div > div{flex-grow:1} #mastheadfloat > div > div:first-of-type{padding-left: 20px; max-width:270px} #mastheadfloat > div > div:last-of-type{text-align:right; padding-right: 20px} #mastheadfloat .bigbuttons{padding-bottom: 5px} #mastheadfloat .bigbuttons a{padding:8px 30px; font-size:14px} .bigbuttons{padding-bottom: 15px; font-size:16px; margin-right: 15px} .bigbuttons a{padding: 12px 40px; color: #fff; display: inline-block} .bigbuttons a:last-of-type{margin-left: 30px} /* main nav */ #mainnav{text-align: right; color:#000; font-size:16px} #mainnav > ul{list-style: none; margin: 0px; padding: 0px} #mainnav > ul > li{margin: 0px; display: inline-block; position: relative} #mainnav > ul > li > a{display:block; cursor:pointer; transition:all 300ms ease; padding: 12px 15px 12px; color:#555458} #mainnav > ul > li > a:hover{ background: #ccc} /* sub nav */ #mainnav ul > li ul{position: absolute; top:42px; left:0px; display: none; min-width: 180px; padding:0px; background: #ccc} #mainnav ul > li ul > li{display:block; padding:0px; border:0px} #mainnav ul > li ul > li > a{display:block; text-align: left; padding: 8px 5px 8px 15px; transition:all 300ms ease; border-left:4px solid #ccc} #mainnav ul > li ul > li > a:hover{background: #fff; border-left:4px solid var(--pink)} #mainnav > ul > li > .current-menu-item a{border-bottom:2px solid #ACACAC; color: #000} #mainnav .activeNav{background: #fff; border-left:4px solid var(--pink) !important} #mobnavbutton{cursor:pointer; display:none; z-index: 50; width:32px; margin-right: 15px} #mobnavbutton > div{margin: 5px 0; border:0px; border:2px solid #000} #mobnav{background-color: #ccc; position: fixed; top:0px; left:0px; z-index: 10; display: none; width:100%; height: 100%; padding: 110px 30px 30px; overflow: auto} #mobnav ul{list-style: none; margin: 0px; padding: 0px} #mobnav ul > li{padding: 0px; margin: 0px; display: block; position: relative} #mobnav > ul > li > a{display:block; padding: 10px; cursor:pointer; letter-spacing: 4px; background: #071d49; color:#fff; margin: 3px 0} #mobnav > ul > li:first-of-type{} #mobnav > ul > li:first-of-type a{} #mobnav ul > li ul{display: none} #mobnav ul > li ul > li{display:block} #mobnav ul > li ul > li > a{color:#071d49; display: block; padding: 5px 0 5px 30px; font-weight: 700} #mobnav a i{position: absolute; right:60px; top:15px; transition:all 100ms ease} #mobnav .button{margin: 60px auto 0; display: block; text-align: center} #mobnav .fas{position: absolute; right:10px; top:10px; color: #fff; display: none} #mobnav .menu-item-has-children .fas{display:block} #mobnav .activeNav{color: var(--pink) !important} #mobNavMasthead{display:flex; justify-content: space-between; align-items: center; padding: 15px 0} #mobNavMasthead > div{flex-grow:1} #mobNavMasthead > div:first-of-type{width:100px; height: 67px; background-size: contain; background-position: center left 51px; background-repeat: no-repeat; background-image: url(/wp-content/uploads/2020/06/logo-mv-top.png); margin-top: 3px} #mobNavMasthead > div:last-of-type{padding: 0 36px 0 0; text-align: right} #mobNavMasthead i{font-size: 30px; color: #000} .moblogo{cursor:pointer} #mobnavfloat{display:none; position: fixed; box-shadow:0px 0px 10px #ccc; transition:all 100ms ease; top:24px; align-items: center; justify-content: space-between; background: #fff; width:100%; z-index: 100; padding: 5px} #mobnavfloat> div{flex-grow:1} #mobnavfloat img{width:100%; height: auto; margin: 8px} #mobnavfloat > div:nth-of-type(1){max-width:300px; padding-right: 40px} #mobnavfloat > div:nth-of-type(2){text-align: right; padding-right: 40px} #mobnavfloat > div:nth-of-type(3){min-width:40px; max-width:40px} #mobnavfloat > div:nth-of-type(2) a{padding:10px 20px; font-size:14px} #mobNavClose{font-size: 40px; color: #000; display:none} .pagelinks{width:100%;; max-width:1080px; margin: 0px auto; display:block; padding: 30px 0} .pagelinks > a{display: inline-block; border:1px solid #efefef; padding: 2px 10px; border-radius:3px; transition:all 200ms ease} .pagelinks > a:hover{background-color: var(--teal); color: #fff; border-color:var(--teal)} #cookiebar{background:#fff} .hpcontent{padding:0px 10px 40px} .hpcontent p:first-of-type{font-size:30px; font-weight:500} .hpfixedh2{display: block; max-width:1245px; margin: 30px auto; font-size:44px; font-weight:900; color:var(--dark-pink);} .texturewrap{display: block; padding: 1px; background-image:url("../img/bg-texture2.jpg"); background-repeat: repeat-x; background-position: top center; background-size:auto} .texturewrap2{display: block; padding: 1px; background-image: url("../img/bg-texture.jpg"); background-repeat: repeat-x} /* CTA*/ .cta{display:flex; justify-content: space-between; align-items: stretch; max-width:1245px; margin: 0px auto 20px} .cta > div{flex-grow:1; width:100%; max-width:32.5%; position: relative; padding-bottom: 60px} .cta h2{padding:0px; margin:0px; display:inline-block; position: relative} .cta > div:nth-of-type(1) h2 span{color:var(--pink)} .cta > div:nth-of-type(2) h2 span{color:var(--blue)} .cta > div:nth-of-type(3) h2 span{color:var(--green)} .cta h2 i{position:absolute; right:-40px; bottom:4px; width:60px; height: 60px; background-size: contain; background-image: url("../img/arc-purple.svg"); background-repeat: no-repeat; background-position: center} .cta > div:nth-of-type(2) h2 i{background-image: url("../img/arc-blue.svg")} .cta > div:nth-of-type(3) h2 i{background-image: url("../img/arc-green.svg")} /* CTA 2 (gutenberg block) */ .cta2{display:flex; justify-content: flex-start; align-items: stretch; max-width:1245px; margin: 60px auto 0; flex-wrap:wrap; padding:0px 5px} .cta2 > div{flex-grow:1; width:100%; max-width:395px; position: relative; padding-bottom: 60px; margin-bottom: 50px; margin: 0 8px 60px} .cta2 h2{padding:0px; margin:0px; display:inline-block; position: relative; line-height: 1.5em} .cta2 > div:nth-of-type(1) h2 span{color:var(--pink)} .cta2 > div:nth-of-type(2) h2 span{color:var(--blue)} .cta2 > div:nth-of-type(3) h2 span{color:var(--green)} .cta2 h2 > div{display:inline-block; width:1px; height: 1px; position: relative} .cta2 h2 i{position: absolute; right:-25px; bottom:4px; width:40px; height: 40px; background-size: contain; background-image: url("../img/arc-purple.svg"); background-repeat: no-repeat; background-position: center; display: inline-block} .cta2 > div:nth-of-type(2) h2 i{background-image: url("../img/arc-blue.svg")} .cta2 > div:nth-of-type(3) h2 i{background-image: url("../img/arc-green.svg")} .ctathumb{padding-bottom: 56%; background: #666; margin: 20px 0; background-position: center; background-size: cover} .ctatext{padding:0 0 30px; line-height: 24px} .ctabutton{padding: 15px 0; text-align: center; color:#fff; width:100%; display: block; font-size:20px; font-weight:500; position: absolute; bottom:0px; left:0px} .cta.woman{margin: 60px auto} .cta.woman h2{font-size:25px} .cta.woman .ctathumb{padding-bottom: 75%} .cta.woman > div:nth-of-type(2) h2 i{background-image: url("../img/arc-purple.svg")} .cta.woman > div:nth-of-type(3) h2 i{background-image: url("../img/arc-purple.svg")} /* Workshop promo */ .fiftyx2{display: flex; justify-content: space-between; align-items: stretch; max-width: 1245px; margin: 100px auto 60px} .fiftyx2 > div{width:100%; max-width:48%} .fiftyx2 > div:last-of-type h2:first-of-type{color: var(--yellow); padding: 0px; margin:0px; font-size:44px; font-weight:900} .fiftyx2 > div:last-of-type h2:nth-of-type(2){padding:0px; margin: 0px; font-size:44px; font-weight:900; display: inline-block; position: relative} .fiftyx2 h2 i{position:absolute; right:-40px; bottom:15px; width:60px; height: 60px; background-size: contain; background-image: url("../img/arc-yellow.svg"); background-repeat: no-repeat; background-position: center} .fiftyx2 .fom{margin-top: 40px} .fiftybutton{display:inline-block; padding: 15px 100px; text-align: center; color: #fff} .fiftythumb{padding-bottom:60%; background:#efefef; background-size: cover; background-position: center} .fiftycaption{box-shadow:1px 1px 5px 3px #ccc; display: inline-block; padding: 1px 14px; background: #fff; transform:translate(30px, -17px); font-size:14px} /* HP split box */ .hpsplitbox{display: flex; justify-content: space-between; align-items: stretch; margin: 20px auto; max-width:1245px; font-size:18px} .hpsplitbox > div{width:100%; max-width:50%; background: #efefef; color: #fff; background-size: cover; background-position: center} .hpsplitbox h3{ font-size:44px; font-weight:900; color: #fff; padding: 0px !important; margin:0px !important} .hpsplitbox a{display: block; padding: 15px; color:#fff; font-weight:500px; text-align: center; margin: 30px auto 0} .hpsplit1 > div:first-of-type{padding: 60px 150px; background: #838ea4} .hpsplit2 > div:last-of-type{padding: 60px 150px; background: #cb7fae} /*Subs box */ .subscribebox{display: flex; justify-content: space-between; align-items: center; background: #2DAD5BA7; color: #fff; max-width: 1245px; margin: 60px auto 0px; transform:translate(0px, 50px); z-index: 10} .subscribebox > div{background-size: cover; background-position: center; width:100%} .subscribebox > div:nth-of-type(1){max-width: 300px; padding-bottom: 15%} .subscribebox > div:nth-of-type(2){max-width: 300px; padding: 16px; font-size:16px} .subscribebox > div:nth-of-type(3){padding:15px; font-size:14px} .subscribebox h3{color:#1D753D; padding: 0px; margin: 0px; font-size:30px; font-weight:500} .subscribebox input{border:0px !important; min-width:inherit !important; max-width:220px !important; font-size:18px} .subscribebox input[name=email]{margin-right: 10px} .subscribebox input[type=submit], .subscribebox input[type=button]{margin: 0px; padding: 10px; width:100px; color: #fff; font-weight:500} .subscribebox input[type=email], .subscribebox input[type=text]{padding:8px} .subcbflex{display: flex; justify-content: space-between; align-items: center} .subcbflex > div{width:100%} .subcbflex > div:first-of-type{max-width: 30px} .subcbflex input[type=checkbox]{width:26px; height: 26px} .subcbflex a{color:#fff; text-decoration: underline} /* Video Promo */ .videopromo{max-width:1245px; display: flex; justify-content: space-between; align-items: stretch; margin: 20px auto 30px} .videopromo > div{flex-grow:1; background-repeat: no-repeat} .videopromo > div:first-of-type{width:825px; padding-bottom: 30%; margin-right: 15px; background: #000; background-size: 115%; background-position: center; transition:all 500ms ease} .videopromo > div:first-of-type:hover{background-size: 110%} .videopromo > div:last-of-type{background: #fff} .videolist{max-height: 400px; overflow: auto; font-size:13px} .videolist > div{display: flex; justify-content: space-between; align-items: stretch; margin: 0 auto 15px} .videolist > div > div{flex-grow:1; width:100%; position: relative} .videolist > div > div:first-of-type{background: #000; transition:all 500ms ease; cursor:pointer; padding-bottom: 20%; max-width:195px; margin-right: 10px; background-size: cover; background-position: center} .videolist > div > div:first-of-type:hover{opacity:0.8} .videolist p{padding: 5px 0px; margin: 0px; line-height: 18px} .videolist h4{font-size:14px; color:#000; padding: 0px; margin: 0px} .videolist a{color: var(--dark-pink); font-weight:700} .promoread{position: absolute; right:15px; top:15px; color: #efefef; text-shadow:1px 1px 2px #000; font-size:10px} .promoread i{background-color: rgba(255,255,255,0.5); padding: 5px 5px; border-radius:30px} .promoplay{position: absolute; top:0px; left:0px; width:100%; height: 100%; display: flex; justify-content: space-around; align-items: center; font-size:60px} .promoplay > div{border-radius:100px; background: #fff; opacity: 0.6; color: #000; width:110px; height: 110px; position: relative} .promoplay > div .fa-play{position: absolute; top:25px; left:34px} .promoplay > div .fa-book-open{position: absolute; top:28px; left:20px} .viewstoriesbutton{display: block; padding: 15px 30px; color:#fff; font-weight:500; margin: 0 auto 30px; text-align: center; max-width:300px} .signupbutton{padding: 18px 80px; display: inline-block} /* Form assembly */ .wFormTitle{color: var(--dark-pink) !important} #submit_button{background-color: var(--dark-pink)} .wFormHeader{display: none} .wForm{font-size: 18px !important} .wForm .label{font-weight:700 !important} .wForm input[type="radio"]{width:30px; max-width: 30px !important} .wForm input[type="checkbox"]{width:22px !important; height:22px !important; margin-right: 10px} .wForm input[type="text"]{padding: 10px !important; height: inherit !important} .wForm textarea{min-height: 120px; width:100% !important; max-width:90% !important; min-width:90% !important} .wForm .required{min-width:100% !important; max-width:100% !important} .wForm .inputWrapper{width:100%} /* News */ .newslist{display:flex; justify-content: space-between; align-items: stretch; flex-wrap: wrap; max-width:var(--narrow); margin: 0 auto} .newslist > div{flex-grow: 1; width:100%} .newslistitem{width:100%; max-width:32%; margin: 0 0 30px; background: #fff} .newslistitem h2{color:var(--dark-pink); font-size:30px; padding: 0px; margin: 0 0 30px} .newsthumb{padding-bottom: 56%; background-position: center; background-size: cover} .newsthumb a{display: block; width:100%; height: 100%; position: absolute; top:0px; left:0px} .newsbutton{display: block; text-align: center; margin-top: 30px; padding: 15px} .newsdate{font-size: 12px; padding: 5px 0 0} .articleDate{font-weight:700; font-size:18px; padding-bottom: 10px; max-width: var(--narrow); margin: 0 auto} /* WS results */ .wsFormWrap{max-width:600px; margin: 0 auto; padding: 20px auto 60px} .wsFormWrap input[type=checkbox]{width:24px; height: 24px; border:1px solid var(--yellow) !important} .wsFormWrap input[type=radio]{width:24px; height: 24px} .wsFormWrap input[type=text]{width:100%; border:1px solid var(--yellow); padding: 10px} .wsFormWrap input[type=submit]{display: inline-block; padding: 15px 20px; color: #fff; font-weight:700; margin: 40px 0 60px; border:0px; font-size:20px} .wsFormWrap input[type=button]{display: inline-block; padding: 15px 20px; color: #fff; background: #ccc; font-weight:700; margin: 40px 0 60px; border:0px; font-size:20px; cursor:not-allowed} #wsSbmit2{display: none; cursor:pointer} input[name=postcode]{max-width: 180px} .wsFormWrap h3{padding: 0 0 3px; margin: 0px; font-weight:700; font-size:20px} .wsFormWrap .gap{height: 40px} .wsformflex{display: flex; justify-content: space-between; align-items: center} .wsformflex > div{flex-grow:1; padding:4px} .wsformflex > div:first-of-type{max-width: 40px} .wFormTitle{display: none} .wFormContainer .wForm{background: none !important} .wsItDesc{line-height: 1.3em} #searchresults{display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap; max-width:1245px; margin:40px auto} #searchresults > div{max-width: 390px; flex-grow:1; margin:12px} .wsItem{margin: 10px; font-size: 14px; padding: 10px; background: #F0F0F0} .wsItem a{display: inline-block; padding: 4px 25px; color:#fff; font-weight:700; margin: 10px 0 0} .wsItem > div:first-of-type{display: flex; justify-content: space-between; align-items: stretch; margin-bottom: 10px} .wsItem > div:first-of-type > div{flex-grow:1} .wsItem > div:first-of-type > div:first-of-type{max-width:60px} .wsItem > div:first-of-type > div:last-of-type{padding-left:10px; color:var(--dark-pink); font-weight:700; font-size:20px} .wsItem.male > div:first-of-type > div:last-of-type{color:var(--dark-blue)} .wsItem.male .wsItDate > div:first-of-type{background: var(--dark-blue)} .wsItem.male .wsItDate > div:last-of-type{background: var(--blue)} .wsItem.male .wsItTitle i{background-image: url("../img/arc-blue.svg")} .wsItem.grey > div:first-of-type > div:last-of-type{color:#333} .wsItem.grey .wsItDate > div:first-of-type{background: #333} .wsItem.grey .wsItDate > div:last-of-type{background: #666} .wsItem.grey .wsItTitle i{background-image: url("../img/arc-grey.gif")} .wsItem.either > div:first-of-type > div:last-of-type{color:var(--dark-blue)} .wsItem.either .wsItDate > div:first-of-type{background: var(--dark-yellow)} .wsItem.either .wsItDate > div:last-of-type{background: var(--yellow)} .wsItem.either .wsItTitle i{background-image: url("../img/arc-yellow.svg")} .wsItDate{min-width:60px; max-width:60px} .wsItDate > div{text-align: center; color: #fff; padding-left: 8px; padding-right: 8px} .wsItDate > div:first-of-type{background: var(--dark-pink); font-size:15px; padding: 3px 0} .wsItDate > div:last-of-type{background: var(--pink); font-size:18px; font-weight:700} .wsItdateStr{font-weight:700} .wsItTitle{padding-right: 30px} .wsItTitle i{display:inline-block; position: absolute; top:0px; right:0px; background-image:url("../img/arc-purple.svg"); background-size: contain; background-repeat: no-repeat; background-position: center; width:30px; height: 30px} .vmbw{text-align: center !important; padding: 20px} .vmbw > a{display:inline-block; padding: 18px 40px; color: #fff; font-weight:700; font-size:20px} /* Events list */ .eventsflex{display: flex; justify-content: space-between; align-items: stretch} .eventsflex > div{flex-grow:1; width:100%} .eventsflex > div:first-of-type{max-width: 300px; background: #F0F0F0; color: #000} .eventsflex > div:last-of-type{padding: 10px} .eventsBlurb{max-width: 650px; margin: 0 auto; padding: 0 0 40px} .eventResultCount{color: var(--dark-pink); font-size:18px; font-weight:700; padding: 7px 0 17px} .evList{display: flex; align-items: stretch; flex-wrap: wrap; justify-content:flex-start} .evList > div{flex-grow:1; width:100%; margin:0 15px 30px 0} .evItem{max-width: 293px; margin-bottom: 30px} .evThumb{padding-bottom: 45%; margin-bottom: 10px; position: relative; background: #efefef;} .evThumb img{width:100%; height: 100%; position: absolute; top:0px; left:0px; object-fit:cover} .evItem h2{color:var(--dark-pink); font-size:20px; padding: 0px; margin: 0px; font-weight:700; min-height: 60px} .evItem h2 a{color:var(--dark-pink)} .eventDets{padding: 15px 0; font-size:14px} .evListDate{} .evListLocation{min-height: 60px} .evbutton{display:block; text-align: center; padding: 15px} .evFilterBox > div{border-bottom:2px solid #fff; padding:15px; color: #000 !important} .evFilterBox h3{padding: 0px; margin: 0px; font-size:22px; font-weight:700; color: #000} .evFilterBox h4{padding: 0 0 10px; margin: 0px; font-size:18px; font-weight:700; color: #000} .evFilterBox select{width:100%} .filterkeywords > div{padding: 0 0 5px} .filterkeywords > div a{color: #000000} .filterkeywords > div a:hover{color:var(--dark-pink)} .filterkeywords .active a{color:var(--dark-pink); font-weight:700} .contactFlex{display: flex; justify-content: space-between; align-items: stretch; margin: 0px auto; max-width: 1000px} .contactFlex > div{flex-grow:1} .contactFlex > div:first-of-type{padding: 0 0 0 10px} .contactFlex > div:last-of-type{max-width:400px; padding: 50px 0 0 30px} .contactFlex input{border:1px solid var(--dark-pink); width:100%; max-width: 80%; padding: 12px} .contactFlex textarea{border:1px solid var(--dark-pink); background: #fff; width:100% !important; max-width: 80% !important; padding: 12px} .contactFlex label{color:#000; font-weight:700} .contactFlex input[type=submit]{padding:15px; display:inline-block; color:#fff; font-weight:500; background: var(--dark-pink); max-width:200px; margin: 15px 0 0} .contactFlex input[type=checkbox]{width:26px; height: 26px} .contactFlex .contactItem:nth-of-type(1) > div:first-of-type{background-image: url("../img/icon-telephone.svg")} .contactFlex .contactItem:nth-of-type(2) > div:first-of-type{background-image: url("../img/icon-fax.svg")} .contactFlex .contactItem:nth-of-type(3) > div:first-of-type{background-image: url("../img/icon-email.svg")} .contactFlex .contactItem:nth-of-type(4) > div:first-of-type{background-image: url("../img/icon-location.svg")} .contactFlex .wpcf7-list-item-label{font-size:14px; font-weight:normal; color:#071D49; max-width:300px; display: inline-block; padding:0 0 10px 15px} .contactFlex .wpcf7-list-item-label a{font-weight:900} .contactFlex .wpcf7-list-item{padding:0px; margin: 0px} .contactItem{display:flex; justify-content: space-between; align-items: flex-start} .contactItem > div{flex-grow:1; text-align: left; background-position: top center; background-repeat: no-repeat; background-size: 36px auto} .contactItem > div:first-of-type{width:60px; max-width:60px; height: 60px} .contactItem > div:last-of-type{padding: 0 0 50px 10px; color:#000; font-weight:700} #acceptance{font-size:14px; color:#071D49} #acceptance a{font-weight:700} #radioWrap > span{display:block; width:100%; padding:0px; margin: 0px; max-width:250px} #radioWrap input{width:24px; height:24px} .instawrap{max-width: 1245px; margin: 0 auto} .instawrap h2{font-size:44px; color: var(--dark-pink); font-weight:900; padding: 0 20px} #instaapp{width:100%; text-align: center; color: #fff} .eapps-instagram-feed-title-container{display: none} .faqs{margin: 40px auto; color: #000; max-width: var(--narrow)} .faqs > div{ background: #E6E6E6; margin: 0 auto 10px} .faqs > div > div{padding: 0 15px 5px 15px; font-size:16px; line-height:1.5em; display: none} .faqs h3{margin:0px; padding:8px 40px 8px 15px; color: var(--grey); font-size:18px; font-weight:700; cursor:pointer; transition:all 300ms ease} .faqs h3:hover{opacity: 0.7} .faqs p{margin: 0 0 15px} .faqs i{cursor:pointer; position: absolute; top:8px; right:15px} .eventmap{margin: 40px auto} .eventmap a{color: #666} .eventmap a:hover{color: var(--dark-pink)} .teamlist{display: flex; justify-content:space-around; align-items: stretch; color: var(--dark-pink) !important; flex-wrap:wrap; max-width:1200px; margin: 0 auto} .teamlist > div{flex-grow:1; width:100%; min-width:25%; max-width:25%; margin: 0 0 60px; text-align: center} .teamlist > div:nth-of-type(3n){margin-right: 0px} .teamlist h4{margin-bottom: 10px} .teamThumb{width:116px; height: 116px; border-radius:200px; margin: 0 auto; filter: grayscale(100%);} .teamTitle{color:var(--dark-pink); text-align: center; font-size:44px; margin-bottom: 60px} #wssearchform{padding:30px 0 0} .otherWsSearchForm{max-width:1245px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center} .otherWsSearchForm > div{padding: 4px; width:25%; flex-grow:1; font-size: 15px; color: #071D49; font-weight:700} .otherWsSearchForm > div:nth-of-type(1) select{width:96%} .otherWsSearchForm > div:nth-of-type(2){max-width:180px} .otherWsSearchForm > div:nth-of-type(3){max-width:360px} .otherWsSearchForm > div:nth-of-type(4){max-width:200px; text-align: right} .otherWsSearchForm label{display: none} .timeSlotSel{display:flex; justify-content: space-between; align-items: center; font-size:14px} .timeSlotSel > div{padding: 4px; flex-grow:1} .timeSlotSel > div:nth-of-type(odd) {max-width: 36px} .sessionMonth{border-bottom:1px solid var(--dark-pink); padding: 30px 15px; color:var(--dark-pink); font-weight:bold; max-width:900px; margin: 0 auto; cursor:pointer} .sessionMonth:hover{color:#666} .sessionLoader{max-width: 900px; margin: 0 auto; display:none} .sessionStrip{display:flex; justify-content: space-around; align-items: stretch; max-width: 1200px; margin: 0 auto} .sessionStrip > div{flex-grow:1; padding: 15px 0; font-size:15px} .sessionStrip > div:nth-of-type(1){max-width:120px; padding-left: 15px} .sessionStrip > div:nth-of-type(3){max-width:120px} .sessionStrip > div:nth-of-type(4){max-width:200px} .sessionStrip .button{padding: 5px 10px 5px; font-size:16px !important; text-align: center} .sessModal{display: none} .modal-dialog{background: #fff; border:1px solid var(--dark-pink); position: fixed; top:60px; z-index: 100; padding: 0 20px 20px;-webkit-box-shadow: 3px 4px 16px -6px rgba(0,0,0,0.64); -moz-box-shadow: 3px 4px 16px -6px rgba(0,0,0,0.64); box-shadow: 3px 4px 16px -6px rgba(0,0,0,0.64);} .modal-header{position: relative} .modal-header i{position: absolute; top:-10px; right:0px; cursor:pointer} .modal-footer{text-align: center} .modal-title{color:var(--dark-pink)} .loginError{color:crimson; padding-bottom: 10px; display: none} .saveAndResume input[type='text'], .saveAndResume input[type='password'], input[type='text'].validate-email, input[type='password']#password{height: inherit !important; padding: 10px !important} .ws_time{margin: 10px 0 0} .wsTick{color:#2DAD5B; font-size:30px; font-weight:bold; margin: 60px 0 40px} .wsTick .fa-check-circle{font-size:60px; display:block; font-weight:normal; margin: 0 0 30px} .wsConfTitle{color:#000; font-weight:700; margin: 0 0 30px; font-size: 20px} .wsConfVenue{color:var(--dark-pink); font-weight:700; font-size: 20px} .wsConfDate{color:var(--dark-pink); margin: 0 0 30px; font-size: 20px} .volWsItem{display: flex; justify-content: space-between; align-content: center; margin: 0 auto 30px} .volWsItem > div{border-bottom:1px solid #ccc; flex-grow:1; width:100%} .volWsItem > div:last-of-type{max-width: 260px; text-align: center} .volWsItem h3{margin: 0px; padding: 0 0 15px; color: var(--dark-pink); font-size:16px} #volMenu{position: absolute; top:24px; right:50px; border:1px solid #071D49; background: #fff; color: #000; z-index: 200; list-style: none; padding: 0px; margin: 0px; display:none} #volMenu li{display: block} #volMenu a{color: #071D49; display: block; padding: 6px 12px; text-align: left} #volMenu a:hover{background: var(--dark-pink); color: #fff} #pwUpdate{text-align: center} #pwUpdate input{margin: 0 auto 20px !important; width:100%} #newsletterformerrors{color:crimson; padding: 10px 0 0; display: none} .videoWrapper{position: relative; padding-bottom: 56%} .videoWrapper iframe{position: absolute; top:0px; left:0px; width:100%; height: 100%} .tutorialVideos{display: flex; justify-content: flex-start; align-content: center; flex-wrap: wrap} .tutorialVideos > div{width:100%; max-width: 30%; margin: 5px} .tutorialVideos p{display: inline; padding: 0px; margin: 0px} .gdprwrap{border:1px solid var(--dark-pink); padding:20px; font-size:14px; max-height: 140px; overflow: auto; box-shadow:inset 1px 2px 10px #ccc; margin: 0 0 30px} .gdprwrap h3{color:var(--dark-pink); margin: 0px; padding: 0 0 15px; font-size:16px; font-weight:normal} .gdprwrap p{margin: 0; padding: 0 0 15px} .gdprwrap a{color:var(--dark-pink)} .gdprwrap a:hover{color:var(--pink)} .wFormFooter:empty{display: none} .supportInfo:empty{display: none} .wFormFooter:blank{display: none} .supportInfo:blank{display: none} .nomatch{text-align:center; font-weight:bold; padding:20px; max-width: 1200px; margin: 40px auto} .matchhidden{display:none} .donflex{align-items: stretch} .donflex > div{width:100%; max-width: 50%; padding-bottom: 120px; position: relative; margin: 0 0 40px} .donflex > div:first-of-type{padding: 0 30px 0 0} .donflex > div:larst-of-type{padding: 0 0 0 30px} .donflex .button{position: absolute; left:0px; bottom:0px} .threeButtonRow{display:flex; justify-content: space-between; align-items: stretch; padding: 15px 10px} .threeButtonRow > div{flex-grow:1; width:33%} .threeButtonRow > div:nth-of-type(1){text-align: left} .threeButtonRow > div:nth-of-type(2){text-align:center} .threeButtonRow > div:nth-of-type(3){text-align:right} .threeButtonRow .button{text-align: center; margin: 5px; width:96%} .fa-lock{margin-left: 4px} .usefulContacts{display: flex; justify-content:space-between; align-items: stretch; flex-wrap: wrap; margin: 0 auto 0; max-width: var(--narrow) } .usefulContacts > div{flex-grow:1; width:100%; max-width: 240px; text-align: center; margin-bottom: 50px} .usefulContacts > div > div:nth-of-type(1){width:240px; height:240px; background-color: #efefef; background-size: cover; background-position: center; border-radius:300px; margin-bottom: 15px} .usefulContacts a{text-decoration: underline !important; display: block; padding: 15px 0 0} .usefulContacts .blue{color: var(--blue)} .usefulContacts .pink{color: var(--pink)} .usefulContacts .green{color: var(--green)} .usefulContacts .orange{color: var(--yellow)} .ucIntro{margin-bottom: 30px} #hospitalTopBar{background:#071D49; color: #fff; position: relative; z-index: 101;display: non} #hospitalTopBar > div{max-width:1245px; margin: 0 auto; text-align: right; position: relative;font-size:12px; padding: 5px 5px 1px} #hospitalTopBar a{color: #fff; font-size:12px; letter-spacing: 1px; display:inline-block; padding: 0 35px 6px 0; margin: 0px; transition:all 300ms ease} #hospitalTopBar a:hover{opacity: 0.6} #hospitalTopBar span{text-transform: uppercase; letter-spacing: 1px} .pum-theme-466378 .pum-container, .pum-theme-lightbox .pum-container{border:2px solid var(--dark-pink)} .pum-theme-466378 .pum-title, .pum-theme-lightbox .pum-title{color:var(--dark-pink); text-align: center; font-size:22px} .pum-content, .popmake-content{border:0px !important} .pum-theme-466378 .pum-content, .pum-theme-lightbox .pum-content{border:0px !important; color:#666} /* Logos and images page*/ #post-543134{} #post-543134 img{box-shadow:2px 2px 10px #ccc; margin: 5px} .loader img{max-width:120px; height: auto} .wsNotLive{} .wsNotLive h5{padding:0px; margin: 0} @media (max-width: 1245px) { .credit{max-width: 96%} .cta{flex-direction: column; justify-content:center; max-width: 400px !important; margin-left: auto; margin-right:auto} .cta > div{max-width: 100%; margin-top: 60px} .cta i{display: block} .fiftyx2{flex-direction: column; max-width:650px} .fiftyx2 > div{max-width:100%} .hpfixedh2{padding-left: 10px; max-width: 650px} .fiftyx2 > div:last-of-type{padding: 10px} .subscribebox{flex-direction: column; max-width:650px} .subscribebox > div{max-width:100% !important} .subscribebox > div:first-of-type{padding-bottom: 60%} .hpsplitbox{flex-direction: column; max-width: 650px} .hpsplitbox > div{max-width: 100%} .hpsplit1{flex-direction: column-reverse !important} .hpsplit1 > div:first-of-type{padding:40px 30px} .hpsplit1 > div:last-of-type{padding-bottom: 56%} .hpsplit2 > div:first-of-type{padding-bottom: 56%} .hpsplit2 > div:last-of-type{padding:40px 30px} .instawrap{max-width: 100%; padding: 0 20px} } @media (max-width: 1100px) { .contactFlex{flex-direction: column; margin: 0px 30px} .contactFlex > div{max-width:100% !important; width:100%} .contactFlex > div:last-of-type{text-align: center; padding: 60px 0px} .contactItem{max-width: 350px; margin-left:auto; margin-right: auto} #mainnav{display:none} #mobnavbutton{display:block} #masthead{flex-direction: column} #masthead > div{padding: 0px 5px !important} #masthead > div:last-of-type{text-align: center; margin-top: 15px} .logo{top:10px} .logo img{max-width: 160px} .donateHeadButton{display: block} .bigbuttons{display:none} #mobnavfloat{display: flex} .hpcontent{padding-top: 0px; padding-bottom: 0px} .cta{margin: 10px auto} #mastheadfloat{display: none} } @media (max-width: 1000px) { #footerInner{flex-direction: column; max-width: 96%} #footerInner > div{width:100% !important; max-width: 100% !important; padding: 0 10px} #footerInner > div:nth-of-type(2){text-align: left} .socials{margin-top: 15px} .socials > div{margin-left: 0px; margin-right: 10px} } @media (max-width: 900px) { .credit{flex-direction: column} .credit > div{max-width: 100%; text-align: center; padding: 10px} .videopromo{flex-direction: column; max-width:650px} .videopromo >div{max-width: 100%} .videopromo > div:first-of-type{padding-bottom: 56% !important; margin-bottom: 10px} .newslist{flex-direction: column; max-width: 450px; margin: 30px auto; justify-content: space-around} .newslistitem{max-width:100%} .teamlist > div{min-width:50%; max-width:50%; } .otherWsSearchForm{flex-direction: column; max-width: 96%} .otherWsSearchForm > div{width:100% !important; max-width: 100% !important; text-align: center} .otherWsSearchForm select{width:100% !important; max-width:500px} .otherWsSearchForm label{display: block} .headingWs{display: none; padding: 15px 0 10px} .resetButton{display: block; margin: 15px auto; text-align: center; max-width:200px} .timeSlotSel{max-width: 400px; margin: 0 auto} .eventsflex{flex-direction:column} .eventsflex > div{max-width: 100% !important; min-wdth:100%} } @media (max-width: 800px) { .narrowcontent{max-width: 100%; margin: 30px 15px} .donflex{flex-direction: column} .donflex > div{width:100%; max-width: 100%; padding: 0px} .donflex .button{position: relative} .threeButtonRow{flex-direction: column; margin: 15px auto; max-width:320px; padding:0px; box-sizing: border-box} .threeButtonRow > div{max-width: 100% !important; width:100%; text-align: center !important; padding: 0px; box-sizing: border-box} .threeButtonRow > div .button{width:100%; box-sizing: border-box; margin: 10px 5px} #interestFields{column-count: 1} #keywordFields{column-count: 1} } @media (max-width: 700px) { .herocaption{max-width:30%} .herocaption > div{font-size:18px; line-height: inherit} .herocaption > div{left:10%; bottom:-20px;} .tutorialVideos > div{max-width: 45%} } @media (max-width: 650px) { .videopromo{margin: 10px} #donateapplet{margin: 0px auto; max-width: 100%; overflow: auto; padding: 0px} #donateapplet > div{padding: 0px; overflow: auto} .alignright{float:none; width:100%; max-width:100%; min-width:100%; height: auto !important} } @media (max-width: 600px) { h1{padding-top: 0px} h1{font-size:34px; } h2{font-size:26px} .fiftyx2 > div:last-of-type h2:nth-of-type(2){font-size: 34px;} .hpfixedh2{font-size:26px} .hpsplitbox h3{font-size:34px} .cookiebar > div{flex-direction: column} .cookiebar > div > div{max-width: 100% !important; text-align: left !important} .cookiebar > div > div:first-of-type{padding-bottom: 20px !important} .wsFormWrap{max-width:90%} .teamlist > div{min-width:100%; max-width:100%} .usefulContacts{flex-direction: column !important; justify-content: space-around !important; max-width:250px; margin: 0 auto} } @media (max-width: 500px) { .cta i{display: none} .fiftyx2{max-width: 90%} .fiftyx2 h2 i{display: none} .fiftybutton{padding: 15px 0; width:100%; max-width: 90%; margin: 0 auto; display: block} .newslist{max-width: 90%; } .newslistitem{max-width:100%; margin-bottom: 60px} .tutorialVideos > div{max-width: 96%} #topLoginBar a{font-size:8px} } @media (max-width: 400px) { #masthead{position: fixed; background: #fff; top:0px; width:100%} .cta{max-width: 90% !important} #mobnavfloat > div:nth-of-type(2){padding-right: 15px} }