/*
|
|
|
|
|
*/
/*-- HTML | BODY - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* html + body - start */
html,body {
width: 100%; height: 100%;
}
/* html + body - end */
/* body - start */
body {
font-family:'Roboto', Arial, Helvetica, sans-serif; margin:0px; padding:0px;
}
/* body - end */
/*-- HTML - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*
|
|
|
|
|
*/
/*-- COLORS BACKGROUND - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* odcienie fioletowego - start */
.bg_fioletowy1 { background-color:#662D90 !important; } /* ciemny fiolet */
.bg_fioletowy2 { background-color:#6E3896 !important; } /* jasny fiolet */
/* odcienie fioletowego - end */
/* odcienie szarego - start */
.bg_szary1 { background-color:#E6E6E6 !important;}
.bg_szary2 { background-color:#CCCCCC !important;}
.bg_szary3 { background-color:#F1F1F1 !important;}
.bg_szary4 { background-color:#E5E5E5 !important;}
.bg_szary5 { background-color:#999999 !important;}
.bg_szary6 { background-color:#F2F2F2 !important;}
/* odcienie szarego - end */
/* niebieski - start */
.bg_niebieski { background-color:#2196F3 !important; }
/* niebieski - end */
/* czerwony - start */
.bg_czerwony { background-color:#FF0000 !important; }
/* czerwony - end */
/*-- COLORS BACKGROUND - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*
|
|
|
|
|
*/
/*-- COLORS FONT - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* biały font - start */
.txt_bialy { color:#ffffff !important; }
/* biały font - end */
/* szary font - odcienie - start */
.txt_szary1 { color:#808080 !important; } /* jasny */
.txt_szary2 { color:#4D4D4D !important; } /* ciemny */
/* szary font - odcienie - end */
/* fioletowy font - start */
.txt_fioletowy { color:#662D90 !important; }
/* fioletowy font - end */
/* niebieski font - start */
.txt_niebieski { color:#2196F3 !important; }
/* niebieski font - end */
/*-- COLORS FONT - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*
|
|
|
|
|
*/
/*-- ROZNE - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
a { text-decoration:none; }
/*-- ROZNE - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*
|
|
|
|
|
*/
/*-- MENU - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* glowny boks menu - start */
.menu_top_content {width:100%; height:80px; position:relative;
-webkit-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.3);
box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.3);
}
/* glowny boks menu - end */
/* boks menu - start */
.box_menu { width:100%; max-width:960px; height:80px; font-family:'Roboto-Black', Arial, Helvetica, sans-serif; }
/* boks menu - end */
/* style do menu mobilnego (sam napis Menu w wersji mobilnej) - start */
.box_menu_rwd {}
.menu_rwd_mobile_box {}
.menu_rwd_mobile { width:auto; padding-left:2%; padding-right:2%; height:80px; font-size:25px; color:#FFF; background-color:#6E3896; margin-left:0px; font-weight:bold; text-transform:uppercase; float:left; text-align: center; justify-content: center; align-items: center; display: none; }
.menu_rwd_mobile:hover { color:#662D90; background-color:#F2F2F2;} /* akcja */
/* style do menu mobilnego (sam napis Menu w wersji mobilnej) - end */
/*-- MONITORY - STYLE | MENU - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* style do boxu monitory - start */
.box_monitory { width:100%; height:80px; max-width:140px; font-size:25px; color:#FFF; background-color:#6E3896; font-weight:bold; text-transform:uppercase; float:left; text-align: center; display: flex; justify-content: center; align-items: center;
-webkit-transition: background-color 0.2s ease-in-out;
-moz-transition: background-color 0.2s ease-in-out;
-o-transition: background-color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out;
}
/* style do boxu monitory - end */
/* akcje po najechaniu | po naciśnięciu do boxu monitory - start */
.box_monitory:hover { color:#662D90; background-color:#F2F2F2; } /* akcja */
.box_monitory_active { color:#662D90; background-color:#F2F2F2; } /* akcja po naciśnięciu */
/* akcje po najechaniu | po naciśnięciu do boxu monitory - end */
/*-- MONITORY - STYLE | MENU - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*
|
|
|
|
|
*/
/*-- MULTIMEDIA - STYLE | MENU - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* style do boxu multimedia - start */
.box_multimedia { width:150px; height:80px; font-size:25px; color:#FFF; background-color:#6E3896; margin-left:2px; font-weight:bold; text-transform:uppercase; float:left; text-align: center; display: flex; justify-content: center; align-items: center;
-webkit-transition: background-color 0.2s ease-in-out;
-moz-transition: background-color 0.2s ease-in-out;
-o-transition: background-color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out;
}
/* style do boxu multimedia - end */
/* akcje po najechaniu | po naciśnięciu do boxu multimedia - start */
.box_multimedia:hover { color:#662D90; background-color:#F2F2F2;} /* akcja */
.box_multimedia_active { color:#662D90; background-color:#F2F2F2;} /* akcja po naciśnięciu */
/* akcje po najechaniu | po naciśnięciu do boxu multimedia - end */
/*-- MULTIMEDIA - STYLE | MENU - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*
|
|
|
|
|
*/
/*-- PLAYLISTA - STYLE | MENU - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* style do boxu playlista - start */
.box_playlista { width:180px; height:80px; font-size:25px; color:#FFF; background-color:#6E3896; margin-left:2px; font-weight:bold; text-transform:uppercase; float:left; text-align: center; display: flex; justify-content: center; align-items: center;
-webkit-transition: background-color 0.2s ease-in-out;
-moz-transition: background-color 0.2s ease-in-out;
-o-transition: background-color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out;
}
/* style do boxu playlista - end */
/* akcje po najechaniu | po naciśnięciu do boxu playlista - start */
.box_playlista:hover { color:#662D90; background-color:#F2F2F2;} /* akcja */
.box_playlista_active { color:#662D90; background-color:#F2F2F2;} /* akcja po naciśnięciu */
/* akcje po najechaniu | po naciśnięciu do boxu playlista - end */
/*-- PLAYLISTA - STYLE | MENU - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*-- CENY - STYLE | MENU - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* style do boxu ceny - start */
.box_ceny { width:120px; height:80px; font-size:25px; color:#FFF; background-color:#6E3896; margin-left:2px; font-weight:bold; text-transform:uppercase; float:left; text-align: center; display: flex; justify-content: center; align-items: center;
-webkit-transition: background-color 0.2s ease-in-out;
-moz-transition: background-color 0.2s ease-in-out;
-o-transition: background-color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out;
}
/* style do boxu ceny - end */
/* akcje po najechaniu | po naciśnięciu do boxu playlista - start */
.box_ceny:hover { color:#662D90; background-color:#F2F2F2;} /* akcja */
.box_ceny_active { color:#662D90; background-color:#F2F2F2;} /* akcja po naciśnięciu */
/* akcje po najechaniu | po naciśnięciu do boxu playlista - end */
/*-- CENY - STYLE | MENU - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*
|
|
|
|
|
*/
/*-- IKONY - STYLE | MENU - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* style do boxu ikony - start */
.box_icony { width:80px; height:80px; font-size:31px; color:#FFF; background-color:#6E3896; margin-left:2px; font-weight:bold; text-transform:uppercase; float:left; text-align: center; display: flex; justify-content: center; align-items: center;
-webkit-transition: background-color 0.2s ease-in-out;
-moz-transition: background-color 0.2s ease-in-out;
-o-transition: background-color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out;
}
/* style do boxu ikony - end */
/* akcje po najechaniu | po naciśnięciu do boxu ikony - start */
.box_icony:hover { color:#662D90; background-color:#F2F2F2; } /* akcja */
.box_icony_active { color:#662D90; background-color:#F2F2F2;} /* akcja po naciśnięciu */
/* akcje po najechaniu | po naciśnięciu do boxu ikony - end */
/*-- IKONY - STYLE | MENU - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*
|
|
|
|
|
*/
/*-- LOGO - STYLE | MENU - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* logo box - start */
.box_logo { width:160px; height:80px; font-size:31px; background-color:#6E3896; margin-left:2px; font-weight:bold; text-transform:uppercase; float:left; text-align: center; display: flex; justify-content: center; align-items: center;}
/* logo box - end */
/*-- LOGO - STYLE | MENU - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*
|
|
|
|
|
*/
/*-- POD MENU - STYLE | MENU - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* box pod menu na szaryb boksie - start */
.pod_menu_top_content { width:100%; height:80px; z-index:98; }
/* box pod menu na szaryb boksie - end */
/* box pod menu w under_menu.php itp. - start */
.box_pod_menu {width:96%; margin-left:2%; margin-right:2%; max-width:960px; height:80px; font-family:'Roboto-Black', Arial, Helvetica, sans-serif; display: flex; justify-content: left; align-items: center;}
/* box pod menu w under_menu.php itp. - end */
/* style do tekstu pod menu - start */
.box_pod_menu_txt { margin-right:40px; font-size:18px; color:#4D4D4D; font-family:'Roboto-Regular', Arial, Helvetica, sans-serif;}
.active_pod_menu { color:#662D90; font-family:'Roboto-Black', Arial, Helvetica, sans-serif; font-weight:900;}
/* style do tekstu pod menu - end */
/*-- POD MENU - STYLE | MENU - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*
|
|
|
|
|
*/
/*-- STYLE DO TEKSTU PO NAJECHANIU - POJAWIA SIE KRESKA - STYLE | MENU - END
––––––––––––––––––––––––––––––––––––––––––––––––––---------------------------- --*/
nav a {
position: relative;
display: inline-block;
}
nav a:hover,
nav a:focus {
outline: none;
}
/* Effect 4: bottom border enlarge */
.cl-effect-4 a {
padding: 0 0 3px;
}
.cl-effect-4 a::after {
position: absolute;
top: 101%;
left: 0;
width: 100%;
height: 0px;
background: #4D4D4D;
content: '';
opacity: 0;
-webkit-transition: height 0.3s, opacity 0.3s, -webkit-transform 0.3s;
-moz-transition: height 0.3s, opacity 0.3s, -moz-transform 0.3s;
transition: height 0.3s, opacity 0.3s, transform 0.3s;
-webkit-transform: translateY(-10px);
-moz-transform: translateY(-10px);
transform: translateY(-10px);
}
.cl-effect-4 a:hover::after,
.cl-effect-4 a:focus::after {
height: 2px;
opacity: 1;
-webkit-transform: translateY(0px);
-moz-transform: translateY(0px);
transform: translateY(0px);
}
/*-- STYLE DO TEKSTU PO NAJECHANIU - POJAWIA SIE KRESKA - STYLE | MENU - END
––––––––––––––––––––––––––––––––––––––––––––––––––---------------------------- --*/
/*-- MENU - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*
|
|
|
|
|
*/
/*-- POKAZ UKRYJ W DESKTOP - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* ukryj menu w desktop - start */
.menu_rwd { display:none;}
/* ukryj menu w desktop - end */
/* ukryj (id - segregacja nad tabela) itp itd w desktop - start */
.id_txt_ukryty { display:none; }
/* ukryj (id - segregacja nad tabela) itp itd w desktop - end */
/* ukryte opcje segregacji widoczne tylko w rwd - start */
.segregacja_rwd { display:none;}
.segregacja_rwd_index { display:none;}
/* ukryte opcje segregacji widoczne tylko w rwd - end */
/*-- POKAZ UKRYJ W DESKTOP - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*
|
|
|
|
|
*/
/*-- LISTA MONITOROW | SEGREGACJA | TABELA | MONITORY - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* glowne ID - start */
#index_id { width:100%; max-width:980px;}
/* glowne ID - end */
/* box segregacji id | nazwa | lokalizacja | grupa - start */
.box_index_segregacja {width:100%; max-width:980px; height:auto; min-height:40px; float:left; margin-top:10px; background-color:#fff; display:flex; align-items:center;}
/* box segregacji id | nazwa | lokalizacja | grupa - end */
/* box tabela - start */
.box_index { width:100%; max-width:980px; height:auto; min-height:60px; float:left; margin-top:10px; background-color:#F1F1F1; color:#4D4D4D; display:flex; align-items:center;}
/* box tabela - end */
/* boxy w tabeli procentowo - start */
.box_jeden_id_index {width:15%; float:left; text-align:left;}
.box_dwa_nazwa_index {width:32%; float:left; text-align:left;}
.box_trzy_lokalizacja_index {width:18%; float:left; text-align:left;}
.box_cztery_grupa_index {width:10%; float:left; text-align:left;}
.box_piec_info_edit_delete_index {width:25%; float:left; text-align:left; background-color:#E5E5E5;}
/* boxy w tabeli procentowo - end */
/* box w tabeli lista monitorów prawa strona edytuj | informacje | usuń - start */
.txt_edycje {color:#4D4D4D; font-size:14px; text-align:left; font-weight:300; float:left;}
.txt_informacje { width:40%; height:60px; display: flex; justify-content: center; align-items: center;}
.txt_edytuj { width:30%; height:60px; display: flex; justify-content: center; align-items: center;}
.txt_usun { width:30%; height:60px; display: flex; justify-content: center; align-items: center;}
/* akcja po najechaniu - start */
.txt_informacje, .txt_edytuj, .txt_usun {
-webkit-transition: background-color 0.2s ease-in-out;
-moz-transition: background-color 0.2s ease-in-out;
-o-transition: background-color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out;
}
.txt_informacje:hover, .txt_edytuj:hover, .txt_usun:hover { background-color:#D8D8D8;}
/* akcja po najechaniu - start */
/* box w tabeli lista monitorów prawa strona edytuj | informacje | usuń - end */
/* style tekstów w segregacji w top - start */
.txt_index_top { font-size:14px; color:#808080; font-weight:300;}
.txt_index_top:first-child { padding-left:10px;}
/* style tekstów w segregacji w top - end */
/* style tekstów w tabeli- start */
.txt_index { font-size:17px; font-weight:300;}
.txt_index:first-child { padding-left:10px;}
/* style tekstów w tabeli - end */
/* style tekstów w tabeli bold - start */
.txt_index_bold { font-weight:bold;}
/* style tekstów w tabeli bold - end */
/* Style wersja mobilna do tabeli - start */
@media(max-width:790px) {
.box_index_segregacja {display:block;}
.box_index {display:block; width:49%;}
.box_index:nth-child(even) {display:block; width:49%; margin-right:2%;}
.box_index_wysoki {display:block;}
.box_jeden_id_index_test {width:100%; padding-top:2%; padding-bottom:2%; text-align:left;}
.box_jeden_id_index {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.box_dwa_nazwa_index_test {width:100%; padding-top:2%; padding-bottom:2%; text-align:left;}
.box_dwa_nazwa_index {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.box_trzy_lokalizacja_index {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.box_cztery_grupa_index {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.box_piec_info_edit_delete_index {width:100%; float:left; text-align:center;}
.txt_aindex_top:first-child { padding-left:0px;}
.txt_index:first-child { padding-left:px;}
.segregacja_rwd_index { display:block; font-size:14px; opacity:0.5;}
}
@media(max-width:500px) {
.box_index_segregacja {display:block;}
.box_index {display:block; width:100%;}
.box_index:nth-child(even) {display:block; width:100%; margin-right:0%;}
.box_index_wysoki {display:block;}
.box_jeden_id_index {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.box_dwa_nazwa_index {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.box_trzy_lokalizacja_index {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.box_cztery_grupa_index {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.box_piec_info_edit_delete_index {width:100%; float:left; text-align:center;}
.txt_aindex_top:first-child { padding-left:0px;}
.txt_index:first-child { padding-left:px;}
.segregacja_rwd_index { display:block; font-size:14px; opacity:0.5;}
}
/* Style wersja mobilna do tabeli - start */
/*-- LISTA MONITOROW | SEGREGACJA | TABELA | MONITORY - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*
|
|
|
|
|
*/
/*-- DODAJ MONITOR | MONITORY - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* glowny box dodaj monitor (styl w wielu zakladkach) - start */
.box_add_monitor { width:100%; max-width:960px; height:50px; font-size:14px; text-align:center; font-family:'Roboto-Light', Arial, Helvetica, sans-serif; margin-top:30px;}
/* glowny box dodaj monitor (styl w wielu zakladkach) - end */
/* box tekst i input - start */
.txt_and_input { width:100%; float:left;}
/* box tekst i input - end */
/* tekst nad inputem - start */
.txt_nad_input { text-align:left; color:#4D4D4D; font-size:16px; margin-bottom:5px;}
.txt_nad_input_small { text-align:left; color:#808080; font-size:12px; margin-bottom:5px;}
/* tekst nad inputem - end */
/* style input - start */
.input_boxy { width:100%; max-width:400px; height:40px; padding-left:10px; color:#4D4D4D; border:1px solid #B2B2B2; float:left; margin-bottom:30px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
/* style input - end */
/* style input - start */
.input_boxy_txt { width:100%; max-width:400px; height:200px; padding-left:10px; color:#4D4D4D; border:1px solid #B2B2B2; float:left; margin-bottom:30px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
/* style input - end */
/* style input - start */
.input_boxy_przeglad { width:100%; max-width:400px; height:40px; padding-left:10px; color:#4D4D4D; border:1px solid #B2B2B2; float:left; margin-bottom:30px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
/* style input - end */
/* style input - start */
.input_boxy_small { width:100%; max-width:70px; height:40px; padding-left:10px; margin-right:10px; color:#4D4D4D; border:1px solid #B2B2B2; float:left; margin-bottom:30px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
/* style input - end */
/* style input - start */
.input_boxy_big { width:120px; max-width:130px; height:40px; padding-left:10px; margin-right:10px; color:#4D4D4D; border:1px solid #B2B2B2; float:left; margin-bottom:30px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
/* style input - end */
/* box z 2 buttonami dodaj i anuluj - start */
.box_button_add_remove { margin-top:20px; margin-bottom:30px; float:left; width:100%; max-width:348px;}
/* box z 2 buttonami dodaj i anuluj - end */
/* button dodaj niebieski - start */
.button_add { background-color:#2196F3; width:48%; max-width:178px; height:54px; font-size:18px; color:#FFF; text-transform:uppercase; float:left; font-family:'Roboto-Regular', Arial, Helvetica, sans-serif; display: flex; justify-content: center; align-items: center;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15);
-moz-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15);
box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15);
-webkit-transition: background-color 0.2s ease-in-out;
-moz-transition: background-color 0.2s ease-in-out;
-o-transition: background-color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out;
}
.button_add:hover { background-color:#1783CC;} /* akcja po najechaniu */
/* button dodaj niebieski - end */
/* button anuluj/powrot/itp - szary - start */
.button_remove { background-color:#999999; width:48%; max-width:178px; height:54px; margin-left:4%; font-size:18px; color:#FFF; text-transform:uppercase; float:left; font-family:'Roboto-Regular', Arial, Helvetica, sans-serif; display: flex; justify-content: center; align-items: center;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15);
-moz-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15);
box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15);
-webkit-transition: background-color 0.2s ease-in-out;
-moz-transition: background-color 0.2s ease-in-out;
-o-transition: background-color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out;
}
.button_remove:hover { background-color:#7A7A7A;} /* akcja po najechaniu */
/* button anuluj/powrot/itp - szary - end */
/* button anuluj/powrot/itp - szary - start */
.button_remove_small { background-color:#999999; width:48%; max-width:178px; height:40px; margin-left:2%; font-size:18px; color:#FFF; text-transform:uppercase; float:left; font-family:'Roboto-Regular', Arial, Helvetica, sans-serif; display: flex; justify-content: center; align-items: center;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15);
-moz-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15);
box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15);
-webkit-transition: background-color 0.2s ease-in-out;
-moz-transition: background-color 0.2s ease-in-out;
-o-transition: background-color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out;
}
.button_remove_small:hover { background-color:#7A7A7A;} /* akcja po najechaniu */
@media(max-width:610px) {
/* button anuluj/powrot/itp - szary - start */
.button_remove_small { margin-left:0%; margin-bottom:20px;}
.input_boxy_przeglad { margin-bottom:10px;}
}
/* button anuluj/powrot/itp - szary - end */
/*-- DODAJ MONITOR | MONITORY - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*
|
|
|
|
|
*/
/*-- DODAJ MONITOR | MONITORY - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* temat top szary (temat jest używany w wielu miejscach) - start */
.temat_monitor { font-size:24px; font-weight:bold; width:100%; text-align:left; margin-top:20px; color:#4D4D4D; float:left; margin-bottom:50px; font-family:'Roboto-Black', Arial, Helvetica, sans-serif;}
/* temat top szary (temat jest używany w wielu miejscach) - end */
.right_txt_liczby { float:right;}
/*-- EDYTUJ MONITOR | MONITORY - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*
|
|
|
|
|
*/
/*-- INFORMACJE O MONITORZE | MONITORY - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* box trzyma teksty z lewej i prawej strony - start */
.txt_and_txt { border-bottom:1px solid #CBCBCB; float:left; width:100%; padding-bottom:15px; padding-top:20px;}
/* box trzyma teksty z lewej i prawej strony - end */
/* tekst z lewej strony - start */
.txt_left_info { text-align:left; color:#4D4D4D; font-size:16px; margin-bottom:5px; float:left; }
/* tekst z lewej strony - end */
/* tekst z prawej strony - start */
.txt_right_info { text-align:right; color:#4D4D4D; font-size:16px; margin-bottom:5px; float:right; }
/* tekst z prawej strony - end */
/*-- INFORMACJE O MONITORZE | MONITORY - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*
|
|
|
|
|
*/
/*-- USUN MONITOR | MONITORY - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* button usun - czerwony - start */
.button_remove_red { background-color:#FF0000; width:48%; max-width:178px; height:54px; font-size:18px; color:#FFF; text-transform:uppercase; float:left; font-family:'Roboto-Regular', Arial, Helvetica, sans-serif; display: flex; justify-content: center; align-items: center;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15);
-moz-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15);
box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.15);
-webkit-transition: background-color 0.2s ease-in-out;
-moz-transition: background-color 0.2s ease-in-out;
-o-transition: background-color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out;
}
.button_remove_red:hover { background-color:#C60000;} /* akcja po najechaniu */
/* button usun - czerwony - end */
/*-- USUN MONITOR | MONITORY - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*
|
|
|
|
|
*/
/*-- LISTA GRUP MONITOROW | MONITORY - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* glowne ID - start */
#lista_grup_monitorow_id { width:100%; max-width:980px;}
/* glowne ID - end */
/* box segregacji id | nazwa | lokalizacja | grupa - start */
.box_index_segregacja {width:100%; max-width:980px; height:auto; min-height:40px; float:left; margin-top:10px; background-color:#fff; display:flex; align-items:center;}
/* box segregacji id | nazwa | lokalizacja | grupa - end */
/* boxy w tabeli procentowo - start */
.box_jeden_id_grupa {width:15%; float:left; text-align:left;}
.box_dwa_nazwa_grupa {width:32%; float:left; text-align:left;}
/* boxy w tabeli procentowo - end */
/* box tabela - start */
.box_index_grupa_dwa { width:100%; max-width:980px; height:auto; min-height:60px; float:left; margin-top:0px; background-color:#F1F1F1; color:#4D4D4D; display:flex; align-items:center;}
/* box tabela - end */
/*-- FIOLETOWA TEBELA GRUPY - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* box tabela grupa fiolet - start */
.box_grupa_fiolet { width:100%; max-width:980px; height:auto; min-height:60px; float:left; margin-top:10px; background-color:#8C5EB6; color:#fff; display:flex; align-items:center;}
/* box tabela grupa fiolet - end */
/* boxy w tabeli procentowo - start */
.box_jeden_id_grupa {width:15%; float:left; text-align:left;}
.box_dwa_nazwa_grupa {width:45%; float:left; text-align:left;}
.box_piec_info_edit_delete_grupa {width:40%; float:left; text-align:left; background-color:#7E54A3;}
/* boxy w tabeli procentowo - end */
/* box w tabeli lista monitorów prawa strona edytuj | informacje | usuń - start */
.txt_edycje_grupa_all {color:#fff; font-size:14px; text-align:left; font-weight:300; float:left;}
.txt_informacje_grupa { width:30%; height:60px; display: flex; justify-content: center; align-items: center;}
.txt_edytuj_grupa { width:20%; height:60px; display: flex; justify-content: center; align-items: center;}
.txt_usun_grupa { width:20%; height:60px; display: flex; justify-content: center; align-items: center;}
.txt_usunzgrupy_grupa { width:30%; height:60px; display: flex; justify-content: center; align-items: center;}
/* akcja po najechaniu - start */
.txt_informacje_grupa, .txt_edytuj_grupa, .txt_usun_grupa, .txt_usunzgrupy_grupa {
-webkit-transition: background-color 0.2s ease-in-out;
-moz-transition: background-color 0.2s ease-in-out;
-o-transition: background-color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out;
}
.txt_informacje_grupa:hover, .txt_edytuj_grupa:hover, .txt_usun_grupa:hover, .txt_usunzgrupy_grupa:hover { background-color:#694688;}
/* akcja po najechaniu - start */
/* Style wersja mobilna do tabeli - start */
@media(max-width:790px) {
.box_index_segregacja {display:block;}
.box_grupa_fiolet {display:block; width:100%;}
.box_jeden_id_grupa {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.box_dwa_nazwa_grupa {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.box_piec_info_edit_delete_grupa {width:100%; float:left; text-align:center;}
.txt_informacje_grupa { width:40%; height:60px; display: flex; justify-content: center; align-items: center;}
.txt_edytuj_grupa { width:30%; height:60px; display: flex; justify-content: center; align-items: center;}
.txt_usun_grupa { width:30%; height:60px; display: flex; justify-content: center; align-items: center;}
.txt_usunzgrupy_grupa { width:0%; height:60px; display: flex; justify-content: center; align-items: center;}
}
/* Style wersja mobilna do tabeli - start */
/*-- FIOLETOWA TEBELA GRUPY - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* box tabela grupa fiolet - start */
.box_grupa_szary { width:100%; max-width:980px; height:auto; border-bottom:1px solid #CCCCCC; min-height:60px; float:left; margin-top:0px; background-color:#F1F1F1; color:#4D4D4D; display:flex; align-items:center;}
/* box tabela grupa fiolet - end */
.box_dwa_nazwa_grupa_szara {width:22.5%; float:left; text-align:left;}
.box_trzy_lokalizacja_grupa_szara {width:22.5%; float:left; text-align:left;}
.box_piec_info_edit_delete_grupa_szary {width:40%; float:left; text-align:left; background-color:#E5E5E5;}
/* box w tabeli lista monitorów prawa strona edytuj | informacje | usuń - start */
.txt_edycje_grupa_all_szary {color:#4D4D4D; font-size:14px; text-align:left; font-weight:300; float:left;}
.txt_informacje_grupa_szary { width:30%; height:60px; display: flex; justify-content: center; align-items: center;}
.txt_edytuj_grupa_szary { width:20%; height:60px; display: flex; justify-content: center; align-items: center;}
.txt_usun_grupa_szary { width:20%; height:60px; display: flex; justify-content: center; align-items: center;}
.txt_usunzgrupy_grupa_szary{ width:30%; height:60px; display: flex; justify-content: center; align-items: center;}
/* akcja po najechaniu - start */
.txt_informacje_grupa_szary, .txt_edytuj_grupa_szary, .txt_usun_grupa_szary, .txt_usunzgrupy_grupa_szary {
-webkit-transition: background-color 0.2s ease-in-out;
-moz-transition: background-color 0.2s ease-in-out;
-o-transition: background-color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out;
}
.txt_informacje_grupa_szary:hover, .txt_edytuj_grupa_szary:hover, .txt_usun_grupa_szary:hover, .txt_usunzgrupy_grupa_szary:hover { background-color:#D8D8D8;}
/* Style wersja mobilna do tabeli - start */
@media(max-width:790px) {
.box_grupa_szary {display:block; width:49.8%; border-bottom:none; margin-bottom:0.4%;}
.box_grupa_szary:nth-child(even) {display:block; width:49.8%; margin-right:0.4%;}
.box_jeden_id_grupa {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.box_dwa_nazwa_grupa_szara {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.box_trzy_lokalizacja_grupa_szara {width:100%; padding-top:2%; padding-bottom:2%; float:left; text-align:center;}
.box_piec_info_edit_delete_grupa_szary {width:100%; float:left; text-align:center;}
.txt_informacje_grupa_szary { width:30%; height:60px; display: flex; justify-content: center; align-items: center;}
.txt_edytuj_grupa_szary { width:20%; height:60px; display: flex; justify-content: center; align-items: center;}
.txt_usun_grupa_szary { width:20%; height:60px; display: flex; justify-content: center; align-items: center;}
.txt_usunzgrupy_grupa_szary { width:30%; height:60px; display: flex; justify-content: center; align-items: center;}
}
@media(max-width:550px) {
.box_grupa_szary {display:block; width:100%; border-bottom:1px solid #CCCCCC; margin-bottom:0%;}
.box_grupa_szary:nth-child(even) {display:block; width:100%; margin-right:0%;}
}
/* Style wersja mobilna do tabeli - end */
/*-- LISTA GRUP MONITOROW | MONITORY - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*
|
|
|
|
|
*/
/*-- DODAJ GRUPE | MONITORY - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/* glowny box dodaj monitor (styl w wielu zakladkach) - start */
.box_add_group { width:100%; max-width:960px; height:50px; font-size:14px; text-align:center; font-family:'Roboto-Light', Arial, Helvetica, sans-serif; margin-top:30px;}
/* glowny box dodaj monitor (styl w wielu zakladkach) - end */
/* tekst nad inputem bold - start */
.txt_nad_input_group { text-align:left; color:#4D4D4D; font-size:16px; margin-bottom:5px; font-weight:900;}
/* tekst nad inputem bold - end */
#group_id { width:98%; margin-left:1%; margin-right:1%; max-width:980px;}
.box_group_segregacja {width:100%; max-width:980px; height:auto; min-height:40px; float:left; margin-top:10px; background-color:#fff; display:flex; align-items:center;}
.box_group { width:100%; max-width:980px; height:auto; min-height:60px; float:left; margin-top:10px; background-color:#F1F1F1; color:#4D4D4D; display:flex; align-items:center;
-webkit-transition: background-color 0.2s ease-in-out;
-moz-transition: background-color 0.2s ease-in-out;
-o-transition: background-color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out;
}
.box_group:hover { background-color:#EAEAEA;}
.box_group_big { width:100%; max-width:980px; height:auto; min-height:100px; float:left; margin-top:10px; background-color:#F1F1F1; color:#4D4D4D; display:flex; align-items:center;
-webkit-transition: background-color 0.2s ease-in-out;
-moz-transition: background-color 0.2s ease-in-out;
-o-transition: background-color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out;
}
.box_group_big:hover { background-color:#EAEAEA;}
.box_group_wysoki { width:100%; max-width:980px; height:auto; min-height:60px; float:left; margin-top:10px; background-color:#662D90; color:#fff; display:flex; align-items:center;
-webkit-transition: background-color 0.2s ease-in-out;
-moz-transition: background-color 0.2s ease-in-out;
-o-transition: background-color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out;
}
.box_group_wysoki:hover { background-color:#5A2A84;}
.box_group_wysoki_big { width:100%; max-width:980px; height:auto; min-height:100px; float:left; margin-top:10px; background-color:#662D90; color:#fff; display:flex; align-items:center;
-webkit-transition: background-color 0.2s ease-in-out;
-moz-transition: background-color 0.2s ease-in-out;
-o-transition: background-color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out;
}
.box_group_wysoki_big:hover { background-color:#5A2A84;}
.box_check_group {width:10%; min-width:5%; float:left; text-align:center; align-items:center;}
.box_jeden_id_group {width:15%; float:left; text-align:left;}
.box_dwa_nazwa_group {width:42%; float:left; text-align:left;}
.box_trzy_lokalizacja_group {width:15%; float:left; text-align:left;}
.box_trzy_lokalizacja_group_monitors {width:33%; float:left; text-align:left;}
.box_trzy_lokalizacja_group_30 {width:30%; float:left; text-align:left;}
.txt_group_top { font-size:14px; color:#808080; font-weight:300;}
.txt_group_top:first-child { padding-left:10px;}
.txt_group { font-size:17px; font-weight:300;}
.txt_group_settings { font-size:17px; font-weight:300; padding-left:25px;}
.txt_group:first-child { padding-left:10px;}
.txt_group_bold { font-weight:bold;}
.segregacja_rwd { display:none;}
@media(max-width:550px) {
.txt_group_settings { height:40px; display: flex; justify-content: center; align-items: center; padding-left:0px;}
.box_group_segregacja {display:block;}
.box_group {display:block;}
.box_group_wysoki {display:block;}
.box_group_wysoki_big {display:block;}
.box_check_group {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.box_jeden_id_group {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.box_dwa_nazwa_group {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.box_trzy_lokalizacja_group {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.box_trzy_lokalizacja_group_30 {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.txt_group_top:first-child { padding-left:0px;}
.txt_group:first-child { padding-left:0px;}
.segregacja_rwd { display:block; font-size:14px; opacity:0.5;}
}
input[type="checkbox"] {
display:inline-block;
width:19px;
height:19px;
cursor:pointer;
}
/*-- DODAJ GRUPE | MONITORY - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*
|
|
|
|
|
*/
/*-- INFORMACJE O GRUPE | MONITORY - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
.top_margin_group { margin-top:30px;}
/* tekst z lewej strony - start */
.txt_left_jeden { text-align:left; color:#4D4D4D; font-size:16px; margin-bottom:5px; float:left; width:20%;}
.txt_left_dwa{ text-align:left; color:#4D4D4D; font-size:16px; margin-bottom:5px; float:left; width:15%;}
.txt_left_trzy { text-align:left; color:#4D4D4D; font-size:16px; margin-bottom:5px; float:left; width:20%;}
.txt_left_cztery { text-align:left; color:#4D4D4D; font-size:16px; margin-bottom:5px; float:left; width:15%;}
.txt_left_piec { text-align:left; color:#4D4D4D; font-size:16px; margin-bottom:5px; float:left; width:20%;}
.txt_left_szesc { text-align:left; color:#4D4D4D; font-size:16px; margin-bottom:5px; float:left; width:10%;}
@media(max-width:960px) {
.txt_left_jeden { width:33.333333%;}
.txt_left_dwa{ width:33.333333%;}
.txt_left_trzy { width:33.333333%;}
.txt_left_cztery { width:33.333333%;}
.txt_left_piec { width:33.333333%;}
.txt_left_szesc { width:33.333333%;}
}
@media(max-width:620px) {
.txt_left_jeden { width:50%;}
.txt_left_dwa{ width:50%;}
.txt_left_trzy { width:50%;}
.txt_left_cztery { width:50%;}
.txt_left_piec { width:50%;}
.txt_left_szesc { width:50%;}
}
@media(max-width:440px) {
.txt_left_jeden { width:100%;}
.txt_left_dwa{ width:100%;}
.txt_left_trzy { width:100%;}
.txt_left_cztery { width:100%;}
.txt_left_piec { width:100%;}
.txt_left_szesc { width:100%;}
}
/* tekst z lewej strony - end */
/*-- INFORMACJE O GRUPE | MONITORY - END
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
/*
|
|
|
|
|
*/
/*-- WIADOMOSC ALERT SZCZEGOLY | MONITORY - START
–––––––––––––––––––––––––––––––––––––––––––––––––– --*/
.txt_right_info_txt {text-align:left; color:#4D4D4D; font-size:16px; margin-bottom:5px; margin-top:10px; float:left; width:100%;}
.temat_opisowy { font-size:16px; font-weight:bold; width:100%; text-align:left; margin-top:50px; color:#4D4D4D; float:left; margin-bottom:30px; font-family:'Roboto-Light', Arial, Helvetica, sans-serif;}
.txt_nad_txt { text-align:left; font-weight:bold; color:#4D4D4D; font-size:16px; margin-bottom:30px; margin-top:30px; float:left;}
/*
-- TABELA ALLERTY NOWE --
-------------------------------------------------- -->
*/
#allert_id { width:100%; max-width:980px;}
.box_allert_segregacja {width:100%; max-width:980px; height:auto; min-height:40px; float:left; margin-top:10px; background-color:#fff; display:flex; align-items:center;}
.box_allert { width:100%; max-width:980px; height:auto; min-height:60px; float:left; margin-top:10px; background-color:#F1F1F1; color:#4D4D4D; display:flex; align-items:center;
-webkit-transition: background-color 0.2s ease-in-out;
-moz-transition: background-color 0.2s ease-in-out;
-o-transition: background-color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out;
}
.box_allert:hover { background-color:#EAEAEA;}
.box_allert_wysoki { width:100%; max-width:980px; height:auto; min-height:60px; float:left; margin-top:10px; background-color:#662D90; color:#fff; display:flex; align-items:center;
-webkit-transition: background-color 0.2s ease-in-out;
-moz-transition: background-color 0.2s ease-in-out;
-o-transition: background-color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out;
}
.box_allert_wysoki:hover { background-color:#5A2A84;}
.box_jeden_id {width:15%; float:left; text-align:left;}
.box_dwa_temat {width:42%; float:left; text-align:left;}
.box_trzy_priorytet {width:15%; float:left; text-align:left;}
.box_cztery_data {width:28%; float:left; text-align:left;}
.txt_allert_top { font-size:14px; color:#808080; font-weight:300;}
.txt_allert_top:first-child { padding-left:10px;}
.txt_allert { font-size:17px; font-weight:300;}
.txt_allert:first-child { padding-left:10px;}
.txt_allert_bold { font-weight:bold;}
.segregacja_rwd { display:none;}
@media(max-width:550px) {
.box_allert_segregacja {display:block;}
.box_allert {display:block;}
.box_allert_wysoki {display:block;}
.box_jeden_id {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.box_dwa_temat {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.box_trzy_priorytet {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.box_cztery_data {width:100%; padding-top:2%; padding-bottom:2%; text-align:center;}
.txt_allert_top:first-child { padding-left:0px;}
.txt_allert:first-child { padding-left:0px;}
.segregacja_rwd { display:block; font-size:14px; opacity:0.5;}
}
/*
-- LISTA MULTIMEDIOW --
-------------------------------------------------- -->
*/
/* glowne ID - start */
#lista_multimediow_id { width:100%; max-width:980px;}
/* glowne ID - end */
.segregacja_no_lista_multimediow { width:20%; float:left;}
.segregacja_jeden_lista_multimediow { width:40%; float:left;}
.segregacja_dwa_lista_multimediow { width:20%; float:left;}
.segregacja_trzy_lista_multimediow { width:20%; float:left;}
.segregacja_cztery_lista_multimediow { width:18%; float:left;}
.box_left_lista_multimedia { width:60%;}
.box_zdjecie_lm { width:20%; float:left;}
.box_nazwa_grupy_lm { width:40%; float:left; height:100px; display: flex; justify-content: left; align-items: center;}
.box_id_lm { width:20%; float:left; height:100px; display: flex; justify-content: left; align-items: center;}
.box_film_lm { width:20%; float:left; height:100px; display: flex; justify-content: left; align-items: center;}
.box_czas_lm { width:18%; float:left; height:100px; display: flex; justify-content: left; align-items: center;}
.txt_and_input_lm {width:100%; float:left; margin-top:30px;}
.box_right_lista_multimedia {width:40%; height:100px; background-color:#E5E5E5;}
.txt_all_right_szary_lista_multimedia {color:#4D4D4D; font-size:14px; text-align:left; font-weight:300; float:left;}
.txt_szary_1_lista_multimedia { width:30%; height:100px; display: flex; justify-content: center; align-items: center;}
.txt_szary_2_lista_multimedia { width:30%; height:100px; display: flex; justify-content: center; align-items: center;}
.txt_szary_3_lista_multimedia { width:20%; height:100px; display: flex; justify-content: center; align-items: center;}
.txt_szary_4_lista_multimedia{ width:20%; height:100px; display: flex; justify-content: center; align-items: center;}
.txt_szary_1_lista_multimedia, .txt_szary_2_lista_multimedia, .txt_szary_3_lista_multimedia, .txt_szary_4_lista_multimedia {
-webkit-transition: background-color 0.2s ease-in-out;
-moz-transition: background-color 0.2s ease-in-out;
-o-transition: background-color 0.2s ease-in-out;
transition: background-color 0.2s ease-in-out;
}
.txt_szary_1_lista_multimedia:hover, .txt_szary_2_lista_multimedia:hover, .txt_szary_3_lista_multimedia:hover, .txt_szary_4_lista_multimedia:hover { background-color:#D8D8D8;}
.show_list { color:#2196F3 !important; text-decoration:underline;}
.box_zdjecie_info_media { text-align:left; margin-bottom:30px;}
/* tekst z lewej strony - start */
.txt_left_info_margin { text-align:left; color:#4D4D4D; font-size:16px; margin-bottom:5px; margin-right:10%; float:left; }
.txt_left_info_margin_zdjecie { text-align:left; color:#4D4D4D; height:auto; min-height:100px; font-size:16px; margin-bottom:0px; margin-right:7%; float:left; display: flex; justify-content: left; align-items: center;}
.box_lewa_strona_info_playlista { width:40%; float:left;}
.box_prawa_strona_info_playlista { width:60%; float:left;}
@media(max-width:790px) {
.box_left_lista_multimedia { width:60%;}
.box_zdjecie_lm { width:100%; float:left;}
.box_nazwa_grupy_lm { width:100%; float:left; height:50px; display: flex; justify-content: center; align-items: center;}
.box_id_lm { width:100%; float:left; height:50px; display: flex; justify-content: center; align-items: center;}
.box_film_lm { width:100%; float:left; height:50px; display: flex; justify-content: center; align-items: center;}
.box_czas_lm { width:100%; float:left; height:50px; display: flex; justify-content: center; align-items: center;}
.box_right_lista_multimedia {width:100%; float:left; text-align:center;}
}
@media(max-width:790px) {
.box_zdjecie_playlist { width:100%; float:left; text-align:left;}
.box_lewa_strona_info_playlista { width:100%; float:left;}
.box_prawa_strona_info_playlista { width:100%; float:left;}
.txt_left_info_margin_zdjecie { text-align:left; color:#4D4D4D; height:auto; min-height:40px; font-size:16px; margin-bottom:0px; margin-right:7%; float:left; display: flex; justify-content: left; align-items: center;}
}
@media(max-width:480px) {
.box_zdjecie_playlist { width:100%; float:left; text-align:left;}
.txt_left_info_margin_zdjecie { margin-right:4%; min-height:40px;}
}
.box_zdjecie_playlist { margin-right:7%;}
/*
-- MEDIA QUERIES --
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ -->
*/
/*
-- Max width 960px --
-------------------------------------------------- -->
*/
@media(max-width:960px) {
#menu_rozwijane { display:none;}
.box_menu_rwd { display:none; }
.menu_rwd_mobile { display: flex;}
.box_powiadomienia { float:right; }
.box_icony { width:70px; height:80px; font-size:31px; color:#FFF; background-color:#6E3896; margin-left:2px; font-weight:bold; text-transform:uppercase; float:left; text-align: center; display: flex; justify-content: center; align-items: center;}
.box_icony:hover { color:#662D90; background-color:#F2F2F2; }
.box_icony_active { color:#662D90; background-color:#F2F2F2;}
/* <-- -------------------------------------------------- -- TEKST DO SEGREGACJI -- -------------------------------------------------- --> */
.box_nazwy_small { display:none;}
/* <-- -------------------------------------------------- -- TEKST TABELA -- -------------------------------------------------- --> */
.cztery_boksy_dane {width:100%;}
.dwa_boksy_dane { width:49.5%; display: block; float:left; margin-right:1%;}
.dwa_boksy_dane:last-child { width:49.5%; margin-right:0%;}
.box_szary_opisy { width:49.5%; margin-left:1%; margin-top:0%;}
.box_szary_opisy:first-child { width:49.5%; margin-left:0%; margin-top:0.5%;}
.box_szary_opisy:last-child { width:49.5%; margin-right:0%; margin-top:0.5%;}
.box_id_numer { width:100%; padding-left:0%; justify-content: center; background-color:#E5E5E5; display:flex;}
.box_nazwa_tekst { width:100%; padding-left:0%; justify-content: center;}
.box_lokalizacja_tekst { width:100%; padding-left:0%;justify-content: center; background-color:#E5E5E5;}
.box_grupa_tekst { width:100%; padding-left:0%; justify-content: center;}
.box_do_edycji { width:100%; height:60px; background-color:#E5E5E5; float:left;}
.box_ukryte { width:100%; }
.id_txt_ukryty { display:block; color:#808080; font-size:14px; text-align:center; font-family:'Roboto-Light', Arial, Helvetica, sans-serif;}
.box_add_monitor { width:98%; margin-left:1%; margin-right:1%;}
.box_button_add_remove { width:98%; margin-left:1%; margin-right:1%; float:left; padding-bottom:50px;}
}
@media(max-width:960px) {
.menu_rwd { display:block;}
.no_rwd { display:none;}
.pod_menu_top_content { width:100%; height:auto; z-index:98; }
.box_pod_menu_txt { font-size:18px; color:#4D4D4D; width:100%; margin-right:0px;}
.akcja_rwd:hover { background-color:#F1F1F1;}
.active_pod_menu { color:#662D90; font-family:'Roboto-Black', Arial, Helvetica, sans-serif; font-weight:900; text-align: center; display: block;}
.menu_rwd_test {display: flex; justify-content: center; align-items: center; padding-top:10px; padding-bottom:10px;}
.temat_rwd_menu { background-color:#6E3896; color:#FFF;}
.cl-effect-4 a::after { display:none;}
}
@media(max-width:800px) {
/* <-- -------------------------------------------------- -- TEKST TABELA -- -------------------------------------------------- --> */
.dwa_boksy_dane { width:100%; display: block; float:left; margin-right:0%;}
.dwa_boksy_dane:last-child { width:100%; margin-right:0%;}
.box_szary_opisy { width:49.5%; margin-left:1%; margin-top:0px;}
.box_szary_opisy:first-child { width:49.5%; margin-left:0%; margin-top:0%;}
.box_szary_opisy:last-child { width:49.5%; margin-right:0%; margin-top:0%;}
}
@media(max-width:480px) {
/* <-- -------------------------------------------------- -- TEKST TABELA -- -------------------------------------------------- --> */
.dwa_boksy_dane { width:100%; display: block; float:left; margin-right:0%;}
.dwa_boksy_dane:last-child { width:100%; margin-right:0%;}
.box_szary_opisy { width:100%; margin-left:0%; margin-top:0px;}
.box_szary_opisy:first-child { width:100%; margin-left:0%; margin-top:0%;}
.box_szary_opisy:last-child { width:100%; margin-right:0%; margin-top:0%;}
}
.box_user { padding-top:50px;}
.box_set_screen_margin { margin-top:30px;}
.box_godziny, .box_minuty, .box_sekundy { float:left; margin-right:10px; margin-top:20px;}
.box_add_playlist_small { width:10%; text-align:left !important; }
.box_add_playlist_regular { width:10%; text-align:left !important;}
.box_add_playlist_big { width:30%; text-align:left !important;}
.box_add_playlist_normal { width:20%; text-align:left !important;}
.box_add_playlist_zdjecie { width:100%; max-width:100px;}
.box_add_playlist_big_zm { width:60%; text-align:left !important;}
.box_add_playlist_regular_zm { width:30%; text-align:left !important;}
.white_txt { color:#FFF;}
@media(max-width:790px) {
.box_left_playlista { width:100%;}
.box_right_playlista { width:100%;}
.box_group_wysoki_big {display:block;}
.box_group_big {display:block;}
.box_no_padding { padding-left:0px !important;}
.box_add_playlist_small { width:100%; text-align: center !important; padding-top:5px; padding-bottom:5px;}
.box_add_playlist_regular { width:100%; text-align:center !important; padding-top:5px; padding-bottom:5px;}
.box_add_playlist_big { width:100%; text-align:center !important; padding-top:5px; padding-bottom:5px;}
.box_add_playlist_normal { width:100%; text-align:center !important; padding-top:5px; padding-bottom:5px;}
.box_add_playlist_zdjecie { width:100%; max-width:100px; text-align:center !important; display:inline-block; margin-bottom:10px; margin-top:10px}
.box_czas_all_playlist { display:inline-block;}
.box_add_playlist_big_zm { width:100%; text-align:center !important;}
.box_add_playlist_regular_zm { width:100%; text-align:center !important;}
}
.box_godziny_playlista, .box_minuty_playlista, .box_sekundy_playlista { float:left; margin-right:10px; padding-top:10px !important;}
.well_box { width:100%; height:auto; max-width:668px; background-color:#FFFFFF;}
.box_all_box { width:90%; margin-left:5%; margin-right:5%; padding-top:30px;}
.popup_temat { width:100%; text-align:center; color:#4D4D4D; font-size:22px; margin-bottom:30px;}
.box_anuluj { padding-bottom:30px; padding-top:30px; width:100%; height:auto; text-align:center; display:block;}
.box_progress {width:100%; height:20px; background-color:#E5E5E5;}
.box_progress_color {width:25%; height:20px; background-color:#8C5EB6;}
/* radio button */
.container{
display: block;
margin: auto;
height: auto;
width: 100%;
}
.container ul{
list-style: none;
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
ul li{
color: #777577;
display: block;
position: relative;
float: left;
width: auto;
height: auto;
}
ul li input[type=radio]{
position: absolute;
visibility: hidden;
}
ul li label{
display: block;
position: relative;
font-weight: 300;
font-size: 1.35em;
padding: 25px 25px 25px 30px;
margin: 12px auto;
margin-left:10px;
height: 30px;
z-index: 9;
cursor: pointer;
-webkit-transition: all 0.25s linear;
}
ul li:hover label{
color: #777577;
}
ul li .check{
display: block;
position: absolute;
border: 4px solid #777577;
border-radius: 100%;
height: 25px;
width: 25px;
top: 30px;
left: 0px;
z-index: 5;
transition: border .25s linear;
-webkit-transition: border .25s linear;
}
ul li:hover .check {
border: 4px solid #777577;
}
ul li .check::before {
display: block;
position: absolute;
content: '';
border-radius: 100%;
height: 15px;
width: 15px;
top: 5px;
left: 5px;
margin: auto;
transition: background 0.25s linear;
-webkit-transition: background 0.25s linear;
}
input[type=radio]:checked ~ .check {
border: 4px solid #662D91;
}
input[type=radio]:checked ~ .check::before{
background: #662D91;
}
input[type=radio]:checked ~ label{
color: #662D91;
}
.box_arrow_sorting { text-align:center; font-size:30px;}
.sorting_top { width:100%; float:left; color:#FFF; height:50px;}
.top_arrow { padding-top:10px;}
.sorting_bottom { width:100%; float:left; color:#FFF; height:50px;}
.sorting_top:hover, .sorting_bottom:hover { width:100%; float:left; color:#FFF; background-color:#451C68; height:50px;}
.box_txt_select { float:left; width:40%; margin-left:5%;}
.box_txt_select:first-child { margin-left:0px;}
.msg_ukryj{
z-index: 200000;
font-family:'Roboto-Black', Arial, Helvetica, sans-serif;
text-align:center;
position: relative;
background:#fff;
color:#662D90;
font-weight:bold;
padding: 20px 20px 20px 20px;
-webkit-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.25);
-moz-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.25);
box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.25);
}