@media only screen and (min-width: 631px) {
    body{
        margin: 0;
    }
    .se-header-icon-group a:hover,
    .mySlides a:hover,
    .container a:hover,
    .se-footer a:hover {
        filter: brightness(90%);
        transition: 0.3s;
    }
    h1, h2, h3, p, a{
        font-family: "Inter", sans-serif;
        font-optical-sizing: auto;
    }
  .se-header-link a{
      white-space: nowrap;
  }
  .navbar,
  .hide,
  .toppic-s,
  .ccww-s,
  .se-footer-s{
      display: none;
  }
  iframe {
      max-width: 100%;
      max-height: auto;
  }
    .display{
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        position: relative;
        max-width: 1600px;
        font-family: "Inter", sans-serif;
        font-optical-sizing: auto;
        font-weight: 300;
        font-style: normal;
        font-variation-settings:
        "slnt" 0;
        margin: auto;
    }
    .toppart{
        display: flex;
        flex-direction: row;
        vertical-align: top;
        align-items: center;
        justify-content: center;
        margin-top: 20px;
    }
    .slider-text{
        display: flex;
        flex-direction: column;
        align-items: center;
        position: absolute;
        padding: 50px;
        background: rgba(169,169,169,0.4);
        border-radius: 45px;
        color: white;
        max-width: 900px;
        display: none;
        text-align: center;
    }
    .buttons{
        display: flex;
        align-items: center;
    }
    .slider-button{
        position: absolute;
        width: 50px;
        background: rgba(169,169,169,0);
        border: none;
        cursor: pointer;
    }
    .btn-l{
        left: 200px;
    }
    .btn-r{
    	right: 200px;
    }
    .slider-button:active{
        opacity: 0.7
    }
    .slider-text a{
        justify-content: center;
        background-color: #ad2b39;
        padding: 30px;
        border: 15px;
        margin-top: 20px;
        margin-left: 20px;
        margin-bottom: 20px;
        width: 200px;
        color:white;
        text-align: center;
        text-decoration: none;
        font-weight: 600 !important;
        border-radius: 25px;
    }
    .slider-active{
        display:flex;
    }
    .toppart img{
        width: 100%;
    }
    .container{
        width: 1200px;
        border-top: 2px;
        font-family: "Inter", sans-serif;
        font-optical-sizing: auto;
        font-weight: 300;
        font-style: normal;
        font-variation-settings:
        "slnt" 0;
        text-align: left;
    }
    .container p{
        color: #6C7176;
    }
    .toppic{
        display: flex;
        flex-direction: column;
        text-align: center;
        width:200px;
        gap: 10px;
    }
    .toppic img{
        width: 200px;
        height: 200px;
    }
    .boxbox{
        display: grid;
        justify-content: center;
        grid-template-columns: 1fr 1fr 1fr;
    }
    .box{
        display: flex;
        background-color: #ad2b39;
        padding: 50px;
        border-radius: 15px;
        border: 15px;
        margin: 20px;
        color: white;
        text-align: center;
        text-decoration: none;
        font-weight: 600 !important;
        height: 140px;
        align-items: center;
        justify-content: center;
    }
    .box1{
        grid-row-start:1 ;
        grid-row-end: 2;
        grid-column-start: 1;
        grid-column-end: 2;
    }
    .box2{
        grid-row-start:1 ;
        grid-row-end: 2;
        grid-column-start: 2;
        grid-column-end: 3;
    }
    .box3{
        grid-row-start:1 ;
        grid-row-end: 2;
        grid-column-start: 3;
        grid-column-end: 4;
    }
    .box4{
        grid-row-start:2 ;
        grid-row-end: 3;
        grid-column-start: 1;
        grid-column-end: 2;
    }
    .box5{
        grid-row-start:2 ;
        grid-row-end: 3;
        grid-column-start: 2;
        grid-column-end: 3;
    }
    .box6{
        grid-row-start:2 ;
        grid-row-end: 3;
        grid-column-start: 3;
        grid-column-end: 4;
    }
    hr.red{
        border: 2px solid #ad2b39;
        margin-top:50px;
        margin-bottom: 50px;
        border-radius: 6px;
    }

    .about{
        display: flex;
        flex-direction: row;
        background-color: #212225;
        padding: 50px;
        border-radius: 30px;
        border: 15px;
        color: white;
        margin-top: 30px;

    }
    .about img{
        border: 15px;
        margin: 20px;
    }
    .about-text{
        display: flex;
        flex-direction: column;
        text-align: left;
    }
    .about-text p{
        color: #DDDDDD;
    }
    .edutop{
        display: flex;
        justify-content: space-between;
    }
    .redbut{
        justify-self:right;
        background-color: #ad2b39;
        padding: 30px;
        border-radius: 15px;
        border: 15px;
        margin-top: 20px;
        margin-left: 20px;
        margin-bottom: 20px;
        color:white;
        text-align: center;
        text-decoration: none;
        font-weight: 600 !important;
    }
    .redbut-s{
        display: none;
    }
    .edutext{
        display: flex;
        flex-direction: column;
        text-align: left;
        font-size: 3px;
    }
    .textphoto{
        display: flex;
        flex-direction: row;
    }
    .textphoto img{
        width: 100%;
        height: 100%;
    }
    .marleft{
        margin-left: 20px;
    }
    .naslov{
        color:#6c7176;
    }
    .naslov2{
        color:white;
    }
    .ccfk{
        display: flex;
        flex-direction: row;
        background-color: #212225;
        padding: 50px;
        border-radius: 30px;
        border: 15px;
        color: white;
        margin-top: 50px;
    }
    .ccfk-top{
        display: flex;
        justify-content: space-between;
        flex-direction: row;
    }
    .whitebut{
        justify-self:right;
        background-color: #ffffff;
        padding: 30px;
        border-radius: 15px;
        border: 15px;
        margin: 20px;
        color:#212225;
        text-align: center;
        text-decoration: none;
        font-weight: 600 !important;
    }
    .ccfk-toptext{
        display: flex;
        flex-direction: column;
        color: #DDDDDD;
    }
    .ccfk-toptext p{
        color: #DDDDDD;
    }
    .ccfk img{
        border: 15px;
        margin: 20px;
    }
    .ccfb{
        display: flex;
        flex-direction: column;
        margin-top: 50px;
    }
    .ccfb-top{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }
    .ccfb-mid img{
        width: 100%;
        height: 100%;
    }
    .ccfb-mid-left{
        display: flex;
        flex-direction: column;
        margin-right: 40px;
    }
    .ccft{
        display: flex;
        flex-direction: column;
        margin-top: 30px;
    }
    .ccft-top{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
    .ccft-toptext p{
        color: #DDDDDD;
    }
    .ccft-bot{
        display: flex;
        flex-direction: row;
        align-items: start;
        gap: 50px;
    }
    .ccft-bot img{
        width: 70%;
    }
    .ccc-bot{
        display: flex;
        flex-direction: row;
        align-items: start ;
        gap: 50px;
    }
    .ccc-bot img{
        height: 80% !important; 
        width: 100% !important;
        margin-top: 1em;
    }
    .ccww{
        display: flex;
        flex-direction: column;
        background-color: #212225;
        padding: 50px;
        border-radius: 15px;
        border: 15px;
        color: white;
        margin-top: 50px;
    }
    .ccww p{
      color: #FFFFFF;
    }
    .ccww-bot{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }
    .ccww-bot img{
        height: 48%;
        width: 48%;
    }
    .dot{
        display: list-item;
        margin: 1em;
    }
    .tai-bot{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }
    .tai-bot h3{
        color: #ad2b39;
        font-weight: 900;
    }
    .taibox{
        background-color: #f1f1f1;
        border-radius: 15px;
        padding: 25px;
        justify-content: space-evenly;
        text-align: center;
        margin: 40px;
        margin-bottom: 0;
        margin-top: 0;
    }
    .contact{
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 50px;
    }
    .contact-left{
        display: flex;
        flex-direction: column;
        background-color: #ad2b39;
        padding: 30px;
        border-radius: 15px;
        text-align: center;
    }
    .contact-left p{
        color: #DDDDDD;  
    }
    .w-text {
        color: #FFFFFF;
        font-weight: 800;
    }
    .contact-center{
        display: flex;
        flex-direction: column;
    }
    .contact-center p{
        font-size: 16px;
    }
    .contact-right{
        display: flex;
        flex-direction: column;
    }
    .red-text{
        color:#ad2b39;
        font-weight: 800;
    }
    .gray-text{
        color:#6c7176;
        font-weight: 800;
    }
    .slideshow-container{
        display: flex;
        flex-direction: row;
        align-items: center;
        max-width: 1600px;
        justify-content: space-around;
        border-top: 5px gray;
        border-bottom: 5px gray;
    }
    .mySlides-bottom{
        display: flex;
        flex-direction: column;
        padding: 80px;
        text-align: center;
    }
    .review-text{
        color: #6c7176;
        font-style: italic;
        font-size:xx-large;
        font-weight: 600;
        text-align: center;
    }
    .author{
        color: #ad2b39;
    }
    .se-header{
        margin-top: 20px;
    }
    .se-header-links > div > a{
        white-space: nowrap;
    }
    #module_20{
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        max-width: none;
    }
    /* HEADER DROPDOWN MENU */
    .header--span span:hover {
    cursor: pointer;
    }
    .se-header-dropdown-menu {
    display: none;
    position: absolute;
    }

    .se-header-link--services-list {
    position: relative;
    display: flex;
    }

    .se-header-dropdown-menu a:hover,
    .se-subheader-list a:hover {
    color: #AD2B39;
    }

    .se-header-link--services-list:hover,
    .se-header-link--services-list:active{ 
    .se-header-dropdown-menu {
        margin-top: 30px;
        margin-left: -30px;
        color: #6C7176;
        z-index: 10;
        background-color: #FFFFFF;
        padding: 30px;
        gap: 10px;
        display: flex;
        flex-direction: column;
        white-space: nowrap;
        border-radius: 10px;
      }
    }

    /* SUBHEADER DROPDOWN MENU */

    .se-subheader-dropdown-menu {
    display: none;
    }

    .se-subheader-list:hover,
    .se-subheader-list:active {
        .se-subheader-dropdown-menu {
            display: flex;
            flex-direction: column;
            margin-left: -468px;
            position: absolute;
            margin-top: -56px;
            background-color: #FFFFFF;
            gap: 10px;
            padding: 30px;
            border-radius: 10px;
            width: 470px;
            white-space: normal;
        }
    }

    /* SOCIALS */

    a:hover {
    filter: brightness(90%);
    cursor: pointer;
    }

    .se-logo a:hover {
    filter: brightness(100%) !important;
    }
}

@media only screen and (max-width: 1570px) {
    .se-footer,
    .container,
    .se-header{
        margin-left: 6%;
        margin-right: 6%;
    }
    .btn-l {
        left: 6%;
    }
    .btn-r {
        right: 6%;
    }
    .se-header-social-group{
        display: none !important;
    }
}
  
@media only screen and (max-width: 1218px) {
    .boxbox{
        grid-template-columns: 1fr 1fr;
    }
    .container {
        width: auto;
    }
    .ccc-bot {
        flex-direction: column;
    }
    .ccft-bot {
        display: flex;
        flex-direction: column;
    }
    .ccft-bot img{
        width: 100%
    }
    .ccfb-mid{
        display: flex;
        flex-direction: column;
    }
    .marleft {
        margin-left: 0px;
    }
    .textphoto {
        display: flex;
        flex-direction: column-reverse;
    }
    .ccfk {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .img-l{
        display: none;
    }
}
  
@media only screen and (min-width:631px and max-width: 1024px) {
    .se-header{
        gap: 3.125rem .2rem !important;
    }  
}
  
@media only screen and (min-width: 1218px) {
    .ccfb-mid {
        display: flex;
        flex-direction: row;
        margin-bottom: 10px;
    }
    .img-s{
        display: none;
    }
}