/* ©2024 dotguide.co.uk  v25.005  Yorkshire.guide small stylesheet (max-width 480px - max-device-height 502px) */

/* styles+buttonpics+pictures>midtall>wide>SMALL>smallwide>tablet       SMALL = portrait or landscape, max width 480px     */

phonehide {visibility: hidden;}

body {background-image: url('graphics/background-small.png'); background-size: 100%, 100vw; background-attachment: fixed; background-position: left top;}

body#scrollwide {background-image: url('graphics/background-small.png'); background-size: cover; background-attachment: fixed; background-position: left top;}

body#noscroll {background-image: url('graphics/background-small.png'); background-size: 100%, 100vw; background-attachment: fixed; background-position: left top;}

div#header {background-size: 50%; background-repeat: no-repeat;}

div#content {top: 110px;  bottom: 30px; right: 10px; left: 10px;}

div#text {top: 110px;  left: 10px; right: 10px; bottom: 30px; padding: 0px 24px 5px 10px; font-size: 2.5em; }

h2 {font-size: 1em;}
notice h2 {font-size: 1em;}

div#bar {bottom: 6px; height: 20px; font-size: 0pt; font-weight: normal; }

#bigmap {top: 110px; left: 10px; right: 10px; bottom: 30px;}


iframe.webcam {height: 520px; width: 92vw; left: 6px;}

/* images */

img.blob{position: relative; top: 2px; margin: 0px 4px 0px 0px; max-width: 30px; max-height: 30px;}

img.right{margin: 0px 1px 2px 0px; max-width: 80vw;}


/* updates midtall */

a.link650 {display: inline-block; float: right; color: #999999; text-decoration: none; background: transparent; width: 80vw; max-width: 80vw; border-width: 0px; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 6px;}

img650 {display: inline-block; position: relative; float: right; right: -9px; width: 80vw; max-width: 80vw; height: 394px; margin: 0px 2px 16px 30px; background-position: center; z-index: 10;}       /* image container div new version of above - Used for all img650 except below - see also a.pic */ 

video650 {display: inline-block; position: relative; float: right; right: -9px; width: 80vw; max-width: 80vw; height: 394px; margin: 0px 2px 16px 30px; background-position: center; z-index: 10;}

/* ---- */

/* text */

h2 {font-size: 18pt;}

notice h2 {font-size: 18pt;}

/* Basic buttons */

a.button {}

post a.button {}

notice a.button {font-size: 22pt; height: 26px; min-width: 66vw;}

section a.button {font-size: 22pt; height: 26px; min-width: 66vw;}

subsection a.button {font-size: 22pt; height: 26px; min-width: 66vw;}

a.shortbutton {font-size: 22pt; height: 26px; min-width: 66vw;}

a.mappopbutton {font-size: 22pt; height: 26px; min-width: 66vw;}

a.mapbutton {font-size: 22pt; height: 26px; min-width: 66vw;}

a.extbutton {font-size: 22pt; height: 26px; min-width: 66vw;}

/* menu button */
a#menu {width: 100px; height: 86px; right: 10px; background-size: 90%; padding: 0px 0px 0px 0px;} 
a#menu:hover {background-size: 50%; background-color: transparent; }
a#menu:active {background-size: 50%; background-color: transparent;}

/* menu button */
a#menubut {width: 100px; height: 80px; right: 10px; background-size: 90%; padding: 0px 0px 0px 0px;} 
a#menubut:hover {background-size: 50%; background-color: transparent; }
a#menubut:active {background-size: 50%; background-color: transparent;}

/* Home button ----------------------------- */
a#home {position: fixed; z-index: 5; height: 80px; top: 10px; left: 62%; width: 100px; background-image: url('buttonpics/york.jpg'); background-position: center 30px;  background-size: cover; border-radius: 20px 20%; box-shadow: 5px 5px 5px black; -webkit-box-shadow: 5px 5px 5px black;}
a#home:before {display: block; position : static; top: 10px; text-align: left; font-size: 2em; content:"Home";}
a#home:after {content:""; }
a#home:hover {background: chartreuse url('buttonpics/york.jpg') no-repeat center 30px; background-size: cover;  }

/* Go back button */
a.mapback {top: 8px; right: 10px; vertical-align: middle; background-image: none; color: darkblue; background-color: rgba(230, 230, 255, 0.6); height: 24px; font-size: 18pt; padding: 0px 0px 4px 4px; margin: 0px 4px 12px 0px; border: solid 1px darkblue; text-decoration: none; width: 100px; border-radius: 4px; box-shadow: 5px 5px 5px black; -webkit-box-shadow: 5px 5px 5px black; }