@font-face {
    font-family: 'CeraBlack';
    src: url('//www.you.gr/App_Themes/YouGR/fonts/Cera GR Black.otf') format('opentype'), url('./fonts/Cera GR Black.woff') format('woff');
}

@font-face {
    font-family: 'CeraMedium';
    src: url('//www.you.gr/App_Themes/YouGR/fonts/Cera GR Medium.otf') format('opentype');
}

@font-face {
    font-family: 'CeraLight';
    src: url('//www.you.gr/App_Themes/YouGR/fonts/Cera GR Light.otf') format('opentype'), url('./fonts/Cera GR Light.woff') format('woff');
}

.touch .MyContainer {
    background-color: #f2d0e0 !important;
}

.MyContainer {
    padding: 0;
    background-color: #f2d0e0;
    position: relative;
    color: white;
}

.TopBanner_small {
    display: none;
}

.ContestContainer {
    background-color: white;
    border-radius: 8px;
    width: 80%;
    position: relative;
    z-index: 5;
    margin: 50px auto 40px auto;
    text-align: center;
    padding: 50px 50px;
    border: solid 2px #d30303;
}

.ContestTitle {
    font-size: 39px;
    color: #2c2c2c;
    font-family: 'CeraMedium';
}

.ContestSubtitle {
    margin-top: 20px;
    font-size: 39px;
    line-height: 39px;
    color: #2c2c2c;
    font-family: 'CeraMedium';
    margin-bottom: 40px;
}

 .InputsWrapper {
     width: 45%;
     margin: 20px 10px;
     float: left;
}
 .InputsWrapper input {
     border: solid thin rgba(0, 0, 0, 0.3);
     height: 50px;
     padding: 10px;
     width: 100%;
}
 .ErrorMessage {
     color: red;
     font-size: 18px;
     text-align: left;
     font-size: 13px;
     font-style: italic;
     font-family: 'CeraLight';
}

.SayYes {
    font-family: 'CeraMedium';
    color: #d20303;
    font-size: 32px;
    line-height: 42px;
}

.Note {
    font-family: 'CeraLight';
    color: #d20303;
    font-size: 15px;
    line-height: 26px;
    margin: 35px auto;
}

.CheckboxesContainer {
    text-align: left;
    margin: 80px auto;
    width: 100%;
    max-width: 550px;
}

    .CheckboxesContainer button {
        background-color: white;
        border: solid 2px #d20303;
        border-radius: 8px;
        padding: 23px 70px;
        font-family: 'CeraBlack';
        font-size: 20px;
        margin: 50px auto 0 auto;
        transition: all linear 0.1s;
    }

        .CheckboxesContainer button:hover {
            background-color: #d20303;
            color: white;
        }

.CheckBoxesWrapper {
    margin: 25px 0;
    display: flex;
}

    .CheckBoxesWrapper div {
        float: left;
    }

    .CheckBoxesWrapper input {
        position: relative;
        top: 5px;
        cursor: pointer;
    }

    .CheckBoxesWrapper label {
        color: #d20303;
        padding-left: 10px;
        font-size: 17px;
        cursor: pointer;
    }

.consent {
    font-family: 'CeraLight';
    color: #d20303;
    font-size: 16px;
    line-height: 18px;
    font-weight: bold;
    text-align: center;
    margin-top: 20px;
}

.TextContainer {
    width: 70%;
    margin: 0 auto;
}

@media (max-width: 768px) {
    .ContestContainer {
        width: 95%;
        margin: 0 auto 40px auto;
        padding: 50px 20px;
    }

    .TextContainer {
        width: 85%;
    }

    .ContestTitle {
        font-size: 30px;
    }

    .ContestSubtitle {
        font-size: 25px;
        line-height: 30px;
    }
}

@media (max-width: 500px) {
    .TopBanner_small {
        display: block;
    }

    .TopBanner {
        display: none;
    }

    .ContestContainer {
        margin: 40px auto 40px auto;
    }
    .ContestSubtitle{
        font-size:20px;
        line-height:30px;
    }
    .TextContainer {
        width: 92%;
    }
    .InputsWrapper {
        width: calc(100% - 20px);
        margin: 10px 10px;
        float: none;
    }

    .SayYes {
        font-size: 20px;
        line-height: 26px;
    }
    .Note{
        height:350px;
        overflow-y:auto;
        padding:0 15px;
    }
}


/***********************************/

input[type="checkbox"] {
   
}
 input[type="checkbox"] + label {
     font-family: 'CeraLight';
     color: #fff;
     font-weight: 700;
     font-size: 19px;
     cursor: pointer;
}
 input[type="checkbox"] + label span {
     display: inline-block;
     width: 25px;
     height: 25px;
     margin: -2px 15px 0 0;
     vertical-align: middle;
     background-color: #fff;
     cursor: pointer;
}
 input[type="checkbox"]:checked + label span {
     background: #fff url('./Assets/Contest/tick.png') center center no-repeat;
     background-size: 17px;
}

input[type="submit"] {
    background-color: #fff;
    border: solid 2px #d20303;
    border-radius: 8px;
    padding: 23px 70px;
    font-family: 'CeraBlack';
    font-size: 20px;
    margin: 50px auto 0 auto;
    transition: all linear .1s;
}
