/*

-----------------------------

* CSS Calendar

* Tim Wright

* Chris Coyier

-----------------------------

*/

#calendar-control {margin:0;padding:0;}


/*#calendar-control * {display:inline;}*/

#calendar-control ol.calendar {margin:0 auto;display:block; min-height: 200px;background: url(images/tl.png) top left no-repeat; padding: 12px 0 0 20px;}

#calendar-control li {list-style:none;}


#calendar-control p.link {text-align:center;display: block;}

/*

* Day styles

-------------------------*/

#calendar li li             {width:6em;height:6em;float:left;margin:.2em; padding:.2em;overflow:hidden;background: url(images/day-bg.png) bottom right no-repeat;line-height:1; }


#calendar li li a           {font-size: 10px;display: block;padding: 4px; }

#calendar #weekdays li      {width:6em;height:2em;float:left;margin:.2em; padding:.2em;overflow:auto;background: url(images/day-bg-inactive.png) bottom right no-repeat;color: #C5B856 ;}


#calendar li.selected       {background: none;}

#calendar li.today span     {font-weight: bold;}

 

 

/*

* Day content (UL/OL & P)


-------------------------*/

#calendar-control li li p             {font-size:.7em;display:block;}

#calendar-control li li ol            {width:auto;}

#calendar-control li li ul li,

#calendar-control li li ol li         {font-size:.7em;display:block;height:auto;width:auto; background: none;margin:0;padding:.2em 0;float:none;}


/*

* Holiday class

-------------------------*/

#calendar-control li #calendar li.holiday       {  }

/*

* Inactive months

-------------------------*/

#calendar-control #lastmonth li,


#calendar-control #nextmonth li     { background: url(images/day-bg-inactive.png);}

/*Omat*/

 

#calendar-nav  {padding:10px; margin-left: 5px; margin-right: 2px;}

#calendar-nav form{display:inline;}

#calendar-nav .month {color: #007F56;font-size: 20px;text-transform:capitalize;}

 

#calendar #navi {
background-image: none;
overflow: hidden;
height: 58px;
width: 620px;
margin-top:50px;
margin-left: 15px;
 }

                            
#calendar #navi li a {
padding: 12px 20px 16px 20px;
color: #007F56;
font-size: 16px;
float: left;
border-right: 1px solid #bbb;
display: block;       
 }

#calendar #navi li a.first{
border-left: 1px solid #bbb;
margin-left:20px;
}

   

    

#calendar #navi li a.add{
background-image: url(/s/calendar/add.png);
background-repeat: no-repeat;
background-position-y: 8px;
background-position-x: 20px;
border-right: none;
padding-left: 60px;
border: none;
}


#calendar #navi .oncalendar {
margin-right: 10px;
padding-left: 5px;
float: right;
}


#calendar #navi .search input {
width:150px;
}

   
#calendar #calendar-wrapper{
margin: 10px 10px 0 20px;
}

#calendar #tapahtuma div{
float:left;
}

   
#calendar p.error{
color:Red;
}

   

#calendar .article{
    width: 800 px !important;
    border-bottom: 3px solid #5CA262;
    padding-bottom:20px;
    padding-left:20px;
    }

#calendar .article p{
font-family: Helvetica,Arial,sans-serif;
font-size: 0.85em;
line-height: 1.7em;
padding-left:20px
padding-bottom:20px;
}

#calendar .article h2{
padding-top:20px;
padding-bottom:20px;
padding-left:20px
}
   

    /*Lomake*/

    #tapahtuma input, #tapahtuma textarea{

        /*margin-top: 18px;*/

        height: 26px;

        padding-top: 5px;

        padding-bottom: 3px;


        padding-left: 10px;

        outline: none;

        -moz-border-radius: 0px;

        -webkit-border-radius: 0px;

        -khtml-border-radius: 0px;

        border-radius: 0px;


        background: #F8F7F6;

        border: 1px solid #F8F7F6;

        float: left;

        font-family: Arial, sans-serif;

        color: #888;

        margin-left: 2px;

    }

   
 #tapahtuma button {
        border: none;
        height:35px;
        outline: none;
        width: 120px;
        cursor: pointer;
        background: #5ca262;
        font-size: 14px;
        padding:10px;
        color: #ffffff;
        margin-left:30px;
    }

    #tapahtuma button:hover {

        background:#99cc66;

    }   

    

    #tapahtuma textarea{height: 400px;}

    #tapahtuma input.full, #tapahtuma textarea.full


    {

        width: 500px;

    }

   

    #tapahtuma input.half

    {

        width: 222px;

        float: left;

    }

   

    #tapahtuma input.halfmore


    {

        width: 280px;

        float: left;

    }

 

   

    #tapahtuma input.error, #tapahtuma textarea.error

    {

        background-color: #FAD1D1 !important;


        float: left;

    }

   

    #tapahtuma label.error

    {

        color: red!important;

        display: block;

        clear: both;

        line-height: 1;


        padding-top: 1px;       

    }

   

  #tapahtuma label {
    display: block;
    padding-top: 5px;
    color: #333;
    font-size: 16px;
    padding-left: 8px;
    
}

   

    #tapahtuma .title {
    display: block;
    padding-top: 5px;
    color: #333;
    font-size: 20px;
    padding-left:3px;
}
   


    /*calendar ui*/

    .ui-dialog

    {

        text-align: left !important;

        width: 620px !important;

    }

   

    .ui-tooltip

    {

        text-align: left !important;


    }   

 

 

#calendar #calendar-wrapper {

    margin: 0px;

}

 

#calendar-nav {

    padding-top:none;

    margin-left: none;

}

 

#previousmonthbtn {


background:#5CA262;

   border-radius: 0px;

    font-family:'montserrat', arial, sans-serif;

    font-size: 16px;

    color:#ffffff;

    float:left;

}

 

#nextmonthbtn {


background:#5CA262;

   border-radius: 0px;

    font-family:'montserrat', arial, sans-serif;

    font-size: 16px;

    color:#ffffff;

    float:right;

}

 


#calendar-nav .month {

    font-family:'montserrat', arial, sans-serif;

    font-size: 18px;

    color:#5CA262;

    padding-left:275px;
   

    padding-top: 20px;

}




 

#calendar #weekdays li {
    

    height: 1em;

    margin: 0.2em;

    padding: 0.2em;

    overflow: auto;

    background:#ffffff;

    color: #333333;

    width: 8em;


}

 

#calendar li li {

    width: 8em;

    height: 8em;

    margin: 0.2em;

    padding: 0.2em;

    overflow: hidden;

    background: #ffffff;

    line-height: 1;


    box-shadow: 3px 3px 2px #ebe7e7;

    /* border: solid 1px #ebe7e7; */

}

 

#calendar li.selected {

    background:#cccccc;

}

 

#calendar-control ol.calendar {


    margin: 15px;

    display: block;

    min-height: 800px;

    background:#ffffff;

    padding: 0px;


}



#calendar .lomake-div {float: left;width: 600px;padding-bottom:50px;padding-left:80px;}
#calendar .lomake-ohje-div {padding: 2px 12px 0 20px;width: 300px;float: left;}
#calendar .lomake-ohje-div p {padding-bottom:20px;font-family: 'Helvetica', Arial, sans-serif;
font-size: 0.85em; width:200px;
    line-height: 1.7em;}
#calendar p.error {
    color: #99cc66;
    padding: 20px;
}