body { background-color: #F8F8F8;   font-family: 'Inter', Arial, sans-serif;  }
a { color: #111; text-decoration: none; border-bottom: 1px solid #c8c8c8;}
a:hover { background-color: #f8f8f8;}
strong { font-weight: bold;}

hr.cleaner { clear: both; border: 0px solid white; }

#maincontent { width: auto;  background-color: white; margin-top: 0;  max-width: 1800px;  margin-left: auto; margin-right: auto; min-height: 1000px; margin-bottom: 20px; }

#topmenu { background-color: #2E2D2D; height: 260px; }
#topmenu {

    background-color:hsla(0,0%,14%,1);
    background-image:
    radial-gradient(at 93% 22%, hsla(241,0%,10%,1) 0px, transparent 50%),
    radial-gradient(at 44% 87%, hsla(340,0%,16%,1) 0px, transparent 50%),
    radial-gradient(at 18% 15%, hsla(342,0%,8%,1) 0px, transparent 50%);
}

#topmenu h1 { width: 350px; font-size: 2em; font-weight: 600; text-transform: uppercase; padding-left: 80px; padding-top: 50px; color: white; }
#topmenu h1 img { width: 60px; float: left; position: relative; top: 11px; padding-right: 20px; }

#likeh1 { width: 350px; font-size: 2em; font-weight: 600; text-transform: uppercase; padding-left: 80px; padding-top: 50px; color: white; }
#likeh1 img { width: 60px; float: left; position: relative; top: 11px; padding-right: 20px; }

#toptopmenu { width: auto; font-size: 0.8em; padding-left: 85px; padding-top: 7px; padding-bottom: 7px; background-color: #44b678; color: white; } 
#toptopmenu img { margin-right: 5px; }

#topmenu #menu { padding-top: 50px; padding-left: 80px; height: 60px;  }
#topmenu #menu #gpslink { color: black; background: linear-gradient(to bottom, rgb(255, 255, 255), rgb(202, 202, 202)); border: 1px solid black;  padding: 10px; padding-left: 15px; padding-right: 15px; font-size: 90%; border-radius: 3px; }
#topmenu #menu { color: white;  }
#topmenu #menu .inputtext { padding: 10px; width: 230px; }
#topmenu #menu .inputsubmit { padding: 10px; width: 50px; }
#topmenu form { display: inline; }

.widecontentblock {  padding: 80px; padding-top: 60px; }
.widecontentblock h1 { font-size: 2em; font-weight: bold; margin-bottom: 40px;  }

h2 { font-size: 2em; font-weight: 500; margin-bottom: 60px;  }

h3 { font-size: 1.4em; font-weight: 500; margin-bottom: 10px;  }
.states .states_one_column { float: left; width: 18%; margin-right: 1%; }

li { margin-bottom: 20px; }

#banks .one_bank { width: 200px; height: 200px; border: 1px solid silver; margin-bottom: 10px; float: left; margin-right: 20px;}

#maincontent .widecontentblock .oneatm_data { padding: 2%;  width: auto; margin-bottom: 20px; border: 1px solid rgb(222, 222, 222); margin-bottom: 10px; height: 130px; }
/* nastaveni gradientu */
#maincontent .widecontentblock .oneatm_data { background: linear-gradient(to bottom, rgb(255, 255, 255), rgb(247, 247, 247)); }
#maincontent .widecontentblock .oneatm_data { clear: both; }
#maincontent .widecontentblock .oneatm_data p { line-height: 140%; }

#maincontent .widecontentblock .oneatm_data .column1 { float: left; width: 30%; height: 130px;  }
#maincontent .widecontentblock .oneatm_data .column1 p { 
    text-align: center; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    height: 100%; 
    margin: 0; 
}
#maincontent .widecontentblock .oneatm_data .column1 p img {  height: 80px; }


#maincontent .widecontentblock .oneatm_data .column2 { float: left; width: 44%; height: 130px;  }

#maincontent .widecontentblock .oneatm_data .column3 { float: left; width: 38%; height: 130px;  }
#maincontent .widecontentblock .oneatm_data .column3 .links { margin-top: 5px; }
#maincontent .widecontentblock .oneatm_data .column3 p { line-height: 160%; }


#maincontent .widecontentblock .oneatm_data .column4 { float: left; width: 16%; height: 130px; text-align: center;  }
#maincontent .widecontentblock .oneatm_data .column4 img { float: left; width: 16%; height: 130px; width: 173px; }

#maincontent .widecontentblock #gpsdata { margin: 0; padding: 0; }

#maincontent .widecontentblock #gpsdata #loading-indicator { text-align: center; margin-top: 20px; margin-bottom: 20px; margin-left: auto; margin-right: auto;  }
#maincontent .widecontentblock #gpsdata #loading_div { margin-left: auto; margin-right: auto;  text-align: center;   }


#howmany_atms_found { margin-bottom: 20px; }
#info_no_atms_found { background-color: rgb(255, 240, 167); padding: 15px; margin-bottom: 10px; padding-left: 30px; }

/* maly monitor */
@media only screen and (max-width: 1500px) {
    
    body { padding-left: 0; padding-right: 0; margin-top: 0; }

}

/* maly monitor */
@media only screen and (max-width: 1200px) {
    
    body { padding-left: 0; padding-right: 0; margin-top: 0; }
    #maincontent .widecontentblock .oneatm_data .column2 { width: 40%; }
    #maincontent .widecontentblock .oneatm_data .column3 { width: 25%; }

}

/* maly monitor */
@media only screen and (max-width: 960px) {
    
    #maincontent .widecontentblock .oneatm_data .column1 { float: none; width: 100%; }
    #maincontent .widecontentblock .oneatm_data .column2 { float: none; width: 100%; clear: both;}
    #maincontent .widecontentblock .oneatm_data .column3 { float: none; width: 100%; }
    #maincontent .widecontentblock .oneatm_data {  height: 400px; }

}



/* mobil sirsi jako fold treba */
@media only screen and (max-width: 650px) {
    body { padding-left: 0; padding-right: 0; }

}


/* mobil */
@media only screen and (max-width: 500px) {
    .states .states_one_column { float: none;  }
    #maincontent .widecontentblock .oneatm_data {  height: 440px; }
    #maincontent .widecontentblock .oneatm_data .column2 {  float: none; width: 100%; clear: both; height: 180px;}

    #topmenu h1 { width: 220px; font-size: 1.4em; font-weight: 600; text-transform: uppercase; padding-left: 40px; padding-top: 30px; color: white; }
    #topmenu h1 img { width: 40px; float: left; position: relative; top: 11px; padding-right: 20px; }

    #likeh1 { width: 220px; font-size: 1.4em; font-weight: 600; text-transform: uppercase; padding-left: 40px; padding-top: 30px; color: white; }
    #likeh1 img { width: 40px; float: left; position: relative; top: 11px; padding-right: 20px; }

    #topmenu #menu { padding-top: 40px; padding-left: 40px; height: 40px;  }

    .widecontentblock {  padding: 40px; padding-top: 40px; }
.widecontentblock h1 { font-size: 2em; font-weight: bold; margin-bottom: 20px;  }

#topmenu { background-color: #2E2D2D; height: 240px; }
#topmenu #menu .inputtext { padding: 10px; width: 230px; position: relative; top: 20px; }
#topmenu #menu .inputsubmit { padding: 10px; width: 50px; position: relative; top: 20px; }


.states .states_one_column { float: none; width: 90%; margin-right: 1%; }

h2 { font-size: 2em; font-weight: 500; margin-bottom: 30px;  }

h3 { font-size: 1.4em; font-weight: 500; margin-bottom: 10px;  }


#toptopmenu { width: auto; font-size: 0.8em; padding-left: 45px; padding-top: 7px;}
}


/* mobil */
@media only screen and (max-width: 325px) {
  
}