@import url('https://fonts.cdnfonts.com/css/herculanum-lt-pro');
@import url('https://fonts.googleapis.com/css2?family=Ropa+Sans:ital@0;1&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oleo+Script&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Shadows+Into+Light&display=swap');
/*@import url(https://db.onlinewebfonts.com/c/a0e1b1883c0cf520e9c50d0cd91cd0d0?family=Papyrus+W01);*/


.theme-orange {

    --bgimg: url(oybg.jpg);
    --bg: #FFB964;
    --tpimg: url(tmnu.png);
    --mnubg:#431C01;
    --mnuhvr:#4D2000;
    --mnubg-off:#CD2E35;
    --title:#8D3C01;
    --subhead: #CD2E35;
    --stitle:#CE060B;
    --ftr:#AC4900;
    --lst1bg:#FCEED4;
    --themebg:#8D3C01;
    --mnuclr:#DCF3FB;
    --fmname:#000C15;
    --fmvalue:#4D2000;
    --ctitle:#672C01;
    --hoctitle:#AC1903;
}

.theme-blue {

    --bgimg: url(blbg.jpg);
    --bg: #41BCEB;
    --tpimg: url(bmnu.png);
    --mnubg:#0384B6;
    --mnuhvr:#0591C7;
    --mnubg-off:#07509A;
    --title: #3B408C;
    --subhead: #CD2E35;
    --stitle: #CB0E6B;
    --ftr:#047DAB;
    --lst1bg:#D4F1FC;
    --themebg:#0384B6;
    --mnuclr:#DCF3FB;
    --fmname:#000C15;
    --fmvalue:#250481;
    --ctitle:#160052;
    --hoctitle:#250481;
}
.theme-gray {

    --bgimg: url(gybg.jpg);
    --bg: #F0F0F0;
    --tpimg: url(gmnu.png);
    --mnubg:#0384B6;
    --mnuhvr:#0591C7;
    --mnubg-off:#07509A;
    --title: #3B408C;
    --subhead: #CD2E35;
    --stitle: #CB0E6B;
    --ftr:#047DAB;
    --lst1bg:#D4F1FC;
    --themebg:#0384B6;
    --mnuclr:#DCF3FB;
    --fmname:#000C15;
    --fmvalue:#250481;
    --ctitle:#160052;
    --hoctitle:#250481;
}
body{margin:0px;padding:0px;font-family:Ropa Sans,sans-serif;background-image:var(--bgimg);background-color:var(--bg);background-repeat: repeat-x;}

.title{font-family: "Herculanum LT Pro", serif;font-size:27px;color:var(--title);font-weight:bold;letter-spacing:1px;padding-bottom:2px;margin-top:0px;}
.shead{font-family: "Herculanum LT Pro", serif;font-size:27px;color:var(--subhead);font-weight:bold;letter-spacing:1px;padding-bottom:2px;margin-top:0px;}
.stitle{font-family: "Oleo Script", serif;font-size:21px;color:var(--stitle);letter-spacing:1px;padding-bottom:2px;margin:30px 0px 30px 0px;}
.ititle{font-family: "Oleo Script", serif;font-size:18px;color:var(--stitle);letter-spacing:1px;padding-bottom:2px;margin:30px 0px 30px 0px;}
.njdetails{font-family:"Shadows Into Light",serif;font-size:18px;margin-top:20px;font-style: italic;color: #542400;text-align:left;word-spacing:5px;letter-spacing:2px;}
.jimgdetails{font-family:"Ropa Sans",serif;font-size:16px;margin-top:20px;color:#542400;font-weight:bold;text-align:center;letter-spacing:1px;}

.fmtitle{font-family:"Shadows Into Light",serif;font-size:21px;font-style: italic;color:var(--fmname);text-align:left;word-spacing:5px;letter-spacing:2px;}
.fmname{font-family:"Shadows Into Light",serif;font-size:18px;font-style: italic;color:var(--fmname);text-align:left;word-spacing:5px;letter-spacing:2px;}
.fmvalue{font-family:"Shadows Into Light",serif;font-size:18px;font-style: italic;color:var(--fmvalue);text-align:left;word-spacing:5px;letter-spacing:2px;}


@keyframes slideInLeft { 0% { transform: translateX(-100px); } 100% { transform: translateX(0); }  }
@keyframes fadeInUp {0% { transform: translateY(50px); opacity: 0; }100% { transform: translateY(0%);opacity: 1; } }
@keyframes drop-in { from {opacity: 0;transform: translateY(-50px); } to {opacity: 1;transform: translate(0px); }  }
@keyframes slideInFromLeft { 0% {transform: translateX(-100px);} 100% {transform: translateX(0);} }
@keyframes slideInFromRight { 0% {transform: translate(50px);} 100% {transform: translateY(0);} }

.drop-in {animation: drop-in 1s ease 200ms backwards; }   
.drop-in-2 {animation: drop-in 1200ms ease 500ms backwards; }
.fadeInUp{animation: 1.5s fadeInUp; }
.slideInLeft{animation: 1s ease-out 0s 1 slideInLeft;}
.slideInFromLeft{animation: 1s ease-out 0s 1 slideInLeft;}
.slideInFromRight{animation: 1s ease-out 0s 1 slideInFromRight;}

.hcntr{display:fixed;position:sticky;top:0;left:0;width:100%;height:75px;z-index:155;border:0px  solid red;justify-content:left;align-items:left;background-image:var(--tpimg);background-repeat: repeat-x;text-align:left;}


.pimg{vertical-align:center;border:15px  solid #FFFFFF;width:350px;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); }
.mimg{vertical-align:center;border:0px  solid green;cursor:pointer;}
.himg{vertical-align:center;border:0px  solid green; }
.fctop{font-family:"Ropa Sans",serif;font-size:18px;font-weight:normal;margin-top:100px;margin-bottom:20px;color:var(--ftr);text-align:right;margin-right:20px;}


.mdmenu2{width:350px;position:sticky;display:fixed;top:0;left:0; z-index:115;border:0px solid #FFFFFF;border-bottom:0px solid #FFFFFF;padding:0px;margin:0px;}
.mdmenu{width:0px;display:none;z-index:10000;border:0px solid #5A5AF2;}

.mobMenu {
        width:100%; position:absolute;     
        background:var(--mnubg);    
        z-index:115;
        filter: alpha(opacity=90);  
        -moz-opacity: 0.9; 
        opacity: 0.9;
}
 .mobhd:active,.mobhd:visited,.mobhd:Link{    
    display:block;   
    font-size: 18px;  
    color: #FFFFFF;
    padding:12px 12px 12px 25px;
    font-family: "Shadows Into Light", serif;letter-spacing:1px;
    text-decoration: none;   
    text-align: left;
    border-bottom:1px solid var(--bg);;
}

.mobhd:hover {
    background-color:var(--mnuhvr);color:#F02904;
}   
.mobmnu:active,.mobmnu:visited,.mobmnu:Link{    
    display:block;   
    font-size: 16px;  
    color: #FFFFFF;
    padding:12px 12px 12px 55px;
    font-family: "Shadows Into Light", serif;letter-spacing:1px;
    text-decoration: none;   
    text-align: left;
    border-bottom:1px solid var(--bg);
}

.mobmnu:hover {
    background-color:var(--mnuhvr);color:#F02904;
}

.ctitle{font-size:21px;color:var(--ctitle);font-weight:bold;font-family: "Shadows Into Light", serif;letter-spacing:1px;line-height:1.2em;text-decoration: none;}
.ctitle:hover,.ctitle:active {font-size:21px;color:var(--hoctitle);font-weight:bold;font-family: "Shadows Into Light", serif;letter-spacing:1px;line-height:1.2em;text-decoration: none;}


.textbox{ font-size:16px;color:var(--mnubg); border: 1px solid var(--themebg);padding:7px;border-radius:4px;background-color:var(--lst1bg);}
.selecttbox{ font-size:15px;color:var(--mnubg); border: 1px solid var(--themebg);padding:7px 1px 7px 1px;border-radius:4px;background-color:var(--lst1bg);}
.button{ font-size:16px;color:var(--mnuclr);font-family: "Shadows Into Light", serif;letter-spacing:1px;border: 0px solid #DADEE4;border-bottom:5px solid var(--mnubg);background-color:var(--mnubg-off);border-radius: 5px 5px 5px 5px;padding:4px;margin:2px;padding-left:15px;padding-right:15px;cursor:pointer;letter-spacing:1px;text-decoration:none;}
.button:hover{ color:var(--mnuclr);font-family: "Shadows Into Light", serif;letter-spacing:1px;border-bottom:5px solid var(--mnubg-off);background-color:var(--mnubg);}

.nmctop{width:500px;font-family: "Shadows Into Light", serif;font-size:22px;font-weight:normal;margin-top:30px;color: #4C2101;text-align:justify;word-spacing: 10px;letter-spacing:1px;}

.cimg{vertical-align:center;border:10px  solid #FFFFFF;height:350px;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); }
.cdimg{vertical-align:center;border:5px  solid #FFFFFF;height:150px;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); }
.climg{vertical-align:center;border:5px  solid #FFFFFF;height:250px;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);}

.dimg{vertical-align:center;border:10px  solid #FFFFFF;width:500px;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); }
.smlimg{vertical-align:center;border:2px solid #FFFFFF;height:50px;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);margin-right:15px;cursor:pointer; }

.dmDetails{float:left;position:relative;width:100%;border:0px solid blue;}
.dmDetails .dmDleft{ float:left;position:relative;width:550px;border:0px solid red;text-align:left;padding-top:10px;padding-right:15px;}
.dmDetails .dmDright{float:left;position:relative;max-width:400px;padding:5px;padding-bottom:0px;border:0px solid green;margin-bottom:5px;}
.dmDleft .dmDbottom{ float:left;position:relative;width:550px;border:0px solid red;text-align:left;margin-top:20px;margin-bottom:20px;}



.quickList{display:block;float:left;position:relative;height:150px;border:0px solid blue;margin:20px 25px 15px 0px;}
.quickbottom{ width:100%;height:75px;border:0px solid red;text-align:center;padding-top:10px;}
.quickTop{display:block;position:relative;height:150px;padding:0px;padding-bottom:0px;border:0px solid #CF1914;margin-bottom:5px;}

.clAddList{float:left;position:relative;min-width:150px;height:300px;border:0px solid blue;margin:20px 75px 15px 0px;}
.clAddbottom{ width:100%;height:100px;border:0px solid red;text-align:center;padding-top:10px;}
.clAddTop{display:block;position:relative;min-width:150px;padding:0px;padding-bottom:0px;border:0px solid #CF1914;margin-bottom:5px;}

.dmAddList{float:left;position:relative;min-width:150px;height:500px;border:0px solid blue;margin:20px 75px 15px 0px;}
.dmAddbottom{ width:100%;height:150px;border:0px solid red;text-align:center;padding-top:10px;}
.dmAddTop{display:block;position:relative;min-width:150px;padding:0px;padding-bottom:0px;border:0px solid #CF1914;margin-bottom:5px;}


.smlnml{font-size:18px;color:#000000;font-weight:normal;font-family: "Shadows Into Light", serif;letter-spacing:1px;line-height:1.2em;}
.smlnml2{font-size:18px;color:#000000;font-weight:normal;font-family: "Shadows Into Light", serif;letter-spacing:1px;line-height:1.2em;}
.smlnml3{font-size:21px;color:#000000;font-weight:bold;font-family: "Shadows Into Light", serif;letter-spacing:1px;line-height:1.2em;}
.smlnmlred{font-size:21px;color:var(--subhead);font-weight:bold;font-family: "Shadows Into Light", serif;letter-spacing:1px;line-height:1.2em;}
.error{font-size:16px;color:var(--subhead);font-weight:bold;font-family: "Shadows Into Light", serif;letter-spacing:1px;line-height:1.2em;}

div.pagination {float:left;position:relative;width:100%;margin-top:50px;}
div.pagination .plink {float:left;display:block;padding:10px 10px 5px 10px;width:25px;height:25px;text-decoration:none;font:16px Verdana;color:var(--title);text-transform:uppercase;background-color:#FFFFFF;margin-left:5px;text-align:center;border-radius:10px;}
div.pagination .plink:hover, div.pagination .plink:active {font:14px Verdana;color:#FFFFFF;background-color:var(--themebg);}

div.pagination .current {float:left;display:block;padding:10px 10px 5px 10px;width:25px;;height:25px;text-decoration: none;font:16px Verdana;color: #FFFFFF;background-color:var(--title);text-transform:uppercase;margin-left:5px;text-align:center;border-radius:10px;}
div.pagination .current:hover, div.pagination .current:active {font:16px Verdana;color: #FFFFFF;background-color:var(--title);}

div.pagination .pimgi {float:left;display: block;padding:10px 5px 5px 5px;width:25px;;height:25px;text-decoration: none;font:16px Verdana;color: #FFFFFF;text-transform:uppercase;margin-left:5px;text-align:center;}
div.pagination .pimgi:hover, div.pagination .pimgi:active {font:16px Verdana;color: #FFFFFF;}


@media only screen and (max-width:550px) 
{
    .hcntr{display:fixed;position:sticky;top:0;left:0;z-index:155;width:100%;height:50px;border:0px  solid red;justify-content:left;align-items:left;background-image:var(--tpimg);background-repeat: repeat-x;text-align:left;}
    .mdmenu2{width:100%;position:sticky;display:fixed;top:0;left:0; z-index:115;border:0px solid #FFFFFF;border-bottom:0px solid #FFFFFF;background-color:#C7CDD4;padding:0px;margin:0px;}
    .mimg{vertical-align:center;border:0px  solid green;cursor:pointer;height:50px;}
    .himg{vertical-align:center;border:0px  solid green;height:50px; }
    .pimg{vertical-align:center;border:10px  solid #FFFFFF;width:300px;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); }
    .fctop{font-family:"Ropa Sans",serif;font-size:16px;font-weight: normal;margin-top:100px;margin-bottom:20px;color:var(--ftr);text-align:center;margin-right:20px;}
    .ititle{font-family: "Shadows Into Light", serif;font-size:18px;color:var(--stitle);letter-spacing:1px;padding-bottom:2px;margin:0px;}

    .dimg{vertical-align:center;border:10px  solid #FFFFFF;width:300px;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); }
    .smlimg{vertical-align:center;border:2px solid #FFFFFF;height:50px;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);margin-right:15px;margin-bottom:10px;cursor:pointer; }
    
    .dmDetails{float:left;position:relative;width:100%;border:0px solid blue;}
    .dmDetails .dmDleft{ float:left;position:relative;width:350px;border:0px solid red;text-align:left;padding-top:10px;padding-right:15px;}
    .dmDetails .dmDright{float:left;position:relative;max-width:400px;padding:5px;padding-bottom:0px;border:0px solid green;margin-bottom:5px;}
    .dmDleft .dmDbottom{ float:left;position:relative;width:350px;border:0px solid red;text-align:left;margin-top:20px;margin-bottom:20px;}
    
    .dmAddList{display:block;position:relative;width:350px;height:auto;border:0px solid blue;margin:20px 75px 15px 0px;}
    .dmAddbottom{ width:100%;height:auto;border:0px solid red;text-align:center;padding-top:10px;}
    .dmAddTop{display:block;position:relative;width:150px;padding:0px;padding-bottom:0px;border:0px solid #CF1914;margin-bottom:5px;}
    .cimg{vertical-align:center;border:10px  solid #FFFFFF;width:300px;height:auto;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); }
    .clearfix{height:1px;visibility:hidden;display:block;clear:both;}

}