/* image delete and sort buttons */

.gallery-image {

    position: relative;

}



.gallery-image .sort-image,

.gallery-image .delete-image {

    top: 0;

    opacity: 0;

    -webkit-transition: opacity 1s ease;

    transition: opacity 1s ease;

    position: absolute;

    -webkit-transform: translate(-50%, -50%);

    transform: translate(-50%, -50%);

}



.gallery-image .sort-image {

    left: 10px;

}



.gallery-image .delete-image {

    right: -10px;

}



.gallery-image:hover .sort-image,

.gallery-image:focus .sort-image,

.gallery-image:hover .delete-image,

.gallery-image:focus .delete-image 



{

    opacity: 0.31;

}



/* image delete and sort buttons */



/* toggle button customisation */

.custom-control-input:checked~.custom-control-label::before {

    background-color: #459613 !important;

    border-color: #459613 !important;

}



.custom-control-input:disabled~.custom-control-label::before {

    background-color: #82c25a !important;

    border-color: #459613 !important;

}



/* toggle button customisation */

#sc_update_images {}



.page_background {

    background-image: url("../assets/background/background4.jpg");

    background-size: cover;

    background-repeat: no-repeat;

    background-attachment: fixed;

    background-color: #fff;

}



#wsmr_header {



    padding: 15px;

    background-color: coral;

    -webkit-box-shadow: 30px 30px 50px lightblue;

    box-shadow: 30px 30px 50px lightblue;

    -webkit-filter: drop-shadow(3px 3px 3px rgba(0, 0, 0, 0.4));

    filter: drop-shadow(3px 3px 3px rgba(0, 0, 0, 0.4));

}



.content_border {

    background-color: rgba(255, 255, 255, 0.8);

    border: 1px solid #686b74;

    padding: 20px;

    -webkit-filter: drop-shadow(3px 3px 3px rgba(0, 0, 0, 0.4));

    filter: drop-shadow(3px 3px 3px rgba(0, 0, 0, 0.4));

}



.search_text_background {

    background-color: rgba(133, 126, 126, 0.062);

}



h1,

h2,

h3,

h4,

h5,

h6 {

    color: rgb(34, 33, 33);

}



#wsmr_header h1 {

    color: rgb(247, 248, 243);

    background-image: url(/assets/background/engine_house_bullet_inverse.png);

    background-repeat: no-repeat;

    padding-left: 75px;

    background-size: 30px;

    display: inline-block;

    cursor: pointer;

}



.contact_icon {

    background-color: #eeebf3;

    color: rgb(102, 34, 3);

}



#archive_detail_main_content img{



    /* Extra small devices (phones, 600px and down) */

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

        width: 90%;

        margin-left: auto;

        margin-bottom: auto;

        margin-right: auto;

        margin-top: auto;

        display: block;

    }



    /* Small devices (portrait tablets and large phones, 600px and up) */

    @media only screen and (min-width: 600px) {

        width: 100%;

        margin-left: auto;

        margin-bottom: auto;

        margin-right: auto;

        margin-top: auto;



        display: block;

    }



    /* Medium devices (landscape tablets, 768px and up) */

    @media only screen and (min-width: 768px) {

        width: 50%;

    }



    /* Large devices (laptops/desktops, 992px and up) */

    @media only screen and (min-width: 992px) {}



    /* Extra large devices (large laptops and desktops, 1200px and up) */

    @media only screen and (min-width: 1200px) {}

}



.note-file-clip li {



    /* Extra small devices (phones, 600px and down) */

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

        color: red;

    }



    /* Small devices (portrait tablets and large phones, 600px and up) */

    @media only screen and (min-width: 600px) {}



    /* Medium devices (landscape tablets, 768px and up) */

    @media only screen and (min-width: 768px) {}



    /* Large devices (laptops/desktops, 992px and up) */

    @media only screen and (min-width: 992px) {}



    /* Extra large devices (large laptops and desktops, 1200px and up) */

    @media only screen and (min-width: 1200px) {}

}



.note-file-clip a {



    /* Extra small devices (phones, 600px and down) */

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

        color: red;

    }













    /* Extra small devices (phones, 600px and down) */

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

        color: red;

    }



    /* Small devices (portrait tablets and large phones, 600px and up) */

    @media only screen and (min-width: 600px) {}



    /* Medium devices (landscape tablets, 768px and up) */

    @media only screen and (min-width: 768px) {}



    /* Large devices (laptops/desktops, 992px and up) */

    @media only screen and (min-width: 992px) {}



    /* Extra large devices (large laptops and desktops, 1200px and up) */

    @media only screen and (min-width: 1200px) {}

}





























#main_text a {

    background-image: -webkit-gradient(linear, left top, right top, from(#502808), color-stop(50%, #502808), color-stop(50%, rgb(190, 13, 13)));

    background-image: linear-gradient(to right, #502808, #502808 50%, rgb(190, 13, 13) 50%);

    background-size: 200% 100%;

    background-position: -100%;

    display: inline-block;

    padding: 0px 0;

    position: relative;

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

    -webkit-transition: all 0.3s ease-in-out;

    transition: all 0.3s ease-in-out;

    font-weight: normal;

    border-bottom: 3px dotted #d69f72;

  

}



#main_text a:before {

    content: "";

    background: #257914;

    display: block;

    position: absolute;

    bottom: -3px;

    left: 0;

    width: 0;

    height: 3px;

    -webkit-transition: all 0.3s ease-in-out;

    transition: all 0.3s ease-in-out;

}



#main_text a:hover {

    background-position: 0;

}



#main_text a:hover::before {

    width: 100%;

}



.update_caption {}



.pointer{

cursor: pointer;



}



.style1 {

    display: inline-block;

}



.leaflet-control-zoom {

    background-color: #2e312f;

  

}



.style2 {

    font-style: italic;

    background-color: #f8d7da;

}