table.mycal { /* Calendar width Set Here */ width:500px; table-layout:fixed; border-spacing: 0px; } tr.days td { /* Calendar Day Height set here. This changes overall height of calendar depending on the number of weeks in month. */ height:6em; text-align: left; vertical-align: text-top; border: 1px grey solid; overflow:hidden; white-space: nowrap; padding: 2px; } tr.days td a { color:inherit; font:inherit; font-weight:inherit; } tr.daysHead th{ text-align: center; height:1em; font-weight:bold; } tr th.monthHead{ font-size:1.5em; text-align: center; } tr th.weekHead{ font-size:1.3em; text-align: center; } div.dayLabel { text-align: left; color: white; text-shadow: 1px 1px 0px #444; } div.dis { /* Disabled Day Label */ color: #444; background-color: #929292; } ul.eventList, ul.eventList li { list-style-type: none; margin: 1px; padding: 0px; font-weight:400;} ul.calendar, ul.calendar li { list-style-type: none; margin: 1px; padding: 0px; font-weight:400;} table.mycal tr td.list-icon{ width: 50px; padding:0px; } table.mycal tr td.list-event{ border-bottom: 1px black solid; } /* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ Simple CSS Calendar Icon - Based on http://365psd.com/day/2-330/ 2013 - Bartos Lazarski / Mediumidee.de ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */ .holder { width: 28px; height: 32px; position: relative; margin: 8px; font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; float: left; } .month { width: 30px; height: 16px; border: 1px solid rgba(0,0,0,0.25); -webkit-border-top-left-radius: 6px; -webkit-border-top-right-radius: 6px; -moz-border-radius-topleft: 6px; -moz-border-radius-topright: 6px; border-top-left-radius: 6px; border-top-right-radius: 6px; box-shadow: inset 0px 1px 1px 0px rgba(255,255,255,0.4); } .month p { text-align: center; color: white; font-size: 9px; font-weight: 600; text-shadow: 1px 1px 0px rgba(0,0,0,0.40); margin: 5px 0 0 0; border-bottom: 1px dashed rgba(0,0,0,0.30); margin: 2px 4px 0px 4px; padding: 0 0 1px 0; } .day { width: 30px; height: 16px; border: 1px solid rgba(0,0,0,0.25); -webkit-border-bottom-right-radius: 6px; -webkit-border-bottom-left-radius: 6px; -moz-border-radius-bottomright: 6px; -moz-border-radius-bottomleft: 6px; border-bottom-right-radius: 6px; border-bottom-left-radius: 6px; background: white; background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmN2Y3ZjciIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(247, 247, 247, 1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255, 255, 255, 1)), color-stop(100%,rgba(247, 247, 247, 1))); background: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 0%,rgba(247, 247, 247, 1) 100%); background: -o-linear-gradient(top, rgba(255, 255, 255, 1) 0%,rgba(247, 247, 247, 1) 100%); background: -ms-linear-gradient(top, rgba(255, 255, 255, 1) 0%,rgba(247, 247, 247, 1) 100%); background: linear-gradient(top, rgba(255, 255, 255, 1) 0%,rgba(247, 247, 247, 1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f7f7f7',GradientType=0 ); box-shadow: 0px 1px 0px 0px #fff, 0px 2px 0px 0px #ccc,0px 3px 0px 0px #fff, 0px 4px 0px 0px #ccc; } .day p { text-align: center; font-size: 12px; font-weight: 700; color: #444; text-shadow: 1px 1px 0px white; margin-top: 0px; } .red{ background: rgb(169,3,41); background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2E5MDMyOSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjQ0JSIgc3RvcC1jb2xvcj0iIzhmMDIyMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM2ZDAwMTkiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(169,3,41,1)), color-stop(44%,rgba(143,2,34,1)), color-stop(100%,rgba(109,0,25,1))); background: -webkit-linear-gradient(top, rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%); background: -o-linear-gradient(top, rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%); background: -ms-linear-gradient(top, rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%); background: linear-gradient(top, rgba(169,3,41,1) 0%,rgba(143,2,34,1) 44%,rgba(109,0,25,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=0 ); } .green { background: rgb(138,182,107); background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzhhYjY2YiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzOTgyMzUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, rgba(138,182,107,1) 0%, rgba(57,130,53,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(138,182,107,1)), color-stop(100%,rgba(57,130,53,1))); background: -webkit-linear-gradient(top, rgba(138,182,107,1) 0%,rgba(57,130,53,1) 100%); background: -o-linear-gradient(top, rgba(138,182,107,1) 0%,rgba(57,130,53,1) 100%); background: -ms-linear-gradient(top, rgba(138,182,107,1) 0%,rgba(57,130,53,1) 100%); background: linear-gradient(top, rgba(138,182,107,1) 0%,rgba(57,130,53,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8ab66b', endColorstr='#398235',GradientType=0 ); } .blue { background: rgb(79,133,187); background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRmODViYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9Ijk5JSIgc3RvcC1jb2xvcj0iIzI0NTg4YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=); background: -moz-linear-gradient(top, rgba(79,133,187,1) 0%, rgba(36,88,140,1) 99%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(79,133,187,1)), color-stop(99%,rgba(36,88,140,1))); background: -webkit-linear-gradient(top, rgba(79,133,187,1) 0%,rgba(36,88,140,1) 99%); background: -o-linear-gradient(top, rgba(79,133,187,1) 0%,rgba(36,88,140,1) 99%); background: -ms-linear-gradient(top, rgba(79,133,187,1) 0%,rgba(36,88,140,1) 99%); background: linear-gradient(top, rgba(79,133,187,1) 0%,rgba(36,88,140,1) 99%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4f85bb', endColorstr='#24588c',GradientType=0 ); } .yellow { background: rgb(255,203,73); background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2ZmY2I0OSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmOGI1MDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, rgba(255,203,73,1) 1%, rgba(248,181,0,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgba(255,203,73,1)), color-stop(100%,rgba(248,181,0,1))); background: -webkit-linear-gradient(top, rgba(255,203,73,1) 1%,rgba(248,181,0,1) 100%); background: -o-linear-gradient(top, rgba(255,203,73,1) 1%,rgba(248,181,0,1) 100%); background: -ms-linear-gradient(top, rgba(255,203,73,1) 1%,rgba(248,181,0,1) 100%); background: linear-gradient(top, rgba(255,203,73,1) 1%,rgba(248,181,0,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffcb49', endColorstr='#f8b500',GradientType=0 ); }