/*css file for mobile website*/ @media all and (max-width: 50em) { .my-breakpoint .ui-block-a, .my-breakpoint .ui-block-b, .my-breakpoint .ui-block-c, .my-breakpoint .ui-block-d, .my-breakpoint .ui-block-e { width: 100%; float:none; } } .banner img{ display:block; width: 100%; height: auto; margin-left: auto; margin-right: auto } /* for the calendar */ .responsive-iframe-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; } .responsive-iframe-container iframe, .vresponsive-iframe-container object, .vresponsive-iframe-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } td.emergency { height:2em; } /* set a width for wide screens */ .collapsible { max-width:900px; } /* needed for the photo gallery display*/ .galleria{ width: 100%; max-width:900px; height: 400px; background: #333 } /* to center the content on wide screen pc or laptop */ @media only screen and (min-width: 1025px){ .ui-page{ width: 960px !important; margin: 0 auto !important; position: relative !important; /*border-right: 3px rgb(93, 105, 105) outset !important; border-left: 3px rgb(93, 105, 105) outset !important;*/ } .ui-footer { max-width: 960px !important; margin: 0 auto !important; } } /* kludge class to fix no-wrap bug in jqm for listviews...*/ li > p { white-space: normal !important; } /*set the bg color for popups*/ div.ui-header.ui-bar-inherit { background-color: rgba(245, 245, 245, 0.6);} /*set the global font*/ * {font-family: 'Open Sans' !important;} /* special font for firm name -- link has to appear in to google fonts...*/ .firm {font-family: 'Yanone Kaffeesatz', sans-serif;} .firm {font-family: 'EB Garamond', serif !important;} .header, .firm {font-family: 'IM Fell French Canon SC', serif !important;} .firm{font-size:1.2em; font-weight:bold;} .ui-header .ui-title { margin-right: 10%; margin-left: 10%; } /*panel background color*/ div#index_nav-panel{ background-color: rgba(91, 95, 97, 0.1) !important; } /*panel stays open on desktops*/ @media (min-width:35em) { /* wrap on wide viewports once open */ .ui-panel-page-content-open.ui-panel-page-content-position-left { margin-right: 17em; } .ui-panel-page-content-open.ui-panel-page-content-position-right { margin-left: 17em; } .ui-panel-page-content-open { width: auto; } /* disable "dismiss" on wide viewports */ .ui-panel-dismiss { display: none; } /* same as the above but for panels with display mode "push" only */ .ui-panel-page-content-open.ui-panel-page-content-position-left.ui-panel-page-content-display-push { margin-right: 17em; } .ui-panel-page-content-open.ui-panel-page-content-position-right.ui-panel-page-content-display-push { margin-left: 17em; } .ui-panel-page-content-open.ui-panel-page-content-display-push { width: auto; } .ui-panel-dismiss-display-push { display: none; } div.footer { text-align: center; letter-spacing: .2em; font-size: 1em; } } /* #### target mobile devices with max device width 480px #### */ @media screen and (max-device-width: 480px){ div.footer { font-size: .75em; } div.footer a.ui-btn { margin-top: 0.1em !important; } } div.footer { text-align: center; /* font-size: .75em; */} .footer-text{ color: #999; margin-left:-8px; } /*popup dialog background color*/ div#popupSocialMedia, div#popupDialog { background-color: rgb(237,237,237); } div#popupDialog .ui-content { height: 50%; } div.ui-content { background-color: #f9f9f9 !important;} .ui-overlay-a, .ui-page-theme-a, .ui-page-theme-a { background-color: rgb(10, 10, 10) !important; background: #d2b48c; /* old browsers */ background: -webkit-linear-gradient(#efefef,#000000) fixed; /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(#efefef,#000000) fixed; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ } @media (min-width: 60em) { .jqm-demos .jqm-header h2 { padding: 1em 0 .7em; margin: 0 1em 0 3%; text-align: left; } .jqm-demos .jqm-header h2 img { width: 275px; height: 78px; } .jqm-demos .jqm-header p { bottom: auto; left: auto; top: 50%; right: 15%; font-size: 1.2em; margin-top: -.625em; } .jqm-demos .jqm-navmenu-link { display: none; } .jqm-demos .jqm-search-link { right: 3%; } .jqm-demos .jqm-footer p { float: right; margin: 1.5em 3% 1.5em 1.5em; } .jqm-demos .jqm-footer p:first-child { float: left; margin: 1.25em 1.25em 1.25em 3%; } .jqm-demos .jqm-navmenu-panel { visibility: visible; position: relative; left: 0; clip: initial; float: left; width: 25%; background: none; -webkit-transition: none !important; -moz-transition: none !important; transition: none !important; -webkit-transform: none !important; -moz-transform: none !important; transform: none !important; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .jqm-navmenu-panel .ui-panel-inner { margin-top: 3em; margin-bottom: 3em; } .jqm-navmenu-panel .ui-listview .ui-btn { padding-left: 12.5%; text-shadow: none !important; } .jqm-navmenu-panel .ui-listview .ui-listview .ui-btn { padding-left: 15%; } .jqm-navmenu-panel .ui-collapsible, .jqm-navmenu-panel .ui-collapsible-content, .jqm-navmenu-panel .ui-btn { background: none !important; border-color: #ddd !important; } .jqm-navmenu-panel .ui-btn.ui-btn-active { color: #3388cc !important; } .jqm-navmenu-panel .ui-btn::after { opacity: 0; -webkit-transition: opacity 500ms ease; -moz-transition: opacity 500ms ease; transition: opacity 500ms ease; } .jqm-navmenu-panel .ui-btn:hover::after { opacity: .6; } .jqm-search-panel { width: 26em; right: -26em; z-index: 1003; /* Puts the panel on top of the dismiss modal which is not adjusted to custom width */ } .jqm-search-panel.ui-panel-animate.ui-panel-position-right { -webkit-transform: translate3d(26em,0,0); -moz-transform: translate3d(26em,0,0); transform: translate3d(26em,0,0); } .ui-panel-dismiss-open.ui-panel-dismiss-position-right { left: -17em; right: 17em; } } .shadow { -moz-box-shadow: 0 0 10px 5px #ddd; -webkit-box-shadow: 0 0 10px 5px #ddd; }