img, iframe {max-width: 100%; height: auto} html,body{-webkit-text-size-adjust:100%;text-size-adjust:100%} *{scroll-behavior:smooth} body { font-family: 'Fira Sans',candara, sans-serif; font-size: 16px; background-color: #061d3b; color: #4b4b4b; line-height: 1.6; text-align: center; min-width: 320px } h1, h2, h3, h4, h5, h6, p, th, td, dd, dt, li, blockquote { text-align: left; } body, header ul, .subnav ul, .pro ul, footer .grid ul { padding: 0; margin: 0; } img, iframe { max-width: 100%; height: auto; display: block; margin: 0 auto } a img, iframe { border: none; } a, header a:hover, .cta a:hover, .schedule a:hover, .news strong, .counter i, .counter strong, .careers a:hover, .pro > div a:hover span, .industry a:hover span, .more li i, .plans i, .solutions a:hover h2, .footnav a:hover p, footer a:hover, .subfoot a:hover, .community a:hover { text-decoration: none; color: #ff7d09; transition: ease-out .3s; } a:hover { text-decoration: underline; transition: ease-in .3s; } .subnav a:hover, .sidebar a:hover, .about a:hover, .why a:hover, .news a:hover, .btn:hover, .contact #tabs .menu li a, .more a:hover, .team a:hover, .ready a:hover, .pro > div a:hover, .industry a:hover, .solutions a:hover, .articles h2 a:hover, .footnav a:hover, footer a:hover { text-decoration: none; } hr { border-width: 1px; border-color: #eee; border-style: none none solid; margin: 30px 0; } .imgLeft, .imgRight { max-width: 50%; } .imgLeft { float: left; margin: 10px 4% 2% 0; } .imgCenter { display: block; margin: 0 auto; } .imgRight { float: right; margin: 10px 0 2% 4%; } .clear { clear: both; } .nowrap { white-space: nowrap; } .hide { display: none !important; } .center { text-align: center; } .container { background-color: #fff; padding-top: 126px; } .wrap { display: block; max-width: 1200px; margin: 0 auto; position: relative; } .table { display: table; width: 100%; } .table > div { display: table-cell; vertical-align: top; } .table.half > div, .top ul { width: calc(100% / 2); } .table.half > div:first-of-type { padding-right: 4%; } .table.half > div:last-of-type { padding-left: 4%; } .table.third > div { width: calc(100% / 3); } .table.third > div:nth-of-type(1) { padding-right: 4%; } .table.third > div:nth-of-type(2) { padding-left: 2%; padding-right: 2% } .table.third > div:nth-of-type(3) { padding-left: 4%; } .table.quad > div, .industry .table > div { width: calc(100% / 4); } .table.quint > div { width: calc(100% / 5); } .grid { display: grid; grid-gap: 10px; position: relative } .grid.half { grid-template-columns: repeat(2,1fr) } .grid.third { grid-template-columns: repeat(3,1fr) } .grid.quad { grid-template-columns: repeat(4,1fr) } .flex { display: flex; flex-wrap: wrap } .flex > * { flex: 1; } .flex.quint > * { min-width: 200px } .flex.quad > * { min-width: 250px } .flex.third > * { min-width: 301px } .flex.flex-gap { margin: -10px 0 0 -10px; width: calc(100% + 10px) } .flex.flex-gap > * { margin: 10px 0 0 10px; } header .table > div, .table.mid > div, .about .table > div, .why .table > div, .partners img, .more .table > div, .more i, .support i, .quote .wrap > .table > div { vertical-align: middle; } .top ul, .top li, nav li, .partners img, .contact #tabs .menu li, .subfoot li, .schedule a, .schedule h2 { display: inline-block; } header { position: fixed; width: 100%; background-color: #fff; box-shadow: 0 0 10px rgba(0,0,0,.1); z-index: 999; } header .protelesislogo img { width: 250px; height: 68px; display: block; margin: 0 auto } .top { font-size: 0; background-color: #061d3b; } .top a { font-size: 14px; color: #fff; padding: 8px } .top ul:last-of-type { text-transform: uppercase; } .top ul:first-of-type, header table > div:first-of-type { text-align: left; } .top ul:last-of-type, header .table > div:last-of-type { text-align: right; } header .table > div:first-of-type { width: 270px; } header .table > div:last-of-type { width: calc(100% - 270px); } header a, .subnav a { display: block; } header a { padding: 10px; } nav { font-weight: bold; margin: 8px 0 } nav a, nav ul ul li { display: block; } nav a { color: #4b4b4b; padding: 4px 0; margin: 0 15px; border-bottom: 3px solid transparent; } nav a:hover { border-bottom: 3px solid #ff7d09; } nav i { margin-left: 5px; } nav ul ul { display: none; font-size: 14px; font-weight: normal; background-color: #122f59; position: absolute; top: 62px; box-shadow: 0 0 10px rgba(0,0,0,.1); } nav ul ul li:first-of-type > a { border-top: 3px solid #ff7d09; } nav ul ul a { color: #fff; padding: 10px 40px; margin: 0; } nav ul ul a, nav ul ul a:hover { border: none; } nav ul ul ul { min-width: 323px; top: 0; left: -323px; } nav li:hover > ul { display: block; } .subnav { background-color: #f2f2f2; padding: 40px 0; } section .subnav + .wrap { padding-top: 40px } .subnav ul { display: flex; flex-wrap: wrap; padding: 0 5px } .subnav li { font-weight: 600; margin: 5px; list-style: none; flex: 1 } .subnav a { text-align: center; padding: 10px 20px; border: 1px solid #ddd; white-space: nowrap } .subnav a:hover { background-color: #fff; } .cycle-slideshow .wrap, .banner .wrap { top: 50%; transform: translateY(-50%); } .cycle-slideshow .slide, .banner, .cta, .counter, .team a, .careers, .ready, .pro > div > div, .industry > div > div, .footnav .table > div { background-size: cover; background-position: center; } .cycle-slideshow .overlay, .banner .overlay { background-color: rgba(21,93,149,.3); } .cycle-slideshow, .banner .overlay { height: 60vw; min-height: 350px; } .cycle-slideshow { max-height: 400px; } .cycle-slideshow .overlay { height: 100%; padding: 20px 0 } .cycle-slideshow { position: relative; overflow: hidden; } .cycle-slideshow .slide, .banner strong { display: block; } .cycle-slideshow .slide { width: 100%; height: 100%; } .cycle-slideshow h1, .cycle-slideshow p, .banner p { text-align: center; color: #fff; } .cycle-slideshow h1 { margin: 0; line-height: 1.2 } .cycle-slideshow h1, .banner strong { font-size: 54px; } .cycle-slideshow p, .banner p { width: 90%; font-size: 25px; font-weight: 600; margin: 0 auto; line-height: 1.2 } .cycle-slideshow strong { text-transform: uppercase; } .cycle-prev, .cycle-next { position: absolute; top: 0; width: 5%; z-index: 888; height: 100%; cursor: pointer; background-position: 50% 50%; background-repeat: no-repeat; opacity: .1; } .cycle-prev { left: 0; background-image: url(/images-design/arrow-prev.png); } .cycle-next { right: 0; background-image: url(/images-design/arrow-next.png); } .cycle-prev:hover, .cycle-next:hover { opacity: .3; transition: all .3s linear .01s; } .slide.one > img { object-position: top; } .banner { background-image: url(/images-design/banners/default.jpg); } .banner .overlay { max-height: 400px; } .about, .testimonials, .news { padding: 0 0 50px; } .about h1, .about a h2, .about a p, .why h2, .why h3, .why p, .testimonials h2, .testimonials p, .partners h2, .counter p, .more .table > div:last-of-type h2, .more .table > div > div p { text-align: center; } .about .table > div, .more .table > div { vertical-align: top } .about .table > div:first-of-type, .more .table > div:first-of-type { width: calc(100% - 440px); padding-right: 40px; } .about .table > div:last-of-type, .more .table > div:last-of-type { width: 400px; } .about a h2, .why h3 { font-size: 25px; } .about a h2 { margin-bottom: 10px; } .about a p { margin-top: 0; } .about a, .why a, .news .table a, .counter strong { display: block; } .about a, .why a, .news .table a, .more .table div > div { background-color: #f2f2f2; color: #4b4b4b; } .about a, .more .table div > div { padding: 20px 30px; } .about a i, .about strong, .why i, .more .fa-diamond { color: #ff7d09; } .schedule, .why .table > div:nth-of-type(2) a, .testimonials { background-color: #122f59; } .schedule h2, .why .table > div:nth-of-type(2) h3, .why .table > div:nth-of-type(2) p, .why .table > div:nth-of-type(2) i, .testimonials h2, .testimonials p, .counter p { color: #fff; } .schedule { padding: 70px 0; } .schedule h2, .why h2, .testimonials h2, .partners h2 { font-size: 30px; } .why h3, .pro li { margin: 0; } .schedule a, .counter p { text-transform: uppercase; } .schedule a { background-color: #fff; color: #4b4b4b; padding: 10px 50px; margin: 15px 40px; } .schedule h2 { margin: 15px 0; text-align: center } .schedule a, .schedule h2 { vertical-align: middle } .schedule .grid { grid-template-columns: 1fr 150px } .why { padding: 40px 0 80px; } .why a { min-height: 275px; padding: 20px 40px; } .why i { margin-bottom: 20px; } .why h3 { line-height: 1.2; color: #333c4e; } .why .table > div { padding: 0 !important; } .why .table > div:nth-of-type(1), .why .table > div:nth-of-type(3) { width: 31%; } .why .table > div:nth-of-type(2) { width: 38%; } .testimonials .cycle-slideshow { margin-bottom: 40px; } .testimonials .cycle-slideshow p:last-of-type { font-size: 18px; color: #7e8890; } .testimonials img { max-width: 150px; border-radius: 100px; } .testimonials p { font-size: 16px; font-weight: 400; margin: 20px auto; } .testimonials strong { text-transform: none; } .news .homeblogs { margin-top: 20px; } .news .table a { min-height: 500px; } .news .table a img { margin-bottom: 20px; } .news .table p { padding: 0 40px; } .news .homeblogs div.post { display: inline-block; width: calc(90% / 3); vertical-align: top; min-height: 625px; background-color: #f2f2f2; margin: 10px; padding: 10px 0; } .news .homeblogs > div.post:nth-of-type(1) { padding-right: 20px; } .news .homeblogs > div.post:nth-of-type(2) { padding: 0 10px; } .news .homeblogs > div.post:nth-of-type(3) { padding-left: 20px; } .partners { padding-bottom: 40px; } .partners .carousel { height: 90px; overflow: hidden } .partners h2:after { top: 60px; } .partners img { max-width: 200px; max-height: 50px; margin: 20px 40px; } .counter { padding: 120px 0; background-blend-mode: overlay; background-color: rgba(21,93,149,.3); } .counter i { font-size: 90px; } .counter p { font-size: 18px; font-weight: bold; line-height: 1.4; margin-top: 0; } .counter strong { font-size: 50px; } .counter .quad > div { background-color: rgba(255,255,255,.2); } .counter .quad > div > div { padding: 30px 0 20px; } h1, h2, h3, h4, h5, h6, p { padding-left: 10px; padding-right: 10px } section { padding: 40px 0 50px; min-height: 610px; } section h1, .partners h2 { position: relative; } section h1, .contact h2 { font-size: 25px; } section h1 { text-align: center; color: #333c4e; position: relative; margin-bottom: 50px; } section h1 span { display: block; font-size: 18px; font-weight: 400; margin-top: 15px; } section h1:after, .partners h2:after, .about h2:after { position: absolute; content: ""; width: 200px; height: 1px; background-color: #ffb321; left: 50%; transform: translateX(-50%); top: 40px; } section ul, section ol { padding-left: 25px; padding-right: 10px } section li { margin: 5px 0; } section table { width: 100%; border-collapse: collapse; border-spacing: 0; } section table th, section table td { padding: 10px 20px; border: 1px solid #eee; } section table tr:nth-of-type(odd) { background-color: #fff } section table tr:nth-of-type(even) { background-color: #fafafa; } .nolist, .contact ul, .sidebar ul, .support .links ul, .pro ul, .quote ul, .blogsidebar ul, footer ul { list-style: none; padding-left: 10px; } .btn { display: inline-block; text-align: center; margin-top: 20px; } .margin50 { margin: 50px auto; } .grey, .perks > div > div { background-color: #f2f2f2; } .grey, .process { padding: 40px 0; } .grey, .perks > div, .contact ul, .process .table { margin: 40px 0; } .overlay { background-color: rgba(0,0,0,.5); } .grey .contact h2, .grey .contact p, .mission h3, .mission p, .team h2, .perks h2, .careers h2, .process h2, .process p, .ready h2, .ready p, .support .links h2, .pro h2, .industry h2, .pro h3, .pro li, .pro p, .industry h3, .industry p, .features h2, .features p, .text h3, .text p { text-align: center; } .more h2 { font-size: 20px; } .more a, .team a, .team span, .process strong, .ready a, .support .links a, .pro a, .industry a, .features strong, .text span { display: block; } .more a, .team a:hover h2, .ready h2, .ready p { color: #fff; } .more a { font-size: 20px; font-weight: 600; background-color: #464d5f; padding: 10px 0; margin-top: 30px; } .more .fa-phone { margin-right: 5px; } .more a:hover { background-color: #3781ba; } .mission { margin: 50px 0; } .mission .table:last-of-type { margin-top: 30px; } .mission i, .perks i, .features i, .text h3, .text p, .articles h2 a:hover { color: #3781ba; } .mission i { font-size: 100px; } .team { margin-top: 40px; grid-template-columns: repeat(4,1fr); grid-gap: 20px } .team h2 { font-size: 18px; color: transparent; padding: 65px 0 55px; margin: 0; transition: ease-out .3s; } .team a { position: relative; border: 1px solid #efefef } .team a:hover h2 { background-color: rgba(21,93,149,.7); transition: ease-in .3s; } .team .alfredot { background-image: url(/images-content/team/alfredo-torres.jpg); } .team .allenh { background-image: url(/images-content/team/allen-hebron.jpg); } .team .amberi { background-image: url(/images-content/team/amber-islas.jpg); } .team .avinashk { background-image: url(/images-content/team/avinash-kumar.jpg); } .team .billm { background-image: url(/images-content/team/bill-markow.jpg); } .team .blanc { background-image: url(/images-content/team/blan-cox.jpg); } .team .breah { background-image: url(/images-content/team/brea-hronek.jpg); } .team .butchb { background-image: url(/images-content/team/butch-brown.jpg); } .team .chrisf { background-image: url(/images-content/team/chris-fairchild.jpg); } .team .chrisp { background-image: url(/images-content/team/chris-promotico.jpg); } .team .christophp { background-image: url(/images-content/team/christoph-pluchar.jpg); } .team .collinb { background-image: url(/images-content/team/collin-bourgeois.jpg); } .team .danh { background-image: url(/images-content/team/dan-helvering.jpg); } .team .danielf { background-image: url(/images-content/team/daniel-fowler.jpg); } .team .davem { background-image: url(/images-content/team/dave-muscio.jpg); } .team .davidk { background-image: url(/images-content/team/david-krietberg.jpg); } .team .ericf { background-image: url(/images-content/team/eric-fowler.jpg); } .team .erics { background-image: url(/images-content/team/eric-seagondollar.jpg); } .team .erikl { background-image: url(/images-content/team/erik-larsen.jpg); } .team .frankr { background-image: url(/images-content/team/frank-rivera.jpg); } .team .gigit { background-image: url(/images-content/team/gigi-torres.jpg); } .team .grantk { background-image: url(/images-content/team/grant-kuhn.jpg); } .team .hansrajp { background-image: url(/images-content/team/hansraj-patil.jpg); } .team .honoratoc { background-image: url(/images-content/team/honorato-castillo.jpg); } .team .jimw { background-image: url(/images-content/team/jim-wilcox.jpg); } .team .joes { background-image: url(/images-content/team/joe-suttle.jpg); } .team .johnw { background-image: url(/images-content/team/john-wicks.jpg); } .team .kenb { background-image: url(/images-content/team/ken-bleecher.jpg); } .team .lingeswaranp { background-image: url(/images-content/team/lingeswaran-paramasivam.jpg); } .team .martyp { background-image: url(/images-content/team/marty-paris.jpg); } .team .michellet { background-image: url(/images-content/team/michelle-thille.jpg); } .team .mikea { background-image: url(/images-content/team/mike-amerman.jpg); } .team .mikep { background-image: url(/images-content/team/mike-promotico.jpg); } .team .noahs { background-image: url(/images-content/team/noah-southall.jpg); } .team .olivera { background-image: url(/images-content/team/oliver-arbuthnot.jpg); } .team .omarc { background-image: url(/images-content/team/omar-chavez.jpg); } .team .rwallin { background-image: url(/images-content/team/placeholder-male.png); } .team .phf { background-image: url(/images-content/team/placeholder-female.png); } .team .phm { background-image: url(/images-content/team/placeholder-male.png); } .team .russm { background-image: url(/images-content/team/russ-moreland.jpg); } .team .scotts { background-image: url(/images-content/team/scott-strochak.jpg); } .team .shannonm { background-image: url(/images-content/team/shannon-martin.jpg); } .team .shawnah { background-image: url(/images-content/team/shawna-hagg.jpg); } .team .willt { background-image: url(/images-content/team/will-traenkle.jpg); } .opportunities { padding: 50px 0; margin: 50px 0 0 0; } blockquote { width: auto; margin: 40px 0; padding: 0 20px; } blockquote:nth-of-type(odd) { border-left: 4px solid #ff7d09; } blockquote:nth-of-type(even) { border-right: 4px solid #ff7d09; } cite { display: block; text-align: right; } .perks { padding: 50px 0 40px; } .perks > div > div { padding: 40px 0 20px; } .ready { background-image: url(/images-design/bg-ready.jpg); } .ready .overlay { background-color: rgba(21,93,149,.4); } .ready a { padding: 60px 0 80px; } .ready h2, .careers h2, .pro h2, .industry h2, .cta h2, .features h2, .procloud span, .plans h2 { font-size: 30px; } .process i, .careers h2, .careers p, .careers a, .pro > div a, .industry a, .pro > div a { color: #fff; } .process i { background-color: #ffa737; padding: 20px 11px; border: 2px solid #eee; border-radius: 100px; z-index: 888; } .process i, .process .table { position: relative; } .process .quad:before { content: ""; width: calc(100% - 240px); height: 1px; background-color: #eee; position: absolute; top: 50px; left: 120px; z-index: 777; } .careers { margin-bottom: 20px; } .careers h3 { font-size: 20px; } .careers .grid { grid-gap: 0; padding: 0 5px } .careers .grid a { display: block; margin: 10px; padding: 0 30px 20px; border: 3px solid #ffa737; } .careers .grid p { margin: 0; } .solutions { margin: 40px 0; } .solutions a { display: block; color: #4b4b4b; } .solutions img { width: 100%; height: 200px; object-fit: cover; } .solutions h2, .solutions p { text-align: center; } .solutions h2 { font-size: 20px; line-height: 1.4; margin-top: 0; } .pro, .industry { margin-top: 60px; } .pro a, .industry a, .footnav a { background-color: rgba(18,47,89,.5); } .technology a { min-height: 292px; } .pro h3, .industry h3, .features strong, .footnav h2 { font-size: 24px; position: relative; } .pro h3:after, .industry h3:after, .footnav h2:after { content: ""; width: 70px; height: 1px; background-color: #ffb321; position: absolute; top: 40px; left: 50%; transform: translateX(-50%); } .pro p, .industry p, .pro ul { margin: 40px 0; } .technology a { padding: 100px 20px; } .pro a { height: 100% } .technology .table > div:nth-of-type(1) { background-image: url(/images-design/solutions-data.jpg); } .technology .table > div:nth-of-type(2) { background-image: url(/images-design/solutions-manage.jpg); } .technology .table > div:nth-of-type(3) { background-image: url(/images-design/solutions-secure.jpg); } .technology .table > div:nth-of-type(4) { background-image: url(/images-design/solutions-voice.jpg); } .technology .table > div:nth-of-type(5) { background-image: url(/images-design/slides/work-remote.jpg); } .industry a { padding: 20px 10px 60px; display: block; height: calc(100% - 80px); position: relative } .industry a > span { position: absolute; bottom: 40px; left: 50%; transform: translateX(-50%) } .industry .grid { grid-template-columns: repeat(4,1fr); grid-gap: 0 } .industry > div > div { background-color: #122f59; } .industry > div > div:nth-of-type(1), .industry > div > div:nth-of-type(8) { background-image: url(/images-design/solutions-education.jpg); } .industry > div > div:nth-of-type(3), .industry > div > div:nth-of-type(6) { background-image: url(/images-design/slides/it-solutions.jpg); } .data a, .voice a { padding: 40px 20px; } .data > div > div:nth-of-type(1) { background-image: url(/images-design/solutions-education.jpg); } .data > div > div:nth-of-type(2) { background-image: url(/images-design/slides/it-solutions.jpg); } .data > div > div:nth-of-type(3) { background-image: url(/images-design/solutions-data.jpg); } .data > div > div:nth-of-type(4) { background-image: url(/images-design/slides/work-remote.jpg); } .data > div > div:nth-of-type(5) { background-image: url(/images-design/slides/it-management.jpg); } .voice > div > div:nth-of-type(1) { background-image: url(/images-design/solutions-data.jpg); } .voice > div > div:nth-of-type(2) { background-image: url(/images-design/slides/it-solutions.jpg); } .voice > div > div:nth-of-type(3) { background-image: url(/images-design/solutions-conferencing.jpg); } .voice > div > div:nth-of-type(4) { background-image: url(/images-design/slides/work-remote.jpg); } .voice > div > div:nth-of-type(5) { background-image: url(/images-design/solutions-education.jpg); } .videothird { width: 100%; height: 54vw; max-height: 225px; margin-top: 20px; } .procloud { margin: 20px 0 40px; } .procloud h1 { margin: 0; padding: 0 } .procloud h1:after { content: none; } .procloud .btn { min-width: unset; padding: 8px; display: block; margin: 10px 0; } .procloud tr:first-of-type td { padding: 20px; color: #4b4b4b; } .procloud tr:first-of-type td:first-of-type { border: none; } .procloud th, .expand { color: #999; } .procloud th { font-weight: 400; text-align: left; } .procloud td, .expand td, .plans h2, .community p { text-align: center; } .procloud td { color: #3781ba; } .procloud tr:first-of-type td:first-of-type { width: 322px; } .plans ul { grid-row-gap: 0; padding-left: 10px } .plans li { list-style: none } .plans i { margin-right: 5px; } .expand th { line-height: 1.4; padding: 20px; } .text { margin: 40px 0; } .text h3 { font-size: 20px; margin-bottom: 10px; } .text p { margin-top: 0; font-size: 14px } .text em { font-style: normal; font-size: 28px } .text ul { padding: 5px 10px 5px 30px; } .text .small { font-size: 14px; } .text .grid { color: #fff; } .text .grid.quad { grid-gap: 10px } .text .grid.half { grid-gap: 1px; background-color: #f2f2f2 } .text .grid.half > div { background-color: #122f59; padding: 5px } .text .grid > div { background-color: #fff; } .text ul { color: #4b4b4b } .text h4 { font-weight: normal; margin: 0; text-align: center } .contact > .grid { grid-gap: 40px } .contact h1 { text-align: left; margin-bottom: auto; } .contact h1:after { display: none; } .contact li { margin: 10px 0; } .contact #tabs .menu li { width: calc(100% / 3 - 3px); font-weight: bold; text-align: center; } .contact #tabs .menu li a { display: block; padding: 15px; border: 1px solid #ddd; } .contact #tabs .table ul { margin: 0 0 40px; } .contact #tabs-1 div ul:nth-child(2) { padding: 10px; } .quote { background-image: linear-gradient( to right, #f2f2f2 30%, #fff 30%); } .quote ul { margin-bottom: 40px; } .quote .wrap > .table > div { padding: 40px 0; } .quote .wrap > .table > div:first-of-type { width: 300px; padding-left: 50px; } .quote .wrap > .table > div:last-of-type { width: calc(100% - 400px); padding-left: 50px; } .sidebar { width: 300px; } .sidebar div, .support .links, .quote .wrap > .table > div:first-of-type { background-color: #f2f2f2; } .sidebar div { padding: 20px 20px 40px; margin-top: 30px; } .sidebar li { border: 1px solid #ddd; } .sidebar a { display: block; padding: 10px; } .sidebar a:hover { background-color: #fff; } .content { padding: 0 0 20px 0; } .content h2 { font-size: 20px; } .grid.support { grid-template-columns: 1fr 375px } .grid.policy { grid-template-columns: clamp(290px, 38vw, 375px) 1fr; grid-gap: 10px 30px } .support > div:last-of-type { padding-left: 10%; } .support .links { padding: 10px 10%; margin-top: 110px; } .support .links li, .more li { border-bottom: 1px solid #ddd; } .support .links li:last-of-type, .more li:last-of-type { border: none; } .support .links a, .more li { padding: 15px 0; } .support .links i, .more li i { font-size: 28px; margin-right: 15px; } .mt40 { margin-top: 40px; } .grey.mb0 { margin-bottom: 0; } .features strong, .procloud h1, .plans h2, .articles h2 a, .blogs h1 a { color: #122f59; } .features p { padding: 0 20px; } .articles .post { border-bottom: 1px solid #eee; } .articles .post:last-of-type { border: none; } .coming-together-services { margin-top: 20px; } .coming-together-services div > div { padding: 20px 0; } .orange span { color: #FC8409; } .community a { color: #4b4b4b; padding: 0 5px } form { text-align: left; margin: 40px 0; padding: 0 10px } form .table.half > div:first-of-type, form .table.third > div:nth-of-type(1) { padding-right: 6px; } form .table.half > div:last-of-type, form .table.third > div:nth-of-type(3) { padding-left: 6px; } form .table.third > div:nth-of-type(2) { padding: 0 6px; } form input[type=text], form input[type=email], form input[type=tel], form input[type=file], form input[type=submit], form select, form textarea { font-family: 'Fira Sans', sans-serif; font-size: 16px; } form input[type=text], form input[type=email], form input[type=tel], form select, form textarea { background-color: #f2f2f2; margin-bottom: 15px; padding: 0 20px; border: none; border-radius: 1px; } form input[type=text], form input[type=email], form input[type=tel], form textarea { width: calc(100% - 40px); } form input[type=text], form input[type=email], form input[type=tel], form select { height: 50px; } form input[type=checkbox] { margin-right: 10px; } form .grid { grid-gap: 15px 10px; margin-bottom: 15px } form .grid input { margin-bottom: 0 !important } form label { display: block; margin-bottom: 5px; } form select { width: 100%; } form input[type=file] { margin-left: 10px; } form textarea { height: 150px; padding: 20px; margin-bottom: 10px; } form input[type=submit], .btn { min-width: 200px; font-weight: 600; text-transform: uppercase; background-color: #ff7d09; color: #fff; padding: 14px 20px; border: none; border-radius: 1px; transition: ease-out .3s; } form input[type=submit]:hover, .btn:hover, .ready a:hover .btn { cursor: pointer; background-color: #ffa737; color: #fff; transition: ease-in .3s; } #quote textarea { height: 50px; } #quote input[type=submit] { margin-top: 15px; } .footnav a, .cta, .cta a, footer, footer a, .subfoot, .subfoot a { color: #fff; } .footnav a { display: block; padding: 200px 0; } .footnav h2, .footnav p { text-align: center; } .footnav h2 { text-transform: uppercase; margin-bottom: 50px; } .footnav .table > div { padding: 0 !important; } .cta .overlay, .careers .overlay { padding: 50px 0; } .careers { background-image: url(/images-design/bg-skyline.jpg); } .cta h3 { font-size: 20px; margin-bottom: 0; padding: 0 } .cta .table.half > div:first-of-type { padding: 0 40px 0 10px; } .cta .table.half > div:last-of-type { padding: 0 10px 0 40px; } .cta ul { list-style: none; padding-left: 100px; margin: 40px 0; } .cta li { position: relative; margin: 5px 0; } .cta li:first-of-type { position: absolute; left: 10px; } footer, .subfoot { font-size: 14px; } footer .grid { grid-gap: 0; padding-bottom: 40px } footer { background-color: #122f59; } footer a { margin: 5px 0; display: block } footer h3 { font-size: 16px; text-transform: uppercase; margin-top: 40px; } footer .grid ul { padding: 0 10px } footer .grid ul + ul { margin-top: 40px } .subfoot { padding: 20px 0; background-color: #061d3b } .subfoot a { padding: 4px; margin: 5px; display: block } .subfoot ul { padding: 0 } .subfoot ul:first-of-type li { line-height: 1.2; padding: 0 10px; border-right: 1px solid rgba(255,255,255,.5); } .subfoot ul:first-of-type li:last-of-type { border: none; } .opportunities img { object-fit: cover; height: 100% } .bgimg { position: relative } .bgimg > img:first-of-type { position: absolute; width: 100%; height: 100%; left: 0; right: 0; top: 0; bottom: 0; object-fit: cover; z-index: 0 } .grid.network { grid-template-columns: 1fr 5fr; grid-gap: 0; border-width: 1px; border-color: #eee; border-style: none solid solid none } .network > div { border-width: 1px; border-color: #eee; border-style: solid none none solid; justify-content: center; position: relative } .network h5 { margin: 0; top: 50%; transform: translateY(-50%); position: relative; font-size: 15px; padding: 0 15px } .network h4, .network h5 { font-weight: normal } .network > div:nth-child(4n+3), .network > div:nth-child(4n+4), .expand > div:nth-child(4n+3), .expand > div:nth-child(4n+4) { background-color: #fafafa } .network ul { margin: 30px 0 } .grid.expand { grid-template-columns: 1fr 5fr; grid-gap: 0; } .expand h3 { font-size: 16px; margin: 0; padding: 20px 10px } .expand > div:nth-child(4n+3) h3 { color: #4b4b4b } .expand .grid { grid-template-columns: repeat(5,1fr); grid-gap: 0 } .expand p { margin: 0; padding: 10px; } .grid.expand, .expand div, .expand p { border-width: 1px; border-color: #eee; } .grid.expand { border-style: none solid solid none } .grid.expand > div:nth-of-type(odd), .expand p { border-style: solid none none solid } table i, .expand i { font-style: normal } .back { padding: 20px 0 0; margin: 0; display: none } i.fa { display: inline-block } i.fa-5x.fa-cloud-download { width: 102.84px; height: 80px } .why i.fa-4x { width: 64px; height: 82.281px; } nav i.fa { width: 10.3px; height: 16px } .counter i.fa { width: 115.7px; height: 90px } .cta i.fa { width: 61.7px; height: 48px } .subfoot i.fa { width: 24px; height: 14px } #cloudlink-chat-overlay-buttons { bottom: 50px !important; } #policy summary, #policy .accordion-section-content { text-align: left } #policy .accordion-section-content, #policy h4 { padding-left: 10px; padding-right: 10px } @media(max-width:999px) { .expand p i { display: none } nav ul ul, nav i { display: none !important } .counter strong { font-size: 40px } .counter i + p > span { display: block } .why a { padding: 20px 30px } #contact .grid { grid-template-columns: repeat(2,1fr) } .more .table > div, .about .table > div { display: block; width: auto !important; padding: 0 !important } .footnav a { padding: 10vh 0 } .industry .grid, .plans .grid { grid-template-columns: repeat(2,1fr) } .industry .grid > div:nth-of-type(1) { order: 1 } .industry .grid > div:nth-of-type(2) { order: 2 } .industry .grid > div:nth-of-type(3) { order: 4 } .industry .grid > div:nth-of-type(4) { order: 3 } .industry .grid > div:nth-of-type(5) { order: 6 } .industry .grid > div:nth-of-type(6) { order: 5 } .industry .grid > div:nth-of-type(7) { order: 7 } .industry .grid > div:nth-of-type(8) { order: 8 } .team { grid-template-columns: repeat(3,1fr) } .team i { display: none } .team a { height: 220px } .team h2 { background-color: rgba(21,93,149,.2) !important; padding: 5px 5px 0 5px; height: calc(100% - 5px); position: relative; color: #fff; text-shadow: 0 0 4px #000 } .team h2 span { position: absolute; bottom: 5px; left: 50%; transform: translateX(-50%); display: block; width: calc(100% - 10px) } .text .grid.quad { grid-template-columns: repeat(2,1fr) } footer a { padding: 5px 0 } .contact ul { margin: 10px 0 } .article div.grid.half { grid-template-columns: 1fr } } @media(max-width:767px) { .why .table.third > div { display: block; width: auto !important; padding: 0 !important } .why a { min-height: unset; padding: 30px 20px 20px } .news .homeblogs div.post { width: auto; display: block; min-height: unset; margin: 10px 0 } .news .homeblogs .posts { background-color: #f2f2f2 } .counter .quad, .features .grid.quad, .contact .grid.quad, .expand .grid { grid-template-columns: 1fr 1fr } .grid.policy { grid-template-columns: 1fr } .grid.expand { display: block } .expand h3 { color: #4b4b4b; text-align: center } .expand > div:nth-of-type(even) { background-color: none } .expand > div:nth-of-type(odd) { background-color: #fafafa !important } .procloud tr:first-of-type td { padding: 20px 10px } .procloud tr:first-of-type td:first-of-type { width: auto } .procloud span { font-size: 22px } .procloud .btn { font-size: 12px } .spacer { display: none } .expand .grid p { border-style: solid; margin: -1px 0 0 -1px } .grid.expand, .expand > div { border-style: none } .expand > div { margin-top: -1px } } @media(max-width:700px) { .back { display: block } footer .grid.quad { grid-template-columns: repeat(2,1fr) } #contact .grid { grid-template-columns: repeat(1,1fr) } #contact input[type=submit] { width: 100% } .schedule { padding: 30px 0 } .banner .overlay { height: auto; padding: 30px 0; max-height: none } .banner .wrap { top: unset; transform: none } .grid.bgimg { display: block } .grid.support { grid-template-columns: repeat(1,1fr) } .support .links { margin: 1em 0; padding: 20px 10px } .support > div:last-of-type { padding: 0 } } @media(max-width:600px) { .cta .table > div, header .table > div, .table.half > div { display: block; width: auto !important; padding: 0 !important } #contact { padding: 0 10px } #contact .grid { grid-template-columns: repeat(3,1fr) } #contact input[type=submit] { width: auto } .top ul { width: auto; display: block } .top li { width: 50%; } .top li:nth-of-type(even) { text-align: right } header { position: relative } nav ul { text-align: center } .container { padding-top: 0 } .cycle-slideshow { height: 400px } .team, .grid.quad { grid-template-columns: repeat(2,1fr) } .process .quad:before { display: none } .grid.third, .contact > .grid { grid-template-columns: repeat(1,1fr) } .carrier ul { max-width: 400px; margin: 1em auto } .procloud td { width: 0 } .procloud td, .procloud th { padding: 10px } .procloud tr:first-of-type td { padding: 20px 5px } .sidebar div { padding: 20px 0 } .sidebar ul { display: grid; grid-template-columns: repeat(2,1fr); grid-column-gap: 10px } } @media(max-width:500px) { section > .wrap > .imgRight { float: none; margin: 1em 0; max-width: 100% } .cycle-slideshow { height: 500px } .footnav .table.third > div { display: block; width: auto !important; padding: 0 !important } .footnav a { padding: 20px 0 } .footnav h2 { margin: 10px 0 } .footnav .table > div { background-position: 50% 10% } .footnav .table > div:first-of-type { background-position: 50% 30% } .grid.half { grid-template-columns: repeat(1,1fr) } .features .grid.quad { grid-template-columns: repeat(1,1fr) } .features p { padding: 0 10px } .procloud tr, .procloud th:first-of-type { display: block; width: auto } .procloud td { width: calc(25% - 22px) !important; display: inline-block; margin-left: -4px; height: 16px; line-height: 1 } .procloud tr:first-of-type td { height: 100%; line-height: 1.6; width: calc(25% - 12px) !important } } @media(max-width:400px) { #contact .grid { grid-template-columns: repeat(2,1fr) } #contact input[type=submit] { width: 100% } .cycle-slideshow h1 { font-size: 40px } .counter .grid, .industry .grid, .grid.faq, .contact .grid.quad { grid-template-columns: repeat(1,1fr) } .industry .grid > div:nth-of-type(3) { order: 3 } .industry .grid > div:nth-of-type(4) { order: 4 } .industry .grid > div:nth-of-type(7) { order: 8 } .industry .grid > div:nth-of-type(8) { order: 7 } .industry a > span { bottom: unset; left: unset; transform: none; position: relative } .industry a { padding: 20px 10px; height: auto } .features p strong { font-size: 20px } .grey div.imgLeft { float: none; margin: 1em 0; max-width: 100% } .text .grid.quad { grid-template-columns: repeat(1,1fr) } .text .grid.half { grid-template-columns: repeat(2,1fr) } .cycle-slideshow h1, .banner strong { font-size: 40px; } }