@charset "UTF-8";
/* CSS Responsive 2 March 2021 */
* { 
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); /*disable hideous Android blue hightlight*/
}
/* Rules for mobile devices*/
@media only screen and (max-width: 1024px) {

body {
        margin-left: 0;
        margin-right: 0;
        margin-top: 0;
        margin-bottom: 0;
        -webkit-text-size-adjust: none;
    }
    
    body, p, li, td, label, input, textarea, .contents li, .contents p, .data-l, .data-c {
    //	font-size: x-large;
        font-size: medium;
    }
    h1 {
    //	font-size: 1.9em;
        font-size: xx-large;
    }
    h2 {
    //	font-size: 1.5em;
        font-size: xx-large;
        padding: 1em 0;
    }
    h3 {
    //	font-size: xx-large;
        font-size: x-large;
        padding: 1em 0;
    }
    h4, h5, h5 a.anchor, h4 a.anchor {
    //	font-size: x-large;	
        font-size: large;
    }
    
    td.caption, p.caption, p.caption2, p.attribution, .lb-data .lb-caption, .lb-data .lb-title {
    //	font-size: large;
        font-size: small;
        text-decoration: none;
    }  
    #pallogo, #palbanner, nav, .bottom img, a.discl, .footer:nth-child(-n+3), td.bottom table td:first-child, td.bottom table td:last-child {
    /*#pallogo, #palbanner, .bottom, nav {*/
        display: none;
    }
    td.bottom {
        //border: 3px solid magenta;
        //display: block;
        min-height: 20px;
        //position: absolute;
    }  
    .footer {
        margin: 8px 0;
    }
    #social {
        margin: 10px auto;
    }
    #social label {
        color: #ccc;
    }
    a.navigation .fa {  
        padding: 8px;
        margin: 0 5px;    
        position: relative;
        min-width: 18px;
        min-height: 18px;    
        text-align: center;
        border-radius: 5px;
        color: white; 
        text-shadow: 0px 0px 2px rgba(0,0,0,0.5);
        bottom: 0px;
    }
    .footer a#youtube .fa {
        background-color: #ff0000;
    }
    .footer a#facebook .fa {
        background-color: #4267B2;
    }
    .footer a#instagram .fa {
        background: #8134AF; 
        background: -moz-linear-gradient(210deg, #515BD4 5%, #8134AF 25%, #DD2A7B 50%, #F58529 85%, #FEDA77 100%); 
        background: -webkit-linear-gradient(210deg, #515BD4 5%, #8134AF 25%, #DD2A7B 50%, #F58529 85%, #FEDA77 100%); 
        background: linear-gradient(210deg, #515BD4 5%, #8134AF 25%, #DD2A7B 50%, #F58529 85%, #FEDA77 100%);
    }    
    .footer a#shopify .fa {
        background-color: #F6921E;
    }
    .footer a#tripadvisor .fa {
        background-color: #34E0A1;
        padding: 8px 5px;
    }
    .footer a#yelp .fa {
        background-color: #D32323;
    }
    .footer a#vtour .fa {
        background-color: #2A7791;
        padding: 8px 7px 8px 9px;
    }
    .footer a#google .fa {
        //background-image: conic-gradient(#4285F4 0deg, #4285F4 90deg, #DB4437 90deg, #DB4437 180deg, #F4B400 180deg, #F4B400 270deg, #0F9D58 270deg);
          background-image: conic-gradient(#F4B400 0deg, #F4B400 90deg, #0F9D58 90deg, #0F9D58 180deg, #4285F4 180deg, #4285F4 270deg, #DB4437 270deg);
        //background-color: #2A7791;
        //padding: 8px 7px 8px 9px;
    }    
        
    td.left {
        width: 0;
        max-width: 0;
        min-width: 0;
        padding-top: 0; 
        padding-left: 0;
        padding-right: 0;
        padding-bottom: 0;
        margin:0;
        background-color: transparent;
    }    
    .top, #paldome img {
        height: 60px;
    }
    .top {
        position: -webkit-sticky;
        position: sticky;
        top: 0; 
        z-index:7;  /* was 2*/     
    }
    #menuicon,#closemenu {
        position:absolute;
        top: 20px;
        display: block;
        font-family:  FontAwesome;
        color: #ccc;
        font-size: 1.8em;
        text-decoration: none;
    //	line-height: 1.5em;
    } 
    #menuicon{
         left: 20px;       
    }    
    #menuicon:after{ 
        content:"P  A  L  O  M  A  R     O  B  S  E  R  V  A  T  O  R  Y";
        font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
        white-space: pre;
        font-weight: 100;
        font-size: 0.7em;
        position: absolute;
        width: 93vw;
    //	border: 1px green solid;
    //	line-height:1.2em;
        text-align:center;
    }
    #closemenu {
        right: 30px;
    }    
    nav {    
            display: block;
            height: 100%;
            width: 0px;
            position: fixed;
            z-index: 10; /* was 5 */
            top: 0;
            left: 0;
            background-color: #7587AD;
            overflow-x: hidden;
            transition: 0.7s;
            padding: 0;
            padding-top: 20px;
            //padding-bottom: 60px;
            text-align: left; 
        }    
    nav > ul {
        padding-left: 30px;
        padding-bottom: 40px;
        padding-right: 10px;
    }
    nav > ul ul {
        padding-left: 15px;
    }    
    li.submenu, a.submenu, p.submenu, li.submenuex, a.submenuex, p.submenuex, li.menu, a.menu, p.menu, li a.submenu, p.submenu, li a.menuex, p.menuex, li a.submenuex {
        font-size: medium;
        text-decoration: none;
    }
    
    hr.short {
    //	margin-left: 40vw;
        margin-right: 100px;
    }    
    .chev:hover:after, nav .chev:hover:after {
        color: inherit;
    } 
    nav .chev:after {
       font-size: 20px;
       z-index: 11;    /* was 6 */
       padding: 0.9em;     
       margin: -0.9em;
       padding-left: 1.3em;
    }
    
    #mobileleft {
        display:block;
        background-color: #7587AD;
        max-width: 100%;
        margin: 2em auto;
        padding: 1em;
        text-align: center;
    }
    a.menuex {   /* External left menu items (eg. Observer Login brings up an icon on hover) */
        color: #333;
        font-style: normal;
    }
    a.menuex:after, a.submenuex:after {
       content: url(/palomar/stylesnscripts/lightbox/img/menuex.png);
       padding-left:4px;
    }
    a:active.menu, a:focus.menu, a:active.menuex, a:focus.menuex, a:active.submenu, a:focus.submenu, a:active.submenuex, a:focus.submenuex {
        color: white;
    }   
       
    #goup {
        display: none;
        width: 30px;
        height: 30px;
        position: fixed;
        bottom: 90px;
        right: 20px;
        z-index: 2;
        border: none;
        outline: none;
        background-color:#697CAD;
        cursor: pointer;
        padding: 0;
        margin: 0;
        border-radius: 15px;
        -webkit-border-radius: 15px;
        -moz-border-radius: 15px;
        text-align: center;
    }
    #goup:after {
        font-family: FontAwesome;
        content:"\f062";
        font-weight: 400;
        font-size: large;
        color: white;
        line-height: 1.7;
    }
       
        
    td.content, td.attribution {
        padding-left: 2.5em;
        padding-right: 2.5em;
    }
    
    .floatright, .floatleft {
        float: none;
        margin: 0 auto;
    }
    
    .short, .contents, .thumbnail, .narrow, .cover, .full {
        margin: 2em auto;	
    }
    .thumbnail, .narrow {
        max-width: 500px;
    }
    .contents, .data-c, .data-l, .short-c {    
        max-width: 440px; /*500px-60px*/
        width: 440px;
        min-width: 440px;
    }
    .contents.full {
        max-width: 100%;
        width:auto;
        min-width:auto;    
    }
    .chev:after {
       font-size: large;
     }
    .thumbnail img, .narrow img {
        width: 500px;
        height: auto;
    }
    .cover, .full {
        max-width: 100%;
    }
    /*.thumbnail iframe {
    //	width: 500px;
    //    height:280px;   
    //}
    //.cover iframe, .full iframe { 
    //   width: 100%; 
    //    max-height: auto; 
    //}*/
    .cover img, .full img {
        width: 100%;
    }
    
    .gallerynew {
        text-align: center;
    }
    .gallerynew .thumbnail {
     //   max-width: 31%;
        text-align: left;
    }
    #wrap, .scroll, .tablescroller {
        overflow-x:auto;    
        width: auto;
        max-width: calc(96vw - 60px);
        -webkit-overflow-scrolling: touch;
    }
    .stackimg br {
        display: none;
    }    
    .hideformobiles {
        display: none;
    }
    .tablescroller .data-c, .tablescroller .data-l {
    //    max-width: 816px;
    //    width: 816px;
    //    max-width: 100%;
        max-width: calc(100vw - 60px);
        width: auto;
        min-width: 816px;
        margin-top: 8px;
    }
    .scroll #pdf {
        max-width: calc(100vw - 41px); 
        height:calc((100vw - 41px) * 1.25);
    }

}


@media only screen and (max-width: 900px) {
    .tablescroller:before {
        content:"Scroll table  >>>";
        color: #666;
        font-style:italic;
        font-size: small;
        margin-top: 30px;
     }
     ol .scroll, ol .tablescroller, ul .scroll, ul .tablescroller {
    //    border: 1px solid red;
        margin-left: -40px;   
    }
}
    
@media only screen and (max-width: 750px) {
     .gallerynew .thumbnail {
        max-width: 22%;
        min-height: 132px;
        word-wrap: break-word; /* old name */
    //    overflow-wrap: break-word;
    } 
        #social span:last-child {
            display:none;
        }
    }
@media only screen and (max-width: 590px) {
    #social {
        border-spacing: 10px 0px;
    } 
    #social label {
//        font-size: 9pt;
    } 
}
    @media only screen and (max-width: 550px) {
    td.content, td.attribution {
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 20px;
        vertical-align: top;
    }  
    
    h1,h2 {
        font-size:1.8em;
    }  
    .thumbnail, .narrow {
        max-width: 90%;
    }
    .contents, .short-c {
        max-width: calc(90% - 60px);
        width: calc(90% - 60px);
        min-width: calc(90% - 60px);
    }
    
    .data-c, .data-l, .short-c {
        min-width: 260px;
    }
    .data-c, .data-l {
     //   width: calc(100% - 30px);
     //   max-width: calc(100% - 30px);
        width: 100%;
        max-width: 100%;
    }
    
    .thumbnail img, .narrow img {
        width: 100%;
    }
    .cover, .full {
        max-width: 100%;
    }
    /*.thumbnail iframe {
    //	width: 80%;
    //   height:42%;    
    //}*/
    .full .tour {
        width:100%;
    }
    .gallerynew .thumbnail {
        max-width: 45%;
        min-height: 140px;
    }
    .scroller{
        max-width: 100%;
    } 
    .tablescroller, .scroll, #wrap {
        max-width: calc(100vw - 41px);
    }
    .top, #paldome img {
        height: 50px;
    }
    #menuicon{
         top: 10px; 
    }
    #menuicon:after{
        content: "PALOMAR OBSERVATORY";
        font-size: medium;
        width: 80vw;
        top: 5px;
    }

    #social {
        border-spacing: 5px 0px;
    } 
    #social label {
        font-size: 9pt;
    } 
    
}
@media only screen and (max-width: 425px) {

    #social, #social span {
        border-spacing: 0px 0px;    
    } 
    a.navigation .fa {
        margin: 0 3.5vw;    
    } 
    #social label {
        display:none;
    }
}
@media only screen and (max-width: 400px) {

    .gallerynew .thumbnail {
        max-width: 90%;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }
}