Free Photos
WordPress Themes

Basic color changes

/* Change the padding and background colour of Bókun's widget (iFrame) below */ Body { padding: 50px; background: white; /* edit to change background color for the Bókun iFrame. NOTE you can use Transparent as well as colours. */ } /* Change main body text below */ body, label { color: #333 !important; } /* Change the color of the text for current month in the widget, and the arrows to the left / right */ a { color: #88bbc8 !important; } /* Change the color of the "Book" button's background and text */ .btn-success { background: #88bbc8 !important; /* changes color of the background of the "Book" button */ border-color:#729ca7 !important; /* changes color of the border around the "Book" button */ color: white; /* changes color of the text inside the "Book" button */ font-weight: normal; /* changes the font weight of the text inside the "Book" button. This is useful if you plan on using a dark background and light text */ } /* Change colors in the Activity Time Selector's Calendar below. Remember to change the legends as well as your date's background */ /* Change the available dates below */ .availability-calendar td.daycell.available .date { background: #88bbc8; /* changes the background color of each date cell */ border: 2px solid #88bbc8; /* set to the same setting colour the abowe line */ color: #ffffff; /* changes the color of numbers for each day in the calendar */ } .availability-calendar .legend .available { background-color:#88bbc8; /* for the calendar's legend, this colour must be the same as the background for available dates (above) */ } .availability-calendar td.daycell.available.selected .date { border: 2px solid #000000; /*changes the color to change the highlight of the selected day */ } /* Change sold out dates below */ .availability-calendar td.daycell.sold-out .date { background: #efaeb1; /* changes the background color of each date cell */ border: 2px solid #efaeb1; /* set to the same setting colour the abowe line */ color: #ffffff; /* changes the color of numbers for each day in the calendar */ } .availability-calendar .legend .sold-out { background-color: #efaeb1; /* for the calendar's legend, this colour must be the same as the background for sold-out dates (above) */ }

Be the first to comment

You can use [html][/html], [css][/css], [php][/php] and more to embed the code. Urls are automatically hyperlinked. Line breaks and paragraphs are automatically generated.