@charset "utf-8";

*,*::before,*::after{
    box-sizing: border-box;
}
*:focus{
    outline: none;
}
:root{
    --primary-color: #673AB7;
    --secondary-color: #ff4081;
}
/*body{
    font-size: 1.2rem;
    font-weight: 300;
}*/
/*color palete*/
.materialize-red.lighten-5{background-color:#fdeaeb!important}.materialize-red-text.text-lighten-5{color:#fdeaeb!important}.materialize-red.lighten-4{background-color:#f8c1c3!important}.materialize-red-text.text-lighten-4{color:#f8c1c3!important}.materialize-red.lighten-3{background-color:#f3989b!important}.materialize-red-text.text-lighten-3{color:#f3989b!important}.materialize-red.lighten-2{background-color:#ee6e73!important}.materialize-red-text.text-lighten-2{color:#ee6e73!important}.materialize-red.lighten-1{background-color:#ea454b!important}.materialize-red-text.text-lighten-1{color:#ea454b!important}.materialize-red{background-color:#e51c23!important}.materialize-red-text{color:#e51c23!important}.materialize-red.darken-1{background-color:#d0181e!important}.materialize-red-text.text-darken-1{color:#d0181e!important}.materialize-red.darken-2{background-color:#b9151b!important}.materialize-red-text.text-darken-2{color:#b9151b!important}.materialize-red.darken-3{background-color:#a21318!important}.materialize-red-text.text-darken-3{color:#a21318!important}.materialize-red.darken-4{background-color:#8b1014!important}.materialize-red-text.text-darken-4{color:#8b1014!important}.red.lighten-5{background-color:#FFEBEE!important}.red-text.text-lighten-5{color:#FFEBEE!important}.red.lighten-4{background-color:#FFCDD2!important}.red-text.text-lighten-4{color:#FFCDD2!important}.red.lighten-3{background-color:#EF9A9A!important}.red-text.text-lighten-3{color:#EF9A9A!important}.red.lighten-2{background-color:#E57373!important}.red-text.text-lighten-2{color:#E57373!important}.red.lighten-1{background-color:#EF5350!important}.red-text.text-lighten-1{color:#EF5350!important}.red{background-color:#F44336!important}.red-text{color:#F44336!important}.red.darken-1{background-color:#E53935!important}.red-text.text-darken-1{color:#E53935!important}.red.darken-2{background-color:#D32F2F!important}.red-text.text-darken-2{color:#D32F2F!important}.red.darken-3{background-color:#C62828!important}.red-text.text-darken-3{color:#C62828!important}.red.darken-4{background-color:#B71C1C!important}.red-text.text-darken-4{color:#B71C1C!important}.red.accent-1{background-color:#FF8A80!important}.red-text.text-accent-1{color:#FF8A80!important}.red.accent-2{background-color:#FF5252!important}.red-text.text-accent-2{color:#FF5252!important}.red.accent-3{background-color:#FF1744!important}.red-text.text-accent-3{color:#FF1744!important}.red.accent-4{background-color:#D50000!important}.red-text.text-accent-4{color:#D50000!important}.pink.lighten-5{background-color:#fce4ec!important}.pink-text.text-lighten-5{color:#fce4ec!important}.pink.lighten-4{background-color:#f8bbd0!important}.pink-text.text-lighten-4{color:#f8bbd0!important}.pink.lighten-3{background-color:#f48fb1!important}.pink-text.text-lighten-3{color:#f48fb1!important}.pink.lighten-2{background-color:#f06292!important}.pink-text.text-lighten-2{color:#f06292!important}.pink.lighten-1{background-color:#ec407a!important}.pink-text.text-lighten-1{color:#ec407a!important}.pink{background-color:#e91e63!important}.pink-text{color:#e91e63!important}.pink.darken-1{background-color:#d81b60!important}.pink-text.text-darken-1{color:#d81b60!important}.pink.darken-2{background-color:#c2185b!important}.pink-text.text-darken-2{color:#c2185b!important}.pink.darken-3{background-color:#ad1457!important}.pink-text.text-darken-3{color:#ad1457!important}.pink.darken-4{background-color:#880e4f!important}.pink-text.text-darken-4{color:#880e4f!important}.pink.accent-1{background-color:#ff80ab!important}.pink-text.text-accent-1{color:#ff80ab!important}.pink.accent-2{background-color:#ff4081!important}.pink-text.text-accent-2{color:#ff4081!important}.pink.accent-3{background-color:#f50057!important}.pink-text.text-accent-3{color:#f50057!important}.pink.accent-4{background-color:#c51162!important}.pink-text.text-accent-4{color:#c51162!important}.purple.lighten-5{background-color:#f3e5f5!important}.purple-text.text-lighten-5{color:#f3e5f5!important}.purple.lighten-4{background-color:#e1bee7!important}.purple-text.text-lighten-4{color:#e1bee7!important}.purple.lighten-3{background-color:#ce93d8!important}.purple-text.text-lighten-3{color:#ce93d8!important}.purple.lighten-2{background-color:#ba68c8!important}.purple-text.text-lighten-2{color:#ba68c8!important}.purple.lighten-1{background-color:#ab47bc!important}.purple-text.text-lighten-1{color:#ab47bc!important}.purple{background-color:#9c27b0!important}.purple-text{color:#9c27b0!important}.purple.darken-1{background-color:#8e24aa!important}.purple-text.text-darken-1{color:#8e24aa!important}.purple.darken-2{background-color:#7b1fa2!important}.purple-text.text-darken-2{color:#7b1fa2!important}.purple.darken-3{background-color:#6a1b9a!important}.purple-text.text-darken-3{color:#6a1b9a!important}.purple.darken-4{background-color:#4a148c!important}.purple-text.text-darken-4{color:#4a148c!important}.purple.accent-1{background-color:#ea80fc!important}.purple-text.text-accent-1{color:#ea80fc!important}.purple.accent-2{background-color:#e040fb!important}.purple-text.text-accent-2{color:#e040fb!important}.purple.accent-3{background-color:#d500f9!important}.purple-text.text-accent-3{color:#d500f9!important}.purple.accent-4{background-color:#a0f!important}.purple-text.text-accent-4{color:#a0f!important}.deep-purple.lighten-5{background-color:#ede7f6!important}.deep-purple-text.text-lighten-5{color:#ede7f6!important}.deep-purple.lighten-4{background-color:#d1c4e9!important}.deep-purple-text.text-lighten-4{color:#d1c4e9!important}.deep-purple.lighten-3{background-color:#b39ddb!important}.deep-purple-text.text-lighten-3{color:#b39ddb!important}.deep-purple.lighten-2{background-color:#9575cd!important}.deep-purple-text.text-lighten-2{color:#9575cd!important}.deep-purple.lighten-1{background-color:#7e57c2!important}.deep-purple-text.text-lighten-1{color:#7e57c2!important}.deep-purple{background-color:#673ab7!important}.deep-purple-text{color:#673ab7!important}.deep-purple.darken-1{background-color:#5e35b1!important}.deep-purple-text.text-darken-1{color:#5e35b1!important}.deep-purple.darken-2{background-color:#512da8!important}.deep-purple-text.text-darken-2{color:#512da8!important}.deep-purple.darken-3{background-color:#4527a0!important}.deep-purple-text.text-darken-3{color:#4527a0!important}.deep-purple.darken-4{background-color:#311b92!important}.deep-purple-text.text-darken-4{color:#311b92!important}.deep-purple.accent-1{background-color:#b388ff!important}.deep-purple-text.text-accent-1{color:#b388ff!important}.deep-purple.accent-2{background-color:#7c4dff!important}.deep-purple-text.text-accent-2{color:#7c4dff!important}.deep-purple.accent-3{background-color:#651fff!important}.deep-purple-text.text-accent-3{color:#651fff!important}.deep-purple.accent-4{background-color:#6200ea!important}.deep-purple-text.text-accent-4{color:#6200ea!important}.indigo.lighten-5{background-color:#e8eaf6!important}.indigo-text.text-lighten-5{color:#e8eaf6!important}.indigo.lighten-4{background-color:#c5cae9!important}.indigo-text.text-lighten-4{color:#c5cae9!important}.indigo.lighten-3{background-color:#9fa8da!important}.indigo-text.text-lighten-3{color:#9fa8da!important}.indigo.lighten-2{background-color:#7986cb!important}.indigo-text.text-lighten-2{color:#7986cb!important}.indigo.lighten-1{background-color:#5c6bc0!important}.indigo-text.text-lighten-1{color:#5c6bc0!important}.indigo{background-color:#3f51b5!important}.indigo-text{color:#3f51b5!important}.indigo.darken-1{background-color:#3949ab!important}.indigo-text.text-darken-1{color:#3949ab!important}.indigo.darken-2{background-color:#303f9f!important}.indigo-text.text-darken-2{color:#303f9f!important}.indigo.darken-3{background-color:#283593!important}.indigo-text.text-darken-3{color:#283593!important}.indigo.darken-4{background-color:#1a237e!important}.indigo-text.text-darken-4{color:#1a237e!important}.indigo.accent-1{background-color:#8c9eff!important}.indigo-text.text-accent-1{color:#8c9eff!important}.indigo.accent-2{background-color:#536dfe!important}.indigo-text.text-accent-2{color:#536dfe!important}.indigo.accent-3{background-color:#3d5afe!important}.indigo-text.text-accent-3{color:#3d5afe!important}.indigo.accent-4{background-color:#304ffe!important}.indigo-text.text-accent-4{color:#304ffe!important}.blue.lighten-5{background-color:#E3F2FD!important}.blue-text.text-lighten-5{color:#E3F2FD!important}.blue.lighten-4{background-color:#BBDEFB!important}.blue-text.text-lighten-4{color:#BBDEFB!important}.blue.lighten-3{background-color:#90CAF9!important}.blue-text.text-lighten-3{color:#90CAF9!important}.blue.lighten-2{background-color:#64B5F6!important}.blue-text.text-lighten-2{color:#64B5F6!important}.blue.lighten-1{background-color:#42A5F5!important}.blue-text.text-lighten-1{color:#42A5F5!important}.blue{background-color:#2196F3!important}.blue-text{color:#2196F3!important}.blue.darken-1{background-color:#1E88E5!important}.blue-text.text-darken-1{color:#1E88E5!important}.blue.darken-2{background-color:#1976D2!important}.blue-text.text-darken-2{color:#1976D2!important}.blue.darken-3{background-color:#1565C0!important}.blue-text.text-darken-3{color:#1565C0!important}.blue.darken-4{background-color:#0D47A1!important}.blue-text.text-darken-4{color:#0D47A1!important}.blue.accent-1{background-color:#82B1FF!important}.blue-text.text-accent-1{color:#82B1FF!important}.blue.accent-2{background-color:#448AFF!important}.blue-text.text-accent-2{color:#448AFF!important}.blue.accent-3{background-color:#2979FF!important}.blue-text.text-accent-3{color:#2979FF!important}.blue.accent-4{background-color:#2962FF!important}.blue-text.text-accent-4{color:#2962FF!important}.light-blue.lighten-5{background-color:#e1f5fe!important}.light-blue-text.text-lighten-5{color:#e1f5fe!important}.light-blue.lighten-4{background-color:#b3e5fc!important}.light-blue-text.text-lighten-4{color:#b3e5fc!important}.light-blue.lighten-3{background-color:#81d4fa!important}.light-blue-text.text-lighten-3{color:#81d4fa!important}.light-blue.lighten-2{background-color:#4fc3f7!important}.light-blue-text.text-lighten-2{color:#4fc3f7!important}.light-blue.lighten-1{background-color:#29b6f6!important}.light-blue-text.text-lighten-1{color:#29b6f6!important}.light-blue{background-color:#03a9f4!important}.light-blue-text{color:#03a9f4!important}.light-blue.darken-1{background-color:#039be5!important}.light-blue-text.text-darken-1{color:#039be5!important}.light-blue.darken-2{background-color:#0288d1!important}.light-blue-text.text-darken-2{color:#0288d1!important}.light-blue.darken-3{background-color:#0277bd!important}.light-blue-text.text-darken-3{color:#0277bd!important}.light-blue.darken-4{background-color:#01579b!important}.light-blue-text.text-darken-4{color:#01579b!important}.light-blue.accent-1{background-color:#80d8ff!important}.light-blue-text.text-accent-1{color:#80d8ff!important}.light-blue.accent-2{background-color:#40c4ff!important}.light-blue-text.text-accent-2{color:#40c4ff!important}.light-blue.accent-3{background-color:#00b0ff!important}.light-blue-text.text-accent-3{color:#00b0ff!important}.light-blue.accent-4{background-color:#0091ea!important}.light-blue-text.text-accent-4{color:#0091ea!important}.cyan.lighten-5{background-color:#e0f7fa!important}.cyan-text.text-lighten-5{color:#e0f7fa!important}.cyan.lighten-4{background-color:#b2ebf2!important}.cyan-text.text-lighten-4{color:#b2ebf2!important}.cyan.lighten-3{background-color:#80deea!important}.cyan-text.text-lighten-3{color:#80deea!important}.cyan.lighten-2{background-color:#4dd0e1!important}.cyan-text.text-lighten-2{color:#4dd0e1!important}.cyan.lighten-1{background-color:#26c6da!important}.cyan-text.text-lighten-1{color:#26c6da!important}.cyan{background-color:#00bcd4!important}.cyan-text{color:#00bcd4!important}.cyan.darken-1{background-color:#00acc1!important}.cyan-text.text-darken-1{color:#00acc1!important}.cyan.darken-2{background-color:#0097a7!important}.cyan-text.text-darken-2{color:#0097a7!important}.cyan.darken-3{background-color:#00838f!important}.cyan-text.text-darken-3{color:#00838f!important}.cyan.darken-4{background-color:#006064!important}.cyan-text.text-darken-4{color:#006064!important}.cyan.accent-1{background-color:#84ffff!important}.cyan-text.text-accent-1{color:#84ffff!important}.cyan.accent-2{background-color:#18ffff!important}.cyan-text.text-accent-2{color:#18ffff!important}.cyan.accent-3{background-color:#00e5ff!important}.cyan-text.text-accent-3{color:#00e5ff!important}.cyan.accent-4{background-color:#00b8d4!important}.cyan-text.text-accent-4{color:#00b8d4!important}.teal.lighten-5{background-color:#e0f2f1!important}.teal-text.text-lighten-5{color:#e0f2f1!important}.teal.lighten-4{background-color:#b2dfdb!important}.teal-text.text-lighten-4{color:#b2dfdb!important}.teal.lighten-3{background-color:#80cbc4!important}.teal-text.text-lighten-3{color:#80cbc4!important}.teal.lighten-2{background-color:#4db6ac!important}.teal-text.text-lighten-2{color:#4db6ac!important}.teal.lighten-1{background-color:#26a69a!important}.teal-text.text-lighten-1{color:#26a69a!important}.teal{background-color:#009688!important}.teal-text{color:#009688!important}.teal.darken-1{background-color:#00897b!important}.teal-text.text-darken-1{color:#00897b!important}.teal.darken-2{background-color:#00796b!important}.teal-text.text-darken-2{color:#00796b!important}.teal.darken-3{background-color:#00695c!important}.teal-text.text-darken-3{color:#00695c!important}.teal.darken-4{background-color:#004d40!important}.teal-text.text-darken-4{color:#004d40!important}.teal.accent-1{background-color:#a7ffeb!important}.teal-text.text-accent-1{color:#a7ffeb!important}.teal.accent-2{background-color:#64ffda!important}.teal-text.text-accent-2{color:#64ffda!important}.teal.accent-3{background-color:#1de9b6!important}.teal-text.text-accent-3{color:#1de9b6!important}.teal.accent-4{background-color:#00bfa5!important}.teal-text.text-accent-4{color:#00bfa5!important}.green.lighten-5{background-color:#E8F5E9!important}.green-text.text-lighten-5{color:#E8F5E9!important}.green.lighten-4{background-color:#C8E6C9!important}.green-text.text-lighten-4{color:#C8E6C9!important}.green.lighten-3{background-color:#A5D6A7!important}.green-text.text-lighten-3{color:#A5D6A7!important}.green.lighten-2{background-color:#81C784!important}.green-text.text-lighten-2{color:#81C784!important}.green.lighten-1{background-color:#66BB6A!important}.green-text.text-lighten-1{color:#66BB6A!important}.green{background-color:#4CAF50!important}.green-text{color:#4CAF50!important}.green.darken-1{background-color:#43A047!important}.green-text.text-darken-1{color:#43A047!important}.green.darken-2{background-color:#388E3C!important}.green-text.text-darken-2{color:#388E3C!important}.green.darken-3{background-color:#2E7D32!important}.green-text.text-darken-3{color:#2E7D32!important}.green.darken-4{background-color:#1B5E20!important}.green-text.text-darken-4{color:#1B5E20!important}.green.accent-1{background-color:#B9F6CA!important}.green-text.text-accent-1{color:#B9F6CA!important}.green.accent-2{background-color:#69F0AE!important}.green-text.text-accent-2{color:#69F0AE!important}.green.accent-3{background-color:#00E676!important}.green-text.text-accent-3{color:#00E676!important}.green.accent-4{background-color:#00C853!important}.green-text.text-accent-4{color:#00C853!important}.light-green.lighten-5{background-color:#f1f8e9!important}.light-green-text.text-lighten-5{color:#f1f8e9!important}.light-green.lighten-4{background-color:#dcedc8!important}.light-green-text.text-lighten-4{color:#dcedc8!important}.light-green.lighten-3{background-color:#c5e1a5!important}.light-green-text.text-lighten-3{color:#c5e1a5!important}.light-green.lighten-2{background-color:#aed581!important}.light-green-text.text-lighten-2{color:#aed581!important}.light-green.lighten-1{background-color:#9ccc65!important}.light-green-text.text-lighten-1{color:#9ccc65!important}.light-green{background-color:#8bc34a!important}.light-green-text{color:#8bc34a!important}.light-green.darken-1{background-color:#7cb342!important}.light-green-text.text-darken-1{color:#7cb342!important}.light-green.darken-2{background-color:#689f38!important}.light-green-text.text-darken-2{color:#689f38!important}.light-green.darken-3{background-color:#558b2f!important}.light-green-text.text-darken-3{color:#558b2f!important}.light-green.darken-4{background-color:#33691e!important}.light-green-text.text-darken-4{color:#33691e!important}.light-green.accent-1{background-color:#ccff90!important}.light-green-text.text-accent-1{color:#ccff90!important}.light-green.accent-2{background-color:#b2ff59!important}.light-green-text.text-accent-2{color:#b2ff59!important}.light-green.accent-3{background-color:#76ff03!important}.light-green-text.text-accent-3{color:#76ff03!important}.light-green.accent-4{background-color:#64dd17!important}.light-green-text.text-accent-4{color:#64dd17!important}.lime.lighten-5{background-color:#f9fbe7!important}.lime-text.text-lighten-5{color:#f9fbe7!important}.lime.lighten-4{background-color:#f0f4c3!important}.lime-text.text-lighten-4{color:#f0f4c3!important}.lime.lighten-3{background-color:#e6ee9c!important}.lime-text.text-lighten-3{color:#e6ee9c!important}.lime.lighten-2{background-color:#dce775!important}.lime-text.text-lighten-2{color:#dce775!important}.lime.lighten-1{background-color:#d4e157!important}.lime-text.text-lighten-1{color:#d4e157!important}.lime{background-color:#cddc39!important}.lime-text{color:#cddc39!important}.lime.darken-1{background-color:#c0ca33!important}.lime-text.text-darken-1{color:#c0ca33!important}.lime.darken-2{background-color:#afb42b!important}.lime-text.text-darken-2{color:#afb42b!important}.lime.darken-3{background-color:#9e9d24!important}.lime-text.text-darken-3{color:#9e9d24!important}.lime.darken-4{background-color:#827717!important}.lime-text.text-darken-4{color:#827717!important}.lime.accent-1{background-color:#f4ff81!important}.lime-text.text-accent-1{color:#f4ff81!important}.lime.accent-2{background-color:#eeff41!important}.lime-text.text-accent-2{color:#eeff41!important}.lime.accent-3{background-color:#c6ff00!important}.lime-text.text-accent-3{color:#c6ff00!important}.lime.accent-4{background-color:#aeea00!important}.lime-text.text-accent-4{color:#aeea00!important}.yellow.lighten-5{background-color:#fffde7!important}.yellow-text.text-lighten-5{color:#fffde7!important}.yellow.lighten-4{background-color:#fff9c4!important}.yellow-text.text-lighten-4{color:#fff9c4!important}.yellow.lighten-3{background-color:#fff59d!important}.yellow-text.text-lighten-3{color:#fff59d!important}.yellow.lighten-2{background-color:#fff176!important}.yellow-text.text-lighten-2{color:#fff176!important}.yellow.lighten-1{background-color:#ffee58!important}.yellow-text.text-lighten-1{color:#ffee58!important}.yellow{background-color:#ffeb3b!important}.yellow-text{color:#ffeb3b!important}.yellow.darken-1{background-color:#fdd835!important}.yellow-text.text-darken-1{color:#fdd835!important}.yellow.darken-2{background-color:#fbc02d!important}.yellow-text.text-darken-2{color:#fbc02d!important}.yellow.darken-3{background-color:#f9a825!important}.yellow-text.text-darken-3{color:#f9a825!important}.yellow.darken-4{background-color:#f57f17!important}.yellow-text.text-darken-4{color:#f57f17!important}.yellow.accent-1{background-color:#ffff8d!important}.yellow-text.text-accent-1{color:#ffff8d!important}.yellow.accent-2{background-color:#ff0!important}.yellow-text.text-accent-2{color:#ff0!important}.yellow.accent-3{background-color:#ffea00!important}.yellow-text.text-accent-3{color:#ffea00!important}.yellow.accent-4{background-color:#ffd600!important}.yellow-text.text-accent-4{color:#ffd600!important}.amber.lighten-5{background-color:#fff8e1!important}.amber-text.text-lighten-5{color:#fff8e1!important}.amber.lighten-4{background-color:#ffecb3!important}.amber-text.text-lighten-4{color:#ffecb3!important}.amber.lighten-3{background-color:#ffe082!important}.amber-text.text-lighten-3{color:#ffe082!important}.amber.lighten-2{background-color:#ffd54f!important}.amber-text.text-lighten-2{color:#ffd54f!important}.amber.lighten-1{background-color:#ffca28!important}.amber-text.text-lighten-1{color:#ffca28!important}.amber{background-color:#ffc107!important}.amber-text{color:#ffc107!important}.amber.darken-1{background-color:#ffb300!important}.amber-text.text-darken-1{color:#ffb300!important}.amber.darken-2{background-color:#ffa000!important}.amber-text.text-darken-2{color:#ffa000!important}.amber.darken-3{background-color:#ff8f00!important}.amber-text.text-darken-3{color:#ff8f00!important}.amber.darken-4{background-color:#ff6f00!important}.amber-text.text-darken-4{color:#ff6f00!important}.amber.accent-1{background-color:#ffe57f!important}.amber-text.text-accent-1{color:#ffe57f!important}.amber.accent-2{background-color:#ffd740!important}.amber-text.text-accent-2{color:#ffd740!important}.amber.accent-3{background-color:#ffc400!important}.amber-text.text-accent-3{color:#ffc400!important}.amber.accent-4{background-color:#ffab00!important}.amber-text.text-accent-4{color:#ffab00!important}.orange.lighten-5{background-color:#fff3e0!important}.orange-text.text-lighten-5{color:#fff3e0!important}.orange.lighten-4{background-color:#ffe0b2!important}.orange-text.text-lighten-4{color:#ffe0b2!important}.orange.lighten-3{background-color:#ffcc80!important}.orange-text.text-lighten-3{color:#ffcc80!important}.orange.lighten-2{background-color:#ffb74d!important}.orange-text.text-lighten-2{color:#ffb74d!important}.orange.lighten-1{background-color:#ffa726!important}.orange-text.text-lighten-1{color:#ffa726!important}.orange{background-color:#ff9800!important}.orange-text{color:#ff9800!important}.orange.darken-1{background-color:#fb8c00!important}.orange-text.text-darken-1{color:#fb8c00!important}.orange.darken-2{background-color:#f57c00!important}.orange-text.text-darken-2{color:#f57c00!important}.orange.darken-3{background-color:#ef6c00!important}.orange-text.text-darken-3{color:#ef6c00!important}.orange.darken-4{background-color:#e65100!important}.orange-text.text-darken-4{color:#e65100!important}.orange.accent-1{background-color:#ffd180!important}.orange-text.text-accent-1{color:#ffd180!important}.orange.accent-2{background-color:#ffab40!important}.orange-text.text-accent-2{color:#ffab40!important}.orange.accent-3{background-color:#ff9100!important}.orange-text.text-accent-3{color:#ff9100!important}.orange.accent-4{background-color:#ff6d00!important}.orange-text.text-accent-4{color:#ff6d00!important}.deep-orange.lighten-5{background-color:#fbe9e7!important}.deep-orange-text.text-lighten-5{color:#fbe9e7!important}.deep-orange.lighten-4{background-color:#ffccbc!important}.deep-orange-text.text-lighten-4{color:#ffccbc!important}.deep-orange.lighten-3{background-color:#ffab91!important}.deep-orange-text.text-lighten-3{color:#ffab91!important}.deep-orange.lighten-2{background-color:#ff8a65!important}.deep-orange-text.text-lighten-2{color:#ff8a65!important}.deep-orange.lighten-1{background-color:#ff7043!important}.deep-orange-text.text-lighten-1{color:#ff7043!important}.deep-orange{background-color:#ff5722!important}.deep-orange-text{color:#ff5722!important}.deep-orange.darken-1{background-color:#f4511e!important}.deep-orange-text.text-darken-1{color:#f4511e!important}.deep-orange.darken-2{background-color:#e64a19!important}.deep-orange-text.text-darken-2{color:#e64a19!important}.deep-orange.darken-3{background-color:#d84315!important}.deep-orange-text.text-darken-3{color:#d84315!important}.deep-orange.darken-4{background-color:#bf360c!important}.deep-orange-text.text-darken-4{color:#bf360c!important}.deep-orange.accent-1{background-color:#ff9e80!important}.deep-orange-text.text-accent-1{color:#ff9e80!important}.deep-orange.accent-2{background-color:#ff6e40!important}.deep-orange-text.text-accent-2{color:#ff6e40!important}.deep-orange.accent-3{background-color:#ff3d00!important}.deep-orange-text.text-accent-3{color:#ff3d00!important}.deep-orange.accent-4{background-color:#dd2c00!important}.deep-orange-text.text-accent-4{color:#dd2c00!important}.brown.lighten-5{background-color:#efebe9!important}.brown-text.text-lighten-5{color:#efebe9!important}.brown.lighten-4{background-color:#d7ccc8!important}.brown-text.text-lighten-4{color:#d7ccc8!important}.brown.lighten-3{background-color:#bcaaa4!important}.brown-text.text-lighten-3{color:#bcaaa4!important}.brown.lighten-2{background-color:#a1887f!important}.brown-text.text-lighten-2{color:#a1887f!important}.brown.lighten-1{background-color:#8d6e63!important}.brown-text.text-lighten-1{color:#8d6e63!important}.brown{background-color:#795548!important}.brown-text{color:#795548!important}.brown.darken-1{background-color:#6d4c41!important}.brown-text.text-darken-1{color:#6d4c41!important}.brown.darken-2{background-color:#5d4037!important}.brown-text.text-darken-2{color:#5d4037!important}.brown.darken-3{background-color:#4e342e!important}.brown-text.text-darken-3{color:#4e342e!important}.brown.darken-4{background-color:#3e2723!important}.brown-text.text-darken-4{color:#3e2723!important}.blue-grey.lighten-5{background-color:#eceff1!important}.blue-grey-text.text-lighten-5{color:#eceff1!important}.blue-grey.lighten-4{background-color:#cfd8dc!important}.blue-grey-text.text-lighten-4{color:#cfd8dc!important}.blue-grey.lighten-3{background-color:#b0bec5!important}.blue-grey-text.text-lighten-3{color:#b0bec5!important}.blue-grey.lighten-2{background-color:#90a4ae!important}.blue-grey-text.text-lighten-2{color:#90a4ae!important}.blue-grey.lighten-1{background-color:#78909c!important}.blue-grey-text.text-lighten-1{color:#78909c!important}.blue-grey{background-color:#607d8b!important}.blue-grey-text{color:#607d8b!important}.blue-grey.darken-1{background-color:#546e7a!important}.blue-grey-text.text-darken-1{color:#546e7a!important}.blue-grey.darken-2{background-color:#455a64!important}.blue-grey-text.text-darken-2{color:#455a64!important}.blue-grey.darken-3{background-color:#37474f!important}.blue-grey-text.text-darken-3{color:#37474f!important}.blue-grey.darken-4{background-color:#263238!important}.blue-grey-text.text-darken-4{color:#263238!important}.grey.lighten-5{background-color:#fafafa!important}.grey-text.text-lighten-5{color:#fafafa!important}.grey.lighten-4{background-color:#f5f5f5!important}.grey-text.text-lighten-4{color:#f5f5f5!important}.grey.lighten-3{background-color:#eee!important}.grey-text.text-lighten-3{color:#eee!important}.grey.lighten-2{background-color:#e0e0e0!important}.grey-text.text-lighten-2{color:#e0e0e0!important}.grey.lighten-1{background-color:#bdbdbd!important}.grey-text.text-lighten-1{color:#bdbdbd!important}.grey{background-color:#9e9e9e!important}.grey-text{color:#9e9e9e!important}.grey.darken-1{background-color:#757575!important}.grey-text.text-darken-1{color:#757575!important}.grey.darken-2{background-color:#616161!important}.grey-text.text-darken-2{color:#616161!important}.grey.darken-3{background-color:#424242!important}.grey-text.text-darken-3{color:#424242!important}.grey.darken-4{background-color:#212121!important}.grey-text.text-darken-4{color:#212121!important}.shades.black{background-color:#000!important}.shades-text.text-black{color:#000!important}.shades.white{background-color:#fff!important}.shades-text.text-white{color:#fff!important}.shades.transparent{background-color:transparent!important}.shades-text.text-transparent{color:transparent!important}.black{background-color:#000!important}.black-text{color:#000!important}.white{background-color:#fff!important}.white-text{color:#fff!important}
/*end color palete*/

/*custom cx*/

body{
    background: #f7f7f7;
}
/*animasi loading*/

#loader-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000
}
#loader-wrapper .loader-section {
    position: fixed;
    top: 0;
    width: 51%;
    height: 100%;
    background: #eceff1;
    z-index: 1000;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0)
}
#loader-wrapper .loader-section.section-left {
    left: 0
}
#loader-wrapper .loader-section.section-right {
    right: 0
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    100% {
        -webkit-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}
@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    100% {
        -webkit-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}
.loaded #loader-wrapper {
    visibility: hidden;
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    transform: translateY(-100%);
    -webkit-transition: all 0.3s 1s ease-out;
    transition: all 0.3s 1s ease-out
}
.loaded #loader-wrapper .loader-section.section-left {
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1)
}
.loaded #loader-wrapper .loader-section.section-right {
    -webkit-transform: translateX(100%);
    -ms-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1)
}
.loaded #loader {
    opacity: 0;
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out
}

/*end animasi loading*/


.cxform .label{ color: #313534; font-weight: 300; font-size: 1em;}

/*.container-fluid{margin-top: 10px;}*/

#last_login{font-weight: 300;}

.form-horizontal .card .style-primary, .style-primary {background-color: #6059bf;border-color: #6059bf;color: #ffffff;}
.form-horizontal .card .green-header, .green-header {background-color: #4caf50;border-color: #4caf50;color: #ffffff;}
.form-horizontal .card .green-header2, .green-header2 {background-color: #08b80f;border-color: #08b80f;color: #ffffff;}
.form-horizontal .card .light-green-header, .light-green-header {background-color: #8BC34A;border-color: #8BC34A;color: #ffffff;}
.form-horizontal .card .orange-header, .orange-header {background-color: #ff9800;border-color: #ff9800;color: #ffffff;}
.form-horizontal .card .orange-light-header, .orange-light-header {background-color: #FFF3E0;border-color: #E65100;color: #FF9800;border-bottom: 1px solid #ffcbaf;}
.form-horizontal .card .purple-header, .purple-header {background-color: #9c27b0;border-color: #9c27b0;color: #ffffff;}
.form-horizontal .card .red-header, .red-header {background-color: #f44336;border-color: #f44336;color: #ffffff;}
.form-horizontal .card .pink-header, .pink-header {background-color: #e91e63;border-color: #e91e63;color: #ffffff;}
.form-horizontal .card .teal-header, .teal-header {background-color: #009688;border-color: #009688;color: #ffffff;}
.form-horizontal .card .cyan-header, .cyan-header {background-color: #00bcd4;border-color: #00bcd4;color: #ffffff;}
.form-horizontal .card .deep-orange-header, .deep-orange-header {background-color: #ff5722;border-color: #ff5722;color: #ffffff;}
.form-horizontal .card .deep-purple-header, .deep-purple-header {background-color: var(--primary-color);border-color: var(--primary-color);color: #ffffff;}
.form-horizontal .card .blue-header, .blue-header {background-color: #2196f3;border-color: #2196f3;color: #ffffff;}
.form-horizontal .card .indigo-header, .indigo-header {background-color: #3f51b5;border-color: #3f51b5;color: #ffffff;}
.form-horizontal .card .transparent-header {background-color: transparent;border-color: var(--primary-color);color: var(--primary-color);border-bottom: 1px solid rgba(204, 204, 204, 0.35);line-height: 48px;min-height: 48px;}

.form-horizontal .card-head.blue-text-bg{background-color: #e6f4ff;color: #2196F3 !important;}
.form-horizontal .card-head.deep-purple-text-bg{background-color: #f3ebff;color: #673ab7 !important;}
.form-horizontal .card-head.orange-text-bg{background-color: #ffeccf;color: #ff9800 !important;}
.form-horizontal .card-head.red-text-bg{background-color: #ffedeb;color: #F44336 !important;}
.form-horizontal .card-head.green-text-bg{background-color: #dbffdc;color: #4CAF50 !important;}
.form-horizontal .card-head.teal-text-bg{background-color: #dbf6f3;color: #009688 !important;}

.form-horizontal .card-head{line-height: 32px;min-height: 32px;}
.form-horizontal .card-body{padding: 10px 20px;}
.form-horizontal .form-group{margin-bottom: 5px;}

.form-group > label, .form-group .control-label, .input-group-content label {
    font-size: 0.88rem;
    font-weight: 300;
    color: var(--primary-color);
    opacity: 1;
    font-weight: 400;
}

.form-horizontal .form-group > label,.form-horizontal .form-group .control-label {
    opacity: 1;
    padding-top: 8.5px;
}
.card-head header {
    font-weight: 400;
    font-size: 1rem;
    padding: 1rem;
}
.form .card .style-primary {
    background-color: #6059bf;
    border-color: #6059bf;
    color: #ffffff;
}

.form .card .transparent-header {
    background-color: transparent;
    border-color: var(--primary-color);
    color: var(--primary-color);
    border-bottom: 1px solid rgba(204, 204, 204, 0.35);
    /*border-bottom: 1px solid rgb(255, 64, 129);*/
}

.form-control:focus {
    box-shadow: none;
}

.form-control[readonly]{
    cursor: default;
}

.form-control {
    font-size: 0.88rem;
    font-weight: 300;
    color: #313534;
    border-radius: unset;
}

.form-group .form-control~label {
    font-size: 0.88rem;
    opacity: 1;
}

.form-group .form-control:focus ~ label,.form-group .select2-container:hover ~ label {
    color: var(--secondary-color);
    opacity: 1 !important;
}

.form .form-group, .form-inline .form-group {
    padding-top: 15px;
}
.form-group {
    position: relative;
    margin-bottom: 5px;
}

.form-group .form-control ~ label::after, .form-group .form-control ~ .form-control-line::after,.form-group .select2-container ~ label::after {
    background-color: var(--secondary-color);
}

.form-group .input-group-addon i {
    cursor: pointer;
}

.floating-label .form-control ~ label {
    font-size: 0.88rem !important;
    opacity: 1;
}

.floating-label .form-control.dirty~label, .floating-label .form-control:focus~label {
    font-size: 0.88rem !important;
}

.control-label > .mdi{
    font-size: 18px;
}

.select2-results .select2-result-label { font-size: 0.88rem;}
.select2-results li.select2-result-with-children > .select2-result-label {font-weight: 400;}
.select2 {width: 100% !important;}
.select2-container--default .select2-selection--single {background-color: #fff;border: none;border-bottom: 1px solid rgba(12, 12, 12, 0.12);border-radius: 0;height: 37px;}
.select2-dropdown {border: none;border-radius: 0;box-shadow: 0 0 1px 0 rgba(0,0,0,0.33);}
.select2-container--default .select2-results__option[aria-selected=true] {background-color: #ede7f6;color: var(--primary-color);}
.select2-results__option[aria-selected] {cursor: pointer;min-height: 2.5em;font-size: 0.88rem;font-weight: 300;}
.select2-container--default .select2-results__option--highlighted[aria-selected] {background-color: #9575cd;color: white;}
.select2-container--default .select2-search--dropdown .select2-search__field {outline: none;border: none;border-bottom: 1px solid rgba(12, 12, 12, 0.12);font-size: 0.88rem;font-weight: 300;color: #313534;border-radius: 0;}
.select2-container--default .select2-selection--single .select2-selection__rendered {color: #313534;font-size: 0.88rem;font-weight: 300;line-height: 37px;}
.select2-container .select2-selection--single .select2-selection__rendered {padding-left: 0;}
.select2-container--default.select2-container--disabled .select2-selection--single {background-color: #f8f8ff;}
.select2-container--default .select2-selection--multiple {border: none;border-bottom: 1px solid rgba(12, 12, 12, 0.12);border-radius: 0;}
.select2-container--default.select2-container--focus .select2-selection--multiple {border: none;border-bottom: 1px solid rgba(12, 12, 12, 0.12);border-radius: 0;}
.select2-container--default .select2-selection--multiple .select2-selection__choice {background-color: #fafafa;border: 1px solid #eee8e8;border-radius: 3px;}
.select2-selection__clear{color: #c1c0c4;top:-3px;}
.select2-selection__clear:hover{color: #e91e63;}
.select2-container--default .select2-selection--single .select2-selection__arrow b{border-color: #c1c0c4 transparent transparent transparent;}

.jqx-widget {color: #313534;}
.jqx-widget, .jqx-widget-content, .jqx-widget-header, .jqx-fill-state-normal {/*line-height: 37px;*/color: #313534;}
.jqx-listbox.jqx-widget-content{line-height: 37px;}
.jqx-widget-content {font-size: 0.88rem;font-weight: 300;border-color: #d1c4e9;font-family: Inter,Roboto, Verdana,Arial,sans-serif;}
.jqx-grid-cell {font-size: 0.88rem;background-color: #fff;}
.jqx-fill-state-pressed {background-color: #ede7f6;color: var(--primary-color);}
.jqx-rc-all {-moz-border-radius: 0;-webkit-border-radius: 0;border-radius: 0;}
.jqx-fill-state-hover{background: transparent;background-color: #9575cd;color: white;}
.jqx-listitem-state-selected {padding: 0 3px;}
.jqx-listitem-state-normal {padding: 0 3px;}
.jqx-fill-state-normal {border-color: #d1c4e9;}
.jqx-widget-header {border-color: #d1c4e9;background: var(--primary-color);color: #fff;}
.jqx-widget .jqx-grid-cell, .jqx-widget .jqx-grid-column-header, .jqx-widget .jqx-grid-group-cell {border-color: #d1c4e9;}
.jqx-grid-cell-pinned {background-color: #fff;}
.jqx-grid-cell.jqx-fill-state-hover{background-color: #ede7f6;color: #313534;}
.jqx-grid-header{height: 40px !important;line-height: 50px !important;vertical-align: middle !important;}
.jqx-grid-column-header > div{margin-top: 10px !important;}
.jqx-grid-column-header:hover{background: var(--secondary-color);}
.btn{text-transform: none;}

.btn:not(.btn-link):not(.btn-circle):not(.btn-icon-toggle):not(.btn-flat):not(.btn-default):not(.btn-flat-circle) {
    box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0,0,0,.12);
    transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1);
    border-radius: 2px;
    border: none;
    border-bottom-width: medium;
    border-bottom-style: none;
    border-bottom-color: currentcolor;
    outline: none;
}

}
.btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle):not(.btn-link):not(.btn-circle):not(.btn-flat-circle):not(.btn-icon-toggle):not(.btn-flat):not(.btn-default) {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
}

.bootbox .btn:not(.btn-link):not(.btn-circle):not(.btn-icon-toggle):not(.btn-flat):not(.btn-default) {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.16), 0 2px 10px rgba(0, 0, 0, 0.12);
    
}

.btn-default {
    background-color: transparent;
    border-color: transparent;
}

.btn-primary{
  background-color: var(--primary-color);
  border-color: var(--primary-color);
}

.btn-third{
    background-color: #8bc34a;
    border-color: #8bc34a;
    color: #fff;
}

.btn-primary:hover, .btn-primary:focus, .open .dropdown-toggle.btn-primary,.btn-third:hover, .btn-third:focus {
    box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0,0,0,.12);
    color: #ffffff;
    background-color: var(--secondary-color);
    border-color: var(--secondary-color);
}


.btn-secondary, .btn-secondary:hover, .btn-secondary:focus, .open .dropdown-toggle.btn-secondary {
    color: #ffffff;
    background-color: var(--secondary-color);
    border-color: var(--secondary-color);
}

.btn-secondary:hover{
    background-color: #ff2770;
    border-color: #ff2770;
}

.btn-flat, .btn-default {
    color: var(--primary-color);
    border-color: #c1aaec;
    background-color: #faf9fa;
    border-radius: 2px;
}

.btn.btn-flat-circle {
    color: var(--primary-color);
    border-color: #c1aaec;
    background-color: #faf9fa;
    border-radius: 50% !important;;
}

.table .btn-group > .btn.btn-flat-circle {
    /*box-shadow: 0px 1px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0,0,0,.12);*/
    box-shadow: rgb(0 0 0 / 9%) 0px 1px 5px;
    color: var(--primary-color);
    border-color: #eee4ff;
    background-color: #ffffff;
    border-radius: 50% !important;
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem
}
.card .btn-flat:hover, .btn-flat:hover, .btn-default:hover, .card .btn-flat:active, .btn-flat:active, .btn-default:active,
.card .btn-flat:focus, .btn-flat:focus, .btn-default:focus,.btn-default.active,
.card .btn-flat-circle:hover, .btn-flat-circle:hover, .card .btn-flat-circle:active, .btn-flat-circle:active,.table .btn-group > .btn-flat-circle:hover
{
    background-color: #fef5fb;
    color: var(--secondary-color);
    border-color: #fad0df;
}

.btn-flat:focus, .btn-flat:hover, .btn-icon-toggle:focus, .btn-icon-toggle:hover, .open .dropdown-toggle.btn-flat, .open .dropdown-toggle.btn-icon-toggle {
    background-color: #fef5fb;
    color: var(--secondary-color);
    border-color: #fad0df;
}

.ui-jqgrid{
    background: #fff;
    /*margin-bottom: 20px;*/
}
.ui-jqgrid .ui-jqgrid-title {
    font-size: 0.88rem;
    font-weight: 400;
    color: var(--primary-color);
}

.table thead {opacity: 1}

.table thead > tr > th {
  background-color: var(--primary-color);
    color: #fff;
    padding: 10px;
}

.table thead > tr > th.active {
  background-color: var(--secondary-color);

    color: #fff;
}

.table-striped>tbody>tr:nth-child(odd)>td, .table-striped>tbody>tr:nth-child(odd)>th {
    background-color: #fbfbfb;
}

.checkbox-styled:not(ie8).checkbox-primary input:checked ~ span:before, .radio-styled:not(ie8).checkbox-primary input:checked ~ span:before, .checkbox-styled:not(ie8).radio-primary input:checked ~ span:before, .radio-styled:not(ie8).radio-primary input:checked ~ span:before {
    border-color: var(--primary-color);
}

.checkbox-styled:not(ie8).checkbox-primary input ~ span:after, .radio-styled:not(ie8).checkbox-primary input ~ span:after, .checkbox-styled:not(ie8).radio-primary input ~ span:after, .radio-styled:not(ie8).radio-primary input ~ span:after {
    background-color: var(--primary-color);
}

.radio-styled:not(ie8) input:checked ~ span:before {
    border-color: var(--secondary-color);
}

.radio-styled:not(ie8) input ~ span:after {
    content: "";
    position: absolute;
    left: 10px;
    top: 10px;
    z-index: 1;
    width: 0;
    height: 0;
    background-color: var(--secondary-color);
    border-radius: 50%;
    -webkit-transition: all 0.15s ease-in-out;
    -o-transition: all 0.15s ease-in-out;
    transition: all 0.15s ease-in-out;
}

.checkbox-styled:not(ie8) input:checked ~ span::before {
    border-color: var(--secondary-color);
}

.checkbox-styled:not(ie8), .radio-styled:not(ie8), .radio-styled:not(.no-margin) {
    position: relative;
    margin-top:20px;
}


.radio-inline + .radio-inline, .checkbox-inline + .checkbox-inline, .radio-inline.radio-styled, .checkbox-inline.checkbox-styled {
    font-size: 0.88rem;
    font-weight: 300;
    margin-top: 0;
}

.form-group .radio-inline + .radio-inline, .form-group .checkbox-inline + .checkbox-inline, .form-group .radio-inline.radio-styled, .form-group .checkbox-inline.checkbox-styled {
    margin-top: 0;
    font-size: 0.88rem;
    font-weight: 300;
 
}

.ui-jqgrid .loading {
    background-color: #7986CB;
    color: #fff;
}

.ui-jqgrid .ui-jqgrid-htable .ui-th-div {
    margin-top: 0;
}


.ui-jqgrid .ui-jqgrid-titlebar-close {
    top: 20%;
    margin: 0;
    padding: 0;
    padding-right: 2px;
    text-decoration: none;
}

.ui-jqgrid .ui-jqgrid-titlebar-close span {
    font-size: 18px;
    color: var(--secondary-color);
}


.ui-jqgrid-pager .fa {color: var(--secondary-color);}

.ui-jqgrid .ui-pg-table td {
    font-weight: 300;
}

.ui-jqgrid .ui-jqgrid-htable .ui-th-div {
    height: auto; 
}

.ui-jqgrid-pager .ui-pg-table .ui-pg-button:hover, .ui-jqgrid-toppager .ui-pg-table .ui-pg-button:hover {
    background-color: #f3eaf3;
}

#gbox_my_list_treat .ui-jqgrid-view {
    min-height: 270px;
}

.table > tbody > tr.success > td{
    background-color: #f6f6f8;
    color: var(--secondary-color);
}

.table thead > tr > th,.table tfoot > tr > td {
    font-size: 0.88rem;
    font-weight: 400;
}
.table > tbody > tr > td{
    padding: 10px;
    font-size: 0.88rem;
    font-weight: 300;
    border-bottom: 1px solid #f0f0f0;
    vertical-align: middle;
}

.list-lab .table > tbody > tr > td{
    font-size: 1.2rem;
    font-weight: 500;
}

.list-lab .lab-group{
    background-color: var(--primary-color);
    color: #ffffff;
    
}

.list-lab .param{
    color: var(--primary-color);
    font-weight: 300;
}

.subgrid-data .table > thead > tr > th{
    font-size: 0.88rem;
    font-weight: 400;
}
.subgrid-data .table > tbody > tr > td{
    font-size: 0.88rem;
}


.ui-pg-button:not(.btn-link):not(.btn-circle) {
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    border-radius: 2px;
    border: none;
    border-top-width: medium;
    border-bottom-width: medium;
    border-top-style: none;
    border-bottom-style: none;
    border-top-color: currentcolor;
    border-bottom-color: currentcolor;
    border-bottom-width: medium;
    border-bottom-style: none;
    border-bottom-color: currentcolor;
    outline: none;
}

.ui-jqgrid .ui-paging-pager .ui-pg-button span {
    margin-top: -3px;
}

.ui-jqgrid .navtable .ui-pg-button span {
    margin: 0;
    margin-top: 4px;
    padding-right: 5px;
}

.btn-circle {
    border: none;
        border-bottom-width: medium;
        border-bottom-style: none;
        border-bottom-color: currentcolor;
    outline: none !important;
    overflow: hidden;
    width: 40px;
    height: 40px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
}

.ui-sghref span{top: 6px; color: var(--secondary-color);}

.ui-jqgrid .subgrid-data .ui-th-column { background: transparent; color: #311B92 }

.subgrid-cell{color: var(--secondary-color);}


.ui-jqgrid .jqgrid-subgrid-custom{
    margin:10px;
}

.ui-jqgrid .jqgrid-subgrid-custom td{
    padding:8px;
    font-weight: 400;
}

.ui-jqgrid .jqgrid-subgrid-custom .label{
    display: table-cell;
    line-height: inherit;
    text-align: left;
    color: var(--primary-color);
    font-size: 0.88rem;
}

.ui-jqgrid .jqgrid-subgrid-custom .label:hover{
    color: var(--secondary-color);
    opacity: 1;
}

.gly-rotate-90 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}
.gly-rotate-180 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}
.gly-rotate-270 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
  -webkit-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  transform: rotate(270deg);
}

.gly-flip-horizontal {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);
  -webkit-transform: scale(-1, 1);
  -moz-transform: scale(-1, 1);
  -ms-transform: scale(-1, 1);
  -o-transform: scale(-1, 1);
  transform: scale(-1, 1);
}

.gly-flip-vertical {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);
  -webkit-transform: scale(1, -1);
  -moz-transform: scale(1, -1);
  -ms-transform: scale(1, -1);
  -o-transform: scale(1, -1);
  transform: scale(1, -1);
}

.card .transparent-header {
    background-color: transparent;
    border-color: var(--primary-color);
    color: var(--primary-color);
    border-bottom: 1px solid rgba(204, 204, 204, 0.35);
    /*border-bottom: 1px solid rgb(255, 64, 129);*/
}
#box-flex{
    display: flex;
    flex-direction: column;
    margin: 1rem 1rem 0 1rem;
    gap: 1rem;
}
#profil_pasien h3, #history_kunjungan h3{
    margin: 5px 5px 20px;
}
#profil_pasien small, #history_kunjungan small{
    font-weight: 300;
    margin-top: 10px;
    display: block;
}

.profil_pic{
  width:110px;
  height:110px;
  display: inline-block;
  margin: 20px auto;
}

.profil_pic img{
    width: 100%;
    border-radius:50%;
    object-fit: cover;
    border-radius:50%;
}

.biodata-pasien{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.biodata-pasien img{
    width:120px;
    height:120px;
    border-radius:8px;
    margin-top: 5px;
}

.btn-biodata{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 5px;
    margin: 10px;
}
.btn-flatcx{
    
    width: 30px;
    height: 30px;
    line-height: 30px;
    border: 1px solid #ccc;
    color: var(--primary-color);
    font-size: 1.2rem;
    border-radius: 50%;
    text-align: center;
    vertical-align: middle;
}

.btn-flatcx:hover{
    text-decoration: none;
    background: var(--primary-color);
    color:#fff;
    border: 1px solid var(--primary-color);
    cursor: pointer;
}

.stat{
    line-height: 1.4;
    margin: 5px auto; 
    text-align: center;
}
.stat .label{
    color: #95989A;
    font-size: 0.88rem;
    font-weight: 300;
    /* border-bottom: 1px solid #3949ab; */
    border-radius: 0;
    padding: 0;
    margin: 0;
    display: block;
}

.stat .value{
    color: #313534;
    font-size: 2.5em;
    font-weight: 400;
    padding: 0;
    margin: 0;
}

.color-overlay {
  padding: 3em 2em;
  box-sizing: border-box;
  background: rgba(123, 94, 155, 0.5) ;
}


.actionbutton {
  position: absolute;
  background: #F93B69;
  width: 45px;
  height: 45px;
  font-size: 3em;
  font-weight: 300;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  bottom: -25px;
  right: 20px;
  box-shadow: 0 0 8px #202020;
}

section .style-primary, .offcanvas-pane .style-primary, .card .style-primary, section.style-primary, .offcanvas-pane.style-primary, .card.style-primary {
    background-color: #6059bf;
    border-color: #6059bf;
    color: #ffffff;
}

.btn-icon-toggle {
    padding: 0;
    margin: 7px 0;
    width: 36px;
    height: 36px;
    line-height: 36px;
}

/*modul pasien*/

.cx-grid{display: grid;grid-template-columns: 320px 1fr;grid-gap: 0.8rem;height: calc(100vh - 5px);}
.cx-grid .left-grid,.cx-grid .right-grid {position: relative;height: calc(100% - 5px);width: 100%;}
.cx-grid .left-grid > .card {margin-bottom: 0;height: 100%;}
.cx-grid #body_layanan > .card{ margin-bottom: 0 }
.cx-grid #myright_grid > .card{ margin-bottom: 8px; }

@media (max-width: 768px){
    .cx-grid {grid-template-columns: 1fr;grid-gap: 0.8em;}    
    .left-grid > .card{height: max-content;}
    .left-grid > .card .card-body{height: max-content;}
    .menu-karyawan{ display:none; }
    .menu-karyawan-dropdown{display: inherit !important;}
    .cx-grid .left-grid.hrd{height: 100%;}
    .dropdstart.hrd{display: block; text-align: right;}
    #box-flex{flex-direction: row;align-items: center;}
    #box-flex .text-center{text-align: left !important;}
    .profil_pic{margin: 0;margin-right: 10px;}
    #cxbiodata_pasien{display: none;}
    .cx-grid .left-grid {height: calc(100%);}
}


.header-bold {font-weight: 400 !important;}
.header-bold > i {margin-right: 5px;}

#cxinfo_pasien{padding: 0;overflow: visible;}
#cxbiodata_pasien{margin-bottom: 0;-webkit-box-shadow: none;box-shadow: none;}
#cxbiodata_pasien > .card-body{padding: 20px; padding-top: 32px;}
.tabs-right > .nav-tabs .active > a, .tabs-right > .nav-tabs .active > a:hover, .tabs-right > .nav-tabs .active > a:focus {border-left: 2px solid var(--secondary-color);outline: none;}

.nav-tabs .nav-link{border: none; padding: 1rem; font-size: 0.88rem; color: var(--primary-color); opacity: 1;}
.nav-tabs .nav-link.active{border-bottom: 2px solid var(--secondary-color);color: var(--primary-color); opacity: 1;}
/*.card-head.nav-tabs, .card-head>.nav-tabs {padding: 0}
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {border-bottom: none;color: var(--secondary-color);outline: none;}
.nav-tabs>li {flex-grow: 1;text-align: center;font-size: 0.88rem;outline: none;}
.nav-tabs>li:hover {border-color: #e5e6e6 #e5e6e6 #ddd;}
.nav-tabs>li>a:hover {border-color: transparent; border-bottom: none;}
.nav-tabs > li.active, .nav-tabs > li.active:hover, .nav-tabs > li.active:focus {border-bottom: 2px solid var(--secondary-color);}
.nav-tabs.nav-justified > .active > a, .nav-tabs.nav-justified > .active > a:hover, .nav-tabs.nav-justified > .active > a:focus {border-bottom: none;}
.card-head.nav-tabs > li > a, .card-head > .nav-tabs > li > a, #tab_menu_layanan > .nav-tabs > li > a {line-height: 60px;height: 60px;padding: 20px;color: #9c27b0;cursor: pointer;}
.nav-tabs > li > a h4 {margin: 0;margin-bottom: 5px;}
.nav-tabs > li.active > a small {color: #FF80AB;margin-bottom: 5px;}
.nav .open>a, .nav .open>a:focus, .nav .open>a:hover {background-color: #e5e6e6;border-color: var(--secondary-color);}
.sticky-nav{position: sticky;top: 0;z-index: 100;background-color: #fff;}
.nav>li>a:focus, .nav>li.no-bg>a:hover {text-decoration: none;background-color: transparent;}
.nav-tabs>li.no-bg>a:hover {border-color: transparent;}
.nav-tabs>li.no-bg>a{opacity: 1;}
*/
h5.mb-1 {
    font-weight: 400;
}

#edit_profile{
    float: right;
    right: 15px;
    bottom: 20px;
}

.dl-horizontal.dl-icon dd {
    margin-bottom: 3px;
}

.dl-horizontal.dl-icon dt {
    padding-top: 10px;
}

#biodata_pasien .mycolor{
color: #3F51B5;
}

#biodata_pasien .label{
    font-size: 0.7em;
    color: #311B92;
    font-weight: 500;
    text-transform: uppercase;
    padding: 0;
}
/*end modul pasien*/

/*modul dokter*/

.cx-grid2{
    display: grid;
    grid-template-columns: 300px 1fr;
    grid-gap: 0.8rem;
    height: calc(100vh - 5px);
}
 
.cx-grid2 .left-grid, .cx-grid2 .right-grid{
    position:relative;
    height: calc(100% - 5px);
    width: 100%;
    overflow: auto;
}

.cx-grid2 .left-grid > .card{
    margin-bottom: 0;
    height: calc(100%);
}

.cx-grid2 .right-grid > .card{
    margin-bottom: 0;
    min-height: calc(100vh - 10px);
}
@media (max-width: 768px){
    
    .cx-grid2 {
        display: grid;
        grid-template-columns: 1fr;
        grid-gap: 0.8em;
        height: auto;
    }    
    .cx-grid2 .left-grid, .cx-grid2 .right-grid{
        height: auto;
    }
    .cx-grid2 .right-grid{
        overflow-y: visible;
    }
    .cx-grid2 .left-grid > .card{
        height: auto;
    }

    .cx-grid2 .left-grid > .card .card-body{
        height: auto;
    }
}

.cx-wrap{position: relative;height: calc(100vh - 5px);}
.cx-wrap .cx-sidebar{position: fixed;top: 5px;left:5px;bottom:0;width: 300px;background-color: #9E9E9E;color: white;height: calc(100vh - 10px);transition: margin-left .3s ease-in-out;box-shadow: 0 1px 3px 0 rgba(0,0,0,.33);overflow: auto;z-index:1025;}
.cx-wrap #myleft_grid{margin-bottom: 0;min-height: calc(100vh - 10px);}
.cx-wrap .cx-content{margin-left: 300px;transition: margin-left .3s ease-in-out;height: calc(100% - 5px);position: relative;overflow: auto;box-shadow: 0 1px 3px 0 rgba(0,0,0,.33);}
.cx-wrap .cx-sidebar > .card{margin-bottom: 0;height: calc(100%);z-index: 1;}
.cx-wrap #myright_grid > .card{margin-bottom: 0;min-height: calc(100vh - 10px);}
.minibar .cx-sidebar{margin-left:-250px;border-right: 3px solid #f476a2;}
.minibar .cx-sidebar .card{display:none;}
.minibar .cx-sidebar:hover{margin-left:0;border-right: none;}
.minibar .cx-sidebar:hover .card{display: block;}
.minibar .cx-content{margin-left: 50px;}
.showhide-toggle{position: absolute; top: 10px;left: 10px; border-radius: 0; z-index: 1;}
.info-sidebar{position: fixed; top: calc(100vh/2); left: -170px; transform: rotate(90deg); font-size: 1.1rem; font-weight: 500;  letter-spacing: 20px; z-index: 0;}
#cxsidebar-overlay {background-color: rgba(0,0,0,.1);bottom: 0;display: none;left: 0;position: fixed;right: 0;top: 0;z-index: 1009;}
@media (max-width: 768px){
    .cx-wrap .cx-sidebar{margin-left: -310px;}
    .info-sidebar{margin-left: -100px;}
    .minibar .cx-sidebar{margin-left: 0;border-right: none;}
    .minibar .cx-sidebar .card{display:block;}
    .cx-wrap .cx-content{margin-left: 0;}
    .minibar #cxsidebar-overlay{display: block;}
    .toggle-sidebarcx{transform: rotate(180deg);}
}

/*end modul dokter*/

/*pengkajian*/
/*left grid*/
.left-grid .card-body{padding: 15px;}
.header-list{font-size: 1rem;color: #673AB7;font-weight: 400;background: #f9f9f9;margin: 15px 0;padding: 10px 15px;border-bottom: 1px solid #ccd4ff;}
.header-list i{font-size: 1.2rem;padding-right: 5px;}
.simple-list li{display: grid;grid-template-columns: 45px 1fr;grid-template-rows: repeat(3,20px);font-weight: 300;align-items: start;margin-top: 5px;column-gap: 5px;}
.simple-list li:hover {background: #F7F9FC; }
.simple-list li:hover .rm{color: #4caf50; }
.simple-list li .number{grid-row: 1/8;font-size: 1.3rem;align-self: center;justify-self: center;color: #3f51b5;}
.simple-list li .patient-name{color: var(--primary-color);font-size: 0.88rem;align-self: center;overflow: hidden;white-space:nowrap; text-overflow: ellipsis;}
.simple-list li .patient-name .mdi{font-size: 1rem;color: var(--secondary-color);}
.simple-list li .patient-name:hover{cursor: pointer;}
.simple-list li .birth{color: var(--secondary-color);font-size: 0.8rem;align-self: center;}
.simple-list li .rm{color: #909090;font-size: 0.8rem;align-self: center;0;margin-bottom: 0;}
.simple-list li .flag{color: #ff9800;font-size: 0.88rem;align-self: center;0;margin-bottom: 0;
}
/*end left*/
/*right grid*/
.card-head .header-pasien{display: grid;padding: 15px 24px;line-height: 1.864;grid-template-columns: 100px 1fr 100px 1fr;grid-column-gap: 10px;font-weight: 300;color: #9E9E9E;}
.header-pasien .avatar{width: 80px;height: 80px; display: flex; text-align: center;align-items: center;justify-content: center; margin-left: 12px;}
.header-pasien .name{color: #e91e91;font-size: 0.88rem;font-weight: 400;text-decoration: underline;}
/*end right grid*/
@media (max-width: 992px){
    .header-pasien .avatar{display: none;}
    .card-head .header-pasien{grid-template-columns: 1fr 1fr;}
}
@media (max-width: 768px){
    .header-aoptek{flex-direction: column-reverse;}
}
@media (max-width: 576px){   
    .header-pasien .avatar{display: none;}
    .card-head .header-pasien{grid-template-columns: 1fr;}
    .header-aoptek{flex-direction: column-reverse;}
}

.card-head header .sub-header{display: block;font-size: 1rem; font-weight: 300;}
 .panel-content .form, .panel-content .form-horizontal{ padding: 20px; padding-top: 10px; border-top: 1px solid #d1d1d1;}
.form .form-value{min-height: 37px; padding: 10px 0; color: #313534; font-weight: 300;font-size: 0.88rem;}

/*end pengkajian*/
.media{
    overflow: visible;
}
.form-group .mycolor {
    color: var(--secondary-color);
    opacity: 1;
}

/*.dropdown .dropdown-menu {
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;

    max-height: 0;
    padding: 0;
    display: block;
    overflow: hidden;
    opacity: 0;
}

.dropdown:hover .dropdown-menu {
    max-height: none;
    opacity: 1;
    padding: 5px 0;
}

.dropdown-menu.pull-right {
    right: -20px;
    left: auto;
    margin: 0;
}

.dropdown-menu > li > a { 
    outline: none;
}
*/
.card.style-primary .btn-icon-toggle:hover {
    background-color: transparent;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

#history_kunjungan h5, #history_kunjungan .h5 {
    font-weight: 400;
    margin: 0 0 5px;
    color: inherit;
}

.page-heading, .gx-card {
  padding: 15px 15px;
  -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.15);
  -o-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.15);
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.15);
  margin-bottom: 0;
  background-color: #fff;
  border-radius: 2px;
  position: relative; 
  margin-top: 39px;}

.gx-card-header {
  margin-bottom: 24px; }

.social-list-line {
    position: relative;
}
.media {
    display: flex;
    align-items: flex-start;
}

.badge {
    display: inline-block;
    font-size: 75%;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.25rem;
    font-weight: 400;
    padding: 5px 8px;
    margin-bottom: 6px;
}

.badge-pill {
    border-radius: 20px;
}

.badge-primary {
    background-color: #3f51b5 !important;
    color: #fff !important;
}


.dark-indigo .bg-primary, .dark-indigo .badge-primary {
    background-color: #3f51b5 !important;
    color: #fff !important;
}
.user-avatar {
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    position: relative;
    overflow: hidden;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    -webkit-flex-shrink: 0;
    flex-shrink: 0;
    border-radius: 50%;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

.z-index-20 {
    z-index: 20;
}

.bg-primary {
    background-color: var(--primary-color) !important;
}
.size-40, .gx-btn-fab-sm, .chat-item .user-avatar {
    height: 40px !important;
    width: 40px !important;
    line-height: 40px;
}

.mr-3, .mx-3 {
    margin-right: 1rem !important;
}

.media-body {
    flex: 1;
}

.bg-danger {
    background-color: #f44336 !important;
}

.social-list-line {
    position: relative;
}
.media {
    display: flex;
    align-items: flex-start;
    margin-top: 0;
}

.social-list-line:not(:last-child)::before {
    border-left: solid 1px #adb5bd;
    content: "";
    left: 20px;
    position: absolute;
    top: 5px;
    bottom: 0;
    width: 1px;
    z-index: 1;
}

.meta-date, .meta-comment {
    font-size: 0.9em;
    color: #868e96;
}

.media, .media-body {
    overflow: visible;
}

#history_kunjungan .badge{
    padding: 3px 4px;
    font-size: 9px;
}

sup.badge {
    margin-left: -2px;
}


.monit-box {
    box-shadow: none;
    height: 70px;
    display: flex;
    cursor: default;
    background-color: #fff;
    position: relative;
    overflow: hidden;
    margin: 40px 0 30px;
    padding: 10px;
    transition: .5s;
    border: 1px solid #f2f2f2;
    color: #fff;
    font-weight: 400;
    font-size: 0.88rem;
}

.monit-box .icon {
    text-align: center;
    vertical-align: middle;
}

.monit-box > .icon > .mdi {
    font-size: 50px;
    height: 100%;
    line-height: 50px;
}

.btn-group > .toolbar-menu-pasien, .btn-group .toolbar-menu-pasien{margin-left: 20px !important;}

.list .tile .tile-icon {
    min-width: 30px;
    width: 30px;
   
}
.list .tile .tile-content:last-child {
    padding-right: 0;
}
.list .tile .tile-content {
    padding-left: 0;
}

.list .tile .tile-text {
    font-size: 0.88rem;
}

.list .tile > a:hover {
  color: #313534;
}

#profil_pasien .tile-text > small{
    margin-top: 0;
}

.list .tile .tile-text {
    padding: 7px 0;
    font-size: 14px;
 
}

.card-head header.no-padding-left{
    padding: 11px 3px;
}

/*datetime picker custom*/
.bootstrap-datetimepicker-widget{
    padding:0!important;
    margin:0!important;
    width:auto!important;
    bottom:auto!important;
}
.bootstrap-datetimepicker-widget:after,.bootstrap-datetimepicker-widget:before{
    display:none!important;
}
.bootstrap-datetimepicker-widget table td{
    text-shadow:none;
}
.bootstrap-datetimepicker-widget table td span{
    margin:0;
}
.bootstrap-datetimepicker-widget table td span:hover{
    background:0 0;
}

.bootstrap-datetimepicker-widget a[data-action]{
    color:var(--primary-color);
}
.timepicker-picker .btn{
    box-shadow:none!important;
}
.timepicker-picker table tbody tr+tr:not(:last-child){
    background:var(--primary-color);
    color:#fff;
}
.timepicker-picker table tbody tr+tr:not(:last-child) td{
    border-radius:0;
}
.timepicker-picker .btn,.timepicker-picker .btn:hover{
    background:#fff;
    color:#333;
}

.datepicker table thead tr th{
    border-radius:0;
    color:#fff;
}
.datepicker table thead tr th .fa{
    width:30px;
    height:30px;
    border-radius:50%;
    line-height:29px;
}
.datepicker table thead tr th:hover .fa{
    background:rgba(0,0,0,.2)
}
.datepicker table thead tr:first-child th{
    background:var(--primary-color);
    padding:20px 0;
}
.datepicker table thead tr:first-child th:hover{
    background:var(--primary-color);
}
.datepicker table thead tr:first-child th.picker-switch{
    font-size:16px;
    font-weight:400;
    text-transform:uppercase
}
.datepicker table thead tr:last-child th{
    text-transform:uppercase;
    font-weight:400;
    font-size:11px
}
.datepicker table thead tr:last-child th:first-child{
    padding-left:20px
}
.datepicker table thead tr:last-child th:last-child{
    padding-right:20px
}
.datepicker table thead tr:last-child:not(:only-child){
    background:#5b33a2; /*header th kedua*/
}
.datepicker table tbody tr:last-child td{
    padding-bottom:25px;
}
.datepicker table tbody tr td:first-child{
    padding-left:13px
}
.datepicker table tbody tr td:last-child{
    padding-right:13px
}
.datepicker table td.day{
    width:35px;
    height:35px;
    line-height:20px;
    color:#333;
    position:relative;
    padding:0;
    background:0 0;
    font-size: 0.85rem;
    font-weight: 300;
}
.datepicker table td.day:hover{
    background:0 0;
}
.datepicker table td.day:before{
    content:"";
    width:35px;
    height:35px;
    border-radius:50%;
    margin-bottom:-33px;
    display:inline-block;
    background:0 0;
    position:static;
    text-shadow:none;
    border-bottom-color:transparent!important
}
.datepicker table td.day.new,.datepicker table td.day.old{
    color:#CDCDCD
}
.datepicker table td:not(.today):not(.active):hover:before{
    background:#F0F0F0
}
.datepicker table td.today{
    color:#333
}
.datepicker table td.today:before{
    background-color:#E2E2E2
}
.datepicker table td.active{
    color:#fff
}
.datepicker table td.active:before{
    background-color:var(--secondary-color);
}
.datepicker-months .month,.datepicker-years .year,.timepicker-hours .hour,.timepicker-minutes .minute{
    border-radius:50%
}
.datepicker-months .month:not(.active):hover,.datepicker-years .year:not(.active):hover,.timepicker-hours .hour:not(.active):hover,.timepicker-minutes .minute:not(.active):hover{
    background:#F0F0F0
}
.datepicker-months .month.active,.datepicker-years .year.active,.timepicker-hours .hour.active,.timepicker-minutes .minute.active{
    background:var(--secondary-color);
}
.timepicker-hours .hour,.timepicker-minutes .minute{
    padding:0
}

.bootstrap-datetimepicker-widget.dropdown-menu{
    border: none;
}
/*end datetime*/


.card-actionbar-row-left{ text-align: left; float: left; }

.chip {
    display: inline-block;
    height: 40px;
    font-size: 13px;
    font-weight: 500;
    color: rgba(0,0,0,0.6);
    line-height: 40px;
    padding: 0 12px;
    border-radius: 23px;
    background-color: #e4e4e4;
}

.chip img {
    float: left;
    margin: 0 8px 0 -12px;
    height: 40px;
    width: 40px;
    border-radius: 50%;
}

.chip .cxicon {
    float: left;
    margin: 0 8px 0 -12px;
    height: 40px;
    width: 40px;
    border-radius: 50%;
    text-align: center;
}
.modal-body {padding: 0;}
.modal-content {border: none;border-radius: 0.5rem;}
/*.modal-lg, .modal-lg-form { width: 90%;}

.modal-md, .modal-md-form { width: 60%;}
*/
.modal-header {padding: 10px;background-color: #fff;border-top-left-radius: unset;border-top-right-radius: unset;border-bottom: 1px solid #f1f1f1;}

.modal-title {
    color: var(--primary-color);
    font-size: 1.1rem;
    font-weight: 400;
}

.modal-header .close, .close {
    margin-top: 0;
    margin-right: 0;
    color: var(--primary-color);
    opacity: 1;
    border: none;
    background: transparent;
    font-weight: 400;
}

/*.modal-dialog.modal-lg, .modal-lg .modal-content, .modal-dialog.modal-md, .modal-md .modal-content {
    height: 95%;
}

.modal-lg .modal-content .modal-body, .modal-md .modal-content .modal-body {
    max-height: calc(100% - 55px);
    min-height: calc(100% - 55px);
    overflow-y: auto;
}
*/
.modal .card {margin-bottom: 0;}

.tile-text{
    padding: 2px 0;
}

.tile-text > h5{
    margin: 2px 0;
}

.tile-text p{
    margin: 0 0 2px;
}

/*lain-lain*/
.numeric{ text-align: right; }

.no-padding-right {padding-right: 0}

.bootbox .modal-body {
    padding: 15px 15px 0;
}

.bootbox .btn{
    text-transform: uppercase;
}

.bootbox-body{    
    padding-left: 10px;
    font-size: 1.3em;
    font-weight: 400;
    min-height: 80px;
    vertical-align: middle;
}

ul{
    margin: 0;
    padding: 0;
    list-style: none;
}
#patient-menu-icon{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}
#patient-menu-icon li{
    margin: 20px;
    text-align: center;
    cursor: pointer;
    width: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

#patient-menu-icon span{
    font-weight: 400;
    font-size: 0.88rem;
    color: #4a148c;
    /*text-decoration: underline;*/
}

.circle-menu {
    height: 70px;
    width: 70px;
    line-height: 70px;
    border-radius: 50%;
    text-align: center;
    color: #fff;
    vertical-align: middle;
    font-size: 2em;
    transition: all .1s linear;
}

.circle-menu:hover {
    font-size: 2.5em;
}

.circle-menu div {
    font-size: 1.4em;
    font-weight: 400;
    position: absolute;
}

.circle-menu.waves-effect{
    display: inherit;
}

.box-menu{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    max-width: 800px;
    margin: 0 auto;
}

.box-menu li{
    padding: 20px 30px;
    margin: 20px;
    width: 200px;
    /*background: #f2f0f5;*/
    text-align: center;
    cursor: pointer;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
    
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.33);
}

.box-menu li:hover{
    background: #ebe9f3;
}

li.blue-box{
    background: #eef5fd;    
    color: #3F51B5;
}

li.red-box{
    background: #fff4f7;    
    color: #F44336;
}

li.green-box{
    background: #f1fdda;    
    color: #8BC34A;
}

li.cyan-box{
    background: #edfbfd;    
    color: #00BCD4;
}

li.orange-box{
    background: #fff1dc;
    color: #FF9800;
}

li.purple-box{
    background: #f5e8f7;
    color: #9C27B0;
}

li.brown-box{
    background: #efdad2;
    color: #ab6e58;
}

li.yellow-box{
    background: #f9f3c1;
    color: #c5b633;
}

.yellowcx{
    background: #FFEB3B !important;
    color: #b5978d;
}

.browncx{
    background: #bf785e !important;
}

.greencx{
    background: #a7e137 !important;
}

.purplecx{
    background: #ae7bff !important;
}
.orangecx{
    background: #faad5d !important;
}

.redcx{
    background: #ff5657 !important;
}

.table thead.smooth > tr > th {
    background-color: #f3ebfe;
    color: #673ab7;
}

.box-menu .circle-menu{
    height: 50px;
    width: 50px;
    line-height: 50px;
    font-size: 1.5em;
    transition: all .15s linear;
}

.box-menu .circle-menu:hover{
    font-size: 2em;
 
}
li > .circle-menu{
    flex-direction: column-reverse;
}

.box-menu span{
    font-weight: 500;
    font-size: 0.88rem;
    /*color: #4a148c;*/

}

#group-print-pasien{

    margin-left: 15px;
}

#group-print-pasien button {

    margin: 0 10px 10px 0;

}

.dropdown-menu > li > a {
    padding: 5px 10px;
    cursor: pointer;
    color: var(--primary-color);
    font-size: 0.88rem;
    font-weight: 300;
}

.dropdown-menu>.active>a, .dropdown-menu>.active>a:focus, .dropdown-menu>.active>a:hover {
    color: var(--secondary-color);
    background-color: #f7f3ff;
}

.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover, table.dataTable .dropdown-menu>li>a:hover {
    text-decoration: none;
    color: var(--secondary-color);
    background-color: #f7f3ff;
}

.input-group-addon {
    line-height: 2;
}

/*perfect scrollbars*/
.ps__thumb-y,.ps__thumb-x {background-color: #b9b4b5;}
.ps__rail-y,.ps__rail-x {width: 12px;}
.ps__thumb-y,.ps__thumb-x { width: 4px; right: 1px; }
.ps__rail-y:hover > .ps__thumb-y, .ps__rail-y:focus > .ps__thumb-y, .ps__rail-y.ps--clicking .ps__thumb-y,.ps__rail-x:hover > .ps__thumb-x, .ps__rail-x:focus > .ps__thumb-x, .ps__rail-x.ps--clicking .ps__thumb-x 
{width: 10px;background-color: #F48FB1;}

#wrap-module{
    display: grid;
    align-content: center;
    justify-content: center;
}
.info_modul {
    color: #311B92;
    font-family: Roboto, sans-serif;
    font-size: 2.5rem;
    letter-spacing: .5rem;
    font-weight: 100;
    line-height: 5rem;
    text-align: center;
}

.info_modul span {
    color: #ff6398;
    letter-spacing: .5rem;
}

.info_modul span.info_rs {
    color: #004D40;
    display: block;
    font-size: 0.88rem;
    letter-spacing: 1rem;
    line-height: 2rem;
    font-weight: 300;
}

.info_modul span.info_alamat_rs {
    color: #af8383;
    display: block;
    font-size: 12px;
    letter-spacing: 2px;
    line-height: 2em;
    font-weight: 300;
    font-family: Roboto;
}

.radio-inline + .radio-inline, .checkbox-inline + .checkbox-inline {
    margin-left: 0;
}

.radio-inline, .checkbox-inline {
    margin-right: 10px;
}

#list_data_inputan{
    margin-top: 40px;
}

.jqx-combobox .jqx-widget-content,.jqx-combobox.jqx-widget-content {
    border-color: transparent;
    border-bottom: 1px solid rgba(12, 12, 12, 0.12);
    line-height: 37px;
    height: 37px;
}
.jqx-combobox .jqx-fill-state-normal {
     border-color: transparent; 
     background: transparent; 
}

.jqx-combobox .jqx-icon{
    margin-top: -14px;
}

.card-loader {
    position: fixed;
}

.bg-yellow, .callout.callout-warning, .alert-warning, .label-warning, .modal-warning .modal-body {
    background-color: #f39c12 !important;
    color: #fff;
}

.info-box{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    max-width: 850px;
    margin: 0 auto;
}

.info-box li{
    margin: 20px auto;
    width: 400px;
    min-height: 90px;
    cursor: pointer;
    border: 1px solid #e5e5e5;
    border-radius: 5px;
    justify-content: center;
    flex-direction: column;
}

.info-box-icon {
    border-top-left-radius: 5px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 5px;
    display: block;
    float: left;
    height: 115px;
    width: 115px;
    text-align: center;
    font-size: 45px;
    line-height: 115px;
    background: rgba(0,0,0,0.05);
    transition: all .2s linear;
}

.info-box li:hover .info-box-icon{
    font-size: 50px;
}

.info-box-content {
    padding: 5px 10px;
    margin-left: 113px;
}

.info-box-title {
    display: block;
    font-weight: 400;
    font-size: 16px;
    margin-bottom: 8px;
    border-bottom: 1px solid #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.info-box-text {
    display: block;
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 400;
}

.msg-blue {
    color: #2196f3;
    background-color: #cce5ff;
    border-color: #b8daff;
}

.msg-green {
    color: #4CAF50;
    background-color: #d4edda;
    border-color: #c3e6cb;
}

.msg-red {
    color: #F06292;
    background-color: #f8d7da;
    border-color: #f5c6cb;
}

.msg-yellow {
    color: #FF9800;
    background-color: #fff3cd;
    border-color: #ffeeba;
}

#modul-pasien{
    /**/
    padding: 0 12px;
    align-items: stretch;
}

@media (min-width: 992px){
    #modul-pasien{
        display: flex;
        justify-content: space-between;
    }
}

.registrasi-left{
    flex: 8;
}

.registrasi-right{
    flex: 4;
}
.registrasi-space{
    width: 12px;
}

.form-control.border{
    border: solid 1px rgba(190, 222, 248, 0.5);
    padding: 4px;
}

.form-control-feedback.pointer, .pointer{cursor: pointer; pointer-events: inherit;}

.panel-default > .panel-heading {
    color: #313534;
    background-color: #f8f4ff;
    border-color: #c1aaec;
}

.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    z-index: 2;
    background-color: #ffe8f1;
    color: var(--secondary-color);
    border-color: #fad0df;
}

.form.form-builder .form-group .form-control ~ label, .form.form-builder .form-group > label,
.form-horizontal.form-builder .form-group .form-control ~ label, .form-horizontal.form-builder .form-group > label {
    opacity: 1;
    font-size: 1.3rem;
}

.form-horizontal.form-builder .control-label {
    text-align: left;
}

.btn-save-final {
    color: #ffffff;
    background-color: #43A047;
}

.btn-save-final:hover, .btn-save-final:focus{
    color: #ffffff;
    background-color: #4CAF50;
}

.btn-save-draft {
    color: #ffffff;
    background-color: #9e9e9e;
}

.btn-save-draft:hover, .btn-save-draft:focus {
    color: #ffffff;
    background-color: #bdbdbd;
}

.btn-warning {
    color: #ffffff;
    background-color: #fb8c00;
    border-color: #fb8c00;
}

.btn-warning:hover, .btn-warning:focus, .open .dropdown-toggle.btn-warning {
    color: #ffffff;
    background-color: #ff9800;
    border-color: #ff9800;
}

.select2-container--default.select2-container--focus .select2-selection--multiple,.select2-container--default .select2-selection--multiple {
    border-bottom: solid #ddd 1px;
}

.card .header-form-builder{
    line-height: 32px;
    min-height: 32px;
    margin: 10px 0 10px;
}

.myflex{
    display: flex;
}

.flex-child{
    flex: 1;
    display: inline-block;
}
.myflex .form-group{
    padding-top: 0;
}

.panel-group .panel{border-radius: 5px; margin-bottom: 10px;}

/*hack css autocomplete*/
.users-list-name {color: #673AB7;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;display: block;padding: 4px;padding-bottom: 0;margin: 0;font-size: .88rem;}
.rm {font-size: .88rem;color: #ff00ff;padding: 0 4px;margin: 0;font-weight: 400;}
.tgl_lahir {font-size: .88rem;color: #878896;padding: 0 4px;margin: 0;font-weight: 300;}
.unit_dokter {font-size: .88rem;color: orange;padding: 0 4px;margin: 0;font-weight: 300;}
.ui-helper-hidden {display: none}
.ui-helper-hidden-accessible {border: 0;clip: rect(0 0 0 0);height: 1px;margin: -1px;overflow: hidden;padding: 0;position: absolute;width: 1px}
.ui-helper-reset {margin: 0;padding: 0;border: 0;outline: 0;line-height: 1.3;text-decoration: none;font-size: 100%;list-style: none;}
.ui-helper-clearfix:before,
.ui-helper-clearfix:after {content: "";display: table;border-collapse: collapse;}
.ui-helper-clearfix:after {clear: both;}
.ui-helper-zfix {width: 100%;height: 100%;top: 0;left: 0;position: absolute;opacity: 0;filter: Alpha(Opacity=0)}
.ui-autocomplete {position: absolute;top: 0;left: 0;cursor: default;height: 310px; width: 250px;overflow: hidden; }
.ui-menu {list-style: none;padding: 0;margin: 0; display: block;outline: 0;box-shadow: 0 0 3px 0 rgba(0,0,0,0.33);background-color: #fff; z-index: 1100;}
.ui-menu .ui-menu {position: absolute}
.ui-menu .ui-menu-item {margin: 0;cursor: pointer;min-height: 2em;font-size: 0.88rem;}
.ui-menu .ui-menu-item-wrapper {position: relative;padding: 8px 1em 8px .4em}
.ui-menu .ui-menu-divider {margin: 5px 0;height: 0;font-size: 0;line-height: 0;border-width: 1px 0 0 0}
.ui-menu .ui-menu-item .ui-state-focus > *,
.ui-menu .ui-menu-item .ui-state-active, .ui-menu .ui-menu-item:hover {background-color: #9575cd; color: #fff;}
.ui-menu .ui-menu-item:hover .users-list-name, .ui-menu .ui-menu-item:hover .ui-menu-item-label, .ui-menu .ui-menu-item:hover .ui-menu-item-info,.ui-menu-item:hover .tgl_lahir, .ui-menu-item:hover .rm{color: #fff;}


.ui-menu-icons {position: relative}
.ui-menu-icons .ui-menu-item-wrapper {padding-left: 2em}
.ui-menu .ui-icon {position: absolute;top: 0;bottom: 0;left: .2em;margin: auto 0}
.ui-menu .ui-menu-icon {left: auto;right: 0}

.ui-menu-item-label {color: var(--primary-color); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; 
                  padding: 4px; padding-bottom: 0; margin: 0; font-size: .8em;}
.ui-menu-item-info{ font-size: .7em; color: #878896;padding: 0 4px; margin: 0; font-weight: 300;}

.pagination {
    margin: 0;
}
.pagination > li > a, .pagination > li > span {
    color: var(--primary-color);
    cursor: pointer;
    border-color: #fad0df;
}

.pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus {
    background-color: #fef5fb;
    color: var(--secondary-color);
    border-color: #fad0df;
}

.pagination > li > input[type=text] {
    position: relative;
    float: left;
    padding: 5.6px 8px;
    line-height: 1.846153846;
    text-decoration: none;
    color: #313534;
    background-color: #ffffff;
    border: 1px solid #dddddd;
    margin-left: -1px;
    font-size: 1.2rem;
    text-align: center;
    width: 40px;
}

.pagination > .info > span, .pagination > .info > span:hover, .pagination > .info > span:focus, .pagination > .info > a, .pagination > .info > a:hover, .pagination > .info > a:focus {
    color: var(--primary-color);
    background-color: #ffffff;
    border-color: #fad0df;
    cursor: default;
}

.blinkme {animation: blinker 1s linear infinite;}

@keyframes blinker {
  50% { opacity: 0; }
}

.fa.fa-10px{ font-size: 10px; }
.fa.fa-12px{ font-size: 12px; }
.fa.fa-14px{ font-size: 14px; }
.fa.fa-16px{ font-size: 16px; }
.fa.fa-18px{ font-size: 18px; }
.fa.fa-24px{ font-size: 24px; }
.fa.fa-32px{ font-size: 32px; }
.fa.fa-36px{ font-size: 36px; }
.fa.fa-48px{ font-size: 48px; }

.table-responsive.kasir input[type=text]{ 
    height: 37px; border: 1px solid #c8d0dc; padding: 2px; font: 1.5rem verdana,"Myriad Pro","Myriad Web","Tahoma","Helvetica","Arial",sans-serif; 
    color: #304154; border-radius: 5px; outline: none; width:100%;
}
.table-responsive.kasir input[type=text]:read-only{ 
    background: #f5f5f5;
}
input[type=text].kasir_bill { border: 1px solid #c8d0dc; padding: 2px; font: 2.5rem verdana,"Myriad Pro","Myriad Web","Tahoma","Helvetica","Arial",sans-serif; color: #304154;
    border-radius: 5px; outline: none; width:100%;
}

.racikan{text-decoration: underline;}

.title_popup{font-weight: 400; font-size: 1.5rem;}
.card-head {min-height: 52px;}

input, textarea{border: 1px solid #e1e1e1; font-weight: 300; color: #313534; font-size: 0.9rem; padding: 7px; border-radius: 5px;}
input:read-only, textarea:read-only { background: #f4f4f4; }
.table-soap{border: 1px solid #e7dcbc; border-spacing: 1px; border-collapse:separate; margin-bottom: 5px;}
.table-soap .title{color: #F9A825;}
.table-soap td{padding: 10px;}
.table-soap .soap-text{background-color: #fff9c3; font-weight: 400; padding: 5px 10px; border-bottom: 1px solid #e7dcbc;}
.table-soap.nurse{border: 1px solid #dbe0ff;}
.table-soap.nurse .title{color: #3F51B5;}
.table-soap.nurse .soap-text{background-color: #f1f3ff; border-bottom: 1px solid #dbe0ff;}
.table-soap.penunjang{border: 1px solid #fadaff;}
.table-soap.penunjang .title{color: #3F51B5;}
.table-soap.penunjang .soap-text{background-color: #fdf1ff; border-bottom: 1px solid #fadaff;}
.table-soap .pre{padding: 0;margin: 0;font-size: 0.88rem;font-family: 'Roboto';color: #313534; font-weight: 300;line-height: 1.846153846;}
.input-oleh{font-size: 0.79rem;}
.list-cppt-split{display: grid;grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);grid-gap: 5px;}
.tgl-soap{color: #ffffff;padding: 8px;text-align: center;margin: 5px 0;background-color: #673AB7;font-size: 1.5rem;}
@media screen and (max-width: 767px) {/* start of medium tablet styles */
    .list-cppt-split{display: grid;grid-template-columns: minmax(0, 1fr);}
}

#toast-container > div {opacity: 1;-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);filter: alpha(opacity=100);}
#toast-container > div:hover {box-shadow: none;}

.wongbaker{display: grid; grid-template-columns: repeat(6, 1fr); justify-items: center;}
.img-baker{display: grid; grid-template-columns: 1fr; grid-template-rows: 1fr 40px; justify-items: center;}
.margin-tb-10{margin: 10px 0 !important;}
.form-radio{margin-top: 20px;}
.form-radio label{font-weight: 300}
.no-padding{padding: 0 !important}

.hack-view{width: 1px; height: 1px; position: absolute; top:-5px; left: -5px;}
.card header.header-popup{display: block;}
.card header.header-popup button{float: right; color: #fff; opacity: 1; background: 0 0; text-shadow: none;}
.grid-cetak{display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 2rem;}
@media screen and (max-width: 1024px) {/* start of medium tablet styles */
    .grid-cetak{display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 1rem;}
}

.group-list {
  display: grid;
  grid-template-columns: 1fr;
  font-weight: 300;
  align-items: start;
  column-gap: 5px;
  font-size: 0.88rem;
}

/*adjust old style*/
form.cxform { background: #fff; border: none; padding: 0; margin: 0 3px;  text-align:left; 
              margin-bottom: 3px; border-radius: 2px; box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.33);
              
            }

form.cxform tbody,form.cxform table { border: 0 }

form.cxform table td.label { background: none; color: #6059bf; border: 0;}
form.cxform table td { border-bottom: none; padding: 6px;}

form.cxform table th { border: 1px solid #AFC4D7; border-bottom: 1px solid #99BBE8; background: var(--primary-color);  color: #fff; vertical-align: middle; text-align: center; font-size: 1em; padding: 6px;}

.tableTitle { background-color: ##673AB7; border-color: ##673AB7; color: #ffffff; padding: 8px; font-size: 0.88rem; }
.tableTitle, .listing  table th, form.cxform table th {
    background-image: none;
    
}

form.cxform input[type=button]{margin: 5px 0 10px 10px;}

form.cxform input[type=text], form.cxform input[type=password] { border: none; border-bottom: 1px solid rgba(12, 12, 12, 0.12);padding: 2px; 
                         font: 1em verdana,"Myriad Pro","Myriad Web","Tahoma","Helvetica","Arial",sans-serif; color: #304154;
                        border-radius: 0; outline: none;
                      }

form.cxform input[readonly] { background: none;border-bottom-style: dashed;padding: 2px; 
                         font: 1em verdana,"Myriad Pro","Myriad Web","Tahoma","Helvetica","Arial",sans-serif; color: #304154;outline: none;}


form.cxform input[type=submit] {background: none; border: none; height: auto; margin: 5px 0 10px 10px; border-radius: 3px; cursor: pointer; color: #fff; 
                                text-shadow: none; background-color: var(--primary-color); border-color: var(--primary-color); padding: 6px 12px;box-shadow: 0 2px 5px rgba(0, 0, 0, 0.16), 0 2px 10px rgba(0, 0, 0, 0.12);
                                }

form.cxform input[type=submit]:hover {background: none; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.16), 0 2px 10px rgba(0, 0, 0, 0.12); background-color: var(--secondary-color); border-color: var(--secondary-color);}

form.cxform input[type=button] {background: none; border: none; height: auto; margin: 5px 0 10px 10px; border-radius: 3px; cursor: pointer; color: #fff; 
                                text-shadow: none; background-color: var(--primary-color); border-color: var(--primary-color); padding: 6px 12px;box-shadow: 0 2px 5px rgba(0, 0, 0, 0.16), 0 2px 10px rgba(0, 0, 0, 0.12);
                                }

form.cxform input[type=button]:hover {background: none; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.16), 0 2px 10px rgba(0, 0, 0, 0.12); background-color: var(--secondary-color); border-color: var(--secondary-color);}

form.cxform input[type=reset] {background: none; border: none; height: auto; margin: 5px 0 10px 10px; border-radius: 3px; cursor: pointer; color: #fff; 
                                text-shadow: none; background-color: var(--primary-color); border-color: var(--primary-color); padding: 6px 12px;box-shadow: 0 2px 5px rgba(0, 0, 0, 0.16), 0 2px 10px rgba(0, 0, 0, 0.12);
                                }

form.cxform input[type=reset]:hover {background: none; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.16), 0 2px 10px rgba(0, 0, 0, 0.12); background-color: var(--secondary-color); border-color: var(--secondary-color);}

@font-face {font-family: 'Open Sans'; src: url('opensans.ttf');}
.print_function { padding: 5px; margin: 5px; margin-left: 0; padding-left: 0;}
.print_function form { padding: 0; margin: 0; border: none; outline: none; background: none; }
.print_function input[type=button] { border: 1px solid #fff; outline: 1px solid #999; font: 1em Arial, Helvetica, sans-serif; font: 1em Arial, Helvetica, sans-serif; -moz-border-radius: 2px; -moz-outline-radius: 2px; background: url(../images/print_btn.png) center center repeat-x; padding: 2px 4px; font-size: 11px; color: #333; text-shadow: 1px 1px 0 #fff; cursor: pointer; }
/*.print_function input[type=button]:active { background: url(../../images/interface/btn_a-m.png) top center repeat-x; color: #fff; text-shadow: 1px 1px 0 #333;} */
.print_function input[type=submit] { border: 1px solid #fff; outline: 1px solid #999; font: 1em Arial, Helvetica, sans-serif; font: 1em Arial, Helvetica, sans-serif; -moz-border-radius: 2px; -moz-outline-radius: 2px; background: url(../images/btn-m.png) center center repeat-x; padding: 2px 4px; font-size: 11px; color: #333; text-shadow: 1px 1px 0 #fff; cursor: pointer; }
/*.print_function input[type=submit]:active { background: url(../../images/interface/btn_a-m.png) top center repeat-x; color: #fff; text-shadow: 1px 1px 0 #333;}*/
.print_function select { font-size: .75em; }

.print { padding: 10px; margin: 10px; font-size: 10.5pt; font-family: "Raleway","Myriad Pro","Myriad Web",Arial;}
.print h1 { font-size: 1.2em; margin: 5px 0; margin-bottom: 10px; font-weight: normal;}
.print h1 span { font-size: .6em; color: #999; display: block; }
.print h1 div { font-size: 0.9em; float: right; padding: 0 5px; text-align: center; color: #999; }
.print h1 div span { font-size: 1em; color: #333; padding: 0; margin: 0; text-align: center; }
.print .signature { font: .75em Arial, Helvetica, sans-serif; color: #333; text-align: center; margin-top: 20px; margin-left: 60%; }
.print table { color: #333; margin: 0 auto; padding: 0; font: .8em Raleway, Arial, Helvetica, sans-serif; background: #fff;}
.print table table { font-size: 1em; border: none; border-collapse: collapse; border: 1px #C8C9C9 solid;}
.print table th { background: #706F6F; color: #f1f1f1; font-weight: bold; text-align: center; border: 1px #C8C9C9 solid;}
.print table td { padding: 2px; vertical-align: top;}
.print table.zebra tr:nth-of-type(odd){background:#F1F1F1;} 
.print .summary{border-top: 1px #C8C9C9 solid;}
.print .header{border: none; font-size: 10.5pt; font-family: "Myriad Pro","Myriad Web",Arial;}
.print .header table {border: none; font-size: 10.5pt; font-family: "Myriad Pro","Myriad Web",Arial;}
.print .label {text-align: left; background-color: #F1F1F1; font-weight: bold; border-bottom: 1px #C8C9C9 solid;}
.print .header table tr{background-color: #fff;}
.print .header table tr td{ text-align: left;}
.print .acc{border: #706F6F 1px solid; width: 6cm; height: 2cm;  padding-left: 5px; margin-left: 10px; float: right; font-size: 0.8em; font-weight: bold;}
.print .acc2{border-bottom: #706F6F 1px solid; width: 6cm; height: 2.5cm; font-size: 1em; text-align: center; position: relative;}

.print2 { padding: 10px; margin: 10px; font-size: 10.5pt; font-family: "Open Sans";}
.print2 h1 { font-size: 1.2em; margin: 5px 0; margin-bottom: 10px; font-weight: normal;}
.print2 h1 span { font-size: .6em; color: #999; display: block; }
.print2 h1 div { font-size: 0.9em; float: right; padding: 0 5px; text-align: center; color: #999; }
.print2 h1 div span { font-size: 1em; color: #333; padding: 0; margin: 0; text-align: center; }
.print2 .signature { font: .75em Arial, Helvetica, sans-serif; color: #333; text-align: center; margin-top: 20px; margin-left: 60%; }
.print2 table { color: #333; margin: 0 auto; padding: 0; font: .8em 'Open Sans'; background: #fff; border-collapse: collapse;}
.print2 table table { font-size: 1em; border: none; border-collapse: collapse; border: 1px #C8C9C9 solid;}
.print2 table th { background: #D9D9D9; font-weight: bold; text-align: center; border: 1px #C8C9C9 solid; padding: 8px;}
.print2 table td {vertical-align: top; padding: 8px; border-bottom: 1px solid #CCCCCC!important;}
.print2 table.zebra tr:nth-of-type(odd){background:#F1F1F1;}
.print2 .summary{border-top: 1px #C8C9C9 solid;}
.print2 .header{border: none; font-size: 10.5pt; font-family: "Myriad Pro","Myriad Web",Arial;}
.print2 .header table {border: none; font-size: 10.5pt; font-family: "Myriad Pro","Myriad Web",Arial;}
.print2 .label {text-align: left; background-color: #F1F1F1; font-weight: bold; border-bottom: 1px #C8C9C9 solid;}
.print2 .header table tr{background-color: #fff;}
.print2 .header table tr td{ text-align: left;}
.print2 .acc{border: #706F6F 1px solid; width: 6cm; height: 2cm;  padding-left: 5px; margin-left: 10px; float: right; font-size: 0.8em; font-weight: bold;}
.print2 .acc2{border-bottom: #706F6F 1px solid; width: 6cm; height: 2.5cm; font-size: 1em; text-align: center; position: relative;}

/*end adjust old style*/

/*hack background color autofill dichrome*/
input:-webkit-autofill,input:-webkit-autofill:focus {transition: background-color 600000s 0s, color 600000s 0s;}

/*BEGIN Penyesuaian Bootsrap5.2*/
.form-horizontal [class*="col-xs"],.form-horizontal [class*="col-sm"],.form-horizontal [class*="col-md"],.form-horizontal [class*="col-lg"],.form-horizontal [class*="col-xl"],.form-horizontal [class*="xxl"] {float: left;position: relative;}
.form-horizontal .form-control~.form-control-line {left: 12px;right: 12px;}
.input-group-text{background-color: transparent;border: none;color: var(--primary-color);font-weight: 300; font-size: 0.88rem;}
.table > :not(:first-child) { border-top: none; }
.ui-jqgrid .table-bordered>:not(caption)>* { border-width: 0; }
.card{border: 0; border-radius: 0;-webkit-box-shadow: 0 1px 5px 0 rgb(0 0 0 / 20%);box-shadow: 0 1px 3px 0 rgb(0 0 0 / 20%); margin-bottom: 1rem;}
.card-head {border-radius: 0; min-height: unset; line-height: unset;}
.collapse.in {display: block;visibility: visible;}
.btn-check:focus+.btn, .btn:focus {outline: 0;box-shadow: none;}
.form-horizontal .card .transparent-header{line-height: unset;}
.nav-item .btn-flat{color: var(--secondary-color);border-color: transparent;background-color: #fff;border-radius: 0.25rem;font-weight: 400;}
.nav-link:focus, .nav-link:hover {color: var(--secondary-color);}
.navbar-toggler {padding: 0.25rem 0.55rem;font-size: 1rem;line-height: 1;background-color: transparent;border: 1px solid transparent;border-radius: 0.25rem;}
.navbar-light .navbar-toggler{color: var(--primary-color);border-color: #c1aaec;}
.navbar-toggler:focus {text-decoration: none;outline: 0;box-shadow: none;}
.navbar-toggler:hover {background-color: #fef5fb;color: var(--secondary-color);border-color: #fad0df;}
.nav-link {color: var(--primary-color);}
.table-striped>tbody>tr:nth-of-type(odd)>*,.table-striped>tbody>tr:nth-of-type(odd)>td {--bs-table-accent-bg: #fafafa;color: var(--bs-table-striped-color);}

.fs-7{font-size: 0.88rem!important;}
.fs-8{font-size: 0.75rem!important;}
.form-select{border-radius: 0; border: 0; border-bottom: 1px solid rgba(12,12,12,.12); font-size: 0.88rem; font-weight: 300; color: #313534; padding: .5rem 2.25rem .5rem 0;}
.form-select:focus {border-color: rgba(12,12,12,.12); outline: 0;box-shadow: none; }
.input-group .form-select{border-bottom: 1px solid rgba(12,12,12,.12); border-right: 1px solid rgba(12,12,12,.12);}
.input-group .select2 {position: relative;flex: 1 1 auto;width: 1% !important;min-width: 0;}
.input-group .btn-default{border-color: rgba(12,12,12,.12);}
.row.form-group{align-items: flex-start;}
.checkbox-styled label{ font-size: 0.88rem; font-weight: 300; }
.input-group .input-group-content{flex: 1 1 auto; width: 1% !important; min-width: 0;}
.input-group-addon{font-size: 0.88rem; border-bottom: 1.2px solid rgba(12,12,12,.12);}
.input-other-text{border: 0; border-bottom: 1px solid rgba(12,12,12,.12);}
.input-group .input-border{display: flex; border-bottom: 1px solid rgba(12,12,12,.12);align-items: center; min-width: 40px; justify-content: flex-end; background-color: #FAFAFA; border-top-right-radius: 5px !important; border-top-left-radius: 5px;}
.input-group .input-border .input-group-addon{border: none; padding: 0 8px;}
.form-toggle {position: relative;display: inline-flex;font-size: 0.75rem;font-weight: 400;align-items: center;height: 37px;}
.form-toggle input[type="checkbox"] {position: relative;width: 50px;height: 20px;background: #ede7f6;-webkit-appearance: none;border-radius: 10px;outline: none;transition: .2s;cursor: pointer;}
.form-toggle input:checked[type="checkbox"] {background: #f06292;}
.form-toggle input[type="checkbox"]::before {z-index: 2;position: absolute;content: "";left: 0;top: -3px;width: 21px;height: 21px;background: #fff;border-radius: 50%;transform: scale(1.1);box-shadow: 0px 2px 1px -1px rgb(0 0 0 / 20%), 0px 1px 1px 0px rgb(0 0 0 / 14%), 0px 1px 3px 0px rgb(0 0 0 / 12%);transition: .2s;}
.form-toggle input:checked[type="checkbox"]::before {left: 27px;}
.form-toggle label {position: absolute;color: #313534;pointer-events: none;}
.form-toggle .onbtn {left: 7px;color: #fff;}
.form-toggle .ofbtn {right: 7px; color: #999999;}
.form-toggle .text-label {top: 9px;left: 55px;font-size: 0.88rem;font-weight: 300; white-space: nowrap;}
.bootstrap-tagsinput .tag {padding: 0.2em 0.6em 0.3em;background-color: coral;}
.btn-close:focus{box-shadow: none;}
textarea.form-control{height: auto;}
.btn-success {--bs-btn-bg: #43A047;--bs-btn-border-color: #43A047;--bs-btn-hover-color: #fff;--bs-btn-hover-bg: #4CAF50;--bs-btn-hover-border-color: #4CAF50;--bs-btn-focus-shadow-rgb: 60,153,110;--bs-btn-active-color: #fff;--bs-btn-active-bg: #4CAF50;--bs-btn-active-border-color: #4CAF50;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #fff;--bs-btn-disabled-bg: #81C784;--bs-btn-disabled-border-color: #81C784;}
.btn-danger {--bs-btn-color: #fff;--bs-btn-bg: #E53935;--bs-btn-border-color: #E53935;--bs-btn-hover-color: #fff;--bs-btn-hover-bg: #F44336;--bs-btn-hover-border-color: #F44336;--bs-btn-focus-shadow-rgb: 225,83,97;--bs-btn-active-color: #fff;--bs-btn-active-bg: #F44336;--bs-btn-active-border-color: #F44336;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #fff;--bs-btn-disabled-bg: #E57373;--bs-btn-disabled-border-color: #E57373;}
.btn-info {--bs-btn-color: #fff;--bs-btn-bg: #3949AB;--bs-btn-border-color: #3949AB;--bs-btn-hover-color: #fff;--bs-btn-hover-bg: #3F51B5;--bs-btn-hover-border-color: #3F51B5;--bs-btn-focus-shadow-rgb: 11,172,204;--bs-btn-active-color: #fff;--bs-btn-active-bg: #3F51B5;--bs-btn-active-border-color: #3F51B5;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #fff;--bs-btn-disabled-bg: #7986CB;--bs-btn-disabled-border-color: #7986CB;}
.btn-draft {--bs-btn-color: #fff; --bs-btn-bg: #6c757d;--bs-btn-border-color: #6c757d;--bs-btn-hover-color: #fff;--bs-btn-hover-bg: #5c636a;--bs-btn-hover-border-color: #565e64;--bs-btn-focus-shadow-rgb: 130,138,145;--bs-btn-active-color: #fff;--bs-btn-active-bg: #565e64;--bs-btn-active-border-color: #51585e;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #fff;--bs-btn-disabled-bg: #6c757d;--bs-btn-disabled-border-color: #6c757d;}
input[type=file].form-control {padding-top: 8px;padding-left: 4px;border-right-color: transparent; background-color: #fff;}
.form-check-input[type=checkbox] {background-color: #fff;}
.orange-check.form-check-input:checked {background-color: #FF9800;border-color: #EF6C00;}
.form-check-input:focus {border-color: rgba(0,0,0,.25);outline: 0; box-shadow: none;}
.accordion-button:focus {z-index: 3;border-color: transparent;box-shadow: none;}
input.input-other-text:read-only {background-color: transparent; border-style: dashed;}
.select2-results__message{font-weight: 300; color: #9E9E9E;}
/*END Penyesuaian Bootsrap5*/


/* BEGIN Penyesuaian datatable */
tbody, td, tfoot, th, thead, tr {border-style: none;border-width: 0;}
.dataTable thead th { padding: 10px;background-color: var(--primary-color);color: #fff; border-left: 1px solid #c5a4ff; font-weight: normal; }
.dataTable tbody td {padding: 8px 10px; }
.wrap-paginate {background-color: #fff; padding: 10px; border-top: 1px solid #ddd;}
div.dataTables_wrapper div.dataTables_paginate{display: flex; justify-content: start; color: var(--primary-color); font-weight: 300; font-size: 0.88rem;}
div.dataTables_wrapper div.dataTables_length select {width: auto;}
@media screen and (max-width: 767px){
    div.dataTables_wrapper div.dataTables_paginate{justify-content: center;}
    #btn_grid{display: flex; justify-content: center;}
}
.dataTables_scrollHeadInner{background-color: var(--primary-color);}
.dataTables_scrollBody{background-color: #ffffff;}
.dataTables_paginate.paging_simple_input .paginate_button{display: flex; align-items: center; cursor: pointer; margin: 0 10px;}
.dataTables_paginate.paging_simple_input .disabled{cursor: default;opacity: .35;}
.dataTables_paginate.paging_simple_input .textbox-page{margin: 0; text-align: center; border: none; padding-top: 5px;color: var(--primary-color); font-weight: 300;}
.dataTables_paginate.paging_simple_input .select-length{border: none; background-color: #ffffff; margin-left: 5px; padding-top: 5px; color: var(--primary-color); font-weight: 300; margin-top: -7px;}
.dataTables_paginate.paging_simple_input .info-paging{ padding-top: 5px;}
.ui-separator {height: 18px;border: none;border-left: 2px solid #ccc;}
#btn_grid .btn {margin: 0; padding: 2px 7px; font-weight: 400; border-radius: 3px;}
.table{color: #313534;}
table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control:before, table.dataTable.dtr-inline.collapsed>tbody>tr>th.dtr-control:before{position: absolute; background-color: transparent; height: 0; width: 0; top: 50%; left: 10px; border-top: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 6px solid var(--secondary-color); border-radius: 0; content: ''; box-shadow: none; margin-top: -6px;}
table.dataTable.dtr-inline.collapsed>tbody>tr.parent>td.dtr-control:before, table.dataTable.dtr-inline.collapsed>tbody>tr.parent>th.dtr-control:before{position: absolute; background-color: transparent; height: 0; width: 0; top: 50%; left: 7px; border-top: 6px solid var(--secondary-color); border-right: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 6px solid transparent; border-radius: 0; content: ''; box-shadow: none; margin-top: -3px;}
table.dataTable > tbody > tr.child span.dtr-title{font-weight: 400;color: var(--primary-color);}
table.dataTable>tbody>tr.child ul.dtr-details>li{border: none;}
table.dataTable>thead .sorting:before, table.dataTable>thead .sorting_asc:before, table.dataTable>thead .sorting_desc:before, table.dataTable>thead .sorting_asc_disabled:before, table.dataTable>thead .sorting_desc_disabled:before { right: 1em; content: "↑"; }
table.dataTable>thead .sorting:after, table.dataTable>thead .sorting_asc:after, table.dataTable>thead .sorting_desc:after, table.dataTable>thead .sorting_asc_disabled:after, table.dataTable>thead .sorting_desc_disabled:after {right: 0.5em;content: "↓";}
table.dataTable tbody tr.selected {color: var(--secondary-color);}
table.dataTable tbody tr.selected a, table.dataTable tbody th.selected a, table.dataTable tbody td.selected a {color: var(--primary-color);}
table.dataTable tbody>tr.selected, table.dataTable tbody>tr>.selected,table.dataTable.table-striped>tbody>tr.odd.selected {background-color: #f6f6f8;--bs-table-accent-bg:#f6f6f8; }
.table-striped>tbody>tr.selected:nth-of-type(odd)>*, .table-striped>tbody>tr.selected:nth-of-type(odd)>td {--bs-table-accent-bg: #f6f6f8;color: var(--secondary-color);}
table .subgrid thead > tr > th {background-color: #f0f0f0;color: var(--primary-color);padding: 10px;border: none;}
table .subgrid-orange thead > tr > th {background-color: #f0f0f0;color: #F57C00;padding: 10px;border: none;}
table .subgrid tbody > tr > td {color: #616161;}
.dataTables_wrapper .child .text-center, .dataTables_wrapper .child .text-end{text-align: left !important;}
.dataTables_wrapper .table-responsive{overflow-x: visible;}
/*table.dataTable{border-collapse: collapse !important;}*/
table.dataTable thead.bordered th,table thead.bordered th {border: 1px solid #c5a4ff;}
table.dataTable tbody td.select-checkbox:before, table.dataTable tbody td.select-checkbox:after, table.dataTable tbody th.select-checkbox:before, table.dataTable tbody th.select-checkbox:after {top: 50%;}
table.dataTable tbody td.select-checkbox:before, table.dataTable tbody th.select-checkbox:before {margin-top: -6px;}
table.dataTable tr.selected td.select-checkbox:after, table.dataTable tr.selected th.select-checkbox:after {margin-top: -17px;text-shadow: 0 1px #b0bed9;}
/*END Penyesuaian datatables*/

/*sweet alert2*/
.swal2-title{font-size: 18px; line-height: 32px; font-weight: normal; color: #1C1B1F; font-family: Roboto;}
.swal2-styled.swal2-confirm { box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0,0,0,.12); transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1); border-radius: 2px; border: none; border-bottom-width: medium; border-bottom-style: none; border-bottom-color: currentcolor; outline: none; padding: 0.475rem 1rem; background-color: var(--primary-color); font-weight: 400; font-size: 0.88rem;}
.swal2-styled.swal2-deny { border: 0; border-radius: 2px; background: initial; background-color: #f44336; color: #fff; outline: none; font-size: 0.88rem; font-weight: 400; padding: 0.475rem 1rem; }
.swal2-styled.swal2-cancel { border: 0; border-radius: 2px; background: initial; background-color: #9e9e9e; color: #fff; font-size: 1em; outline: none; font-size: 0.88rem; font-weight: 400; padding: 0.475rem 1rem; }
.swal2-styled.swal2-confirm:focus,.swal2-styled.swal2-deny:focus,.swal2-styled.swal2-cancel:focus,.swal2-close:focus { box-shadow: none; }
.swal2-icon  {font-size: 0.8rem;}
.swal2-icon.swal2-success { border-color: #aed581; color: #8bc34a; }
.swal2-icon.swal2-warning { color: #ffc700; border-color: #ffc700; }
.swal2-icon.swal2-error { border-color: #f1416c; color: #f1416c; }
.swal2-icon.swal2-question { border-color: #ffe0b2; color: #ff9800; }
.swal2-icon.swal2-info { border-color: #90caf9; color: #2196f3; }
.swal2-html-container,.swal2-file, .swal2-input, .swal2-textarea, .swal2-footer { font-size: .95rem; font-weight: 300; }
.swal2-icon .swal2-icon-content {font-size: 3em;}
.swal2-close { margin-top: 10px; margin-right: 10px; font-size: 1.3em; }
.swal2-file:focus, .swal2-input:focus, .swal2-textarea:focus { border: 1px solid #e1e1e1; outline: 0; box-shadow: none; }
.swal2-validation-message,.swal2-validation-message: :before; {color: #f44336;}
.swal2-validation-message {background: #FFEBEE;color: #F44336;}

.badge-light-success { background-color: #e8fff3 !important;color: #50cd89 !important;}
.badge-light-info { background-color: #f1faff !important;color: #3E97FF !important;}
.badge-light-warning { background-color: #fff8dd !important;color: #ffc700 !important;}
.badge-light-danger { background-color: #fff5f8 !important;color: #ff4081 !important;}
.badge-light-nonactive { background-color: #EEEEEE !important;color: #9E9E9E !important;}
.badge-light-active { background-color: #f8f5ff !important;color: #7239ea !important;}

.pink-light{background-color: #fff5f8; color: #ff4081; }
.blue-light{background-color: #f1faff; color: #3E97FF; }
.green-light{background-color: #e8fff3; color: #50cd89; }
.grey-light{background-color: #F9F9F9; color: #78829D; }
.yellow-light{background-color: #fff8dd; color: #ffc700; }
.purple-light{background-color: #f8f5ff; color: #7239ea; }

.btn-group {align-items: center;align-content: center;}
.card-head .tools {padding: 0 10px;float: none;}
.tools .accordion-button {width: 2.2rem;height: 2.2rem;line-height: 2.2rem;justify-content: center;padding: 1rem;border-radius: 50%;}
.tools .accordion-button:focus{border-color: transparent;box-shadow: none;}
.tools .accordion-button:not(.collapsed)::after {transform: rotate(-180deg);}
.tools .accordion-button::after {width: 0.8rem;height: 0.8rem;background-size: 0.8rem;margin-left: 0; color: var(--primary-color); background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-chevron-down" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z"/></svg>');transition: transform .2s ease-in-out;}
.tools .accordion-button:hover {background-color: #faf9fa;color: var(--secondary-color);box-shadow: none;}
.tools .accordion-button:not(.collapsed){box-shadow: none;}
.btn-icon-toggle {color: var(--primary-color);}
.tools .btn-icon-toggle:hover {background-color: #faf9fa;border-color: transparent;color: var(--secondary-color);}
.dropdown-btn{width: 2.2rem;height: 2.2rem;line-height: 2.2rem;justify-content: center;border-radius: 50%; border: none; background-color: #fff; color: var(--primary-color);}
.dropdown-btn:hover {background-color: #faf9fa;border-color: transparent;color: var(--primary-color);}
.dropdown-btn.dropdown-toggle:after{display: none;}

.grid-cetak{display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 2rem;}
@media screen and (max-width: 1024px) {/* start of medium tablet styles */
    .grid-cetak{display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 1rem;}
}

h4{font-size: 15px;}
.place-holder::placeholder {color: #ff4081;opacity: 1; text-align: left; font-size: 1rem; font-weight: 400;}
.table thead.light > tr > th {background-color: #f8f5fd;color: var(--primary-color);}
/*summernotes pake lite sj disable bs5*/
.note-btn.dropdown-toggle::after{display: none;}
.fw-500{font-weight: 400;}