﻿#page div.Advantages {
    background-color: #f1f2f3;
    margin-top: 4em;
    padding: 4em 0;
}


#page div.AdvantageBox {
    width: calc( 29.9% - 3em - 2px );
    height: 28em;
    text-align: center;
    border: 1px solid #f1f2f3;
    border-radius: .25em;
    padding: 1.5em 1.5em 0 1.5em;
    display: inline-block;
    margin: 0 1.5%;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    background-repeat: no-repeat;
    background-size: contain;
    background-position-y: 6em;
    background-color: white;
}

#page div.Advantages.Sites div.AdvantageBox {
    background-position-y: bottom;
    background-size: cover;
}

#page div.AdvantageBox h3 {
    margin: 0;
    clear: both;
    border: 0;
    padding: 0;
    text-align: center !important;
}

#page div.AdvantageBox div.siteData {
    position: absolute;
    bottom: 1em;
    left: 1em;
    right: 1em;
    background-color: rgba( 255,255,255, .75 );
    padding: 2em 1em 1em;
    border-radius: .5em;
}

#page div.AdvantageBox div.keywords {
    position: absolute;
    color: transparent;
    height: 1px;
    width: 1px;
}


#page div.AdvantageBox:hover {
    border: 1px solid #2F4F4F;
    filter: brightness(.75);
    -o-transition: .75s;
    -ms-transition: .75s;
    -moz-transition: .75s;
    -webkit-transition: .75s;
    transition: .75s;
}


h1 {
    width: 100%;
    /* float: left; */
}




/*
.hytPlayerWrapOuter	{ margin-top: 4em; }
.hytPlayerWrap		{display: inline-block; position: relative; width: 100%;}
.hytPlayerWrap.ended::after{content:""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; cursor: pointer; background-color: black; background-repeat: no-repeat; background-position: center; background-size: 64px 64px; background-image: url(data:image/svg+xml;utf8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMjgiIGhlaWdodD0iMTI4IiB2aWV3Qm94PSIwIDAgNTEwIDUxMCI+PHBhdGggZD0iTTI1NSAxMDJWMEwxMjcuNSAxMjcuNSAyNTUgMjU1VjE1M2M4NC4xNSAwIDE1MyA2OC44NSAxNTMgMTUzcy02OC44NSAxNTMtMTUzIDE1My0xNTMtNjguODUtMTUzLTE1M0g1MWMwIDExMi4yIDkxLjggMjA0IDIwNCAyMDRzMjA0LTkxLjggMjA0LTIwNC05MS44LTIwNC0yMDQtMjA0eiIgZmlsbD0iI0ZGRiIvPjwvc3ZnPg==);}
.hytPlayerWrap.paused::after{content:""; position: absolute; top: 70px; left: 0; bottom: 50px; right: 0; cursor: pointer; background-color: black; background-repeat: no-repeat; background-position: center; background-size: 40px 40px; background-image: url(data:image/svg+xml;utf8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEiIHdpZHRoPSIxNzA2LjY2NyIgaGVpZ2h0PSIxNzA2LjY2NyIgdmlld0JveD0iMCAwIDEyODAgMTI4MCI+PHBhdGggZD0iTTE1Ny42MzUgMi45ODRMMTI2MC45NzkgNjQwIDE1Ny42MzUgMTI3Ny4wMTZ6IiBmaWxsPSIjZmZmIi8+PC9zdmc+);}
*/


/********************************************************************/
/* Menu countries / Languages
/********************************************************************/

#CountryLanguageMenuCont {
    position: absolute;
    width: 20em;
    background-color: rgba( 255,255,255,.75 );
    bottom: 15%;
    right: 5%;
    top: 10%;
    border-radius: 2.5em;
}

#CountryLanguageMenu {
    position: absolute;
    bottom: 1em;
    right: 1em;
    top: 9em;
    left: 0;
    overflow-y: auto;
    border-bottom-left-radius: 2.5em;
    border-bottom-right-radius: 2.5em;
}

    #CountryLanguageMenu ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

        #CountryLanguageMenu ul li {
            font-weight: bold;
            color: black;
            font-size: 1.1em;
            padding: .5em 1em;
            border-bottom: 2px solid white;
        }

            #CountryLanguageMenu ul li:hover {
                cursor: pointer;
                background-color: rgba( 255,255,255,.75 );
            }

            #CountryLanguageMenu ul li img,
            #CountryLanguageMenuCont > p:nth-child(1) > img {
                margin-right: .5em;
                vertical-align: -.5em;
            }

#CountryLanguageMenuCont > p:nth-child(1) {
    font-weight: bold;
    color: darkgreen;
    font-size: 1.3em;
    text-align: center;
}

#CountryLanguageMenuCont > p:nth-child(2) {
    color: black;
    padding: 1em 0 1em 3.5em;
    font-weight: normal;
}


#CountryLanguageMenu::-webkit-scrollbar {
    width: .75em;
}

#CountryLanguageMenu::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey;
    border-radius: 10px;
}

#CountryLanguageMenu::-webkit-scrollbar-thumb {
    background: rgba(69,130,26,.5);
    border-radius: 10px;
}

    #CountryLanguageMenu::-webkit-scrollbar-thumb:hover {
        background: rgba(69,130,26,.62);
    }


/********************************************************************/


.AudioPlay,
#page > div.container > div.container > div > p.openArticle,
.openArticle {
    border: 1px solid var(--TableBorderColor);
    padding: .75em 1em;
    border-radius: .5em;
    width: fit-content;
    font-size: small;
    font-style: italic;
    cursor: pointer;
    text-align: left;
}
.AudioPlay, .openArticle {
	display: inline-block;
}
.AudioPlay > img, .openArticle > img {
    width: 1.5em;
    height: 1.5em;
    margin-right: .5em;
    vertical-align: top;
}


.captcha {
    text-align: center;
    max-width: fit-content;
    display: block;
	margin: 0 auto 2em;
}

.captcha > img {
    display: block;
    margin: 1em auto;
    border: 1px solid var(--TableBorderColor);
    border-radius: .25em;
    padding: 0 .5em;
}
.captcha > input[name=user_captcha] {
	text-align: center;
}


ul , ol {
	/* clear: inline-start; */
    clear: unset;
    display: table;
    padding-left: 2em;
}


/* eventuali button nella pagina */
.btnSeek,
.btnOffer {
  display: inline-block;
  margin: 0.5rem;
  padding: 14px 28px;
  font-size: 1.1rem;
/*  font-family: 'Poppins', sans-serif; */
  font-weight: 600;
  border: none;
  border-radius: 10px;
  cursor: pointer;
  transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
  min-width: 200px;
}

/* Bottone "Cercare lavoro" - blu Jobonia */
.btnSeek {
  background-color: #042E56;
  color: white;
}
.btnSeek:hover {
  background-color: #021d39;
}

/* Bottone "Offrire lavoro" - verde accento */
.btnOffer {
  background-color: #5BB974;
  color: white;
}
.btnOffer:hover {
  background-color: #3e975d;
}
