Accordions & Toggles

Multiple Handles

[divide icon=”square” icon_position=”left” margin_top=”20″ margin_bottom=”30″ width=”long”][one_third][accordions direction=”vertical” handle=”arrows” space=”no” ]
[accordion title=”Vestibulum id ligula” ]Etiam porta sem malesuada magna mollis euismod. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum. Vestibulum [/accordion]
[accordion title=”mattis consectetu” ]Aenean lacinia bibendum nulla sed consectetur. Nullam id dolor id nibh ultricies vehicula ut id elit. Maecenas faucibus mollis interdum. Maecenas sed diam [/accordion]
[accordion title=”varius blandit sit ” ]eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo.[/accordion]
[/accordions] [/one_third]

[one_third][accordions direction=”vertical” handle=”pm” space=”no” ][accordion title=”Vestibulum id ligula” ]Etiam porta sem malesuada magna mollis euismod. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum. Vestibulum [/accordion]
[accordion title=”mattis consectetu” ]Aenean lacinia bibendum nulla sed consectetur. Nullam id dolor id nibh ultricies vehicula ut id elit. Maecenas faucibus mollis interdum. Maecenas sed diam [/accordion]
[accordion title=”varius blandit sit ” ]eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo.[/accordion]
[/accordions] [/one_third]

[one_third_last][accordions direction=”vertical” handle=”numbers” space=”no” ]
[accordion title=”Vestibulum id ligula” ]Etiam porta sem malesuada magna mollis euismod. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum. Vestibulum [/accordion]
[accordion title=”mattis consectetu” ]Aenean lacinia bibendum nulla sed consectetur. Nullam id dolor id nibh ultricies vehicula ut id elit. Maecenas faucibus mollis interdum. Maecenas sed diam [/accordion]
[accordion title=”varius blandit sit ” ]eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo.[/accordion]
[/accordions][/one_third_last]

[accordions direction=”vertical” handle=”” space=”no” ]
[accordion title=”venenatis dapibus posuere” ]Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Donec id elit non mi porta gravida at eget metus. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Donec sed odio dui.[/accordion]
[accordion title=”commodo cursus magna” ]Etiam porta sem malesuada magna mollis euismod. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Aenean lacinia bibendum nulla sed consectetur. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue. Curabitur blandit tempus porttitor. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.[/accordion]
[accordion title=”Donec sed odio dui.” ]Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Donec id elit non mi porta gravida at eget metus. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Donec sed odio dui.[/accordion]
[accordion title=”vel scelerisque nisl” ]Etiam porta sem malesuada magna mollis euismod. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Aenean lacinia bibendum nulla sed consectetur. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue. Curabitur blandit tempus porttitor. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.[/accordion]
[/accordions]

[gap]

With Spaces

[divide icon=”square” icon_position=”left” margin_top=”20″ margin_bottom=”30″ width=”long”]

[one_half][accordions direction=”vertical” handle=”arrows” space=”yes” ]
[accordion title=”venenatis dapibus posuere” ]Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Donec id elit non mi porta gravida at eget metus. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Donec sed odio dui.[/accordion]
[accordion title=”commodo cursus magna” ]Etiam porta sem malesuada magna mollis euismod. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Aenean lacinia bibendum nulla sed consectetur. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue. Curabitur blandit tempus porttitor. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.[/accordion]
[accordion title=”Donec sed odio dui.” ]Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Donec id elit non mi porta gravida at eget metus. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Donec sed odio dui.[/accordion]
[/accordions][/one_half]

[one_half_last]

[accordions direction=”vertical” handle=”pm” space=”yes” ]

[accordion title=”Donec sed odio dui.” ]Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Donec id elit non mi porta gravida at eget metus. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Donec sed odio dui.[/accordion]
[accordion title=”venenatis dapibus posuere” ]Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Donec id elit non mi porta gravida at eget metus. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Donec sed odio dui.[/accordion]
[accordion title=”commodo cursus magna” ]Etiam porta sem malesuada magna mollis euismod. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Aenean lacinia bibendum nulla sed consectetur. Nulla vitae elit libero, a pharetra augue. Nulla vitae elit libero, a pharetra augue. Curabitur blandit tempus porttitor. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.[/accordion]
[/accordions]

[/one_half_last]

[gap]

With Icons

[divide icon=”square” icon_position=”left” margin_top=”20″ margin_bottom=”30″ width=”long”]

[one_half][accordions direction=”vertical” handle=”arrows” space=”no” ]
[accordion title=”Real Responsive Design” icon=”linecon-icon-settings”]Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo[/accordion]
[accordion title=”Huge Options Panel” icon=”linecon-icon-bulb” ]Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo[/accordion]
[accordion title=”Unbelievable shortcodes” icon=”linecon-icon-pen” ]Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo[/accordion]
[accordion title=”Easy As Cake” icon=”linecon-icon-diamond” ]Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo[/accordion]
[/accordions][/one_half][one_half_last][accordions direction=”vertical” handle=”arrows” space=”no” icon_color=”#c74c4c” icon_current_color=”#ffa507″]
[accordion title=”Real Responsive Design” icon=”linecon-icon-like” ]Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo[/accordion]
[accordion title=”Huge Options Panel” icon=”linecon-icon-params” ]Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo[/accordion]
[accordion title=”Unbelievable shortcodes” icon=”linecon-icon-fire” ]Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo[/accordion]
[accordion title=”Easy As Cake” icon=”linecon-icon-truck” ]Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo[/accordion]
[/accordions]

[/one_half_last]

[gap]

Toggles

[divide icon=”square” icon_position=”left” margin_top=”20″ margin_bottom=”30″ width=”long”]

[one_third][accordions type=”toggle” handle=”arrows” space=”no” ]
[accordion title=”Real Responsive Design” ] Etiam porta sem malesuada magna mollis euismod. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum. Vestibulum[/accordion]
[accordion title=”Huge Options Panel” ] Etiam porta sem malesuada magna mollis euismod. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum. Vestibulum [/accordion]
[accordion title=”Unbelievable shortcodes” ] Etiam porta sem malesuada magna mollis euismod. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum. Vestibulum [/accordion]
[accordion title=”Easy As Cake” ] Etiam porta sem malesuada magna mollis euismod. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum. Vestibulum [/accordion]
[/accordions] [/one_third]

[one_third][accordions type=”toggle” handle=”pm” space=”no” ]
[accordion title=”Real Responsive Design” ] Etiam porta sem malesuada magna mollis euismod. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum. Vestibulum[/accordion]
[accordion title=”Huge Options Panel” ] Etiam porta sem malesuada magna mollis euismod. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum. Vestibulum [/accordion]
[accordion title=”Unbelievable shortcodes” ] Etiam porta sem malesuada magna mollis euismod. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum. Vestibulum [/accordion]
[accordion title=”Easy As Cake” ] Etiam porta sem malesuada magna mollis euismod. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum. Vestibulum [/accordion]
[/accordions][/one_third]

[one_third_last][accordions type=”toggle” handle=”numbers” space=”no” ]
[accordion title=”Real Responsive Design” ] Etiam porta sem malesuada magna mollis euismod. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum. Vestibulum[/accordion]
[accordion title=”Huge Options Panel” ] Etiam porta sem malesuada magna mollis euismod. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum. Vestibulum [/accordion]
[accordion title=”Unbelievable shortcodes” ] Etiam porta sem malesuada magna mollis euismod. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum. Vestibulum [/accordion]
[accordion title=”Easy As Cake” ] Etiam porta sem malesuada magna mollis euismod. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum. Vestibulum [/accordion]
[/accordions] [/one_third_last]

[gap]

How Toggles Start

[divide icon=”square” icon_position=”left” margin_top=”20″ margin_bottom=”30″ width=”long”]

[one_third]

[accordions type=”toggle” handle=”arrows” space=”no” ]
[accordion title=”Real Responsive Design” state=”open” ] Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo [/accordion]
[accordion title=”Huge Options Panel” state=”open” ] Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo [/accordion]
[accordion title=”Unbelievable shortcodes” state=”open” ] Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo [/accordion]
[accordion title=”Easy As Cake” state=”open” ] Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo [/accordion]
[/accordions]

[/one_third]

[one_third]

[accordions type=”toggle” handle=”arrows” space=”yes” ]
[accordion title=”Real Responsive Design” state=”close” ] Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo [/accordion]
[accordion title=”Huge Options Panel” state=”open” ] Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo [/accordion]
[accordion title=”Unbelievable shortcodes” state=”close” ] Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo [/accordion]
[accordion title=”Easy As Cake” state=”open” ] Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo [/accordion]
[/accordions]

[/one_third]

[one_third_last]

[accordions type=”toggle” handle=”arrows” space=”no” ]
[accordion title=”Real Responsive Design” state=”open” ] Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo [/accordion]
[accordion title=”Huge Options Panel” state=”close” ] Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo [/accordion]
[accordion title=”Unbelievable shortcodes” state=”close” ] Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo [/accordion]
[accordion title=”Easy As Cake” state=”open” ] Maecenas sed diam eget risus varius blandit sit amet non magna. Nullam quis risus eget urna mollis ornare vel eu leo [/accordion]
[/accordions]

[/one_third_last]

[gap]