X
+34 957 46 75 77 info@surgenia.es

Accordions and Toggles

Accordions with first section open

Section 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque non massa lorem. Ut feugiat malesuada sapien. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur rutrum leo libero, nec cursus purus porttitor nec.

Section 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque non massa lorem. Ut feugiat malesuada sapien. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur rutrum leo libero, nec cursus purus porttitor nec.

Section 3

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque non massa lorem. Ut feugiat malesuada sapien. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur rutrum leo libero, nec cursus purus porttitor nec.

Section 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque non massa lorem. Ut feugiat malesuada sapien. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur rutrum leo libero, nec cursus purus porttitor nec.

Section 5

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque non massa lorem. Ut feugiat malesuada sapien. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur rutrum leo libero, nec cursus purus porttitor nec.
[vc_icon alpha="2" size="large" align="center" style="style3" border_width="1" border_opacity="1" bg_opacity="1" bg_opacity_hover="1" link="#" color="#ffffff" bg_color="#333333" css_animation_delay="0"][vc_separator type="medium" style="normal" color="light" align="center" margin_top="25" margin_bottom="20"]

Accordions with Custom section open

Section 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque non massa lorem. Ut feugiat malesuada sapien. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur rutrum leo libero, nec cursus purus porttitor nec.

Section 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque non massa lorem. Ut feugiat malesuada sapien. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur rutrum leo libero, nec cursus purus porttitor nec.

Section 3

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque non massa lorem. Ut feugiat malesuada sapien. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur rutrum leo libero, nec cursus purus porttitor nec.

Section 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque non massa lorem. Ut feugiat malesuada sapien. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur rutrum leo libero, nec cursus purus porttitor nec.

Section 5

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque non massa lorem. Ut feugiat malesuada sapien. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur rutrum leo libero, nec cursus purus porttitor nec.
[vc_icon alpha="3" size="large" align="center" style="style3" border_width="1" border_opacity="1" bg_opacity="1" bg_opacity_hover="1" link="#" color="#ffffff" bg_color="#333333" css_animation_delay="0"][vc_separator type="medium" style="normal" color="light" align="center" margin_top="25" margin_bottom="20"]

Toggles with all tabs closed

Section 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque non massa lorem. Ut feugiat malesuada sapien. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur rutrum leo libero, nec cursus purus porttitor nec.

Section 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque non massa lorem. Ut feugiat malesuada sapien. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur rutrum leo libero, nec cursus purus porttitor nec.

Section 3

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque non massa lorem. Ut feugiat malesuada sapien. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur rutrum leo libero, nec cursus purus porttitor nec.

Section 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque non massa lorem. Ut feugiat malesuada sapien. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur rutrum leo libero, nec cursus purus porttitor nec.
[vc_icon alpha="4" size="large" align="center" style="style3" border_width="1" border_opacity="1" bg_opacity="1" bg_opacity_hover="1" link="#" color="#ffffff" bg_color="#333333" css_animation_delay="0"][vc_separator type="medium" style="normal" color="light" align="center" margin_top="25" margin_bottom="20"]

Toggles with icon and default state to open

Section 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque non massa lorem. Ut feugiat malesuada sapien. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur rutrum leo libero, nec cursus purus porttitor nec.

Section 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque non massa lorem. Ut feugiat malesuada sapien. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur rutrum leo libero, nec cursus purus porttitor nec.

Section 3

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque non massa lorem. Ut feugiat malesuada sapien. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur rutrum leo libero, nec cursus purus porttitor nec.

Section 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque non massa lorem. Ut feugiat malesuada sapien. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur rutrum leo libero, nec cursus purus porttitor nec.