/* v49 */
:root{

    /*BLOOM COLORS*/

    --lightcoolgrey: #eff2f4;
    --midlightcoolgrey: #d7dce1;
    --midcoolgrey: #86929b;
    --darkcoolgrey: #3e474b;
    --almostblack: #222628;
    --bloompink: #ea1057;
    --bloomblue: #2da7df;

/*    --accent: #ea1057;
    --bg_1: #000;
    --bg_2: #222;
    --bg_3: #333;
    --mid_1: #666;
    --mid_2: #999;
    --text_main: #fff;
    --invert: 0;
    --shadow: rgba(0, 0, 0, 0.8);
    --highlight: rgba(255, 255, 255, 0.8);
*/

    /*DARK THEME*/

/*    --accent: var(--bloompink);
    --bg_1: var(--almostblack);
    --bg_1_opa: rgba(34, 38, 40, 0.6);
    --bg_2: var(--darkcoolgrey);
    --bg_3: var(--midcoolgrey);
    --mid_1: var(--midcoolgrey);
    --mid_2: var(--midlightcoolgrey);
    --text_main: var(--lightcoolgrey);
    --invert: 0;
    --shadow: rgba(0, 0, 0, 0.6);
    --highlight: rgba(255, 255, 255, 0.4);

    --front-page_logo: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzNzAuOSAyNDAuNyI+CiAgPGcgaWQ9InNoYWRvdyI+CiAgICA8cmFkaWFsR3JhZGllbnQgaWQ9InNoYWRvd0dyYWRpZW50IiBjeD0iMjA1LjkiIGN5PSIxMjEuNyIgcj0iMTIwLjYiIGdyYWRpZW50VHJhbnNmb3JtPSJtYXRyaXgoMSAwIDAgLTEgMCAyNDIpIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+CiAgICAgIDxzdG9wIG9mZnNldD0iMC4zMTgyIiBzdG9wLWNvbG9yPSIjRkZGRkZGIi8+CiAgICAgIDxzdG9wIG9mZnNldD0iMC42MzkiIHN0b3AtY29sb3I9IiNGRkZGRkYiIHN0b3Atb3BhY2l0eT0iMC4yIi8+CiAgICAgIDxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI0ZGRkZGRiIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8L3JhZGlhbEdyYWRpZW50PgogICAgPGNpcmNsZSBvcGFjaXR5PSIwLjI1IiBmaWxsPSJ1cmwoI3NoYWRvd0dyYWRpZW50KSIgY3g9IjIwNS45IiBjeT0iMTIwLjMiIHI9IjEyMC42Ii8+CiAgPC9nPgogIDxnIGlkPSJwdW5rIj4KICAgIDxwYXRoIGlkPSJwdW5rX3g1Rl9waW5rIiBmaWxsPSIjRTgxNzU4IiBkPSJNMTcyLjIsODQuOWMwLjYtMC42LDEuMy0xLjIsMi0xLjhsNC40LTgwYy0yLjIsMC41LTQuMywxLjEtNi40LDEuN1Y4NC45eiIvPgogICAgPGcgaWQ9InB1bmtfeDVGX2JsdWUiPgogICAgICA8cGF0aCBmaWxsPSIjMjdBQUUxIiBkPSJNMTc0LjIsODMuMWMwLjctMC42LDEuNC0xLjIsMi4yLTEuOGw4LjktNzkuNWMtMi4zLDAuNC00LjUsMC45LTYuNywxLjRMMTc0LjIsODMuMXoiLz4KICAgICAgPHBhdGggZmlsbD0iIzJFQTZERSIgZD0iTTE3NC4yLDgzLjFjMC43LTAuNiwxLjQtMS4yLDIuMi0xLjhsOC45LTc5LjVjLTIuMywwLjQtNC41LDAuOS02LjcsMS40TDE3NC4yLDgzLjF6Ii8+CiAgICA8L2c+CiAgPC9nPgogIDxnIGlkPSJiIj4KICAgIDxwYXRoIGQ9Ik0yMDUuOSw3MS40Yy0xMy4xLDAtMjQuOSw1LjEtMzMuNywxMy41VjQuNkMxNjcsNi4xLDE2MS45LDgsMTU3LDEwLjJ2MTU5aDQ4LjljMjcsMCw0OC45LTIxLjksNDguOS00OC45UzIzMi45LDcxLjQsMjA1LjksNzEuNHogTTIwNS45LDE1NGMtMTguNiwwLTMzLjctMTUuMS0zMy43LTMzLjdzMTUuMS0zMy43LDMzLjctMzMuN3MzMy43LDE1LjEsMzMuNywzMy43UzIyNC41LDE1NCwyMDUuOSwxNTR6Ii8+CiAgPC9nPgogIDxnIGlkPSJ0ZXh0X291dGxpbmUiPgogICAgPGcgaWQ9ImJsb29tIj4KICAgICAgPHBhdGggZD0iTTYxLjMsODljMS4zLDAuNywyLjMsMS43LDMsM2MwLjcsMS4zLDEuMSwyLjgsMS4xLDQuNXMtMC40LDMuMi0xLjEsNC41Yy0wLjcsMS4zLTEuNywyLjMtMywzLjFjLTEuMywwLjctMi43LDEuMS00LjMsMS4xIGMtMS40LDAtMi43LTAuMy0zLjgtMC45cy0yLTEuNS0yLjctMi42djMuM2gtMi4yVjgxLjFoMi4zdjEwLjJjMC43LTEuMSwxLjYtMS45LDIuNy0yLjVjMS4xLTAuNiwyLjMtMC45LDMuNy0wLjkgQzU4LjYsODcuOSw2MCw4OC4zLDYxLjMsODl6IE02MC4xLDEwMi4zYzEtMC41LDEuNy0xLjMsMi4zLTIuM2MwLjUtMSwwLjgtMi4yLDAuOC0zLjRjMC0xLjMtMC4zLTIuNC0wLjgtMy40cy0xLjMtMS44LTIuMy0yLjMgcy0yLTAuOC0zLjItMC44cy0yLjMsMC4zLTMuMiwwLjhjLTEsMC41LTEuNywxLjMtMi4zLDIuM2MtMC41LDEtMC44LDIuMi0wLjgsMy40YzAsMS4zLDAuMywyLjQsMC44LDMuNHMxLjMsMS44LDIuMywyLjMgczIsMC44LDMuMiwwLjhDNTgsMTAzLjEsNTkuMSwxMDIuOCw2MC4xLDEwMi4zeiIvPgogICAgICA8cGF0aCBkPSJNNjkuNiw4MS4xaDIuM1YxMDVoLTIuM1Y4MS4xeiIvPgogICAgICA8cGF0aCBkPSJNODAuMiwxMDRjLTEuMy0wLjctMi4zLTEuOC0zLjEtMy4xYy0wLjgtMS4zLTEuMS0yLjgtMS4xLTQuNGMwLTEuNywwLjQtMy4xLDEuMS00LjRjMC44LTEuMywxLjgtMi4zLDMuMS0zLjEgYzEuMy0wLjcsMi44LTEuMSw0LjQtMS4xczMuMSwwLjQsNC40LDEuMXMyLjMsMS43LDMuMSwzLjFjMC43LDEuMywxLjEsMi44LDEuMSw0LjRjMCwxLjctMC40LDMuMS0xLjEsNC40cy0xLjgsMi4zLTMuMSwzLjEgYy0xLjMsMC43LTIuOCwxLjEtNC40LDEuMVM4MS41LDEwNC43LDgwLjIsMTA0eiBNODcuOCwxMDIuM2MxLTAuNSwxLjctMS4zLDIuMi0yLjNzMC44LTIuMiwwLjgtMy40YzAtMS4zLTAuMy0yLjQtMC44LTMuNCBzLTEuMy0xLjgtMi4yLTIuM2MtMS0wLjUtMi0wLjgtMy4yLTAuOHMtMi4zLDAuMy0zLjIsMC44Yy0xLDAuNS0xLjcsMS4zLTIuMywyLjNjLTAuNSwxLTAuOCwyLjItMC44LDMuNGMwLDEuMywwLjMsMi40LDAuOCwzLjQgczEuMywxLjgsMi4zLDIuM3MyLDAuOCwzLjIsMC44Uzg2LjksMTAyLjgsODcuOCwxMDIuM3oiLz4KICAgICAgPHBhdGggZD0iTTEwMC4yLDEwNGMtMS4zLTAuNy0yLjMtMS44LTMuMS0zLjFjLTAuOC0xLjMtMS4xLTIuOC0xLjEtNC40YzAtMS43LDAuNC0zLjEsMS4xLTQuNGMwLjgtMS4zLDEuOC0yLjMsMy4xLTMuMS BjMS4zLTAuNywyLjgtMS4xLDQuNC0xLjFzMy4xLDAuNCw0LjQsMS4xczIuMywxLjcsMy4xLDMuMWMwLjcsMS4zLDEuMSwyLjgsMS4xLDQuNGMwLDEuNy0wLjQsMy4xLTEuMSw0LjRzLTEuOCwyLjMtMy4xLDMuMS BjLTEuMywwLjctMi44LDEuMS00LjQsMS4xUzEwMS41LDEwNC43LDEwMC4yLDEwNHogTTEwNy44LDEwMi4zYzEtMC41LDEuNy0xLjMsMi4yLTIuM3MwLjgtMi4yLDAuOC0zLjRjMC0xLjMtMC4zLTIuNC0wLjgtMy40IHMtMS4zLTEuOC0yLjItMi4zYy0xLTAuNS0yLTAuOC0zLjItMC44cy0yLjMsMC4zLTMuMiwwLjhjLTEsMC41LTEuNywxLjMtMi4zLDIuM2MtMC41LDEtMC44LDIuMi0wLjgsMy40YzAsMS4zLDAuMywyLjQsMC44LDMuNC BzMS4zLDEuOCwyLjMsMi4zczIsMC44LDMuMiwwLjhTMTA2LjgsMTAyLjgsMTA3LjgsMTAyLjN6Ii8+CiAgICAgIDxwYXRoIGQ9Ik0xNDMuNCw4OS43YzEuMiwxLjIsMS44LDMsMS44LDUuNHY5LjhoLTIuM3YtOS42YzAtMS44LTAuNC0zLjEtMS4zLTRjLTAuOC0wLjktMi0xLjQtMy42LTEuNGMtMS44LDAtMy4xLDAuNS00LjIsMS42 IGMtMSwxLjEtMS41LDIuNi0xLjUsNC41djguOUgxMzB2LTkuNmMwLTEuOC0wLjQtMy4xLTEuMy00Yy0wLjgtMC45LTIuMS0xLjQtMy42LTEuNGMtMS43LDAtMy4xLDAuNS00LjEsMS42cy0xLjUsMi42LTEuNSw0LjV2OC45 IGgtMi4zVjg4aDIuMnYzLjFjMC42LTEsMS40LTEuOCwyLjUtMi40czIuMy0wLjgsMy43LTAuOGMxLjQsMCwyLjYsMC4zLDMuNywwLjlzMS44LDEuNSwyLjMsMi43YzAuNi0xLjEsMS41LTIsMi43LTIuNi BzMi41LTAuOSw0LTAuOUMxNDAuNSw4Ny45LDE0Mi4yLDg4LjUsMTQzLjQsODkuN3oiLz4KICAgIDwvZz4KICAgIDxnIGlkPSJmaWxtIj4KICAgICAgPHBhdGggZD0iTTkxLjYsMTE1LjhjLTAuNSwwLjUtMC44LDEuMy0wLjgsMi40djJIOTZ2MS45aC01LjF2MTVoLTIuM3YtMTVoLTN2LTEuOWgzdi0yLjFjMC0xLjUsMC40LTIuOCwxLjMtMy43IGMwLjktMC45LDIuMS0xLjQsMy44LTEuNGMwLjYsMCwxLjMsMC4xLDEuOSwwLjNjMC42LDAuMiwxLjEsMC40LDEuNSwwLjhsLTAuOCwxLjdjLTAuNy0wLjYtMS41LTAuOC0yLjUtMC44 IEM5Mi45LDExNSw5Mi4xLDExNS4zLDkxLjYsMTE1Ljh6Ii8+CiAgICAgIDxwYXRoIGQ9Ik0xMDEuNywxMTZjLTAuMy0wLjMtMC41LTAuNy0wLjUtMS4yYzAtMC40LDAuMi0wLjgsMC41LTEuMWMwLjMtMC4zLDAuNy0wLjUsMS4yLTAuNXMwLjksMC4yLDEuMiwwLjUgYzAuMywwLjMsMC41LDAuNywwLjUsMS4xYzAsMC41LTAuMiwwLjktMC41LDEuMmMtMC4zLDAuMy0wLjcsMC41LTEuMiwwLjVDMTAyLjQsMTE2LjUsMTAyLDExNi4zLDEwMS43LDExNnoiLz4KICAgICAgPHJlY3QgeD0iMTAxLjciIHk9IjEyMC4yIiB3aWR0aD0iMi4zIiBoZWlnaHQ9IjE2LjkiLz4KICAgICAgPHBhdGggZD0iTTEwOS42LDExMy4yaDIuM3YyMy45aC0yLjNWMTEzLjJ6Ii8+CiAgICAgIDxwYXRoIGQ9Ik0xNDMuNCwxMjEuOWMxLjIsMS4yLDEuOCwzLDEuOCw1LjR2OS44aC0yLjN2LTkuNmMwLTEuOC0wLjQtMy4xLTEuMy00Yy0wLjgtMC45LTItMS40LTMuNi0xLjRjLTEuOCwwLTMuMSwwLjUtNC4yLDEuNi BjLTEsMS4xLTEuNSwyLjYtMS41LDQuNXY4LjlIMTMwdi05LjZjMC0xLjgtMC40LTMuMS0xLjMtNGMtMC44LTAuOS0yLjEtMS40LTMuNi0xLjRjLTEuNywwLTMuMSwwLjUtNC4xLDEuNnMtMS41LDIuNi0xLjUsNC41djguOS BoLTIuM3YtMTYuOWgyLjJ2My4xYzAuNi0xLDEuNC0xLjgsMi41LTIuNHMyLjMtMC44LDMuNy0wLjhjMS40LDAsMi42LDAuMywzLjcsMC45czEuOCwxLjUsMi4zLDIuN2MwLjYtMS4xLDEuNS0yLDIuNy0yLjY gczIuNS0wLjksNC0wLjlDMTQwLjUsMTIwLjEsMTQyLjIsMTIwLjcsMTQzLjQsMTIxLjl6Ii8+CiAgICA8L2c+CiAgICA8ZyBpZD0iZGVzaWduIj4KICAgICAgPHBhdGggZD0iTTYwLjMsMTQ1LjR2MjMuOWgtMi4yVjE2NmMtMC43LDEuMS0xLjYsMi0yLjcsMi42Yy0xLjEsMC42LTIuNCwwLjktMy44LDAuOWMtMS42LDAtMy0wLjQtNC4zLTEuMWMtMS4zLTAuNy0yLjMtMS43LTMtMy4x IG MtMC43LTEuMy0xLjEtMi44LTEuMS00LjVzMC40LTMuMiwxLjEtNC41YzAuNy0xLjMsMS43LTIuMywzLTNzMi43LTEuMSw0LjMtMS4xYzEuNCwwLDIuNiwwLjMsMy43LDAuOWMxLjEsMC42LDIsMS40LDIuNywyLjUgdi0xMC4yTDYwLjMsMTQ1LjRMNjAuMywxNDUuNHogTTU1LDE2Ni42YzEtMC41LDEuNy0xLjMsMi4zLTIuM2MwLjUtMSwwLjgtMi4yLDAuOC0zLjRjMC0xLjMtMC4zLTIuNC0wLjgtMy40cy0xLjMtMS44LTIuMy0yLjMgcy0yLTAuOC0zLjItMC44cy0yLjMsMC4zLTMuMiwwLjhjLTEsMC41LTEuNywxLjMtMi4zLDIuM2MtMC41LDEtMC44LDIuMi0wLjgsMy40YzAsMS4zLDAuMywyLjQsMC44LDMuNHMxLjMsMS44LDIuMywyLjMgczIsMC44LDMuMiwwLjhDNTMsMTY3LjQsNTQuMSwxNjcuMiw1NSwxNjYuNnoiLz4KICAgICAgPHBhdGggZD0iTTgwLjksMTYxLjVINjYuOGMwLjEsMS44LDAuOCwzLjIsMiw0LjNzMi44LDEuNiw0LjYsMS42YzEuMSwwLDItMC4yLDIuOS0wLjZzMS42LTAuOSwyLjMtMS43bDEuMywxLjUgYy0wLjgsMC45LTEuNywxLjYtMi44LDIuMWMtMS4xLDAuNS0yLjQsMC43LTMuNywwLjdjLTEuNywwLTMuMy0wLjQtNC42LTEuMXMtMi40LTEuOC0zLjEtMy4xYy0wLjgtMS4zLTEuMS0yLjgtMS4xLTQuNC BzMC40LTMuMSwxLjEtNC40YzAuNy0xLjMsMS43LTIuMywzLTMuMWMxLjMtMC43LDIuNy0xLjEsNC4yLTEuMXMzLDAuNCw0LjIsMS4xYzEuMiwwLjcsMi4yLDEuNywyLjksM2MwLjcsMS4zLDEuMSwyLjgsMS4xLDQuNS BMODAuOSwxNjEuNXogTTY4LjYsMTU1LjhjLTEuMSwxLTEuNywyLjQtMS45LDQuMWgxMmMtMC4yLTEuNy0wLjgtMy0xLjktNC4xYy0xLjEtMS0yLjUtMS42LTQuMS0xLjZTNjkuOCwxNTQuNyw2OC42LDE1NS44eiIvPgogICAgICA8cGF0aCBkPSJNODYsMTY4LjljLTEuMy0wLjQtMi4yLTAuOS0yLjktMS41bDEtMS44YzAuNywwLjYsMS42LDEsMi43LDEuNHMyLjIsMC41LDMuMywwLjVjMS41LDAsMi43LTAuMiwzLjQtMC43 IG
    --front-page_logo_hover: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzNzAuOSAyNDAuNyI+CiAgPGcgaWQ9InNoYWRvdyI+CiAgICA8cmFkaWFsR3JhZGllbnQgaWQ9InNoYWRvd0dyYWRpZW50IiBjeD0iMjA1LjkiIGN5PSIxMjEuNyIgcj0iMTIwLjYiIGdyYWRpZW50VHJhbnNmb3JtPSJtYXRyaXgoMSAwIDAgLTEgMCAyNDIpIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+CiAgICAgIDxzdG9wIG9mZnNldD0iMC4zMTgyIiBzdG9wLWNvbG9yPSIjMDAwMDAwIi8+CiAgICAgIDxzdG9wIG9mZnNldD0iMC42MzkiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC4yIi8+CiAgICAgIDxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8L3JhZGlhbEdyYWRpZW50PgogICAgPGNpcmNsZSBvcGFjaXR5PSIwLjI1IiBmaWxsPSJ1cmwoI3NoYWRvd0dyYWRpZW50KSIgY3g9IjIwNS45IiBjeT0iMTIwLjMiIHI9IjEyMC42Ii8+CiAgPC9nPgogIDxnIGlkPSJwdW5rIj4KICAgIDxwYXRoIGlkPSJwdW5rX3g1Rl9waW5rIiBmaWxsPSIjRTgxNzU4IiBkPSJNMTcyLjIsODQuOWMwLjYtMC42LDEuMy0xLjIsMi0xLjhsNC40LTgwYy0yLjIsMC41LTQuMywxLjEtNi40LDEuN1Y4NC45eiIvPgogICAgPGcgaWQ9InB1bmtfeDVGX2JsdWUiPgogICAgICA8cGF0aCBmaWxsPSIjMjdBQUUxIiBkPSJNMTc0LjIsODMuMWMwLjctMC42LDEuNC0xLjIsMi4yLTEuOGw4LjktNzkuNWMtMi4zLDAuNC00LjUsMC45LTYuNywxLjRMMTc0LjIsODMuMXoiLz4KICAgICAgPHBhdGggZmlsbD0iIzJFQTZERSIgZD0iTTE3NC4yLDgzLjFjMC43LTAuNiwxLjQtMS4yLDIuMi0xLjhsOC45LTc5LjVjLTIuMywwLjQtNC41LDAuOS02LjcsMS40TDE3NC4yLDgzLjF6Ii8+CiAgICA8L2c+CiAgPC9nPgogIDxnIGlkPSJiIiBmaWxsPSIjRkZGRkZGIj4KICAgIDxwYXRoIGQ9Ik0yMDUuOSw3MS40Yy0xMy4xLDAtMjQuOSw1LjEtMzMuNywxMy41VjQuNkMxNjcsNi4xLDE2MS45LDgsMTU3LDEwLjJ2MTU5aDQ4LjljMjcsMCw0OC45LTIxLjksNDguOS00OC45UzIzMi45LDcxLjQsMjA1LjksNzEuNHogTTIwNS45LDE1NGMtMTguNiwwLTMzLjctMTUuMS0zMy43LTMzLjdzMTUuMS0zMy43LDMzLjctMzMuN3MzMy43LDE1LjEsMzMuNywzMy43UzIyNC41LDE1NCwyMDUuOSwxNTR6Ii8+CiAgPC9nPgogIDxnIGlkPSJ0ZXh0X291dGxpbmUiIGZpbGw9IiNGRkZGRkYiPgogICAgPGcgaWQ9ImJsb29tIj4KICAgICAgPHBhdGggZD0iTTYxLjMsODljMS4zLDAuNywyLjMsMS43LDMsM2MwLjcsMS4zLDEuMSwyLjgsMS4xLDQuNXMtMC40LDMuMi0xLjEsNC41Yy0wLjcsMS4zLTEuNywyLjMtMywzLjFjLTEuMywwLjctMi43LDEuMS00LjMsMS4x IGMtMS40LDAtMi43LTAuMy0zLjgtMC45cy0yLTEuNS0yLjctMi42djMuM2gtMi4yVjgxLjFoMi4zdjEwLjJjMC43LTEuMSwxLjYtMS45LDIuNy0yLjVjMS4xLTAuNiwyLjMtMC45LDMuNy0wLjkgQzU4LjYsODcuOSw2MCw4OC4zLDYxLjMsODl6IE02MC4xLDEwMi4zYzEtMC41LDEuNy0xLjMsMi4zLTIuM2MwLjUtMSwwLjgtMi4yLDAuOC0zLjRjMC0xLjMtMC4zLTIuNC0wLjgtMy40cy0xLjMtMS44LTIuMy0yLjMgcy0yLTAuOC0zLjItMC44cy0yLjMsMC4zLTMuMiwwLjhjLTEsMC41LTEuNywxLjMtMi4zLDIuM2MtMC41LDEtMC44LDIuMi0wLjgsMy40YzAsMS4zLDAuMywyLjQsMC44LDMuNHMxLjMsMS44LDIuMywyLjMgczIsMC44LDMuMiwwLjhDNTgsMTAzLjEsNTkuMSwxMDIuOCw2MC4xLDEwMi4zeiIvPgogICAgICA8cGF0aCBkPSJNNjkuNiw4MS4xaDIuM1YxMDVoLTIuM1Y4MS4xeiIvPgogICAgICA8cGF0aCBkPSJNODAuMiwxMDRjLTEuMy0wLjctMi4zLTEuOC0zLjEtMy4xYy0wLjgtMS4zLTEuMS0yLjgtMS4xLTQuNGMwLTEuNywwLjQtMy4xLDEuMS00LjRjMC44LTEuMywxLjgtMi4zLDMuMS0zLjEgYzEuMy0wLjcsMi44LTEuMSw0LjQtMS4xczMuMSwwLjQsNC40LDEuMXMyLjMsMS43LDMuMSwzLjFjMC43LDEuMywxLjEsMi44LDEuMSw0LjRjMCwxLjctMC40LDMuMS0xLjEsNC40cy0xLjgsMi4zLTMuMSwzLjEgYy0xLjMsMC43LTIuOCwxLjEtNC40LDEuMVM4MS41LDEwNC43LDgwLjIsMTA0eiBNODcuOCwxMDIuM2MxLTAuNSwxLjctMS4zLDIuMi0yLjNzMC44LTIuMiwwLjgtMy40YzAtMS4zLTAuMy0yLjQtMC44LTMuNC BzLTEuMy0xLjgtMi4yLTIuM2MtMS0wLjUtMi0wLjgtMy4yLTAuOHMtMi4zLDAuMy0zLjIsMC44Yy0xLDAuNS0xLjcsMS4zLTIuMywyLjNjLTAuNSwxLTAuOCwyLjItMC44LDMuNGMwLDEuMywwLjMsMi40LDAuOCwzLjQgczEuMywxLjgsMi4zLDIuM3MyLDAuOCwzLjIsMC44Uzg2LjksMTAyLjgsODcuOCwxMDIuM3oiLz4KICAgICAgPHBhdGggZD0iTTEwMC4yLDEwNGMtMS4zLTAuNy0yLjMtMS44LTMuMS0zLjFjLTAuOC0xLjMtMS4xLTIuOC0xLjEtNC40YzAtMS43LDAuNC0zLjEsMS4xLTQuNGMwLjgtMS4zLDEuOC0yLjMsMy4xLTMuMS BjMS4zLTAuNywyLjgtMS4xLDQuNC0xLjFzMy4xLDAuNCw0LjQsMS4xczIuMywxLjcsMy4xLDMuMWMwLjcsMS4zLDEuMSwyLjgsMS4xLDQuNGMwLDEuNy0wLjQsMy4xLTEuMSw0LjRzLTEuOCwyLjMtMy4xLDMuMS BjLTEuMywwLjctMi44LDEuMS00LjQsMS4xUzEwMS41LDEwNC43LDEwMC4yLDEwNHogTTEwNy44LDEwMi4zYzEtMC41LDEuNy0xLjMsMi4yLTIuM3MwLjgtMi4yLDAuOC0zLjRjMC0xLjMtMC4zLTIuNC0wLjgtMy40 IHMtMS4zLTEuOC0yLjItMi4zYy0xLTAuNS0yLTAuOC0zLjItMC44cy0yLjMsMC4zLTMuMiwwLjhjLTEsMC41LTEuNywxLjMtMi4zLDIuM2MtMC41LDEtMC44LDIuMi0wLjgsMy40YzAsMS4zLDAuMywyLjQsMC44LDMuNC BzMS4zLDEuOCwyLjMsMi4zczIsMC44LDMuMiwwLjhTMTA2LjgsMTAyLjgsMTA3LjgsMTAyLjN6Ii8+CiAgICAgIDxwYXRoIGQ9Ik0xNDMuNCw4OS43YzEuMiwxLjIsMS44LDMsMS44LDUuNHY5LjhoLTIuM3YtOS42YzAtMS44LTAuNC0zLjEtMS4zLTRjLTAuOC0wLjktMi0xLjQtMy42LTEuNGMtMS44LDAtMy4xLDAuNS00LjIsMS42 IGMtMSwxLjEtMS41LDIuNi0xLjUsNC41djguOUgxMzB2LTkuNmMwLTEuOC0wLjQtMy4xLTEuMy00Yy0wLjgtMC45LTIuMS0xLjQtMy42LTEuNGMtMS43LDAtMy4xLDAuNS00LjEsMS42cy0xLjUsMi42LTEuNSw0LjV2OC45 IGgtMi4zVjg4aDIuMnYzLjFjMC42LTEsMS40LTEuOCwyLjUtMi40czIuMy0wLjgsMy43LTAuOGMxLjQsMCwyLjYsMC4zLDMuNywwLjlzMS44LDEuNSwyLjMsMi43YzAuNi0xLjEsMS41LTIsMi43LTIuNi BzMi41LTAuOSw0LTAuOUMxNDAuNSw4Ny45LDE0Mi4yLDg4LjUsMTQzLjQsODkuN3oiLz4KICAgIDwvZz4KICAgIDxnIGlkPSJmaWxtIj4KICAgICAgPHBhdGggZD0iTTkxLjYsMTE1LjhjLTAuNSwwLjUtMC44LDEuMy0wLjgsMi40djJIOTZ2MS45aC01LjF2MTVoLTIuM3YtMTVoLTN2LTEuOWgzdi0yLjFjMC0xLjUsMC40LTIuOCwxLjMtMy43 IG...

    --joinus: url("../images/JoinUs_Banner_004_black.svg");
    --aboutus: url("../images/AboutUs_Banner_004_black.svg");

    --arrow: url("../images/left-arrow_white.svg");
    --backtotop: url("../images/back-to-top_white.svg");

*/
    /*BRIGHT THEME*/

    --accent: var(--bloompink);
    --accent_opa: rgba(234, 16, 87, 0.7);
    --bg_1: var(--lightcoolgrey);
    --bg_1_opa: rgba(239, 242, 244, 0.6);
    --bg_2: var(--midlightcoolgrey);
    --bg_3: var(--midcoolgrey);
    --mid_1: var(--midcoolgrey);
    --mid_2: var(--darkcoolgrey);
    --text_main: var(--almostblack);
    --invert: 1;
    --shadow: rgba(255, 255, 255, 0.6);
    --highlight: rgba(0, 0, 0, 0.4);

    --front-page_logo: url("../images/Logo_B_textPunk_black.svg");
    --front-page_logo_hover: url("../images/Logo_B_textPunk.svg");

    --joinus: url("../images/JoinUs_Banner_004_white.svg");
    --aboutus: url("../images/AboutUs_Banner_004_white.svg");
    --hellobloom: url("../images/HelloBloom_banner_white.svg");
/*    --hellobloom: url("../images/JoinUs_Banner_004_white.svg");*/

    --arrow: url("../images/left-arrow.svg");
    --backtotop: url("../images/back-to-top.svg");


/*    FORMS*/

    --wpforms-button-background-color: var(--bloompink) !important;
}

html { margin-top: 0 !important; }
html body { margin-top: 0 !important; }
@media screen and ( max-width: 782px ) {
html { margin-top: 0 !important; }
html body { margin-top: 0 !important; }
}

/*scrollbars*/
/* The emerging W3C standard
   that is currently Firefox-only */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--bg_1) var(--mid_1);
}

/* Works on Chrome/Edge/Safari */
*::-webkit-scrollbar {
  width: 12px;
}
*::-webkit-scrollbar-track {
  background: var(--bg_1);
}
*::-webkit-scrollbar-thumb {
  background-color: var(--mid_1);
  border: 3px solid var(--bg_1);
}

a {
    color: var(--text_main);
}

body {
    color: var(--text_main);
    background: var(--bg_1);
    font-family: var(--wp--preset--font-family--body, 'Montserrat', sans-serif);
    font-size: var(--wp--preset--font-size--normal, 1rem);
    font-style: normal;
    font-weight: 300;
    line-height: var(--wp--style--typography--line-height, 1.6);
    cursor: default;
    padding: 0;
    margin: 0;
    -webkit-font-smoothing: antialiased !important;
    font-smoothing: always;
    -moz-osx-font-smoothing: grayscale;
    min-height: 100vh;
}

.body_scroll {
    overflow-x: hidden;
    overflow-y: visible;
}

.body_noscroll {
    overflow-x: hidden;
    overflow-y: hidden;
}



figure {
    display: block;
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
}

@viewport {
    width: device-width;
    zoom: .5;
}

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

blockquote {
    padding: 0;
    quotes: "\201C""\201D""\2018""\2019";
    line-height: 1.5em;
    text-align: left;
    letter-spacing: 0;
}

blockquote strong {
    margin-right: .7em;
    color: var(--mid_1);
    text-transform: uppercase;
}

blockquote p {
    margin: 0;
    padding: 0;
}

h1 {
    font-family: var(--wp--preset--font-family--heading, 'Montserrat', sans-serif);
    font-size: clamp(2rem, 3vw, 2.75rem);
    font-weight: 300;
    text-align: left;
    text-shadow: 0 0 .14em var(--shadow);
    letter-spacing: .36em;
    text-transform: uppercase;
    padding: 0 0;
    align-items: left;
    width: 100%;
    flex-shrink: 1;
    white-space: nowrap;
    overflow: hidden;
    margin-top: 1em;
}

h1:after {
    content: '';
    display: inline-flex;
    align-self: baseline;
/*    height: 100%;                                                                                                                                           */
    width: 100%;
    border-bottom: 3px solid var(--accent);
    flex: 1 0 10px;
}

@media ( max-width: 700px) {
    h1 {
        font-size: 2em;
        white-space: pre-wrap;
    }
}

.columns-wrap > h1 {
    /* max-width: 1200px; */
    /* width: 80%; */
    margin-left: auto;
    margin-right: auto;
}

h2 {
    font-family: var(--wp--preset--font-family--heading, 'Montserrat', sans-serif);
    font-weight: 500;
    font-size: clamp(1.5rem, 2.5vw, 2rem);
    text-transform: uppercase;
    color: var(--accent);
    margin-top: 2em;
    letter-spacing: .1em;
}

h4 {
    margin-bottom: 0;
}

@media ( max-width: 700px) {
    h2 {
        font-size: 1.5rem;
        white-space: pre-wrap;
        letter-spacing: inherit;
    }
}

p {
    font-family: inherit;
    text-align: inherit;
    font-size: var(--wp--preset--font-size--normal, 1rem);
    line-height: 1.6;
    margin: 0 0 1.5em;
}

li {
    text-align: left;
}


::selection {
    color: white;
    background: var(--accent);
    /* border: 3px solid var(--accent); */
    /* outline: solid var(--accent) 3px ; */
  }




/* POST-LOADER */
#post-loader {
    position: fixed;
    width: 100%;
    height: 100%;
    /* top: 0; */
    /* left: 0; */
    background: black;
    z-index: 100;
    /* transition: height .2s; */
    overflow-x: hidden;
    overflow-y: scroll;
}

.post-loader_open {
    height: 100%;
}

.post-load {
    /* cursor: pointer; */
}

.test-ajax {
    position: fixed;
    top: 50px;
    left: 150px;
    background-color: red;

}

/*POST-LOADER CLOSE BUTTON*/

.post-close_block {
    width: 8vh;
    height: 8vh;
    max-height: 50px;
    max-width: 50px;
    margin: 2vw;
}

.post-close_icon {
    /* display: none; */
    opacity: 0;
    /* cursor: pointer; */
    /* position: fixed; */
    /* top: 0; */
    /* right: 6vh; */
    z-index: 105;
    transition: all .2s;
}

.post-close_bar_close {
    opacity: 1;
}

/* Fade out the second bar */
.post-close_bar2, .post-close_bar3 {
    /* opacity: 0; */
    top: 44%;
    left: 0;
    /* transform: rotate(0deg) scaleX(1); */
    /* transition: transform 2s; */
}

.post-close_bar_close .post-close_bar2 {
    /* opacity: 1; */
    transform: rotate(45deg) scaleX(1.2);

}
.post-close_bar_close .post-close_bar3 {
    /* opacity: 1; */
    transform: rotate(-45deg) scaleX(1.2);
}

.post-close_icon:hover .menu_bar {
    background-color: var(--accent);
}




/*MENU*/
.menu-wrapper {
    display: flex;
    /* position: fixed; */
    top: 0;
    right: 0;
}
.logo-wrapper {
    top: 0;
    left: 0;
    /* z-index: 999; */
}
.menu-wrapper-margin {
    z-index: 999;
    position: fixed;
    margin: 2vw;
}

.menu_block {
    cursor: pointer;
    position: relative;
    display: inline-flex;
    width: 8vh;
    height: 8vh;
    max-height: 50px;
    max-width: 50px;
    margin: .5vw;
}

.menu_icon {
    /* display: block; */
    /* cursor: pointer; */
    /* transition: border .2s; */
}

.menu_bar {
    background-color: var(--text_main);
    transition: all .2s;
    box-shadow: 0 0 80px 0 var(--shadow);
    width: 0%;
    height: 8%;
    position: absolute;
}

.menu_bar_white {
    background-color: var(--midcoolgrey);
    /* box-shadow: 0 0 80px black; */
}

.menu_icon:hover {
    background-color: var(--text_main)
    border: solid 8px var(--text_main)
    box-shadow: 0 0 80px 0 var(--shadow);
}

.menu_icon:hover .menu_bar {
    background-color: var(--accent);
}

.menu_bar1 {
    margin: 0;
    top: 1%;
}
.menu_bar2, .menu_bar3 {
    top: 44%;
    left: 0;
}
.menu_bar4 {
    margin: 0;
    bottom: 8%;
}

/* Rotate first bar */
.menu_bar_close .menu_bar1 {
    opacity: 0;
}

/* Fade out the second bar */
.menu_bar_close .menu_bar2 {
    transform: rotate(45deg) scaleX(1.2);

}
.menu_bar_close .menu_bar3 {
    transform: rotate(-45deg) scaleX(1.2);
}

/* Rotate last bar */
.menu_bar_close .menu_bar4 {
    opacity: 0;
}

.menu {
    display: none;
    position: fixed;
    background: var(--bg_1);
    max-height: 100%;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100%;
    color: var(--text_main);
    font-size: 10vh;
    z-index: 110;
    margin: 0;
    letter-spacing: 0;
    line-height: 10vh;
    transition: right .3s ease-in-out;
    overflow: hidden;
}

.menu_open {
    display: block;
    background-color: var(--bg_1);
    top: 0;
    right: 0;
    width: 100%;
    height: 150%;
    min-width: 2.5em;
    min-height: 2.5em;
    max-height: 150%;
    max-width: 100%;
}

.menu_container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.menu_container a {
    text-decoration: none;
    outline: none;
}

.menu_video_background {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -99;
    height: 100vh;
    width: 100vw;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(10,10,20,1) 35%, rgba(25,35,45,1) 100%);
}

.menu_slider {
    height: 100%;
    width: 100%;
    position: relative;
    z-index: 0;
}

.menu > video {
    z-index: 0;
    position: absolute;
    top: 0;
    width: 300%;
    left: -100%;
    height: 100%;
}

.menu_video_pattern {
/*    display: none;*/
    display: block;
/*    background-image: url(../images/pat1.png);*/
    background: white;
/*    filter: invert(var(--invert));*/
    position: absolute;
    opacity: 0.5;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

#menu_logo {
    background: url("../images/menu_logo.svg") no-repeat center ;
    text-decoration: none;
    transition: opacity .5s ease;
}

#menu_logo:hover {
    background: url("../images/menu_logo_hover.svg") no-repeat center ;
}

#menu_logo:hover > #menu_wrap {
    background: var(--bg_1);
    width: 10em;
    height: 10em;
}

.menu_top_margin {
    height: auto;
    margin: 0;
    background: var(--bg_1);
    display: flex;
    flex-grow: 1;
    flex-shrink: 1;
    justify-content: space-between;
}

.menu_bottom_margin {
    height: 100vh;
    background: var(--bg_1);
    display: flex;
    flex-shrink: 1;
    justify-content: space-between;
}

.menu_button {
    display: flex;
    width: 100%;
    padding: 2vh 2vw 2vh 0;
    right: 0;
    background: var(--bg_1);
    z-index: 10;
    justify-content: space-between;
    position: relative;
}

.menu_button:hover, .menu_button:active {
    color: var(--text_main);
    text-decoration: none;
    background: none;
    text-shadow: 0 0 .14em var(--shadow);
    box-shadow: inset 0 0 80px 0 var(--shadow);
}

.menu_baseline_wrap {
    padding-left: -10px;
    width: 0%;
    flex-shrink: 1;
    text-align: right;
    transition: width .3s;
    transition-delay: 0;
    opacity: 0;
}

.menu_button:hover .menu_baseline_wrap {
    width: 100%;
    opacity: 1;
}

.menu_baseline {
    border: 2px solid var(--text_main);
    background: var(--text_main);
    width: 100%;
/*    display: inline-block;*/
    display: none;
    transition: all .3s;
    transition-delay: .1s;
    box-shadow: 0 0 .14em var(--shadow);
}

.menu_button:hover .menu_baseline {
    width: 40px;
    border:2px solid var(--accent);
    background: var(--accent);
}

.menu_item {
    background: none;
    text-shadow: 0 0 .14em var(--shadow);
    color: var(--text_main);
    text-transform: uppercase;
    text-decoration: none;
    white-space:  nowrap;
    display: inline-flex;
    padding-left: 3px;
}

.menu_button:hover > .menu_item {
    color: var(--text_main);
    text-decoration: none;
    background: none;
}

.menu_item_joinus {
    padding-left: 10px;
}


/*BACK TO TOP BUTTON*/

#BackToTop {
    border: none;
    outline: none;
    background: var(--backtotop) var(--shadow);
    background-size: cover;
    cursor: pointer;
    transition: opacity .5s;
    opacity: 0
}

.backToTop-wrapper {
    display: block;
    position: fixed;
    bottom: 0;
    right: 0;
    z-index: 90;
}

#BackToTop:hover {
    background-color: var(--accent);
}

#BackToTop:active {
    background-color: var(--text_main);
}



/*MENU FOR MOBILE*/

@media ( max-width: 800px) {
    #menu {
        position: fixed;
    }
    #menu_mobile {
        display: block;
    }
    #menu>ul {
        border: .1em solid var(--text_main);
        border-top: none;
        background: var(--bg_1);
        height: auto;
        display: none;
        position: absolute;
        right: 0;
        padding-right: .7em;
        margin: 10%;
        margin-top: 4.3em;
        width: 14em;
        -webkit-box-shadow: 0 0 6em 0 var(--shadow);
        -moz-box-shadow: 0 0 6em 0 var(--shadow);
        box-shadow: 0 0 6em 0 var(--shadow);
    }
    #menu>ul>li {
        width: 100%;
        float: none;
        margin: 0;
        padding: 0;
    }
    #menu>ul>li>a {
        display: inline-block;
        width: 100%;
        float: none;
        margin: 0;
        padding: 1em;
    }
}

@media ( max-width: 700px) {
    body {
        font-size: 0.8em;
    }
    #menu_name {
        margin: 0 5%;
        z-index: 99;
    }
    #menu_name a {
        margin: .7em -.7em;
    }
    #menu_name a:hover {
        border-bottom: .1em solid var(--text_main);
    }
    #menu_mobile {
        margin-right: 3%;
    }
    #menu>ul {
        margin: 3%;
        margin-top: 4.3em;
    }

    .menu_block {
    width: 35px;
    height: 35px;
    margin: 7px;
    }

    .menu-wrapper-margin {
        margin: 10px;
    }

    .menu {
        font-size: 6.5vh;  /* smaller menu items on small screens */
        line-height: 7.5vh;
    }

    .menu_button {
        padding: 1.2vh 1.2vh 1.2vh 0; 
    }

}

.blog-post {
    min-height: 25em;
    width: 100%;
    height: 100vh;
    z-index: 1;
    /* max-height: 130vw; */
}

.blog-post-bg {
    background: no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

@media only screen and (max-device-width: 500px) {
    .blog-post-bg {
        background: no-repeat center center;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }
}

.blog-post>img {
    width: 50%;
}

.single-post-bg>img {
    width: 30vh;
}

.single-post-banner {
    position: relative;
    z-index: 2;
    display: block;
    overflow: hidden;
    height: 30vw;
    min-height: 300px;
    max-height: 40vh;
    width: 100%;
    background-color: black;
}


.single-post-content {
    min-height: 28em;
    width: 100%;
    background: var(--bg_1);
    display: block;
    z-index: 10;
    border: .1em solid var(--bg_1);
    /* margin: 0 0 20em; */
    padding: 0;
    position: relative;
}

.single-post-bg {
    position: fixed;
    width: 100%;
    height: 65vh;
    min-height: 35em;
    z-index: 0;
    -webkit-filter: blur(1em);
    filter: blur(1em);
    transform: scale(1.05);
/*    opacity: 0.5;*/
}

.single-post>img {
    width: 25%;
}

.single-post-title-wrap {
    text-align: left;
    position: absolute;
    bottom: 20%;
    left: 50%;
    transform: translateY(-50%);
    transform: translateX(-50%);
    width: 80%;
    max-width: 1200px;
    margin: auto;
    z-index: 10;
}


@media (max-device-width: 1000px) {
    .single-post-title-wrap {
        padding: 0.15em 0.15em 0 0.15em;
        bottom: 5%;
    }
}

.single-post-title {
    font-size: 2.5em;
    font-weight: 300;
    color: var(--text_main);
    text-shadow: 0 0 10px var(--shadow);
    letter-spacing: .36em;
    text-transform: uppercase;
    width: 100%;
    display: block;
    margin: 1em 0 .3em;
    white-space: nowrap;
}


.maintenance-title {
    font-size: 2em;
    font-weight: 300;
    color: var(--text_main);
    text-shadow: 0 0 30px var(--shadow);
    letter-spacing: .36em;
    text-transform: uppercase;
    background: var(--bg_1);
    width: 100%;
    display: block;
}



.single-post-subtitle {
    font-size: 1.5em;
    color: var(--text_main);
    text-shadow: 0 0 .5em var(--shadow);
    letter-spacing: .36em;
    text-transform: uppercase;
    font-weight: 300;
}

.single-post-services {
    font-size: 1.5em;
    color: var(--text_main);
    text-shadow: 0 0 .5em var(--shadow);
    letter-spacing: .36em;
    text-transform: uppercase;
    font-weight: 300;
}

.service_button {
    display: inline-block;
    font-size: .6em;
    color: var(--text_main);
    letter-spacing: .1em;
    text-transform: uppercase;
    font-weight: 300;
    padding: .05em .2em .05em .3em;
    margin: 0.25em .25em .25em .05em;
    text-decoration: none;
    border: .05em solid var(--text_main);
}

.service_button:hover {
    color: var(--bg_1);
    background: var(--accent);
    border-color: var(--accent);
}


/* OVERRIDE FOR DARK BG AJAX */
.ajax-post-banner {
    position: relative;
    z-index: 2;
    display: block;
    overflow: hidden;
    height: 100dvh;
    min-height: 300px;
    max-height: 100dvh;
    width: 100%;
    background-color: black;
}

.ajax-post-title {
    color: var(--lightcoolgrey);
    text-shadow: 0 0 10px black;
}

.ajax-service_button {
    display: none;
    color: var(--lightcoolgrey);
    border: .05em solid var(--lightcoolgrey);
}

.ajax-post-title-wrap {
    bottom: 2%;
}


/* CUSTOM VIDEO PLAYER  */

.player {
    /* max-width:750px; */
    /* border:5px solid rgba(0,0,0,0.2); */
    /* box-shadow:0 0 20px rgba(0,0,0,0.2); */
    /* position: relative; */
    /* font-size: 0; */
    /* overflow: hidden; */
  }
  
  /* This css is only applied when fullscreen is active. */
  .player:fullscreen {
    /* max-width: none; */
    /* width: 100%; */
  }
  
  .player:-webkit-full-screen {
    /* max-width: none; */
    /* width: 100%; */
  }
  
  .player__video {
    width: 100%;
  }
  
  .player__button {
    background:none;
    border:0;
    line-height:1;
    color:white;
    text-align: center;
    outline:0;
    padding: 0;
    cursor:pointer;
    /* max-width:40px; */
    width: 2em;
    height: 2em;
    max-width: 2em;
    max-height: 2em;
    /* border: 1px solid green; */
    background-size:auto;
    font-size: 1em;
    
  }
  
  .player__button:hover {
    color: var(--accent);
  }
  
  .player__slider {
    width:10px;
    height:30px;
  }
  
  .player__controls-wrapper {
    position: absolute;
    left: 50%;
    bottom:2%;
    width: 80%;
    max-width: 1200px;
    /* transform: translateY(100%) translateY(-5px); */
    transform: translateX(-50%);
    display: flex;
    justify-content: flex-end;
    z-index: 1000000;
  }

  .player__controls {
    display:flex;
    width: 20em;
    transition:opacity .3s;
    /* flex-wrap:wrap; */
    justify-content: flex-end;
    background:none;
    color: #fff;
    z-index: 2147483648;
    font-size: 1em;
    height: 2em;
    text-shadow: 0 0 10px black;
    /* border: 1px solid red; */
    /* opacity: 0; */
    /* This is ridiculous so that it overrides the shadow 
    dom and shows the custom player in full screen mode instead */
  }
  
  .player:hover .player__controls {
    /* transform: translateY(0); */
    /* opacity: 1; */
  }
  
  .player:hover .progress {
    height:15px;
  }
  
  .player__controls > * {
    flex:1;
  }
  
  .progress {
    flex:10;
    position: relative;
    display:flex;
    flex-basis:100%;
    height:5px;
    transition:height 0.3s;
    background:rgba(0,0,0,0.5);
    cursor:ew-resize;
  }
  
  .current,
  .duration {
    /* max-width: 30px; */
    color: #fff;
    font-size: 1em;
    max-width: 4em;
    margin: auto 0px;
    text-align: center;
    /* padding: 0 7px; */
  }
  
  .fullscreen-btn {
  }
  
  .progress__filled {
    width:50%;
    background:#ffc600;
    flex:0;
    flex-basis:0%;
  }
  
  .progress__filled .current {
    position: absolute;
    right: 0;
    top: -10px;
  }
  
  /* unholy css to style input type="range" */
  
  video::-webkit-media-controls {
    display:none !important;
  }
  
  input[type=range] {
    -webkit-appearance: none;
    background:transparent;
    width: 100%;
    margin: 0 5px;
  }
  input[type=range]:focus {
    outline: none;
  }
  input[type=range]::-webkit-slider-runnable-track {
    width: 100%;
    height: 8.4px;
    cursor: pointer;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0), 0 0 1px rgba(13, 13, 13, 0);
    background: rgba(255,255,255,0.8);
    border-radius: 1.3px;
    border: 0.2px solid rgba(1, 1, 1, 0);
  }
  input[type=range]::-webkit-slider-thumb {
    height: 15px;
    width: 15px;
    border-radius: 50px;
    background: #ffc600;
    cursor: pointer;
    -webkit-appearance: none;
    margin-top: -3.5px;
    box-shadow:0 0 2px rgba(0,0,0,0.2);
  }
  input[type=range]:focus::-wefbkit-slider-runnable-track {
    background: #bada55;
  }
  input[type=range]::-moz-range-track {
    width: 100%;
    height: 8.4px;
    cursor: pointer;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0), 0 0 1px rgba(13, 13, 13, 0);
    background: #ffffff;
    border-radius: 1.3px;
    border: 0.2px solid rgba(1, 1, 1, 0);
  }
  input[type=range]::-moz-range-thumb {
    box-shadow: 0 0 0 rgba(0, 0, 0, 0), 0 0 0 rgba(13, 13, 13, 0);
    height: 15px;
    width: 15px;
    border-radius: 50px;
    background: #ffc600;
    cursor: pointer;
  }
  

  /* END CUSTOM PLAYER  */


.ajax-main-video {
    /* max-width: 1200px; */
    width: 100vw;
    height: 100dvh;
    /* margin: 6em auto; */
    display: block;
    outline: 0;
    /* position: relative; */
    box-sizing: border-box;
    margin: 0;
    position: absolute;
    /* top: 50%; */
    /* -ms-transform: translateY(-50%); */
    /* transform: translateY(-50%); */
}

.ajax-main-video video {
    width: 100%;
    max-height: 100dvh;
    /* height: 100%; */
    margin: auto auto;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

/* https://developer.mozilla.org/en-US/docs/Web/Media/Audio_and_video_delivery/Video_player_styling_basics */

.ajax-main-video video::-webkit-media-controls-enclosure {
    /* width:80%; */
    /* max-width: 1200px; */
    background-color:transparent;
    -moz-border-radius: 1px !important;
    -webkit-border-radius: 1px !important;
    border-radius: 1px !important;
    filter: alpha(opacity=100);
    opacity: 1;
    margin:0;
    /* padding: 0 0 10em; */
    overflow: hidden;
}
.ajax-main-video video::-webkit-media-controls-panel {
    margin: 0;
    padding: 0;
    background-color: transparent;
    background-image: none !important;
    /* filter: brightness(0.4); */
    /* height:35px !important; */
}

.controls {
    display: block;
    float: right;
    /* display: inline-flex; */
    width: 12em;
    height: 2em; /* of figure's height */
    /* position: absolute; */
    /* right: 0px; */
    /* top: 0px; */
    color: white;
    border: 1px solid green;
}

.controls[data-state="hidden"] {
    /* display: block; */
}

.controls[data-state="visible"] {
    /* display: block; */
}

.controls > * {
    /* float: left; */
    /* width: 3.90625%; */
    /* height: 100%; */
    /* margin-left: 0.1953125%; */
    /* display: block; */
    display: inline-block;
    color: white;
    float: right;
    border: 1px solid pink;
    width: 2em;
    height: 2em;
    margin: 0 0 0 1em;

}

.controls > *:first-child {
    margin-left: 0;
}

.controls .progress {
    cursor: pointer;
    width: 75.390625%;
}

.controls button {
    cursor: pointer;
    background: transparent;
    background-size: contain;
    background-repeat: no-repeat;
}

.controls button:hover,
.controls button:focus {
  /* opacity: 0.5; */
  background-color: var(--accent);
}

.controls button[data-state="play"] {
    /* background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAABHElEQVR4nO3ZsU3EQBCF4Q8hIIGMlIQCaIAOKIIWCKAAWiAkJSSlgWvgroCLL3VGcjpxQ7IkhLC2b1b7S39q6Vm25+2YTqfT+cUTTjVAYI07DQSJ4geuNRAksMULLiQPEsUN7nEkeZAoLnCjgSCBL7zhUvIgURzwgGPJg0RxhVsNBAns8Y4ryYNE8RPPOMseJA6lHURlZ2sHMYKztIMY0UnbQUzgYop2EBO5w+uY7SAmdhirHcRMrmq3g5jRfc120IP4301YZn+0huwv+66Fz+8i+0BMX1G2pTSeTxHgh9oh0tf4dfaD1Wf2o+6+heXDMvs6aMi+oNuNPZVr0PwSe5P9t8J2jqlcg4OYyjU4iKlcg0ecVLlSp9Pp+CPfGIyWAE6XLnEAAAAASUVORK5CYII="); */
}
  
.controls button[data-state="pause"] {
    /* background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAVklEQVR4nO3SoRHAMBAEMfffdEK2gIBzkMQf/NyeAwA/ej66dT/jkVhkTVqR1pq0Iq01aUVaa9KKtNakFWmtSSvSWpNWpLUmrUhrTVqR1pq0Ii0AOPe8ZXiV98fYlvIAAAAASUVORK5CYII="); */
}

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAVklEQVR4nO3SoRHAMBAEMfffdEK2gIBzkMQf/NyeAwA/ej66dT/jkVhkTVqR1pq0Iq01aUVaa9KKtNakFWmtSSvSWpNWpLUmrUhrTVqR1pq0Ii0AOPe8ZXiV98fYlvIAAAAASUVORK5CYII=" alt="pause--v1">

.controls progress {
    display: block;
    width: 100%;
    height: 81%;
    margin-top: 0.125rem;
    border: none;
    color: #0095dd;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
  }

  .controls progress[data-state="fake"] {
    background: #e6e6e6;
    height: 65%;
  }
  .controls progress span {
    width: 0%;
    height: 100%;
    display: inline-block;
    background-color: #2a84cd;
  }

  .controls progress::-moz-progress-bar {
    background-color: #0095dd;
  }
  
  .controls progress::-webkit-progress-value {
    background-color: #0095dd;
  }
  



.blog-post-title-wrap {
    position: absolute;
    top: 50%;
    left: 15%;
    right: 15%;
    transform: translateY(-50%);
    z-index: 100;
    text-align: center;
    cursor: pointer;
}

.blog-post-title-wrap a {
    color: var(--text_main);
    text-decoration: none;
    display: block;
    padding: 1em;
}

.blog-post-title-wrap a span {
    text-align: center;
    font-size: 2em;
    /* color: var(--text_main); */
    text-shadow: 0 0 .6em var(--shadow);
    letter-spacing: .36em;
    text-transform: uppercase;
}

.blog-post-title-wrap a:hover {
    background-color: var(--text_main);
}

.blog-post-title-wrap a:active, .blog-post-title-wrap a:focus {
    background-color: var(--accent);
    border-color: var(--accent);
}


.blog-post-title-wrap a:hover span {
    color: var(--bg_1);
    text-shadow: none;
}

.blog-post-title {
    font-weight: bold;
}

.blog-post-title-loading, .blog-post-title-loading a, .blog-post-title-loading a:hover, .blog-post-title-loading a:active, .blog-post-title-loading a:focus  {
    background-color: var(--accent) !important;
    /* border: 5px dashed white !important; */
    color: white !important;
    opacity: 1 !important;

    position: relative;
    margin: auto;
    /* width: 160px; */
    /* line-height: 160px; */
    /* text-align: center; */
    /* font-size: 24px; */
    
    &::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        /* width: 50%; */
        /* height: 50%; */
        border: 4px solid white;
        transition: all .5s;
        animation: post-loading 3s infinite linear;
        border-radius: 2px;
    }

    &::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        border: 4px solid white;
        transition: all .5s;
        animation: post-loading2 3s infinite linear;
        /* border-radius: 2px; */
    }
}

@keyframes post-loading {
    0%,
    100% {
        clip-path: inset(0 0 95% 0);
    }
    
    25% {
        clip-path: inset(0 95% 0 0);
    }
    50% {
        clip-path: inset(95% 0 0 0);
    }
    75% {
        clip-path: inset(0 0 0 95%);
    }
}

@keyframes post-loading2 {
    0%,
    100% {
        clip-path: inset(95% 0 0 0);
    }
    
    25% {
        clip-path: inset(0 0 0 95%);
    }
    50% {
        clip-path: inset(0 0 95% 0);
    }
    75% {
        clip-path: inset(0 95% 0 0);
    }
}

.bg::before {
    background: rgba(255, 215, 0, .5);
}

.blog-post-subtitle {
    font-weight: 300;
    white-space: nowrap;
}

.blog-button a {
    color: var(--text_main);
    /*border: .1em solid var(--text_main);*/
    display: inline-block;
    padding: .6em 1em;
    margin: 30px .5em;
    text-align: left;
    font-size: 1.5em;
    font-weight: bold;
    /*-webkit-box-shadow: 0 0 40px 0 var(--highlight);*/
    /*-moz-box-shadow: 0 0 40px 0 var(--highlight);*/
    /*box-shadow: 0 0 40px 0 var(--highlight);*/
    text-decoration: none;
    /*text-shadow: 0 0 .6em var(--shadow);*/
    background-color: rgba(0, 0, 0, 0.1);
    /*background-color: var(--bg_1);*/
/*    backdrop-filter: blur(10px);*/
}

.blog-button a:hover {
    color: var(--bg_1);
    text-shadow: none;
    background-color: var(--text_main);
    /*border: .1em solid var(--text_main);*/
    text-decoration: none;
}

.blog-button a:active, .blog-button a:focus {
    background-color: var(--accent);
    border-color: var(--accent);
}

.blog-button a:focus {
    outline: 0;
}

.justify {
    text-align: justify;
}

#archives {
    left: 50%;
    width: 80%;
    transform: translateX(-50%);
    display: block;
    position: relative;
    padding: 5em 0 20em;
    text-align: center;
    z-index: 5;
    background-color: var(--bg_1);
}

#archives_wrapper {
    width: 100%;
    z-index: 5;
    background-color: var(--bg_1);
    position: relative;
    /*padding-top: 10em;*/
}

#archives_grid {
    padding: 0;
    width: 100%;
    line-height: 0;
}

@media (max-width: 700px) {
    #archives {
        width: 90%;
        margin: 0% 5%;
        left: 0;
        transform: none;
    }
}

#archives_grid_width {
    position: absolute;
    width: 16.6666666%;
}

.blog-archive-title-wrap {
    text-align: left;
    margin: 0 0 35px;
    padding: .4em;
}

#archive-blog-category {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    width: 100%;
    gap: .4em;
    margin-top: 0;
    height: auto;
}

.archive-title {
font-size: 2.5em;
letter-spacing: 2px;
}

.archive-subtitle {
color: var(--mid_1);
font-size: 1.2em;
font-style: italic;
letter-spacing: 2px;
margin: 1em 0 .5em;
}

.archive-post {
    line-height: 0;
/*    background: no-repeat center center;
    background-size: cover;*/    
    display: inline-block;
    width: 16.6666666%;
    margin: 0;
    overflow: hidden;
    text-align: center;
    align-content: center;
    background: var(--bg_1);
}

.archive-post-unselected {
    /* Class for when hovering on categories/filters and the post ins't selected */
    /* background: none; */
    /* border: 1px solid black; */
}


.archive-post-bg-wrap {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: absolute;
    line-height: 0;
    border: 8px solid var(--bg_1);
    display: block;
    overflow: hidden;
}

.archive-post-bg-unselected {
    width: 100%;
    height: 100%;
/*    top: 0;*/
/*    left: 0;*/
    top: 50%;
    left: 50%;
    position: absolute;
    /* line-height: 0; */
    /* background: no-repeat center center; */
    /* background-color: var(--bg_2); */
    /* background-size: cover; */
    display: block;
/*    transform: scale(1.00);*/
    transform: scale(1.00) translate(-50%, -50%);
    /* transition: all 0.5s ease; */
    /* filter: blur(0px); */
    border: 1.5px solid black;
    /* margin: 15px; */
    opacity: 0;
}

.archive-post-bg {
    width: 100%;
    height: 100%;
/*    top: 0;*/
/*    left: 0;*/
    top: 50%;
    left: 50%;
    position: absolute;
    line-height: 0;
    background: no-repeat center center;
    background-color: var(--bg_2);
    background-size: cover;
    display: block;
/*    transform: scale(1.00);*/
    transform: scale(1.00) translate(-50%, -50%);
    transition: all 0.5s ease;
    filter: none;
}

/* .archive-post-bg-unselected::before { */
    /* content: "<div class='unselected'>BITE</div>"; */
/* } */

.unselected {
    border: 2px solid green;
}

/* .archive-post-bg-unselected > source { */
    /* display: none; */
/* } */

.archive-post-bg-video {
    top: 50%;
    left: 50%;
    position: absolute;
    line-height: 0;
    background: no-repeat center center;
    background-color: var(--bg_2);
    background-size: cover;
    display: block;
    transform: scale(1.00) translate(-50%, -50%);
    transition: all 0.5s ease;
    /* filter: blur(0px); */
    filter: none;
}

/*WIDE*/
.archive-post-huge .archive-post-bg-video, .archive-post-wide .archive-post-bg-video {
    width: 100%;
}

/*SQUARE AND TALL*/
.archive-post-big .archive-post-bg-video, .archive-post-tall .archive-post-bg-video {
    height: 100%;
}


/*.archive-post:hover .archive-post-bg, .archive-post:hover video {
    filter: blur(10px);
    -webkit-filter: blur(10px);
    -moz-filter: blur(10px);
    -ms-filter: blur(10px);
    -o-filter: blur(10px);
    /*transition: all 1s ease;*/
/*    transform: translate(-50%, -50%) scale(1.1) ;*/


.archive-post-blur {
    filter: blur(10px) saturate(1.5);
    -webkit-filter: blur(10px) saturate(1.5);
    -moz-filter: blur(10px) saturate(1.5);
    -ms-filter: blur(10px) saturate(1.5);
    -o-filter: blur(10px) saturate(1.5);
    transition: all 1s ease;
    transform: translate(-50%, -50%) scale(1.1);
}

.archive-post-click {
    /* filter: sepia(100%) hue-rotate(-90deg); */
}


.single-post-bg-video {
    width: 100%;
    top: 0;
    left: 0;
    position: absolute;
    line-height: 0;
    background: no-repeat center center;
    background-color: var(--bg_2);
    background-size: cover;
    display: block;
    transform: scale(1.00);
    filter: blur(0px);
}


.archive-post img {
    width: 100%;
}

.archive-post-faded {
    opacity: 0.5;
}

.archive-post-highlighted {
    border: .1em solid var(--text_main);
}

.archive-post-big,
.archive-post-wide {
    width: 33.33333333%;
}

.archive-post-huge {
    width: 66.66666666%;
}

.archive-post-tall img {
    width: 200%;
}

.archive-post-huge img {
    width: 50%;
}

.archive-post-wide img {
    width: 50%;
}

.archive-post:hover {
    cursor: pointer;
}

.archive-post-title-wrap {
    background-color: var(--bg_1_opa);
    text-align: left;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    margin: 0;
    line-height: 1.5em;
    border: 8px solid var(--bg_1);
    opacity: 0;
    color: var(--almostblack);
    /* color: black; */
/*    -webkit-transition: opacity .1s ease-in-out;
    -moz-transition: opacity .1s ease-in-out;
    -ms-transition: opacity .1s ease-in-out;
    -o-transition: opacity .1s ease-in-out;
    transition: opacity .1s ease-in-out;
*/
}


.greyscale {
    filter: grayscale(.5);
    -webkit-filter: grayscale(.5);
    -moz-filter: grayscale(.5);
    -ms-filter: grayscale(.5);
    -o-filter: grayscale(.5);
/*    transition: all 300ms ease;*/
}

.saturate {
    filter: saturate(2);
    -webkit-filter: saturate(2);
    -moz-filter: saturate(2);
    -ms-filter: saturate(2);
    -o-filter: saturate(2);
/*    transition: all 300ms ease;*/
}

.archive-post-title-wrap a {
    position: absolute;
    text-decoration: none;
    display: block;
    width: 100%;
    height: 100%;
}

/* Staggered reveal on archive relayout */
#archives.archive-stagger .archive-post {
    opacity: 0;
    transition: opacity 480ms ease;
    transition-delay: var(--archive-stagger-delay, 0ms);
}
#archives.archive-stagger.archives-ready .archive-post.archive-post-revealed {
    opacity: 1;
}
#archives.archive-stagger.archive-enter .archive-post,
#archives.archive-stagger.archives-ready .archive-post {
    will-change: opacity;
}
#archives.archives-ready:not(.archive-stagger) .archive-post {
    opacity: 1;
}

.archive-post-title-wrap u {
    position: absolute;
    text-decoration: none;
    display: block;
    bottom: .36em;
    left: .36em;
    padding: 0 .36em;
}

.archive-filter {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1 1 0;
    font-size: 1.5em;
    color: var(--text_main);
    letter-spacing: .3em;
    text-transform: uppercase;
    font-weight: 300;
    padding: .1em .2em .1em .5em;
    margin: 0; /* spacing handled by container gap */
    text-decoration: none;
    border: 1.5px solid var(--text_main);
}

/* Remove right margin/padding on the last button if any fallback margins are applied */
#archive-blog-category > .archive-filter:last-child {
    margin-right: 0 !important;
    padding-right: .2em; /* keep inner padding consistent */
}

/* Keep 'ONE STOP' label on a single line */
#archive-blog-category #cat_ONESTOP { white-space: nowrap; }

.archive-filter:hover, .archive-filter-close:hover {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--bg_1);
}

.archive-filter-selected {
    border: .06em solid var(--text_main);
    background: var(--text_main);
    color: var(--bg_1);
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.archive-filter-close {
    /* display: inline-block; */
    display: none;
    align-items: center;
    justify-content: center;
    flex: 1 1 0;
    font-size: 1.5em;
    /* color: var(--text_main); */
    letter-spacing: 0; /* keep single X tight */
    text-transform: uppercase;
    font-weight: 300;
    padding: .1em .2em .1em .5em;
    margin: 0; /* spacing handled by container gap */
    text-decoration: none;
    border: 1.5px solid var(--text_main); /* match category button border */
    background: var(--text_main);
    color: var(--bg_1);
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
    line-height: 1; /* ensure vertical centering consistency */
    cursor: pointer;
}



.archive-load-more-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 1em;
    padding: .35em .8em;
    margin-top: calc(1.5em + .7em); /* match button height (label line-height + vertical padding) */
    background: transparent;
    border: none;
    color: var(--text_main);
    cursor: pointer;
    font-family: inherit;
    font-size: 1em;
    transition: color 0.2s ease, background 0.2s ease;
}

.archive-load-more-button::before {
    content: '+';
    color: var(--accent);
    font-size: 3.3em;
    line-height: 0.8;
    letter-spacing: 0;
}

.archive-load-more-button .archive-load-more-label {
    display: inline-block;
    font-size: 1.5em;
    letter-spacing: .3em;
    text-transform: uppercase;
    font-weight: 300;
    color: var(--text_main);
}

.archive-load-more-button:hover .archive-load-more-label,
.archive-load-more-button:focus .archive-load-more-label {
    color: #fff;
}

.archive-load-more-button:hover,
.archive-load-more-button:focus {
    background: var(--accent);
    color: #fff;
}

.archive-load-more-button:hover::before,
.archive-load-more-button:focus::before {
    color: #fff;
}

.archive-load-more-button:focus {
    outline: 1px solid #fff;
    outline-offset: 4px;
}

.archives-placeholder-loading {
    text-align: center;
    padding: 2em 0;
}

.archives-placeholder-loading .loader {
    display: inline-block;
}

.archive-load-more-wrap.archive-load-more-placeholder {
    margin-top: 2em;
}

.archive-load-more-wrap.archive-load-more-placeholder .archive-load-more-button {
    cursor: progress;
    opacity: 0.7;
}

.archive-load-more-button.is-loading {
    pointer-events: none;
}

.archive-load-more-button.is-loading::before {
    content: '+';
    display: inline-block;
    transform-origin: 50% 50%;
    animation: archive-load-more-plus-rotate 4s linear infinite;
}

@keyframes archive-load-more-plus-rotate {
    0% {
        transform: rotate(0deg);
        animation-timing-function: cubic-bezier(0.85, 0, 0.15, 1);
    }
    25% {
        transform: rotate(90deg);
        animation-timing-function: cubic-bezier(0.85, 0, 0.15, 1);
    }
    50% {
        transform: rotate(180deg);
        animation-timing-function: cubic-bezier(0.85, 0, 0.15, 1);
    }
    75% {
        transform: rotate(270deg);
        animation-timing-function: cubic-bezier(0.85, 0, 0.15, 1);
    }
    100% {
        transform: rotate(360deg);
    }
}

.archive-post-title {
    font-size: 1.3em;
    color: var(--almostblack);
    letter-spacing: .1em;
    text-transform: uppercase;
}

.archive-post-title-squeeze {
    display: inline-block;
    font-size: 1.4em;
    letter-spacing: 0;
    line-height: 1.1em;
}

.archive-post-subtitle {
    font-size: 1em;
    color: var(--almostblack);
    letter-spacing: 4px;
    text-transform: uppercase;
    font-weight: 300;
    /* border: 1px solid var(--almostblack); */
}

.archive-post-subtitle hr {
    border: 1px solid var(--almostblack);
    /* color: var(--accent); */
    /*height: .1em;*/
    width: 20%;
}

.archive-post-play {
    border: 1px solid pink;
    position: absolute;
    width: 100%;
    height: 100%;
/*    right: 10px;*/
/*    bottom: 10px;*/
}

.archive-post-title-wrap-loading {
    background-color: var(--accent);
    /* border: 8px solid var(--bg_1); */
    /* color: white; */
    opacity: 1 !important;
    transition: all .5s;

    &::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        border: 4px solid white;
        transition: all .5s;
        animation: post-loading 3s infinite linear;
        /* border-radius: 2px; */
    }

    &::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        border: 4px solid white;
        transition: all .5s;
        animation: post-loading2 3s infinite linear;
        /* border-radius: 2px; */
    }

}

.archive-post-title-loading {
    /* background-color: var(--accent_opa); */
    /* border: 8px solid var(--bg_1); */
    color: white;
    /* border: 1px solid white; */
    /* opacity: 0.5; */
    transition: all .5s;
}

.archive-post-title-loading hr {
    /* background-color: var(--accent_opa); */
    /* border: 8px solid var(--bg_1); */
    /* color: white; */
    border: 1px solid white;
    /* opacity: 0.5; */
    transition: all .5s;
}

.archive-filter-loading {
    position: relative;
    display: inline-block;
    color: #fff !important;
    background-color: var(--accent);
    transition: all .5s ease;
}

.archive-filter-loading::before,
.archive-filter-loading::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border: 2px solid rgba(255, 255, 255, 0.85);
    pointer-events: none;
    transition: all .5s ease;
}

.archive-filter-loading::before {
    animation: post-loading 3s infinite linear;
}

.archive-filter-loading::after {
    animation: post-loading2 3s infinite linear;
}



/*JOIN US / JOBS */

/* Map visibility safety net: ensure WP Go Maps has height and isn't clipped */
#contact-wrapper .wpgmza_map {
    position: relative;
    min-height: 320px;
    height: 50vh;
}
#contact-wrapper .columns-wrap {
    overflow: visible;
}
.sjb-page {
    width: 80%;
    max-width: 1200px;
    margin: 0 auto .5vh;
    background-color: var(--bg_1);
    overflow: hidden;
}

.sjb-page .list-data .v2 .header-margin-top {
    display: none;
}

.sjb-page .list-data .v1, .sjb-page .list-data .v2 {
    background-color: var(--bg_2) !important;
    border: 3px solid var(--bg_2) !important;
    color: var(--text_main) !important;
}

.file span {
    color: var(--bg_1);

}

.sjb-page .sjb-detail .list-data .v2 .jobpost-form .form-box {
    padding: 0;
    border: 1px solid #444;
    margin-bottom: 20px;
    float: left;
    width: 100%;
}

.job-title {
    color: var(--text_main);
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    font-size: 2em;
    font-weight: 300;
    /*text-shadow: 0 0 0.14em rgb(0 30 60 / 80%);*/
    letter-spacing: .36em;
    text-transform: uppercase;
    padding: 0 0;
    align-items: left;
    text-align: left;
    width: 100%;
    flex-shrink: 1;
    white-space: nowrap;
    overflow: hidden;
    margin-top: 1em;
}

.job-title:after {
    content: '';
    display: inline-flex;
    align-self: baseline;
    height: 100%;
    width: 100%;
    border-bottom: 3px solid var(--accent);
    flex: 1 0 10px;
}

@media (max-width: 700px) {
    .job-title {
        font-size: 1em;
        white-space: break-spaces;
    }
}
@media (max-width: 1000px) {
    .job-title {
        font-size: 1.1em;
        white-space: break-spaces;
    }
}

.sjb-page .sjb-detail .list-data .v2 .job-features .sjb-title-value h4{
    color: #888;
}


.sjb-page .form-control {
    color: #888;
    background-color: var(--bg_1);
    border: none;
    border-radius: 2px;
    -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
    -moz-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    overflow: hidden;
}

.sjb-page .form-control {
    color: var(--text_main);
}

.sjb-page .sjb-filters.sjb-filters-v2 {
    background-color: var(--bg_2);
}

.sjb-page .sjb-detail .list-data .v2 .jobpost-form .form-control {
    font-size: 16px;
    height: 40px;
    border-radius: 0;
     border: 1px solid #444; 
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}

.sjb-page .sjb-detail .list-data .v2 .jobpost-form .form-control:hover {
     border: 1px solid var(--accent); 
}


.sjb-page .sjb-detail .list-data .v2 ul li {
    font-size: inherit;
    line-height: 20px;
    padding-left: 25px;
    position: relative;
    margin-top: 5px;
}

.sjb-page .sjb-detail .list-data .v1 ul li::before, .sjb-page .sjb-detail .list-data .v2 ul li::before {
    color: var(--accent);
    content: "\f111";
    font-family: fontawesome;
    font-size: 8px;
    left: 0;
    position: absolute;
    top: 0;
}

.sjb-page {
     font-family: inherit; 
}

.sjb-page h2 {
    font-family: inherit;
    font-weight: 400;
    color: var(--accent); 
}

@media (max-width: 700px) {
    .sjb-page h2 {
        font-size: 20px;
    }
}

.sjb-page .sjb-detail .list-data .v2 {
    /*padding: 15px 20px;*/
    background: var(--bg_1);
}

.sjb-page .sjb-detail .list-data .v2 h3 {
    color: var(--text_main); 
}

.sjb-page .list-data .sjb-job-type-location-date {
    border-top: 0 solid var(--bg_1);
    padding: 15px 25px;
    overflow: hidden;
}

.sjb-page .list-data .v2 .job-description p {
    color: var(--text_main);
    font-size: inherit;
    margin: 0 0 15px;
    word-wrap: break-word;
}

.sjb-page .btn-primary, .sjb-page .btn-primary:active:focus, .sjb-page .sjb-detail .jobpost-form .file div {
    background-color: var(--accent) !important;
    color: var(--bg_1) !important;
}

.sjb-page .btn-primary:hover, .sjb-page .btn-primary:active:hover, .sjb-page .sjb-detail .jobpost-form .file:hover div {
    background-color: var(--bg_1) !important;
    color: var(--accent) !important;
    cursor: pointer;
}

.sjb-page .sjb-detail .list-data .v2 .jobpost-form .file div {
    cursor: pointer;
}

.ui-datepicker .ui-state-hover {
    background: var(--accent);
    border: 1px solid var(--accent);
    color: var(--text_main);
}

.sjb-page .sjb-detail .v2 .jobpost-form .form-box h3 {
    color: var(--accent);
}


.columns-wrap {
    margin: 3.6em auto;
    width: 100%;
    max-width: none;
    position: relative;
}

.columns-wrap img {
    float: none;
}

/* Global block width behavior */
:root {
    --bloom-content-width: 1200px;
    --bloom-content-ratio: 80%;
    --bloom-wide-width: 1500px;
}

:where(.wp-block):not(.alignfull):not(.alignwide):not([data-align="full"]):not([data-align="wide"]) {
    width: var(--bloom-content-ratio);
    max-width: var(--bloom-content-width);
    margin-left: auto;
    margin-right: auto;
}

.columns-wrap > *:not(.alignfull):not(.alignwide):not([data-align="full"]):not([data-align="wide"]) {
    width: var(--bloom-content-ratio);
    max-width: var(--bloom-content-width);
    margin-left: auto;
    margin-right: auto;
}

.column-left {
    width: 30%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}

.column-right {
    margin: 0 0 0 45%;
    text-align: justify;
}

/*WP COLUMNS*/
.wp-block-columns {
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap !important;
    align-items: normal !important;
    margin-right: auto;
    margin-left: auto;
    gap: var(--wp--style--block-gap, 2rem);
}

@media (min-width: 782px) {
    .wp-block-columns {
        flex-wrap: nowrap !important;
    }
}

.wp-block-columns.are-vertically-aligned-top {
    align-items: flex-start;
}

.wp-block-columns.are-vertically-aligned-center {
    align-items: center;
}

.wp-block-columns.are-vertically-aligned-bottom {
    align-items: flex-end;
}

@media (max-width: 781px) {
    .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
        flex-basis: 100% !important;
    }
}

@media (min-width: 782px) {
    .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
        flex-basis: 0;
        flex-grow: 1;
    }
    .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column[style*="flex-basis"] {
        flex-grow: 0;
    }
}

.wp-block-columns.is-not-stacked-on-mobile {
    flex-wrap: nowrap !important;
}

.wp-block-columns.is-not-stacked-on-mobile > .wp-block-column {
    flex-basis: 0;
    flex-grow: 1;
}

.wp-block-columns.is-not-stacked-on-mobile > .wp-block-column[style*="flex-basis"] {
    flex-grow: 0;
}

:where(.wp-block-columns) {
    margin-bottom: 1.75em;
}

:where(.wp-block-columns.has-background) {
    padding: 1.25em 2.375em;
}

.wp-block-column {
    flex-grow: 1;
    min-width: 0;
    overflow-wrap: break-word;
    word-break: break-word;
}

.wp-block-column.is-vertically-aligned-top {
    align-self: flex-start;
}

.wp-block-column.is-vertically-aligned-center {
    align-self: center;
}

.wp-block-column.is-vertically-aligned-bottom {
    align-self: flex-end;
}

.wp-block-column.is-vertically-aligned-stretch {
    align-self: stretch;
}

/*SLIDESHOWS*/
/*Full width for alignfull slideshows*/
/*.wp-block-jetpack-slideshow .alignfull > .wp-block-jetpack-slideshow_image {*/
.wp-block-jetpack-slideshow_image {
    width: 100% !important; 
} 

/*FIX ABOUT US*/
@media (max-width: 781px) {
    #aboutus .wp-block-column:nth-child(2n) {
        margin-left: 0;
    }
}

@media (max-width: 781px) {
    #aboutus .wp-block-image {
        max-height: 30vh;
        overflow: hidden;
    }
}

#aboutus {
    margin-top: 10%;
}


/*WP GALLERY*/

.wp-block-gallery {
    margin: 2em 0;
}

.blocks-gallery-grid .blocks-gallery-image,
.blocks-gallery-grid .blocks-gallery-item,
.wp-block-gallery .blocks-gallery-image,
.wp-block-gallery .blocks-gallery-item,
.blocks-gallery-grid .blocks-gallery-image,
.blocks-gallery-grid .blocks-gallery-item,
.wp-block-gallery .blocks-gallery-image,
.wp-block-gallery .blocks-gallery-item,
.blocks-gallery-grid .blocks-gallery-image,
.blocks-gallery-grid .blocks-gallery-item,
.wp-block-gallery .blocks-gallery-image,
.wp-block-gallery .blocks-gallery-item,
.blocks-gallery-grid .blocks-gallery-image,
.blocks-gallery-grid .blocks-gallery-item,
.wp-block-gallery .blocks-gallery-image,
.wp-block-gallery .blocks-gallery-item {
    margin: 1.1em 0;
}

@media (min-width: 600px) {
    .blocks-gallery-grid.columns-4 .blocks-gallery-image,
    .blocks-gallery-grid.columns-4 .blocks-gallery-item,
    .wp-block-gallery.columns-4 .blocks-gallery-image,
    .wp-block-gallery.columns-4 .blocks-gallery-item,
    .blocks-gallery-grid.columns-3 .blocks-gallery-image,
    .blocks-gallery-grid.columns-3 .blocks-gallery-item,
    .wp-block-gallery.columns-3 .blocks-gallery-image,
    .wp-block-gallery.columns-3 .blocks-gallery-item,
    .blocks-gallery-grid.columns-5 .blocks-gallery-image,
    .blocks-gallery-grid.columns-5 .blocks-gallery-item,
    .wp-block-gallery.columns-5 .blocks-gallery-image,
    .wp-block-gallery.columns-5 .blocks-gallery-item,
    .blocks-gallery-grid.columns-6 .blocks-gallery-image,
    .blocks-gallery-grid.columns-6 .blocks-gallery-item,
    .wp-block-gallery.columns-6 .blocks-gallery-image,
    .wp-block-gallery.columns-6 .blocks-gallery-item {
        margin: 1.1em 0;
    }
}


/*CREDITS*/
.credits_item {
    color: grey;
}

.wp-block-table {
    overflow-x: auto;
    margin: 2em 0;
}

.wp-block-table table {
    border-collapse: collapse;
    width: 100%;
}

.wp-block-table thead {
    border-bottom: 3px solid;
}

.wp-block-table tfoot {
    border-top: 3px solid;
}

.wp-block-table td,
.wp-block-table th {
    border: 1px solid;
    padding: .5em;
}

.wp-block-table .has-fixed-layout {
    table-layout: fixed;
    width: 100%;
}

.wp-block-table .has-fixed-layout td,
.wp-block-table .has-fixed-layout th {
    word-break: break-word;
}

.wp-block-table.aligncenter,
.wp-block-table.alignleft,
.wp-block-table.alignright {
    display: table;
    width: auto;
}

.wp-block-table.aligncenter td,
.wp-block-table.aligncenter th,
.wp-block-table.alignleft td,
.wp-block-table.alignleft th,
.wp-block-table.alignright td,
.wp-block-table.alignright th {
    word-break: break-word;
}

.wp-block-table.is-style-stripes {
    background-color: initial;
    border-bottom: 1px solid #f0f0f0;
    border-collapse: inherit;
    border-spacing: 0;
}

.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
    background-color: #f0f0f0;
}

.wp-block-table.is-style-stripes td,
.wp-block-table.is-style-stripes th {
    border-color: transparent;
}

/* Theme table styling overrides */
.wp-block-table td,
.wp-block-table th {
    border: none;
    padding: 0.5em 2em 0.5em 0;
    vertical-align: top;
    color: grey;
}

table {
    max-width: 1200px;
    width: 80%;
    height: auto;
    margin: 0 auto;
    padding: 0;
}

#contact table > tbody > tr>:nth-child(1){
 /*color:red;*/
 width:auto;
 text-transform: uppercase;
 color: grey;
 text-align:left;
 white-space: nowrap;
}

#contact table > tbody > tr>:nth-child(2){
 /*color:red;*/
 width:100%;
 text-align:left;
}


/*LAYOUT IMAGES*/

.wp-block-image,
figure.wp-block-image {
    position: relative;
    height: auto;
}

.wp-block-image > a,
.wp-block-image > figure > a,
.wp-block-image > figure {
    display: inline-block;
}

.wp-block-image img{
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    height: auto;
    border-radius: 0;
    vertical-align: bottom;
}

.wp-block-image[style*="border-radius"] img,
.wp-block-image[style*="border-radius"] > a {
    border-radius: inherit;
}

.wp-block-image.has-custom-border img {
    box-sizing: border-box;
}

.wp-block-image.aligncenter {
    text-align: center;
}

.wp-block-image.alignfull > a,
.wp-block-image.alignwide > a {
    width: 100%;
}

.wp-block-image.alignfull img,
.wp-block-image.alignwide img {
    width: 100%;
}

.wp-block-image .aligncenter,
.wp-block-image .alignleft,
.wp-block-image .alignright,
.wp-block-image.aligncenter,
.wp-block-image.alignleft,
.wp-block-image.alignright {
    display: table;
}

.wp-block-image .aligncenter > figcaption,
.wp-block-image .alignleft > figcaption,
.wp-block-image .alignright > figcaption,
.wp-block-image.aligncenter > figcaption,
.wp-block-image.alignleft > figcaption,
.wp-block-image.alignright > figcaption {
    caption-side: bottom;
    display: table-caption;
}

.wp-block-image .alignleft {
    float: left;
    margin: .5em 1em .5em 0;
}

.wp-block-image .alignright {
    float: right;
    margin: .5em 0 .5em 1em;
}

.wp-block-image .aligncenter {
    margin-left: auto;
    margin-right: auto;
}

.wp-block-image :where(figcaption) {
    margin-top: .5em;
    margin-bottom: 1em;
}

.icon {
    margin: 0;
}


/*LAYOUT IFRAME VIDEOS*/

.wp-block-embed {
    overflow-wrap: break-word;
    margin: 2em auto;
}

.wp-block-embed.alignleft,
.wp-block-embed.alignright,
.wp-block[data-align="left"] > [data-type="core/embed"],
.wp-block[data-align="right"] > [data-type="core/embed"] {
    max-width: 360px;
    width: 100%;
}

.wp-block-embed.alignleft .wp-block-embed__wrapper,
.wp-block-embed.alignright .wp-block-embed__wrapper,
.wp-block[data-align="left"] > [data-type="core/embed"] .wp-block-embed__wrapper,
.wp-block[data-align="right"] > [data-type="core/embed"] .wp-block-embed__wrapper {
    min-width: 280px;
}

.wp-block-embed :where(figcaption) {
    margin-top: .5em;
    margin-bottom: 1em;
}

.wp-block-embed iframe {
    max-width: 100%;
}

.wp-block-embed__wrapper {
    position: relative;
}

.wp-embed-responsive .wp-has-aspect-ratio .wp-block-embed__wrapper::before {
    content: "";
    display: block;
    padding-top: 50%;
}

.wp-embed-responsive .wp-has-aspect-ratio iframe {
    bottom: 0;
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
}

.wp-embed-responsive .wp-embed-aspect-21-9 .wp-block-embed__wrapper::before {
    padding-top: 42.85%;
}

.wp-embed-responsive .wp-embed-aspect-18-9 .wp-block-embed__wrapper::before {
    padding-top: 50%;
}

.wp-embed-responsive .wp-embed-aspect-16-9 .wp-block-embed__wrapper::before {
    padding-top: 56.25%;
}

.wp-embed-responsive .wp-embed-aspect-4-3 .wp-block-embed__wrapper::before {
    padding-top: 75%;
}

.wp-embed-responsive .wp-embed-aspect-1-1 .wp-block-embed__wrapper::before {
    padding-top: 100%;
}

.wp-embed-responsive .wp-embed-aspect-9-16 .wp-block-embed__wrapper::before {
    padding-top: 177.77%;
}

.wp-embed-responsive .wp-embed-aspect-1-2 .wp-block-embed__wrapper::before {
    padding-top: 200%;
}

.jp-carousel-close-hint span {
    height: 2em;
    width: 2em;
}

/*LAYOUT GALLERY*/

:where(.wp-block-gallery) {
    display: block;
    outline: 0;
    position: relative;
    max-width: 100%;
}

/*LAYOUT OVERALL*/
.aligncenter,
.alignleft,
.alignright {
    outline: 0;
}

.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.alignleft {
    float: left;
    margin: .5em 1em .5em 0;
}

.alignright {
    float: right;
    margin: .5em 0 .5em 1em;
}

.wp-block[data-align="wide"],
.alignwide {
    width: var(--bloom-content-ratio);
    max-width: var(--bloom-wide-width);
    margin: 0 auto 2em;
    display: block;
    outline: 0;
}

.wp-block[data-align="full"],
.alignfull {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    display: block;
    outline: 0;
}

/*WP VIDEO*/

.wp-block-video {
    box-sizing: border-box;
    margin: 2em auto;
}

.wp-block-video video {
    width: 100%;
    vertical-align: middle;
}

.wp-block-video.aligncenter {
    text-align: center;
}

.wp-block-video :where(figcaption) {
    margin-top: .5em;
    margin-bottom: 1em;
}

/*MASONRY*/

.gallery {
    margin: 3.6em -1.1em;
}

.gallery-sizer {
    width: 16.6667%;
}

.gallery-item {
    width: 16.6667%;
    margin: 0;
    overflow: hidden;
    text-align: center;
    align-content: center;
    /* background: var(--bg_1); */
    border: 8px solid var(--bg_1);
}

.gallery-item:hover {
    background: grey;
}

.gallery-item-big {
    border-top: .85em solid var(--bg_1);
    border-bottom: .85em solid var(--bg_1);
    width: 33.3333%;
}

@media (min-width: 1500px) {
    .gallery-sizer,
    .gallery-item {
        width: 12.5%;
    }
    .gallery-item-big {
        width: 25%;
    }
}

.gallery-item img {
    border: 0;
    width: 100%;
    max-width: none;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    opacity: 1;
    transform: scale(1.1);
}

.gallery-item:hover img {
    transform: scale(1.0);
    opacity: 0.5;
    transition: transform 3s ease-out;
}

.gallery-item a {
    margin: 0;
    padding: 0;
    line-height: 0;
    display: block;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.gallery-item dt {
    margin: 0;
    padding: 0;
    height: auto;
}

.gallery-icon {
    margin: 0;
    padding: 0;
}

@media (max-width: 1000px) {
    .gallery {
        margin: 3.6em -8px;
    }
    .gallery-sizer {
        width: 33.33%;
    }
    .gallery-item {
        width: 33.33%;
        border: 4px solid var(--bg_1);
    }
    .gallery-item-big {
        width: 66.65%;
        border: 6px solid var(--bg_1);
    }
}

@media (max-width: 700px) {
    .gallery-sizer {
        width: 50%;
    }
    .gallery-item {
        width: 50%;
    }
    .gallery-item-big {
        width: 100%;
    }
}

/*CONTACT INFO*/

.Wechat_QR {
    margin-top: .5em;
    width: 15em;
    height: auto;
}

.copyright {
    color: grey;
    margin: 150px 0 .1em 0;
    padding: .7em;
    text-align: center;
    /* position: absolute; */
    /* bottom: 0; */
    width: 100%;
}

/* PASSWORD PROTECTION FORM  */


@media (max-width: 700px) {
    
    .columns-wrap {
        /* width: 90%; */
        /* margin-top: 3.6em; */
    }
    .column-left {
        width: 100%;
        height: 200px;
        display: inline-block;
        position: relative;
    }
    .column-right {
        display: inline-block;
        width: 100%;
        margin: .14em 0;
        text-align: justify;
        overflow: hidden;
    }
    .social {
        height: 70px;
        white-space: nowrap;
        padding: 0 auto;
        text-align: justify;
    }
    .sl-container {
        text-align: justify;
    }
    #sollist {
        text-align: justify;
    }
    #sollist li {
        margin-left: .36em;
    }
}

/* get touch to behave like hover */

element:hover,
element:active {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-user-select: none;
    -webkit-touch-callout: none/*only to disable context menu on long press*/
}

#home {
    top: 0;
    left: 0;
    position: absolute;
}

#front-page {
    min-height: 21em;
    width: 100%;
    height: 100vh;
    /* max-height: 130vw; */
    overflow: hidden;
    background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(10,10,20,1) 35%, rgba(25,35,45,1) 100%);
    /*border: 1px solid pink;*/
    
}

.maintenance-message {
    position: absolute;
    left: 50%;
    right: 50%;
    bottom: 15%;
    transform: translateX(-50%);
    width: 80%;
    padding: 0;
    margin: -30px 0 0;
    text-align: center;
    height: auto;
    z-index: 5;
}

.front-page_logo-wrap {
    position: absolute;
    left: 50%;
    right: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    padding: 0;
    margin: 0;
    text-align: center;
    height: auto;
    z-index: 5;
}

.front-page_logo {
    position: absolute;
    display: block;
    cursor: url(../images/scroll-cursor.svg), url(../images/scroll-cursor_48.ico), s-resize;
    width: 30em;
    left: 50%;
    top: 50%;
    height: 20em;
    width: 30vw;
    min-width: 20em;
    min-height: 12em;
    max-width: 40em;
    max-height: 25em;
    transform: translate(-50%, -50%) scale(1);
    stroke: none;
    fill: var(--text_main);
    transition: transform 0.3s ease;
}

.front-page_logo:hover {
    transform: translate(-50%, -50%) scale(1.02);
}

#loading .front-page_logo-wrap {
    right: auto;
    margin: 0;
    top: 50%;
    transform: translate(-50%, -50%);
}

#loading .front-page_logo {
    cursor: default;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

#loading .front-page_logo:hover {
    transform: translate(-50%, -50%);
}

#loading .front-page_logo svg {
    pointer-events: none;
}

.front-page_logo_animation {
    fill: none;
  stroke-dasharray: 5000;
  stroke-dashoffset: 5000;
  animation: logo_anim 10s linear forwards;
}

@keyframes logo_anim {

  0% {
    stroke-dashoffset: 5000;
    box-shadow: none;
  }
  30% { 
    stroke-dashoffset: 2500;
    fill: var(--text_main);
    stroke: none;  }
    box-shadow: 0 0 80px 0 rgba(0, 0, 0, 0.4);
  31% {
    stroke-dashoffset: 2500;
    fill: none;
    stroke: none;  }
  32% {
    stroke-dashoffset: 2500;
    fill: none;
    stroke: none;  }
  33% {
    stroke-dashoffset: 2500;
    stroke: none;
    fill: var(--text_main);
  }
  60% {
    fill: var(--text_main);
    stroke: none;
    stroke-dashoffset: 0;
  }
  100% {
    fill: var(--text_main);
    stroke: none;
    stroke-dashoffset: 0;
  }
}

.front-page-scroll-down {
    display: block;
    width: 100%;
    height: 100%;
    transform: rotate(90deg);
}

.scroll {}

.video-slide > img {
    margin: 0;
  }

@media (min-aspect-ratio: 16/9) {
    .video-slide>img {
        height: 100vh;
        width: 100%;
    }
}

@media (max-aspect-ratio: 16/9) {
    .video-slide>img {
        width: 100%;
    }
}

.front-page-title-wrap {
    position: absolute;
    left: 50%;
    right: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    /*border: solid .1em red;*/
    width: 80%;
    padding: 0;
    margin: 0;
    text-align: center;
    height: auto;
}

.front-page-title-wrap>.blog-button {
    text-align: center;
}

.front-page-title-spin {
    width: 100%;
    position: absolute;
    height: 100%;
}

.front-page-title-spin-logo {
    background-color: red;
    width: 200px;
    left: 50%;
    top: -100px;
    height: 25em;
    transform: translateX(-50%);
}

.front-page-title-spin a {
    margin-right: 0;
}

.cls-1 {
    transition: all 0.1s;
}

.front-page-logo img {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.front-page-logo-white {
    display: block;
}

.front-page-logo-black {
    display: none;
}

.front-page-title {
    text-align: center;
    font-size: 4em;
    font-weight: bold;
    color: var(--text_main);
    text-shadow: 0 0 .14em rgba(0, 30, 60, 0.6);
    letter-spacing: .36em;
    text-transform: uppercase;
}

.front-page-subtitle {
    text-align: center;
    font-size: 3em;
    font-weight: normal;
    line-height: .7em;
    color: var(--text_main);
    text-shadow: 0 0 .14em rgba(0, 30, 60, 0.6);
    letter-spacing: .36em;
    text-transform: uppercase;
    margin-bottom: 0;
}

.front-page-title-spin-logo:hover {
}

.front-page-title-spin-logo:hover>.front-page-logo {
}

.button-logo {
    margin-top: 224px;
    display: none;
}

.button-logo a {
    color: var(--bg_1);
    background-color: var(--text_main);
    text-shadow: none;
}


/*SLIDESHOW FRONT-PAGE*/

#slide-wrap {
    position: relative;
    left: 0;
    z-index: 3;
    max-height: inherit;
    transform: translate3d(0, 0, 0);
    will-change: transform;
}

#slide-bg-wrap {
    position: relative;
    left: 0;
    z-index: 1;
    max-height: inherit;
    transform: translate3d(0, 0, 0);
    will-change: transform;
}


.slide {
    height: 100vh;
    /* max-height: 130vw; */
    width: 100%;
    position: absolute;
    top: 0;
}

.slide-bg {
    height: 100vh;
    width: 100%;
    position: absolute;
    top: 0;
    max-height: inherit;
    overflow: hidden;
}

.slide-animation {
    animation: slideanim ease-in-out 15s;
    animation-iteration-count: infinite;
    transform-origin: 50% 50%;
}

@keyframes slideanim {
    0% {
        transform: scaleX(1.0) scaleY(1.0);
    }
    50% {
        transform: scaleX(1.1) scaleY(1.1);
    }
    100% {
        transform: scaleX(1.0) scaleY(1.0);
    }
}

#front-page-ui-wrap {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    /* max-height: 130vw; */
    /*height: 10vh;*/
    /*top: 50%;*/
    /*margin: 4vh 10%;*/
    z-index: 3;
    /*transform-origin: 50% 50%;*/
    /*border: 4px solid green;*/
    pointer-events: none; 
}


.front-page-arrow {
    pointer-events: visible; 
    display: block;
    position: inherit;
    width: 80px;
    height: 120px;
    top: 50%;
    transform: translateY(-50%);
    /*margin: 50% 0%;*/
    z-index: 3;
    /*transform-origin: 50% 50%;*/
}

.front-page-arrow a {
    display: block;
    width: 80px;
    height: 120px;
    background-image: var(--arrow);
    background-repeat: no-repeat;
    background-size: 80px 120px;
    -webkit-filter: drop-shadow( 0 0 10px var(--shadow));
    filter: drop-shadow( 0 0 10px var(--shadow));
}

.front-page-arrow a:hover {
    background-image: var(--arrow);
    background-color: var(--bg_1);
    cursor: pointer;
    box-shadow: 0 0 30px var(--highlight);
}

.front-page-arrow a:active {
    background-image: var(--arrow);
    cursor: pointer;
    background-color: var(--accent);
}

.front-page-arrow-left {
    left: 4%;
    /*margin: 4vh 10%;*/
}

.front-page-arrow-right {
    transform: translateY(-50%) rotate(-180deg);
    right: 4%;
    /*margin: 4vh 90%;*/
}

.front-page-arrowzone {
    position: absolute;
    width: 30%;
    height: 100vh;
    top: 0;
    z-index: 3;
}

.front-page-arrowzone a {
    display: block;
    width: 100%;
    height: 100%;
}

.front-page-arrowzone-left {
    left: 0;
}

.front-page-arrowzone-right {
    right: 0;
}



.gss-info-wide {
    width: 100%;
}

.dot-wrap {
    position: inherit;
    bottom: 10%;
    left: 50%;
    right: 50%;
    height: 0;
    transform: translateX(-50%);
    width: 100%;
    text-align: center;
    z-index: 5;
    display: none;
    white-space: nowrap;
    pointer-events: visible;
}

@media (min-width: 700px) and (max-height: 400px),
(max-height: 400px) {
    .dot-wrap {
        display: none;
    }
    #menu {
        position: fixed;
    }
    #menu-shadow {
        position: absolute;
    }
}

.dot {
    cursor: pointer;
    /* height: 1.5em; */
    width: 1.5em;
    margin: 0 4px;
    border-bottom: .2em solid rgba(0,0,0,.2);
    display: inline-block;
}

.dot:hover, .active {
    /* background-color: var(--text_main); */
    border-bottom: .2em solid var(--text_main);
}

.active {
    /* background-color: var(--text_main); */
}

/*BOTTOM STUFFS*/

#particles-js {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#hello {
    background-color: var(--bg_1);
    position: relative;
    top: 0;
    left: 0;
/*    padding: 15em 0 20em;*/
    z-index: 5;
    border-bottom: 1em solid var(--bg_1);
    height: auto;
}

#aboutus_banner {
    height: 45vw;
    max-height: 65vh; 
    max-width: 1200px;
    width: 80%;
    margin: 0 auto 1vh;
    position: relative;
}

.aboutus_title {
    position: absolute;
    bottom: 0;
    height: 100%;
    font-size: 1.3em;
    width: 100%;
    font-weight: 500;
    align-content: right;
    text-align: right;
    background-size: contain;
    background: var(--aboutus) no-repeat bottom left;
    position: relative;
}

.joinus_title {
    background: var(--joinus) no-repeat bottom left;
}

.hello_title {
    background: var(--hellobloom) no-repeat bottom left;
}

.aboutus_video {
    position: absolute;
    width: 90%;
    bottom: 1px;
    max-width: 96vh;
    left: 0;
}

.joinus_video {
    position: absolute;
    /*width: 100%;*/
    bottom: 0;
    max-width: 99.9%;
    max-height: 65vh;
    left: 0;
    border: solid 1px var(--bg_1);
}

@media (max-width: 1000px) {
    .aboutus_title {
        font-size: 1em;
    }
}

@media (max-width: 700px) {
    .aboutus_title {
        font-size: 1em;
    }
}

.aboutus_title p {
    width: 50%;
    min-width: 20em;
    right: 0;
    bottom: 0;
    position: absolute;
    text-align: right;
    text-shadow: 0 0 5px var(--shadow);
}

#bio {
    display: none;
    background-color: var(--bg_1);
    margin: 30% 0;
    padding: 8% 0;
    height: auto;
}

.bio-title {
    text-align: center;
    font-size: 2em;
    color: var(--text_main);
    text-shadow: 0 0 .14em var(--shadow);
    letter-spacing: .36em;
    text-transform: uppercase;
    padding: 0 0;
    margin: 0;
}

.profile_button {
    color: grey;
    border: .1em solid var(--bg_3);
    display: inline-block;
    width: auto;
    float: right;
    padding: .36em;
    padding-left: .7em;
    text-decoration: none;
    font-size: small;
    text-align: right;
    margin-top: -5px;
    background: url(../images/file_white.svg);
    background-position: right center;
    background-size: auto 80%;
    background-repeat: no-repeat;
    padding-right: 45px;
}

.profile_button:hover {
    color: var(--text_main);
    background-color: grey;
}

.biopic {
    background: no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

#box {
    animation: fontbulger 2s infinite;
    -webkit-animation: fontbulger 2s infinite;
}

.bg {
    background-size: cover;
    width: 100%;
    position: fixed;
    top: 40px;
    height: 110%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background-position: center 60%;
}

.slice {
    background-size: 100% 100%;
    width: 100%;
    height: 20%;
    min-height: 100px;
    margin: 0;
    padding: 0;
}

.slice_bottom {
    position: absolute;
    background-image: url("../images/slice_bottom.png");
    bottom: -1px;
}

.slice_top {
    position: absolute;
    background-image: url("../images/slice_top.png");
    top: -1px;
}

.line-horizontal {
    border-bottom: .1em solid var(--text_main);
}

.separation {
    display: block;
    width: 100%;
    height: 200%;
    margin: 0;
    padding: 0;
}

.black {
    background: var(--bg_1);
}

#vimeoplayer {}

.zero {
    width: 0;
    height: 0;
}

#share_div_pos {
    bottom: 0;
    right: 0;
    position: absolute;
    width: 0;
    height: 0;
}

#share_div {
    display: none;
    background: var(--bg_1);
    right: 0;
    top: 0;
    position: absolute;
    padding: 0 8px 8px;
}

.videoWrapper {
    position: relative;
    padding-bottom: 56.25%;
    /* 16:9 */
    margin: 25px 0;
    height: 0;
    z-index: 10000;
}

.videoWrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 100000;
}

.video_pattern {
    display: block;
    background-image: url(../images/pat1.png);
    filter: invert(var(--invert));
    position: absolute;
    opacity: 0.8;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    z-index: 1;
}

#sollist li {
    margin-left: .7em;
}

.sl-container {
}

.sl-container:after {
    content: "\a";
    white-space: pre;
}

@media (max-width: 700px),
(max-height: 550px) {
    .front-page-logo {
        height: 200px;
        width: 112px;
        clip: rect(1px, 110px, 198px, 1px);
        margin-top: 3.6em;
    }
    #sollist li {
        margin: .36em;
    }
    #sollist ul {
        text-align: justify;
    }
    .front-page-title-wrap {
        text-align: center;
        width: 90%;
        margin: 0;
    }
    .front-page-title {
        text-align: center;
        font-size: 2.4em;
        letter-spacing: 3px;
    }
    .front-page-subtitle {
        text-align: center;
        font-size: 1.6em;
        line-height: .7em;
        letter-spacing: 3px;
        margin-bottom: 0;
    }
    .front-page-arrow {
        width: 3.6em;
        height: 75px;
        margin: 0 5%;
    }
    .front-page-arrow a {
        width: 3.6em;
        height: 75px;
        background-size: 3.6em 75px;
    }
    .dot {
        height: .85em;
        width: .85em;
        margin: 0;
    }

    .blog-post-title-wrap a span {
        font-size: 1.3em;
        letter-spacing: 1px;
    }
    .blog-post-subtitle-wrap a span {
        font-size: 1.3em;
        letter-spacing: 1px;
    }
    .blog-button a {
        display: inline-block;
        padding: 7px .85em .36em;
        margin: .85em 6px 0 0;
        font-size: 1em;
    }
    .button-logo a {
        position: inherit;
        top: -61px;
    }
}

/*SLIDESHOW*/

.slider {
    height: 100%;
    width: 100%;
    position: relative;
    z-index: 1;
}

.slide1,.slide2,.slide3,.slide4,.slide5,.slide6,.slide7,.slide8 {
  position: absolute;
  width: 100%;
  height: 100%;
}

.slide1 {
    background: url(../images/slideshow/slide1.jpg)no-repeat center;
    background-size: cover;
    animation: fade1 15s infinite;
    -webkit-animation: fade1 15s infinite;
}

.slide2 {
    background: url(../images/slideshow/slide2.jpg)no-repeat center;
    background-size: cover;
    animation: fade2 15s infinite;
    -webkit-animation: fade2 15s infinite;
}

.slide3 {
    background: url(../images/slideshow/slide3.jpg)no-repeat center;
    background-size: cover;
    animation: fade3 15s infinite;
    -webkit-animation: fade3 15s infinite;
}

.slide4 {
    background: url(../images/slideshow/slide4.jpg)no-repeat center;
    background-size: cover;
    animation: fade4 15s infinite;
    -webkit-animation: fade4 15s infinite;
}

.slide5 {
    background: url(../images/slideshow/slide5.jpg)no-repeat center;
    background-size: cover;
    animation: fade5 15s infinite;
    -webkit-animation: fade5 15s infinite;
}

.slide6 {
    background: url(../images/slideshow/slide6.jpg)no-repeat center;
    background-size: cover;
    animation: fade6 15s infinite;
    -webkit-animation: fade6 15s infinite;
}

.slide7 {
    background: url(../images/slideshow/slide7.jpg)no-repeat center;
    background-size: cover;
    animation: fade7 15s infinite;
    -webkit-animation: fade7 15s infinite;
}

.slide8 {
    background: url(../images/slideshow/slide8.jpg)no-repeat center;
    background-size: cover;
    animation: fade8 15s infinite;
    -webkit-animation: fade8 15s infinite;
}

@keyframes fade1 {
    0% {
        opacity: 1
    }
    6% {
        opacity: 1
    }
    13% {
        opacity: 0
    }
    94% {
        opacity: 0
    }
    100% {
        opacity: 1
    }
}

@keyframes fade2 {
    0% {
        opacity: 0
    }
    6% {
        opacity: 0
    }
    13% {
        opacity: 1
    }
    19% {
        opacity: 1
    }
    25% {
        opacity: 0
    }
    100% {
        opacity: 0
    }
}

@keyframes fade3 {
    0% {
        opacity: 0
    }
    19% {
        opacity: 0
    }
    25% {
        opacity: 1
    }
    31% {
        opacity: 1
    }
    38% {
        opacity: 0
    }
    100% {
        opacity: 0
    }
}

@keyframes fade4 {
    0% {
        opacity: 0
    }
    31% {
        opacity: 0
    }
    38% {
        opacity: 1
    }
    44% {
        opacity: 1
    }
    50% {
        opacity: 0
    }
    100% {
        opacity: 0
    }
}

@keyframes fade5 {
    0% {
        opacity: 0
    }
    44% {
        opacity: 0
    }
    50% {
        opacity: 1
    }
    56% {
        opacity: 1
    }
    63% {
        opacity: 0
    }
    100% {
        opacity: 0
    }
}

@keyframes fade6 {
    0% {
        opacity: 0
    }
    56% {
        opacity: 0
    }
    63% {
        opacity: 1
    }
    69% {
        opacity: 1
    }
    75% {
        opacity: 0
    }
    100% {
        opacity: 0
    }
}

@keyframes fade7 {
    0% {
        opacity: 0
    }
    69% {
        opacity: 0
    }
    75% {
        opacity: 1
    }
    81% {
        opacity: 1
    }
    88% {
        opacity: 0
    }
    100% {
        opacity: 0
    }
}

@keyframes fade8 {
    0% {
        opacity: 0
    }
    81% {
        opacity: 0
    }
    88% {
        opacity: 1
    }
    94% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}


/*CAROUSEL CLIENTS*/
.carousel-clients-wrap {
    background: var(--text_main);
    width: 100%;
    height: 30vw;
    margin: 0;
}

.carousel-slide {
    display: block;
    position: absolute;
    top: 2vw;
    width: 26vw;
    height: 26vw;
    overflow: hidden;
}

.carousel-slide > img {
    width: 70%;
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}


/*VIDEO BACKGROUND*/

.video-background {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -99;
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(10,10,20,1) 35%, rgba(25,35,45,1) 100%);
}

@media (max-aspect-ratio: 16/9) {
    .video-foreground,
    .video-foreground video {
        position: inherit;
        top: 0;
        width: 500%;
        left: -200%;
        height: 100%;
    }
    .video-foreground-horiz,
    .video-foreground-horiz video {
        position: inherit;
        left: 0;
        height: 500%;
        top: -200%;
        width: 100%;
    }
}

@media (min-aspect-ratio: 16/9) {
    .video-foreground,
    .video-foreground video {
        position: inherit;
        left: 0;
        height: 500%;
        top: -200%;
        width: 100%;
    }
    .video-foreground-horiz,
    .video-foreground-horiz video {
        position: inherit;
        top: 0;
        width: 500%;
        left: -200%;
        height: 100%;
    }    
}

@media all and (min-device-width: 1280px) {
    .video-foreground,
    .video-foreground video {
        display: block;
    }
    .slider, 
    .menu_slider {
        display: none;
    }
}

#vidtop-content {
    top: 0;
    color: var(--text_main);
}

.vid-info {
    position: absolute;
    top: 0;
    right: 0;
    width: 33%;
    background: rgba(0, 0, 0, 0.3);
    color: var(--text_main);
    padding: 1rem;
}

.vid-info h1 {
    font-size: 2rem;
    font-weight: 300;
    margin-top: 0;
    line-height: 1.2;
}

.vid-info a {
    display: block;
    color: var(--text_main);
    text-decoration: none;
    background: rgba(0, 0, 0, 0.5);
    transition: .6s background;
    -webkit-transition: .6s background;
    -moz-transition: .6s background;
    -ms-transition: .6s background;
    -o-transition: .6s background;
    border-bottom: none;
    margin: 1rem auto;
    text-align: center;
}

@media all and (max-width: 600px) {
    .vid-info {
        width: 50%;
        padding: .5rem;
    }
    .vid-info h1 {
        margin-bottom: .2rem;
    }
}

@media all and (max-width: 500px) {
    .vid-info .acronym {
        display: none;
    }
}

@media (max-width: 1280px) {
    .single-post-title {
        font-size: 2em;
        font-weight: 350;
        letter-spacing: 3px;
        white-space: inherit;
    }
    .single-post-subtitle {
        font-size: 1.5em;
        font-weight: 350;
        letter-spacing: 3px;
    }


    /*SHOWCASE TITLE SPLIT*/

    .title_split::before {
        /*content: "\A"; */
        white-space: pre; 
        /*display: none;*/
        line-height: 0;
        height: 0;
        font-size: 0;
    }

    .title_split::after {
        content: "\A"; 
        white-space: pre; 
        /*display: none;*/
        line-height: 0;
        height: 0;
        font-size: 0;
    }

    .title_split {
        line-height: 0;
        height: 0;
        font-size: 0;
        /*display: none;*/
        letter-spacing: 0;
    }

}

@media (max-width: 1000px) {



    .archive-filter {
        font-size: 1.4em;
        letter-spacing: 3px;
        padding: 0 .2em 0 .3em;
        margin: 0 .3em .5em .1em;
    }
    /* #archives_grid_width {
        position: absolute;
        width: 20%;
    }
    .archive-post {
        width: 20%;
    }
    .archive-post-big,
    .archive-post-wide {
        width: 40%;
    }
    .archive-post-huge {
        width: 80%;
    } */
    .archive-post-title {
        font-size: 1.2em;
        letter-spacing: .2em;
        line-height: normal;
    }
    .archive-post-title-squeeze {
        font-size: 1.2em;
        letter-spacing: 0;
        line-height: normal;
    }
    .archive-post-subtitle {
        font-size: .9em;
        letter-spacing: .2em;
        line-height: normal;
    }



    #archives_grid_width {
        width: 33.33%;
    }
    .archive-post {
        width: 33.33%;
    }
    .archive-post-big,
    .archive-post-wide {
        width: 66.66665%;
    }
    .archive-post-huge {
        width: 100%;
    }
    .archive-post-bg-wrap {
        border: 4px solid var(--bg_1);
    }
    .archive-post-title-wrap {
        border: 4px solid var(--bg_1);
    }
    .showcase-project-image {
        display: block;
        position: inherit;
        top: 0;
        width: 100%;
        height: 55vw;
    }
    .showcase-project-image-left {
        left: 0;
    }
    .showcase-project-image-right {
        left: 0;
    }
    .showcase-project-title-wrap {
        position: inherit;
        width: 100%;
        height: 20em;
    }
    .showcase-project-title-wrap-left {
        left: 0;
        text-align: left;
    }
    .showcase-project-title-wrap-right {
        left: 0;
        text-align: left;
    }
    .showcase-project-title-placement {
        top: 30%;
    }
}

@media (min-width: 1500px) {



    .archive-filter {
        font-size: 1.4em;
        letter-spacing: 3px;
        padding: 0 .2em 0 .3em;
        margin: 0 .3em .5em .1em;
    }

    /* #archives_grid_width {
        position: absolute;
        width: 20%;
    }
    .archive-post {
        width: 20%;
    }
    .archive-post-big,
    .archive-post-wide {
        width: 40%;
    }
    .archive-post-huge {
        width: 80%;
    } */
    .archive-post-title {
        font-size: 1.2em;
        letter-spacing: .2em;
        line-height: normal;
    }
    .archive-post-title-squeeze {
        font-size: 1.2em;
        letter-spacing: 0;
        line-height: normal;
    }
    .archive-post-subtitle {
        font-size: .9em;
        letter-spacing: .2em;
        line-height: normal;
    }



    #archives_grid_width {
        width: 12.5%;
    }
    .archive-post {
        width: 12.5%;
    }
    .archive-post-big,
    .archive-post-wide {
        width: 25%;
    }
    .archive-post-huge {
        width: 50%;
    }
    .archive-post-bg-wrap {
        border: 4px solid var(--bg_1);
    }
    .archive-post-title-wrap {
        border: 4px solid var(--bg_1);
    }
    .showcase-project-image {
        display: block;
        position: inherit;
        top: 0;
        width: 100%;
        height: 55vw;
    }
    .showcase-project-image-left {
        left: 0;
    }
    .showcase-project-image-right {
        left: 0;
    }
    .showcase-project-title-wrap {
        position: inherit;
        width: 100%;
        height: 20em;
    }
    .showcase-project-title-wrap-left {
        left: 0;
        text-align: left;
    }
    .showcase-project-title-wrap-right {
        left: 0;
        text-align: left;
    }
    .showcase-project-title-placement {
        top: 30%;
    }
}

@media (max-width: 600px) {
    #archives>ul {
    }
    #archives_grid_width {
        width: 50%;
    }
    .archive-post {
        width: 50%;
    }
    .archive-post-big,
    .archive-post-wide,
    .archive-post-huge {
        width: 100%;
    }
}

/* @media (max-width: 400px) {
    #archives>ul {
    }
    #archives_grid_width {
        width: 100%;
    }
    .archive-post {
        width: 100%;
    }
    .archive-post-big {
        width: 100%;
    }
    .archive-post-wide img {
        width: 100%;
    }
} */

/*MAGNIFIC POPUL TWEAKS*/

.mfp-iframe-holder .mfp-content {
    max-width: 100%;
    max-height: 100%;
}

.mfp-bg {
/*    backdrop-filter: blur(20px);*/
    background: black;
    opacity: 1;
}

button.mfp-close {
    background: var(--almostblack) !important;
    z-index: 5000 !important;
    display: block;
    cursor: pointer;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 999;
/*    transition: border .2s;*/
    width: 8vh;
    height: 8vh;
    max-height: 50px;
    max-width: 50px;
    margin: 2vw;
    opacity: 1 !important;
}

button.mfp-close:hover {
    background: var( --bloompink) !important;
}

/*FORMS*/

.wpforms-container input.wpforms-field-medium, .wpforms-container select.wpforms-field-medium, .wpforms-container .wpforms-field-row.wpforms-field-medium {
     max-width: 100% !important; 
}

div.wpforms-container-full .wpforms-confirmation-container-full, div[submit-success]>.wpforms-confirmation-container-full:not(.wpforms-redirection-message) {
    background: #fff !important;
    border: 1px solid var( --bloompink) !important;
    box-sizing: border-box !important;
}

div.wpforms-container-full .wpforms-confirmation-container-full, div[submit-success]>.wpforms-confirmation-container-full {
    color: var( --bloompink) !important;
    margin: 0 auto 24px;
    padding: 15px;
    overflow-wrap: break-word;
}

div.wpforms-container-full ul li { list-style-type:none !important; }

div.wpforms-container-full input[type=submit]:not(:hover):not(:active), div.wpforms-container-full button[type=submit]:not(:hover):not(:active), div.wpforms-container-full .wpforms-page-button:not(:hover):not(:active) {
    background-color: var(--wpforms-button-background-color);
    color: var(--wpforms-button-text-color);
}


/* STREAM  */

#stream {
    background-color: black;
    width: 100%;
    height: 100vh;
}


/* INPUT ICONS  */
.input-icons {
    width: 100%;
    margin-bottom: 10px;
}

.input-icons i {
    position: absolute;
}

.icon {
    padding: 10px;
    color: var(--midcoolgrey);
    min-width: 50px;
    text-align: center;
}


/* PASSWORD PROTECTION FORM  */

.pass-container {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    height: 100%;
    /* border: 1px solid green; */
}

.pass-logo {
    /* position: absolute; */
    display: block;
    background: var(--front-page_logo) no-repeat center rgba(0, 0, 0, 0);
    /* cursor: url(../images/scroll-cursor.svg), url(../images/scroll-cursor_48.ico), s-resize; */
    width: 30em;
    /* left: 50%; */
    /* top: -100px; */
    height: 20em;
    width: 23em;
    min-width: 20em;
    min-height: 12em;
    max-width: 30em;
    max-height: 25em;
    /* transform: scale(1) translateX(-50%); */
    stroke: none;
    fill: var(--text_main);
}

.protected-post-form {
    /* background-color: var(--midcoolgrey); */
    margin-top: -50px;
}

/* .pass-label { display: none; } */

.pass-message {
    margin: 10px 0;
}

.pass-field {
    width: 100%;
    padding: 10px;
    /* margin: 10px 0; */
    /* border: 2px solid pink; */
    text-align: center;
    border: none;
}

.pass-button {
    width: 100%;
    padding: 10px;
    background-color: var(--midlightcoolgrey);
    border: none;
    /* color: white; */
    cursor: pointer;
    font-family: 'Montserrat', sans-serif;
    font-size: 1.1em;
    font-style: normal;
    font-weight: 300;
}

.pass-button:hover {
    background-color: var(--accent);
    color: white;
}


/* WP ADMIN BAR */

#hiddendiv {
    display: none !important;
}

/* Responsive embeds for YouTube/Vimeo in AJAX overlay */

/* Generic responsive wrapper if JS wraps iframe */
.responsive-embed { position: relative; height: 0; padding-top: 56.25%; overflow: hidden; }
.responsive-embed iframe { position: absolute; top:0; left:0; width:100% !important; height:100% !important; }

/* Make embeds in AJAX overlay span full width like local videos */
#post-loader .ajax-post-banner .wp-block-embed,
#post-loader .ajax-post-banner figure.wp-block-embed,
#post-loader .ajax-post-banner .wp-block-embed .aligncenter,
#post-loader .ajax-post-banner .wp-block-embed__wrapper { max-width: none !important; width: 100% !important; margin-left: 0; margin-right: 0; }

/* Ensure the banner section itself doesn’t constrain width */
#post-loader .ajax-post-banner { width: 100%; max-width: 100%; margin: 0; padding: 0; }

/* Also apply when not in post-loader (future-proof) */
.ajax-post-banner { width: 100%; max-width: 100%; margin: 0; padding: 0; }

/* Force embed figure to stretch */
#post-loader .ajax-post-banner figure.wp-block-embed { display: block; width: 100% !important; }
/* Admin bar: slide-up on hover (desktop only) */
@media (hover: hover) and (pointer: fine) {
  #wpadminbar {
    position: fixed;
    top: auto !important;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 99999;
    transform: translateY(calc(100% - 6px)); /* leave a thin grab area */
    transition: transform 180ms ease-in-out, opacity 180ms ease-in-out;
    opacity: 0.92;
  }
  #wpadminbar:hover {
    transform: translateY(0);
    opacity: 1;
  }
  /* prevent top margin bump on HTML when admin-bar class is present */
  html.admin-bar { margin-top: 0 !important; }
}

/* Reserve space for archive tiles to reduce layout shift (revert by removing this block) */
.archive-post-bg-wrap {
    aspect-ratio: 16 / 9;
}
/* Hover scoping for touch will be applied via targeted rules after validation. Reverted previous override. */
/* Touch optimizations: apply only when body/html has .is-touch (set via JS on first touchstart) */
.is-touch a,
.is-touch button,
.is-touch .post-load,
.is-touch .archive-post-title-wrap,
.is-touch .archive-post-title-wrap a,
.is-touch .blog-post-title-link,
.is-touch .post-close_icon,
.is-touch .front-page-arrow a,
.is-touch .dot,
.is-touch #menu_logo,
.is-touch .menu_icon,
.is-touch .menu_button,
.is-touch #menu_name a,
.is-touch .blog-button a,
.is-touch .popup_vid {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

/* On touch devices, prevent hover-only transforms/filters that can require a second tap */
.is-touch .blog-post-title-wrap a:hover,
.is-touch .blog-button a:hover,
.is-touch #menu_name a:hover,
.is-touch #menu_logo:hover,
.is-touch .front-page-arrow a:hover,
.is-touch .dot:hover,
.is-touch button.mfp-close:hover,
.is-touch .archive-post:hover,
.is-touch .menu_icon:hover,
.is-touch .post-close_icon:hover .menu_bar {
  text-decoration: none;
  filter: none;
  transform: none;
}

/* Archive filter buttons: keep visual state consistent on touch (no hover flip) */
.is-touch .archive-filter:hover,
.is-touch .archive-filter-close:hover {
  background: transparent;
  border-color: var(--text_main);
  color: var(--text_main);
}
.is-touch .archive-filter-selected:hover {
  background: var(--text_main);
  border-color: var(--text_main);
  color: var(--bg_1);
}
/* (Reverted) Keep previous video layout; no global overrides for .fullscreen-bg__video */
