העבודות שלנו
-
CultiVU
<!--#include virtual="ssi/header.shtml" --> <section class="section-nav"> <header class="section-head"> <a href="#" class="logo-small"></a> </header><!-- /.section-head --> <div class="section-inner"> <div class="section-inner-image"> <img src="css/images/section-avatar.png" height="52" width="52" alt=""> </div><!-- /.section-inner-image --> <div class="section-inner-content"> <span>John Lawson</span> <p>Farmers consulting</p> </div><!-- /.section-inner-content --> </div><!-- /.section-inner --> <div class="section-body"> <nav class="nav"> <ul> <li> <a href="#">Dashboard</a> </li> <li> <a href="#"> Inbox <span>6</span> </a> </li> <li> <a href="#"> Outbox </a> </li> <li> <a href="#"> Analytics <span>30</span> </a> </li> <li> <a href="#"> Knowledge <span>30</span> </a> </li> <li> <a href="#"> Farmers <span>245</span> </a> </li> <li class="current"> <a href="#"> Follow-ups <span>12</span> </a> </li> </ul> </nav><!-- /.nav --> </div><!-- /.section-body --> </section><!-- /.section-nav --> <div class="container"> <section class="section section-map"> <div class="section-body"> <div class="map"> <div id="farmerLocation" data-lat="32.017735" data-lng="34.876498" class="map-canvas"></div><!-- /#farmerLocation --> </div><!-- /.map --> </div><!-- /.section-body --> </section><!-- /.section-map --> <section class="section-profile"> <header class="section-head"> <div class="profile"> <div class="profile-avatar"> <img src="css/images/profile-avatar.jpg" height="96" width="96" alt=""> </div><!-- /.profile-avatar --> <div class="profile-content"> <span>Eddie Miller</span> </div><!-- /.profile-content --> </div><!-- /.profile --> <div class="section-head-actions"> <a href="ajax/popup-farmer.html" class="btn btn-yellow btn-popup">Edit details</a> <a href="#" class="btn btn-yellow"><i class="ico-plus"></i> New Message</a> </div><!-- /.section-head-actions --> </header><!-- /.section-head --> <div class="section-body"> <div class="section-cols"> <div class="section-col section-col-size1"> <div class="section-content"> <ul class="list-profile-items"> <li> <a href="tel:(302)-794-6499">(302)-794-6499</a> </li> <li> <a href="mailto:Eddie.miller@gmail.com">Eddie.miller@gmail.com</a> </li> </ul><!-- /.list-profile-items --> </div><!-- /.section-content --> </div><!-- /.section-col section-col-size1 --> <div class="section-col section-col-size2"> <div class="section-content"> <ul class="list-profile-items"> <li> <i class="ico-olive"></i> <span>Olive</span> </li> <li> <i class="ico-users-small"></i> <ul class="list-grey-items"> <li>Olive</li> <li>Coast</li> </ul><!-- /.list-grey-items --> </li> </ul><!-- /.list-profile-items --> </div><!-- /.section-content --> </div><!-- /.section-col section-col-size2 --> <div class="section-col section-col-size3"> <div class="section-content"> <ul class="list-profile-items"> <li><i class="ico-board"></i> 25 Dunam farm</li> <li><i class="ico-cultivu"></i> 8m in Cultivu</li> </ul><!-- /.list-profile-items --> </div><!-- /.section-content --> </div><!-- /.section-col section-col-size3 --> </div><!-- /.section-cols --> </div><!-- /.section-body --> </section><!-- /.section-profile --> <section class="section section-plans"> <div class="section-cols"> <div class="section-col section-col-1of2"> <header class="section-head"> <h6 class="section-title">Irrigation reports</h6><!-- /.section-title --> </header><!-- /.section-head --> <div class="section-body"> <div class="section-inner"> <div class="section-inner-chart"> <div id="irrigationReports"></div><!-- /#irrigationReports --> </div><!-- /.section-inner-chart --> </div><!-- /.section-inner --> </div><!-- /.section-body --> </div><!-- /.section-col section-col-1of2 --> <div class="section-col section-col-1of2"> <header class="section-head"> <h6 class="section-title">November plan</h6><!-- /.section-title --> </header><!-- /.section-head --> <div class="section-body"> <div class="section-inner"> <ul class="list-plans"> <li> <i class="ico-drop"></i> <span class="large">20</span> <p>m3 / dun / Week</p> </li> <li> <i class="ico-drop"></i> <span>merav</span> <p>FERTILIZATION </p> </li> <li> <i class="ico-spider"></i> <span>rogor</span> <p>for OLIVE FLY</p> </li> </ul><!-- /.list-plans --> </div><!-- /.section-inner --> </div><!-- /.section-body --> </div><!-- /.section-col section-col-1of2 --> </div><!-- /.section-cols --> </section><!-- /.section-plans --> <section class="section section-message"> <header class="section-head"> <h6 class="section-title">Messages <strong>20</strong></h6><!-- /.section-title --> </header><!-- /.section-head --> <div class="section-body"> <div class="section-inner"> <ul class="messages"> <li class="message"> <div class="message-icon"> <i class="ico-spider-secondary"></i> </div><!-- /.message-icon --> <div class="message-name"> <span>Eddie Miller</span> </div><!-- /.message-name --> <div class="message-content"> <h6>Olive Fly Outbreak</h6> <p>Significant olive fly activity in mountain region, need to treat with Rogor and deploy...</p> </div><!-- /.message-content --> <div class="message-inner"> <span>2 hours ago</span> <ul class="list-grey-items"> <li>Garlic</li> </ul><!-- /.list-grey-items --> </div><!-- /.message-inner --> </li><!-- /.message --> <li class="message"> <div class="message-icon"> <i class="ico-drop-secondary"></i> </div><!-- /.message-icon --> <div class="message-name"> <span>Eddie Miller</span> </div><!-- /.message-name --> <div class="message-content"> <h6>IRRIGATION SCHEDULE UPDATE</h6> <p>Due to the dry spring hot weather, we are increasing the water recommendation...</p> </div><!-- /.message-content --> <div class="message-inner"> <span>5 hours ago</span> <ul class="list-grey-items"> <li>North</li> <li>corn</li> </ul><!-- /.list-grey-items --> </div><!-- /.message-inner --> </li><!-- /.message --> <li class="message current"> <div class="message-icon"> <i class="ico-graph"></i> </div><!-- /.message-icon --> <div class="message-name"> <span>Eddie Miller</span> </div><!-- /.message-name --> <div class="message-content"> <h6>Harvest Preparation</h6> <p>Due to mixed yields this year, we need to be ready for the harvest in late</p> </div><!-- /.message-content --> <div class="message-inner"> <span>4 days ago</span> <ul class="list-grey-items"> <li>Fresh</li> </ul><!-- /.list-grey-items --> </div><!-- /.message-inner --> </li><!-- /.message --> </ul><!-- /.messages --> </div><!-- /.section-inner --> </div><!-- /.section-body --> </section><!-- /.section section-message --> </div><!-- /.container --> <!--#include virtual="ssi/footer.shtml" -->
/* Table of Contents update on Mon Oct 12 2015 17:14:42 GMT+0300 (FLE Summer Time) I. Generic -------------------------------------- 01. Reset ------------------------------------ 02. Fonts ------------------------------------ 03. Base ------------------------------------- 04. Helpers ---------------------------------- Clear ------------------------------------ Notext ----------------------------------- Hidden ----------------------------------- Alignleft -------------------------------- Alignright ------------------------------- Disabled --------------------------------- II. Regions -------------------------------------- 01. Wrapper ---------------------------------- 02. Container -------------------------------- 03. Shell ------------------------------------ 04. Header ----------------------------------- 05. Main ------------------------------------- 06. Footer ----------------------------------- 07. Content ---------------------------------- 08. Sidebar ---------------------------------- III. Themes --------------------------------------- IV. Modules -------------------------------------- 01. Accordion -------------------------------- 02. Button ----------------------------------- 03. Calendar Items --------------------------- 04. Form Elements ---------------------------- 05. Form ------------------------------------- Form Add Secondary ----------------------- 06. Form Login ------------------------------- 07. Form Recipients -------------------------- 08. Form Report ------------------------------ 09. Groups ----------------------------------- 10. List ------------------------------------- 11. List Profile Items ----------------------- 12. List Grey Items -------------------------- 13. List Plans ------------------------------- 14. List Group Items ------------------------- 15. List Subjects ---------------------------- 16. Logo ------------------------------------- 17. Messages --------------------------------- 18. Nav -------------------------------------- 19. Popup ------------------------------------ 20. Popup Plan ------------------------------- 21. Profile ---------------------------------- 22. Protection Items ------------------------- 23. Reports ---------------------------------- 24. Search ----------------------------------- 25. Section ---------------------------------- 26. Section Login ---------------------------- 27. Section Nav ------------------------------ 28. Section Map ------------------------------ 29. Section Profile -------------------------- 30. Section Message -------------------------- 31. Section Plans ---------------------------- 32. Section Protection ----------------------- 33. Section Users ---------------------------- 34. Section Farmer Plans --------------------- 35. Section Subjects ------------------------- 36. Section Recipients ----------------------- 37. Section Calendar ------------------------- 38. Slider ----------------------------------- 39. Sort Dropdown ---------------------------- Sort Dropdown Secondary ------------------ 40. Subjects --------------------------------- 41. Tabs ------------------------------------- 42. Tabs Primary ----------------------------- 43. Table ------------------------------------ 44. Table Farmers ---------------------------- 45. Table Message ---------------------------- 46. Table Plans ------------------------------ 47. Users ------------------------------------ 48. Widget ----------------------------------- */ .ico-arrow-down-large { background-image: url(images/sprite.png); background-position: -265px -54px; width: 15px; height: 9px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-arrow-down { background-image: url(images/sprite.png); background-position: -265px -82px; width: 10px; height: 6px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-arrow-up-large { background-image: url(images/sprite.png); background-position: -265px -41px; width: 15px; height: 9px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-board { background-image: url(images/sprite.png); background-position: -84px -178px; width: 26px; height: 27px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-check { background-image: url(images/sprite.png); background-position: -66px -220px; width: 20px; height: 15px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-close { background-image: url(images/sprite.png); background-position: -189px -178px; width: 18px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-create { background-image: url(images/sprite.png); background-position: -140px -178px; width: 22px; height: 22px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-crop { background-image: url(images/sprite.png); background-position: -225px -84px; width: 33px; height: 38px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-cultivu { background-image: url(images/sprite.png); background-position: -113px -154px; width: 22px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-drop-quaternary { background-image: url(images/sprite.png); background-position: -225px -170px; width: 28px; height: 41px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-drop-secondary { background-image: url(images/sprite.png); background-position: -180px -87px; width: 38px; height: 38px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-drop-tertiary { background-image: url(images/sprite.png); background-position: 0 -119px; width: 37px; height: 55px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-drop { background-image: url(images/sprite.png); background-position: 0 -220px; width: 19px; height: 28px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-graph-secondary { background-image: url(images/sprite.png); background-position: 0 -73px; width: 80px; height: 42px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-graph { background-image: url(images/sprite.png); background-position: 0 -178px; width: 38px; height: 38px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-location { background-image: url(images/sprite.png); background-position: -180px -40px; width: 34px; height: 43px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-lock { background-image: url(images/sprite.png); background-position: -23px -220px; width: 16px; height: 21px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-mail-secondary { background-image: url(images/sprite.png); background-position: -42px -178px; width: 38px; height: 38px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-mail { background-image: url(images/sprite.png); background-position: -139px -154px; width: 23px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-message { background-image: url(images/sprite.png); background-position: -180px 0; width: 41px; height: 36px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-notes { background-image: url(images/sprite.png); background-position: -125px 0; width: 51px; height: 62px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-olive-darkgrey { background-image: url(images/sprite.png); background-position: -65px -154px; width: 20px; height: 20px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-olive { background-image: url(images/sprite.png); background-position: -41px -154px; width: 20px; height: 20px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-peach { background-image: url(images/sprite.png); background-position: -114px -178px; width: 22px; height: 25px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-phone-secondary { background-image: url(images/sprite.png); background-position: -225px -44px; width: 36px; height: 36px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-phone-tertiary { background-image: url(images/sprite.png); background-position: -265px 0; width: 17px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-phone { background-image: url(images/sprite.png); background-position: -166px -178px; width: 19px; height: 19px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-plus { background-image: url(images/sprite.png); background-position: -265px -67px; width: 12px; height: 11px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-save { background-image: url(images/sprite.png); background-position: 0 0; width: 58px; height: 69px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-schedule { background-image: url(images/sprite.png); background-position: -225px -126px; width: 30px; height: 40px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-search { background-image: url(images/sprite.png); background-position: -89px -154px; width: 20px; height: 20px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-spider-secondary { background-image: url(images/sprite.png); background-position: -180px -129px; width: 38px; height: 38px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-spider-tertiary { background-image: url(images/sprite.png); background-position: -62px 0; width: 59px; height: 59px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-spider { background-image: url(images/sprite.png); background-position: -139px -119px; width: 29px; height: 29px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-uncheck { background-image: url(images/sprite.png); background-position: -265px -21px; width: 16px; height: 16px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-user-group-black { background-image: url(images/sprite.png); background-position: -225px 0; width: 36px; height: 40px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-user-group { background-image: url(images/sprite.png); background-position: -84px -73px; width: 36px; height: 40px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-user { background-image: url(images/sprite.png); background-position: -43px -220px; width: 19px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-users-black { background-image: url(images/sprite.png); background-position: -41px -119px; width: 51px; height: 31px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-users-small { background-image: url(images/sprite.png); background-position: -96px -119px; width: 39px; height: 29px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-users { background-image: url(images/sprite.png); background-position: -125px -66px; width: 51px; height: 31px; display: inline-block; vertical-align: middle; font-size: 0; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .ico-arrow-down-large { background-image: url(images/sprite.@2x.png); background-position: -255px -52px; background-size: 271px 240px; width: 15px; height: 9px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-arrow-down { background-image: url(images/sprite.@2x.png); background-position: -255px -63px; background-size: 271px 240px; width: 10px; height: 6px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-arrow-up-large { background-image: url(images/sprite.@2x.png); background-position: -255px -41px; background-size: 271px 240px; width: 15px; height: 9px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-board { background-image: url(images/sprite.@2x.png); background-position: -132.5px -115px; background-size: 271px 240px; width: 26px; height: 27px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-check { background-image: url(images/sprite.@2x.png); background-position: -121px -97px; background-size: 271px 240px; width: 20px; height: 15px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-close { background-image: url(images/sprite.@2x.png); background-position: -153px -148px; background-size: 271px 240px; width: 18px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-create { background-image: url(images/sprite.@2x.png); background-position: -39px -148px; background-size: 271px 240px; width: 22px; height: 22px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-crop { background-image: url(images/sprite.@2x.png); background-position: -217px -80px; background-size: 271px 240px; width: 33px; height: 38px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-cultivu { background-image: url(images/sprite.@2x.png); background-position: -129px -148px; background-size: 271px 240px; width: 22px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-drop-quaternary { background-image: url(images/sprite.@2x.png); background-position: -217px -162px; background-size: 271px 240px; width: 28px; height: 41px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-drop-secondary { background-image: url(images/sprite.@2x.png); background-position: -174px -83px; background-size: 271px 240px; width: 38px; height: 38px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-drop-tertiary { background-image: url(images/sprite.@2x.png); background-position: 0 -115px; background-size: 271px 240px; width: 37px; height: 55px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-drop { background-image: url(images/sprite.@2x.png); background-position: 0 -212px; background-size: 271px 240px; width: 19px; height: 28px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-graph-secondary { background-image: url(images/sprite.@2x.png); background-position: 0 -71px; background-size: 271px 240px; width: 80px; height: 42px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-graph { background-image: url(images/sprite.@2x.png); background-position: 0 -172px; background-size: 271px 240px; width: 38px; height: 38px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-location { background-image: url(images/sprite.@2x.png); background-position: -174px -38px; background-size: 271px 240px; width: 34px; height: 43px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-lock { background-image: url(images/sprite.@2x.png); background-position: -255px 0; background-size: 271px 240px; width: 16px; height: 21px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-mail-secondary { background-image: url(images/sprite.@2x.png); background-position: -40px -172px; background-size: 271px 240px; width: 38px; height: 38px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-mail { background-image: url(images/sprite.@2x.png); background-position: -135px -172px; background-size: 271px 240px; width: 23px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-message { background-image: url(images/sprite.@2x.png); background-position: -174px 0; background-size: 271px 240px; width: 41px; height: 36px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-notes { background-image: url(images/sprite.@2x.png); background-position: -121px 0; background-size: 271px 240px; width: 51px; height: 62px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-olive-darkgrey { background-image: url(images/sprite.@2x.png); background-position: -85px -148px; background-size: 271px 240px; width: 20px; height: 20px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-olive { background-image: url(images/sprite.@2x.png); background-position: -63px -148px; background-size: 271px 240px; width: 20px; height: 20px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-peach { background-image: url(images/sprite.@2x.png); background-position: -111px -172px; background-size: 271px 240px; width: 22px; height: 25px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-phone-secondary { background-image: url(images/sprite.@2x.png); background-position: -217px -42px; background-size: 271px 240px; width: 36px; height: 36px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-phone-tertiary { background-image: url(images/sprite.@2x.png); background-position: -181px -172px; background-size: 271px 240px; width: 17px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-phone { background-image: url(images/sprite.@2x.png); background-position: -21px -212px; background-size: 271px 240px; width: 19px; height: 19px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-save { background-image: url(images/sprite.@2x.png); background-position: 0 0; background-size: 271px 240px; width: 58px; height: 69px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-schedule { background-image: url(images/sprite.@2x.png); background-position: -217px -120px; background-size: 271px 240px; width: 30px; height: 40px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-search { background-image: url(images/sprite.@2x.png); background-position: -107px -148px; background-size: 271px 240px; width: 20px; height: 20px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-spider-secondary { background-image: url(images/sprite.@2x.png); background-position: -174px -123px; background-size: 271px 240px; width: 38px; height: 38px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-spider-tertiary { background-image: url(images/sprite.@2x.png); background-position: -60px 0; background-size: 271px 240px; width: 59px; height: 59px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-spider { background-image: url(images/sprite.@2x.png); background-position: -80px -172px; background-size: 271px 240px; width: 29px; height: 29px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-uncheck { background-image: url(images/sprite.@2x.png); background-position: -255px -23px; background-size: 271px 240px; width: 16px; height: 16px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-user-group-black { background-image: url(images/sprite.@2x.png); background-position: -217px 0; background-size: 271px 240px; width: 36px; height: 40px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-user-group { background-image: url(images/sprite.@2x.png); background-position: -82px -71px; background-size: 271px 240px; width: 36px; height: 40px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-user { background-image: url(images/sprite.@2x.png); background-position: -160px -172px; background-size: 271px 240px; width: 19px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-users-black { background-image: url(images/sprite.@2x.png); background-position: -39px -115px; background-size: 271px 240px; width: 51px; height: 31px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-users-small { background-image: url(images/sprite.@2x.png); background-position: -92px -115px; background-size: 271px 240px; width: 38.5px; height: 28.5px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-users { background-image: url(images/sprite.@2x.png); background-position: -121px -64px; background-size: 271px 240px; width: 51px; height: 31px; display: inline-block; vertical-align: middle; font-size: 0; } } /* ------------------------------------------------------------ *\ I. Generic \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Reset \* ------------------------------------------------------------ */ *, *:before, *:after { padding: 0; margin: 0; outline: 0; box-sizing: border-box; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, main { display: block; } html, body { height: 100%; } html { tap-highlight-color: rgba(0,0,0,0); } body { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; -webkit-text-size-adjust: none; -ms-text-size-adjust: none; text-size-adjust: none; } img, iframe, video, audio, object { max-width: 100%; } img { height: auto; display: inline-block; vertical-align: middle; } b, strong { font-weight: bold; } address { font-style: normal; } svg:not(:root) { overflow: hidden; } a, button, input[type="submit"], input[type="button"], input[type="reset"], input[type="file"], input[type="image"], label[for] { cursor: pointer; } a[href^="tel"], button[disabled], input[disabled], textarea[disabled], select[disabled] { cursor: default; } button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; } input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], input[type="color"], textarea, a[href^="tel"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { display: none; -webkit-appearance: none; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } textarea { overflow: auto; resize: none; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; } button, input, optgroup, select, textarea { font-family: inherit; font-size: inherit; color: inherit; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; } button, select { text-transform: none; } table { width: 100%; border-collapse: collapse; border-spacing: 0; } nav ul, nav ol { list-style: none outside none; } img { border: 0; } /* ------------------------------------------------------------ *\ Fonts \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Base \* ------------------------------------------------------------ */ body { min-width: 1440px; background: #f5f5f4; font-family: 'Open Sans', sans-serif; font-size: 14px; line-height: 1.3; color: #000; } a { color: inherit; text-decoration: none; } a:hover { text-decoration: underline; } a[href^="mailto"], a[href^="tel"] { text-decoration: none; cursor: default; } h1 { font-size: 30px; } h2 { font-size: 26px; } h3 { font-size: 22px; } h4 { font-size: 20px; } h5 { font-size: 18px; } h6 { font-size: 16px; } h1, h2, h3, h4, h5, h6 { margin-bottom: 0.65em; font-weight: normal; } p, ul, ol, dl, table, blockquote { margin-bottom: 1.3em; } h1[class], h2[class], h3[class], h4[class], h5[class], h6[class], h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child, p:last-child, ul:last-child, ol:last-child, dl:last-child, table:last-child, blockquote:last-child { margin-bottom: 0; } /* ------------------------------------------------------------ *\ Helpers \* ------------------------------------------------------------ */ /* Clear */ .form-add-secondary .form-section-outer:after, .form-recipients .form-row:after, .section .section-head:after, .popup-head:after, .container-head:after, .section-cols:after, .section-profile .section-head:after, .clear:after { content: ''; line-height: 0; display: table; clear: both; } /* Notext */ .notext { white-space: nowrap; text-indent: 100%; text-shadow: none; overflow: hidden; } .notext-old { font-size: 0; line-height: 0; text-indent: -4000px; } /* Hidden */ [hidden], .hidden { display: none; } /* Alignleft */ .alignleft { float: left; } /* Alignright */ .alignright { float: right; } /* Disabled */ [disabled], .disabled { cursor: default; } /* ------------------------------------------------------------ *\ II. Regions \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Wrapper \* ------------------------------------------------------------ */ .wrapper { position: relative; overflow: hidden; min-height: 100%; } /* ------------------------------------------------------------ *\ Container \* ------------------------------------------------------------ */ .container { padding: 0 32px 15px; margin-left: 303px; } .container-head { position: fixed; top: 0; left: 303px; right: 0; z-index: 10; padding: 12px 32px; margin-bottom: 30px; background: #f5f5f4; } .container-head-inner { float: left; padding: 14px 0 0; } .container-head-actions { float: right; } .container-head-actions .search { display: inline-block; width: 282px; margin-right: 5px; vertical-align: top; } .container-body { padding-top: 83px; } /* ------------------------------------------------------------ *\ Shell \* ------------------------------------------------------------ */ .shell { max-width: 1200px; margin: auto; } /* ------------------------------------------------------------ *\ Header \* ------------------------------------------------------------ */ .header {} /* ------------------------------------------------------------ *\ Main \* ------------------------------------------------------------ */ .main {} /* ------------------------------------------------------------ *\ Footer \* ------------------------------------------------------------ */ .footer {} /* ------------------------------------------------------------ *\ Content \* ------------------------------------------------------------ */ .content {} /* ------------------------------------------------------------ *\ Sidebar \* ------------------------------------------------------------ */ .sidebar {} /* ------------------------------------------------------------ *\ III. Themes \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ IV. Modules \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Accordion \* ------------------------------------------------------------ */ .accordion-head { cursor: pointer; } .accordion-body { display: none; } .accordion-expanded .accordion-body { display: block; } /* ------------------------------------------------------------ *\ Button \* ------------------------------------------------------------ */ .btn { display: inline-block; vertical-align: middle; -webkit-appearance: none; -moz-appearance: none; appearance: none; transition: opacity .4s, background .4s, color .4s; } .btn:hover { text-decoration: none; } .btn-grey, .btn-yellow { min-width: 201px; padding: 12px 10px 10px; border: none; background: #f5c800; color: #2c2b36; font-weight: bold; text-transform: uppercase; text-align: center; } .btn-yellow:hover { background: #f5d33d; } .btn-yellow ~ .btn-yellow { margin-left: 4px; } .btn-yellow .ico-plus { margin: 3px 6px 0 0; vertical-align: top; } .btn-grey { background: #b0b0b0; } .btn-grey:hover { background: #c0bebe; } .btn-yellow-small { min-width: 189px; padding: 20px 10px 21px; font-size: 18px; font-weight: 600; } .btn-yellow-small .ico-create { margin: 2px 6px 0 0; vertical-align: top; } .btn-yellow-xsmall { min-width: 137px; padding: 6px 10px 5px; } .btn-yellow-xsmall .ico-plus { margin-right: 2px; } .btn-yellow-large { min-width: 242px; } .btn-dropdown { font-size: 16px; color: #30343a; font-weight: bold; text-transform: uppercase; } .btn-dropdown .ico-arrow-down { margin: 6px 0 0 6px; vertical-align: top; } .btn-dropdown-small { font-size: 12px; color: #8f8f8f; font-weight: normal; font-style: italic; text-transform: none; } .btn-dropdown-small .ico-arrow-down { margin-left: 2px; opacity: .8; } .btn-close { width: 44px; height: 44px; line-height: 44px; text-align: center; } /* ------------------------------------------------------------ *\ Calendar Items \* ------------------------------------------------------------ */ .calendar-items { overflow: hidden; margin: 0 -7px; list-style: none outside none; } .calendar-item { float: left; width: 25%; padding: 0 7px; margin-bottom: 12px; } .calendar-item .calendar-inner { height: 131px; padding-top: 27px; background: #66bbc0; color: white; text-align: center; text-transform: uppercase; } .calendar-item .calendar-inner span { display: block; line-height: 1.1; } .calendar-item .calendar-inner strong { display: none; font-size: 50px; font-weight: normal; } .calendar-item.expanded .calendar-inner { background: white; color: black; } .calendar-item.expanded .calendar-inner strong { display: block; } .calendar-field input { display: block; width: 100%; padding: 0 5px; border: none; background: none; font-size: 50px; text-align: center; } /* ------------------------------------------------------------ *\ Form Elements \* ------------------------------------------------------------ */ input::-webkit-input-placeholder { color: inherit; opacity: 1; } input::-moz-placeholder { color: inherit; opacity: 1; } input:-ms-input-placeholder { color: inherit; opacity: 1; } input::placeholder { color: inherit; opacity: 1; } textarea::-webkit-input-placeholder { color: inherit; opacity: 1; } textarea::-moz-placeholder { color: inherit; opacity: 1; } textarea:-ms-input-placeholder { color: inherit; opacity: 1; } textarea::placeholder { color: inherit; opacity: 1; } input:-webkit-autofill { -webkit-text-fill-color: inherit !important; -webkit-box-shadow: 0 0 0 1000px #fff inset; } .radio input[type="radio"], .checkbox input[type="checkbox"] { display: none; } .radio input[type="radio"] + label, .checkbox input[type="checkbox"] + label { font-size: 14px; color: #505050; text-transform: uppercase; } .radio input[type="radio"] + label:before, .checkbox input[type="checkbox"] + label:before { display: inline-block; width: 21px; height: 19px; border-radius: 5px; border: 1px solid #d4d4d4; margin: -2px 20px 0 0; vertical-align: top; content: ''; } .radio input[type="radio"]:checked + label:before, .checkbox input[type="checkbox"]:checked + label:before { border-color: #6aab82; background: #6aab82 url(images/ico-check-white@2x.png) no-repeat center center; background-size: 13px 10px; } /* ------------------------------------------------------------ *\ Form \* ------------------------------------------------------------ */ .form .form-section { border-bottom: 1px solid #d4d4d4; } .form .form-section:last-child { border: none; } .form .form-section-head { position: relative; padding: 33px 108px 35px; } .form .form-section-head .form-controls > span { padding: 7px 0 0 14px; font-size: 18px; color: #8f8f8f; font-weight: 300; font-style: italic; } .form .form-section-head .form-controls > span.hide { display: none; } .form .form-section-head .form-controls > strong { padding-left: 14px; font-size: 20px; color: #505050; font-weight: 600; font-style: normal; text-transform: uppercase; } .form .form-section-head .form-controls .list-group-items { margin-left: 15px; } .form .form-section-icon { position: absolute; left: 0; top: 50%; width: 108px; text-align: center; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .form .form-section-icon-alt { top: 31px; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } .form .form-section-body { background: #fafafa; } .form .form-section-inner { position: absolute; top: 50%; right: 47px; margin-top: -9px; } .form .form-section-inner .ico-arrow-up-large, .form .accordion-expanded .form-section-inner .ico-arrow-down-large { display: none; } .form .accordion-expanded .form-section-inner .ico-arrow-up-large { display: inline-block; } .form .accordion-expanded .form-section-icon [class^="ico-"]:first-child, .form .form-section-icon [class^="ico-"]:nth-child(2) { display: none; } .form .accordion-expanded .form-section-icon [class^="ico-"]:last-child, .form .accordion-expanded .form-section-icon [class^="ico-"]:nth-child(2) { display: inline-block; } .form .textarea, .form .field { display: block; width: 100%; height: auto; padding: 0 0 0 14px; border: none; font-size: 20px; color: #505050; font-weight: 600; font-style: normal; } .form .textarea, .form .field-alt { font-size: 18px; font-weight: normal; } .form .textarea, .form .field { height: 27px; } .form .textarea { height: 167px; } .form input::-webkit-input-placeholder { font-size: 18px; color: #8f8f8f; font-weight: 300; font-style: italic; opacity: 1; } .form input::-moz-placeholder { font-size: 18px; color: #8f8f8f; font-weight: 300; font-style: italic; opacity: 1; } .form input:-ms-input-placeholder { font-size: 18px; color: #8f8f8f; font-weight: 300; font-style: italic; opacity: 1; } .form input::placeholder { font-size: 18px; color: #8f8f8f; font-weight: 300; font-style: italic; opacity: 1; } .form textarea::-webkit-input-placeholder { font-size: 18px; color: #8f8f8f; font-weight: 300; font-style: italic; opacity: 1; } .form textarea::-moz-placeholder { font-size: 18px; color: #8f8f8f; font-weight: 300; font-style: italic; opacity: 1; } .form textarea:-ms-input-placeholder { font-size: 18px; color: #8f8f8f; font-weight: 300; font-style: italic; opacity: 1; } .form textarea::placeholder { font-size: 18px; color: #8f8f8f; font-weight: 300; font-style: italic; opacity: 1; } .form .form-btn[disabled]:hover { background: #f5c800; } .form .form-btn[disabled] span, .form .form-btn[disabled] .ico-create { opacity: .4; } .form .form-asterisk { position: absolute; top: 50%; right: 27px; color: #8e8e93; text-transform: uppercase; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } /* ------------------------------------------------------------ *\ Form Add \* ------------------------------------------------------------ */ .form-add .field-search { position: relative; padding: 24px 0 15px 85px; border-top: 1px solid #d4d4d4; border-bottom: 1px solid #d4d4d4; } .form-add .field-search input { display: block; width: 100%; border: none; background: none; font-size: 14px; color: #8e8e93; font-style: italic; -webkit-appearance: none; } .form .field-search input::-webkit-input-placeholder { font-size: 14px; color: #8e8e9f; font-weight: normal; font-style: italic; } .form .field-search input::-moz-placeholder { font-size: 14px; color: #8e8e9f; font-weight: normal; font-style: italic; } .form .field-search input:-ms-input-placeholder { font-size: 14px; color: #8e8e9f; font-weight: normal; font-style: italic; } .form .field-search input::placeholder { font-size: 14px; color: #8e8e9f; font-weight: normal; font-style: italic; } .form-add .field-search .ico-search { position: absolute; top: 23px; left: 50px; } .form-add .list-checkboxes { overflow-y: auto; max-height: 266px; padding: 25px 0 0 47px; font-size: 0; margin-left: -5px; } .form-add .list-checkboxes li { display: inline-block; width: 33.33%; padding-left: 1%; margin-bottom: 22px; font-size: 14px; vertical-align: top; } .form-add .list-checkboxes li.hidden { display: none; } .form-add .list-checkboxes-secondary li { display: block; width: auto; padding-left: 0; margin-bottom: 27px; } .form-add .list-checkboxes-secondary li strong { display: block; margin-left: 40px; font-size: 20px; color: #505050; text-transform: uppercase; } .form-add .list-checkboxes-secondary input[type="radio"] + label, .form-add .list-checkboxes-secondary input[type="checkbox"] + label { font-size: 20px; } .form-add .list-checkboxes-secondary input[type="radio"] + label:before, .form-add .list-checkboxes-secondary input[type="checkbox"] + label:before { margin-top: 1px; } /* Form Add Secondary */ .form-add-secondary .form-section-outer { position: relative; padding-left: 124px; border-bottom: 1px solid #d4d4d4; } .form-add-secondary .form-section-outer .form-section { float: left; width: 250px; border-bottom: none; } .form-add-secondary .form-section-outer .form-section-head { padding: 38px 0 32px 35px; border-left: 1px solid #d4d4d4; } .form-add-secondary .form-section-outer .form-section-icon { top: 29px; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } .form-add-secondary .form-section-outer .form-section-body { width: 875px; border-top: 1px solid #d4d4d4; } .form-add-secondary .form-section-outer .form-section-primary .form-section-body { margin-left: -124px; } .form-add-secondary .form-section-outer .form-section-secondary .form-section-body { margin-left: -374px; } .form-add-secondary .form-section-outer .form-section-tertiary .form-section-body { margin-left: -624px; } .form-add-secondary .textarea { height: 49px; } /* ------------------------------------------------------------ *\ Form Login \* ------------------------------------------------------------ */ .form-login .form-head { margin-bottom: 40px; } .form-login .form-head span { font-size: 16px; color: white; text-transform: uppercase; } .form-login .form-row ~ .form-row { margin-top: 9px; } .form-login .field { position: relative; padding: 0 35px 0 0; background: rgba(255,255,255, .1); } .form-login .field input { display: block; width: 100%; padding: 18px 17px 16px; border: none; background: none; color: white; opacity: .6; -webkit-appearance: none; } .form-login .field-icon { position: absolute; top: 50%; right: 14px; width: 24px; text-align: center; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .form-login .form-actions { padding-top: 10px; } .form-login .form-btn { display: block; width: 100%; padding: 18px 10px 16px; border: none; background: #f4c700; font-weight: 600; text-transform: uppercase; -webkit-appearance: none; transition: background .4s; cursor: pointer; } .form-login .form-btn:hover { background: #f5d33d; } .form-login .form-foot { padding-top: 38px; } .form-login .form-foot a { font-size: 12px; color: white; font-weight: 600; text-transform: uppercase; opacity: .7; } .form-login .form-inner { padding: 3px 0 9px; text-align: right; } .form-login .form-inner a { font-size: 12px; color: #e5e5e5; font-weight: 300; font-style: italic; opacity: .3; } .form-login .error .form-notice { display: block; } .form-login .form-notice { position: absolute; top: 50%; left: 100%; display: none; margin-left: 10px; font-size: 12px; color: #ff0000; opacity: .9; text-align: left; white-space: nowrap; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } /* ------------------------------------------------------------ *\ Form Recipients \* ------------------------------------------------------------ */ .form-recipients { position: relative; padding: 10px 117px 9px 0; border: 1px solid #d4d4d4; } .form-recipients .form-col { position: relative; float: left; } .form-recipients .form-col ~ .form-col { padding-left: 1px; } .form-recipients .form-col ~ .form-col:before { position: absolute; top: -4px; left: 0; height: 27px; border-left: 1px solid #e9e9e9; content: ''; } .form-recipients .form-col-size1 { width: 22.8%; } .form-recipients .form-col-size2 { width: 15.8%; } .form-recipients .form-col-size3 { width: 20%; } .form-recipients .form-col-size4 { width: 41.4%; } .form-recipients .form-icon { float: left; margin-left: 14px; } .form-recipients .form-icon .ico-search { -webkit-transform: scale(0.9); -ms-transform: scale(0.9); transform: scale(0.9); } .form-recipients .form-col-size4 .form-controls { overflow: hidden; } .form-recipients .select select, .form-recipients .field { border: none; background: none; font-size: 14px; line-height: 1.3; color: #8e8e93; font-style: italic; -webkit-appearance: none; -moz-appearance: none; } .form-recipients .field { display: block; width: 100%; height: 21px; padding: 2px 12px 0; } .form-recipients .select:after { display: inline-block; width: 10px; height: 6px; margin-top: 8px; margin-left: -6px; background: url(images/select-arrow@2x.png) no-repeat 0 0; background-size: 100% 100%; vertical-align: top; content: ''; } .form-recipients .select select { height: 21px; padding-left: 11px; padding-top: 1px; cursor: pointer; } .form-recipients .form-actions { position: absolute; top: -1px; right: -1px; } .form-recipients .form-btn { min-width: 117px; height: 41px; padding: 12px 5px 10px; border: none; background: #d4d4d4; font-size: 14px; color: #919095; font-weight: bold; text-transform: uppercase; text-align: center; } /* ------------------------------------------------------------ *\ Form Report \* ------------------------------------------------------------ */ .form-report .form-btn { display: none; } .form-report.alt .form-btn { display: block; } .form-report .form-btn small { font-size: 100%; } .form-report .form-btn.disabled:hover { background: #f5c800; } .form-report .form-btn.disabled span, .form-report .form-btn.disabled .ico-create { opacity: .4; } /* ------------------------------------------------------------ *\ Groups \* ------------------------------------------------------------ */ .groups { list-style: none outside none; } .group ~ .group { margin-top: 35px; } .group-head { margin-bottom: 15px; } .group-head span { display: inline-block; padding: 7px 17px 6px; border-radius: 5px; background: #ababab; font-size: 14px; color: white; font-weight: 600; text-transform: uppercase; } /* ------------------------------------------------------------ *\ List \* ------------------------------------------------------------ */ [class^="list-"] { list-style: none outside none; } /* ------------------------------------------------------------ *\ List Profile Items \* ------------------------------------------------------------ */ .list-profile-items > li { position: relative; color: #2c2b36; font-weight: 300; letter-spacing: 0.025em; } .list-profile-items > li ~ li { margin-top: 28px; } .list-profile-items [class^="ico-"] { position: absolute; top: 0; left: -20px; } .list-profile-items .ico-olive { left: -49px; } .list-profile-items .ico-cultivu, .list-profile-items .ico-board { left: -39px; } .list-profile-items .list-grey-items { padding-top: 4px; } .list-profile-items .ico-users-small { left: -54px; } /* ------------------------------------------------------------ *\ List Grey Items \* ------------------------------------------------------------ */ .list-grey-items { font-size: 0; } .list-grey-items li { display: inline-block; padding: 3px 9px 3px; border-radius: 5px; background: #ababab; font-size: 10px; color: white; font-weight: bold; vertical-align: top; text-transform: uppercase; letter-spacing: 0; } .list-grey-items li ~ li { margin-left: 4px; } /* ------------------------------------------------------------ *\ List Plans \* ------------------------------------------------------------ */ .list-plans { font-size: 0; text-align: center; } .list-plans li { display: inline-block; vertical-align: top; text-align: left; } .list-plans li ~ li { padding-left: 36px; border-left: 1px solid #eeeeef; margin-left: 36px; } .list-plans span { display: block; margin: 10px 0 3px; font-size: 28px; line-height: 1; color: #373740; text-transform: uppercase; } .list-plans span.large { margin: 6px 0 1px; font-size: 34px; } .list-plans p { font-size: 12px; color: #8f8f8f; letter-spacing: -0.02em; text-transform: uppercase; } /* ------------------------------------------------------------ *\ List Group Items \* ------------------------------------------------------------ */ .list-group-items li { display: inline-block; padding: 0 8px; border: 1px solid #d4d4d4; border-radius: 5px; margin-top: 5px; font-size: 20px; line-height: 1.2; color: #505050; text-transform: uppercase; vertical-align: top; } .list-group-items li { margin-right: 5px; } .list-group-items-secondary li { border-color: #ababab; background: #ababab; color: #fff; } /* ------------------------------------------------------------ *\ List Subjects \* ------------------------------------------------------------ */ .list-subjects li ~ li { padding-top: 13px; border-top: 1px solid #eeeeef; margin-top: 17px; letter-spacing: 0.025em; } .list-subjects h5 { margin-bottom: 3px; font-size: 14px; font-weight: bold; text-transform: uppercase; } /* ------------------------------------------------------------ *\ Logo \* ------------------------------------------------------------ */ .logo-small, .logo { display: inline-block; width: 204px; height: 108px; background: url(images/logo@2x.png) no-repeat 0 0; background-size: 100% 100%; content: ''; } .logo-small { width: 68px; height: 27px; background-image: url(images/logo-small@2x.png); } /* ------------------------------------------------------------ *\ Messages \* ------------------------------------------------------------ */ .messages { list-style: none outside none; } .message { overflow: hidden; padding: 5px 10px 22px 31px; background: white; } .message ~ .message { border-top: 1px solid #dedede; } .message.current { background: #f9f9f8; } .message-icon { float: left; width: 3.7%; padding-top: 17px; } .message-name { float: left; width: 21%; padding: 25px 0 0 43px; } .message-name span { font-size: 16px; color: #4f4d59; } .message-content { float: left; max-width: 61%; padding: 15px 0 0 9px; } .message-content h6 { margin-bottom: 2px; color: #050506; font-weight: bold; text-transform: uppercase; } .message-content p { font-size: 15px; color: #2c2b36; } .message-inner { float: right; max-width: 14.3%; text-align: right; } .message-inner span { font-size: 12px; color: #807f88; font-style: italic; } .message-inner .list-grey-items { padding-top: 20px; } /* ------------------------------------------------------------ *\ Nav \* ------------------------------------------------------------ */ .nav ul { list-style: none outside none; } .nav li { position: relative; } .nav a { position: relative; display: block; padding: 16px 70px 17px 28px; font-size: 15px; color: #d1d1d1; text-transform: uppercase; } .nav a span { position: absolute; top: 50%; right: 30px; padding: 0 8px; border-radius: 10px; background: #f4c700; font-size: 15px; color: #2c2b36; font-weight: bold; font-style: italic; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .nav a:hover, .nav .current a { background: rgba(0,0,0, .1); color: white; opacity: .8; text-decoration: none; } .nav .current a { font-weight: bold; } .nav .current:after { position: absolute; top: 50%; right: 0; width: 0; height: 0; border-style: solid; border-width: 10px 10px 10px 0; border-color: transparent #f5f5f4 transparent transparent; margin-top: -9px; content: ''; } .nav .alt a { opacity: .2; } /* ------------------------------------------------------------ *\ Popup \* ------------------------------------------------------------ */ .popup { position: relative; max-width: 875px; margin: 0 auto; background: white; } .popup-head { min-height: 66px; padding-left: 68px; border-bottom: 1px solid #d5d5d5; background: #f5f5f4; } .popup-head-inner { float: left; padding-top: 23px; } .popup-head-inner > span { font-size: 18px; color: #30343a; font-weight: 600; text-transform: uppercase; } .popup-head-actions { float: right; } .popup .mfp-close { right: auto; left: 17px; top: 12px; background: url(images/ico-close@2x.png) no-repeat center center; background-size: 18px 18px; font-size: 0; opacity: 1; } .popup .sort-dropdown ul { left: auto; right: 20px; width: 205px; } .popup .sort-dropdown .btn-dropdown { font-size: 18px; } .popup .sort-dropdown .btn-dropdown .ico-arrow-down { margin: 10px 0 0 2px; } /* ------------------------------------------------------------ *\ Popup Plan \* ------------------------------------------------------------ */ .popup-plan { position: relative; } .popup-plan .btn-close { position: absolute; top: 11px; left: 17px; } .popup-plan .mfp-close { display: none; } .popup-plan .popup-overlay { position: absolute; top: 0; left: 0; display: none; width: 100%; height: 100%; background: rgba(255,255,255, .94); } .popup-plan .popup-overlay.visible { display: block; } .popup-plan .popup-overlay-inner { position: absolute; top: 50%; left: 50%; width: 287px; text-align: center; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .popup-plan .popup-overlay-icon { margin-bottom: 31px; } .popup-plan .popup-overlay-content { padding-bottom: 29px; } .popup-plan .popup-overlay-content p { font-size: 18px; line-height: 1.56; font-weight: 600; } .popup-plan .popup-overlay-actions .btn { display: block; padding: 15px 10px 12px; font-size: 16px; } .popup-plan .popup-overlay-actions .btn .ico-check { margin: 1px 9px 0 0; vertical-align: top; } .popup-plan .popup-overlay-actions .btn .ico-uncheck { margin: 1px 7px 0 0; vertical-align: top; } .popup-plan .popup-overlay-actions .btn-grey { margin-top: 17px; } /* ------------------------------------------------------------ *\ Profile \* ------------------------------------------------------------ */ .profile { overflow: hidden; } .profile-avatar { overflow: hidden; float: left; width: 96px; height: 96px; border-radius: 50%; margin-right: 15px; } .profile-content { float: left; padding: 75px 0 0; } .profile-content span { display: block; font-size: 24px; color: #050506; font-weight: bold; text-transform: uppercase; } /* ------------------------------------------------------------ *\ Protection Items \* ------------------------------------------------------------ */ .protection-item { position: relative; overflow: hidden; padding: 14px 0 18px 34px; border: 1px solid #dedede; background: #289fa6; color: white; } .protection-item-orange { background: #f3973d; } .protection-item-green { background: #85a338; } .protection-item span { display: block; margin-bottom: 1px; font-size: 50px; line-height: 1.1; } .protection-item p { font-size: 12px; text-transform: uppercase; } .protection-item [class^="ico-"] { position: absolute; top: 50%; right: -6px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .protection-item .ico-spider-tertiary { margin-right: -14px; } .protection-item .ico-graph-secondary { right: -21px; } /* ------------------------------------------------------------ *\ Reports \* ------------------------------------------------------------ */ .reports { overflow-y: auto; max-height: 509px; padding: 31px 0; list-style: none outside none; } .report { padding: 0 10px 0 47px; } .report ~ .report { padding-top: 26px; border-top: 1px solid #dedede; margin-top: 36px; } .report-head { margin-bottom: 12px; } .report-head span { display: inline-block; font-size: 16px; color: #050506; font-weight: 600; text-transform: none; } .report-head .checkbox input[type="checkbox"] + label:before { margin: 1px 9px 0 0; } /* ------------------------------------------------------------ *\ Search \* ------------------------------------------------------------ */ .search { position: relative; padding: 0 0 0 37px; border: 1px solid #d4d4d4; background: #f5f5f4; } .search-field { height: 39px; padding: 10px 8px; border: none; background: none; color: #8e8e93; font-style: italic; -webkit-appearance: none; } .search-btn { position: absolute; top: 0; left: 0; height: 39px; padding: 0 8px 0 13px; border: none; background: none; -webkit-appearance: none; } /* ------------------------------------------------------------ *\ Section \* ------------------------------------------------------------ */ .section-col { float: left; } .section-col-1of2 { width: 50%; } .section-col-1of3 { width: 33.33%; } .section .section-cols { margin: 0 -21px; } .section .section-col { padding: 0 21px; } .section .section-head { margin-bottom: 17px; } .section .section-title { display: inline-block; text-transform: uppercase; vertical-align: top; } .section .section-title strong { padding-left: 4px; } .section .section-head-actions { float: right; } .section .section-inner { border: 1px solid #dedede; background: white; } /* ------------------------------------------------------------ *\ Section Login \* ------------------------------------------------------------ */ .section-login { display: table; width: 100%; height: 1000px; height: 100vh; background: url(images/background.jpg) no-repeat 0 0; background-size: cover; text-align: center; } .section-login .section-inner { display: table-cell; vertical-align: middle; } .section-login .section-inner-content { display: block; max-width: 322px; margin: 0 auto; } .section-login .section-head { margin-bottom: 38px; } /* ------------------------------------------------------------ *\ Section Nav \* ------------------------------------------------------------ */ .section-nav { position: fixed; top: 0; left: 0; overflow-y: auto; width: 303px; height: 100%; background: url(images/nav-bg.jpg) no-repeat 0 0; background-size: cover; text-transform: uppercase; } .section-nav .section-head { padding: 18px 0 19px 32px; } .section-nav .section-inner { overflow: hidden; padding: 13px 0 17px 28px; background: rgba(255,255,255, .1); } .section-nav .section-inner-image { overflow: hidden; float: left; width: 56px; height: 56px; border: 2px solid #45454f; border-radius: 50%; margin-right: 14px; } .section-nav .section-inner-content { overflow: hidden; padding-top: 14px; color: white; } .section-nav .section-inner-content span { display: block; margin-bottom: 2px; font-size: 12px; } .section-nav .section-inner-content p { font-size: 10px; color: #bdbdbd; } .section-nav .section-body { padding-top: 5px; } /* ------------------------------------------------------------ *\ Section Map \* ------------------------------------------------------------ */ .section-map .section-body { margin: 0 -32px; } .section-map .map img { width: 100%; } .section-map .map-canvas { height: 262px; } /* ------------------------------------------------------------ *\ Section Profile \* ------------------------------------------------------------ */ .section-profile { position: relative; z-index: 3; margin-bottom: 69px; } .section-profile .section-head { margin-bottom: 50px; } .section-profile .section-head-actions { float: right; padding: 16px 0 0; } .section-profile .profile { float: left; margin-top: -62px; } .section-profile .section-col-size1 { width: 38%; padding-left: 42px; } .section-profile .section-col-size2 { width: 31.3%; padding-left: 49px; } .section-profile .section-col-size3 { width: 30.7%; padding-left: 39px; } /* ------------------------------------------------------------ *\ Section Message \* ------------------------------------------------------------ */ .section-message-secondary { margin-bottom: 62px; } /* ------------------------------------------------------------ *\ Section Plans \* ------------------------------------------------------------ */ .section-plans { margin-bottom: 66px; } .section-plans .section-cols { margin: 0 -31px; } .section-plans .section-col { padding: 0 31px; } .section-plans .section-inner-chart { padding: 28px 0 21px; text-align: center; } .section-plans .list-plans { padding: 35px 0 42px 20px; } .section-plans-secondary { padding-top: 20px; margin-bottom: 53px; } .section-plans-secondary .section-head { margin-bottom: 5px; } .section-plans-secondary .section-cols { margin: 0 -21px; } .section-plans-secondary .section-col { padding: 0 21px; } .section-plans-secondary .section-inner-chart { padding: 21px 0 18px; } /* ------------------------------------------------------------ *\ Section Protection \* ------------------------------------------------------------ */ .section-protection { margin-bottom: 53px; } /* ------------------------------------------------------------ *\ Section Users \* ------------------------------------------------------------ */ .section-users { padding: 83px 0 85px; } .section-users .section-head .btn-yellow { margin-top: -10px; } .section-users .section-body { padding: 18px 0 0; } /* ------------------------------------------------------------ *\ Section Farmer Plans \* ------------------------------------------------------------ */ .section-farmer-plans .section-head { margin-bottom: 7px; } .section-farmer-plans-secondary ~ .section-farmer-plans-secondary { margin-top: 46px; } .section-farmer-plans-secondary .section-head { margin-bottom: 16px; } /* ------------------------------------------------------------ *\ Section Subjects \* ------------------------------------------------------------ */ .section-subjects { padding: 6px 0 0; } /* ------------------------------------------------------------ *\ Section Recipients \* ------------------------------------------------------------ */ .section-recipients { margin-bottom: 31px; } /* ------------------------------------------------------------ *\ Section Calendar \* ------------------------------------------------------------ */ .section-calendar { overflow-y: auto; max-height: 325px; padding: 13px 17px 0; background: #289fa6; } /* ------------------------------------------------------------ *\ Slider \* ------------------------------------------------------------ */ .slider {} .slider .slides { list-style: none outside none; } /* ------------------------------------------------------------ *\ Sort Dropdown \* ------------------------------------------------------------ */ .sort-dropdown { position: relative; } .sort-dropdown > a span { font-weight: normal; } .sort-dropdown ul { position: absolute; top: 100%; left: -4px; z-index: 4; width: 120px; padding: 12px 10px 14px 18px; border: 1px solid #d4d4d4; border-radius: 2px; background: white; margin-top: 6px; list-style: none outside none; opacity: 0; visibility: hidden; transition: opacity .4s, visibility .4s; } .sort-dropdown ul li ~ li { margin-top: 13px; } .sort-dropdown ul a { display: block; color: #30343a; } .sort-dropdown ul span { display: block; color: #b9b9bd; font-style: italic; } .sort-dropdown .btn-dropdown [class^="ico-"] { transition: all .4s; } .sort-dropdown.expanded .btn-dropdown [class^="ico-"] { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .sort-dropdown.expanded ul { opacity: 1; visibility: visible; } /* Sort Dropdown Secondary */ /* ------------------------------------------------------------ *\ Subjects \* ------------------------------------------------------------ */ .subjects { margin: 0 -20px; font-size: 0; list-style: none outside none; } .subject { display: inline-block; width: 33.33%; padding: 0 20px; margin-bottom: 35px; font-size: 14px; vertical-align: top; } .subject-inner { min-height: 286px; border: 1px solid #dedede; background: white; } .subject-head { padding: 13px 20px 12px 26px; border-bottom: 1px solid #eeeeef; } .subject-checkbox label { display: block; overflow: hidden; } .subject-checkbox input[type="checkbox"] { display: none; } .subject-checkbox span { display: inline-block; margin-top: 3px; font-size: 14px; color: #e0b802; font-weight: bold; text-transform: uppercase; letter-spacing: 0.025em; } .subject-checkbox small { position: relative; float: right; width: 50px; height: 22px; border-radius: 10px; background: #f0f0ed; } .subject-checkbox small:before { position: absolute; right: 1px; top: 1px; width: 20px; height: 20px; border-radius: 50%; background: #f4c700; transition: all .4s; content: ''; } .subject-checkbox input[type="checkbox"]:checked + label small:before { position: absolute; right: 100%; margin-right: -22px; background: #d0d0d0; } .subject-checkbox input[type="checkbox"]:checked + label span { color: #ababab; } .subject-body { padding: 18px 28px 21px; } /* ------------------------------------------------------------ *\ Tabs \* ------------------------------------------------------------ */ .tab { display: none; } .tab.current { display: block; } /* ------------------------------------------------------------ *\ Tabs Primary \* ------------------------------------------------------------ */ .tabs-primary .tabs-nav { padding: 18px 10px 17px 45px; box-shadow: 1px 2px 3px rgba(47,47,47,0.2); } .tabs-primary .tabs-nav ul { list-style: none outside none; } .tabs-primary .tabs-nav li { display: inline-block; margin-right: 41px; vertical-align: top; } .tabs-primary .tabs-nav a { font-size: 16px; color: #b0b0b0; font-weight: 600; text-transform: uppercase; } .tabs-primary .tabs-nav a:hover { text-decoration: none; } .tabs-primary .tabs-nav .current a { color: #242424; } /* ------------------------------------------------------------ *\ Table \* ------------------------------------------------------------ */ .table { border: 1px solid #dedede; background: white; } .table table { border-collapse: collapse; table-layout: fixed; } .table tr ~ tr { border-top: 1px solid #dedede; } .table td { padding: 10px 0; color: #2c2b36; font-weight: 300; text-align: left; vertical-align: middle; } .table tr.current td { background: #f5f5f4; } /* ------------------------------------------------------------ *\ Table Farmers \* ------------------------------------------------------------ */ .table-farmers td { padding: 0; } .table-farmers td:first-child { width: 8.45%; text-align: center; } .table-farmers td:nth-child(2) { width: 22%; padding-left: 15px; } .table-farmers td:nth-child(3) { width: 17.3%; } .table-farmers td:nth-child(4) { width: 18.5%; } .table-farmers td:nth-child(5) { width: 15.9%; } .table-farmers td:last-child { padding-right: 28px; text-align: right; } .table-farmers .table-avatar { margin: 15px 0 18px; } .table-farmers td strong { text-transform: uppercase; } .table-farmers td small { display: inline-block; width: 130px; margin-bottom: 4px; font-size: 11px; color: #858585; font-style: italic; font-weight: 300; text-align: left; letter-spacing: 0.025em; } .table-farmers > ul ~ ul { border-top: 1px solid #dedede; } .table-farmers > ul > li { padding: 10px 0; color: #2c2b36; font-weight: 300; text-align: left; vertical-align: middle; } .table-farmers > ul { list-style: none outside none; display: table; width: 100%; table-layout: fixed; margin: 0; background-color: #fff; } .table-farmers > ul > li { display: table-cell; vertical-align: middle; padding: 0; } .table-farmers > ul > li:first-child { width: 8.45%; text-align: center; } .table-farmers > ul > li:nth-child(2) { width: 22%; padding-left: 15px; } .table-farmers > ul > li:nth-child(3) { width: 17.3%; } .table-farmers > ul > li:nth-child(4) { width: 18.5%; } .table-farmers > ul > li:nth-child(5) { width: 15.9%; } .table-farmers > ul > li:last-child { padding-right: 28px; text-align: right; } .table-farmers li strong { text-transform: uppercase; } .table-farmers li small { display: inline-block; width: 130px; margin-bottom: 4px; font-size: 11px; color: #858585; font-style: italic; font-weight: 300; text-align: left; letter-spacing: 0.025em; } .table-farmers > ul.ui-sortable-helper { border: 1px solid #dedede; } /* ------------------------------------------------------------ *\ Table Message \* ------------------------------------------------------------ */ .table-message td { padding: 21px 0 25px; } .table-message td:first-child { width: 22%; text-align: right; } .table-message td:last-child { padding-left: 20px; padding-right: 20px; } .table-message td strong { text-transform: uppercase; } /* ------------------------------------------------------------ *\ Table Plans \* ------------------------------------------------------------ */ .table-plans td { padding-top: 20px; padding-bottom: 20px; padding-right: 10px; letter-spacing: 0.025em; } .table-plans td span, .table-plans td strong { font-size: 16px; } .table-plans td strong { text-transform: uppercase; } .table-plans p { font-size: 12px; font-weight: normal; } .table-plans td:first-child { padding-right: 0; text-align: right; } .table-plans td:last-child p { color: #807f88; font-style: italic; } .table-plans td:last-child p small { display: block; font-size: 100%; } .table-plans td:first-child { width: 6.5%; } .table-plans td:nth-child(2) { width: 32.7%; padding-left: 46px; } .table-plans td:nth-child(3) { width: 17.5%; } .table-plans td:nth-child(3) [class^="ico-"] { margin-right: 18px; } .table-plans td:nth-child(4) { width: 23%; } .table-plans td:last-child { padding-right: 31px; text-align: right; } .table-plans .table-inner { overflow: hidden; } .table-plans .table-inner-graph { position: relative; float: left; width: 14px; height: 43px; margin-right: 14px; background: #e4e4e5; } .table-plans .table-inner-graph span { position: absolute; bottom: 0; left: 0; width: 100%; height: 66%; background: #289fa6; } .table-plans .table-inner-content { overflow: hidden; } .table-plans .table-inner-content p a { color: #289fa6; font-weight: 600; text-transform: uppercase; } .table-plans-secondary td:nth-child(2) { width: 35.7%; } .table-plans-secondary td:nth-child(3) { width: 18%; } /* ------------------------------------------------------------ *\ Users \* ------------------------------------------------------------ */ .users { font-size: 0; list-style: none outside none; } .user { position: relative; display: inline-block; width: 30%; margin-left: 4.5%; margin-bottom: 20px; font-size: 14px; } .user:before { position: absolute; left: -12%; top: 0; bottom: 0; border-left: 1px solid #dedede; content: ''; } .user:nth-child(3n+1) { margin-left: 0; } .user:nth-child(3n+1):before { display: none; } .user-image { overflow: hidden; float: left; width: 96px; height: 96px; border-radius: 50%; margin-right: 20px; } .user-content { overflow: hidden; padding: 6px 0 0; } .user-content h5 { margin-bottom: 7px; font-size: 15px; font-weight: bold; text-transform: uppercase; } .user-content p { margin-bottom: 12px; font-weight: 300; letter-spacing: 0.025em; } .user-content p .ico-phone-tertiary { margin-right: 10px; } /* ------------------------------------------------------------ *\ Widget \* ------------------------------------------------------------ */ .widgets { list-style: none outside none; }
-
Giraffic
<!--#include virtual="ssi/header.shtml" --> <div class="wrapper"> <nav class="nav"> <div class="nav-toggle visible-xs"> <i class="ico-burger"></i> </div> <header class="nav-head"> <a href="#" class="logo-white hidden-xs">Giraffic Insights</a> <a href="#" class="btn btn-secondary visible-xs-inline-block">Export Report</a> </header><!-- /.nav-head --> <div class="nav-body"> <ul> <li> <a href="#"> <i class="ico-overview"></i> Overview </a> </li> <li> <a href="#"> <i class="ico-devices"></i> Devices </a> </li> <li class="current"> <a href="#"> <i class="ico-video-sessions"></i> Video Sessions </a> </li> <li> <a href="#"> <i class="ico-ux"></i> User Experience </a> </li> </ul> <div class="nav-banner hidden-xs"> <div class="banner"> <p>Banner Ad <br />160x600</p> </div><!-- /.banner --> </div><!-- /.nav-banner --> <div class="dropup visible-xs"> <button class="dropdown-toggle" type="button" id="dropdownClients" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> All Clients <i class="ico-chevron-down"></i> </button> <ul class="dropdown-menu" aria-labelledby="dropdownClients"> <li> <a href="#">Client 1</a> </li> <li> <a href="#">Client 2</a> </li> <li> <a href="#">Client 3</a> </li> <li> <a href="#">Client 4</a> </li> </ul><!-- /.dropdown-menu --> </div><!-- /.dropup --> <div class="dropup visible-xs"> <button class="dropdown-toggle" type="button" id="dropdownLanguage" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> ENG <i class="ico-chevron-down"></i> </button> <ul class="dropdown-menu" aria-labelledby="dropdownLanguage"> <li> <a href="#">Language 1</a> </li> <li> <a href="#">Language 2</a> </li> <li> <a href="#">Language 3</a> </li> <li> <a href="#">Language 4</a> </li> </ul><!-- /.dropdown-menu --> </div><!-- /.dropup --> </div><!-- /.nav-body --> </nav><!-- /.nav --> <div class="main"> <header class="main-head clearfix"> <div class="nav-toggle hidden-xs"> <i class="ico-burger"></i> </div> <div class="dropdown hidden-xs"> <button class="dropdown-toggle" type="button" id="dropdownClients" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> All Clients <i class="ico-chevron-down"></i> </button> <ul class="dropdown-menu" aria-labelledby="dropdownClients"> <li> <a href="#">Client 1</a> </li> <li> <a href="#">Client 2</a> </li> <li> <a href="#">Client 3</a> </li> <li> <a href="#">Client 4</a> </li> </ul><!-- /.dropdown-menu --> </div><!-- /.dropdown --> <div class="main-head-inner"> <a href="#" class="btn btn-secondary hidden-xs">Export Report</a> <div class="dropdown hidden-xs"> <button class="dropdown-toggle" type="button" id="dropdownLanguage" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> ENG <i class="ico-chevron-down"></i> </button> <ul class="dropdown-menu dropdown-menu-right dropdown-menu-lang" aria-labelledby="dropdownLanguage"> <li> <a href="#">Language 1</a> </li> <li> <a href="#">Language 2</a> </li> <li> <a href="#">Language 3</a> </li> <li> <a href="#">Language 4</a> </li> </ul><!-- /.dropdown-menu --> </div><!-- /.dropdown --> <div class="dropdown"> <button class="dropdown-toggle" type="button" id="dropdownAccount" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <img src="css/images/temp/avatar.jpg" alt="" width="32" height="32" /> <span class="visible-md-inline visible-lg-inline">Abraham Lincoln</span> <i class="ico-chevron-down"></i> </button> <ul class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownAccount"> <li> <a href="#">Account Details</a> </li> <li class="dropdown-menu-item-faded"> <a href="#">Log out</a> </li> </ul><!-- /.dropdown-menu --> </div><!-- /.dropdown --> <div class="dropdown"> <button class="dropdown-toggle has-notifications" type="button" id="dropdownNotification" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <i class="ico-bell"></i> <strong class="counter">3</strong> </button> <ul class="dropdown-menu dropdown-menu-right dropdown-menu-notifications" aria-labelledby="dropdownNotification"> <li> <a href="#">Notification number one</a> </li> <li> <a href="#">Notification number two</a> </li> <li> <a href="#">Notification number three</a> </li> </ul><!-- /.dropdown-menu --> </div><!-- /.dropdown --> </div><!-- /.main-head-inner --> </header><!-- /.main-head --> <div class="main-body"> <div class="container-fluid"> <div class="row"> <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12"> <section class="section section-secondary"> <header class="section-head clearfix"> <h4>Video Sessions</h4> <div class="dropdown"> <button class="dropdown-toggle" type="button" id="dropdownVideoSessions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Global <i class="ico-chevron-down"></i> </button> <ul class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownVideoSessions"> <li> <a href="#">Country 1</a> </li> <li> <a href="#">Country 2</a> </li> <li> <a href="#">Country 3</a> </li> <li> <a href="#">Country 4</a> </li> </ul><!-- /.dropdown-menu --> </div><!-- /.dropdown --> <nav class="nav-tabs"> <ul> <li> <a href="#videoSessionsMonthly">Monthly</a> </li> <li class="current"> <a href="#videoSessionsWeekly">Weekly</a> </li> <li> <a href="#videoSessionsDaily">Daily</a> </li> </ul> </nav><!-- /.nav-tabs --> </header><!-- /.section-head clearfix --> <div class="section-body clearfix"> <div class="tabs"> <div class="tab" id="videoSessionsMonthly"> <div class="section-content equalcol"> <div class="chart"> <div id="chartVideoSessionsMonthly"></div><!-- /#chartVideoSessionsMonthly --> </div><!-- /.chart --> <div class="section-average"> <p>Average Sessions <strong>24 Millions (Weekly)</strong></p> </div><!-- /.section-average --> </div><!-- /.section-content --> <div class="section-aside equalcol"> <div class="widget-data"> <ul> <li> <p>Average Sessions</p> <h3>24 Millions</h3> <p>(Monthly)</p> </li> <li> <p>Total Video Sessions</p> <h3 class="widget-highlight">947</h3> <p>In the Last 48 Hours</p> </li> </ul> <p> <a href="#">See More</a> </p> </div><!-- /.widget-data --> </div><!-- /.section-aside --> </div><!-- /.tab --> <div class="tab current" id="videoSessionsWeekly"> <div class="section-content equalcol"> <div class="chart"> <div id="chartVideoSessionsWeekly"></div><!-- /#chartVideoSessionsWeekly --> </div><!-- /.chart --> <div class="section-average"> <p>Average Sessions <strong>24 Millions (Weekly)</strong></p> </div><!-- /.section-average --> </div><!-- /.section-content --> <div class="section-aside equalcol"> <div class="widget-data"> <ul> <li> <p>Average Sessions</p> <h3>24 Millions</h3> <p>(Weekly)</p> </li> <li> <p>Total Video Sessions</p> <h3 class="widget-highlight">947</h3> <p>In the Last 48 Hours</p> </li> </ul> <p> <a href="#">See More</a> </p> </div><!-- /.widget-data --> </div><!-- /.section-aside --> </div><!-- /.tab --> <div class="tab" id="videoSessionsDaily"> <div class="section-content equalcol"> <div class="chart"> <div id="chartVideoSessionsDaily"></div><!-- /#chartVideoSessionsDaily --> </div><!-- /.chart --> <div class="section-average"> <p>Average Sessions <strong>24 Millions (Weekly)</strong></p> </div><!-- /.section-average --> </div><!-- /.section-content --> <div class="section-aside equalcol"> <div class="widget-data"> <ul> <li> <p>Average Sessions</p> <h3>24 Millions</h3> <p>(Daily)</p> </li> <li> <p>Total Video Sessions</p> <h3 class="widget-highlight">947</h3> <p>In the Last 48 Hours</p> </li> </ul> <p> <a href="#">See More</a> </p> </div><!-- /.widget-data --> </div><!-- /.section-aside --> </div><!-- /.tab --> </div><!-- /.tabs --> </div><!-- /.section-body --> </section><!-- /.section --> </div><!-- /.col-xs-12 col-sm-12 col-md-12 col-lg-12 --> <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6"> <section class="section equalize"> <header class="section-head clearfix"> <h4>Video Types</h4> <div class="dropdown"> <button class="dropdown-toggle" type="button" id="dropdownVideoTypes" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Global <i class="ico-chevron-down"></i> </button> <ul class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownVideoTypes"> <li> <a href="#">Country 1</a> </li> <li> <a href="#">Country 2</a> </li> <li> <a href="#">Country 3</a> </li> <li> <a href="#">Country 4</a> </li> </ul><!-- /.dropdown-menu --> </div><!-- /.dropdown --> <h5 class="section-subtitle">Last 30 Days</h5> </header><!-- /.section-head clearfix --> <div class="section-body section-body-secondary"> <div class="chart"> <div id="videoTypesChart"></div><!-- /#videoTypesChart --> </div><!-- /.chart --> </div><!-- /.section-body --> <footer class="section-foot clearfix"> <div class="section-average"> <p>Accelerated Supported rate <strong>98%</strong></p> </div><!-- /.section-average --> <div class="section-actions"> <p> <a href="#">See More</a> </p> </div><!-- /.section-actions --> </footer><!-- /.section-foot --> </section><!-- /.section --> </div><!-- /.col-xs-12 col-sm-12 col-md-6 col-lg-6 --> <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6"> <section class="section equalize"> <header class="section-head clearfix"> <h4>Session Times</h4> <div class="dropdown"> <button class="dropdown-toggle" type="button" id="dropdownSessionTimes" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Canada <i class="ico-chevron-down"></i> </button> <ul class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownSessionTimes"> <li> <a href="#">Global</a> </li> <li> <a href="#">Country 1</a> </li> <li> <a href="#">Country 2</a> </li> <li> <a href="#">Country 3</a> </li> </ul><!-- /.dropdown-menu --> </div><!-- /.dropdown --> <nav class="nav-tabs"> <ul> <li class="current"> <a href="#sessionTimesHourly">Hourly</a> </li> <li> <a href="#sessionTimesDaily">Daily</a> </li> </ul> </nav><!-- /.nav-tabs --> </header><!-- /.section-head clearfix --> <div class="section-body section-body-secondary"> <div class="tabs"> <div class="tab current" id="sessionTimesHourly"> <div class="chart"> <div id="timesHourlyChart"></div><!-- /#timesHourlyChart --> </div><!-- /.chart --> </div><!-- /.tab --> <div class="tab" id="sessionTimesDaily"> <div class="chart"> <div id="timesDailyChart"></div><!-- /#timesHourlyChart --> </div><!-- /.chart --> </div><!-- /.tab --> </div><!-- /.tabs --> </div><!-- /.section-body --> <footer class="section-foot clearfix"> <div class="section-actions"> <p> <a href="#">See More</a> </p> </div><!-- /.section-actions --> </footer><!-- /.section-foot --> </section><!-- /.section --> </div><!-- /.col-xs-12 col-sm-12 col-md-6 col-lg-6 --> </div><!-- /.row --> </div><!-- /.container-fluid --> <footer class="footer"> <p> <strong>GI Giraffic Insight ©</strong> <span>copyright 2015</span> <br class="visible-xs" /> <small>|</small> <a href="#">Giraffic.com</a> <small>|</small> <a href="#">Support</a> <small>|</small> <a href="#">Print</a> <small>|</small> <a href="#">Export</a> </p> </footer><!-- /.footer --> </div><!-- /.main-body --> </div><!-- /.main --> </div><!-- /.wrapper --> <!--#include virtual="ssi/footer.shtml" -->
/* Table of Contents update on Thu Aug 27 2015 13:47:35 GMT+0300 (FLE Daylight Time) I. Generic -------------------------------------- 01. Reset ------------------------------------ 02. Base ------------------------------------- Mobile ----------------------------------- 03. Transitions ------------------------------ II. Regions -------------------------------------- 01. Wrapper ---------------------------------- 02. Wrapper Landing -------------------------- Tablet Landscape ------------------------- Mobile ----------------------------------- 03. Container -------------------------------- 04. Main ------------------------------------- Tablet Landscape ------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 05. Footer ----------------------------------- Mobile ----------------------------------- III. Modules ------------------------------------- 01. Button ----------------------------------- Button Primary --------------------------- Button Secondary ------------------------- 02. Chart ------------------------------------ 03. Form Elements ---------------------------- 04. Form Landing ----------------------------- Tablet Landscape ------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 05. Icons ------------------------------------ 06. Logo ------------------------------------- 07. Nav -------------------------------------- Tablet Landscape ------------------------- Mobile ----------------------------------- 08. Nav Tabs --------------------------------- Tablet Landscape ------------------------- 09. Section ---------------------------------- Tablet Landscape ------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 10. Tabs ------------------------------------- 11. Table ------------------------------------ Tablet Landscape ------------------------- Mobile ----------------------------------- 12. Widget Data ------------------------------ Tablet Landscape ------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- */ /* ------------------------------------------------------------ *\ I. Generic \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Reset \* ------------------------------------------------------------ */ *, *:before, *:after { padding: 0; margin: 0; outline: 0; box-sizing: border-box; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, main { display: block; } html, body { height: 100%; } html { tap-highlight-color: rgba(0,0,0,0); } body { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; -webkit-text-size-adjust: none; -ms-text-size-adjust: none; text-size-adjust: none; } img, iframe, video, audio, object { max-width: 100%; } img { height: auto; display: inline-block; vertical-align: middle; } b, strong { font-weight: bold; } address { font-style: normal; } svg:not(:root) { overflow: hidden; } a, button, input[type="submit"], input[type="button"], input[type="reset"], input[type="file"], input[type="image"], label[for] { cursor: pointer; } a[href^="tel"], button[disabled], input[disabled], textarea[disabled], select[disabled] { cursor: default; } button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; } input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], input[type="color"], textarea, a[href^="tel"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { display: none; -webkit-appearance: none; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } textarea { overflow: auto; resize: none; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; } button, input, optgroup, select, textarea { font-family: inherit; font-size: inherit; color: inherit; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; } button, select { text-transform: none; } table { width: 100%; border-collapse: collapse; border-spacing: 0; } nav ul, nav ol { list-style: none outside none; padding: 0; margin: 0; } /* ------------------------------------------------------------ *\ Base \* ------------------------------------------------------------ */ body { font-family: 'Source Sans Pro', sans-serif; font-size: 16px; line-height: 1.25; color: #484848; font-weight: 400; font-style: normal; text-decoration: none; text-transform: none; letter-spacing: 0; word-spacing: 0; background: #e8f1e8; } a { color: inherit; text-decoration: underline; } a:hover { text-decoration: none; } a[href^="tel"] { text-decoration: none; } h1 { font-size: 60px; } h2 { font-size: 40px; } h3 { font-size: 30.08px; } h4 { font-size: 20px; } h5 { font-size: 16px; } h6 { font-size: 14.08px; } h1, h2, h3, h4, h5, h6 { margin-bottom: 0.625em; } p, ul, ol, dl, table, blockquote { margin-bottom: 1.25em; } h1[class], h2[class], h3[class], h4[class], h5[class], h6[class], h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child, p:last-child, ul:last-child, ol:last-child, dl:last-child, table:last-child, blockquote:last-child { margin-bottom: 0; } /* Mobile */ @media (max-width: 767px) { h1 { font-size: 30.08px; } h2 { font-size: 24px; } h3 { font-size: 20px; } h4 { font-size: 16px; } h5 { font-size: 14.08px; } h6 { font-size: 12px; } } /* ------------------------------------------------------------ *\ Transitions \* ------------------------------------------------------------ */ a, .btn, .field, .select, .textarea, .checkbox label:before { transition: color .4s ease, border-color .4s ease, background-color .4s ease; } .nav-banner, .table .sortable i, .checkbox [class^="ico-"] { transition: opacity .4s ease, visibility .4s ease; } .main { transition: margin-left .4s ease-in-out; } .nav, .nav .logo-white { transition: width .4s ease-in-out; } .nav-banner .banner { transition: height .4s ease-in-out; } .nav-body [class^="ico-"] { transition: left .1s ease-in-out; } .main-section, .main-subsection, .main-body .container-fluid { transition: opacity .4s ease, visibility .4s ease, -webkit-transform .4s ease; transition: opacity .4s ease, visibility .4s ease, transform .4s ease; } /* ------------------------------------------------------------ *\ II. Regions \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Wrapper \* ------------------------------------------------------------ */ .wrapper { position: relative; min-height: 100%; } /* ------------------------------------------------------------ *\ Wrapper Landing \* ------------------------------------------------------------ */ .wrapper-landing .logo { display: block; position: absolute; top: 46px; left: 46px; } /* Tablet Landscape */ @media (max-width: 1199px) { .wrapper-landing .logo { top: 30px; left: 30px; } } /* Mobile */ @media (max-width: 767px) { .wrapper-landing .logo { top: 20px; left: 50%; margin-left: -62px; } } /* ------------------------------------------------------------ *\ Container \* ------------------------------------------------------------ */ .container-fullsize { background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; } /* ------------------------------------------------------------ *\ Main \* ------------------------------------------------------------ */ .main { position: relative; z-index: 2; margin-left: 240px; } .main .dropdown-toggle { font-size: 16px; line-height: 2; color: #5ed469; font-weight: 300; position: relative; padding: 0; border: 0; margin: 0; background: transparent; -webkit-appearance: none; -moz-appearance: none; appearance: none; } .main .dropdown-toggle img { width: auto; height: 32px; float: left; margin-right: 12px; } .main .dropdown-toggle .counter { font-size: 10.08px; line-height: 1; color: #fff; font-weight: 700; text-align: center; min-width: 15px; height: 15px; display: none; position: absolute; top: 0; right: -2px; border: 2px solid #5ed469; background-color: #40a94a; border-radius: 50%; } .main .dropdown-toggle .ico-chevron-down { float: right; margin: 14px 0 0 12px; } .main .dropdown-menu { width: 232px; padding: 0 10px; border: 0; margin: 15px -20px 0 0; background-color: #222424; box-shadow: none; } .main .dropdown-menu:before { content: ''; width: 0; height: 0; display: block; position: absolute; bottom: 100%; left: 15px; border: 11px solid transparent; border-bottom-color: #222424; } .main .dropdown-menu-lang { width: 150px; } .main .dropdown-menu-right:before { left: auto; right: 15px; } .main .dropdown-menu-notifications:before { right: 21px; } .main .dropdown-menu li + li { border-top: 1px solid #484848; } .main .dropdown-menu a { font-size: 16px; line-height: 1.25; color: #fff; font-weight: 300; text-decoration: none; display: block; padding: 10px 0; } .main .dropdown-menu .dropdown-menu-item-faded a { color: #606161; } .main .dropdown-menu a:hover, .main .dropdown-menu a:active, .main .dropdown-menu a:focus { color: #5ed469; text-decoration: none; background-color: transparent; } .main .dropdown-toggle.has-notifications .ico-bell { background-position: -156px -42px; } .main .dropdown-toggle.has-notifications .counter { display: block; } .main-head { padding: 24px 40px; position: relative; z-index: 3; background-color: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.2); } .main-head .dropdown { float: left; } .main-head-inner { float: right; } .main-head-inner .dropdown { margin-left: 40px; } .main-head-inner .btn { float: left; margin-right: 10px; } .main-body { position: relative; z-index: 2; padding: 20px 10px 0; overflow: hidden; } .main-body .row { margin: 0 -10px; } .main-body [class^="col"] { padding: 0 10px; } .main-body .container-fluid { padding: 0 10px; -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); } .main-body .dropdown-menu { padding: 0 9px; border: 1px solid #efefef; background-color: #fff; } .main-body .dropdown-menu a { color: #606161; } .main-body .dropdown-menu:before { z-index: 1; border-bottom-color: #efefef; } .main-body .dropdown-menu:after { content: ''; width: 0; height: 0; display: block; position: absolute; bottom: 100%; left: 15px; z-index: 2; border: 11px solid transparent; margin-bottom: -1px; border-bottom-color: #fff; } .main-body .dropdown-menu-right:after { left: auto; right: 15px; } .main-section, .main-subsection, .main-section-visible .main-body > .container-fluid, .main-subsection-visible .main-section > .container-fluid { position: absolute; top: 20px; left: 10px; right: 10px; z-index: -1; background-color: #e8f1e8; } .main-section, .main-subsection { opacity: 0; visibility: hidden; -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); } .main-subsection, .main-subsection-visible .main-section > .container-fluid { top: 0; left: 0; right: 0; } .main-section-visible .main-body > .container-fluid, .main-subsection-visible .main-section > .container-fluid { -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); } .main-section.current, .main-subsection.current { width: auto; min-height: 1140px; opacity: 1; visibility: visible; position: relative; top: auto; left: auto; right: auto; z-index: 5; -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); } .main-section-head { padding-bottom: 20px; } .main-section-head h4 { line-height: 1.5; color: #5ed469; font-weight: 400; float: left; padding: 4px 0 6px; margin: 0; } .main-section-head .btn-back { width: 40px; height: 40px; float: left; position: relative; margin-right: 21px; background-color: #fff; border-radius: 7px; } .main-section-head .btn-back [class^="ico-"] { display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } .main-section-body .table { min-height: 1060px; padding: 10px 40px; background-color: #fff; border-radius: 10px; } .main-subsection-head { padding-bottom: 20px; } .main-subsection-head h4 { line-height: 1.5; color: #5ed469; font-weight: 400; float: left; padding: 4px 0 6px; margin: 0; } .main-subsection-head .btn-back { width: 40px; height: 40px; float: left; position: relative; margin-right: 21px; background-color: #fff; border-radius: 7px; } .main-subsection-head .btn-back [class^="ico-"] { display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } .main-subsection-body .table { min-height: 1060px; padding: 10px 40px; background-color: #fff; border-radius: 10px; } /* Tablet Landscape */ @media (max-width: 1199px) { .main { margin-left: 70px; } } /* Tablet Portrait */ @media (max-width: 991px) { .main-head { padding: 22px 20px; } .main-head-inner .dropdown { margin-left: 25px; } } /* Mobile */ @media (max-width: 767px) { .main { margin-left: 0; } .main-body { padding: 20px 0 0; } .main-section-body .table, .main-subsection-body .table { padding: 10px; } .main-section-body .table-body, .main-subsection-body .table-body { margin: 0; } .main-section-body .table-head, .main-subsection-body .table-head { padding: 0; } .main-section-body .table-head h4, .main-subsection-body .table-head h4, .main-section-body .table-head-actions, .main-subsection-body .table-head-actions { float: none; } .main-section-body .table-head-actions .dropdown:first-child, .main-subsection-body .table-head-actions .dropdown:first-child { margin: 0; } .main-section-head h4, .main-subsection-head h4 { padding: 6px 0 8px; } } /* ------------------------------------------------------------ *\ Footer \* ------------------------------------------------------------ */ .footer { font-size: 14.08px; line-height: 1.43; color: #aaacaf; text-align: center; padding: 8px 0; margin: 0 -10px; background-color: #d5e2e3; } .footer strong { color: #787b80; font-weight: 400; } .footer span { margin-right: 5px; } .footer small { font-size: 100%; position: relative; top: -1px; } .footer a { text-decoration: none; margin: 0 5px; } .footer a:hover { text-decoration: underline; } /* Mobile */ @media (max-width: 767px) { .footer br + small { display: none; } } /* ------------------------------------------------------------ *\ III. Modules \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Button \* ------------------------------------------------------------ */ [class^="btn"] { display: inline-block; vertical-align: middle; -webkit-appearance: none; -moz-appearance: none; appearance: none; } [class^="btn"]:hover, [class^="btn"]:active, [class^="btn"]:focus { color: inherit; text-decoration: none; background-color: inherit; } /* Button Primary */ .btn-primary { font-size: 18.08px; line-height: 1.34; color: #fff; font-weight: 400; min-width: 160px; padding: 12px; border: 0; background-color: #5ed469; border-radius: 6px; } .btn-primary:hover, .btn-primary:active, .btn-primary:focus { color: #fff; border: 0; background-color: #40a94a; } /* Button Secondary */ .btn-secondary { font-size: 16px; line-height: 1.25; color: #5ed469; text-decoration: none; padding: 4px 30px 6px; border: 1px solid; background-color: transparent; border-radius: 5px; } .btn-secondary:hover, .btn-secondary:active, .btn-secondary:focus { color: #fff; border-color: #5ed469; background-color: #5ed469; } /* ------------------------------------------------------------ *\ Chart \* ------------------------------------------------------------ */ .chart img { width: 100%; height: auto; display: block; } .chart .highcharts-container { max-width: 100%; margin: auto; } /* ------------------------------------------------------------ *\ Form Elements \* ------------------------------------------------------------ */ input::-webkit-input-placeholder { color: #bfc5cc; opacity: 1; } input::-moz-placeholder { color: #bfc5cc; opacity: 1; } input:-ms-input-placeholder { color: #bfc5cc; opacity: 1; } input::placeholder { color: #bfc5cc; opacity: 1; } textarea::-webkit-input-placeholder { color: #bfc5cc; opacity: 1; } textarea::-moz-placeholder { color: #bfc5cc; opacity: 1; } textarea:-ms-input-placeholder { color: #bfc5cc; opacity: 1; } textarea::placeholder { color: #bfc5cc; opacity: 1; } input:-webkit-autofill { -webkit-text-fill-color: inherit !important; -webkit-box-shadow: 0 0 0 1000px #fff inset; } .field, .textarea, .select { font-size: 16px; line-height: 1.25; color: #484848; font-weight: 400; width: 100%; height: 48px; display: block; padding: 12px 13px; border: 1px solid #fff; background-color: #fff; border-radius: 6px; } .checkbox { position: relative; margin: 0; overflow: hidden; } .checkbox input[type="checkbox"] { left: -50px; margin: 0; } .checkbox label { font-size: 14px; line-height: 16px; font-weight: 400; min-height: 0; display: block; position: relative; padding-left: 24px; margin: 0; } .checkbox label:before { content: ''; width: 16px; height: 16px; display: block; position: absolute; top: 0; left: 0; z-index: 1; background-color: #efefef; border-radius: 6px; } .checkbox label [class^="ico-"] { opacity: 0; visibility: hidden; position: absolute; top: 5px; left: 4px; z-index: 2; } .checkbox input:checked + label:before { background-color: #5ed469; } .checkbox input:checked + label [class^="ico-"] { opacity: 1; visibility: visible; } /* ------------------------------------------------------------ *\ Form Landing \* ------------------------------------------------------------ */ .form-landing { padding: 182px 0 0; } .form-landing h1 { line-height: 1; font-weight: 700; text-transform: uppercase; margin: 0 0 6px; } .form-landing h3 { line-height: 40px; color: #fff; text-transform: uppercase; font-weight: 300; text-align: center; margin: 0 0 21px; } .form-landing p { font-size: 30.08px; line-height: 1.33; font-weight: 300; } .form-landing .btn { width: 100%; display: block; } .form-landing .field { padding-left: 48px; } .form-landing [class^="ico"] { display: block; position: absolute; top: 50%; } .form-landing .ico-envelope { left: 15px; margin-top: -7px; } .form-landing .ico-lock { left: 18px; margin-top: -9px; } .form-landing .checkbox { float: left; } .form-landing .checkbox label { color: #aab2ba; } .form-landing .form-head { color: #fff; text-align: center; padding-bottom: 73px; } .form-landing .form-group { position: relative; margin-bottom: 24px; } .form-landing .form-controls { position: relative; } .form-landing .form-actions { font-size: 14.08px; text-align: center; } .form-landing .form-actions a { color: #5ed469; text-decoration: none; display: inline-block; vertical-align: middle; margin: 15px 0 -35px; } .form-landing .form-actions a:hover { text-decoration: underline; } .form-landing .form-body { max-width: 460px; min-height: 329px; padding: 21px 30px 30px; margin: auto; background-color: rgba(0,0,0,.4); border-radius: 6px; } .form-landing .form-body p { font-size: 20px; color: #fff; text-align: center; margin: -10px 0 30px; } .form-landing .form-group-secondary { margin: -12px 0 21px; } .form-landing .form-group-secondary a { font-size: 14px; line-height: 16px; color: #5ed469; text-decoration: none; float: right; } .form-landing .form-group-secondary a:hover { text-decoration: underline; } .form-landing .form-message { font-size: 14.08px; color: #fb4949; text-align: center; display: none; position: absolute; bottom: 100%; left: 0; right: 0; padding-bottom: 9px; } .form-landing .form-success { font-size: 14.08px; color: #5ed469; text-align: center; font-weight: 300; min-height: 140px; margin-top: -25px; } .form-landing .has-error .form-message { display: block; } /* Tablet Landscape */ @media (max-width: 1199px) { .form-landing { padding-top: 80px; } .form-landing .form-head { padding-bottom: 20px; } } /* Tablet Portrait */ @media (max-width: 991px) { .form-landing { padding-top: 150px; } .form-landing p { font-size: 20px; } } /* Mobile */ @media (max-width: 767px) { .form-landing { padding: 95px 10px 15px; } .form-landing h1 { margin-bottom: 15px; } .form-landing h3 { margin-bottom: 10px; } .form-landing p { font-size: 16px; } .form-landing br { display: none; } .form-landing .form-body { min-height: 0; padding: 10px; } .form-landing .form-body p { font-size: 16px; margin-bottom: 15px; } .form-landing .form-actions a { margin: 10px 0 0; } .form-landing .form-group { margin-bottom: 10px; } .form-landing .form-group-secondary { margin: 0 0 10px; } .form-landing .form-message { position: static; top: auto; left: auto; right: auto; padding-bottom: 18px; } .form-landing .form-success { min-height: 100px; margin: 0; } } /* ------------------------------------------------------------ *\ Icons \* ------------------------------------------------------------ */ [class^="ico-"] { white-space: nowrap; text-indent: 100%; text-shadow: none; display: inline-block; vertical-align: middle; overflow: hidden; background-image: url(images/sprite@2x.png); background-repeat: no-repeat; background-size: 186px 149px; } .ico-back { background-position: -156px -20px; width: 25.5px; height: 20px; } .ico-bell-active { background-position: -156px -42px; width: 21px; height: 24px; } .ico-bell { background-position: -156px -68px; width: 21px; height: 24px; } .ico-burger { background-position: -130px -111px; width: 15px; height: 12px; } .ico-chart-dot { background-position: -126px 0; width: 28px; height: 28px; } .ico-check { background-position: -25px -137px; width: 8px; height: 6px; } .ico-chevron-down { background-position: -14px -137px; width: 9px; height: 6px; } .ico-devices-active { background-position: -34px -111px; width: 32px; height: 24px; } .ico-devices { background-position: 0 -111px; width: 32px; height: 24px; } .ico-envelope { background-position: -156px -94px; width: 20.5px; height: 14px; } .ico-lock { background-position: -156px -110px; width: 14px; height: 18px; } .ico-minus-active { background-position: -172px -124px; width: 12px; height: 2px; } .ico-minus { background-position: -156px -130px; width: 12px; height: 2px; } .ico-overview-active { background-position: -156px 0; width: 30px; height: 18px; } .ico-overview { background-position: -98px -111px; width: 30px; height: 18px; } .ico-plus-active { background-position: -172px -110px; width: 12px; height: 12px; } .ico-plus { background-position: 0 -137px; width: 12px; height: 12px; } .ico-sort { background-position: -179px -42px; width: 5px; height: 8px; } .ico-ux-active { background-position: -126px -58px; width: 26px; height: 26px; } .ico-ux { background-position: -126px -30px; width: 26px; height: 26px; } .ico-video-sessions-active { background-position: -126px -86px; width: 28px; height: 20px; } .ico-video-sessions { background-position: -68px -111px; width: 28px; height: 20px; } /* ------------------------------------------------------------ *\ Logo \* ------------------------------------------------------------ */ .logo { background-image: url(images/sprite@2x.png); background-position: 0 0; background-size: 186px 149px; width: 124px; height: 53.5px; display: inline-block; vertical-align: middle; font-size: 0; } .logo-white { background-image: url(images/sprite@2x.png); background-position: 0 -55.5px; background-size: 186px 149px; width: 124px; height: 53.5px; display: inline-block; vertical-align: middle; font-size: 0; } /* ------------------------------------------------------------ *\ Nav \* ------------------------------------------------------------ */ .nav { width: 240px; position: absolute; top: 0; left: 0; bottom: 0; z-index: 1; padding-top: 80px; overflow: hidden; background-color: #2b2d2d; } .nav .logo-white { display: block; margin: auto; } .nav-head { height: 80px; position: absolute; top: 0; left: 0; right: 0; padding-top: 15px; background-color: #5ed469; } .nav-body { width: 240px; height: 100%; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; } .nav-body > ul { padding-bottom: 80px; } .nav-body > ul li { border-bottom: 1px solid #484848; } .nav-body > ul li a { line-height: 2; color: #fff; font-weight: 300; text-decoration: none; display: block; position: relative; padding: 24px 0 23px 74px; } .nav-body > ul li:hover > a, .nav-body > ul li.current > a { text-decoration: none; background-color: #222424; } .nav-body > ul li.current > a { color: #5ed469; cursor: default; } .nav-body [class^="ico-"] { display: block; position: absolute; top: 50%; } .nav-body .ico-devices { left: 21px; margin-top: -12px; } .nav-body .ico-overview { left: 22px; margin-top: -9px; } .nav-body .ico-video-sessions { left: 23px; margin-top: -10px; } .nav-body .ico-ux { left: 24px; margin-top: -13px; } .nav-body .current .ico-devices { background-position: -34px -111px; } .nav-body .current .ico-overview { background-position: -156px 0; } .nav-body .current .ico-video-sessions { background-position: -126px -86px; } .nav-body .current .ico-ux { background-position: -126px -58px; } .nav-banner { width: 160px; opacity: 1; visibility: visible; padding-bottom: 20px; margin: auto; overflow: hidden; } .nav-banner .banner { height: 600px; position: relative; background-color: #484848; } .nav-banner .banner p { font-size: 16px; line-height: 1.25; color: #787777; text-align: center; position: absolute; top: 50%; left: 0; right: 0; margin-top: -20px; } .nav-visible .nav { width: 70px; } .nav-visible .nav > ul li a { color: transparent; } .nav-visible .nav .logo-white { width: 38px; } .nav-visible .nav-banner { opacity: 0; visibility: hidden; } .nav-visible .nav-banner .banner { height: 0px; } .nav-visible .ico-overview { left: 20px; } .nav-visible .ico-devices { left: 19px; } .nav-visible .ico-video-sessions { left: 20px; } .nav-visible .ico-ux { left: 21px; } .nav-visible .main { margin-left: 70px; } .nav-toggle { width: 32px; height: 32px; display: block; position: absolute; top: 50%; left: -16px; margin-top: -16px; background-color: #40a94a; border-radius: 50%; cursor: pointer; } .nav-toggle [class^="ico-"] { display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } .nav .dropup { text-align: left; border-bottom: 1px solid #484848; } .nav .dropdown-toggle { font-size: 16px; line-height: 19px; color: #fff; text-align: left; width: 100%; height: 79px; display: block; padding: 30px 22px; border: 0; background: none; } .nav .dropdown-toggle .ico-chevron-down { display: inline-block; vertical-align: middle; position: relative; top: auto; margin-left: 10px; background-image: url(images/ico-chevron-down-alt.png); background-position: 0 0; background-size: 100% 100%; -webkit-background-size: 100% 100%; } .nav .dropdown-menu { float: none; right: 0; padding: 0; margin: 0; } .nav .dropdown-menu li + li { border-top: 1px solid #484848; } .nav .dropdown-menu a { color: #484848; text-decoration: none; padding: 10px 20px; } .nav .dropdown-menu a:hover { color: #fff; background-color: #222424; } /* Tablet Landscape */ @media (max-width: 1199px) { .nav { width: 70px; } .nav li a { color: transparent; } .nav .logo-white { width: 38px; } .nav-banner { opacity: 0; visibility: hidden; } .nav-banner .banner { height: 0px; } .nav .ico-overview { left: 20px; } .nav .ico-devices { left: 19px; } .nav .ico-video-sessions { left: 20px; } .nav .ico-ux { left: 21px; } .nav-visible .nav { width: 240px; } .nav-visible .nav .logo-white { width: 124px; } .nav-visible .nav-body > ul li a { color: #fff; } .nav-visible .nav-body > ul li:hover > a, .nav-visible .nav-body > ul li.current > a { color: #5ed469; } .nav-visible .nav-banner { opacity: 1; visibility: visible; } .nav-visible .nav-banner .banner { height: 600px; } .nav-visible .ico-overview { left: 22px; } .nav-visible .ico-devices { left: 21px; } .nav-visible .ico-video-sessions { left: 23px; } .nav-visible .ico-ux { left: 24px; } .nav-visible .main { margin-left: 240px; } } /* Mobile */ @media (max-width: 767px) { .nav { width: 65%; z-index: 90; overflow: visible; -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); transition: -webkit-transform .4s ease; transition: transform .4s ease; } .nav-head { text-align: center; padding: 24px 0; background-color: #2b2d2d; } .nav-body { width: 100%; padding-bottom: 79px; } .nav-body > ul { padding-bottom: 79px; border-top: 1px solid #484848; border-bottom: 1px solid #484848; } .nav-toggle { width: 70px; height: 80px; top: 0; left: 100%; margin: 0; border-radius: 0; background-color: #5ed469; -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); transition: -webkit-transform .4s ease; transition: transform .4s ease; } .nav-visible, .nav-visible body, .nav-visible .wrapper { overflow: hidden; } .nav-visible .wrapper { height: 100%; } .nav-visible .nav { -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); } .nav-visible .main { margin-left: 0; } } /* ------------------------------------------------------------ *\ Nav Tabs \* ------------------------------------------------------------ */ .nav-tabs ul { width: 100%; display: table; table-layout: fixed; } .nav-tabs li { width: 1%; display: table-cell; vertical-align: middle; } .nav-tabs a { font-size: 16px; line-height: 1.38; color: #e3e2e2; text-align: center; text-decoration: none; display: block; border-bottom: 2px solid; } .nav-tabs a:hover, .nav-tabs .current > a { color: #5ed469; text-decoration: none; } /* Tablet Landscape */ @media (max-width: 1199px) { .nav-tabs a { font-size: 14.08px; line-height: 1.57; } } /* ------------------------------------------------------------ *\ Section \* ------------------------------------------------------------ */ .section { padding: 0 20px; margin-bottom: 20px; background-color: #fff; border-radius: 7px; } .section .chart { position: relative; z-index: 1; } .section-head { position: relative; padding: 13px 0 14px; border-bottom: 1px solid #efefef; } .section-head h4 { line-height: 24px; color: #5ed469; font-weight: 400; float: left; padding-top: 4px; margin: 0; } .section-head .dropdown { float: right; } .section-head .nav-tabs { width: 240px; position: absolute; top: 16px; left: 50%; border: 0; margin-left: -120px; } .section-body { position: relative; } .section-body-secondary { margin: 0 -20px; } .section-content { width: 80%; float: left; position: relative; padding-right: 20px; } .section-content .section-average { position: absolute; bottom: 40px; left: 20px; z-index: 3; } .section-aside { width: 20%; float: right; } .section-foot { padding: 20px 0; } .section-controls { width: 32px; position: absolute; top: 40px; right: 21px; z-index: 2; border: 1px solid #e3e2e2; border-radius: 4px; } .section-controls a { height: 29px; display: block; position: relative; } .section-controls a + a { border-top: 1px solid #e3e2e2; } .section-controls [class^="ico-"] { display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } .section-options { width: 315px; position: absolute; bottom: 12px; left: 0; z-index: 2; } .section-options p { line-height: 1.25; margin: 0; } .section-options ul { font-size: 0; line-height: 0; text-align: justify; } .section-options ul:after { content: ''; width: 100%; display: inline-block; vertical-align: middle; } .section-options li { font-size: 16px; line-height: 1.25; display: inline-block; vertical-align: middle; } .section-options .checkbox { margin-bottom: 35px; } .section-options .checkbox label { font-size: 16px; line-height: 1; color: #484848; } .section-options-bar { height: 7px; margin: 2px 0 8px; border-radius: 3px; background: rgb(94,212,105); background: linear-gradient(to right, rgba(94,212,105,1) 0%,rgba(190,230,194,1) 100%); } .section-average { float: left; } .section-average p { line-height: 1.5; font-weight: 300; padding: 4px 4px 4px 11px; margin: 0; background-color: #efefef; border-radius: 5px; } .section-average p strong { color: #5ed469; font-weight: 400; text-align: center; float: right; min-width: 117px; padding: 0 15px; margin-left: 7px; background-color: #fff; border-radius: 4px; } .section-average-secondary { margin-top: -20px; } .section-average-secondary h5 { line-height: 1; margin: 0 0 5px; } .section-average-secondary p { padding: 4px; overflow: hidden; } .section-average-secondary p strong { float: left; padding: 0 12px; margin: 0 7px; } .section-average-secondary p strong + strong { color: #2ab6cf; } .section-actions { float: right; padding: 4px 0; } .section-actions p { line-height: 1.5; margin: 0; } .section-actions a { color: #5ed469; } .section.equalize { position: relative; padding-bottom: 72px; } .section.equalize .section-foot { position: absolute; bottom: 0; left: 20px; right: 20px; } .section-subtitle { width: 200px; text-align: center; position: absolute; top: 11px; left: 50%; margin-left: -100px; } .section-secondary .section-content .section-average { position: relative; top: -20px; left: auto; } /* Tablet Landscape */ @media ( max-width: 1480px ) { .section-head .nav-tabs { width: 200px; margin-left: -100px; } .section-average-secondary p strong { font-size: 14px; line-height: 24px; padding: 0 2px; margin: 0 2px; } } @media ( max-width: 1340px ) { .section-head h4 { font-size: 16px; } .section-head .nav-tabs { width: 170px; top: 18px; margin-left: -85px; } .section-secondary .section-content .section-average { bottom: 12px; } } @media (max-width: 1199px) { .section-content { width: 70%; } .section-aside { width: 30%; } .section-average p { font-size: 14.08px; } .section-average-secondary p strong { font-size: 12px; padding: 0 5px; margin: 0 2px; } } /* Tablet Portrait */ @media (max-width: 991px) { .section-average-secondary p strong { font-size: 16px; } } /* Mobile */ @media (max-width: 767px) { .section { padding: 0 10px; } .section-head { padding: 3px 0 4px; border: 0; } .section-head .nav-tabs { width: 100%; float: left; position: static; top: auto; left: auto; margin: 0; } .section-body-secondary { margin: 0; } .section-content, .section-aside, .section-average, .section-actions { width: auto; float: none; } .section-content { padding: 0; } .section-foot { padding: 10px 0; } .section-actions { font-size: 14.08px; text-align: center; padding: 10px 0 0; } .section-average p strong { min-width: 0; } .section-average-secondary { margin: 0; } .section-average-secondary p strong { display: block; float: none; } .section-average-secondary p strong + strong { margin-top: 4px; } .section-options, .section-content .section-average { width: auto; position: static; bottom: auto; left: auto; z-index: auto; padding-top: 10px; } .section-options .checkbox { margin-bottom: 10px; } .section-controls { top: 10px; right: 0; } .section-subtitle { width: 100%; float: left; position: static; top: auto; left: auto; margin: 0; } .section.equalize { padding-bottom: 0; } .section.equalize .section-foot { position: static; bottom: auto; left: auto; right: auto; } .section-secondary .section-content .section-average { top: auto; margin-top: 15px; } } /* ------------------------------------------------------------ *\ Tabs \* ------------------------------------------------------------ */ .tabs { position: relative; } .tab { opacity: 0; position: absolute; top: 0; left: 0; right: 0; z-index: -1; } .tab.current { opacity: 1; position: relative; top: auto; left: auto; right: auto; z-index: 1; } /* ------------------------------------------------------------ *\ Table \* ------------------------------------------------------------ */ .table { line-height: 1.25; padding-top: 27px; margin: 0; } .table th { color: #5ed469; font-weight: 300; width: 37%; } .table td { padding-top: 10px; padding-bottom: 10px; } .table th, .table td { vertical-align: top; } .table th:first-child, .table td:first-child { padding-left: 20px; } .table th:last-child, .table td:last-child { padding-right: 20px; } .table tr:nth-child(odd) td { background-color: #f9f9f9; } .table td a { text-decoration: none; } .table td a:hover { color: #5ed469; text-decoration: underline; } .table .sortable { border-bottom: 2px solid #e3e2e2; cursor: pointer; } .table .sortable i { opacity: 0; visibility: hidden; margin: -1px 0 0 10px; } .table .sortable.sorted i { opacity: 1; visibility: visible; } .table-head { padding: 14px 0; border-bottom: 1px solid #efefef; margin-bottom: 25px; } .table-head h4 { color: #5ed469; line-height: 1.25; font-weight: 400; float: left; padding: 3px 0 5px; margin: 0; } .table-head-actions { float: right; } .table-head-actions .dropdown { float: left; margin-left: 40px; } .table-body { margin: 0 -20px; } @media ( max-width: 1300px ) { .table th { font-size: 14.08px; width: 38%; } } /* Tablet Landscape */ @media (max-width: 1199px) { .table { font-size: 14.08px; line-height: 1.43; } .table .sortable i { margin-left: 2px; } } /* Mobile */ @media (max-width: 767px) { .table { padding-top: 0; } .table th:first-child, .table td:first-child { padding-left: 0; } .table th:last-child, .table td:last-child { padding-right: 0; } .table th { font-size: 16px; } .table th:first-child { width: 70px; } .table th:last-child { width: 60px; } } @media ( max-width: 480px ) { .table th { font-size: 13.6px; width: 38%; } .table .sortable { height: 50px; } } /* ------------------------------------------------------------ *\ Widget Data \* ------------------------------------------------------------ */ .widget-data { line-height: 1.88; text-align: center; padding-top: 14px; } .widget-data ul { list-style: none outside none; padding: 0 10px; margin: 0 0 15px; background-color: #efefef; border-radius: 6px; } .widget-data li { padding: 12px 0; } .widget-data li + li { border-top: 1px solid; } .widget-data p { margin: 0; } .widget-data p a { color: #5ed469; } .widget-data h3 { line-height: 1; color: #5ed469; font-weight: 300; padding: 0 0 2px; margin: 1px 0; border-radius: 5px; } .widget-data .widget-highlight { background-color: #fff; } /* Tablet Landscape */ @media (max-width: 1199px) { .widget-data { padding: 14px 0; } } /* Tablet Portrait */ @media (max-width: 991px) { .widget-data p { font-size: 14.08px; line-height: 1.3; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .widget-data h3 { font-size: 24px; } } /* Mobile */ @media (max-width: 767px) { .widget-data { padding: 15px 0 10px; } .widget-data ul { margin-bottom: 10px; } }
-
נופש ישיר
<!DOCTYPE html> <!--[if lt IE 7]> <html lang="iw" dir="rtl" class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--> <!--[if IE 7]> <html lang="iw" dir="rtl" class="no-js lt-ie9 lt-ie8"> <![endif]--> <!--[if IE 8]> <html lang="iw" dir="rtl" class="no-js lt-ie9"> <![endif]--> <!--[if gt IE 8]><!--> <html lang="iw" dir="rtl" class="no-js"> <!--<![endif]--> <head> <title>Nofy</title> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <meta name="description" content="Nofy" /> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" /> <link rel="shortcut icon" type="image/x-icon" href="css/images/nofy.ico" /> <link rel="stylesheet" href="css/jquery-ui-1.10.4.custom.css" /> <link rel="stylesheet" href="css/fonts.css" /> <link rel="stylesheet" href="css/style.css" /> <!--[if gte IE 9]> <style type="text/css"> .gradient { filter: none; } </style> <![endif]--> <script src="https://apis.google.com/js/platform.js" async defer> {lang: 'iw'} </script> </head> <body> <div id="fb-root"></div> <script> (function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.0"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk')); </script> <nav class="nav-mobile"> <h2>תפריט</h2> <ul> <li> <a href="#"> <i class="ico-nav-home"></i> עמוד הבית </a> </li> <li> <a href="#"> <i class="ico-nav-plane"></i> טיסות </a> </li> <li> <a href="#"> <i class="ico-nav-suitcase"></i> חבילות נופש </a> </li> <li> <a href="#"> <i class="ico-nav-bus"></i> טיולים מאורגנים <i class="ico-angle-left"></i> </a> <ul> <li> <a href="#">כדורגל</a> </li> <li> <a href="#">כדורסל</a> </li> <li> <a href="#">טניס</a> </li> <li> <a href="#">מרתון / איירונמן</a> </li> <li> <a href="#">ספורט מוטורי</a> </li> </ul> </li> <li> <a href="#"> <i class="ico-nav-building"></i> מלונות בחו”ל </a> </li> <li> <a href="#"> <i class="ico-nav-ball"></i> ספורט <i class="ico-angle-left"></i> </a> <ul> <li> <a href="#">כדורגל</a> </li> <li> <a href="#">כדורסל</a> </li> <li> <a href="#">טניס</a> </li> <li> <a href="#">מרתון / איירונמן</a> </li> <li> <a href="#">ספורט מוטורי</a> </li> </ul> </li> <li> <a href="#"> <i class="ico-nav-ski"></i> סקי <i class="ico-angle-left"></i> </a> <ul> <li> <a href="#">כדורגל</a> </li> <li> <a href="#">כדורסל</a> </li> <li> <a href="#">טניס</a> </li> <li> <a href="#">מרתון / איירונמן</a> </li> <li> <a href="#">ספורט מוטורי</a> </li> </ul> </li> <li> <a href="#"> <i class="ico-nav-palmtree"></i> נופש בארץ <i class="ico-angle-left"></i> </a> <ul> <li> <a href="#">כדורגל</a> </li> <li> <a href="#">כדורסל</a> </li> <li> <a href="#">טניס</a> </li> <li> <a href="#">מרתון / איירונמן</a> </li> <li> <a href="#">ספורט מוטורי</a> </li> </ul> </li> </ul> </nav><!-- /.nav-mobile --> <div class="nav-overlay"></div><!-- /.nav-overlay --> <div class="wrapper"> <header class="header gradient"> <div class="shell"> <a href="#" class="logo">Nofy</a> <aside class="header-aside"> <a href="tel:037777544" class="header-phone"> <small>להזמנות חייגו:</small> 03-7777544 </a> <div class="header-socials"> <div class="g-plusone" data-href="http://www.nofy.co.il/"></div> <div class="fb-like" data-href="https://www.facebook.com/nofyfanpage" data-layout="button_count" data-action="like" data-show-faces="false" data-share="false"></div> </div><!-- /.header-socials --> </aside><!-- /.header-aside --> <a href="#" class="nav-toggle"> <span></span> <span></span> <span></span> </a> </div><!-- /.shell --> </header><!-- /.header --> <nav class="nav"> <div class="shell"> <ul class="nav-list"> <li class="home current"> <a href="#">Home</a> </li> <li> <a href="#">משפחות</a> <div class="nav-dropdown"> <div class="shell"> <section class="dropdown-content"> <h1> חופשות משפחתיות <em>מקרבים את כולם יחד</em> </h1> <div class="dropdown-nav"> <ul> <li> <a href="#">כפרי נופש באירופה</a> </li> <li> <a href="#">חופשות סקי למשפחות</a> </li> <li> <a href="#">חופשות הכל כלול למשפחות</a> </li> <li> <a href="#">טיולים מאורגנים למשפחות</a> </li> </ul> </div><!-- /.dropdown-nav --> <div class="dropdown-nav-secondary"> <a href="#">קייץ 2015 למשפחות</a> <ul> <li> <a href="#">כפרי נופש</a> </li> <li> <a href="#">נופש ביוון</a> </li> <li> <a href="#">חופשות הכל כלול</a> </li> <li> <a href="#">חופשות באירופה</a> </li> <li> <a href="#">טיולים מאורגנים</a> </li> </ul> <ul> <li> <a href="#">אילת הכל כלול</a> </li> <li> <a href="#">חופשות בצפון</a> </li> <li> <a href="#">צימרים לכל המשפחה</a> </li> <li> <a href="#">חופשות במרכז</a> </li> <li> <a href="#">סיורים וימי כייף</a> </li> </ul> </div><!-- /.dropdown-nav-secondary --> </section><!-- /.dropdown-content --> <figure class="dropdown-image"> <a href="#"> <img src="css/images/temp/banner1.jpg" alt="" /> <span class="overlay"> <h1> החורף נוסעים עם ילדים <em>חופשות סקי לכל המשפחה</em> </h1> </span> </a> </figure><!-- /.dropdown-image --> </div><!-- /.shell --> </div><!-- /.nav-dropdown --> </li> <li> <a href="#">טיסות</a> </li> <li> <a href="#">חבילות נופש</a> </li> <li> <a href="#">טיולים מאורגנים</a> </li> <li> <a href="#">מלונות בחו''ל</a> </li> <li> <a href="#">ספורט</a> </li> <li> <a href="#">סקי</a> </li> <li> <a href="#">טיסות לאילת</a> </li> <li> <a href="#">נופש בארץ</a> </li> </ul> </div><!-- /.shell --> </nav><!-- /.nav --> <nav class="breadcrumbs gradient"> <div class="shell"> <ul> <li> <a href="#">עמוד הבית</a> </li> <li> <a href="#">פרורי לחם</a> </li> <li>פרורי לחם</li> </ul> </div><!-- /.shell --> </nav><!-- /.breadcrumbs --> <section class="section-search"> <img src="css/images/temp/search-image.jpg" alt="" width="768" height="600" class="fullsize" /> <div class="shell"> <div class="search-form"> <form action="?" method="get"> <ul class="list-search-categories"> <li class="current"> <a href="#searchFlights" class="tab-toggle"> <i class="ico-airplane"></i> טיסות </a> </li> <li> <a href="#searchHotels" class="tab-toggle"> <i class="ico-building"></i> מלונות </a> </li> <li> <a href="#searchPackages" class="tab-toggle"> <i class="ico-suitcase"></i> חבילות </a> </li> <li> <a href="#searchCars" class="tab-toggle"> <i class="ico-car"></i> רכב </a> </li> <li> <a href="#searchTours" class="tab-toggle"> <i class="ico-bus"></i> מאורגנים </a> </li> </ul><!-- /.list-search-categories --> <div class="search-tabs"> <div class="search-tab visible" id="searchFlights"> <ul class="list-categories-group"> <li class="current"> <a href="#searchFlightsAbroad" class="tab-toggle">טיסות לחו”ל</a> </li> <li> <a href="#searchFlightsDomestic" class="tab-toggle">טיסות לאילת</a> </li> </ul><!-- /.list-categories-group --> <div class="search-tab-inner visible" id="searchFlightsAbroad"> <ul class="list-radios"> <li> <div class="radio"> <input type="radio" name="flights-abroad-group" id="field-flights-abroad-group1" value="הלוך ושוב" checked="checked" class="form-enable" data-undisable="#field-flights-abroad430" data-remove-class="one-way" /> <label for="field-flights-abroad-group1">הלוך ושוב</label> </div><!-- /.radio --> </li> <li> <div class="radio"> <input type="radio" name="flights-abroad-group" id="field-flights-abroad-group2" value="כיוון אחד" class="form-disable" data-disable="#field-flights-abroad430" data-add-class="one-way" /> <label for="field-flights-abroad-group2">כיוון אחד</label> </div><!-- /.radio --> </li> </ul><!-- /.list-radios --> <div class="form-row form-row-tablet"> <label for="field-flights-abroad1" class="form-label">יציאה מ</label> <div class="form-controls has-button has-icon"> <i class="ico-marker"></i> <input type="text" class="field city" value="" name="field-flights-abroad1" id="field-flights-abroad1" placeholder="תל אביב - בן גוריון (TLV)" /> <a href="ajax/popular-destinations-rtl.html" class="btn btn-search"> <i class="ico-search"></i> </a> </div><!-- /.form-controls has-button has-icon --> </div><!-- /.form-row --> <div class="form-row form-row-tablet"> <label for="field-flights-abroad2" class="form-label">נחיתה ב</label> <div class="form-controls has-button has-icon"> <i class="ico-plane"></i> <input type="text" class="field city" value="" name="field-flights-abroad2" id="field-flights-abroad2" placeholder="תל אביב - בן גוריון (TLV)" /> <a href="ajax/popular-destinations-rtl.html" class="btn btn-search"> <i class="ico-search"></i> </a> </div><!-- /.form-controls has-button has-icon --> </div><!-- /.form-row --> <div class="date-range"> <div class="form-row"> <div class="form-col"> <label for="field-flights-abroad3" class="form-label">תאריך יציאה</label> <div class="form-controls has-date"> <input type="text" readonly="readonly" class="field datepicker-field depart" value="" name="field-flights-abroad329" id="field-flights-abroad329" placeholder="יום א’ 24/12/2014" data-title="תאריך יציאה" /> </div><!-- /.form-controls --> </div><!-- /.form-col --> <div class="form-col"> <label for="field-flights-abroad4" class="form-label">תאריך חזרה</label> <div class="form-controls has-date"> <input type="text" readonly="readonly" class="field datepicker-field arrive" value="" name="field-flights-abroad430" id="field-flights-abroad430" placeholder="יום א’ 24/12/2014" data-title="תאריך חזרה" /> </div><!-- /.form-controls --> </div><!-- /.form-col --> </div><!-- /.form-row --> </div><!-- /.date-range --> <hr class="form-separator" /> <div class="form-row"> <div class="form-col"> <div class="form-col"> <label for="field-flights-abroad5" class="form-label">מבוגר (25-65)</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-flights-abroad5" id="field-flights-abroad5"> <option value="0">0</option> <option value="1">1</option> <option value="2" selected>2</option> </select> </div><!-- /.form-controls --> </div><!-- /.form-col --> <div class="form-col"> <label for="field-flights-abroad6" class="form-label">צעיר (12-24)</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-flights-abroad6" id="field-flights-abroad6"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> </select> </div><!-- /.form-controls --> </div><!-- /.form-col --> </div><!-- /.form-col --> <div class="form-col"> <div class="form-col"> <label for="field-flights-abroad7" class="form-label">ילד (2-12)</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-flights-abroad7" id="field-flights-abroad7"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> </select> </div><!-- /.form-controls --> </div><!-- /.form-col --> <div class="form-col"> <label for="field-flights-abroad8" class="form-label">תינוק (0-2)</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-flights-abroad8" id="field-flights-abroad8"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> </select> </div><!-- /.form-controls --> </div><!-- /.form-col --> </div><!-- /.form-col --> </div><!-- /.form-row --> <div class="form-row"> <ul class="list-form-actions"> <li> <a href="#"> <i class="ico-hotel"></i> הוסיפו מלון </a> </li> <li> <a href="#"> <i class="ico-automobile"></i> הוסיפו רכב </a> </li> </ul><!-- /.list-form-actions --> </div><!-- /.form-row --> <input type="submit" value="חפשו טיסות" name="search-flights-abroad-submit" class="form-btn" /> </div><!-- /.search-tab-inner --> <div class="search-tab-inner" id="searchFlightsDomestic"> <ul class="list-radios"> <li> <div class="radio"> <input type="radio" name="flights-eilat-group" id="field-flights-eilat-group1" value="הלוך ושוב" checked="checked" class="form-enable" data-undisable="#field-flights-eilat442" data-remove-class="one-way" /> <label for="field-flights-eilat-group1">הלוך ושוב</label> </div><!-- /.radio --> </li> <li> <div class="radio"> <input type="radio" name="flights-eilat-group" id="field-flights-eilat-group2" value="כיוון אחד" class="form-disable" data-disable="#field-flights-eilat442" data-add-class="one-way" /> <label for="field-flights-eilat-group2">כיוון אחד</label> </div><!-- /.radio --> </li> </ul><!-- /.list-radios --> <div class="form-row form-row-tablet"> <label for="field-flights-eilat1" class="form-label">יציאה מ</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-flights-eilat1" id="field-flights-eilat1"> <option value="תל אביב - כל שדות התעופה">תל אביב - כל שדות התעופה</option> <option value="תל אביב - כל שדות התעופה 1">תל אביב - כל שדות התעופה 1</option> <option value="תל אביב - כל שדות התעופה 2">תל אביב - כל שדות התעופה 2</option> <option value="תל אביב - כל שדות התעופה 3">תל אביב - כל שדות התעופה 3</option> </select> </div><!-- /.form-controls --> </div><!-- /.form-row --> <div class="form-row form-row-tablet"> <label for="field-flights-eilat2" class="form-label">נחיתה ב</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-flights-eilat2" id="field-flights-eilat2"> <option value="אילת, אילת">אילת, אילת</option> <option value="אילת, אילת 1">אילת, אילת 1</option> <option value="אילת, אילת 2">אילת, אילת 2</option> <option value="אילת, אילת 3">אילת, אילת 3</option> </select> </div><!-- /.form-controls --> </div><!-- /.form-row --> <div class="date-range"> <div class="form-row"> <div class="form-col"> <label for="field-flights-eilat3" class="form-label">תאריך יציאה</label> <div class="form-controls has-date"> <input type="text" readonly="readonly" class="field datepicker-field depart" value="" name="field-flights-eilat341" id="field-flights-eilat341" placeholder="יום א’ 24/12/2014" data-title="תאריך יציאה" /> </div><!-- /.form-controls --> </div><!-- /.form-col --> <div class="form-col"> <label for="field-flights-eilat4" class="form-label">תאריך חזרה</label> <div class="form-controls has-date"> <input type="text" readonly="readonly" class="field datepicker-field arrive" value="" name="field-flights-eilat442" id="field-flights-eilat442" placeholder="יום א’ 24/12/2014" data-title="תאריך חזרה" /> </div><!-- /.form-controls --> </div><!-- /.form-col --> </div><!-- /.form-row --> </div><!-- /.date-range --> <hr class="form-separator" /> <div class="form-row"> <div class="form-col"> <div class="form-col"> <label for="field-flights-eilat5" class="form-label">מבוגר (25-65)</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-flights-eilat5" id="field-flights-eilat5"> <option value="0">0</option> <option value="1">1</option> <option value="2" selected>2</option> </select> </div><!-- /.form-controls --> </div><!-- /.form-col --> <div class="form-col"> <label for="field-flights-eilat6" class="form-label">ילד (2-12)</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-flights-eilat6" id="field-flights-eilat6"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> </select> </div><!-- /.form-controls --> </div><!-- /.form-col --> </div><!-- /.form-col --> <div class="form-col"> <div class="form-col"> <label for="field-flights-eilat7" class="form-label">תינוק (0-2)</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-flights-eilat7" id="field-flights-eilat7"> <option value="0">0</option> <option value="1">1</option> <option value="2">2</option> </select> </div><!-- /.form-controls --> </div><!-- /.form-col --> </div><!-- /.form-col --> </div><!-- /.form-row --> <input type="submit" value="חפשו טיסות" name="search-flights-eilat-submit" class="form-btn" /> </div><!-- /.search-tab-inner --> </div><!-- /.search-tab --> <div class="search-tab" id="searchHotels"> <ul class="list-categories-group"> <li class="current"> <a href="#searchHotelsDomestic" class="tab-toggle">מלונות בארץ</a> </li> <li> <a href="#searchHotelsAbroad" class="tab-toggle">מלונות בחו”ל</a> </li> </ul><!-- /.list-categories-group --> <div class="search-tab-inner visible" id="searchHotelsDomestic"> <div class="form-row"> <label for="field-hotels-domestic1" class="form-label">עיר</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-hotels-domestic1" id="field-hotels-domestic1"> <option value="אילת">אילת</option> <option value="אילת 1">אילת 1</option> <option value="אילת 2">אילת 2</option> <option value="אילת 3">אילת 3</option> </select> </div><!-- /.form-controls --> </div><!-- /.form-row --> <div class="date-range"> <div class="form-row"> <div class="form-col"> <label for="field-hotels-domestic2" class="form-label">תאריך יציאה</label> <div class="form-controls has-date"> <input type="text" readonly="readonly" class="field datepicker-field depart" value="" name="field-hotels-domestic243" id="field-hotels-domestic243" placeholder="יום א’ 24/12/2014" data-title="תאריך יציאה" /> </div><!-- /.form-controls --> </div><!-- /.form-col --> <div class="form-col"> <label for="field-hotels-domestic3" class="form-label">תאריך חזרה</label> <div class="form-controls has-date"> <input type="text" readonly="readonly" class="field datepicker-field arrive" value="" name="field-hotels-domestic344" id="field-hotels-domestic344" placeholder="יום א’ 24/12/2014" data-title="תאריך חזרה" /> </div><!-- /.form-controls --> </div><!-- /.form-col --> </div><!-- /.form-row --> </div><!-- /.date-range --> <div class="form-row"> <label for="field-hotels-domestic4" class="form-label">מלון</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-hotels-domestic4" id="field-hotels-domestic4"> <option value="כל המלונות">כל המלונות</option> <option value="כל המלונות 1">כל המלונות 1</option> <option value="כל המלונות 2">כל המלונות 2</option> <option value="כל המלונות 3">כל המלונות 3</option> </select> </div><!-- /.form-controls --> </div><!-- /.form-row --> <hr class="form-separator" /> <div class="form-row"> <div class="form-col"> <label for="field-hotels-domestic5" class="form-label">הרכב החדר</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-hotels-domestic5" id="field-hotels-domestic5"> <option value="2 מבוגרים + 2 ילדים">2 מבוגרים + 2 ילדים</option> <option value="2 מבוגרים + 2 ילדים 1">2 מבוגרים + 2 ילדים 1</option> <option value="2 מבוגרים + 2 ילדים 2">2 מבוגרים + 2 ילדים 2</option> <option value="2 מבוגרים + 2 ילדים 3">2 מבוגרים + 2 ילדים 3</option> </select> </div><!-- /.form-controls --> </div><!-- /.form-col --> <div class="form-col"> <p>* ניתן להזמין חדרים נוספים לאחר חיפוש ובחירת המלון </p> </div><!-- /.form-col --> </div><!-- /.form-row --> <input type="submit" value="חפשו מלון" name="search-hotels-domestic-submit" class="form-btn" /> </div><!-- /.search-tab-inner --> <div class="search-tab-inner" id="searchHotelsAbroad"> <div class="form-row"> <label for="field-hotels-abroad1" class="form-label">עיר</label> <div class="form-controls has-button has-icon"> <i class="ico-marker"></i> <input type="text" class="field city" value="" name="field-hotels-abroad1" id="field-hotels-abroad1" placeholder="תל אביב - בן גוריון (TLV)" /> <a href="ajax/popular-destinations-rtl.html" class="btn btn-search"> <i class="ico-search"></i> </a> </div><!-- /.form-controls has-button has-icon --> </div><!-- /.form-row --> <div class="date-range"> <div class="form-row"> <div class="form-col"> <label for="field-hotels-abroad2" class="form-label">תאריך כניסה</label> <div class="form-controls has-date"> <input type="text" readonly="readonly" class="field datepicker-field depart" value="" name="field-hotels-abroad245" id="field-hotels-abroad245" placeholder="יום א’ 24/12/2014" data-title="תאריך כניסה" /> </div><!-- /.form-controls --> </div><!-- /.form-col --> <div class="form-col"> <label for="field-hotels-abroad3" class="form-label">תאריך יציאה</label> <div class="form-controls has-date"> <input type="text" readonly="readonly" class="field datepicker-field arrive" value="" name="field-hotels-abroad346" id="field-hotels-abroad346" placeholder="יום א’ 24/12/2014" data-title="תאריך יציאה" /> </div><!-- /.form-controls --> </div><!-- /.form-col --> </div><!-- /.form-row --> </div><!-- /.date-range --> <hr class="form-separator" /> <div class="form-row"> <div class="form-col"> <label for="field-hotels-abroad4" class="form-label">מספר חדרים</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-hotels-abroad4" id="field-hotels-abroad4" class="form-rooms-toggle"> <option value="1" data-toggle-class="two-rooms">1</option> <option value="2" data-toggle-class="two-rooms">2</option> </select> </div><!-- /.form-controls --> </div><!-- /.form-col --> </div><!-- /.form-row --> <div class="form-row dropdowns-wrapper first-room"> <h4>חדר 1</h4> <div class="form-col"> <div class="form-col"> <label for="field-hotels-abroad5" class="form-label">מבוגר (16+)</label> <div class="form-controls custom-select"> <p class="custom-select-value">2</p><!-- /.custom-select-value --> <select name="field-hotels-abroad5" id="field-hotels-abroad5"> <option value="2">2</option> <option value="1">1</option> <option value="0">0</option> </select> </div><!-- /.form-controls custom-select --> </div><!-- /.form-col --> <div class="form-col"> <label for="field-hotels-abroad6" class="form-label">ילד (0-16)</label> <div class="form-controls custom-select"> <p class="custom-select-value">0</p><!-- /.custom-select-value --> <select name="field-hotels-abroad6" id="field-hotels-abroad6" class="dropdown-toggler"> <option value="2">2</option> <option value="1">1</option> <option value="0" selected="">0</option> </select> </div><!-- /.form-controls custom-select --> </div><!-- /.form-col --> </div><!-- /.form-col --> <div class="form-col"> <div class="form-col dropdown1"> <label for="field-hotels-abroad7" class="form-label">גיל ילד 1</label> <div class="form-controls custom-select"> <p class="custom-select-value">0</p><!-- /.custom-select-value --> <select name="field-hotels-abroad7" id="field-hotels-abroad7"> <option value="2">2</option> <option value="1">1</option> <option value="0" selected="">0</option> </select> </div><!-- /.form-controls custom-select --> </div><!-- /.form-col --> <div class="form-col dropdown2"> <label for="field-hotels-abroad8" class="form-label">גיל ילד 2</label> <div class="form-controls custom-select"> <p class="custom-select-value">0</p><!-- /.custom-select-value --> <select name="field-hotels-abroad8" id="field-hotels-abroad8"> <option value="2">2</option> <option value="1">1</option> <option value="0" selected="">0</option> </select> </div><!-- /.form-controls custom-select --> </div><!-- /.form-col --> </div><!-- /.form-col --> </div> <div class="form-row dropdowns-wrapper second-room"> <h4>חדר 2</h4> <div class="form-col"> <div class="form-col"> <label for="field-hotels-abroad9" class="form-label">מבוגר (16+)</label> <div class="form-controls custom-select"> <p class="custom-select-value">2</p><!-- /.custom-select-value --> <select name="field-hotels-abroad9" id="field-hotels-abroad9"> <option value="2">2</option> <option value="1">1</option> <option value="0">0</option> </select> </div><!-- /.form-controls custom-select --> </div><!-- /.form-col --> <div class="form-col"> <label for="field-hotels-abroad10" class="form-label">ילד (0-16)</label> <div class="form-controls custom-select"> <p class="custom-select-value">0</p><!-- /.custom-select-value --> <select name="field-hotels-abroad10" id="field-hotels-abroad10" class="dropdown-toggler"> <option value="2">2</option> <option value="1">1</option> <option value="0" selected="">0</option> </select> </div><!-- /.form-controls custom-select --> </div><!-- /.form-col --> </div><!-- /.form-col --> <div class="form-col"> <div class="form-col dropdown1"> <label for="field-hotels-abroad11" class="form-label">גיל ילד 1</label> <div class="form-controls custom-select"> <p class="custom-select-value">0</p><!-- /.custom-select-value --> <select name="field-hotels-abroad11" id="field-hotels-abroad11"> <option value="2">2</option> <option value="1">1</option> <option value="0" selected="">0</option> </select> </div><!-- /.form-controls custom-select --> </div><!-- /.form-col --> <div class="form-col dropdown2"> <label for="field-hotels-abroad12" class="form-label">גיל ילד 2</label> <div class="form-controls custom-select"> <p class="custom-select-value">0</p><!-- /.custom-select-value --> <select name="field-hotels-abroad12" id="field-hotels-abroad12"> <option value="2">2</option> <option value="1">1</option> <option value="0" selected="">0</option> </select> </div><!-- /.form-controls custom-select --> </div><!-- /.form-col --> </div><!-- /.form-col --> </div> <input type="submit" value="חפשו מלון" name="search-hotels-abroad-submit" class="form-btn" /> </div><!-- /.search-tab-inner --> </div><!-- /.search-tab --> <div class="search-tab" id="searchPackages"> <ul class="list-radios"> <li> <div class="radio"> <input type="radio" name="packages-group" id="field-packages-group1" value="לפי יעד" checked="checked" /> <label for="field-packages-group1">לפי יעד</label> </div><!-- /.radio --> </li> <li> <div class="radio"> <input type="radio" name="packages-group" id="field-packages-group2" value="לכל היעדים" /> <label for="field-packages-group2">לכל היעדים</label> </div><!-- /.radio --> </li> </ul><!-- /.list-radios --> <div class="form-row"> <label for="field-packages1" class="form-label">עיר</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-packages1" id="field-packages1"> <option value="אמסטרדם, הולנד">אמסטרדם, הולנד</option> <option value="אמסטרדם, הולנד 1">אמסטרדם, הולנד 1</option> <option value="אמסטרדם, הולנד 2">אמסטרדם, הולנד 2</option> <option value="אמסטרדם, הולנד 3">אמסטרדם, הולנד 3</option> </select> </div><!-- /.form-controls custom-select --> </div><!-- /.form-row --> <div class="date-range"> <div class="form-row"> <div class="form-col"> <label for="field-packages2" class="form-label">תאריך יציאה</label> <div class="form-controls has-date"> <input type="text" readonly="readonly" class="field datepicker-field depart" value="" name="field-packages247" id="field-packages247" placeholder="יום א’ 24/12/2014" data-title="תאריך יציאה" /> </div><!-- /.form-controls --> </div><!-- /.form-col --> <div class="form-col"> <label for="field-packages3" class="form-label">תאריך חזרה</label> <div class="form-controls has-date"> <input type="text" readonly="readonly" class="field datepicker-field arrive" value="" name="field-packages348" id="field-packages348" placeholder="יום א’ 24/12/2014" data-title="תאריך חזרה" /> </div><!-- /.form-controls --> </div><!-- /.form-col --> </div><!-- /.form-row --> </div><!-- /.date-range --> <hr class="form-separator" /> <div class="form-row"> <div class="form-col"> <label for="field-packages4" class="form-label">הרכב החדר</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-packages4" id="field-packages4"> <option value="2 מבוגרים + 2 ילדים">2 מבוגרים + 2 ילדים</option> <option value="2 מבוגרים + 2 ילדים 1">2 מבוגרים + 2 ילדים 1</option> <option value="2 מבוגרים + 2 ילדים 2">2 מבוגרים + 2 ילדים 2</option> <option value="2 מבוגרים + 2 ילדים 3">2 מבוגרים + 2 ילדים 3</option> </select> </div><!-- /.form-controls custom-select --> </div><!-- /.form-col --> </div><!-- /.form-row --> <div class="form-row"> <p>* להזמנת חבילה של מבוגר/ים + תינוק/ות (גילאי 0-2), יש להיכנס לעמוד המלון.<br />* ילד מגיל 13 ומעלה יחשב מבוגר בהזמנת החדר.<br />* ניתן להזמין חדרים נוספים לאחר חיפוש ובחירת המלון. </p> </div><!-- /.form-row --> <input type="submit" value="חפשו חבילות" name="search-packages-submit" class="form-btn" /> </div><!-- /.search-tab --> <div class="search-tab" id="searchCars"> <div class="form-row"> <label for="field-cars1" class="form-label">מדינת איסוף</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-cars1" id="field-cars1"> <option value="אמסטרדם, הולנד">אמסטרדם, הולנד</option> <option value="אמסטרדם, הולנד 1">אמסטרדם, הולנד 1</option> <option value="אמסטרדם, הולנד 2">אמסטרדם, הולנד 2</option> <option value="אמסטרדם, הולנד 3">אמסטרדם, הולנד 3</option> </select> </div><!-- /.form-controls custom-select --> </div><!-- /.form-row --> <div class="date-range"> <div class="form-row"> <div class="form-col form-col-medium"> <label for="field-cars2" class="form-label">יעד לקיחה</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-cars2" id="field-cars2"> <option value="בחר">בחר</option> <option value="בחר 1">בחר 1</option> <option value="בחר 2">בחר 2</option> <option value="בחר 3">בחר 3</option> </select> </div><!-- /.form-controls custom-select --> </div><!-- /.form-col --> <div class="form-col form-col-small"> <label for="field-cars3" class="form-label">תאריך לקיחה</label> <div class="form-controls has-date"> <input type="text" class="field datepicker-field depart" value="" name="field-cars349" id="field-cars349" placeholder="24/12/2014" data-title="תאריך לקיחה" /> </div><!-- /.form-controls --> </div><!-- /.form-col --> <div class="form-col form-col-tiny"> <label for="field-cars4" class="form-label">שעת לקיחה</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-cars4" id="field-cars4"> <option value="10:00">10:00</option> <option value="11:00">11:00</option> <option value="12:00">12:00</option> </select> </div><!-- /.form-controls custom-select --> </div><!-- /.form-col --> </div><!-- /.form-row --> <div class="form-row"> <div class="form-col form-col-medium"> <label for="field-cars5" class="form-label">יעד לקיחה</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-cars5" id="field-cars5"> <option value="בחר">בחר</option> <option value="בחר 1">בחר 1</option> <option value="בחר 2">בחר 2</option> <option value="בחר 3">בחר 3</option> </select> </div><!-- /.form-controls custom-select --> </div><!-- /.form-col --> <div class="form-col form-col-small"> <label for="field-cars6" class="form-label">תאריך לקיחה</label> <div class="form-controls has-date"> <input type="text" class="field datepicker-field arrive" value="" name="field-cars650" id="field-cars650" placeholder="24/12/2014" data-title="תאריך לקיחה" /> </div><!-- /.form-controls --> </div><!-- /.form-col --> <div class="form-col form-col-tiny"> <label for="field-cars7" class="form-label">שעת לקיחה</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-cars7" id="field-cars7"> <option value="10:00">10:00</option> <option value="11:00">11:00</option> <option value="12:00">12:00</option> </select> </div><!-- /.form-controls custom-select --> </div><!-- /.form-col --> </div><!-- /.form-row --> </div><!-- /.date-range --> <div class="form-row"> <div class="form-col form-col-medium"> <label for="field-cars8" class="form-label">גיל הנהג</label> <div class="form-controls"> <input type="text" class="field" value="" name="field-cars8" id="field-cars8" placeholder="" /> </div><!-- /.form-controls custom-select --> </div><!-- /.form-col --> </div><!-- /.form-row --> <input type="submit" value="חפשו רכב" name="search-cars-submit" class="form-btn" /> </div><!-- /.search-tab --> <div class="search-tab" id="searchTours"> <div class="form-row"> <label for="field-tours1" class="form-label">איזור</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-tours1" id="field-tours1"> <option value="בחר איזור">בחר איזור</option> <option value="בחר איזור 1">בחר איזור 1</option> <option value="בחר איזור 2">בחר איזור 2</option> <option value="בחר איזור 3">בחר איזור 3</option> </select> </div><!-- /.form-controls custom-select --> </div><!-- /.form-row --> <div class="form-row"> <label for="field-tours2" class="form-label">מדינה</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-tours2" id="field-tours2"> <option value="בחר מדינה">בחר מדינה</option> <option value="בחר מדינה 1">בחר מדינה 1</option> <option value="בחר מדינה 2">בחר מדינה 2</option> <option value="בחר מדינה 3">בחר מדינה 3</option> </select> </div><!-- /.form-controls custom-select --> </div><!-- /.form-row --> <div class="form-row"> <label for="field-tours3" class="form-label">קטגוריה</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-tours3" id="field-tours3"> <option value="כל הקטגוריות">כל הקטגוריות</option> <option value="כל הקטגוריות 1">כל הקטגוריות 1</option> <option value="כל הקטגוריות 2">כל הקטגוריות 2</option> <option value="כל הקטגוריות 3">כל הקטגוריות 3</option> </select> </div><!-- /.form-controls custom-select --> </div><!-- /.form-row --> <div class="form-row"> <label for="field-tours4" class="form-label">חודש</label> <div class="form-controls custom-select"> <p class="custom-select-value"></p><!-- /.custom-select-value --> <select name="field-tours4" id="field-tours4"> <option value="בחר חודש">בחר חודש</option> <option value="בחר חודש 1">בחר חודש 1</option> <option value="בחר חודש 2">בחר חודש 2</option> <option value="בחר חודש 3">בחר חודש 3</option> </select> </div><!-- /.form-controls custom-select --> </div><!-- /.form-row --> <input type="submit" value="חפשו טיול" name="search-tours-submit" class="form-btn" /> </div><!-- /.search-tab --> </div><!-- /.search-tabs --> </form> </div><!-- /.search-form --> </div><!-- /.shell --> </section><!-- /.section-search --> <div class="section-search-mobile"> <form action="?" method="post"> <ul class="list-search-categories"> <li class="current"> <a href="#searchFlightsMobile" class="tab-toggle"> <i class="ico-airplane"></i> טיסות </a> </li> <li> <a href="#searchHotelsMobile" class="tab-toggle"> <i class="ico-building"></i> מלונות </a> </li> <li> <a href="#searchPackagesMobile" class="tab-toggle"> <i class="ico-suitcase"></i> חבילות </a> </li> <li> <a href="#searchCarsMobile" class="tab-toggle"> <i class="ico-car"></i> רכב </a> </li> <li> <a href="#searchToursMobile" class="tab-toggle"> <i class="ico-bus"></i> מאורגנים </a> </li> </ul><!-- /.list-search-categories --> <div class="search-tabs"> <div class="search-tab visible" id="searchFlightsMobile"> <ul class="list-categories-group"> <li class="current"> <a href="#searchFlightsAbroadMobile" class="tab-toggle">טיסות לחו”ל</a> </li> <li> <a href="#searchFlightsDomesticMobile" class="tab-toggle">טיסות לאילת</a> </li> </ul><!-- /.list-categories-group --> <div class="search-tab-inner visible" id="searchFlightsAbroadMobile"> <ul class="list-radios"> <li> <div class="radio"> <input type="radio" name="form-group-flights-abroad" id="form-group-flights-abroad-round-trip" value="הלוך ושוב" checked="checked" class="form-enable" data-undisable="#field-flights-arrival-date22" data-remove-class="one-way" /> <label class="form-label" for="form-group-flights-abroad-round-trip">הלוך ושוב</label> </div><!-- /.radio --> </li> <li> <div class="radio"> <input type="radio" name="form-group-flights-abroad" id="form-group-flights-abroad-one-way" value="כיוון אחד" class="form-disable" data-disable="#field-flights-arrival-date22" data-add-class="one-way" /> <label class="form-label" for="form-group-flights-abroad-one-way">כיוון אחד</label> </div><!-- /.radio --> </li> </ul><!-- /.list-radios --> <div class="form-row has-button"> <input type="text" class="field city" value="" name="field-flights-departure-location" id="field-flights-departure-location" placeholder="יציאה מ..." /> <a href="ajax/popular-destinations-rtl-mobile.html" class="btn btn-search"> <i class="ico-search"></i> </a> </div><!-- /.form-row --> <div class="form-row has-button"> <input type="text" class="field city" value="" name="field-flights-arrival-location" id="field-flights-arrival-location" placeholder="נחיתה ב..." /> <a href="ajax/popular-destinations-rtl-mobile.html" class="btn btn-search"> <i class="ico-search"></i> </a> </div><!-- /.form-row --> <div class="date-range"> <div class="form-row"> <div class="form-col has-button"> <input type="text" readonly="readonly" class="field datepicker-field depart" value="" name="field-flights-departure-date22" id="field-flights-departure-date22" placeholder="תאריך יציאה" data-title="תאריך יציאה בחר" /> </div><!-- /.form-col --> <div class="form-col has-button"> <input type="text" readonly="readonly" class="field datepicker-field arrive" value="" name="field-flights-arrival-date22" id="field-flights-arrival-date22" placeholder="תאריך חזרה" data-title="תאריך חזרה" /> </div><!-- /.form-col --> </div><!-- /.form-row --> </div><!-- /.date-range --> <div class="form-row"> <div class="form-col has-number" data-value="מבוגר|(25+)" data-initial-value="מבוגר|(25+)"> <div class="btn-increment"> <i class="ico-plus"></i> </div><!-- /.btn-increment --> <input type="number" readonly="readonly" class="field" value="0" name="field-flights-adults" id="field-flights-adults" data-title="מבוגר" min="0" max="100" step="1" /> <div class="btn-decrement"> <i class="ico-minus"></i> </div><!-- /.btn-decrement --> </div><!-- /.form-col --> <div class="form-col has-number" data-value="צעיר|(12-24)" data-initial-value="צעיר|(12-24)"> <div class="btn-increment"> <i class="ico-plus"></i> </div><!-- /.btn-increment --> <input type="number" readonly="readonly" class="field" value="0" name="field-flights-youths" id="field-flights-youths" data-title="צעיר" min="0" max="100" step="1" /> <div class="btn-decrement"> <i class="ico-minus"></i> </div><!-- /.btn-decrement --> </div><!-- /.form-col --> </div><!-- /.form-row --> <div class="form-row"> <div class="form-col has-number" data-value="ילד|(2-12)" data-initial-value="ילד|(2-12)"> <div class="btn-increment"> <i class="ico-plus"></i> </div><!-- /.btn-increment --> <input type="number" readonly="readonly" class="field" value="0" name="field-flights-children" id="field-flights-children" data-title="ילד" min="0" max="100" step="1" /> <div class="btn-decrement"> <i class="ico-minus"></i> </div><!-- /.btn-decrement --> </div><!-- /.form-col --> <div class="form-col has-number" data-value="תינוק|(0-2)" data-initial-value="תינוק|(0-2)"> <div class="btn-increment"> <i class="ico-plus"></i> </div><!-- /.btn-increment --> <input type="number" readonly="readonly" class="field" value="0" name="field-flights-infants" id="field-flights-infants" data-title="תינוק" min="0" max="100" step="1" /> <div class="btn-decrement"> <i class="ico-minus"></i> </div><!-- /.btn-decrement --> </div><!-- /.form-col --> </div><!-- /.form-row --> <input type="submit" value="חפשו טיסות" class="form-btn" /> </div><!-- /.search-tab-inner --> <div class="search-tab-inner" id="searchFlightsDomesticMobile"> <ul class="list-radios"> <li> <div class="radio"> <input type="radio" name="form-group-flights-domestic" id="form-group-flights-domestic-round-trip" value="הלוך ושוב" checked="checked" class="form-enable" data-undisable="#field-domestic-flights-arrival-date23" data-remove-class="one-way" /> <label class="form-label" for="form-group-flights-domestic-round-trip">הלוך ושוב</label> </div><!-- /.radio --> </li> <li> <div class="radio"> <input type="radio" name="form-group-flights-domestic" id="form-group-flights-domestic-one-way" value="כיוון אחד" class="form-disable" data-disable="#field-domestic-flights-arrival-date23" data-add-class="one-way" /> <label class="form-label" for="form-group-flights-domestic-one-way">כיוון אחד</label> </div><!-- /.radio --> </li> </ul><!-- /.list-radios --> <div class="form-row has-select"> <select name="field-domestic-flights-departure-location" id="field-domestic-flights-departure-location" class="select"> <option value="יציאה מ...">יציאה מ...</option> <option value="option 1">Option 1</option> <option value="option 2">Option 2</option> <option value="option 3">Option 3</option> <option value="option 4">Option 4</option> <option value="option 5">Option 5</option> </select> </div><!-- /.form-row --> <div class="form-row has-select"> <select name="field-domestic-flights-arrival-location" id="field-domestic-flights-arrival-location" class="select"> <option value="נחיתה ב...">נחיתה ב...</option> <option value="option 1">Option 1</option> <option value="option 2">Option 2</option> <option value="option 3">Option 3</option> <option value="option 4">Option 4</option> <option value="option 5">Option 5</option> </select> </div><!-- /.form-row --> <div class="date-range"> <div class="form-row"> <div class="form-col has-button"> <input type="text" readonly="readonly" class="field datepicker-field depart" value="" name="field-domestic-flights-departure-date23" id="field-domestic-flights-departure-date23" placeholder="תאריך יציאה" data-title="תאריך יציאה" /> </div><!-- /.form-col --> <div class="form-col has-button"> <input type="text" readonly="readonly" class="field datepicker-field arrive" value="" name="field-domestic-flights-arrival-date23" id="field-domestic-flights-arrival-date23" placeholder="תאריך חזרה" data-title="תאריך חזרה" /> </div><!-- /.form-col --> </div><!-- /.form-row --> </div><!-- /.date-range --> <div class="form-row has-number" data-value="מבוגר|(25+)" data-initial-value="מבוגר|(25+)"> <div class="btn-increment"> <i class="ico-plus"></i> </div><!-- /.btn-increment --> <input type="number" readonly="readonly" class="field" value="0" name="field-domestic-flights-adults" id="field-domestic-flights-adults" data-title="מבוגר" min="0" max="100" step="1" /> <div class="btn-decrement"> <i class="ico-minus"></i> </div><!-- /.btn-decrement --> </div><!-- /.form-row --> <div class="form-row"> <div class="form-col has-number" data-value="ילד|(2-12)" data-initial-value="ילד|(2-12)"> <div class="btn-increment"> <i class="ico-plus"></i> </div><!-- /.btn-increment --> <input type="number" readonly="readonly" class="field" value="0" name="field-domestic-flights-children" id="field-domestic-flights-children" data-title="ילד" min="0" max="100" step="1" /> <div class="btn-decrement"> <i class="ico-minus"></i> </div><!-- /.btn-decrement --> </div><!-- /.form-col --> <div class="form-col has-number" data-value="תינוק|(0-2)" data-initial-value="תינוק|(0-2)"> <div class="btn-increment"> <i class="ico-plus"></i> </div><!-- /.btn-increment --> <input type="number" readonly="readonly" class="field" value="0" name="field-domestic-flights-infants" id="field-domestic-flights-infants" data-title="תינוק" min="0" max="100" step="1" /> <div class="btn-decrement"> <i class="ico-minus"></i> </div><!-- /.btn-decrement --> </div><!-- /.form-col --> </div><!-- /.form-row --> <input type="submit" value="חפשו טיסות" class="form-btn" /> </div><!-- /.search-tab-inner --> </div><!-- /.search-tab --> <div class="search-tab" id="searchHotelsMobile"> <ul class="list-categories-group"> <li class="current"> <a href="#searchHotelsAbroadMobile" class="tab-toggle">מלונות בחו”ל</a> </li> <li> <a href="#searchHotelsDomesticMobile" class="tab-toggle">מלונות בארץ</a> </li> </ul><!-- /.list-categories-group --> <div class="search-tab-inner visible" id="searchHotelsAbroadMobile"> <div class="form-row has-button"> <input type="text" class="field city" value="" name="field-hotels-arrival-location" id="field-hotels-arrival-location" placeholder="עיר..." /> <a href="ajax/popular-destinations-rtl-mobile" class="btn btn-search"> <i class="ico-search"></i> </a> </div><!-- /.form-row --> <div class="date-range"> <div class="form-row"> <div class="form-col has-button"> <input type="text" readonly="readonly" class="field datepicker-field depart" value="" name="field-hotels-departure-date24" id="field-hotels-departure-date24" placeholder="תאריך כניסה" data-title="תאריך כניסה" /> </div><!-- /.form-col --> <div class="form-col has-button"> <input type="text" readonly="readonly" class="field datepicker-field arrive" value="" name="field-hotels-arrival-date24" id="field-hotels-arrival-date24" placeholder="תאריך יציאה" data-title="תאריך יציאה" /> </div><!-- /.form-col --> </div><!-- /.form-row --> </div><!-- /.date-range --> <div class="form-row has-number" data-value="מבוגר|(16+)" data-initial-value="מבוגר|(16+)"> <div class="btn-increment"> <i class="ico-plus"></i> </div><!-- /.btn-increment --> <input type="number" readonly="readonly" class="field" value="0" name="field-hotels-adults" id="field-hotels-adults" data-title="מבוגר" min="0" max="100" step="1" /> <div class="btn-decrement"> <i class="ico-minus"></i> </div><!-- /.btn-decrement --> </div><!-- /.form-row --> <div class="dropdowns-wrapper"> <div class="form-row has-number" data-value="ילד|(0-16)" data-initial-value="ילד|(0-16)"> <div class="btn-increment"> <i class="ico-plus"></i> </div><!-- /.btn-increment --> <input type="number" readonly="readonly" class="field dropdowns-toggler" value="0" name="field-hotels-youths" id="field-hotels-youths" data-title="צעיר" min="0" max="2" step="1" /> <div class="btn-decrement"> <i class="ico-minus"></i> </div><!-- /.btn-decrement --> </div><!-- /.form-row --> <div class="form-row"> <div class="form-col has-select dropdown1"> <select name="field-hotels-children" id="field-hotels-children" class="select"> <option value="גיל ילד">גיל ילד</option> <option value="option 1">Option 1</option> <option value="option 2">Option 2</option> <option value="option 3">Option 3</option> <option value="option 4">Option 4</option> <option value="option 5">Option 5</option> </select> </div><!-- /.form-col has-select --> <div class="form-col has-select dropdown2"> <select name="field-hotels-infants" id="field-hotels-infants" class="select"> <option value="גיל ילד">גיל ילד</option> <option value="option 1">Option 1</option> <option value="option 2">Option 2</option> <option value="option 3">Option 3</option> <option value="option 4">Option 4</option> <option value="option 5">Option 5</option> </select> </div><!-- /.form-col has-select --> </div><!-- /.form-row --> </div><!-- /.dropdowns-wrapper --> <input type="submit" value="חפשו מלונות" class="form-btn" /> </div><!-- /.search-tab-inner --> <div class="search-tab-inner" id="searchHotelsDomesticMobile"> <div class="form-row has-button has-select"> <select name="field-domestic-hotels-departure-location" id="field-domestic-hotels-departure-location" class="select"> <option value="עיר...">עיר...</option> <option value="option 1">Option 1</option> <option value="option 2">Option 2</option> <option value="option 3">Option 3</option> <option value="option 4">Option 4</option> <option value="option 5">Option 5</option> </select> </div><!-- /.form-row --> <div class="date-range"> <div class="form-row"> <div class="form-col has-button"> <input type="text" readonly="readonly" class="field datepicker-field depart" value="" name="field-domestic-hotels-departure-date25" id="field-domestic-hotels-departure-date25" placeholder="תאריך יציאה" data-title="תאריך יציאה" /> </div><!-- /.form-col --> <div class="form-col has-button"> <input type="text" readonly="readonly" class="field datepicker-field arrive" value="" name="field-domestic-hotels-arrival-date25" id="field-domestic-hotels-arrival-date25" placeholder="תאריך יציאה" data-title="תאריך יציאה" /> </div><!-- /.form-col --> </div><!-- /.form-row --> </div><!-- /.date-range --> <div class="form-row has-select"> <select name="field-domestic-hotels-room-composition" id="field-domestic-hotels-room-composition" class="select"> <option value="הרכב החדר...">הרכב החדר...</option> <option value="option 1">Option 1</option> <option value="option 2">Option 2</option> <option value="option 3">Option 3</option> <option value="option 4">Option 4</option> <option value="option 5">Option 5</option> </select> </div><!-- /.form-row --> <div class="form-row has-select"> <select name="field-domestic-hotels-hotel-name" id="field-domestic-hotels-hotel-name" class="select"> <option value="שם מלון...">שם מלון...</option> <option value="option 1">Option 1</option> <option value="option 2">Option 2</option> <option value="option 3">Option 3</option> <option value="option 4">Option 4</option> <option value="option 5">Option 5</option> </select> </div><!-- /.form-row --> <input type="submit" value="חפשו מלונות" class="form-btn" /> </div><!-- /.search-tab-inner --> </div><!-- /.search-tab --> <div class="search-tab" id="searchPackagesMobile"> <ul class="list-radios"> <li> <div class="radio"> <input type="radio" name="form-group-packages" id="form-group-packages-normal" value="חיפוש רגיל" checked="checked" /> <label class="form-label" for="form-group-packages-normal">חיפוש רגיל</label> </div><!-- /.radio --> </li> <li> <div class="radio"> <input type="radio" name="form-group-packages" id="form-group-packages-all-destinations" value="חיפוש לכל היעדים במקביל" /> <label class="form-label" for="form-group-packages-all-destinations">חיפוש לכל היעדים במקביל</label> </div><!-- /.radio --> </li> </ul><!-- /.list-radios --> <div class="form-row has-select"> <select name="field-packages-departure-location" id="field-packages-departure-location" class="select"> <option value="עיר...">עיר...</option> <option value="option 1">Option 1</option> <option value="option 2">Option 2</option> <option value="option 3">Option 3</option> <option value="option 4">Option 4</option> <option value="option 5">Option 5</option> </select> </div><!-- /.form-row --> <div class="date-range"> <div class="form-row"> <div class="form-col has-button"> <input type="text" readonly="readonly" class="field datepicker-field depart" value="" name="field-packages-departure-date26" id="field-packages-departure-date26" placeholder="תאריך כניסה" data-title="תאריך כניסה" /> </div><!-- /.form-col --> <div class="form-col has-button"> <input type="text" readonly="readonly" class="field datepicker-field arrive" value="" name="field-packages-arrival-date26" id="field-packages-arrival-date26" placeholder="תאריך יציאה" data-title="תאריך יציאה" /> </div><!-- /.form-col --> </div><!-- /.form-row --> </div><!-- /.date-range --> <div class="form-row has-select"> <select name="field-packages-room-composition" id="field-packages-room-composition" class="select"> <option value="הרכב החדר...">הרכב החדר...</option> <option value="option 1">Option 1</option> <option value="option 2">Option 2</option> <option value="option 3">Option 3</option> <option value="option 4">Option 4</option> <option value="option 5">Option 5</option> </select> </div><!-- /.form-row --> <input type="submit" value="חפשו חבילות" class="form-btn" /> </div><!-- /.search-tab --> <div class="search-tab" id="searchCarsMobile"> <div class="form-row has-select"> <select name="field-cars-departure-location" id="field-cars-departure-location" class="select"> <option value="מדינת איסוף...">מדינת איסוף...</option> <option value="option 1">Option 1</option> <option value="option 2">Option 2</option> <option value="option 3">Option 3</option> <option value="option 4">Option 4</option> <option value="option 5">Option 5</option> </select> </div><!-- /.form-row --> <div class="form-row has-select"> <select name="field-cars-arrival-location" id="field-cars-arrival-location" class="select"> <option value="יעד איסוף...">יעד איסוף...</option> <option value="option 1">Option 1</option> <option value="option 2">Option 2</option> <option value="option 3">Option 3</option> <option value="option 4">Option 4</option> <option value="option 5">Option 5</option> </select> </div><!-- /.form-row --> <div class="date-range"> <div class="form-row"> <div class="form-col has-button"> <input type="text" readonly="readonly" class="field datepicker-field depart" value="" name="field-cars-departure-date27" id="field-cars-departure-date27" placeholder="תאריך איסוף" data-title="תאריך איסוף" /> </div><!-- /.form-col --> <div class="form-col has-select"> <select name="field-cars-departure-time" id="field-cars-departure-time" class="select"> <option value="שעת איסוף">שעת איסוף</option> <option value="option 1">Option 1</option> <option value="option 2">Option 2</option> <option value="option 3">Option 3</option> <option value="option 4">Option 4</option> <option value="option 5">Option 5</option> </select> </div><!-- /.form-col --> </div><!-- /.form-row --> <div class="form-row has-select"> <select name="field-cars-return-location" id="field-cars-return-location" class="select"> <option value="יעד החזרה...">יעד החזרה...</option> <option value="option 1">Option 1</option> <option value="option 2">Option 2</option> <option value="option 3">Option 3</option> <option value="option 4">Option 4</option> <option value="option 5">Option 5</option> </select> </div><!-- /.form-row --> <div class="form-row"> <div class="form-col has-button"> <input type="text" readonly="readonly" class="field datepicker-field arrive" value="" name="field-cars-return-date28" id="field-cars-return-date28" placeholder="תאריך החזרה" data-title="תאריך החזרה" /> </div><!-- /.form-col --> <div class="form-col has-select"> <select name="field-cars-return-time" id="field-cars-return-time" class="select"> <option value="שעת החזרה">שעת החזרה</option> <option value="option 1">Option 1</option> <option value="option 2">Option 2</option> <option value="option 3">Option 3</option> <option value="option 4">Option 4</option> <option value="option 5">Option 5</option> </select> </div><!-- /.form-col --> </div><!-- /.form-row --> </div><!-- /.date-range --> <div class="form-row"> <div class="form-col"> <input type="text" class="field" value="" name="field-cars-driver-age" id="field-cars-driver-age" placeholder="גיל הנהג..." /> </div><!-- /.form-col --> </div><!-- /.form-row --> <input type="submit" value="חפשו חבילות" class="form-btn" /> </div><!-- /.search-tab --> <div class="search-tab" id="searchToursMobile"> <ul class="list-categories-group"> <li class="current"> <a href="#searchToursTripMobile" class="tab-toggle">חיפוש טיולים</a> </li> <li> <a href="#searchToursGoalsMobile" class="tab-toggle">יעדים נפוצים</a> </li> </ul><!-- /.list-categories-group --> <div class="search-tab-inner visible" id="searchToursTripMobile"> <div class="form-row has-select"> <select name="field-tours-trip-area" id="field-tours-trip-area" class="select"> <option value="איזור...">איזור...</option> <option value="option 1">Option 1</option> <option value="option 2">Option 2</option> <option value="option 3">Option 3</option> <option value="option 4">Option 4</option> <option value="option 5">Option 5</option> </select> </div><!-- /.form-row --> <div class="form-row has-select"> <select name="field-tours-trip-country" id="field-tours-trip-country" class="select"> <option value="מדינה...">מדינה...</option> <option value="option 1">Option 1</option> <option value="option 2">Option 2</option> <option value="option 3">Option 3</option> <option value="option 4">Option 4</option> <option value="option 5">Option 5</option> </select> </div><!-- /.form-row --> <div class="form-row has-select"> <select name="field-tours-trip-category" id="field-tours-trip-category" class="select"> <option value="קטגוריה...">קטגוריה...</option> <option value="option 1">Option 1</option> <option value="option 2">Option 2</option> <option value="option 3">Option 3</option> <option value="option 4">Option 4</option> <option value="option 5">Option 5</option> </select> </div><!-- /.form-row --> <div class="form-row has-select"> <select name="field-tours-trip-category" id="field-tours-trip-category" class="select"> <option value="חודש...">חודש...</option> <option value="option 1">Option 1</option> <option value="option 2">Option 2</option> <option value="option 3">Option 3</option> <option value="option 4">Option 4</option> <option value="option 5">Option 5</option> </select> </div><!-- /.form-row --> <input type="submit" value="חפשו טיול" class="form-btn" /> </div><!-- /.search-tab-inner --> <div class="search-tab-inner" id="searchToursGoalsMobile"> <ul class="list-tours"> <li> <a href="#">טיולי ג’יפים</a> </li> <li> <a href="#">טיולי משפחות</a> </li> <li> <a href="#">טיולי חגים</a> </li> <li> <a href="#">טיולים בספרד</a> </li> <li> <a href="#">טיולים בתאילנד</a> </li> <li> <a href="#">טיולים בסין</a> </li> <li> <a href="#">טיולים בצרפת</a> </li> <li> <a href="#">טיולים באיטליה</a> </li> <li> <a href="#">טיולים במרוקו</a> </li> </ul><!-- /.list-tours --> </div><!-- /.search-tab-inner --> </div><!-- /.search-tab --> </div><!-- /.search-tabs --> </form> </div><!-- /.section-search-mobile --> <section class="section-slideshow"> <ul class="slides"> <li class="slide"> <img src="css/images/temp/slide1.jpg" alt="" width="1680" height="600" class="fullsize" /> <a href="#" class="slide-content slide-content-blue"> פורטל המשפחות <small>של נופש ישיר</small> </a><!-- /.slide-content --> </li><!-- /.slide --> <li class="slide"> <img src="css/images/temp/slide2.jpg" alt="" width="1680" height="600" class="fullsize" /> <a href="#" class="slide-content slide-content-yellow"> כפרי נופש למשפחות <small>קייץ 2015</small> </a><!-- /.slide-content --> </li><!-- /.slide --> <li class="slide"> <img src="css/images/temp/slide3.jpg" alt="" width="1680" height="600" class="fullsize" /> <a href="#" class="slide-content slide-content-default"> <strong>טסים ללונדון בחורף!<br />חגיגת קניות אחרי הקריסמס</strong> <em> <sup>החל מ-</sup><sub>$</sub>399 </em> <span class="btn btn-yellow">לפרטים והזמנות</span> </a><!-- /.slide-content --> </li><!-- /.slide --> </ul><!-- /.slides --> </section><!-- /.section-slideshow --> <div class="section-slideshow section-slideshow-mobile"> <ul class="slides"> <li class="slide"> <a href="#"> <img src="css/images/temp/mobile/slide1.jpg" alt="" /> <span class="slide-overlay"> טסים ללונדון בחורף!<br />חגיגת קניות אחרי הקריסמס <strong> <sup>החל מ-</sup><sub>$</sub>399 <small class="btn btn-yellow">לפרטים והזמנות</small> </strong> </span> </a> </li><!-- /.slide --> <li class="slide"> <a href="#"> <img src="css/images/temp/mobile/slide1.jpg" alt="" /> <span class="slide-overlay"> טסים ללונדון בחורף!<br />חגיגת קניות אחרי הקריסמס <strong> <sup>החל מ-</sup><sub>$</sub>399 <small class="btn btn-yellow">לפרטים והזמנות</small> </strong> </span> </a> </li><!-- /.slide --> <li class="slide"> <a href="#"> <img src="css/images/temp/mobile/slide1.jpg" alt="" /> <span class="slide-overlay"> טסים ללונדון בחורף!<br />חגיגת קניות אחרי הקריסמס <strong> <sup>החל מ-</sup><sub>$</sub>399 <small class="btn btn-yellow">לפרטים והזמנות</small> </strong> </span> </a> </li><!-- /.slide --> </ul><!-- /.slides --> </div><!-- /.section-slideshow --> <section class="section-vacations"> <div class="shell"> <header class="section-head"> <h2> חופשות משפחתיות <em>מקרבים את כולם יחד</em> </h2> </header><!-- /.section-head --> <div class="section-body"> <div class="slideshow-vacations"> <ul class="slides"> <li class="slide"> <a href="#"> <img src="css/images/temp/trips1.jpg" alt="" /> <span class="btn btn-blue">קטגוריה א</span> </a> </li><!-- /.slide --> <li class="slide"> <a href="#"> <img src="css/images/temp/trips2.jpg" alt="" /> <span class="btn btn-blue">קטגוריה ב</span> </a> </li><!-- /.slide --> <li class="slide"> <a href="#"> <img src="css/images/temp/trips3.jpg" alt="" /> <span class="btn btn-blue">קטגוריה ג</span> </a> </li><!-- /.slide --> <li class="slide"> <a href="#"> <img src="css/images/temp/trips4.jpg" alt="" /> <span class="btn btn-blue">קטגוריה ד</span> </a> </li><!-- /.slide --> <li class="slide"> <a href="#"> <img src="css/images/temp/trips5.jpg" alt="" /> <span class="btn btn-blue">קטגוריה ה</span> </a> </li><!-- /.slide --> </ul><!-- /.slides --> </div><!-- /.slideshow-vacations --> </div><!-- /.section-body --> </div><!-- /.shell --> </section><!-- /.section-vacations --> <section class="section-deals"> <div class="shell"> <header class="section-head"> <h2> הדילים שלנו <em>טקסט נחמד כלשהו</em> </h2> </header><!-- /.section-head --> <div class="section-body"> <div class="slideshow-deals"> <ul class="slides"> <li class="slide"> <figure class="slide-image"> <a href="#"> <img src="css/images/temp/offers-banner1.jpg" alt="" /> <span class="btn btn-blue btn-blue-large">טסים</span> </a> </figure><!-- /.slide-image --> <ul class="list-deals"> <li> <a href="#"> <img src="css/images/temp/deals-flights1.jpg" alt="" /> <em>טיסת צ’רטר ללונדון</em> 09/08/2014-12/08/2014 <span class="deal-price">החל מ-<strong>$519</strong></span> </a> </li> <li> <a href="#"> <img src="css/images/temp/deals-flights2.jpg" alt="" /> <em>טיסת צ’רטר לפריז</em> 09/08/2014-12/08/2014 <span class="deal-price">החל מ-<strong>$444</strong></span> </a> </li> <li> <a href="#"> <img src="css/images/temp/deals-flights3.jpg" alt="" /> <em>טיסת צ’רטר לברלין</em> 09/08/2014-12/08/2014 <span class="deal-price">החל מ-<strong>$299</strong></span> </a> </li> </ul><!-- /.list-deals --> </li><!-- /.slide --> <li class="slide"> <figure class="slide-image"> <a href="#"> <img src="css/images/temp/offers-banner2.jpg" alt="" /> <span class="btn btn-blue btn-blue-large">נופשים בחו”ל</span> </a> </figure><!-- /.slide-image --> <ul class="list-deals"> <li> <a href="#"> <img src="css/images/temp/deals-abroad1.jpg" alt="" /> <em>חבילת נופש ברודוס</em> <div class="rating" data-readonly="true" data-score="4" data-path="css/images" data-on="star-on.png" data-off="star-off.png"></div><!-- /.rating --> 09/08/2014-12/08/2014 <span class="deal-price">החל מ-<strong>$419</strong></span> </a> </li> <li> <a href="#"> <img src="css/images/temp/deals-abroad2.jpg" alt="" /> <em>חבילה לפסטיבל המסכות בונציה</em> <div class="rating" data-readonly="true" data-score="3" data-path="css/images" data-on="star-on.png" data-off="star-off.png"></div><!-- /.rating --> 09/08/2014-12/08/2014 <span class="deal-price">החל מ-<strong>$549</strong></span> </a> </li> <li> <a href="#"> <img src="css/images/temp/deals-abroad3.jpg" alt="" /> <em>סופ”ש בבודפשט</em> <div class="rating" data-readonly="true" data-score="3" data-path="css/images" data-on="star-on.png" data-off="star-off.png"></div><!-- /.rating --> 09/08/2014-12/08/2014 <span class="deal-price">החל מ-<strong>$389</strong></span> </a> </li> </ul><!-- /.list-deals --> </li><!-- /.slide --> <li class="slide"> <figure class="slide-image"> <a href="#"> <img src="css/images/temp/offers-banner3.jpg" alt="" /> <span class="btn btn-blue btn-blue-large">נופשים בארץ</span> </a> </figure><!-- /.slide-image --> <ul class="list-deals"> <li> <a href="#"> <img src="css/images/temp/deals-israel1.jpg" alt="" /> <em>דן פנורמה, אילת</em> <div class="rating" data-readonly="true" data-score="4" data-path="css/images" data-on="star-on.png" data-off="star-off.png"></div><!-- /.rating --> 09/08/2014-12/08/2014 <span class="deal-price">החל מ-<strong>$419</strong></span> </a> </li> <li> <a href="#"> <img src="css/images/temp/deals-israel2.jpg" alt="" /> <em>רימונים, אילת</em> <div class="rating" data-readonly="true" data-score="5" data-path="css/images" data-on="star-on.png" data-off="star-off.png"></div><!-- /.rating --> 09/08/2014-12/08/2014 <span class="deal-price">החל מ-<strong>$549</strong></span> </a> </li> <li> <a href="#"> <img src="css/images/temp/deals-israel3.jpg" alt="" /> <em>הרודס, ים המלח</em> <div class="rating" data-readonly="true" data-score="4" data-path="css/images" data-on="star-on.png" data-off="star-off.png"></div><!-- /.rating --> 09/08/2014-12/08/2014 <span class="deal-price">החל מ-<strong>$389</strong></span> </a> </li> </ul><!-- /.list-deals --> </li><!-- /.slide --> </ul><!-- /.slides --> </div><!-- /.slideshow-deals --> </div><!-- /.section-body --> </div><!-- /.shell --> </section><!-- /.section-deals --> <div class="section-deals section-deals-mobile"> <h2> הדילים שלנו <em>טקסט נחמד כלשהו</em> </h2> <ul class="nav-tabs"> <li class="current"> <a href="#tabDeals1" class="tab-toggle">נופש בחו”ל</a> </li> <li> <a href="#tabDeals2" class="tab-toggle">נופש בארץ</a> </li> <li> <a href="#tabDeals3" class="tab-toggle">מיוחדים</a> </li> </ul><!-- /.nav-tabs --> <div class="section-tabs"> <div class="tab visible" id="tabDeals1"> <ul class="list-deals"> <li> <a href="#"> <img src="css/images/temp/deals-flights1.jpg" alt="" /> <em>טיסת צ’רטר ללונדון</em> 09/08/2014-12/08/2014 <span class="deal-price">החל מ-<strong>$519</strong></span> </a> </li> <li> <a href="#"> <img src="css/images/temp/deals-flights2.jpg" alt="" /> <em>טיסת צ’רטר לפריז</em> 09/08/2014-12/08/2014 <span class="deal-price">החל מ-<strong>$444</strong></span> </a> </li> <li> <a href="#"> <img src="css/images/temp/deals-flights3.jpg" alt="" /> <em>טיסת צ’רטר לברלין</em> 09/08/2014-12/08/2014 <span class="deal-price">החל מ-<strong>$299</strong></span> </a> </li> </ul><!-- /.list-deals --> </div><!-- /#tabDeals1.tab --> <div class="tab" id="tabDeals2"> <ul class="list-deals"> <li> <a href="#"> <img src="css/images/temp/deals-abroad1.jpg" alt="" /> <em>חבילת נופש ברודוס</em> <div class="rating" data-readonly="true" data-score="4" data-path="css/images" data-on="star-on.png" data-off="star-off.png"></div><!-- /.rating --> 09/08/2014-12/08/2014 <span class="deal-price">החל מ-<strong>$419</strong></span> </a> </li> <li> <a href="#"> <img src="css/images/temp/deals-abroad2.jpg" alt="" /> <em>חבילה לפסטיבל המסכות בונציה</em> <div class="rating" data-readonly="true" data-score="3" data-path="css/images" data-on="star-on.png" data-off="star-off.png"></div><!-- /.rating --> 09/08/2014-12/08/2014 <span class="deal-price">החל מ-<strong>$549</strong></span> </a> </li> <li> <a href="#"> <img src="css/images/temp/deals-abroad3.jpg" alt="" /> <em>סופ”ש בבודפשט</em> <div class="rating" data-readonly="true" data-score="3" data-path="css/images" data-on="star-on.png" data-off="star-off.png"></div><!-- /.rating --> 09/08/2014-12/08/2014 <span class="deal-price">החל מ-<strong>$389</strong></span> </a> </li> </ul><!-- /.list-deals --> </div><!-- /#tabDeals2.tab --> <div class="tab" id="tabDeals3"> <ul class="list-deals"> <li> <a href="#"> <img src="css/images/temp/deals-israel1.jpg" alt="" /> <em>דן פנורמה, אילת</em> <div class="rating" data-readonly="true" data-score="4" data-path="css/images" data-on="star-on.png" data-off="star-off.png"></div><!-- /.rating --> 09/08/2014-12/08/2014 <span class="deal-price">החל מ-<strong>$419</strong></span> </a> </li> <li> <a href="#"> <img src="css/images/temp/deals-israel2.jpg" alt="" /> <em>רימונים, אילת</em> <div class="rating" data-readonly="true" data-score="5" data-path="css/images" data-on="star-on.png" data-off="star-off.png"></div><!-- /.rating --> 09/08/2014-12/08/2014 <span class="deal-price">החל מ-<strong>$549</strong></span> </a> </li> <li> <a href="#"> <img src="css/images/temp/deals-israel3.jpg" alt="" /> <em>הרודס, ים המלח</em> <div class="rating" data-readonly="true" data-score="4" data-path="css/images" data-on="star-on.png" data-off="star-off.png"></div><!-- /.rating --> 09/08/2014-12/08/2014 <span class="deal-price">החל מ-<strong>$389</strong></span> </a> </li> </ul><!-- /.list-deals --> </div><!-- /#tabDeals3.tab --> </div><!-- /.section-tabs --> </div><!-- /.section-deals --> <section class="section-subscribe"> <div class="shell"> <div class="subscribe"> <form action="?" method="post"> <label for="mail"> <strong>קבלו את הדיוור שלנו בחינם!</strong> שילחו אלי רעיונות לחופשה, כתבות, טיפים ואת הדילים החמים שלנו </label> <input type="email" id="mail" name="mail" value="" placeholder="רשמו את כתובת הדואר אלקטרוני שלכם..." class="subscribe-field" /> <input type="submit" value="הרשמה" class="btn btn-yellow subscribe-btn" /> </form> </div><!-- /.subscribe --> </div><!-- /.shell --> </section><!-- /.section-subscribe --> <section class="section-destinations"> <div class="shell"> <header class="section-head"> <h2> יעדים בעולם <em>אין ספור אטרקציות ומקומות בילוי למשפחות</em> </h2> </header><!-- /.section-head --> <div class="section-body"> <div class="slideshow-destinations"> <ul class="slides"> <li class="slide"> <figure> <a href="#"> <img src="css/images/temp/destinations1.jpg" alt="" /> <span class="overlay"> <strong>פריז, צרפת</strong> <p>מה דעתך לקום בבוקר בעוד שבוע מהיום ולראות דבר ראשון כשאתה מציץ דרך החלון את מגדל אייפל הניצב בגאון, את בזיליקת הלב הקדוש המרהיבה ביופייה או את העיר הרומנטית ביותר בעולם כולה נפרשת לעיניך?<br />זוהי פריז, עיר האורות ובירת האופנה העולמית, המושכת אליה מליוני תיירים, זוגות אוהבים, משפחות, אנשי עסקים ושוחרי אמנות. <em>הכנסו לפרטים נוספים»</em></p> </span> </a> </figure> </li><!-- /.slide --> <li class="slide"> <figure> <a href="#"> <img src="css/images/temp/destinations2.jpg" alt="" /> <span class="overlay"> <strong>לונדון, אנגליה</strong> <p>מה דעתך לקום בבוקר בעוד שבוע מהיום ולראות דבר ראשון כשאתה מציץ דרך החלון את מגדל אייפל הניצב בגאון, את בזיליקת הלב הקדוש המרהיבה ביופייה או את העיר הרומנטית ביותר בעולם כולה נפרשת לעיניך?<br />זוהי פריז, עיר האורות ובירת האופנה העולמית, המושכת אליה מליוני תיירים, זוגות אוהבים, משפחות, אנשי עסקים ושוחרי אמנות. <em>הכנסו לפרטים נוספים»</em></p> </span> </a> </figure> </li><!-- /.slide --> <li class="slide"> <figure> <a href="#"> <img src="css/images/temp/destinations3.jpg" alt="" /> <span class="overlay"> <strong>אמסטרדם, הולנד</strong> <p>מה דעתך לקום בבוקר בעוד שבוע מהיום ולראות דבר ראשון כשאתה מציץ דרך החלון את מגדל אייפל הניצב בגאון, את בזיליקת הלב הקדוש המרהיבה ביופייה או את העיר הרומנטית ביותר בעולם כולה נפרשת לעיניך?<br />זוהי פריז, עיר האורות ובירת האופנה העולמית, המושכת אליה מליוני תיירים, זוגות אוהבים, משפחות, אנשי עסקים ושוחרי אמנות. <em>הכנסו לפרטים נוספים»</em></p> </span> </a> </figure> </li><!-- /.slide --> <li class="slide slide-reverse"> <figure> <a href="#"> <img src="css/images/temp/destinations4.jpg" alt="" /> <span class="overlay"> <strong>כרתים, יוון</strong> <p>מה דעתך לקום בבוקר בעוד שבוע מהיום ולראות דבר ראשון כשאתה מציץ דרך החלון את מגדל אייפל הניצב בגאון, את בזיליקת הלב הקדוש המרהיבה ביופייה או את העיר הרומנטית ביותר בעולם כולה נפרשת לעיניך?<br />זוהי פריז, עיר האורות ובירת האופנה העולמית, המושכת אליה מליוני תיירים, זוגות אוהבים, משפחות, אנשי עסקים ושוחרי אמנות. <em>הכנסו לפרטים נוספים»</em></p> </span> </a> </figure> </li><!-- /.slide --> <li class="slide"> <figure> <a href="#"> <img src="css/images/temp/destinations1.jpg" alt="" /> <span class="overlay"> <strong>פריז, צרפת</strong> <p>מה דעתך לקום בבוקר בעוד שבוע מהיום ולראות דבר ראשון כשאתה מציץ דרך החלון את מגדל אייפל הניצב בגאון, את בזיליקת הלב הקדוש המרהיבה ביופייה או את העיר הרומנטית ביותר בעולם כולה נפרשת לעיניך?<br />זוהי פריז, עיר האורות ובירת האופנה העולמית, המושכת אליה מליוני תיירים, זוגות אוהבים, משפחות, אנשי עסקים ושוחרי אמנות. <em>הכנסו לפרטים נוספים»</em></p> </span> </a> </figure> </li><!-- /.slide --> <li class="slide"> <figure> <a href="#"> <img src="css/images/temp/destinations2.jpg" alt="" /> <span class="overlay"> <strong>לונדון, אנגליה</strong> <p>מה דעתך לקום בבוקר בעוד שבוע מהיום ולראות דבר ראשון כשאתה מציץ דרך החלון את מגדל אייפל הניצב בגאון, את בזיליקת הלב הקדוש המרהיבה ביופייה או את העיר הרומנטית ביותר בעולם כולה נפרשת לעיניך?<br />זוהי פריז, עיר האורות ובירת האופנה העולמית, המושכת אליה מליוני תיירים, זוגות אוהבים, משפחות, אנשי עסקים ושוחרי אמנות. <em>הכנסו לפרטים נוספים»</em></p> </span> </a> </figure> </li><!-- /.slide --> <li class="slide"> <figure> <a href="#"> <img src="css/images/temp/destinations3.jpg" alt="" /> <span class="overlay"> <strong>אמסטרדם, הולנד</strong> <p>מה דעתך לקום בבוקר בעוד שבוע מהיום ולראות דבר ראשון כשאתה מציץ דרך החלון את מגדל אייפל הניצב בגאון, את בזיליקת הלב הקדוש המרהיבה ביופייה או את העיר הרומנטית ביותר בעולם כולה נפרשת לעיניך?<br />זוהי פריז, עיר האורות ובירת האופנה העולמית, המושכת אליה מליוני תיירים, זוגות אוהבים, משפחות, אנשי עסקים ושוחרי אמנות. <em>הכנסו לפרטים נוספים»</em></p> </span> </a> </figure> </li><!-- /.slide --> <li class="slide slide-reverse"> <figure> <a href="#"> <img src="css/images/temp/destinations4.jpg" alt="" /> <span class="overlay"> <strong>כרתים, יוון</strong> <p>מה דעתך לקום בבוקר בעוד שבוע מהיום ולראות דבר ראשון כשאתה מציץ דרך החלון את מגדל אייפל הניצב בגאון, את בזיליקת הלב הקדוש המרהיבה ביופייה או את העיר הרומנטית ביותר בעולם כולה נפרשת לעיניך?<br />זוהי פריז, עיר האורות ובירת האופנה העולמית, המושכת אליה מליוני תיירים, זוגות אוהבים, משפחות, אנשי עסקים ושוחרי אמנות. <em>הכנסו לפרטים נוספים»</em></p> </span> </a> </figure> </li><!-- /.slide --> </ul><!-- /.slides --> </div><!-- /.slideshow-destinations --> </div><!-- /.section-body --> </div><!-- /.shell --> </section><!-- /.section-destinations --> <footer class="footer"> <div class="shell"> <nav class="footer-nav"> <ul> <li> <a href="#">טיסות »</a> <ul> <li> <a href="#">טיסות זולות לאמסטרדם</a> </li> <li> <a href="#">טיסות זולות ללונדון</a> </li> <li> <a href="#">טיסות זולות לברלין</a> </li> <li> <a href="#">טיסות זולות לניו יורק</a> </li> <li> <a href="#">טיסות זולות לתאילנד</a> </li> <li> <a href="#">טיסות זולות לפריז</a> </li> <li> <a href="#">טיסות זולות לברצלונה</a> </li> <li> <a href="#">טיסות זולות לרומא</a> </li> <li> <a href="#">אינדקס</a> </li> </ul> </li> <li> <a href="#">חבילות »</a> <ul> <li> <a href="#">חבילות נופש לברצלונה</a> </li> <li> <a href="#">חבילות נופש לכרתים</a> </li> <li> <a href="#">חבילות נופש לפראג</a> </li> <li> <a href="#">חבילות נופש לאמסטרדם</a> </li> <li> <a href="#">חבילות נופש לאנטליה</a> </li> <li> <a href="#">חבילות נופש לרודוס</a> </li> <li> <a href="#">חבילות נופש לברלין</a> </li> <li> <a href="#">חבילות נופש ללונדון</a> </li> <li> <a href="#">אינדקס</a> </li> </ul> </li> <li> <a href="#">מלונות »</a> <ul> <li> <a href="#">מלונות בלונדון</a> </li> <li> <a href="#">מלונות בניו יורק</a> </li> <li> <a href="#">מלונות באמסטרדם</a> </li> <li> <a href="#">מלונות בפריז</a> </li> <li> <a href="#">מלונות בברלין</a> </li> <li> <a href="#">מלונות בתאילנד</a> </li> <li> <a href="#">מלונות בכרתים</a> </li> <li> <a href="#">מלונות בקוסמוי</a> </li> <li> <a href="#">אינדקס</a> </li> </ul> </li> <li class="col-abs1"> <a href="#">מאורגנים »</a> <ul> <li> <a href="#">טיול מאורגן לסין</a> </li> <li> <a href="#">טיול מאורגן לאיטליה</a> </li> <li> <a href="#">טיול מאורגן לתאילנד</a> </li> <li> <a href="#">טיול מאורגן לברצלונה</a> </li> <li> <a href="#">טיולי משפחות</a> </li> </ul> </li> <li class="col-abs2"> <a href="#">נופש בארץ »</a> <ul> <li> <a href="#">טיסות לאילת</a> </li> <li> <a href="#">מלונות באילת</a> </li> <li> <a href="#">מלונות ים המלח</a> </li> <li> <a href="#">מלונות בארץ</a> </li> <li> <a href="#">אינדקס</a> </li> </ul> </li> <li> <a href="#">מוצרים נוספים</a> <ul> <li> <a href="#"> השכרת רכב</a> </li> <li> <a href="#">ספורט</a> </li> <li> <a href="#">הפלגות</a> </li> <li> <a href="#">סקי</a> </li> <li> <a href="#">נופש לצעירים</a> </li> <li> <a href="#">הופעות</a> </li> <li> <a href="#">נופש למשפחות</a> </li> </ul> </li> <li> <a href="#">נופש ישיר</a> <ul> <li> <a href="#">דרושים</a> </li> <li> <a href="#">RSS</a> </li> <li> <a href="#">תוכנית שותפים</a> </li> <li> <a href="#">אבטחת מידע</a> </li> <li> <a href="#">שירות לקוחות</a> </li> <li> <a href="#">קישורים מומלצים</a> </li> <li> <a href="#">תנאי שינוי ביטול</a> </li> <li> <a href="#">תהליך ההזמנה</a> </li> <li> <a href="#">אודות מגה נופש ישיר</a> </li> </ul> </li> </ul> </nav><!-- /.footer-nav --> <div class="footer-bar"> <div class="socials"> <ul> <li> <a href="https://www.youtube.com/" target="_blank" class="link-youtube">Watch us on Youtube</a> </li> <li> <a href="https://www.twitter.com/" target="_blank" class="link-twitter">Follow us on Twitter</a> </li> <li> <a href="https://www.plus.google.com/" target="_blank" class="link-googleplus">Find us on Google Plus</a> </li> <li> <a href="https://www.facebook.com/" target="_blank" class="link-facebook">Find us on Facebook</a> </li> </ul> </div><!-- /.socials --> <div class="secured"> <img src="css/images/ico-thawte.png" alt="" /> אתר מאובטח </div><!-- /.secured --> </div><!-- /.footer-bar --> <div class="copyright"> <p>© כל הזכויות שמורות - מגה נופש ישיר 2014 </p> </div><!-- /.copyright --> </div><!-- /.shell --> </footer><!-- /.footer --> <div class="footer footer-mobile"> <nav class="footer-nav"> <ul> <li> <a href="#">גירסת אתר מלאה</a> </li> </ul> </nav><!-- /.footer-nav --> <div class="subscribe"> <form action="?" method="post"> <label for="mail"> <strong>קבלו את הדיוור שלנו בחינם!</strong> שילחו אלי רעיונות לחופשה, כתבות, טיפים ואת הדילים החמים שלנו </label> <input type="email" id="mail" name="mail" value="" placeholder="רשמו את כתובת הדואר אלקטרוני שלכם..." class="subscribe-field" /> <input type="submit" value="הרשמה" class="subscribe-btn" /> </form> </div><!-- /.subscribe --> <div class="socials"> <span class="socials-label">עקבו אחרינו:</span> <ul> <li> <a href="https://www.youtube.com/" class="link-youtube" target="_blank"> <i class="ico-youtube"></i> </a> </li> <li> <a href="https://www.twitter.com/" class="link-twitter" target="_blank"> <i class="ico-twitter"></i> </a> </li> <li> <a href="https://www.plus.google.com" class="link-googleplus" target="_blank"> <i class="ico-googleplus"></i> </a> </li> <li> <a href="https://www.facebook.com/" class="link-facebook" target="_blank"> <i class="ico-facebook"></i> </a> </li> </ul> </div><!-- /.socials --> <div class="copyright"> <p>© כל הזכויות שמורות - מגה נופש ישיר 2015 </p> </div><!-- /.copyright --> </div><!-- /.footer --> </div><!-- /.wrapper --> <script src="js/jquery-1.11.0.min.js"></script> <script src="js/jquery-ui-1.10.4.custom.min.js"></script> <script src="js/jquery.raty.js"></script> <script src="js/jquery.flexslider.js"></script> <script src="js/functions.js"></script> <script src="js/functions-mobile.js"></script> </body> </html>
/** Table of Contents updated on 2015-02-11 14:27:47 01. Reset ----------------------------------------- (line 75) 02. Global ---------------------------------------- (line 83) 03. Body ------------------------------------------ (line 130) 04. Links ----------------------------------------- (line 136) Links Base ------------------------------------ (line 139) Telephone Numbers ----------------------------- (line 149) 05. Headings -------------------------------------- (line 157) 06. Structure ------------------------------------- (line 170) 07. Helpers --------------------------------------- (line 176) 08. Clearfix -------------------------------------- (line 184) 09. Sprite ---------------------------------------- (line 194) Sprite Base ----------------------------------- (line 197) Icons ----------------------------------------- (line 201) 10. Buttons --------------------------------------- (line 232) Buttons Base ---------------------------------- (line 235) Button Yellow --------------------------------- (line 241) Button Blue ----------------------------------- (line 248) 11. Form Elements --------------------------------- (line 258) 12. Lists ----------------------------------------- (line 339) Lists Base ------------------------------------ (line 342) List Deals ------------------------------------ (line 351) List Search Categories ------------------------ (line 365) List Categories Group ------------------------- (line 384) List Radios ----------------------------------- (line 394) List Form Actions ----------------------------- (line 400) 13. Navigations ----------------------------------- (line 412) Main Navigation ------------------------------- (line 415) Nav Dropdown ---------------------------------- (line 437) Breadcrumbs ----------------------------------- (line 482) Footer Navigation ----------------------------- (line 498) Socials --------------------------------------- (line 509) 14. Forms ----------------------------------------- (line 522) Search Form ----------------------------------- (line 525) Category Search Form -------------------------- (line 622) Subscribe Form -------------------------------- (line 675) 15. Header ---------------------------------------- (line 690) 16. Sections -------------------------------------- (line 723) Fullsize container ---------------------------- (line 726) Section Slideshow ----------------------------- (line 730) Search ---------------------------------------- (line 734) Section Vacations ----------------------------- (line 739) Section Deals --------------------------------- (line 747) Section Subscribe ----------------------------- (line 755) Section Destinations -------------------------- (line 759) Section Category Search ----------------------- (line 767) Section Flight Deals -------------------------- (line 779) Section Continental --------------------------- (line 783) Section Flights Destinations ------------------ (line 790) Section Links --------------------------------- (line 797) Section Articles ------------------------------ (line 813) 17. Sliders --------------------------------------- (line 840) Search Slideshow ------------------------------ (line 854) Slideshow Vacations --------------------------- (line 886) Slideshow Deals ------------------------------- (line 895) Slideshow Destinations ------------------------ (line 905) Slideshow Flights Deals ----------------------- (line 939) Slideshow Continents -------------------------- (line 978) Slideshow Flights Destinations ---------------- (line 1000) 18. Footer ---------------------------------------- (line 1016) 19. Modals ---------------------------------------- (line 1033) Modals Base ----------------------------------- (line 1036) Modal Destinations ---------------------------- (line 1051) 20. jQuery UI Autocomplete Restyle ---------------- (line 1067) 21. jQuery UI Datepicker Restyle ------------------ (line 1082) 22. Combined buttons backgrounds ------------------ (line 1148) 23. Hidden Elements ------------------------------- (line 1217) 24. Transitions ----------------------------------- (line 1235) 25. Responsive ------------------------------------ (line 1273) **/ /* ------------------------------------------------------------ *\ Reset \* ------------------------------------------------------------ */ * { padding: 0; margin: 0; outline: 0; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-tap-highlight-color: transparent; } *:before, *:after { box-sizing: inherit; -webkit-box-sizing: inherit; -moz-box-sizing: inherit; } /* ------------------------------------------------------------ *\ Global \* ------------------------------------------------------------ */ body, html { height: 100%; } a img, table, iframe, fieldset { border: 0 none; } img, iframe, video, audio, object { max-width: 100%; } img { height: auto; vertical-align: middle; } a, input[type="submit"], input[type="button"], input[type="reset"], button { cursor: pointer; } sup, sub { line-height: 1; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main { display: block; } ul, ol { list-style-position: inside; } table { width: 100%; border-collapse: collapse; border-spacing: 0; } /* ------------------------------------------------------------ *\ Body \* ------------------------------------------------------------ */ body { font-family: Helvetica, Arial, sans-serif; font-size: 12px; line-height: 1.33333334; color: #757575; font-weight: normal; font-style: normal; text-transform: none; text-decoration: none; text-shadow: none; letter-spacing: 0; word-spacing: 0; direction: rtl; text-size-adjust: none; -ms-text-size-adjust: none; -webkit-text-size-adjust: none; font-smoothing: antialiased; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; background: #fff; min-width: 100%; } /* ------------------------------------------------------------ *\ Links \* ------------------------------------------------------------ */ /* Links Base */ a { color: #2196f3; text-decoration: none; } a:hover, a:active, a:focus { text-decoration: underline; } a:focus { outline: 0; } /* Telephone Numbers */ a[href^="tel"], a[href^="tel"]:hover, a[href^="tel"]:active, a[href^="tel"]:focus { color: inherit; text-decoration: none; cursor: default; } /* ------------------------------------------------------------ *\ Headings \* ------------------------------------------------------------ */ h1 { font-family: 'AlmoniTzar', sans-serif; font-size: 40px; line-height: 42px; font-weight: 700; } h1 em { font-family: 'FBMarzipan', sans-serif; font-size: 38px; line-height: 1; font-weight: 700; font-style: italic; position: relative; top: -3px; right: 3px; } h2 { font-size: 40px; line-height: 42px; font-weight: 700; font-style: italic; } h2 em { font-family: 'FBMarzipan', sans-serif; font-size: 40px; font-weight: 700; font-style: italic; } h3 { font-size: 20px; line-height: 24px; } h4 { font-size: 14px; line-height: 18px; } /* ------------------------------------------------------------ *\ Structure \* ------------------------------------------------------------ */ .shell { width: 1160px; margin: 0 auto; } /* ------------------------------------------------------------ *\ Helpers \* ------------------------------------------------------------ */ .alignleft { float: left; } .alignright { float: right; } /* ------------------------------------------------------------ *\ Clearfix \* ------------------------------------------------------------ */ .cf:after, .shell:after, .slides:after, .nav > ul, .form-row:after { content: ''; line-height: 0; display: table; clear: both; } /* ------------------------------------------------------------ *\ Sprite \* ------------------------------------------------------------ */ /* Sprite Base */ [class^="ico-"] { font-size: 0; line-height: 0; text-indent: -4000px; display: inline-block; vertical-align: middle; background-color: transparent; background-repeat: no-repeat; background-position: 50% 50%; } /* Icons */ .ico-airplane { width: 22px; height: 25px; background-image: url(images/ico-airplane.png); } .ico-automobile { width: 20px; height: 17px; background-image: url(images/ico-automobile.png); } .ico-building { width: 24px; height: 27px; background-image: url(images/ico-building.png); } .ico-bus { width: 32px; height: 26px; background-image: url(images/ico-bus.png); } .ico-calendar { width: 13px; height: 16px; background-image: url(images/ico-calendar.png); } .ico-car { width: 26px; height: 23px; background-image: url(images/ico-car.png); } .ico-chevron-left { width: 10px; height: 18px; background-image: url(images/ico-chevron-left.png); } .ico-chevron-right { width: 10px; height: 18px; background-image: url(images/ico-chevron-right.png); } .ico-envelope { width: 25px; height: 19px; background-image: url(images/ico-envelope.png); } .ico-flight { width: 87px; height: 31px; background-image: url(images/ico-flight.png); } .ico-home { width: 16px; height: 15px; background-image: url(images/ico-home.png); } .ico-hotel { width: 18px; height: 21px; background-image: url(images/ico-hotel.png); } .ico-lock { width: 20px; height: 24px; background-image: url(images/ico-lock.png); } .ico-marker { width: 8px; height: 12px; background-image: url(images/ico-marker.png); } .ico-plane { width: 10px; height: 12px; background-image: url(images/ico-plane.png); } .ico-remove { width: 13px; height: 12px; background-image: url(images/ico-remove.png); } .ico-search { width: 16px; height: 17px; background-image: url(images/ico-search.png); } .ico-suitcase { width: 26px; height: 23px; background-image: url(images/ico-suitcase.png); } .ico-user { width: 17px; height: 17px; background-image: url(images/ico-user.png); } .ico-plus, .ico-minus { width: 14px; height: 15px; background-image: url(images/ico-calc.png); } .ico-plus { background-position: 0 100%; } .ico-minus { background-position: 100% 100%; } .activated .ico-plus { background-position: 0 0; } .activated .ico-minus { background-position: 100% 0; } /* ------------------------------------------------------------ *\ Buttons \* ------------------------------------------------------------ */ /* Buttons Base */ [class^="btn"] { display: inline-block; vertical-align: middle; } [class^="btn-"]:focus { outline: 0; } /* Button Yellow */ .btn-yellow { font-size: 16px; line-height: 20px; color: #003660; font-weight: bold; text-shadow: 0 1px 0 rgba(255,255,255,.9); text-align: center; padding: 5px 23px; border: 1px solid #211d04; background-color: #ffdf0f; border-radius: 3px; box-shadow: 0 2px 2px rgba(0,0,0,.3), inset 0 0 0 1px #fff; } .btn-yellow:hover, .btn-yellow:active { text-decoration: none; background-color: #e9cf1c; } /* Button Blue */ .btn-blue { font-size: 14px; line-height: 20px; color: #fff; font-weight: bold; text-align: center; min-width: 174px; padding: 5px; border: 3px solid #c9c9c9; background-color: #2196f3; border-radius: 3px; box-shadow: 0 1px 2px rgba(0,0,0,0.5), inset 0 0 0 1px #fff; } .btn-blue:hover, .btn-blue:active { text-decoration: none; background-color: #137ed3; } .btn-blue-large { font-size: 18px; border-radius: 0; } /* ------------------------------------------------------------ *\ Form Elements \* ------------------------------------------------------------ */ ::-webkit-input-placeholder { color: #313131; opacity: 1; } :-moz-placeholder { color: #313131; opacity: 1; } ::-moz-placeholder { color: #313131; opacity: 1; } :-ms-input-placeholder { color: #313131; opacity: 1; } input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], input[type="color"], textarea, select, button, .custom-select-value { font-family: Helvetica, Arial, sans-serif; font-size: 16px; line-height: 24px; color: #313131; font-weight: normal; display: block; width: 100%; height: 36px; padding: 5px; border: 1px solid #aaa; background: #fff; border-radius: 2px; box-shadow: inset 2px 3px 4px rgba(0,0,0,.25); } .custom-select-value { white-space: nowrap; text-overflow: ellipsis; position: relative; z-index: 1; padding-left: 26px; box-shadow: none; background-color: #fff; } .custom-select-value:before, .custom-select-value:after { content: ''; width: 0; height: 0; display: block; position: absolute; top: 50%; left: 9px; border: 4px solid transparent; } .custom-select-value:before { border-top-color: #fff; z-index: 1; } .custom-select-value:after { border-top-color: #4f4f4f; margin-top: -1px; z-index: 2; } input[type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="time"]:focus, input[type="url"]:focus, input[type="color"]:focus, textarea:focus { outline: 0 none; } input[type="hidden"], .hidden { display: none; } input, textarea, button, a[href^="tel"] { -webkit-appearance: none; -moz-appearance: none; } input[type="checkbox"] { -webkit-appearance: checkbox; -moz-appearance: checkbox; } input[type="radio"] { -webkit-appearance: radio; -moz-appearance: radio; } textarea { height: 100px; overflow: auto; resize: none; -webkit-overflow-scrolling: touch; } .radio { position: relative; overflow: hidden; } .radio input { position: absolute; top: 0; right: -50px; } .radio label { font-size: 14px; line-height: 17px; color: #c7c7c7; font-weight: bold; text-shadow: 0 -1px 0 rgba(0,0,0,.5); display: block; position: relative; padding-right: 28px; cursor: pointer; } .radio label:before, .radio label:after { content: ''; position: absolute; top: 0; right: 0; border-radius: 50%; } .radio label:before { width: 17px; height: 17px; display: block; border: 1px solid #a9a9a9; background-color: #fff; box-shadow: inset 0 1px 5px rgba(0,0,0,.25); } .radio label:after { width: 9px; height: 9px; display: none; margin: 4px 4px 0 0; background-color: #2196f3; } .radio input:checked + label { color: #fff; } .radio input:checked + label:after { display: block; } /* ------------------------------------------------------------ *\ Lists \* ------------------------------------------------------------ */ /* Lists Base */ nav ul, [class^="list-"], .slides, .flex-control-nav, .flex-direction-nav, .socials ul { list-style: none outside none; } /* List Deals */ .list-deals li { border-top: 1px solid #dbdbdb; } .list-deals li:first-child { border-top: 0; } .list-deals a { color: #828282; display: block; min-height: 100px; position: relative; padding: 20px 97px 10px 10px; } .list-deals a > img { display: block; width: 70px; height: 70px; position: absolute; top: 15px; right: 15px; border: 1px solid #fff; border-radius: 50%; box-shadow: 0 0 0 5px #e0e0e0; } .list-deals a em { font-size: 14px; color: #2196f3; font-weight: bold; display: block; } .list-deals a .rating { margin-bottom: 2px; } .list-deals a .deal-price { position: absolute; bottom: 20px; left: 10px; } .list-deals a .deal-price strong { font-size: 20px; color: #004990; } .list-deals a:hover, .list-deals a:active { text-decoration: none; background-color: #fff; } /* List Search Categories */ .list-search-categories { padding: 7px 0 20px; overflow: hidden; } .list-search-categories li { width: 20%; float: right; position: relative; padding: 0 9px; } .list-search-categories li:before { content: ''; width: 1px; height: 10px; display: block; position: absolute; top: 50%; right: 0; margin-top: -5px; background-color: #8eb6d1; } .list-search-categories li:first-child:before { display: none; } .list-search-categories a { font-size: 14px; line-height: 20px; color: #fff; text-align: center; text-shadow: 0 -1px 0 rgba(0,0,0,.5); display: block; padding: 9px 0 3px; border-radius: 5px; } .list-search-categories a [class^="ico-"] { display: block; margin: 0 auto 2px; } .list-search-categories a .ico-airplane { margin: 1px auto 3px; } .list-search-categories a .ico-suitcase { margin: 2px auto 4px; } .list-search-categories a .ico-car { margin: 3px auto; } .list-search-categories a .ico-bus { margin: 1px auto 2px; } .list-search-categories a:hover, .list-search-categories a:active, .list-search-categories .current a { text-decoration: none; background-color: #1177c7; } .list-search-categories .current a { font-weight: bold; } /* List Categories Group */ .list-categories-group { border: 1px solid #aaa; margin-bottom: 10px; overflow: hidden; border-radius: 3px; } .list-categories-group li { width: 50%; float: right; border-right: 1px solid #aaa; } .list-categories-group li:first-child { border-right: 0; } .list-categories-group a { font-size: 14px; line-height: 20px; color: #c7c7c7; text-align: center; display: block; padding: 7px 0; } .list-categories-group a:hover, .list-categories-group a:active, .list-categories-group .current a { color: #fff; text-decoration: none; background-color: rgba(33,150,243,.5); box-shadow: inset 0 1px 2px rgba(0,0,0,.25); } /* List Radios */ .list-radios { padding-bottom: 17px; overflow: hidden; } .list-radios li { float: right; padding-right: 40px; } .list-radios li:first-child { padding-right: 0; } /* List Form Actions */ .list-form-actions { overflow: hidden; padding: 3px 0 0; margin-bottom: -8px; } .list-form-actions li { float: right; padding-left: 23px; } .list-form-actions a { font-size: 14px; color: #fff; font-weight: bold; text-shadow: 0 -1px 0 rgba(0,0,0,.5); display: block; } .list-form-actions a:hover, .list-form-actions a:active { text-decoration: underline; } .list-form-actions .current { display: none; } /* ------------------------------------------------------------ *\ Navigations \* ------------------------------------------------------------ */ /* Main Navigation */ .nav { position: relative; z-index: 19; border-bottom: 1px solid #01579b; background-color: #2196f3; } .nav-list > li { float: right; } .nav-list > li > a { font-size: 14px; line-height: 16px; color: #fff; font-weight: bold; display: block; position: relative; z-index: 3; padding: 20px 30px 21px; border-bottom: 1px solid #01579b; margin-bottom: -1px; } .nav-list > li > a:before { content: ''; display: block; width: 1px; height: 12px; position: absolute; top: 50%; left: 0; margin-top: -6px; background-color: #4dabf5; } .nav-list > li:last-child > a:before { display: none; } .nav-list > li.home > a { font-size: 0; line-height: 0; text-indent: -4000px; width: 76px; height: 57px; border-bottom-color: transparent; background: url(images/ico-home.png) no-repeat 50% 50%; } .nav-list > li:hover > a, .nav-list > li:active > a, .nav-list > li:hover a:before, .nav-list > li:active a:before { color: #fff; text-decoration: none; border-bottom-color: #757575; background-color: #757575; } .nav-list > li.current > a, .nav-list > li.current > a:before, .nav-list > li.current:hover > a, .nav-list > li.current:hover > a:before, .nav-list > li.current:active > a, .nav-list > li.current:active > a:before { color: #fff; text-decoration: none; border-bottom-color: #01579b; background-color: #01579b; } /* Nav Dropdown */ .nav-dropdown { position: absolute; top: 100%; right: 0; left: 0; z-index: 2; padding-top: 1px; background-color: #757575; box-shadow: 0 2px 5px rgba(0,0,0,0.4); } .nav-dropdown .dropdown-content { float: right; width: 560px; padding-top: 30px; } .nav-dropdown .dropdown-content h1 { color: #fff; padding: 28px 16px 24px; border: 1px solid #8a8a8a; margin-bottom: 30px; } .nav-dropdown .dropdown-content h1 em { color: #00d8ff; } .nav-dropdown .dropdown-image { float: left; width: 570px; position: relative; padding: 1px; border: 1px solid #fff; } .nav-dropdown .dropdown-image h1 { color: #2196f3; } .nav-dropdown .dropdown-image h1 em { font-size: 44px; color: #757575; display: block; } .nav-dropdown .dropdown-image img { display: block; } .nav-dropdown .dropdown-image .overlay { text-align: center; position: absolute; bottom: 20px; right: 0; left: 0; background-color: rgba(255,255,255,.9); box-shadow: 0 2px 3px rgba(0,0,0,.7); } .nav-dropdown .dropdown-nav { float: right; width: 250px; padding-left: 32px; } .nav-dropdown .dropdown-nav li { border-top: 1px solid #8a8a8a; } .nav-dropdown .dropdown-nav a { font-size: 18px; line-height: 20px; color: #fff; font-weight: bold; display: block; padding: 15px 0; } .nav-dropdown .dropdown-nav a:before { content: ''; display: inline-block; vertical-align: middle; width: 0; height: 0; border: 5px solid transparent; border-right-color: #fff; } .nav-dropdown .dropdown-nav li:first-child { border-top: 0; } .nav-dropdown .dropdown-nav li:first-child a { padding-top: 0; } .nav-dropdown .dropdown-nav-secondary { float: right; width: 310px; border-right: 1px solid #8a8a8a; } .nav-dropdown .dropdown-nav-secondary > a { font-size: 18px; line-height: 20px; color: #fff; font-weight: bold; display: block; padding-bottom: 15px; margin-right: 20px; } .nav-dropdown .dropdown-nav-secondary > a:before { content: ''; display: inline-block; vertical-align: middle; width: 0; height: 0; border: 5px solid transparent; border-right-color: #fff; } .nav-dropdown .dropdown-nav-secondary ul { float: right; width: 50%; padding-right: 20px; } .nav-dropdown .dropdown-nav-secondary ul + ul { border-right: 1px solid #8a8a8a; } .nav-dropdown .dropdown-nav-secondary li { padding-bottom: 7px; } .nav-dropdown .dropdown-nav-secondary li a { font-size: 14px; line-height: 20px; color: #c8c8c8; font-weight: bold; display: block; } .nav-dropdown .dropdown-nav-secondary li a:before { content: ''; display: inline-block; vertical-align: middle; width: 0; height: 0; border: 5px solid transparent; border-right-color: #c8c8c8; } .nav-dropdown .dropdown-nav a:hover, .nav-dropdown .dropdown-nav a:active, .nav-dropdown .dropdown-nav-secondary > a:hover, .nav-dropdown .dropdown-nav-secondary > a:active, .nav-dropdown .dropdown-nav-secondary li a:hover, .nav-dropdown .dropdown-nav-secondary li a:active { color: #00abe6; text-decoration: none; } .nav-dropdown .dropdown-nav a:hover:before, .nav-dropdown .dropdown-nav a:active:before, .nav-dropdown .dropdown-nav-secondary > a:hover:before, .nav-dropdown .dropdown-nav-secondary > a:active:before, .nav-dropdown .dropdown-nav-secondary li a:hover:before, .nav-dropdown .dropdown-nav-secondary li a:active:before { border-right-color: #00abe6; } /* Breadcrumbs */ .breadcrumbs { font-size: 12px; line-height: 19px; color: #757575; position: relative; z-index: 18; padding: 5px 0; border-bottom: 1px solid #000; border-bottom-color: rgba(0,0,0,.3); box-shadow: 0 1px 3px rgba(0,0,0,.4); } .breadcrumbs { background: rgb(226,226,226); background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2UyZTJlMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZWZlZmUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, rgba(226,226,226,1) 0%, rgba(254,254,254,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(226,226,226,1)), color-stop(100%,rgba(254,254,254,1))); background: -webkit-linear-gradient(top, rgba(226,226,226,1) 0%,rgba(254,254,254,1) 100%); background: -o-linear-gradient(top, rgba(226,226,226,1) 0%,rgba(254,254,254,1) 100%); background: -ms-linear-gradient(top, rgba(226,226,226,1) 0%,rgba(254,254,254,1) 100%); background: linear-gradient(to bottom, rgba(226,226,226,1) 0%,rgba(254,254,254,1) 100%); } .breadcrumbs li { float: right; } .breadcrumbs a { color: #01579b; padding-left: 13px; margin-left: 11px; background: url(images/breadcrumb-sep.png) no-repeat 0 50%; } /* Footer Navigation */ .footer-nav { padding: 15px 0 30px; } .footer-nav ul { overflow: hidden; } .footer-nav li { width: 14.285%; float: right; } .footer-nav li a { font-size: 14px; line-height: 1; color: #fff; font-weight: bold; display: block; padding-right: 7px; border-right: 1px solid transparent; } .footer-nav li ul { margin-top: 8px; border-right: 1px solid #919191; } .footer-nav li li { width: auto; float: none; padding-top: 8px; } .footer-nav li li:first-child { padding-top: 0; } .footer-nav li li a { font-size: 12px; color: #c7c7c7; font-weight: normal; } /* Socials */ .socials { float: right; } .socials li { float: right; width: 30px; margin-left: 10px; } .socials a { font-size: 0; line-height: 0; text-indent: -4000px;display: block; height: 30px; background-repeat: no-repeat; background-position: 50% 50%; } .socials a.link-youtube { background-image: url(images/ico-youtube.png); } .socials a.link-twitter { background-image: url(images/ico-twitter.png); } .socials a.link-googleplus { background-image: url(images/ico-googleplus.png); } .socials a.link-facebook { background-image: url(images/ico-facebook.png); } .socials a:hover, .socials a:active { opacity: .7; } /* ------------------------------------------------------------ *\ Forms \* ------------------------------------------------------------ */ /* Search Form */ .search-form { width: 435px; position: absolute; top: 20px; right: 0; z-index: 4; padding-bottom: 20px; border: 1px solid #49b4c1; margin-left: 140px; background-color: rgba(1,87,155,.8); border-radius: 5px; box-shadow: 0 0 5px rgba(0,0,0,.5); } .search-form h4 { font-size: 14px; line-height: 18px; color: #fff; font-weight: bold; margin: -5px 0 0; } .search-tabs { position: relative; margin: 0 19px; } .search-tab, .search-tab-inner { position: absolute; top: 0; left: 0; right: 0; z-index: -2; } .search-tab.visible, .search-tab-inner.visible { position: relative; top: auto; left: auto; right: auto; z-index: 2; } .search-tab-inner { margin-top: 56px; } .search-tab-inner.visible { margin-top: 0; } .search-form .form-row { padding-bottom: 13px; } .search-form .form-row > p { color: #fff; margin-bottom: -10px; } .search-form .form-col { width: 50%; float: right; padding-left: 10px; } .search-form .form-col > p { color: #fff; margin-top: 18px; } .search-form .form-col + .form-col:not(.form-col-medium):not(.form-col-small):not(.form-col-tiny) { float: left; padding: 0 10px 0 0; } .search-form .form-col-medium { width: 41%; float: right; padding: 0 0 0 10px; } .search-form .form-col-small { width: 36%; float: right; padding: 0 0 0 10px; } .search-form .form-col-tiny { width: 23%; float: right; padding: 0; } .search-form .form-controls { position: relative; } .search-form .form-label { font-size: 14px; line-height: 16px; color: #c7c7c7; display: block; margin-bottom: 3px; } .search-form .has-button { padding-left: 41px; } .search-form .has-icon .field { padding-right: 23px; } .search-form .has-icon > [class^="ico-"] { display: block; position: absolute; top: 50%; right: 10px; margin-top: -6px; } .search-form .has-date { padding-left: 34px; } .search-form .has-disabled:before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 5; border: 1px solid #aaa; background: url(images/disabled-pattern.png) repeat 0 0; border-radius: 3px; } .search-form .btn-search, .search-form .ui-datepicker-trigger, .search-form .icon-trigger { width: 36px; height: 36px; display: block; position: absolute; top: 0; left: 0; z-index: 2; border: 1px solid #aaa; border-radius: 2px; box-shadow: none; } .search-form .btn-search [class^="ico-"] { display: block; position: absolute; top: 50%; left: 50%; } .search-form .btn-search .ico-search { margin: -8px 0 0 -8px; } .search-form .ui-datepicker-trigger { font-size: 0; line-height: 0; } .search-form .ui-datepicker-trigger:before { content: ''; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: url(images/ico-calendar.png) no-repeat 50% 50%; } .search-form .icon-trigger { padding: 9px 0 8px; } .search-form .icon-trigger [class^="ico-"] { display: block; margin: 0 auto; } .search-form .field { font-size: 14px; } .search-form .form-btn, .popup .btn { font-size: 16px; line-height: 20px; color: #fff; font-weight: bold; text-align: center; text-shadow: 0 -1px 0 rgba(0,0,0,.5); min-width: 188px; display: inline-block; vertical-align: middle; padding: 11px 5px; border: 1px solid #01579b; margin-top: 10px; background-color: #2195f3; border-radius: 3px; box-shadow: 0 2px 2px rgba(0,0,0,.3), inset 0 0 0 1px #fff; } .search-form .form-btn:hover, .search-form .form-btn:active, .popup .btn:hover, .popup .btn:active { color: #2195f3; text-decoration: none; background-color: #fff; } .search-form .form-separator { height: 1px; border: 0; border-bottom: 1px dashed #fff; margin: -5px 0 7px; } .search-form .dropdown1, .search-form .dropdown2, .search-form .second-room, .search-form .form-group { display: none; } .search-form .dropdown1.visible, .search-form .dropdown2.visible, .search-form .two-rooms .second-room, .search-form .form-group.visible { display: block; } .search-form .list-calculator { list-style: none outside none; width: 280px; display: none; position: absolute; top: 100%; left: 0; z-index: 22; padding: 0 9px; border: 1px solid #a9a9a9; margin-top: 2px; background-color: #fff; box-shadow: 0 0 10px rgba(0,0,0,.4); } .search-form .list-calculator.visible { display: block; } .search-form .list-calculator li { padding: 10px 0; border-top: 1px solid #a9a9a9; overflow: hidden; } .search-form .list-calculator li:first-child { border-top: 0; } .search-form .list-calculator li span { font-size: 14px; line-height: 20px; color: #313131; float: right; padding: 6px 0; } .search-form .form-counter { float: left; } .search-form .form-counter .form-counter-value { text-align: center; width: 38px; } .search-form .btn-increment, .search-form .btn-decrement { width: 32px; height: 32px; float: right; padding: 8px 0 7px; border: 1px solid #aaa; border-radius: 0; box-shadow: none; } .search-form .btn-increment [class^="ico-"], .search-form .btn-decrement [class^="ico-"] { display: block; margin: 0 auto; } .search-form .btn-remove { width: 36px; height: 36px; float: right; padding: 11px 0; border: 1px solid #aaa; margin-right: 135px; border-radius: 2px; } .search-form .btn-remove [class^="ico-"] { display: block; margin: 0 auto; } .search-form .add-another-row { font-size: 14px; line-height: 20px; color: #fff; text-align: center; display: block; padding: 7px 0; border: 1px dashed #fff; margin: 0 0 10px 213px; } /* Category Search Form */ .section-category-search .search-form { width: auto; top: auto; bottom: 20px; left: 0; right: 0; z-index: 3; padding: 4px 0 10px; margin: 0; border-radius: 0; } .section-category-search .search-form.restricted { max-height: 460px; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; } .section-category-search .search-tabs { margin: 0; } .section-category-search .search-tab { height: 0; overflow: hidden; } .section-category-search .search-tab.visible { height: auto; overflow: visible; } .section-category-search .list-radios { padding-bottom: 30px; } .section-category-search .list-radios li { padding-right: 10px; } .section-category-search .list-radios li:first-child { padding-right: 0; } .section-category-search .radio label { font-size: 14px; line-height: 18px; color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.5); text-align: center; position: static; padding: 14px 20px 16px; background-color: rgba(255,255,255,.15); } .section-category-search .radio label:before, .section-category-search .radio label:after, .section-category-search .radio input:checked + label:after { display: none; } .section-category-search .radio input:checked + label { background-color: #2196f3; } .section-category-search .form-field { width: 215px; float: right; margin-left: 10px; } .section-category-search .has-button { padding-left: 37px; } .section-category-search .date-range { float: right; margin-left: 8px; } .section-category-search .form-row { padding-bottom: 20px; } .section-category-search .form-row:first-child { position: relative; z-index: 10; } .section-category-search .form-col { width: 157px; float: right; padding: 0; margin-left: 2px; } .section-category-search .form-col + .form-col:not(.form-col-medium):not(.form-col-small):not(.form-col-tiny) { padding: 0; } .section-category-search .form-field-people { width: 171px; float: right; position: relative; } .section-category-search .btn-yellow { font-size: 16px; line-height: 24px; color: #01579b; text-shadow: 0 1px 0 rgba(255,255,255,.5); width: 193px; float: left; padding: 10px 0; border: 1px solid #01579b; margin-top: -5px; background-color: #ffdf0f; box-shadow: 0 2px 2px rgba(0,0,0,.3), inset 0 0 0 1px #fff; } .section-category-search .btn-yellow:hover, .section-category-search .btn-yellow:active { background-color: #fff; } .section-category-search .form-group { position: relative; padding: 9px; border: 1px dashed #fff; margin-bottom: 10px; } .section-category-search .form-group h4 { padding: 10px 0 5px; } .section-category-search .form-group .group-dismiss { font-size: 14px; line-height: 1; color: #fff; position: absolute; top: 7px; left: 9px; z-index: 14; } .section-category-search .form-group .form-row { position: relative; z-index: 2; } .section-category-search .form-group .form-row-secondary { z-index: 1; } .section-category-search .form-group .form-col { margin-left: 10px; } .section-category-search .form-group .form-col + .form-col:not(.form-col-medium):not(.form-col-small):not(.form-col-tiny) { float: right; } .section-category-search .form-group .form-field-people { width: 324px; } /* Subscribe Form */ .subscribe label { color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.6); float: right; width: 385px; position: relative; padding-right: 60px; margin-top: -2px; } .subscribe label:before { content: ''; display: block; width: 42px; height: 42px; position: absolute; top: 50%; right: 10px; margin-top: -21px; background: #2196f3 url(images/ico-envelope.png) no-repeat 50% 50%; border-radius: 50%; } .subscribe label strong { font-size: 18px; display: block; } .subscribe .subscribe-field { width: 616px; float: right; } .subscribe .subscribe-field::-webkit-input-placeholder { color: #959595; } .subscribe .subscribe-field:-moz-placeholder { color: #959595; } .subscribe .subscribe-field::-moz-placeholder { color: #959595; } .subscribe .subscribe-field:-ms-input-placeholder { color: #959595; } .subscribe .subscribe-btn { width: 133px; float: left; padding: 7px 20px; border-color: #01579b; margin-left: 10px; } /* ------------------------------------------------------------ *\ Header \* ------------------------------------------------------------ */ .header { position: relative; z-index: 20; padding: 20px 0 12px; } .header { background: rgb(227,227,227); background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2UzZTNlMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, rgba(227,227,227,1) 0%, rgba(255,255,255,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(227,227,227,1)), color-stop(100%,rgba(255,255,255,1))); background: -webkit-linear-gradient(top, rgba(227,227,227,1) 0%,rgba(255,255,255,1) 100%); background: -o-linear-gradient(top, rgba(227,227,227,1) 0%,rgba(255,255,255,1) 100%); background: -ms-linear-gradient(top, rgba(227,227,227,1) 0%,rgba(255,255,255,1) 100%); background: linear-gradient(to bottom, rgba(227,227,227,1) 0%,rgba(255,255,255,1) 100%); } .logo { font-size: 0; line-height: 0; text-indent: -4000px; width: 199px; height: 57px; float: right; background: url(images/logo.png) no-repeat 0 0; } .header-aside { float: left; } .header-aside .header-phone { font-size: 28px; line-height: 30px; color: #003983; float: left; padding: 7px 10px 5px; margin-right: 10px; background-color: #fff; border-radius: 3px; box-shadow: 0 0 5px rgba(0,0,0,.1); } .header-aside .header-phone:hover, .header-aside .header-phone:active { color: #003983; } .header-aside .header-phone small { font-size: 12px; line-height: 13px; color: #757575; display: block; } .header-socials { text-align: left; float: left; padding: 5px 10px; background-color: #fff; border-radius: 3px; box-shadow: 0 0 5px rgba(0,0,0,.1); } .header-socials > div { display: block !important; overflow: hidden; } .header-socials > div > iframe { width: 78px !important; float: left; } .header-socials .fb_iframe_widget { margin-top: 1px; } .header-socials .fb_iframe_widget span { float: left; } /* ------------------------------------------------------------ *\ Sections \* ------------------------------------------------------------ */ /* Fullsize container */ .fullsize-container { background-repeat: no-repeat; background-position: 50% 50%; background-size: cover; -webkit-background-size: cover; } /* Section Slideshow */ .section-slideshow { position: relative; z-index: 16; border-bottom: 1px solid #01579b; } /* Search */ .section-search { height: 0; position: relative; z-index: 17; } .section-search .shell { position: relative; } /* Section Vacations */ .section-vacations { text-align: center; position: relative; z-index: 15; padding: 28px 0 50px; border-bottom: 1px solid #01579b; background-color: #e9e9e9; } .section-vacations .section-head { padding-bottom: 5px; } .section-vacations .section-head h2 { color: #2196f3; } .section-vacations .section-head h2 em { color: #757575; display: block; } /* Section Deals */ .section-deals { position: relative; z-index: 14; padding: 25px 0 28px; border-bottom: 1px solid #01579b; background-color: #f5f5f5; } .section-deals .section-head { text-align: center; padding-bottom: 15px; } .section-deals .section-head h2 { color: #2196f3; } .section-deals .section-head h2 em { color: #757575; display: block; } /* Section Subscribe */ .section-subscribe { position: relative; z-index: 13; padding: 31px 0 30px; border-bottom: 1px solid #01579b; background-color: #757575; } /* Section Destinations */ .section-destinations { position: relative; z-index: 12; padding: 18px 0 123px; border-bottom: 9px solid #03a9f4; background-color: #e9e9e9; box-shadow: 0 1px 3px rgba(0,0,0,.4); } .section-destinations .section-head { text-align: center; padding-bottom: 24px; } .section-destinations .section-head h2 { color: #2196f3; } .section-destinations .section-head h2 em { color: #757575; display: block; } /* Section Category Search */ .section-category-search { height: 500px; position: relative; z-index: 17; } .section-category-search .section-image { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1; overflow: hidden; } .section-category-search .section-image:before { content: ''; width: 944px; height: 844px; display: block; position: absolute; top: 50%; left: 50%; z-index: 1; margin: -422px 0 0 -472px; background-color: rgba(255,255,255,.6); border-radius: 50%; } .section-category-search .section-head { text-align: center; height: 289px; position: relative; z-index: 2; padding-top: 92px; } .section-category-search .section-head h2 { font-size: 38px; line-height: 42px; color: #2195f2; text-shadow: 0 1px 0 rgba(255,255,255,.6); } .section-category-search .section-head p { font-size: 24px; line-height: 30px; color: #757575; text-shadow: 0 1px 0 rgba(255,255,255,.6); font-weight: bold; } .section-category-search .section-head [class^="ico-"] { display: block; margin: 0 auto 5px; } /* Section Flight Deals */ .section-flights-deals { position: relative; z-index: 16; padding: 40px 0; border-bottom: 1px solid #01579b; background-color: #e9e9e9; } /* Section Continental */ .section-continental { text-align: center; position: relative; z-index: 12; padding: 25px 0 30px; border-bottom: 1px solid #01579b; background-color: #f7f7f7; } .section-continental h2 { color: #2196f3; } .section-continental h2 em { color: #757575; display: block; } .section-continental .section-head { padding-bottom: 7px; } /* Section Flights Destinations */ .section-flights-destinations { padding: 15px 0 30px; position: relative; z-index: 11; border-bottom: 1px solid #01579b; background-color: #e9e9e9; } .section-flights-destinations h2 { color: #2196f3; } .section-flights-destinations h2 em { color: #757575; display: block; } .section-flights-destinations .section-head { text-align: center; padding-bottom: 27px; } /* Section Links */ .section-links { position: relative; z-index: 10; padding: 25px 0 20px; border-bottom: 1px solid #01579b; background-color: #f7f7f7; } .section-links h3 { font-size: 18px; color: #313131; padding-bottom: 23px; } .section-links ul { list-style: none outside none; } .section-links li { padding-bottom: 5px; } .section-links a { color: #898989; } .section-links a strong { color: #2196f3; font-weight: normal; } .section-links .ico-marker { background-image: url(images/ico-marker-alt.png); } .section-links .section-col { width: 25%; float: right; } .section-links a:hover, .section-links a:active, .section-links a:hover strong, .section-links a:active strong { color: #004990; text-decoration: underline; } /* Section Articles */ .section-articles { text-align: justify; position: relative; z-index: 9; padding: 29px 0 15px; border-bottom: 9px solid #03a9f4; background-color: #e9e9e9; box-shadow: 0 1px 3px rgba(0,0,0,0.4); } .section-articles h3 { font-size: 20px; line-height: 30px; color: #2196f3; font-style: italic; text-align: center; position: relative; margin-bottom: 12px; } .section-articles h3:after { content: ''; height: 1px; display: block; position: absolute; top: 100%; left: 0; right: 0; } .section-articles h3:after { background: rgb(33,150,243); background: -moz-linear-gradient(left, rgba(33,150,243,0) 0%, rgba(33,150,243,1) 50%, rgba(33,150,243,0) 100%); background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(33,150,243,0)), color-stop(50%,rgba(33,150,243,1)), color-stop(100%,rgba(33,150,243,0))); background: -webkit-linear-gradient(left, rgba(33,150,243,0) 0%,rgba(33,150,243,1) 50%,rgba(33,150,243,0) 100%); background: -o-linear-gradient(left, rgba(33,150,243,0) 0%,rgba(33,150,243,1) 50%,rgba(33,150,243,0) 100%); background: -ms-linear-gradient(left, rgba(33,150,243,0) 0%,rgba(33,150,243,1) 50%,rgba(33,150,243,0) 100%); background: linear-gradient(to right, rgba(33,150,243,0) 0%,rgba(33,150,243,1) 50%,rgba(33,150,243,0) 100%); } .section-articles h3 em { font-family: 'FBMarzipan', sans-serif; color: #757575; } .section-articles p { padding-bottom: 10px; } .section-articles img { width: 100%; height: auto; display: block; border: 5px solid #fff; } .section-articles figure { position: relative; border: 1px solid #ddd; margin-bottom: 8px; } .section-articles figure:after { content: ''; height: 8px; display: block; position: absolute; top: 100%; left: 0; right: 0; background: url(images/shadow.png) no-repeat 50% 0; } .section-articles .section-col { width: 570px; float: right; } .section-articles .section-col:nth-child(even) { float: left; } .section-articles .article-col { width: 265px; float: right; } .section-articles .article-col:nth-child(even) { float: left; } /* ------------------------------------------------------------ *\ Sliders \* ------------------------------------------------------------ */ .flex-viewport { direction: ltr; } .flex-viewport .slides { direction: rtl; } .flex-control-nav { font-size: 0; line-height: 0; text-align: center; } .flex-control-nav li { display: inline-block; vertical-align: top; padding: 0 4px; } .flex-control-nav a { width: 6px; height: 6px; display: block; background-color: #9d9d9d; border-radius: 50%; box-shadow: 0 1px 0 rgba(255,255,255,.6); } .flex-control-nav a:hover, .flex-control-nav a:active, .flex-control-nav a.flex-active { background-color: #2196f3; } /* Search Slideshow */ .section-slideshow .slide { height: 600px; position: relative; } .section-slideshow .slide [class^="btn"] { font-family: Arial, Helvetica, sans-serif; } .section-slideshow .slide-content { font-family: 'FBMarzipan', sans-serif; line-height: 1; color: #fff; text-align: center; letter-spacing: -2px; display: block; width: 769px; height: 383px; position: absolute; left: 50%; z-index: 2; background-repeat: no-repeat; background-position: 0 0; } .section-slideshow .slide-content small { font-family: 'AlmoniTzar', sans-serif; font-size: 50px; font-weight: 300; letter-spacing: 0; display: block; } .section-slideshow .slide-content:hover, .section-slideshow .slide-content:active { text-decoration: none; } .section-slideshow .slide-content-blue { font-size: 100px; top: 70px; padding-top: 140px; margin-left: -543px; background-image: url(images/slide-overlay1.png); } .section-slideshow .slide-content-yellow { font-size: 70px; text-shadow: 0 1px 1px rgba(0, 0, 0, .75); top: -10px; padding-top: 130px; margin-left: -780px; background-image: url(images/slide-overlay2.png); } .section-slideshow .slide-content-default { font-family: 'AlmoniTzar', sans-serif; font-size: 50px; line-height: 1; color: #fff; font-weight: 700; text-shadow: 0 1px 1px rgba(0, 0, 0, .75); text-align: right; width: 500px; top: 175px; margin-left: -400px; } .section-slideshow .slide-content-default strong { display: block; } .section-slideshow .slide-content-default em { font-size: 100px; font-style: normal; } .section-slideshow .slide-content-default em sup { font-size: 25px; font-weight: 300; margin-left: 10px; } .section-slideshow .slide-content-default em sub { font-size: 50px; position: relative; top: -22px; } .section-slideshow .flex-prev, .section-slideshow .flex-next { font-size: 0; line-height: 0; text-indent: -4000px; display: block; width: 40px; height: 40px; position: absolute; bottom: 0; left: 50%; background-color: rgba(33,150,243,.8); background-repeat: no-repeat; background-position: 50% 50%; } .section-slideshow .flex-next { margin-left: -580px; background-image: url(images/ico-chevron-left.png); } .section-slideshow .flex-prev { margin-left: -346px; background-image: url(images/ico-chevron-right.png); } .section-slideshow .flex-control-nav { font-size: 0; line-height: 0; text-align: center; width: 194px; height: 40px; position: absolute; bottom: 0; left: 50%; margin-left: -540px; background-color: rgba(255,255,255,.8); } .section-slideshow .flex-control-nav li { display: inline-block; vertical-align: middle; padding: 11px 5px; } .section-slideshow .flex-control-nav a { width: 18px; height: 18px; display: block; border: 3px solid #fff; border-radius: 50%; background-color: #d6d6d6; } .section-slideshow .flex-control-nav a:hover, .section-slideshow .flex-control-nav a:active { background-color: #ffe00f; } .section-slideshow .flex-control-nav a.flex-active { background-color: #2196f3; } /* Slideshow Vacations */ .slideshow-vacations .slide { margin-right: 45px; } .slideshow-vacations .slide a { display: block; position: relative; padding: 5px 0; } .slideshow-vacations .slide img { width: 186px; height: 186px; display: block; border: 1px solid #fff; margin: 0 auto; border-radius: 50%; box-shadow: 0 0 0 5px #c9c9c9; } .slideshow-vacations .slide [class^="btn"] { width: 174px; position: absolute; bottom: 0; left: 50%; margin-left: -86px; } .slideshow-vacations .slide a:hover img, .slideshow-vacations .slide a:active img { box-shadow: 0 0 0 5px #2196f3; } .slideshow-vacations .flex-control-nav { position: absolute; bottom: 20px; left: 0; right: 0; } /* Slideshow Deals */ .slideshow-deals .slide { margin-right: 25px; } .slideshow-deals .slide-image { position: relative; border: 5px solid #c9c9c9; margin-bottom: 28px; } .slideshow-deals .slide-image img { width: 100%; height: auto; display: block; border: 1px solid #fff; } .slideshow-deals .slide-image [class^="btn"] { width: 174px; position: absolute; bottom: 0; left: 50%; margin: 0 0 -23px -86px; } .slideshow-deals .flex-control-nav { position: absolute; bottom: 15px; left: 0; right: 0; } /* Slideshow Destinations */ .slideshow-destinations { position: relative; } .slideshow-destinations .slide { position: relative; z-index: 1; margin-right: 20px; } .slideshow-destinations .slide:hover { z-index: 15; } .slideshow-destinations .slide-reverse { direction: ltr; } .slideshow-destinations .slide-reverse figure { direction: rtl; } .slideshow-destinations .slide figure { width: 273px; border: 5px solid #c9c9c9; } .slideshow-destinations .slide figure a { color: #fff; width: 263px; height: 318px; display: block; position: relative; border: 4px solid; overflow: hidden; } .slideshow-destinations .slide figure img { width: auto; height: 100%; max-width: none; } .slideshow-destinations .slide figure .overlay { position: absolute; bottom: 0; left: 0; right: 0; z-index: 1; padding: 10px; background-color: rgba(33,150,243,.8); } .slideshow-destinations .slide figure .overlay strong { font-size: 18px; line-height: 20px; display: block; } .slideshow-destinations .slide figure .overlay p { width: 510px; display: none; } .slideshow-destinations .slide figure .overlay p em { color: #fff600; } .desktop-agent .slideshow-destinations .slide figure:hover, .desktop-agent .slideshow-destinations .slide figure:active { width: 568px; } .desktop-agent .slideshow-destinations .slide figure:hover a, .desktop-agent .slideshow-destinations .slide figure:active a { width: 558px; } .desktop-agent .slideshow-destinations .slide figure:hover .overlay p, .desktop-agent .slideshow-destinations .slide figure:active .overlay p { display: block; } .slideshow-destinations .flex-prev, .slideshow-destinations .flex-next { font-size: 0; line-height: 0; text-indent: -4000px; display: block; width: 40px; height: 40px; position: absolute; top: 50%; border: 1px solid #fff; margin-top: -20px; background-color: #2195f3; background-repeat: no-repeat; background-position: 50% 50%; border-radius: 50%; box-shadow: 0 0 0 5px #c9c9c9; } .slideshow-destinations .flex-prev { right: -60px; background-image: url(images/ico-chevron-right.png); } .slideshow-destinations .flex-next { left: -60px; background-image: url(images/ico-chevron-left.png); } .slideshow-destinations .flex-control-nav { display: none; position: absolute; top: 100%; left: 0; right: 0; margin-top: 20px; } /* Slideshow Flights Deals */ .slideshow-flight-deals { position: relative; } .slideshow-flight-deals .slide { margin-right: 80px; } .slideshow-flight-deals .slide a { font-size: 12px; line-height: 18px; color: #656565; text-shadow: 0 1px 0 rgba(255,255,255,.6); text-align: center; display: block; padding-bottom: 5px; } .slideshow-flight-deals .slide a strong { font-size: 16px; line-height: 22px; color: #3b3e3e; display: block; } .slideshow-flight-deals .slide a strong span { color: #2196f3; } .slideshow-flight-deals .slide a p { max-width: 90%; margin: 0 auto; } .slideshow-flight-deals .slide a p span { color: #828282; display: block; } .slideshow-flight-deals .slide a small { font-size: 11px; color: #828282; display: block; } .slideshow-flight-deals .slide a small span { font-size: 20px; line-height: 28px; color: #004990; font-weight: bold; display: inline-block; vertical-align: top; } .slideshow-flight-deals .slide a figure { width: 230px; height: 230px; display: block; border: 10px solid #c9c9c9; margin: 0 auto 10px; border-radius: 50%; } .slideshow-flight-deals .slide a figure img { width: 100%; height: 100%; display: block; border: 2px solid #fff; border-radius: 50%; } .slideshow-flight-deals .slide a .btn-blue { text-shadow: none; padding: 6px 5px; border: 1px solid #2196f3; box-shadow: 0 2px 2px rgba(0,0,0,.3), inset 0 0 0 1px #fff; } .slideshow-flight-deals .slide a:hover, .slideshow-flight-deals .slide a:active { text-decoration: none; } .slideshow-flight-deals .slide a:hover figure, .slideshow-flight-deals .slide a:active figure { border-color: #2196f3; } .slideshow-flight-deals .slide a:hover .btn-blue, .slideshow-flight-deals .slide a:active .btn-blue { border-color: #00abe6; background-color: #00abe6; } .slideshow-flight-deals .flex-prev, .slideshow-flight-deals .flex-next { font-size: 0; line-height: 0; text-indent: -4000px; display: block; width: 50px; height: 50px; position: absolute; top: 50%; border: 5px solid #c9c9c9; margin-top: -25px; background-color: #757575; background-repeat: no-repeat; background-position: 50% 50%; border-radius: 50%; box-shadow: 0 0 0 1px #fff inset; } .slideshow-flight-deals .flex-next { left: -60px; background-image: url(images/ico-chevron-left.png); } .slideshow-flight-deals .flex-prev { right: -60px; background-image: url(images/ico-chevron-right.png); } .slideshow-flight-deals .flex-prev:hover, .slideshow-flight-deals .flex-next:hover, .slideshow-flight-deals .flex-prev:active, .slideshow-flight-deals .flex-next:active { background-color: #2196f3; } .slideshow-flight-deals .flex-control-nav { position: absolute; top: 100%; left: 0; right: 0; margin-top: 15px; } .slideshow-flight-deals .flex-control-nav li { padding: 0 3px; } .slideshow-flight-deals .flex-control-nav a { width: 10px; height: 10px; border: 2px solid #fff; } /* Slideshow Continents */ .slideshow-continents { position: relative; } .slideshow-continents .slide { margin-right: 45px; } .slideshow-continents .slide figure { width: 196px; height: 196px; position: relative; margin-bottom: 10px; overflow: hidden; border-radius: 50%; } .slideshow-continents .slide img { width: 100%; height: 100%; display: block; border-radius: 50%; } .slideshow-continents .slide figcaption { font-size: 16px; line-height: 20px; color: #3b3b3b; font-weight: bold; text-align: center; text-shadow: 0 1px 0 rgba(255,255,255,.6); position: absolute; bottom: 27px; left: 17px; right: 17px; padding: 6px 0; background-color: rgba(255,255,255,.8); border-radius: 0 0 50px 50px; } .slideshow-continents .slide ul { list-style: none outside none; border: 1px solid #c9c9c9; background-color: #fff; } .slideshow-continents .slide li { border-top: 1px solid #c9c9c9; } .slideshow-continents .slide li:first-child { border-top: 0; } .slideshow-continents .slide a { color: #828282; line-height: 20px; text-shadow: 0 1px 0 rgba(255,255,255,.6); display: block; padding: 6px 10px; overflow: hidden; } .slideshow-continents .slide a span { color: #3b3e3e; font-weight: bold; float: right; } .slideshow-continents .slide a span strong { color: #2196f3; } .slideshow-continents .slide a small { font-size: 100%; float: left; } .slideshow-continents .slide a small strong { font-size: 18px; color: #004990; display: inline-block; vertical-align: top; } .slideshow-continents .slide a:hover, .slideshow-continents .slide a:active { text-decoration: none; background-color: #e9e9e9; } .section-continental .flex-control-nav { position: absolute; top: 100%; left: 0; right: 0; margin-top: 10px; } /* Slideshow Flights Destinations */ .slideshow-flights-destinations { position: relative; } .slideshow-flights-destinations .slide { margin-right: 20px; } .slideshow-flights-destinations .slide figure { position: relative; border: 6px solid #c9c9c9; } .slideshow-flights-destinations .slide img { width: 100%; height: auto; border: 4px solid #fff; } .slideshow-flights-destinations .slide em { font-size: 18px; line-height: 20px; color: #fff; font-weight: bold; display: block; position: absolute; bottom: 4px; left: 4px; right: 4px; padding: 10px; background-color: rgba(33,150,243,.8); } .slideshow-flights-destinations .flex-prev, .slideshow-flights-destinations .flex-next { font-size: 0; line-height: 0; text-indent: -4000px; display: block; width: 50px; height: 50px; position: absolute; top: 50%; border: 5px solid #c9c9c9; margin-top: -25px; background-color: #757575; background-repeat: no-repeat; background-position: 50% 50%; border-radius: 50%; box-shadow: 0 0 0 1px #fff inset; } .slideshow-flights-destinations .flex-next { left: -60px; background-image: url(images/ico-chevron-left.png); } .slideshow-flights-destinations .flex-prev { right: -60px; background-image: url(images/ico-chevron-right.png); } .slideshow-flights-destinations .flex-prev:hover, .slideshow-flights-destinations .flex-next:hover, .slideshow-flights-destinations .flex-prev:active, .slideshow-flights-destinations .flex-next:active { background-color: #2196f3; } .section-flights-destinations .flex-control-nav { position: absolute; top: 100%; left: 0; right: 0; margin-top: 12px; } /* ------------------------------------------------------------ *\ Footer \* ------------------------------------------------------------ */ .footer { color: #fff; position: relative; z-index: 6; background-color: #757575; } .footer a { color: #c7c7c7; } .footer a:hover, .footer a:active { color: #ffe00f; text-decoration: none; } .footer-bar { padding-bottom: 20px; border-bottom: 1px solid #919191; margin-bottom: 15px; overflow: hidden; } .footer-bar .secured { font-size: 12px; line-height: 14px; color: #fff; float: left; position: relative; padding-left: 22px; background: url(images/ico-lock.png) no-repeat 0 50%; } .footer-bar .secured img { display: block; } .copyright { font-size: 12px; line-height: 19px; color: #fff; text-align: center; padding-bottom: 15px; } /* ------------------------------------------------------------ *\ Modals \* ------------------------------------------------------------ */ /* Modals Base */ .popup { z-index: 200; border: 1px solid #bbb; background: #efefef; } .popup .btn { height: auto; padding: 8px 0; } .popup-head { padding: 7px 38px 7px 10px; color: #01579b; border-bottom: 1px solid #bbb; } .popup-head h3 { font-size: 16px; } .popup-head .close-popup { border-radius: 0; width: 30px; height: 30px; line-height: 28px;position: absolute; top: 5px; right: 5px; } .popup-body { padding: 10px; } .popup-body .two-cols .col { width: 358px; } .popup-body .totals-box ul.price-details li { padding-right: 20px; min-width: 0; } .popup-body .totals-box ul.price-details li + li { padding-left: 20px; } /* Modal Destinations */ .popup-dest { background: #efefef; box-shadow: 0 0 0 4px rgba(1,87,155,.8), inset 0 0 0 1px #fff; width: 300px; padding: 10px 10px 30px; border: 0; margin-left: -90px; } .popup-dest h4 { color: #4f4f4f; margin-bottom: 8px; } .popup-dest ul.dest-list { list-style: none; position: relative; margin: 0 -5px 12px 0; } .popup-dest ul.dest-list li { float: left; width: 90px; margin: 0 5px 5px 0; } .popup-dest ul.dest-list li a { display: block; border: 1px solid #aaa; padding: 2px 5px 3px; color: #004990; font-size: 12px; text-shadow: 0 1px rgba(255,255,255,.6);} .popup-dest ul.dest-list li a:hover { text-decoration: none; background: #fff; } .popup-dest .dest-form { padding: 10px; border: 1px solid #b6b6b6; margin-bottom: 10px; } .popup-dest .dest-form .btn { width: 100%; display: block; } .popup-dest .dest-form .custom-select { margin-bottom: 10px; } .popup-dest .dest-form .custom-select-value { background: #fff; } /* ------------------------------------------------------------ *\ jQuery UI Autocomplete Restyle \* ------------------------------------------------------------ */ .ui-autocomplete { position: absolute; z-index: 200; max-width: 302px; min-width: 302px; max-height: 306px; overflow: auto; overflow-x: hidden; background: #fff; list-style: none; border: 4px solid rgba(1,87,155,.8); box-shadow: inset 0 0 0 1px #fff; margin: 4px 0 0 -124px !important; } .ui-autocomplete .ui-menu-item + .ui-menu-item { border-top: 1px solid #aaa; } .ui-autocomplete .ui-menu-item .ui-corner-all { display: block; font-size: 12px; color: #4f4f4f; padding: 5px 3px; } .ui-autocomplete .ui-menu-item .ui-corner-all:hover, .ui-autocomplete .ui-menu-item .ui-state-focus { text-decoration: none; color: #01579b; } .ui-autocomplete .ui-menu-item [class^="ico-"] { margin-left: 5px; } /* ------------------------------------------------------------ *\ jQuery UI Datepicker Restyle \* ------------------------------------------------------------ */ .ui-datepicker { position: absolute; z-index: 201 !important; min-width: 301px; max-width: 282px; padding: 5px 10px 30px; box-shadow: 0 0 0 4px rgba(1,87,155,.8); background: #efefef; margin: 4px 0 0 -4px; } .ui-datepicker .datepicker-title { color: #01579b; text-align: center; padding: 0; border: 0; } .ui-datepicker .datepicker-title h3 { font-size: 14px; line-height: 1.5; color: #01579b; text-align: center; font-weight: bold; } .ui-datepicker .ui-datepicker-header { border: 1px solid #464646; position: relative; min-height: 28px; padding: 0; margin: 5px 0; } .ui-datepicker .ui-datepicker-header { background: rgb(254,254,254); background: -moz-linear-gradient(top, rgba(254,254,254,1) 0%, rgba(220,220,220,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(254,254,254,1)), color-stop(100%,rgba(220,220,220,1))); background: -webkit-linear-gradient(top, rgba(254,254,254,1) 0%,rgba(220,220,220,1) 100%); background: -o-linear-gradient(top, rgba(254,254,254,1) 0%,rgba(220,220,220,1) 100%); background: -ms-linear-gradient(top, rgba(254,254,254,1) 0%,rgba(220,220,220,1) 100%); background: linear-gradient(to bottom, rgba(254,254,254,1) 0%,rgba(220,220,220,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefefe', endColorstr='#dcdcdc',GradientType=0 ); } .ui-datepicker .ui-datepicker-title { font-size: 14px; line-height: 18px; color: #333; text-shadow: 0 1px rgba(255,255,255,.6); display: block; padding: 5px; margin: 0 29px; text-align: center; } .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position: absolute; top: 0; border: 0; border-radius: 0; width: 29px; height: 28px; } .ui-datepicker .ui-datepicker-prev .ui-icon, .ui-datepicker .ui-datepicker-next .ui-icon { position: absolute; top: 50%; left: 50%; width: 8px; height: 17px; margin: -8px 0 0 -4px; background: url(images/calendar-arrows.png) no-repeat right 0; } .ui-datepicker .ui-datepicker-next .ui-icon { background-position: 0 0; } .ui-datepicker .ui-datepicker-prev { right: 0 !important; border-left: 1px solid #464646; } .ui-datepicker .ui-datepicker-next { left: 0 !important; border-right: 1px solid #464646; } .ui-datepicker .ui-datepicker-prev.ui-state-disabled, .ui-datepicker .ui-datepicker-next.ui-state-disabled { cursor: default; } .ui-datepicker .ui-datepicker-prev.ui-state-disabled .ui-icon { background-position: -8px -17px; } .ui-datepicker .ui-datepicker-next.ui-state-disabled .ui-icon { background-position: 0 -17px; } .ui-datepicker table { border-collapse: collapse; } .ui-datepicker table th { font-weight: normal; color: #4f4f4f; font-size: 14px; line-height: 19px; padding: 0 0 5px; } .ui-datepicker table td { background: #fff; border: 1px solid #aaa; width: 44px; font-size: 14px; line-height: 24px; vertical-align: middle; color: #434343; text-align: center; padding: 0; font-weight: bold; } .ui-datepicker table td a, .ui-datepicker table td span { height: 44px; padding: 9px 0; border: 1px solid transparent; display: block; color: #434343; text-align: center; } .ui-datepicker table td a:hover { position: relative; z-index: 2; border: 1px solid #333; margin: 0; } .ui-datepicker table td a.ui-state-active { background: #01579b; margin: 0; border: 0; color: #fff; } .ui-datepicker table td a.ui-state-highlight { background-color: #efefef; } .ui-datepicker table td.highlight a { background-image: url(images/calendar-arrow.png); background-repeat: no-repeat; background-position: 0 0; } .ui-datepicker table td a:hover { text-decoration: none; } .ui-datepicker table td.ui-datepicker-unselectable, .ui-datepicker table td.ui-state-disabled { color: #959595; opacity: 1; background: url(images/dp-disabled.png) repeat 0 0; } .ui-datepicker table td.ui-datepicker-unselectable .ui-state-default, .ui-datepicker table td.ui-state-disabled .ui-state-default { color: #959595; } .ui-datepicker table td.ui-datepicker-today a { border-color: #01579b; background-color: #fff; } .ui-datepicker table td.date-range-selected a { color: #fff; background-color: #7bc9fd; } .ui-datepicker table td.start-date-selected a, .ui-datepicker table td.end-date-selected a, .ui-datepicker table td.ui-datepicker-days-cell-over a { color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.6); background-color: #01579b; } .ui-datepicker table td.ui-datepicker-days-cell-over.ui-datepicker-today a { color: #434343; text-shadow: none; background-color: #fff; border-color: #01579b; } .ui-datepicker table td.start-date-selected:first-child a { color: #434343; text-shadow: none; background-color: #e5ffe5; } .ui-datepicker .legend { font-size: 12px; line-height: 1.5; color: #787878; margin: 5px 0; } .ui-datepicker .legend .icon-holidays { vertical-align: top; margin-top: 3px; } .ui-datepicker .close-datepicker { position: absolute; left: 0; bottom: 0; right: 0; border-color: #fff; border-radius: 0; } /* ------------------------------------------------------------ *\ Combined buttons backgrounds \* ------------------------------------------------------------ */ .custom-select-value, .search-form .btn-search, .search-form .btn-remove, .search-form .ui-datepicker-trigger, .search-form .icon-trigger, .section-category-search .btn-increment, .section-category-search .btn-decrement { background: rgb(255,255,255); background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(231,231,231,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(231,231,231,1))); background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(231,231,231,1) 100%); background: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(231,231,231,1) 100%); background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(231,231,231,1) 100%); background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(231,231,231,1) 100%); } .search-form .btn-remove:hover, .search-form .btn-remove:active, .search-form .btn-search:hover, .search-form .btn-search:active, .search-form .ui-datepicker-trigger:hover, .search-form .ui-datepicker-trigger:active, .search-form .icon-trigger:hover, .search-form .icon-trigger:active, .section-category-search .btn-increment:hover, .section-category-search .btn-decrement:hover, .section-category-search .btn-increment:active, .section-category-search .btn-decrement:active { background: rgb(231,231,231); background: -moz-linear-gradient(top, rgba(231,231,231,1) 0%, rgba(255,255,255,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(231,231,231,1)), color-stop(100%,rgba(255,255,255,1))); background: -webkit-linear-gradient(top, rgba(231,231,231,1) 0%,rgba(255,255,255,1) 100%); background: -o-linear-gradient(top, rgba(231,231,231,1) 0%,rgba(255,255,255,1) 100%); background: -ms-linear-gradient(top, rgba(231,231,231,1) 0%,rgba(255,255,255,1) 100%); background: linear-gradient(to bottom, rgba(231,231,231,1) 0%,rgba(255,255,255,1) 100%); } .popup-dest .close-popup, .ui-datepicker .close-datepicker { font-size: 12px; line-height: 28px; height: 28px; color: #aaa; font-weight: bold; text-align: center; padding: 0 5px; border-top: 1px solid #fff; position: absolute; left: 0; bottom: 0; right: 0; border-radius: 0; } .popup-dest .close-popup, .ui-datepicker .close-datepicker { background: rgb(244,244,244); background: -moz-linear-gradient(top, rgba(244,244,244,1) 0%, rgba(226,226,226,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(244,244,244,1)), color-stop(100%,rgba(226,226,226,1))); background: -webkit-linear-gradient(top, rgba(244,244,244,1) 0%,rgba(226,226,226,1) 100%); background: -o-linear-gradient(top, rgba(244,244,244,1) 0%,rgba(226,226,226,1) 100%); background: -ms-linear-gradient(top, rgba(244,244,244,1) 0%,rgba(226,226,226,1) 100%); background: linear-gradient(to bottom, rgba(244,244,244,1) 0%,rgba(226,226,226,1) 100%); } .popup-dest .close-popup:hover, .popup-dest .close-popup:active, .ui-datepicker .close-datepicker:hover, .ui-datepicker .close-datepicker:active { text-decoration: none; background: rgb(226,226,226); background: -moz-linear-gradient(top, rgba(226,226,226,1) 0%, rgba(244,244,244,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(226,226,226,1)), color-stop(100%,rgba(244,244,244,1))); background: -webkit-linear-gradient(top, rgba(226,226,226,1) 0%,rgba(244,244,244,1) 100%); background: -o-linear-gradient(top, rgba(226,226,226,1) 0%,rgba(244,244,244,1) 100%); background: -ms-linear-gradient(top, rgba(226,226,226,1) 0%,rgba(244,244,244,1) 100%); background: linear-gradient(to bottom, rgba(226,226,226,1) 0%,rgba(244,244,244,1) 100%); } .ie-browser .custom-select-value, .ie-browser .search-form .btn-search, .ie-browser .search-form .btn-remove, .ie-browser .search-form .ui-datepicker-trigger { background-color: #fff; } .custom-select { position: relative; } .custom-select select { display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 2; opacity: 0; -webkit-appearance: none; } /* ------------------------------------------------------------ *\ Hidden Elements \* ------------------------------------------------------------ */ .nav-dropdown, .search-tab, .search-tab-inner { opacity: 0; visibility: hidden; } nav li:hover .nav-dropdown, .search-tab.visible, .search-tab-inner.visible { opacity: 1; visibility: visible; } .slide, .nav-dropdown, .slideshow-destinations .slide figure a, .search-tab, .search-tab-inner { backface-visibility: hidden; -webkit-backface-visibility: hidden; } .nav-mobile, .section-search-mobile, .nav-toggle, .section-slideshow-mobile, .section-deals-mobile, .footer-mobile, .section-articles-mobile { display: none; } /* ------------------------------------------------------------ *\ Transitions \* ------------------------------------------------------------ */ a, button, input, textarea, [class^="btn"], .nav-dropdown .dropdown-nav a:before, .slideshow-flight-deals .slide a figure, .radio label { transition: color .5s, background-color .5s, border-color .5s; -webkit-transition: color .5s, background-color .5s, border-color .5s; -moz-transition: color .5s, background-color .5s, border-color .5s; -o-transition: color .5s, background-color .5s, border-color .5s; -ms-transition: color .5s, background-color .5s, border-color .5s; } .nav-dropdown, .search-tab, .search-tab-inner { transition: opacity .5s, visibility .5s; -webkit-transition: opacity .5s, visibility .5s; -moz-transition: opacity .5s, visibility .5s; -o-transition: opacity .5s, visibility .5s; -ms-transition: opacity .5s, visibility .5s; } .slideshow-destinations .slide figure, .slideshow-destinations .slide figure a { transition: width .5s; -webkit-transition: width .5s; -moz-transition: width .5s; -o-transition: width .5s; -ms-transition: width .5s; } /* ------------------------------------------------------------ *\ Responsive \* ------------------------------------------------------------ */ @media ( max-width: 1300px ) { .slideshow-destinations, .slideshow-flights-destinations { padding: 0 70px; } .slideshow-flights-destinations .flex-prev, .slideshow-destinations .flex-prev { right: 0; } .slideshow-flights-destinations .flex-next, .slideshow-destinations .flex-next { left: 0; } .slideshow-flight-deals .flex-prev, .slideshow-flight-deals .flex-next { display: none; } .slideshow-destinations .slide figure, .slideshow-destinations .slide figure a { width: 100%; } } @media ( max-width: 1180px ) { .shell { width: 1024px; padding: 0 10px; } .search-form { right: 10px; } .nav-list > li > a { padding: 20px 22px; } .nav-dropdown .dropdown-image { width: -webkit-calc(100% - 570px); width: calc(100% - 570px); height: 345px; } .nav-dropdown .dropdown-image a { height: 100%; display: block; overflow: hidden; } .nav-dropdown .dropdown-image img { width: auto; height: 100%; max-width: none; } .section-slideshow .slide { overflow: hidden; } .section-slideshow .slide-content-blue { font-size: 80px; } .section-slideshow .slide-content-yellow { left: 0; margin-left: 0; } .section-slideshow .flex-next { left: 10px; margin: 0; } .section-slideshow .flex-prev { left: 244px; margin: 0; } .section-slideshow .flex-control-nav { left: 50px; margin: 0; } .slideshow-destinations .slide figure { margin: 0 auto; } .slideshow-destinations .flex-control-nav { display: block; } .slideshow-destinations .slide-reverse { direction: rtl; } .slideshow-destinations .slide-reverse figure { direction: rtl; } .slideshow-destinations .slide:nth-child(3n) { direction: ltr; } .slideshow-destinations .slide:nth-child(3n) figure { direction: rtl; } .subscribe { width: 1004px; margin: 0 auto; } .subscribe .subscribe-field { width: 468px; } .section-articles .section-col { width: 495px; } .section-articles .article-col { width: 235px; } .section-category-search { height: auto; padding-bottom: 20px; } .section-category-search .search-form { position: relative; bottom: auto; left: auto; right: auto; } .section-category-search .search-form.restricted { max-height: none; } .section-category-search .search-form .shell { width: auto; } .section-category-search .search-tab { padding-bottom: 50px; } .section-category-search .search-tab-round-trip .form-row { position: static; } .section-category-search .search-tab-round-trip .form-field { width: 482px; margin: 0; } .section-category-search .search-tab-round-trip .form-field + .form-field { float: left; margin: 0; } .section-category-search .search-tab-round-trip .date-range { width: 484px; margin-top: 20px; } .section-category-search .search-tab-round-trip .date-range .form-col { width: 239px; } .section-category-search .search-tab-round-trip .form-field-people { width: 482px; float: left; margin-top: 20px; } .section-category-search .btn-yellow { position: absolute; bottom: 0; right: 0; } .section-category-search .btn-remove { margin-right: 184px; } .section-category-search .form-row:first-child { position: static; } .section-category-search .search-tab-multi .form-field { width: 220px; } .section-category-search .search-tab-multi .form-col { width: 156px; } .section-category-search .search-tab-multi .form-col + .form-col { width: 126px; } .section-category-search .search-tab-multi .form-field-people { margin: 0; } .section-category-search .search-tab-round-trip .form-group .date-range { width: auto; } .section-category-search .search-tab-round-trip .form-group .form-field-people { width: 472px; float: right; margin: 0; } .search-form .add-another-row { margin: 0 0 7px; } .popup-dest { margin-left: -86px; } } @media ( max-width: 1023px ) { .shell { width: 768px; } .nav .shell { padding: 0; } .nav-dropdown .shell { padding: 0 10px 15px; } .nav-dropdown .dropdown-image { display: none; } .nav-list > li > a { padding: 20px 10px; } .nav-list > li.home > a { width: 46px; padding-right: 0; padding-left: 0; } .section-search { height: auto; padding: 20px 0; } .search-form { width: auto; position: relative; top: auto; right: auto; margin: 0; } .search-form .form-row-tablet { width: 50%; float: right; padding-left: 10px; } .search-form .form-row-tablet + .form-row-tablet { float: left; padding: 0 10px 0 0; } .search-form .date-range { clear: both; } .list-categories-group { width: 50%; } .section-slideshow .slide { height: 275px; } .section-slideshow .slide-content { top: 50%; left: 50%; margin: -191px 0 0 -384px; } .section-slideshow .slide-content-default { top: 20px; left: auto; right: 20px; margin: 0; } .subscribe { width: 748px; } .subscribe .subscribe-field { font-size: 12px; width: 207px; } .section-destinations { padding-bottom: 45px; } .footer-nav { padding-bottom: 100px; } .footer-nav li { width: 20%; height: 200px; } .footer-nav li li { width: auto; height: auto; } .footer-nav li.col-abs1, .footer-nav li.col-abs2 { height: auto; position: absolute; top: 230px; } .footer-nav li.col-abs1 { right: 10px; } .footer-nav li.col-abs2 { right: 20%; margin-right: 10px; } .footer-bar { padding-left: 133px; position: relative; } .footer-bar .secured { position: absolute; top: 0; left: 0; } .socials { float: left; } .slideshow-destinations .slide:nth-child(3n) { direction: rtl; } .slideshow-destinations .slide:nth-child(3n) figure { direction: rtl; } .slideshow-destinations .slide:nth-child(odd) { direction: ltr; } .slideshow-destinations .slide:nth-child(odd) figure { direction: rtl; } .section-articles .section-col, .section-articles .section-col:nth-child(even) { width: 572px; float: none; margin: 0 auto 20px; overflow: hidden; } .section-articles .article-col { width: 275px; } .section-category-search .search-tab-round-trip .form-field { width: 354px; margin: 0; } .section-category-search .search-tab-round-trip .date-range { width: 356px; } .section-category-search .search-tab-round-trip .date-range .form-col { width: 175px; } .section-category-search .search-tab-round-trip .form-field-people { width: 354px; margin-top: 20px; } .section-category-search .btn-remove { margin-right: 0px; } .section-category-search .form-row:first-child { position: static; } .section-category-search .search-tab-multi { padding-top: 50px; } .section-category-search .search-tab-multi .form-field { width: 213px; } .section-category-search .search-tab-multi .form-col { width: 152px; } .section-category-search .search-tab-multi .form-col + .form-col { width: 80px; } .section-category-search .search-tab-multi .form-field-people { margin: 0; position: absolute; top: 0; right: 0; } .section-category-search .search-tab-multi .form-field-people .list-calculator { left: auto; right: 0; } .section-category-search .search-tab-round-trip .form-group .form-field-people { width: 354px; } .section-category-search .section-image:before { width: 620px; height: 640px; margin: -320px 0 0 -310px; } .section-category-search .search-form .date-range { clear: none; } .slideshow-flight-deals .slide a figure { width: 196px; height: 196px; } .slideshow-destinations, .slideshow-flights-destinations { padding: 0; } .slideshow-flights-destinations .flex-prev, .slideshow-destinations .flex-prev, .slideshow-flights-destinations .flex-next, .slideshow-destinations .flex-next { display: none; } } @media ( max-width: 767px ) { .nav, .section-search, .header-aside, .breadcrumbs, .section-slideshow, .section-deals, .section-subscribe, .footer, .section-category-search, .section-links, .section-articles { display: none; } .nav-mobile, .section-search-mobile, .nav-toggle, .section-slideshow-mobile, .section-deals-mobile, .footer-mobile, .section-articles-mobile, .datepicker-title.popup-head { display: block; } .shell { width: auto; padding: 0; } /* Sprite Base */ [class^="ico-"] { font-size: 0; line-height: 0; text-indent: -4000px; display: inline-block; vertical-align: middle; background-color: transparent; background-repeat: no-repeat; background-position: 50% 50%; } /* Navigation Icons */ .ico-angle-left { width: 10px; height: 21px; background-image: url(images/mobile/ico-angle-left.png); } .ico-nav-ball { width: 18px; height: 19px; background-image: url(images/mobile/ico-nav-ball.png); } .ico-nav-building { width: 18px; height: 21px; background-image: url(images/mobile/ico-nav-building.png); } .ico-nav-bus { width: 22px; height: 18px; background-image: url(images/mobile/ico-nav-bus.png); } .ico-nav-home { width: 16px; height: 16px; background-image: url(images/mobile/ico-nav-home.png); } .ico-nav-palmtree { width: 19px; height: 25px; background-image: url(images/mobile/ico-nav-palmtree.png); } .ico-nav-plane { width: 16px; height: 19px; background-image: url(images/mobile/ico-nav-airplane.png); } .ico-nav-ski { width: 20px; height: 25px; background-image: url(images/mobile/ico-nav-ski.png); } .ico-nav-suitcase { width: 20px; height: `17px; background-image: url(images/mobile/ico-nav-suitcase.png); } /* Search Icons */ .ico-airplane { width: 16px; height: 19px; background-image: url(images/mobile/ico-airplane.png); } .ico-building { width: 18px; height: 21px; background-image: url(images/mobile/ico-building.png); } .ico-bus { width: 22px; height: 18px; background-image: url(images/mobile/ico-bus.png); } .ico-car { width: 20px; height: 17px; background-image: url(images/mobile/ico-car.png); } .ico-plane-large { width: 22px; height: 25px; background-image: url(images/mobile/ico-airplane-large.png); } .ico-suitcase { width: 20px; height: 17px; background-image: url(images/mobile/ico-suitcase.png); } .ico-calendar, .section-search-mobile .ui-datepicker-trigger:after { width: 17px; height: 20px; background-image: url(images/mobile/ico-calendar.png); } .ico-search { width: 19px; height: 20px; background-image: url(images/mobile/ico-search.png); } .ico-plus, .ico-minus { width: 14px; height: 15px; position: relative; top: -1px; background-image: url(images/mobile/ico-calc.png); } .ico-plus { background-position: 0 100%; } .ico-minus { background-position: 100% 100%; } .ico-autocomplete-airplane { width: 14px; height: 16px; background-image: url(images/mobile/ico-autocomplete-airplane.png); } .ico-autocomplete-marker { width: 14px; height: 16px; background-image: url(images/mobile/ico-autocomplete-marker.png); } /* Search icons active state */ .activated .ico-plus { background-position: 0 0; } .activated .ico-minus { background-position: 100% 0; } a:hover .ico-airplane, a:active .ico-airplane, .current .ico-airplane { background-image: url(images/mobile/ico-airplane-active.png); } a:hover .ico-building, a:active .ico-building, .current .ico-building { background-image: url(images/mobile/ico-building-active.png); } a:hover .ico-bus, a:active .ico-bus, .current .ico-bus { background-image: url(images/mobile/ico-bus-active.png); } a:hover .ico-car, a:active .ico-car, .current .ico-car { background-image: url(images/mobile/ico-car-active.png); } a:hover .ico-suitcase, a:active .ico-suitcase, .current .ico-suitcase { background-image: url(images/mobile/ico-suitcase-active.png); } a:hover .ico-autocomplete-airplane, a:active .ico-autocomplete-airplane { background-image: url(images/mobile/ico-autocomplete-airplane-active.png); } a:hover .ico-autocomplete-marker, a:active .ico-autocomplete-marker { background-image: url(images/mobile/ico-autocomplete-marker-active.png); } /* Social Icons */ .link-youtube, .link-twitter, .link-googleplus, .link-facebook { width: 30px; height: 30px; } .link-youtube { background-image: url(images/mobile/ico-youtube.png); } .link-twitter { background-image: url(images/mobile/ico-twitter.png); } .link-googleplus { background-image: url(images/mobile/ico-googleplus.png); } .link-facebook { background-image: url(images/mobile/ico-facebook.png); } body { font-family: Helvetica, Arial, sans-serif; font-size: 12px; line-height: 1.33333334; color: #757575; font-weight: normal; font-style: normal; text-transform: none; text-decoration: none; text-shadow: none; letter-spacing: 0; word-spacing: 0; direction: rtl; text-size-adjust: none; -ms-text-size-adjust: none; -webkit-text-size-adjust: none; font-smoothing: antialiased; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; background: #fff; min-width: 100%; } a { color: #2196f3; text-decoration: none; } a:hover, a:active, a:focus { text-decoration: underline; } a:focus { outline: 0; } a[href^="tel"], a[href^="tel"]:hover, a[href^="tel"]:active, a[href^="tel"]:focus { color: inherit; text-decoration: none; cursor: default; } h2 { font-size: 24px; line-height: 1; color: #2196f3; font-weight: 700; font-style: italic; } h2 em { font-family: 'FBMarzipan', sans-serif; font-size: 20px; color: #757575; font-weight: 700; display: block; } h3 { font-size: 20px; line-height: 1; color: #2196f3; font-style: italic; } h3 em { font-family: 'FBMarzipan', sans-serif; color: #757575; display: block; } .wrapper { position: relative; left: 0; z-index: 10; } .slides:after, .form-row:after { content: ''; line-height: 0; display: table; clear: both; } [class^="btn"] { display: inline-block; vertical-align: middle; } [class^="btn-"]:focus { outline: 0; } .btn-yellow { font-size: 16px; line-height: 20px; color: #003660; font-weight: bold; text-shadow: 0 1px 0 rgba(255,255,255,.9); text-align: center; padding: 5px 23px; border: 1px solid #211d04; background-color: #ffdf0f; border-radius: 3px; box-shadow: 0 2px 2px rgba(0,0,0,.3), inset 0 0 0 1px #fff; } .btn-yellow:hover, .btn-yellow:active { text-decoration: none; background-color: #e9cf1c; } .btn-blue { font-size: 14px; line-height: 20px; color: #fff; font-weight: bold; text-align: center; min-width: 174px; padding: 5px; border: 3px solid #c9c9c9; background-color: #2196f3; border-radius: 3px; box-shadow: 0 1px 2px rgba(0,0,0,0.5), inset 0 0 0 1px #fff; } .btn-blue:hover, .btn-blue:active { text-decoration: none; background-color: #137ed3; } .btn-blue-large { font-size: 18px; border-radius: 0; } .form-btn { font-size: 16px; line-height: 20px; color: #fff; text-align: center; font-weight: bold; width: 100%; display: block; padding: 10px 0; border: 0; background-color: #2195f3; border-radius: 0; box-shadow: 0 1px 1px rgba(0,0,0,.6); } .form-btn:hover, .form-btn:active { color: #2195f3; background-color: #fff; } .btn-close-autocomplete { font-size: 12px; line-height: 20px; color: #fff; text-align: center; text-shadow: 0 -1 0 rgba(0, 0, 0, .7); display: block; left: 14px; right: 14px; z-index: 202; padding: 4px 0; border: 1px solid #aaa; margin-top: -34px; background-color: #434343; } .subscribe-btn { font-size: 16px; line-height: 20px; color: #01579b; font-weight: bold; text-align: center; text-shadow: 0 1px 0 rgba(255,255,255,.5); width: 100%; height: 38px; display: block; padding: 9px 0; border: 0; background-color: #ffe00f; border-radius: 0; box-shadow: 0 2px 2px rgba(0,0,0,.3); } .subscribe-btn:hover, .subscribe-btn:active { color: #ffe00f; background-color: #01579b; } ::-webkit-input-placeholder { color: #000; opacity: .54; } :-moz-placeholder { color: #000; opacity: .54; } ::-moz-placeholder { color: #000; opacity: .54; } :-ms-input-placeholder { color: #000; opacity: .54; } input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], input[type="color"], textarea, select, button { font-family: Helvetica, Arial, sans-serif; font-size: 14px; line-height: 18px; color: #000; font-weight: normal; display: block; width: 100%; height: 40px; padding: 10px 7px; border: 1px solid #aaa; background: #fff; border-radius: 0; box-shadow: inset 2px 3px 4px rgba(0,0,0,.25); } input[type="text"]:focus, input[type="password"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="time"]:focus, input[type="url"]:focus, input[type="color"]:focus, textarea:focus { outline: 0 none; } input[type="hidden"], .hidden { display: none; } input, textarea, button, a[href^="tel"] { -webkit-appearance: none; -moz-appearance: none; } select, input[type="checkbox"], input[type="radio"] { -webkit-appearance: button; } textarea { height: 100px; overflow: auto; resize: none; -webkit-overflow-scrolling: touch; } input[type="radio"], input[type="checkbox"] { width: 17px; height: 17px; display: inline-block; vertical-align: middle; padding: 3px; border: 1px solid #a9a9a9; background-color: #fff; box-shadow: inset 0 1px 5px rgba(0,0,0,.25); } input[type="radio"]:before, input[type="checkbox"]:before { content: ''; width: 9px; height: 9px; display: none; background-color: #2196f3; } input[type="radio"], input[type="radio"]:before { border-radius: 50%; } input:checked:before { display: block; } input:checked + label { color: #2196f3; font-weight: bold; } input[type="number"] { text-align: center; } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; display: none; } .radio label { font-size: 12px; font-weight: normal; text-shadow: none; } .radio input:checked + label { color: #2196f3; } ul, ol { list-style-position: inside; } nav ul, [class^="list-"], .nav-tabs, .deals .slides, .flex-direction-nav, .flex-control-nav, .socials ul { list-style: none outside none; } .list-deals li { border-top: 1px solid #dadada; } .list-deals li:first-child { border-top: 0; } .list-deals a { color: #828282; text-shadow: 0 1px 0 rgba(255,255,255,.75); display: block; min-height: 100px; position: relative; padding: 10px 97px 10px 10px; } .list-deals a > img { display: block; width: 70px; height: 70px; position: absolute; top: 15px; right: 15px; border: 1px solid #fff; border-radius: 50%; box-shadow: 0 0 0 5px #e0e0e0; } .list-deals a em { font-size: 14px; color: #2196f3; font-weight: bold; display: block; padding-top: 12px; } .list-deals a .rating { margin-bottom: 2px; } .list-deals a .deal-price { font-size: 11px; position: absolute; bottom: 15px; left: 10px; } .list-deals a .deal-price strong { font-size: 20px; color: #004990; } .list-deals a:hover, .list-deals a:active { text-decoration: none; background-color: #fff; } .list-search-categories { overflow: hidden; padding: 0 0 10px; } .list-search-categories li { width: 20%; float: right; position: relative; padding: 0; } .list-search-categories li:before { display: none; } .list-search-categories a { font-size: 12px; line-height: 16px; color: #757575; text-align: center; text-shadow: 0 1px 0 rgba(255,255,255,.5); display: block; padding-top: 4px; border: 1px solid transparent; border-radius: 0; } .list-search-categories a [class^="ico-"] { display: block; } .list-search-categories a .ico-airplane { margin: 2px auto 5px; } .list-search-categories a .ico-building { margin: 0 auto 6px; } .list-search-categories a .ico-suitcase { margin: 2px auto 8px; } .list-search-categories a .ico-car { margin: 2px auto 8px; } .list-search-categories a .ico-bus { margin: 2px auto 7px; } .list-search-categories a:hover, .list-search-categories a:active, .list-search-categories .current a { color: #fff; text-decoration: none; text-shadow: 0 -1px 0 rgba(0,0,0,.5); background-color: #1177c7; } .list-search-categories .current a { font-weight: bold; } .list-categories-group { width: auto; border: 1px solid #aaa; margin-bottom: 15px; overflow: hidden; background-color: #fff; border-radius: 0; } .list-categories-group li { width: 50%; float: right; border-right: 1px solid #aaa; } .list-categories-group li:first-child { border-right: 0; } .list-categories-group a { font-size: 14px; line-height: 20px; color: #434343; text-align: center; display: block; padding: 7px 0; } .list-categories-group a:hover, .list-categories-group a:active, .list-categories-group .current a { color: #fff; text-decoration: none; background-color: #2196f3; box-shadow: inset 0 1px 2px rgba(0,0,0,.25); } .list-radios { color: #969696; padding-bottom: 15px; overflow: hidden; } .list-radios li { float: right; padding-right: 22px; } .list-radios li:first-child { padding-right: 0; } .list-tours { overflow: hidden; margin-left: -10px; } .list-tours li { width: 33.33%; width: calc(100% / 3); width: -webkit-calc(100% / 3); float: right; padding: 0 0 5px 10px; } .list-tours a { line-height: 17px; display: block; padding: 4px 5px; border: 1px solid #aaa; background-color: #efefef; } .list-tours a:hover, .list-tours a:active, .list-tours .current a { text-decoration: none; background-color: #fff; } .list-form-actions { clear: both; margin-bottom: 10px; } .list-form-actions:after { content: ''; line-height: 0; display: table; clear: both; } .list-form-actions li { width: 50%; float: right; } .list-form-actions a { font-size: 14px; line-height: 22px; color: #757575; font-weight: bold; text-shadow: 0 1px 0 rgba(255,255,255,.75); display: block; } .list-form-actions .current { display: none; } .nav-mobile { font-size: 14px; line-height: 20px; color: #434343; font-weight: bold; width: calc(100% - 53px); width: -webkit-calc(100% - 53px); position: fixed; top: 0; right: 0; bottom: 0; z-index: 12; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; background-color: #f7f7f7; } .nav-mobile:before { content: ''; width: 10px; display: block; position: absolute; top: 0; left: 0; bottom: 0; z-index: 10; box-shadow: 3px 0 5px rgba(0,0,0,.5) inset; } .nav-mobile h2 { font-size: 24px; line-height: 30px; color: #fff; font-weight: bold; padding: 9px 10px 11px; background-color: #2196f3; } .nav-mobile li { border-bottom: 1px solid #757575; } .nav-mobile li ul { max-height: 0; padding: 0 10px; overflow: hidden; background-color: #fff; } .nav-mobile li ul a { padding-left: 0; padding-right: 0; font-weight: normal; } .nav-mobile li li { border-top: 1px solid #757575; border-bottom: 0; } .nav-mobile li li:first-child { border-top: 0; } .nav-mobile a { color: #757575; display: block; position: relative; padding: 9px 10px 11px 32px; } .nav-mobile a:hover, .nav-mobile a:active { text-decoration: none; } .nav-mobile [class^="ico-"] { width: 29px; background-repeat: no-repeat; background-position: 100% 50%; } .nav-mobile .ico-angle-left { width: 22px; text-align: center; position: absolute; top: 50%; left: 0; margin-top: -10px; } .nav-mobile .expanded ul { max-height: 600px; border-top: 1px solid #757575; } .nav-mobile .expanded .ico-angle-left { height: 44px; margin-top: -14px; left: 7px; } .nav-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: -1; background-color: #000; opacity: 0; } .show-nav, .show-nav body { overflow: hidden; } .show-nav .nav-overlay { z-index: 11; opacity: .8; } .footer-mobile .footer-nav { padding: 0; border-top: 1px solid #919191; margin-bottom: 15px; } .footer-mobile .footer-nav li { width: auto; height: auto; float: none; border-bottom: 1px solid #919191; } .footer-mobile .footer-nav a { font-size: 12px; line-height: 20px; display: block; padding: 5px 0; } .socials { float: none; padding: 10px 0; border-bottom: 1px solid #8f8f8f; overflow: hidden; } .socials ul { float: left; } .socials li { float: right; margin: 0 10px 0 0; } .socials a { display: block; } .socials-label { font-size: 14px; line-height: 20px; color: #fff; float: right; padding: 5px 0; } .nav-tabs { border: 1px solid #aaa; margin: 0 10px; overflow: hidden; } .nav-tabs li { width: 33.33%; width: calc(100% / 3); width: -webkit-calc(100% / 3); float: right; border-right: 1px solid #aaa; } .nav-tabs li:first-child { border-right: 0; } .nav-tabs a { font-size: 14px; line-height: 20px; color: #434343; text-align: center; display: block; padding: 9px 0; background-color: #fff; } .nav-tabs a:hover, .nav-tabs a:active, .nav-tabs .current a { color: #fff; text-decoration: none; background-color: #2196f3; box-shadow: inset 0 1px 2px rgba(0,0,0,.25); } .section-search-mobile { border-bottom: 2px solid #01579b; background-color: #f5f5f5; } .section-search-mobile h2 { font-size: 18px; line-height: 25px; color: #757575; font-style: normal; text-shadow: 0 1px 0 rgba(255,255,255,.75); padding-bottom: 10px; border-bottom: 1px solid #aaa; margin-bottom: 15px; } .section-search-mobile .search-tabs { position: relative; margin: 0; } .section-search-mobile .search-tab, .section-search-mobile .search-tab-inner { position: absolute; top: 0; left: 0; right: 0; z-index: -2; opacity: 0; visibility: hidden; background-color: #f7f7f7; } .section-search-mobile .search-tab.visible, .section-search-mobile .search-tab-inner.visible { position: relative; top: 0; left: auto; right: auto; z-index: auto; opacity: 1; visibility: visible; } .section-search-mobile { padding: 10px 10px 20px; } .section-search-mobile hr { border: 0; border-top: 1px solid #aaa; border-bottom: 1px solid #fff; margin-bottom: 10px; clear: both; } .section-search-mobile h4 { font-size: 14px; line-height: 20px; color: #434343; font-weight: bold; padding-bottom: 10px; text-shadow: 0 1px 0 rgba(255,255,255,.75); } .section-search-mobile .form-row { width: 100%; float: left; margin-bottom: 14px; } .section-search-mobile .form-col { width: calc(50% - 5px); width: -webkit-calc(50% - 5px); float: right; } .section-search-mobile .form-col + .form-col { float: left; } .section-search-mobile .form-group { padding: 5px; margin: 0 -5px 10px; background-color: #ddd; clear: both; } .section-search-mobile .form-group-hidden { display: none; } .section-search-mobile .form-group-hidden.visible { display: block; } .section-search-mobile .form-group:after, .section-search-mobile .search-tab-inner:after { content: ''; line-height: 0; display: table; clear: both; } .section-search-mobile .has-button { position: relative; padding-left: 40px; } .section-search-mobile .has-number { position: relative; padding-left: 39px; padding-right: 39px; } .section-search-mobile .close-group { font-size: 14px; line-height: 24px; color: #4f4f4f; text-shadow: 0 1px 0 rgba(255,255,255,.75); text-align: left; display: block; margin-bottom: 15px; } .section-search-mobile .has-disabled { position: relative; } .section-search-mobile .has-disabled:before { content: ''; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 4; border: 1px solid #aaa; background: url(images/mobile/disabled-pattern.png) repeat 0 0; } .section-search-mobile .btn-search, .section-search-mobile .btn-remove, .section-search-mobile .btn-increment, .section-search-mobile .btn-decrement, .section-search-mobile .has-select:after, .custom-select:after { font-size: 18px; line-height: 38px; color: #4f4f4f; text-align: center; text-shadow: 0 1px 0 rgba(255,255,255,.75); width: 40px; height: 40px; display: block; position: absolute; top: 0; left: 0; border: 1px solid #aaa; margin: 0; border-radius: 0; box-shadow: none; } .section-search-mobile .has-select, .custom-select { position: relative; } .section-search-mobile .has-select:before { content: ''; width: 20px; height: 11px; display: block; position: absolute; top: 50%; left: 9px; z-index: 2; margin-top: -4px; background: url(images/mobile/ico-angle-down.png) no-repeat 0 0; } .section-search-mobile .has-select:after { content: ''; } .section-search-mobile .btn-increment, .section-search-mobile .btn-decrement { line-height: 40px; } .section-search-mobile .btn-decrement { left: auto; right: 0; } .section-search-mobile .btn-remove { color: #008d00; text-shadow: 0 1px 0 rgba(255,255,255,.75); left: -56px; } .section-search-mobile .btn-remove.hidden { display: none; } .section-search-mobile .ui-datepicker-trigger { font-size: 0; line-height: 0; color: transparent; text-align: center; width: 40px; height: 40px; display: block; position: absolute; top: 0; left: 0; z-index: 2; border: 1px solid #aaa; margin: 0; border-radius: 0; box-shadow: none; } .section-search-mobile .ui-datepicker-trigger:after { content: ''; display: block; margin: 0 auto; } .section-search-mobile .btn-search, .section-search-mobile .btn-remove, .section-search-mobile .ui-datepicker-trigger, .section-search-mobile .btn-increment, .section-search-mobile .btn-decrement, .section-search-mobile .has-select:after, .custom-select:after { background: rgb(255,255,255); background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(231,231,231,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(231,231,231,1))); background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(231,231,231,1) 100%); background: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(231,231,231,1) 100%); background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(231,231,231,1) 100%); background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(231,231,231,1) 100%); } .section-search-mobile .btn-search:hover, .section-search-mobile .btn-search:hover:active, .section-search-mobile .btn-remove:hover, .section-search-mobile .btn-remove:active, .section-search-mobile .ui-datepicker-trigger:hover, .section-search-mobile .ui-datepicker-trigger:active, .section-search-mobile .btn-increment:hover, .section-search-mobile .btn-decrement:hover, .section-search-mobile .btn-increment:active, .section-search-mobile .btn-decrement:active, .section-search-mobile .has-select:hover:after, .section-search-mobile .has-select:active:after, .custom-select:hover:after, .custom-select:active:after { background: rgb(231,231,231); background: -moz-linear-gradient(top, rgba(231,231,231,1) 0%, rgba(255,255,255,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(231,231,231,1)), color-stop(100%,rgba(255,255,255,1))); background: -webkit-linear-gradient(top, rgba(231,231,231,1) 0%,rgba(255,255,255,1) 100%); background: -o-linear-gradient(top, rgba(231,231,231,1) 0%,rgba(255,255,255,1) 100%); background: -ms-linear-gradient(top, rgba(231,231,231,1) 0%,rgba(255,255,255,1) 100%); background: linear-gradient(to bottom, rgba(231,231,231,1) 0%,rgba(255,255,255,1) 100%); } .section-search-mobile .has-number:before { content: attr(data-value); font-size: 14px; line-height: 1; color: #434343; text-align: center; white-space: pre-wrap; display: block; position: absolute; top: 50%; left: 40px; right: 40px; padding: 0 5px; opacity: .54; transform: translateY(-50%); -webkit-transform: translateY(-50%); } .section-search-mobile .has-number.started:before { opacity: 1; } .section-search-mobile .has-number .field { color: transparent; } .section-search-mobile .dropdown1, .section-search-mobile .dropdown2 { display: none; } .section-search-mobile .dropdown1.visible, .section-search-mobile .dropdown2.visible { display: block; } .rooms-wrapper, .room-section { width: 100%; float: left; } .room-section { display: none; } .room-section.visible { display: block; } /* Subscribe Form */ .footer-mobile .subscribe { width: auto; padding-bottom: 20px; border-bottom: 1px solid #8f8f8f; } .footer-mobile .subscribe label { font-size: 12px; line-height: 14px; color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.5); width: auto; min-height: 42px; float: none; display: block; position: relative; padding: 0 50px 0 5px; margin-bottom: 10px; } .footer-mobile .subscribe label strong { font-size: 18px; line-height: 20px; display: block; } .footer-mobile .subscribe label:before { content: ''; width: 42px; height: 42px; display: block; position: absolute; top: 3px; right: 0; margin-top: 0; background: #2196f3 url(images/mobile/ico-envelope.png) no-repeat 50% 50%; border-radius: 50%; } .footer-mobile .subscribe-field, .footer-mobile .subscribe-btn { width: 100%; margin-bottom: 10px; float: none; display: block; } .footer-mobile .subscribe-btn { margin: 0; } .header { position: relative; padding: 0 10px; border-bottom: 1px solid #01579b; background: #2196f3; } .logo { font-size: 0; line-height: 0; text-indent: -4000px; width: 159px; height: 49px; display: block; float: none; margin: 0 auto; background: url(images/mobile/logo.png) no-repeat 0 0; } .nav-toggle { width: 33px; height: 33px; display: block; position: absolute; top: 9px; right: 10px; padding-top: 7px; border: 1px solid #fff; } .nav-toggle span { width: 21px; height: 3px; display: block; margin: 0 auto 4px; background-color: #fff; } .section-vacations { text-align: center; position: relative; padding: 13px 0 29px; border-bottom: 2px solid #01579b; background-color: #e9e9e9; } .section-vacations h2 { padding-bottom: 15px; } .section-deals { padding-top: 15px; padding-bottom: 0; border-bottom: 2px solid #01579b; background-color: #f5f5f5; } .section-deals h2 { text-align: center; padding: 0 10px 15px; } .section-tabs { position: relative; } .section-tabs .tab { position: absolute; top: 0; left: 0; right: 0; z-index: -2; opacity: 0; visibility: hidden; background-color: #f7f7f7; } .section-tabs .tab.visible { position: relative; top: auto; left: auto; right: auto; z-index: auto; opacity: 1; visibility: visible; } .section-destinations { position: relative; padding: 15px 10px 30px; border-bottom: 2px solid #01579b; background-color: #e9e9e9; } .section-destinations h2 { text-align: center; padding-bottom: 15px; } .section-flights-deals { padding: 20px 10px 30px; border-bottom: 2px solid #01579b; background-color: #f5f5f5; } .section-continental { padding: 15px 10px 30px; border-bottom: 2px solid #01579b; background-color: #e9e9e9; } .section-continental h2 { text-align: center; padding-bottom: 15px; } .section-flights-destinations { padding: 15px 10px 30px; border-bottom: 2px solid #01579b; background-color: #f5f5f5; } .section-flights-destinations h2 { text-align: center; padding-bottom: 15px; } .section-articles { padding: 20px 10px 0; background-color: #e9e9e9; } .section-articles h3 { text-align: center; position: relative; padding-bottom: 5px; margin-bottom: 10px; } .section-articles h3:after { content: ''; height: 1px; display: block; position: absolute; top: 100%; left: 0; right: 0; } .section-articles h3:after { background: rgb(33,150,243); background: -moz-linear-gradient(left, rgba(33,150,243,0) 0%, rgba(33,150,243,1) 50%, rgba(33,150,243,0) 100%); background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(33,150,243,0)), color-stop(50%,rgba(33,150,243,1)), color-stop(100%,rgba(33,150,243,0))); background: -webkit-linear-gradient(left, rgba(33,150,243,0) 0%,rgba(33,150,243,1) 50%,rgba(33,150,243,0) 100%); background: -o-linear-gradient(left, rgba(33,150,243,0) 0%,rgba(33,150,243,1) 50%,rgba(33,150,243,0) 100%); background: -ms-linear-gradient(left, rgba(33,150,243,0) 0%,rgba(33,150,243,1) 50%,rgba(33,150,243,0) 100%); background: linear-gradient(to right, rgba(33,150,243,0) 0%,rgba(33,150,243,1) 50%,rgba(33,150,243,0) 100%); } .section-articles p { text-align: justify; } .section-articles img { width: 100%; height: auto; display: block; border: 5px solid #fff; } .section-articles figure { position: relative; border: 1px solid #ddd; margin-bottom: 8px; } .section-articles figure:after { content: ''; height: 8px; display: block; position: absolute; top: 100%; left: 0; right: 0; background: url(images/mobile/shadow.png) no-repeat 50% 0; background-size: 100% auto; -webkit-background-size: 100% auto; } .section-articles .read-more, .section-articles .hidden.visible { display: block; } .section-articles .read-more.hidden { display: none; } .section-articles .article { padding-bottom: 15px; } .flex-viewport { direction: ltr; } .flex-viewport .slides { direction: rtl; } .flex-control-nav { font-size: 0; line-height: 0; text-align: center; } .flex-control-nav li { display: inline-block; vertical-align: top; padding: 0 4px; } .flex-control-nav a { width: 6px; height: 6px; display: block; background-color: #9d9d9d; border-radius: 50%; box-shadow: 0 1px 0 rgba(255,255,255,.6); } .flex-control-nav a:hover, .flex-control-nav a:active, .flex-control-nav a.flex-active { background-color: #2196f3; } .section-slideshow { position: relative; border-bottom: 2px solid #01579b; } .section-slideshow img { width: 100%; height: auto; display: block; } .section-slideshow .slide { height: auto; } .section-slideshow .slide a { display: block; position: relative; } .section-slideshow .slide-overlay { font-family: 'AlmoniTzar', sans-serif; font-size: 25px; line-height: 1; color: #fff; font-weight: 700; text-shadow: 1px 1px 0 rgba(0,0,0,.5); position: absolute; top: 32px; right: 10px; } .section-slideshow .slide-overlay strong { font-size: 50px; display: block; } .section-slideshow .slide-overlay strong sup { font-size: 13px; font-weight: 300; } .section-slideshow .slide-overlay strong sub { font-size: 25px; vertical-align: baseline; } .section-slideshow .slide-overlay .btn-yellow { font-size: 8px; line-height: 14px; padding: 2px 15px 0; margin-top: 7px; border-radius: 0; } .section-slideshow-mobile .flex-direction-nav { display: none; } .section-slideshow-mobile .flex-control-nav { width: 100%; height: auto; position: absolute; bottom: 5px; left: 0; right: 0; background-color: transparent; } .section-slideshow-mobile .flex-control-nav li { padding: 0 2px; } .section-slideshow-mobile .flex-control-nav a { width: 10px; height: 10px; border: 2px solid #fff; } .slideshow-vacations .slide a { display: block; position: relative; padding: 5px; } .slideshow-vacations .slide a img { width: 196px; height: 196px; display: block; border: 1px solid #fff; margin: 0 auto; border-radius: 50%; box-shadow: 0 0 0 5px #c9c9c9; } .slideshow-vacations .slide [class^="btn"] { position: absolute; bottom: -1px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); margin: 0; } .slideshow-vacations .flex-control-nav { position: absolute; bottom: 0; left: 0; right: 0; margin-bottom: 12px; } .section-destinations .section-head { padding-bottom: 0; } .slideshow-destinations .slide a { display: block; } .slideshow-destinations .slide figure { width: 275px; position: relative; border: 6px solid #c9c9c9; margin: 0 auto; } .slideshow-destinations .slide img { width: 100%; height: auto; display: block; border: 0; box-shadow: 0 0 0 1px #bebebe;} .slideshow-destinations .slide strong { font-size: 18px; line-height: 20px; color: #fff; font-style: italic; display: block; position: absolute; bottom: 0; left: 0; right: 0; padding: 10px; background-color: rgba(33,150,243,.8); } .slideshow-destinations .flex-control-nav { position: absolute; bottom: 0; left: 0; right: 0; margin: 12px 0 0; } .slideshow-flight-deals { position: relative; } .slideshow-flight-deals .slide a { font-size: 12px; line-height: 18px; color: #656565; text-shadow: 0 1px 0 rgba(255,255,255,.6); text-align: center; display: block; padding-bottom: 5px; } .slideshow-flight-deals .slide a strong { font-size: 16px; line-height: 22px; color: #3b3e3e; display: block; } .slideshow-flight-deals .slide a strong span { color: #2196f3; } .slideshow-flight-deals .slide a p { max-width: 70%; margin: 0 auto; } .slideshow-flight-deals .slide a p span { color: #828282; display: block; } .slideshow-flight-deals .slide a small { font-size: 11px; color: #828282; display: block; } .slideshow-flight-deals .slide a small span { font-size: 20px; line-height: 28px; color: #004990; font-weight: bold; display: inline-block; vertical-align: top; } .slideshow-flight-deals .slide a figure { width: 230px; height: 230px; display: block; border: 10px solid #2196f3; margin: 0 auto 10px; border-radius: 50%; } .slideshow-flight-deals .slide a figure img { width: 100%; height: 100%; display: block; border: 2px solid #fff; border-radius: 50%; } .slideshow-flight-deals .slide a .btn-blue { text-shadow: none; padding: 6px 5px; border: 1px solid #2196f3; box-shadow: 0 2px 2px rgba(0,0,0,.3), inset 0 0 0 1px #fff; } .slideshow-flight-deals .slide a:hover, .slideshow-flight-deals .slide a:active { text-decoration: none; } .slideshow-flight-deals .flex-control-nav { position: absolute; top: 100%; left: 0; right: 0; margin-top: 8px; } .slideshow-flight-deals .flex-control-nav li { padding: 0 2px; } .slideshow-flight-deals .flex-control-nav a { width: 10px; height: 10px; border: 2px solid #fff; } .slideshow-continents { position: relative; } .slideshow-continents .slide figure { width: 196px; height: 196px; position: relative; margin: 0 auto 10px; overflow: hidden; border-radius: 50%; } .slideshow-continents .slide img { width: 100%; height: 100%; display: block; border-radius: 50%; } .slideshow-continents .slide figcaption { font-size: 16px; line-height: 20px; color: #3b3b3b; font-weight: bold; text-align: center; text-shadow: 0 1px 0 rgba(255,255,255,.6); position: absolute; bottom: 27px; left: 17px; right: 17px; padding: 6px 0; background-color: rgba(255,255,255,.8); border-radius: 0 0 50px 50px; } .slideshow-continents .slide ul { list-style: none outside none; width: 196px; border: 1px solid #c9c9c9; margin: 0 auto; background-color: #fff; } .slideshow-continents .slide li { border-top: 1px solid #c9c9c9; } .slideshow-continents .slide li:first-child { border-top: 0; } .slideshow-continents .slide a { color: #828282; line-height: 20px; text-shadow: 0 1px 0 rgba(255,255,255,.6); display: block; padding: 6px 10px; overflow: hidden; } .slideshow-continents .slide a span { color: #3b3e3e; font-weight: bold; float: right; } .slideshow-continents .slide a span strong { color: #2196f3; } .slideshow-continents .slide a small { font-size: 100%; float: left; } .slideshow-continents .slide a small strong { font-size: 18px; color: #004990; display: inline-block; vertical-align: top; } .slideshow-continents .slide a:hover, .slideshow-continents .slide a:active { text-decoration: none; background-color: #e9e9e9; } .section-continental .flex-control-nav { position: absolute; top: 100%; left: 0; right: 0; margin-top: 12px; } .slideshow-flights-destinations { position: relative; } .slideshow-flights-destinations .slide figure { width: 275px; position: relative; border: 6px solid #c9c9c9; margin: 0 auto; } .slideshow-flights-destinations .slide img { width: 100%; height: auto; border: 4px solid #fff; } .slideshow-flights-destinations .slide em { font-size: 18px; line-height: 20px; color: #fff; font-weight: bold; display: block; position: absolute; bottom: 4px; left: 4px; right: 4px; padding: 10px; background-color: rgba(33,150,243,.8); } .section-flights-destinations .flex-control-nav { position: absolute; top: 100%; left: 0; right: 0; margin-top: 12px; } .footer-mobile { color: #fff; position: relative; z-index: 6; padding: 20px 10px 0; border-top: 6px solid #03a9f4; background-color: #757575; box-shadow: 0 1px 3px rgba(0,0,0,.3) inset; } .footer-mobile a { color: #fff; } .footer-mobile a:hover, .footer-mobile a:active { color: #2196f3; text-decoration: none; } .footer-mobile .footer-bar { padding-bottom: 20px; border-bottom: 1px solid #919191; margin-bottom: 15px; overflow: hidden; } .footer-mobile .footer-bar .secured { font-size: 12px; line-height: 14px; color: #fff; float: left; position: relative; padding-left: 22px; background: url(images/ico-lock.png) no-repeat 0 50%; } .footer-mobile .footer-bar .secured img { display: block; } .footer-mobile .copyright { font-size: 12px; line-height: 17px; color: #9a9a9a; text-align: center; padding: 15px 0; } .popup { width: 100%; max-height: 100%; position: absolute; top: 0; left: 0; right: 0; z-index: 223; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; background: #e9e9e9; } .popup-head { position: relative; padding: 9px 10px; overflow: hidden; background-color: #2196f3; } .popup-head h4 { font-size: 14px; line-height: 23px; color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.5); font-weight: bold; float: right; padding: 5px 0; margin: 0; } .popup-head .close-popup, .popup-head .close-datepicker { font-size: 0; line-height: 0; text-indent: -4000px; width: 33px; height: 33px; float: left; border: 1px solid #fff; position: static; background: none; } .popup-head .close-popup:hover, .popup-head .close-datepicker:hover, .popup-head .close-popup:active, .popup-head .close-datepicker:active { background: none; } .popup-head .close-popup .ico-close, .popup-head .close-datepicker .ico-close { width: 17px; height: 16px; display: block; margin: 7px auto 0; background: url(images/mobile/ico-close.png) no-repeat 0 0; } .popup-body { padding: 15px 10px 10px; border: 1px solid #01579b; border-top: 0; } .popup-body h4 { font-size: 14px; line-height: 20px; color: #4f4f4f; font-weight: bold; padding-bottom: 5px; margin: 0; } .popup-body .list-tours { margin-bottom: 10px; } .popup-dest { padding: 0; } .popup-dest .dest-form { padding: 15px; border: 1px solid #aaa; background-color: #efefef; } .popup-dest .custom-select-mobile { margin-bottom: 15px; position: relative; } .popup-dest .custom-select-mobile:before { content: ''; width: 0; height: 0; display: block; position: absolute; top: 50%; left: 11px; border: 4px solid transparent; border-top-color: #4f4f4f; margin-top: -1px; } .ui-autocomplete { max-height: 214px; width: auto !important; position: absolute; left: 10px !important; right: 10px !important; z-index: 200; padding-bottom: 30px; overflow: auto; overflow-x: hidden; background: #fff; list-style: none outside none; border: 4px solid rgba(0,0,0,.8); box-shadow: inset 0 0 0 1px #fff; } .ui-autocomplete .ui-menu-item + .ui-menu-item { border-top: 1px solid #aaa; } .ui-autocomplete .ui-menu-item .ui-corner-all { font-size: 12px; line-height: 18px; color: #4f4f4f; display: block; padding: 5px; } .ui-autocomplete .ui-menu-item .ui-corner-all:hover, .ui-autocomplete .ui-menu-item .ui-state-focus { color: #fff; text-decoration: none; background-color: #2196f3; } .ui-autocomplete .ui-menu-item [class^="ico-"] { margin-left: 5px; } .ui-datepicker { width: 100%; min-width: 0; max-width: none; position: absolute; top: 0 !important; left: 0 !important; right: 0 !important; z-index: 201 !important; padding: 0 10px 10px; border: 1px solid #01579b; border-top: 0; margin: 0; background: #f4f4f4; } .ui-datepicker .datepicker-title { color: #01579b; text-align: center; padding: 7px 10px; margin: 0 -11px; } .ui-datepicker .datepicker-title h3 { font-size: 14px; line-height: 1.5; color: #434343; text-align: center; font-weight: bold; } .ui-datepicker .ui-datepicker-header { min-height: 28px; position: relative; padding: 0; border: 1px solid #bfbfbf; margin: 10px 0; } .ui-datepicker .ui-datepicker-header { background: rgb(254,254,254); background: -moz-linear-gradient(top, rgba(254,254,254,1) 0%, rgba(220,220,220,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(254,254,254,1)), color-stop(100%,rgba(220,220,220,1))); background: -webkit-linear-gradient(top, rgba(254,254,254,1) 0%,rgba(220,220,220,1) 100%); background: -o-linear-gradient(top, rgba(254,254,254,1) 0%,rgba(220,220,220,1) 100%); background: -ms-linear-gradient(top, rgba(254,254,254,1) 0%,rgba(220,220,220,1) 100%); background: linear-gradient(to bottom, rgba(254,254,254,1) 0%,rgba(220,220,220,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefefe', endColorstr='#dcdcdc',GradientType=0 ); } .ui-datepicker .ui-datepicker-title { font-size: 14px; line-height: 18px; color: #333; text-shadow: 0 1px rgba(255,255,255,.6); text-align: center; font-weight: bold; display: block; padding: 10px 5px; margin: 0 38px; background: url(images/mobile/dp-head.png) repeat 0 0; box-shadow: 0px 1px 0px rgba(0,0,0,0.5) inset; } .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position: absolute; top: 0; border: 0; border-radius: 0; width: 38px; height: 38px; } .ui-datepicker .ui-datepicker-prev .ui-icon, .ui-datepicker .ui-datepicker-next .ui-icon { position: absolute; top: 50%; left: 50%; width: 8px; height: 17px; margin: -8px 0 0 -4px; background: url(images/mobile/calendar-arrows.png) no-repeat right 0; } .ui-datepicker .ui-datepicker-next .ui-icon { background-position: 0 0; } .ui-datepicker .ui-datepicker-prev { right: 0 !important; border-left: 1px solid #464646; } .ui-datepicker .ui-datepicker-next { left: 0 !important; border-right: 1px solid #464646; } .ui-datepicker .ui-datepicker-prev.ui-state-disabled, .ui-datepicker .ui-datepicker-next.ui-state-disabled { cursor: default; } .ui-datepicker .ui-datepicker-prev.ui-state-disabled .ui-icon { background-position: -8px -17px; } .ui-datepicker .ui-datepicker-next.ui-state-disabled .ui-icon { background-position: 0 -17px; } .ui-datepicker table { border-collapse: collapse; margin: 0; } .ui-datepicker table th { font-weight: normal; color: #4f4f4f; font-size: 14px; line-height: 19px; padding: 0 0 5px; } .ui-datepicker table td { background: #fff; border: 1px solid #aaa; width: 44px; font-size: 14px; line-height: 24px; vertical-align: middle; color: #434343; text-align: center; padding: 0; font-weight: bold; } .ui-datepicker table td:first-child { border-right: 0; } .ui-datepicker table td:last-child { border-left: 0; } .ui-datepicker table tr:first-child td { border-top: 0; } .ui-datepicker table tr:last-child td { border-bottom: 0; } .ui-datepicker table td a, .ui-datepicker table td span { height: 44px; padding: 9px 0; border: 1px solid transparent; display: block; color: #434343; text-align: center; } .ui-datepicker table td a:hover { position: relative; z-index: 2; border: 1px solid #333; margin: 0; } .ui-datepicker table td a.ui-state-active { background: #2196f3; margin: 0; border: 0; color: #fff; } .ui-datepicker table td a.ui-state-highlight { background-color: #efefef; } .ui-datepicker table td.highlight a { background-image: url(images/mobile/calendar-arrow.png); background-repeat: no-repeat; background-position: 0 0; } .ui-datepicker table td a:hover { text-decoration: none; } .ui-datepicker table td.ui-datepicker-unselectable, .ui-datepicker table td.ui-state-disabled { color: #959595; opacity: 1; background: url(images/mobile/dp-disabled.png) repeat 0 0; } .ui-datepicker table td.ui-datepicker-unselectable .ui-state-default, .ui-datepicker table td.ui-state-disabled .ui-state-default { color: #959595; } .ui-datepicker table td.ui-datepicker-today a { border-color: #2196f3; background-color: #fff; } .ui-datepicker table td.date-range-selected a { color: #434343; background-color: #7bc9fd; } .ui-datepicker table td.start-date-selected a, .ui-datepicker table td.end-date-selected a, .ui-datepicker table td.ui-datepicker-days-cell-over a, .ui-datepicker table td.start-date-selected.date-range-selected:first-child a { color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.6); background-color: #2196f3; } .ui-datepicker table td.ui-datepicker-days-cell-over.ui-datepicker-today a { color: #434343; text-shadow: none; background-color: #fff; border-color: #2196f3; } .ui-datepicker table td.start-date-selected:first-child a { color: #434343; text-shadow: none; background-color: #e5ffe5; } .ui-datepicker .legend { font-size: 12px; line-height: 1.5; color: #787878; margin: 5px 0; } .ui-datepicker .legend .icon-holidays { vertical-align: top; margin-top: 3px; } .search-form .btn-search, .search-form .btn-remove, .search-form .ui-datepicker-trigger, .search-form .icon-trigger, .section-category-search .btn-increment, .section-category-search .btn-decrement { background: #f6f6f6; background: -moz-linear-gradient(top, rgba(246,246,246,1) 0%, rgba(231,231,231,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(246,246,246,1)), color-stop(100%,rgba(231,231,231,1))); background: -webkit-linear-gradient(top, rgba(246,246,246,1) 0%,rgba(231,231,231,1) 100%); background: -o-linear-gradient(top, rgba(246,246,246,1) 0%,rgba(231,231,231,1) 100%); background: -ms-linear-gradient(top, rgba(246,246,246,1) 0%,rgba(231,231,231,1) 100%); background: linear-gradient(to bottom, rgba(246,246,246,1) 0%,rgba(231,231,231,1) 100%); } .search-form .btn-remove:hover, .search-form .btn-remove:active, .search-form .btn-search:hover, .search-form .btn-search:active, .search-form .ui-datepicker-trigger:hover, .search-form .ui-datepicker-trigger:active, .search-form .icon-trigger:hover, .search-form .icon-trigger:active, .section-category-search .btn-increment:hover, .section-category-search .btn-decrement:hover, .section-category-search .btn-increment:active, .section-category-search .btn-decrement:active { background: rgb(231,231,231); background: -moz-linear-gradient(top, rgba(231,231,231,1) 0%, rgba(246,246,246,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(231,231,231,1)), color-stop(100%,rgba(246,246,246,1))); background: -webkit-linear-gradient(top, rgba(231,231,231,1) 0%,rgba(246,246,246,1) 100%); background: -o-linear-gradient(top, rgba(231,231,231,1) 0%,rgba(246,246,246,1) 100%); background: -ms-linear-gradient(top, rgba(231,231,231,1) 0%,rgba(246,246,246,1) 100%); background: linear-gradient(to bottom, rgba(231,231,231,1) 0%,rgba(246,246,246,1) 100%); } .show-popup body, .show-popup .section-search-mobile .search-tab, .show-popup .section-search-mobile .search-tab-inner { background-color: #fff; } /* ------------------------------------------------------------ *\ Hidden Elements \* ------------------------------------------------------------ */ .nav-dropdown, .search-tab, .search-tab-inner { opacity: 0; visibility: hidden; } nav li:hover .nav-dropdown, .search-tab.visible, .search-tab-inner.visible { opacity: 1; visibility: visible; } .slide, .search-tab, .search-tab-inner { backface-visibility: hidden; -webkit-backface-visibility: hidden; } .show-popup, .show-popup body { overflow: hidden; } .show-popup .wrapper, .show-popup .wrapper * { visibility: hidden; } /* ------------------------------------------------------------ *\ Transitions \* ------------------------------------------------------------ */ .nav-mobile { transform: translateX(100%); -webkit-transform: translateX(100%); } .nav-mobile li ul { transition: max-height .5s; -webkit-transition: max-height .5s; } .nav-mobile .ico-angle-left { transform: rotate(0deg); -webkit-transform: rotate(0deg); } .nav-mobile .expanded .ico-angle-left { transform: rotate(-90deg); -webkit-transform: rotate(-90deg); } .show-nav .nav-mobile { transform: translateX(0%); -webkit-transform: translateX(0%); } .show-nav .wrapper { transform: translateX(calc(-100% + 53px)); -webkit-transform: translateX(-webkit-calc(-100% + 53px)); } .show-nav .wrapper, .nav-mobile { transition: transform .5s linear 0s; -webkit-transition: -webkit-transform .5s linear 0s; } a, button, input, textarea, [class^="btn"] { transition: color .5s, background-color .5s, border-color .5s; -webkit-transition: color .5s, background-color .5s, border-color .5s; } a img, .nav-overlay, .section-search .search-tab, .section-search .search-tab-inner, .section-tabs .tab { transition: opacity .5s, visibility .5s; -webkit-transition: opacity .5s, visibility .5s; } .section-articles-mobile { border: 0; box-shadow: none; } }
-
Medinol
<!DOCTYPE html> <html lang="he-il"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" /> <title>Medinol</title> <link rel="shortcut icon" type="image/x-icon" href="css/images/favicon.ico" /> <!-- Vendor Styles --> <link rel="stylesheet" href="vendor/owl.carousel-2.0.0/assets/owl.carousel.min.css" /> <link rel="stylesheet" href="vendor/chosen-v1.4.2/chosen.css" /> <link rel="stylesheet" href="vendor/magnific-popup-v0.9.9/dist/magnific-popup.css" /> <link rel="stylesheet" href="vendor/jquery-ui-1.11.4/jquery-ui.min.css" /> <!-- App Styles --> <link rel="stylesheet" href="css/style.css" /> <!-- Vendor JS --> <script src="vendor/modernizr.custom.50244.js"></script> </head> <body> <div class="wrapper"> <div class="bar"> <div class="shell"> <div class="bar-inner"> <div class="bar-clock"> <i class="ico-clock"></i> 13 ינואר 2015 <span>13:35</span> </div><!-- /.bar-clock --> <div class="bar-actions"> <a href="#" class="link-alerts"> <i class="ico-alerts"></i> עדכונים <span>10</span> </a> <div class="alerts"> <ul> <li> <a href="#">חדש בפורטל מדינול</a> </li> <li> <a href="#"><span>עדכון בדף:</span> טפסים</a> </li> <li> <a href="#"><span>עדכון בדף:</span> נהלים</a> </li> <li> <a href="#"><span>עדכון בדף:</span> יומן אירועים</a> </li> </ul> </div><!-- /.alerts --> </div><!-- /.bar-actions --> </div><!-- /.bar-inner --> <div class="search"> <form action="?" method="get"> <label for="q" class="hidden">Search</label> <input type="search" name="q" id="q" value="" placeholder="חיפוש" class="search-field"> <button type="submit" class="search-btn"> <i class="ico-search"></i> Go </button> </form> </div><!-- /.search --> </div><!-- /.shell --> </div><!-- /.bar --> <header class="header"> <div class="shell"> <a href="#" class="logo">Medinol Ingenuity of life</a> <nav class="nav"> <ul> <li class="current"> <a href="#"> <span> <i class="ico-house"></i> </span> ראשי </a> </li> <li> <a href="#"> <span> <i class="ico-calendar"></i> </span> יומן ארועים </a> </li> <li> <a href="#"> <span> <i class="ico-notes"></i> </span> טפסים </a> </li> <li> <a href="#"> <span> <i class="ico-hat"></i> </span> מידע שימושי </a> </li> <li> <a href="#"> <span> <i class="ico-pictures"></i> </span> גלריה </a> </li> <li> <a href="#"> <span> <i class="ico-checkmark"></i> </span> נהלים </a> </li> <li> <a href="#"> <span> <i class="ico-car"></i> </span> הסעות </a> </li> </ul> </nav><!-- /.nav --> </div><!-- /.shell --> </header><!-- /.header --> <div class="main"> <div class="shell"> <div class="content"> <div class="slider"> <ul class="slides owl-carousel"> <li class="slide"> <div class="slide-image"> <img src="css/images/temp/slide1.jpg" alt="" width="699" height="294"> </div><!-- /.slide-image --> </li><!-- /.slide --> <li class="slide"> <div class="slide-image"> <img src="css/images/temp/slide1.jpg" alt="" width="699" height="294"> </div><!-- /.slide-image --> </li><!-- /.slide --> </ul><!-- /.slides --> </div><!-- /.slider --> <section class="section-featured"> <div class="row"> <div class="col col-1of3"> <div class="featured-item featured-item-warning"> <a href="#"> <img src="css/images/temp/featured1.jpg" alt=""> <span class="featured-item-label">עובדי החברה</span> </a> </div><!-- /.featured-item --> </div><!-- /.col col-1of3 --> <div class="col col-1of3"> <div class="featured-item featured-item-primary"> <a href="#"> <img src="css/images/temp/featured2.jpg" alt=""> <span class="featured-item-label">רווחה ופנאי</span> </a> </div><!-- /.featured-item --> </div><!-- /.col col-1of3 --> <div class="col col-1of3"> <div class="featured-item featured-item-success"> <a href="#"> <img src="css/images/temp/featured3.jpg" alt=""> <span class="featured-item-label">מעורבות קהילתית</span> </a> </div><!-- /.featured-item --> </div><!-- /.col col-1of3 --> </div><!-- /.row --> <div class="row"> <div class="col col-2of3"> <div class="widget widget-updates widget-updates-secondary"> <div class="widget-head"> <h2 class="widget-title">עדכונים שוטפים</h2><!-- /.widget-title --> </div><!-- /.widget-head --> <div class="widget-body"> <p>אנו שמחים לעדכן על הקמתו של הפורטל הארגוני החדש שלנו! פורטל זה מהווה שער כניסה לעובדי מדינול בכל הקשור לענייני חברה, רווחה, כוח אדם ותקשורת פנים אירגונית.</p> </div><!-- /.widget-body --> </div><!-- /.widget widget-updates --> </div><!-- /.col col-2of3 --> <div class="col col-1of3"> <div class="featured-item featured-item-info"> <a href="#"> <img src="css/images/temp/featured4.jpg" alt=""> <span class="featured-item-label">הדרכות</span> </a> </div><!-- /.featured-item --> </div><!-- /.col col-1of3 --> </div><!-- /.row --> </section><!-- /.section-featured --> </div><!-- /.content --> <div class="sidebar"> <ul class="widgets"> <li class="widget widget-survey"> <div class="widget-head"> <h2 class="widget-title">סקר</h2><!-- /.widget-title --> </div><!-- /.widget-head --> <div class="widget-body"> <div class="form form-survey"> <form action="?" method="post"> <div class="form-body"> <label>מה הצבע האהוב אליך?</label> <div class="radios"> <div class="radio"> <input type="radio" id="radio1" name="question1" value="צהוב" /> <label for="radio1"> צהוב </label> </div><!-- /.radio --> <div class="radio"> <input type="radio" id="radio2" name="question1" value="כתום" /> <label for="radio2"> כתום </label> </div><!-- /.radio --> <div class="radio"> <input type="radio" id="radio3" name="question1" value="אדום" /> <label for="radio3"> אדום </label> </div><!-- /.radio --> <div class="radio"> <input type="radio" id="radio4" name="question1" value="כחול" /> <label for="radio4"> כחול </label> </div><!-- /.radio --> </div><!-- /.radios --> </div><!-- /.form-body --> <div class="form-actions"> <input type="submit" value="שלח" class="btn btn-gray"> </div><!-- /.form-actions --> </form> </div><!-- /.form form-survey --> </div><!-- /.widget-body --> </li><!-- /.widget widget-survey --> <li class="widget widget-updates"> <div class="widget-head"> <h2 class="widget-title">לוח ארועים</h2><!-- /.widget-title --> </div><!-- /.widget-head --> <div class="widget-body"> <ol class="updates"> <li class="update"> <a href="#"> <span class="update-content"> <strong>מסיבת פורים</strong> לורם פסקול אינס ולדורים אורים וחדיון לחוגא ולדיחוי </span><!-- /.update-content --> <span class="update-meta"> <strong>29</strong> ינואר </span><!-- /.update-meta --> </a> </li><!-- /.update --> <li class="update"> <a href="#"> <span class="update-content"> <strong>השתלמות עובדים</strong> לורם פסקול אינס ולדורים אורים וחדיון לחוגא ולדיחוי </span><!-- /.update-content --> <span class="update-meta"> <strong>1</strong> פבואר </span><!-- /.update-meta --> </a> </li><!-- /.update --> </ol><!-- /.updates --> </div><!-- /.widget-body --> </li><!-- /.widget widget-updates --> <li class="widget widget-congrats"> <div class="widget-head"> <h2 class="widget-title">מזל טוב!</h2><!-- /.widget-title --> </div><!-- /.widget-head --> <div class="widget-body"> <ul> <li> <a href="#">מזל טוב לאיציק שחוגג ב-2 לחודש יומלדת!</a> </li> <li> <a href="#">מזל טוב למיטל על הולדת הבת!</a> </li> </ul> </div><!-- /.widget-body --> </li><!-- /.widget widget-congrats --> <li class="widget widget-quicklinks"> <div class="widget-head"> <h2 class="widget-title">קישורים שימושים</h2><!-- /.widget-title --> </div><!-- /.widget-head --> <div class="widget-body"> <ul> <li> <a href="#">חבר מביא חבר</a> </li> <li> <a href="#">ibrowse</a> </li> <li> <a href="#">couponphone</a> </li> </ul> </div><!-- /.widget-body --> </li><!-- /.widget widget-quicklinks --> </ul><!-- /.widgets --> </div><!-- /.sidebar --> </div><!-- /.shell --> </div><!-- /.main --> <footer class="footer"> <div class="shell"> <a href="#" class="footer-logo">Medinol</a> <nav class="footer-nav"> <ul> <li> <a href="#">מדינול</a> </li> <li> <a href="#">שאלות נפוצות</a> </li> <li> <a href="#">הדרכות</a> </li> <li> <a href="#">ארועים</a> </li> <li class="alt"> <a href="#">עדכונים וחדשות</a> </li> <li> <a href="#">עדכונים וחדשות</a> </li> <li> <a href="#">כתבו לנו</a> </li> </ul> </nav><!-- /.footer-nav --> </div><!-- /.shell --> </footer><!-- /.footer --> </div><!-- /.wrapper --> <!-- Vendor JS --> <script src="vendor/jquery-1.11.3.min.js"></script> <script src="vendor/owl.carousel-2.0.0/owl.carousel.min.js"></script> <script src="vendor/chosen-v1.4.2/chosen.jquery.min.js"></script> <script src="vendor/magnific-popup-v0.9.9/dist/jquery.magnific-popup.min.js"></script> <script src="vendor/jquery-ui-1.11.4/jquery-ui.min.js"></script> <!-- App JS --> <script src="js/functions.js"></script> </body> </html>
/* Table of Contents update on Mon Sep 07 2015 18:38:15 GMT+0300 (FLE Summer Time) 01. IE8 Fixes -------------------------------- I. Generic -------------------------------------- 01. Reset ------------------------------------ 02. Fonts ------------------------------------ 03. Base ------------------------------------- 04. Helpers ---------------------------------- Clear ------------------------------------ Notext ----------------------------------- Hidden ----------------------------------- Alignleft -------------------------------- Alignright ------------------------------- Disabled --------------------------------- Layout ----------------------------------- II. Regions -------------------------------------- 01. Wrapper ---------------------------------- 02. Container -------------------------------- 03. Shell ------------------------------------ 04. Header ----------------------------------- 05. Main ------------------------------------- 06. Footer ----------------------------------- 07. Content ---------------------------------- 08. Sidebar ---------------------------------- III. Themes --------------------------------------- 01. Chosen ----------------------------------- IV. Modules -------------------------------------- 01. Alerts ----------------------------------- 02. Bar -------------------------------------- 03. Button ----------------------------------- 04. Comments --------------------------------- 05. Contacts --------------------------------- 06. Employees -------------------------------- 07. Events ----------------------------------- 08. Featured-item ---------------------------- 09. Form Elements ---------------------------- Custom upload ---------------------------- Checks and Radios ------------------------ 10. Form ------------------------------------- Form survey ------------------------------ Form recommend --------------------------- Form checkout ---------------------------- Form Feedback ---------------------------- Form Filters ----------------------------- Form contact ----------------------------- Form Login ------------------------------- Form-transportation ---------------------- Form Settings ---------------------------- 11. Gallery items ---------------------------- 12. Job offers ------------------------------- 13. List ------------------------------------- List Contacts ---------------------------- 14. Logo ------------------------------------- 15. Nav -------------------------------------- Nav Views -------------------------------- 16. Popup ------------------------------------ 17. Products --------------------------------- 18. Qty control ------------------------------ 19. Schedule --------------------------------- 20. Search ----------------------------------- 21. Section ---------------------------------- Section featured ------------------------- Section contacts ------------------------- Section gallery -------------------------- Section products ------------------------- Section Recommendations ------------------ Section Comments ------------------------- Section events --------------------------- Section employees ------------------------ Section Transportation ------------------- Section Manager -------------------------- Section Settings ------------------------- 22. Sldier range ----------------------------- 23. Slider ----------------------------------- 24. Sort ------------------------------------- 25. Tabs ------------------------------------- 26. Table ------------------------------------ Table forms ------------------------------ Table summary ---------------------------- Table employees -------------------------- 27. Transportations -------------------------- 28. Updates ---------------------------------- 29. Widget ----------------------------------- Widget survey ---------------------------- Widget Updates --------------------------- Widget Congrats -------------------------- Widget quicklinks ------------------------ Widget events ---------------------------- Widget-transportaions -------------------- */ .ico-alerts { background-image: url(images/sprite.png); background-position: -156px -133px; width: 31px; height: 28px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-arrow-left { background-image: url(images/sprite.png); background-position: -26px -230px; width: 21px; height: 29px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-arrow-right { background-image: url(images/sprite.png); background-position: -51px -230px; width: 21px; height: 29px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-at-lg { background-image: url(images/sprite.png); background-position: -82px -180px; width: 32px; height: 33px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-at { background-image: url(images/sprite.png); background-position: -203px -180px; width: 22px; height: 22px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-bubbles { background-image: url(images/sprite.png); background-position: -103px -133px; width: 49px; height: 32px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-calendar-active { background-image: url(images/sprite.png); background-position: -222px -94px; width: 40px; height: 46px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-calendar { background-image: url(images/sprite.png); background-position: 0 -180px; width: 40px; height: 46px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-car-active { background-image: url(images/sprite.png); background-position: -106px 0; width: 53px; height: 49px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-car { background-image: url(images/sprite.png); background-position: -49px 0; width: 53px; height: 49px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-check-gray { background-image: url(images/sprite.png); background-position: -71px -53px; width: 17px; height: 14px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-checkmark-active { background-image: url(images/sprite.png); background-position: -222px 0; width: 44px; height: 43px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-checkmark { background-image: url(images/sprite.png); background-position: -222px -47px; width: 44px; height: 43px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-clock { background-image: url(images/sprite.png); background-position: -229px -180px; width: 21px; height: 21px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-doc { background-image: url(images/sprite.png); background-position: -118px -180px; width: 23px; height: 31px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-fax { background-image: url(images/sprite.png); background-position: -145px -180px; width: 28px; height: 23px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-gear { background-image: url(images/sprite.png); background-position: -49px -53px; width: 18px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-gift { background-image: url(images/sprite.png); background-position: -191px -133px; width: 27px; height: 24px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-hand { background-image: url(images/sprite.png); background-position: 0 0; width: 45px; height: 72px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-hat-active { background-image: url(images/sprite.png); background-position: -90px -76px; width: 55px; height: 38px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-hat { background-image: url(images/sprite.png); background-position: -163px 0; width: 55px; height: 38px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-hearth { background-image: url(images/sprite.png); background-position: -106px -53px; width: 21px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-house-active { background-image: url(images/sprite.png); background-position: -163px -42px; width: 46px; height: 43px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-house { background-image: url(images/sprite.png); background-position: 0 -133px; width: 46px; height: 43px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-like { background-image: url(images/sprite.png); background-position: -222px -144px; width: 34px; height: 32px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-notes-active { background-image: url(images/sprite.png); background-position: 0 -76px; width: 41px; height: 53px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-notes { background-image: url(images/sprite.png); background-position: -45px -76px; width: 41px; height: 53px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-pdf { background-image: url(images/sprite.png); background-position: 0 -230px; width: 22px; height: 32px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-phone-lg { background-image: url(images/sprite.png); background-position: -44px -180px; width: 34px; height: 33px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-phone { background-image: url(images/sprite.png); background-position: -177px -180px; width: 22px; height: 23px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-pictures-active { background-image: url(images/sprite.png); background-position: -163px -89px; width: 49px; height: 39px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-pictures { background-image: url(images/sprite.png); background-position: -50px -133px; width: 49px; height: 39px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-pin { background-image: url(images/sprite.png); background-position: -270px 0; width: 15px; height: 23px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-remove { background-image: url(images/sprite.png); background-position: -76px -230px; width: 20px; height: 20px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-search-black { background-image: url(images/sprite.png); background-position: -270px -27px; width: 15px; height: 15px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-search { background-image: url(images/sprite.png); background-position: -131px -53px; width: 17px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-sort { background-image: url(images/sprite.png); background-position: -270px -46px; width: 7px; height: 10px; display: inline-block; vertical-align: middle; font-size: 0; } /* ------------------------------------------------------------ *\ IE8 Fixes \* ------------------------------------------------------------ */ .no-boxshadow .alerts:before { display: none; } /* .no-boxshadow .widget-head:after { border-width: 0 0 13px 14px; border-color: transparent transparent transparent #021621; } .no-boxshadow .widget-updates-secondary .widget-head:after { border-width: 0 14px 13px 0; border-color: transparent #021621 transparent transparent; } */ .no-boxshadow .table-forms { border-collapse: collapse; } .no-boxshadow .table-forms th { border-bottom: 3px solid #bfbfbf; } .no-boxshadow .table-forms td { border-width: 1px 0; border-style: solid; border-color: #dedede; } .no-boxshadow .table-forms td:first-child { border-right: 1px solid #dedede; } .no-boxshadow .table-forms .last { border-left: 1px solid #dedede; } .no-boxshadow .table-employees { border-collapse: collapse; } .no-boxshadow .table-employees th { border-bottom: 3px solid #bfbfbf; } .no-boxshadow .table-employees td { border-width: 1px 0; border-style: solid; border-color: #dedede; } .no-boxshadow .table-employees td:first-child { border-right: 1px solid #dedede; } .no-boxshadow .table-employees .last { border-left: 1px solid #dedede; } /* ------------------------------------------------------------ *\ I. Generic \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Reset \* ------------------------------------------------------------ */ *, *:before, *:after { padding: 0; margin: 0; outline: 0; box-sizing: border-box; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, main { display: block; } html, body { height: 100%; } html { tap-highlight-color: rgba(0,0,0,0); } body { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; -webkit-text-size-adjust: none; -ms-text-size-adjust: none; text-size-adjust: none; } img, iframe, video, audio, object { max-width: 100%; } img { height: auto; display: inline-block; vertical-align: middle; } b, strong { font-weight: bold; } address { font-style: normal; } svg:not(:root) { overflow: hidden; } a, button, input[type="submit"], input[type="button"], input[type="reset"], input[type="file"], input[type="image"], label[for] { cursor: pointer; } a[href^="tel"], button[disabled], input[disabled], textarea[disabled], select[disabled] { cursor: default; } button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; } input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], input[type="color"], textarea, a[href^="tel"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { display: none; -webkit-appearance: none; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } textarea { overflow: auto; resize: none; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; } button, input, optgroup, select, textarea { font-family: inherit; font-size: inherit; color: inherit; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; } button, select { text-transform: none; } table { width: 100%; border-collapse: collapse; border-spacing: 0; } nav ul, nav ol { list-style: none outside none; } /* ------------------------------------------------------------ *\ Fonts \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Base \* ------------------------------------------------------------ */ body { min-width: 980px; background: #fff; font: 16px/1.3 'Arial', 'Helvetica', sans-serif; color: #000; } body { direction: rtl } a { color: inherit; text-decoration: none; } a:hover { text-decoration: underline; } a[href^="tel"] { text-decoration: none; } h1 { font-size: 26px; } h2 { font-size: 21px; } h3 { font-size: 20px; } h4 { font-size: 18px; } h5 { font-size: 16px; } h6 { font-size: 14px; } img { border: none; vertical-align: middle; } /* ------------------------------------------------------------ *\ Helpers \* ------------------------------------------------------------ */ /* Clear */ .section-comments .section-head:after, .form-row:after, .form-cols:after, .cols:after, .list-contacts:after, .contact:after, .row:after, .main .shell:after, .header .shell:after, .bar .shell:after, .clear:after { content: ''; line-height: 0; display: table; clear: both; } /* Notext */ .notext { white-space: nowrap; text-indent: 100%; text-shadow: none; overflow: hidden; } .notext-old { font-size: 0; line-height: 0; text-indent: -4000px; } /* Hidden */ [hidden], .hidden { display: none; } /* Alignleft */ .alignleft { float: left; } /* Alignright */ .alignright { float: right; } /* Disabled */ [disabled], .disabled { cursor: default; } /* Layout */ .row { margin: 0 -17px; } .col { float: right; padding: 0 17px; } .col-1of3 { width: 33.333%; } .col-2of3 { width: 66.666%; } .col-1of2 { width: 50%; } /* ------------------------------------------------------------ *\ II. Regions \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Wrapper \* ------------------------------------------------------------ */ .wrapper { min-height: 100%; position: relative; } .wrapper:after { content: ''; display: block; height: 133px; } /* ------------------------------------------------------------ *\ Container \* ------------------------------------------------------------ */ .container {} /* ------------------------------------------------------------ *\ Shell \* ------------------------------------------------------------ */ .shell { max-width: 950px; margin: auto; } .shell-secondary { padding-left: 15px; padding-right: 15px; } /* ------------------------------------------------------------ *\ Header \* ------------------------------------------------------------ */ .header { padding: 20px 0 10px; border-bottom: 4px solid #1b7bc0; } .header .nav, .header .logo { float: right; } .header .logo { margin: 9px 0 0 43px; } /* ------------------------------------------------------------ *\ Main \* ------------------------------------------------------------ */ .main { position: relative; z-index: 1; } .main .shell { padding-top: 24px; padding-bottom: 27px; } .main-head { background: #3192d8; color: #fff; } .main-head h1 { font-size: 40px; font-family: 'Segoe UI', Arial, sans-serif; font-weight: normal; padding-top: 2px; } .main-head .shell { padding-top: 17px; padding-bottom: 5px; position: relative; } .main-head .tabs-nav { position: absolute; bottom: 0; left: 15px; } /* ------------------------------------------------------------ *\ Footer \* ------------------------------------------------------------ */ .footer { position: absolute; bottom: 0; left: 0; right: 0; background: #efefef; } .footer:after { content: ''; display: block; height: 57px; border-top: 1px solid #fff; background: #efefef; box-shadow: 0 -1px 0 #cacaca; } .footer .shell { padding: 18px 0 12px; } .footer-logo { display: inline-block; vertical-align: middle; background: url(images/footer-logo.png) no-repeat 0 0; width: 140px; height: 46px; font-size: 0; line-height: 0; margin-right: 10px; } .footer-nav { display: inline-block; vertical-align: middle; margin-right: 85px; } .footer-nav ul { list-style: none outside none; overflow: hidden; } .footer-nav li { float: right; font-size: 14px; } .footer-nav li + li { padding-right: 36px; } .footer-nav .alt { padding: 0 70px 0 35px; } /* ------------------------------------------------------------ *\ Content \* ------------------------------------------------------------ */ .content { float: right; width: 700px; } .content-secondary { width: 560px; } /* ------------------------------------------------------------ *\ Sidebar \* ------------------------------------------------------------ */ .sidebar { float: left; width: 210px; } .sidebar-secondary { width: 284px; } .sidebar-tertiary { margin-left: -15px; padding-top: 6px; } /* ------------------------------------------------------------ *\ III. Themes \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Chosen \* ------------------------------------------------------------ */ .chosen-container-single .chosen-single { border-radius: 0; background: #fff; box-shadow: none; height: 36px; border: 1px solid #999; line-height: 36px; } .chosen-container-active.chosen-with-drop .chosen-single { background: #fff; } .chosen-container .chosen-results li.highlighted { background: none; color: #1b7bc0; } .chosen-container-single .chosen-single div { border-right: 1px solid #999; width: 20px; padding-top: 13px; text-align: center; line-height: 1.1; } .chosen-container-single .chosen-single div:before { content: ''; display: inline-block; vertical-align: middle; width: 0; height: 0; border-width: 5px; border-style: solid; border-color: #999 transparent transparent; } .chosen-container-single .chosen-single div b { display: none; } .chosen-container-active.chosen-with-drop .chosen-single div { padding-top: 8px; } .chosen-container-active.chosen-with-drop .chosen-single div:before { border-color: transparent transparent #999; } .chosen-rtl.chosen-container-active.chosen-with-drop .chosen-single div { border-right: 1px solid transparent; } .chosen-container-single .chosen-drop { border-radius: 0; } /* ------------------------------------------------------------ *\ IV. Modules \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Alerts \* ------------------------------------------------------------ */ .alerts { position: absolute; top: 100%; right: 0; width: 211px; border: 1px solid #888; margin-top: 16px; background: #fff; box-shadow: 0 0 5px rgba(0,0,0, .75); opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s; } .alerts-visible { opacity: 1; visibility: visible; } .alerts:before { content: ''; position: absolute; bottom: 100%; right: 5px; background: url(images/dropdown.png) no-repeat 0 0; width: 31px; height: 15px; } .alerts ul { list-style: none outside none; } .alerts li + li { border-top: 1px solid #ebebeb; } .alerts li + li a { padding: 15px 12px 18px; } .alerts li:first-child a { padding: 6px 7px 3px; background: #ebebeb; } .alerts a { display: block; font-size: 14px; color: #333; transition: background .3s; } .alerts a:hover { text-decoration: none; background: #ebebeb; } .alerts a span { color: #888; } /* ------------------------------------------------------------ *\ Bar \* ------------------------------------------------------------ */ .bar { position: relative; z-index: 2; color: #757575; font-size: 14px; } .bar .shell { border-bottom: 1px solid #dedede; padding: 2px 0; } .bar-inner { float: right; } .bar .search { float: left; margin-top: 1px; } .bar-clock, .bar-actions { float: right; } .bar-clock { padding-top: 5px; margin-left: 20px; } .bar-clock:after { content: '|'; display: inline-block; vertical-align: middle; margin: -2px 5px 0 0; } .bar-clock i { margin: -2px 0 0 11px; } .bar-clock span { padding-right: 11px; } .bar-actions { position: relative; } .bar-actions .link-alerts { position: relative; } .bar-actions .link-alerts span { position: absolute; top: -2px; right: 2px; color: #fff; font-size: 12px; } /* ------------------------------------------------------------ *\ Button \* ------------------------------------------------------------ */ .btn { display: inline-block; vertical-align: middle; -webkit-appearance: none; -moz-appearance: none; appearance: none; transition: color .3s, background .3s; } .btn-gray { padding: 1px 14px 0; border: none; color: #fff; background: rgb(103,103,103); background: linear-gradient(to bottom, rgba(103,103,103,1) 0%,rgba(112,112,112,1) 39%,rgba(119,119,119,1) 56%,rgba(128,128,128,1) 89%,rgba(129,129,129,1) 100%); } .btn-gray:hover { background: rgb(129,129,129); background: linear-gradient(to bottom, rgba(129,129,129,1) 0%,rgba(128,128,128,1) 11%,rgba(119,119,119,1) 44%,rgba(112,112,112,1) 61%,rgba(103,103,103,1) 100%); } .btn-info { padding: 1px 12px 3px; background: #1b7bc0; color: #fff; } .btn-info:hover { text-decoration: none; background: #1289df; } .btn-info-md { padding: 0 8px 2px 13px; min-width: 316px; font-size: 26px; font-family: 'Segoe UI', Arial, sans-serif; line-height: 1.2; background: #3192d8; } .btn-info-md span { float: left; } .btn-info-lg { padding: 1px 35px 7px; font-size: 20px; font-family: 'Segoe UI', Arial, sans-serif; } .btn-info-xl { padding: 3px 28px 9px; font-size: 30px; font-family: 'Segoe UI', Arial, sans-serif; } .btn-info-rounded { padding: 4px 10px 5px; border-radius: 3px; background: #3192d8; font-size: 18px; } .btn-default { padding: 1px 32px 7px; background: #808080; color: #fff; font-size: 20px; font-family: 'Segoe UI', Arial, sans-serif; } .btn-default:hover { background: #939393; } .btn-danger { padding: 7px 18px 5px; background: #d2163a; color: #fff; font-size: 20px; font-family: 'Segoe UI', Arial, sans-serif; } .btn-danger:hover { text-decoration: none; background: #ee002e; } .btn-danger .ico-gift { margin: -6px 0 0 6px; } .btn-primary { background: #c01ba3; color: #fff; } .btn-primary-md { padding: 2px 8px 3px; min-width: 215px; font-size: 26px; line-height: 1.1; font-family: 'Segoe UI', Arial, sans-serif; } .btn-primary:hover { text-decoration: none; background: #e720c4; } .btn-lightgray { padding: 0 13px 1px; background: #f1f1f1; border: 1px solid #cacaca; border-radius: 3px; } .btn-lightgray:hover { text-decoration: none; background: #cacaca; color: #fff; } /* ------------------------------------------------------------ *\ Comments \* ------------------------------------------------------------ */ .comments { overflow: hidden; list-style: none outside none; padding: 30px 0 9px; border-width: 1px 0; border-style: solid; border-color: #999; } .comment { position: relative; padding-bottom: 21px; } .comment ~ .comment { border-top: 1px solid #dedede; padding-top: 20px; } .comment ~ .comment .comment-actions { top: 24px; } .comment-avatar { float: right; margin: 4px 0 0 22px; } .comment-content { overflow: hidden; max-width: 732px; font-size: 14px; line-height: 1.2; } .comment-content h3 { padding-bottom: 5px; } .comment-content h5 { padding: 11px 0 15px; } .comment-content h6 { padding: 23px 0 4px; font-weight: normal; font-size: 16px; } .comment-meta { font-size: 12px; } .comment-actions { position: absolute; top: 4px; left: 0; } .comment-actions a { display: block; width: 67px; height: 67px; padding-top: 5px; background: #ededed; text-align: center; transition: background .3s; } .comment-actions a span { display: block; color: #3192d8; font-size: 14px; line-height: .9; padding-top: 3px; } .comment-actions a ~ a { margin-top: 8px; } .comment-actions a .ico-like { margin-bottom: 6px; } .comment-actions a:hover { text-decoration: none; background: #dbd9d9; } .comment-replies { list-style: none outside none; } .comment-reply { padding: 12px 9px 11px; background: #ededed; overflow: hidden; color: #333; } .comment-reply ~ .comment-reply { margin-top: 5px; } .comment-reply-author, .comment-reply-meta, .comment-reply-content { float: right; } .comment-reply-author, .comment-reply-meta { color: #333; padding-left: 5px; } .comment-reply-author { min-width: 68px; } .comment-reply-meta { min-width: 108px; } .comment-reply-content { color: #000; } /* ------------------------------------------------------------ *\ Contacts \* ------------------------------------------------------------ */ .contacts { list-style: none outside none; } .contact h1 { font-weight: normal; padding-bottom: 20px; } .contact ~ .contact { padding-top: 40px; } .contact-content { float: right; width: 450px; } .contact-image { float: left; margin-top: 9px; border-radius: 10px; overflow: hidden; box-shadow: 0 0 5px rgba(0,0,0, .5); } .contact .list-contacts { padding-right: 3px; } /* ------------------------------------------------------------ *\ Employees \* ------------------------------------------------------------ */ .employees { list-style: none outside none; padding-top: 33px; } .employees li { overflow: hidden; border: 1px solid #cfcfcf; } .employees li + li { margin-top: 14px; } .employee-image { float: right; margin-left: 41px; } .employee-content { overflow: hidden; padding-top: 15px; font-size: 18px; } .employee-content h3 { padding-bottom: 22px; } /* ------------------------------------------------------------ *\ Events \* ------------------------------------------------------------ */ .events { list-style: none outside none; } .events .row { margin: 0 -6px; } .events .col { padding: 0 6px; } .event { padding: 38px 24px 35px 26px; background: #f4f4f4; } .event ~ .event { margin-top: 27px; } .event-image img { width: 100%; height: auto; } .event-image .row { padding-top: 12px; } .event-content { padding: 0 8px 14px 0; } .event-meta { font-size: #535353; font-size: 14px; display: block; padding-bottom: 8px; } .event-meta span { padding: 0 7px; } .event-actions { color: #ff5a5a; } .event-content-inner { display: none; padding-top: 8px; font-size: 14px; color: #535353; } .event-content-inner p { padding-bottom: 13px; } /* ------------------------------------------------------------ *\ Featured-item \* ------------------------------------------------------------ */ .featured-item a { display: block; position: relative; overflow: hidden; } .featured-item img { width: 100%; height: auto; transition: -webkit-transform .4s ease; transition: transform .4s ease; } .featured-item a:hover img { -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); } .featured-item-label { position: absolute; bottom: 9px; left: 0; display: inline-block; padding: 0 8px; font-size: 26px; text-transform: uppercase; color: #fff; font-family: 'Segoe UI', Arial, sans-serif; } .featured-item-meta { position: absolute; bottom: 82px; left: 6px; text-align: center; font-size: 26px; font-family: 'Segoe UI', Arial, sans-serif; background: url(images/featured-item-meta.png) no-repeat 0 0; width: 63px; height: 49px; color: #fff; padding-right: 5px; line-height: 34px; } .featured-item-success .featured-item-label { background: #007b3e; padding: 0 2px; } .featured-item-primary .featured-item-label { background: #8f1bc0; } .featured-item-info .featured-item-label { background: #1b7bc0; } .featured-item-warning .featured-item-label { background: #abc01b; } .featured-items-secondary { margin: 0 -12px; overflow: hidden; } .featured-items-secondary .featured-item { position: relative; width: 33.333%; float: right; padding: 0 12px 24px; } .featured-items-secondary .featured-item-label { bottom: 29px; background: #c01ba3; text-align: right; width: 215px; } /* ------------------------------------------------------------ *\ Form Elements \* ------------------------------------------------------------ */ input::-webkit-input-placeholder { color: inherit; opacity: 1; } input::-moz-placeholder { color: inherit; opacity: 1; } input:-ms-input-placeholder { color: inherit; opacity: 1; } input::placeholder { color: inherit; opacity: 1; } textarea::-webkit-input-placeholder { color: inherit; opacity: 1; } textarea::-moz-placeholder { color: inherit; opacity: 1; } textarea:-ms-input-placeholder { color: inherit; opacity: 1; } textarea::placeholder { color: inherit; opacity: 1; } input:-webkit-autofill { -webkit-text-fill-color: inherit !important; -webkit-box-shadow: 0 0 0 1000px #fff inset; } .field { height: 36px; border: 1px solid #999; padding: 8px 10px; background: #fff; } .textarea {} .select {} .radio {} .checkbox {} /* Custom upload */ .file-upload-names { cursor: pointer; } .file-upload { display: inline-block; position: relative; overflow: hidden; } .file-upload-btn { display: inline-block; cursor: pointer; } .file-upload-btn span { text-decoration: underline; display: inline-block; width: 116px; cursor: pointer; } .file-upload-input { opacity: 0; font-size: 100px; position: absolute; bottom: -10px; right: -10px; cursor: pointer; } /* =========================== #IE 8 Fix ============================ */ .file-upload-input { filter: alpha(opacity=0); } /* Checks and Radios */ .custom-checkbox { display: inline-block; } .custom-checkbox input { opacity: 0; filter: alpha(opacity=0); position: absolute; } .custom-checkbox-fake { position: relative; display: inline-block; width: 19px; height: 19px; border: 1px solid #2d2d2d; border-radius: 3px; transition: border-color .3s; } .custom-checkbox-fake:after { content: ''; position: absolute; top: 1px; left: 2px; background: url(images/check.png) no-repeat 0 0; width: 13px; height: 13px; opacity: 0; filter: alpha(opacity=0); visibility: hidden; transition: opacity .3s, visibility .3s; } .custom-input-checked .custom-checkbox-fake { border-color: #058a02; } .custom-input-checked .custom-checkbox-fake:after { opacity: 1; filter: alpha(opacity=100); visibility: visible; } .custom-input-disabled .custom-checkbox-fake { opacity: .5; filter: alpha(opacity=50); } .custom-radio input { opacity: 0; filter: alpha(opacity=0); position: absolute; } .custom-radio-fake { float: left; width: 14px; height: 14px; border: 2px solid #000; border-radius: 50%; margin-right: 5px; } .custom-input-checked .custom-radio-fake { background: #000; } .custom-input-disabled .custom-radio-fake { opacity: .5; filter: alpha(opacity=50); } .checkbox label, .checkbox input, .radio input, .radio label { cursor:pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; } .custom-input-disabled input, .custom-input-disabled label { cursor: default; } /* ------------------------------------------------------------ *\ Form \* ------------------------------------------------------------ */ .form {} .form .btn { border: none; } .form-col { float: right; } /* Form survey */ .form-survey { position: relative; z-index: 2; padding: 10px 7px 12px 13px; border-width: 0 1px 1px; border-style: solid; border-color: #e3e3e3; } .form-survey .form-actions { text-align: left; } .form-survey label { font-size: 18px; color: #383838; } .form-survey .radios { padding: 5px 8px 0 0; } .form-survey .radio { padding-bottom: 1px; } .form-survey .radio input { display: inline-block; vertical-align: middle; cursor: pointer; } .form-survey .radio label { font-size: 14px; color: #464646; display: inline-block; vertical-align: middle; margin: -2px 3px 0 0; } .form-survey .form-actions { padding-top: 15px; } /* Form recommend */ .form-recommend .form-body { padding-bottom: 35px; } .form-recommend .form-row ~ .form-row { padding-top: 12px; } .form-recommend .field { width: 185px; } .form-recommend .form-col ~ .form-col { margin-right: 83px; } .form-recommend .form-label { float: right; width: 121px; padding-top: 7px; } .form-recommend .form-controls { float: right; } .form-recommend .form-hint { display: block; font-size: 10px; padding: 3px 7px 0 0; } .form-recommend .select { width: 185px; margin-bottom: 24px; } .form-recommend .form-actions { text-align: left; padding-left: 60px; } .form-recommend .form-actions .btn { width: 108px; padding-left: 10px; padding-right: 10px; text-align: center; } .form-recommend .form-actions .btn ~ .btn { margin-right: 8px; } /* Form checkout */ .form-checkout { font-family: 'Segoe UI', Arial, sans-serif; } .form-checkout .form-head { border-bottom: 2px solid #3192d8; padding-bottom: 7px; margin-bottom: 17px; } .form-checkout .form-head h3 { font-weight: normal; } .form-checkout .form-controls, .form-checkout .form-label { float: right; } .form-checkout .form-row ~ .form-row { padding-top: 11px; } .form-checkout .form-col ~ .form-col { padding-right: 54px; } .form-checkout .form-label { width: 156px; padding: 6px 5px 0 0; } .form-checkout .form-label-sm { width: 112px; padding-right: 0; } .form-checkout .field, .form-checkout .select { width: 192px; } .form-checkout .field-lg { width: 551px; } .form-checkout .chosen-container { font-size: 16px; font-family: 'Segoe UI', Arial, sans-serif; } .form-checkout .chosen-container-single .chosen-single div { } .form-checkout .chosen-container-single .chosen-single div { width: 31px; padding-top: 11px; } .form-checkout .form-actions { padding-top: 29px; } .form-checkout .checkbox { margin-bottom: 27px; } .form-checkout .checkbox label { padding-right: 10px; } .form-checkout .checkbox input, .form-checkout .checkbox label { display: inline-block; vertical-align: middle; } /* Form Feedback */ .form-feedback { padding-top: 17px; } .form-feedback .form-group { padding-bottom: 38px; border-bottom: 2px solid #c5c5c5; } .form-feedback .form-group ~ .form-group { padding-top: 31px; } .form-feedback .form-row ~ .form-row { padding-top: 19px; } .form-feedback .form-col ~ .form-col { padding-right: 75px; } .form-feedback .field, .form-feedback .select { width: 184px; } .form-feedback .field-textarea { width: 650px; height: 71px; } .form-feedback .form-label { display: block; padding-bottom: 7px; } .form-feedback .form-row-inline .form-controls, .form-feedback .form-row-inline .form-label { float: right; } .form-feedback .form-row-inline .form-label { width: 104px; padding: 7px 0 0; } .form-feedback .form-row-inline .form-label-lg { width: 465px; } .form-feedback .form-hint { display: block; padding: 62px 0 37px; } .form-feedback .form-hint span { padding: 0 14px; } .form-feedback .form-slider { margin-top: -5px; padding-bottom: 8px; } .form-feedback .form-slider > span { display: inline-block; vertical-align: middle; width: 40px; text-align: center; font-size: 12px; line-height: 1.2; color: #5e5e5e; } .form-feedback .form-slider .slider-range { display: inline-block; vertical-align: middle; margin: -3px 0 0 7px; } .form-feedback .form-actions { padding: 39px 0 0 50px; text-align: left; } /* Form Filters */ .form-filters { padding: 6px 17px 8px; border: 1px solid #e8e8e8; margin-bottom: 21px; } .form-filters .form-label { color: #555; display: block; padding: 0 3px 9px 0; } .form-filters .form-col { position: relative; } .form-filters .form-col ~ .form-col { padding-right: 10px; } .form-filters .field, .form-filters .select { width: 149px; } .form-filters .field { height: 34px; padding: 7px 10px; border-color: #ccc; border-radius: 3px; box-shadow: inset 0 1px 1px rgba(0,0,0, .1); } .form-filters .chosen-container-single .chosen-single { height: 34px; line-height: 34px; border-radius: 3px; border-color: #ccc; font-size: 16px; color: #555; box-shadow: inset 0 1px 1px rgba(0,0,0, .1); } .form-filters .chosen-container-single .chosen-single div { border-color: #ccc; padding-top: 10px; left: 0; width: 20px; } .form-filters .chosen-container-single .chosen-single div:before { border-color: #ccc transparent transparent; } .form-filters .chosen-container-active.chosen-with-drop .chosen-single { background: #fff; border-radius: 3px 3px 0 0; } .form-filters .chosen-drop { border-color: #ccc; } .form-filters .form-actions { padding: 8px 29px 0 0; font-size: 14px; } .form-filters .form-actions a { text-decoration: underline; } .form-filters .form-actions a:hover { text-decoration: none; } .form-filters .ui-datepicker-trigger { position: absolute; top: 0; left: 0; bottom: 0; width: 21px; border-width: 0 1px 0 0; border-style: solid; border-color: #ccc; font-size: 0; line-height: 0; background: url(images/datepicker.png) no-repeat center center; } /* Form contact */ .form-contact { padding-top: 30px; } .form-contact .form-head { padding-bottom: 66px; } .form-contact .form-head h3 { font-weight: normal; font-family: 'Segoe UI', Arial, sans-serif; } .form-contact .form-col ~ .form-col { padding-right: 30px; } .form-contact .form-row ~ .form-row { padding-top: 15px; } .form-contact .form-label, .form-contact .form-controls { float: right; } .form-contact .form-label { width: 120px; padding-top: 7px; } .form-contact .form-label-sm { width: 65px; } .form-contact .field { width: 207px; } .form-contact .field-textarea { height: 137px; width: 301px; } .form-contact .field-textarea, .form-contact .form-actions { display: inline-block; vertical-align: bottom; } .form-contact .form-actions { padding-right: 17px; } /* Form Login */ .form-login { padding-top: 34px; } .form-login .form-head { padding-bottom: 20px; } .form-login .form-head h4 { color: #3192d8; font-weight: normal; color: #3192d8; } .form-login .form-body { border: 1px solid #cacaca; padding: 20px 46px 21px; } .form-login .form-label { float: right; width: 120px; padding-top: 7px; } .form-login .form-row ~ .form-row { padding-top: 15px; } .form-login .form-controls { float: right; } .form-login .field { width: 207px; } .form-login .form-actions { display: inline-block; vertical-align: bottom; padding-right: 34px; } .form-login .btn { background: #3192d8; padding: 3px 28px 5px; } .form-login .btn:hover { background: #3aa6f5; } /* Form-transportation */ .form-transportation { padding: 23px 8px 24px 6px; border: 1px solid #e3e3e3; } .form-transportation .select, .form-transportation .field { width: 100%; } .form-transportation .form-label { display: block; color: #383838; font-size: 16px; font-weight: bold; padding: 0 2px 3px 0; } .form-transportation .form-controls { position: relative; } .form-transportation .form-row ~ .form-row { padding-top: 20px; } .form-transportation .field { font-size: 14px; height: 30px; border-color: #e3e3e3; padding: 8px 5px; } .form-transportation .chosen-container-single .chosen-single { height: 30px; border: 1px solid #e3e3e3; line-height: 30px; padding-right: 5px; } .form-transportation .chosen-container-single .chosen-single div { border: none; padding-top: 10px; } .form-transportation .chosen-drop { border-color: #e3e3e3; } .form-transportation .form-actions { padding-top: 32px; } .form-transportation .form-actions .btn { display: block; width: 100%; text-align: center; } .form-transportation .field-date { background: #fff url(images/datepicker.png) no-repeat 0 center; } .form-transportation .datepicker-double { width: 600px; opacity: 0; visibility: hidden; position: absolute; top: 100%; left: 50%; z-index: 5; margin-left: -300px; transition: opacity .4s ease, visibility .4s ease; } .form-transportation .datepicker-double.show-datepickers { opacity: 1; visibility: visible; } .form-transportation .datepicker-double-start, .form-transportation .datepicker-double-end { float: right; } /* Form Settings */ .form-settings .form-label { color: #3192d8; display: block; } .form-settings .form-cols { display: inline-block; vertical-align: middle; } .form-settings .form-col ~ .form-col { padding-right: 11px; } .form-settings .form-row { counter-reset: numbers; } .form-settings .form-row ~ .form-row { padding-top: 33px; } .form-settings .form-row-sm { counter-increment: numbers; } .form-settings .form-row-sm:before { display: inline-block; vertical-align: middle; content: counter(numbers) '.'; color: #666; min-width: 22px; text-align: left; margin-left: 8px; } .form-settings .form-row-sm ~ .form-row-sm { padding-top: 9px; } .form-settings .select, .form-settings .field { width: 143px; } .form-settings .form-label { display: block; padding-bottom: 12px; } .form-settings .form-label-sm { padding: 0 4px 0 9px; } .form-settings .field { height: 23px; border-radius: 3px; } .form-settings .select { display: inline-block; vertical-align: middle; } .form-settings .chosen-container-single .chosen-single { height: 23px; border: 1px solid #cacaca; line-height: 23px; border-radius: 3px; } .form-settings .chosen-container-single .chosen-single div { border: none; padding-top: 6px; } .form-settings .chosen-container-active.chosen-with-drop .chosen-single { border-radius: 3px 3px 0 0; } .form-settings .chosen-container-single .chosen-drop { border-color: #cacaca; } /* ------------------------------------------------------------ *\ Gallery items \* ------------------------------------------------------------ */ .gallery-items { list-style: none outside none; overflow: hidden; margin: 0 -9px; } .gallery-item { float: right; width: 25%; padding: 0 9px 24px; } .gallery-item-image img { width: 100%; height: auto; transition: -webkit-transform .4s ease; transition: transform .4s ease; } .gallery-item-image a { display: block; overflow: hidden; } .gallery-item-image a:hover img { -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); } .gallery-item-content { position: relative; background: #ededed; min-height: 91px; padding: 6px 8px 20px; } .gallery-item-content:after { content: ''; position: absolute; bottom: 0; left: 0; background: url(images/gallery-item.png) no-repeat 0 0; width: 9px; height: 9px; } .gallery-item-meta { position: absolute; bottom: 2px; right: 8px; font-size: 12px; color: #323232; } .gallery-item-content h5 { font-weight: normal; } .gallery-item-content a { color: #1b7bc0; } /* ------------------------------------------------------------ *\ Job offers \* ------------------------------------------------------------ */ .job-offers { list-style: none outside none; } .job-offer { position: relative; min-height: 247px; padding: 14px 24px; border: 1px solid #dedede; } .job-offer h3 { padding-bottom: 10px; } .job-offer ~ .job-offer { margin-top: 21px; } .job-offer-head { padding-bottom: 34px; } .job-offer-body { line-height: 1.2; } .job-offer-meta span { padding: 0 15px; } .job-offer-meta-secondary { position: absolute; top: 20px; left: 19px; font-size: 14px; } .job-offer-meta-secondary span ~ span { padding-right: 28px; } .job-offer .col { padding: 0; } .job-offer .col-size1 { width: 374px; } .job-offer .col-size2 { width: 405px; } .job-offer-actions { position: absolute; bottom: 6px; left: 0; } /* ------------------------------------------------------------ *\ List \* ------------------------------------------------------------ */ [class^="list-"] { list-style: none outside none; } /* List Contacts */ .list-contacts dt { float: right; clear: right; min-width: 30px; } .list-contacts dd { overflow: hidden; } .list-contacts dd, .list-contacts dt { padding-bottom: 20px; } .list-contacts .ico-phone { margin: -5px -3px 0 0; } .list-contacts .ico-fax { margin: -3px -3px 0 0; } /* ------------------------------------------------------------ *\ Logo \* ------------------------------------------------------------ */ .logo { display: inline-block; vertical-align: middle; background: url(images/logo.png) no-repeat 0 0; width: 234px; height: 77px; font-size: 0; line-height: 0; } /* ------------------------------------------------------------ *\ Nav \* ------------------------------------------------------------ */ .nav ul { list-style: none outside none; overflow: hidden; } .nav li { float: right; } .nav li + li { padding-right: 43px; } .nav a { display: inline-block; color: #000; text-align: center; } .nav span { display: block; min-height: 60px; margin-bottom: 9px; } .nav .ico-house { margin-top: 14px; } .nav .ico-calendar { margin-top: 6px; } .nav .ico-hat { margin-top: 14px; } .nav .ico-pictures { margin-top: 11px; } .nav .ico-checkmark { margin-top: 10px; } .nav .ico-car { margin-top: 4px; } .nav .current a, .nav a:hover { text-decoration: none; color: #1b7bc0; } .nav .current .ico-house, .nav a:hover .ico-house { background-image: url(images/sprite.png); background-position: -163px -42px; } .nav .current .ico-calendar, .nav a:hover .ico-calendar { background-image: url(images/sprite.png); background-position: -222px -94px; } .nav .current .ico-notes, .nav a:hover .ico-notes { background-image: url(images/sprite.png); background-position: 0 -76px; } .nav .current .ico-hat, .nav a:hover .ico-hat { background-image: url(images/sprite.png); background-position: -90px -76px; } .nav .current .ico-pictures, .nav a:hover .ico-pictures { background-image: url(images/sprite.png); background-position: -163px -89px; } .nav .current .ico-checkmark, .nav a:hover .ico-checkmark { background-image: url(images/sprite.png); background-position: -222px 0; } .nav .current .ico-car, .nav a:hover .ico-car { background-image: url(images/sprite.png); background-position: -106px 0; } /* Nav Views */ .nav-views ul { list-style: none outside none; display: inline-block; vertical-align: middle; overflow: hidden; margin: -1px 5px 0 0; } .nav-views li { float: right; } .nav-views li + li { padding-right: 5px; } .nav-views a { display: block; padding: 0 18px 1px; border: 1px solid #cacaca; border-radius: 3px; color: #666; min-width: 73px; transition: color .3s; } .nav-views a:hover, .nav-views .current a { color: #3192d8; text-decoration: none; } /* ------------------------------------------------------------ *\ Popup \* ------------------------------------------------------------ */ .popup { max-width: 813px; background: #fff; margin: 0 auto; width: 100%; text-align: right; } .popup-head { background: #1b7bc0; color: #fff; } .popup-head h1 { padding: 1px 12px 7px; font-weight: normal; font-size: 30px; font-family: 'Segoe UI', Arial, sans-serif; } .popup-body { padding: 26px 30px 22px; } /* ------------------------------------------------------------ *\ Products \* ------------------------------------------------------------ */ .products { list-style: none outside none; overflow: hidden; } .product { float: right; width: 290px; border: 1px solid #d6d6d6; font-family: 'Segoe UI', Arial, sans-serif; line-height: 1.2; } .product ~ .product { margin-right: 24px; } .product-image { text-align: center; padding: 10px 0 13px; } .product-image a { display: inline-block; } .product-content { padding-bottom: 7px; border-bottom: 1px solid #d6d6d6; margin: 0 9px; min-height: 65px; } .product-meta { overflow: hidden; padding: 6px 12px 12px; } .product-meta h5 { font-weight: normal; text-align: center; padding-bottom: 2px; } .product-qty, .product-price, .product-actions { float: right; } .product-price { width: 100px; text-align: center; margin: 0 10px 0 12px; } .product-price h5 { padding-bottom: 6px; } .product-actions { text-align: center; } .product-actions h5 { padding-bottom: 6px; } /* ------------------------------------------------------------ *\ Qty control \* ------------------------------------------------------------ */ .qty-control { border-radius: 4px; overflow: hidden; font-size: 0; line-height: 0; } .qty-field { padding: 2px 0; border-width: 1px 0; border-style: solid; border-color: #dedede; width: 51px; text-align: center; font-size: 18px; color: #3a3a3a; line-height: 1.3; } .qty-control input, .qty-control a { display: inline-block; vertical-align: top; } .qty-control a { height: 30px; line-height: 26px; text-align: center; width: 30px; color: #fff; font-size: 24px; background: #3192d8; transition: background .3s; } .qty-control a:hover { text-decoration: none; } .qty-control a:active { background: #227dbf; } /* ------------------------------------------------------------ *\ Schedule \* ------------------------------------------------------------ */ .schedule { font-size: 14px; padding-bottom: 40px; } .schedule-head { text-align: center; padding-bottom: 6px; } .schedule-head h2 { color: #3192d8; font-weight: normal; font-size: 22px; } .schedule-row { display: table-row; text-align: center; } .schedule-td, .schedule-th { display: table-cell; width: 9%; border-bottom: 1px solid #dedede; } .schedule-th { background: #efefef; padding: 0 2px; } .schedule-th ~ .schedule-th { border-right: 1px solid #fff; } .schedule-th h4 { padding: 7px 0 1px; font-weight: normal; border-bottom: 1px solid #ffffff; } .schedule-th span { display: block; padding: 8px 10px; border-top: 1px solid #e1e1e1; } .schedule-td { color: #666; padding: 6px 0; } .schedule-td:first-child { border-right: 1px solid #e1e1e1; } .schedule-td.last { border-left: 1px solid #e1e1e1; } .schedule-td-warning { color: #ff9000; } .schedule-td-active { background: #bcd2ff; color: #333; } /* ------------------------------------------------------------ *\ Search \* ------------------------------------------------------------ */ .search { position: relative; } .search-field { background: #dedede; width: 214px; height: 28px; padding: 6px 8px 6px 25px; border: none; } .search-btn { position: absolute; top: 5px; left: 5px; border: none; background: none; font-size: 0; line-height: 0; } .search-secondary .search-field { background: #fff; width: 468px; height: 34px; padding: 7px 7px 7px 45px; border: 1px solid #ccc; border-radius: 3px; box-shadow: inset 0 1px 1px rgba(0,0,0, .1); } .search-secondary .search-btn { top: 0; bottom: 0; left: 0; width: 40px; text-align: center; line-height: 33px; border-right: 1px solid #ccc; } /* ------------------------------------------------------------ *\ Section \* ------------------------------------------------------------ */ .section {} /* Section featured */ .section-featured .row { padding-bottom: 34px; } /* Section contacts */ .section-contacts { padding-top: 22px; } /* Section gallery */ .section-gallery { padding-top: 17px; } /* Section products */ .section-products { padding-bottom: 76px; } .section-products .section-head { overflow: hidden; padding-bottom: 27px; } .section-products .section-head h3 { float: right; font-weight: normal; padding-top: 7px; font-family: 'Segoe UI', Arial, sans-serif; } .section-products .section-head-actions { float: left; } .section-products .products { padding-bottom: 38px; } /* Section Recommendations */ .section-recommendations { padding: 7px 0 28px; } .section-recommendations .section-head { padding-bottom: 43px; } .section-recommendations .section-head h3 { font-weight: normal; font-family: 'Segoe UI', Arial, sans-serif; } .section-recommendations .section-actions { padding-top: 20px; overflow: hidden; } .section-recommendations .section-actions .btn { float: right; } .section-recommendations .section-actions .btn ~ .btn { float: left; } /* Section Comments */ .section-comments { padding-top: 17px; } .section-comments .section-head { padding-bottom: 8px; } .section-comments .section-head .sort { float: left; } /* Section events */ .section-events { padding-top: 2px; } .section-events .section-head { position: relative; text-align: center; background: #ff5a5a; margin-right: -14px; } .section-events .section-head h2 { padding: 5px 0 7px; color: #fff; font-weight: normal; } .section-events .section-head:after { content: ''; position: absolute; top: 100%; right: 0; bottom: 5px; border-width: 0 0 13px 15px; border-style: solid; border-color: transparent transparent transparent #021621; } /* Section employees */ .section-employees { padding-top: 20px; } .section-employees h1 { text-transform: uppercase; font-size: 30px; font-family: 'Segoe UI', Arial, sans-serif; font-weight: normal; } .section-employees .section-content { padding: 40px 75px 0 0; } .section-employees .section-content h1, .section-employees .section-content img { display: inline-block; vertical-align: top; } .section-employees .section-content h1 { font-size: 26px; width: 615px; text-align: left; } /* Section Transportation */ .section-transportation .section-head { border-bottom: 1px solid #cacaca; overflow: hidden; padding: 3px 0; margin-top: -3px; } .section-transportation .section-head h5 { float: right; font-weight: normal; color: #666; } .section-transportation .section-head-actions { float: left; margin-top: -3px; } .section-transportation .section-body:after { content: ''; display: table; clear: both; } .section-transportation .section-content { padding-top: 40px; float: right; width: 684px; } .section-transportation .section-content h4 { font-weight: normal; color: #666; } .section-transportation .section-content h4 span { color: #333; margin-left: 5px; } .section-transportation .section-aside { float: left; width: 210px; padding-top: 32px; margin-left: -15px; } .section-transportation .section-actions { padding: 35px 0 5px; color: #3192d8; font-size: 18px; border-bottom: 1px solid #cacaca; margin-bottom: 35px; } /* Section Manager */ .section-manager .section-head { padding: 3px 0; margin-top: -3px; } .section-manager .section-head h5 { float: right; font-weight: normal; color: #666; } .section-manager .section-head-actions { float: left; margin-top: -3px; } .section-manager .section-head-inner { border-bottom: 1px solid #cacaca; padding-bottom: 3px; } .section-manager .section-head-inner ~ .section-head-inner { padding: 8px 3px 7px 0; } .section-manager .section-head-inner:after { content: ''; display: table; clear: both; } .section-manager .section-head .section-head-actions-secondary, .section-manager .section-head .nav-views { float: right; } .section-manager .section-head .sort-tertiary { float: left; } .section-manager .section-head .section-head-actions-secondary { padding-right: 176px; color: #666; } .section-manager .section-body { padding-top: 50px; } .section-manager .section-foot { text-align: center; padding-top: 14px; } .section-manager .section-foot h2 { color: #ce0000; font-size: 22px; font-weight: normal; } .section-manager .section-hint { position: relative; border: 2px solid #dedede; margin-top: 7px; padding-top: 13px; } .section-manager .section-hint h2 { color: #666; min-height: 67px; } .section-manager .section-hint .ico-hand { position: absolute; top: 6px; left: 9px; } /* Section Settings */ .section-settings .section-head { border-bottom: 1px solid #cacaca; overflow: hidden; padding: 3px 0; margin-top: -3px; } .section-settings .section-head h5 { float: right; font-weight: normal; color: #666; } .section-settings .section-head-actions { float: left; margin-top: -3px; } .section-settings .section-body { padding-top: 50px; } /* ------------------------------------------------------------ *\ Sldier range \* ------------------------------------------------------------ */ .slider-range { width: 134px; height: 9px; border: 2px solid #1f1f1f; margin-top: 10px; background-color: #1f1f1f; border-radius: 5px; box-shadow: 0 1px 0 rgba(255,255,255,.06); } .slider-range .ui-slider-handle { width: 22px; height: 22px; top: 50%; left: 50%; margin: -11px 0 0 -11px; background: url(images/handle.png) no-repeat 0 0; cursor: pointer; border: none; } .slider-range .ui-slider-range { background: #2c7099; } /* ------------------------------------------------------------ *\ Slider \* ------------------------------------------------------------ */ .slider { position: relative; overflow: hidden; height: 294px; margin-bottom: 27px; } .slider .owl-carousel .owl-item { -webkit-backface-visibility: visible; backface-visibility: visible; } .slider .slides { list-style: none outside none; } .slider .owl-nav div { position: absolute; top: 50%; width: 50px; height: 50px; margin-top: -25px; background: #fff; background: rgba(255, 255, 255, .6); text-align: center; line-height: 50px; transition: background .3s; } .slider .owl-nav div:hover { background: #fff; } .slider .owl-prev { left: 0; } .slider .owl-next { right: 0; } /* ------------------------------------------------------------ *\ Sort \* ------------------------------------------------------------ */ .sort-label, .sort .select { display: inline-block; vertical-align: middle; } .sort-label { color: #666; } .sort .select { width: 182px; } .sort .chosen-container-single .chosen-single { height: 24px; border-color: #666; line-height: 24px; font-size: 14px; } .sort .chosen-container-single .chosen-single div { width: 16px; padding-top: 5px; border-color: #666; left: 0; } .sort .chosen-container-single .chosen-single div:before { border-width: 4px; border-color: #666 transparent transparent; } .sort .chosen-container .chosen-drop { border-color: #666; } .sort-secondary .select { width: 149px; } .sort-secondary .chosen-container-single .chosen-single { height: 34px; line-height: 34px; border-radius: 3px; border-color: #ccc; font-size: 16px; color: #555; box-shadow: inset 0 1px 1px rgba(0,0,0, .1); } .sort-secondary .chosen-container-single .chosen-single div { border-color: #ccc; padding-top: 10px; left: 0; width: 20px; } .sort-secondary .chosen-container-single .chosen-single div:before { border-color: #ccc transparent transparent; } .sort-secondary .chosen-container-active.chosen-with-drop .chosen-single { background: #fff; border-radius: 3px 3px 0 0; } .sort-secondary .chosen-drop { border-color: #ccc; } .sort-tertiary .sort-label { padding-right: 3px; } .sort-tertiary .select { width: 143px; } .sort-tertiary .chosen-container-single .chosen-single { height: 23px; line-height: 23px; border-radius: 3px; border-color: #cacaca; color: #666; font-size: 14px; } .sort-tertiary .chosen-container-single .chosen-single div { left: 0; width: 26px; border: none; } .sort-tertiary .chosen-container-single .chosen-single div:before { border-color: #cacaca transparent transparent; border-width: 4px; } .sort-tertiary .chosen-container-active.chosen-with-drop .chosen-single { background: #fff; border-radius: 3px 3px 0 0; } .sort-tertiary .chosen-container .chosen-drop { border-color: #cacaca; } .sort .label { padding: 0 10px 1px 5px; border: 1px solid #cacaca; display: inline-block; vertical-align: middle; border-radius: 3px; font-size: 16px; font-weight: bold; color: #666; margin-right: 14px; } .sort .label i { margin-right: 10px; } /* ------------------------------------------------------------ *\ Tabs \* ------------------------------------------------------------ */ .tab { display: none; } .tab.current { display: block; } .tabs-nav ul { list-style: none outside none; } .tabs-nav li { position: relative; display: inline-block; vertical-align: bottom; } .tabs-nav li:before { content: ''; position: absolute; top: -15px; left: 0; z-index: 1; background: url(images/tabs-nav-current.png) no-repeat 0 0; width: 213px; height: 41px; display: none; } .tabs-nav li + li { margin-right: 2px; } .tabs-nav a { position: relative; z-index: 2; display: block; min-width: 213px; padding: 5px 0 8px; text-align: center; color: #3192d8; font-family: 'Segoe UI', Arial, sans-serif; font-size: 20px; transition: padding .3s; } .tabs-nav a { background: rgb(232,232,232); background: linear-gradient(to bottom, rgba(232,232,232,1) 0%,rgba(230,230,230,1) 42%,rgba(222,222,222,1) 61%,rgba(203,203,203,1) 84%,rgba(197,197,197,1) 100%); } .tabs-nav a:hover { text-decoration: none; } .tabs-nav .current a { padding: 14px 0 8px; background: rgb(212,212,212); background: linear-gradient(to bottom, rgba(212,212,212,1) 0%,rgba(242,242,242,1) 19%,rgba(252,252,252,1) 32%,rgba(255,255,255,1) 43%,rgba(255,255,255,1) 100%); } .tabs-nav .current:before { display: block; } /* ------------------------------------------------------------ *\ Table \* ------------------------------------------------------------ */ .table {} /* Table forms */ .table-forms { padding-top: 9px; } .table-forms table { border-collapse: separate; } .table-forms th { padding: 19px 0 18px; background: #e8e8e8; color: #1b7bc0; box-shadow: inset 0 -3px 0 #bfbfbf; text-align: right; border-bottom: 12px solid #fff; } .table-forms th i { margin-left: 4px; } .table-forms th:first-child, .table-forms td:first-child { padding-right : 20px; } .table-forms td { padding: 9px 0; box-shadow: inset 0 -1px 0 #dedede, inset 0 1px 0 #dedede; border-bottom: 3px solid #fff; transition: background .3s; } .table-forms td:first-child { box-shadow: inset 0 -1px 0 #dedede, inset 0 1px 0 #dedede, inset -1px 0 0 #dedede; } .table-forms .last { box-shadow: inset 0 -1px 0 #dedede, inset 0 1px 0 #dedede, inset 1px 0 0 #dedede; } .table-forms tr:hover td { background: #eee; } .table-forms .ico-doc, .table-forms .ico-pdf { margin-right: 12px; } .table-forms .cell-size1 { width: 111px; } .table-forms .cell-size2 { width: 265px; } /* Table summary */ .table-summary { font-family: 'Segoe UI', Arial, sans-serif; font-size: 18px; line-height: 1.67; padding-bottom: 37px; } .table-summary .table-head { padding-bottom: 4px; border-bottom: 2px solid #3192d8; margin-bottom: 21px; } .table-summary .table-head h3 { font-weight: normal; } .table-summary td:first-child { width: 208px; } .table-summary td + td { font-weight: bold; } /* Table employees */ .table-employees .table-head { padding-bottom: 19px; } .table-employees .table-head:after { content: ''; display: table; clear: both; } .table-employees .sort-secondary, .table-employees .search { float: right; } .table-employees .search { margin-right: 17px; } .table-employees .sort-secondary { margin-right: 12px; } .table-employees .employees-meta { float: left; padding: 18px 0 0 16px; font-size: 14px; color: #707070; } .table-employees table { border-collapse: separate; } .table-employees th { padding: 19px 0 18px; background: #e8e8e8; color: #1b7bc0; box-shadow: inset 0 -3px 0 #bfbfbf; text-align: right; border-bottom: 12px solid #fff; } .table-employees th i { margin-left: 4px; } .table-employees th:first-child { padding-right: 8px; } .table-employees th:first-child + th { padding-right: 10px; } .table-employees td { font-size: 14px; padding: 1px 0; color: #000; box-shadow: inset 0 -1px 0 #dedede, inset 0 1px 0 #dedede; border-bottom: 5px solid #fff; transition: background .3s; } .table-employees td:first-child { box-shadow: inset 0 -1px 0 #dedede, inset 0 1px 0 #dedede, inset -1px 0 0 #dedede; } .table-employees .last { box-shadow: inset 0 -1px 0 #dedede, inset 0 1px 0 #dedede, inset 1px 0 0 #dedede; } .table-employees tr:hover td { background: #eee; } .table-employees .link-phone { margin-right: 5px; } .table-employees .link-email { margin-right: 10px; } .table-employees .cell-size1 { width: 59px; } .table-employees .cell-size2 { width: 70px; } .table-employees .cell-size3 { width: 87px; } .table-employees .cell-size4 { width: 100px; } .table-employees .cell-size5 { width: 90px; } .table-employees .cell-size6 { width: 97px; } .table-employees .cell-size7 { width: 82px; } .table-employees .cell-size8 { width: 200px; } .table-employees .cell-size9 { width: 80px; } /* ------------------------------------------------------------ *\ Transportations \* ------------------------------------------------------------ */ .transportations { list-style: none outside none; } .transportation { position: relative; padding: 14px 17px 13px 55px; border: 1px solid #dedede; } .transportation span { padding: 0 5px; } .transportation ~ .transportation { margin-top: 6px; } .transportation-actions { position: absolute; top: 0; left: 0; bottom: 0; width: 47px; background: #eaeaea; text-align: center; line-height: 48px; } .transportation-actions:before { content: ''; position: absolute; top: 50%; left: 100%; border-width: 6px; border-style: solid; border-color: transparent transparent transparent #eaeaea; margin-top: -6px; } /* ------------------------------------------------------------ *\ Updates \* ------------------------------------------------------------ */ .updates { list-style: none outside none; } .update { border-bottom: 1px solid #000; } .update a { position: relative; display: block; padding: 10px 12px 15px 60px; background: #efefef; font-size: 14px; transition: background .3s; } .update a:hover { text-decoration: none; background: #f8f8f8; } .update strong { display: block; } .update-meta { position: absolute; top: 9px; left: 10px; text-align: center; color: #848484; } .update-meta strong { font-size: 30px; color: #1b7bc0; font-weight: normal; line-height: 1; margin-bottom: -3px; } .update-content { color: #737373; } .update-content strong { color: #000; font-size: 18px; } /* ------------------------------------------------------------ *\ Widget \* ------------------------------------------------------------ */ .widgets { list-style: none outside none; } .widget ~ .widget { margin-top: 32px; } .widget-head { position: relative; padding: 5px 14px 7px 28px; margin-left: -14px; } .widget-head:after { content: ''; position: absolute; top: 100%; left: 0; border-width: 0 14px 13px 0; border-style: solid; border-color: transparent #021621 transparent transparent; } .widget-title { color: #fff; font-weight: normal; margin: 0; } /* Widget survey */ .widget-survey + .widget { margin-top: 17px; } .widget-survey .widget-head { background: #e18d21; } .widget-survey .widget-body { position: relative; padding: 0 3px 6px 5px; background: #f5f5f5; } .widget-survey .widget-body:before { content: ''; position: absolute; top: 0; left: 4px; bottom: 5px; right: 2px; border-width: 0 1px 1px; border-style: solid; border-color: #fbfbfb; } /* Widget Updates */ .widget-updates .widget-head { background: #1b7bc0; } .widget-updates-secondary { border: 1px solid #d1d1d1; } .widget-updates-secondary .widget-head { padding: 5px 29px 7px 14px; margin: 4px -15px 0 0; } .widget-updates-secondary .widget-head:after { left: auto; right: 0; border-width: 0 0 13px 14px; border-color: transparent transparent transparent #021621; } .widget-updates-secondary .widget-body { min-height: 166px; padding: 14px; } /* Widget Congrats */ .widget-congrats .widget-head { background: url(images/widget-congrats.png) no-repeat 0 0; } .widget-congrats .widget-head:before { content: ''; position: absolute; top: -20px; left: 8px; background: url(images/baloons.png) no-repeat 0 0; width: 51px; height: 59px; } .widget-congrats ul { list-style: none outside none; } .widget-congrats li { border-bottom: 1px solid #000; } .widget-congrats a { display: block; padding: 11px 12px 12px 40px; color: #383838; background: #efefef; transition: background .3s; } .widget-congrats a:hover { text-decoration: none; background: #f8f8f8; } /* Widget quicklinks */ .widget-quicklinks .widget-head { background: #007b3e; } .widget-quicklinks ul { list-style: none outside none; } .widget-quicklinks li { border-bottom: 1px solid #000; } .widget-quicklinks a { display: block; padding: 11px 11px 10px; color: #383838; background: rgb(240,240,240); background: linear-gradient(to bottom, rgba(240,240,240,1) 0%,rgba(253,253,253,1) 41%,rgba(255,255,255,1) 56%,rgba(255,255,255,1) 100%); } .widget-quicklinks .current a, .widget-quicklinks a:hover { text-decoration: none; color: #3192d8; background: rgb(219,219,219); background: linear-gradient(to bottom, rgba(219,219,219,1) 0%,rgba(255,255,255,1) 52%,rgba(255,255,255,1) 100%); } .widget-quicklinks-secondary .widget-head { background: #3192d8; } /* Widget events */ .widget-events { padding-top: 2px; } .widget-events .widget-head { background: #5ab7ff; } .widget-events .event { padding: 18px 16px 11px; } .widget-events .event ~ .event { margin-top: 18px; } .widget-events .event-content { padding: 0; } .widget-events .event-actions { padding-top: 8px; overflow: hidden; font-size: 14px; } .widget-events .event-actions i { float: right; margin: 2px 2px 0 7px; } .widget-events .event-actions span { overflow: hidden; display: block; } .widget-events .event-actions a { text-decoration: underline; } .widget-events .event-actions a:hover { text-decoration: none; } .widget-events .event-actions-secondary { text-align: left; color: #535353; font-size: 14px; padding-top: 26px; } .widget-events .event-actions-secondary.active { padding-top: 6px; text-align: center; color: #5ab7ff; } /* Widget-transportaions */ .widget-transportaions .widget-head { background: #3192d8; } .widget-transportaions .widget-body { position: relative; padding: 0 3px 6px 5px; background: #f5f5f5; } .widget-transportaions .widget-body:before { content: ''; position: absolute; top: 0; left: 4px; bottom: 5px; right: 2px; z-index: 0; border-width: 0 1px 1px; border-style: solid; border-color: #fbfbfb; } .widget-transportaions .widget-body .form { position: relative; z-index: 2; }
-
משכנתא
<!DOCTYPE html> <html lang="iw" dir="rtl"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=1080" /> <title>Mortgage</title> <link rel="shortcut icon" type="image/x-icon" href="css/images/favicon.ico" /> <!-- Vendor Styles --> <link rel="stylesheet" href="vendor/dropdown/dropdown.css" /> <link rel="stylesheet" href="vendor/jquery-ui-1.11.4.custom/jquery-ui.min.css" /> <!-- App Styles --> <link rel="stylesheet" href="css/style.css" /> <!-- Vendor JS --> <script src="vendor/jquery-1.11.3.min.js"></script> <script src="vendor/jquery-ui-1.11.4.custom/jquery-ui.min.js"></script> <script src="vendor/dropdown/core.js"></script> <script src="vendor/dropdown/touch.js"></script> <script src="vendor/dropdown/dropdown.js"></script> <!-- App JS --> <script src="js/functions.js"></script> </head> <body> <div class="wrapper"> <div class="bar"> <div class="shell"> <ul> <li> <i class="ico-user"></i>ערב טוב, <strong>אדם פרץ</strong> </li> <li> <a href="#">הגדרות</a> </li> <li> <a href="#">יציאה</a> </li> </ul> </div><!-- /.shell --> </div><!-- /.bar --> <header class="header"> <div class="shell"> <a href="#" class="header-logo"> <img src="css/images/logo.png" height="101" width="351" alt=""> </a> <div class="header-actions"> <a href="#" class="header-btn">פתח תוכנית חדשה</a> </div><!-- /.header-actions --> <nav class="nav"> <ul> <li> <a href="#">ראשי</a> </li> <li> <a href="#">לקוחות</a> </li> <li> <a href="#">יומן פגישות</a> </li> <li> <a href="#">תמיכה</a> </li> </ul> </nav><!-- /.nav --> </div><!-- /.shell --> </header><!-- /.header --> <section class="section-settings"> <div class="shell"> <header class="section-head"> <ul class="list-section-actions"> <li> <a href="#"> <i class="ico-calendar"></i> </a> </li> <li> <a href="#"> <i class="ico-pdf"></i> </a> </li> <li> <a href="#"> <i class="ico-print"></i> </a> </li> </ul><!-- /.list-section-actions --> <h1 class="section-title">לקוחות > אדם פרץ</h1><!-- /.section-title --> </header><!-- /.section-head --> <div class="section-body section-tabs"> <nav class="nav-tabs"> <ul> <li class="current"> <a href="#settingsTab1" data-toggle="tab">פרטי הלקוח</a> </li> <li> <a href="#settingsTab2" data-toggle="tab">תכניות משכנתא</a> </li> <li> <a href="#settingsTab3" data-toggle="tab">משימות</a> </li> <li> <a href="#settingsTab4" data-toggle="tab">קבצים מצורפים</a> </li> </ul> </nav><!-- /.nav-tabs --> <div class="tabs"> <div class="tab current" id="settingsTab1"> <div class="form-settings"> <form action="?" method="post"> <div class="form-body"> <div class="content"> <div class="form-row"> <ul class="list-personal-details"> <li>שם פרטי: <strong>אדם</strong></li> <li>שם משפחה: <strong>פרץ</strong></li> <li>ת.ז: <strong>012345678</strong></li> </ul><!-- /.list-personal-details --> </div><!-- /.form-row --> <div class="form-row"> <ul class="list-personal-details"> <li>שם בן/בת זוג: <strong>אדם</strong></li> <li>שם משפחה: <strong>פרץ</strong></li> <li>ת.ז: <strong>012345678</strong></li> </ul><!-- /.list-personal-details --> </div><!-- /.form-row --> <div class="form-row"> <ul class="list-personal-details list-personal-details-secondary"> <li>טלפון 1: <strong>050-8874484</strong></li> <li>טלפון 1: <strong>02-1234567</strong></li> <li>דואר אלקטרוני: <strong class="email-entry">adamperetz@gmail.com</strong></li> </ul><!-- /.list-personal-details --> </div><!-- /.form-row --> <div class="form-row"> <ul class="list-personal-details"> <li>כתובת: <strong>קול התור 26/4</strong></li> <li>עיר: <strong>מעלה אדומים</strong></li> <li>מיקוד: <strong>5355892</strong></li> </ul><!-- /.list-personal-details --> </div><!-- /.form-row --> <div class="form-row"> <ul class="list-personal-details"> <li>מספר לקוח: <strong>1864</strong></li> <li>ת. הצטרפות: <strong>01.06.2014</strong></li> <li>סוג לקוח: <strong>רגיל</strong></li> </ul><!-- /.list-personal-details --> <ul class="list-personal-details list-personal-details-teritary"> <li>שם שמתמש: <strong>01245678</strong> <small>שם המשתמש הינו ת.ז של הלקוח <br />(9 ספרות כולל ביקורת)</small></li> <li>סיסמא: <strong>••••••••</strong> <small>הסיסמא צריכה להכיל 8 תווים המורכבים מאותיות ומספרים</small></li> </ul><!-- /.list-personal-details --> </div><!-- /.form-row --> </div><!-- /.content --> <div class="sidebar sidebar-secondary"> <div class="sidebar-entry"> <p>הערות: <strong>לקוח שהגיע דרך שמוליק</strong></p> </div><!-- /.sidebar-entry --> <div class="sidebar-entry"> <p>מאפייני לקוח: </p> </div><!-- /.sidebar-entry --> </div><!-- /.sidebar-secondary --> </div><!-- /.form-body --> <div class="form-actions"> <input type="submit" value="חזור" class="btn" /> <input type="submit" value="עריכת פרטי לקוח" class="btn" /> <input type="submit" value="שמור" class="btn btn-secondary" /> <ul class="list-section-actions"> <li> <a href="#"> <i class="ico-pdf"></i> </a> </li> <li> <a href="#"> <i class="ico-print"></i> </a> </li> </ul><!-- /.list-section-actions --> </div><!-- /.form-actions --> </form> </div><!-- /.form-settings --> </div><!-- /#settingsTab1.tab --> <div class="tab" id="settingsTab2"> <div class="section-documents"> <div class="content"> <ul class="list-documents"> <li> <i class="ico-pdf-file"></i> <h4>שם הקובץ שם הקובץ שם הקובץ שם הקובץ</h4> <p>נוסף בתאריך: <strong>6.5.2015</strong></p> <a href="#" class="remove-document">מחק</a> </li> <li> <i class="ico-doc-file"></i> <h4>שם הקובץ שם הקובץ שם הקובץ שם הקובץ</h4> <p>נוסף בתאריך: <strong>6.5.2015</strong></p> <a href="#" class="remove-document">מחק</a> </li> <li> <i class="ico-pdf-file"></i> <h4>שם הקובץ שם הקובץ שם הקובץ שם הקובץ</h4> <p>נוסף בתאריך: <strong>6.5.2015</strong></p> <a href="#" class="remove-document">מחק</a> </li> </ul><!-- /.list-documents --> </div><!-- /.content --> <div class="sidebar"> <div class="form-small"> <form action="?" method="post"> <div class="form-head"> <h4>הוספת קובץ חדש</h4> <i class="ico-upload"></i> </div><!-- /.form-head --> <div class="form-body"> <div class="form-row"> <input type="text" class="field field-medium" value="" name="uploaded-filename" id="uploaded-filename" /> <div class="upload-btn"> <input type="file" name="file-upload" id="file-upload" /> <p>בחר קובץ...</p> </div><!-- /.upload-btn --> </div><!-- /.form-row --> <div class="form-row"> <input type="text" class="field" value="" name="uploaded-file-custom-name" id="uploaded-file-custom-name" placeholder="שם הקובץ" /> </div><!-- /.form-row --> <input type="submit" value="הוספת קובץ חדש" class="btn" /> </div><!-- /.form-body --> </form> </div><!-- /.form-small --> </div><!-- /.sidebar --> </div><!-- /.section-documents --> </div><!-- /#settingsTab2.tab --> <div class="tab" id="settingsTab3"> <div class="section-tasks"> <div class="content"> <ul class="list-tasks"> <li> <h4>ללכת לבנק לאומי לבקש משכנתא לפי התכנית.</h4> <div class="task-details"> <p>מועד: <strong>10.5.2015</strong><br />על ידי: <strong>ינון</strong></p> <ul> <li> <a href="#modalEditTask" class="edit-task" data-toggle="modal">ערוך</a> </li> <li> <a href="#" class="remove-task">מחק</a> </li> </ul> </div><!-- /.task-details --> <div class="task-status"> <i class="ico-tickmark"></i> </div><!-- /.task-status --> </li> <li> <h4>ללכת לבנק לאומי לבקש משכנתא לפי התכנית.</h4> <div class="task-details"> <p>מועד: <strong>10.5.2015</strong><br />על ידי: <strong>ינון</strong></p> <ul> <li> <a href="#modalEditTask" class="edit-task" data-toggle="modal">ערוך</a> </li> <li> <a href="#" class="remove-task">מחק</a> </li> </ul> </div><!-- /.task-details --> <div class="task-status"> <i class="ico-exclamation-single"></i> </div><!-- /.task-status --> </li> <li> <h4>ללכת לבנק לאומי לבקש משכנתא לפי התכנית.</h4> <div class="task-details"> <p>מועד: <strong>10.5.2015</strong><br />על ידי: <strong>ינון</strong></p> <ul> <li> <a href="#modalEditTask" class="edit-task" data-toggle="modal">ערוך</a> </li> <li> <a href="#" class="remove-task">מחק</a> </li> </ul> </div><!-- /.task-details --> <div class="task-status"> <i class="ico-exclamation-triple"></i> </div><!-- /.task-status --> </li> <li> <h4>ללכת לבנק לאומי לבקש משכנתא לפי התכנית.</h4> <div class="task-details"> <p>מועד: <strong>10.5.2015</strong><br />על ידי: <strong>ינון</strong></p> <ul> <li> <a href="#modalEditTask" class="edit-task" data-toggle="modal">ערוך</a> </li> <li> <a href="#" class="remove-task">מחק</a> </li> </ul> </div><!-- /.task-details --> <div class="task-status"> <i class="ico-exclamation-dual"></i> </div><!-- /.task-status --> </li> </ul><!-- /.list-tasks --> </div><!-- /.content --> <div class="sidebar"> <div class="form-small"> <form action="?" method="post"> <div class="form-head"> <h4>הוספת משימה חדשה</h4> <i class="ico-new-task"></i> </div><!-- /.form-head --> <div class="form-body"> <div class="form-row"> <input type="text" class="field" value="" name="new-task-mission" id="new-task-mission" placeholder="משימה" /> </div><!-- /.form-row --> <div class="form-row"> <input type="text" class="field" value="" name="new-task-completion-time" id="new-task-completion-time" placeholder="מועד ביצוע" /> </div><!-- /.form-row --> <div class="form-row"> <input type="text" class="field" value="" name="new-task-complete-by" id="new-task-complete-by" placeholder="ביצוע על ידי" /> </div><!-- /.form-row --> <div class="form-row"> <select name="new-task-priority" id="new-task-priority" class="select select-custom"> <option value="עדיפות">עדיפות</option> <option value="עדיפות 1">עדיפות 1</option> <option value="עדיפות 2">עדיפות 2</option> <option value="עדיפות 3">עדיפות 3</option> <option value="עדיפות 4">עדיפות 4</option> </select> </div><!-- /.form-row --> <input type="submit" value="הוספת קובץ חדש" class="btn" /> </div><!-- /.form-body --> </form> </div><!-- /.form-small --> </div><!-- /.sidebar --> </div><!-- /.section-tasks --> </div><!-- /#settingsTab2.tab --> <div class="tab" id="settingsTab4"> <div class="section-programs"> <div class="content"> <ul class="list-programs"> <li> <h4>שם התוכנית שם התוכנית שם התוכנית שם התוכנית</h4> <p>נוסף בתאריך: <strong>6.5.2015</strong><br />סכום משכנתא: <strong>₪1,000,000</strong></p> <a href="#" class="remove-program">מחק</a> </li> <li> <h4>שם התוכנית שם התוכנית שם התוכנית שם התוכנית</h4> <p>נוסף בתאריך: <strong>6.5.2015</strong><br />סכום משכנתא: <strong>₪1,000,000</strong></p> <a href="#" class="remove-program">מחק</a> </li> <li> <h4>שם התוכנית שם התוכנית שם התוכנית שם התוכנית</h4> <p>נוסף בתאריך: <strong>6.5.2015</strong><br />סכום משכנתא: <strong>₪1,000,000</strong></p> <a href="#" class="remove-program">מחק</a> </li> </ul><!-- /.list-programs --> </div><!-- /.content --> <div class="sidebar"> <a href="#modalNewProgram" class="btn" data-toggle="modal">הוספת תוכנית חדשה <br />ללקוח זה</a> </div><!-- /.sidebar --> </div><!-- /.section-programs --> </div><!-- /#settingsTab2.tab --> </div><!-- /.tabs --> </div><!-- /.section-body section-tabs --> </div><!-- /.shell --> </section><!-- /.section-settings --> <footer class="footer"> <div class="footer-bar"> <div class="shell"> <p>כל הזכויות שמורות 2015 למשכנתא +</p> </div><!-- /.shell --> </div><!-- /.footer-bar --> <div class="footer-body"> <div class="shell clear"> <div class="footer-body-inner"> צריך עזרה? <a href="#">למעבר לתמיכה הטכנית</a> </div><!-- /.footer-body-inner --> <nav class="footer-nav"> <ul> <li> <a href="#">ראשי</a> </li> <li> <a href="#">לקוחות</a> </li> <li> <a href="#">יומן פגישות</a> </li> <li> <a href="#">+ פתח תוכנית חדשה</a> </li> </ul> </nav><!-- /.footer-nav --> </div><!-- /.shell clear --> </div><!-- /.footer-body --> </footer><!-- /.footer --> </div><!-- /.wrapper --> <div class="modal" id="modalEditTask"> <div class="modal-container"> <header class="modal-head"> <h1>עריכת משימה</h1> </header><!-- /.modal-head --> <div class="modal-body"> <div class="form-modal"> <div class="form-row"> <label for="field-edit-task-mission" class="form-label">משימה:</label> <div class="form-controls"> <input type="text" class="field" name="field-edit-task-mission" id="field-edit-task-mission" value="" /> </div><!-- /.form-controls --> </div><!-- /.form-row --> <div class="form-row"> <label for="field-edit-task-execution-date" class="form-label">מועד ביצוע:</label> <div class="form-controls"> <input type="text" class="field" name="field-edit-task-execution-date" id="field-edit-task-execution-date" value="" /> </div><!-- /.form-controls --> </div><!-- /.form-row --> <div class="form-row"> <label for="field-edit-task-executed-by" class="form-label">ביצוע על ידי:</label> <div class="form-controls"> <input type="text" class="field" name="field-edit-task-executed-by" id="field-edit-task-executed-by" value="" /> </div><!-- /.form-controls --> </div><!-- /.form-row --> <div class="form-row"> <label for="field-edit-task-priority" class="form-label">עדיפות:</label> <div class="form-controls"> <select name="field-edit-task-priority" id="field-edit-task-priority" class="select select-custom"> <option value=""> </option> <option value="עדיפות 1">עדיפות 1</option> <option value="עדיפות 2">עדיפות 2</option> <option value="עדיפות 3">עדיפות 3</option> <option value="עדיפות 4">עדיפות 4</option> </select> </div><!-- /.form-controls --> </div><!-- /.form-row --> <div class="form-actions"> <input type="submit" value="ביטול" class="btn" /> <input type="submit" value="שמור" class="btn btn-secondary" /> </div><!-- /.form-actions --> </div><!-- /.form-modal --> </div><!-- /.modal-body --> </div><!-- /.modal-container --> </div><!-- /#modalEditTask.modal --> <div class="modal" id="modalNewProgram"> <div class="modal-container"> <header class="modal-head"> <h1>שמירת תכנית משכנתא</h1> </header><!-- /.modal-head --> <div class="modal-body"> <div class="form-modal"> <div class="form-row"> <label for="field-new-program-name" class="form-label">שם התוכנית:</label> <div class="form-controls"> <input type="text" class="field" name="field-new-program-name" id="field-new-program-name" value="" /> </div><!-- /.form-controls --> </div><!-- /.form-row --> <div class="form-row"> <label for="field-new-program-customer" class="form-label">שיוך ללקוח קיים / חדש:</label> <div class="form-controls"> <select name="field-new-program-customer" id="field-new-program-customer" class="select select-custom"> <option value="לקוח חדש">לקוח חדש</option> <option value="לקוח חדש 1">לקוח חדש 1</option> <option value="לקוח חדש 2">לקוח חדש 2</option> <option value="לקוח חדש 3">לקוח חדש 3</option> <option value="לקוח חדש 4">לקוח חדש 4</option> </select> </div><!-- /.form-controls --> </div><!-- /.form-row --> <hr class="form-separator" /> <div class="form-row"> <label for="field-new-program-first-name" class="form-label">שם פרטי:</label> <div class="form-controls"> <input type="text" class="field" name="field-new-program-first-name" id="field-new-program-first-name" value="" /> </div><!-- /.form-controls --> </div><!-- /.form-row --> <div class="form-row"> <label for="field-new-program-last-name" class="form-label">שם משפחה:</label> <div class="form-controls"> <input type="text" class="field" name="field-new-program-last-name" id="field-new-program-last-name" value="" /> </div><!-- /.form-controls --> </div><!-- /.form-row --> <div class="form-row"> <label for="field-new-program-id" class="form-label">ת.ז:</label> <div class="form-controls"> <input type="text" class="field" name="field-new-program-id" id="field-new-program-id" value="" /> </div><!-- /.form-controls --> </div><!-- /.form-row --> <div class="form-row"> <label for="field-new-program-phone" class="form-label">טלפון:</label> <div class="form-controls"> <input type="tel" class="field" name="field-new-program-phone" id="field-new-program-phone" value="" /> </div><!-- /.form-controls --> </div><!-- /.form-row --> <div class="form-row"> <label for="field-new-program-email" class="form-label">דואר אלקטרוני:</label> <div class="form-controls"> <input type="email" class="field" name="field-new-program-email" id="field-new-program-email" value="" /> </div><!-- /.form-controls --> </div><!-- /.form-row --> <div class="form-actions"> <input type="submit" value="ביטול" class="btn" /> <input type="submit" value="שמור" class="btn btn-secondary" /> </div><!-- /.form-actions --> </div><!-- /.form-modal --> </div><!-- /.modal-body --> </div><!-- /.modal-container --> </div><!-- /#modalNewProgram.modal --> </body> </html>
/* Table of Contents update on Fri Jul 10 2015 10:21:29 GMT+0300 (FLE Summer Time) I. Generic -------------------------------------- 01. Reset ------------------------------------ 02. Fonts ------------------------------------ 03. Base ------------------------------------- 04. Helpers ---------------------------------- Clear ------------------------------------ Notext ----------------------------------- Hidden ----------------------------------- Alignleft -------------------------------- Alignright ------------------------------- Disabled --------------------------------- II. Regions -------------------------------------- 01. Wrapper ---------------------------------- 02. Shell ------------------------------------ 03. Header ----------------------------------- 04. Footer ----------------------------------- 05. Content ---------------------------------- 06. Content Widgets -------------------------- 07. Sidebar ---------------------------------- III. Themes --------------------------------------- IV. Modules -------------------------------------- 01. Bar -------------------------------------- 02. Button ----------------------------------- 03. Button Secondary ------------------------- 04. Button Toggle ---------------------------- 05. Form Elements ---------------------------- 06. Form Login ------------------------------- 07. Form Settings ---------------------------- 08. Form New File ---------------------------- 09. Form Modal ------------------------------- 10. List ------------------------------------- 11. List Form Actions ------------------------ 12. List Radios ------------------------------ 13. List Client States ----------------------- 14. List Personal Details -------------------- 15. List Section Actions --------------------- 16. List Documents --------------------------- 17. List Tasks ------------------------------- 18. List Programs ---------------------------- 19. List Prices ------------------------------ 20. List Calculator -------------------------- 21. Modal ------------------------------------ 22. Nav -------------------------------------- 23. Nav Tabs --------------------------------- 24. Nav Paging ------------------------------- 25. Search ----------------------------------- 26. Section Login ---------------------------- 27. Section Compare -------------------------- 28. Section Settings ------------------------- 29. Section Programs ------------------------- 30. Section Planing -------------------------- 31. Tab -------------------------------------- 32. Table ------------------------------------ 33. Table Secondary -------------------------- 34. Table Teritary --------------------------- 35. Tracks ----------------------------------- 36. Tracks Big ------------------------------- 37. Widget ----------------------------------- 38. Widget Search ---------------------------- 39. Widget References ------------------------ 40. Widget Prices ---------------------------- 41. Widget Calculator ------------------------ */ .ico-balance { background-image: url(images/sprite.png); background-position: -86px -90px; width: 24px; height: 21px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-calendar { background-image: url(images/sprite.png); background-position: 0 -126px; width: 22px; height: 22px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-chevron-left { background-image: url(images/sprite.png); background-position: -168px -26px; width: 6px; height: 10px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-dismiss { background-image: url(images/sprite.png); background-position: -158px -63px; width: 13px; height: 13px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-doc-file { background-image: url(images/sprite.png); background-position: 0 -36px; width: 39px; height: 50px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-exclamation-dual { background-image: url(images/sprite.png); background-position: -129px -66px; width: 15px; height: 33px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-exclamation-single { background-image: url(images/sprite.png); background-position: -158px -26px; width: 6px; height: 33px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-exclamation-triple { background-image: url(images/sprite.png); background-position: -129px 0; width: 25px; height: 33px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-login-btn { background-image: url(images/sprite.png); background-position: 0 0; width: 81px; height: 32px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-new-person { background-image: url(images/sprite.png); background-position: -85px -40px; width: 33px; height: 33px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-new-task { background-image: url(images/sprite.png); background-position: -45px -90px; width: 37px; height: 23px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-pdf-file { background-image: url(images/sprite.png); background-position: -43px -36px; width: 37px; height: 50px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-pdf { background-image: url(images/sprite.png); background-position: -158px 0; width: 18px; height: 22px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-print { background-image: url(images/sprite.png); background-position: -26px -126px; width: 20px; height: 20px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-search { background-image: url(images/sprite.png); background-position: -129px -37px; width: 25px; height: 25px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-tickmark { background-image: url(images/sprite.png); background-position: 0 -90px; width: 41px; height: 32px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-upload { background-image: url(images/sprite.png); background-position: -85px 0; width: 40px; height: 36px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-user { background-image: url(images/sprite.png); background-position: -158px -80px; width: 12px; height: 12px; display: inline-block; vertical-align: middle; font-size: 0; } /* ------------------------------------------------------------ *\ I. Generic \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Reset \* ------------------------------------------------------------ */ *, *:before, *:after { padding: 0; margin: 0; outline: 0; box-sizing: border-box; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, main { display: block; } html, body { height: 100%; } html { tap-highlight-color: rgba(0,0,0,0); } body { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; -webkit-text-size-adjust: none; -ms-text-size-adjust: none; text-size-adjust: none; } img, iframe, video, audio, object { max-width: 100%; border: 0; } img { height: auto; display: inline-block; vertical-align: middle; } b, strong { font-weight: bold; } address { font-style: normal; } svg:not(:root) { overflow: hidden; } a, button, input[type="submit"], input[type="button"], input[type="reset"], input[type="file"], input[type="image"], label[for] { cursor: pointer; } a[href^="tel"], button[disabled], input[disabled], textarea[disabled], select[disabled] { cursor: default; } button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; } input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], input[type="color"], textarea, a[href^="tel"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { display: none; -webkit-appearance: none; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } textarea { overflow: auto; resize: none; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; } button, input, optgroup, select, textarea { font-family: inherit; font-size: inherit; color: inherit; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; } button, select { text-transform: none; } table { width: 100%; border-collapse: collapse; border-spacing: 0; } nav ul, nav ol { list-style: none outside none; } /* ------------------------------------------------------------ *\ Fonts \* ------------------------------------------------------------ */ @font-face { font-family: 'NarkisBlockConMF'; src: url('fonts/NarkisBlockConMF_400_normal_1435916396.eot'); src: url('fonts/NarkisBlockConMF_400_normal_1435916396.eot?#iefix') format('embedded-opentype'), url('fonts/NarkisBlockConMF_400_normal_1435916396.svg#NarkisBlockConMF') format('svg'), url('fonts/NarkisBlockConMF_400_normal_1435916396.woff') format('woff'), url('fonts/NarkisBlockConMF_400_normal_1435916396.ttf') format('truetype'); font-weight: 400; font-style: normal; } @font-face { font-family: 'SegoeUI'; src: url('fonts/SegoeUI_300_italic_1434012521.eot'); src: url('fonts/SegoeUI_300_italic_1434012521.eot?#iefix') format('embedded-opentype'), url('fonts/SegoeUI_300_italic_1434012521.svg#SegoeUI') format('svg'), url('fonts/SegoeUI_300_italic_1434012521.woff') format('woff'), url('fonts/SegoeUI_300_italic_1434012521.ttf') format('truetype'); font-weight: 300; font-style: italic; } @font-face { font-family: 'SegoeUI'; src: url('fonts/SegoeUI_400_normal_1434012521.eot'); src: url('fonts/SegoeUI_400_normal_1434012521.eot?#iefix') format('embedded-opentype'), url('fonts/SegoeUI_400_normal_1434012521.svg#SegoeUI') format('svg'), url('fonts/SegoeUI_400_normal_1434012521.woff') format('woff'), url('fonts/SegoeUI_400_normal_1434012521.ttf') format('truetype'); font-weight: 400; font-style: normal; } @font-face { font-family: 'SegoeUI'; src: url('fonts/SegoeUI_700_normal_1434012521.eot'); src: url('fonts/SegoeUI_700_normal_1434012521.eot?#iefix') format('embedded-opentype'), url('fonts/SegoeUI_700_normal_1434012521.svg#SegoeUI') format('svg'), url('fonts/SegoeUI_700_normal_1434012521.woff') format('woff'), url('fonts/SegoeUI_700_normal_1434012521.ttf') format('truetype'); font-weight: 700; font-style: normal; } /* ------------------------------------------------------------ *\ Base \* ------------------------------------------------------------ */ body { font-family: 'Arial', 'Helvetica', sans-serif; font-size: 16px; line-height: 1.19; color: #454545; font-weight: 400; font-style: normal; text-transform: none; text-decoration: none; letter-spacing: 0; word-spacing: 0; direction: rtl; background: #f2f2f2; } .body-login { background: #eee url(images/bg-login.png) repeat 0 0; } a { color: inherit; text-decoration: underline; } a:hover { text-decoration: none; } a[href^="tel"] { text-decoration: none; } h1 { font-size: 56px; font-family: 'NarkisBlockConMF', sans-serif; } h2 { font-size: 40px; font-family: 'NarkisBlockConMF', sans-serif; } h3 { font-size: 36px; font-family: 'NarkisBlockConMF', sans-serif; } h4 { font-size: 26px; font-family: 'NarkisBlockConMF', sans-serif; } h5 { font-size: 16px; font-family: 'NarkisBlockConMF', sans-serif; } h6 { font-size: 14px; font-family: 'NarkisBlockConMF', sans-serif; } h1, h2, h3, h4, h5, h6 { margin-bottom: 0.595em; } p, ul, ol, dl, table, blockquote { margin-bottom: 1.19em; } h1[class], h2[class], h3[class], h4[class], h5[class], h6[class], h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child, p:last-child, ul:last-child, ol:last-child, dl:last-child, table:last-child, blockquote:last-child { margin-bottom: 0; } /* ------------------------------------------------------------ *\ Helpers \* ------------------------------------------------------------ */ /* Clear */ .tab:after, .clear:after, .shell:after, .form-row:after, .nav-tabs ul:after, .section-clients:after, .content-widgets:after, .section-documents:after, .nav-tabs-secondary:after { content: ''; line-height: 0; display: table; clear: both; } /* Notext */ .notext { white-space: nowrap; text-indent: 100%; text-shadow: none; overflow: hidden; } .notext-old { font-size: 0; line-height: 0; text-indent: -4000px; } /* Hidden */ [hidden], .hidden { display: none; } /* Alignleft */ .alignleft { float: left; } /* Alignright */ .alignright { float: right; } /* Disabled */ [disabled], .disabled { cursor: default; } /* ------------------------------------------------------------ *\ II. Regions \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Wrapper \* ------------------------------------------------------------ */ .wrapper { min-height: 100%; position: relative; padding-bottom: 154px; background: #f2f2f2; } .wrapper-alt { background: transparent; } /* ------------------------------------------------------------ *\ Shell \* ------------------------------------------------------------ */ .shell { max-width: 1040px; margin: auto; } /* ------------------------------------------------------------ *\ Header \* ------------------------------------------------------------ */ .header { position: relative; z-index: 50; height: 60px; background: #6b1753; } .header .header-logo { position: relative; float: left; height: 115px; width: 376px; padding-top: 10px; margin-top: -43px; background: #fff; text-align: center; } .header .header-logo:before { content: ''; position: absolute; z-index: -1; left: -10px; bottom: -25px; background: url(images/logo-shadow.png) no-repeat 0 0; width: 396px; height: 63px; } .header .header-actions { float: left; margin: 16px 0 0 38px; } .header .header-btn { display: inline-block; vertical-align: middle; padding: 0 20px; background: #878787; line-height: 30px; height: 28px; border-radius: 15px; color: #f2f2f2; font-size: 24px; font-family: 'NarkisBlockConMF', sans-serif; text-decoration: none; transition: background .3s ease-out; } .header .header-btn:hover { background: #777; } /* ------------------------------------------------------------ *\ Footer \* ------------------------------------------------------------ */ .footer { position: absolute; bottom: 0; left: 0; right: 0; padding-bottom: 30px; background: #939393; } .footer .footer-bar { position: relative; padding: 3px 0; background: #acacac; color: #fff; text-align: center; font-size: 20px; font-family: 'NarkisBlockConMF', sans-serif; } .footer .footer-bar:after { content: ''; position: absolute; left: 0; top: 100%; width: 1679px; height: 18px; background: url(images/footer-shadow.png) no-repeat 0 0; background-size: 100% 100%; } .footer .footer-body { padding: 34px 0; color: #fff; } .footer .footer-body-inner { float: left; font-family: 'NarkisBlockConMF', sans-serif; font-size: 20px; } .footer .footer-body-inner a { text-decoration: underline; } .footer .footer-body-inner a:hover { text-decoration: none; } .footer .footer-nav { float: right; margin: 4px 3px 0 0; font-size: 20px; font-family: 'NarkisBlockConMF', sans-serif; } .footer .footer-nav ul { list-style: none outside none; } .footer .footer-nav li { display: inline-block; vertical-align: top; line-height: 0.8; } .footer .footer-nav li + li { border-right: 1px solid #fff; padding-right: 11px; margin-right: 11px; } .footer .footer-nav a { display: block; padding: 0 6px; text-decoration: none; transition: color .3s ease-out; } .footer .footer-nav a:hover { text-decoration: none; color: rgba(255, 255, 255, .7); } /* ------------------------------------------------------------ *\ Content \* ------------------------------------------------------------ */ .content { width: 738px; float: right; } /* ------------------------------------------------------------ *\ Content Widgets \* ------------------------------------------------------------ */ .content-widgets .widget-table { width: 458px; float: right; } .content-widgets .widget-references { width: 253px; float: left; } /* ------------------------------------------------------------ *\ Sidebar \* ------------------------------------------------------------ */ .sidebar { width: 247px; float: left; } /* ------------------------------------------------------------ *\ III. Themes \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ IV. Modules \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Bar \* ------------------------------------------------------------ */ .bar { padding: 13px 0 10px; font-size: 16px; } .bar ul { list-style: none outside none; overflow: hidden; } .bar li { display: inline-block; vertical-align: top; } .bar li + li:before { content: '|'; padding: 0 9px; } .bar a { text-decoration: none; } .bar a:hover { color: #6b1753; } .bar i { margin-left: 5px; } /* ------------------------------------------------------------ *\ Button \* ------------------------------------------------------------ */ .btn { display: inline-block; vertical-align: middle; min-width: 116px; height: 39px; line-height: 44px; padding: 0 20px; border: 0; background: #333; color: #fff; font-size: 30px; text-decoration: none; text-align: center; font-family: 'NarkisBlockConMF', sans-serif; -webkit-appearance: none; -moz-appearance: none; appearance: none; transition: background .3s ease-out; } .btn:hover { background: #555; } /* ------------------------------------------------------------ *\ Button Secondary \* ------------------------------------------------------------ */ .btn-secondary { background-color: #6b1753; } /* ------------------------------------------------------------ *\ Button Toggle \* ------------------------------------------------------------ */ .btn-toggle { display: inline-block; vertical-align: middle; padding: 5px; background: #eaeaea; border-radius: 50%; box-shadow: inset 2px 2px 4px 0 rgba(0, 0, 0, .15); } .btn-toggle input { display: none; } .btn-toggle label { display: block; height: 46px; width: 46px; background: #d0d0d0; border-radius: 50%; background: #f9f9f9; background: linear-gradient(to bottom, #f9f9f9 0%,#dfdfdf 100%); font-family: 'SegoeUI', sans-serif; font-size: 34px; line-height: 42px; text-align: center; font-weight: normal; box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, .15), inset 0 1px 0 0 #fff; } .btn-toggle label:hover { background: #d9d9d9; background: linear-gradient(to bottom, #d9d9d9 0%,#ececec 100%); box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, .15); } .btn-toggle input:checked + label { background: #d0d0d0; box-shadow: inset 0 0 4px 2px rgba(0, 0, 0, .15), 1px 1px 0 0 #fff; } /* ------------------------------------------------------------ *\ Form Elements \* ------------------------------------------------------------ */ input::-webkit-input-placeholder { color: inherit; opacity: 1; } input::-moz-placeholder { color: inherit; opacity: 1; } input:-ms-input-placeholder { color: inherit; opacity: 1; } input::placeholder { color: inherit; opacity: 1; } textarea::-webkit-input-placeholder { color: inherit; opacity: 1; } textarea::-moz-placeholder { color: inherit; opacity: 1; } textarea:-ms-input-placeholder { color: inherit; opacity: 1; } textarea::placeholder { color: inherit; opacity: 1; } input:-webkit-autofill { -webkit-text-fill-color: inherit !important; -webkit-box-shadow: 0 0 0 1000px #fff inset; } .field-secondary { font-family: 'Arial', 'Helvetica', sans-serif; font-size: 16px; line-height: 20px; color: #454545; width: 100%; height: 36px; display: block; padding: 9px 5px 7px; border: 1px solid #ddd; background-color: #fff; border-radius: 0; box-shadow: none; } .textarea-secondary {} .radio { position: relative; overflow: hidden; } .radio input { display: block; position: absolute; top: 0; right: -50px; } .radio label { width: 38px; height: 38px; display: block; border: 3px solid #fff; border-radius: 3px; } .radio input:checked + label { border-color: #828282; } .radio .purple-radio { background-color: #6b1753; } .radio .blue-radio { background-color: #17196b; } .radio .green-radio { background-color: #176b48; } .radio .red-radio { background-color: #b40000; } .radio .grey-radio { background-color: #616161; } .checkbox {} /* ------------------------------------------------------------ *\ Form Login \* ------------------------------------------------------------ */ .form-login { position: relative; max-width: 310px; margin: 0 auto; padding: 9px 0 56px; background: #f3f3f3; border: 1px solid #e1e1e1; font-family: 'NarkisBlockConMF', sans-serif; } .form-login:after { content: ''; position: absolute; left: 50%; top: 100%; margin-left: -177px; background: url(images/form-login-shadow.png) no-repeat 0 0; width: 354px; height: 26px; } .form-login .form-head h2 { margin: 0 -15px; padding: 16px 0 31px; line-height: 50px; background: url(images/form-login-title.png) no-repeat 0 0; text-align: center; color: #fff; text-align: center; text-shadow: 2px 2px 1px rgba(0,0,0,.4); } .form-login .form-body { min-height: 165px; padding: 41px 48px 7px 37px; text-align: right; } .form-login .form-actions { overflow: hidden; padding-left: 37px; padding-right: 48px; } .form-login .form-actions a { float: right; font-size: 20px; color: #454545; margin-top: 3px; } .form-login .form-row { margin-bottom: 23px; } .form-login .form-label { display: block; margin-bottom: 2px; font-size: 26px; color: #454545; line-height: 1; } .form-login .form-btn { float: left; background-image: url(images/sprite.png); background-position: 0 0; width: 81px; height: 32px; border: 0; color: #fff; font-size: 24px; padding-top: 2px; transition: opacity .3s ease-out; } .form-login .form-btn:hover { opacity: .8; } .form-login .field { width: 100%; padding: 7px 10px 6px; background: #c2c2c2; border-radius: 5px; border: 0; box-shadow: inset 1px 1px 0 0 rgba(0, 0, 0, .3); } /* ------------------------------------------------------------ *\ Form Settings \* ------------------------------------------------------------ */ .form-settings .field-secondary, .form-settings .select-custom, .form-settings .fs-dropdown { width: 181px; float: right; margin: 1px 0 1px 17px; } .form-settings .fs-dropdown { border: 1px solid #ddd; } .form-settings .fs-dropdown-selected { line-height: 34px; height: 34px; } .form-settings .fs-dropdown-selected:before { background-color: transparent; } .form-settings .btn { margin-right: 30px; } .form-settings .fs-dropdown-options { width: auto; left: -1px; right: -1px; border: 1px solid #ddd; border-top: 0; } .form-settings .sidebar, .form-settings .sidebar-entry { min-height: 281px; position: relative; padding: 15px 22px; background-color: #fff; } .form-settings .sidebar:after, .form-settings .sidebar-entry:after { content: ''; width: 247px; height: 16px; display: block; position: absolute; top: 100%; left: 0; right: 0; background: url(images/sb-shadow.png) no-repeat 0 0; } .form-settings .sidebar-secondary { padding: 0; background-color: transparent; } .form-settings .sidebar-secondary:after { content: none; } .form-settings .sidebar-entry { font-family: 'NarkisBlockConMF', sans-serif; font-size: 24px; line-height: 1.35; color: #454545; padding: 15px 22px; background-color: #fff; } .form-settings .sidebar-entry strong { color: #000; font-weight: 400; display: block; } .form-settings .sidebar-entry + .sidebar-entry { min-height: 255px; margin-top: 12px; } .form-settings .sidebar .list-personal-details { padding: 0; } .form-settings .sidebar .list-personal-details li { width: auto; float: none; padding: 0; } .form-settings .sidebar .list-personal-details li + li { padding-top: 17px; } .form-settings .form-row { padding: 16px 0 15px; margin-bottom: 12px; background-color: #fff; } .form-settings .form-label { font-family: 'NarkisBlockConMF', sans-serif; font-size: 24px; line-height: 1.5; width: 214px; float: right; padding: 2px 35px 0 0 ; } .form-settings .form-controls { width: 524px; float: right; } .form-settings .form-logo { width: 220px; float: left; padding-top: 3px; margin: -16px 0 -15px; } .form-settings .form-body:after { content: ''; line-height: 0; display: table; clear: both; } .form-settings .form-actions { font-size: 0; line-height: 0; text-align: left; padding-top: 24px; border-top: 1px solid #ddd; margin-top: 43px; } .form-settings .form-actions .list-section-actions { float: right; padding-top: 3px; } .form-settings .form-actions .list-section-actions li { padding: 0 0 0 9px; } /* ------------------------------------------------------------ *\ Form New File \* ------------------------------------------------------------ */ .form-small { background-color: #fff; } .form-small .btn { width: 100%; display: block; margin-top: 17px; } .form-small .field { font-size: 14px; line-height: 18px; color: #454545; font-weight: 400; width: 100%; height: 26px; display: block; padding: 3px 6px; border: 1px solid #a9a9a9; background-color: #fff; border-radius: 2px; box-shadow: none; } .form-small .field-medium { width: 122px; float: right; } .form-small .upload-btn { font-size: 14px; line-height: 18px; color: #fff; text-align: center; width: 93px; float: left; position: relative; overflow: hidden; } .form-small .upload-btn input { width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 2; opacity: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; } .form-small .upload-btn p { padding: 4px 0; background-color: #333; } .form-small .fs-dropdown-selected { font-size: 14px; line-height: 20px; color: #454545; height: auto; padding: 2px 6px; border: 1px solid #a9a9a9; border-radius: 2px; } .form-small .fs-dropdown-selected:before { background-color: transparent; } .form-small .fs-dropdown-selected:after { left: 5px; } .form-small .fs-dropdown-options { border: 1px solid #a9a9a9; border-top: 0; } .form-small .form-head { position: relative; padding: 10px 12px 5px 9px; border-bottom: 1px solid #bebebe; background-color: #ddd; } .form-small .form-head:after { content: ''; line-height: 0; display: table; clear: both; } .form-small .form-head:before { content: ''; width: 0; height: 0; display: block; position: absolute; top: 100%; left: 50%; border: 5px solid transparent; border-top-color: #bebebe; margin: 1px 0 0 -5px; } .form-small .form-head h4 { font-size: 20px; line-height: 26px; color: #454545; float: right; padding: 8px 0; margin: 0; } .form-small .form-head i { float: left; } .form-small .form-head .ico-new-task { margin-top: 9px; } .form-small .form-head .ico-new-person { margin-top: 2px; } .form-small .form-body { padding: 22px 12px 23px; } .form-small .form-row { padding-bottom: 12px; } /* ------------------------------------------------------------ *\ Form Modal \* ------------------------------------------------------------ */ .form-modal { padding: 0 14px 0 35px; } .form-modal .field, .form-modal .select-custom, .form-modal .fs-dropdown-selected { font-size: 14px; line-height: 18px; color: #454545; font-weight: 400; width: 100%; height: 26px; display: block; padding: 3px 6px; border: 1px solid #a9a9a9; background-color: #fff; border-radius: 2px; box-shadow: none; } .form-modal .fs-dropdown { display: block; } .form-modal .fs-dropdown-selected { line-height: 18px; height: 26px; border: 1px solid #a9a9a9; } .form-modal .fs-dropdown-selected:before { background-color: transparent; } .form-modal .fs-dropdown-options { border: 1px solid #a9a9a9; border-top: 0; } .form-modal .form-row { padding-bottom: 21px; } .form-modal .form-label { line-height: 26px; width: 180px; float: right; padding-left: 10px; } .form-modal .form-controls { width: 318px; float: right; } .form-modal .form-separator { height: 1px; border: 0; margin: 0 -14px 30px -35px; background-color: #ddd; } .form-modal .form-actions { font-size: 0; line-height: 0; text-align: left; padding-top: 41px; } .form-modal .form-actions .btn { margin-right: 25px; } .form-modal .form-actions .btn-secondary { min-width: 146px; } /* ------------------------------------------------------------ *\ List \* ------------------------------------------------------------ */ [class^="list-"] { list-style: none outside none; } /* ------------------------------------------------------------ *\ List Form Actions \* ------------------------------------------------------------ */ .list-form-actions { font-family: 'NarkisBlockConMF', sans-serif; font-size: 24px; line-height: 1; float: right; margin: 0; } .list-form-actions li { float: right; } .list-form-actions li + li { padding-right: 32px; } .list-form-actions a { text-decoration: none; display: block; padding-top: 8px; border-bottom: 1px solid #a2a2a2; } .list-form-actions a:hover { border-bottom-color: transparent; } /* ------------------------------------------------------------ *\ List Radios \* ------------------------------------------------------------ */ .list-radios { overflow: hidden; } .list-radios li { float: right; } .list-radios li + li { padding-right: 22px; } /* ------------------------------------------------------------ *\ List Client States \* ------------------------------------------------------------ */ .list-client-states { font-size: 16px; line-height: 1.38; color: #454545; width: 100%; float: right; padding: 16px 214px 0 164px; border-top: 1px solid #ddd; margin-top: 16px; } .list-client-states li { width: 50%; float: right; } .list-client-states a { text-decoration: none; display: block; } .list-client-states a:hover { text-decoration: underline; } .list-client-states a i { margin-left: 10px; } /* ------------------------------------------------------------ *\ List Personal Details \* ------------------------------------------------------------ */ .list-personal-details { font-family: 'NarkisBlockConMF', sans-serif; font-size: 26px; line-height: 28px; color: #454545; padding: 5px 35px 5px 0; overflow: hidden; } .list-personal-details li { width: 33.33%; width: 33.33333%; float: right; } .list-personal-details strong { color: #000; font-weight: 400; } .list-personal-details small { font-size: 18px; display: block; } .list-personal-details .email-entry { font-family: 'Arial', 'Helvetica', sans-serif; font-size: 20px; } .list-personal-details + .list-personal-details { margin-top: -20px; } .list-personal-details-secondary li { width: auto; padding-left: 56px; } .list-personal-details-secondary li:last-child { padding-top: 20px; } .list-personal-details-teritary li { width: 66.66%; width: 66.66667%; } .list-personal-details-teritary li:first-child { width: 33.33%; width: 33.33333%; } /* ------------------------------------------------------------ *\ List Section Actions \* ------------------------------------------------------------ */ .list-section-actions li { float: right; padding-right: 9px; } .list-section-actions a { width: 31px; height: 31px; display: block; position: relative; border: 1px solid #e4e4e4; } .list-section-actions a:hover { background-color: #e4e4e4; } .list-section-actions a i { display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } .list-section-actions label { font-family: 'NarkisBlockConMF', sans-serif; font-size: 24px; line-height: 31px; color: #5d5d5d; } .list-section-actions input { font-size: 20px; line-height: 23px; text-align: center; width: 56px; height: 31px; padding: 3px 0; border: 1px solid #ddd; background-color: #fff; border-radius: 4px; box-shadow: none; } .list-section-actions .list-item-index { padding-left: 32px; } .list-section-actions .slider-range { width: 134px; height: 9px; border: 2px solid #1f1f1f; margin-top: 10px; background-color: #1f1f1f; border-radius: 5px; box-shadow: 0 1px 0 rgba(255,255,255,.06); } .list-section-actions .slider-range .ui-slider-handle { width: 22px; height: 22px; top: 50%; left: 50%; margin: -11px 0 0 -11px; background: url(images/ico-handle.png) no-repeat 0 0; } .list-section-actions .slider-range .ui-slider-range { background: linear-gradient(to bottom, rgba(153,44,122,1) 0%,rgba(114,26,89,1) 100%);} /* ------------------------------------------------------------ *\ List Documents \* ------------------------------------------------------------ */ .list-documents li { position: relative; padding: 32px 81px 32px 7px; border-top: 1px solid #bebebe; border-bottom: 1px solid #bebebe; margin-bottom: 9px; overflow: hidden; } .list-documents li:before { content: ''; width: 1px; display: block; position: absolute; top: 0; right: 67px; bottom: 0; background-color: #bebebe; } .list-documents h4 { font-family: 'Arial', 'Helvetica', sans-serif; font-size: 18px; line-height: 20px; font-weight: normal; width: 426px; float: right; margin: 0; } .list-documents p { font-size: 14px; line-height: 20px; color: #7e7e7e; width: 180px; float: right; margin: 0; } .list-documents [class^="ico-"] { display: block; position: absolute; top: 0; right: 14px; bottom: 0; margin: auto; } .list-documents .remove-document { font-size: 14px; line-height: 20px; color: #b10000; text-decoration: none; float: left; opacity: 0; visibility: hidden; } .list-documents .remove-document:hover { text-decoration: underline; } .list-documents li:hover { background-color: #fff; } .list-documents li:hover .remove-document { opacity: 1; visibility: visible; } /* ------------------------------------------------------------ *\ List Tasks \* ------------------------------------------------------------ */ .list-tasks > li { position: relative; padding: 0 14px 0 58px; border-top: 1px solid #bebebe; border-bottom: 1px solid #bebebe; margin-bottom: 9px; overflow: hidden; } .list-tasks h4 { font-family: 'Arial', 'Helvetica', sans-serif; font-size: 18px; line-height: 22px; font-weight: normal; width: 545px; float: right; padding: 10px 0; margin: 0; } .list-tasks [class^="ico-"] { display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } .list-tasks .task-status { width: 59px; position: absolute; top: 0; left: 0; bottom: 0; } .list-tasks .task-details { font-size: 14px; line-height: 1.25; color: #838383; width: 121px; float: right; padding: 14px 10px 10px; border-right: 1px solid #bebebe; border-left: 1px solid #bebebe; } .list-tasks .task-details p { margin: 0 0 9px; } .list-tasks .task-details strong { font-weight: normal; color: #454545; } .list-tasks .task-details ul { list-style: none outside none; opacity: 0; visibility: hidden; overflow: hidden; } .list-tasks .task-details li { width: 50%; float: right; } .list-tasks .task-details a { text-decoration: none; } .list-tasks .task-details a:hover { text-decoration: underline; } .list-tasks .task-details .edit-task { color: #0079ac; } .list-tasks .task-details .remove-task { color: #b10000; } .list-tasks li:hover { background-color: #fff; } .list-tasks li:hover .task-details ul { opacity: 1; visibility: visible; } /* ------------------------------------------------------------ *\ List Programs \* ------------------------------------------------------------ */ .list-programs li { position: relative; padding: 22px 20px 22px 7px; border-top: 1px solid #bebebe; border-bottom: 1px solid #bebebe; margin-bottom: 9px; overflow: hidden; } .list-programs h4 { font-family: 'Arial', 'Helvetica', sans-serif; font-size: 18px; line-height: 20px; font-weight: normal; width: 485px; float: right; padding-top: 10px; margin: 0; } .list-programs p { font-size: 14px; line-height: 20px; color: #7e7e7e; width: 170px; float: right; margin: 0; } .list-programs .remove-program { font-size: 14px; line-height: 20px; color: #b10000; text-decoration: none; float: left; opacity: 0; visibility: hidden; margin-top: 10px; } .list-programs .remove-program:hover { text-decoration: underline; } .list-programs li:hover { background-color: #fff; } .list-programs li:hover .remove-program { opacity: 1; visibility: visible; } /* ------------------------------------------------------------ *\ List Prices \* ------------------------------------------------------------ */ .list-prices { font-family: 'NarkisBlockConMF', sans-serif; text-align: center; } .list-prices li { border: 2px solid #fff; background-color: #fff; } .list-prices li + li { margin-top: 4px; } .list-prices h3 { font-size: 26px; line-height: 30px; color: #454545; font-weight: 400; padding: 8px 10px 5px; margin: 0; } .list-prices p { font-size: 30px; line-height: 40px; color: #6b1753; font-weight: 400; border-top: 1px solid #bebebe; border-bottom: 1px solid #ddd; padding: 2px 0 0; margin: 0 -2px -2px; background: url(images/sb-shadow.png) no-repeat 50% 0; } .list-prices li:hover { border-color: #686868; } .list-prices li:hover p { font-size: 40px; border-top-color: transparent; border-bottom-color: transparent; background: transparent; } /* ------------------------------------------------------------ *\ List Calculator \* ------------------------------------------------------------ */ .list-calculator { font-family: 'NarkisBlockConMF', sans-serif; font-size: 20px; line-height: 32px; color: #454545; font-weight: 400; } .list-calculator li { padding: 7px 10px 5px; border-bottom: 1px solid #ddd; overflow: hidden; } .list-calculator strong { color: #6b1753; font-weight: 400; float: left; } .list-calculator .total { font-weight: 700; } .list-calculator .total strong { font-size: 26px; } /* ------------------------------------------------------------ *\ Modal \* ------------------------------------------------------------ */ .modal { width: 100%; height: 100%; opacity: 0; visibility: hidden; position: fixed; top: 0; left: 0; z-index: -1; padding-top: 205px; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; background-color: rgba(0,0,0,.75); transition: opacity .4s ease, visibility .4s ease; } .modal-visible { opacity: 1; visibility: visible; z-index: 100; } .modal-container { width: 567px; padding: 0 10px; margin: auto; background-color: #fff; box-shadow: 0 0 40px 14px #000; } .modal-head { padding: 12px 0 4px; border-bottom: 1px solid #ddd; margin-bottom: 62px; } .modal-body { padding-bottom: 22px; } .modal-show, .modal-show body { overflow: hidden; } /* ------------------------------------------------------------ *\ Nav \* ------------------------------------------------------------ */ .nav { float: right; margin-top: 22px; font-size: 24px; color: #fff; font-family: 'NarkisBlockConMF', sans-serif; } .nav ul { list-style: none outside none; } .nav li { float: right; line-height: 18px; } .nav li + li { margin-right: 14px; padding-right: 14px; border-right: 1px solid #fff; } .nav a { float: right; padding: 0 10px; text-decoration: none; transition: color .2s ease-out; } .nav a:hover { color: rgba(255, 255, 255, .7); } /* ------------------------------------------------------------ *\ Nav Tabs \* ------------------------------------------------------------ */ .nav-tabs { border-bottom: 1px solid #ddd; margin-bottom: 37px; } .nav-tabs ul { padding: 0 9px; } .nav-tabs li { float: right; padding: 0 4px; margin-bottom: -1px; } .nav-tabs a { font-family: 'NarkisBlockConMF', sans-serif; font-size: 24px; line-height: 1.5; color: #454545; text-align: center; font-weight: 400; text-decoration: none; min-width: 179px; display: block; position: relative; z-index: 2; padding: 2px 5px 0; border: 1px solid #ddd; } .nav-tabs a:after { content: ''; height: 1px; display: block; position: absolute; top: 100%; left: 0; right: 0; background-color: transparent; } .nav-tabs a:hover, .nav-tabs .current a { color: #6b1753; text-decoration: none; background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(242,242,242,1) 100%); } .nav-tabs a:hover:after, .nav-tabs .current a:after { background-color: #f2f2f2; } .nav-tabs-adjust a { color: #454545; } .nav-tabs-adjust a strong { color: #6b1753; } .nav-tabs-adjust a span { font-family: 'Arial', 'Helvetica', sans-serif; line-height: 1; } .nav-tabs-adjust a:hover, .nav-tabs-adjust .current a { color: #454545; } .nav-tabs-adjust .nav-item-balance { float: left; } .nav-tabs-adjust .nav-item-balance a { color: #6b1753; min-width: 0; padding-left: 15px; padding-right: 15px; } .nav-tabs-adjust .nav-item-balance a i { margin-right: 10px; } .nav-tabs-secondary { border-bottom: 5px solid #ddd; } .nav-tabs-secondary h3 { font-size: 26px; line-height: 35px; color: #454545; font-weight: normal; float: right; padding: 7px 0 3px; margin: 0; } .nav-tabs-secondary ul { float: left; } .nav-tabs-secondary li { float: right; padding-left: 10px; } .nav-tabs-secondary a { font-family: 'NarkisBlockConMF', sans-serif; font-size: 24px; line-height: 25px; color: #454545; text-align: center; font-weight: 400; text-decoration: none; min-width: 111px; display: block; position: relative; z-index: 2; padding: 13px 0 7px; background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(242,242,242,1) 100%); } .nav-tabs-secondary a:hover, .nav-tabs-secondary .current a { background: #ddd; } /* ------------------------------------------------------------ *\ Nav Paging \* ------------------------------------------------------------ */ .nav-paging { font-family: Tahoma, Geneva, sans-serif; font-size: 0; line-height: 0; text-align: center; padding: 23px 0; border-top: 1px solid #bebebe; margin-top: 24px; } .nav-paging ul { display: inline-block; vertical-align: middle; border: 1px solid #ddd; } .nav-paging li { display: inline-block; vertical-align: middle; } .nav-paging li + li { border-right: 1px solid #ddd; } .nav-paging a { font-size: 14px; line-height: 20px; color: #454545; text-decoration: none; width: 40px; height: 30px; display: block; position: relative; padding: 5px; background-color: #fff; } .nav-paging .link-page { width: 30px; } .nav-paging a:hover, .nav-paging .current > a { background-color: #eee; } /* ------------------------------------------------------------ *\ Search \* ------------------------------------------------------------ */ .search { overflow: hidden; } .search label { font-family: 'NarkisBlockConMF', sans-serif; font-size: 21px; line-height: 31px; color: #454545; width: 75px; float: right; } .search-field { font-size: 14px; line-height: 20px; color: #454545; width: 131px; height: 24px; float: right; padding: 2px 0; border: 0; border-bottom: 1px solid #bebebe; background-color: transparent; border-radius: 0; box-shadow: none; } .search-btn { float: right; border: 0; } /* ------------------------------------------------------------ *\ Section Login \* ------------------------------------------------------------ */ .section-login { padding: 75px 0; text-align: center; } .section-login .section-head { margin-bottom: 68px; } /* ------------------------------------------------------------ *\ Section Compare \* ------------------------------------------------------------ */ .section-compare { clear: both; } .section-compare .section-head { padding: 21px 0 2px; overflow: hidden; } .section-compare .section-head-actions { float: left; margin-top: 11px; font-size: 0; } .section-compare .section-head-actions a { display: inline-block; vertical-align: middle; height: 31px; width: 32px; line-height: 31px; margin-right: 8px; border: 1px solid #e4e4e4; font-size: 1px; text-align: center; transition: background .2s ease-out; } .section-compare .section-head-actions a:hover { background: #e4e4e4; } .section-compare .section-head-actions i { margin-top: -2px; } .section-compare .section-title { float: right; margin-right: 10px; letter-spacing: 0.01em; line-height: 1; } .section-compare .section-title .btn-toggle { margin-right: 4px; } .section-compare .section-bar { padding: 5px 8px 6px; border-width: 1px 0; border-style: solid; border-color: #dddddd; text-align: left; } .section-compare .section-bar .form-controls { display: inline-block; vertical-align: middle; width: 275px; } .section-compare .section-bar .form-label { display: inline-block; vertical-align: middle; font-family: 'NarkisBlockConMF', sans-serif; color: #6b1753; font-size: 24px; margin-left: 7px; } .section-compare .section-body { padding: 35px 0 80px; } .section-compare .section-foot { padding: 24px 0 33px; border-top: 1px solid #dddddd; overflow: hidden; } .section-compare .section-foot .btn { float: left; margin-left: 8px; } .section-compare .section-foot-actions { float: right; margin-top: 5px; font-size: 0; } .section-compare .section-foot-actions a { display: inline-block; vertical-align: middle; height: 31px; width: 32px; line-height: 31px; margin-left: 8px; border: 1px solid #e4e4e4; font-size: 1px; text-align: center; transition: background .2s ease-out; } .section-compare .section-foot-actions a:hover { background: #e4e4e4; } .section-compare .section-foot-actions i { margin-top: -2px; } /* ------------------------------------------------------------ *\ Section Settings \* ------------------------------------------------------------ */ .section-settings { padding: 31px 0 71px; } .section-settings h1 { line-height: 1.1em; } .section-settings .section-head { border-bottom: 1px solid #ddd; margin-bottom: 11px; } .section-settings .list-section-actions { float: left; padding-top: 15px; } .section-settings .sidebar { position: relative; } .section-settings .sidebar:after { content: ''; width: 247px; height: 16px; display: block; position: absolute; top: 100%; left: 0; right: 0; background: url(images/sb-shadow.png) no-repeat 0 0; } /* ------------------------------------------------------------ *\ Section Programs \* ------------------------------------------------------------ */ .section-programs .sidebar .btn { font-size: 30px; line-height: 1; height: auto; display: block; padding: 7px 10px 3px; } /* ------------------------------------------------------------ *\ Section Planing \* ------------------------------------------------------------ */ .section-planing { padding: 25px 0 84px; } .section-planing .form-actions { font-size: 0; line-height: 0; text-align: left; overflow: hidden; } .section-planing .form-actions .btn { margin-right: 25px; } .section-planing .form-actions .list-section-actions { float: right; padding-top: 4px; margin: 0; } .section-planing .form-actions .list-section-actions li { padding: 0 0 0 9px; } .section-planing .section-head { border-bottom: 1px solid #ddd; margin-bottom: 11px; overflow: hidden; } .section-planing .section-head h1 { float: right; } .section-planing .section-head .list-section-actions { float: left; padding-top: 20px; margin: 0; } .section-planing .section-foot { width: 100%; float: right; padding-top: 24px; border-top: 1px solid #ddd; margin-top: 24px; } .section-planing .content .tabs { margin-bottom: 21px; } /* ------------------------------------------------------------ *\ Tab \* ------------------------------------------------------------ */ .tabs { position: relative; } .tab { opacity: 0; visibility: hidden; position: absolute; top: 0; left: 0; right: 0; z-index: -2; transition: opacity .4s ease, visibility .4s ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .tab.current { opacity: 1; visibility: visible; position: relative; top: auto; left: auto; right: auto; z-index: auto; } /* ------------------------------------------------------------ *\ Table \* ------------------------------------------------------------ */ .table { font-size: 14px; line-height: 1.36; color: #454545; font-weight: 400; } .table table { border-collapse: separate; } .table th, .table td { padding: 15px 0; } .table th:first-child, .table td:first-child { text-align: center; } .table th { text-align: right; font-weight: 400; border-bottom: 1px solid #bebebe; background-color: #ddd; } .table th:nth-child(1) { width: 86px; } .table th:nth-child(2) { width: 145px; } .table th:nth-child(3) { width: 131px; } .table th:nth-child(4) { width: 131px; } .table td { border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; background-color: #fff; margin-top: 2px; } .table td div { position: relative; } .table td a[class] { width: 16px; height: 30px; display: block; opacity: 0; visibility: hidden; position: absolute; top: 50%; right: 100%; margin-top: -15px; background-color: #ddd; border-radius: 15px 0 0 15px; } .table td a[class] i { display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } .table tr:hover td a { opacity: 1; visibility: visible; } .table td .fs-dropdown-options { position: absolute; } /* ------------------------------------------------------------ *\ Table Secondary \* ------------------------------------------------------------ */ .table-secondary th:nth-child(1) { width: 117px; } .table-secondary th:nth-child(2) { width: 155px; } .table-secondary th:nth-child(3) { width: 108px; } .table-secondary th:nth-child(4) { width: 69px; } .table-secondary th:nth-child(5) { width: 55px; } .table-secondary th:nth-child(6) { width: 90px; } .table-secondary th:last-child { width: 40px; } .table-secondary table { margin: 0; } .table-secondary th { text-align: center; padding: 15px 5px; } .table-secondary td { text-align: center; padding: 12px 5px; } .table-secondary td a { position: static; opacity: 1; visibility: visible; } .table-secondary td a.dismiss-row { font-size: 12px; line-height: 20px; color: #ac0303; text-align: center; text-decoration: none; position: absolute; opacity: 0; visibility: hidden; padding: 5px 0 5px 2px; margin-right: 5px; } .table-secondary td .ico-grid { width: 16px; height: 16px; display: inline-block; vertical-align: middle; background: url(images/ico-grid.png) no-repeat 0 0; } .table-secondary td a:hover .ico-grid { background-image: url(images/ico-grid_hover.png); } .table-secondary input { font-size: 14px; line-height: 18px; color: #454545; text-align: right; padding: 3px 5px; border: 1px solid #ddd; background-color: #fff; border-radius: 2px; box-shadow: none; } .table-secondary .fs-dropdown-selected { font-size: 14px; line-height: 18px; color: #454545; text-align: right; height: 28px; padding: 3px 5px; border: 1px solid #ddd; background-color: #fff; border-radius: 2px; box-shadow: none; } .table-secondary .fs-dropdown-selected:before { content: none; } .table-secondary .fs-dropdown-selected:after { left: 5px; border-width: 3px; border-top-color: #000; } .table-secondary .cell1 input, .table-secondary .cell1 .fs-dropdown { width: 97px; } .table-secondary .cell2 input, .table-secondary .cell2 .fs-dropdown { width: 145px; } .table-secondary .cell3 input, .table-secondary .cell3 .fs-dropdown { width: 98px; } .table-secondary .cell4 input, .table-secondary .cell4 .fs-dropdown { width: 59px; } .table-secondary .cell5 input, .table-secondary .cell5 .fs-dropdown { width: 45px; } .table-secondary .table-actions { text-align: center; padding-bottom: 18px; border-bottom: 1px solid #ddd; margin-bottom: 20px; } .table-secondary .table-actions a { font-size: 14px; line-height: 15px; color: #6b1753; text-decoration: none; display: inline-block; vertical-align: top; padding: 10px 15px; border: 1px solid #ddd; border-top: 0; } .table-secondary .table-actions a:hover { background-color: #ddd; } /* ------------------------------------------------------------ *\ Table Teritary \* ------------------------------------------------------------ */ .table-teritary { margin-bottom: -24px; } .table-teritary table { font-size: 16px; line-height: 1.19; color: #454545; } .table-teritary th, .table-teritary td { text-align: right; font-weight: 400; padding: 10px 0; border-bottom: 1px solid #bebebe; } .table-teritary th { line-height: 1.25; padding-top: 15px; padding-bottom: 15px; background-color: #ddd; } .table-teritary tbody tr:nth-child(odd) td { background-color: #fff; } .table-teritary th:first-child, .table-teritary td:first-child { text-align: center; width: 45px; padding: 10px 10px 10px 20px; } .table-teritary th:first-child { padding: 15px 10px 15px 20px; } .table-teritary th:last-child { text-align: center; padding-left: 30px; } .table-teritary .table-head { padding: 9px 10px 5px 8px; border-bottom: 1px solid #bebebe; margin-bottom: 3px; overflow: hidden; background-color: #ddd; } .table-teritary .table-head h2 { font-size: 26px; line-height: 1; font-weight: 400; float: right; position: relative; top: 1px; margin: 0; } .table-teritary .table-head label { font-family: 'NarkisBlockConMF', sans-serif; font-size: 26px; line-height: 1; color: #6b1753; font-weight: 400; float: right; position: relative; top: 2px; margin-left: 7px; } .table-teritary .table-head-actions { float: left; } .table-teritary .table-head-actions .field { font-size: 14px; line-height: 16px; color: #454545; font-weight: 400; width: 59px; height: 26px; float: right; padding: 4px; border: 1px solid #a9a9a9; background-color: #fff; border-radius: 2px; box-shadow: none; } .table-teritary .table-foot { text-align: center; } .table-teritary .table-toggle { font-family: 'NarkisBlockConMF', sans-serif; font-size: 18px; line-height: 19px; color: #454545; text-decoration: none; display: inline-block; vertical-align: top; padding: 13px 0; } .table-teritary .table-toggle:before { content: ''; width: 0; line-height: 0; display: inline-block; vertical-align: middle; border: 5px solid transparent; border-bottom: 6px solid #6b1753; margin: -6px 0 0 5px; } .table-teritary.table-collapsed { margin-bottom: 0; } .table-teritary .table-toggle .text-collapsed, .table-teritary.table-collapsed .table-toggle .text-expanded { display: none; } .table-teritary.table-collapsed .table-toggle:before { border-bottom-color: transparent; border-top: 6px solid #6b1753; margin-top: 2px; } .table-teritary.table-collapsed .table-toggle .text-collapsed { display: inline; } /* ------------------------------------------------------------ *\ Tracks \* ------------------------------------------------------------ */ .tracks { position: relative; overflow: hidden; } .tracks-bar { position: absolute; left: 0; top: 350px; width: 100%; padding: 10px 0 7px; background: #dddddd; border-bottom: 1px solid #bebebe; text-align: center; } .tracks-bar .form-controls { display: inline-block; width: 59px; } .tracks-bar .form-label { display: inline-block; vertical-align: middle; margin-left: 35px; color: #6b1753; font-size: 26px; font-family: 'NarkisBlockConMF', sans-serif; } .tracks-bar .field { display: inline-block; vertical-align: middle; width: 100%; height: 26px; padding: 0 5px; border-radius: 2px; border: 1px solid #a9a9a9; } .track { width: 29.6%; float: right; } .track + .track { margin-right: 5.6%; } .track .track-title { position: relative; background: #fff; margin-bottom: 16px; padding: 3px 0 0; font-family: 'NarkisBlockConMF', sans-serif; text-align: center; } .track .track-title:after { content: ''; position: absolute; left: 0; top: 100%; width: 100%; height: 15px; background: url(images/track-shadow.png) no-repeat 0 0; background-size: 100% 100%; } .track .track-title em { font-style: normal; color: #6b1753; } .track .track-title span { font-family: 'SegoeUI', sans-serif; font-weight: normal; } .track .track-body { background: #fff; } .track .track-meta ul { list-style: none outside none; } .track .track-meta li { padding: 0 10px; line-height: 31px; border-bottom: 1px solid #ddd; font-size: 22px; font-family: 'NarkisBlockConMF', sans-serif; } .track .track-meta li span, .track .track-meta li strong { display: inline-block; vertical-align: top; } .track .track-meta li span { width: 188px; } .track .track-chart { padding: 15px 0 80px; } .track .track-chart img { max-width: 100%; height: auto; } .track .track-info { position: relative; } .track .track-info:before { content: ''; position: absolute; left: 50%; top: 0; border-width: 6px 6px 0; margin-left: -6px; border-style: solid; border-color: #bebebe transparent; } .track .track-info ul { list-style: none outside none; } .track .track-info li { padding: 0 9px 0 16px; line-height: 42px; font-size: 20px; overflow: hidden; border-bottom: 1px solid #dddddd; font-family: 'NarkisBlockConMF', sans-serif; } .track .track-info strong { float: left; color: #6b1753; font-weight: normal; } .track .track-info span { float: right; } .track .track-info .track-info-total strong { font-size: 26px; } .track .track-info .track-info-total span { font-weight: bold; } /* ------------------------------------------------------------ *\ Tracks Big \* ------------------------------------------------------------ */ .tracks-alt .tracks-bar { top: 423px; } .track-big { width: 47.2%; } .track-big .track-chart { padding-bottom: 72px; } .track-big .track-info li { padding-left: 45%; } /* ------------------------------------------------------------ *\ Widget \* ------------------------------------------------------------ */ .widgets { list-style: none outside none; margin: 0; } .widget { position: relative; } .widget:after { content: ''; width: 247px; height: 16px; display: block; position: absolute; top: 100%; left: 0; right: 0; background: url(images/sb-shadow.png) no-repeat 0 0; } .widget + .widget { margin-top: 22px; } .widget .form-small .btn { margin-top: 10px; } .widget .form-small .form-body { padding-bottom: 10px; } /* ------------------------------------------------------------ *\ Widget Search \* ------------------------------------------------------------ */ .widget-search { padding: 10px 10px 10px 5px; margin-bottom: 12px; background-color: #ddd; } .widget-search:after { content: none; } /* ------------------------------------------------------------ *\ Widget References \* ------------------------------------------------------------ */ .widget-references .widgettitle { font-size: 26px; line-height: 30px; color: #454545; font-weight: 400; padding: 7px 10px 5px; border-bottom: 1px solid #bebebe; margin: 0 0 3px; background-color: #ddd; } .widget-references .widget-body { color: #716f6f; min-height: 86px; padding: 10px; background-color: #fff; } /* ------------------------------------------------------------ *\ Widget Prices \* ------------------------------------------------------------ */ .widget-prices:after { content: none; } .widget-prices .widgettitle { font-size: 36px; line-height: 40px; color: #454545; font-weight: 400; text-align: center; position: relative; padding: 12px 10px 8px; border-bottom: 1px solid #bebebe; background-color: #ddd; } .widget-prices .widgettitle:after { content: ''; width: 0; height: 0; display: block; position: absolute; top: 100%; left: 50%; border: 7px solid transparent; border-top-color: #bebebe; margin-left: -7px; } /* ------------------------------------------------------------ *\ Widget Calculator \* ------------------------------------------------------------ */ .widget-calculator:after { content: none; } .widget-calculator .widgettitle { font-size: 26px; line-height: 1; color: #454545; font-weight: 400; position: relative; padding: 14px 10px 10px; border-bottom: 1px solid #bebebe; margin: 0; background-color: #ddd; } .widget-calculator .widgettitle:after { content: ''; width: 0; height: 0; display: block; position: absolute; top: 100%; left: 50%; border: 7px solid transparent; border-top-color: #bebebe; margin-left: -7px; } .widget-calculator .widgettitle input { font-family: 'Arial', 'Helvetica', sans-serif; font-size: 14px; line-height: 16px; color: #454545; font-weight: 400; width: 57px; height: 26px; float: left; position: relative; top: -1px; padding: 4px; border: 1px solid #a9a9a9; background-color: #fff; border-radius: 2px; box-shadow: none; } .widget-calculator .widget-body { background-color: #fff; }
-
Wayerz
<!DOCTYPE html> <!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--> <!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]--> <!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]--> <!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]--> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Wayerz</title> <meta name="description" content=""> <link rel="stylesheet" href="css/screen.css"> <link rel="stylesheet" href="css/update-nov.css"> <script src="js/vendor/modernizr.js"></script> </head> <body> <header class="site-header"> <div class="container"> <div class="row"> <div class="col-20"> <h1 class="logo"><a href="#"><img src="css/images/logo-wayerz.png" alt=""></a></h1> </div> <div class="col-80"> <h2 class="subhead pull-left">WTS Admin Panel</h2> <ul class="nav nav-user pull-right"> <li>AndreaPirlo@gmail.com <a href="#"><i class="icon-medium-logout"></i></a></li> </ul> </div> </div> </div> </header> <div class="container"> <div class="row"> <div class="col-20"> <aside class="sidebar"> <ul class="nav nav-primary text-center"> <li class="active"> <a href="#"> <i class="icon-medium-bank"></i><span class="block text-upper">Transfer Simulator</span> </a> </li> <li> <a href="#"> <i class="icon-medium-simulator"></i><span class="block text-upper">Wiring Map</span> </a> </li> </ul> </aside> </div> <div class="col-80"> <div class="primary-content bg-base"> <div class="panel clean"> <div class="panel-head"> <h4 class="text-primary text-upper">Simulate Transfer Wiring</h4> <p class="lead text-mute">Display for: Client (103) Transfer, of 10,000 (EUR), From: Leumi Tel Aviv 1452, To Swift: 23215421-543, Ben Payment, All Routes</p> </div> </div> <div class="module large contain-panel-route route-active-swift route-active-chaps"> <div class="panel panel-secondary spaced bottom double"> <div class="panel-head"> <div class="row"> <div class="col-40"> <ul class="nav nav-tabs-secondary"> <li><a href="javascript:;" data-toggle="paint-map" data-id="default">All</a></li> <li><a href="javascript:;" data-toggle="paint-map" data-id="swift" class="active">Swift</a></li> <li><a href="javascript:;" data-toggle="paint-map" data-id="chaps" class="active">Chaps</a></li> <li><a href="javascript:;" data-toggle="paint-map">Bacs</a></li> <li><a href="javascript:;" data-toggle="paint-map">Fast</a></li> </ul> </div> <div class="col-60 pull-right"> <div class="row"> <div class="col-66"> <select name="" id="" class="form-control"> <option value="" selected="selected">Cheapest</option> </select> </div> <div class="col-33"> <select name="add_filter" id="add_filter" placeholder="Add Filter" class="form-control" data-toggle="add-filter" data-target=".panel-route"> <option value="">Add Filter</option> <option value="">Hide Countries</option> <option value="filter-stops">Limit number of stops</option> <option value="filter-routes">Hide unselected routes</option> </select> </div> </div> </div> </div> </div> <div class="panel-body panel-route"> <div class="all-routes"> <div class="route-stat spaced bottom row"> <div class="col-25 text-center"> <div class="route-stat-item"> <p class="text-large text-color45"><strong>$2.6</strong></p> <p>1 day</p> </div> <div class="tab-content tab-route-chart"> <div class="route-chart tab-pane fade"> <div class="route-chart-danger route-chart-item" data-value="50,100,50,50,50,50,50"></div> <div class="route-chart-regulation route-chart-item" data-value="-50,-50,-50,-50,-100,-50,-50"></div> </div> <div class="route-chart route-chart-all tab-pane fade active in"> <div class="route-chart-danger route-chart-item" data-value="50,100,50,50,50,50,50"></div> <div class="route-chart-item" data-value="0,15,0,15,0,0,0" data-chart-helper="true"></div> <div class="route-chart-regulation route-chart-item" data-value="-50,-50,-50,-50,-100,-50,-50"></div> </div> </div> </div> <div class="col-25 text-center"> <div class="route-stat-item route-plus"> <p class="text-large text-color46"><strong>$2.6</strong></p> <p>5 hours</p> </div> <div class="tab-content tab-route-chart"> <div class="route-chart tab-pane fade"> <div class="route-chart-danger route-chart-item" data-value="50,100,50,50,50,50,50"></div> <div class="route-chart-regulation route-chart-item" data-value="-50,-50,-50,-50,-100,-50,-50"></div> </div> <div class="route-chart route-chart-all tab-pane fade active in"> <div class="route-chart-danger route-chart-item" data-value="50,100,50,50,50,50,50"></div> <div class="route-chart-item" data-value="0,15,0,15,0,0,0" data-chart-helper="true"></div> <div class="route-chart-regulation route-chart-item" data-value="-50,-50,-50,-50,-100,-50,-50"></div> </div> </div> </div> <div class="col-25 text-center"> <div class="route-stat-item route-plus"> <p class="text-large text-color47"><strong>$2.6</strong></p> <p>12 hours</p> </div> <div class="tab-content tab-route-chart"> <div class="route-chart tab-pane fade"> <div class="route-chart-danger route-chart-item" data-value="50,100,50,50,50,50,50"></div> <div class="route-chart-regulation route-chart-item" data-value="-50,-50,-50,-50,-100,-50,-50"></div> </div> <div class="route-chart route-chart-all tab-pane fade active in"> <div class="route-chart-danger route-chart-item" data-value="50,100,50,50,50,50,50"></div> <div class="route-chart-item" data-value="0,15,0,15,0,0,0" data-chart-helper="true"></div> <div class="route-chart-regulation route-chart-item" data-value="-50,-50,-50,-50,-100,-50,-50"></div> </div> </div> </div> <div class="col-25 text-center"> <div class="route-stat-item route-equal"> <p class="text-large text-color48"><strong>$8.4</strong></p> <p>Total</p> </div> <div class="tab-content tab-route-chart"> <div class="route-chart tab-pane fade"> <div class="route-chart-danger route-chart-item" data-value="50,100,50,50,50,50,50"></div> <div class="route-chart-regulation route-chart-item" data-value="-50,-50,-50,-50,-100,-50,-50"></div> </div> <div class="route-chart route-chart-all tab-pane fade active in"> <div class="route-chart-danger route-chart-item" data-value="50,100,50,50,50,50,50"></div> <div class="route-chart-item" data-value="0,15,0,15,0,0,0" data-chart-helper="true"></div> <div class="route-chart-regulation route-chart-item" data-value="-50,-50,-50,-50,-100,-50,-50"></div> </div> </div> </div> </div> <div class="route-banks wrap-connects row"> <div class="col-25 text-center"> <div class="route-bank-item"> <div class="bank-item bank-item-start border-bank-default"> <img src="css/images/bank-leumi.png" alt=""> <div class="route-bank-labels"> <div class="labels"> <span class="label active color-swift route-connect" data-connect-to=".route-end-2-1" data-connect-class="border-connect-swift">1</span> <span class="label active shared-label color-chaps route-connect" data-connect-to=".route-end-2-2" data-connect-class="border-connect-chaps">1</span> <span class="label inactive route-connect" data-connect-to=".route-end-2-1 .route-end-2-2" data-connect-class="border-connect-inactive">1</span> <span class="label inactive route-connect" data-connect-to=".route-end-2-3" data-connect-class="border-connect-inactive">1</span> </div> </div> <i class="icon-simulator-flag flag-israel"></i> </div> <p class="text-center text-upper text-medium-alt"><strong><em>Send</em></strong></p> </div> </div> <div class="col-25 text-center"> <div class="route-bank-item"> <div class="bank-item border-bank-swift active"> <img src="css/images/bank-baiduri.png" alt=""> <div class="route-bank-labels end single"> <div class="labels"> <span class="label color-swift label-end route-end-2-1"></span> </div> </div> <div class="route-bank-labels single"> <div class="labels"> <span class="label active color-swift route-connect" data-connect-to=".route-end-3-2" data-connect-class="border-connect-swift">2</span> <span class="label shared-label shared-label-middle inactive route-connect" data-connect-to=".route-end-3-1" data-connect-class="border-connect-inactive">2</span> </div> </div> <i class="icon-simulator-flag flag-uk"></i> </div> </div> <div class="route-bank-item"> <div class="bank-item border-bank-chaps active"> <img src="css/images/bank-citibank.png" alt=""> <div class="route-bank-labels end single"> <div class="labels"> <span class="label color-chaps label-end route-end-2-2"></span> </div> </div> <div class="route-bank-labels single"> <div class="labels"> <span class="label active color-chaps route-connect" data-connect-to=".route-end-3-3" data-connect-class="border-connect-chaps">2</span> <span class="label shared-label shared-label-middle inactive route-connect" data-connect-to=".route-end-3-3" data-connect-class="border-connect-inactive">2</span> <span class="label shared-label shared-label-middle inactive route-connect" data-connect-to=".route-end-3-2" data-connect-class="border-connect-inactive">2</span> </div> </div> </div> </div> <div class="route-bank-item"> <div class="bank-item border-bank-inactive"> <img src="css/images/bank-citibank.png" alt=""> <div class="route-bank-labels end single"> <div class="labels"> <span class="label colorinactive label-end route-end-2-3"></span> </div> </div> <div class="route-bank-labels single"> <div class="labels"> <span class="label inactive route-connect" data-connect-to=".route-end-3-4" data-connect-class="border-connect-inactive">2</span> </div> </div> </div> </div> </div> <div class="col-25 text-center"> <div class="route-bank-item"> <div class="bank-item border-bank-inactive"> <img src="css/images/bank-attica.png" alt=""> <div class="route-bank-labels end single"> <div class="labels"> <span class="label colorinactive label-end route-end-3-1"></span> </div> </div> <div class="route-bank-labels single"> <div class="labels"> <span class="label inactive route-connect" data-connect-to=".route-end-4-1" data-connect-class="border-connect-inactive">3</span> </div> </div> </div> </div> <div class="route-bank-item"> <div class="bank-item border-bank-swift active"> <img src="css/images/bank-citibank.png" alt=""> <div class="route-bank-labels end single"> <div class="labels"> <span class="label color-swift label-end route-end-3-2"></span> </div> </div> <div class="route-bank-labels single"> <div class="labels"> <span class="label active color-swift route-connect" data-connect-to=".route-end-4-1" data-connect-class="border-connect-swift">3</span> </div> </div> <i class="icon-simulator-flag flag-us"></i> </div> </div> <div class="route-bank-item"> <div class="bank-item border-bank-chaps active"> <img src="css/images/bank-attica.png" alt=""> <div class="route-bank-labels end single"> <div class="labels"> <span class="label color-chaps label-end route-end-3-3"></span> </div> </div> <div class="route-bank-labels single"> <div class="labels"> <span class="label active color-chaps route-connect" data-connect-to=".route-end-4-1" data-connect-class="border-connect-chaps">3</span> </div> </div> </div> </div> <div class="route-bank-item"> <div class="bank-item border-bank-inactive"> <img src="css/images/bank-attica.png" alt=""> <div class="route-bank-labels end single"> <div class="labels"> <span class="label colorinactive label-end route-end-3-4"></span> </div> </div> <div class="route-bank-labels single"> <div class="labels"> <span class="label inactive route-connect" data-connect-to=".route-end-4-1" data-connect-class="border-connect-inactive">3</span> </div> </div> </div> </div> </div> <div class="col-25 text-center"> <div class="route-bank-item"> <div class="bank-item bank-item-end border-bank-default"> <img src="css/images/bank-attica.png" alt=""> <div class="route-bank-labels end single"> <div class="labels"> <span class="label color-swift color-chaps label-end route-end-4-1"></span> </div> </div> <i class="icon-simulator-flag flag-china"></i> </div> <p class="text-center text-upper text-medium-alt"><strong><em>Receive</em></strong></p> </div> </div> </div> </div><!-- .all-routes --> </div> </div> <div class="panel panel-secondary spaced bottom double"> <div class="panel-head clearfix"> <h4 class="pull-left">Cheapest transfer route</h4> <div class="btn-group pull-right"> <button class="btn btn-icon"><i class="icon-small-info-mute"></i></button><button class="btn btn-primary btn-medium">Select</button> </div> </div> <div class="panel-body"> <div class="row"> <div class="col-25"> <p class="text-large text-primary">$35</p> <p>Sender</p> </div> <div class="col-25"> <p class="text-large text-primary">$0</p> <p>Receiver</p> </div> <div class="col-25"> <div class="widget-total text-primary"> <div class="total-num">7</div> <div class="total-text"> <p><br>Days</p> </div> </div> <p>Total Transaction</p> </div> <div class="col-25"> <div class="widget-date text-primary"> <div class="date">24</div> <div class="month-year"> <p>January</p> <p>2014</p> </div> </div> <p>Expected Delivery Date</p> </div> </div> </div> </div> <div class="panel panel-secondary"> <div class="panel-head clearfix"> <h4 class="pull-left">Fastest transfer route</h4> <div class="btn-group pull-right"> <button class="btn btn-icon"><i class="icon-small-info-mute"></i></button><button class="btn btn-primary btn-medium">Select</button> </div> </div> <div class="panel-body"> <div class="row"> <div class="col-25"> <p class="text-large text-primary">$45</p> <p>Sender</p> </div> <div class="col-25"> <p class="text-large text-primary">$0</p> <p>Receiver</p> </div> <div class="col-25"> <div class="widget-total text-primary"> <div class="total-num">4</div> <div class="total-text"> <p><br>Days</p> </div> </div> <p>Total Transaction</p> </div> <div class="col-25"> <div class="widget-date text-primary"> <div class="date">21</div> <div class="month-year"> <p>January</p> <p>2014</p> </div> </div> <p>Expected Delivery Date</p> </div> </div> </div> </div> </div><!-- .module-large --> </div><!-- .primary-content --> </div> </div> </div> <script src="js/vendor/jquery.js"></script> <script src="js/vendor/chosen.js"></script> <script src="js/vendor/imagesloaded.js"></script> <script src="js/vendor/jsplumb.js"></script> <script src="js/vendor/d3.js"></script> <script src="js/vendor/c3.min.js"></script> <script src="js/functions.js"></script> <script> $(function(){ // danger &rregulation bars $('.route-chart-item').each(function(){ var _chart = { el : $(this), value: $(this).data('value').split(','), isHelper: $(this).data('chart-helper') }, columns = []; columns[0] = ['x'].concat(_chart.value); var chart = c3.generate({ bindto: _chart.el[0], size: { width: 120, height: 34 }, bar: { width: 10 }, padding: { left: 0 }, data: { columns: columns, type: 'bar', color: function(inColor, data) { var colors = ['#609334', '#80af48', '#bdd685', '#fff8a4', '#ffaf99', '#f37b6f', '#d34f48']; if( _chart.isHelper ) colors = ['#609334', '#009fe3', '#80af48', '#ea6060']; if(data.index !== undefined) { return colors[data.index]; } return inColor; } }, axis: { x: { type: 'category', show: false }, y: { show: false, max: _chart.isHelper ? 100 : null } }, tooltip: { show: false }, legend: { show: false } }); }); // customize map routes $('.contain-panel-route').each(function(){ var _route = { parent: $(this) } // toggle routes $(document).on('click', '[data-toggle=paint-map]', function(){ var id = $(this).data('id'), connectionLabels = $('.label.color-' + id).not('.label-end'), bankItems = $('.bank-item.border-bank-' + id), isActive = $(this).hasClass('active'), routes = _route.parent.find('.route-connect'); bankItems.toggleClass('border-bank-inactive active'); connectionLabels.toggleClass('label-invisible', isActive); routes.each(function(index, item){ if( $(item).hasClass('inactive') || ! $(item).hasClass('color-' + id) ) return; if( isActive ){ jsPlumb.hide(item); }else{ jsPlumb.show(item); } }); $(this).toggleClass('active'); _route.parent.toggleClass('route-active-' + id, !isActive).each(function(){ if($(this).hasClass('route-active-swift') && $(this).hasClass('route-active-chaps')){ $('.tab-route-chart').find('.tab-pane:first-child').removeClass('active in'); $('.tab-route-chart').find('.route-chart-all').addClass('active in'); }else{ $('.tab-route-chart').find('.tab-pane:first-child').addClass('active in'); $('.tab-route-chart').find('.route-chart-all').removeClass('active in'); } }); jsPlumb.repaintEverything(); }); }); }); </script> </body> </html>
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; } html { line-height: 1; } ol, ul { list-style: none; } table { border-collapse: collapse; border-spacing: 0; } caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; } q, blockquote { quotes: none; } q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; } a img { border: none; } article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; } @font-face { font-family: "Museo Sans"; src: url('fonts/museosans_500-webfont.eot?1444532291'); src: url('fonts/museosans_500-webfont.eot?&1444532291#iefix') format('embedded-opentype'), url('fonts/museosans_500-webfont.woff?1444532291') format('woff'), url('fonts/museosans_500-webfont.ttf?1444532291') format('truetype'), url('fonts/museosans_500-webfont.svg?1444532291') format('svg'); font-weight: 500; font-style: normal; } @font-face { font-family: "Museo Sans"; src: url('fonts/museosans_500_italic-webfont.eot?1444532291'); src: url('fonts/museosans_500_italic-webfont.eot?&1444532291#iefix') format('embedded-opentype'), url('fonts/museosans_500_italic-webfont.woff?1444532291') format('woff'), url('fonts/museosans_500_italic-webfont.ttf?1444532291') format('truetype'), url('fonts/museosans_500_italic-webfont.svg?1444532291') format('svg'); font-weight: 500; font-style: italic; } @font-face { font-family: "Museo Sans"; src: url('fonts/museosans_700-webfont.eot?1444532291'); src: url('fonts/museosans_700-webfont.eot?&1444532291#iefix') format('embedded-opentype'), url('fonts/museosans_700-webfont.woff?1444532291') format('woff'), url('fonts/museosans_700-webfont.ttf?1444532291') format('truetype'), url('fonts/museosans_700-webfont.svg?1444532291') format('svg'); font-weight: 700; font-style: normal; } @font-face { font-family: "Museo Sans"; src: url('fonts/museosans-700italic-webfont.eot?1444532291'); src: url('fonts/museosans-700italic-webfont.eot?&1444532291#iefix') format('embedded-opentype'), url('fonts/museosans-700italic-webfont.woff?1444532291') format('woff'), url('fonts/museosans-700italic-webfont.ttf?1444532291') format('truetype'), url('fonts/museosans-700italic-webfont.svg?1444532291') format('svg'); font-weight: 700; font-style: italic; } @font-face { font-family: "Museo Sans"; src: url('fonts/museosans-300-webfont.eot?1444532290'); src: url('fonts/museosans-300-webfont.eot?&1444532290#iefix') format('embedded-opentype'), url('fonts/museosans-300-webfont.woff?1444532290') format('woff'), url('fonts/museosans-300-webfont.ttf?1444532290') format('truetype'), url('fonts/museosans-300-webfont.svg?1444532290') format('svg'); font-weight: 300; font-style: normal; } @font-face { font-family: "Museo Sans"; src: url('fonts/museosans-300italic-webfont.eot?1444532290'); src: url('fonts/museosans-300italic-webfont.eot?&1444532290#iefix') format('embedded-opentype'), url('fonts/museosans-300italic-webfont.woff?1444532291') format('woff'), url('fonts/museosans-300italic-webfont.ttf?1444532291') format('truetype'), url('fonts/museosans-300italic-webfont.svg?1444532290') format('svg'); font-weight: 300; font-style: italic; } .text-default, .link-default, .link-default:visited { color: #434343; } .link-default:hover { color: #363636; } .bg-default, .btn-default { background-color: #434343; } .border-default { border-color: #434343; } .btn-default:hover, .btn-default:visited:hover { background-color: #2a2a2a; } .text-mute, .link-mute, .link-mute:visited { color: #b5b5b5; } .link-mute:hover { color: #a8a8a8; } .bg-mute, .btn-mute { background-color: #b5b5b5; } .border-mute { border-color: #b5b5b5; } .btn-mute:hover, .btn-mute:visited:hover { background-color: #9c9c9c; } .text-primary, .link-primary, .link-primary:visited { color: #6ac6d9; } .link-primary:hover { color: #56bed4; } .bg-primary, .btn-primary { background-color: #6ac6d9; } .border-primary { border-color: #6ac6d9; } .btn-primary:hover, .btn-primary:visited:hover { background-color: #41b6cf; } .text-secondary, .link-secondary, .link-secondary:visited { color: #70757a; } .link-secondary:hover { color: #64686d; } .bg-secondary, .btn-secondary { background-color: #70757a; } .border-secondary { border-color: #70757a; } .btn-secondary:hover, .btn-secondary:visited:hover { background-color: #585c5f; } .text-seamless, .link-seamless, .link-seamless:visited { color: #edfcff; } .link-seamless:hover { color: #d4f8ff; } .bg-seamless, .btn-seamless { background-color: #edfcff; } .border-seamless { border-color: #edfcff; } .btn-seamless:hover, .btn-seamless:visited:hover { background-color: #baf4ff; } .text-success, .link-success, .link-success:visited { color: #98d540; } .link-success:hover { color: #8cce2d; } .bg-success, .btn-success { background-color: #98d540; } .border-success { border-color: #98d540; } .btn-success:hover, .btn-success:visited:hover { background-color: #7eb929; } .text-off, .link-off, .link-off:visited { color: #d4d4d4; } .link-off:hover { color: #c7c7c7; } .bg-off, .btn-off { background-color: #d4d4d4; } .border-off { border-color: #d4d4d4; } .btn-off:hover, .btn-off:visited:hover { background-color: #bbbbbb; } .text-off-alt, .link-off-alt, .link-off-alt:visited { color: #eaeaea; } .link-off-alt:hover { color: #dddddd; } .bg-off-alt, .btn-off-alt { background-color: #eaeaea; } .border-off-alt { border-color: #eaeaea; } .btn-off-alt:hover, .btn-off-alt:visited:hover { background-color: #d1d1d1; } .text-inverse, .link-inverse, .link-inverse:visited { color: #4D5765; } .link-inverse:hover { color: #424b57; } .bg-inverse, .btn-inverse { background-color: #4D5765; } .border-inverse { border-color: #4D5765; } .btn-inverse:hover, .btn-inverse:visited:hover { background-color: #373e48; } .text-danger, .link-danger, .link-danger:visited { color: #e9573f; } .link-danger:hover { color: #e64328; } .bg-danger, .btn-danger { background-color: #e9573f; } .border-danger { border-color: #e9573f; } .btn-danger:hover, .btn-danger:visited:hover { background-color: #dc3519; } .text-base, .link-base, .link-base:visited { color: #ffffff; } .link-base:hover { color: #f2f2f2; } .bg-base, .btn-base { background-color: #ffffff; } .border-base { border-color: #ffffff; } .btn-base:hover, .btn-base:visited:hover { background-color: #e6e6e6; } * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } html { font-size: 62.5%; } body, html { margin: 0; font-weight: 300; color: #434343; font-family: "Museo Sans", "Segoe UI", Helvetica, Arial, sans-serif; font-weight: 300; } body, input, select, textarea, button { -webkit-font-smoothing: antialiased; font-size: 16px; font-size: 1.6rem; font-family: "Museo Sans", "Segoe UI", Helvetica, Arial, sans-serif; font-weight: 300; } strong { font-weight: bold; } em { font-style: italic; } a, a:visited { text-decoration: none; color: #6ac6d9; } a:hover, a:visited:hover { text-decoration: none; } h1, h2, h3, h4 { font-weight: 300; } h2 { font-size: 28px; font-size: 2.8rem; } h3 { font-size: 22px; font-size: 2.2rem; } .text-upper { text-transform: uppercase; } .text-lower { text-transform: lowercase; } .text-center { text-align: center; } .text-right { text-align: right; } .text-left { text-align: left; } .text-large { font-size: 36px; font-size: 3.6rem; } .text-medium { font-size: 26px; font-size: 2.6rem; } .text-medium-alt { font-size: 20px; font-size: 2rem; } .text-medium-smaller { font-size: 17px; font-size: 1.7rem; } .text-small { font-size: 14px; font-size: 1.4rem; } .text-tiny { font-size: 11px; font-size: 1.1rem; } .text-thin { font-weight: 300; } .pull-left { float: left; } .pull-right { float: right; } .block { display: block; } .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; } .ie-9 .col-33.popup, .ie-9 .control-field { position: relative; } .block { display: block; } .pull-right { float: right; } .pull-left { float: left; } .clearfix:before, .container:before, .row:before, .btn-group:before, .list-inline:before, .list-toolbar:before, .panel > .panel-head:before, .panel > .panel-body > .panel-body-intro:before, .nav-tabs:before, .nav-inline-tabs:before, .nav-tabs-secondary:before, .filter-wrapper:before, .datepick-month-header:before, .list-branches > li .list-sub-group:before, .cor-banks h4:before, .clearfix:after, .container:after, .row:after, .btn-group:after, .list-inline:after, .list-toolbar:after, .panel > .panel-head:after, .panel > .panel-body > .panel-body-intro:after, .nav-tabs:after, .nav-inline-tabs:after, .nav-tabs-secondary:after, .filter-wrapper:after, .datepick-month-header:after, .list-branches > li .list-sub-group:after, .cor-banks h4:after { content: " "; display: table; } .clearfix:after, .container:after, .row:after, .btn-group:after, .list-inline:after, .list-toolbar:after, .panel > .panel-head:after, .panel > .panel-body > .panel-body-intro:after, .nav-tabs:after, .nav-inline-tabs:after, .nav-tabs-secondary:after, .filter-wrapper:after, .datepick-month-header:after, .list-branches > li .list-sub-group:after, .cor-banks h4:after { clear: both; } .clearfix, .container, .row, .btn-group, .list-inline, .list-toolbar, .panel > .panel-head, .panel > .panel-body > .panel-body-intro, .nav-tabs, .nav-inline-tabs, .nav-tabs-secondary, .filter-wrapper, .datepick-month-header, .list-branches > li .list-sub-group, .cor-banks h4 { *zoom: 1; } .container { width: 100%; margin-left: auto; margin-right: auto; padding-left: 15px; padding-right: 15px; } .container.wrap-single { width: 86%; padding-left: 0; padding-right: 0; } .row { margin-left: -15px; margin-right: -15px; } .row.tight { margin-left: -8px; margin-right: -8px; } .row.tight > [class^="col-"] { padding-left: 8px; padding-right: 8px; } .row.sticky { margin-left: 0; margin-right: 0; } .row.sticky > [class^="col-"] { padding-left: 0; padding-right: 0; } .row.inline { display: inline-block; width: auto; } [class^="col-"] { padding-left: 15px; padding-right: 15px; float: left; } [class^="col-"].pull-right { float: right; } .column-lone { float: none; margin-left: auto; margin-right: auto; } .col-1 { width: 1%; } .col-2 { width: 2%; } .col-3 { width: 3%; } .col-4 { width: 4%; } .col-5 { width: 5%; } .col-6 { width: 6%; } .col-7 { width: 7%; } .col-8 { width: 8%; } .col-9 { width: 9%; } .col-10 { width: 10%; } .col-11 { width: 11%; } .col-12 { width: 12%; } .col-13 { width: 13%; } .col-14 { width: 14%; } .col-15 { width: 15%; } .col-16 { width: 16%; } .col-17 { width: 17%; } .col-18 { width: 18%; } .col-19 { width: 19%; } .col-20 { width: 20%; } .col-21 { width: 21%; } .col-22 { width: 22%; } .col-23 { width: 23%; } .col-24 { width: 24%; } .col-25 { width: 25%; } .col-26 { width: 26%; } .col-27 { width: 27%; } .col-28 { width: 28%; } .col-29 { width: 29%; } .col-30 { width: 30%; } .col-31 { width: 31%; } .col-32 { width: 32%; } .col-33 { width: 33%; } .col-34 { width: 34%; } .col-35 { width: 35%; } .col-36 { width: 36%; } .col-37 { width: 37%; } .col-38 { width: 38%; } .col-39 { width: 39%; } .col-40 { width: 40%; } .col-41 { width: 41%; } .col-42 { width: 42%; } .col-43 { width: 43%; } .col-44 { width: 44%; } .col-45 { width: 45%; } .col-46 { width: 46%; } .col-47 { width: 47%; } .col-48 { width: 48%; } .col-49 { width: 49%; } .col-50 { width: 50%; } .col-51 { width: 51%; } .col-52 { width: 52%; } .col-53 { width: 53%; } .col-54 { width: 54%; } .col-55 { width: 55%; } .col-56 { width: 56%; } .col-57 { width: 57%; } .col-58 { width: 58%; } .col-59 { width: 59%; } .col-60 { width: 60%; } .col-61 { width: 61%; } .col-62 { width: 62%; } .col-63 { width: 63%; } .col-64 { width: 64%; } .col-65 { width: 65%; } .col-66 { width: 66%; } .col-67 { width: 67%; } .col-68 { width: 68%; } .col-69 { width: 69%; } .col-70 { width: 70%; } .col-71 { width: 71%; } .col-72 { width: 72%; } .col-73 { width: 73%; } .col-74 { width: 74%; } .col-75 { width: 75%; } .col-76 { width: 76%; } .col-77 { width: 77%; } .col-78 { width: 78%; } .col-79 { width: 79%; } .col-80 { width: 80%; } .col-81 { width: 81%; } .col-82 { width: 82%; } .col-83 { width: 83%; } .col-84 { width: 84%; } .col-85 { width: 85%; } .col-86 { width: 86%; } .col-87 { width: 87%; } .col-88 { width: 88%; } .col-89 { width: 89%; } .col-90 { width: 90%; } .col-91 { width: 91%; } .col-92 { width: 92%; } .col-93 { width: 93%; } .col-94 { width: 94%; } .col-95 { width: 95%; } .col-96 { width: 96%; } .col-97 { width: 97%; } .col-98 { width: 98%; } .col-99 { width: 99%; } .col-100 { width: 100%; } .col-33 { width: 33.33%; } .col-66 { width: 66.67%; } .full, .full-wrap, .full-container { width: 100%; height: 100%; } .full-wrap { display: table; } .full-container { display: table-cell; vertical-align: middle; text-align: center; } .no-line-height { line-height: 0; } [class^="icon-"], [class*="icon-"] { display: inline-block; vertical-align: middle; } caption, th, td { font-weight: 300; } table { width: 100%; } table td, table th { vertical-align: middle; line-height: 1.6; overflow: hidden; text-overflow: ellipsis; } table.table-fixed { table-layout: fixed; } table.table-fixed td, table.table-fixed th { width: auto; } table.table-fixed td.cell-icon, table.table-fixed th.cell-icon { width: 60px; text-align: center; } table.table-fixed td.cell-num, table.table-fixed th.cell-num { width: 60px; } table.table-fixed td.cell-status, table.table-fixed th.cell-status { width: 100px; text-align: center; } table.table-fixed td.cell-currency, table.table-fixed th.cell-currency { width: 110px; } table.table-fixed td.cell-narrow, table.table-fixed th.cell-narrow { padding: 10px; } table.table-fixed td.cell-from, table.table-fixed th.cell-from { width: 150px; text-align: left; } table.table-fixed td.cell-5, table.table-fixed th.cell-5 { width: 5%; } table.table-fixed td.cell-10, table.table-fixed th.cell-10 { width: 10%; } table.table-fixed td.cell-15, table.table-fixed th.cell-15 { width: 15%; } table.table-fixed td.cell-20, table.table-fixed th.cell-20 { width: 20%; } table.table-fixed td.cell-25, table.table-fixed th.cell-25 { width: 25%; } table.table-fixed td.cell-30, table.table-fixed th.cell-30 { width: 30%; } table.table-fixed td.cell-50, table.table-fixed th.cell-50 { width: 50%; } table.table-hover > tbody > tr:hover > td { background: rgba(181, 181, 181, 0.15); } table.table-hover > tbody > tr:hover > td .reveal-on-hover { filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; } table.table-scroll { table-layout: auto; } table.table-scroll > tbody { overflow-x: hidden; overflow-y: auto; } table.table-mute > thead > tr > th { background: rgba(181, 181, 181, 0.25); } table.table-label, table.table-invoice { table-layout: fixed; } table.table-label > thead > tr > th, table.table-invoice > thead > tr > th { height: 55px; } table.table-label > tbody > tr > td, table.table-invoice > tbody > tr > td { max-width: 100%; height: 65px; padding-bottom: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 14px; font-size: 1.4rem; } table > thead > tr > th { padding: 15px 10px; background: #edfcff; } table > tbody > tr > td { padding: 10px; border-bottom: 1px solid #e8e8e8; } table.table-tall > tbody > tr > td { padding: 30px 10px; } .relative { position: relative; } .form-group + .form-group { margin-top: 30px; } .form-control, .as-form-control, .text-core .text-wrap { width: 100%; height: 34px; padding: 10px; border: none; outline: none; } .form-control.alt, .as-form-control.alt, .text-core .text-wrap.alt { font-size: 14px; font-size: 1.4rem; } .form-control.txt-auto-size, .as-form-control.txt-auto-size, .text-core .text-wrap.txt-auto-size { height: 42px; } .control-label { display: block; } .control-label.alt { font-size: 14px; font-size: 1.4rem; } .control-prefix { position: relative; } .control-prefix > .prefix { display: inline-block; float: left; margin-right: 4px; } .form-stack .control-label { padding-top: 10px; } input.form-control, textarea.form-control, .as-form-control, .text-core .text-wrap { resize: none; background: bottom left url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==') no-repeat, bottom center url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==') repeat-x, bottom right url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==') no-repeat !important; background: bottom left -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #6ac6d9), color-stop(100%, #6ac6d9)) no-repeat, bottom center -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #6ac6d9), color-stop(100%, #6ac6d9)) repeat-x, bottom right -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #6ac6d9), color-stop(100%, #6ac6d9)) no-repeat !important; background: bottom left -moz-linear-gradient(#6ac6d9, #6ac6d9) no-repeat, bottom center -moz-linear-gradient(#6ac6d9, #6ac6d9) repeat-x, bottom right -moz-linear-gradient(#6ac6d9, #6ac6d9) no-repeat !important; background: bottom left -webkit-linear-gradient(#6ac6d9, #6ac6d9) no-repeat, bottom center -webkit-linear-gradient(#6ac6d9, #6ac6d9) repeat-x, bottom right -webkit-linear-gradient(#6ac6d9, #6ac6d9) no-repeat !important; background: bottom left linear-gradient(#6ac6d9, #6ac6d9) no-repeat, bottom center linear-gradient(#6ac6d9, #6ac6d9) repeat-x, bottom right linear-gradient(#6ac6d9, #6ac6d9) no-repeat !important; -moz-background-size: 1px 8px, 1px 1px, 1px 8px !important; -o-background-size: 1px 8px, 1px 1px, 1px 8px !important; -webkit-background-size: 1px 8px, 1px 1px, 1px 8px !important; background-size: 1px 8px, 1px 1px, 1px 8px !important; } input.form-control.error, textarea.form-control.error, .as-form-control.error, .text-core .text-wrap.error { background: bottom left url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2U5NTczZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2U5NTczZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==') no-repeat, bottom center url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2U5NTczZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2U5NTczZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==') repeat-x, bottom right url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2U5NTczZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2U5NTczZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==') no-repeat !important; background: bottom left -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e9573f), color-stop(100%, #e9573f)) no-repeat, bottom center -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e9573f), color-stop(100%, #e9573f)) repeat-x, bottom right -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e9573f), color-stop(100%, #e9573f)) no-repeat !important; background: bottom left -moz-linear-gradient(#e9573f, #e9573f) no-repeat, bottom center -moz-linear-gradient(#e9573f, #e9573f) repeat-x, bottom right -moz-linear-gradient(#e9573f, #e9573f) no-repeat !important; background: bottom left -webkit-linear-gradient(#e9573f, #e9573f) no-repeat, bottom center -webkit-linear-gradient(#e9573f, #e9573f) repeat-x, bottom right -webkit-linear-gradient(#e9573f, #e9573f) no-repeat !important; background: bottom left linear-gradient(#e9573f, #e9573f) no-repeat, bottom center linear-gradient(#e9573f, #e9573f) repeat-x, bottom right linear-gradient(#e9573f, #e9573f) no-repeat !important; -moz-background-size: 1px 8px, 1px 1px, 1px 8px !important; -o-background-size: 1px 8px, 1px 1px, 1px 8px !important; -webkit-background-size: 1px 8px, 1px 1px, 1px 8px !important; background-size: 1px 8px, 1px 1px, 1px 8px !important; } input.form-control.seamless, input.form-control.seamless.error, textarea.form-control.seamless, textarea.form-control.seamless.error, .as-form-control.seamless, .as-form-control.seamless.error, .text-core .text-wrap.seamless, .text-core .text-wrap.seamless.error { border: none; background: none; } .as-form-control.with-arrow { position: relative; } .as-form-control.with-arrow .arrow { position: absolute; right: 10px; top: 50%; margin-top: -8px; } .as-form-control input.form-control { padding: 0; padding-right: 10px; height: 14px; } .input-optional { position: relative; } .input-optional > .form-control { padding-right: 80px; overflow: hidden; text-overflow: ellipsis; } .input-optional > small { position: absolute; right: 10px; top: 14px; font-weight: normal; font-size: 10px; font-size: 1rem; } .input-label { position: relative; } .input-label > .form-control { padding-left: 30px; } .input-label > small { position: absolute; left: 10px; top: 11px; font-weight: normal; font-size: 14px; font-size: 1.4rem; } .input-icon { position: relative; } .input-icon .form-control { padding-left: 40px; } .input-icon > [class^="icon-"] { position: absolute; left: 0; top: 50%; margin-top: -18px; z-index: 2; } .input-icon.right > .form-control { padding-left: 0; padding-right: 40px; } .input-icon.right > [class^="icon-"] { right: 0; left: auto; } .input-icon.right > [class^="icon-small-"] { margin-top: -9px; margin-right: 10px; } .input-icon.no-padding > .form-control { padding-right: 0; padding-left: 0; } .control-field { position: relative; } .control-field .btn-rule-check { position: absolute; top: 4px; right: 20px; } .control-field .isvalid { position: absolute; top: 50%; margin-top: -13px; right: 20px; display: none; } .control-field .valid ~ .isvalid { display: block; } .control-field .btn-visible ~ .isvalid { display: none; } .control-field .row.sticky .col-66 { position: relative; } .control-field .row.sticky .col-66 .isvalid { right: 10px; } .control-field label.error { overflow: hidden; text-transform: none; padding: 4px 0; color: #e9573f; text-align: left; display: block; position: absolute; left: 0; font-weight: normal; font-size: 12px; font-size: 1.2rem; } .control-field.col-66 label.error { left: 15px; } .checkbox { position: relative; cursor: pointer; } .checkbox > [type=checkbox] { width: 0; height: 0; margin: 0; position: absolute; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; } .checkbox > span { display: block; padding-left: 24px; margin-top: 2px; font-size: 14px; font-size: 1.4rem; } .checkbox > span:before { content: ""; display: block; position: absolute; left: 0; top: 50%; margin-top: -14px; } .checkbox.large > [type=checkbox]:checked ~ span { color: #6ac6d9; } .checkbox.large > span { padding-left: 40px; padding-top: 6px; font-size: 17px; font-size: 1.7rem; } .btn { display: inline-block; border: 1px solid transparent; padding: 14px 24px; height: 40px; cursor: pointer; text-align: center; font-weight: 300; font-size: 13px; font-size: 1.3rem; } .btn:disabled { pointer-events: none; cursor: not-allowed; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50); opacity: 0.5; } .btn-block { display: block; width: 100%; } .btn-large { padding: 14px 36px; height: 50px; font-size: 18px; font-size: 1.8rem; } .btn-medium { padding-top: 12px; padding-right: 40px; padding-left: 40px; font-size: 15px; font-size: 1.5rem; } .btn-small { height: 34px; padding: 11px 24px; } .btn-mini { height: 24px; padding: 4px 10px; } .btn-icon { background: transparent; vertical-align: middle; padding: 0 8px; } .btn-icon-only { padding: 0 12px; line-height: 40px; } .btn-plain, .btn-plain:visited { background: white; border: 1px solid #b5b5b5; color: #434343; } .btn-plain:hover, .btn-plain:visited:hover { background: #eaeaea; } .btn-plain-danger, .btn-plain-danger:visited { background: white; border: 1px solid #e9573f; color: #e9573f; } .btn-plain-danger:hover, .btn-plain-danger:visited:hover { background: #e9573f; color: white; } .btn-link, .btn-link:visited { background: transparent; border: none; color: #6ac6d9; } .btn-link:hover, .btn-link:visited:hover { background: transparent; color: #434343; text-decoration: underline; } .btn-with-icon > [class^="icon-"], .btn-with-icon > [class*="icon-"], .btn-with-icon > img { vertical-align: middle; display: inline-block; } .btn-group > .btn { float: left; display: inline-block; vertical-align: middle; } .btn-group > .btn + .btn { margin-left: 8px; } .btn-group.tight { margin-top: -4px; } .btn-group.tight > .btn, .btn-group.tight > .btn:visited { padding: 5px; height: auto; line-height: normal; background: rgba(181, 181, 181, 0.25); } .btn-group.tight > .btn:hover, .btn-group.tight > .btn.active, .btn-group.tight > .btn:visited:hover, .btn-group.tight > .btn:visited.active { background: #6ac6d9; } .btn-group.tight > .btn + .btn, .btn-group.tight > .btn:visited + .btn { margin-left: 0; } .btn-group.inline-block { display: inline-block; } .btn-no-padding, .btn-no-padding:visited { padding: 0; } .btn-long { margin-left: auto; margin-right: auto; width: 75%; text-align: center; } .thumbnail { display: inline-block; line-height: 0; border: 1px solid #b5b5b5; padding: 0 4px; text-align: center; position: relative; } .thumbnail .status { position: absolute; bottom: -6px; right: -6px; } .thumbnail .status.status-flag { width: auto; height: auto; } .thumbnail .status.status-flag > i { border: 1px solid #b5b5b5; } .thumbnail img { display: block; } .link-image { display: inline-block; line-height: 1; } .link-block, .link-block:visited { display: block; width: 100%; padding: 10px; color: #434343; } .link-large { padding: 20px 30px; font-size: 17px; font-size: 1.7rem; } .list-inline > li { float: left; display: inline-block; } .list-inline > li + li { margin-left: 20px; } .list-inline.bar > li + li { margin-left: 0; } .list-inline.bar > li + li:before { content: "|"; display: inline-block; margin: 0 15px; } .list-border > li { padding-top: 15px; padding-bottom: 15px; } .list-border > li + li { padding-left: 40px; border-left: 2px solid #6ac6d9; } .list-group > li { display: block; } .list-group > li + li { border-top: 1px solid #e8e8e8; } .list-group > li .list-sub-group-alt { padding-right: 36px; } .list-group > li .list-sub-group-alt > li { padding: 10px 0; } .list-sub-inner { border-top: 1px solid #e8e8e8; } .list-sub-inner > li { padding: 20px; line-height: 1.6; } .list-sub-inner > li + li { border-top: 1px solid #e8e8e8; } .list-toolbar > li { float: left; position: relative; } .list-toolbar > li + li { margin-left: 40px; } .list-toolbar > li + li:before { content: ""; display: inline-block; width: 1px; height: 24px; background: darkgray; position: absolute; right: 100%; margin-right: 20px; top: 50%; margin-top: -12px; } .list-regular > li { display: block; } .list-regular > li + li { margin-top: 10px; } .btn-primary, .btn-primary:visited { color: white; } .border-all { border-style: solid; border-width: 1px; } .border-bottom { border-bottom-style: solid; border-bottom-width: 1px; } .border-top { border-top-style: solid; border-top-width: 1px; } .border-left { border-left-style: solid; border-left-width: 1px; } .border-right { border-right-style: solid; border-right-width: 1px; } .spaced { margin-top: 25px; margin-bottom: 25px; } .spaced.double { margin-top: 50px; margin-bottom: 50px; } .spaced.mini { margin-top: 10px; margin-bottom: 10px; } .spaced.mega { margin-top: 100px; margin-bottom: 100px; } .spaced.huge { margin-top: 200px; margin-bottom: 200px; } .spaced.top { margin-bottom: 0; } .spaced.bottom { margin-top: 0; } .spaced-top { margin-top: 25px; } .spaced-bottom { margin-bottom: 25px; } .spaced-bottom.mega { margin-bottom: 100px; } .unspaced { margin: 0; } .subhead { font-weight: 300; font-style: italic; color: #b5b5b5; text-transform: uppercase; font-size: 18px; font-size: 1.8rem; } .panel { background: white; } .panel > .panel-head { padding: 24px 40px; background: #6ac6d9; color: white; font-weight: 300; } .panel > .panel-head .lead { line-height: 1.6; font-size: 17px; font-size: 1.7rem; } .panel > .panel-body { padding: 40px; } .panel > .panel-body.alt { padding-top: 20px; } .panel > .panel-body > .panel-body-intro h4 { text-transform: uppercase; font-size: 19px; font-size: 1.9rem; } .panel > .panel-body > .panel-body-intro .btn.pull-right { margin-top: -8px; } .panel.clean > .panel-head { background: white; padding: 40px 40px 0; color: #434343; } .panel.clean > .panel-head .btn.pull-right { margin-top: -8px; } .panel.panel-secondary > .panel-head { background: #edfcff; border: 1px solid rgba(181, 181, 181, 0.5); color: #434343; padding: 12px 40px; } .panel.panel-secondary > .panel-head .btn-group.pull-right { margin-right: -28px; } .panel.panel-secondary > .panel-head .nav-tabs-secondary { margin-left: -28px; } .panel.panel-secondary > .panel-head h4 { display: inline-block; margin-bottom: 0; } .panel.panel-secondary > .panel-head h4.pull-left { margin-top: 10px; } .panel.panel-secondary > .panel-body { background: white; border: 1px solid rgba(181, 181, 181, 0.5); margin-top: -1px; } .panel.panel-collapse > .panel-head { background: #edfcff; color: #434343; padding: 0; } .panel.panel-collapse > .panel-head h4 { padding: 15px 30px; margin: 0; width: 65%; font-size: 19px; font-size: 1.9rem; } .panel.panel-collapse > .panel-head h4 span { vertical-align: middle; } .panel.panel-collapse > .panel-head .panel-tools { margin-right: 10px; margin-top: 8px; } .panel.panel-collapse > .panel-body { padding: 0; } .panel h4 { font-weight: 500; margin-bottom: 10px; font-size: 17px; font-size: 1.7rem; } .panel-tools .tool-item { display: inline-block; vertical-align: middle; } .panel-tools .tool-item + .tool-item { margin-left: 20px; } .middle { margin-top: 10px; } .middle-align, .media-body.middle-align { vertical-align: middle; } .nav-primary > li.active > a, .nav-primary > li.active > a:visited, .nav-primary > li:hover > a, .nav-primary > li:hover > a:visited { background: #6ac6d9; border-left: 6px solid #a7dde9; filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; } .nav-primary > li.active > a:after, .nav-primary > li.active > a:visited:after, .nav-primary > li:hover > a:after, .nav-primary > li:hover > a:visited:after { border-left: 30px solid #6ac6d9; } .nav-primary > li > a[aria-expanded=true] { background: #6ac6d9; border-left: 6px solid #a7dde9; filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; } .nav-primary > li > a[aria-expanded=true]:after { border-left: 30px solid #6ac6d9; } .nav-primary > li + li { margin-top: 4px; } .nav-primary > li > a, .nav-primary > li > a:visited { color: white; display: block; padding: 24px; display: block; position: relative; height: 100px; border-left: 6px solid transparent; font-weight: 300; font-size: 13px; font-size: 1.3rem; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50); opacity: 0.5; -moz-transition: opacity 0.3s ease; -o-transition: opacity 0.3s ease; -webkit-transition: opacity 0.3s ease; transition: opacity 0.3s ease; } .nav-primary > li > a:after, .nav-primary > li > a:visited:after { content: ""; display: block; width: 0; height: 0; border-top: 50px solid transparent; border-bottom: 50px solid transparent; position: absolute; margin-right: -30px; left: 100%; top: 0; } .nav-primary > li > a > span, .nav-primary > li > a:visited > span { margin-top: 8px; } .nav-primary > li > .dropdown-menu > li { background: #edfcff; text-align: left; } .nav-primary > li > .dropdown-menu > li > a, .nav-primary > li > .dropdown-menu > li > a:visited { display: block; padding: 24px; } .nav-primary > li > .dropdown-menu > li:hover > a, .nav-primary > li > .dropdown-menu > li:hover > a:visited, .nav-primary > li > .dropdown-menu > li.active > a, .nav-primary > li > .dropdown-menu > li.active > a:visited { background: #def9ff; } .nav-user > li { font-size: 14px; font-size: 1.4rem; } .nav-progress { overflow: hidden; display: inline-block; } .nav-progress > li { color: #b5b5b5; position: relative; padding-top: 20px; text-align: center; float: left; font-size: 14px; font-size: 1.4rem; } .nav-progress > li:after { content: ""; display: block; width: 12px; height: 12px; border: 1px solid #6ac6d9; position: absolute; left: 50%; margin-left: -6px; top: 0; background: white; -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%; } .nav-progress > li.active { color: #6ac6d9; } .nav-progress > li.active:after { background: #6ac6d9; } .nav-progress > li + li { margin-left: 40px; } .nav-progress > li + li:before { content: ""; display: block; width: 100%; height: 1px; background: #6ac6d9; position: absolute; right: 50%; top: 6px; padding-left: 42px; -moz-box-sizing: padding-box; -webkit-box-sizing: padding-box; box-sizing: padding-box; } .nav-tabs { width: 100%; display: table; table-layout: fixed; } .nav-tabs > li { background: rgba(237, 252, 255, 0.25); display: table-cell; vertical-align: middle; float: none; font-size: 17px; font-size: 1.7rem; } .nav-tabs > li.active { background: white; } .nav-tabs > li.active > a, .nav-tabs > li.active > a:visited { color: #6ac6d9; } .nav-tabs > li:hover > a, .nav-tabs > li:hover > a:visited { color: #6ac6d9; } .nav-tabs > li > a, .nav-tabs > li > a:visited { color: white; display: block; padding: 20px; } .nav-inline-tabs > li { display: inline-block; float: left; font-weight: 300; color: darkgray; font-size: 20px; font-size: 2rem; } .nav-inline-tabs > li > a, .nav-inline-tabs > li > a:visited { color: darkgray; text-transform: uppercase; } .nav-inline-tabs > li:hover > a, .nav-inline-tabs > li:hover > a:visited, .nav-inline-tabs > li.active > a, .nav-inline-tabs > li.active > a:visited { color: #6ac6d9; } .nav-inline-tabs > li + li:before { content: "|"; display: inline-block; margin: 0 40px; } .nav-inline-tabs > li.active { font-weight: 500; } .nav-inline-tabs.alt > li { font-weight: 500; font-size: 17px; font-size: 1.7rem; } .nav-inline-tabs.alt > li + li:before { margin: 0 20px; } .nav-inline-tabs.alt > li.active > a, .nav-inline-tabs.alt > li.active > a:visited { color: #434343; } .nav-tabs-secondary > li { display: inline-block; float: left; font-weight: 300; color: #434343; border: 1px solid rgba(181, 181, 181, 0.5); } .nav-tabs-secondary > li + li { margin-left: -1px; } .nav-tabs-secondary > li > a, .nav-tabs-secondary > li > a:visited { display: block; padding: 12px 24px; color: #434343; font-size: 17px; font-size: 1.7rem; } .nav-tabs-secondary > li:hover > a, .nav-tabs-secondary > li:hover > a:visited, .nav-tabs-secondary > li.active > a, .nav-tabs-secondary > li.active > a:visited { color: white; background: #6ac6d9; } .contain-nav-inline > .nav-inline-tabs { display: inline-block; } .widget-date, .month-year, .widget-total, .total-text { overflow: hidden; text-transform: uppercase; line-height: 1.4; font-size: 11px; font-size: 1.1rem; } .widget-date > .date, .widget-total > .total-num { float: left; padding-right: 10px; line-height: 1; margin-top: -2px; font-size: 36px; font-size: 3.6rem; } .widget-date.align-bottom > .month-year { margin-top: 15px; } .widget-date.alt .month-year { text-transform: none; } .widget-date.alt > .date { width: 75px; text-align: right; margin-top: 0; font-size: 24px; font-size: 2.4rem; } .widget-date.alt + .widget-date.alt { margin-top: 10px; } .month-year, .total-text { font-weight: normal; } .contain-label-number { -moz-column-count: 3; -webkit-column-count: 3; column-count: 3; -moz-column-gap: 3px; -webkit-column-gap: 3px; column-gap: 3px; } .label-number { letter-spacing: -2px; margin-bottom: 3px; } .status { width: 16px; height: 16px; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; } .status.alt { display: inline-block; } .shy { padding: 15px 30px; } .item-bar { overflow: hidden; } .item-bar > .bar-item { display: inline-block; float: left; } .item-bar > .bar-item + .bar-item { margin-left: 40px; } .row-chart { margin: 0 auto; width: 80%; height: 170px; } .chart { width: 100%; height: 265px; } .chart.chart-column { height: 350px; } .chart.chart-small { height: 150px; } .chart.chart-small .canvasjs-chart-canvas { max-width: 100%; height: auto; position: relative !important; } .chart.chart-small .canvasjs-chart-container { text-align: center !important; overflow: hidden; max-height: 150px; } .chart > img { max-width: 100%; } .module { padding: 20px; } .module.large { padding: 40px; } .module.horizontal { padding-bottom: 0; padding-top: 0; } .contain-isoline { display: inline-block; } .contain-isoline > .col-auto { max-width: 28%; float: none; display: inline-block; vertical-align: top; text-align: left; padding-left: 30px; padding-right: 30px; } .contain-isoline > .col-auto:first-child { padding-left: 0; } .contain-isoline > .col-auto:last-child { padding-right: 0; } .contain-isoline > .col-auto.isoline:before { margin-left: -6px; } .isoline { position: relative; } .isoline:before { content: ""; display: block; width: 1px; height: 100%; background: #eaeaea; position: absolute; top: 50%; margin-top: -50%; left: 1px; z-index: 2; } .isoline.alt:before { margin-top: -35%; } .isoline.equal:before { top: 0; bottom: 0; margin-top: 0; min-height: 94px; } .widget-meta { display: table; } .widget-meta > .meta-row { display: table-row; } .widget-meta > .meta-row > .meta-item { display: table-cell; } .widget-meta > .meta-row > .meta-item:first-child { padding-right: 10px; } .select-head .chosen-container { margin-top: -10px; } .counter { display: inline-block; margin-left: 10px; } .pop-notification { display: block; } .pop-content-main { text-align: center; color: #5d5d5d; } .pop-content-main.text-left { text-align: left; } .pop-content-main > p { line-height: 1.4; font-size: 16px; font-size: 1.6rem; } .pop-content-main > p.lead { font-size: 22px; font-size: 2.2rem; } .pop-content-main .list-regular { margin-top: 4px; } .currency { font-size: 36px; font-size: 3.6rem; } .currency > .sup { display: inline-block; vertical-align: top; font-size: 22px; font-size: 2.2rem; } .reveal-on-hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .tablesorter-header { position: relative; } .tablesorter-header:focus { outline: none; } .tablesorter-header.tablesorter-headerAsc .tablesorter-header-inner:after { display: block; margin-top: -3px; } .tablesorter-header.tablesorter-headerDesc .tablesorter-header-inner:before { display: block; margin-top: -3px; } .tablesorter-header.tablesorter-headerUnSorted .tablesorter-header-inner:before, .tablesorter-header.tablesorter-headerUnSorted .tablesorter-header-inner:after { display: block; } .tablesorter-header.tablesorter-headerUnSorted.sorter-false .tablesorter-header-inner:before, .tablesorter-header.tablesorter-headerUnSorted.sorter-false .tablesorter-header-inner:after { display: none; } .tablesorter-header-inner { cursor: pointer; display: inline-block; position: relative; } .tablesorter-header-inner:after, .tablesorter-header-inner:before { content: ""; display: none; width: 0; height: 0; border-right: 5px solid transparent; border-left: 5px solid transparent; left: 100%; top: 50%; margin-left: 10px; position: absolute; } .tablesorter-header-inner:after { margin-top: -7px; border-bottom: 5px solid #6ac6d9; } .tablesorter-header-inner:before { margin-top: 1px; border-top: 5px solid #6ac6d9; } .node circle { cursor: pointer; fill: #fff; stroke: steelblue; stroke-width: 1.5px; } .node text { font-size: 11px; } path.link { fill: none; stroke: #ccc; stroke-width: 1.5px; } .active .trigger-views { pointer-events: none; } .ui-timepicker-wrapper { overflow-y: auto; height: 150px; width: 137px; text-align: center; background: white; border: 1px solid #edfcff; -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); outline: none; z-index: 10001; margin: 0; } .ui-timepicker-wrapper.ui-timepicker-with-duration { width: 13em; } .ui-timepicker-wrapper.ui-timepicker-with-duration.ui-timepicker-step-30, .ui-timepicker-wrapper.ui-timepicker-with-duration.ui-timepicker-step-60 { width: 11em; } .ui-timepicker-list { margin: 0; padding: 0; list-style: none; } .ui-timepicker-duration { margin-left: 5px; color: #70757a; } .ui-timepicker-list:hover .ui-timepicker-duration { color: #70757a; } .ui-timepicker-list li { padding: 10px; cursor: pointer; white-space: nowrap; color: #434343; list-style: none; margin: 0; } .ui-timepicker-list:hover .ui-timepicker-selected { background: white; color: #434343; } li.ui-timepicker-selected { background: #1980EC; color: white; } .ui-timepicker-list li:hover, .ui-timepicker-list .ui-timepicker-selected:hover { background: #1980EC; color: white; } li.ui-timepicker-selected .ui-timepicker-duration { color: #b5b5b5; } .ui-timepicker-list li:hover .ui-timepicker-duration { color: #b5b5b5; } .ui-timepicker-list li.ui-timepicker-disabled { color: #70757a; cursor: default; } .ui-timepicker-list li.ui-timepicker-disabled:hover { color: #70757a; cursor: default; } .ui-timepicker-list li.ui-timepicker-selected.ui-timepicker-disabled { color: #70757a; cursor: default; } .ui-timepicker-list li.ui-timepicker-disabled:hover, .ui-timepicker-list li.ui-timepicker-selected.ui-timepicker-disabled { background: #f2f2f2; } .all-routes { background-image: url(images/bg-map.png); background-repeat: no-repeat; background-position: center top; -moz-background-size: 100% auto; -o-background-size: 100% auto; -webkit-background-size: 100% auto; background-size: 100% auto; } .route-plus, .route-equal { position: relative; } .route-plus:before, .route-equal:before { content: ""; position: absolute; top: 50%; margin-top: -8px; right: 100%; } .route-bank-labels { display: table; width: 40px; height: 100%; position: absolute; left: 100%; top: 0; margin-left: -20px; margin-top: -20px; z-index: 3; } .route-bank-labels.end { left: 0; } .route-bank-labels.single { margin-top: 0; } .route-bank-labels.single .labels { vertical-align: middle; } .route-bank-labels .labels { display: table-cell; width: 100%; height: 100%; text-align: center; } .route-bank-labels .labels .label + .label { margin-top: 4px; } .route-bank-item { position: relative; } .bank-item, .bank-item-outer { border-width: 3px; border-style: solid; background: white; width: 136px; margin: 0 auto; padding: 6px 0; height: 84px; position: relative; text-align: center; margin-bottom: 40px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } .bank-item img, .bank-item-outer img { max-width: 100%; height: auto; } .bank-item:before, .bank-item:after, .bank-item-outer:before, .bank-item-outer:after { content: ""; display: block; width: 0; height: 0; position: absolute; top: -10px; border-left: 67px solid transparent; border-right: 67px solid transparent; border-bottom-width: 10px; border-bottom-style: solid; margin-left: -2px; } .bank-item:before, .bank-item-outer:before { border-bottom-color: white; z-index: 2; } .bank-item:after, .bank-item-outer:after { margin-top: -2px; } .bank-item.border-bank-inactive, .bank-item-outer.border-bank-inactive { border-width: 1px; border-color: #b5b5b5; } .bank-item.border-bank-inactive:before, .bank-item.border-bank-inactive:after, .bank-item-outer.border-bank-inactive:before, .bank-item-outer.border-bank-inactive:after { margin-left: 1px; border-left: 66px solid transparent; border-right: 66px solid transparent; } .bank-item.border-bank-inactive:after, .bank-item-outer.border-bank-inactive:after { margin-top: -1px; } .bank-item { position: relative; z-index: 3; } .bank-item-outer { border-color: red; background-color: transparent; width: 144px; height: 92px; position: absolute; top: 0; left: 50%; margin-left: -72px; margin-top: -5px; } .bank-item-outer:before, .bank-item-outer:after { border-left: 70px solid transparent; border-right: 70px solid transparent; border-bottom-width: 12px; top: -11px; } .bank-item-outer:after { border-bottom-color: red; margin-top: -4px; } .label { display: inline-block; width: 16px; height: 16px; color: white; text-align: center; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; } .label.inactive { background: #b5b5b5; width: 24px; height: 24px; line-height: 24px; font-size: 17px; font-size: 1.7rem; } .label.active { width: 36px; height: 36px; line-height: 36px; font-size: 24px; font-size: 2.4rem; } .filter-wrapper { margin-left: -20px; margin-right: -20px; margin-top: -20px; } .filter-item { display: inline-block; float: left; padding: 8px; position: relative; margin-bottom: 40px; background: #c9f6ff; border: 1px solid #c9f6ff; color: #000; font-size: 13px; font-size: 1.3rem; } .filter-item + .filter-item { margin-left: 20px; } .filter-item:hover { background: white; border: 1px dashed rgba(181, 181, 181, 0.5); } .filter-item > .filter-remove { position: absolute; top: 0; right: 0; margin-top: -8px; margin-right: -8px; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); opacity: 0.7; } .filter-item > .filter-remove:hover { filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; } .filter-item .chosen-container-multi { width: auto !important; } .filter-item .chosen-container-multi .chosen-drop { margin-top: 7px; min-width: 200px; } .filter-item .chosen-container-multi .chosen-choices { background: none; max-width: 400px; } .filter-item .chosen-container-multi .chosen-choices li { margin-right: 4px; } .filter-item .chosen-container-multi .chosen-choices li + li { margin-left: 0; } .filter-item .chosen-container-multi .chosen-choices li.search-choice { height: 16px; line-height: 16px; } .filter-item .chosen-container-multi .chosen-choices li.search-field:first-child > input, .filter-item .chosen-container-multi .chosen-choices li.search-field:first-child > input:focus, .filter-item .chosen-container-multi .chosen-choices li.search-field > input, .filter-item .chosen-container-multi .chosen-choices li.search-field > input:focus { min-width: 0; background-color: transparent; color: transparent; } .filter-item .chosen-container-multi .chosen-choices li.search-field:first-child > input:-moz-placeholder, .filter-item .chosen-container-multi .chosen-choices li.search-field:first-child > input:focus:-moz-placeholder, .filter-item .chosen-container-multi .chosen-choices li.search-field > input:-moz-placeholder, .filter-item .chosen-container-multi .chosen-choices li.search-field > input:focus:-moz-placeholder { color: transparent; } .filter-item .chosen-container-multi .chosen-choices li.search-field:first-child > input::-moz-placeholder, .filter-item .chosen-container-multi .chosen-choices li.search-field:first-child > input:focus::-moz-placeholder, .filter-item .chosen-container-multi .chosen-choices li.search-field > input::-moz-placeholder, .filter-item .chosen-container-multi .chosen-choices li.search-field > input:focus::-moz-placeholder { color: transparent; } .filter-item .chosen-container-multi .chosen-choices li.search-field:first-child > input:-ms-input-placeholder, .filter-item .chosen-container-multi .chosen-choices li.search-field:first-child > input:focus:-ms-input-placeholder, .filter-item .chosen-container-multi .chosen-choices li.search-field > input:-ms-input-placeholder, .filter-item .chosen-container-multi .chosen-choices li.search-field > input:focus:-ms-input-placeholder { color: transparent; } .filter-item .chosen-container-multi .chosen-choices li.search-field:first-child > input::-webkit-input-placeholder, .filter-item .chosen-container-multi .chosen-choices li.search-field:first-child > input:focus::-webkit-input-placeholder, .filter-item .chosen-container-multi .chosen-choices li.search-field > input::-webkit-input-placeholder, .filter-item .chosen-container-multi .chosen-choices li.search-field > input:focus::-webkit-input-placeholder { color: transparent; } .filter-item .chosen-container-multi .chosen-choices li.search-field:first-child > input:focus, .filter-item .chosen-container-multi .chosen-choices li.search-field > input:focus { color: #000; } .filter-item .chosen-container-multi .chosen-choices li.search-field { background-color: transparent; } .filter-item .chosen-container-multi .chosen-choices li.search-field > input, .filter-item .chosen-container-multi .chosen-choices li.search-field > input:focus { height: 16px; } .filter-item .chosen-container-multi .chosen-choices:after, .filter-item .chosen-container-multi .chosen-container-single .chosen-single div:after, .filter-item .chosen-container-multi .chosen-container-single .chosen-single:visited div:after { display: none; } .filter-item .chosen-container-multi .chosen-results { border: 1px solid rgba(181, 181, 181, 0.5); } .filter-item .chosen-container-multi .chosen-results li.group-option, .filter-item .chosen-container-multi .chosen-results li.group-option.result-selected { padding-left: 20px; line-height: 1.6; } .filter-item .chosen-container-multi .chosen-results li.group-option:before, .filter-item .chosen-container-multi .chosen-results li.group-option.result-selected:before { display: none; } .filter-routes .filter-item-label { display: inline-block; margin-right: 10px; margin-top: 1px; vertical-align: top; } .filter-item-input, .filter-item-input:focus { outline: none; background: transparent; border: none; width: 0; min-width: 30px; height: 16px; font-size: 13px; font-size: 1.3rem; } .notifications { position: fixed; top: 50px; right: 50px; z-index: 100; } .notifications:empty { z-index: -1; } .notifications > .notification { display: table; } .notifications > .notification > .notification-item { display: table-cell; width: 360px; padding: 30px; vertical-align: middle; color: white; line-height: 1.4; } .notifications > .notification > .notification-item.error { background: rgba(233, 87, 63, 0.75); } .notifications > .notification > .notification-item.success { background: rgba(152, 213, 64, 0.75); } .notifications > .notification > .notification-item.info { background: rgba(67, 67, 67, 0.75); } .notifications > .notification > .notification-item .lead { line-height: 1.4; font-size: 22px; font-size: 2.2rem; } .notifications > .notification > .notification-item [class^="icon-small"] { margin-top: 2px; } @media only screen and (max-width: 1024px) { html .form-insert .col-50 .input-icon .form-control { text-align: left; padding-left: 10px; } html td .list-toolbar li + li { margin-left: 20px; } html td .list-toolbar li + li:before { margin-right: 10px; } html .btn-small, html .btn-small:visited { padding: 11px 0; } } .badge { background: white; color: #6ac6d9; display: inline-block; text-align: center; width: 16px; height: 16px; line-height: 16px; font-weight: bold; vertical-align: middle; margin-left: 4px; margin-top: -2px; -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%; font-size: 11px; font-size: 1.1rem; } .badge.badge-primary { background: #6ac6d9; color: white; width: 24px; height: 24px; line-height: 24px; font-size: 13px; font-size: 1.3rem; } .form-tools > .form-tool-item + .form-tool-item { margin-left: 20px; } .form-tools > .form-tool-item.btn { margin-top: -6px; } .inner-item h4 { font-size: 19px; font-size: 1.9rem; } .custom-file { position: relative; } .custom-file > [type=file] { position: absolute; z-index: 4; top: 0; height: 40px; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; } .custom-file > .btn { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; max-width: 100%; } .response { position: relative; padding: 10px; } .response.success { background: rgba(152, 213, 64, 0.35); } .response .close-response { position: absolute; right: 10px; top: 50%; margin-top: -8px; } @-webkit-keyframes uil-reload-css { 0% { -ms-transform: rotate(0deg); -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } 50% { -ms-transform: rotate(180deg); -moz-transform: rotate(180deg); -webkit-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } 100% { -ms-transform: rotate(360deg); -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } @-moz-keyframes uil-reload-css { 0% { -ms-transform: rotate(0deg); -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } 50% { -ms-transform: rotate(180deg); -moz-transform: rotate(180deg); -webkit-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } 100% { -ms-transform: rotate(360deg); -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } @-ms-keyframes uil-reload-css { 0% { -ms-transform: rotate(0deg); -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } 50% { -ms-transform: rotate(180deg); -moz-transform: rotate(180deg); -webkit-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } 100% { -ms-transform: rotate(360deg); -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes uil-reload-css { 0% { -ms-transform: rotate(0deg); -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } 50% { -ms-transform: rotate(180deg); -moz-transform: rotate(180deg); -webkit-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } 100% { -ms-transform: rotate(360deg); -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } .circle-loader { position: relative; width: 80px; height: 80px; display: inline-block; } .circle-loader > div { -ms-animation: uil-reload-css 1s linear infinite; -moz-animation: uil-reload-css 1s linear infinite; -webkit-animation: uil-reload-css 1s linear infinite; -o-animation: uil-reload-css 1s linear infinite; animation: uil-reload-css 1s linear infinite; display: block; position: absolute; top: 5px; left: 5px; width: 70px; height: 70px; border-radius: 100%; border: 5px solid #6ac6d9; border-top: 5px solid transparent; border-right: 5px solid #6ac6d9; border-bottom: 5px solid #6ac6d9; } div.wrap-loading { display: table; width: 100%; height: 100%; position: absolute; top: 0; left: 0; } div.wrap-loading.in { display: table; } div.wrap-loading .contain-loading { display: table-cell; width: 100%; height: 100%; vertical-align: middle; text-align: center; z-index: 2; } .plus-minus [data-toggle=collapse] { position: relative; padding-left: 36px; cursor: pointer; } .plus-minus [data-toggle=collapse]:before { content: ""; position: absolute; left: 15px; top: 24px; } .plus-minus [data-toggle=collapse].sub-toggle:before { top: 28px; } .lh-medium { line-height: 1.6; } .all-inline { display: inline-block; } .all-inline > .inline-item { display: inline-block; vertical-align: middle; margin: 0 10px; } .head-absolute { position: absolute; width: 100%; top: 0; left: 0; padding-top: 60px; } .clamp-it { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; max-height: 100px; overflow: hidden; text-overflow: ellipsis; } [data-toggle=add-field] { display: inline-block; padding-top: 10px; } .dynamic-field { display: none; } .dynamic-field-item + .dynamic-field-item { margin-top: 10px; } tr.collapsing { -moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none; } .chosen-container { position: relative; display: inline-block; vertical-align: middle; min-width: 70px; zoom: 1; *display: inline; -webkit-user-select: none; -moz-user-select: none; user-select: none; height: 34px; text-align: left; } .chosen-container .chosen-drop { position: absolute; top: 100%; left: -9999px; z-index: 1012; width: 100%; border: none; background: transparent; box-shadow: none; margin-top: -1px; } .chosen-container.chosen-with-drop .chosen-drop { left: 0; } .chosen-container a { cursor: pointer; } .chosen-container-multi .chosen-results > li, .chosen-container-multi .chosen-results > li.active-result { display: block; padding-left: 40px; position: relative; } .chosen-container-multi .chosen-results > li:before, .chosen-container-multi .chosen-results > li.active-result:before { content: ""; position: absolute; left: 8px; top: 50%; margin-top: -14px; } .chosen-container-multi .chosen-results > li.result-selected { display: block; padding-left: 40px; color: #b5b5b5; } .chosen-container-multi .chosen-choices { overflow: hidden; position: relative; display: block; padding-left: 10px; height: 100%; text-decoration: none; white-space: nowrap; color: #b5b5b5; font-size: 13px; font-size: 1.3rem; background: bottom left url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==') no-repeat, bottom center url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==') repeat-x, bottom right url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==') no-repeat !important; background: bottom left -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #6ac6d9), color-stop(100%, #6ac6d9)) no-repeat, bottom center -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #6ac6d9), color-stop(100%, #6ac6d9)) repeat-x, bottom right -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #6ac6d9), color-stop(100%, #6ac6d9)) no-repeat !important; background: bottom left -moz-linear-gradient(#6ac6d9, #6ac6d9) no-repeat, bottom center -moz-linear-gradient(#6ac6d9, #6ac6d9) repeat-x, bottom right -moz-linear-gradient(#6ac6d9, #6ac6d9) no-repeat !important; background: bottom left -webkit-linear-gradient(#6ac6d9, #6ac6d9) no-repeat, bottom center -webkit-linear-gradient(#6ac6d9, #6ac6d9) repeat-x, bottom right -webkit-linear-gradient(#6ac6d9, #6ac6d9) no-repeat !important; background: bottom left linear-gradient(#6ac6d9, #6ac6d9) no-repeat, bottom center linear-gradient(#6ac6d9, #6ac6d9) repeat-x, bottom right linear-gradient(#6ac6d9, #6ac6d9) no-repeat !important; -moz-background-size: 1px 8px, 1px 1px, 1px 8px !important; -o-background-size: 1px 8px, 1px 1px, 1px 8px !important; -webkit-background-size: 1px 8px, 1px 1px, 1px 8px !important; background-size: 1px 8px, 1px 1px, 1px 8px !important; } .chosen-container-multi .chosen-choices:after { content: ""; position: absolute; right: 10px; top: 50%; margin-top: -3px; } .chosen-container-multi .chosen-choices li { display: inline-block; float: left; } .chosen-container-multi .chosen-choices li.search-choice { padding-right: 20px; height: 34px; line-height: 34px; position: relative; } .chosen-container-multi .chosen-choices li > .search-choice-close { position: absolute; top: 50%; margin-top: -6px; right: 3px; display: block; width: 12px; height: 12px; background-image: url("images/chosen-sprite.png"); background-position: -42px 1px; background-repeat: no-repeat; font-size: 1px; } .chosen-container-multi .chosen-choices li > .search-choice-close:hover { background-position: -42px -10px; } .chosen-container-multi .chosen-choices li + li { margin-left: 4px; } .chosen-container-multi .chosen-choices li.search-field > input, .chosen-container-multi .chosen-choices li.search-field > input:focus { border: none; outline: none; height: 34px; margin-bottom: 1px; color: #b5b5b5; font-size: 14px; font-size: 1.4rem; } .chosen-container-multi .chosen-choices li.search-field:first-child > input, .chosen-container-multi .chosen-choices li.search-field:first-child > input:focus { min-width: 150px; } .chosen-container-single .chosen-single, .chosen-container-single .chosen-single:visited { position: relative; display: block; overflow: hidden; padding-left: 10px; height: 100%; text-decoration: none; white-space: nowrap; color: #b5b5b5; font-size: 14px; font-size: 1.4rem; background: bottom left url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==') no-repeat, bottom center url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==') repeat-x, bottom right url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==') no-repeat !important; background: bottom left -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #6ac6d9), color-stop(100%, #6ac6d9)) no-repeat, bottom center -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #6ac6d9), color-stop(100%, #6ac6d9)) repeat-x, bottom right -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #6ac6d9), color-stop(100%, #6ac6d9)) no-repeat !important; background: bottom left -moz-linear-gradient(#6ac6d9, #6ac6d9) no-repeat, bottom center -moz-linear-gradient(#6ac6d9, #6ac6d9) repeat-x, bottom right -moz-linear-gradient(#6ac6d9, #6ac6d9) no-repeat !important; background: bottom left -webkit-linear-gradient(#6ac6d9, #6ac6d9) no-repeat, bottom center -webkit-linear-gradient(#6ac6d9, #6ac6d9) repeat-x, bottom right -webkit-linear-gradient(#6ac6d9, #6ac6d9) no-repeat !important; background: bottom left linear-gradient(#6ac6d9, #6ac6d9) no-repeat, bottom center linear-gradient(#6ac6d9, #6ac6d9) repeat-x, bottom right linear-gradient(#6ac6d9, #6ac6d9) no-repeat !important; -moz-background-size: 1px 8px, 1px 1px, 1px 8px !important; -o-background-size: 1px 8px, 1px 1px, 1px 8px !important; -webkit-background-size: 1px 8px, 1px 1px, 1px 8px !important; background-size: 1px 8px, 1px 1px, 1px 8px !important; } .chosen-container-single .chosen-single span, .chosen-container-single .chosen-single:visited span { display: inline-block; overflow: hidden; margin-right: 10px; height: 100%; line-height: 34px; text-overflow: ellipsis; white-space: nowrap; } .chosen-container-single .chosen-single div, .chosen-container-single .chosen-single:visited div { position: absolute; display: inline-block; width: 10px; right: 10px; height: 100%; } .chosen-container-single .chosen-single div:after, .chosen-container-single .chosen-single:visited div:after { content: ""; position: absolute; left: 0; top: 50%; margin-top: -4px; } .chosen-container-single .chosen-search { position: relative; z-index: 1010; margin: 0; padding: 3px 4px; margin-top: -33px; white-space: nowrap; } .chosen-container-single .chosen-search > input[type=text] { border: none; } .chosen-container-single input[type="text"] { margin: 1px 0; padding: 4px 20px 4px 5px; width: 100%; height: auto; outline: 0; } .chosen-container-single.chosen-container-single-nosearch .chosen-search { position: absolute; left: -9999px; } .chosen-container .chosen-results { position: relative; overflow-x: hidden; overflow-y: auto; max-height: 240px; min-width: 120px; -webkit-overflow-scrolling: touch; background: white; border: 1px solid #b5b5b5; border-top: none; margin-top: 1px; } .chosen-container .chosen-results li { display: none; margin: 0; padding: 12px 20px; list-style: none; -webkit-touch-callout: none; color: #434343; } .chosen-container .chosen-results li.group-result { display: list-item; cursor: default; font-style: italic; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); opacity: 0.7; } .chosen-container .chosen-results li.group-result:empty { display: none; } .chosen-container .chosen-results li.group-result:before, .chosen-container .chosen-results li.group-result:after { content: ""; display: block; background: #b5b5b5; position: absolute; top: 50%; height: 1px; margin-top: -1px; } .chosen-container .chosen-results li.group-result:before { width: 10px; left: 0; } .chosen-container .chosen-results li.group-result:after { width: 45%; right: 0; } .chosen-container .chosen-results li.active-result { display: list-item; cursor: pointer; } .chosen-container .chosen-results li.disabled-result { display: list-item; color: #ccc; cursor: default; } .chosen-container .chosen-results li.highlighted { background-color: #6ac6d9; color: white; } .chosen-container .chosen-results li.create-option { position: relative; padding-left: 40px; } .chosen-container .chosen-results li.create-option:before { position: absolute; left: 15px; top: 50%; margin-top: -8px; content: ""; } .chosen-container .chosen-results li.create-option.highlighted > a, .chosen-container .chosen-results li.create-option.highlighted > a:visited { color: white; } .chosen-disabled { opacity: 0.5 !important; cursor: default; } .chosen-disabled .chosen-single, .chosen-disabled .chosen-choices .search-choice .search-choice-close { cursor: default; } .tooltip { position: absolute; z-index: 1070; display: block; visibility: visible; font-size: 12px; font-weight: normal; line-height: 1.4; opacity: 0; filter: alpha(opacity=0); text-transform: none; } .tooltip.in { opacity: 1; filter: alpha(opacity=1); } .tooltip.top { margin-top: -3px; padding: 5px 0; } .tooltip.right { margin-left: 3px; padding: 0 5px; } .tooltip.bottom { margin-top: 3px; padding: 5px 0; } .tooltip.left { margin-left: -3px; padding: 0 5px; } .tooltip-inner { white-space: nowrap; text-align: center; padding: 4px 8px; color: white; text-decoration: none; background-color: #4D5765; border-radius: 4px; font-size: 12px; font-size: 1.2rem; } .tooltip-inner h3 { margin-bottom: 0; text-align: left; font-size: 17px; font-size: 1.7rem; } .tooltip-inner h3 { text-transform: uppercase; } .tooltip-arrow { position: absolute; width: 0; height: 0; border-color: transparent; border-style: solid; } .tooltip.top .tooltip-arrow { bottom: 0; left: 50%; margin-left: -5px; border-width: 5px 5px 0; border-top-color: #4D5765; } .tooltip.top-left .tooltip-arrow { bottom: 0; right: 5px; margin-bottom: -5px; border-width: 5px 5px 0; border-top-color: #4D5765; } .tooltip.top-right .tooltip-arrow { bottom: 0; left: 5px; margin-bottom: -5px; border-width: 5px 5px 0; border-top-color: #4D5765; } .tooltip.right .tooltip-arrow { top: 50%; left: 0; margin-top: -5px; border-width: 5px 5px 5px 0; border-right-color: #4D5765; } .tooltip.left .tooltip-arrow { right: 0; margin-right: -7px; margin-top: -14px; border-width: 14px 0 14px 14px; border-left-color: #4D5765; } .tooltip.bottom .tooltip-arrow { top: 0; left: 50%; margin-left: -5px; border-width: 0 5px 5px; border-bottom-color: #4D5765; } .tooltip.bottom-left .tooltip-arrow { top: 0; right: 5px; margin-top: -5px; border-width: 0 5px 5px; border-bottom-color: #4D5765; } .tooltip.bottom-right .tooltip-arrow { top: 0; left: 5px; margin-top: -5px; border-width: 0 5px 5px; border-bottom-color: #4D5765; } .collapse { display: none; visibility: hidden; } .collapse.in { display: block; visibility: visible; } .collapsing { position: relative; height: 0; overflow: hidden; -webkit-transition-timing-function: ease; -o-transition-timing-function: ease; transition-timing-function: ease; -webkit-transition-duration: 0.35s; -o-transition-duration: 0.35s; transition-duration: 0.35s; -webkit-transition-property: height, visibility; -o-transition-property: height, visibility; transition-property: height, visibility; } .media-right, .media > .pull-right { padding-left: 15px; } .media-left, .media > .pull-left { padding-right: 15px; } .media-left, .media-right, .media-body { display: table-cell; vertical-align: top; } .media-middle { vertical-align: middle; } .media-bottom { vertical-align: bottom; } .media.alt, .media.alt > .media-body { display: block; overflow: hidden; } .media.alt > .media-left, .media.alt > .media-right { display: block; } .media.alt > .media-left { float: left; } .media.alt > .media-right { float: right; } .media.full > .media-body, .media.full-wrap > .media-body, .media.full-container > .media-body { width: 10000px; } .popover { position: absolute; top: 0; left: 0; z-index: 1060; display: none; padding: 1px; font-size: 14px; font-weight: normal; line-height: 1.42857; text-align: left; white-space: normal; background-color: #fff; -webkit-background-clip: padding-box; background-clip: padding-box; border: 1px solid #ccc; border: 1px solid rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); } .popover.top { margin-top: -10px; } .popover.right { margin-left: 10px; } .popover.bottom { margin-top: 10px; } .popover.left { margin-left: -10px; } .popover-title { padding: 8px 14px; margin: 0; font-size: 14px; background-color: #f7f7f7; border-bottom: 1px solid #ebebeb; border-radius: 5px 5px 0 0; } .popover-content { padding: 9px 14px; } .popover > .arrow { position: absolute; display: block; width: 0; height: 0; border-color: transparent; border-style: solid; border-width: 11px; } .popover > .arrow:after { position: absolute; display: block; width: 0; height: 0; border-color: transparent; border-style: solid; content: ""; border-width: 10px; } .popover.top > .arrow { bottom: -11px; left: 50%; margin-left: -11px; border-top-color: #999; border-top-color: rgba(0, 0, 0, 0.25); border-bottom-width: 0; } .popover.top > .arrow:after { bottom: 1px; margin-left: -10px; content: " "; border-top-color: #fff; border-bottom-width: 0; } .popover.right > .arrow { top: 50%; left: -11px; margin-top: -11px; border-right-color: #999; border-right-color: rgba(0, 0, 0, 0.25); border-left-width: 0; } .popover.right > .arrow:after { bottom: -10px; left: 1px; content: " "; border-right-color: #fff; border-left-width: 0; } .popover.bottom > .arrow { top: -11px; left: 50%; margin-left: -11px; border-top-width: 0; border-bottom-color: #999; border-bottom-color: rgba(0, 0, 0, 0.25); } .popover.bottom > .arrow:after { top: 1px; margin-left: -10px; content: " "; border-top-width: 0; border-bottom-color: #fff; } .popover.left > .arrow { top: 50%; right: -11px; margin-top: -11px; border-right-width: 0; border-left-color: #999; border-left-color: rgba(0, 0, 0, 0.25); } .popover.left > .arrow:after { right: 1px; bottom: -10px; content: " "; border-right-width: 0; border-left-color: #fff; } .modal-open { overflow: hidden; } .modal { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1040; display: none; overflow: hidden; -webkit-overflow-scrolling: touch; outline: 0; } .modal.fade .modal-dialog { -webkit-transition: -webkit-transform 0.3s ease-out; -o-transition: -o-transform 0.3s ease-out; transition: transform 0.3s ease-out; -webkit-transform: translate(0, -25%); -ms-transform: translate(0, -25%); -o-transform: translate(0, -25%); transform: translate(0, -25%); } .modal.in .modal-dialog { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } .modal .modal-backdrop { position: absolute; top: 0; right: 0; left: 0; background-color: #4D5765; } .modal .modal-backdrop.fade { filter: alpha(opacity=0); opacity: 0; } .modal .modal-backdrop.in { filter: alpha(opacity=85); opacity: 0.85; } .modal-open .modal { overflow-x: hidden; overflow-y: auto; } .modal-dialog { position: relative; width: auto; margin: 10px auto; } .modal-dialog.small { width: 40%; } .modal-dialog.pre-medium { width: 50%; } .modal-dialog.medium { width: 60%; } .modal-content { position: relative; background-color: #fff; -webkit-background-clip: padding-box; background-clip: padding-box; border: 1px solid #999; border: 1px solid rgba(0, 0, 0, 0.2); outline: 0; -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5); box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5); } .modal-header { min-height: 16.42857px; padding: 15px; background: #6ac6d9; color: white; position: relative; } .modal-header > h4 { text-transform: uppercase; text-align: center; font-weight: normal; font-size: 20px; font-size: 2rem; } .modal-header [data-dismiss] { cursor: pointer; right: 20px; top: 50%; margin-top: -13px; position: absolute; } .modal-title { margin: 0; line-height: 1.42857; } .modal-body { position: relative; padding: 15px; } .modal-footer { padding: 30px 15px; text-align: right; border-top: 1px solid #e5e5e5; } .modal-footer .btn + .btn { margin-bottom: 0; margin-left: 5px; } .modal-footer .btn-group .btn + .btn { margin-left: -1px; } .modal-footer .btn-block + .btn-block { margin-left: 0; } .modal-scrollbar-measure { position: absolute; top: -9999px; width: 50px; height: 50px; overflow: scroll; } .fade { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; -moz-transition: opacity 0.15s linear; -o-transition: opacity 0.15s linear; -webkit-transition: opacity 0.15s linear; transition: opacity 0.15s linear; } .fade.in { filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; } span.twitter-typeahead { width: 100%; } span.twitter-typeahead .tt-dropdown-menu { position: absolute; top: 100%; left: 0; z-index: 1000; display: none; float: left; width: 100%; padding: 5px 0; margin: 2px 0 0; list-style: none; text-align: left; background-color: #ffffff; border: 1px solid rgba(0, 0, 0, 0.15); -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); background-clip: padding-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } span.twitter-typeahead .tt-dropdown-menu[style*="display: block"] { display: table !important; } span.twitter-typeahead .tt-suggestions { max-height: 285px; overflow-y: auto; } span.twitter-typeahead .tt-suggestion > p { display: block; padding: 6px 20px; clear: both; font-weight: normal; line-height: 1.42857; color: #333333; margin-bottom: 0; cursor: pointer; white-space: nowrap !important; } span.twitter-typeahead .tt-suggestion > p:hover, span.twitter-typeahead .tt-suggestion > p:focus { color: #ffffff; text-decoration: none; outline: 0; background-color: #6ac6d9; } span.twitter-typeahead .tt-suggestion.tt-cursor { color: #ffffff; background-color: #6ac6d9; } .tab-content > .tab-pane { display: none; visibility: hidden; } .tab-content > .active { display: block; visibility: visible; } .form-image-upload { width: 100%; height: 462px; background-color: #f7f7f7; text-align: center; position: relative; cursor: pointer; } .form-image-upload:hover > .upload-icon { filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; } .form-image-upload:hover > .lead { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; } .form-image-upload > .upload-icon { z-index: 3; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; } .form-image-upload > .upload, .form-image-upload > .upload-icon, .form-image-upload > .lead, .form-image-upload > .upload-preview { position: absolute; } .form-image-upload > .upload, .form-image-upload > .upload-icon, .form-image-upload > .upload-preview { width: 100%; height: 100%; top: 0; left: 0; } .form-image-upload > .upload-preview { z-index: 2; overflow: hidden; } .form-image-upload > .upload-preview img { max-width: 100%; } .form-image-upload > .upload { z-index: 4; cursor: pointer; } .form-image-upload > .upload > label { display: block; width: 100%; height: 100%; position: absolute; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; } .form-image-upload > .upload-icon, .form-image-upload > .lead { -moz-transition: opacity 0.3s; -o-transition: opacity 0.3s; -webkit-transition: opacity 0.3s; transition: opacity 0.3s; } .form-image-upload > .lead { text-transform: uppercase; color: #d2d2d2; position: absolute; top: 50%; left: 0; width: 100%; text-align: center; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); font-size: 45px; font-size: 4.5rem; } .form-image-upload .bank-logo-preview { visibility: hidden; background-color: #f7f7f7; } .list-set-colors { text-align: center; padding: 24px 0 0 0; } .list-set-colors > li { width: 100px; height: 100px; display: inline-block; border: 1px solid transparent; background-color: #f7f7f7; margin: 0 7px; position: relative; } .list-set-colors > li:after { content: ""; position: absolute; top: 50%; left: 50%; margin-top: -16px; margin-left: -16px; display: none; } .list-set-colors > li > .set-color-label { line-height: 19px; color: #d2d2d2; padding-top: 30px; display: block; font-size: 16px; font-size: 1.6rem; } .list-set-colors > li:hover { border-color: #cfcfcf; } .list-set-colors > li:hover:after { display: block; } .list-set-colors > li:hover > span { color: transparent; } .list-set-colors > li:hover .colors-wrapper { z-index: auto; filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; } .colors-wrapper { position: absolute; right: 100%; z-index: -1; bottom: -15px; padding-right: 14px; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; -moz-transition: opacity 0.3s; -o-transition: opacity 0.3s; -webkit-transition: opacity 0.3s; transition: opacity 0.3s; } .colors { width: 290px; border: 1px solid #c7c9cd; background-color: #fff; position: relative; } .colors:after { position: absolute; border-left: 12px solid #fff; border-top: 12px solid transparent; border-bottom: 12px solid transparent; content: ""; top: 50%; left: 100%; margin-left: -1px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .colors:before { position: absolute; border-left: 13px solid #c7c9cd; border-top: 13px solid transparent; border-bottom: 13px solid transparent; content: ""; top: 50%; left: 100%; margin-left: 0; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .colors-head { overflow: hidden; padding: 15px; padding-bottom: 0; color: #434343; } .colors-head p { line-height: 34px; } .list-colors { overflow: hidden; padding: 8px 12px 15px 14px; } .list-colors li { float: left; height: 23px; width: 9%; } .list-colors li a { display: block; height: 100%; cursor: pointer; border: 1px solid transparent; } .list-colors li a:hover { position: relative; z-index: 2; border: 1px solid rgba(255, 255, 255, 0.15); -moz-box-shadow: 0 0 2px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.5); box-shadow: 0 0 2px rgba(0, 0, 0, 0.5); } .color1 { background-color: #251a16; } .text-color1 { color: #251a16; } .border-connect-1 { border-color: #251a16; z-index: 2; } .border-connect-1 path { stroke: #251a16; stroke-width: 4; } .border-bank-1 { border-color: #251a16; } .border-bank-1:after { border-bottom-color: #251a16; } .color2 { background-color: #332c33; } .text-color2 { color: #332c33; } .border-connect-2 { border-color: #332c33; z-index: 2; } .border-connect-2 path { stroke: #332c33; stroke-width: 4; } .border-bank-2 { border-color: #332c33; } .border-bank-2:after { border-bottom-color: #332c33; } .color3 { background-color: #695c54; } .text-color3 { color: #695c54; } .border-connect-3 { border-color: #695c54; z-index: 2; } .border-connect-3 path { stroke: #695c54; stroke-width: 4; } .border-bank-3 { border-color: #695c54; } .border-bank-3:after { border-bottom-color: #695c54; } .color4 { background-color: #d4cabe; } .text-color4 { color: #d4cabe; } .border-connect-4 { border-color: #d4cabe; z-index: 2; } .border-connect-4 path { stroke: #d4cabe; stroke-width: 4; } .border-bank-4 { border-color: #d4cabe; } .border-bank-4:after { border-bottom-color: #d4cabe; } .color5 { background-color: #f6d413; } .text-color5 { color: #f6d413; } .border-connect-5 { border-color: #f6d413; z-index: 2; } .border-connect-5 path { stroke: #f6d413; stroke-width: 4; } .border-bank-5 { border-color: #f6d413; } .border-bank-5:after { border-bottom-color: #f6d413; } .color6 { background-color: #f8bf34; } .text-color6 { color: #f8bf34; } .border-connect-6 { border-color: #f8bf34; z-index: 2; } .border-connect-6 path { stroke: #f8bf34; stroke-width: 4; } .border-bank-6 { border-color: #f8bf34; } .border-bank-6:after { border-bottom-color: #f8bf34; } .color7 { background-color: #e3900c; } .text-color7 { color: #e3900c; } .border-connect-7 { border-color: #e3900c; z-index: 2; } .border-connect-7 path { stroke: #e3900c; stroke-width: 4; } .border-bank-7 { border-color: #e3900c; } .border-bank-7:after { border-bottom-color: #e3900c; } .color8 { background-color: #fb5c18; } .text-color8 { color: #fb5c18; } .border-connect-8 { border-color: #fb5c18; z-index: 2; } .border-connect-8 path { stroke: #fb5c18; stroke-width: 4; } .border-bank-8 { border-color: #fb5c18; } .border-bank-8:after { border-bottom-color: #fb5c18; } .color9 { background-color: #ea4d3e; } .text-color9 { color: #ea4d3e; } .border-connect-9 { border-color: #ea4d3e; z-index: 2; } .border-connect-9 path { stroke: #ea4d3e; stroke-width: 4; } .border-bank-9 { border-color: #ea4d3e; } .border-bank-9:after { border-bottom-color: #ea4d3e; } .color10 { background-color: #b54b3b; } .text-color10 { color: #b54b3b; } .border-connect-10 { border-color: #b54b3b; z-index: 2; } .border-connect-10 path { stroke: #b54b3b; stroke-width: 4; } .border-bank-10 { border-color: #b54b3b; } .border-bank-10:after { border-bottom-color: #b54b3b; } .color11 { background-color: #921519; } .text-color11 { color: #921519; } .border-connect-11 { border-color: #921519; z-index: 2; } .border-connect-11 path { stroke: #921519; stroke-width: 4; } .border-bank-11 { border-color: #921519; } .border-bank-11:after { border-bottom-color: #921519; } .color12 { background-color: #4e1c1b; } .text-color12 { color: #4e1c1b; } .border-connect-12 { border-color: #4e1c1b; z-index: 2; } .border-connect-12 path { stroke: #4e1c1b; stroke-width: 4; } .border-bank-12 { border-color: #4e1c1b; } .border-bank-12:after { border-bottom-color: #4e1c1b; } .color13 { background-color: #a65c51; } .text-color13 { color: #a65c51; } .border-connect-13 { border-color: #a65c51; z-index: 2; } .border-connect-13 path { stroke: #a65c51; stroke-width: 4; } .border-bank-13 { border-color: #a65c51; } .border-bank-13:after { border-bottom-color: #a65c51; } .color14 { background-color: #e1b1a3; } .text-color14 { color: #e1b1a3; } .border-connect-14 { border-color: #e1b1a3; z-index: 2; } .border-connect-14 path { stroke: #e1b1a3; stroke-width: 4; } .border-bank-14 { border-color: #e1b1a3; } .border-bank-14:after { border-bottom-color: #e1b1a3; } .color15 { background-color: #967472; } .text-color15 { color: #967472; } .border-connect-15 { border-color: #967472; z-index: 2; } .border-connect-15 path { stroke: #967472; stroke-width: 4; } .border-bank-15 { border-color: #967472; } .border-bank-15:after { border-bottom-color: #967472; } .color16 { background-color: #ac424e; } .text-color16 { color: #ac424e; } .border-connect-16 { border-color: #ac424e; z-index: 2; } .border-connect-16 path { stroke: #ac424e; stroke-width: 4; } .border-bank-16 { border-color: #ac424e; } .border-bank-16:after { border-bottom-color: #ac424e; } .color17 { background-color: #7c4451; } .text-color17 { color: #7c4451; } .border-connect-17 { border-color: #7c4451; z-index: 2; } .border-connect-17 path { stroke: #7c4451; stroke-width: 4; } .border-bank-17 { border-color: #7c4451; } .border-bank-17:after { border-bottom-color: #7c4451; } .color18 { background-color: #511a31; } .text-color18 { color: #511a31; } .border-connect-18 { border-color: #511a31; z-index: 2; } .border-connect-18 path { stroke: #511a31; stroke-width: 4; } .border-bank-18 { border-color: #511a31; } .border-bank-18:after { border-bottom-color: #511a31; } .color19 { background-color: #340e19; } .text-color19 { color: #340e19; } .border-connect-19 { border-color: #340e19; z-index: 2; } .border-connect-19 path { stroke: #340e19; stroke-width: 4; } .border-bank-19 { border-color: #340e19; } .border-bank-19:after { border-bottom-color: #340e19; } .color20 { background-color: #e17baa; } .text-color20 { color: #e17baa; } .border-connect-20 { border-color: #e17baa; z-index: 2; } .border-connect-20 path { stroke: #e17baa; stroke-width: 4; } .border-bank-20 { border-color: #e17baa; } .border-bank-20:after { border-bottom-color: #e17baa; } .color21 { background-color: #f4c1d0; } .text-color21 { color: #f4c1d0; } .border-connect-21 { border-color: #f4c1d0; z-index: 2; } .border-connect-21 path { stroke: #f4c1d0; stroke-width: 4; } .border-bank-21 { border-color: #f4c1d0; } .border-bank-21:after { border-bottom-color: #f4c1d0; } .color22 { background-color: #a187aa; } .text-color22 { color: #a187aa; } .border-connect-22 { border-color: #a187aa; z-index: 2; } .border-connect-22 path { stroke: #a187aa; stroke-width: 4; } .border-bank-22 { border-color: #a187aa; } .border-bank-22:after { border-bottom-color: #a187aa; } .color23 { background-color: #005782; } .text-color23 { color: #005782; } .border-connect-23 { border-color: #005782; z-index: 2; } .border-connect-23 path { stroke: #005782; stroke-width: 4; } .border-bank-23 { border-color: #005782; } .border-bank-23:after { border-bottom-color: #005782; } .color24 { background-color: #0a5dc7; } .text-color24 { color: #0a5dc7; } .border-connect-24 { border-color: #0a5dc7; z-index: 2; } .border-connect-24 path { stroke: #0a5dc7; stroke-width: 4; } .border-bank-24 { border-color: #0a5dc7; } .border-bank-24:after { border-bottom-color: #0a5dc7; } .color25 { background-color: #29304a; } .text-color25 { color: #29304a; } .border-connect-25 { border-color: #29304a; z-index: 2; } .border-connect-25 path { stroke: #29304a; stroke-width: 4; } .border-bank-25 { border-color: #29304a; } .border-bank-25:after { border-bottom-color: #29304a; } .color26 { background-color: #4b566a; } .text-color26 { color: #4b566a; } .border-connect-26 { border-color: #4b566a; z-index: 2; } .border-connect-26 path { stroke: #4b566a; stroke-width: 4; } .border-bank-26 { border-color: #4b566a; } .border-bank-26:after { border-bottom-color: #4b566a; } .color27 { background-color: #6f80b6; } .text-color27 { color: #6f80b6; } .border-connect-27 { border-color: #6f80b6; z-index: 2; } .border-connect-27 path { stroke: #6f80b6; stroke-width: 4; } .border-bank-27 { border-color: #6f80b6; } .border-bank-27:after { border-bottom-color: #6f80b6; } .color28 { background-color: #041f76; } .text-color28 { color: #041f76; } .border-connect-28 { border-color: #041f76; z-index: 2; } .border-connect-28 path { stroke: #041f76; stroke-width: 4; } .border-bank-28 { border-color: #041f76; } .border-bank-28:after { border-bottom-color: #041f76; } .color29 { background-color: #4736a9; } .text-color29 { color: #4736a9; } .border-connect-29 { border-color: #4736a9; z-index: 2; } .border-connect-29 path { stroke: #4736a9; stroke-width: 4; } .border-bank-29 { border-color: #4736a9; } .border-bank-29:after { border-bottom-color: #4736a9; } .color30 { background-color: #1c0b37; } .text-color30 { color: #1c0b37; } .border-connect-30 { border-color: #1c0b37; z-index: 2; } .border-connect-30 path { stroke: #1c0b37; stroke-width: 4; } .border-bank-30 { border-color: #1c0b37; } .border-bank-30:after { border-bottom-color: #1c0b37; } .color31 { background-color: #1c144d; } .text-color31 { color: #1c144d; } .border-connect-31 { border-color: #1c144d; z-index: 2; } .border-connect-31 path { stroke: #1c144d; stroke-width: 4; } .border-bank-31 { border-color: #1c144d; } .border-bank-31:after { border-bottom-color: #1c144d; } .color32 { background-color: #2a1b54; } .text-color32 { color: #2a1b54; } .border-connect-32 { border-color: #2a1b54; z-index: 2; } .border-connect-32 path { stroke: #2a1b54; stroke-width: 4; } .border-bank-32 { border-color: #2a1b54; } .border-bank-32:after { border-bottom-color: #2a1b54; } .color33 { background-color: #462a5a; } .text-color33 { color: #462a5a; } .border-connect-33 { border-color: #462a5a; z-index: 2; } .border-connect-33 path { stroke: #462a5a; stroke-width: 4; } .border-bank-33 { border-color: #462a5a; } .border-bank-33:after { border-bottom-color: #462a5a; } .color34 { background-color: #dfe84d; } .text-color34 { color: #dfe84d; } .border-connect-34 { border-color: #dfe84d; z-index: 2; } .border-connect-34 path { stroke: #dfe84d; stroke-width: 4; } .border-bank-34 { border-color: #dfe84d; } .border-bank-34:after { border-bottom-color: #dfe84d; } .color35 { background-color: #c7c59e; } .text-color35 { color: #c7c59e; } .border-connect-35 { border-color: #c7c59e; z-index: 2; } .border-connect-35 path { stroke: #c7c59e; stroke-width: 4; } .border-bank-35 { border-color: #c7c59e; } .border-bank-35:after { border-bottom-color: #c7c59e; } .color36 { background-color: #638e72; } .text-color36 { color: #638e72; } .border-connect-36 { border-color: #638e72; z-index: 2; } .border-connect-36 path { stroke: #638e72; stroke-width: 4; } .border-bank-36 { border-color: #638e72; } .border-bank-36:after { border-bottom-color: #638e72; } .color37 { background-color: #415941; } .text-color37 { color: #415941; } .border-connect-37 { border-color: #415941; z-index: 2; } .border-connect-37 path { stroke: #415941; stroke-width: 4; } .border-bank-37 { border-color: #415941; } .border-bank-37:after { border-bottom-color: #415941; } .color38 { background-color: #24302e; } .text-color38 { color: #24302e; } .border-connect-38 { border-color: #24302e; z-index: 2; } .border-connect-38 path { stroke: #24302e; stroke-width: 4; } .border-bank-38 { border-color: #24302e; } .border-bank-38:after { border-bottom-color: #24302e; } .color39 { background-color: #0b0f0e; } .text-color39 { color: #0b0f0e; } .border-connect-39 { border-color: #0b0f0e; z-index: 2; } .border-connect-39 path { stroke: #0b0f0e; stroke-width: 4; } .border-bank-39 { border-color: #0b0f0e; } .border-bank-39:after { border-bottom-color: #0b0f0e; } .color40 { background-color: #01826c; } .text-color40 { color: #01826c; } .border-connect-40 { border-color: #01826c; z-index: 2; } .border-connect-40 path { stroke: #01826c; stroke-width: 4; } .border-bank-40 { border-color: #01826c; } .border-bank-40:after { border-bottom-color: #01826c; } .color41 { background-color: #499190; } .text-color41 { color: #499190; } .border-connect-41 { border-color: #499190; z-index: 2; } .border-connect-41 path { stroke: #499190; stroke-width: 4; } .border-bank-41 { border-color: #499190; } .border-bank-41:after { border-bottom-color: #499190; } .color42 { background-color: #a4c3c8; } .text-color42 { color: #a4c3c8; } .border-connect-42 { border-color: #a4c3c8; z-index: 2; } .border-connect-42 path { stroke: #a4c3c8; stroke-width: 4; } .border-bank-42 { border-color: #a4c3c8; } .border-bank-42:after { border-bottom-color: #a4c3c8; } .color43 { background-color: #fefff9; } .text-color43 { color: #fefff9; } .border-connect-43 { border-color: #fefff9; z-index: 2; } .border-connect-43 path { stroke: #fefff9; stroke-width: 4; } .border-bank-43 { border-color: #fefff9; } .border-bank-43:after { border-bottom-color: #fefff9; } .color44 { background-color: #231f20; } .text-color44 { color: #231f20; } .border-connect-44 { border-color: #231f20; z-index: 2; } .border-connect-44 path { stroke: #231f20; stroke-width: 4; } .border-bank-44 { border-color: #231f20; } .border-bank-44:after { border-bottom-color: #231f20; } .color45 { background-color: #009fe3; } .text-color45 { color: #009fe3; } .border-connect-45 { border-color: #009fe3; z-index: 2; } .border-connect-45 path { stroke: #009fe3; stroke-width: 4; } .border-bank-45 { border-color: #009fe3; } .border-bank-45:after { border-bottom-color: #009fe3; } .color46 { background-color: #00923B; } .text-color46 { color: #00923B; } .border-connect-46 { border-color: #00923B; z-index: 2; } .border-connect-46 path { stroke: #00923B; stroke-width: 4; } .border-bank-46 { border-color: #00923B; } .border-bank-46:after { border-bottom-color: #00923B; } .color47 { background-color: #342D76; } .text-color47 { color: #342D76; } .border-connect-47 { border-color: #342D76; z-index: 2; } .border-connect-47 path { stroke: #342D76; stroke-width: 4; } .border-bank-47 { border-color: #342D76; } .border-bank-47:after { border-bottom-color: #342D76; } .color48 { background-color: #36424D; } .text-color48 { color: #36424D; } .border-connect-48 { border-color: #36424D; z-index: 2; } .border-connect-48 path { stroke: #36424D; stroke-width: 4; } .border-bank-48 { border-color: #36424D; } .border-bank-48:after { border-bottom-color: #36424D; } .colorinactive { background-color: #b5b5b5; } .text-colorinactive { color: #b5b5b5; } .border-connect-inactive { border-color: #b5b5b5; z-index: 2; } .border-connect-inactive path { stroke: #b5b5b5; stroke-width: 4; } .border-bank-inactive { border-color: #b5b5b5; } .border-bank-inactive:after { border-bottom-color: #b5b5b5; } .datepick { background-color: transparent; color: #434343; font-size: 90%; border: 1px solid rgba(181, 181, 181, 0.5); border-top: none; } .datepick-rtl { direction: rtl; } .datepick-popup { z-index: 1000; margin-top: 9px; margin-left: -59px; } .inverse .datepick-popup { margin-left: 0; } .datepick-disable { position: absolute; z-index: 100; background-color: white; opacity: 0.5; filter: alpha(opacity=50); } .datepick a { color: white; text-decoration: none; } .datepick a.datepick-disabled { color: #888; cursor: auto; } .datepick button { margin: 0.25em; padding: 0.125em 0em; background-color: #fcc; font-weight: bold; } .datepick-nav { width: 70%; position: absolute; left: 50%; margin-left: -35%; top: 16px; color: white; font-size: 90%; font-weight: bold; } .datepick-ctrl { display: none; float: left; width: 100%; background-color: #434343; color: white; font-size: 90%; font-weight: bold; background-color: #600; } .datepick-cmd { text-align: center; } .datepick-cmd-today { display: none; } .datepick-ctrl .datepick-cmd:hover { background-color: #6ac6d9; } .datepick-cmd-prevJump, .datepick-cmd-nextJump { width: 8%; } a.datepick-cmd { height: 1.5em; } button.datepick-cmd { text-align: center; } .datepick-cmd-prev, .datepick-cmd-prevJump, .datepick-cmd-clear { float: left; padding-left: 2%; } .datepick-cmd-current, .datepick-cmd-today { float: left; width: 35%; text-align: center; } .datepick-cmd-next, .datepick-cmd-nextJump, .datepick-cmd-close { float: right; padding-right: 2%; text-align: right; } .datepick-rtl .datepick-cmd-prev, .datepick-rtl .datepick-cmd-prevJump, .datepick-rtl .datepick-cmd-clear { float: right; padding-left: 0%; padding-right: 2%; text-align: right; } .datepick-rtl .datepick-cmd-current, .datepick-rtl .datepick-cmd-today { float: right; } .datepick-rtl .datepick-cmd-next, .datepick-rtl .datepick-cmd-nextJump, .datepick-rtl .datepick-cmd-close { float: left; padding-left: 2%; padding-right: 0%; text-align: left; } .datepick-month-nav { float: left; background-color: #cfcfcf; text-align: center; } .datepick-month-nav div { float: left; width: 12.5%; margin: 1%; padding: 1%; } .datepick-month-nav span { color: #888; } .datepick-month-row { clear: left; } .datepick-month { float: left; min-width: 15em; text-align: center; } .datepick-month-header { background-color: white; color: #434343; padding: 15px 30px; border-bottom: 1px solid rgba(181, 181, 181, 0.5); font-size: 17px; font-size: 1.7rem; } .datepick-month-header > .chosen-on-dp { float: left; padding: 0 10px 4px; } .datepick-month-header > .chosen-on-dp .custom-select.seamless ~ .chosen-container .chosen-single div { float: left; margin-top: 9px; } .datepick-month-header > .chosen-on-dp .custom-select.seamless ~ .chosen-container .chosen-results > li { padding: 4px 8px; font-size: 14px; font-size: 1.4rem; } .datepick-month-header > .chosen-on-dp:first-child { width: 60%; } .datepick-month-header > .chosen-on-dp:last-child { width: 40%; } .datepick-month-header select, .datepick-month-header input { background-color: transparent; border: none; color: #434343; } .datepick-month-header select { margin: 0em; padding: 0em; border: none; font-size: 100%; outline: none; } .datepick-month-header input { margin: 0em; padding: 0em; border: none; font-size: 100%; position: absolute; display: none; } .datepick-month table { width: 243px; border-collapse: collapse; } .datepick-month table a { display: block; width: 100%; padding: 4px; background-color: #edfcff; color: #434343; text-decoration: none; } .datepick-month table span { display: block; width: 100%; padding: 0.125em 0em; } .datepick-month table td { padding: 2px 0; } .datepick-month table td > a, .datepick-month table td > span { border-bottom: 1px solid transparent; } .datepick-month table td span { display: block; width: 100%; padding: 4px; color: #cfcfcf; text-decoration: none; } .datepick-month table td .datepick-highlight, .datepick-month table td .datepick-selected { background-color: #6ac6d9; color: white; } .datepick-month table th.datepick-week { background-color: #cfcfcf; color: white; } .datepick-month th, .datepick-month td { margin: 0em; font-weight: normal; text-align: center; border: none; } .datepick-month th { text-transform: uppercase; color: #434343; padding: 15px 8px; background-color: white; } .datepick-month th a { background-color: #cfcfcf; color: white; display: block; } .datepick-month td { background-color: white; } .datepick-month td:first-child { padding-left: 10px; } .datepick-month td:last-child { padding-right: 10px; } .datepick-month tr:last-child td { padding-bottom: 30px; } .datepick-status { clear: both; background-color: #edfcff; text-align: center; } .datepick-clear-fix { clear: both; } .text-core { position: relative; min-height: 35px; height: auto !important; } .text-core .text-wrap { position: relative; width: 100%; min-height: 34px; height: auto !important; padding: 10px 12px; background: none !important; } .text-core .text-wrap .form-control, .text-core .text-wrap .text-prompt { width: 100%; } .text-core .text-wrap .text-prompt { line-height: 1.4; height: 100%; padding: 10px 12px; overflow: hidden; white-space: nowrap; color: #70757a; } .text-core .text-wrap .form-control { z-index: 2; padding: 8px 12px; position: absolute; bottom: 0; left: 0; } .text-core .text-wrap .text-hide-prompt { display: none; } .text-core .text-wrap .text-dropdown { position: absolute; z-index: 3; width: 100%; top: 100% !important; max-height: 120px !important; display: none; overflow-x: hidden; overflow-y: auto; margin-top: 0; left: 0; border: 1px solid #b5b5b5; border-top: none; } .text-core .text-wrap .text-dropdown.text-position-below { margin-top: 0; } .text-core .text-wrap .text-dropdown.text-position-above { margin-top: 0; margin-bottom: 0; } .text-core .text-wrap .text-dropdown .text-list .text-suggestion { padding: 12px 15px; cursor: pointer; background: white; line-height: 1.5; } .text-core .text-wrap .text-dropdown .text-list .text-suggestion em { font-style: normal; text-decoration: underline; } .text-core .text-wrap .text-dropdown .text-list .text-suggestion.text-selected { color: white; background: #6ac6d9; } .text-core .text-wrap .text-clear { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; position: absolute; top: 0; right: 14px; width: 22px; height: 22px; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAAYUlEQVR42mP4////P1IwA5RBNIBr+Pj5+/9Tlx78v373OYoCkBgIY2gACWr7tP63CO8BanoBlmyfuQssBsIYGtAVLNpwEsMADA0gAFMIw+hOpEwDSU4i2dMkByvJEUcsAABHaALCQIZDrAAAAABJRU5ErkJggg==") 50% 50% no-repeat; cursor: pointer; z-index: 2; } .text-core .text-wrap .text-focus { position: absolute; width: 100%; height: 100%; display: none; position: absolute; width: 100%; height: 100%; display: none; } .text-core .text-wrap .text-focus.text-show-focus { display: block; display: block; } .text-core .text-wrap .text-tags { display: block; padding: 6px 0 4px 0; position: relative; z-index: 3; height: 100%; overflow: hidden; margin-bottom: 10px; } .text-core .text-wrap .text-tags:empty { margin-bottom: 0; } .text-core .text-wrap .text-tags.text-tags-on-top { z-index: 2; } .text-core .text-wrap .text-tags .text-tag { float: left; margin-right: 5px; margin-bottom: 10px; max-width: 100%; overflow: hidden; } .text-core .text-wrap .text-tags .text-tag .text-button { color: #b5b5b5; display: inline-block; margin-left: 0; margin-bottom: 4px; position: relative; padding-right: 20px; white-space: nowrap; text-overflow: ellipsis; max-width: 100%; font-size: 13px; font-size: 1.3rem; } .text-core .text-wrap .text-tags .text-tag .text-button .text-label { display: block; overflow: hidden; text-overflow: ellipsis; max-width: 100%; } .text-core .text-wrap .text-tags .text-tag .text-button a.text-remove, .text-core .text-wrap .text-tags .text-tag .text-button a.text-remove:visited { cursor: pointer; position: absolute; top: 50%; margin-top: -6px; right: 4px; display: block; width: 12px; height: 12px; background-image: url("images/chosen-sprite.png"); background-position: -42px 1px; background-repeat: no-repeat; font-size: 1px; } .text-core .text-wrap .text-tags .text-tag .text-button a.text-remove:hover, .text-core .text-wrap .text-tags .text-tag .text-button a.text-remove:visited:hover { background-position: -42px -10px; } .icon-small-sprite, .icon-small-arrow-dropdown, .chosen-container-multi .chosen-choices:after, .chosen-container-single .chosen-single div:after, .chosen-container-single .chosen-single:visited div:after, .icon-small-arrow-next, .icon-small-arrow-prev, .icon-small-arrow-to, table tbody > tr > td.cell-from:after, .icon-small-calendar, .icon-small-check, .icon-small-checkbox-large-on, .checkbox.large > [type=checkbox]:checked ~ span:before, .icon-small-checkbox-large, .checkbox.large > span:before, .icon-small-checkbox-on, .checkbox > [type=checkbox]:checked ~ span:before, .chosen-container-multi .chosen-results > li.result-selected:before, .icon-small-checkbox, .checkbox > span:before, .chosen-container-multi .chosen-results > li:before, .chosen-container-multi .chosen-results > li.active-result:before, .icon-small-clock-mute, .icon-small-clock-on, .icon-small-close, .icon-small-collapse-mute, .plus-minus [data-toggle=collapse][aria-expanded=true]:before, .icon-small-condition-mute, .icon-small-edit-mute, .icon-small-equal-mute, .route-equal:before, .icon-small-error, .icon-small-expand-mute, .plus-minus [data-toggle=collapse]:before, .icon-small-export-mute-alt, .icon-small-export-mute, .icon-small-forward, .icon-small-graph-inverse, .icon-small-graph-mute, .icon-small-history-mute, .icon-small-info-mute, .icon-small-info, .icon-small-link, .icon-small-list-mute, .icon-small-list, .icon-small-map-mute, .icon-small-minus-primary, .toggle-active .icon-small-plus-primary, .icon-small-plus-inverse, .chosen-container .chosen-results li.create-option.highlighted:before, .icon-small-plus-mute, .route-plus:before, .icon-small-plus-primary, .icon-small-plus, .chosen-container .chosen-results li.create-option:before, .icon-small-remove-alt, .icon-small-remove-mute, .icon-small-remove, .icon-small-route-mute, .icon-small-save-mute, .icon-small-success, .icon-small-table-inverse, .icon-small-table-mute, .icon-small-valid { background-image: url('images/icon-small-s812176e22d.png'); background-repeat: no-repeat; } .icon-medium-sprite, .icon-medium-arrow-long, .icon-medium-bank, .icon-medium-billing, .icon-medium-cor-bank, .icon-medium-customer, .icon-medium-logout, .icon-medium-pdf, .icon-medium-pen, .list-set-colors > li:after, .icon-medium-report, .icon-medium-rma, .icon-medium-search-mute, .icon-medium-simulator, .icon-medium-transfer { background-image: url('images/icon-medium-sc69c7fd061.png'); background-repeat: no-repeat; } .icon-large-sprite, .icon-large-upload { background-image: url('images/icon-large-sc89025cc2c.png'); background-repeat: no-repeat; } .icon-flag-sprite, .icon-flag-canada, .icon-flag-guinea, .icon-flag-israel, .icon-flag-usa { background-image: url('images/icon-flag-s05a2a28a85.png'); background-repeat: no-repeat; } .icon-small-arrow-dropdown, .chosen-container-multi .chosen-choices:after, .chosen-container-single .chosen-single div:after, .chosen-container-single .chosen-single:visited div:after { background-position: 0 0; height: 8px; width: 10px; } .icon-small-arrow-next { background-position: 0 -8px; height: 16px; width: 16px; } .icon-small-arrow-prev { background-position: 0 -24px; height: 16px; width: 16px; } .icon-small-arrow-to, table tbody > tr > td.cell-from:after { background-position: 0 -40px; height: 12px; width: 12px; } .icon-small-calendar { background-position: 0 -73px; height: 21px; width: 21px; } .icon-small-calendar:hover, .icon-small-calendar.calendar-hover { background-position: 0 -52px; } .icon-small-check { background-position: 0 -94px; height: 26px; width: 26px; } .icon-small-checkbox-large-on, .checkbox.large > [type=checkbox]:checked ~ span:before { background-position: 0 -120px; height: 31px; width: 30px; } .icon-small-checkbox-large, .checkbox.large > span:before { background-position: 0 -151px; height: 31px; width: 30px; } .icon-small-checkbox-on, .checkbox > [type=checkbox]:checked ~ span:before, .chosen-container-multi .chosen-results > li.result-selected:before { background-position: 0 -182px; height: 26px; width: 26px; } .icon-small-checkbox, .checkbox > span:before, .chosen-container-multi .chosen-results > li:before, .chosen-container-multi .chosen-results > li.active-result:before { background-position: 0 -208px; height: 26px; width: 26px; } .icon-small-clock-mute { background-position: 0 -234px; height: 18px; width: 18px; } .icon-small-clock-on { background-position: 0 -252px; height: 18px; width: 18px; } .icon-small-close { background-position: 0 -270px; height: 16px; width: 16px; } .icon-small-collapse-mute, .plus-minus [data-toggle=collapse][aria-expanded=true]:before { background-position: 0 -286px; height: 16px; width: 16px; } .icon-small-condition-mute { background-position: 0 -302px; height: 26px; width: 26px; } .icon-small-edit-mute { background-position: 0 -354px; height: 26px; width: 26px; } .icon-small-edit-mute:hover, .icon-small-edit-mute.edit-mute-hover { background-position: 0 -328px; } .icon-small-equal-mute, .route-equal:before { background-position: 0 -380px; height: 16px; width: 16px; } .icon-small-error { background-position: 0 -396px; height: 26px; width: 26px; } .icon-small-expand-mute, .plus-minus [data-toggle=collapse]:before { background-position: 0 -422px; height: 16px; width: 16px; } .icon-small-export-mute-alt { background-position: 0 -464px; height: 26px; width: 26px; } .icon-small-export-mute-alt:hover, .icon-small-export-mute-alt.export-mute-alt-hover { background-position: 0 -438px; } .icon-small-export-mute { background-position: 0 -516px; height: 26px; width: 26px; } .icon-small-export-mute:hover, .icon-small-export-mute.export-mute-hover { background-position: 0 -490px; } .icon-small-forward { background-position: 0 -542px; height: 34px; width: 34px; } .icon-small-graph-inverse { background-position: 0 -576px; height: 26px; width: 26px; } .icon-small-graph-mute { background-position: 0 -628px; height: 26px; width: 26px; } .icon-small-graph-mute:hover, .icon-small-graph-mute.graph-mute-hover, .btn-group.tight > .btn:hover .icon-small-graph-mute, .btn-group.tight > .btn.active .icon-small-graph-mute, .btn-group.tight > .btn:visited:hover .icon-small-graph-mute, .btn-group.tight > .btn:visited.active .icon-small-graph-mute { background-position: 0 -602px; } .icon-small-history-mute { background-position: 0 -680px; height: 26px; width: 26px; } .icon-small-history-mute:hover, .icon-small-history-mute.history-mute-hover { background-position: 0 -654px; } .icon-small-info-mute { background-position: 0 -706px; height: 26px; width: 26px; } .icon-small-info { background-position: 0 -732px; height: 26px; width: 26px; } .icon-small-link { background-position: 0 -758px; height: 21px; width: 21px; } .icon-small-list-mute { background-position: 0 -826px; height: 26px; width: 28px; } .icon-small-list-mute:hover, .active .trigger-views .icon-small-list-mute, .icon-small-list-mute.list-mute-hover { background-position: 0 -800px; } .icon-small-list { background-position: 0 -852px; height: 21px; width: 21px; } .icon-small-list:hover, .icon-small-list.list-hover { background-position: 0 -779px; } .icon-small-map-mute { background-position: 0 -899px; height: 26px; width: 29px; } .icon-small-map-mute:hover, .active .trigger-views .icon-small-map-mute, .icon-small-map-mute.map-mute-hover { background-position: 0 -873px; } .icon-small-minus-primary, .toggle-active .icon-small-plus-primary { background-position: 0 -925px; height: 15px; width: 15px; } .icon-small-plus-inverse, .chosen-container .chosen-results li.create-option.highlighted:before { background-position: 0 -940px; height: 16px; width: 16px; } .icon-small-plus-mute, .route-plus:before { background-position: 0 -956px; height: 16px; width: 16px; } .icon-small-plus-primary { background-position: 0 -972px; height: 15px; width: 15px; } .icon-small-plus, .chosen-container .chosen-results li.create-option:before { background-position: 0 -987px; height: 16px; width: 16px; } .icon-small-remove-alt { background-position: 0 -1003px; height: 16px; width: 16px; } .icon-small-remove-mute { background-position: 0 -1045px; height: 26px; width: 26px; } .icon-small-remove-mute:hover, .icon-small-remove-mute.remove-mute-hover { background-position: 0 -1019px; } .icon-small-remove { background-position: 0 -1071px; height: 26px; width: 26px; } .icon-small-route-mute { background-position: 0 -1097px; height: 26px; width: 26px; } .icon-small-save-mute { background-position: 0 -1149px; height: 26px; width: 26px; } .icon-small-save-mute:hover, .icon-small-save-mute.save-mute-hover { background-position: 0 -1123px; } .icon-small-success { background-position: 0 -1175px; height: 25px; width: 25px; } .icon-small-table-inverse { background-position: 0 -1200px; height: 26px; width: 26px; } .icon-small-table-mute { background-position: 0 -1252px; height: 26px; width: 26px; } .icon-small-table-mute:hover, .icon-small-table-mute.table-mute-hover, .btn-group.tight > .btn:hover .icon-small-table-mute, .btn-group.tight > .btn.active .icon-small-table-mute, .btn-group.tight > .btn:visited:hover .icon-small-table-mute, .btn-group.tight > .btn:visited.active .icon-small-table-mute { background-position: 0 -1226px; } .icon-small-valid { background-position: 0 -1278px; height: 25px; width: 25px; } .icon-medium-arrow-long { background-position: 0 0; height: 15px; width: 90px; } .icon-medium-bank { background-position: 0 -15px; height: 36px; width: 36px; } .icon-medium-billing { background-position: 0 -51px; height: 36px; width: 36px; } .icon-medium-cor-bank { background-position: 0 -87px; height: 36px; width: 65px; } .icon-medium-customer { background-position: 0 -123px; height: 36px; width: 36px; } .icon-medium-logout { background-position: 0 -159px; height: 36px; width: 36px; } .icon-medium-pdf { background-position: 0 -195px; height: 48px; width: 48px; } .icon-medium-pen, .list-set-colors > li:after { background-position: 0 -243px; height: 32px; width: 32px; } .icon-medium-report { background-position: 0 -275px; height: 36px; width: 36px; } .icon-medium-rma { background-position: 0 -311px; height: 31px; width: 47px; } .icon-medium-search-mute { background-position: 0 -342px; height: 36px; width: 36px; } .icon-medium-simulator { background-position: 0 -378px; height: 36px; width: 36px; } .icon-medium-transfer { background-position: 0 -414px; height: 35px; width: 35px; } .icon-large-upload { background-position: 0 0; height: 64px; width: 64px; } .icon-flag-canada { background-position: 0 0; height: 14px; width: 20px; } .icon-flag-guinea { background-position: 0 -14px; height: 14px; width: 20px; } .icon-flag-israel { background-position: 0 -28px; height: 14px; width: 20px; } .icon-flag-usa { background-position: 0 -42px; height: 14px; width: 19px; } body { background-image: url(images/bg-building.jpg); background-repeat: no-repeat; background-attachment: fixed; -moz-background-size: cover; -o-background-size: cover; -webkit-background-size: cover; background-size: cover; } .mega-height { height: 1000px; } .login-head { position: absolute; width: 100%; top: 15%; } .login-body { width: 436px; margin-left: auto; margin-right: auto; } .logo { text-align: center; } .form-login { padding-left: 50px; padding-right: 50px; } .form-login .form-control { font-size: 13px; font-size: 1.3rem; } .form-login .form-group + .form-group { margin-top: 24px; } .form-search .form-control { min-width: 340px; } .site-header { padding-top: 20px; padding-bottom: 20px; color: white; } .site-header .subhead { margin-top: 15px; } .site-header .logo { margin-top: 4px; } .sidebar .nav-primary { margin-left: -15px; margin-right: 10px; } .table-bank td { width: auto; } .table-bank td:nth-child(2) { width: 23%; } .table-accounts td { width: auto; } .table-accounts td:nth-child(5) { width: 30%; } .table-new-accounts td, .table-new-accounts th, .table-new-users td, .table-new-users th { width: auto; } .table-new-accounts td:nth-child(1), .table-new-accounts th:nth-child(1), .table-new-users td:nth-child(1), .table-new-users th:nth-child(1) { width: 60px; } .table-graph th, .table-graph td { text-align: center; width: 14%; } .table-graph th:first-child, .table-graph td:first-child { width: auto; text-align: left; } .table-currencies > thead > tr > th + th { width: 115px; text-align: center; } .label-currency { vertical-align: middle; margin-top: -6px; display: inline-block; } .control-field-row + .control-field-row { margin-top: 20px; } form input.form-control-clean { background: none; } .text-to { padding-top: 12px; } [data-toggle=checkbox] { cursor: pointer; } .control-field-row .fade .form-control { pointer-events: none; } .control-field-row .fade.in .form-control { pointer-events: auto; } .dummy-logo { width: 100%; height: 280px; text-transform: uppercase; font-weight: 600; color: #d4d4d4; font-size: 40px; font-size: 4rem; } .list-branches > li { position: relative; } .list-branches > li:hover { background: rgba(181, 181, 181, 0.15); } .list-branches > li .list-sub-group { padding-left: 30px; } .list-branches > li .list-sub-group > li { position: relative; } .list-branches > li .list-sub-group > li:last-child { margin-bottom: 20px; } .list-branches > li .list-sub-group > li:hover { background: rgba(181, 181, 181, 0.05); position: relative; } .list-branches > li.with-sub > .panel-tools { top: 15px; margin-top: 0; } .list-branches.alt > li:hover { background: transparent; } .list-branches.alt > li > div[data-toggle=collapse] { cursor: pointer; } .list-branches.alt > li > div[data-toggle=collapse]:hover, .list-branches.alt > li > div[aria-expanded=true] { background: #edfcff; } .list-branches.alt > li .media-body { position: relative; } .list-branches.alt > li .media-body .btn-complimentary { position: absolute; right: 10px; top: 50%; margin-top: -20px; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; } .list-branches.alt > li [aria-expanded=true] .media-body .btn-complimentary, .list-branches.alt > li:hover .media-body .btn-complimentary { filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; } .list-branches li:hover > .panel-tools { filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; } .list-branches li:hover > .panel-tools .popover { width: 280px; } .list-branches .panel-tools { position: absolute; right: 10px; top: 50%; margin-top: -13px; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; } .row.sticky .btn-block { padding-left: 4px; padding-right: 4px; margin-left: -1px; } .head-button > .btn { margin-top: -10px; } .modal-body .chosen-container .chosen-results { background: #b5b5b5; } .modal-body .chosen-container .chosen-results > li { background: white; } .modal-body .chosen-container .chosen-results > li.highlighted { background: #6ac6d9; } .highlight-me, .highlight-me > td { background-color: #ffff99; -moz-transition: background-color 0.3s; -o-transition: background-color 0.3s; -webkit-transition: background-color 0.3s; transition: background-color 0.3s; } table.table-bank > thead > tr > th:nth-child(1), table.table-bank > thead > tr > td:nth-child(1), table.table-bank > tbody > tr > th:nth-child(1), table.table-bank > tbody > tr > td:nth-child(1) { width: 19.62%; } table.table-bank > thead > tr > th:nth-child(2), table.table-bank > thead > tr > td:nth-child(2), table.table-bank > tbody > tr > th:nth-child(2), table.table-bank > tbody > tr > td:nth-child(2) { width: 22.91%; } table.table-bank > thead > tr > th:nth-child(3), table.table-bank > thead > tr > td:nth-child(3), table.table-bank > tbody > tr > th:nth-child(3), table.table-bank > tbody > tr > td:nth-child(3) { width: 14.03%; } table.table-bank > thead > tr > th:nth-child(4), table.table-bank > thead > tr > td:nth-child(4), table.table-bank > tbody > tr > th:nth-child(4), table.table-bank > tbody > tr > td:nth-child(4) { width: 21.6%; } table.table-bank > thead > tr > th:nth-child(5), table.table-bank > thead > tr > td:nth-child(5), table.table-bank > tbody > tr > th:nth-child(5), table.table-bank > tbody > tr > td:nth-child(5) { width: auto; } .border-connect-inactive { z-index: 1; } .border-connect-inactive path { stroke-width: 2; } .chosen-container-multi { height: auto; } .ie-9 .tt-hint { background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==") no-repeat left bottom/1px 8px, url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==") repeat-x center bottom/1px 1px, url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzZhYzZkOSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==") no-repeat right bottom/1px 8px !important; } table.table-new-users { table-layout: auto; } .input-datepicker, .input-custom-small { padding: 0; height: 15px; margin-bottom: 10px; display: block; font-size: 13px; font-size: 1.3rem; } .datepick-trigger, .revert-custom { cursor: pointer; z-index: 4; } #fund_to { padding-right: 15px; } .control-fund .chosen-container .chosen-results { max-height: none; } .always-show { display: block !important; } [data-toggle=typeahead-multiple] { width: 100% !important; padding-left: 12px !important; } [data-toggle=typeahead-multiple]:focus:-moz-placeholder { color: transparent; } [data-toggle=typeahead-multiple]:focus::-moz-placeholder { color: transparent; } [data-toggle=typeahead-multiple]:focus:-ms-input-placeholder { color: transparent; } [data-toggle=typeahead-multiple]:focus::-webkit-input-placeholder { color: transparent; } .table-credits th button, .table-transfer-request th button { margin: -5px 0; } .table-credits td, .table-transfer-request td { overflow: visible; } .table-credits td .list-toolbar, .table-transfer-request td .list-toolbar { display: inline-block; margin-top: 10px; } .table-credits td .popover.in, .table-transfer-request td .popover.in { top: auto !important; left: auto !important; width: 275px; margin-left: -275px; margin-top: -104px; } .table-credits td .popover.in.left > .arrow, .table-transfer-request td .popover.in.left > .arrow { top: 50% !important; } .table-credits td .popover, .table-transfer-request td .popover { -moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none; } .media.control-field label.error { margin-top: 8px; } table thead > tr > th.cell-from + th { padding-left: 40px; width: 150px; } table tbody > tr > td.cell-from { position: relative; overflow: visible; } table tbody > tr > td.cell-from:after { content: ""; display: block; position: absolute; left: 100%; top: 50%; margin-top: -10px; margin-left: -6px; } table tbody > tr > td.cell-from + td { width: 150px; text-align: right; } table tbody > tr > td.cell-from + td p { text-align: left; padding-left: 30px; } table tbody > tr > td .cell-from-accordion { min-height: 75px; } table tbody > tr > td .cell-from-accordion .col-auto { width: 180px; } table tbody > tr.collapse { -moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none; } table tbody > tr.collapse.in { display: table-row; } table.table-invoice .label { width: auto; padding: 0 5px; text-align: center; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } table.table-invoice > tbody > tr > td > .block { overflow: hidden; text-overflow: ellipsis; } .icon-back { vertical-align: middle; margin-top: -4px; } .panel-head .pop-notification ~ .popover.left.in { top: auto !important; left: auto !important; margin-left: -210px; margin-top: -90px; min-width: 200px; } .panel-head .pop-notification ~ .popover { -moz-transition: none; -o-transition: none; -webkit-transition: none; transition: none; } .cor-banks h4 .btn-with-icon { display: inline-block; float: left; margin-right: 10px; margin-top: -11px; } .cor-banks h4 .btn-with-icon ~ span { display: inline-block; float: left; margin-right: 10px; } .cor-banks h4 .btn-with-icon ~ span.text-small { margin-top: 4px; } .cor-bank-stats { overflow: hidden; margin-top: 10px; } .cor-bank-stats > i, .cor-bank-stats > ul { display: inline-block; float: left; margin-right: 10px; } .list-sub-inner .media-body a > span, .list-sub-inner .media-body a > i, .list-sub-inner .media-body a:visited > span, .list-sub-inner .media-body a:visited > i { display: inline-block; vertical-align: middle; } .list-sub-inner .media-body a > .text-mute, .list-sub-inner .media-body a:visited > .text-mute { margin-bottom: -4px; } .btn-create-uuid { padding: 10px 0; } #send_to ~ .chosen-container .search-field, #send_to ~ .chosen-container .search-field > input { display: block; width: 100% !important; } .txt-auto-size { line-height: 1.6; max-height: 168px; } #modal-send-report .modal-content { height: 470px; } .body-clean { background-color: white; background-image: none; } .canvasjs-chart-credit { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); opacity: 0; } #chartCreditGiven ~ .manual-title { margin-left: 15px; } .node { cursor: pointer; } .node circle { fill: #fff; stroke: steelblue; stroke-width: 1.5px; } .link { fill: none; stroke: #ccc; stroke-width: 1.5px; } .templink { fill: none; stroke: red; stroke-width: 3px; } .ghostCircle { display: none; } .ghostCircle.show { display: block; } .activeDrag .ghostCircle { display: none; } #select_open_messages_chosen .search-choice > span { display: inline-block; max-width: 25px; overflow: hidden; } .ie-9 .form-control:disabled, .ie-9 [type=text]:disabled { background-color: transparent; } .ie-9 .table-credits th button, .ie-9 .table-transfer-request th button { padding-top: 8px; } .wrap-tree { overflow: hidden; } .better-placehoder { white-space: nowrap; overflow: hidden; max-width: 100%; text-overflow: ellipsis; display: block; min-height: 34px; }
-
Eloan
<!DOCTYPE html> <html lang="he" dir="rtl"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>eLoan V3</title> <link rel="shortcut icon" type="image/x-icon" href="css/images/favicon.ico" /> <!-- Vendor Styles --> <link rel="stylesheet" href="vendor/owl-carousel/owl.carousel.min.css" /> <link rel="stylesheet" href="vendor/dropdown/dropdown.css" /> <!-- App Styles --> <link rel="stylesheet" href="css/style.css" /> <!-- Vendor JS --> <script src="vendor/jquery-1.11.3.min.js"></script> <script src="vendor/owl-carousel/owl.carousel.min.js"></script> <script src="vendor/dropdown/core.js"></script> <script src="vendor/dropdown/touch.js"></script> <script src="vendor/dropdown/dropdown.js"></script> <script src="vendor/Chart.min.js"></script> <!-- App JS --> <script src="js/functions.js"></script> </head> <body> <div class="wrapper"> <header class="header header-home"> <!-- add header-collapsed class when scrolled (only on header-home) --> <div class="header-top"> <div class="shell"> <div class="header-top-inner"> <div class="header-contact"> <i class="ico-headset"></i> <span>9779*</span> </div><!-- /.header-contact --> <div class="header-slogan"> <p>שומרים עלי מאובטח/ת תמיד. <a href="#">למד/י עוד</a></p> </div><!-- /.header-slogan --> <div class="header-access"> <span>התחברות דרך</span> <div class="socials"> <ul> <li> <a href="#"> <i class="ico-facebook-green"></i> </a> </li> <li> <a href="#"> <i class="ico-twitter-green"></i> </a> </li> </ul> </div><!-- /.socials --> <p>או <a href="#">התחברות ישירה</a></p> </div><!-- /.header-access --> <a href="#" class="phone"> <i class="ico-mobile"></i> </a> </div><!-- /.header-top-inner --> </div><!-- /.shell --> </div><!-- /.header-top --> <div class="header-bottom"> <div class="shell"> <div class="header-bottom-inner"> <a href="#" class="logo"> <img src="css/images/logo-eloan@2x.png" alt="" width="173" height="39"> </a> <a href="#" class="nav-trigger"> <span class="bar"></span> <span class="bar"></span> <span class="bar"></span> </a> <nav class="nav"> <ul> <li> <a href="#">איך זה עובד</a> </li> <li class="has-dd"> <a href="#"> <span>אודות</span> <span class="caret"></span> </a> <div class="nav-dropdown"> <h2>אודות</h2> <a href="#" class="go-back"> <i class="ico-arrow-left"></i> </a> <ul> <li> <a href="#">הלוואות הוגנות</a> </li> <li> <a href="#">הנהלת החברה</a> </li> <li> <a href="#">ELOAN בתקשורת</a> </li> <li> <a href="#">שותפים</a> </li> <li> <a href="#">קריירה</a> </li> </ul> </div><!-- /.nav-dropdown --> </li> <li> <a href="#">שאלות נפוצות</a> </li> <li> <a href="#">יצירת קשר</a> </li> </ul> <a href="#" class="btn btn-orange"> רוצה הלוואה <small>3.6%</small> </a> <a href="#" class="btn btn-orange"> רוצה להשקיע <small>5%</small> </a> </nav><!-- /.nav --> </div><!-- /.header-bottom-inner --> </div><!-- /.shell --> </div><!-- /.header-bottom --> </header><!-- /.header --> <div class="intro intro-home"> <div class="shell"> <div class="intro-inner"> <div class="intro-body"> <h1>הלוואות הוגנות בין אנשים</h1> <h3>עד כה מומנו 12,700,000 ש" הלוואות בעבור 678 לווים על ידי 800 מלווים</h3> <div class="intro-box"> <div class="intro-box-head"> <a href="#" class="btn btn-orange"> <span>רוצה הלוואה</span> <small>החל מ-3.6%</small> </a> <a href="#" class="close-box">X</a> </div><!-- /.intro-box-head --> <div class="intro-box-body"> <div class="form form-get-loan"> <form action="?" method="post"> <header class="form-head"> <h6>הצטרפות ישירה</h6> </header><!-- /.form-head --> <div class="form-body"> <div class="form-row"> <div class="form-controls"> <input type="text" name="field-name" id="field-name" class="field"> <i class="ico-username"></i> </div><!-- /.form-controls form-controls-username --> </div><!-- /.form-row --> <div class="form-row"> <div class="form-controls"> <input type="text" name="field-email" id="field-email" class="field"> <i class="ico-email"></i> </div><!-- /.form-controls --> </div><!-- /.form-row --> </div><!-- /.form-body --> <div class="form-foot"> <a href="#" class="btn btn-green">הגש בקשה</a> <p>הצטרפות חברתית מהירה</p> <a href="#" class="btn btn-facebook"> <span>פייסבוק</span> <i class="ico-facebook"></i> </a> <div class="form-foot-actions"> <button type="reset" class="btn btn-reset">ביטול</button> <p>הצטרפת? <a href="#">התחברות</a></p> </div><!-- /.form-foot-actions --> </div><!-- /.form-foot --> </form> </div><!-- /.form form-get-loan --> <a href="#" class="how">איך זה עובד?</a> </div><!-- /.intro-box-body --> </div><!-- /.intro-box --> <div class="intro-box"> <div class="intro-box-head"> <a href="#" class="btn btn-orange"> <span>רוצה להשקיע</span> <small>בתשואה ממוצעת 5%</small> </a> <a href="#" class="close-box">X</a> </div><!-- /.intro-box-head --> <div class="intro-box-body"> <div class="form form-get-loan"> <form action="?" method="post"> <header class="form-head"> <h6>הצטרפות ישירה</h6> </header><!-- /.form-head --> <div class="form-body"> <div class="form-row"> <div class="form-controls"> <input type="text" name="field-name2" id="field-name2" class="field"> <i class="ico-username"></i> </div><!-- /.form-controls form-controls-username --> </div><!-- /.form-row --> <div class="form-row"> <div class="form-controls"> <input type="text" name="field-email2" id="field-email2" class="field"> <i class="ico-lock"></i> </div><!-- /.form-controls --> </div><!-- /.form-row --> </div><!-- /.form-body --> <div class="form-foot"> <a href="#" class="btn btn-green">הגש בקשה</a> <p>הצטרפות חברתית מהירה</p> <a href="#" class="btn btn-facebook"> <span>פייסבוק</span> <i class="ico-facebook"></i> </a> <div class="form-foot-actions"> <button type="reset" class="btn btn-reset">ביטול</button> <p>הצטרפת? <a href="#">התחברות</a></p> </div><!-- /.form-foot-actions --> </div><!-- /.form-foot --> </form> </div><!-- /.form form-get-loan --> <a href="#" class="how">איך זה עובד?</a> </div><!-- /.intro-box-body --> </div><!-- /.intro-box --> </div><!-- /.intro-body --> <div class="intro-bottom-elem"></div><!-- /.intro-bottom-elem --> </div><!-- /.intro-inner --> </div><!-- /.shell --> </div><!-- /.intro --> <div class="main"> <section class="section section-loans"> <div class="shell"> <div class="section-inner"> <header class="section-head"> <h2> <a href="#"> הלוואות בזמן אמת<span>הלוואות</span> </a> </h2> <div class="section-head-actions"> <div class="slider-ticker-wrapper"> <div class="slider slider-small-ticker"> <div class="slides owl-carousel"> <div class="slide"> <i class="ico-ticker"></i> <p>בלי טובות! לדעת בדיוק כמה תעלה ההלוואה. לפני שמתחייבים אליה</p> </div><!-- /.slide --> <div class="slide"> <i class="ico-ticker"></i> <p>בלי טובות! לדעת בדיוק כמה תעלה ההלוואה. לפני שמתחייבים אליה 2</p> </div><!-- /.slide --> <div class="slide"> <i class="ico-ticker"></i> <p>בלי טובות! לדעת בדיוק כמה תעלה ההלוואה. לפני שמתחייבים אליה 3</p> </div><!-- /.slide --> </div><!-- /.slides --> </div><!-- /.slider --> </div> <a href="#" class="btn btn-cat"> <span> <i class="ico-thumbs-up"></i> <small>נבדק על ידי</small> </span> <img src="css/images/logo-partner.png" alt="" width="131" height="43"> </a> </div><!-- /.section-head-actions --> </header><!-- /.section-head --> <div class="section-body"> <div class="slider slider-loans"> <div class="slides owl-carousel"> <div class="slide"> <header class="slide-head"> <h3>שיפוץ דירה</h3> </header><!-- /.slide-head --> <div class="slide-body"> <ul> <li> <span>סכום בקשה</span> <strong>25,000 ₪</strong> </li> <li> <span>תקופה</span> <strong>24 חודשים</strong> </li> <li> <span>נותר למימון</span> <strong>2,900 ₪</strong> </li> <li> <span>החזר חודשי</span> <strong>1,042 ₪</strong> </li> </ul> <p>לקראת כניסה לבית חדש שנקנה אחרי 10 שנים של שכירות. זקוקים להלוואה בתנאים טובים על מנת לרכוש תכולה לבית</p> </div><!-- /.slide-body --> <footer class="slide-foot"> <p> <i class="ico-user"></i> <span>3 מחבריך השקיעו כאן</span> <a href="#" class="share"> <i class="ico-share"></i> </a> </p> <a href="#" class="btn btn-orange"> <span class="btn-text">רוצה להשקיע</span> <span class="btn-text-secondary"> <small>תשואה</small> 7.8% </span> </a> </footer><!-- /.slide-foot --> </div><!-- /.slide --> <div class="slide"> <header class="slide-head"> <h3>שיפוץ דירה</h3> </header><!-- /.slide-head --> <div class="slide-body"> <ul> <li> <span>סכום בקשה</span> <strong>20,000 ₪</strong> </li> <li> <span>תקופה</span> <strong>60 חודשים</strong> </li> <li> <span>נותר למימון</span> <strong>10,200 ₪</strong> </li> <li> <span>החזר חודשי</span> <strong>393 ₪</strong> </li> </ul> </div><!-- /.slide-body --> <footer class="slide-foot"> <p> <i class="ico-user"></i> <span>2 מחבריך השקיעו כאן</span> <a href="#" class="share"> <i class="ico-share"></i> </a> </p> <div class="amount"> <h4>סכום להשקעה</h4> <button type="reset" class="btn-reset">ביטול</button> <div class="counter"> <a href="#" class="count-down"> <i class="ico-minus"></i> </a> <input type="text" name="field-count" id="field-count" class="counter-field" readonly value="300"> <a href="#" class="count-up"> <i class="ico-plus"></i> </a> </div><!-- /.counter --> </div><!-- /.amount --> <a href="#" class="btn btn-white">בצע השקעה</a> </footer><!-- /.slide-foot --> </div><!-- /.slide --> <div class="slide"> <header class="slide-head"> <h3>סגירת מינוס</h3> <div class="label"> <span>חברתי</span> </div><!-- /.label --> </header><!-- /.slide-head --> <div class="slide-body"> <ul> <li> <span>סכום בקשה</span> <strong>25,000 ₪</strong> </li> <li> <span>תקופה</span> <strong>36 חודשים</strong> </li> <li> <span>נותר למימון</span> <strong>12,300 ₪</strong> </li> <li> <span>החזר חודשי</span> <strong>815 ₪</strong> </li> </ul> <p>שלום רב, אני רופא. שכר גבוה. כעת מסגרת השראי הבנקאית מנוצלת במלואה. מעוניין ב”חמצן”. תודה, יוזמה נפלאה, מאיר</p> </div><!-- /.slide-body --> <footer class="slide-foot"> <p> <i class="ico-user"></i> <span>18 מחבריך השקיעו כאן</span> <a href="#" class="share"> <i class="ico-share"></i> </a> </p> <a href="#" class="btn btn-orange"> <span class="btn-text">רוצה להשקיע</span> <span class="btn-text-secondary"> <small>תשואה</small> 5.3% </span> </a> </footer><!-- /.slide-foot --> </div><!-- /.slide --> <div class="slide"> <header class="slide-head"> <h3>שיפוץ דירה</h3> </header><!-- /.slide-head --> <div class="slide-body"> <ul> <li> <span>סכום בקשה</span> <strong>25,000 ₪</strong> </li> <li> <span>תקופה</span> <strong>24 חודשים</strong> </li> <li> <span>נותר למימון</span> <strong>2,900 ₪</strong> </li> <li> <span>החזר חודשי</span> <strong>1,042 ₪</strong> </li> </ul> <p>לקראת כניסה לבית חדש שנקנה אחרי 10 שנים של שכירות. זקוקים להלוואה בתנאים טובים על מנת לרכוש תכולה לבית</p> </div><!-- /.slide-body --> <footer class="slide-foot"> <p> <i class="ico-user"></i> <span>3 מחבריך השקיעו כאן</span> <a href="#" class="share"> <i class="ico-share"></i> </a> </p> <a href="#" class="btn btn-orange"> <span class="btn-text">רוצה להשקיע</span> <span class="btn-text-secondary"> <small>תשואה</small> 7.8% </span> </a> </footer><!-- /.slide-foot --> </div><!-- /.slide --> </div><!-- /.slides --> </div><!-- /.slider slider-loans --> </div><!-- /.section-body --> </div><!-- /.section-inner --> </div><!-- /.shell --> </section><!-- /.section section-loans --> <section class="section section-ticker"> <div class="section-body"> <div class="slider slider-ticker"> <div class="slides owl-carousel"> <div class="slide"> <p>34 הלוואות אושרו השבוע</p> </div><!-- /.slide --> <div class="slide"> <p>26,894 ש”ח השקעות חדשות היום</p> </div><!-- /.slide --> <div class="slide"> <p>שיא חדש - 23% השקעות חברתיות השבוע</p> </div><!-- /.slide --> <div class="slide"> <p>187,056 ש”ח הלוואות הושלמו השבוע</p> </div><!-- /.slide --> <div class="slide"> <p>חודש מודעות סכרת. 3,000 ש”ח תרומות</p> </div><!-- /.slide --> </div><!-- /.slides --> </div><!-- /.slider --> </div><!-- /.section-body --> </section><!-- /.section section-ticker --> <section class="section section-graph"> <div class="shell"> <div class="section-inner"> <header class="section-head"> <h2> <a href="#">איך זה עובד?</a> </h2> </header><!-- /.section-head --> <div class="section-body"> <div class="section-right show" id="tab-right"> <ol> <li> <h3> הגשת בקשה <span>בתהליך קצר ונוח און-ליין</span> </h3> <div class="icon"> <i class="ico-pad"></i> </div><!-- /.icon --> </li> <li> <h3> אישור / דחייה <span>תוך דקות וקבלת ההלוואה בתוך 48 שעות</span> </h3> <div class="icon"> <i class="ico-money"></i> </div><!-- /.icon --> </li> <li> <h3> קביעת החזר חודשי <span>על פי ההעדפות שלך</span> </h3> <div class="icon"> <i class="ico-calendar"></i> </div><!-- /.icon --> </li> </ol> <a href="#" class="link-more">למד/י עוד ></a> </div><!-- /.section-right --> <div class="section-center"> <div class="diagram-tabs"> <ul> <li> <a href="#tab-right" class="current"> <h2> לווה <span>למד/י עוד ></span> </h2> </a> </li> <li> <a href="#tab-center"> <img src="css/images/logo-blue@2x.png" alt="" width="151" height="35" class="img-desktop"> <img src="css/images/logo-eloan@2x.png" alt="" width="151" height="35" class="img-mobile"> </a> </li> <li> <a href="#tab-left"> <h2> משקיע <span>למד/י עוד ></span> </h2> </a> </li> </ul> </div><!-- /.diagram-tabs --> <div id="tab-center"> <h3>מה אנחנו עושים?</h3> <ul class="list-squares"> <li>בדיקת מבקש ההלוואה באמצעו תהליך החיתום מתקדם.</li> <li>טיפול בגביית הכסף להשלמת גביית החוב.</li> <li>שירות ותפעול 6 ימים בשבוע</li> </ul><!-- /.list-squares --> </div> </div><!-- /.section-center --> <div class="section-left" id="tab-left"> <ol> <li> <h3> הרשמה והעברת סכום <span>הכסף מועבר לחשבון נאמנות כך כך שהוא מוגן בטוח ומופרד מ-eLoan</span> </h3> <div class="icon"> <i class="ico-graph"></i> </div><!-- /.icon --> </li> <li> <h3> פיזור סיכונים מושכל <span>באופן ידני או חכם באמצעות מערכת Auto Invest. </span> </h3> <div class="icon"> <i class="ico-sun"></i> </div><!-- /.icon --> </li> <li> <h3> תשואה אטרקטיבית <span>יציבה וגבוהה מהממוצע בשוק </span> </h3> <div class="icon"> <i class="ico-diamond"></i> </div><!-- /.icon --> </li> </ol> <a href="#" class="link-more">למד/י עוד ></a> </div><!-- /.section-left --> </div><!-- /.section-body --> </div><!-- /.section-inner --> </div><!-- /.shell --> </section><!-- /.section section-graph --> <section class="section section-articles"> <div class="shell"> <div class="section-inner"> <header class="section-head"> <h2> <a href="#"> כותבים עלינו <span>לעוד כתבות עלינו</span> </a> </h2> </header><!-- /.section-head --> <div class="section-body"> <div class="slider slider-articles"> <div class="slides owl-carousel"> <div class="slide"> <div class="slide-image"> <a href="#"> <img src="css/images/temp/placeholder-img1.jpg" height="173" width="309" alt=""> </a> </div><!-- /.slide-image --> <div class="slide-content"> <h3> <a href="#">נציגי הלוואות ההמונים זומנו לוועדה להגברת התחרות במערכת הבנקאית</a> </h3> <p>חברת ההלוואות באינטרנט eLoan לחברי ועדת שטרום: כדי לגדול ולזכות באמון הציבור על המדינה להירשם כמלווה בפלטפורמות שלהם, וגם להעניק ביטוח על שיעור מסוים מההלוואה: "צעד כזה יהיה הכרה בליגטימיות שלנו"</p> </div><!-- /.slide-content --> </div><!-- /.slide --> <div class="slide"> <div class="slide-image"> <a href="#"> <img src="css/images/temp/placeholder-img2.jpg" height="173" width="309" alt=""> </a> </div><!-- /.slide-image --> <div class="slide-content"> <h3> <a href="#">הלוואת המונים - דרך חדשה להלוות כסף בישראל</a> </h3> <p>במהלך השנים האחרונות הוקמו מגוון בתי עסק בכל רחבי הארץ והתחרות הלכה וגדלה. כיום, צריך כל בעל עסק לא רק להכיר את העסק של עצמו- את יתרונותיו, חזקותיו, חולשותיו, מטרותיו לדאוג למיתוג נכון, שם טוב, ערוצי שיווק איכותיים וכו' אלא גם להכיר את מתחריו ולגרום לשירותיו להיות טובים יותר.</p> </div><!-- /.slide-content --> </div><!-- /.slide --> <div class="slide"> <div class="slide-image"> <a href="#"> <img src="css/images/temp/placeholder-img3.jpg" height="173" width="309" alt=""> </a> </div><!-- /.slide-image --> <div class="slide-content"> <h3> <a href="#">הלוואות לעסקים</a> </h3> <p>ניתן לקבל הלוואות לעסקים ממספר גורמים- מהבנקים הגדולים, מקרנות שונות, מחברות מימון, מחברות אשראי ועוד, אך התנאים הניתנים אינם נוחים שכן הלווים צריכים לשלם עבור תיווך והריביות גבוהות עלולים להצטבר לסכומי כסף גבוהים ולהקשות על בעל העסק. לשמחתנו ולשמחתכם- בעלי עסקים, ישנן דרכים אחרות לקבל הלוואות לעסקים.</p> </div><!-- /.slide-content --> </div><!-- /.slide --> <div class="slide"> <div class="slide-image"> <a href="#"> <img src="css/images/temp/placeholder-img2.jpg" height="173" width="309" alt=""> </a> </div><!-- /.slide-image --> <div class="slide-content"> <h3> <a href="#">הלוואת המונים - דרך חדשה להלוות כסף בישראל</a> </h3> <p>במהלך השנים האחרונות הוקמו מגוון בתי עסק בכל רחבי הארץ והתחרות הלכה וגדלה. כיום, צריך כל בעל עסק לא רק להכיר את העסק של עצמו- את יתרונותיו, חזקותיו, חולשותיו, מטרותיו לדאוג למיתוג נכון, שם טוב, ערוצי שיווק איכותיים וכו' אלא גם להכיר את מתחריו ולגרום לשירותיו להיות טובים יותר.</p> </div><!-- /.slide-content --> </div><!-- /.slide --> </div><!-- /.slides --> </div><!-- /.slider slider-articles --> </div><!-- /.section-body --> </div><!-- /.section-inner --> </div><!-- /.shell --> </section><!-- /.section section-articles --> <section class="section-media"> <header class="section-head"> <h2>ELOAN בתקשורת <a href="#">לעוד כתבות</a></h2> </header><!-- /.section-head --> <div class="section-body"> <div class="slider slider-media"> <div class="slides owl-carousel"> <div class="slide"> <div class="slide-image"> <a href="#"> <img src="css/images/temp/media1.png" height="71" width="71" alt=""> </a> </div><!-- /.slide-image --> </div><!-- /.slide --> <div class="slide"> <div class="slide-image"> <a href="#"> <img src="css/images/temp/media2.png" height="47" width="209" alt=""> </a> </div><!-- /.slide-image --> </div><!-- /.slide --> <div class="slide"> <div class="slide-image"> <a href="#"> <img src="css/images/temp/media3.png" height="63" width="171" alt=""> </a> </div><!-- /.slide-image --> </div><!-- /.slide --> <div class="slide"> <div class="slide-image"> <a href="#"> <img src="css/images/temp/media4.png" height="61" width="248" alt=""> </a> </div><!-- /.slide-image --> </div><!-- /.slide --> <div class="slide"> <div class="slide-image"> <a href="#"> <img src="css/images/temp/media5.png" height="61" width="210" alt=""> </a> </div><!-- /.slide-image --> </div><!-- /.slide --> <div class="slide"> <div class="slide-image"> <a href="#"> <img src="css/images/temp/media6.png" height="71" width="71" alt=""> </a> </div><!-- /.slide-image --> </div><!-- /.slide --> </div><!-- /.slides --> </div><!-- /.slider slider-media --> </div><!-- /.section-body --> </section><!-- /.section-media --> <section class="section section-testimonial"> <div class="shell"> <div class="section-inner"> <header class="section-head"> <h2> <a href="#"> האנשים מאחורי ההלוואות <span>לעוד סיפורים של לווים ומלווים</span> </a> </h2> </header><!-- /.section-head --> <div class="section-body"> <div class="slider slider-testimonials"> <div class="slides owl-carousel"> <div class="slide"> <div class="slide-image"> <img src="css/images/temp/testimonial-img.jpg" height="406" width="499" alt=""> </div><!-- /.slide-image --> <div class="slide-content"> <blockquote> <p>“הכל היה פשוט כל כך, הגשתי בקשה, אושרתי ומיד לאחר מכן עודכנתי שהכסף כבר נמצא בחשבון בנק”</p> <cite>סרינה, קרית אתא</cite> </blockquote> </div><!-- /.slide-content --> </div><!-- /.slide --> <div class="slide"> <div class="slide-image"> <img src="css/images/temp/testimonial-img.jpg" height="406" width="499" alt=""> </div><!-- /.slide-image --> <div class="slide-content"> <blockquote> <p>“הכל היה פשוט כל כך, הגשתי בקשה, אושרתי ומיד לאחר מכן עודכנתי שהכסף כבר נמצא בחשבון בנק”</p> <cite>סרינה, קרית אתא</cite> </blockquote> </div><!-- /.slide-content --> </div><!-- /.slide --> <div class="slide"> <div class="slide-image"> <img src="css/images/temp/testimonial-img.jpg" height="406" width="499" alt=""> </div><!-- /.slide-image --> <div class="slide-content"> <blockquote> <p>“הכל היה פשוט כל כך, הגשתי בקשה, אושרתי ומיד לאחר מכן עודכנתי שהכסף כבר נמצא בחשבון בנק”</p> <cite>סרינה, קרית אתא</cite> </blockquote> </div><!-- /.slide-content --> </div><!-- /.slide --> <div class="slide"> <div class="slide-image"> <img src="css/images/temp/testimonial-img.jpg" height="406" width="499" alt=""> </div><!-- /.slide-image --> <div class="slide-content"> <blockquote> <p>“הכל היה פשוט כל כך, הגשתי בקשה, אושרתי ומיד לאחר מכן עודכנתי שהכסף כבר נמצא בחשבון בנק”</p> <cite>סרינה, קרית אתא</cite> </blockquote> </div><!-- /.slide-content --> </div><!-- /.slide --> <div class="slide"> <div class="slide-image"> <img src="css/images/temp/testimonial-img.jpg" height="406" width="499" alt=""> </div><!-- /.slide-image --> <div class="slide-content"> <blockquote> <p>“הכל היה פשוט כל כך, הגשתי בקשה, אושרתי ומיד לאחר מכן עודכנתי שהכסף כבר נמצא בחשבון בנק”</p> <cite>סרינה, קרית אתא</cite> </blockquote> </div><!-- /.slide-content --> </div><!-- /.slide --> <div class="slide"> <div class="slide-image"> <img src="css/images/temp/testimonial-img.jpg" height="406" width="499" alt=""> </div><!-- /.slide-image --> <div class="slide-content"> <blockquote> <p>“הכל היה פשוט כל כך, הגשתי בקשה, אושרתי ומיד לאחר מכן עודכנתי שהכסף כבר נמצא בחשבון בנק”</p> <cite>סרינה, קרית אתא</cite> </blockquote> </div><!-- /.slide-content --> </div><!-- /.slide --> </div><!-- /.slides --> </div><!-- /.slider slider-testimonials --> <div class="slider-testimonials-thumbs"> <ul> <li class="current"> <a href="#"> <img src="css/images/temp/testimonial-thumb1.jpg" alt="" width="70" height="70"> </a> </li> <li> <a href="#"> <img src="css/images/temp/testimonial-thumb2.jpg" alt="" width="70" height="70"> </a> </li> <li> <a href="#"> <img src="css/images/temp/testimonial-thumb3.jpg" alt="" width="70" height="70"> </a> </li> <li> <a href="#"> <img src="css/images/temp/testimonial-thumb4.jpg" alt="" width="70" height="70"> </a> </li> <li> <a href="#"> <img src="css/images/temp/testimonial-thumb5.jpg" alt="" width="70" height="70"> </a> </li> <li> <a href="#"> <img src="css/images/temp/testimonial-thumb6.jpg" alt="" width="70" height="70"> </a> </li> </ul> </div><!-- /.slider-testimonials-thumbs --> </div><!-- /.section-body --> </div><!-- /.section-inner --> </div><!-- /.shell --> </section><!-- /.section section-testimonial --> <section class="section section-stat"> <div class="shell"> <div class="section-inner"> <header class="section-head"> <h2> <a href="#"> הלוואות הוגנות במספרים <span>לעוד מספרים</span> </a> </h2> </header><!-- /.section-head --> <div class="section-body"> <ul class="list-stats"> <li> <h2> <i class="ico-handshake"></i> <span>8,556</span> </h2> <h3>סה”כ לווים</h3> <a href="#">לוח הלוואות</a> </li> <li> <h2> <i class="ico-tophat"></i> <span>6,640</span> </h2> <h3>משקיעים פעילים</h3> <a href="#">התחל/י להשקיע</a> </li> <li> <h2> <i class="ico-moneyhand"></i> <span>10,540,332</span> </h2> <h3>₪ הלוואות עד היום</h3> <a href="#">מה מימננו?</a> </li> <li> <h2> <i class="ico-wallet"></i> <span>112,949</span> </h2> <h3>₪ ריבית שולמה עד היום</h3> <a href="#">איך זה עובד?</a> </li> </ul><!-- /.list-stats --> <div class="slider slider-icons"> <div class="slides owl-carousel"> <div class="slide"> <div class="slide-icon"> <i class="ico-stat-woman"></i> </div><!-- /.slide-icon --> <div class="slide-content"> <h3>42% מהלווים <span>שלנו הן נשים</span></h3> </div><!-- /.slide-content --> </div><!-- /.slide --> <div class="slide"> <div class="slide-icon"> <i class="ico-stat-calc"></i> </div><!-- /.slide-icon --> <div class="slide-content"> <h3>800 הלוואות<span>מידי חודש</span></h3> </div><!-- /.slide-content --> </div><!-- /.slide --> <div class="slide"> <div class="slide-icon"> <i class="ico-stat-cake"></i> </div><!-- /.slide-icon --> <div class="slide-content"> <h3>הלווה הצעיר ביותר<span>חגג 21 השנה</span></h3> </div><!-- /.slide-content --> </div><!-- /.slide --> <div class="slide"> <div class="slide-icon"> <i class="ico-stat-files"></i> </div><!-- /.slide-icon --> <div class="slide-content"> <h3>4,934 מסמכים<span>מידי שבוע</span></h3> </div><!-- /.slide-content --> </div><!-- /.slide --> <div class="slide"> <div class="slide-icon"> <i class="ico-stat-woman"></i> </div><!-- /.slide-icon --> <div class="slide-content"> <h3>42% מהלווים <span>שלנו הן נשים</span></h3> </div><!-- /.slide-content --> </div><!-- /.slide --> </div><!-- /.slides --> </div><!-- /.slider slider-icons --> </div><!-- /.section-body --> </div><!-- /.section-inner --> </div><!-- /.shell --> </section><!-- /.section section-stat --> <section class="section section-channel"> <div class="shell"> <div class="section-inner"> <header class="section-head"> <h2> <a href="#"> הערוץ שלנו <span>עוד סרטונים</span> </a> </h2> </header><!-- /.section-head --> <div class="section-body"> <div class="slider slider-channel"> <div class="slides owl-carousel"> <div class="slide"> <div class="slide-video"> <img src="css/images/temp/placeholder-img4.jpg" height="328" width="585" alt=""> </div><!-- /.slide-video --> <div class="slide-content"> <h3>איך נרשמים?</h3> <p>נולום ארווס סאפיאן - פוסיליס קוויס, אקווזמן קוואזי במר מודוף. אודיפו בלאסטיק מונופץ קליר, בנפת נפקט למסון בלרק - וענוף הועניב היושבב שערש שמחויט - שלושע ותלברו חשלו שעותלשך וחאית נובש ערששף. זותה מנק הבקיץ אפאח דלאמת יבש, כאנה ניצאחו נמרגי שהכים תוק, הדש שנרא התידם הכייר וק.</p> </div><!-- /.slide-content --> </div><!-- /.slide --> <div class="slide"> <div class="slide-video"> <img src="css/images/temp/placeholder-img4.jpg" alt=""> </div><!-- /.slide-video --> <div class="slide-content"> <h3>איך נרשמים?</h3> <p>נולום ארווס סאפיאן - פוסיליס קוויס, אקווזמן קוואזי במר מודוף. אודיפו בלאסטיק מונופץ קליר, בנפת נפקט למסון בלרק - וענוף הועניב היושבב שערש שמחויט - שלושע ותלברו חשלו שעותלשך וחאית נובש ערששף. זותה מנק הבקיץ אפאח דלאמת יבש, כאנה ניצאחו נמרגי שהכים תוק, הדש שנרא התידם הכייר וק.</p> </div><!-- /.slide-content --> </div><!-- /.slide --> <div class="slide"> <div class="slide-video"> <img src="css/images/temp/placeholder-img4.jpg" alt=""> </div><!-- /.slide-video --> <div class="slide-content"> <h3>איך נרשמים?</h3> <p>נולום ארווס סאפיאן - פוסיליס קוויס, אקווזמן קוואזי במר מודוף. אודיפו בלאסטיק מונופץ קליר, בנפת נפקט למסון בלרק - וענוף הועניב היושבב שערש שמחויט - שלושע ותלברו חשלו שעותלשך וחאית נובש ערששף. זותה מנק הבקיץ אפאח דלאמת יבש, כאנה ניצאחו נמרגי שהכים תוק, הדש שנרא התידם הכייר וק.</p> </div><!-- /.slide-content --> </div><!-- /.slide --> <div class="slide"> <div class="slide-video"> <img src="css/images/temp/placeholder-img4.jpg" alt=""> </div><!-- /.slide-video --> <div class="slide-content"> <h3>איך נרשמים?</h3> <p>נולום ארווס סאפיאן - פוסיליס קוויס, אקווזמן קוואזי במר מודוף. אודיפו בלאסטיק מונופץ קליר, בנפת נפקט למסון בלרק - וענוף הועניב היושבב שערש שמחויט - שלושע ותלברו חשלו שעותלשך וחאית נובש ערששף. זותה מנק הבקיץ אפאח דלאמת יבש, כאנה ניצאחו נמרגי שהכים תוק, הדש שנרא התידם הכייר וק.</p> </div><!-- /.slide-content --> </div><!-- /.slide --> <div class="slide"> <div class="slide-video"> <img src="css/images/temp/placeholder-img4.jpg" alt=""> </div><!-- /.slide-video --> <div class="slide-content"> <h3>איך נרשמים?</h3> <p>נולום ארווס סאפיאן - פוסיליס קוויס, אקווזמן קוואזי במר מודוף. אודיפו בלאסטיק מונופץ קליר, בנפת נפקט למסון בלרק - וענוף הועניב היושבב שערש שמחויט - שלושע ותלברו חשלו שעותלשך וחאית נובש ערששף. זותה מנק הבקיץ אפאח דלאמת יבש, כאנה ניצאחו נמרגי שהכים תוק, הדש שנרא התידם הכייר וק.</p> </div><!-- /.slide-content --> </div><!-- /.slide --> <div class="slide"> <div class="slide-video"> <img src="css/images/temp/placeholder-img4.jpg" alt=""> </div><!-- /.slide-video --> <div class="slide-content"> <h3>איך נרשמים?</h3> <p>נולום ארווס סאפיאן - פוסיליס קוויס, אקווזמן קוואזי במר מודוף. אודיפו בלאסטיק מונופץ קליר, בנפת נפקט למסון בלרק - וענוף הועניב היושבב שערש שמחויט - שלושע ותלברו חשלו שעותלשך וחאית נובש ערששף. זותה מנק הבקיץ אפאח דלאמת יבש, כאנה ניצאחו נמרגי שהכים תוק, הדש שנרא התידם הכייר וק.</p> </div><!-- /.slide-content --> </div><!-- /.slide --> </div><!-- /.slides --> </div><!-- /.slider slider-channel --> <div class="slider-channel-thumbs"> <ul> <li class="current"> <a href="#"> <img src="css/images/temp/channel-thumb1.jpg" alt=""> </a> </li> <li> <a href="#"> <img src="css/images/temp/channel-thumb2.jpg" alt=""> </a> </li> <li> <a href="#"> <img src="css/images/temp/channel-thumb3.jpg" alt=""> </a> </li> <li> <a href="#"> <img src="css/images/temp/channel-thumb4.jpg" alt=""> </a> </li> <li> <a href="#"> <img src="css/images/temp/channel-thumb5.jpg" alt=""> </a> </li> <li> <a href="#"> <img src="css/images/temp/channel-thumb6.jpg" alt=""> </a> </li> </ul> </div><!-- /.slider-channel-thumbs --> </div><!-- /.section-body --> </div><!-- /.section-inner --> </div><!-- /.shell --> </section><!-- /.section section-channel --> </div><!-- /.main --> <footer class="footer"> <div class="shell"> <div class="footer-inner clear"> <div class="footer-nav"> <nav class="nav-footer"> <ul> <li> <a href="#">הלוואות חברתיות</a> </li> <li> <a href="#">שאלות ותשובות</a> </li> <li> <a href="#">לוח הלוואות</a> </li> </ul> </nav><!-- /.nav --> </div><!-- /.footer-nav --> <div class="footer-nav"> <nav class="nav-footer"> <ul> <li> <a href="#">סיכוני אשראי</a> </li> <li> <a href="#">הצטרף כמשקיע</a> </li> <li> <a href="#">קח הלוואה</a> </li> </ul> </nav><!-- /.nav --> </div><!-- /.footer-nav --> <div class="footer-nav"> <nav class="nav-footer"> <ul> <li> <a href="#">הלוואות לעסקים</a> </li> <li> <a href="#">מימון לרכב</a> </li> <li> <a href="#">הלוואות חוץ בנקאיות</a> </li> </ul> </nav><!-- /.nav --> </div><!-- /.footer-nav --> <div class="footer-nav"> <nav class="nav-footer"> <ul> <li> <a href="#">הנהלת החברה</a> </li> <li> <a href="#">הבלוג שלנו</a> </li> <li> <a href="#">מדיה ויחסי ציבור</a> </li> <li> <a href="#">שותפים</a> </li> <li> <a href="#">קריירה</a> </li> <li> <a href="#">יצירת קשר</a> </li> </ul> </nav><!-- /.nav --> </div><!-- /.footer-nav --> <div class="footer-socials"> <ul> <li> <a href="#"> <i class="ico-facebook"></i> </a> </li> <li> <a href="#"> <i class="ico-twitter"></i> </a> </li> <li> <a href="#"> <i class="ico-linkedin"></i> </a> </li> <li> <a href="#"> <i class="ico-youtube"></i> </a> </li> </ul> </div><!-- /.socials --> <div class="copyright"> <p>eLoan 2015 ©</p> </div><!-- /.copyright --> </div><!-- /.footer-inner --> </div><!-- /.shell --> </footer><!-- /.footer --> </div><!-- /.wrapper --> </body> </html>
/* Table of Contents update on Mon Dec 21 2015 15:51:57 GMT+0200 (FLE Standard Time) I. Generic -------------------------------------- 01. Reset ------------------------------------ 02. Fonts ------------------------------------ Almoni DL AAA ---------------------------- Open Sans Hebrew ------------------------- 03. Base ------------------------------------- Mobile ----------------------------------- 04. Helpers ---------------------------------- Clear ------------------------------------ Notext ----------------------------------- Hidden ----------------------------------- Alignleft -------------------------------- Alignright ------------------------------- Disabled --------------------------------- II. Regions -------------------------------------- 01. Wrapper ---------------------------------- 02. Container -------------------------------- 03. Shell ------------------------------------ Small Desktop ---------------------------- 04. Header ----------------------------------- 05. Header Top ------------------------------- 06. Header Bottom ---------------------------- 07. Header Bottom Secondary ------------------ 08. Home Header ------------------------------ Mobile ----------------------------------- 09. Main ------------------------------------- 10. Footer ----------------------------------- Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 11. Content ---------------------------------- Mobile ----------------------------------- 12. Sidebar ---------------------------------- Mobile ----------------------------------- 13. Sidebar Secondary ------------------------ III. Themes --------------------------------------- IV. Modules -------------------------------------- 01. Accordion -------------------------------- Small Desktop ---------------------------- Mobile ----------------------------------- 02. Article ---------------------------------- Mobile ----------------------------------- 03. Breadcrumbs ------------------------------ Mobile ----------------------------------- 04. Button ----------------------------------- Mobile ----------------------------------- 05. Chart ------------------------------------ 06. Col -------------------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 07. Counter ---------------------------------- Mobile ----------------------------------- 08. Form Elements ---------------------------- 09. Custom File Upload ----------------------- 10. Form ------------------------------------- 11. Form Get Loan ---------------------------- Mobile ----------------------------------- 12. Form Request ----------------------------- Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 13. Form Join Direct ------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 14. Form Register ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 15. Info ------------------------------------- 16. Intro ------------------------------------ Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 17. Intro Home ------------------------------- Mobile ----------------------------------- 18. Intro Management ------------------------- 19. Intro Faq -------------------------------- 20. Intro Media ------------------------------ 21. Intro Article ---------------------------- 22. Intro Loans ------------------------------ 23. Intro Regsiter --------------------------- 24. List ------------------------------------- 25. List Stats ------------------------------- Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 26. List Info -------------------------------- 27. List Info Secondary ---------------------- 28. List Squares ----------------------------- Tablet Portrait -------------------------- 29. Logo ------------------------------------- 30. Member ----------------------------------- Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 31. Nav -------------------------------------- Mobile ----------------------------------- 32. Nav Dropdown ----------------------------- Mobile ----------------------------------- 33. Nav Footer ------------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 34. Section ---------------------------------- Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 35. Section Loans ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 36. Section Ticker --------------------------- Mobile ----------------------------------- 37. Section Graph ---------------------------- Diagram Base ----------------------------- Diagram Right ---------------------------- Diagram Left ----------------------------- Diagram Center --------------------------- Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 38. Section Articles ------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 39. Section Media ---------------------------- Small Desktop ---------------------------- Mobile ----------------------------------- 40. Section Testimonial ---------------------- Small Desktop ---------------------------- Mobile ----------------------------------- 41. Section Stat ----------------------------- Mobile ----------------------------------- 42. Section Channel -------------------------- Mobile ----------------------------------- 43. Section Management ----------------------- 44. Section Content -------------------------- Mobile ----------------------------------- 45. Section Faq ------------------------------ Mobile ----------------------------------- 46. Section Job ------------------------------ Mobile ----------------------------------- 47. Section Job Intro ------------------------ Mobile ----------------------------------- 48. Section Jobs ----------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 49. Section Media Listing -------------------- Mobile ----------------------------------- 50. Section Secondary ------------------------ 51. Section Charts --------------------------- 52. Ssection Register Opening ---------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 53. Section Visits --------------------------- Mobile ----------------------------------- 54. Section Register ------------------------- Mobile ----------------------------------- 55. Section Register Thanks ------------------ Tablet Portrait -------------------------- Mobile ----------------------------------- 56. Slider ----------------------------------- 57. Slider Loans ----------------------------- Small Desktop ---------------------------- Mobile ----------------------------------- 58. Slider Ticker ---------------------------- Mobile ----------------------------------- 59. Slider Articles -------------------------- Small Desktop ---------------------------- Mobile ----------------------------------- 60. Slider Media ----------------------------- Mobile ----------------------------------- 61. Slider Testimonials ---------------------- Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 62. Slider Testimonials Thumbs --------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 63. Slider Icons ----------------------------- Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 64. Slider Channel --------------------------- Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 65. Slider Channel Thumbs -------------------- Small Desktop ---------------------------- Tablet Portrait -------------------------- Mobile ----------------------------------- 66. Slider Ticker Small ---------------------- Mobile ----------------------------------- 67. Tabs ------------------------------------- Mobile ----------------------------------- 68. Table Info ------------------------------- 69. Table Info Secondary --------------------- 70. Widget ----------------------------------- 71. Widget Search ---------------------------- 72. Widget Menu ------------------------------ Mobile ----------------------------------- 73. Widget Articles -------------------------- Mobile ----------------------------------- */ .ico-arrow-left { background-image: url(images/sprite.png); background-position: -34px -310px; width: 12px; height: 22px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-calendar { background-image: url(images/sprite.png); background-position: -173px -127px; width: 42px; height: 42px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-check-green { background-image: url(images/sprite.png); background-position: -92px -253px; width: 20px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-diamond { background-image: url(images/sprite.png); background-position: -311px -127px; width: 42px; height: 36px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-dropdown { background-image: url(images/sprite.png); background-position: -190px -204px; width: 22px; height: 10px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-email { background-image: url(images/sprite.png); background-position: -182px -253px; width: 18px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-facebook-green { background-image: url(images/sprite.png); background-position: -17px -310px; width: 13px; height: 23px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-facebook-small { background-image: url(images/sprite.png); background-position: -91px -285px; width: 10px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-facebook { background-image: url(images/sprite.png); background-position: -357px -127px; width: 14px; height: 26px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-graph { background-image: url(images/sprite.png); background-position: -265px -127px; width: 42px; height: 42px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-handshake { background-image: url(images/sprite.png); background-position: -169px -174px; width: 42px; height: 26px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-headset { background-image: url(images/sprite.png); background-position: -305px -174px; width: 22px; height: 22px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-home { background-image: url(images/sprite.png); background-position: -267px -222px; width: 15px; height: 15px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-linkedin-small { background-image: url(images/sprite.png); background-position: -116px -253px; width: 18px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-linkedin { background-image: url(images/sprite.png); background-position: -277px -174px; width: 24px; height: 24px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-lock { background-image: url(images/sprite.png); background-position: -60px -285px; width: 13px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-minus { background-image: url(images/sprite.png); background-position: -357px -157px; width: 12px; height: 4px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-mobile { background-image: url(images/sprite.png); background-position: 0 -310px; width: 13px; height: 23px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-money { background-image: url(images/sprite.png); background-position: -219px -127px; width: 42px; height: 42px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-moneyhand { background-image: url(images/sprite.png); background-position: -215px -174px; width: 28px; height: 24px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-next { background-image: url(images/sprite.png); background-position: -30px -253px; width: 26px; height: 53px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-pad { background-image: url(images/sprite.png); background-position: -126px -174px; width: 39px; height: 44px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-phone { background-image: url(images/sprite.png); background-position: -77px -285px; width: 10px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-plus { background-image: url(images/sprite.png); background-position: -225px -253px; width: 16px; height: 16px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-prev { background-image: url(images/sprite.png); background-position: 0 -253px; width: 26px; height: 53px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-search { background-image: url(images/sprite.png); background-position: -138px -253px; width: 18px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-share { background-image: url(images/sprite.png); background-position: -331px -174px; width: 21px; height: 22px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-stat-cake { background-image: url(images/sprite.png); background-position: 0 0; width: 122px; height: 123px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-stat-calc { background-image: url(images/sprite.png); background-position: -126px 0; width: 122px; height: 123px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-stat-files { background-image: url(images/sprite.png); background-position: -252px 0; width: 122px; height: 123px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-stat-woman { background-image: url(images/sprite.png); background-position: 0 -127px; width: 122px; height: 122px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-sun { background-image: url(images/sprite.png); background-position: -126px -127px; width: 43px; height: 43px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-thumbs-up { background-image: url(images/sprite.png); background-position: -247px -174px; width: 26px; height: 24px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-ticker { background-image: url(images/sprite.png); background-position: -160px -253px; width: 18px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-tophat { background-image: url(images/sprite.png); background-position: -60px -253px; width: 28px; height: 28px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-twitter-green { background-image: url(images/sprite.png); background-position: -186px -222px; width: 22px; height: 19px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-twitter-small { background-image: url(images/sprite.png); background-position: -169px -204px; width: 17px; height: 14px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-twitter { background-image: url(images/sprite.png); background-position: -158px -222px; width: 24px; height: 19px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-user { background-image: url(images/sprite.png); background-position: -356px -174px; width: 17px; height: 20px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-username { background-image: url(images/sprite.png); background-position: -204px -253px; width: 17px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-wallet { background-image: url(images/sprite.png); background-position: -126px -222px; width: 28px; height: 27px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-yahoo-small { background-image: url(images/sprite.png); background-position: -240px -222px; width: 23px; height: 15px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-youtube { background-image: url(images/sprite.png); background-position: -212px -222px; width: 24px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .ico-arrow-left { background-image: url(images/sprite.@2x.png); background-position: -86px -276.5px; background-size: 370px 301.5px; width: 12px; height: 22px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-calendar { background-image: url(images/sprite.@2x.png); background-position: -169px -124.5px; background-size: 370px 301.5px; width: 42px; height: 42px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-check-green { background-image: url(images/sprite.@2x.png); background-position: -231px -214.5px; background-size: 370px 301.5px; width: 20px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-diamond { background-image: url(images/sprite.@2x.png); background-position: -301px -124.5px; background-size: 370px 301.5px; width: 42px; height: 36px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-dropdown { background-image: url(images/sprite.@2x.png); background-position: -345px -150.5px; background-size: 370px 301.5px; width: 22px; height: 10px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-email { background-image: url(images/sprite.@2x.png); background-position: -253px -214.5px; background-size: 370px 301.5px; width: 18px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-facebook-green { background-image: url(images/sprite.@2x.png); background-position: -71px -276.5px; background-size: 370px 301.5px; width: 13px; height: 23px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-facebook-small { background-image: url(images/sprite.@2x.png); background-position: -110px -248.5px; background-size: 370px 301.5px; width: 10px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-facebook { background-image: url(images/sprite.@2x.png); background-position: -56px -248.5px; background-size: 370px 301.5px; width: 14px; height: 26px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-graph { background-image: url(images/sprite.@2x.png); background-position: -257px -124.5px; background-size: 370px 301.5px; width: 42px; height: 42px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-handshake { background-image: url(images/sprite.@2x.png); background-position: -165px -169px; background-size: 370px 301.5px; width: 42px; height: 25.5px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-headset { background-image: url(images/sprite.@2x.png); background-position: -267px -169px; background-size: 370px 301.5px; width: 22px; height: 22px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-home { background-image: url(images/sprite.@2x.png); background-position: -348px -214.5px; background-size: 370px 301.5px; width: 15px; height: 15px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-linkedin-small { background-image: url(images/sprite.@2x.png); background-position: -293px -214.5px; background-size: 370px 301.5px; width: 18px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-linkedin { background-image: url(images/sprite.@2x.png); background-position: -345px -124.5px; background-size: 370px 301.5px; width: 24px; height: 24px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-lock { background-image: url(images/sprite.@2x.png); background-position: -333px -214.5px; background-size: 370px 301.5px; width: 13px; height: 17.5px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-minus { background-image: url(images/sprite.@2x.png); background-position: -301px -162.5px; background-size: 370px 301.5px; width: 12px; height: 4px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-mobile { background-image: url(images/sprite.@2x.png); background-position: -56px -276.5px; background-size: 370px 301.5px; width: 13px; height: 23px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-money { background-image: url(images/sprite.@2x.png); background-position: -213px -124.5px; background-size: 370px 301.5px; width: 42px; height: 42px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-moneyhand { background-image: url(images/sprite.@2x.png); background-position: -209px -169px; background-size: 370px 301.5px; width: 28px; height: 24px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-next { background-image: url(images/sprite.@2x.png); background-position: 0 -248.5px; background-size: 370px 301.5px; width: 26px; height: 53px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-pad { background-image: url(images/sprite.@2x.png); background-position: -124px -169px; background-size: 370px 301.5px; width: 39px; height: 43.5px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-phone { background-image: url(images/sprite.@2x.png); background-position: -122px -248.5px; background-size: 370px 301.5px; width: 10px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-plus { background-image: url(images/sprite.@2x.png); background-position: -165px -196.5px; background-size: 370px 301.5px; width: 16px; height: 16px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-prev { background-image: url(images/sprite.@2x.png); background-position: -28px -248.5px; background-size: 370px 301.5px; width: 26px; height: 53px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-search { background-image: url(images/sprite.@2x.png); background-position: -273px -214.5px; background-size: 370px 301.5px; width: 18px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-share { background-image: url(images/sprite.@2x.png); background-position: -184px -214.5px; background-size: 370px 301.5px; width: 21px; height: 21.5px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-stat-cake { background-image: url(images/sprite.@2x.png); background-position: 0 0; background-size: 370px 301.5px; width: 122px; height: 122.5px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-stat-calc { background-image: url(images/sprite.@2x.png); background-position: -124px 0; background-size: 370px 301.5px; width: 122px; height: 122.5px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-stat-files { background-image: url(images/sprite.@2x.png); background-position: -248px 0; background-size: 370px 301.5px; width: 122px; height: 122.5px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-stat-woman { background-image: url(images/sprite.@2x.png); background-position: 0 -124.5px; background-size: 370px 301.5px; width: 122px; height: 122px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-sun { background-image: url(images/sprite.@2x.png); background-position: -124px -124.5px; background-size: 370px 301.5px; width: 43px; height: 42.5px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-thumbs-up { background-image: url(images/sprite.@2x.png); background-position: -239px -169px; background-size: 370px 301.5px; width: 26px; height: 23.5px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-ticker { background-image: url(images/sprite.@2x.png); background-position: -313px -214.5px; background-size: 370px 301.5px; width: 18px; height: 17.5px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-tophat { background-image: url(images/sprite.@2x.png); background-position: -124px -214.5px; background-size: 370px 301.5px; width: 28px; height: 28px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-twitter-green { background-image: url(images/sprite.@2x.png); background-position: -207px -214.5px; background-size: 370px 301.5px; width: 22px; height: 18.5px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-twitter-small { background-image: url(images/sprite.@2x.png); background-position: -183px -196.5px; background-size: 370px 301.5px; width: 17px; height: 13.5px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-twitter { background-image: url(images/sprite.@2x.png); background-position: -291px -169px; background-size: 370px 301.5px; width: 24px; height: 19px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-user { background-image: url(images/sprite.@2x.png); background-position: -72px -248.5px; background-size: 370px 301.5px; width: 17px; height: 19.5px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-username { background-image: url(images/sprite.@2x.png); background-position: -91px -248.5px; background-size: 370px 301.5px; width: 17px; height: 18px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-wallet { background-image: url(images/sprite.@2x.png); background-position: -154px -214.5px; background-size: 370px 301.5px; width: 28px; height: 27px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-yahoo-small { background-image: url(images/sprite.@2x.png); background-position: -343px -169px; background-size: 370px 301.5px; width: 23px; height: 15px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-youtube { background-image: url(images/sprite.@2x.png); background-position: -317px -169px; background-size: 370px 301.5px; width: 24px; height: 17px; display: inline-block; vertical-align: middle; font-size: 0; } } /* ------------------------------------------------------------ *\ I. Generic \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Reset \* ------------------------------------------------------------ */ *, *:before, *:after { padding: 0; margin: 0; outline: 0; box-sizing: border-box; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, main { display: block; } html, body { height: 100%; } html { tap-highlight-color: rgba(0,0,0,0); } body { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; -webkit-text-size-adjust: none; -ms-text-size-adjust: none; text-size-adjust: none; } img, iframe, video, audio, object { max-width: 100%; } img { height: auto; display: inline-block; vertical-align: middle; } b, strong { font-weight: bold; } address { font-style: normal; } svg:not(:root) { overflow: hidden; } a, button, input[type="submit"], input[type="button"], input[type="reset"], input[type="file"], input[type="image"], label[for] { cursor: pointer; } a[href^="tel"], button[disabled], input[disabled], textarea[disabled], select[disabled] { cursor: default; } button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; } input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], input[type="color"], textarea, a[href^="tel"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { display: none; -webkit-appearance: none; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } textarea { overflow: auto; resize: none; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; } button, input, optgroup, select, textarea { font-family: inherit; font-size: inherit; color: inherit; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; } button, select { text-transform: none; } table { width: 100%; border-collapse: collapse; border-spacing: 0; } nav ul, nav ol { list-style: none outside none; } /* ------------------------------------------------------------ *\ Fonts \* ------------------------------------------------------------ */ /* Almoni DL AAA */ @font-face{ font-family: 'AlmoniDLAAA'; font-weight: 300; /*(light)*/ font-style: normal; src: url('fonts/almoni-dl-aaa-300.eot'); src: url('fonts/almoni-dl-aaa-300.eot?#iefix') format('embedded-opentype'), url('fonts/almoni-dl-aaa-300.ttf') format('truetype'), url('fonts/almoni-dl-aaa-300.woff') format('woff'); } @font-face{ font-family: 'AlmoniDLAAA'; font-weight: 400; /*(regular)*/ font-style: normal; src: url('fonts/almoni-dl-aaa-400.eot'); src: url('fonts/almoni-dl-aaa-400.eot?#iefix') format('embedded-opentype'), url('fonts/almoni-dl-aaa-400.ttf') format('truetype'), url('fonts/almoni-dl-aaa-400.woff') format('woff'); } @font-face{ font-family: 'AlmoniDLAAA'; font-weight: 700; /*(bold)*/ font-style: normal; src: url('fonts/almoni-dl-aaa-700.eot'); src: url('fonts/almoni-dl-aaa-700.eot?#iefix') format('embedded-opentype'), url('fonts/almoni-dl-aaa-700.ttf') format('truetype'), url('fonts/almoni-dl-aaa-700.woff') format('woff'); } @font-face{ font-family: 'AlmoniDLAAA'; font-weight: 900; /*(black)*/ font-style: normal; src: url('fonts/almoni-dl-aaa-900.eot'); src: url('fonts/almoni-dl-aaa-900.eot?#iefix') format('embedded-opentype'), url('fonts/almoni-dl-aaa-900.ttf') format('truetype'), url('fonts/almoni-dl-aaa-900.woff') format('woff'); } /* Open Sans Hebrew */ @font-face { font-family: 'Open Sans Hebrew'; font-weight: 400; font-style: normal; src: url('fonts/OpenSansHebrewRegular.eot'); src: url('fonts/OpenSansHebrewRegular.eot') format('embedded-opentype'), url('fonts/OpenSansHebrewRegular.woff2') format('woff2'), url('fonts/OpenSansHebrewRegular.woff') format('woff'), url('fonts/OpenSansHebrewRegular.ttf') format('truetype'), url('fonts/OpenSansHebrewRegular.svg#OpenSansHebrewRegular') format('svg'); } @font-face { font-family: 'Open Sans Hebrew'; font-weight: 700; font-style: normal; src: url('fonts/OpenSansHebrewBold.eot'); src: url('fonts/OpenSansHebrewBold.eot') format('embedded-opentype'), url('fonts/OpenSansHebrewBold.woff2') format('woff2'), url('fonts/OpenSansHebrewBold.woff') format('woff'), url('fonts/OpenSansHebrewBold.ttf') format('truetype'), url('fonts/OpenSansHebrewBold.svg#OpenSansHebrewBold') format('svg'); } /* ------------------------------------------------------------ *\ Base \* ------------------------------------------------------------ */ body { min-width: 320px; background: #fff; font-family: 'AlmoniDLAAA', sans-serif; font-size: 20px; line-height: 1.3; color: #2b2e32; direction: rtl; letter-spacing: 0.0028em; } a { color: inherit; text-decoration: underline; color: #67c18c; } a img { border: 0; } a:hover { text-decoration: none; } a[href^="tel"] { text-decoration: none; } h1 { font-size: 70px; } h2 { font-size: 40px; } h3 { font-size: 30px; } h4 { font-size: 20px; } h5 { font-size: 18px; } h6 { font-size: 16px; } h1, h2, h3, h4, h5, h6 { margin-bottom: 0.65em; } p, ul, ol, dl, table, blockquote { margin-bottom: 1.3em; } h1[class], h2[class], h3[class], h4[class], h5[class], h6[class], h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child, p:last-child, ul:last-child, ol:last-child, dl:last-child, table:last-child, blockquote:last-child { margin-bottom: 0; } /* Mobile */ @media (max-width: 767px) { body.menu-opened { overflow: hidden; } } /* ------------------------------------------------------------ *\ Helpers \* ------------------------------------------------------------ */ /* Clear */ .section-charts .section-inner:after, .clear:after, .info:after, .cols:after { content: ''; line-height: 0; display: table; clear: both; } /* Notext */ .notext { white-space: nowrap; text-indent: 100%; text-shadow: none; overflow: hidden; } .notext-old { font-size: 0; line-height: 0; text-indent: -4000px; } /* Hidden */ [hidden], .hidden { display: none; } /* Alignleft */ .alignleft { float: left; } /* Alignright */ .alignright { float: right; } /* Disabled */ [disabled], .disabled { cursor: default; } /* ------------------------------------------------------------ *\ II. Regions \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Wrapper \* ------------------------------------------------------------ */ .wrapper { overflow: hidden; } /* ------------------------------------------------------------ *\ Container \* ------------------------------------------------------------ */ .container {} /* ------------------------------------------------------------ *\ Shell \* ------------------------------------------------------------ */ .shell { max-width: 1200px; margin: auto; } /* Small Desktop */ @media (max-width: 1199px) { .shell { padding: 0 10px; } } /* ------------------------------------------------------------ *\ Header \* ------------------------------------------------------------ */ .header { width: 100%; position: fixed; left: 0; top: 0; font-family: 'Open Sans Hebrew', sans-serif; z-index: 999; } .header a.phone { display: none; } /* ------------------------------------------------------------ *\ Header Top \* ------------------------------------------------------------ */ .header .header-top { background-color: transparent; transition: background-color .5s; } .header .header-top-inner { position: relative; } .header .header-top-inner:after, .header .header-top-inner:before { content: ''; display: table; } .header .header-top-inner:after { clear: both; } .header .header-contact { float: right; font-size: 16px; color: #4b4b4b; margin: 4px 0; } .header .header-contact span { display: inline-block; vertical-align: middle; margin-right: 3px; } .header .header-access { float: left; } .header .header-access > span { display: inline-block; vertical-align: middle; font-size: 12px; color: #4b4b4b; } .header .header-access .socials { display: inline-block; vertical-align: middle; } .header .header-access ul { list-style: none; margin: 0; } .header .header-access ul li { display: inline-block; vertical-align: middle; margin-right: 10px; } .header .header-access p { display: inline-block; vertical-align: middle; font-size: 12px; color: #4b4b4b; margin: 0 10px 0 0; } .header .header-access > a { font-size: 12px; text-decoration: none; } .header .header-slogan { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); font-size: 12px; color: #4b4b4b; } .header-collapsed .header-top { background-color: #fff !important; } /* ------------------------------------------------------------ *\ Header Bottom \* ------------------------------------------------------------ */ .header .header-bottom { background-color: transparent; transition: background-color .5s;} .header .header-bottom-inner { position: relative; } .header .header-bottom-inner:after, .header .header-bottom-inner:before { content: ''; display: table; } .header .header-bottom-inner:after { clear: both; } .header .logo { float: right; margin: 13px 0; } .header .nav { float: left; margin-top: 15px; } .header-collapsed .header-bottom { background-color: #fff; } .header-collapsed .nav a { color: #67c18c; } .header-collapsed .nav .caret { border-color: #67c18c transparent transparent transparent; } .header-collapsed .nav > ul > li ~ li:before { color: #67c18c; } /* ------------------------------------------------------------ *\ Header Bottom Secondary \* ------------------------------------------------------------ */ .header-collapsed .header-bottom-secondary { background: #fffcf7; } .header-collapsed .header-inner { float: right; padding-top: 10px; margin-right: 134px; } .header-collapsed .header-inner .btn-big + .btn-big { margin-right: 25px; } /* ------------------------------------------------------------ *\ Home Header \* ------------------------------------------------------------ */ .header-home .header-top { background-color: #ecedee; } /* Mobile */ @media (max-width: 767px) { .header .header-slogan, .header .header-access, .header .header-contact { display: none; } .header .nav { width: 100%; position: fixed; left: 0; top: 100%; z-index: 999; opacity: 0; visibility: hidden; background: rgba(16, 56, 90, .98); position: fixed; left: 0; top: 55px; right: 0; bottom: 0; margin: 0; overflow-y: auto; transition: background-color .5s, box-shadow .5s, height .5s; } .header .header-bottom-inner { position: static; } .header { height: 55px; } .header .logo { width: 104px; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); margin: 0; font-size: 0; } .header .logo img { width: 100%; height: auto; } .header a.phone { display: block; position: absolute; left: 0; top: 15px; z-index: 99; font-size: 0; transition: top .5s; } .header { transition: all .5s; box-shadow: inset 0 -1px 0 rgba(255,255,255, 0); } .header.header-collapsed { height: 45px; background: rgba(16, 56, 90, .9); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .9); } .header.header-collapsed a.phone { top: 11px; } .header.header-collapsed .nav-trigger { top: 11px; } .header.menu-opened { background: rgba(16, 56, 90, .98); box-shadow: inset 0 -1px 0 #fff; } .header.menu-opened .nav { opacity: 1; visibility: visible; } .header.menu-opened .nav.hide { left: 100%; right: auto; overflow: visible; } .header.header-collapsed .nav, .header.header-collapsed .nav-dropdown { top: 45px; } .header.header-inner-pages { height: 55px; background-color: transparent; box-shadow: none; } .header.header-inner-pages a.phone { top: 15px; } .header.header-inner-pages .nav-trigger { top: 16px; } .header.header-collapsed { height: 45px; background: rgba(16, 56, 90, .9); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .9); } .header.header-collapsed a.phone { top: 11px; } .header.header-collapsed .nav-trigger { top: 11px; } .header-bottom-secondary .header-inner { display: none; } } @media(max-width: 1120px){ /* ------------------------------------------------------------ *\ Header Bottom Secondary \* ------------------------------------------------------------ */ .header-bottom-secondary .header-inner { float: left; width: 70%; text-align: left; } .header-bottom-secondary .logo { position: absolute; right: 0; top: 50%; margin: 0; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } } @media (max-width: 767px) { /* ------------------------------------------------------------ *\ Header Bottom Secondary \* ------------------------------------------------------------ */ .header-bottom-secondary .logo { left: 50%; right: auto; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } } /* ------------------------------------------------------------ *\ Main \* ------------------------------------------------------------ */ .main { position: relative; z-index: 11; } /* ------------------------------------------------------------ *\ Footer \* ------------------------------------------------------------ */ .footer { background: #10385a url(images/footer-border-pattern.jpg) repeat-x 4px top; padding: 67px 0 80px; position: relative; } .footer:before { content: ''; width: 86px; height: 223px; background: url(images/footer-left-elem.jpg) no-repeat 0 0; position: absolute; left: 0; top: -43px; z-index: 10; } .footer:after { content: ''; width: 412px; height: 142px; background: url(images/footer-right-elem.jpg) no-repeat 0 0; position: absolute; right: 0; bottom: 0; z-index: 10; } .footer .footer-nav { float: right; position: relative; padding-top: 11px; } .footer .footer-nav:before { content: ''; width: 42px; height: 2px; background-color: #67c18c; position: absolute; right: 0; top: 0; } .footer .footer-nav ~ .footer-nav { margin-right: 8.4%; } .footer .footer-socials { float: left; margin-left: 8.6%; position: relative; text-align: left; } .footer .footer-socials:before { content: ''; width: 42px; height: 2px; background-color: #67c18c; position: absolute; left: 0; top: 0; } .footer .footer-socials ul { list-style: none; font-size: 0; } .footer .footer-socials ul li { margin-top: 23px; } .footer .footer-socials a { transition: opacity .3s; opacity: 1; } .footer .footer-socials a:hover { opacity: .5; } .footer .copyright { width: 100%; position: absolute; left: 0; bottom: 0; z-index: 11; background: rgba(255, 255, 255, .8); padding: 6px 0; } .footer .copyright p { max-width: 1200px; margin: 0 auto; font-family: 'Open Sans Hebrew', sans-serif; font-size: 16px; color: #2b2e32; } /* Small Desktop */ @media (max-width: 1199px) { .footer .copyright { padding: 6px 10px; } } /* Tablet Portrait */ @media (max-width: 1023px) { .footer .footer-nav ~ .footer-nav { margin-right: 5%; } .footer .footer-socials { z-index: 10; } } /* Mobile */ @media (max-width: 767px) { .footer:before { display: none; } .footer:after { -webkit-transform: scale(.7); -ms-transform: scale(.7); transform: scale(.7); -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; } .footer { padding: 40px 0; } .footer .footer-nav { margin-bottom: 20px; width: 122px; } .footer .footer-nav:nth-child(2n+1) { clear: right; margin-right: 0; } .footer .footer-socials { position: absolute; left: 10px; top: 40px; margin: 0; text-align: right; } .footer .footer-socials ul li { margin-top: 10px; } .footer .footer-socials i { -webkit-transform: scale(.6); -ms-transform: scale(.6); transform: scale(.6); } .footer .footer-nav:before, .footer .footer-socials:before { width: 30px; } .footer .copyright p { font-size: 12px; } } /* ------------------------------------------------------------ *\ Content \* ------------------------------------------------------------ */ .content { float: right; width: 66%; } .content-fluid { float: none; width: 100%; } /* Mobile */ @media (max-width: 767px) { .content { float: none; width: 100%; } } /* ------------------------------------------------------------ *\ Sidebar \* ------------------------------------------------------------ */ .sidebar { float: right; width: 26%; padding-right: 30px; margin-right: 8%; } /* Mobile */ @media (max-width: 767px) { .sidebar { float: none; width: 100%; padding: 26px 0 0; margin: 34px 0 0; border-top: 2px solid #2e516f; } .sidebar-faq { padding: 0; margin: 0; border: 0; } .sidebar-faq .widget-search .search { width: 100%; position: absolute; left: 0; top: 0; } .sidebar-faq .widget-menu { display: none; } .sidebar-tabs { display: none; } } /* ------------------------------------------------------------ *\ Sidebar Secondary \* ------------------------------------------------------------ */ .sidebar-secondary { padding-top: 33px; } .sidebar-secondary h4 { margin-bottom: 24px; } /* ------------------------------------------------------------ *\ III. Themes \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ IV. Modules \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Accordion \* ------------------------------------------------------------ */ .accordion-body { display: none; } .accordion .accordion-section ~ .accordion-section { margin-top: 30px; } .accordion .accordion-head { cursor: pointer; } .accordion .accordion-head h3 { font-size: 20px; color: #67c18c; margin-bottom: 0; } .accordion .accordion-body { padding-right: 16px; border-right: 1px solid #67c18c; margin: 10px 0 0; } .accordion .accordion-body p { font-size: 20px; color: #2b2e32; line-height: 1.5; } /* Small Desktop */ @media (max-width: 1199px) { .accordion .accordion-body p { font-size: 18px; } } /* Mobile */ @media (max-width: 767px) { .accordion .accordion-head h3, .accordion .accordion-body p { font-size: 12px; } .accordion .accordion-body { border-right-width: 2px; margin-bottom: 0; } .accordion .accordion-section ~ .accordion-section { margin-top: 25px; } } /* ------------------------------------------------------------ *\ Article \* ------------------------------------------------------------ */ .article { letter-spacing: 0; } .article .article-head { margin-bottom: 45px; } .article .article-head h2 { font-weight: 400; color: #2b2e32; margin: 0; } .article .article-entry { color: #2b2e32; } .article .article-entry h4 { margin-bottom: 22px; } .article .article-entry p { margin-bottom: 23px; line-height: 1.2; } .article .article-foot { margin-top: 100px; } /* Mobile */ @media (max-width: 767px) { .article .article-head { margin-bottom: 3px; } .article .article-head h2 { font-weight: 900; font-size: 18px; } .article .article-entry h4 { font-size: 12px; line-height: 1.8; margin-bottom: 15px; } .article .article-entry p { font-size: 12px; line-height: 1.8; margin-bottom: 15px; } .article .article-foot { margin-top: 10px; } } /* ------------------------------------------------------------ *\ Breadcrumbs \* ------------------------------------------------------------ */ .breadcrumbs { padding: 5px 0 58px; } .breadcrumbs .breadcrumbs-inner { padding-right: 77%; } .breadcrumbs .current { color: #4b4b4b; } .breadcrumbs .breadcrumbs-inner a, .breadcrumbs .breadcrumbs-inner span { display: inline-block; vertical-align: middle; font-family: 'Open Sans Hebrew', sans-serif; font-size: 12px; text-decoration: none; } .breadcrumbs .breadcrumbs-inner i { position: relative; top: -2px; } .breadcrumbs .breadcrumbs-inner span { color: #4b4b4b; } /* Mobile */ @media (max-width: 767px) { .breadcrumbs { padding: 5px 0 20px; } .breadcrumbs .breadcrumbs-inner { padding: 0; } } /* ------------------------------------------------------------ *\ Button \* ------------------------------------------------------------ */ .btn { display: inline-block; vertical-align: middle; -webkit-appearance: none; -moz-appearance: none; appearance: none; text-decoration: none; } .btn-orange { font-size: 26px; color: #fff5e6 !important; border: 0; background-color: #f15a22; text-align: center; line-height: 1.1; padding: 11px 30px 7px; transition: background-color .5s; } .btn-orange small { display: block; font-family: 'Open Sans Hebrew', sans-serif; font-size: 13px; } .btn-green { height: 42px; border: 0; font-weight: 300; font-size: 24px; color: #fff; text-align: center; border: 0; background-color: #67c18c; line-height: 42px; padding: 0 30px; } .btn-facebook { height: 42px; line-height: 42px; border: 0; background-color: #47639e; padding: 0 11px; font-weight: 300; font-size: 24px; color: #fff; position: relative; } .btn-facebook i { position: absolute; left: 20px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .btn-cat { background-color: #10385a; border: 1px solid #fff; padding: 8px 41px 6px 40px; } .btn-cat:hover { text-decoration: none; } .btn-cat span { display: inline-block; vertical-align: middle; margin-left: 20px; text-align: center; } .btn-cat span small { display: block; font-size: 16px; color: #fff; opacity: .6; padding-top: 3px; } .btn-reset { width: auto; height: auto; border: 0; background-color: transparent; font-family: 'Open Sans Hebrew', sans-serif; font-size: 12px; color: #fff; text-decoration: underline; padding: 0; letter-spacing: 0.04em; } .btn-white { background-color: #fff; font-weight: 900; font-size: 30px; color: #e15820; text-align: center; height: 57px; line-height: 57px; font-size: 30px; } .btn-bordered { position: relative; } .btn-bordered:after { content: ''; width: 100%; height: 3px; background-color: #67c18c; position: absolute; left: 0; bottom: -5px; } .btn-big { position: relative; display: inline-block; width: 176px; height: 45px; padding-top: 4px; font-family: 'Open Sans Hebrew', sans-serif; font-size: 12px; letter-spacing: 0.04em; color: #fff5e6; text-decoration: none; text-align: center; background: #f15a22; transition: background .5s; } .btn-big:hover { background: #67c18c; } .btn-big:after { content: ''; position: absolute; width: 100%; height: 3px; bottom: -5px; left: 0; background: #67c18c; } .btn-big span { display: block; margin-bottom: -4px; font-family: 'AlmoniDLAAA', sans-serif; font-size: 20px; letter-spacing: 0.04em; color: #fff5e6; } .btn-big-secondary { height: 44px; padding-top: 0; line-height: 44px; } /* Mobile */ @media (max-width: 767px) { .btn-cat { width: 230px; padding: 10px 17px 8px 17px; } .btn-cat span { margin-left: 15px; } .btn-cat span small { display: inline-block; vertical-align: middle; padding: 2px 0 0; font-size: 12px; margin-right: -5px; } .btn-cat i { -webkit-transform: scale(.6); -ms-transform: scale(.6); transform: scale(.6); } } /* ------------------------------------------------------------ *\ Chart \* ------------------------------------------------------------ */ .chart { width: 380px; background-color: #ededed; } .chart-pie { width: 30px; height: 30px; display: inline-block; vertical-align: middle; } @media (max-width: 767px) { /* ------------------------------------------------------------ *\ Chart \* ------------------------------------------------------------ */ .chart { width: 100%; } } /* ------------------------------------------------------------ *\ Col \* ------------------------------------------------------------ */ .col { float: right; } .col-size1 { width: 48.23%; } .col-size2 { width: 48%; } .col-size3 { width: 49%; } .col-size4 { width: 51%; } .col-size5 { width: 32%; padding-left: 9%; border-left: 1px solid #10385a; } .col-size6 { width: 54%; padding-right: 2.2%; } /* Tablet Portrait */ @media (max-width: 1023px) { .col-size5 { width: 40%; padding-left: 30px; } } /* Mobile */ @media (max-width: 767px) { .col-size3, .col-size4, .col-size5, .col-size6 { float: none; width: 100%; padding: 0; border: 0; } .col-size6 { margin-top: 30px; } } /* ------------------------------------------------------------ *\ Counter \* ------------------------------------------------------------ */ .counter { overflow: hidden; margin-bottom: 0; } .counter .count-up, .counter .count-down { float: left; width: 20%; height: 50px; background-color: #fff; text-align: center; line-height: 50px; } .counter .count-up { border-left: 4px solid #f15a22; } .counter .count-down { border-right: 4px solid #f15a22; } .counter .counter-field { float: left; width: 60%; height: 50px; line-height: 50px; border: 0; background-color: #fff; text-align: center; font-size: 40px; color: #4b4b4b; letter-spacing: 0.04em; border-radius: 0; } /* Mobile */ @media (max-width: 767px) { .counter .count-up, .counter .count-down, .counter .counter-field { height: 30px; line-height: 30px; } .counter .counter-field { font-size: 24px; } } /* ------------------------------------------------------------ *\ Form Elements \* ------------------------------------------------------------ */ input::-webkit-input-placeholder { color: inherit; opacity: 1; } input::-moz-placeholder { color: inherit; opacity: 1; } input:-ms-input-placeholder { color: inherit; opacity: 1; } input::placeholder { color: inherit; opacity: 1; } textarea::-webkit-input-placeholder { color: inherit; opacity: 1; } textarea::-moz-placeholder { color: inherit; opacity: 1; } textarea:-ms-input-placeholder { color: inherit; opacity: 1; } textarea::placeholder { color: inherit; opacity: 1; } input:-webkit-autofill { -webkit-text-fill-color: inherit !important; -webkit-box-shadow: 0 0 0 1000px #fff inset; } .field { width: 100%; height: 42px; border: 0; border-bottom: 2px solid #4b4b4b; background-color: #fff; box-shadow: inset 0 0 22px rgba(0,0,0, .2); font-size: 16px; color: #4d4d4d; line-height: 40px; padding: 0 10px; border-radius: 0; } .fs-dropdown { display: inline-block; vertical-align: middle; margin: 0; } .fs-dropdown .fs-dropdown-selected { height: 42px; line-height: 40px; border: 0; border-radius: 0; border-bottom: 2px solid #4b4b4b; background-color: #fff; box-shadow: inset 0 0 22px rgba(0,0,0, .2); font-family: 'AlmoniDLAAA', sans-serif; font-weight: 300; font-size: 20px; color: #4b4b4b; padding: 0 15px 0 25px; } .fs-dropdown .fs-dropdown-selected:after { position: absolute; left: 9px; right: auto; border-top-color: #4b4b4b; } .fs-dropdown .fs-dropdown-options { border: 0; } .fs-dropdown-bottom.fs-dropdown-open .fs-dropdown-selected { border-radius: 0; } .fs-dropdown-bottom.fs-dropdown-open .fs-dropdown-options { border-radius: 0; top: 100%; bottom: auto; } .fs-dropdown .fs-dropdown-item { border: 0; border-bottom: 1px solid #eee; text-align: right; font-family: 'AlmoniDLAAA', sans-serif; font-weight: 300; font-size: 20px; color: #4b4b4b; } .fs-dropdown .custom-select-secondary { width: 72px; height: 29px; } .fs-dropdown .custom-select-secondary + .fs-dropdown-selected { width: 72px; height: 29px; line-height: 27px; text-align: right; } .checkbox { padding-top: 10px; } .checkbox input { display: none; } .checkbox label { display: block; font-weight: 400; font-size: 16px; color: #4b4b4b; position: relative; padding-right: 52px; } .checkbox label:before { content: ''; width: 40px; height: 40px; border-bottom: 2px solid #4b4b4b; background-color: #fff; box-shadow: inset 0 2px 12px rgba(0,0,0, .2); position: absolute; right: 0; top: 50%; margin-top: -20px; } .checkbox input:checked ~ label:before { border-bottom-color: #67c18c; } .checkbox input:checked ~ label:after { content: ''; width: 20px; height: 18px; background-image: url(images/sprite.png); background-position: -92px -253px; position: absolute; right: 8px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 10; } /* ------------------------------------------------------------ *\ Custom File Upload \* ------------------------------------------------------------ */ .file-upload { display: block; position: relative; overflow: hidden; } .file-upload-input { opacity: 0; font-size: 100px; position: absolute; bottom: -10px; left: -10px; cursor: pointer; } .file-upload-btn { display: block; width: 100%; height: 62px; font-weight: 300; font-size: 24px; color: #fff; border: 0; background-color: #67c18c; line-height: 62px; text-align: center; cursor: pointer; } .file-upload-names { display: none; } .file-upload.uploaded .file-upload-btn { display: none; } .file-upload.uploaded .edit-upload { display: inline-block; vertical-align: bottom; font-size: 16px; } .file-upload.uploaded p { font-weight: 300; font-size: 24px; color: #67c18c; margin-top: 5px; } .file-upload.uploaded p span { margin-right: 5px; } .file-upload.uploaded img { width: 62px; height: auto; margin-left: 10px; } /* ------------------------------------------------------------ *\ Form \* ------------------------------------------------------------ */ .form {} /* ------------------------------------------------------------ *\ Form Get Loan \* ------------------------------------------------------------ */ .form-get-loan { background-color: #fff; padding: 10px 33px 10px 40px; text-align: right; margin-bottom: 5px; } .form-get-loan .form-head { margin-bottom: 5px; } .form-get-loan .form-head h6 { font-weight: 400; font-size: 16px; margin-bottom: 0; color: #4d4d4d; } .form-get-loan .field { padding: 0 30px 0 10px; } .form-get-loan .form-row { margin-bottom: 8px; } .form-get-loan .form-controls { position: relative; } .form-get-loan .form-controls i { position: absolute; right: 9px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 10; } .form-get-loan .btn { width: 100%; } .form-get-loan .btn-green { margin-bottom: 10px; } .form-get-loan .btn-facebook { margin-bottom: 19px; } .form-get-loan .form-foot p { font-size: 16px; color: #4d4d4d; margin-bottom: 5px; } .form-get-loan .form-foot-actions { overflow: hidden; } .form-get-loan .form-foot-actions .btn-reset { float: right; width: auto; height: auto; border: 0; background-color: transparent; font-size: 14px; color: #67c18c; text-decoration: underline; } .form-get-loan .form-foot-actions .btn-reset:hover { text-decoration: none; } .form-get-loan .form-foot-actions p { float: left; margin: 0; font-size: 14px; color: #4b4b4b; } /* Mobile */ @media (max-width: 767px) { .form-get-loan { padding: 10px 33px; } .form-get-loan .btn { height: 37px; line-height: 37px; } .form-get-loan .btn-facebook { margin-bottom: 10px; } .form-get-loan .form-foot-actions .btn-reset { line-height: 1; } } /* ------------------------------------------------------------ *\ Form Request \* ------------------------------------------------------------ */ .form-request { width: 35%; } .form-request .form-head { margin-bottom: 16px; } .form-request .form-head h4 { color: #4b4b4b; margin: 0; } .form-request .form-controls { position: relative; font-size: 0; } .form-request .form-controls i { position: absolute; right: 20px; top: 50%; -webkit-transform: translate(50%, -50%); -ms-transform: translate(50%, -50%); transform: translate(50%, -50%); } .form-request .form-row { margin-bottom: 18px; } .form-request .field { font-weight: 300; font-size: 20px; padding: 0 36px 0 10px; } .form-request .field-phone { display: inline-block; vertical-align: middle; width: 64%; } .form-request .separator { display: inline-block; vertical-align: middle; width: 11%; font-weight: 300; font-size: 20px; color: #4b4b4b; text-align: center; } .form-request .fs-dropdown { width: 25%; } .form-request .form-btn { width: 100%; height: 52px; line-height: 52px; font-weight: 300; font-size: 24px; color: #fff; border: 0; background-color: #67c18c; text-align: center; } /* Small Desktop */ @media (max-width: 1199px) { .form-request { width: 40%; } } /* Tablet Portrait */ @media (max-width: 1023px) { .form-request { width: 55%; } } /* Mobile */ @media (max-width: 767px) { .form-request { width: 100%; margin-bottom: -10px; } .form-request .form-head { margin-bottom: 10px; } .form-request .form-head h4 { font-size: 18px; } } /* ------------------------------------------------------------ *\ Form Join Direct \* ------------------------------------------------------------ */ .form-join-direct { padding-left: 102px; border-left: 1px solid #10385a; padding-bottom: 32px; } .form-join-direct .form-row { margin-bottom: 20px; } .form-join-direct .form-head { margin-bottom: 25px; } .form-join-direct .form-head h4 { margin: 0; } .form-join-direct .form-controls { position: relative; } .form-join-direct .form-controls i { position: absolute; right: 7px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .form-join-direct .field { height: 62px; font-weight: 300; font-size: 20px; color: #4b4b4b; line-height: 60px; padding: 0 35px; } .form-join-direct .form-actions { text-align: left; } .form-join-direct .form-actions .btn { width: 277px; height: 52px; line-height: 52px; } /* Tablet Portrait */ @media (max-width: 1023px) { .form-join-direct { padding-left: 30px; } .form-join-direct .form-actions .btn { width: 100%; } } /* Mobile */ @media (max-width: 767px) { .form-join-direct { padding: 0; border: 0; } } /* ------------------------------------------------------------ *\ Form Register \* ------------------------------------------------------------ */ .form-register .form-col { float: right; } .form-register .form-col-size1 { width: 32%; padding-left: 74px; border-left: 1px solid #10385a; } .form-register .form-col-size2 { width: 34%; padding-right: 29px; padding-left: 73px; border-left: 1px solid #10385a; } .form-register .form-col-size3 { width: 28%; padding-right: 30px; } .form-register .form-body:before, .form-register .form-body:after { content: ''; display: table; } .form-register .form-body:after { clear: both; } .form-register h4 { margin-bottom: 25px; } .form-register .form-row { margin-bottom: 20px; position: relative; } .form-register .form-row-alt { margin-top: 38px; } .form-register .form-controls { position: relative; } .form-register .form-label { font-weight: 300; font-size: 20px; position: absolute; right: 10px; top: 20px; z-index: 9; transition: top .3s, right .3s, font-size .3s; } .form-register .form-label-inline { display: block; font-weight: 400; position: relative; right: 0; top: 0; line-height: 1.3; margin-bottom: 10px; margin-top: -5px; } .form-register .field { height: auto; padding: 17px 10px; font-weight: 300; font-size: 20px; color: #4b4b4b; line-height: 1.3; } .form-register .field:focus ~ .form-label, .form-register .field.success ~ .form-label, .form-register .fs-dropdown-focus ~ .form-label, .form-register .form-controls.success .form-label { font-size: 14px; top: -18px; right: 0; } .form-register .field.success, .form-register .form-controls.success .fs-dropdown-selected { border-bottom-color: #67c18c; } .form-register .success .field, .form-register .success .checkbox:before { border-bottom-color: #67c18c; } .form-register .error .field, .form-register .error .checkbox:before { border-bottom-color: #e30613; } .form-register .fs-dropdown { display: block; width: 100%; position: relative; z-index: 2; } .form-register .fs-dropdown + .form-label { z-index: 1; } .form-register .fs-dropdown-open, .form-register .fs-dropdown-focus { z-index: 99; } .form-register .fs-dropdown-selected { height: 62px; font-weight: 300; font-size: 20px; color: #4b4b4b; line-height: 62px; text-align: right; position: relative; background-color: transparent; } .form-register .fs-dropdown-selected:after { border: 0; width: 22px; height: 10px; background-image: url(images/sprite.png); background-position: -190px -204px; left: 20px; top: 50%; margin-top: -5px; margin: 0; } .form-register button[type='submit'] { height: 62px; display: none; width: 100%; line-height: 62px; } .form-register.show-submit button[type='submit'] { display: block; } /* Tablet Portrait */ @media (max-width: 1023px) { .form-register .form-col-size1, .form-register .form-col-size2 { padding-left: 30px; } .form-register .form-col-size3 { width: 33%; } } /* Mobile */ @media (max-width: 767px) { .form-register .form-col-size1, .form-register .form-col-size2, .form-register .form-col-size3 { float: none; width: 100%; padding: 0; border: 0; } } /* ------------------------------------------------------------ *\ Info \* ------------------------------------------------------------ */ .info { max-width: 380px; background: #ededed; } .info .info-aside { float: left; width: 38.42%; padding: 77px 0 72px; font-size: 50px; font-weight: 700; color: #fff; text-align: center; background: #669933; } .info .info-content { position: relative; float: right; width: 61.58%; padding: 55px 0 50px; text-align: center; } .info .info-content strong { position: relative; display: block; font-size: 100px; line-height: 1; font-weight: 700; color: #669933; } .info .info-content strong sub { position: relative; top: -22px; font-size: 30px; } .info .info-content span { position: absolute; width: 100%; left: 0; bottom: 10px; font-family: 'Open Sans Hebrew', sans-serif; font-size: 14px; letter-spacing: 0.03em; color: #669933; } @media (max-width: 767px) { /* ------------------------------------------------------------ *\ Info \* ------------------------------------------------------------ */ .info { max-width: 100%; } } /* ------------------------------------------------------------ *\ Intro \* ------------------------------------------------------------ */ .intro { position: relative; z-index: 10; } .intro .intro-inner { position: relative; height: 592px; } .intro .intro-title { position: absolute; right: 0; bottom: 96px; font-weight: 900; color: #fff; } .intro .intro-body { width: 100%; position: absolute; left: 0; top: 28.6%; z-index: 10; text-align: center; overflow: hidden; } .intro .intro-body h1 { font-weight: 300; color: #fff5e6; margin-bottom: 0; line-height: .9; } .intro .intro-body h3 { font-weight: 400; font-size: 26px; color: #fff5e6; margin: 0 0 70px; line-height: 1; } .intro .intro-box { float: right; width: 276px; position: relative; z-index: 30; } .intro .intro-box ~ .intro-box { margin-right: 20%; } .intro .intro-box:first-of-type { margin-right: 17%; } .intro .intro-box .how { font-size: 14px; color: #fff; } .intro-box .intro-box-head { margin-bottom: 2px; position: relative; } .intro-box .intro-box-head .btn { width: 100%; } .intro-box .intro-box-head .close-box { font-size: 24px; color: #fff; position: absolute; left: 20px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); line-height: 1; text-decoration: none; opacity: 0; transition: opacity .5s; } .intro-box .intro-box-body { border-top: 3px solid #67c18c; height: 0; overflow: hidden; transition: height .5s; } .intro.opened .intro-body h3 { margin: 0 0 43px; } .intro-box.opened .intro-box-head .close-box { opacity: 1; } .intro-box.opened .intro-box-body { height: 335px; } .intro .intro-bottom-elem { height: 86px; width: 46%; position: absolute; right: 0; bottom: 0; z-index: 20; background-color: #fff; } .intro .intro-bottom-elem:before { content: ''; border-left: 43px solid transparent; border-top: 43px solid transparent; border-right: 43px solid #fff; border-bottom: 43px solid #fff; position: absolute; right: 100%; bottom: 0; z-index: 20; } .intro .intro-bottom-elem:after { content: ''; width: 1000px; height: 100%; background-color: #fff; position: absolute; left: 100%; top: 0; z-index: 20; } /* Small Desktop */ @media (max-width: 1199px) { .intro .intro-box:first-of-type { margin-right: 12%; } } /* Tablet Portrait */ @media (max-width: 1023px) { .intro .intro-box:first-of-type { margin-right: 8%; } .intro .intro-box ~ .intro-box { margin-right: 10%; } .intro .intro-bottom-elem { width: 38%; } } /* Mobile */ @media (max-width: 767px) { .intro .intro-inner { height: 208px; } .intro .intro-body { top: 120px; } .intro .intro-body h1 { font-weight: 900; font-size: 44px; margin-bottom: 10px; } .intro .intro-body h3 { font-size: 22px; margin-bottom: 70px; } .intro .intro-box:first-of-type { margin-right: 0; width: 100%; margin-bottom: 29px; } .intro .intro-box ~ .intro-box { margin-right: 0; width: 100%; } .intro-box .intro-box-head .btn { padding: 8px 30px 7px; position: relative; font-size: 30px; } .intro-box .intro-box-head .btn small { width: 63px; text-align: center; position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .intro .intro-bottom-elem { display: none; } .intro-box.opened .intro-box-head .btn small { display: none; } .intro .intro-title { font-size: 39px; bottom: 0; } .intro .intro-box.opened:first-of-type { margin-bottom: 0; } } @media (max-width: 374px) { .intro .intro-body { top: 80px; } .intro .intro-body h3 { margin-bottom: 20px; } .intro .intro-box:first-of-type { margin-bottom: 10px; } .intro.intro-home.opened .intro-inner { height: 680px !important; } } /* ------------------------------------------------------------ *\ Intro Home \* ------------------------------------------------------------ */ .intro-home { background: url(images/temp/intro-home.jpg) no-repeat center top; background-size: cover; } .intro-home:before { content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-color: #000; opacity: 0; z-index: 2; transition: opacity .5s; } .intro-home .intro-inner { height: calc(100vh + 43px); } .intro-home .intro-body { transition: top .5s; } .intro-home.opened:before { opacity: .65; } .intro-home.opened .intro-body { top: 14%; } .intro-home.opened .intro-box-body { border-top-color: #fff; } .intro-home.opened .btn-orange { background: rgba(255, 255, 255, .4); } .intro-home.opened .opened .btn-orange { background-color: #f15a22; padding-top: 15px; } /* Mobile */ @media (max-width: 767px) { .intro-home .intro-inner { height: 100vh; } .intro-home.opened:before { opacity: .9; } .intro-home.opened .intro-body { top: 10%; } .intro .intro-body h1 { font-size: 34px; } .intro.opened .intro-body h3 { font-size: 20px; margin-bottom: 30px; } .intro-box .intro-box-head .btn { font-size: 26px; } .intro-box .field { height: 37px; line-height: 35px; } } @media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait) { .intro-home .intro-inner { height: 981px; } } @media all and (device-width: 768px) and (device-height: 1024px) and (orientation:landscape) { .intro-home .intro-inner { height: 725px; } } /* ------------------------------------------------------------ *\ Intro Management \* ------------------------------------------------------------ */ .intro-management { background: url(images/temp/intro-management.jpg) no-repeat center top; background-size: cover; } /* ------------------------------------------------------------ *\ Intro Faq \* ------------------------------------------------------------ */ .intro-faq { background: url(images/temp/intro-faq.jpg) no-repeat center top; background-size: cover; } /* ------------------------------------------------------------ *\ Intro Media \* ------------------------------------------------------------ */ .intro-media { background: url(images/temp/intro-media.jpg) no-repeat center top; background-size: cover; } /* ------------------------------------------------------------ *\ Intro Article \* ------------------------------------------------------------ */ .intro-article { background: url(images/temp/intro-article.jpg) no-repeat center top; background-size: cover; } /* ------------------------------------------------------------ *\ Intro Loans \* ------------------------------------------------------------ */ .intro-loans { background: url(images/intro-loans-bg.jpg) no-repeat center center; background-size: cover; } /* ------------------------------------------------------------ *\ Intro Regsiter \* ------------------------------------------------------------ */ .intro-register { background: url(images/temp/intro-register.jpg) no-repeat center center; background-size: cover; } /* ------------------------------------------------------------ *\ List \* ------------------------------------------------------------ */ [class^="list-"] { list-style: none outside none; } /* ------------------------------------------------------------ *\ List Stats \* ------------------------------------------------------------ */ .list-stats { overflow: hidden; margin-right: -32px; } .list-stats li { float: right; width: 25%; padding-right: 32px; } .list-stats h2 { font-weight: 300; font-size: 50px; color: #2b2e32; line-height: 1; margin: 0; } .list-stats h2 span { display: inline-block; vertical-align: middle; } .list-stats h3 { font-family: 'Open Sans Hebrew', sans-serif; font-weight: 400; font-size: 24px; color: #2b2e32; margin: 0 0 5px; line-height: 1; } .list-stats a { display: inline-block; font-family: 'Open Sans Hebrew', sans-serif; font-size: 16px; text-decoration: none; } /* Small Desktop */ @media (max-width: 1199px) { .list-stats h2 { font-size: 46px; } .list-stats h3 { font-size: 20px; } } /* Tablet Portrait */ @media (max-width: 1023px) { .list-stats h2 { font-size: 32px; } .list-stats h3 { font-size: 16px; } .list-stats a { font-size: 14px; } } /* Mobile */ @media (max-width: 767px) { .list-stats { margin: 0; } .list-stats li { width: 50%; padding: 0; margin-bottom: 20px; } .list-stats li:nth-child(2n+1) { clear: right; } .list-stats h2 { font-size: 24px; } .list-stats h2 i { -webkit-transform: scale(.5); -ms-transform: scale(.5); transform: scale(.5); } .list-stats h2 .ico-handshake { margin-left: -7px; } .list-stats h3 { font-size: 15px; margin: 0; } .list-stats a { font-size: 12px; } } /* ------------------------------------------------------------ *\ List Info \* ------------------------------------------------------------ */ .list-info { font-family: 'AlmoniDLAAA', sans-serif; font-size: 16px; line-height: 1.38; letter-spacing: 0.03em; color: #4b4b4b; } /* ------------------------------------------------------------ *\ List Info Secondary \* ------------------------------------------------------------ */ .list-info-secondary { font-size: 16px; letter-spacing: 0.03em; color: #4b4b4b; } .list-info-secondary span { display: block; margin-bottom: -4px; font-size: 20px; color: #67c18c; } .list-info-secondary strong { display: block; margin-bottom: -4px; font-size: 20px; } .list-info-secondary li + li { margin-top: 8px; } /* ------------------------------------------------------------ *\ List Squares \* ------------------------------------------------------------ */ .list-squares li { font-weight: 400; font-size: 22px; color: #10385a; line-height: 1.3; position: relative; } .list-squares li:before { content: ''; width: 10px; height: 10px; background-color: #d37a72; border: 3px solid #132a18; position: absolute; right: -20px; top: 10px; } /* Tablet Portrait */ @media (max-width: 1023px) { .list-squares li { font-size: 18px; } } /* ------------------------------------------------------------ *\ Logo \* ------------------------------------------------------------ */ .logo {} /* ------------------------------------------------------------ *\ Member \* ------------------------------------------------------------ */ .member { float: right; width: 44%; margin-right: 7%; margin-bottom: 100px; letter-spacing: 0; } .member:nth-child(2n+1) { clear: right; margin-right: 0; } .member .member-image { float: right; width: 33%; } .member .member-image img { width: 100%; height: auto; border-radius: 50%; } .member .member-content { float: right; width: 65%; padding-right: 32px; padding-top: 40px; } .member .member-head { margin-bottom: 11px; position: relative; } .member .member-head h3 { font-weight: 400; color: #4b4b4b; margin: 0; line-height: 1; } .member .member-head h4 { font-weight: 400; color: #818181; margin: 0; } .member .member-socials { position: absolute; left: 0; top: 8px; } .member .member-socials ul { list-style: none; font-size: 0; } .member .member-socials ul li { display: inline-block; vertical-align: bottom; margin-right: 10px; } .member .member-body p { font-size: 16px; color: #4b4b4b; } /* Small Desktop */ @media (max-width: 1199px) { .member { width: 48%; margin-right: 4%; } } /* Tablet Portrait */ @media (max-width: 1023px) { .member { margin-bottom: 60px; } .member .member-content { padding-top: 10px; padding-right: 20px; } .member .member-head h3 { font-size: 24px; } .member .member-head h4 { font-size: 18px; } .member .member-socials { position: relative; top: 0; margin-top: 3px; } .member .member-body p { font-size: 14px; } .member .member-socials ul li { margin-right: 0; } .member .member-socials ul li ~ li { margin-right: 10px; } } /* Mobile */ @media (max-width: 767px) { .member { float: none; width: 100%; margin-right: 0; overflow: hidden; margin-bottom: 30px; } .member .member-image { width: 35%; } .member .member-content { padding-top: 0; } .member .member-head h3 { font-size: 18px; } .member .member-head h4 { font-size: 12px; } .member .member-socials { position: absolute; left: 0; top: 0; margin: 0; } .member .member-socials a { display: block; -webkit-transform: scale(.55); -ms-transform: scale(.55); transform: scale(.55); } .member .member-socials ul li ~ li { margin-right: 0; } .member .member-body p { font-size: 12px; } } /* ------------------------------------------------------------ *\ Nav \* ------------------------------------------------------------ */ .nav > ul { list-style: none; } .nav > ul > li { display: inline-block; vertical-align: middle; position: relative; } .nav > ul > li ~ li { padding-right: 33px; } .nav > ul > li ~ li:before { content: '/'; position: absolute; right: 15px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); font-size: 16px; color: #fff; } .nav > ul > li > a { display: block; font-size: 16px; color: #fff; text-decoration: none; } .nav > ul > li > a:hover { text-decoration: underline; } .nav .caret { display: inline-block; vertical-align: middle; border-left: 4px solid transparent; border-right: 4px solid transparent; border-bottom: 0; border-top: 4px solid #fff; margin-right: 5px; } .nav-trigger { display: none; } .nav > a { display: none; } .nav > ul > li:hover .nav-dropdown { opacity: 1; visibility: visible; } /* Mobile */ @media (max-width: 767px) { .nav > a { display: block; } .nav > a.btn { width: 46%; position: absolute; right: 10px; bottom: 50px; font-size: 18px; line-height: 1.2; } .nav > a.btn:after { content: ''; width: 100%; height: 2px; background-color: #4e9a7e; position: absolute; margin-top: 1px; top: 100%; left: 0; } .nav > a.btn small { font-size: 12px; } .nav > a.btn ~ .btn { right: auto; left: 10px; } .nav > ul > li:hover .nav-dropdown { opacity: 0; visibility: hidden; } .nav.hide > ul > li:hover .nav-dropdown.opened { display: block; opacity: 1; visibility: visible; } } @media (max-width: 374px) { .nav > a.btn { font-size: 16px; bottom: 20px; } } /* ------------------------------------------------------------ *\ Nav Dropdown \* ------------------------------------------------------------ */ .nav-dropdown { width: 176px; opacity: 0; visibility: hidden; position: absolute; right: 33px; top: 100%; z-index: 999; transition: all .3s; padding-top: 5px; border-bottom: 1px solid #67c18c; } .nav-dropdown h2 { display: none; } .nav-dropdown .go-back { display: none; } .nav-dropdown ul { background-color: #10385a; border-top: 1px solid #67c18c; padding: 10px 0; } .nav-dropdown ul a { text-decoration: none; padding: 10px 20px; font-size: 14px; line-height: 2.14; } .nav-dropdown ul a:hover { text-decoration: underline; } /* Mobile */ @media (max-width: 767px) { .nav-dropdown { position: fixed; left: 0; width: auto; top: 55px; right: 0; bottom: 0; z-index: 999; background: rgba(16, 56, 90, .98); text-align: center; padding-right: 50px; padding-top: 0; border: 0; transition: all 0s; } .nav-dropdown:after { content: ''; width: 50px; height: 100%; background-color: #071624; position: absolute; right: 0; top: 0; z-index: 999; } .nav-dropdown.opened { display: block; opacity: 1; visibility: visible; } .nav-dropdown h2 { display: block; font-weight: 400; color: #fff5e6; margin: 40px 0; } .nav-dropdown ul { list-style: none; background: none; border: 0; padding: 0; } .nav-dropdown ul a { display: block; font-size: 24px; color: #67c18c; text-decoration: none; padding: 20px 0; } .nav-dropdown a.go-back { display: block; width: auto; height: auto; padding: 0; position: absolute; right: 15px; top: 55px; z-index: 1000; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } } @media (max-width: 374px) { .nav-dropdown ul a { padding: 15px 0; } } /* ------------------------------------------------------------ *\ Nav Footer \* ------------------------------------------------------------ */ .nav-footer ul { list-style: none; } .nav-footer ul a { display: block; font-family: 'Open Sans Hebrew', sans-serif; font-size: 16px; color: #fff; text-decoration: none; line-height: 2.13; letter-spacing: 0; } .nav-footer ul a:hover { text-decoration: underline; } /* Tablet Portrait */ @media (max-width: 1023px) { .nav-footer ul a { font-size: 14px; } } /* Mobile */ @media (max-width: 767px) { .nav-trigger { display: block; width: 20px; position: absolute; right: 12px; top: 16px; z-index: 99; transition: top .5s; } .nav-trigger .bar { display: block; height: 2px; background-color: #67c18c; transition: all .5s; position: relative; top: 0; } .nav-trigger .bar ~ .bar { margin-top: 8px; } .nav-trigger.active .bar:nth-child(2) { opacity: 0; } .nav-trigger.active .bar:first-child { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); top: 10px; } .nav-trigger.active .bar:last-child { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); top: -10px; } .nav-footer ul a { font-size: 15px; } .nav > ul > li { display: block; text-align: center; } .nav > ul > li ~ li { padding: 0; } .nav > ul > li ~ li:before { display: none; } .nav > ul > li > a { font-size: 30px; color: #67c18c; padding: 20px 0; position: relative; } .nav .caret { border: 0; width: 12px; height: 22px; background-image: url(images/sprite.png); background-position: -34px -310px; position: absolute; left: 12px; top: 50%; margin-top: -11px; } } @media (max-width: 374px) { .nav-dropdown h2 { margin: 20px 0 0; } } /* ------------------------------------------------------------ *\ Section \* ------------------------------------------------------------ */ .section .section-head { margin-bottom: 15px; position: relative; } .section .section-head h2 { display: inline-block; font-weight: 900; font-size: 48px; position: relative; color: #2b2e32; margin-bottom: 0; line-height: 1; } .section .section-head h2:before { content: ''; width: 42px; height: 2px; background-color: #67c18c; position: absolute; right: 0; bottom: -10px; transition: width .5s ease-in-out; } .section .section-head h2 span { display: inline-block; vertical-align: baseline; font-family: 'Open Sans Hebrew', sans-serif; font-weight: 400; font-size: 16px; color: #67c18c; margin-right: 10px; } .section .section-head h2 a { text-decoration: none; color: #2b2e32; } .section .section-head h2:hover:before { width: 100%; } /* Small Desktop */ @media (max-width: 1199px) { .section .section-head { margin-bottom: 25px; } } /* Tablet Portrait */ @media (max-width: 1023px) { .section .section-head h2 { font-size: 38px; } } /* Mobile */ @media (max-width: 767px) { .section .section-head h2 { font-size: 24px; } .section .section-head h2 span { font-size: 12px; } } /* ------------------------------------------------------------ *\ Section Loans \* ------------------------------------------------------------ */ .section-loans { margin-top: -37px; } .section-loans .section-head-actions { position: absolute; left: 9%; right: 0; bottom: 22px; z-index: 10; } .section-loans .slider-ticker-wrapper { font-weight: 300; font-size: 20px; color: #fff5e6; margin-bottom: 26px; letter-spacing: 0.0017em; position: relative; padding-right: 24px; text-align: left; } .section-loans .slider-ticker-wrapper .slider-ticker { position: relative; } .section-loans .slider-ticker-wrapper .slider-ticker div { position: absolute; left: 0; top: 0; white-space: nowrap; } .section-loans .section-head-actions .btn { float: left; margin-left: -5px; } /* Tablet Portrait */ @media (max-width: 1023px) { .section-loans .section-head-actions { left: 6%; } } /* Mobile */ @media (max-width: 767px) { .section-loans { margin-top: 0; padding-top: 50px; } .section-loans .section-head-actions { left: 50%; right: auto; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); bottom: 55px; } .section-loans .section-head-actions p { display: none; } .section-loans .section-head-actions .btn img { width: 92px; height: auto; } } /* ------------------------------------------------------------ *\ Section Ticker \* ------------------------------------------------------------ */ .section-ticker { background: rgba(255, 255, 255, 0.6); box-shadow: inset 0 1px 0 rgba(103, 193, 140, .2), inset 0 -1px 0 rgba(103, 193, 140, .2); padding: 20px 0 18px; position: relative; z-index: 10; } /* Mobile */ @media (max-width: 767px) { .section-ticker { padding: 5px 0 0; } } /* ------------------------------------------------------------ *\ Section Graph \* ------------------------------------------------------------ */ .section-graph { padding: 148px 0 115px; position: relative; z-index: 9; margin-top: -70px; background: url(images/hex-pattern.jpg) repeat left top; letter-spacing: 0; } .section-graph .section-head { margin-bottom: 67px; } .section-graph .section-body { overflow: hidden; } /* Diagram Base */ .section-graph .section-right, .section-graph .section-center, .section-graph .section-left { float: right; } .section-graph .section-right { width: 27.2%; } .section-graph .section-center { width: 43%; } .section-graph .section-left { width: 29%; } .section-graph .section-right ol, .section-graph .section-left ol { list-style: none; counter-reset: section; padding: 35px 0; min-height: 437px; } .section-graph .section-right ol li, .section-graph .section-left ol li { position: relative; } .section-graph .section-right ol li ~ li { margin-top: 58px; } .section-graph .section-left ol li ~ li { margin-top: 51px; } .section-graph .section-right ol li:before, .section-graph .section-left ol li:before { content: counter(section); counter-increment: section; font-size: 20px; color: #10385a; width: 23px; height: 23px; border: 1px solid #10385a; border-radius: 50%; background-color: #fff; text-align: center; line-height: 21px; position: absolute; left: -12px; top: 50%; margin-top: -11px; z-index: 2; } .section-graph .section-right ol li:after, .section-graph .section-left ol li:after { content: ''; width: 32px; height: 1px; background-color: #2b4e6c; position: absolute; left: 0; top: 50%; z-index: 1; } .section-graph .section-right ol h3, .section-graph .section-left ol h3 { color: #67c18c; line-height: 1; font-weight: 400; } .section-graph .section-right ol h3 span, .section-graph .section-left ol h3 span { display: block; font-size: 19px; color: #2b2e32; } .section-graph .section-left .link-more, .section-graph .section-right .link-more { display: none; } /* Diagram Right */ .section-graph .section-right ol { border-left: 1px solid #2b4e6c; } .section-graph .section-right ol li { padding-left: 125px; text-align: left; } .section-graph .section-right ol li .icon { position: absolute; width: 45px; text-align: center; left: 64px; top: 6px; } .section-graph .section-right ol h3 { margin-right: -10px; } /* Diagram Left */ .section-graph .section-left ol { border-right: 1px solid #2b4e6c; padding: 30px 0 35px; } .section-graph .section-left ol li { padding-right: 130px; text-align: right; } .section-graph .section-left ol li .icon { position: absolute; width: 45px; text-align: center; right: 64px; top: 6px; } .section-graph .section-left ol h3 { margin-left: -20px; } .section-graph .section-left ol li:before { left: auto; right: -12px; } .section-graph .section-left ol li:after { left: auto; right: 0; } /* Diagram Center */ .section-graph .section-center { padding-top: 130px; } .section-graph .section-center .diagram-tabs { text-align: center; margin-bottom: 20px; } .section-graph .section-center .diagram-tabs ul { list-style: none; font-size: 0; } .section-graph .section-center .diagram-tabs ul a { text-decoration: none; } .section-graph .section-center .diagram-tabs ul img { width: 150px; } .section-graph .section-center .diagram-tabs ul img.img-mobile { display: none; } .section-graph .section-center .diagram-tabs ul li { display: inline-block; vertical-align: middle; padding: 20px 25px; } .section-graph .section-center .diagram-tabs ul li ~ li { border-right: 1px solid #2b4e6c; } .section-graph .section-center .diagram-tabs h2 { font-weight: 400; font-size: 38px; color: #10385a; line-height: 1; } .section-graph .section-center .diagram-tabs h2 span { display: block; font-weight: 900; font-size: 14px; color: #67c18c; } .section-graph .section-center #tab-center { margin-right: 175px; } .section-graph .section-center #tab-center h3 { font-weight: 400; color: #f15a22; margin-bottom: 0; line-height: 1.3; } .section-graph .section-center .list-squares { margin-left: 70px; } /* Small Desktop */ @media (max-width: 1199px) { .section-graph .section-left ol h3, .section-graph .section-right ol h3 { font-size: 26px; } .section-graph .section-right ol h3 span, .section-graph .section-left ol h3 span { font-size: 16px; } .section-graph .section-right ol li { padding-left: 100px; } .section-graph .section-right ol li .icon { left: 42px; } .section-graph .section-center .diagram-tabs ul li { padding: 10px 15px; } .section-graph .section-center #tab-center { margin-right: 100px; } .section-graph .section-left ol li { padding-right: 100px; } .section-graph .section-left ol li .icon { right: 42px; } } /* Tablet Portrait */ @media (max-width: 1023px) { .section-graph { padding: 100px 0 60px; } .section-graph .section-center { padding-top: 200px; } .section-graph .section-center .diagram-tabs ul li { padding: 10px; } .section-graph .section-left ol li ~ li { margin-top: 41px; } .section-graph .section-center .diagram-tabs ul img { width: 100px; } .section-graph .section-center .diagram-tabs h2 { font-size: 24px; } .section-graph .section-center #tab-center { margin-right: 60px; } .section-graph .section-center #tab-center h3 { font-size: 26px; } } /* Mobile */ @media (max-width: 767px) { .section-graph { margin-top: -35px; padding: 55px 0 20px; } .section-graph .section-body { position: relative; min-height: 0; padding-top: 95px; padding-bottom: 35px; } .section-graph .section-center .diagram-tabs ul img.img-mobile { display: inline-block; margin-top: 30px; padding: 0 10px; } .section-graph .section-center .diagram-tabs ul img.img-desktop { display: none; } .section-graph .section-center .diagram-tabs { width: 100%; position: absolute; left: 0; top: 0; } .section-graph .section-center .diagram-tabs ul li { width: 33.3333%; padding: 0; } .section-graph .section-center .diagram-tabs ul li ~ li { border: 0; text-align: center; } .section-graph .section-center .diagram-tabs ul li a { display: block; height: 75px; } .section-graph .section-center .diagram-tabs ul li a[href='#tab-left'] { background-color: #2b6069; } .section-graph .section-center .diagram-tabs ul li a[href='#tab-center'] { background-color: #0f3659; } .section-graph .section-center .diagram-tabs ul li a[href='#tab-right'] { background-color: #67c08e; } .section-graph .section-center .diagram-tabs h2 { color: #fff; line-height: 75px; } .section-graph .section-center .diagram-tabs h2 span { display: none; } .section-graph .section-right, .section-graph .section-center, .section-graph .section-left { float: none; width: 100%; padding-left: 20px; } .section-graph .section-center { padding-top: 0; } .section-graph .section-center .diagram-tabs h2 { font-size: 20px; } .section-graph #tab-left, .section-graph #tab-center, .section-graph #tab-right { display: none; } .section-graph #tab-left.show, .section-graph #tab-center.show, .section-graph #tab-right.show { display: block; } .section-graph .section-right ol, .section-graph .section-left ol { min-height: 0; } .section-graph .section-center #tab-center { margin-right: 30px; } .section-graph .section-center .list-squares { margin: 0; } .section-graph .section-left ol { border-right: 0; border-left: 1px solid #2b4e6c; } .section-graph .section-left ol li { padding-right: 0; padding-left: 100px; text-align: left; } .section-graph .section-left ol li:before { left: -12px; right: auto; } .section-graph .section-left ol li .icon { right: auto; left: 42px; } .section-graph .section-left ol li:after { right: auto; left: 0; } .section-graph .section-left ol h3 { margin-left: 0; } .section-graph .section-left ol h3, .section-graph .section-right ol h3 { font-size: 22px; } .section-graph .section-center .diagram-tabs ul li a { position: relative; } .section-graph .section-center .diagram-tabs ul li a:before { content: ''; border-width: 5px 5px 0 5px; border-style: solid; position: absolute; left: 50%; margin-left: -5px; bottom: -5px; border-color: transparent transparent transparent transparent; } .section-graph .section-center .diagram-tabs ul li a[href='#tab-left'].current:before { border-color: #2b6069 transparent transparent transparent; } .section-graph .section-center .diagram-tabs ul li a[href='#tab-center'].current:before { border-color: #0f3659 transparent transparent transparent; } .section-graph .section-center .diagram-tabs ul li a[href='#tab-right'].current:before { border-color: #67c08e transparent transparent transparent; } .section-graph .section-right ol, .section-graph .section-left ol { padding: 20px 0; margin-bottom: 0; } .section-graph .section-right ol li ~ li { margin-top: 40px; } .section-graph .section-left ol li ~ li { margin-top: 30px; } .section-graph .section-left .link-more, .section-graph .section-right .link-more { display: block; text-align: left; font-size: 18px; text-decoration: none; } .section-graph .section-left .link-more:hover, .section-graph .section-right .link-more:hover { text-decoration: underline; } } /* ------------------------------------------------------------ *\ Section Articles \* ------------------------------------------------------------ */ .section-articles { padding: 80px 0 0; background-color: #f9f9f9; } .section-articles .section-head { margin-bottom: 67px; } /* Tablet Portrait */ @media (max-width: 1023px) { .section-articles { padding: 30px 0 0; } .section-articles .section-head { margin-bottom: 50px; } } /* Mobile */ @media (max-width: 767px) { .section-articles .section-head { margin-bottom: 35px; } } /* ------------------------------------------------------------ *\ Section Media \* ------------------------------------------------------------ */ .section-media { padding: 11px 0; background-color: #fff; border-bottom: 19px solid #f9f9f9; position: relative; overflow: hidden; } .section-media:before, .section-media:after { content: ''; left: 10px; right: 10px; height: 1px; background-color: #c1e5d0; position: absolute; } .section-media:before { top: 11px; } .section-media:after { bottom: 11px; } .section-media .section-head { float: right; margin: 10px 0; border-left: 1px solid #67c18c; width: 22%; padding-right: 37px; position: relative; z-index: 10; } .section-media .section-head h2 { font-weight: 400; font-size: 32px; color: #2b2e32; margin: 0; padding: 11px 0; line-height: .9; } .section-media .section-head h2 a { display: block; text-decoration: none; font-family: 'Open Sans Hebrew', sans-serif; font-size: 16px; color: #67c18c; } /* Small Desktop */ @media (max-width: 1199px) { .section-media .section-head h2 { font-size: 24px; } } /* Mobile */ @media (max-width: 767px) { .section-media .section-head { width: 34%; padding-right: 10px; margin: 7px 0; } .section-media .section-head h2 { font-size: 13px; padding: 0; } .section-media .section-head h2 a { font-size: 12px; } } /* ------------------------------------------------------------ *\ Section Testimonial \* ------------------------------------------------------------ */ .section-testimonial { padding: 48px 0 76px; } .section-testimonial .section-head { margin-bottom: 67px; } .section-testimonial .section-body { padding: 0 8.6%; } /* Small Desktop */ @media (max-width: 1199px) { .section-testimonial .section-body { padding: 0 4.6%; } } /* Mobile */ @media (max-width: 767px) { .section-testimonial { padding: 48px 0 60px; } .section-testimonial .section-head { margin-bottom: 30px; } .section-testimonial .section-head h2 span { margin-right: 0; } .section-testimonial .section-body { padding: 0 40px; } } /* ------------------------------------------------------------ *\ Section Stat \* ------------------------------------------------------------ */ .section-stat { padding: 50px 0; background: url(images/triangle-patern.jpg) repeat left top; letter-spacing: 0; } .section-stat .section-head { margin-bottom: 48px; } /* Mobile */ @media (max-width: 767px) { .section-stat { padding: 30px 0; } .section-stat .section-head { margin-bottom: 35px; } .section-stat .section-head h2 { font-size: 23px; } .section-stat .section-head h2 span { margin-right: 6px; } } /* ------------------------------------------------------------ *\ Section Channel \* ------------------------------------------------------------ */ .section-channel { padding: 50px 0 97px; } .section-channel .section-head { margin-bottom: 70px; } /* Mobile */ @media (max-width: 767px) { .section-channel { padding: 25px 0 60px; } .section-channel .section-head { margin-bottom: 35px; } } /* ------------------------------------------------------------ *\ Section Management \* ------------------------------------------------------------ */ .section-management .section-body { overflow: hidden; } /* ------------------------------------------------------------ *\ Section Content \* ------------------------------------------------------------ */ .section-content { padding-bottom: 50px; } .section-content .section-body { position: relative; } .section-content .section-border { width: 1px; height: 100%; background-color: #10385a; position: absolute; left: 25.5%; top: 0; } .section-content .section-body:after, .section-content .section-body:before { content: ''; display: table; } .section-content .section-body:after { clear: both; } .section-content .article { margin-top: -100px; } /* Mobile */ @media (max-width: 767px) { .section-content .section-border { display: none; } .section-content .article { margin-top: -10px; } } /* ------------------------------------------------------------ *\ Section Faq \* ------------------------------------------------------------ */ .section-faq { padding: 0 0 50px; letter-spacing: 0; margin-top: -100px; } .section-faq .section-head { margin-bottom: 42px; } .section-faq .section-head h2 { font-weight: 400; color: #2b2e32; margin-bottom: 0; } /* Mobile */ @media (max-width: 767px) { .section-faq { margin-top: 0; padding-top: 80px; padding-bottom: 0; position: relative; } .section-faq .section-head { display: none; } } /* ------------------------------------------------------------ *\ Section Job \* ------------------------------------------------------------ */ .section-job { margin-top: -100px; } .section-job .section-head { margin-bottom: 40px; } .section-job .section-head h2 { font-weight: 400; color: #2b2e32; margin-bottom: 0; } .section-job .section-body p { margin: 0; } .section-job .section-body .btn { margin-top: 50px; height: 57px; line-height: 57px; font-weight: 900; font-size: 30px; padding: 0 49px; } /* Mobile */ @media (max-width: 767px) { .section-job { margin-top: -10px; } .section-job .section-head { margin-bottom: 10px; } .section-job .section-head h2 { font-weight: 900; font-size: 18px; } .section-job .section-body p { font-size: 12px; } .section-job .section-body .btn { height: 42px; line-height: 42px; margin-top: 30px; font-size: 21px; } } /* ------------------------------------------------------------ *\ Section Job Intro \* ------------------------------------------------------------ */ .section-job-intro { padding-bottom: 13px; } .section-job-intro .section-body p { margin-bottom: 22px; line-height: 1.2; padding-left: 10px; } .section-job-intro .section-body img { width: 100%; height: auto; margin-top: 53px; } /* Mobile */ @media (max-width: 767px) { .section-job-intro { padding-top: 30px; padding-bottom: 0; } .section-job-intro .section-body p { font-size: 12px; line-height: 1.8; } .section-job-intro .section-body img { margin-top: 0; } } /* ------------------------------------------------------------ *\ Section Jobs \* ------------------------------------------------------------ */ .section-jobs ul { list-style: none; margin-right: -29px; letter-spacing: 0; } .section-jobs ul li { float: right; width: 50%; padding-bottom: 46.8%; padding-right: 29px; margin-top: 29px; position: relative; } .section-jobs ul a { position: absolute; left: 0; top: 0; right: 26px; bottom: 0; background-color: #67c18c; padding: 15px 20px; color: #fff; text-decoration: none; transition: background-color .3s; } .section-jobs ul a:hover { background-color: #3f7656; } .section-jobs ul h4 { font-weight: 900; margin-bottom: 15px; } .section-jobs ul p { font-size: 16px; line-height: 1.3; } /* Tablet Portrait */ @media (max-width: 1023px) { .section-jobs ul li { padding-bottom: 44.8%; } } /* Mobile */ @media (max-width: 767px) { .section-jobs ul { margin-right: -10px; } .section-jobs ul li { margin-top: 10px; padding-right: 10px; } .section-jobs ul a { right: 10px; padding: 5px 8px; } .section-jobs ul h4 { font-size: 18px; margin-bottom: 0; } .section-jobs ul p { font-size: 12px; } } /* ------------------------------------------------------------ *\ Section Media Listing \* ------------------------------------------------------------ */ .section-media-listing { padding-bottom: 50px; } .section-media-listing .media-item ~ .media-item { margin-top: 73px; } .section-media-listing .media-item-head { margin-bottom: 22px; } .section-media-listing .media-item-head a.media-logo { display: inline-block; vertical-align: bottom; margin-left: 26px; } .section-media-listing .media-item-head .meta { display: inline-block; vertical-align: bottom; margin: 0; color: #4b4b4b; position: relative; top: 8px; } .section-media-listing .media-item-head h4 { margin: 31px 0 0; } .section-media-listing .media-item-head h4 a { color: #4b4b4b; text-decoration: none; } .section-media-listing .media-item-head h4 a:hover { text-decoration: underline; } .section-media-listing .media-item-body p { color: #4b4b4b; margin-bottom: 0; line-height: 1.2; } .section-media-listing .media-item-body p ~ p { margin-top: 25px; } .section-media-listing .section-actions { margin-top: 50px; } .section-media-listing .section-actions .link-more { text-decoration: none; font-size: 16px; } .section-media-listing .section-actions .link-more:hover { text-decoration: underline; } /* Mobile */ @media (max-width: 767px) { .section-media-listing { padding-bottom: 0; margin-bottom: -15px; } .section-media-listing .media-item-head { margin-bottom: 10px; } .section-media-listing .media-item-head h4 { margin-top: 10px; font-size: 12px; } .section-media-listing .media-item-head .meta { font-size: 12px; top: 1px; } .section-media-listing .media-item-head a.media-logo { max-width: 100px; margin-left: 10px; } .section-media-listing .media-item-head a.media-logo img { width: auto; max-height: 44px; height: auto; } .section-media-listing .media-item-body p { font-size: 12px; } .section-media-listing .media-item ~ .media-item { margin-top: 30px; } .section-media-listing .section-actions { margin-top: 20px; } .section-media-listing .section-actions .link-more { font-size: 12px; } } /* ------------------------------------------------------------ *\ Section Secondary \* ------------------------------------------------------------ */ .section-secondary { margin: -103px 0 51px; } .section-secondary h2 { font-family: 'AlmoniDLAAA', sans-serif; font-weight: 400; letter-spacing: 0.03em; color: #2b2e32; margin-bottom: 7px; } .section-secondary h2 small { font-family: 'Open Sans Hebrew', sans-serif; font-size: 16px; letter-spacing: 0; color: #67c18c; } .section-secondary small { font-family: 'AlmoniDLAAA', sans-serif; font-size: 14px; letter-spacing: 0.03em; color: #4b4b4b; } .section-secondary .section-head { margin-bottom: 55px; } .section-secondary .section-actions { padding: 28px 0 4px; text-align: left; } .section-secondary .section-actions + h2 { padding-bottom: 16px; } /* ------------------------------------------------------------ *\ Section Charts \* ------------------------------------------------------------ */ .section-charts p { margin-bottom: 43px; line-height: 24px; } .section-charts h4 { margin-bottom: 23px; } .section-charts p, .section-charts h4 { font-family: 'AlmoniDLAAA', sans-serif; font-size: 20px; letter-spacing: 0.03em; color: #4b4b4b; } .section-charts .cols + .cols { margin-top: 7px; } .section-charts .cols:last-child .col:last-child { padding-top: 42px; } .section-charts .cols { margin-left: -28px; } .section-charts .cols .col { padding-left: 28px; } .section-charts .cols:last-child .col:last-child { padding-left: 13px; } .section-charts .list-info { float: right; } .section-charts .list-info + .list-info { float: left; text-align: left; } @media (max-width: 1023px) { /* ------------------------------------------------------------ *\ Section Charts \* ------------------------------------------------------------ */ .section-charts .cols { margin: 0; } .section-charts .cols .col { float: none; width: 100%; padding: 0; margin-bottom: 20px; } .section-charts .cols:last-child .col:last-child { padding: 0; } .section-charts .section-inner { max-width: 380px; } /* ------------------------------------------------------------ *\ Section Secondary \* ------------------------------------------------------------ */ .section-secondary h2 { line-height: 1; } .section-secondary .section-actions { text-align: center; padding-bottom: 30px; } } @media (max-width: 767px) { /* ------------------------------------------------------------ *\ Section Secondary \* ------------------------------------------------------------ */ .section-secondary { margin-top: 0; } } /* ------------------------------------------------------------ *\ Ssection Register Opening \* ------------------------------------------------------------ */ .section-register-opening { color: #4b4b4b; } .section-register-opening .section-head { margin: -93px 0 48px; } .section-register-opening .section-head h2 { font-weight: 400; font-size: 40px; } .section-register-opening .section-head h2 span { margin: 0; } .section-register-opening .section-head h2:before { display: none; } .section-register-opening .section-body:before, .section-register-opening .section-body:after { content: ''; display: table; } .section-register-opening .section-body:after { clear: both; } .section-register-opening .social-login { padding-left: 102px; border-left: 1px solid #10385a; } .section-register-opening .social-login h4 { margin-bottom: 22px; } .section-register-opening .social-login .btn { width: 100%; height: 52px; text-align: center; line-height: 52px; } .section-register-opening .social-login .btn i { position: relative; -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); left: 0; top: -2px; margin-right: 15px; } .section-register-opening .social-login ul { margin-top: 20px; padding: 0; text-align: center; font-size: 0; } .section-register-opening .social-login ul li { display: inline-block; vertical-align: middle; } .section-register-opening .social-login ul li ~ li { margin-right: 10px; padding-right: 10px; border-right: 1px solid #67c18c; } .section-register-opening .social-login ul a { display: block; font-size: 14px; color: #67c18c; line-height: 1; text-decoration: underline; } .section-register-opening .social-login ul a:hover { text-decoration: none; } /* Tablet Portrait */ @media (max-width: 1023px) { .section-register-opening .social-login { padding-left: 30px; } .section-register-opening .social-login .btn { width: 100%; } } /* Mobile */ @media (max-width: 767px) { .section-register-opening .section-head { margin-top: 0; margin-bottom: 30px; } .section-register-opening .social-login { padding: 0; border: 0; } } /* ------------------------------------------------------------ *\ Section Visits \* ------------------------------------------------------------ */ .section-visits { padding-right: 30px; } .section-visits h4 { margin-bottom: 27px; } .section-visits .chart { width: 100%; } /* Mobile */ @media (max-width: 767px) { .section-visits { padding: 0; margin-top: 30px; } } /* ------------------------------------------------------------ *\ Section Register \* ------------------------------------------------------------ */ .section-register { color: #4b4b4b; } .section-register .section-head { margin: -96px 0 50px; } .section-register .section-head h2 { font-weight: 400; font-size: 40px; } .section-register .section-head h2 span { margin: 0; } .section-register .section-head h2:before { display: none; } /* Mobile */ @media (max-width: 767px) { .section-register .section-head { margin: 0 0 30px; } } /* ------------------------------------------------------------ *\ Section Register Thanks \* ------------------------------------------------------------ */ .section-register-thanks { color: #4b4b4b; } .section-register-thanks .section-head { margin: -95px 0 50px; } .section-register-thanks .section-head h2 { font-weight: 400; font-size: 40px; } .section-register-thanks .section-head h2 span { margin: 0; } .section-register-thanks .section-head h2:before { display: none; } .section-register-thanks .section-body:before, .section-register-thanks .section-body:after { content: ''; display: table; } .section-register-thanks .section-body:after { clear: both; } .section-register-thanks .section-actions { text-align: left; padding-left: 73px; } .section-register-thanks .section-actions .btn { height: 62px; line-height: 62px; width: 308px; } .section-register-thanks h4 { margin-bottom: 42px; } .section-register-thanks p { font-weight: 300; font-size: 20px; line-height: 1.3; margin-bottom: 19px; } .section-register-thanks .share { border-top: 1px solid #10385a; padding-top: 30px; margin-top: 30px; text-align: left; } .section-register-thanks .share p { margin-bottom: 7px; text-align: right; } .section-register-thanks .details p { font-weight: 400; margin-bottom: 3px; } .section-register-thanks .details p span { display: inline-block; font-weight: 300; color: #4b4b4b; } .section-register-thanks .details p small { display: block; font-size: 16px; margin-top: -5px; font-weight: 300; margin-bottom: 15px; } .section-register-thanks .details ul { list-style: none; } .section-register-thanks .details ul li { margin-bottom: 4px; } .section-register-thanks .details ul a { text-decoration: none; font-weight: 400; font-size: 20px; } .section-register-thanks .section-actions { margin-top: 10px; } /* Tablet Portrait */ @media (max-width: 1023px) { .section-register-thanks .section-head h2 { width: 46%; } } /* Mobile */ @media (max-width: 767px) { .section-register-thanks .section-head { margin: 0 0 30px; } .section-register-thanks .section-head h2 { width: 100%; } .section-register-thanks h4 { margin-bottom: 30px; } } /* ------------------------------------------------------------ *\ Slider \* ------------------------------------------------------------ */ .slider { position: relative; } .slider .slides { list-style: none outside none; } .slider .owl-item { -webkit-backface-visibility: visible; } /* ------------------------------------------------------------ *\ Slider Loans \* ------------------------------------------------------------ */ .slider-loans { padding: 0 7.2% 55px; } .slider-loans .owl-item { padding: 5px 18px; } .slider-loans .slide { box-shadow: 0 0 7px rgba(139, 145, 147, .25); min-height: 451px; padding: 22px 17px 17px; } .slider-loans .slide .slide-head { padding-bottom: 15px; border-bottom: 1px solid #10385a; margin-bottom: 12px; position: relative; padding-right: 10px; } .slider-loans .slide .slide-head h3 { font-weight: 900; font-size: 26px; color: #2b2e32; margin: 0; } .slider-loans .slide .label { width: 75px; height: 75px; background: url(images/label.png) no-repeat 0 0; position: absolute; left: -29px; top: -36px; } .slider-loans .slide .label span { display: block; font-weight: 900; font-size: 14px; color: #10385a; letter-spacing: 0.04em; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); z-index: 10; position: absolute; left: 9px; top: 20px; } .slider-loans .slide .slide-body { padding: 0 10px; } .slider-loans .slide .slide-body ul { list-style: none; margin: 0 0 6px; } .slider-loans .slide .slide-body li { font-family: 'Open Sans Hebrew', sans-serif; font-size: 16px; color: #2b2e32; line-height: 1.9; } .slider-loans .slide .slide-body li strong { float: left; } .slider-loans .slide .slide-body p { font-family: 'Open Sans Hebrew', sans-serif; font-size: 16px; color: #2b2e32; line-height: 1.4; margin-bottom: 10px; letter-spacing: 0.04em; } .slider-loans .slide .slide-foot { position: absolute; left: 32px; right: 32px; bottom: 24px; border-top: 1px solid #10385a; padding-top: 8px; padding-bottom: 2px; border-bottom: 3px solid #67c18c; } .slider-loans .slide .slide-foot p { font-family: 'Open Sans Hebrew', sans-serif; font-size: 16px; color: #4b4b4b; margin-bottom: 5px; overflow: hidden; padding-right: 10px; } .slider-loans .slide .slide-foot p span { display: inline-block; vertical-align: middle; margin-right: 5px; } .slider-loans .slide .slide-foot .share { float: left; width: 43px; text-align: center; border-right: 1px solid #879bac; padding: 3px 0; } .slider-loans .slide .slide-foot .btn { width: 100%; font-size: 0; padding: 9px 20px 7px 5px; text-align: right; } .slider-loans .slide .slide-foot .btn-text { display: inline-block; vertical-align: middle; font-weight: 900; font-size: 30px; } .slider-loans .slide .slide-foot .btn-text-secondary { display: inline-block; vertical-align: middle; font-size: 28px; text-align: center; line-height: 1; padding-right: 10px; border-right: 1px solid #fff; margin-right: 35px; } .slider-loans .slide .slide-foot .btn-text-secondary small { display: block; font-size: 14px; } .slider-loans .owl-prev, .slider-loans .owl-next { font-size: 0; position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .slider-loans .owl-prev { width: 26px; height: 53px; background-image: url(images/sprite.png); background-position: 0 -253px; left: -9%; } .slider-loans .owl-next { width: 26px; height: 53px; background-image: url(images/sprite.png); background-position: -30px -253px; right: -9%; } .slider-loans .amount { background-color: #f15a22; padding: 8px 4px 4px; position: relative; } .slider-loans .amount h4 { font-family: 'Open Sans Hebrew', sans-serif; font-weight: 400; font-size: 20px; color: #fff; margin-bottom: 15px; padding: 0 10px; } .slider-loans .amount .btn-reset { position: absolute; left: 10px; top: 6px; } .slider-loans .slide .slide-foot .btn-white { font-size: 30px; padding: 0; height: 65px; border: 4px solid #f15a22; text-align: center; } /* Small Desktop */ @media (max-width: 1199px) { .slider-loans { padding: 0 3% 55px; } .slider-loans .slide .slide-body p { font-size: 14px; } .slider-loans .slide .slide-foot .btn-text { font-size: 24px; } .slider-loans .owl-prev { left: -26px; } .slider-loans .owl-next { right: -26px; } } /* Mobile */ @media (max-width: 767px) { .slider-loans { padding: 0 0 55px; } .slider-loans .owl-item { padding: 5px 40px; } .slider-loans .owl-prev, .slider-loans .owl-next { -webkit-transform: scale(.7) translateY(-50%); -ms-transform: scale(.7) translateY(-50%); transform: scale(.7) translateY(-50%); } .slider-loans .owl-prev { left: 0; } .slider-loans .owl-next { right: 0; } .slider-loans .slide { min-height: 326px; padding: 10px; } .slider-loans .slide .slide-head h3 { font-size: 18px; } .slider-loans .slide .slide-body { padding: 0 5px; } .slider-loans .slide .slide-body li, .slider-loans .slide .slide-body p, .slider-loans .slide .slide-foot p { font-size: 12px; } .slider-loans .slide .slide-foot { padding-top: 5px; left: 50px; right: 50px; bottom: 15px; } .slider-loans .slide .slide-foot p { height: 20px; } .slider-loans .slide .slide-foot p i { -webkit-transform: scale(.7); -ms-transform: scale(.7); transform: scale(.7); } .slider-loans .slide .slide-foot .share { padding: 0; } .slider-loans .slide .slide-foot .btn-text { font-size: 21px; } .slider-loans .slide .slide-foot .btn { padding: 9px 0 7px 46px; position: relative; text-align: center; } .slider-loans .slide .slide-foot .btn-text-secondary { margin: 0; position: absolute; width: auto; text-align: center; left: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); font-size: 21px; padding: 0 10px; } .slider-loans .slide .slide-foot .btn-text-secondary small { font-size: 12px; } .slider-loans .slide .slide-foot .btn-white { padding: 4px 10px 2px; font-size: 21px; height: auto; line-height: 1.3; } .slider-loans .amount h4 { font-size: 14px; margin-bottom: 5px; } .slider-loans .slide .label { left: -22px; top: -23px; } } /* ------------------------------------------------------------ *\ Slider Ticker \* ------------------------------------------------------------ */ .slider-ticker { position: relative; height: 18px; } .slider-ticker p { font-family: 'Open Sans Hebrew', sans-serif; font-size: 18px; color: #4b4b4b; margin: 0; line-height: 1; margin-left: 35px; padding-left: 35px; border-left: 1px solid #6f6f6f; } .slider-ticker .owl-stage { transition-timing-function: linear !important; } /* Mobile */ @media (max-width: 767px) { .slider-ticker p { font-size: 12px; margin-left: 20px; padding-left: 20px; } } /* ------------------------------------------------------------ *\ Slider Articles \* ------------------------------------------------------------ */ .slider-articles { padding: 0 7.2% 25px; } .slider-articles .owl-item { padding: 0 17px; } .slider-articles .owl-prev, .slider-articles .owl-next { font-size: 0; position: absolute; top: 52%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .slider-articles .owl-prev { width: 26px; height: 53px; background-image: url(images/sprite.png); background-position: 0 -253px; left: -9%; } .slider-articles .owl-next { width: 26px; height: 53px; background-image: url(images/sprite.png); background-position: -30px -253px; right: -9%; } .slider-articles .slide-image { margin-bottom: 9px; } .slider-articles .slide-image img { width: 100%; height: auto; } .slider-articles .slide-content { letter-spacing: 0.04em; } .slider-articles .slide-content h3 { font-weight: 900; font-size: 26px; color: #2b2e32; line-height: .9; margin-bottom: 15px; } .slider-articles .slide-content h3 a { color: #2b2e32; text-decoration: none; } .slider-articles .slide-content p { font-family: 'Open Sans Hebrew', sans-serif; font-size: 16px; color: #2b2e32; line-height: 1.4; margin-bottom: 10px; } /* Small Desktop */ @media (max-width: 1199px) { .slider-articles { padding: 0 3% 25px; } .slider-articles .owl-prev { left: -26px; } .slider-articles .owl-next { right: -26px; } } /* Mobile */ @media (max-width: 767px) { .slider-articles { padding: 0 0 10px; } .slider-articles .owl-item { padding: 0 40px; } .slider-articles .owl-prev, .slider-articles .owl-next { -webkit-transform: scale(.7) translateY(-50%); -ms-transform: scale(.7) translateY(-50%); transform: scale(.7) translateY(-50%); } .slider-articles .owl-prev { left: 0; } .slider-articles .owl-next { right: 0; } .slider-articles .slide-content h3 { font-size: 18px; margin-bottom: 5px; } .slider-articles .slide-content p { font-size: 12px; } } /* ------------------------------------------------------------ *\ Slider Media \* ------------------------------------------------------------ */ .slider-media { padding: 10px 0; } .slider-media .owl-stage { transition-timing-function: linear !important; } .slider-media .slide { margin-right: 40px; } .slider-media .slide-image { display: table; width: 100%; height: 81px; vertical-align: middle; } .slider-media .slide-image a { display: table-cell; vertical-align: middle; } /* Mobile */ @media (max-width: 767px) { .slider-media .slide { margin-right: 10px; } .slider-media .slide-image { height: auto; } .slider-media .slide-image img { max-height: 16px; width: auto; } } /* ------------------------------------------------------------ *\ Slider Testimonials \* ------------------------------------------------------------ */ .slider-testimonials .slide { overflow: hidden; background-color: #10385a; } .slider-testimonials .slide-content, .slider-testimonials .slide-image { float: right; width: 50%; position: relative; } .slider-testimonials .slide-content { left: 50%; } .slider-testimonials .slide-image { left: -50%; } .slider-testimonials .slide-content { text-align: center; padding: 66px 60px 50px; color: #fff; } .slider-testimonials .slide-content blockquote p { font-weight: 300; font-size: 28px; color: #fff5e6; margin-bottom: 70px; line-height: 1.2; } .slider-testimonials .slide-content blockquote cite { display: inline-block; font-family: 'Open Sans Hebrew', sans-serif; font-style: normal; font-size: 20px; color: #fff5e6; margin-top: 54px; position: relative; } .slider-testimonials .slide-content blockquote cite:before { content: ''; width: 74px; height: 1px; background-color: #67c18c; position: absolute; left: 50%; top: -50px; margin-left: -37px; } .slider-testimonials .owl-prev, .slider-testimonials .owl-next { font-size: 0; position: absolute; top: 60%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .slider-testimonials .owl-prev { width: 26px; height: 53px; background-image: url(images/sprite.png); background-position: 0 -253px; left: -10%; } .slider-testimonials .owl-next { width: 26px; height: 53px; background-image: url(images/sprite.png); background-position: -30px -253px; right: -10%; } /* Small Desktop */ @media (max-width: 1199px) { .slider-testimonials .slide-content { padding: 46px 60px 50px; } .slider-testimonials .slide-content blockquote p { font-size: 24px; margin-bottom: 50px; } .slider-testimonials .owl-prev { left: -42px; } .slider-testimonials .owl-next { right: -42px; } .slider-testimonials .owl-prev, .slider-testimonials .owl-next { top: 50%; } } /* Tablet Portrait */ @media (max-width: 1023px) { .slider-testimonials .slide-content { padding: 30px; } .slider-testimonials .slide-content blockquote p { font-size: 21px; margin-bottom: 30px; } .slider-testimonials .owl-prev { left: -38px; } .slider-testimonials .owl-next { right: -38px; } } /* Mobile */ @media (max-width: 767px) { .slider-testimonials .owl-prev, .slider-testimonials .owl-next { -webkit-transform: scale(.7) translateY(-50%); -ms-transform: scale(.7) translateY(-50%); transform: scale(.7) translateY(-50%); } .slider-testimonials .owl-prev { left: -40px; } .slider-testimonials .owl-next { right: -40px; } .slider-testimonials .slide-content, .slider-testimonials .slide-image { float: none; width: 100%; left: 0; } .slider-testimonials .slide-content { padding: 30px 30px 5px; } .slider-testimonials .slide-content blockquote p { font-size: 18px; margin-bottom: 25px; } .slider-testimonials .slide-content blockquote cite { margin-top: 10px; font-size: 12px; } .slider-testimonials .slide-content blockquote cite:before { width: 28px; margin-left: -14px; top: -10px; } } /* ------------------------------------------------------------ *\ Slider Testimonials Thumbs \* ------------------------------------------------------------ */ .slider-testimonials-thumbs { position: relative; } .slider-testimonials-thumbs ul { list-style: none; font-size: 0; } .slider-testimonials-thumbs ul li { display: inline-block; vertical-align: middle; width: 16.65%; text-align: center; } .slider-testimonials-thumbs ul a { display: block; padding-top: 111px; position: relative; } .slider-testimonials-thumbs img { display: inline-block; border-radius: 50%; max-width: 100%; height: auto; } .slider-testimonials-thumbs ul li.current img { -webkit-transform: scale(1.43); -ms-transform: scale(1.43); transform: scale(1.43); } .slider-testimonials-thumbs ul .current a:before { content: ''; border-left: 17px solid transparent; border-right: 17px solid transparent; border-bottom: 0; border-top: 36px solid #10385a; position: absolute; left: 50%; margin-left: -17px; top: 0; } /* Tablet Portrait */ @media (max-width: 1023px) { .slider-testimonials-thumbs ul a { padding-top: 70px; } } /* Mobile */ @media (max-width: 767px) { .slider-testimonials-thumbs { margin: 0 -40px; position: relative; } .slider-testimonials-thumbs:before { content: ''; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 0; border-top: 12px solid #10385a; position: absolute; left: 50%; margin-left: -6px; top: -1px; } .slider-testimonials-thumbs ul a { padding-top: 33px; } .slider-testimonials-thumbs ul .current a:before { display: none; } .slider-testimonials-thumbs ul li { width: 10%; margin: 0 3.3333%; } } /* ------------------------------------------------------------ *\ Slider Icons \* ------------------------------------------------------------ */ .slider-icons { padding: 0 5.6%; margin: 142px 0 30px; } .slider-icons .slide { text-align: center; } .slider-icons .slide-icon { margin-bottom: 20px; } .slider-icons .slide-content h3 { font-weight: 300; font-size: 28px; color: #000; line-height: 1.3; margin: 0; } .slider-icons .slide-content h3 span { display: block; } .slider-icons .owl-prev, .slider-icons .owl-next { font-size: 0; position: absolute; top: 30%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .slider-icons .owl-prev { width: 26px; height: 53px; background-image: url(images/sprite.png); background-position: 0 -253px; left: -9%; } .slider-icons .owl-next { width: 26px; height: 53px; background-image: url(images/sprite.png); background-position: -30px -253px; right: -9%; } /* Small Desktop */ @media (max-width: 1199px) { .slider-icons { padding: 0 3%; margin: 80px 0 30px; } .slider-icons .owl-prev { left: -26px; } .slider-icons .owl-next { right: -26px; } } /* Tablet Portrait */ @media (max-width: 1023px) { .slider-icons { margin: 50px 0 0; } .slider-icons .slide-content h3 { font-size: 24px; } .slider-icons .owl-prev { left: -20px; } .slider-icons .owl-next { right: -20px; } } /* Mobile */ @media (max-width: 767px) { .slider-icons { margin-top: -10px; padding: 0 30px; } .slider-icons .slide-icon { margin-bottom: -20px; } .slider-icons .slide-icon i { -webkit-transform: scale(.55) translateX(37px); -ms-transform: scale(.55) translateX(37px); transform: scale(.55) translateX(37px); } .slider-icons .slide-content h3 { font-size: 11px; } .slider-icons .owl-prev, .slider-icons .owl-next { -webkit-transform: scale(.7) translateY(-50%); -ms-transform: scale(.7) translateY(-50%); transform: scale(.7) translateY(-50%); top: 40%; } .slider-icons .owl-prev { left: -30px; } .slider-icons .owl-next { right: -30px; } } /* ------------------------------------------------------------ *\ Slider Channel \* ------------------------------------------------------------ */ .slider-channel { padding: 0 8.5%; } .slider-channel .slide { overflow: hidden; } .slider-channel .slide-video { float: right; width: 58%; } .slider-channel .slide-content { float: right; width: 41%; padding-right: 30px; padding-top: 20px; font-family: 'Open Sans Hebrew', sans-serif; color: #2b2e32; } .slider-channel .slide-content h3 { font-size: 24px; margin-bottom: 10px; } .slider-channel .slide-content p { font-size: 18px; margin-bottom: 0; line-height: 1.67; } .slider-channel .owl-prev, .slider-channel .owl-next { font-size: 0; position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .slider-channel .owl-prev { width: 26px; height: 53px; background-image: url(images/sprite.png); background-position: 0 -253px; left: -9%; } .slider-channel .owl-next { width: 26px; height: 53px; background-image: url(images/sprite.png); background-position: -30px -253px; right: -9%; } /* Small Desktop */ @media (max-width: 1199px) { .slider-channel { padding: 0 4%; } .slider-channel .owl-prev { left: -40px; } .slider-channel .owl-next { right: -40px; } } /* Tablet Portrait */ @media (max-width: 1023px) { .slider-channel .slide-content { padding-top: 10px; padding-right: 20px; } .slider-channel .slide-content p { font-size: 14px; } } /* Mobile */ @media (max-width: 767px) { .slider-channel { padding: 0; } .slider-channel .slide-video { float: none; width: 100%; } .slider-channel .slide-content { display: none; } .slider-channel .owl-prev, .slider-channel .owl-next { display: none; } } /* ------------------------------------------------------------ *\ Slider Channel Thumbs \* ------------------------------------------------------------ */ .slider-channel-thumbs { padding: 0 8.5%; padding-top: 20px; overflow: hidden; } .slider-channel-thumbs ul { list-style: none; float: right; width: 59%; padding-bottom: 4px; } .slider-channel-thumbs ul li { float: right; width: 12.45%; } .slider-channel-thumbs ul li ~ li { margin-right: 4.7%; } .slider-channel-thumbs ul img { width: 100%; height: auto; } .slider-channel-thumbs ul a { display: block; position: relative; opacity: .75; transition: opacity .5s; } .slider-channel-thumbs ul a:before { content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-color: #10385a; opacity: .5; transition: opacity .5s; } .slider-channel-thumbs ul a:hover, .slider-channel-thumbs ul .current a { opacity: 1; } .slider-channel-thumbs ul .current a:after { content: ''; width: 100%; height: 2px; background-color: #73c695; position: absolute; left: 0; bottom: -4px; } .slider-channel-thumbs ul a:hover:before, .slider-channel-thumbs ul .current a:before { opacity: 0; } /* Small Desktop */ @media (max-width: 1199px) { .slider-channel-thumbs { padding: 20px 4% 0; } } /* Tablet Portrait */ @media (max-width: 1023px) { .slider-channel-thumbs { padding: 20px 4.2% 0; } .slider-channel-thumbs ul li { width: 13.1%; } .slider-channel-thumbs ul li ~ li { margin-right: 4%; } .slider-channel .owl-prev { left: -34px; } .slider-channel .owl-next { right: -34px; } } /* Mobile */ @media (max-width: 767px) { .slider-channel-thumbs { padding: 30px 40px 0; } .slider-channel-thumbs ul { width: auto; float: none; } .slider-channel-thumbs ul li { width: auto; padding: 0 5px; float: none; } .slider-channel-thumbs .owl-prev, .slider-channel-thumbs .owl-next { font-size: 0; position: absolute; top: 25%; -webkit-transform: scale(.6) translateY(-50%); -ms-transform: scale(.6) translateY(-50%); transform: scale(.6) translateY(-50%); } .slider-channel-thumbs .owl-prev { width: 26px; height: 53px; background-image: url(images/sprite.png); background-position: 0 -253px; left: -45px; } .slider-channel-thumbs .owl-next { width: 26px; height: 53px; background-image: url(images/sprite.png); background-position: -30px -253px; right: -45px; } } /* ------------------------------------------------------------ *\ Slider Ticker Small \* ------------------------------------------------------------ */ .slider-small-ticker p { display: inline-block; vertical-align: middle; margin: 0 3px 0 0; } .slider-small-ticker i { position: relative; top: 2px; } /* Mobile */ @media (max-width: 767px) { .slider-ticker-wrapper { display: none; } } /* ------------------------------------------------------------ *\ Tabs \* ------------------------------------------------------------ */ .tab { display: none; } .tab.current { display: block; } .tabs .tabs-nav ul { list-style: none; } .tabs .tabs-nav ul a { display: block; font-size: 20px; color: #67c18c; text-decoration: none; line-height: 2.5; } .tabs .tabs-nav ul a:hover, .tabs .tabs-nav ul .current a { font-weight: 700; color: #2b2e32; } .tabs-faq .tab > a { display: none; } /* Mobile */ @media (max-width: 767px) { .tabs-faq { padding-top: 75px; } .tabs-faq .tab { display: block; } .tabs-faq .tab ~ .tab { margin-top: 5px; } .tabs-faq .tab > a { display: block; background-color: #67c18c; padding: 5px 10px; text-decoration: none; font-weight: 900; font-size: 18px; color: #2b2e32; } .tabs-faq .tab .section-faq { padding-top: 0; } .tabs-faq .tab .section-faq .section-body { padding: 0; display: none; } .tabs-faq .tab.current .section-faq .section-body { display: block; padding: 10px 15px 10px 0; } } /* ------------------------------------------------------------ *\ Table Info \* ------------------------------------------------------------ */ .table-info { font-size: 24px; font-weight: 300; letter-spacing: 0.03em; color: #4b4b4b; overflow-x: auto; overflow-y: hidden; } .table-info table { min-width: 1003px; table-layout: fixed; } .table-info th { padding-bottom: 9px; font-size: 16px; font-weight: 700; text-align: right; } .table-info td { padding-top: 17px; } .table-info td:first-child { color: #67c18c; } .table-info td:last-child { font-size: 18px; white-space: nowrap; } .table-info .table-pricing span { font-size: 18px; } .table-info .table-estimated { display: inline-block; width: 101px; height: 30px; vertical-align: middle; overflow: hidden; font-size: 26px; font-weight: 600; line-height: 30px; color: #669933; text-align: center; background: #ededed; } .table-info .table-estimated strong { float: left; display: inline-block; width: 30px; color: #fff; background: #669933; } .table-info .table-estimated sub { position: relative; top: -6px; font-size: 20px; } .table-info .table-estimated-secondary { color: #33997b; } .table-info .table-estimated-secondary strong { background: #33997b; } .table-info th:first-child { width: 7.58%; } .table-info th:nth-child(2) { width: 12.66%; } .table-info th:nth-child(3) { width: 10.61%; } .table-info th:nth-child(4) { width: 11.93%; } .table-info th:nth-child(5) { width: 12.51%; } .table-info th:nth-child(6) { width: 14.93%; } .table-info th:nth-child(7) { width: 13.33%; } .table-info th:nth-child(8) { width: 9.25%; } .table-info th:last-child { width: 7.58%; } /* ------------------------------------------------------------ *\ Table Info Secondary \* ------------------------------------------------------------ */ .table-info-secondary { padding-top: 15px; } .table-info-secondary table { min-width: 0; } .table-info-secondary th:first-child { width: 20.24%; } .table-info-secondary th:nth-child(2) { width: 22.54%; } .table-info-secondary th:nth-child(3) { width: 26.74%; } .table-info-secondary th:last-child { width: 30.78%; } @media (max-width: 1023px) { /* ------------------------------------------------------------ *\ Table Info Secondary \* ------------------------------------------------------------ */ .table-info-secondary th:first-child, .table-info-secondary th:nth-child(2), .table-info-secondary th:nth-child(3), .table-info-secondary th:last-child { width: 25%; } .table-info-secondary td { padding: 17px 5px 0; line-height: 1; } } @media (max-width: 767px) { /* ------------------------------------------------------------ *\ Table Info \* ------------------------------------------------------------ */ .table-info { font-size: 18px; } .table-info table { min-width: 0; } .table-info .table-pricing { display: block; } .table-info .table-pricing span { font-size: 14px; } .table-info .table-estimated { width: 100%; } .table-info .table-estimated strong { width: 20px; } .table-info .table-estimated sub { top: -3px; font-size: 10px; } .table-info .table-estimated strong, .table-info .table-estimated { font-size: 14px; } .table-info th:nth-child(3), .table-info th:nth-child(4), .table-info th:nth-child(6), .table-info th:nth-child(8), .table-info th:nth-child(9), .table-info td:nth-child(3), .table-info td:nth-child(4), .table-info td:nth-child(6), .table-info td:nth-child(8), .table-info td:nth-child(9) { display: none; } .table-info th:first-child, .table-info th:nth-child(2), .table-info th:nth-child(3), .table-info th:nth-child(4), .table-info th:nth-child(5), .table-info th:nth-child(6), .table-info th:nth-child(7), .table-info th:nth-child(8), .table-info th:last-child { width: 25%; } .table-info td { padding: 17px 5px 0; line-height: 1; } .table-info th { padding: 0 5px 9px; } /* ------------------------------------------------------------ *\ Table Info Secondary \* ------------------------------------------------------------ */ .table-info-secondary { overflow: hidden; } .table-info-secondary table { min-width: 0; } .table-info-secondary th:nth-child(3), .table-info-secondary th:nth-child(4), .table-info-secondary th:nth-child(6), .table-info-secondary th:nth-child(8), .table-info-secondary th:nth-child(9), .table-info-secondary td:nth-child(3), .table-info-secondary td:nth-child(4), .table-info-secondary td:nth-child(6), .table-info-secondary td:nth-child(8), .table-info-secondary td:nth-child(9) { display: table-cell; } } /* ------------------------------------------------------------ *\ Widget \* ------------------------------------------------------------ */ .widgets { list-style: none outside none; } .widget { margin-bottom: 20px; } /* ------------------------------------------------------------ *\ Widget Search \* ------------------------------------------------------------ */ .widget-search .search { position: relative; } .widget-search .search-field { width: 100%; height: 42px; border: 0; border-bottom: 2px solid #4b4b4b; background-color: #fff; box-shadow: inset 0 0 12px rgba(0,0,0, .2); font-size: 16px; color: #4d4d4d; line-height: 40px; padding: 0 30px 0 10px; border-radius: 0; } .widget-search .search-btn { width: auto; height: auto; background: none; border: 0; position: absolute; right: 8px; top: 12px; z-index: 9; font-size: 0; } /* ------------------------------------------------------------ *\ Widget Menu \* ------------------------------------------------------------ */ .widget-menu ul { list-style: none; } .widget-menu ul a { display: block; font-size: 20px; color: #67c18c; text-decoration: none; line-height: 2.5; } .widget-menu ul a:hover, .widget-menu ul .current a { border-top: none; font-weight: 700; color: #2b2e32; } /* Mobile */ @media (max-width: 767px) { .widget-menu ul a { font-size: 15px; line-height: 1.6; } } /* ------------------------------------------------------------ *\ Widget Articles \* ------------------------------------------------------------ */ .widget-articles { margin-top: -3px; } .widget-articles ul { list-style: none; } .widget-articles ul li ~ li { margin-top: 49px; } .widget-articles a { display: block; text-decoration: none; } .widget-articles a:hover { text-decoration: none; } .widget-articles h6 { font-weight: 400; color: #4b4b4b; margin-bottom: 5px; line-height: 1; } .widget-articles img { width: 100%; height: auto; padding-bottom: 2px; border-bottom: 2px solid #67c18c; } /* Mobile */ @media (max-width: 767px) { .widget-articles h6 { font-weight: 900; font-size: 12px; } .widget-articles ul li ~ li { margin-top: 30px; } }
-
הלמן אלדובי
<!--#include file="ssi/header.shtml" --> <div class="main"> <section class="slider-home scroll-section"> <div class="slides owl-carousel"> <div class="slide"> <div class="slide-image"> <img src="css/images/temp/slide1.jpg" alt="" width="1920" height="465"> </div><!-- /.slide-image --> <div class="slide-content"> <div class="shell"> <div class="slide-content-inner"> <h1>עמוד הבית שלך</h1> <h4>כל המידע זמין עבורך באיזור האישי, <br />בכל זמן, בכל מקום. <br />לקוחות שלנו? הרשמו לשירות!</h4> <a href="#" class="btn">להצטרפות ></a> </div><!-- /.slide-content-inner --> </div><!-- /.shell --> </div><!-- /.slide-content --> </div><!-- /.slide --> <div class="slide"> <div class="slide-image"> <img src="css/images/temp/slide2.jpg" alt="" width="1920" height="465"> </div><!-- /.slide-image --> <div class="slide-content"> <div class="shell"> <div class="slide-content-inner"> <h1>הזדמנות אחרונה <br />להפקדות סוף שנה!</h1> <h4>נצלו את חלון ההזדמנויות להפקדת כספים <br />על מנת ליהנות מהטבות מס</h4> <a href="#" class="btn">לפרטים נוספים ></a> </div><!-- /.slide-content-inner --> </div><!-- /.shell --> </div><!-- /.slide-content --> </div><!-- /.slide --> </div><!-- /.slides --> <div class="slider-controls"> <a href="#" class="slider-pause"></a> </div><!-- /.slider-controls --> </section><!-- /.slider-home --> <div class="scroll-section"> <section class="section-login"> <div class="shell"> <div class="section-body"> <div class="form form-login"> <form action="?" method="post"> <header class="form-head"> <h4>כניסה לחשבונך</h4> </header><!-- /.form-head --> <div class="form-body"> <div class="form-row"> <div class="form-controls"> <input type="text" class="field required" name="field-author" id="field-author" value="" placeholder="שם משתמש"> <span class="form-notice">יש להזין שם משתמש</span> </div><!-- /.form-controls --> <div class="form-controls"> <input type="password" class="field required" name="field-password" id="field-password" value="" placeholder="סיסמא"> <span class="form-notice">יש להזין סיסמא</span> </div><!-- /.form-controls --> <div class="form-controls"> <button type="submit" class="btn">אישור</button> </div><!-- /.form-controls --> </div><!-- /.form-row --> </div><!-- /.form-body --> <footer class="form-foot"> <ul> <li> <a href="#">שכחתי סיסמא</a> </li> <li> <a href="#">לקוח שלנו? הרשם לשירות ></a> </li> </ul> </footer><!-- /.form-foot --> </form> </div><!-- /.form form-login --> </div><!-- /.section-body --> </div><!-- /.shell --> </section><!-- /.section-login --> <section class="section-features"> <div class="shell"> <div class="section-body"> <div class="feature"> <a href="#"> <div class="feature-image"> <img src="css/images/temp/feature1.png" height="187" width="222" alt=""> <img src="css/images/temp/feature1-hover.png" height="187" width="222" alt="" class="hover"> </div><!-- /.feature-image --> <div class="feature-title"> <h4>גמל והשתלמות</h4> </div><!-- /.feature-title --> </a> </div><!-- /.feature --> <div class="feature"> <a href="#"> <div class="feature-image"> <img src="css/images/temp/feature2.png" height="187" width="205" alt=""> <img src="css/images/temp/feature2-hover.png" height="187" width="205" alt="" class="hover"> </div><!-- /.feature-image --> <div class="feature-title"> <h4>פנסיה</h4> </div><!-- /.feature-title --> </a> </div><!-- /.feature --> <div class="feature"> <a href="#"> <div class="feature-image"> <img src="css/images/temp/feature3.png" height="187" width="187" alt=""> <img src="css/images/temp/feature3-hover.png" height="187" width="187" alt="" class="hover"> </div><!-- /.feature-image --> <div class="feature-title"> <h4>ניהול השקעות</h4> </div><!-- /.feature-title --> </a> </div><!-- /.feature --> <div class="feature"> <a href="#"> <div class="feature-image"> <img src="css/images/temp/feature4.png" height="187" width="203" alt=""> <img src="css/images/temp/feature4-hover.png" height="187" width="203" alt="" class="hover"> </div><!-- /.feature-image --> <div class="feature-title"> <h4>קרנות נאמנות</h4> </div><!-- /.feature-title --> </a> </div><!-- /.feature --> </div><!-- /.section-body --> </div><!-- /.shell --> </section><!-- /.section-features scroll-section --> </div><!-- /.scroll-section --> <section class="section-services scroll-section"> <div class="shell"> <header class="section-head"> <h1>לצידך ברגעים החשובים</h1> </header><!-- /.section-head --> <div class="section-body"> <div class="service"> <a href="#"> <div class="service-inner"> <header class="service-head"> <h6>סיום לימודים</h6> </header><!-- /.service-head --> <div class="service-icon"> <img src="css/images/ico-signs@2x.png" height="223" width="223" alt=""> </div><!-- /.service-icon --> <div class="service-text"> <p>התחתנתם? מזל טוב! <br />איך ממשיכים מכאן?</p> </div><!-- /.service-text --> </div><!-- /.service-inner --> </a> </div><!-- /.service --> <div class="service"> <a href="#"> <div class="service-inner"> <header class="service-head"> <h6>עבודה חדשה</h6> </header><!-- /.service-head --> <div class="service-icon"> <img src="css/images/ico-briefcase@2x.png" height="162" width="223" alt=""> </div><!-- /.service-icon --> <div class="service-text"> <p>התחתנתם? מזל טוב! <br />איך ממשיכים מכאן?</p> </div><!-- /.service-text --> </div><!-- /.service-inner --> </a> </div><!-- /.service --> <div class="service"> <a href="#"> <div class="service-inner"> <header class="service-head"> <h6>חתונה</h6> </header><!-- /.service-head --> <div class="service-icon"> <img src="css/images/ico-rings@2x.png" height="223" width="176" alt=""> </div><!-- /.service-icon --> <div class="service-text"> <p>התחתנתם? מזל טוב! <br />איך ממשיכים מכאן?</p> </div><!-- /.service-text --> </div><!-- /.service-inner --> </a> </div><!-- /.service --> <div class="service"> <a href="#"> <div class="service-inner"> <header class="service-head"> <h6>הולדת ילד</h6> </header><!-- /.service-head --> <div class="service-icon"> <img src="css/images/ico-baby-bottle@2x.png" height="223" width="223" alt=""> </div><!-- /.service-icon --> <div class="service-text"> <p>התחתנתם? מזל טוב! <br />איך ממשיכים מכאן?</p> </div><!-- /.service-text --> </div><!-- /.service-inner --> </a> </div><!-- /.service --> <div class="service"> <a href="#"> <div class="service-inner"> <header class="service-head"> <h6>מעבר דירה</h6> </header><!-- /.service-head --> <div class="service-icon"> <img src="css/images/ico-box@2x.png" height="223" width="223" alt=""> </div><!-- /.service-icon --> <div class="service-text"> <p>התחתנתם? מזל טוב! <br />איך ממשיכים מכאן?</p> </div><!-- /.service-text --> </div><!-- /.service-inner --> </a> </div><!-- /.service --> <div class="arrow-elem"></div><!-- /.arrow-elem --> </div><!-- /.section-body --> </div><!-- /.shell --> </section><!-- /.section-services scroll-section --> <section class="section-subscribe scroll-section"> <div class="shell"> <div class="section-inner"> <div class="section-image"> <img src="css/images/form-image.png" height="550" width="706" alt=""> </div><!-- /.section-image --> <div class="section-body"> <div class="form form-subscribe"> <form action="?" method="post"> <header class="form-head"> <h1>לרגעים הגדולים <span>ולרגעים הקטנים</span></h1> <h5>מעוניינים להתחיל לחסוך? רוצים לקבל הצעה? <br />השאירו פרטים ונשמח לחזור אליכם עם כל המידע</h5> </header><!-- /.form-head --> <div class="form-body"> <div class="form-row"> <div class="form-controls"> <input type="text" class="field required" name="field-email" id="field-email" value="" placeholder="כתובת דוא”ל"> <span class="form-notice">יש להזין כתובת דוא"ל וטלפון תקינים</span> </div><!-- /.form-controls --> </div><!-- /.form-row --> <div class="form-row"> <div class="form-controls"> <input type="text" class="field required" name="field-phone" id="field-phone" value="" placeholder="טלפון"> </div><!-- /.form-controls --> </div><!-- /.form-row --> <div class="form-row"> <div class="form-controls"> <button type="submit" class="btn">שלח</button> </div><!-- /.form-controls --> </div><!-- /.form-row --> </div><!-- /.form-body --> </form> </div><!-- /.form form-subscribe --> </div><!-- /.section-body --> </div><!-- /.section-inner --> </div><!-- /.shell --> </section><!-- /.section-subscribe scroll-section --> <section class="section-tools scroll-section"> <div class="shell"> <div class="section-inner"> <header class="section-head"> <h1>כלים שימושיים</h1> </header><!-- /.section-head --> <div class="section-body"> <div class="slider-tools"> <div class="slides owl-carousel"> <div class="slide"> <a href="#"> <div class="slide-icon"> <i class="ico-reports"></i> </div><!-- /.slide-icon --> <div class="slide-text"> <h5>איך קוראים <br />דוחות</h5> </div><!-- /.slide-text --> </a> </div><!-- /.slide --> <div class="slide"> <a href="#"> <div class="slide-icon"> <i class="ico-calculators"></i> </div><!-- /.slide-icon --> <div class="slide-text"> <h5>מחשבונים</h5> </div><!-- /.slide-text --> </a> </div><!-- /.slide --> <div class="slide"> <a href="#"> <div class="slide-icon"> <i class="ico-forms"></i> </div><!-- /.slide-icon --> <div class="slide-text"> <h5>טפסים</h5> </div><!-- /.slide-text --> </a> </div><!-- /.slide --> <div class="slide"> <a href="#"> <div class="slide-icon"> <i class="ico-contact"></i> </div><!-- /.slide-icon --> <div class="slide-text"> <h5>צור קשר</h5> </div><!-- /.slide-text --> </a> </div><!-- /.slide --> <div class="slide"> <a href="#"> <div class="slide-icon"> <i class="ico-reports"></i> </div><!-- /.slide-icon --> <div class="slide-text"> <h5>איך קוראים דוחות</h5> </div><!-- /.slide-text --> </a> </div><!-- /.slide --> </div><!-- /.slides --> </div><!-- /.slider-tools --> </div><!-- /.section-body --> </div><!-- /.section-inner --> </div><!-- /.shell --> </section><!-- /.section-tools scroll-section --> <section class="section-news scroll-section"> <div class="shell"> <div class="section-inner"> <header class="section-head"> <h1>סקירות ומאמרים</h1> </header><!-- /.section-head --> <div class="section-body"> <div class="news-item"> <div class="news-item-image"> <a href="#"> <img src="css/images/temp/news-image1.jpg" height="205" width="310" alt=""> <span class="news-date">08<small>יולי</small></span> </a> </div><!-- /.news-item-image --> <div class="news-item-body"> <span class="category"></span> <h4>השולחן העגול - ימי עיון</h4> <p>הצוות המקצועי של הלמן-אלדובי מציג כ-200 שנות ניסיון מצטבר בשוקי ההון...</p> <a href="#" class="link-more">למאמר ></a> </div><!-- /.news-item-body --> </div><!-- /.news-item --> <div class="news-item"> <div class="news-item-image"> <a href="#"> <img src="css/images/temp/news-image2.jpg" height="205" width="310" alt=""> <span class="news-date">16<small>אוגוסט</small></span> </a> </div><!-- /.news-item-image --> <div class="news-item-body"> <span class="category">מן העיתונות</span> <h4>הבורסה ננעלה בשיא המדדים ת"א 25 ות"א 100 עלו ב-0.3%</h4> <p></p> <a href="#" class="link-more">לפרסום באתר כלכליסט ></a> </div><!-- /.news-item-body --> </div><!-- /.news-item --> <div class="news-item"> <div class="news-item-image"> <a href="#"> <img src="css/images/temp/news-image3.jpg" height="205" width="310" alt=""> <span class="news-date">21<small>אוגוסט</small></span> </a> </div><!-- /.news-item-image --> <div class="news-item-body"> <span class="category"></span> <h4>סקירת מסחר - 21-28/09</h4> <p>אינדיקאטורים כלכליים מרכזיים והתפתחויות בשוקי ההון לחודש יולי</p> <a href="#" class="link-more">לסקירה ></a> </div><!-- /.news-item-body --> </div><!-- /.news-item --> </div><!-- /.section-body --> <div class="section-actions"> <ul> <li> <a href="#">הרשמו לניוזלטר</a> </li> <li> <a href="#">לדף סקירות ומאמרים ></a> </li> </ul> </div><!-- /.section-actions --> </div><!-- /.section-inner --> </div><!-- /.shell --> </section><!-- /.section-news scroll-section --> <section class="section-people scroll-section"> <div class="shell"> <div class="section-inner"> <div class="section-body"> <img src="css/images/footer-image.png" alt="" width="289" height="204"> <h3>דרושים אנשים מצויינים שיצטרפו אלינו</h3> <a href="#"> <span>לצפיה בכל המשרות</span> <i class="ico-arrow-left-green"></i> </a> </div><!-- /.section-body --> </div><!-- /.section-inner --> </div><!-- /.shell --> </section><!-- /.section-people scroll-section --> </div><!-- /.main --> <div class="paging"> <ul> <li class="current"> <a href="#">1</a> </li> <li> <a href="#">2</a> </li> <li> <a href="#">3</a> </li> <li> <a href="#">4</a> </li> <li> <a href="#">5</a> </li> <li> <a href="#">6</a> </li> <li> <a href="#">7</a> </li> </ul> </div><!-- /.paging --> <!--#include file="ssi/footer.shtml" -->
/* Table of Contents update on Mon Oct 19 2015 09:27:17 GMT+0300 (FLE Summer Time) I. Generic -------------------------------------- 01. Reset ------------------------------------ 02. Fonts ------------------------------------ 03. Base ------------------------------------- 04. Helpers ---------------------------------- Clear ------------------------------------ Notext ----------------------------------- Hidden ----------------------------------- Alignleft -------------------------------- Alignright ------------------------------- Disabled --------------------------------- II. Regions -------------------------------------- 01. Wrapper ---------------------------------- 02. Container -------------------------------- 03. Shell ------------------------------------ 04. Header ----------------------------------- Header Logo ------------------------------ Header Nav ------------------------------- Header Search ---------------------------- Header Contacts -------------------------- 05. Main ------------------------------------- 06. Footer ----------------------------------- 07. Content ---------------------------------- 08. Sidebar ---------------------------------- III. Themes --------------------------------------- IV. Modules -------------------------------------- 01. Button ----------------------------------- 02. Form Elements ---------------------------- 03. Form ------------------------------------- 04. Form Login ------------------------------- 05. Form Subscribe --------------------------- 06. List ------------------------------------- 07. Logo ------------------------------------- 08. Nav -------------------------------------- 09. Nav Secondary ---------------------------- 10. Nav Dropdown ----------------------------- 11. News Item -------------------------------- 12. Paging ----------------------------------- 13. Search ----------------------------------- 14. Section ---------------------------------- 15. Section Login ---------------------------- 16. Section Features ------------------------- 17. Section Services ------------------------- 18. Section Subscribe ------------------------ 19. Section Tools ---------------------------- 20. Section News ----------------------------- 21. Section People ------------------