.grid-item {
    overflow: hidden;
}
.pool_jbox_cont:hover {
    filter: saturate(1);
}
.grid-item, body, .grid-container {
    transition: .4s;
}
.notes.col.span_6_of_6.editinline {
    font-size: medium;
}
img.ico_img {
    width: 100%;
    height: auto;
    max-width: 100px;
}

.center_text {
	text-align: center;
}
.casnumcont {
	/* position: absolute; */
	/* top: 0px; */
	/* left: 0; */
	/* background: #1964aa; */
	/* padding: 1rem 5px 3px 5px; */
	-webkit-border-bottom-right-radius: 20px;
	-moz-border-radius-bottomright: 20px;
	border-bottom-right-radius: 20px;
	color: #dbdbdb;
	font-size: 1.1rem;
	line-height: 1.4rem;
}
.juror_search_cont .juror_search {
    max-width: 70px;
}

        .user-entry {
            display: flex;
            justify-content: space-between;
            margin-bottom: 5px;
        }
        .user-entry span {
            flex-grow: 1;
        }

.grid-item {
	padding: 0.3%;
	text-align: center;
	border-radius:8px;
	background-color:#eee;
	/* margin: 0.2% !important; */
	/* max-width: 97%; */
	/* box-sizing: border-box; */ /* Include padding and border in the element's total width and height */
	margin-bottom: 20px; /* Space between rows */
	/* display: inline-flex; */ /* Grow to fill the space */
	flex: 1;
	/* min-width: calc(16.666% - 20px); */ /* Minimum width for each column (100% / 6 columns - gutter) */
	/* max-width: calc(16.666% - 20px); */
}
.seated {/*border: 2px solid green;*/background: #c4f7c4c7;}
.alternate {
 /* border: 2px solid gold;background: #fff1aabd;*/
}
.pool {/* border: 2px solid red; */background: #ffd7d7cc;}
.config-form {
	margin-bottom: 20px;
}
body {
    background: url(https://www.copojury.com/media/bg1.jpg) no-repeat center center fixed !important;
    -webkit-background-size: cover !important;
    -moz-background-size: cover !important;
    -o-background-size: cover !important;
    background-size: cover !important;
    background-position: top;
}

button.startbtn {
	float: right;
	margin-left: 20px;
}

.rstatus {
	text-align: right;
	font-size: 1.1rem;
	padding-bottom: 1rem;
}
#jurorInfoModal {
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */

    display: flex;
    align-items: center;
    justify-content: center;
}

.modal-content {
    background-color: #000000b8;
    margin: auto;
    padding: 20px;
    border: 1px solid #383838;
    width: 100%; /* Could be more or less, depending on screen size */
    color: #ffffff;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
}
#resetJuryBox, 
#addJuror, 
#toggletools, 
#uploadButton,
.view-info, 
#editclose,
#saveedit {
        background-color: #4a83d0;
        color: white;
        border: none;
        padding: 5px 10px;
        text-align: center;
        text-decoration: none;
        display: inline-block;
        font-size: 16px;
        margin: 20px 0px 10px 0px;
        cursor: pointer;
        border-radius: 4px;
}
#saveedit {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
#toolbox {
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
    background: #ccc;
    padding-top: 20px;
    border-radius: 8px;
    color: #000;
    font-size: 0.6em;
}

.view-info {
    /* background-color: #4a83d0; */
    /* width: 80%; */
    font-size: 0.8em;
}

#toggletools {
  position:absolute;
  top:-20px;
  right:-5px;
}
.config-form {
  position:relative;
}

#settings_menu h3 {
    padding: 0 0 0 0 !important;
    margin: 10px 0 15px 0;
}

.seatstatus.col.span_6_of_6.editinline {text-transform: capitalize;padding: 10px;text-align: center;font-size: 2em;}

.sortable-placeholder {
            border-radius:8px;
            border: 2px dashed #000;
            background-color: #bbecaf;
            /*max-height: 260px;  match the height of your .grid-item */
            margin: 0px 15px 33px 10px; /* match the margin of your .grid-item */
            box-sizing: border-box; /* if your .grid-item uses box-sizing */
            padding: 1%;
            text-align: center;
            min-width: 40px;
            float:left;
            /* margin: 0% 0% 0 0.5%; */
            margin-left: 0.35%;
            margin-right: auto;
            /*min-width: calc(7%);
            max-height:32vh;*/
}



.config-form {
    text-align: center;
    margin-top: 0px;
    padding: 2px;
    /* width: 96%; */
    margin-left: auto;
    margin-right: auto;
}



.jnum {position: absolute;left: -2px;top: -2px;font-size: 1.2em;padding: 2px 10px 2px 10px;background: #393939;border-top-left-radius: 5px;color: #ffffff;border-bottom-right-radius: 5px;}
.grid-item {
    position: relative;
}

.juryboxnumber{position: absolute;left: -4px;top: -7px;border: none;font-size: 1.8em;padding: 2px 10px 2px 10px;/* background: #393939; *//* border-top-left-radius: 5px; */color: #000000;/* text-shadow: 0 0 9px #000; *//* border-bottom-right-radius: 5px; *//* width: 50px; *//* height: 30px; */}
#juryboxnumber::marker {
    margin-left:20px;
    position: absolute !important;
    text-align: end !important;
}

#jurorStatus {max-width: 375px;display:block;margin-left:auto;margin-right:auto;padding: 20px;display: flex;flex-wrap: wrap;justify-content: space-between;gap: 4px;font-size: 1.3em;}
.seatopt {
    display:inline;
    float:left;
    width:23.33%;
}
#configbtns button {
  width:100%;
}


#configbtns > div:nth-child(2) {
    padding: 10px 3%;
    /* margin: -10px -10px -10px 4px; */
    background: #b3c1d6;
    width: 44%;
    border-radius: 5px;
}

#resetJuryBox, #addJuror {
    margin-top: 0px;
}



#uploadButton {
    margin-top: 17px;
    margin-bottom: 0;
}

#addJuror {
    margin-bottom: 12px;
    margin-top: 8px;
}    

.remove-juror {
	cursor:pointer;
}
i.remove-juror.fa-solid.fa-trash-can {
    font-size: 1.5em;
    vertical-align: middle;
    color: #a70000;
}
.details_cont {
    text-align: left;
    /* background: #21313d; */
    border-radius:5px;
    font-size: 0.9em;
}

.details_cont div  {
    /* background: #237ac3; */
    /* padding:5px; */
    color:#ffffff;
    border-radius:5px;
    margin-bottom: 2px;
}
.editinline.name {
    font-size: 1.4em;
    padding-top: 0px;
    margin-bottom: 20px;
}

.juror_search_cont_title {
    text-align:center;
    width:100%;
    min-width: 100%;
    display: block;
}
.juror_search_cont .juror_search:hover {
    background: #38a6ff;
}

.juror_search_cont .juror_search {
    padding: 10px;
    transition: .4s;
    vertical-align: middle;
}


#configbtns {
    background: #e0e0e0;
    padding: 10px;
    border-radius: 8px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 3px;
}

#resetJuryBox {
    margin-bottom: 0px;
}

.grid-item div {
    cursor: pointer;
}

.details_cont.section.group {
    width: 97%;
    margin-left: auto;
    margin-right: auto;
}

#juryBox {
    /* margin-top: 154px; */
    /* margin-left: 3.2%; */
    /* width: 96.8%; */
}

.seated .jnum {
    border: 2px solid green;
}

.pool .jnum {
border:2px solid red;
}

.alternate .jnum {
border:2px solid gold;
}



#configbtns div {
    flex: 1;
    flex-basis: calc(16.66% - 10px);
    /* max-width: calc(16.66% - 10px); */
    box-sizing: border-box;
}
input#jurorName {
    font-size: 1.3em;
    border: none;
    border-radius: 4px;
    line-height: 1.3em;
}

#toolbox label {
    font-size: 1.3em;
}



.jnum {
    display: none;
}

.custom-counter {
    padding-top: 1%;
    list-style-type: none; /* Remove default numbering */
    counter-reset: list-counter; /* Create a new instance of the counter */
    padding-left: 1%; /* Optional: Remove padding if desired */
    padding-right: 1%;
}

.custom-counter li {
    counter-increment: list-counter; /* Increment the counter */
    position: relative; /* Needed for positioning the pseudo-element */
}

.custom-counter li:before {
    content: counter(list-counter); /* Display the counter */
    position: absolute; /* Position the pseudo-element */
    left: 5px; /* Adjust as needed */
}



.move_me li.juryboxnumber:before {
	background: red;
	padding: 5px;
	border-radius: 5px;
	color: #ffffff;
}
div#devmenu {
    color: #ffffff;
}


i.fas.fa-user-slash {
    font-size: 1.05em;
}




div#grid_box_options, jrank_settings, #jrank_settings, #basic_settings {
    border: 1px solid #818181;
    border-radius: 8px;
    margin-bottom: 5px;
    background: #8589948f;
    padding: 10px;
    margin-bottom: 10px;
}






#logotitle {
    position: relative;
    /* z-index: 1; */
    width: 65%;
    left: 9%;
    padding-top: 2%;
    filter: brightness(0.5);
    filter: brightness(10);
}




/*
.message_distruct {
	position: absolute;
	z-index: 3;
	padding: 3%;
	width: 98%;
	left: 0;
	bottom: 0;
	background: #272727fa;
	border-radius: 8px;
display:none;
}
*/
.message_distruct {display: none;transition: .5s;font-size: 1em;position: fixed;min-width: 200px;width: auto;height: fit-content;top: -26px;bottom: -16px;z-index: 2;left: 50%;transform: translateX(-50%);color: #ffffff;text-align: center;background: #242424;padding: 15px 10px 6px 10px;border: 1px solid #717171;border-bottom-left-radius: 8px;border-bottom-right-radius: 8px;box-shadow: 0 2px 15px #404040;}

.editinline.editinlinebtn {
	min-height: 66px;
}
.notestogtitle {
	cursor: pointer;
}




:root {
    --hamburger-menu-size: 60px;
    --hamburger-menu-border-radius: .12em;
    --hamburger-menu-bg-color: rgba(33, 150, 243, 0.75);
    --hamburger-menu-line-height: 2px;
    --hover-line-height: var(--hamburger-menu-line-height);
    --hover-color: #1a8cd8;
    --content-bg-color: rgba(50, 50, 50, 0.97);
    --main-color: #FEFEFE;
    --anim-duration: .4s;
}

.flex-center {
    display: flex;
    align-items: center;
    justify-content: center;
}

* {
    box-sizing: border-box;
    font-family: 'Play', sans-serif;
    font-weight: 300;
}

a,
a:visited,
a:hover,
a:active {
    color: inherit;
    text-decoration: none;
}

h1 {
    font-family: 'Play';
    font-weight: 400;
    font-size: 3em;
    text-align: center;
}

.outer-menu {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
}

.outer-menu .checkbox-toggle {
    position: absolute;
    top: 15px;
    left: 7px;
    z-index: 65;
    cursor: pointer;
    width: var(--hamburger-menu-size);
    height: var(--hamburger-menu-size);
    opacity: 0;
}

.outer-menu .checkbox-toggle:checked + .hamburger > div {
    transform: rotate(135deg);
}

.outer-menu .checkbox-toggle:checked + .hamburger > div:before,
.outer-menu .checkbox-toggle:checked + .hamburger > div:after {
    top: 0;
    transform: rotate(90deg);
}

.outer-menu .checkbox-toggle:checked + .hamburger > div:after {
    opacity: 0;
}

.outer-menu .checkbox-toggle:checked ~ .menu {
    pointer-events: auto;
    visibility: visible;
}

.outer-menu .checkbox-toggle:checked ~ .menu > div {
    transform: scale(1);
    transition-duration: .75s;
}

.outer-menu .checkbox-toggle:checked ~ .menu > div > div {
    opacity: 1;
    transition: opacity var(--anim-duration) ease var(--anim-duration);
}

.outer-menu .checkbox-toggle:hover + .hamburger {
    box-shadow: inset 0 0 10px rgba(0, 0, 0, .1);
}

.outer-menu .checkbox-toggle:checked:hover + .hamburger > div {
    transform: rotate(225deg);
}

.outer-menu .hamburger {
    position: absolute;
    top: 15px;
    left: 10px;
    z-index: 1;
    width: var(--hamburger-menu-size);
    height: var(--hamburger-menu-size);
    padding: 0.5em 1em;
    background: var(--hamburger-menu-bg-color);
    border-radius: 0 var(--hamburger-menu-border-radius) var(--hamburger-menu-border-radius) 0;
    cursor: pointer;
    transition: box-shadow var(--anim-duration) ease;
    backface-visibility: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.outer-menu .hamburger > div {
    position: relative;
    flex: none;
    width: 100%;
    height: var(--hamburger-menu-line-height);
    background: var(--main-color);
    transition: all var(--anim-duration) ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.outer-menu .hamburger > div:before,
.outer-menu .hamburger > div:after {
    content: '';
    position: absolute;
    z-index: 1;
    top: calc(-1 * var(--hamburger-menu-size) / 6);
    left: 0;
    width: 100%;
    height: var(--hamburger-menu-line-height);
    background: inherit;
    transition: all var(--anim-duration) ease;
}


.outer-menu .hamburger > div:after {
    top: 10px;
}

.outer-menu .menu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    visibility: hidden;
    overflow: hidden;
    backface-visibility: hidden;
    outline: 1px solid transparent;
    display: flex;
    align-items: center;
    justify-content: center;
}

.outer-menu .menu > div {
    width: 240vw;
    height: 240vw;
    color: var(--main-color);
    background: rgb(10 15 27 / 96%);
    border-radius: 50%;
    transition: all var(--anim-duration) ease;
    flex: none;
    transform: scale(0);
    backface-visibility: hidden;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.outer-menu .menu > div > div {
    text-align: center;
    max-width: 90vw;
    max-height: 100vh;
    opacity: 0;
    transition: opacity var(--anim-duration) ease;
    overflow-y: auto;
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    /* margin-top: -20vh; */
}

.outer-menu .menu > div > div > ul {
    list-style: none;
    padding: 0 1em;
    margin: 0;
    display: block;
    max-height: 100vh;
}

.outer-menu .menu > div > div > ul > li {
    padding: 0;
    margin: 1em;
    font-size: 24px;
    display: block;
}

.outer-menu .menu > div > div > ul > li > a {
    position: relative;
    display: inline;
    cursor: pointer;
    transition: color var(--anim-duration) ease;
}

.outer-menu .menu > div > div > ul > li > a:hover {
    color: var(--hover-color);
}

.outer-menu .menu > div > div > ul > li > a:hover:after {
    width: 100%;
}
#downloadtmpl {
    line-height: 3em;
}
.outer-menu .menu > div > div > ul > li > a:after {
    content: '';
    position: absolute;
    z-index: 1;
    bottom: -.15em;
    left: 0;
    width: 0;
    height: var(--hover-line-height);
    background: var(--hover-color);
    transition: width var(--anim-duration) ease;
}




#logoico {
    position: fixed;
    right: 8px;
    top: 0px;
    height: 90px;
    z-index: 22;
    filter: brightness(1.3);
}


.outer-menu .menu > div > div > ul > li a {color:#ffffff;transition:.4s;text-decoration:none;line-height:2em;font-size: 1em;} 



.menu li:hover {
	text-shadow: 0 0 20px #fff;
}




body, html {
    margin: 0;
    padding: 0;
    /* height: 100vh; */
    margin: 0 0 50px 0 !important;
    overflow: auto;
    width: 100%;
}

video#backgroundVideo {
    position: fixed;
    top: 0;
    left: 50%; /* Center the video from the left */
    transform: translateX(-50%); /* Shift it to the left half of its width */
    min-width: 100%;
    min-height: 100%;
    width: auto; /* You could potentially remove this */
    height: auto; /* And this, if using object-fit */
    z-index: -100;
    background-size: cover;
    object-fit: cover;
}

img#logobg2 {
    min-width: 108vw;
    /* min-height: 50%; */
    max-height: 236px;
    position: fixed;
    z-index: 1;
    top: -42px;
    opacity: 0.9;
    transform: rotate(-1deg);
    pointer-events: none;
}



.smbttn {
	padding: 2px 7px;
	border-radius: 3px;
	text-decoration: none !important;
	line-height: 2em;
	cursor: pointer;
}


.grid-container {
    position: relative;
    /* width:98%; */
    min-width: 100%;
    /* max-width: 67% !important; */
    /* margin-left: 12% !important; */
}

.grid-item {
    /* max-width: calc(16.66% - 10px); */
    box-sizing: border-box;
    box-shadow: 0 0 13px #ffffff82;
    /* display: block; */
    float:left;
    margin-left: 0.5%;
    position:relative;
    width: 15%;
    /* height: 108vh !important; */
}



.grid-item {
    /* background-image: url(https://www.courtofpublicopinion.com/lgbg.png); */
    /* background-size: 110%; */
    /* background-position-y: -7px; */
    /* background-repeat: no-repeat; */
}


.grid-item {
    background-color: #ffffff;
}




.janswer_cont {
    display: inline-block;
    float: right;
    margin-right: -30px;
}

ol.voirdire_Questionslist {
    text-align: left;
    padding: 10px 10px 10px 34px;
    background: #ffffff;
    border-radius: 8px;
    color: #000;
}







        .jrate_cont {
            display: flex;
            flex-direction: column;
            align-items: center;
            font-size: 1.5em;
            width: calc(100% - 3%);
            margin-left:auto;
            margin-right:auto;
            padding: 0.3%;
            border-radius: 5px;
            border: 0px solid #656464;
            box-shadow: 0 0 1px #9d9d9d;
            position: relative;
            transition:.6s;
            margin-bottom: 5px;
            min-height: 80px;
            background: rgb(219 219 219);
        }

        .jrate_num {
            font-size: 2em;
            /* min-width: 70%; */
            text-align:center;
            /* margin-right: 0.5em; */
            color:#ffffff;
            text-shadow: 0 0 3px #000;
        }
         .jrate_title {
           font-family: 'Play', sans-serif;
           font-size: 0.7em;
           text-align: center;
           color: #fff;
           background: #646565;
           width: calc(100% + 0.8%);
           margin-bottom: 2px;
           margin-left: 0;
           margin-right: 0;
           margin-top: -7px;
           border-radius: 5px;
           border-bottom-left-radius: 0;
           border-bottom-right-radius: 0;
           line-height:1.5em;
        }

.jrate_icons {
    position: absolute;
    min-width: calc(100% - 9px);
    bottom: 9px;
    left: 4px;
    font-size: 1.4em;
}

        .jrate_rating {
            display: flex; /* Align number and icons horizontally */
            align-items: center; /* Center-align children vertically */
        }        

        .jrate_icons > .fas {
            cursor: pointer;
            color: #237ac3;
}

        .jrate_icons > .fas + .fas {
            margin-top: 8px;
        }

.notsetfontsize {font-size: 1em !important;padding-top: 17%;}



.grid-item .voirdire_cont {
    text-align: left;
    padding: 2px 10px !important;
    margin-top: 2px;
    width: 97%;
    margin-left: auto;
    margin-right: auto;
}
#clientadmin_item {
    margin-bottom: 100px;
    margin-top: 10vh;
}

#copophone {
    right: 7%;
    top: 19px;
    position: fixed;
    font-size: 1.4em;
    color: #ffffff;
    text-shadow: 0 0 9px BLACK;
}


.bottbtntitle {
    display: block;
    width: 100%;
    clear: both;
    font-size: 0.5em;
}


.editinlinebtn {
    transition:.4s;
    /* width: auto; */
    display: inline-flex;
    width: 32.34%;
    font-size: 1.9em;
    text-align: center;
    padding: 2%;
    margin: 1% 1% 1% 0;
    background:#237ac3;
}



.details_cont .sqbtntitle {
    font-size: 0.4em;
    padding: 0 !important;
    margin-top: 8px;
    margin-bottom: -30%;
    margin-left: -12px;
    margin-right: -12px;
}

.grid-item .editinlinebtn2 {
    /* margin-right: 0 !important; */
}

.jurordetails_cont .editinline,  .editinline_blocked, .notes_cont .editinline, .voirdire_cont .editinline {background: #237ac3;text-align: center;padding: 4%;cursor: auto;}

.details_cont .editinline, .voirdire_cont, .juror_search_cont,  .editinline_blocked {
    transition:0.6s;
    background: rgb(35,122,195);
    background: -moz-linear-gradient(323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
    background: -webkit-linear-gradient(323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
    background: linear-gradient(323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#237ac3",endColorstr="#646565",GradientType=1);
}
.editinlinebtn:hover {
    transition:0.6s;
background: -moz-radial-gradient(circle, rgba(25,141,238,1) 73%, rgba(100,101,101,1) 100%);
background: -webkit-radial-gradient(circle, rgba(25,141,238,1) 73%, rgba(100,101,101,1) 100%);
background: radial-gradient(circle, rgba(25,141,238,1) 73%, rgba(100,101,101,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#198dee",endColorstr="#646565",GradientType=1);
}

.jrate_icons i:hover {
    color: #158cf0;
}

.jrate_icons i {
    transition: 0.3s;
}




.jurordetails_cont .editinline, .editinline_blocked {
	display:none;
	text-align: left;
	font-size: 1.2em;
	overflow: auto;
}
.jurordetails_cont {
    padding: 2px 0 !important;
}

.fa-toggle-on {
    color: #237ac3;
    font-size: 30px;
}
.fa-toggle-off {
    color: #5d5d5d;
    font-size: 30px;
}


.jurordetails_cont.col.span_6_of_6 {
    color: #000;
}

span.dettogtitle, span.notestogtitle {
    font-size: 16px;
    position: relative;
    padding: 0 0 0 5px;
    top: -6px;
    color: #237ac3;
}
#jbox_sysmessages, #jbox_sysmessagesx, #jbox_sysmessagesdone {
	position: absolute;
	top: 110px;
	transform: translateX(-50%);
	left: 50%;
	color: #ffffff;
}

.greybluebtn {
    transition:0.6s;
    background: rgb(35,122,195);
    background: -moz-linear-gradient(323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
    background: -webkit-linear-gradient(323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
    background: linear-gradient(323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#237ac3",endColorstr="#646565",GradientType=1);
    font-size: .8em;
    line-height: 1.3em;
    color:#ffffff;
    padding: 2px 5px;5px;
    border:none;
    border-radius: 5px;
    transition:0.8s;
}
.greybluebtn:hover {
    transition:0.8s;
background: -moz-radial-gradient(circle, rgba(25,141,238,1) 73%, rgba(100,101,101,1) 100%);
background: -webkit-radial-gradient(circle, rgba(25,141,238,1) 73%, rgba(100,101,101,1) 100%);
background: radial-gradient(circle, rgba(25,141,238,1) 73%, rgba(100,101,101,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#198dee",endColorstr="#646565",GradientType=1);
}

#botmenu_showalldata, #loadJsBtn2 {
    height: 100%;
}
.addnote {
    /* padding: 5% 10% 7.5% 10.3% !important; */
}
.notes {
display:none;
}

.voirdire_cont {
    padding: 5% 10% 7.5% 10% !important;
    font-size:.8em;
    color:#fff;
    border-radius: 5px;
}

.editinlinebtn2 {
    margin-right: 0;
}


.btnactive {
    background: #41973e !important;
}
.editinline {
transistion:.4s;
}
button#savesettings {
    padding: 5px 10px;
    margin: 15px 0 0 0;
    border: none;
    color: #fff;
    /* background: #1964a8; */
    background: rgb(35,122,195);
    background: -moz-linear-gradient(323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
    background: -webkit-linear-gradient(323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
    background: linear-gradient(323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(star);
    border: none;
    font-size:1em;
    border-radius:5px;
}


#settings_menu {padding-top:20px;max-width: 700px;margin-left: auto;margin-right: auto;margin-top: 13px;background: #ccccccc2;padding: 20px;border-radius: 8px;color: #000;transition: .5s;/* text-align: left; */}


#settings_menu input {
    font-size: 20px;
    margin: 10px 5px;
    width: 47px;
    text-align: center;
    border-radius: 5px;
}

.notes .editinline_val {
    background: #fff;
    margin: 6px 0;
    display: block;
    color: #000;
    text-align: left;
    padding: 5px;
    border-radius: 3px;
}
.notestiny {
	display:block;
}

.notes_cont.col.span_6_of_6 {
    cursor: auto;
    padding: 0px;
    margin: 10px 0px 5px 0;
    width: 100%;
    text-align: left;
}


#settings_menu a {
    color: #fff;
    transition: .4s;
    text-shadow: 0 0 7px #000000c9;
}

#settings_menu a:hover {
    color: white;
    text-shadow: 0 0 11px #fff;
}
#user_role_messages {
    font-size: .8em;
    padding-top:20px;
}

#toggleM .outer {
  padding: 20px;
}

#toggleM ul {
  list-style: none;
  margin: 0;
  padding: 0 0 0 0;
  border: 1px solid lightgray;
  z-index: 99;
}

#toggleM li {
  padding: 2px 15px 5px 15px;
  transition: all 550ms ease;
  background: rgb(48 48 48 / 90%);
  cursor: pointer;
  /* margin: 0 3% 0 0px; */
}

#toggleM button {
  border: none;
  padding: 11px 10px;
  margin-left: 17p;
  background: #434142;
  background: rgb(33 150 243);
  color: white;
  border-radius: 2px;
  text-transform: uppercase;
  cursor: pointer;
  font-weight: 900;
  font-size: .8em;
  margin: .4%;
}

#excused_menu {
    width: 100%;
    text-align: center;
    position: fixed;
    top: 0;
    z-index: 3;
    padding-bottom: 30px;
    background: rgb(24,26,30);
background: -moz-linear-gradient(180deg, rgba(24,26,30,0.702140231092437) 0%, rgba(24,26,30,0.6209077380952381) 37%, rgba(24,26,30,0.4220281862745098) 74%, rgba(24,26,30,0) 100%);
background: -webkit-linear-gradient(180deg, rgba(24,26,30,0.702140231092437) 0%, rgba(24,26,30,0.6209077380952381) 37%, rgba(24,26,30,0.4220281862745098) 74%, rgba(24,26,30,0) 100%);
background: linear-gradient(180deg, rgba(24,26,30,0.702140231092437) 0%, rgba(24,26,30,0.6209077380952381) 37%, rgba(24,26,30,0.4220281862745098) 74%, rgba(24,26,30,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#181a1e",endColorstr="#181a1e",GradientType=1);
}

#toggleM li:not(:last-child) {
  border-bottom: 1px solid lightgray;
}

#toggleM .close-btn {
  position: fixed;
  width: 100%;
  transition: all 400ms linear;
  bottom: -100%;
  background: gray;
  z-index: 2;
}

#toggleM button#close {
  z-index: 4;
  margin-bottom: 0px;
  /* margin-left: 10px; */
}
#toggleM {
    background: #205589f0;
    padding-top: 4px;
    color: #fff;
    font-size: 1.2em;
    background: url(https://www.copojury.com/media/bg1.jpg) no-repeat center center fixed !important;
    background-size: cover !important;
}

#toggleM .close-btn ul {
  position: relative;
  z-index: 3;
  background: white;
}

#toggleM .close-btn.active {
  bottom: 0;
  opacity: 1;
}

#toggleM .close-btn button {
  position: absolute;
  right: 5px;
  top: 6px;
}

#toggleM .close-btn::before {
  content: "";
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1;
}

#toggleM .close-btn.normal::before {
  animation: fadeOff 700ms ease-in-out;
  transition: all 700ms ease-in-out;
  display: none;
}

#toggleM @-webkit-keyframes fadeOff {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
div#toggleM {
    position: fixed;
    width: 100%;
    bottom: 0;
    z-index: 1;
    overflow: auto;
    height: 100vh;
    padding-top: 100px;
    padding-left: 3px;
    opacity: .98;
}

#toggleM.normal {
display:none;
}

select#user_role, select#case_name {
    font-size: 18px;
    padding: 2px;
    border-radius: 5px;
    border: 2px solid;
margin-top:10px;
    
}


.jurordetails_cont .editinline,  .editinline_blocked {
    word-break: break-word;
}
.juror_search {
    color: lime;
    text-align:center;
    display:inline-flex;
    gap:10px;
}
.juror_search_cont {
    display: block;
}
.juror_search i {
    font-size:2em !important;
}
.juror_search_all {
  text-align:center;  
padding:10px 0px 2px;
}

.jurordetails_cont .editinline_val {
display:block;
margin-left:-5px;
}



#botmenuopen, #botmenu_showalldata, #botmenu_showalldatax, #loadJsBtn2 {
    padding: 3px 8px;
    font-size: 1.2em;
    color: #fff;
    /* background: #1964a8; */
    background: rgb(35,122,195);
    background: -moz-linear-gradient(323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
    background: -webkit-linear-gradient(323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
    background: linear-gradient(323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(star);
    border: none;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    box-shadow: 0 2px 10px #000;
    /* min-width: 386px; */
    display: inline;
    vertical-align: bottom;
    margin-right: 2px;
    margin-left: 2px;
}

#botmenuopen:hover, #botmenu_showalldata:hover, #loadJsBtn2:hover, #botmenu_showalldatax:hover {
    background: rgb(35,122,195);
    background: -moz-linear-gradient(323deg, rgba(100,101,101,1) 20%, rgba(35,122,195,1) 100%);
    background: -webkit-linear-gradient(323deg, rgba(100,101,101,1) 20%, rgba(35,122,195,1) 100%);
    background: linear-gradient(323deg, rgba(100,101,101,1) 20%, rgba(35,122,195,1) 100%);
}



.menu_active {
    color: #3ae530;
    text-shadow: 0 0 10px #000;
}

.menu h4 {
    padding-top: 0;
    padding-bottom: 0;
    margin-top: -15px;
}

#voirdire_Questionslist_cont li {
	text-align:left;
	margin-right: 30px;
	line-height: 1.4em;
	margin-bottom: 5px;
	border-bottom: 1px solid #5989ceed;
}

#togvdq .fa-toggle-on {
    color: #52b44c;
}
#togvdq .fa-toggle-off {
    color: #d50000;
}

#togvdq .fas {
    vertical-align: middle;
    text-shadow: 0 0 10px #000;
    font-size: 1.5em;
    margin-left: 10px;
    margin-top: -6px;
}

#toggleM .check-btn {
  text-decoration: none;
  text-transform: uppercase;
  display: block; /* Corrected typo 'disply' to 'display' */
  width: 200px;
  background: #b5d45e;
  color: black;
  padding: 15px 25px;
  border-radius: 3px;
}


body {
    overflow-x: hidden;
}

#voirdire_Questionslist_cont {
    text-align: left;
    background: #fff;
    border-radius: 8px;
    color: #000;
    padding: 8px 40px 8px 8px;
}
#voirdire_Questionslist_cont {
    display: none;
}


.jQanswer_edit {
    color: #3bff3b !important;
    border-bottom: 1px solid #c3c3c3;
    display: block;
    padding-top: 0 !important;
    padding-bottom: 10px !important;
}

.jQanswer_edit p {
    margin: 0px 0 0px 0;
}

.editinline_val p:first-of-type {
    padding: 0;
}




.peremtory_avail_pla, .peremtory_avail_def {
  /* min-width: 80px; */ /* Set a minimum width for both elements */
  text-align: center; /* Center text within each element */
  /* Additional styling */
  padding: 4px 2px 4px 2px; /* Provide some padding inside the elements */
  /* border: 1px solid #00ff13; */ /* Optional: add a border to see the elements */
  /* border-radius: 3px; */
  color: #ffffff;
  font-size: 1.2em;
  line-height: 0.2em;
  /* max-width: 41%; */
  display: inline-block;
  margin: 0px 2px 0 2px;
}


.pertitle_cont {
    display: block;
    text-shadow: 0 0 4px #000;
    font-size: .7em;
    line-height: .8em;
    padding: 0;
}

.pertitle {
    padding-bottom: 0px;
    font-size: 0.5em;
    line-height: 1em;
    display: inline;
}

.peremtory_inner {
    text-align: center;
    color: #ffffff;
    /* min-width: 180px; */
}

#pla_per_rem, #def_per_rem {
    font-size: .7em;
}


#botbar_cont {
    justify-content: center; /* Center horizontally */
    display: flex;
}


.peremtory_cont {/* background: #1964a8; *//* padding: 1px 3px; *//* border-top-left-radius: 8px; *//* border-top-right-radius: 8px; *//* box-shadow: 0 2px 10px #000; */
margin-right: 20px;
display: inline-flex;
vertical-align: middle;
}

/* Style for the laser line */
.laser-line {
    position: absolute;
    height: 3px; /* Laser thickness */
    background-color: red; /* Laser color */
    z-index: 10000; /* Ensure it's above most content */
    transform-origin: left center; /* Rotate around the start */
}


/* Keyframes for the laser animation */
@keyframes shootLaser {
    from {
        width: 0;
    }
    to {
        width: 100%; /* Full length */
    }
}

/* Apply the animation */
.animate-laser {
    animation: shootLaser 0.13s linear forwards; /* Adjust timing for speed */
}






.col.span_2_of_6.editinline.editinlinebtn I {
    margin-left: auto;
    margin-right: auto;
}


#botbar_cont .excused_grid_item span.editinline-val {
    display: block;
    margin: 20px;
}

#botbar_cont span.editinline_val {
    margin-right: auto;
    margin-left: auto;
    line-height: 2em;
}

.voirdire_cont_excused {
    width: fit-content;
    border: 1px solid;
    padding: 0px 10px;
    margin: 10px 0px;
    border-radius:8px;
}

.jurordetails_cont_excused .fa-toggle-on {
    display: none;
}

.excused_grid_item .editinline_val {
    border-radius:8px !important;
}
.excused_grid_item .notes h2 {
    color:#ffffff;
    padding:5px;
}
.excused_grid_item {
    border:1px solid;
    border-radius:8px !important;
flex: 0 1 calc(16.5% - 10px);
}

ol#excused_list {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  justify-content: center;
}





#toggleM li::marker {
    font-size: 1.4em;
}
.excused_grid_item .sqbtntitle, .excused_grid_item i.fas {
    display: none !important;
}

.jurordetails_cont_excused h3 {
    margin: 10px 0 20px 0 !important;
}


.editinlinebtn2 {
    display: none;
}

#excused_list {
  list-style: none; /* Remove default list numbering */
  counter-reset: excused-counter; /* Reset the counter at the list level */
}

#excused_list .excused_grid_item {
  position: relative; /* Needed for positioning the counter */
  margin-bottom: 20px; /* Adjust spacing as needed */
}

#excused_list .excused_grid_item::before {
  counter-increment: excused-counter; /* Increment the counter */
  content: counter(excused-counter) '.'; /* Display counter */
  position: absolute;
  top: -35px; /* Adjust based on actual layout needs */
  left: 50%;
  transform: translateX(-50%);
  font-size: 1.3em; /* Adjust as needed */
  color: #ffffff; /* Adjust as needed */
  background: #2287d9;
  padding: 2px 20%;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  box-shadow: 0 -1px 27px #303030;
}
#excused_list {
  list-style: none; /* Remove default list styling */
  counter-reset: excused-counter; /* Initialize the counter */
  padding-left: 0; /* Remove default padding if necessary */
}

.excused_grid_item {
  position: relative; /* Enables absolute positioning for pseudo-elements */
  margin-bottom: 20px; /* Spacing between items */
  margin-top: 40px;
}

.excused_grid_item::before {
  counter-increment: excused-counter; /* Increment the counter for each item */
  content: counter(excused-counter) '.'; /* Display the counter */
  position: absolute;
  top: 0; /* Adjust as needed to fit your design */
  left: 0; /* Adjust as needed */
  transform: translate(-100%, 0); /* Adjust as needed */
  font-size: 20px; /* Customization */
  color: #ffffff; /* Customization */
}
#botbar_cont span.editinline_val {
    display: block;
    padding-bottom: 15px;
    color: lime;
}

#botbar_cont .notes .editinline_val * {
    color: #000;
}

.editinlinebtn .fas {
    margin-left: auto;
    margin-right: auto;
}



#flex_bottom_menu {
    position: fixed;
    bottom: 0;
    z-index: 1;
    display: flex;
    justify-content: center; /* Center horizontally */
    width: 100%;
    padding-top: 30px;
background: rgb(24,26,30);
background: -moz-linear-gradient(0deg, rgba(24,26,30,0.702140231092437) 0%, rgba(24,26,30,0.6209077380952381) 37%, rgba(24,26,30,0.4220281862745098) 74%, rgba(24,26,30,0) 100%);
background: -webkit-linear-gradient(0deg, rgba(24,26,30,0.702140231092437) 0%, rgba(24,26,30,0.6209077380952381) 37%, rgba(24,26,30,0.4220281862745098) 74%, rgba(24,26,30,0) 100%);
background: linear-gradient(0deg, rgba(24,26,30,0.702140231092437) 0%, rgba(24,26,30,0.6209077380952381) 37%, rgba(24,26,30,0.4220281862745098) 74%, rgba(24,26,30,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#181a1e",endColorstr="#181a1e",GradientType=1);
}

button#close {
    display: inline-flex;
}

#btns_bottom_cont {
    display: flex;
}


.jurordetails_cont 
 span.editinline_val {
    color: #3dff3d;
    padding-left: 5px;
    text-shadow: 0 0 2px #000;
}


.jurordetails_cont span.editinline_val {
    font-size: 1.1em;
}


.grid-item.grid-item-wide {
    width: 30.5% !important;
    font-size: 2.5em !important;
}
.grid-item.grid-item-wide .editinlinebtn .fas {
     font-size:1.6em !important;
   
}
.grid-item.grid-item-wide .editinlinebtn {
    padding: 3% 0% 5% 0% !important;
    font-size:2.5em !important;
    min-height: 100px !important;
}



.grid-item-wide .jrate_icons {
      font-size:.7em !important;

}
.grid-item-wide .jrate_cont {
       font-size:1em !important;
  height:auto;
 
}

.grid-item-wide .jurordetails_cont {
       font-size: 1.2em !important;
}

.grid-item-wide .jurordetails_cont span.editinline_val {
    font-size: 1.1em;
}





.g7_columns {
    width: 12.8% !important;
}
.g8_columns {
    width: 11.2% !important;
}
.g9_columns {
    width: 9.9% !important;
}
.g10_columns {
    width: 8.9% !important;
}
.g11_columns {
    width: 8% !important;
}
.g12_columns {
    width: 7.3% !important;
}





.jurordetails_cont_excused .juror_search_cont {
    font-size: .9em;
    margin-bottom: 10px;
}
.notes .editinline_val {
    font-size: large;
}



.imp_jbox_cont {/*    background: rgb(100,101,101);
    background: -moz-radial-gradient(circle, rgba(100,101,101,0) 0%, rgba(25,141,238,0.7049413515406162) 15%, rgba(25,141,238,1) 50%, rgba(25,141,238,0.640515581232493) 85%, rgba(101,100,101,0) 100%);
    background: -webkit-radial-gradient(circle, rgba(100,101,101,0) 0%, rgba(25,141,238,0.7049413515406162) 15%, rgba(25,141,238,1) 50%, rgba(25,141,238,0.640515581232493) 85%, rgba(101,100,101,0) 100%);
    background: radial-gradient(circle, rgba(100,101,101,0) 0%, rgba(25,141,238,0.7049413515406162) 15%, rgba(25,141,238,1) 50%, rgba(25,141,238,0.640515581232493) 85%, rgba(101,100,101,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#646565",endColorstr="#656465",GradientType=1);*/display: inline-block;margin-left: -3.2% !important;margin: 0 0;width: calc(100% + 3.2%);padding: 0px 0 0 3.2% !important;justify-content: center;}


.pool_jbox_cont {/*background: rgb(238,226,174);
background: -moz-radial-gradient(circle, rgba(238,226,174,0.8814119397759104) 0%, rgba(238,226,174,0.4500393907563025) 100%);
background: -webkit-radial-gradient(circle, rgba(238,226,174,0.8814119397759104) 0%, rgba(238,226,174,0.4500393907563025) 100%);
background: radial-gradient(circle, rgba(238,226,174,0.8814119397759104) 0%, rgba(238,226,174,0.4500393907563025) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#eee2ae",endColorstr="#eee2ae",GradientType=1);*/display: inline-block;transition: .5s;margin-left: -3.2% !important;margin: 0 0;width: calc(100% + 3.2%);margin-bottom: 20px;padding: 20px 0 0 3.2% !important;filter: saturate(0.2);justify-content: center;}

.pool_jbox_cont .grid-item-wide {filter: saturate(2);}

.pool_jbox_cont .grid-item.pool {
    box-shadow: 0px 0px 30px #b3b3b3, inset 0px 0px 20px #666666;
    background:#e6e6e6
}
.pool_jbox_cont .grid-item.alternate {
    box-shadow: 0px 0px 30px #dd330d, inset 0px 0px 30px #ffd700;
}



.imp_jbox_cont .grid-item {
    box-shadow: 0px 0px 30px rgb(61 143 240), inset 0px 0px 20px rgb(61 143 240);
}
.imp_jbox_cont .grid-item.seated {
    box-shadow: 0px 0px 30px rgb(61 143 240), inset 0px 0px 30px #44f03d;
}
.imp_jbox_cont .grid-item.alternate {
    box-shadow: 0px 0px 30px rgb(61 143 240), inset 0px 0px 40px rgba(229, 222, 7, 0.8) !important;
}


.privacy-overlay {
    position: fixed; /* Fix position to the viewport */
    top: 0;
    left: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    color: white; /* White text color */
    display: flex;
    justify-content: center; /* Center the text horizontally */
    align-items: center; /* Center the text vertically */
    font-size: 4em; /* Large text */
    z-index: 9999; /* Ensure it's above other content */
    text-transform: uppercase;
    font-stretch: revert-layer;
    opacity: .1;
}


.jboxs_h2title {
    margin-left: -7% !important;
    text-align: center;
    color: #ffffff;
    margin-top: 0;
}


.pool_jbox_cont .jboxs_h2title {
     color: #c4c4c4;
}

li.excused_grid_item {
    cursor: default !important;
}

.gradbttn {
	padding: 3px 8px;
	font-size: 1.2em;
	color: #fff;
	/* background: #1964a8; */
	background: rgb(35,122,195);
	background: -moz-linear-gradient(323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
	background: -webkit-linear-gradient(323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
	background: linear-gradient(323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(star);
	border: none;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
    transition:.5s;
}

.gradbttn:hover {
	background: rgb(42 147 235);
	background: -moz-linear-gradient(-323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
	background: -webkit-linear-gradient(-323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
	background: linear-gradient(-323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
}









/* Extra small devices (phones, 430px and down) */
@media only screen and (min-width: 430px) {
    /* CSS rules for screens smaller than 430px */

.seatstatus.col.span_6_of_6.editinline {
    font-size: .7em;
}

#botmenuopen {
  font-size:.8em;
}

.editinlinebtn {
    transition: .4s;
    display: inline-flex;
    width: 100%;
    font-size: 1em;
    text-align: center;
    padding: 5px 10% 10px 5px !important;
    margin: 1% 1% 1% 0;
}
.editinlinebtn i{
text-align:center;
  margin-left:auto;
  margin-right:auto;
}
.seatstatus {
  padding:5px 5px 5px 5px !important;
}
.sqbtntitle {
  
}
  
.editinline.name {
    font-size: .3em;
    margin-top: 8px;
    margin-bottom: 15px;
}


.outer-menu .menu > div > div > ul {
  
}
.juryboxnumber {
  font-size:14px;
top:-4px;
}
  
#copophone {
     font-size: 0.9em;
     left: 20%;
     top: 15px !important;
}
.outer-menu .menu > div > div > ul > li {
  font-size:0.8em;
  margin: .5em;
}
#juryBox {/* margin-top:120px; */}
#logoico {top: 1%;width: auto;height: 73px;}
img#logobg2 {top: -5px;transform: rotate(4deg);left: -144px;width: 241%;}

#logotitle {
  left: 19%;
  width: 61%;
  margin-top: 10px;
  filter: brightness(10);
}

.jrate_icons {
    position: absolute;
    min-width: 100%;
    bottom: 0px;
    left: 0%;
    font-size: 0.7em;
}

.notsetfontsize {font-size: 0.5em !important;padding-top: 8px; line-height:0.9em;}

.jrate_icons .fa-minus-circle {margin-right: 30%;}

.jrate_icons .fa-plus-circle {
font-size: 1.1em;
}

.jrate_num {
    font-size: 0.9em;
}
.jrate_title {
    font-size: 0.3em;    
}
.jrate_cont {
    min-height: 50px;
}

.jurordetails_cont i, 
.notes_cont i {
    font-size: 20px;
    text-align:center;
    margin-bottom:5px;
}
.jurordetails_cont i span, 
.notes_cont i span {
    font-size: 7px;
    line-height:.4px;
    text-align:center;
    vertical-align:sub;
    display: block;
    margin-top: 13px;
    width: 100%;
    min-width: 100%;
    max-width: 100%;
    padding: 0 0 0 0 !important;
}

.jurordetails_cont i, .notes_cont i {line-height: .8em;width: 100%;}
}


/* Extra small devices (phones, 600px and down) */
@media only screen and (min-width: 600px) {
    /* CSS rules for screens smaller than 600px */
#copophone {
  right:13%;
  top: 53px;
  font-size:1em;
  left: 53%;
  /* transform: translateX(-50%); */
} 
#logobg2 {
    max-height: 236px;
    position: fixed;
    z-index: 1;
    left:-10%;
    top: -2px !important;
    opacity: 0.9;
    transform: rotate(4deg) !important;
    pointer-events: none;
  width:220%;
}

#logotitle {
    position: relative;
    /* z-index: 1; */
    width: 55%;
    left: 20%;
    padding-top: 4%;
}


   
}


/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
    /* CSS rules for screens larger than 600px */
.jrate_cont {
  height: 78px;
}

.grid-item.grid-item-wide .editinlinebtn {
    padding: 1% 0% 2% 0% !important;
    font-size: 2em !important;
    min-height: 60px !important;
}


.juryboxnumber {
    font-size: 1.3em;
}
.editinline.name {
    font-size: 1em;

}

.jrate_icons {
    position: absolute;
    min-width: 100%;
    bottom: 5px;
    left: 0%;
    font-size: 1em;
}
.jrate_num {
    font-size: 1.5em;
}
.jrate_icons .fa-minus-circle {
    margin-right: 50%;
}
.notsetfontsize {
    font-size: .8em !important;
    padding-top: 18%;
}
    
#copophone {
  top:55px;
  font-size:1em;
  left: 55%;
  transform: translateX(-55%);
} 

#logotitle {
    position: relative;
    /* z-index: 1; */
    width: 55%;
    left: 20%;
    padding-top: 2%;
} 
#logobg2 {
    max-height: 236px;
    position: fixed;
    z-index: 1;
    left:-10%;
    top: -18px !important;
    opacity: 0.9;
    transform: rotate(-0deg) !important;
    pointer-events: none;
  width:220%;
} 
.jrate_icons .fa-minus-circle {
    margin-right: 4vw;
}
.details_cont .editinline, .voirdire_cont, .editinline_blocked {
  font-size: 1em;
  padding: 8px 8px 15px 8px !important;
  width: 100%;
}

.remove-juror, .editinlinebtn2, .addnote {
  font-size: 1em;
  padding: 8px 0 !important;
  width:32.3%;
}
.details_cont .sqbtntitle {
zoom:.5
}
    
}


/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
    /* CSS rules for screens larger than 768px */

#botmenuopen {
    font-size: 1.2em;
}
.voirdire_cont {
  font-size:1em;
}

.seatstatus.col.span_6_of_6.editinline {
    font-size: .7em;
}  

.editinline.name {
    font-size: .9em;
}

.grid-item {
    background-size: 360%;
    background-position-y: -5px;
    background-position-x: 0px;
    background-repeat: no-repeat;
}


.jrate_icons {
    position: absolute;
    min-width: 100%;
    bottom: 0px;
    left: 0%;
    font-size: 0.8em;
}

.notsetfontsize {font-size: 0.8em !important;padding-top: 1px; line-height:0.9em;}


.jrate_num {
    font-size: 1.4em;
}
.jrate_title {
    font-size: 0.4em;    
}
.jrate_cont {
}
.view-info {
}
.details_cont.section.group {
    font-size: 7px;    
}


.editinlinebtn {
    padding-top: 5px;
    padding-bottom: 8px;
    display: inline-flex;
    width: calc(100% - 67.7%);
    font-size: 2em;
    text-align: center;
}
.editinlinebtn i{
text-align:center;
  margin-left:auto;
  margin-right:auto;
}
.seatstatus {
  padding:5px 5px 5px 5px !important;
}
.sqbtntitle {
  
}
  
.editinline.name {
    font-size: .9em;
    margin-top: 8px;
    margin-bottom: 15px;
}
.seatstatus.col.span_6_of_6.editinline {
    font-size: 1.3em;
}

.outer-menu .menu > div > div > ul {
  
}
.juryboxnumber {
  font-size: 16px;
  top:-4px;
}
  
#copophone {
}
.outer-menu .menu > div > div > ul > li {
  font-size: 1.3em;
  margin: .5em;
}
#juryBox {margin-top: 125px;}
#logoico {top: -2%;height: 102px;}

img#logobg2 {width: 192%;top: -28px;left: -50px;transform: rotate(1deg);width: 134%;opacity: 0.93;}

#logotitle {
  left: 10vw;
  width: 41vw;
  margin-top: 0px;
  filter: brightness(10);
}



.jrate_icons {
    position: absolute;
    min-width: 100%;
    bottom: 0px;
    left: 0%;
    font-size: 1em;
}

.notsetfontsize {font-size: 0.5em !important;padding-top: 8px; line-height:0.9em;}

.jrate_icons .fa-minus-circle {margin-right: 50%;}

.jrate_num {
    font-size: 1.2em;
}
.jrate_title {
    font-size: 0.3em;    
}
.jrate_cont {
    min-height: 50px;
    height: 50px;
}

.jurordetails_cont i, 
.notes_cont i {
    font-size: 16px;    
  text-align:center;
margin-bottom:5px;

}
.jurordetails_cont i span, 
.notes_cont i span {
    font-size: .5em;
    line-height: 1.4px !important;
    text-align:center;
    display: inline;
    vertical-align: inherit;
    margin-left: 4px;
}

.jurordetails_cont i, .notes_cont i {
  line-height: .8em;
  text-align: left;
  font-size: 20px;
  line-height: .6em;
}

.remove-juror, .editinlinebtn2, .addnote {
  font-size: 2em !important;
  padding: 8px 0 !important;
  width:32.3%;
}
.details_cont .sqbtntitle {zoom:1;}
    


#copophone {right: -1%;top: 43px;top: 56px !important;font-size: 1.2em;left: 22%;transform: translateX(-15%) !important;}

.details_cont .sqbtntitle {
  font-size: .5em !important;
}


.jurordetails_cont .editinline, .editinline_blocked {
  font-size: 2.3em;
  padding: 8px 5px !important;
}

.remove-juror, .editinlinebtn2, .addnote {
  font-size: 2em !important;
  height:auto;
  max-height: 69px;
  max-width: 48%;
  margin-left: 1%;
  margin-right: 1%;
}

.jurordetails_cont .editinline, .editinline_blocked {
  font-size: 1.4em;
  padding: 8px 5px !important;
}




  
}







/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
    /* CSS rules for screens larger than 992px */
#copophone {font-size: ;top: 9px !important;font-size: 1.2em;left: 78%;}



  
.jrate_num {
    font-size: 1.5em;
}
.details_cont .sqbtntitle {
    font-size: .6em !important;
}
.notsetfontsize {
    font-size: 0.7em !important;
    padding-top: 8px;
    line-height: 0.9em;
}
.juryboxnumber {
    font-size: 18px;
}

.jurordetails_cont i span, 
.notes_cont i span {
    font-size: .7em;
}




}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
    /* CSS rules for screens larger than 1200px */


.jurordetails_cont .editinline, .juror_search_cont, .jurordetails_cont .editinline_blocked {
    font-size: 2.2em;
    padding: 8px 5px !important;
    word-break: break-word;
}
.jurordetails_cont .editinline_val {
display:block;
margin-left:-5px;
}


.seatstatus.col.span_6_of_6.editinline {font-size:2em;line-height: .7em;padding-bottom: 10px !important;}
#logotitle {
  left: 9vw;
  width: 67%;
  margin-top: -30px;
}
#copophone {font-size: 16px;right: 8%;}


.jurordetails_cont i span, 
.notes_cont i span {
    font-size: .45em;
}

.jnum {
font-size:17px;

}
.grid-item-wide .editinline.name, .grid-item-wide .editinline_blocked {
    font-size: 1em;
}
.editinline.name {
    font-size: 1.3em;
}
.juryboxnumber {
    font-size: 1.5em;  
}

.grid-item {
    /* background-image: url(https://www.courtofpublicopinion.com/lgbg.png); */
    /* background-size: 160%; */
    /* background-position-y: 0px; */
    /* background-position-x: -20px; */
    /* background-repeat: no-repeat; */
}


.jrate_icons {
    position: absolute;
    min-width: 100%;
    bottom: 4px;
    left: 0%;
    font-size: 1.2em;
}

.notsetfontsize {font-size: 0.8em !important;padding-top: 13px;line-height:0.9em;}

.jrate_icons .fa-minus-circle {margin-right: 49%;font-size: 1em;}
.jrate_icons .fa-plus-circle {font-size: 1em;}




.jrate_title {
    font-size: 0.4em;    
}
.jrate_cont {
    min-height: 54px;
}
.view-info {
    /* font-size: 0.1em; */
    /* width: auto; */
}
.details_cont.section.group {
    font-size: 7px;
}
.jurordetails_cont .fas, .notes_cont .fas {
    font-size: 5em !important;
    margin-bottom: 10px;
    margin-top: 5px;
}
.jurordetails_cont span, .notes_cont span {
    font-size: .6em;
}



#logoico {
top:-10px;
}
#copophone {
     font-size: 1.5em;
     left: 74%;
     top: 9px !important;
     transform: translateX(11%) !important;
}  

.details_cont .editinlinebtn i {font-size: 1.4em;padding: 4% 0% 8% 0%;}

.g8_columns .details_cont .editinlinebtn i {
font-size: 1.3em;
}

  
}






/* Extra large devices (large laptops and desktops, 1450px and up) */
@media only screen and (min-width: 1450px) {
    /* CSS rules for screens larger than 1450px */


.details_cont .editinlinebtn i {font-size: 1.6em;padding: 4% 0% 8% 0%;}

.jrate_icons .fa-minus-circle {margin-right: 66%;font-size: 1.1em;}
.jrate_icons .fa-plus-circle {font-size: 1.1em;}


.grid-item-wide .jrate_icons .fa-minus-circle {margin-right: 76%;font-size: 1.7em; margin-bottom:10px}
.grid-item-wide .jrate_icons .fa-plus-circle {font-size: 1.7em;}


.jurordetails_cont i span, 
.notes_cont i span {
    font-size: .5em;
}

.notsetfontsize {
      font-size: 1.2em !important;
      margin-bottom: 12px;
}


    
}













@media only screen and (max-width: 429px) {
    /* CSS rules for screens smaller than 430px */

.seatstatus.col.span_6_of_6.editinline {
    font-size: .7em;
}

#botmenuopen {
  font-size:.8em;
}

.editinlinebtn {
    transition: .4s;
    display: inline-flex;
    width: 100%;
    font-size: 1em;
    text-align: center;
    padding: 5px 10% 10px 5px !important;
    margin: 1% 1% 1% 0;
}
.editinlinebtn i{
text-align:center;
  margin-left:auto;
  margin-right:auto;
}
.seatstatus {
  padding:5px 5px 5px 5px !important;
}
.sqbtntitle {
  
}
  
.editinline.name {
    font-size: .3em;
    margin-top: 8px;
    margin-bottom: 15px;
}


.outer-menu .menu > div > div > ul {
  
}
.juryboxnumber {
  font-size:14px;
top:-4px;
}
  
#copophone {
     font-size: 0.9em;
     left: 23%;
     top: 24px !important;
}
.outer-menu .menu > div > div > ul > li {
  font-size: 0.8em;
  margin: .5em;
}

.outer-menu .menu > div > div > ul > li a {
color:#ffffff;
transition:.4s;
text-decoration:none;
line-height:2em;
font-size: 0.5em;
} 


#juryBox {
margin-top:120px;
}
#logoico {top: 1%;width: auto;height: 73px;}
img#logobg2 {top: -15px;transform: rotate(-2deg);left: -144px;width: 241%;}

#logotitle {
  left: 23%;
  width: 53%;
  margin-top: 40px;
  filter: brightness(10);
}

.jrate_icons {
    position: absolute;
    min-width: 100%;
    bottom: 0px;
    left: 0%;
    font-size: 0.5em;
}

.notsetfontsize {font-size: 0.5em !important;padding-top: 8px; line-height:0.9em;}

.jrate_icons .fa-minus-circle {margin-right: 1vw;}

.jrate_icons .fa-plus-circle {
font-size: 1.1em;
}

.jrate_num {
    font-size: 0.9em;
}
.jrate_title {
    font-size: 0.3em;    
}
.jrate_cont {
    min-height: 50px;
}

.jurordetails_cont i, 
.notes_cont i {
    font-size: 20px;
    text-align:center;
    margin-bottom:5px;
}
.jurordetails_cont i span, 
.notes_cont i span {
    font-size: 7px;
    line-height:.4px;
    text-align:center;
    vertical-align:sub;
    display: block;
    margin-top: 13px;
    width: 100%;
    min-width: 100%;
    max-width: 100%;
    padding: 0 0 0 0 !important;
}

.jurordetails_cont i, .notes_cont i {line-height: .8em;width: 100%;}
}



















.btns_hidden {
    display: none !important;
}









//
@keyframes explode-up {
    to {
        transform: translateY(-200px) scale(0.5);
        opacity: 0;
    }
}

@keyframes explode-down {
    to {
        transform: translateY(200px) scale(0.5);
        opacity: 0;
    }
}

@keyframes explode-left {
    to {
        transform: translateX(-200px) scale(0.5);
        opacity: 0;
    }
}

@keyframes explode-right {
    to {
        transform: translateX(200px) scale(0.5);
        opacity: 0;
    }
}

.exploded-element {
    animation-duration: 0.75s;
    animation-fill-mode: forwards;
}

.explode-up { animation-name: explode-up; }
.explode-down { animation-name: explode-down; }
.explode-left { animation-name: explode-left; }
.explode-right { animation-name: explode-right; }


/* Existing CSS for animations */
/* Add below existing CSS for explosion animations */


.fade-out {
    animation: fadeOut .5s forwards;
}

@keyframes fadeOut {
    to {
        opacity: 0;
    }
}


#logoico.laserlogo {
    position: fixed !important;
    z-index: 99 !important;
    transition: .3s !important;
    filter: brightness(5) !important;
}

.case_number_line {
	padding: 20px;
	padding-right: 30px;
	margin-bottom: 18px;
	border-left: 10px solid #1964aa;
	border-bottom: 5px solid #1b66ad;
	border-top: 5px solid #1b66ad;
	webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 30px;
	color: #e2e2e2;
	background: #00000042;
}


#juryBox {
	color: #ffffff;
	/* margin-left: 3.2%; */
	min-width: 100% !important;
	/* margin: 120px 2% 2% 2%; */
	/* display: flex !important; */
}
#yourcases {
	/* background: #002a4e40; */
	/* border: 1px solid #66a2ff96; */
	padding: 10px 20px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	font-size: 1.3em;
	line-height: 1.3em;
	/* box-shadow: 0 0 20px #00000029; */
	/* margin: .5%; */
}
#yourcases h2 {
	text-align: center;
	margin-top: 10px;
}

#welcome {
	/* width: 69%; */
	/* margin: 0 1%; */
	color: #ffffff;
}

#welcome  button.startbtn {
	float: none !important;
	font-size: 1.2em;
	margin: 10px;
	margin-left: auto;
	margin-right: auto;
}

#welcome {
	text-align: center;
}

        .moreinfo_cont {
            width: 100%;
        }
        
        .moreinfo_cont {
            padding: 20px;
            margin-top: 10px;
            border: 1px solid #ddd;
            /* background-color: #f9f9f9; */
        }
        
        
        
        
        
    .case_number button.startbtn {
	position: absolute;
	top: -5px;
	right: 0px;
	padding-right: 1rem;
	padding-left: 1rem;
	border-bottom-left-radius: 30px;
	border-bottom-right-radius: 0px;
	border-top-right-radius: 30px;
	font-size: 1rem;
}

.case_number_line {
	position: relative;
	font-size: 1.1rem;
}    
.type_of_proceeding {
	font-size: 1.1rem;
}        
        
      
      
      
.default_btn.btn-primary {      
background: rgb(35, 122, 195);
	background: -moz-linear-gradient(323deg, rgba(35, 122, 195, 1) 20%, rgba(100, 101, 101, 1) 100%);
	background: -webkit-linear-gradient(323deg, rgba(35, 122, 195, 1) 20%, rgba(100, 101, 101, 1) 100%);
	background: linear-gradient(323deg, rgba(35, 122, 195, 1) 20%, rgba(100, 101, 101, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#237ac3",endColorstr="#646565",GradientType=1);     
}       
.addhearing_btn {
	margin-left: auto;
	margin-right: auto;
	display: flex !important;
	margin-bottom: 20px;        
}        
        
        
 .ui-accordion .ui-accordion-header.ui-state-active {
	border: 1px solid #1763aa;
	font-weight: normal;
	color: #eeeeee;
	background: rgb(35,122,195);
	background: -moz-linear-gradient(323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
	background: -webkit-linear-gradient(323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
	background: linear-gradient(323deg, rgba(35,122,195,1) 20%, rgba(100,101,101,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#237ac3",endColorstr="#646565",GradientType=1);
}       
        
        
button.delete_hearing {
padding: 0 5px;background: #ff00004a;right: 0;
display:none;
}
        
        
        
        
        
        
/*  SECTIONS  */
.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	margin: 1% 0 1% .6%;
}
.col:first-child { margin-left: 0; }

/*  GROUPING  */
.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }
/*  GRID OF TWELVE  */
.span_12_of_12 {
	width: 100%;
}

.span_11_of_12 {
  	width: 91.61%;
}
.span_10_of_12 {
  	width: 83.23%;
}

.span_9_of_12 {
  	width: 74.85%;
}

.span_8_of_12 {
  	width: 66.46%;
}

.span_7_of_12 {
  	width: 58.08%;
}

.span_6_of_12 {
  	width: 49.7%;
}

.span_5_of_12 {
  	width: 41.31%;
}

.span_4_of_12 {
  	width: 32.93%;
}

.span_3_of_12 {
  	width: 24.55%;
}

.span_2_of_12 {
  	width: 16.16%;
}

.span_1_of_12 {
  	width: 7.783%;
}


    #juryBox {
        margin-top: 135px;
    } 



@media only screen and (max-width: 1080px) {

.col-3.spacer {
display:none !important;
}

.stripecont {
	-ms-flex: 0 0 100%!important;
	flex: 0 0 100%!important;
	max-width: 100% !important;
}

body {
height: 100vh;
min-height: 100vh;
}


}

a#copophone {
	color: #ffffff !important;
	text-decoration: none !important;
}





/*  GO FULL WIDTH BELOW 480 PIXELS */
@media only screen and (max-width: 480px) {




	.col {  margin: 1% 0 1% 0%; }
    
    .span_1_of_12, .span_2_of_12, .span_3_of_12, .span_4_of_12, .span_5_of_12, .span_6_of_12, .span_7_of_12, .span_8_of_12, .span_9_of_12, .span_10_of_12, .span_11_of_12, .span_12_of_12 {
	width: 100%; 
	}
}







div#yourcases {
	display: none !important;
}

div#welcome {
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
}



.modal-header {
	border: none !important;
}

button.close {
	color: #ffffff;
}

.container.mt-5 {
	margin-top: 2em !important;
}

h5#loginModalLabel {
	margin-left: auto;
	margin-right: auto;
	padding: 0 0 0 10px;
}