﻿#ReferencesClassicList {   display: -webkit-flex; /* Safari */
  -webkit-flex-wrap: wrap; /* Safari 6.1+ */
  display: flex;  
  flex-wrap: wrap;
  justify-content: center;
  width:calc(100% - 240px); padding:0 120px;
  position:relative;
}
#ReferencesClassicList .item{ width:calc(100% - 160px); margin:15px; padding:60px 65px 15px 65px;
                              background-image:url(/Images/uvozovky2.svg); background-position:center top;
                              background-repeat:no-repeat; background-size:60px;
}
#ReferencesClassicList .item .Field{  }
#ReferencesClassicList .item .Field.Photo,#ReferencesTrailerList .item .Field.Photo{ width:100px; height:100px; display:block; overflow:hidden; position:relative; margin-left:auto; margin-right:auto;
                                           -webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
}
#ReferencesClassicList .item .Field.Photo img,#ReferencesTrailerList .item .Field.Photo img{ width:150px; height:150px; max-width:100px; max-height:100px; position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; }
#ReferencesTrailerList .item .Field.Photo img { width:100%; height:100%; }
#ReferencesClassicList .item .Field.Photo .Kruh,#ReferencesTrailerList .item .Field.Photo .Kruh { position:absolute; width:100%; height:100%; left:0; top:0; text-align:center; }
#ReferencesClassicList .item .Field.Photo .Kruh span,#ReferencesTrailerList .item .Field.Photo .Kruh span{ position:absolute; display:table; margin:auto; /*left:0; top:0; right:0; bottom:0;*/ font-size:2rem; color-interpolation:auto;
                                                      text-align:center; font-weight:bold;
                                                      left: 50%;
                                                      top: 50%;
                                                      -webkit-transform: translate(-50%, -50%);
                                                      transform: translate(-50%, -50%);
                                                      text-transform:uppercase;
}
#ReferencesClassicList .item .Field.Name{ font-weight:200; font-size:1.2rem; font-family:var(--font-title); padding:0; margin-top:2rem;  }
#ReferencesClassicList .item .Field.Name .AllName, #ReferencesClassicList .item .Field.Name .Grade { display:block; }
#ReferencesClassicList .item .Field.Grade,#ReferencesTrailerList .item .Field.Grade{ display:block; text-align:center; color:#9ea1a4; font-weight:300;margin:0.5em; }
#ReferencesClassicList .item .Field.Description,#ReferencesTrailerList .item .Field.Description{ text-align:left; font-weight:normal; font-size:1.2rem; margin-top:0.5rem;
                                                 
                                                    overflow-y: auto;
                                                    padding: 0.5rem 0;
                                                    line-height: 1.5;
                                                 display:block; width:100%; overflow-y:auto; padding:0.5rem 0;
                                                 font-weight:400; font-size:1.6rem; font-family:var(--font-title);
}
#ReferencesClassicList .item .Field.Description p,#ReferencesTrailerList .item .Field.Description p { margin:0; }
#ReferencesClassicList .item .Field.Description, #ReferencesClassicList .item .Field.Description p,
#ReferencesClassicList .item .Field.Name,#ReferencesClassicList .item .Field.Name p{ color:white; text-align:center;  }

#ReferencesClassicList .item .Field.Popisky,#ReferencesTrailerList .item .Field.Popisky { width:calc(100% - 30px); }
#ReferencesClassicList .item .Field.Stars ul,#ReferencesClassicList .item .Field.Stars ul li,#ReferencesTrailerList .item .Field.Stars ul,#ReferencesTrailerList .item .Field.Stars ul li{ margin:0; padding:0; background:none; }
#ReferencesClassicList .item .Field.DatePublic,#ReferencesTrailerList .item .Field.DatePublic { color:var(--color3); margin-top:5px; }
#ReferencesClassicList .item .Field.Ico,#ReferencesTrailerList .item .Field.Ico { width:30px; position:relative; }
#ReferencesClassicList .item .Field.Ico .ReferenceType span,#ReferencesTrailerList .item .Field.Ico .ReferenceType span { width:30px; height:30px; position:absolute; left:0; top:0; margin:auto; background-repeat:no-repeat; background-size:contain; }
#ReferencesClassicList .item .Field.Ico .ReferenceType .web,#ReferencesTrailerList .item .Field.Ico .ReferenceType .web{  background-image:url(/Images/logo-web.svg); background-size:110%; }
#ReferencesClassicList .item .Field.Ico .ReferenceType .google,#ReferencesTrailerList .item .Field.Ico .ReferenceType .google{  background-image:url(/Images/logo-google.svg); }
#ReferencesClassicList .item .Field.Ico .ReferenceType .sreality,#ReferencesTrailerList .item .Field.Ico .ReferenceType .sreality{  background-image:url(/Images/logo-sreality.png); }
#ReferencesClassicList .item .Field.Ico .ReferenceType .firmy,#ReferencesTrailerList .item .Field.Ico .ReferenceType .firmy{  background-image:url(/Images/logo-firmy.png); background-size:auto 80%; }
#ReferencesClassicList .item .Field.Ico .ReferenceType .fa-facebook,#ReferencesTrailerList .item .Field.Ico .ReferenceType .fa-facebook{ font-size:1.7rem; color:#3F5594; }
#ReferencesClassicList .owl-nav button.owl-next, #ReferencesClassicList .owl-nav button.owl-prev { 
    position:absolute; width:60px; height:60px; display:block; margin:auto; top:0; bottom:0;
    background-position:center center; background-repeat:no-repeat; background-size:contain;
}
#ReferencesClassicList .owl-nav button.owl-next span, #ReferencesClassicList .owl-nav button.owl-prev span { display:none; }
#ReferencesClassicList .owl-nav button.owl-next { right:30px; background-image:url(/Images/arrow-next.svg); }
#ReferencesClassicList .owl-nav button.owl-prev { left:30px; background-image:url(/Images/arrow-prev.svg); }
#ReferencesClassicList .owl-dots { display:flex; width:100%; flex-wrap:wrap; justify-content:center; }
#ReferencesClassicList .owl-dots .owl-dot{ width:20px; height:20px; border:1px solid white; margin:5px;
                                           -webkit-border-radius: 10px;
                                            -moz-border-radius: 10px;
                                            border-radius: 10px;
}
#ReferencesClassicList .owl-dots .owl-dot.active { background-color:white; }


@media all and (max-width: 85em) {
    #ReferencesClassicList .item { width: calc(100% - 100px);
    margin: 15px;
    padding: 60px 35px 15px 35px; }
    #ReferencesClassicList .item .Field.Description, #ReferencesTrailerList .item .Field.Description { font-size:1.4rem; }    
}


@media all and (max-width: 61em) {
    
    #ReferencesClassicList .item .Field.Description, #ReferencesTrailerList .item .Field.Description { font-size:1.2rem; }
}

@media all and (max-width: 42em) {
#ReferencesClassicList .owl-nav button.owl-next, #ReferencesClassicList .owl-nav button.owl-prev { width:30px; }
    #ReferencesClassicList { width:calc(100% - 120px); padding:0 60px; }
}

@media all and (max-width: 36em) {
    #ReferencesClassicList .item { width: calc(100% - 30px); margin:15px 0; padding:60px 15px 15px 15px; }
    #ReferencesClassicList .item .Field.Photo { width:80px; height:80px; }
    #ReferencesClassicList .item .Field.Ico { position:absolute; right:0; top:1rem; }
        #ReferencesClassicList .item .Field.Popisky { width:100%; margin-left:0;
     }
    #ReferencesClassicList .item .Field.Popisky div { text-align:center; }
        #ReferencesClassicList .item .Field.Popisky .RadRating{ margin:0 auto; }
}

@media all and (max-width: 27em) {
    #ReferencesClassicList {
        width: calc(100% - 80px);
        padding: 0 40px;
    }
        #ReferencesClassicList .owl-nav button.owl-next { right:5px; }
        #ReferencesClassicList .owl-nav button.owl-prev { left:5px; }
}








