@charset "UTF-8";


/* @import url('https://fonts.googleapis.com/css2?family=Anton&family=Antonio:wght@700&family=Barlow+Condensed:wght@500;800&family=Big+Shoulders+Display:wght@900&display=swap'); */




@font-face {
  font-family: Nohemi;
  src: url(../fonts/Nohemi-Regular.ttf);
}

@font-face {
  font-family: NohemiMed;
  src: url(../fonts/Nohemi-Medium.ttf);
}

@font-face {
  font-family: Arial, Helvetica, sans-serif;
  src: url(../fonts/Nohemi-SemiBold.ttf);
}





/*
font-family: 'Anton', sans-serif;

font-family: 'Antonio', sans-serif;

font-family: 'Barlow Condensed', sans-serif;

font-family: 'Big Shoulders Display', cursive;
*/

/* ==========================================================================
   Main SCSS File
   ========================================================================== */
/* ==========================================================================
   normalize.css v8.0.1
   * MIT License
   * github.com/necolas/normalize.css
   ========================================================================== */
/* Document
    ========================================================================== */
/**
* 1. Correct the line height in all browsers.
* 2. Prevent adjustments of font size after orientation changes in iOS.
*/
html {
  line-height: 1.15;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */ }

/* Sections
    ========================================================================== */
/**
* Remove the margin in all browsers.
*/
body {
  margin: 0; }

/**
* Render the `main` element consistently in IE.
*/
main,
.main {
  display: block; }

/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/
h1 {
  font-size: 2em;
  margin: 0.67em 0; }

/* Grouping content
    ========================================================================== */
/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */ }

/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */ }

/* Text-level semantics
    ========================================================================== */
/**
* Remove the gray background on active links in IE 10.
*/
a {
  background-color: transparent; }

/**
* 1. Remove the bottom border in Chrome 57-
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/
abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  text-decoration: underline dotted;
  /* 2 */ }

/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
  font-weight: bolder; }

/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */ }

/**
* Add the correct font size in all browsers.
*/
small {
  font-size: 80%; }

/**
* Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sub {
  bottom: -0.25em; }

sup {
  top: -0.5em; }

/* Embedded content
    ========================================================================== */
/**
* Remove the border on images inside links in IE 10.
*/
img {
  border-style: none; }

/* Forms
    ========================================================================== */
/**
* 1. Change the font styles in all browsers.
* 2. Remove the margin in Firefox and Safari.
*/
button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */ }

/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
*/
button,
input {
  /* 1 */
  overflow: visible; }

/**
* Remove the inheritance of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritance of text transform in Firefox.
*/
button,
select {
  /* 1 */
  text-transform: none; }

/**
* Correct the inability to style clickable types in iOS and Safari.
*/
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; }

/**
* Remove the inner border and padding in Firefox.
*/
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0; }

/**
* Restore the focus styles unset by the previous rule.
*/
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText; }

/**
* Correct the padding in Firefox.
*/
fieldset {
  padding: 0.35em 0.75em 0.625em; }

/**
* 1. Correct the text wrapping in Edge and IE.
* 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
*    `fieldset` elements in all browsers.
*/
legend {
  box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */ }

/**
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/
progress {
  vertical-align: baseline; }

/**
* Remove the default vertical scrollbar in IE 10+.
*/
textarea {
  overflow: auto; }

/**
* 1. Add the correct box sizing in IE 10.
* 2. Remove the padding in IE 10.
*/
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */ }

/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto; }

/**
* 1. Correct the odd appearance in Chrome and Safari.
* 2. Correct the outline style in Safari.
*/
[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */ }

/**
* Remove the inner padding in Chrome and Safari on macOS.
*/
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

/**
* 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */ }

/* Interactive
    ========================================================================== */
/*
* Add the correct display in Edge, IE 10+, and Firefox.
*/
details {
  display: block; }

/*
* Add the correct display in all browsers.
*/
summary {
  display: list-item; }

/* Misc
    ========================================================================== */
/**
* Add the correct display in IE 10+.
*/
template {
  display: none; }

/**
* Add the correct display in IE 10.
*/
[hidden] {
  display: none; }

/* @font-face {
  font-display: auto;
  font-family: unity-bold;
  font-style: normal;
  font-weight: bold;
  src: url("../fonts/TCCC-UnityText-Bold.ttf") format("truetype"); }
@font-face {
  font-display: auto;
  font-family: unity-medium;
  font-style: normal;
  font-weight: bold;
  src: url("../fonts/TCCC-UnityText-Medium.ttf") format("truetype"); }
@font-face {
  font-display: normal;
  font-style: normal;
  font-weight: medium;
  font-family: unity-regular;
  src: url("../fonts/TCCC-UnityText-Regular.ttf") format("truetype"); }
 */
 * {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  outline: none; }





































body {
  font-size: 16px;
  font-weight: 400;
  /* background: url('../img/bg.png'); */
 }

a {
  color: #fff;
  text-decoration: none; }
  a:hover {
    text-decoration: underline; }

ul {
  list-style-type: none; }
  ul li {
    display: inline-block; }

.container {
  position: relative;
  width: 100%;
  -webkit-overflow-scrolling: touch; 
  /* height: 900px; */
  /* height: 100vh; */
  overflow: hidden;
  background: url('../img/bg-big.jpg'),  url('../img/bg-big-pruh.jpg');
  background-position: top center;
  background-repeat: repeat-x, repeat;
  background-color: #7121a4;

/* 
  background-image: url(img_flwr.gif), url(paper.gif);
  background-position: right bottom, left top;
  background-repeat: no-repeat, repeat; */
}

@media screen and (max-width: 991px) {
  .hide-mobile {
    display: none; } }

input {
  max-width: 515px; }
  @media screen and (min-width: 992px) {
    input {
      max-width: 1024px; } }

.grecaptcha-badge {
  z-index: 10000 !important; }

.label-warning {
  font-family: "unity-regular", sans-serif;
  color: #dd0d21;
  display: block;
  margin-bottom: 4px; }

@media screen and (max-width: 456px) {
  .label-warning {
    font-size: 14px;
  }
}





.header {
  position: relative;
}

@media screen and (max-width: 456px) {
  .header {
    /* height: 372px; */
  }
}

@media screen and (max-width: 667px) {
  .header {
    width: 100%;

  }
}
 
  @media screen and (min-width: 667px) {
    .header {
      /* height: 1125px; */
      background-position: center;
      /* background-size: 100%; */
      z-index: 20; 
      /* height: 720px; */
      background-size: auto;
      /* width: 100%; */
    } 
  }
  @media screen and (min-width: 1040px) {
    .header {
      /* height: 1092px; */
      /* background-image: url("../img/bg_header.jpg");
      background-position: bottom; */
    } 
  }







.header_bg {
  width: 100%;
  height: 100%;
}  

  @media screen and (max-width: 668px) {
    .header_bg {
      /* position: absolute; */
      width: 100%;
      background-size: 160%;
      height: auto;
      /* left: 50%;
      margin-left: -334px;  */

    }
  }
  @media screen and (max-width: 580px) {
    .header_bg { 
      background-size: 240%;
    }
  }
  @media screen and (max-width: 456px) {
    .header_bg {

    }
  }


  @media screen and (min-width: 1040px) {
    .header_bg {
      /*background-image: url("../img/under.jpg");
       background-position: bottom;
      background-position: bottom;  */
    } 
  }





  .header__content {
    position: relative;
    z-index: 10; }
    @media screen and (max-width: 668px) {
      .header__content {
        /* padding-top: 210px; */
        padding-top: 14px;
        padding-bottom: 96px;
      }
    }
    @media screen and (max-width: 456px) {
      .header__content {
        /* padding-top: 210px; */
        padding-top: 8px;
      }
    }
    @media screen and (max-width: 400px) {
      .header__content {
        /* padding-top: 16px; */
      }
      .main {
        margin-top: -26px;
      }
      
    }
    @media screen and (min-width: 666px) {
      .header__content {
        /* max-width: 660px; */
        margin: auto; } }
    @media screen and (min-width: 1140px) {
      .header__content {
        max-width: 920px; } }






  .header__logo {   
    text-align: center; 
    vertical-align: baseline;
    padding-top: 200px;
  }
  .header__logo img{
    display: inline-block;
    
  }
    @media screen and (max-width: 1140px) {
      .header__logo {
        background: none;
        padding-top: 280px;
        /* left: 50%;
        margin-left: -125px;  */
      } 

      .header__logo img {
        width: 620px;
    
      }
      
    }
    @media screen and (max-width: 667px) {
      .header__logo img {
        width:480px;
      }
      .header__logo {   
        padding-top: 220px;
      }
      
    }
    @media screen and (max-width: 500px) {

     .header__logo {   
        padding-top: 180px;
      }
      .header__logo img {
        width:340px;
      }

    }




    .header_gifs{
      position: absolute;
    }

    .header_gifs img{
      width: 100%;
    }




    .header_gif_ufo{
      left: -90px;
      top: -130px;
      width: 680px;
      transform: rotate(-13deg);
    }
    @media screen and (max-width: 1920px) {
      .header_gif_ufo{
        left: -90px;
        top: -80px;
        width: 480px;
      }      
    }
    @media screen and (max-width: 768px) {
      .header_gif_ufo{
        left: -73px;
        top: -41px;
        width: 290px;
      }      
    }
    @media screen and (max-width: 500px) {
      .header_gif_ufo{
        left: -53px;
        top: -16px;
        width: 190px;
      }      
    }




    .header_gif_const{
      left: -70px;
      top: 370px;
      width: 580px; 
      transform: rotate(-18deg);
    }
    @media screen and (max-width: 1920px) {
      .header_gif_const{
        top: 370px;
        width: 380px; 
      }     
    }
    @media screen and (max-width: 1600px) {
      .header_gif_const{
        top: 670px;
        width: 280px; 
      }     
    }
    @media screen and (max-width: 1040px) {
      .header_gif_const{
        /* top: 870px; */
        top: 1040px;
        width: 280px; 
        left:calc(50% - 270px);
      }     
    }
    @media screen and (max-width: 667px) {
      .header_gif_const{
        top: 870px;
        width: 280px; 
        left:calc(50% - 270px);
      }     
    }
    @media screen and (max-width: 500px) {
      .header_gif_const{
        top: 737px;
        width: 184px;
        left: calc(50% - 157px);
      }     
    }

    

    .header_logo_o2{
      right: 120px;
      top: 140px;
      width: 260px; 
    }
    @media screen and (max-width: 1600px) {  
      .header_logo_o2{
        right: 79px;
        top: 55px;
        width: 240px;
      }       
    }
    @media screen and (max-width: 768px) {  
      .header_logo_o2{
        right: 50px;
        top: 55px;
        width: 190px;
      }       
    }
    @media screen and (max-width: 500px) {  
      .header_logo_o2{
        right: 30px;
        top: 45px;
        width: 120px;
      }       
    }

    

    .header_star1{
      right: 80px;
      top: 440px;
      width: 330px; 
      transform: rotate(18deg);
    }
    @media screen and (max-width: 1920px) {
      .header_star1{
        right: 40px;
        top: 440px;
        width: 230px; 
      }  
    }
    @media screen and (max-width: 1600px) {
      .header_star1{
        right: 40px;
        top: 170px;
        width: 230px; 
      }  
    }
    @media screen and (max-width: 768px) {
      .header_star1{
        right: 32px;
        top: 120px;
        width: 172px;
      }  
    }
    @media screen and (max-width: 500px) {
      .header_star1{
        right: 14px;
        top: 100px;
        width: 120px;
      }  
    }


    

    .header_star2{
      right: 80px;
      top: 820px;
      width: 360px; 
      transform: rotate(2deg);
    }
    @media screen and (max-width: 1920px) {
      .header_star2{
        right: 60px;
        top: 820px;
        width: 260px; 
      }
    }
    @media screen and (max-width: 1600px) {
      .header_star2{
        right: 20px;
        top: 840px;
        width: 200px; 
      }
    }
    @media screen and (max-width: 1040px) {
      .header_star2{
        right: calc(50% - 233px);
        top: 1040px;
        width: 180px;
      }
    }
    @media screen and (max-width: 667px) {
      .header_star2{
        right: calc(50% - 233px);
        top: 894px;
        width: 180px;
      }
    }
    @media screen and (max-width: 500px) {
      .header_star2{
        right: calc(50% - 144px);
        top: 761px;
        width: 111px;
      }
    }


    

    .hvezda3{
      position: absolute;
      left: 100px;
      top: -146px;
      width: 362px;
      transform: rotate(18deg);
    }
    @media screen and (max-width: 1920px) {
      .hvezda3{
        position: absolute;
        left: -144px;
        top: -112px;
        width: 262px;
      }
    }
    @media screen and (max-width: 1140px) {
      .hvezda3{
        display: none;
      }
    }


    

    .blesk{
      position: absolute;
      left: -130px;
      top: 120px;
      width: 800px;
      transform: rotate(-13deg);
    }
    @media screen and (max-width: 1920px) {
      .blesk{
        position: absolute;
        left: -90px;
        top: 120px;
        width: 600px;
      }
    }
    @media screen and (max-width: 1400px) {
      .blesk{
        position: absolute;
        left: -90px;
        top: 170px;
        width: 400px;
      }
    }
    @media screen and (max-width: 667px) {
      .blesk{
        position: absolute;
        left: 30px;
        top: 140px;
        width: 360px;
      }
    }
    @media screen and (max-width: 467px) {
      .blesk{
        position: absolute;
        left: 0px;
        top: 230px;
        top: 230px;
        width: 300px;
      }
    }


    

    .ufo2{
      position: absolute;
      right: -80px;
      top: 80px;
      width: 600px;
      transform: rotate(-18deg);
    }
    @media screen and (max-width: 1920px) {
      .ufo2{
        position: absolute;
        right: -80px;
        top: 120px;
        width: 400px;
      }
    }
    @media screen and (max-width: 1400px) {
      .ufo2{
        position: absolute;
        right: -80px;
        top: 160px;
        width: 300px;
      }
    }
    @media screen and (max-width: 667px) {
      .ufo2{
        position: absolute;
        right: -30px;
        top: 100px;
        width: 220px;
      }
    }

    

    .img100 img{
      width: 100%;
    }




  .main__search__text{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 19px;
    color: white;
    margin-top: 90px;
    width: 72%;
    margin-left: 14%;
    line-height: 130%;
  }


  .candidates__pick-artist{
    margin-top: 220px;
  }
    @media screen and (max-width: 1920px) {
      .candidates__pick-artist{
        margin-top: 120px;
      }
    }










    .artist__title{
      position: relative;
      width: auto;
    }


    .header__artist{
      font-family: "unity-bold", sans-serif;
      color: rgb(214, 0, 0);
      font-size: 40px;
      font-weight: 400;
      position: absolute;
      text-align: center; 
      top: 38px;
      left: 50%;
      margin-left: -170px;
    }
    .header__grat{
      font-family: "unity-bold", sans-serif;
      color: rgb(255, 255, 255);
      font-size: 56px;
      font-weight: 800;
      text-align: center;
    }



    @media screen and (max-width: 1366px) {
      .container {
        /* height: 860px; */
      }      
    }
    @media screen and (max-width: 1140px) {
      .header__artist{
        font-size: 28px;
        top: 25px;
        /* left: 50%;
        margin-left: -122px; */
      }  
      .header__grat{
        font-size: 38px;
      }  

      .container {
        /* height: 720px; */
      }   

    }
    @media screen and (max-width: 667px) {
      .header__artist{
        font-size: 22px;
        top: 20px;
        left: 50%;
        margin-left: -94px;
      }  
      .header__grat{
        font-size: 29px;
      }  
    }





      
  .header__title {
    color: #fff;
    font-size: 22px;
    font-family: Arial, Helvetica, sans-serif;
    letter-spacing: 0.05rem;
    text-transform: uppercase;
    text-align: center;
    display: block;
    line-height: 140%;
    width: 240px;
    margin: 0px auto 6px auto; } 
    @media screen and (min-width: 320px) {  
      .header__title {
        width: 82%;
        white-space: pre-line;
        font-size: 18px;
        margin-bottom: 5px;
        margin-top: 60px;
        letter-spacing: 0px;
       } 
      }
    @media screen and (min-width: 667px) {
      .header__title {
        width: 600px;
        margin-top: 40px;
        white-space: pre-line;
        /* font-size: 28px; */
        margin-bottom: 5px;
        font-size: 28px;
      } }
    @media screen and (min-width: 1140px) {
      .header__title {
        font-size: 43px;
        margin-top: 32px;
        margin-bottom: 40px; 
        width: 805px;
      } }






  .header__subtitle {
    display: block;
    margin-left: auto; 
    margin-right: auto;
    margin-top: 32px;
    margin-bottom: 28px;
    color: #fff;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 400;
    text-transform: uppercase;
    text-align: center;
    font-size: 26px;
    width: 80%;
  }    
  
    @media screen and (max-width: 1140px) {
      .header__subtitle {
        width: 400px;
        font-size: 20px; 
        margin-bottom: 70px;
      } 
    }

    @media screen and (max-width: 667px) {
      .header__subtitle {
        font-size:18px;
        
      }
    }
    @media screen and (max-width: 500px) {
      .header__subtitle {
        font-size: 16px;
        margin-top: 20px;
        margin-bottom: 20px;   
        width: 80%;     
      }
    }





  .header__cta {
    display: block;
    /* width: 138px; */
    margin: 0 auto;
    background-image: linear-gradient( #ff5400, #ff0000);
    
    color: #fff;
    border-radius: 8px;
    padding:12px 22px 7px 22px;
    font-size: 25px;  
    text-transform: uppercase;
    /* font-family: "unity-bold", sans-serif;
    font-family: 'Anton', sans-serif; 
    font-family: 'Antonio', sans-serif;*/
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 600;
    letter-spacing: 0.05rem;


    border: none;
    transition: 0.3s;
    cursor: pointer; }
    .header__cta:hover, .header__cta:focus {
      color: #6724b5;
      background-image: linear-gradient( #fff, #fff);
    }

      @media screen and (max-width: 667px) {
        .header__cta {
          padding: 10px 36px;
          font-size: 18px; 
          margin-bottom: 44px; 
        }
      }
      @media screen and (max-width: 500px) {
        .header__cta {
          padding: 12px 36px 8px 36px;
          font-size: 18px; 
          margin-top: 44px;    
        }
      }

    @media screen and (min-width: 992px) {
      .header__cta {
        padding: 14px 42px;
        font-size: 20px; 
        width: auto;
        margin-bottom: 44px;  
      } 
    }
    @media screen and (min-width: 1040px) {
      .header__cta {
        padding:10px 22px 9px 22px;
        font-size: 25px; 
      } }



  .header__scroll {
    display: block;
    border: 2px solid #fff;
    position: relative;
    width: 28px;
    height: 46px;
    border-radius: 14px;
    margin: 0 auto;
  }
    @media screen and (max-width: 991px) {
      .header__scroll {
        display: none; } }
    .header__scroll::after {
      content: '';
      display: block;
      width: 11px;
      height: 11px;
      border-top: 1px solid #fff;
      border-right: 1px solid white;
      position: absolute;
      bottom: -20px;
      left: calc(50% - 5.5px);
      transform: rotate(135deg); }
  .header__mouse-wheel {
    width: 2px;
    height: 10px;
    display: block;
    margin: auto;
    background-color: #fff;
    border-radius: 1px;
    position: relative;
    top: 4px;
    animation: scroll 3s infinite; }

@keyframes scroll {
  0% {
    transform: translateY(0); }
  50% {
    transform: translateY(20px); }
  100% {
    transform: translate(0); } }
















.main {
  text-align: center;
  width: 100%;
  position: relative;
  margin-top: -57px;
  padding: 0 15px; 
  /* background: url(../img/bg22.png); */
}



/*   @media screen and (min-width: 992px) {
    .main {
      margin-top: 0px; } } */
     
   
  .main__content {
    padding: 50px 0; 
    padding-top: 530px;
    max-width: 650px;
    margin-left: auto;
    margin-right: auto; 
  }
    @media screen and (min-width: 768px) {
      .main__content {
        max-width: 80%;
        margin-left: auto;
        margin-right: auto; 
        padding-top: 460px;
      } }
    /* @media screen and (min-width: 992px) {
      .main__content {
        max-width: 905px;
        margin: auto;
        padding-top: 250px; }  
      } */
    @media screen and (min-width: 1040px) {
      .main__content {
        padding-top: 120px;  
        width: 100%; 
      } 
    }

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

      .main {
        margin-top: -24px;
      }
      .main__content {
        padding-top: 300px;
      } 
      
      
    }
    @media screen and (max-width: 500px) {

      .main {
        margin-top: -24px;
      }
      .main__content {
        padding-top: 200px;
      } 
      
    }


  .main__dirt {
    position: absolute;
    z-index: -1;
    width: 100vw;
    height: 100%;
    left: calc(-50vw + 50%);
    /* background-image: url("../img/bg.jpg"); */
    background-size: 400px;
    /* opacity: 0.61; */ }
    @media screen and (min-width: 992px) {
      .main__dirt {
        background-size: 400px; } }



  .main__title {
    font-family: Arial, Helvetica, sans-serif;
    color: #fff;
    font-size: 22px;
    line-height: 130%; 
    margin-bottom:14px;
    margin-top: 0px;
    text-transform: uppercase; }
    @media screen and (min-width: 400px) {
      .main__title {
        margin-top: 12px; 
      font-size: 22px;} }
    @media screen and (min-width: 768px) {
      .main__title {
        font-size: 28px;
        margin-bottom: 34px;
        margin-top: 50px; } }
    /* @media screen and (min-width: 992px) {
      .main__title {
        font-size: 26px;
        width: 532px; 
        margin: 0 auto 40px auto; } } */
    @media screen and (min-width: 1040px) {
      .main__title {
        font-size: 36px;
        letter-spacing: 2.2px;
        margin-bottom: 30px; 
        margin-top: 140px;
      } 
    }

  @media screen and (min-width: 768px) {
    .main__lead:last-of-type {
      margin-bottom: 40px; } }

  .main__lead, .main__link {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 400;
    font-size:18px;
    color: #fff;
    width: 90%;
    margin-left: 5%;
  }
    @media screen and (min-width: 768px) {
      .main__lead, .main__link {
        font-size: 19px;
        margin-bottom: 18px; } }
    @media screen and (min-width: 992px) {
      .main__lead, .main__link {
        font-size: 19px;
        width: 800px;
        margin: 0 auto 42px auto; } }
    @media screen and (min-width: 1040px) {
      .main__lead, .main__link {
        width:100%;
        font-size: 28px;
        line-height: 130%;
        margin-bottom: 22px; } }


  .main__lead{
    margin-top: 60px; 
    margin-bottom: 50px; 
    line-height: 120%;
  }

  .main__lead__sub{
    font-size: 22px !important;
    margin-top: 30px; 
  }
    @media screen and (max-width: 500px) {
      .main__lead__sub {
        font-size: 16px !important;
       } }
  

  .main__link {
    color: #b47bf6; 
    color: #fd8801; 
    margin-left: 0%;
  }
  .main__rules-cta {
    background-color: #dd0d21;
    color: #fff;
    font-family: Arial, Helvetica, sans-serif;
    display: block;
    font-size: 10px;
    text-transform: uppercase;
    padding: 14px 30px;
    width: 206px;
    border: none;
    border-radius: 6px;
    margin: 20px auto 82px auto;
    transition: 0.3s;
    cursor: pointer; }
    .main__rules-cta:focus, .main__rules-cta:hover {
      background-color: #fff;
      color: #dd0d21;
      text-decoration: none; }
    @media screen and (min-width: 992px) {
      .main__rules-cta {
        font-size: 24px;
        padding: 28px 38px;
        width: 315px;
        margin-bottom: 180px; } }
    @media screen and (min-width: 1140px) {
      .main__rules-cta {
        margin-bottom: 60px;
        font-size: 18px; } }



        

  .main__search-container {
        max-width: 690px;
        margin: 120px auto 0px auto; 
    background-color: white;
    border-radius: 20px;
  } 
        


  @media screen and (max-width: 940px) {
      .main__search-container {
        width: 90%;
        max-width: 90%;
      } 

      .main__search-container input{
        width: calc(100% - 180px);
      }
    }

  @media screen and (max-width: 648px) {
      .main__search-container {
        background-color: transparent;
      }     
      .main__search-container input{
        width:100%;
      } 
    }




  .main__search-favorite, .main__input, .main__checkbox--wrapper span::before {
    font-family: "unity-regular", sans-serif;
    font-size: 18px;
    color: #701185;
    background-color: #fff;
    /* width: 100%; */
    border: 1px solid transparent;
    box-shadow: none;
    transition: 0.3s;
    text-align: left;
    padding: 18px 32px;
    border-radius: 8px;
    display: inline-block;
    margin: 10px auto 14px auto;
    width: 90%;

  }
    .main__search-favorite:focus, .main__search-favorite:hover, .main__input:focus, .main__checkbox--wrapper span:focus::before, .main__input:hover, .main__checkbox--wrapper span:hover::before {
      border: 1px solid #989898; }
    @media screen and (min-width: 468px) {
      .main__search-favorite, .main__input, .main__checkbox--wrapper span::before {
        padding: 20px 25px 20px 35px;
        margin-bottom: 6px;
        margin-top: 6px;
        font-size: 22px;
        max-width: 515px; 
       /*  width: auto; */
      } 
    }

    ::placeholder {
      font-family: Arial, Helvetica, sans-serif;
      color: #701185;
      letter-spacing: 0.05rem;
      opacity: 1; /* Firefox */
    }    


  .main__input.main__input--invalid, .main__checkbox--wrapper span.main__input--invalid::before {
    border: 1px solid red; }
  .main__input.main__input--valid, .main__checkbox--wrapper span.main__input--valid::before {
    border: 1px solid green; }
  @media screen and (min-width: 992px) {
    .main__input, .main__checkbox--wrapper span::before {
      margin-bottom: 26px; } }


  .main__button {
    font-family: Arial, Helvetica, sans-serif;

    font-size: 20px;
    /* width: 138px; */
    margin-bottom: 46px;
    text-transform: uppercase;
    color: #fff;
    border: none;
    border-radius: 16px;
    padding: 16px 40px;
    background-color: #4d0077;
    /* background-image: url("../img/white_overlay.png"); */
    background-size: cover;
    transition: 0.3s;
    cursor: pointer; }
    @media screen and (min-width: 468px) {
      .main__button {
        font-size: 18px;
        width: 208px; } }
    @media screen and (min-width: 768px) {
      .main__button {
        padding: 40px 30px;
        font-size: 36px;
        width: 360px;
        margin-bottom: 150px; } }


    @media screen and (min-width: 468px) {
      .main__button.main__button--search {
        padding: 13px 18px 12px 18px;
        margin-bottom: 14px;
        width: 33%;
        font-size: 23px;
        max-width: 150px; 
        margin-right: 10px;
      } }


    .main__button:hover, .main__button:focus {
      background-color: #3c1751;
      color: #fd8801; }
    .main__button.main__button--red {
      /* background-color: #fd8801; */
      background-image: linear-gradient( #ff5400, #ff0000);
      color: #fff;
      size: 14.79pt;
      padding: 21px 38px 15px 38px;
      display: block;
      /* width: 188px; */
      margin-left: auto;
      margin-right: auto;
      border: 1px solid transparent; }
      @media screen and (min-width: 768px) {
        .main__button.main__button--red {
          /* width: 305px; */ 
        } }
      @media screen and (min-width: 992px) {
        .main__button.main__button--red {
          /* width: 315px;  */
        } }
      .main__button.main__button--red:hover, .main__button.main__button--red:focus {
        background-image: linear-gradient( #fff, #fff);
        color: #630596;
        border: 1px solid #989898; }

  .main__voted {
    text-transform: uppercase;
    font-family: "unity-medium", sans-serif;
    font-size: 16pt;
    margin-bottom: 30px; }
    .main__voted b {
      color: #dd0d21;
      font-family: "unity-bold", sans-serif;
      font-size: 18.65pt; }
    @media screen and (min-width: 992px) {
      .main__voted {
        font-size: 28px; }
        .main__voted b {
          font-size: 36px; } }
  .main__nominees {
    width: 100%;
    max-width: 280px;
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto 32px auto;
    justify-content: space-between; }
    @media screen and (min-width: 992px) {
      .main__nominees {
        max-width: 905px;
        margin-bottom: 90px;
        text-align: left; } }
    @media screen and (min-width: 1140px) {
      .main__nominees {
        max-width: 775px;
        margin-bottom: 50px; } }
    .main__nominees .nominees__heading {
      width: 13%;
      display: block;
      font-size: 10px;
      color: #000;
      font-family: "unity-regular", sans-serif;
      text-transform: uppercase; }
      @media screen and (min-width: 992px) {
        .main__nominees .nominees__heading {
          font-size: 24px; } }
      @media screen and (min-width: 1140px) {
        .main__nominees .nominees__heading {
          font-size: 18px; } }
    .main__nominees .nominees__dots {
      width: 70%;
      display: block;
      overflow: hidden;
      background-image: url("../img/Dots.png");
      background-repeat: repeat-x;
      background-position: center center;
      background-size: 655px; }
      @media screen and (min-width: 992px) {
        .main__nominees .nominees__dots {
          width: 80%;
          background-size: 735px; } }


  .main__social-container {
    width: 188px;
    margin: 0 auto;
    margin-top:150px;
    display: flex;
    justify-content: space-evenly;
    cursor: pointer; }
    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
      .main__social-container {
        justify-content: space-around; } }
    @supports (-ms-ime-align: auto) {
      .main__social-container {
        justify-content: space-around; } }
    @media screen and (min-width: 992px) {
      .main__social-container {
        width: 188px;
        margin-bottom: 92px; } }

    .main__social-container .main__icon {
      height: 56px;
      width: 56px;
      padding: 10px;
      border: 3px solid #dd0d21; 
      border-radius: 50%; 
    }
      @media screen and (min-width: 420px) {
        .main__social-container .main__icon {
          height: 62px;
          width: 62px;
          padding: 10px;
          border: 3px solid #dd0d21; 
        } }
      @media screen and (min-width: 992px) {
        .main__social-container .main__icon {
          height: 76px;
          width: 76px;
          padding: 10px;
          border: 4px solid #dd0d21; 
        } }


  .main__confirmation {
    font-family: "unity-bold", sans-serif;
    color: #fff;
    font-size: 14px;
    margin-bottom: 16px;
    text-transform: uppercase; }
    @media screen and (min-width: 992px) {
      .main__confirmation {
        font-size: 36px;
        width: 532px;
        margin: 0 auto 70px auto; } }
    @media screen and (min-width: 1140px) {
      .main__confirmation {
        font-size: 21px;
        letter-spacing: 2.2px;
        margin-bottom: 24px; } }



  #for_agreement{
    margin-bottom: 10px;
  }      
  #for_agreement2{
    margin-bottom: 50px;
  }

  .main__checkbox--wrapper {
    margin-bottom: 30px;
    overflow: hidden;
    display: inline-block;
    cursor: pointer; }
    .main__checkbox--wrapper input {
      visibility: hidden; 
      margin-left: -12px;
    }
    .main__checkbox--wrapper span {
      position: relative;
      line-height: 30px;
      margin-right: 10px; }
      .main__checkbox--wrapper span::before {
        display: inline-block;
        content: "";
        width: 30px;
        height: 30px;
        position: relative;
        margin: 0;
        padding: 0;
        top: 9px;
        border-color: #989898; }
    .main__checkbox--wrapper a {
      font-family: Arial, Helvetica, sans-serif;
      font-size: 12px;
      color: #fd8801;
      text-decoration: underline; 
    }
    @media screen and (min-width: 540px) {
      .main__checkbox--wrapper a {
        font-size: 20px;
      } }


    .main__checkbox--wrapper input:checked ~ span::after {
      display: inline-block;
      content: "";
      z-index: 10;
      width: 15px;
      height: 15px;
      background-color: green;
      position: absolute;
      top: 0px;
      left: 9px;
      border-radius: 4px; }
    .main__checkbox--wrapper.main__input--invalid span::before {
      border-color: #dd0d21; }
    .main__checkbox--wrapper.main__input--valid span::before {
      border-color: green; }

.loading-spinner {
  display: block;
  margin: 0 auto;
  margin-top: 120px;
  width: 70%;
  max-width: 120px; }




 

.footer {
  width: 100%;
  position: relative;
  /* left: calc(-50vw + 50%); */
  /* background-image: url("../img/footer22.png"); */
  /* background-size: cover; */
  background-position: center center;
  background-repeat: no-repeat;
  background-color: #00000046;
  min-height: 270px;
  text-align: center;
  margin-top: 70px;
  padding-bottom: 60px;
  z-index: 99; }
  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .footer {
      bottom: -100px; } }
  @media screen and (min-width: 992px) {
    .footer {
      /* margin-top: -105px; */ } }


  .footer__content {
    padding-top: 110px;
    position: relative;
    z-index: 1000; }
    @media screen and (min-width: 992px) {
      .footer__content {
        padding-top: 110px;
        max-width: 905px;
        margin-left: auto;
        margin-right: auto; } }



  .footer__logo {
    width: 306px;
    margin-bottom: 24px; }
    @media screen and (max-width: 768px) {
      .footer__logo {
        width: 260px; } }





  .footer__perex {
    width: 90%;
    color: #fff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;
    margin: 0 auto;
    line-height: 22px;
    padding-bottom: 40px; 
    /* text-transform: uppercase; */
  }


    @media screen and (min-width: 768px) {
      .footer__perex {
        font-size: 16px;
        width: 650px; 
        line-height: 26px;
        padding-bottom: 160px; 
      } }
    @media screen and (min-width: 992px) {
      .footer__perex {
        font-size: 18px;
        line-height: 32px;
        width: 100%;
        padding-bottom: 60px; 
      } 
    }

/* ==========================================================================
   Candidates
   ========================================================================== */
.candidates {
  min-height: 550px; 
  position: relative; 
}
  .candidates__number {
    margin: 0 auto;
    margin-bottom: 0px;
    vertical-align: bottom;
    font-family: "unity-medium", sans-serif;
    font-size: 21pt;
    display: inline-block;
    position: relative;
    color: #dc0016;
    width: 46px;
    height: 46px;
    border: 3px solid #dc0016;
    border-radius: 50%;  
    padding-top: 2px;
    padding-right: 2px;    
  }
  .candidates__number3 {
    padding-right: 0px;    
  }

   @media screen and (max-width: 992px) {
      .candidates__number {
        width: 36px;
        height: 36px;
        border: 2px solid #dc0016;
        font-size: 23px;
        padding-right: 1px;
      } 
    }

   @media screen and (max-width: 460px) {
      .candidates__number {
        width: 29px;
        height: 29px;
        border: 2px solid #dc0016;
        font-size: 20px;
        padding-right: 2px;
        padding-top: 0px;

      } 
    }

    @media screen and (min-width: 992px) {
      .candidates__number {
        /* font-size: 21pt;
        display: inline-block;
        position: absolute;
        left: 106 px;
        top: 140px;   */      

      } }
    @media screen and (min-width: 1140px) {
      .candidates__number {
        /* font-size: 21pt;  */
      
      } }


    #confirm-selection .candidates__number {
          

      }
    @media screen and (max-width: 460px) {
      #confirm-selection .candidates__number {

        padding-right: 0px;
        padding-top: 0px;

      } 
    }

      



  .candidates__heading {
    font-family: Arial, Helvetica, sans-serif;
    color: #fff;
    text-transform: uppercase;
    margin-bottom: 13px; 
    line-height: 150%;
    display: inline-block;
    vertical-align: bottom;
    margin-left: 8px;
    font-size: 40px;
    letter-spacing: 1.4px;    
  }
    
  @media screen and (max-width: 992px) {
    .candidates__heading {

      font-size: 28px;
      margin-left: 0px;

    } 
  }

  @media screen and (max-width: 460px) {
    .candidates__heading {

      font-size: 22px;
      letter-spacing: normal;
      margin-left: 4px;
      margin-bottom: 8px;
      margin-top: 30px;

    } 
  }



  .candidates__warning, .candidates__response {
    font-family: "unity-bold", sans-serif;
    color: #fff;
    font-size: 14px;
    margin-bottom: 16px;
    text-transform: uppercase; }
    @media screen and (min-width: 992px) {
      .candidates__warning, .candidates__response {
        font-size: 36px;
        width: 532px;
        margin: 0 auto 70px auto; } }
    @media screen and (min-width: 1140px) {
      .candidates__warning, .candidates__response {
        font-size: 21px;
        /* letter-spacing: 2.2px; */
        margin-bottom: 24px; } }

  .candidates__target {
    display: block;
    margin: auto; }





  .candidates__confirmed {
    padding-top: 140px; }
  .candidates__response {
    padding-top: 140px;
    display: block; }

/* ==========================================================================
   Candidates
   ========================================================================== */

  .candidates__heading-container {
    /* background-image: url("../img/mrak.png"); 
    height: 360px;*/
    background-size: 100%;
    padding-top: 128px;
    width: 70%;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
    /* padding: 0 40px; */
    margin-bottom: 50px;
    position: relative;

    
  } 
   /* @media screen and (min-width: 992px) {
      .candidates__heading-container {
        
        
      } 
    }  */

   @media screen and (max-width: 992px) {
      .candidates__heading-container {
        /* height: 250px; */
        padding-top: 88px;
        width: 420px;
      } 
    } 

   @media screen and (max-width: 460px) {
      .candidates__heading-container {
        /* height: 180px; */
        padding-top: 66px;
        width: 320px;
      } 
    } 




.cards-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  margin-bottom: 60px; }
/*   @media screen and (min-width: 992px) {
    .cards-container {
      justify-content: end;
      } }
  @media screen and (min-width: 1140px) {
    .cards-container {
      
      margin: auto;
      justify-content: start; } }
  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .cards-container {
      justify-content: space-around; } }
  @supports (-ms-ime-align: auto) {
    .cards-container {
      justify-content: space-around; } } */




.card {
  width: 255px;
  height: 289px;
  position: relative;
  cursor: pointer;
  margin: 0 24px 40px 24px;
  border-radius: 10px;
  overflow: hidden;
  color: white;
  transition: all ease-out 0.3s;
  background-image: url(../img/okno.png);
  text-align: right;
}

  @media screen and (min-width: 992px) {
    .card {
    } }
  @media screen and (min-width: 1140px) {
    .card {
    } }

    .card:hover{
    }
    .card:hover .card__image img{
      opacity: 0.7;
    }
    
    .card:hover .card__vote{
      background-color: #6c01a5;
      color: white;
    }



  .card__image {
    transition: all ease-out 0.3s;
    display: block;
    width: 100%;
    height: 231px;
    overflow: hidden;
    position: relative;
    z-index: 4; 
    background-color: #3c1751;
  }
    @media screen and (min-width: 992px) {
      .card__image {

      } }
    @media screen and (min-width: 1140px) {
      .card__image {

      } }

  .card__image img {
    width: 100%;
    height: auto;
  }

  .card__body {
    width: 244px;
    height: 278px;   
    text-align: center; 
    float: right;
    border-radius: 20px;
    overflow: hidden;
  }

  .card__body {
    /* border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    background-color: #fff;
    margin-top: -24px;
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 77px;  */
  }
/*     @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
      .card__body {
        display: block; } }
    @media screen and (min-width: 992px) {
      .card__body {
        margin-top: -70px;
        min-height: 136px; } }
    @media screen and (min-width: 1140px) {
      .card__body {
        margin-top: -33px;
      } } */

   .card__title {
    font-size: 32px;
    font-family: Arial, Helvetica, sans-serif;
    text-transform: uppercase;
    font-weight: 600;
    position: absolute;
    width: 100%;
    height: 90px;
    bottom: 0px;
    left: 0;
    color: #ffa600;
    background-image: linear-gradient( #680c9900, #670c99);
    padding-bottom: 5px;
    display: flex;
    justify-content: center;

  }
    @media screen and (min-width: 992px) {
      .card__title {
        /* font-size: 16px;  */
      } } 


   .card__title span{
    align-self: flex-end;
   }





    .card__vote{
      transition: all ease-out 0.2s;
      font-family: Arial, Helvetica, sans-serif;
      font-weight: 600;
      color: #630596;
      text-transform: uppercase;   
      padding-top:9px;  
      padding-bottom: 12px;  
      font-size: 25px; 
    }



    .card_cf__title{
      margin-top: 10px;
    }



  .card.card--confirm {
    font-family: "unity-regular", sans-serif;
    text-transform: uppercase;   
    margin-top: 15px;  
    font-size: 16px; 

    margin-left: auto;
    margin-right: auto; 
    margin-bottom: 70px;
  }
    .card.card--confirm::after {
      /* content: 'Vybráno';  */
    }
    .card.card--confirm:hover, .card.card--confirm:focus {
      transform: none; }
    @media screen and (min-width: 992px) {
      .card.card--confirm {
        font-size: 18px; } }


    .card.card--confirm::after {
      /* background-color: #f9c020; */
      color: #fff; }
    .card.card--confirm .card__title {
      color: #faa107; 
    }
    .card.card--confirm .card__body {
      /*padding-top: 12px;
       background-color: #dd0d21;
      background-image: url("../img/white_overlay.png");
      background-size: cover;  */
    }
      .card.card--confirm .card__body::before {
        background-color: #fff; }


 
  .card.card--confirmed {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 120px;
    cursor: default; }
    .card.card--confirmed:hover {
      transform: none; }
    .card.card--confirmed .card__confetti {
      width: 282px;
      position: absolute;
      right: calc(50% - 141px);
      top: -20px;
      transform: scale(0);
      transition-delay: 1s;
      transition-duration: 0.8s;
      transition-timing-function: ease-out; }
      @media screen and (min-width: 992px) {
        .card.card--confirmed .card__confetti {
          width: 410px;
          right: calc(50% - 205px);
          top: -34px; } }
      .card.card--confirmed .card__confetti.card__confetti--active {
        transform: scale(1); }
    .card.card--confirmed .card__title {
      color: #fff;
      font-family: "unity-medium", sans-serif; }
    .card.card--confirmed .card__body {
      /* background-image: url("../img/white_overlay.png"); */
      background-size: cover;
      background-color: #dd0d21;
      border-bottom-right-radius: 10px;
      border-bottom-left-radius: 10px; }
      @media screen and (min-width: 992px) {
        .card.card--confirmed .card__body {
          padding-bottom: 20px; } }
      .card.card--confirmed .card__body::before {
        background-color: #fff; }
    .card.card--confirmed::after {
      display: none; }

.container.container--pre-contest {
  /* background-image: url("../img/background-pre-contest-small.jpg"); */
  overflow: hidden;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  position: relative;
  padding: 0;
  height: 100vh;
  height: calc(var(--vh, 1vh) * 100); }
  @media (orientation: landscape) {
    .container.container--pre-contest {
      background-position: bottom; } }
  @media screen and (min-width: 992px) {
    .container.container--pre-contest {
      background-position: center;
      background-image: url("../img/background-pre-contest-large.jpg"); } }
  @media screen and (min-width: 1140px) {
    .container.container--pre-contest {
      background-image: url("../img/background-pre-contest.png"); } }

.header.header--pre-contest {
  background-image: none;
  height: 100%;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: unset;
  /*   @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {  
        width: 500px;
    } */ }

.header__logo.header__logo--pre-contest {
  margin-top: 0;
  margin-bottom: 32px;
  width: 100%;
  max-width: 515px; }
  @media (orientation: landscape) {
    .header__logo.header__logo--pre-contest {
      width: 50%; } }

.header__content.header__content--pre-contest {
  padding-top: 0;
  width: 50%; }
  @media screen and (min-width: 992px) {
    .header__content.header__content--pre-contest {
      width: auto;
      height: auto; } }
  @media screen and (min-width: 1024px) {
    .header__content.header__content--pre-contest .header__logo {
      margin-bottom: 32px; } }

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .header__content.header__content--pre-contest {
    width: 500px; } }

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .header__content.header__content--pre-contest {
    width: 500px; } }
.header__title.header__title--pre-contest {
  width: 90%; }



.header__title.header__title--pre-content {
  width: 90%; }
  @media screen and (min-width: 992px) {
    .header__title.header__title--pre-content {
      font-size: 18px; } }

@media screen and (min-width: 992px) {
  .header__title.header__title--pre-content {
    font-size: 18px; } }

.artist__container {
  width: 128px;
  height: 128px;
  margin: auto;
  text-align: center;
  margin-bottom: 50px;
  transform: rotateY(90deg); }

.artist__container.artist__container--active {
  transition-duration: 0.3s;
  transition-timing-function: cubic-bezier(0.42, 0, 1, 1);
  transform: rotateY(0); 
  overflow: hidden;
  border-radius: 50%;
}
  
.icon {
  position: relative;
  width: 100%;
  height: 100%; }
  .icon img {
    width: 100%;
    height: 100%;
    border-radius: 50%; }
  .icon__confetti {
    position: absolute;
    z-index: -1;
    width: 300% !important;
    height: 300% !important;
    top: -145px;
    left: -125px; }
  .icon::after {
    animation: shine 5s ease-in-out infinite;
    animation-fill-mode: forwards;
    content: '';
    position: absolute;
    top: -110%;
    left: -210%;
    width: 200%;
    height: 200%;
    opacity: 0;
    transform: rotate(30deg);
    background: rgba(255, 255, 255, 0.13);
    background: linear-gradient(to right, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 0.13) 77%, rgba(255, 255, 255, 0.5) 92%, rgba(255, 255, 255, 0) 100%); }

@keyframes shine {
  10% {
    opacity: 1;
    top: -30%;
    left: -30%;
    transition-property: left, top, opacity;
    transition-duration: 0.7s, 0.7s, 0.15s;
    transition-timing-function: ease; }
  100% {
    opacity: 0;
    top: -30%;
    left: -30%;
    transition-property: left, top, opacity; } }
.artist__image {
  margin-bottom: 40px; }
.artist__heading {
  text-transform: uppercase;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 18px;
  opacity: 0;
  transform: translateY(30px);
  color: #fff; }
  .artist__heading.artist__heading--active {
    transition-duration: 0.7s;
    opacity: 1;
    transform: translateY(0); }
.artist__subheading {
  text-transform: uppercase;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 22px;
  color: #fff;
  transform: translateY(30px);
  opacity: 0; }
  .artist__subheading.artist__subheading--active {
    transition-duration: 0.7s;
    opacity: 1;
    transform: translateY(0); }

/*# sourceMappingURL=style.css.map */




/*--------------2020---------------*/



.card:nth-child(8) .card__title{
  font-size: 26px;
}

.card:nth-child(15) .card__title{
  font-size: 26px;
}

.card:nth-child(25) .card__title{
  font-size: 26px;
}

.card:nth-child(26) .card__title{
  font-size: 26px;
}

.card:nth-child(29) .card__title{
  font-size: 26px;
}
.card:nth-child(36) .card__title{
  font-size: 26px;
}

.card:nth-child(41) .card__title{
  font-size: 22px;
}
.card:nth-child(42) .card__title{
  font-size: 22px;
}


/* .card:nth-child(7) .card__title{
  font-size: 13px;
  padding-top: 13px;
}

.card:nth-child(18) .card__title{
  font-size: 13px;
  padding-top: 12px;
}
.card:nth-child(23) .card__title{
  font-size: 13px;
  padding-top: 12px;
} */



 
/*--------------2021---------------*/

html, body{
  width: 100%;
  height: 100%;
}

.body_uc{
  width: 100%;
  height: 100%;  
  background: url('../img/bg_uc_sm_bg.jpg');
}

.container_uc{
  height: 100%;
  background: url('../img/bg_uc.jpg') no-repeat;
  background-size: contain;
  background-size: 100%;
  /* background-color: #f8bd02; */
  background-position: right center;
}

.uc__text{
  position: absolute;
  color: white;
  left:5%;
  top:50%;
  margin-top: -69px;
  width: 40%;
}

.uc__text h1{
  font-size: 2.4rem;
  text-transform: uppercase;
  font-family: "unity-bold", sans-serif;
  font-weight: 600;
  margin: 0 0 0px 0;
}
.uc__text h2{
  font-size: 1.8rem;
  font-family: "unity-regular", sans-serif;
  font-weight: 400;
}



@media screen and (max-width: 1560px) {
  .uc__text h1 {
    font-size: 2.0rem;
  } 
  .uc__text h2{
    font-size: 1.5rem;
  }
}

@media screen and (max-width: 1300px) {
  .uc__text h1 {
    font-size: 1.6rem;
  } 
  .uc__text h2{
    font-size: 1.2rem;
  }
}
@media screen and (max-width: 1050px) {
  .uc__text h1 {
    font-size: 1.3rem;
  } 
  .uc__text h2{
    font-size: 0.9rem;
  }
}
@media screen and (max-width: 840px) {
  .uc__text h1 {
    font-size: 2.3rem;
  } 
  .uc__text h2{
    font-size: 1.9rem;
  }
  .container_uc{
    /* background: url('../img/bg_uc_sm.jpg') no-repeat; */
    background-size: 100%;
    background-position: 0 -100px;
  }

  .uc__text{
    position: absolute;
    color: white;
    left:10%;
    top:0px;
    margin-top: 15%;
    width: 80%;
    text-align: center;
  }  
    
}
@media screen and (max-width: 674px) {
  .uc__text h1 {
    font-size: 2.0rem;
  } 
  .uc__text h2{
    font-size: 1.7rem;
  }
  .container_uc{
    background-position: 0 -30px;
  }  
}

@media screen and (max-width: 524px) {
  .uc__text h1 {
    font-size: 1.6rem;
  } 
  .uc__text h2{
    font-size: 1.4rem;
  }
  .container_uc{
    background-position: 0 0px;
  }  
}

@media screen and (max-width: 420px) {
  .uc__text h1 {
    /*font-size: 1.5rem;*/
    margin-bottom: 10px;
  } 
  .uc__text h2{
    /*font-size: 1.3rem;*/
  }
  .container_uc{
    background-position: center bottom;
  }  
  .uc__text{
    margin-top: 20%;
  }   

}



 
/*--------------2022---------------*/



.under{
  width: 100%;
  
}

.under img{
  width: 100%;
  max-width: 100%;
}
.under_mob{
  display: none;
}
@media screen and (max-width: 900px) {
  .under_mob{
    display: block;
  }
  .under_desk{
    display: none;
  }
} 

.cont__under{
  height: 100%;
  background-color: black;
}




.submit__labels{
  max-width: 800px;
  margin: auto;
  margin-bottom: 60px;
}