/*! ----------------------------------------------------------------- [Master Stylesheet] Project: bcoin.io (template Neomax) ------------------------------------------------------------------ [Color Change Notes] Did find and replace: Old color: #27CBC0 and 39, 203, 192 New Color: #385dc1 and 56, 93, 193 [Custom Styles] */ /*COLOR CHANGES Dark Blue BG for Parallax Docs Callout*/ .bg-darkblue-alfa-50:before { background: rgba(8, 29, 88, 0.5); position: absolute; height: 100%; width: 100%; z-index: 0; content: ""; left: 0; top: 0; } /*White Text Override */ .force-text-white{ color:#fff; } /*Custom Margin Classes*/ .m-l-70 { margin-left:70px; } /* display none */ .display-none { display: none; } .full-width{ width:100%; } /* Clients fix for larger screens*/ @media screen and (min-width: 991px) { .large-fix { /*margin-left: 25% !important;*/ } } /* Menu Fix for smaller screens*/ @media screen and (max-width: 530px) { .hide-me { display: none; } } /* Smallest screens*/ @media screen and (max-width: 320px) { .auto-margin-sides { margin:inherit !important; } } /* Hero paragraph */ .hero-para{ line-height: 1.8; max-width:400px; } .text-highlight-black{ background-color: #070e3e; color: #fff; padding: 2px; white-space: pre-wrap; word-spacing: -2px; } .hero-module-header { margin:0 auto 30px; } @media screen and (min-width: 768px){ .hero-image {width: 25%;} } @media screen and (max-width: 767px){ .hero-image { width: 40%; margin-bottom:30px !important; } } /* Project List */ @media screen and (min-width: 768px){ .projects-hero { padding-left: 50px; } } @media (min-width:768px) and (max-width: 991px){ .projects-hero { padding-left: 30px; } } @media screen and (max-width: 767px){ .projects-list { display: grid; } } .projects-list .input-group-addon { width: 75px; border: 0; padding: 12px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; } .projects-list .form-control { height: 75px; border: 0px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; } /* @media screen and (max-width: 991px){ .projects-list .form-control { margin-right: -20px; } } */ /* @media (min-width:768px) and (max-width: 991px){ .projects-list .form-control { max-width: 300px; } } */ .projects-item { display: inline-block; margin-bottom: 5px; } .projects-item #green { background-color: #7cc9d6; } .projects-item #blue { background-color: #93c0e1; } .projects-list #purple { background-color: #aeaccf; } .projects-item a { display: flex; min-width: 375px; } @media (min-width:768px) and (max-width: 991px){ .projects-item a { min-width: 350px; } } @media screen and (max-width: 767px){ .projects-item a { min-width: 335px; } } .projects-item a:hover { opacity: .8 !important; } .projects-item a:visited { opacity: 1 !important; } .project-info .p-imp:after { content:'\f105'; font-family: 'FontAwesome'; font-size: 30px; color: #a7a9ac; float: right; padding-right: 10px; } .project-info { padding: 10px 0 10px 10px; font-family: "Open Sans"; } .project-info .p-name{ font-weight: 700; font-size: 18px; color: #000; } .project-info .p-imp{ font-weight: 400; font-size: 18px; color: #6d6e71 !important; } .project-info i{ opacity: .5; font-size: 11px; } .community-links { padding-top:15px; } .community-links h3 { margin-bottom: 0; } .community-links .slack-icon h3:before { content:''; background-image: url('../images/telegram-app.svg'); background-repeat: no-repeat; background-size: contain; width: 44px; height: 44px; display: inline-block; vertical-align: middle; } /* BTC & BCH logos */ .logo-wrap { margin: 20px 0 10px 0; } .logo-wrap > :nth-child(3) { position: relative; top: -16px; color: #000; } .bitcoin-logo-small, .bitcoin-cash-logo, .menace-raccoon { background-position: center center; background-size: cover; width: 50px; height: 50px; display: inline-block; } .bitcoin-logo-small { background-image: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%3E%20%3Ctitle%3Ebch-alt-small%3C%2Ftitle%3E%20%3Cg%3E%20%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2232px%22%20height%3D%2232px%22%20viewBox%3D%220%200%2032%2032%22%20style%3D%22enable-background%3Anew%200%200%2032%2032%3B%22%20xml%3Aspace%3D%22preserve%22%3E%20%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23414042%3B%7D%20.st1%7Bfill%3A%23FFFFFF%3B%7D%20%3C%2Fstyle%3E%20%3Cg%3E%20%3Ccircle%20class%3D%22st0%22%20cx%3D%2216%22%20cy%3D%2216%22%20r%3D%229.8%22%2F%3E%20%3Cpath%20class%3D%22st1%22%20d%3D%22M20.4%2C14.8c0.2-1.3-0.8-2-2.1-2.4l0.4-1.7l-1.1-0.3L17.2%2C12c-0.3-0.1-0.6-0.1-0.9-0.2l0.4-1.7l-1.1-0.3%20l-0.4%2C1.7c-0.2-0.1-0.5-0.1-0.7-0.2l0%2C0l-1.5-0.4l-0.3%2C1.1c0%2C0%2C0.8%2C0.2%2C0.8%2C0.2c0.4%2C0.1%2C0.5%2C0.4%2C0.5%2C0.6l-0.5%2C2c0%2C0%2C0.1%2C0%2C0.1%2C0%20l-0.1%2C0L13%2C17.8c-0.1%2C0.1-0.2%2C0.3-0.5%2C0.3c0%2C0-0.8-0.2-0.8-0.2l-0.5%2C1.2l1.4%2C0.3c0.3%2C0.1%2C0.5%2C0.1%2C0.8%2C0.2l-0.4%2C1.8l1.1%2C0.3l0.4-1.7%20c0.3%2C0.1%2C0.6%2C0.2%2C0.8%2C0.2l-0.4%2C1.7l1.1%2C0.3l0.4-1.8c1.8%2C0.3%2C3.2%2C0.2%2C3.8-1.4c0.5-1.3%2C0-2.1-1-2.6C19.8%2C16.2%2C20.3%2C15.7%2C20.4%2C14.8z%20M18%2C18.2c-0.3%2C1.3-2.6%2C0.6-3.3%2C0.4l0.6-2.3C16%2C16.5%2C18.3%2C16.8%2C18%2C18.2z%20M18.3%2C14.8c-0.3%2C1.2-2.2%2C0.6-2.8%2C0.4l0.5-2.1%20C16.7%2C13.2%2C18.6%2C13.5%2C18.3%2C14.8z%22%2F%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E%20%3C%2Fg%3E%20%3C%2Fsvg%3E%20'); } .bitcoin-cash-logo { background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%3E%0A%20%20%3Ctitle%3Ewings-bch-logo%3C%2Ftitle%3E%0A%20%20%3Cg%3E%0A%20%20%20%20%3Cpath%20d%3D%22M9.056%2C6.128q-.16211.12308-.3242.24619a12.17821%2C12.17821%2C0%2C0%2C0-3.3186%2C3.864A11.98759%2C11.98759%2C0%2C0%2C0%2C4.681%2C11.86a11.10025%2C11.10025%2C0%2C0%2C0-.54487%2C2.0503c-.06238.38569-.09943.77566-.1413%2C1.16442a7.80115%2C7.80115%2C0%2C0%2C0-.03826%2C1.1736c.01684.388.04511.77615.08668%2C1.16227.03556.33031.083.66076.15081.98579.07713.3695.17349.73575.27891%2C1.09835.08747.30088.19275.59724.30348.89057A9.53379%2C9.53379%2C0%2C0%2C0%2C5.37435%2C21.683c.17442.31119.35362.62025.54432.92164a11.13165%2C11.13165%2C0%2C0%2C0%2C.91217%2C1.22288%2C10.21406%2C10.21406%2C0%2C0%2C0%2C.90862.955c.30637.28.63048.54074.94959.8066.10419.08681.21723.163.32588.24449.00561.00421.0079.01283.01644.02745H.00677c0-.0392%2C0-.07555%2C0-.11191q0-9.75107-.00025-19.50213c0-.03967-.00426-.07935-.00652-.119Z%22%20style%3D%22fill%3A%20%23414042%22%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%22M32%2C25.872c-.03459-.00125-.06918-.0036-.10377-.0036q-4.40381-.00031-8.80761-.00027h-.09931l-.00549-.0217c.03081-.02361.0611-.04793.09251-.07071a12.1126%2C12.1126%2C0%2C0%2C0%2C3.29906-3.62013%2C11.563%2C11.563%2C0%2C0%2C0%2C.89027-1.84761%2C12.37344%2C12.37344%2C0%2C0%2C0%2C.40788-1.27716%2C12.01445%2C12.01445%2C0%2C0%2C0%2C.25494-1.27562%2C9.39472%2C9.39472%2C0%2C0%2C0%2C.10992-1.2083c.00426-.32762.01822-.65561.0076-.98278-.01027-.31624-.04217-.632-.0722-.94731A10.87136%2C10.87136%2C0%2C0%2C0%2C27.62%2C12.768%2C12.10091%2C12.10091%2C0%2C0%2C0%2C25.826%2C9.00051a11.78094%2C11.78094%2C0%2C0%2C0-.84336-1.05468%2C10.43828%2C10.43828%2C0%2C0%2C0-.99817-.99005c-.31474-.26682-.64359-.517-.966-.77481-.02051-.0164-.03907-.03526-.05853-.053H32Z%22%20style%3D%22fill%3A%20%23414042%22%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%22M15.43129%2C6.14577c6.00594-.00407%2C10.3936%2C4.41373%2C10.40706%2C9.81831a9.83146%2C9.83146%2C0%2C0%2C1-19.64991.56019%2C9.62074%2C9.62074%2C0%2C0%2C1%2C2.68367-7.2972A9.37894%2C9.37894%2C0%2C0%2C1%2C15.43129%2C6.14577Z%22%20style%3D%22fill%3A%20%23414042%22%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%22M15.92945%2C18.65355c-.02324-.08767-.0467-.17119-.06749-.25537-.134-.54235-.26647-1.08506-.40157-1.62713-.0289-.116-.0677-.2294-.09967-.34464-.02294-.08271-.02152-.08536.06388-.10967.1586-.04515.31693-.09174.477-.13092.23222-.05682.465-.11215.69923-.15983a3.46284%2C3.46284%2C0%2C0%2C1%2C.91223-.08281%2C1.26334%2C1.26334%2C0%2C0%2C1%2C.86461.33885.87117.87117%2C0%2C0%2C1%2C.263.74759%2C1.25892%2C1.25892%2C0%2C0%2C1-.6833.96462%2C4.04425%2C4.04425%2C0%2C0%2C1-1.00592.40112c-.30841.08142-.61783.159-.92688.238C15.99661%2C18.64056%2C15.968%2C18.64546%2C15.92945%2C18.65355Z%22%20style%3D%22fill%3A%20%23414042%22%2F%3E%0A%20%20%3C%2Fg%3E%0A%20%20%3Cg%3E%0A%20%20%20%20%3Cpath%20d%3D%22M14.28174%2C11.97006c-.013-.05894-.02237-.105-.03347-.15067-.05527-.22742-.11023-.45493-.16678-.682q-.10123-.40653-.20525-.81236c-.0183-.07126-.03059-.07581-.10265-.057-.10808.02824-.216.057-.32439.08414-.21169.053-.42373.10454-.63542.15752-.06413.01605-.07255.03112-.058.09555q.01755.07776.037.15508.1849.7354.371%2C1.47048c.01282.05028.00331.07239-.0492.08413-.1999.04466-.39948.09093-.59826.14033q-.71687.17815-1.43286.35981c-.06746.017-.07611.03366-.05748.10254.03685.13618.074.27227.11054.40855.05575.20819.10952.41692.16732.62453.02067.07425.03551.08206.11041.06133.12561-.03476.24973-.07491.37459-.11245a1.70822%2C1.70822%2C0%2C0%2C1%2C.57859-.10248.43669.43669%2C0%2C0%2C1%2C.37442.19443.8144.8144%2C0%2C0%2C1%2C.097.21691c.06791.25166.12761.50552.19093.75842.11248.44923.22609.89817.33775%2C1.34761.09106.36653.17629.73454.27079%2C1.10016.10522.40707.21994.81168.32646%2C1.21843a1.36857%2C1.36857%2C0%2C0%2C1%2C.0584.43354.32117.32117%2C0%2C0%2C1-.12476.24837.89274.89274%2C0%2C0%2C1-.40512.15614c-.16212.02911-.32342.0632-.48434.09845a.09278.09278%2C0%2C0%2C0-.07722.11765c.01753.15863.02548.3183.039.4774.02077.24389.042.48776.0652.73143.007.07391.02867.08357.09981.06471.396-.105.79134-.21254%2C1.18877-.31175.26568-.06632.53454-.11991.80183-.17983.08462-.019.08738-.01892.10781.066.06094.25335.11818.50762.18224.76017.07257.28612.15028.571.22724.85595.02087.07728.03144.0791.10785.05776.1281-.03577.25663-.07015.3857-.1022.18336-.04553.3672-.08914.55121-.132.05273-.01228.07895-.03379.06387-.09417-.05473-.21924-.10514-.43956-.15928-.659-.07207-.29206-.14677-.58348-.21869-.87558-.01242-.05046-.01665-.10295-.02534-.15887.16439-.04225.31806-.08412.473-.12065.08758-.02065.17716-.03287.266-.04822.05011-.00867.07326.01973.08456.0637q.08046.31293.16127.62578c.08363.32195.16958.6433.25009.966.01552.06222.045.06967.097.0562.08237-.02134.16535-.0403.24774-.06155.23195-.05982.46421-.1185.69535-.18131.10145-.02757.099-.03128.0724-.1327-.09864-.37583-.19858-.75134-.29326-1.12818-.03757-.14954-.06571-.30169-.0922-.45369-.014-.08009-.01618-.08877.06461-.11658.1787-.06151.35527-.1295.53117-.19874a4.97914%2C4.97914%2C0%2C0%2C0%2C1.17464-.60687%2C2.16911%2C2.16911%2C0%2C0%2C0%2C.66041-.79%2C2.35965%2C2.35965%2C0%2C0%2C0%2C.22364-1.33536%2C2.965%2C2.965%2C0%2C0%2C0-.2829-.97593%2C1.62575%2C1.62575%2C0%2C0%2C0-.78189-.79157%2C2.28112%2C2.28112%2C0%2C0%2C0-.65-.18608c-.12277-.01754-.24645-.02871-.37942-.04386.01615-.01921.02494-.03174.03573-.0422a1.85967%2C1.85967%2C0%2C0%2C0%2C.38488-.52606%2C1.65355%2C1.65355%2C0%2C0%2C0%2C.14063-1.01863%2C2.38827%2C2.38827%2C0%2C0%2C0-.32424-.82774%2C1.59234%2C1.59234%2C0%2C0%2C0-.79-.69327%2C2.48608%2C2.48608%2C0%2C0%2C0-.97073-.165c-.31656.00455-.63259.03883-.94913.05442-.19535.00963-.15389.05208-.205-.14174-.1112-.42208-.216-.84584-.32465-1.26859-.02187-.08506-.05038-.16839-.074-.253-.01425-.05109-.03824-.08064-.09655-.05988-.01471.00524-.032.00287-.04731.00683-.30154.07777-.60274.15684-.90462.23327-.05683.01439-.07172.03959-.05707.0971.08729.34271.17363.6857.256%2C1.02962.04277.1786.07731.3592.11415.53919.00691.03374.01261.06818-.0375.08124C14.78008%2C11.83627%2C14.53878%2C11.90148%2C14.28174%2C11.97006Z%22%20style%3D%22fill%3A%20%23fff%22%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%22M16.11668%2C18.80982c.30905-.079.61847-.15662.92688-.238a4.04425%2C4.04425%2C0%2C0%2C0%2C1.00592-.40112%2C1.25892%2C1.25892%2C0%2C0%2C0%2C.6833-.96462.87117.87117%2C0%2C0%2C0-.263-.74759%2C1.26334%2C1.26334%2C0%2C0%2C0-.86461-.33885%2C3.46284%2C3.46284%2C0%2C0%2C0-.91223.08281c-.23423.04768-.467.103-.69923.15983-.16011.03918-.31845.08577-.477.13092-.0854.02431-.08682.027-.06388.10967.032.11524.07077.22869.09967.34464.1351.54207.26762%2C1.08478.40157%2C1.62713.02079.08418.04425.1677.06749.25537C16.06%2C18.82188%2C16.08865%2C18.817%2C16.11668%2C18.80982Z%22%20style%3D%22fill%3A%20%23414042%22%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%22M15.27925%2C15.37185a5.23966%2C5.23966%2C0%2C0%2C0%2C1.09032-.33218%2C2.57964%2C2.57964%2C0%2C0%2C0%2C.69512-.41847.94776.94776%2C0%2C0%2C0%2C.3452-.51577.92025.92025%2C0%2C0%2C0-.35816-.92529%2C1.1176%2C1.1176%2C0%2C0%2C0-.70174-.22761%2C2.93148%2C2.93148%2C0%2C0%2C0-.80655.09177c-.26327.06507-.52453.13825-.78667.20792-.11054.02938-.11053.02942-.08878.13949.00514.026.00927.05232.01566.07805.1128.45416.22471.90854.33948%2C1.3622.04627.18291.09894.36421.15089.55422C15.21647%2C15.38049%2C15.24818%2C15.37781%2C15.27925%2C15.37185Z%22%20style%3D%22fill%3A%20%23414042%22%2F%3E%0A%20%20%3C%2Fg%3E%0A%3C%2Fsvg%3E%0A'); } .menace-raccoon { background-image: url('../images/menace-raccoon-monotone.png'); } /* Button spacing for 2+ buttons */ .button-gap { margin-left:15px; } .auto-margin-sides { margin:0 auto; } /* Fixes a small gap where different screen sizes might look funny. Maybe. */ @media (max-width:990px) and (min-width: 768px){ .ideatime { margin-left:0px !important; } } /* Justify */ .justice{ text-align: justify; -moz-text-align-last: justify; text-align-last: justify; } /*GitHub Buttons Fix */ .ghbuttons{ position: relative; display: block; line-height: 20px; font-size: 18px; color: #333333; color: #999; padding: 30px 15px; } .ghbuttons > iframe { margin-left:15px; } /* Flowchart Image */ @media screen and (min-width: 1400px) { .flowchart-image { max-width:529px; } } /* QR Code Resize */ .QR-code { max-width:150px; } /*Slack Invite Page */ .splash{width:30rem;margin:10rem auto;text-align:center;} @media (max-width: 375px) { .splash{margin-top:6rem} } @media (min-width:376px) and (max-width: 530px) { .splash{margin-top:13rem} } @media (min-width:530px) and (max-width: 50rem) { .splash{margin-top:15rem} } .head{margin-bottom:4rem} p{font-size:1.5rem;margin:.5rem 0} select{background:none} button, .form-item{font-size:1.2rem;margin-top:1.4rem;vertical-align:middle;display:block;text-align:center;box-sizing:border-box;width:100%;padding:.9rem} button{color:#fff;font-weight:bold;border-width:0;background:#38a2e6;text-transform:uppercase;cursor:pointer;appearance:none;-webkit-appearence:none;outline:0;transition:background-color 150ms ease-in, color 150ms ease-in} p.signin{padding:1rem 0 1rem;font-size:1.1rem} p.signin a{color:#38a2e6;text-decoration:none} p.signin a:hover{background-color:#38a2e6;color:#fff} .slack-sponsor{color:#D6D6D6;font-size:1.1rem;margin:0rem auto 0;/*width:30rem;*/text-align:center} .slack-sponsor a{color:#9B9B9B;text-decoration:none;border-bottom:.1rem solid #9B9B9B} .slack-sponsor a:hover{color:#fff;background-color:#9B9B9B} @media screen and (max-width: 375px) { .slack-footer { bottom:-50px !important; } } @media screen and (min-width: 1500px) { .slack-footer { bottom:-150px !important; } } .slack-footer { position: fixed; bottom: 0; } @media screen and (min-width: 425px) { .slack-footer img { max-width:66%; margin: 0 auto; } } @media (min-width:425px) and (max-width: 768px) { .slack-footer img { max-width:35%; margin: 0 auto; } } @media (min-width:768px) and (max-width: 1600px) { .slack-footer img { max-width:35%; margin: 0 auto; } } @media screen and (min-width: 1600px) { .slack-footer img { max-width:50%; margin: 0 auto; } } .slack-returntext { font-size: 1.2rem; font-weight: 500; text-transform: uppercase !important; color:#488d7f; } .capitalize {text-transform: capitalize;} /* STATIC Terminal Window */ .hide-this { overflow: hidden !important; } .page-terminal { background: #d7e9f7; display: table; width: 100%; table-layout: fixed } .page-terminal:hover { width: 200%; } .page-terminal>* { display: table-cell; vertical-align: top } .page-terminal>*:nth-child(1) { width: 60px; padding: 20px } .page-terminal>*:nth-child(2) { padding: 20px; border-left: white; border-left: 2px solid rgba(255,255,255,0.2) } .page-terminal>* pre { font-family: Menlo,Monaco,Consolas,"Courier New",monospace; font-weight: 400; overflow: hidden; background: transparent; /*height: 450px;*/ padding: 0; margin: 0; font-size: 13px; color: #292e31; border: 0px solid; } .page-terminal>*:nth-child(2) pre { overflow: auto } .page-terminal>* pre span { color: #4c0bc5 } .code-red { color:#c35252 !important; } .code-gray { color:#969896 !important; } .code-blue { color:#0b65c5 !important; } .code-teal { color:#05b1a2 !important; } .code-yellow { color:#95967a !important; } .code-orange { color:#e8a60c !important; } .code-white { color:#fff !important; } .code-dkgray { color:#333 !important; } .page-terminal-comment { margin: 20px 0; text-transform: uppercase; color: white; color: rgba(255,255,255,0.7); text-align: center } /* Monospace Font */ .monofont { font-family: 'Space Mono', monospace; } /* ANIMATED Terminal Window */ .terminal-subtext{ padding-left: 15px !important; padding-top:5px !important; color:#54585a; display: block; } .terminal-subtext > h6 > a{ color:#fff; } body { background: #6D7074; } .terminal-window { text-align: left; /*width: 500px;*/ width:100%; height: 360px; border-radius: 10px; margin: auto; position: relative; } .terminal-window header { background: #E0E8F0; height: 30px; border-radius: 8px 8px 0 0; padding-left: 10px; } .terminal-window header .button { width: 12px; height: 12px; margin: 10px 4px 0 0; display: inline-block; border-radius: 8px; } .terminal-window header .button.green { background: #3BB662; } .terminal-window header .button.yellow { background: #E5C30F; } .terminal-window header .button.red { background: #E75448; } .terminal-window section.terminal { color: white; font-family: Menlo, Monaco, "Consolas", "Courier New", "Courier"; font-size: 10pt; background: #30353A; padding: 10px; box-sizing: border-box; position: absolute; width: 100%; top: 30px; bottom: 0; overflow: auto; } .terminal-window section.terminal .typed-cursor { opacity: 1; -webkit-animation: blink 0.7s infinite; -moz-animation: blink 0.7s infinite; animation: blink 0.7s infinite; } @keyframes blink{ 0% { opacity:1; } 50% { opacity:0; } 100% { opacity:1; } } @-webkit-keyframes blink{ 0% { opacity:1; } 50% { opacity:0; } 100% { opacity:1; } } @-moz-keyframes blink{ 0% { opacity:1; } 50% { opacity:0; } 100% { opacity:1; } } .terminal-data { display: none; } .terminal-window .gray { color: gray; } .terminal-window .green { color: green;} .terminal-window .teal {color: #3dc1d4;} .terminal-window .purple {color: #9072e6;} .terminal-window .blue {color:#90d3ff;} /* Guides & Tutorials */ .guide-active { font-weight: 600; color:#000 !important; } .guide-active:hover { color:#385dc1 !important; } .post-content .post-video { max-height:550px; margin: 0 0 30px 0; } .post-content > p { margin-top:0px !important; margin-bottom:10px; } .fluid-width-video-wrapper { padding-top:40% !important; } /* [General Styles] */ body { background: #ffffff; font-family: "Open Sans", Arial, serif; line-height: 1.8; font-size: 14px; color: #777777; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -ms-overflow-style: scrollbar; overflow-x: hidden; } img { max-width: 100%; height: auto; } iframe { border: 0; } .disable-hover { pointer-events: none; } ::-moz-selection { background: #385dc1; color: #fff !important; } ::-webkit-selection { background: #385dc1; color: #fff !important; } ::selection { background: #385dc1; color: #fff !important; } .relative { position: relative; } /* Hide search icon on iPhone 5/6 portrait */ @media (max-width: 375px) { .hidden-xxs { display: none; } } /*------------------------------------------------------------------ [Typography] */ a { color: #385dc1; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } a:hover, a:focus { outline: 0; text-decoration: none; color: #1fa098; } h1 a, .h1 a, h2 a, .h2 a, h3 a, .h3 a, h4 a, .h4 a, h5 a, .h5 a, h6 a, .h6 a { color: #222222; } p, ul, ol, h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6, blockquote { margin: 0 0 20px; } h3, .h3, h4, .h4, h5, .h5, h6, .h6 { margin: 0 0 10px; } h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { line-height: 1.2; font-weight: 600; color: #222222; } h1, .h1 { font-size: 32px; } h2, .h2 { font-size: 26px; } h3, .h3 { font-size: 18px; } h4, .h4 { font-size: 16px; } h5, .h5 { font-size: 14px; } h6, .h6 { font-size: 12px; } h1.text-uppercase, .h1.text-uppercase { letter-spacing: 7px; margin-right: -7px; } h2.text-uppercase, .h2.text-uppercase { letter-spacing: 5px; margin-right: -5px; } h3.text-uppercase, .h3.text-uppercase { letter-spacing: 5px; margin-right: -5px; } h4.text-uppercase, .h4.text-uppercase { letter-spacing: 3px; margin-right: -3px; } h5.text-uppercase, .h5.text-uppercase { letter-spacing: 1px; margin-right: -1px; } h6.text-uppercase, .h6.text-uppercase { letter-spacing: 1px; margin-right: -1px; } .montserrat { font-family: "Montserrat", Arial, serif; font-weight: 700; } .lead { line-height: 1.8; font-weight: 400; font-size: 16px; } .lead-more { line-height: 2; font-weight: 600; font-size: 15px; } .divider-line:after { display: block; background: #385dc1; content: " "; margin: 20px auto 20px 0; opacity: 0.6; height: 2px; width: 50px; } .text-center .divider-line:after { margin: 20px auto 0; } .text-right .divider-line:after { margin: 20px 0 20px auto; } blockquote { border: 0; background: #f8f8f8; font-style: italic; font-size: 16px; padding: 25px; } hr { margin: 15px 0; } .bottom-line, .bottom-line2 { position: relative; } .bottom-line:before { content: ""; display: block; position: absolute; bottom: 0; width: 100%; border-bottom: 2px solid #eeeeee; } .bottom-line2:after { content: ""; display: block; width: 35px; border-bottom: 2px solid #385dc1; margin: 20px auto 25px 0; z-index: 1; position: relative; } .bottom-line:after { content: ""; display: block; width: 35px; border-bottom: 2px solid #385dc1; margin: 20px auto 25px 0; z-index: 1; position: relative; } .bottom-line.text-right:after { margin: 20px 0 25px auto; } .bottom-line.text-center:after { margin: 20px auto 25px; } .dash-list { list-style: none; padding: 0; margin: 0; } .dash-list > li { margin: 0 0 5px; } .dash-list > li:before { display: inline-block; content: "-"; margin-right: 12px; } /* --- [Colored Text] --- */ .color-white { color: #ffffff !important; } .color-white-dark { color: #f8f8f8 !important; } .color-white-darken { color: #f5f5f5 !important; } .color-gray { color: #777777 !important; } .color-gray-light { color: #999999 !important; } .color-gray-lighter { color: #eeeeee !important; } .color-black { color: #000000 !important; } .color-black-light { color: #222222 !important; } .color-black-lighter { color: #333333 !important; } .color-brand { color: #385dc1 !important; } .color-brand-hvr { color: #1fa098 !important; } .color-facebook { color: #3b5998 !important; } .color-twitter { color: #00aced !important; } .color-google { color: #dd4b39 !important; } .color-linkedin { color: #007bb6 !important; } .color-youtube { color: #bb0000 !important; } .color-instagram { color: #517fa4 !important; } .color-pinterest { color: #cb2027 !important; } .color-flickr { color: #ff0084 !important; } .color-tumblr { color: #32506d !important; } .color-forusquare { color: #0072b1 !important; } .color-dribbble { color: #ea4c89 !important; } .color-vine { color: #00bf8f !important; } .color-skype { color: #17a3eb !important; } .color-wordpress { color: #2592c3 !important; } .color-behance { color: #1879fd !important; } .color-soundcloud { color: #ff7e30 !important; } .color-stumbleupon { color: #ff5c30 !important; } .color-deviantart { color: #6a8a7b !important; } .color-yahoo { color: #ab47ac !important; } .color-digg { color: #75788d !important; } .color-github { color: #3f91cb !important; } .color-lastfm { color: #f34320 !important; } .color-vk { color: #2b587a !important; } /* Turing this off for now [class*="color-"] *:not(.btn) { color: inherit !important; } [class*="color-"] a:not(.btn) { color: inherit !important; } [class*="color-"] a:not(.btn):hover, [class*="color-"] a:not(.btn):focus { opacity: 0.7; } */ /* --- [Font Size Text] --- */ .text-xxxxs { font-size: 10px; } .text-xxxs { font-size: 11px; } .text-xxs { font-size: 12px; } .text-xs { font-size: 13px; } .text-xl { font-size: 40px; } .text-xxl { font-size: 48px; } .text-xxxl { font-size: 56px; } .text-xxxxl { font-size: 64px; } .text-xxxxxl { font-size: 72px; } .text-super-xl { font-size: 110px; } @media (max-width: 1023px) { .text-super-xl { font-size: 72px; } } @media (max-width: 767px) { .text-xl { font-size: 24px; } .text-xxl { font-size: 32px; } .text-xxxl { font-size: 36px; } .text-xxxxl { font-size: 40px; } .text-xxxxxl { font-size: 44px; } .text-super-xl { font-size: 48px; } } @media (max-width: 568px) { .text-super-xl { font-size: 34px; } } @media (max-width: 320px) { .text-super-xl { font-size: 26px; } } /* --- [ Font Weight Text ] --- */ .text-100 { font-weight: 100 !important; } .text-200 { font-weight: 200 !important; } .text-300 { font-weight: 300 !important; } .text-400 { font-weight: 400 !important; } .text-500 { font-weight: 500 !important; } .text-600 { font-weight: 600 !important; } .text-700 { font-weight: 700 !important; } .text-800 { font-weight: 800 !important; } .text-900 { font-weight: 900 !important; } /*------------------------------------------------------------------ [Alerts] */ .alert { border: 0; border-radius: 2px; padding: 20px; } .alert-brand { background: #385dc1; color: #17756f; } .alert-brand .alert-link { color: #12605b; } /*------------------------------------------------------------------ [Progress Bars] */ .progress { background-color: #f5f5f5; border-radius: 4px; box-shadow: none; height: 4px; margin-bottom: 20px; overflow: visible; } .progress-bar { position: relative; background-color: #385dc1; border-radius: 28px; box-shadow: none; color: #333333; } .progress-title { letter-spacing: 1px; text-transform: uppercase; text-align: left; font-weight: 700; margin: 0 0 10px; padding: 0; } .progress-bar > span { position: absolute; padding: 4px 0px; display: block; top: -27px; right: 0; opacity: 0; line-height: 12px; font-size: 12px; } .progress-bar.progress-bar-success { background-color: #5cb85c; } .progress-bar.progress-bar-info { background-color: #5bc0de; } .progress-bar.progress-bar-warning { background-color: #f0ad4e; } .progress-bar.progress-bar-danger { background-color: #d9534f; } /*------------------------------------------------------------------ [Label] */ .label { padding: .2em .6em .4em; } .label-base { background: #385dc1; } /*------------------------------------------------------------------ [Forms] */ .form-control { border: 2px solid #eee; border-radius: 2px; box-shadow: none; color: #999999; height: 39px; font-size: 14px; } .form-control:focus { border-color: #385dc1; box-shadow: none; } .form-control.form-transparent { background: transparent; border: 2px solid #ffffff; color: #ffffff; } .form-control.form-circle { border-radius: 30px; } .form-group { margin-bottom: 20px; } .input-lg { height: 47px; font-size: 14px; } .input-sm { height: 38px; font-size: 13px; } /* --- [Search Form] --- */ .search-form { position: relative; } .search-form:after { position: absolute; top: 0; right: 10px; font-family: 'FontAwesome'; line-height: 40px; content: '\f002'; font-size: 14px; color: #777777; opacity: 0.5; -webkit-font-smoothing: antialiased; } /* --- [Transparent Form Placeholders] --- */ input.form-control.form-transparent::-webkit-input-placeholder { color: #fff !important; } input.form-control.form-transparent::-moz-placeholder { color: #fff !important; } input.form-control.form-transparent:-moz-placeholder { color: #fff !important; } input.form-control.form-transparent :-ms-input-placeholder { color: #fff !important; } /* --- [Serch Form Placeholders] --- */ .search-form-inner input::-webkit-input-placeholder { color: #fff !important; } .search-form-inner input:focus::-webkit-input-placeholder { color: #fff !important; } .search-form-inner input::-moz-placeholder { color: #fff !important; } .search-form-inner input:focus::-moz-placeholder { color: #fff !important; } .search-form-inner input:-moz-placeholder { color: #fff !important; } .search-form-inner input:focus:-moz-placeholder { color: #fff !important; } .search-form-inner input:-ms-input-placeholder { color: #fff !important; } .search-form-inner input:focus:-ms-input-placeholder { color: #fff !important; } /*------------------------------------------------------------------ [Tables] */ table th { font-weight: 600; color: #222222; } .table > thead > tr > th { border-bottom: 1px solid #eeeeee; } .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td { border-top: 1px solid #eeeeee; padding: 10px; } .table-bordered { border: 1px solid #eeeeee; } .table-bordered > thead > tr > th, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > tbody > tr > td, .table-bordered > tfoot > tr > td { border-color: #eeeeee; } @media screen and (max-width: 767px) { .table-responsive { border: 0; margin-bottom: 0; } } /*------------------------------------------------------------------ [Buttons] */ .btn { text-transform: uppercase; letter-spacing: 1px; font-weight: bold; font-size: 11px; border-width: 2px; border-radius: 0; /*padding: 10px 24px;*/ -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .btn.btn-round { border-radius: 2px; } .btn.btn-circle { border-radius: 30px; } .btn:focus, .btn.focus, .btn.active.focus, .btn.active:focus, .btn:active.focus, .btn:active:focus { outline: 0; } /* --- [Button Sizes] --- */ .btn-lg { padding: 13px 31px; font-size: 13px; } .btn-sm { padding: 9px 19px 9px; font-size: 11px; } .btn-xs { padding: 8px 18px 8px; font-size: 10px; } /* --- [Navbar Buttons] --- */ .btn.navbar-btn { font-weight: bold !important; font-size: 10px; padding: 6px 20px !important; margin: 24px 15px; } .header-small .btn.navbar-btn { margin: 17px 15px; } /* --- [Button Colors] --- */ .btn.btn-purple { background-color: #654fb7; border-color: #654fb7; color: #fff; } .btn.btn-purple:hover { background-color: #5039a2; border-color: #5039a2; color: #fff; } .btn.btn-base { background-color: #385dc1; border-color: #385dc1; color: #fff; } .btn.btn-base:hover, .btn.btn-base:focus { background-color: #23b6ac; border-color: #23b6ac; color: #fff; } .btn.btn-base.btn-outline { background: transparent; border-color: #385dc1; color: #385dc1; } .btn.btn-base.btn-outline:hover, .btn.btn-base.btn-outline:focus { background: #385dc1; color: #fff; } .btn.btn-base.btn-link { background: transparent; border: 0; padding: 0; color: #385dc1; } .btn.btn-base.btn-link:hover, .btn.btn-base.btn-link:focus { background-color: transparent; text-decoration: none; color: #23b6ac; } .btn.btn-base.btn-fade { background: transparent; border-color: rgba(56, 93, 193, 0.5); color: rgba(56, 93, 193, 0.5); } .btn.btn-base.btn-fade:hover, .btn.btn-base.btn-fade:focus { background: transparent; border-color: #385dc1; color: #385dc1; } .btn.btn-gray { background-color: #f5f5f5; border-color: #f5f5f5; color: #333; } .btn.btn-gray:hover, .btn.btn-gray:focus { background-color: #e8e8e8; border-color: #e8e8e8; color: #333; } .btn.btn-gray.btn-outline { background: transparent; border-color: #f5f5f5; color: #f5f5f5; } .btn.btn-gray.btn-outline:hover, .btn.btn-gray.btn-outline:focus { background: #f5f5f5; color: #333; } .btn.btn-gray.btn-link { background: transparent; border: 0; padding: 0; color: #f5f5f5; } .btn.btn-gray.btn-link:hover, .btn.btn-gray.btn-link:focus { background-color: transparent; text-decoration: none; color: #e8e8e8; } .btn.btn-gray.btn-fade { background: transparent; border-color: rgba(245, 245, 245, 0.5); color: rgba(245, 245, 245, 0.5); } .btn.btn-gray.btn-fade:hover, .btn.btn-gray.btn-fade:focus { background: transparent; border-color: whitesmoke; color: whitesmoke; } .btn.btn-dark { background-color: #333; border-color: #333; color: #fff; } .btn.btn-dark:hover, .btn.btn-dark:focus { background-color: #262626; border-color: #262626; color: #fff; } .btn.btn-dark.btn-outline { background: transparent; border-color: #333; color: #333; } .btn.btn-dark.btn-outline:hover, .btn.btn-dark.btn-outline:focus { background: #333; color: #fff; } .btn.btn-dark.btn-link { background: transparent; border: 0; padding: 0; color: #333; } .btn.btn-dark.btn-link:hover, .btn.btn-dark.btn-link:focus { background-color: transparent; text-decoration: none; color: #262626; } .btn.btn-dark.btn-fade { background: transparent; border-color: rgba(51, 51, 51, 0.5); color: rgba(51, 51, 51, 0.5); } .btn.btn-dark.btn-fade:hover, .btn.btn-dark.btn-fade:focus { background: transparent; border-color: #333333; color: #333333; } .btn.btn-white { background-color: #fff; border-color: #fff; color: #333; } .btn.btn-white:hover, .btn.btn-white:focus { background-color: #f2f2f2; border-color: #f2f2f2; color: #333; } .btn.btn-white.btn-outline { background: transparent; border-color: #fff; color: #fff; } .btn.btn-white.btn-outline:hover, .btn.btn-white.btn-outline:focus { background: #fff; color: #333; } .btn.btn-white.btn-link { background: transparent; border: 0; padding: 0; color: #fff; } .btn.btn-white.btn-link:hover, .btn.btn-white.btn-link:focus { background-color: transparent; text-decoration: none; color: #f2f2f2; } .btn.btn-white.btn-fade { background: transparent; border-color: rgba(255, 255, 255, 0.5); color: rgba(255, 255, 255, 0.5); } .btn.btn-white.btn-fade:hover, .btn.btn-white.btn-fade:focus { background: transparent; border-color: white; color: white; } .btn.btn-primary { background-color: #337ab7; border-color: #337ab7; color: #fff; } .btn.btn-primary:hover, .btn.btn-primary:focus { background-color: #2d6da3; border-color: #2d6da3; color: #fff; } .btn.btn-primary.btn-outline { background: transparent; border-color: #337ab7; color: #337ab7; } .btn.btn-primary.btn-outline:hover, .btn.btn-primary.btn-outline:focus { background: #337ab7; color: #fff; } .btn.btn-primary.btn-link { background: transparent; border: 0; padding: 0; color: #337ab7; } .btn.btn-primary.btn-link:hover, .btn.btn-primary.btn-link:focus { background-color: transparent; text-decoration: none; color: #2d6da3; } .btn.btn-primary.btn-fade { background: transparent; border-color: rgba(51, 122, 183, 0.5); color: rgba(51, 122, 183, 0.5); } .btn.btn-primary.btn-fade:hover, .btn.btn-primary.btn-fade:focus { background: transparent; border-color: #337ab7; color: #337ab7; } .btn.btn-success { background-color: #5cb85c; border-color: #5cb85c; color: #fff; } .btn.btn-success:hover, .btn.btn-success:focus { background-color: #4cae4c; border-color: #4cae4c; color: #fff; } .btn.btn-success.btn-outline { background: transparent; border-color: #5cb85c; color: #5cb85c; } .btn.btn-success.btn-outline:hover, .btn.btn-success.btn-outline:focus { background: #5cb85c; color: #fff; } .btn.btn-success.btn-link { background: transparent; border: 0; padding: 0; color: #5cb85c; } .btn.btn-success.btn-link:hover, .btn.btn-success.btn-link:focus { background-color: transparent; text-decoration: none; color: #4cae4c; } .btn.btn-success.btn-fade { background: transparent; border-color: rgba(92, 184, 92, 0.5); color: rgba(92, 184, 92, 0.5); } .btn.btn-success.btn-fade:hover, .btn.btn-success.btn-fade:focus { background: transparent; border-color: #5cb85c; color: #5cb85c; } .btn.btn-info { background-color: #5bc0de; border-color: #5bc0de; color: #fff; } .btn.btn-info:hover, .btn.btn-info:focus { background-color: #46b8da; border-color: #46b8da; color: #fff; } .btn.btn-info.btn-outline { background: transparent; border-color: #5bc0de; color: #5bc0de; } .btn.btn-info.btn-outline:hover, .btn.btn-info.btn-outline:focus { background: #5bc0de; color: #fff; } .btn.btn-info.btn-link { background: transparent; border: 0; padding: 0; color: #5bc0de; } .btn.btn-info.btn-link:hover, .btn.btn-info.btn-link:focus { background-color: transparent; text-decoration: none; color: #46b8da; } .btn.btn-info.btn-fade { background: transparent; border-color: rgba(91, 192, 222, 0.5); color: rgba(91, 192, 222, 0.5); } .btn.btn-info.btn-fade:hover, .btn.btn-info.btn-fade:focus { background: transparent; border-color: #5bc0de; color: #5bc0de; } .btn.btn-warning { background-color: #f0ad4e; border-color: #f0ad4e; color: #fff; } .btn.btn-warning:hover, .btn.btn-warning:focus { background-color: #eea236; border-color: #eea236; color: #fff; } .btn.btn-warning.btn-outline { background: transparent; border-color: #f0ad4e; color: #f0ad4e; } .btn.btn-warning.btn-outline:hover, .btn.btn-warning.btn-outline:focus { background: #f0ad4e; color: #fff; } .btn.btn-warning.btn-link { background: transparent; border: 0; padding: 0; color: #f0ad4e; } .btn.btn-warning.btn-link:hover, .btn.btn-warning.btn-link:focus { background-color: transparent; text-decoration: none; color: #eea236; } .btn.btn-warning.btn-fade { background: transparent; border-color: rgba(240, 173, 78, 0.5); color: rgba(240, 173, 78, 0.5); } .btn.btn-warning.btn-fade:hover, .btn.btn-warning.btn-fade:focus { background: transparent; border-color: #f0ad4e; color: #f0ad4e; } .btn.btn-danger { background-color: #d9534f; border-color: #d9534f; color: #fff; } .btn.btn-danger:hover, .btn.btn-danger:focus { background-color: #d43f3a; border-color: #d43f3a; color: #fff; } .btn.btn-danger.btn-outline { background: transparent; border-color: #d9534f; color: #d9534f; } .btn.btn-danger.btn-outline:hover, .btn.btn-danger.btn-outline:focus { background: #d9534f; color: #fff; } .btn.btn-danger.btn-link { background: transparent; border: 0; padding: 0; color: #d9534f; } .btn.btn-danger.btn-link:hover, .btn.btn-danger.btn-link:focus { background-color: transparent; text-decoration: none; color: #d43f3a; } .btn.btn-danger.btn-fade { background: transparent; border-color: rgba(217, 83, 79, 0.5); color: rgba(217, 83, 79, 0.5); } .btn.btn-danger.btn-fade:hover, .btn.btn-danger.btn-fade:focus { background: transparent; border-color: #d9534f; color: #d9534f; } .btn-list .btn { margin-top: 5px; margin-bottom: 5px; } /*------------------------------------------------------------------ [Play Button] */ .play-btn { border: 2px solid #000000; background-color: transparent; border-radius: 50%; color: #000000; width: 75px; font-size: 18px; height: 75px; line-height: 72px; padding: 0 0 0px 5px; margin: 0 20px; display: inline-block; text-align: center; position: relative; -webkit-animation: pulse 1.2s infinite cubic-bezier(0.8, 0, 0, 1); animation: pulse 1.2s infinite cubic-bezier(0.8, 0, 0, 1); box-shadow: 0 0 0 0 rgba(194, 244, 246, 0.7); } .play-btn.white { border-color: #ffffff; color: #ffffff; } @-webkit-keyframes pulse { to { box-shadow: 0 0 0 45px rgba(194, 244, 246, 0); } } @keyframes pulse { to { box-shadow: 0 0 0 45px rgba(194, 244, 246, 0); } } /*------------------------------------------------------------------ [Breadcrumb] */ .breadcrumb { background: none; padding: 0; margin: 0; } .breadcrumb a { color: #999999; } .breadcrumb a:hover, .breadcrumb a:focus { color: #385dc1; } .breadcrumb > li + li:before { color: #999999; padding: 0 8px; } .breadcrumb > .active { color: #999999; opacity: 0.9; } /*------------------------------------------------------------------ [Icon box] */ .box-icon, .box-icon-left, .box-icon-right { padding: 35px 0; } .box-icon .icon-box-icon, .box-icon-left .icon-box-icon, .box-icon-right .icon-box-icon { font-size: 34px; color: #385dc1; margin: 0 0 10px; } .box-icon p:last-child, .box-icon-left p:last-child, .box-icon-right p:last-child { margin: 0; } .box-icon-left { position: relative; padding: 35px 0 35px 50px; } .box-icon-left .icon-box-icon { position: absolute; height: 44px; width: 30px; left: 0; top: 35px; text-align: center; line-height: 40px; font-size: 26px; } .box-icon-right { position: relative; padding: 35px 50px 35px 0; text-align: right; } .box-icon-right .icon-box-icon { position: absolute; height: 44px; width: 30px; right: 0; top: 35px; text-align: center; line-height: 40px; font-size: 26px; } @media (max-width: 767px) { .box-icon-left, .box-icon-right { padding: 35px 0 35px 50px; text-align: left; } .box-icon-left .icon-box-icon, .box-icon-right .icon-box-icon { left: 0; top: 35px; } } /*------------------------------------------------------------------ [Icon Preview] */ .icon-preview { border: 1px solid #f5f5f5; display: block; width: 25%; float: left; padding: 10px; font-size: 13px; margin: -1px 0 0 -1px; } .icon-preview .icons { margin-right: 5px; } .fa-icons > div { border: 1px solid #f5f5f5; margin: -1px 0 0 -1px; padding: 0; font-size: 13px; } .fa-icons > div > i { border-right: 1px solid #f5f5f5; display: inline-block; margin-right: 5px; min-width: 40px; min-height: 40px; line-height: 40px; text-align: center; font-size: 14px; } /*------------------------------------------------------------------ [Screenshots] */ .screenshots .screenshot { background: #f8f8f8; border-radius: 2px; padding: 10px; margin: 0 0 30px; } .screenshots .screenshot img { border-radius: 2px; width: 100%; } /*!------------------------------------------------------------------ [Off Canvas Cart] */ body:after { background: rgba(0, 0, 0, 0.7); position: fixed; height: 1px; width: 1px; bottom: 0; right: 0; left: 0; top: -1px; z-index: 1035; content: " "; visibility: hidden; opacity: 0; -webkit-transition: opacity 0.2s cubic-bezier(0.785, 0.135, 0.15, 0.86); transition: opacity 0.2s cubic-bezier(0.785, 0.135, 0.15, 0.86); cursor: pointer; } body.off-canvas-cart-open:after { visibility: visible; height: 100%; width: 100%; opacity: 1; top: 0; } .off-canvas-cart-open .off-canvas-cart { -webkit-transform: translateX(-425px); transform: translateX(-425px); } .off-canvas-cart { background: #ffffff; position: fixed; right: -425px; top: 0; height: 100%; width: 425px; z-index: 1040; -webkit-transition: -webkit-transform 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86); transition: -webkit-transform 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86); transition: transform 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86); transition: transform 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86), -webkit-transform 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86); } .off-canvas-cart-header { text-align: right; padding: 22px 50px; } .off-canvas-cart-header > a { font-size: 21px; } .off-canvas-cart-wrapper { width: auto; height: 100%; overflow-x: hidden; overflow-y: scroll; } .off-canvas-cart-content-wrap { padding: 0 50px 265px; } .off-canvas-cart-item { display: table; border-bottom: 1px solid #f5f5f5; padding: 20px 0; vertical-align: auto; } .off-canvas-cart-item:first-child { border-top: 1px solid #f5f5f5; } .off-canvas-cart-item:last-child { border: 0; } .off-canvas-cart-item-title, .off-canvas-cart-item-trash, .off-canvas-cart-item-thumbnail { display: table-cell; vertical-align: middle; } .off-canvas-cart-item-trash { width: 12%; } .off-canvas-cart-item-thumbnail { width: 22%; } .off-canvas-cart-item-thumbnail img { width: 100%; } .off-canvas-cart-item-title { padding: 0 0 0 20px; width: 66%; } .off-canvas-cart-footer { background: #ffffff; position: absolute; width: 100%; bottom: 0; left: 0; } .off-canvas-cart-info { background: #f8f8f8; padding: 20px 50px; } .off-canvas-cart-control { padding: 50px; } .off-canvas-cart-control .btn:not(:last-child) { margin-bottom: 15px; } @media (max-width: 736px) { .off-canvas-cart-content-wrap { padding-bottom: 20px; } .off-canvas-cart-footer { position: static; } } @media (max-width: 425px) { .off-canvas-cart { right: -100%; width: 100%; } .off-canvas-cart-open .off-canvas-cart { -webkit-transform: translateX(-100%); transform: translateX(-100%); } .off-canvas-cart-header, .off-canvas-cart-content-wrap, .off-canvas-cart-control { padding-right: 20px; padding-left: 20px; } } /*!------------------------------------------------------------------ [Preloader] */ .page-loader { background: #fff; position: fixed; top: 0; bottom: 0; right: 0; left: 0; z-index: 9998; } .img-loader { position: relative; display:block; top: 45%; margin:auto; width:25%; max-width:250px; text-align:center; animation: heartbeat 2s infinite cubic-bezier(0.5, 0.49, 0.49, 0.49); -webkit-animation: heartbeat 2s infinite cubic-bezier(0.5, 0.49, 0.49, 0.49); } @keyframes heartbeat { 0% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 0; } } @-webkit-keyframes heartbeat { 0% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 0; } } /*------------------------------------------------------------------ [Dropdown] */ .dropdown-menu { background-color: #222222; border: 0; border-radius: 0; box-shadow: none; min-width: 180px; font-size: 12px; padding: 10px 0; z-index: 1031; } .dropdown-menu .divider { background: #363636; margin: 10px 0; } .dropdown-menu li > a { background: none !important; padding: 10px 24px 10px 20px; color: rgba(255, 255, 255, 0.5); } .dropdown-menu li > a:hover, .dropdown-menu li > a:focus { color: #ffffff; } .dropdown-menu .open > a, .dropdown-menu .open > a:hover, .dropdown-menu .open > a:focus { color: #ffffff; } /*------------------------------------------------------------------ [Counters] */ .counter { padding: 20px 0; } .counter-title { font-size: 40px; } .counter-content { margin: 0; } /*------------------------------------------------------------------ [Team] */ .team-item { text-align: center; } .team-photo { position: relative; overflow: hidden; } .team-photo > img { width: 100%; } .team-photo:after { background: transparent; position: absolute; display: block; content: " "; height: 100%; width: 100%; top: 0; left: 0; z-index: 1; -webkit-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; } .team-social { position: absolute; padding: 20px; height: 100%; width: 100%; left: 0; top: 0; opacity: 0; z-index: 2; -webkit-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; } .team-social > div { display: table; height: 100%; width: 100%; } .team-social > div > div { vertical-align: middle; display: table-cell; } .team-social a { display: inline-block; padding: 0 15px; font-size: 24px; color: #ffffff; -webkit-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; } .team-social a:hover { opacity: 0.7; } .team-inner { margin: 25px 0; } .team-name { text-transform: uppercase; letter-spacing: 1px; font-weight: 700; margin: 0; } .team-role { font-size: 13px; } .team-item:hover .team-photo:after { background: rgba(56, 93, 193, 0.9); } .team-item:hover .team-social { opacity: 1; } /* --- [ Dark Hover Overlay ] --- */ .team-item.team-item-dark:hover .team-photo:after { background: rgba(51, 51, 51, 0.9); } /* --- [ White Hover Overlay ] --- */ .team-item.team-item-white:hover .team-photo:after { background: rgba(255, 255, 255, 0.9); } .team-item-white .team-social a { color: #333333; } /*------------------------------------------------------------------ [Tabs and Accordions] */ .nav-tabs { border-bottom: 1px solid #eee; } .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus { border: 1px solid #eee; border-bottom-color: transparent; color: #777777; } .nav-tabs + .tab-content { border: 1px solid #eee; border-top: 0; padding: 20px 15px; } .nav-tabs + .tab-content *:last-child { margin-bottom: 0; } /* --- [ Text Tabs ] --- */ .nav-text-tabs { border-bottom: 2px solid #eeeeee; list-style: none; padding: 0; margin: 0; } .nav-text-tabs > li { display: inline-block; } .nav-text-tabs > li > a { position: relative; display: block; padding: 10px 20px; text-transform: uppercase; letter-spacing: 1px; font-weight: 700; font-size: 12px; color: #777777; } .nav-text-tabs > li > a:after { content: ''; position: absolute; width: 100%; height: 2px; background: #385dc1; bottom: 10px; opacity: 0; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; bottom: -2px; left: 0; } .nav-text-tabs > li.active > a { color: #385dc1; } .nav-text-tabs > li.active > a:after { opacity: 1; } .nav-text-tabs + .tab-content { padding: 20px 0; } @media (max-width: 527px) { .nav-text-tabs > li { border-top: 1px solid #eee; text-align: center; display: block; } .nav-text-tabs > li > a { padding: 20px 15px; } .nav-text-tabs > li > a:after { content: none; } } .panel-heading a { position: relative; display: block; } .panel-title { /*text-transform: uppercase; letter-spacing: 1px;*/ font-weight: 500; font-size: 12px; } .panel-title .fa { margin:0 20px 0 0; } .panel-default > .panel-heading { border: 0; background: transparent; border-radius: 0; /* border-top: 1px solid #eee; */ padding: 20px 15px; } .panel-default > .panel-heading + .panel-collapse > .panel-body { border-top-color: #eee; } /* this moves the accordian arrow to the left side */ .panel-heading a#title-logo :after { position: absolute; content: "\f107"; top: 50%; left: 0px; margin-top: -5px; font-family: "FontAwesome"; font-size: 11px; line-height: 1; } /* .panel-heading a.collapsed:after { content: "\f105"; }*/ .panel-group .panel + .panel { margin-top: 0; } .panel-group .panel { border: 0; border-radius: 0; box-shadow: none; } /* nahhh .panel-group .panel:last-child { border-bottom: 1px solid #eee; }*/ /*------------------------------------------------------------------ [Testimonials] */ .testimonial-image { text-align: center; } .testimonial-image img { border-radius: 100%; margin-right: 15px; max-width: 75px; } .testimonial-image img, .testimonial-image .cd-author-info { display: inline-block; vertical-align: middle; } .testimonial-image .cd-author-info { text-align: left; } .testimonial { text-align: center; border: 0; padding: 0; margin: 35px 0 0; font-size: 16px; } .slider-testimonial.owl-theme .owl-controls .owl-buttons div { background: none; padding: 0; margin: 0; opacity: 1; font-size: 20px; } .slider-testimonial.owl-theme .owl-controls .owl-buttons div.owl-prev { position: absolute; left: 0px; top: 50%; margin: -10px 0 0; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .slider-testimonial.owl-theme .owl-controls .owl-buttons div.owl-next { position: absolute; right: 0px; top: 50%; margin: -10px 0 0; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .slider-testimonial.owl-theme .owl-controls .owl-buttons div.owl-prev:hover, .slider-testimonial.owl-theme .owl-controls .owl-buttons div.owl-next:hover { opacity: 0.7; } .slider-testimonial .owl-item { padding: 0 100px; } .slider-testimonial .owl-pagination { margin: 30px 0 0; } .slider-testimonial .owl-page span { background: #000; box-shadow: 0px 0px 0px 3px transparent; border-radius: 50%; display: block; height: 10px; width: 10px; opacity: 0.5; zoom: 1; -webkit-transform: scale(0.8); transform: scale(0.8); -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .slider-testimonial .owl-page.active span { background: transparent; box-shadow: 0px 0px 0px 3px black; -webkit-transform: scale(0.9); transform: scale(0.9); opacity: 1; zoom: 1; } .owl-controls-brand .owl-page span { background: #385dc1; } .owl-controls-brand .owl-page.active span { background: transparent; box-shadow: 0px 0px 0px 3px #385dc1; } @media (max-width: 767px) { .testimonial-image .cd-author-info, .testimonial-image img { display: block; margin: 0 auto 15px; text-align: center; } } /*------------------------------------------------------------------ [Pagination] */ .pagination { display: block; } .pagination > li { display: inline-block; } .pagination > li > a, .pagination > li > span { display: block; border: 2px solid #eeeeee; border-radius: 3px; padding: 8px 15px; float: none; color: #777777; } .pagination > li > a:hover, .pagination > li > a:focus, .pagination > li > span:hover, .pagination > li > span:focus { background: #385dc1; border-color: #385dc1; color: #ffffff; } .pagination > .active > a, .pagination > .active > span { background: #385dc1; border-color: #385dc1; color: #ffffff; } .pagination > .active > a:hover, .pagination > .active > a:focus, .pagination > .active > span:hover, .pagination > .active > span:focus { background: #385dc1; border-color: #385dc1; color: #ffffff; } .pagination > li:first-child > a, .pagination > li:first-child > span { border-radius: 3px; } /* --- [ Pager ] --- */ .pager li > a, .pager li > span { border: 2px solid #eeeeee; border-radius: 3px; padding: 8px 15px; float: none; line-height: 1.42857143; color: #777777; } .pager li > a:hover, .pager li > a:focus, .pager li > span:hover, .pager li > span:focus { background: #385dc1; border-color: #385dc1; color: #ffffff; } /*------------------------------------------------------------------ [Features Box] */ .feature { margin: 35px 0; } .feature img { width: 100%; margin: 0 0 25px; } .feature.feature-circle { text-align: center; } .feature.feature-circle img { width: auto; border-radius: 50%; } .feature .box-shadow { box-shadow: 0px 6px 32px -15px black; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .feature .box-shadow:hover { opacity: 0.5; } .demo-img { padding: 0 20px; } /*------------------------------------------------------------------ [Maps] */ .maps-container { height: 450px; } #map { height: 100% !important; width: 100%; } /*------------------------------------------------------------------ [Clients] */ .client { text-align: center; opacity: 0.7; -webkit-transition: all 0.3s cubic-bezier(0.3, 0.1, 0.58, 1); transition: all 0.3s cubic-bezier(0.3, 0.1, 0.58, 1); } .client:hover, .client:focus { opacity: 1; } /* --- [ Clients Carousel ] --- */ .clients-carousel { text-align: center; } .clients-carousel .owl-item a { -webkit-transition: all 0.3s cubic-bezier(0.3, 0.1, 0.58, 1); transition: all 0.3s cubic-bezier(0.3, 0.1, 0.58, 1); opacity: 0.7; } .clients-carousel .owl-item a:hover, .clients-carousel .owl-item a:focus { opacity: 1; } .clients-bordered .client { padding: 70px 10px; } .clients-bordered .client:not(:last-child) { border-right: 1px solid #eee; } @media (max-width: 991px) { .clients-bordered .client:nth-child(3n) { border: 0; } } @media (max-width: 767px) { .clients-bordered .client:nth-child(3n) { border-right: 1px solid #eee; } .clients-bordered .client:nth-child(2n) { border: 0; } } /*------------------------------------------------------------------ [Pricing] */ .pricing-table { background: #fff; box-shadow: 0 0 1px 1px #eee; position: relative; text-align: center; } .pricing-title, .pricing-action { padding: 25px 0; } .pricing-title h6 { text-transform: uppercase; letter-spacing: 1px; font-weight: 700; margin: 0; } .pricing-price { border-top: 1px solid #f5f5f5; border-bottom: 1px solid #f5f5f5; padding: 20px 0; } .pricing-price .price-unit { text-transform: uppercase; font-size: 54px; color: #222222; } .price-unit > span { vertical-align: top; letter-spacing: 2px; line-height: 3.5; font-size: 22px; } .pricing-features ul { list-style: none; padding: 0 0; margin: 0; } .pricing-features ul li { border-bottom: 1px solid #f5f5f5; padding: 8px 0; } .pricing-features ul li:nth-child(odd) { background: #f8f8f8; } .pricing-table { margin: 10px 0 0; } .pricing-table.best-value { z-index: 1; margin: 0 0 0; } .pricing-table.best-value .pricing-title, .pricing-table.best-value .pricing-action { padding: 30px 0; } @media (max-width: 767px) { .pricing-table.best-value { margin: 10px 0 0; } } /*------------------------------------------------------------------ [Pie charts] */ .pie-chart { position: relative; text-align: center; padding: 40px 0; } .pie-chart .chart { position: relative; display: block; height: 180px; width: 180px; margin: 0 auto 25px; } .pie-chart .chart > canvas { position: absolute; left: 0; top: 0; height: 100% !important; width: 100% !important; } .pie-chart .chart-text { vertical-align: middle; line-height: 180px; font-size: 22px; color: #222222; } .pie-chart .chart-text .fa, .pie-chart .chart-text [class*="ti-"] { line-height: 180px; } .pie-chart .chart-title h5 { margin: 0 0 15px; } .pie-chart .chart-title > *:last-child { margin-bottom: 0; } /*------------------------------------------------------------------ [Carousel] */ .owl-prev, .owl-next { position: absolute; top: 50%; margin: -23px 0 0 0; font-size: 18px; color: #222; background: white; height: 46px; width: 46px; line-height: 46px; text-align: center; border-radius: 3px; opacity: 0; -webkit-transition: all 0.3s cubic-bezier(0.3, 0.1, 0.58, 1); transition: all 0.3s cubic-bezier(0.3, 0.1, 0.58, 1); } .owl-prev { left: 23px; } .owl-next { right: 23px; } .owl-carousel:hover .owl-prev, .owl-carousel:hover .owl-next { opacity: 0.6; } .owl-pagination + .owl-buttons .owl-prev, .owl-pagination + .owl-buttons .owl-next { margin-top: -35.5px; } .owl-pagination { text-align: center; margin: 10px 0 0; } .owl-page { display: inline-block; position: relative; margin: 0 5px; } .owl-page span { background: #385dc1; } .owl-page.active span { background: transparent; box-shadow: 0px 0px 0px 3px #385dc1; } /* --- [ Carousel Controls White ] --- */ .carousel-controls-white .owl-prev, .carousel-controls-white .owl-next { color: #ffffff; } /* --- [ Carousel Pagination White ] --- */ .carousel-pagination-white .owl-page span { background: #ffffff; } .carousel-pagination-white .owl-page.active span { background: transparent; box-shadow: 0px 0px 0px 3px white; } /* --- [ Image Slider ] --- */ .image-slider, .image-slider .owl-item { padding: 0; margin: 0; } .image-slider .owl-pagination { position: absolute; bottom: 10px; width: 100%; } .image-slider .owl-page span { background: #ffffff; } .image-slider .owl-page.active span { background: transparent; box-shadow: 0px 0px 0px 3px white; } .image-slider .owl-buttons .owl-prev, .image-slider .owl-buttons .owl-next { margin-top: -23px; } /* --- [ Image Carousel ] --- */ .images-carousel { width: auto; margin: 0 -5px; } .images-carousel .owl-item { padding: 0 5px; } /* --- [ Box Carousel ] --- */ .box-carousel { width: auto; margin: 0 -15px; } .box-carousel .owl-item { padding: 0 15px; } /*------------------------------------------------------------------ [Social Icons] */ .social-icons { list-style: none; padding: 0; margin: 0; } .social-icons > li { display: inline-block; } .social-icons > li > a { background: #f5f5f5; display: block; margin: 0 8px 8px 0; text-align: center; line-height: 32px; font-size: 14px; height: 32px; width: 32px; color: #777777; } .social-icons > li > a:hover, .social-icons > li > a:focus { background: #385dc1; color: #ffffff; } /* --- [ Social Icons Size ] --- */ .social-icons-lg > li > a { line-height: 48px; font-size: 16px; height: 48px; width: 48px; } .social-icons-md > li > a { line-height: 40px; height: 40px; width: 40px; } /* --- [ Social Icons Mode ] --- */ .social-icons-round > li > a { border-radius: 2px; } .social-icons-circle > li > a { border-radius: 100%; } /* --- [ Social Icons Colored ] --- */ .social-icons-colored > li > a { color: #ffffff; } .social-icons-colored > li > a:hover, .social-icons-colored > li > a:focus { opacity: 0.85; } /* --- [ Social Icons Simple ] --- */ .social-icons-simple > li > a { display: inline; background: none; margin: 0 10px 10px 0; } .social-icons-simple > li > a:hover, .social-icons-simple > li > a:focus { background: none; color: inherit; } /*------------------------------------------------------------------ [Top bar] */ .top-bar { background: #ffffff; border-bottom: 1px solid #f5f5f5; font-size: 12px; padding: 8px 0; } .top-bar.top-bar-black { border: 0; background: #000000; color: #ffffff; } .top-bar-black a { -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; color: #ffffff; } .top-bar-black a:hover, .top-bar-black a:focus { color: rgba(255, 255, 255, 0.85); } .top-bar-list { list-style: none; padding: 0; margin: 0; } .top-bar-list > li { display: inline-block; } .top-bar-list > li:not(:first-child) { margin-left: 10px; } .top-bar-list.list-icons > li .fa, .top-bar-list.list-icons > li .icons { margin-right: 5px; } .list-dividers li:not(:last-child) a { border-right: 1px solid whitesmoke; padding-right: 10px; } .top-bar-black .list-dividers li:not(:last-child) a { border-right: 1px solid #222; } @media (max-width: 991px) { .top-bar .container { width: 100%; } } /*------------------------------------------------------------------ [Header & Navigation] */ /* Header */ .header { background: #ffffff; position: relative; z-index: 1030; box-shadow: inset 0 -1px 0px #f5f5f5; -webkit-transition: height 0.3s ease-out, background 0.3s ease-out, box-shadow 0.3s ease-out; transition: height 0.3s ease-out, background 0.3s ease-out, box-shadow 0.3s ease-out; } .header.js-stick { position: -webkit-sticky; position: sticky; top: -1px; } .header.header-fixed { position: fixed; z-index: 1030; right: 0; left: 0; } /* Brand */ .inner-header { position: relative; z-index: 1; float: left; } .inner-brand { display: table-cell; vertical-align: middle; height: 86px; font-weight: 700; font-size: 18px; color: #000000; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .inner-brand .brand-light { display: none; } /* Menu extras */ .menu-extras { padding: 0 0 0 15px; margin: 0 0 0 15px; box-shadow: -1px 0 0 #f5f5f5; -webkit-transition: box-shadow 0.3s ease-out 0.125s; transition: box-shadow 0.3s ease-out 0.125s; } .menu-extras .menu-item { float: left; } .menu-extras > .menu-item > div > a { position: relative; display: block; line-height: 20px; font-size: 18px; color: #333333; color: #999; padding: 33px 15px; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .menu-extras > .menu-item > div > a:hover, .menu-extras > .menu-item > div > a:focus { color: #222222; } .cart-badge { position: absolute; background: #385dc1; border-radius: 100%; height: 14px; width: 14px; top: 50%; left: 23px; margin-top: -13px; text-align: center; line-height: 14px; font-weight: bold; font-size: 8px; color: #fff; } /* Main nav */ .main-nav { position: relative; } /* Inner nav */ .inner-nav { list-style: none; padding: 0; margin: 0; } .inner-nav > li { float: left; } .inner-nav > li > a { text-transform: uppercase; letter-spacing: 1px; line-height: 20px; font-weight: 400; font-size: 11px; display: block; padding: 33px 15px; } /* Submenu */ .submenu, .submenu-mega > li > ul { list-style: none; padding: 0; margin: 0; } .submenu { position: absolute; background: #222222; padding: 0; min-width: 180px; opacity: 0; z-index: 1030; visibility: hidden; text-align: left; font-size: 13px; } .submenu-open > .submenu { visibility: visible; opacity: 1; } .submenu .submenu { left: 100%; top: 0; } /* Submenu mega */ .submenu-mega { display: table; width: 100%; padding: 0; right: 0; left: 0; } .submenu-mega > li { display: table-cell; padding: 15px 10px; width: 25%; } .submenu-mega > li:not(:last-child) { border-right: 1px solid rgba(51, 51, 51, 0.5); } .submenu .has-submenu > a:after { position: absolute; content: "\f105"; display: block; right: 14px; top: 50%; margin-top: -7px; font-family: 'FontAwesome'; text-rendering: auto; font-size: 10px; } .submenu li { position: relative; } .submenu-title, .submenu li a { position: relative; display: block; line-height: 1.4; padding: 12px 27px 12px 20px; border-bottom: 1px solid rgba(51, 51, 51, 0.5); } .submenu li:last-child > a { border: 0; } .submenu-title, .submenu-mega li a { border: 0; } .submenu-title { text-transform: uppercase; letter-spacing: 1px; line-height: 1.8; font-weight: 700; font-size: 11px; } .submenu li a > .fa, .submenu li a > .icons { text-align: center; margin-right: 6px; width: 22px; } /* Link & Text colors */ .inner-nav > li > a { color: #999; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .inner-nav > li > a.active { color: #222222; } .inner-nav > li > a:hover, .inner-nav > li > a:focus, .inner-nav > li.submenu-open > a { color: #222222; } .submenu li > a { color: rgba(255, 255, 255, 0.5); -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .submenu-title { color: #ffffff; } .submenu li > a:hover, .submenu li > a:focus, .submenu li.submenu-open > a { background: rgba(51, 51, 51, 0.5); color: #ffffff; } /* Nav toggle */ .main-nav-toggle { border-left: 1px solid #f5f5f5; display: none; float: right; padding: 33px 0 33px 15px; margin-left: 15px; } .nav-icon-toggle { position: relative; height: 20px; width: 20px; -webkit-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .5s ease-in-out; transition: .5s ease-in-out; cursor: pointer; } .nav-icon-toggle span:nth-child(1) { top: 3px; -webkit-transform-origin: left center; transform-origin: left center; } .nav-icon-toggle span:nth-child(2) { top: 10px; -webkit-transform-origin: left center; transform-origin: left center; } .nav-icon-toggle span:nth-child(3) { top: 16px; -webkit-transform-origin: left center; transform-origin: left center; } .nav-icon-toggle span { background: #000000; position: absolute; display: block; height: 1px; width: 100%; opacity: 1; left: 0; -webkit-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; transition: .25s ease-in-out; } .nav-icon-toggle.open span:nth-child(1) { top: 2px; left: 3px; -webkit-transform: rotate(45deg); transform: rotate(45deg); } .nav-icon-toggle.open span:nth-child(2) { opacity: 0; width: 0; } .nav-icon-toggle.open span:nth-child(3) { top: 16px; left: 3px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } @media (max-width: 991px) { .header .container { width: 100%; } .main-nav-toggle { display: block; }/* Main nav */ .main-nav { position: absolute; background: #ffffff; border-bottom: 1px solid #f5f5f5; max-height: 340px; width: 100%; left: 0; top: 100%; } .main-nav.in { overflow-y: auto; }/* Inner nav */ .inner-nav { float: none !important; padding: 10px 15px; } .inner-nav > li { display: block; float: none; } .inner-nav > li > a { position: relative; padding: 10px 0; } .submenu a, .inner-nav > li:not(:last-child) > a { border-bottom: 1px solid #f5f5f5; }/* Submenu */ .submenu, .submenu .submenu, .submenu.submenu-mega { background: transparent; display: none; margin: 0; } .submenu-open > .submenu { position: static; display: block !important; } .submenu li a { padding: 10px 4px 10px 0; }/* Mega menu */ .submenu { padding: 0 0 0 15px; } .submenu-title { padding: 15px 0 10px; } .submenu-mega > li { display: block; width: 100%; padding: 0; } .submenu-mega > li, .submenu-mega > li:not(:last-child) { border: 0; } .submenu .has-submenu > a:after, .submenu.submenu-mega li a:after { right: 0; } .has-submenu > a:after { position: absolute; content: "\f105"; display: block; right: 0px; top: 50%; margin-top: -9px; font-family: 'FontAwesome'; text-rendering: auto; font-size: 10px; }/* Link colors */ .submenu li > a { border-bottom: 1px solid #f5f5f5; color: #999; } .submenu-title, .submenu li > a:hover, .submenu li > a:focus, .submenu li.submenu-open > a { background: none; color: #222222; } } @media (min-width: 992px) { /* Collapse main-nav */ .main-nav.collapse { display: block !important; overflow: visible !important; height: auto !important; padding-bottom: 0; }/* Header small */ .header-small .inner-brand { height: 72px; } /* padding-top and padding-bottom was set to 26px by template. the menu bar height is set above to 72px, and the line-height of li > a is 20px logic would have it that 26 + 26 + 20 = 72 but there's weird padding on scroll in reality, the menu bar computes to 85px (so 32.5 + 32.5 + 20 = 85) setting the padding to 32px fixes it for now */ .header-small .main-nav-toggle, .header-small .inner-nav > li > a, .header-small .menu-extras .menu-item a { padding-top: 32.5px; padding-bottom: 32.5px; }/* Header transparent */ .header.header-transparent { background: transparent; box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.1); -webkit-transition: height 0.3s ease-out, background 0.3s ease-out, box-shadow 0s ease-out; transition: height 0.3s ease-out, background 0.3s ease-out, box-shadow 0s ease-out; } .header.header-transparent .brand-light { display: inline; } .header.header-transparent .brand-dark { display: none; } .header.header-transparent .menu-extras { box-shadow: -1px 0 0 rgba(255, 255, 255, 0.1); -webkit-transition: box-shadow 0s ease-out; transition: box-shadow 0s ease-out; } .header.header-transparent .inner-nav > li > a, .header.header-transparent .menu-extras .menu-item a { color: #ffffff; } .header.header-transparent .inner-nav > li > a:hover, .header.header-transparent .inner-nav > li > a:focus, .header.header-transparent .inner-nav > li.active > a, .header.header-transparent .inner-nav > li.submenu-open > a, .header.header-transparent .menu-extras .menu-item a:hover, .header.header-transparent .menu-extras .menu-item a:focus { color: rgba(255, 255, 255, 0.7); } } /*------------------------------------------------------------------ [Header Search] */ .header-search-form { background: rgba(51, 51, 51, 0.95); display: inline-block; position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 9999999; visibility: hidden; -webkit-transform: translateY(-100%); transform: translateY(-100%); -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .header-search-form.opened { visibility: visible; opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } .header-search-form-clouse { text-align: center; font-size: 24px; padding: 0 0 40px; } .form-close-btn { color: #fff; } .form-close-btn:hover { color: rgba(255, 255, 255, 0.8); } .search-form-inner { position: absolute; width: 100%; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .search-form-inner input { background: transparent; width: 100%; border: none; text-align: center; font-size: 48px; color: white; text-align: center; } .search-form-inner input:focus { border-color: transparent; box-shadow: none; outline: none; } @media (max-width: 1024px) { .search-form-inner input { font-size: 38px; } } @media (max-width: 768px) { .search-form-inner input { font-size: 24px; } } /*------------------------------------------------------------------ [Modules] */ .module, .module-sm, .module-xs { background-color: #ffffff; background-size: cover; background-repeat: no-repeat; background-position: 50% 0; position: relative; padding: 140px 0; } .module.divider-top, .module-sm.divider-top, .module-xs.divider-top { border-top: 1px solid #eeeeee; } .module.divider-bottom, .module-sm.divider-bottom, .module-xs.divider-bottom { border-bottom: 1px solid #eeeeee; } .module.parallax, .module-sm.parallax, .module-xs.parallax { background-color: transparent; } .module-sm { padding: 70px 0; } .module-xs { padding: 35px 0; } .module-header { margin: 0 0 70px; } .module-header h1, .module-header .h1, .module-header h2, .module-header .h2, .module-header h3, .module-header .h3, .module-header h4, .module-header .h4, .module-header h5, .module-header .h5, .module-header h6, .module-header .h6 { margin-bottom: 10px; } .no-gutter { margin-right: 0; margin-left: 0; } .no-gutter > [class*="col-"] { padding-left: 0; padding-right: 0; } .pull-image .container { position: relative; } .pull-image .container > div[class*='col-'] { position: absolute; } .pull-image .vertical-middle { position: relative; top: 50%; z-index: 2; -webkit-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0); } .pull-image .pull-image-right { right: 0; } @media (max-width: 990px) { .pull-image .container div[class*='col-'] { position: relative; top: 0; -webkit-transform: none; transform: none; } } .side-background { position: relative; padding: 0px; } .side-background .background-container { position: absolute; overflow: hidden; height: 100%; padding: 0px; top: 0px; } .side-background .background-side { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-size: cover !important; z-index: 0; background-position: 50% 50% !important; } .side-background .background-side.start-top { background-position: 0% 0% !important; } .side-background .background-side.start-bottom { background-position: 100% 0% !important; } .side-background .content-side { padding-top: 140px; padding-bottom: 140px; } /*------------------------------------------------------------------ [Module Hero] */ .module-hero { background-color: #ffffff; background-size: cover; background-repeat: no-repeat; background-position: 50% 0; position: relative; padding: 0; height: 70vh; overflow: hidden; } .module-hero.parallax { background-color: transparent; } .hero-caption { position: relative; display: table; height: 100%; width: 80%; margin: 0 auto; z-index: 2; } .hero-text { position: relative; display: table-cell; vertical-align: middle; height: 100%; } .fullheight { height: 100vh; } /*not sure why this was set so damn high at 240 padding. lowering it a bit */ @media (max-width: 991px) { .module-hero { height: auto; padding: 100px 0; } } .animated-background { -webkit-animation: animated-background 800s linear infinite; animation: animated-background 800s linear infinite; background-repeat: repeat-x !important; } @-webkit-keyframes animated-background { from { background-position: 0 0; } to { background-position: -50000px 0; } } @keyframes animated-background { from { background-position: 0 0; } to { background-position: -50000px 0; } } /*------------------------------------------------------------------ [Backgrounds] */ /* --- [ Backgrounds ] --- */ .bg-white { background-color: #ffffff !important; } .bg-white-dark { background-color: #f8f8f8 !important; } .bg-white-darken { background-color: #f5f5f5 !important; } .bg-gray { background-color: #777777 !important; } .bg-gray-light { background-color: #999999 !important; } .bg-gray-lighter { background-color: #eeeeee !important; } .bg-black { background-color: #000000 !important; } .bg-black-light { background-color: #222222 !important; } .bg-black-lighter { background-color: #333333 !important; } .bg-brand { background-color: #385dc1 !important; } .bg-brand-hvr { background-color: #1fa098 !important; } .bg-facebook { background-color: #3b5998 !important; } .bg-twitter { background-color: #00aced !important; } .bg-google { background-color: #dd4b39 !important; } .bg-linkedin { background-color: #007bb6 !important; } .bg-youtube { background-color: #bb0000 !important; } .bg-instagram { background-color: #517fa4 !important; } .bg-pinterest { background-color: #cb2027 !important; } .bg-flickr { background-color: #ff0084 !important; } .bg-tumblr { background-color: #32506d !important; } .bg-forusquare { background-color: #0072b1 !important; } .bg-dribbble { background-color: #ea4c89 !important; } .bg-vine { background-color: #00bf8f !important; } .bg-skype { background-color: #17a3eb !important; } .bg-wordpress { background-color: #2592c3 !important; } .bg-behance { background-color: #1879fd !important; } .bg-soundcloud { background-color: #ff7e30 !important; } .bg-stumbleupon { background-color: #ff5c30 !important; } .bg-deviantart { background-color: #6a8a7b !important; } .bg-yahoo { background-color: #ab47ac !important; } .bg-digg { background-color: #75788d !important; } .bg-github { background-color: #3f91cb !important; } .bg-lastfm { background-color: #f34320 !important; } .bg-vk { background-color: #2b587a !important; } /* --- [ Alfa backgrounds ] --- */ .bg-black-alfa-5:before, .bg-black-alfa-10:before, .bg-black-alfa-15:before, .bg-black-alfa-20:before, .bg-black-alfa-25:before, .bg-black-alfa-30:before, .bg-black-alfa-35:before, .bg-black-alfa-40:before, .bg-black-alfa-45:before, .bg-black-alfa-50:before, .bg-black-alfa-55:before, .bg-black-alfa-60:before, .bg-black-alfa-65:before, .bg-black-alfa-70:before, .bg-black-alfa-75:before, .bg-black-alfa-80:before, .bg-black-alfa-85:before, .bg-black-alfa-90:before, .bg-black-alfa-95:before { position: absolute; height: 100%; width: 100%; z-index: 0; content: ""; left: 0; top: 0; } .bg-black-alfa-5:before, .bg-black-alfa-10:before, .bg-black-alfa-15:before, .bg-black-alfa-20:before, .bg-black-alfa-25:before, .bg-black-alfa-30:before, .bg-black-alfa-35:before, .bg-black-alfa-40:before, .bg-black-alfa-45:before, .bg-black-alfa-50:before, .bg-black-alfa-55:before, .bg-black-alfa-60:before, .bg-black-alfa-65:before, .bg-black-alfa-70:before, .bg-black-alfa-75:before, .bg-black-alfa-80:before, .bg-black-alfa-85:before, .bg-black-alfa-90:before, .bg-black-alfa-95:before { background: rgba(0, 0, 0, 0.05); } .bg-black-alfa-10:before { background: rgba(0, 0, 0, 0.1); } .bg-black-alfa-15:before { background: rgba(0, 0, 0, 0.15); } .bg-black-alfa-20:before { background: rgba(0, 0, 0, 0.2); } .bg-black-alfa-25:before { background: rgba(0, 0, 0, 0.25); } .bg-black-alfa-30:before { background: rgba(0, 0, 0, 0.3); } .bg-black-alfa-35:before { background: rgba(0, 0, 0, 0.35); } .bg-black-alfa-40:before { background: rgba(0, 0, 0, 0.4); } .bg-black-alfa-45:before { background: rgba(0, 0, 0, 0.45); } .bg-black-alfa-50:before { background: rgba(0, 0, 0, 0.5); } .bg-black-alfa-55:before { background: rgba(0, 0, 0, 0.55); } .bg-black-alfa-60:before { background: rgba(0, 0, 0, 0.6); } .bg-black-alfa-65:before { background: rgba(0, 0, 0, 0.65); } .bg-black-alfa-70:before { background: rgba(0, 0, 0, 0.7); } .bg-black-alfa-75:before { background: rgba(0, 0, 0, 0.75); } .bg-black-alfa-80:before { background: rgba(0, 0, 0, 0.8); } .bg-black-alfa-85:before { background: rgba(0, 0, 0, 0.85); } .bg-black-alfa-90:before { background: rgba(0, 0, 0, 0.9); } .bg-black-alfa-95:before { background: rgba(0, 0, 0, 0.95); } .bg-white-alfa-5:before, .bg-white-alfa-10:before, .bg-white-alfa-15:before, .bg-white-alfa-20:before, .bg-white-alfa-25:before, .bg-white-alfa-30:before, .bg-white-alfa-35:before, .bg-white-alfa-40:before, .bg-white-alfa-45:before, .bg-white-alfa-50:before, .bg-white-alfa-55:before, .bg-white-alfa-60:before, .bg-white-alfa-65:before, .bg-white-alfa-70:before, .bg-white-alfa-75:before, .bg-white-alfa-80:before, .bg-white-alfa-85:before, .bg-white-alfa-90:before, .bg-white-alfa-95:before { position: absolute; height: 100%; width: 100%; z-index: 0; content: ""; left: 0; top: 0; } .bg-white-alfa-5:before, .bg-white-alfa-10:before, .bg-white-alfa-15:before, .bg-white-alfa-20:before, .bg-white-alfa-25:before, .bg-white-alfa-30:before, .bg-white-alfa-35:before, .bg-white-alfa-40:before, .bg-white-alfa-45:before, .bg-white-alfa-50:before, .bg-white-alfa-55:before, .bg-white-alfa-60:before, .bg-white-alfa-65:before, .bg-white-alfa-70:before, .bg-white-alfa-75:before, .bg-white-alfa-80:before, .bg-white-alfa-85:before, .bg-white-alfa-90:before, .bg-white-alfa-95:before { background: rgba(255, 255, 255, 0.05); } .bg-white-alfa-10:before { background: rgba(255, 255, 255, 0.1); } .bg-white-alfa-15:before { background: rgba(255, 255, 255, 0.15); } .bg-white-alfa-20:before { background: rgba(255, 255, 255, 0.2); } .bg-white-alfa-25:before { background: rgba(255, 255, 255, 0.25); } .bg-white-alfa-30:before { background: rgba(255, 255, 255, 0.3); } .bg-white-alfa-35:before { background: rgba(255, 255, 255, 0.35); } .bg-white-alfa-40:before { background: rgba(255, 255, 255, 0.4); } .bg-white-alfa-45:before { background: rgba(255, 255, 255, 0.45); } .bg-white-alfa-50:before { background: rgba(255, 255, 255, 0.5); } .bg-white-alfa-55:before { background: rgba(255, 255, 255, 0.55); } .bg-white-alfa-60:before { background: rgba(255, 255, 255, 0.6); } .bg-white-alfa-65:before { background: rgba(255, 255, 255, 0.65); } .bg-white-alfa-70:before { background: rgba(255, 255, 255, 0.7); } .bg-white-alfa-75:before { background: rgba(255, 255, 255, 0.75); } .bg-white-alfa-80:before { background: rgba(255, 255, 255, 0.8); } .bg-white-alfa-85:before { background: rgba(255, 255, 255, 0.85); } .bg-white-alfa-90:before { background: rgba(255, 255, 255, 0.9); } .bg-white-alfa-95:before { background: rgba(255, 255, 255, 0.95); } .bg-brand-alfa-5:before, .bg-brand-alfa-10:before, .bg-brand-alfa-15:before, .bg-brand-alfa-20:before, .bg-brand-alfa-25:before, .bg-brand-alfa-30:before, .bg-brand-alfa-35:before, .bg-brand-alfa-40:before, .bg-brand-alfa-45:before, .bg-brand-alfa-50:before, .bg-brand-alfa-55:before, .bg-brand-alfa-60:before, .bg-brand-alfa-65:before, .bg-brand-alfa-70:before, .bg-brand-alfa-75:before, .bg-brand-alfa-80:before, .bg-brand-alfa-85:before, .bg-brand-alfa-90:before, .bg-brand-alfa-95:before { position: absolute; height: 100%; width: 100%; z-index: 0; content: ""; left: 0; top: 0; } .bg-brand-alfa-5:before, .bg-brand-alfa-10:before, .bg-brand-alfa-15:before, .bg-brand-alfa-20:before, .bg-brand-alfa-25:before, .bg-brand-alfa-30:before, .bg-brand-alfa-35:before, .bg-brand-alfa-40:before, .bg-brand-alfa-45:before, .bg-brand-alfa-50:before, .bg-brand-alfa-55:before, .bg-brand-alfa-60:before, .bg-brand-alfa-65:before, .bg-brand-alfa-70:before, .bg-brand-alfa-75:before, .bg-brand-alfa-80:before, .bg-brand-alfa-85:before, .bg-brand-alfa-90:before, .bg-brand-alfa-95:before { background: rgba(56, 93, 193, 0.05); } .bg-brand-alfa-10:before { background: rgba(56, 93, 193, 0.1); } .bg-brand-alfa-15:before { background: rgba(56, 93, 193, 0.15); } .bg-brand-alfa-20:before { background: rgba(56, 93, 193, 0.2); } .bg-brand-alfa-25:before { background: rgba(56, 93, 193, 0.25); } .bg-brand-alfa-30:before { background: rgba(56, 93, 193, 0.3); } .bg-brand-alfa-35:before { background: rgba(56, 93, 193, 0.35); } .bg-brand-alfa-40:before { background: rgba(56, 93, 193, 0.4); } .bg-brand-alfa-45:before { background: rgba(56, 93, 193, 0.45); } .bg-brand-alfa-50:before { background: rgba(56, 93, 193, 0.5); } .bg-brand-alfa-55:before { background: rgba(56, 93, 193, 0.55); } .bg-brand-alfa-60:before { background: rgba(56, 93, 193, 0.6); } .bg-brand-alfa-65:before { background: rgba(56, 93, 193, 0.65); } .bg-brand-alfa-70:before { background: rgba(56, 93, 193, 0.7); } .bg-brand-alfa-75:before { background: rgba(56, 93, 193, 0.75); } .bg-brand-alfa-80:before { background: rgba(56, 93, 193, 0.8); } .bg-brand-alfa-85:before { background: rgba(56, 93, 193, 0.85); } .bg-brand-alfa-90:before { background: rgba(56, 93, 193, 0.9); } .bg-brand-alfa-95:before { background: rgba(56, 93, 193, 0.95); } .bg-white-dark-alfa-5:before, .bg-white-dark-alfa-10:before, .bg-white-dark-alfa-15:before, .bg-white-dark-alfa-20:before, .bg-white-dark-alfa-25:before, .bg-white-dark-alfa-30:before, .bg-white-dark-alfa-35:before, .bg-white-dark-alfa-40:before, .bg-white-dark-alfa-45:before, .bg-white-dark-alfa-50:before, .bg-white-dark-alfa-55:before, .bg-white-dark-alfa-60:before, .bg-white-dark-alfa-65:before, .bg-white-dark-alfa-70:before, .bg-white-dark-alfa-75:before, .bg-white-dark-alfa-80:before, .bg-white-dark-alfa-85:before, .bg-white-dark-alfa-90:before, .bg-white-dark-alfa-95:before { position: absolute; height: 100%; width: 100%; z-index: 0; content: ""; left: 0; top: 0; } .bg-white-dark-alfa-5:before, .bg-white-dark-alfa-10:before, .bg-white-dark-alfa-15:before, .bg-white-dark-alfa-20:before, .bg-white-dark-alfa-25:before, .bg-white-dark-alfa-30:before, .bg-white-dark-alfa-35:before, .bg-white-dark-alfa-40:before, .bg-white-dark-alfa-45:before, .bg-white-dark-alfa-50:before, .bg-white-dark-alfa-55:before, .bg-white-dark-alfa-60:before, .bg-white-dark-alfa-65:before, .bg-white-dark-alfa-70:before, .bg-white-dark-alfa-75:before, .bg-white-dark-alfa-80:before, .bg-white-dark-alfa-85:before, .bg-white-dark-alfa-90:before, .bg-white-dark-alfa-95:before { background: rgba(248, 248, 248, 0.05); } .bg-white-dark-alfa-10:before { background: rgba(248, 248, 248, 0.1); } .bg-white-dark-alfa-15:before { background: rgba(248, 248, 248, 0.15); } .bg-white-dark-alfa-20:before { background: rgba(248, 248, 248, 0.2); } .bg-white-dark-alfa-25:before { background: rgba(248, 248, 248, 0.25); } .bg-white-dark-alfa-30:before { background: rgba(248, 248, 248, 0.3); } .bg-white-dark-alfa-35:before { background: rgba(248, 248, 248, 0.35); } .bg-white-dark-alfa-40:before { background: rgba(248, 248, 248, 0.4); } .bg-white-dark-alfa-45:before { background: rgba(248, 248, 248, 0.45); } .bg-white-dark-alfa-50:before { background: rgba(248, 248, 248, 0.5); } .bg-white-dark-alfa-55:before { background: rgba(248, 248, 248, 0.55); } .bg-white-dark-alfa-60:before { background: rgba(248, 248, 248, 0.6); } .bg-white-dark-alfa-65:before { background: rgba(248, 248, 248, 0.65); } .bg-white-dark-alfa-70:before { background: rgba(248, 248, 248, 0.7); } .bg-white-dark-alfa-75:before { background: rgba(248, 248, 248, 0.75); } .bg-white-dark-alfa-80:before { background: rgba(248, 248, 248, 0.8); } .bg-white-dark-alfa-85:before { background: rgba(248, 248, 248, 0.85); } .bg-white-dark-alfa-90:before { background: rgba(248, 248, 248, 0.9); } .bg-white-dark-alfa-95:before { background: rgba(248, 248, 248, 0.95); } /*------------------------------------------------------------------ [Multi-columns-row] */ .multi-columns-row .first-in-row { clear: left; } .multi-columns-row .col-xs-6:nth-child(2n + 3) { clear: left; } .multi-columns-row .col-xs-4:nth-child(3n + 4) { clear: left; } .multi-columns-row .col-xs-3:nth-child(4n + 5) { clear: left; } .multi-columns-row .col-xs-2:nth-child(6n + 7) { clear: left; } .multi-columns-row .col-xs-1:nth-child(12n + 13) { clear: left; } @media (min-width: 768px) { .multi-columns-row .col-xs-6:nth-child(2n + 3) { clear: none; } .multi-columns-row .col-xs-4:nth-child(3n + 4) { clear: none; } .multi-columns-row .col-xs-3:nth-child(4n + 5) { clear: none; } .multi-columns-row .col-xs-2:nth-child(6n + 7) { clear: none; } .multi-columns-row .col-xs-1:nth-child(12n + 13) { clear: none; } .multi-columns-row .col-sm-6:nth-child(2n + 3) { clear: left; } .multi-columns-row .col-sm-4:nth-child(3n + 4) { clear: left; } .multi-columns-row .col-sm-3:nth-child(4n + 5) { clear: left; } .multi-columns-row .col-sm-2:nth-child(6n + 7) { clear: left; } .multi-columns-row .col-sm-1:nth-child(12n + 13) { clear: left; } } @media (min-width: 992px) { .multi-columns-row .col-sm-6:nth-child(2n + 3) { clear: none; } .multi-columns-row .col-sm-4:nth-child(3n + 4) { clear: none; } .multi-columns-row .col-sm-3:nth-child(4n + 5) { clear: none; } .multi-columns-row .col-sm-2:nth-child(6n + 7) { clear: none; } .multi-columns-row .col-sm-1:nth-child(12n + 13) { clear: none; } .multi-columns-row .col-md-6:nth-child(2n + 3) { clear: left; } .multi-columns-row .col-md-4:nth-child(3n + 4) { clear: left; } .multi-columns-row .col-md-3:nth-child(4n + 5) { clear: left; } .multi-columns-row .col-md-2:nth-child(6n + 7) { clear: left; } .multi-columns-row .col-md-1:nth-child(12n + 13) { clear: left; } } @media (min-width: 1200px) { .multi-columns-row .col-md-6:nth-child(2n + 3) { clear: none; } .multi-columns-row .col-md-4:nth-child(3n + 4) { clear: none; } .multi-columns-row .col-md-3:nth-child(4n + 5) { clear: none; } .multi-columns-row .col-md-2:nth-child(6n + 7) { clear: none; } .multi-columns-row .col-md-1:nth-child(12n + 13) { clear: none; } .multi-columns-row .col-lg-6:nth-child(2n + 3) { clear: left; } .multi-columns-row .col-lg-4:nth-child(3n + 4) { clear: left; } .multi-columns-row .col-lg-3:nth-child(4n + 5) { clear: left; } .multi-columns-row .col-lg-2:nth-child(6n + 7) { clear: left; } .multi-columns-row .col-lg-1:nth-child(12n + 13) { clear: left; } } /*------------------------------------------------------------------ [Row as Table] */ .row-height { display: table; table-layout: fixed; height: 100%; width: 100%; margin-left: 0; margin-right: 0; } .col-height { display: table-cell; float: none; height: 100%; } .col-top { vertical-align: top; } .col-middle { vertical-align: middle; } .col-bottom { vertical-align: bottom; } @media (min-width: 480px) { .row-xs-height { display: table; table-layout: fixed; height: 100%; width: 100%; margin-left: 0; margin-right: 0; } .col-xs-height { display: table-cell; float: none; height: 100%; } .col-xs-top { vertical-align: top; } .col-xs-middle { vertical-align: middle; } .col-xs-bottom { vertical-align: bottom; } } @media (min-width: 768px) { .row-sm-height { display: table; table-layout: fixed; height: 100%; width: 100%; margin-left: 0; margin-right: 0; } .col-sm-height { display: table-cell; float: none; height: 100%; } .col-sm-top { vertical-align: top; } .col-sm-middle { vertical-align: middle; } .col-sm-bottom { vertical-align: bottom; } } @media (min-width: 992px) { .row-md-height { display: table; table-layout: fixed; height: 100%; width: 100%; margin-left: 0; margin-right: 0; } .col-md-height { display: table-cell; float: none; height: 100%; } .col-md-top { vertical-align: top; } .col-md-middle { vertical-align: middle; } .col-md-bottom { vertical-align: bottom; } } @media (min-width: 1200px) { .row-lg-height { display: table; table-layout: fixed; height: 100%; width: 100%; margin-left: 0; margin-right: 0; } .col-lg-height { display: table-cell; float: none; height: 100%; } .col-lg-top { vertical-align: top; } .col-lg-middle { vertical-align: middle; } .col-lg-bottom { vertical-align: bottom; } } /*------------------------------------------------------------------ [Pages] */ .career-tags { text-transform: uppercase; letter-spacing: 1px; font-size: 12px; color: #385dc1; list-style: none; padding: 0; } .career-tags > li { display: inline-block; } @media (max-width: 767px) { .page-content + .sidebar, .sidebar + .page-content { margin: 70px 0 0; } } /*------------------------------------------------------------------ [Portfolio] */ .filters { text-align: center; list-style: none; padding: 0; margin: 0; } .filters > li { display: inline-block; padding: 0 15px 35px; } .filters > li > a { border-bottom: 1px solid transparent; text-decoration: none; font-weight: 600; font-size: 14px; color: #333333; padding: 1px 0; opacity: 0.6; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .filters > li > a:hover, .filters > li > a.current { border-color: #333333; opacity: 1; } .works-grid.works-grid-gutter { margin-left: -4px; margin-right: -4px; } .works-grid.works-grid-gutter .work-item { padding: 0 4px 8px 4px; } .works-grid .work-item { width: 50%; } .works-grid.works-grid-3 .work-item { width: 33.333333%; } .works-grid.works-grid-4 .work-item { width: 25%; } .works-grid.works-grid-5 .work-item { width: 20%; } .work-wrapper { position: relative; overflow: hidden; height: 100%; } .work-overlay { border: none; background: rgba(56, 93, 193, 0.8); position: absolute; opacity: 0; z-index: 1; left: 0; top: 0; height: 100%; width: 100%; padding: 0; margin: 0; -webkit-transition: all 0.3s cubic-bezier(0.3, 0.1, 0.58, 1); transition: all 0.3s cubic-bezier(0.3, 0.1, 0.58, 1); } .work-wrapper > img { width: 100%; -webkit-transition: all 0.3s cubic-bezier(0.3, 0.1, 0.58, 1); transition: all 0.3s cubic-bezier(0.3, 0.1, 0.58, 1); } .work-caption { -webkit-transition: all 0.3s cubic-bezier(0.3, 0.1, 0.58, 1); transition: all 0.3s cubic-bezier(0.3, 0.1, 0.58, 1); -webkit-transform: scale(0.8); transform: scale(0.8); position: absolute; padding: 40px; width: 100%; opacity: 0; bottom: 0; } .work-title, .work-category { color: #ffffff; } .work-title { text-transform: uppercase; letter-spacing: 1px; font-weight: 700; margin: 0; } .work-category { text-transform: lowercase; font-style: italic; font-size: 13px; opacity: 0.7; } .work-link { position: absolute; bottom: 0; right: 0; left: 0; top: 0; z-index: 2; } /* --- [ Base Hover ] --- */ .work-item:hover .work-wrapper img { -webkit-transform: scale(1.1); transform: scale(1.1); } .work-item:hover .work-overlay { opacity: 1; } .work-item:hover .work-caption { -webkit-transform: scale(1); transform: scale(1); opacity: 1; } /* --- [ Dark Hover Overlay ] --- */ .works-grid-dark .work-overlay { background: rgba(51, 51, 51, 0.9); } /* --- [ White Hover Overlay ] --- */ .works-grid-white .work-overlay { background: rgba(255, 255, 255, 0.9); } .works-grid-white .work-title, .works-grid-white .work-category { color: #222222; } @media (max-width: 1023px) { .works-grid .work-item, .works-grid.works-grid-3 .work-item, .works-grid.works-grid-4 .work-item, .works-grid.works-grid-5 .work-item { width: 50%; } } @media (max-width: 568px) { .works-grid .work-item, .works-grid.works-grid-3 .work-item, .works-grid.works-grid-4 .work-item, .works-grid.works-grid-5 .work-item { width: 100%; } } .portfolio-info { list-style: none; padding: 0; margin: 0 0 35px; } .portfolio-info > li:not(:last-child) { border-bottom: 1px solid #eee; padding: 0 0 8px; margin: 0 0 8px; } .portfolio-info h5 { display: inline-block; margin: 0 8px 0 0; } .portfolio-info .social-icons { display: inline-block; } /*------------------------------------------------------------------ [Guides / Install section (formerly blog from template) */ .post { margin: 0 0 30px; } .post .post-title { font-size: 23px; margin-bottom: 0px; } @media screen and (max-width:425px) { .post .post-title { font-size:18px; } } .post .post-title a i { padding-right: 15px; } .post .post-content { padding: 30px 0 0 0; } .post.format-quote .post-content { padding: 30px 25px; } .post:nth-child(4) { margin: 0 0 50px 0; } @media screen and (max-width:425px) { .guide-list { display: none; } } .post-content h2, .post-content h3, .post-content h4 { margin-top: 30px; margin-bottom: 5px; } .guide-section-title { font-size: 20px; color: #222222; padding-left: 0; border-bottom: none !important; } .guide-block:hover i { border-color: #385dc1; color: #385dc1; } .guide-block:hover h2 { border-color: #385dc1; color: #385dc1; } .os-install { border: 1px solid #333; padding: 20px 15px 0 15px; } .os-install:hover { border-color: #385dc1; } .os-install i { color: #555; } /* .os-install i:hover { color: #385dc1; }*/ .os-install h2 { font-size: 12px; color: #555; padding-top: 15px; text-transform: uppercase; letter-spacing: 1.4px; } .os-install h2:hover { color: #385dc1; } /* --- [Post Meta] --- */ .post-meta { list-style: none; margin: 0 0 5px; padding: 0; } .post-meta > li { display: inline-block; text-transform: uppercase; letter-spacing: 1px; font-weight: 700; font-size: 11px; color: #999; } .post-meta > li + li:before { content: "/\00a0"; padding: 0 5px; } /* --- [Post Columns] --- */ .post-columns .post { background: #f8f8f8; margin: 0 0 30px; } .post-columns .post .post-title { font-size: 20px; } .post-columns .post .post-content { padding: 30px 25px; } .post-columns .post .post-content > *:last-child { margin-bottom: 0; } /* --- [Post Thumbnail] --- */ .post-thumbnail .post-content { padding: 0; } @media (max-width: 767px) { .post-thumbnail .post-content { padding: 30px 0 0; } } /* --- [Posts Formats] --- */ .post.format-quote, .post.format-quote blockquote { background: #385dc1; color: #ffffff; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; padding: 0px; } .post.format-quote:hover, .post.format-quote blockquote:hover { opacity: 0.9; } .post.format-quote blockquote { font-style: normal; font-size: 17px; padding: 30px 25px; } .post.format-quote blockquote footer, .post.format-quote blockquote small, .post.format-quote blockquote .small { color: #ffffff; font-weight: 600; } .post.format-quote blockquote footer:before, .post.format-quote blockquote small:before, .post.format-quote blockquote .small:before { content: none; } .post.format-quote blockquote :before { font-family: 'FontAwesome'; font-size: 24px; display: block; content: "\f10e"; margin: 0 0 20px; } .title-link { display: inline-block !important; padding-left: 20px; text-transform: lowercase; letter-spacing: 0px; font-family: "Open Sans"; color: #385dc1; } .hero-link { padding: 20px 0 40px 0; } a.hero-link:after { content: "" !important; } .no-hover:hover { width:100% !important; } /* --- [Tags] --- */ .tags a { background: #f8f8f8; display: inline-block; border-radius: 2px; padding: 8px 12px; margin: 0 0 6px; font-size: 11px; color: #777777; } .tags a:hover, .tags a:focus { background: #385dc1; color: #ffffff; } /* --- [Comments] --- */ .comments .bottom-line:after, .comment-form .bottom-line:after { margin-bottom: 35px; } .comments, .comment-form { margin-bottom: 70px; } .comment:last-child .comment-content { margin-bottom: 0; } .comment, .comment-content { position: relative; } .comment:before, .comment:after, .comment-content:before, .comment-content:after { content: " "; /*display: table; Disabled for CODE BOX */ } .comment:after, .comment-content:after { clear: both; } .comment-avatar { position: relative; max-width: 70px; margin: 5px 0 0; float: left; z-index: 1; } .comment-avatar:after { position: absolute; background: #f5f5f5; content: ""; height: 2px; width: 20px; top: 34px; left: 70px; z-index: -1; } .comment-avatar img { width: 70px; height: 70px; border-radius: 50%; } .comment-content { position: relative; background: #f5f5f5; border-radius: 2px; margin: 0 0 35px 90px; padding: 30px; } .comment-meta { font-size: 12px; opacity: 0.7; } .comment-content > *:last-child { margin-bottom: 0; } .comment-tools { position: absolute; padding: 0 30px; z-index: 1; top: 25px; right: 0; } .comment-tools a { color: #999999; margin: 0 0 0 15px; } .comment-tools a:hover, .comment-tools a:focus { color: #385dc1; } @media (min-width: 768px) { .comment-reply { margin-left: 90px; } } @media (max-width: 767px) { .blog-content + .sidebar, .sidebar + .blog-content { margin: 70px 0 0; } } /*------------------------------------------------------------------ [Shop] */ .product-slider { padding-right: 100px; } .product-slider .item img { display: block; width: 100%; height: auto; } .product-slider .owl-controls { position: absolute; right: 0; top: 0; width: 90px; } .product-slider .owl-controls .item-link { position: relative; display: block; width: 90px; height: 90px; margin: 0 2px; outline: none; opacity: 0.6; } @media (max-width: 767px) { .product-slider { padding: 0 0 30px; } .product-slider .owl-controls { position: static; text-align: left; width: auto; margin: 5px 0 0; } .product-slider .owl-controls .owl-pagination { text-align: left; } .product-slider .owl-controls .item-link { font-size: 0; margin: 0 5px 0 0; } } .product-slider .owl-controls .item-link:focus { outline: none; } .product-slider .owl-controls .active .item-link { opacity: 1; } .product-slider .owl-pagination, .product-slider .owl-controls .owl-page { margin: 0; } .product-slider .owl-controls .owl-page span { display: none; } .product-description .star-rating { margin-right: 15px; } .sale-text { text-decoration: line-through; display: inline-block; margin-right: 20px; opacity: 0.2; } /*------------------------------------------------------------------ [Stars Rating] */ .star-rating { font-family: FontAwesome; color: #385dc1; } .star-rating-1:after { content: "\f005\20\f006\20\f006\20\f006\20\f006"; } .star-rating-2:after { content: "\f005\20\f005\20\f006\20\f006\20\f006"; } .star-rating-3:after { content: "\f005\20\f005\20\f005\20\f006\20\f006"; } .star-rating-4:after { content: "\f005\20\f005\20\f005\20\f005\20\f006"; } .star-rating-5:after { content: "\f005\20\f005\20\f005\20\f005\20\f005"; } /*------------------------------------------------------------------ [Reviews] */ .reviews .comment-content { margin-left: 0; } .reviews .comment-content p { margin-bottom: 10px; } /*------------------------------------------------------------------ [Shop Cart] */ .coupon { border-top: 1px solid #eeeeee; padding: 20px; } .cart-with-coupon { border: 1px solid #eeeeee; border-radius: 2px; margin: 0 0 50px; } .cart-table { margin: 0; } .cart-table > thead > tr > th, .cart-table > tbody > tr > th, .cart-table > tfoot > tr > th, .cart-table > thead > tr > td, .cart-table > tbody > tr > td, .cart-table > tfoot > tr > td { vertical-align: middle; padding: 20px; } .cart-table .col-trash { padding-left: 40px; text-align: center; } .cart-table .cart-thumbnail { max-width: 90px; } .cart-table .col-quantity .form-control { display: inline-block; text-align: center; max-width: 60px; padding: 0 0 0 12px; } .cart-table .col-remove { width: 75px; } .cart-table .col-thumbnail { width: 130px; } .cart-table .col-price, .cart-table .col-subtotal, .cart-table .col-quantity { text-align: center; } .payment { border: 1px solid #eeeeee; border-radius: 2px; margin: 0 0 25px; } .payment-table { border: 0; margin: 0; } .payment-table > tbody > tr > td { border: 0; border-top: 1px solid #eeeeee; padding: 20px; } .payment-table > tbody > tr:first-child > td { border: 0; } .totals { border: 1px solid #eeeeee; border-radius: 2px; margin: 0 0 25px; } .totals .total, .totals .subtotal { padding: 20px; } .totals .total > .row:not(:last-child), .totals .subtotal > .row:not(:last-child) { margin-bottom: 20px; } .totals .total { border-top: 1px solid #eeeeee; } .totals-table { border: 0; margin: 0; } .totals-table > tbody > tr > td { padding: 0px 20px 20px; border: 0; } .totals-table > tbody > tr:first-child > td { padding: 20px; } .totals-table > tbody > tr:last-child > td { border-top: 1px solid #eeeeee; padding: 20px; } /*------------------------------------------------------------------ [Shop Grid Items] */ .shop-filters { border-bottom: 2px solid #f5f5f5; padding: 0 0 35px; margin: 0 0 35px; } .shop-item { margin: 0 0 35px; } .shop-item-title { text-align: center; } .shop-item-title h5 { margin-bottom: 10px; } .shop-item-title h5:last-child { margin-bottom: 0; } .shop-item-photo { position: relative; overflow: hidden; margin-bottom: 20px; } .shop-item-photo img { width: 100%; } .shop-item-photo:after { background: transparent; position: absolute; display: block; content: " "; height: 100%; width: 100%; top: 0; left: 0; z-index: 1; -webkit-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; } .shop-item-tools { position: absolute; padding: 20px; height: 100%; width: 100%; left: 0; top: 0; opacity: 0; z-index: 2; -webkit-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; } .shop-item-tools > div { display: table; height: 100%; width: 100%; } .shop-item-tools > div > div { vertical-align: middle; display: table-cell; text-align: center; } .shop-item-tools a { border: 2px solid #fff; border-radius: 2px; display: inline-block; text-align: center; line-height: 36px; font-size: 18px; height: 40px; width: 40px; color: #fff; margin: 0 5px; } .shop-item-tools a:hover, .shop-item-tools a:focus { opacity: 0.7; } .shop-item:hover .shop-item-photo:after { background: rgba(56, 93, 193, 0.8); } .shop-item:hover .shop-item-tools { opacity: 1; } /*------------------------------------------------------------------ [Widgets] */ .widget { margin: 0 0 40px; } .widget > *:last-child { margin-bottom: 0; } /* --- [ Recent Posts Widget ] --- */ .widget .recent-posts { list-style: none; padding: 0; margin: 0; } .widget .recent-posts > li { border-top: 1px solid #eee; padding: 10px 0; } .widget .recent-posts > li:before, .widget .recent-posts > li:after { content: " "; display: table; } .widget .recent-posts > li:after { clear: both; } .widget .recent-posts > li:first-child { border: 0; padding-top: 0; } .widget .recent-posts a { text-decoration: none; } .widget .recent-posts a:hover, .widget .recent-posts a:focus { opacity: 0.7; } .widget-posts-image { float: left; width: 44px; } .widget-posts-body { margin-left: 58px; } .widget-posts-title { margin: 2px 0; } .widget-posts-meta { font-size: 11px; opacity: 0.7; } /* --- [ Twitter Feed Widget ] --- */ .twitter-feed ul { list-style: none; padding: 0; margin: 0; } .twitter-feed ul li:before { position: relative; top: 6px; float: left; display: inline-block; content: "\f099"; font-family: 'FontAwesome'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; font-size: 13px; } .twitter-feed .user, .twitter-feed .timePosted, .twitter-feed .interact { display: none; } .twitter-feed p { position: relative; padding-left: 20px; } /* --- [ Category Widget ] --- */ .icons-list { list-style: none; padding: 0; margin: 0; } .icons-list > li { border-top: 1px solid #eee; padding: 10px 0; } .icons-list > li:first-child { border: 0; padding-top: 0; } .icons-list a { color: #999999; } .icons-list a:hover, .icons-list a:focus { color: #385dc1; } .icons-list a > .fa, .icons-list a > .icons { padding-left: 5px; } /* --- [ Widget ] --- */ .widget address { line-height: 1.8; } address.map-background { background: url("../images/map.png") no-repeat left; } .links-list { list-style: none; padding: 0; margin: 0; } .links-list > li { margin: 0 0 15px; } .links-list > li a { text-decoration: none; } .widget .links-list a:hover { opacity: 0.7; } /* --- [ Top Rated Widget ] --- */ .widget .top-rated { list-style: none; padding: 0; margin: 0; } .widget .top-rated > li { border-top: 1px solid #eee; padding: 10px 0; display: table; width: 100%; } .widget .top-rated > li:first-child { padding-top: 0; border: 0; } .widget .top-rated .top-rated-body, .widget .top-rated .top-rated-image { display: table-cell; vertical-align: middle; } .widget .top-rated .top-rated-body { padding: 0 0 0 14px; } .widget .top-rated .top-rated-image { width: 70px; } /*------------------------------------------------------------------ [Gallery] */ .gallery { margin-left: -4px; margin-right: -4px; } .gallery .gallery-item { -webkit-transition: all 0.3s cubic-bezier(0.3, 0.1, 0.58, 1); transition: all 0.3s cubic-bezier(0.3, 0.1, 0.58, 1); padding: 0 4px 8px 4px; width: 50%; } .gallery .gallery-item.gallery-item-big { width: 100% !important; } .gallery .gallery-item:hover { opacity: 0.7; } .gallery.gallery-3 .gallery-item { width: 33.333%; } .gallery.gallery-4 .gallery-item { width: 25%; } .gallery.gallery-6 .gallery-item { width: 16.66666667%; } /*------------------------------------------------------------------ [Footer] */ .footer { background-color: #222222; background-size: cover; background-repeat: no-repeat; background-position: 50% 0; position: relative; padding: 70px 0 0; } .footer .widget-title { border-color: #333333; } .footer .copyright { border-top: 1px solid #333333; padding: 20px 0; margin: 35px 0 0; } .footer .subfooter { border-top: 1px solid #ffffff; padding-top: 70px; margin-top: 70px; } .footer .bottom-line:before { border-bottom: 2px solid #333333; } .footer .widget .recent-posts > li { border-color: #333333; } .footer.parallax { background-color: transparent; } .footer * { color: #ffffff; } .footer a { text-decoration: underline; } .footer a:hover, .footer a:focus { text-decoration: none; color: inherit; } .scroll-top { border-radius: 2px; border: 2px solid #ffffff; padding: 6px 13px; font-size: 18px; opacity: 0.5; } .footer .list-inline { margin-left: -15px; } .footer .list-inline > li { padding-left: 15px; padding-right: 15px; } .footer .list-inline > li a { text-decoration: none; } .footer-minimal { padding: 140px 0; } @media (max-width: 767px) { .footer .scroll-top { display: none; } }