img, iframe {max-width: 100%; height: auto} html,body{-webkit-text-size-adjust:100%;text-size-adjust:100%} body { min-width: 320px; font-family: 'Montserrat',verdana, sans-serif; font-size: 16px; background-color: #838485; color: #494949; line-height: 1.5; text-align: center; } h1, h2, h3, h4, h5, h6, p, th, td, dd, dt, li, blockquote { text-align: left; } h1, h2, h3, h4, h5, h6 { font-weight: normal; } body, nav ul, .top ul, footer ul { padding: 0; margin: 0; } img, iframe, video { max-width: 100%; height: auto } iframe, video{width:100%;aspect-ratio: auto 16 / 9} video:hover{cursor:pointer} a img, iframe { border: none; } a, .top a:hover, nav ul ul a:hover, .blog a:hover h3 { text-decoration: none; color: #2ea3f2; transition: ease-out .3s; } header a:hover, .banner a:hover, .intro a:hover, .featured a:hover, .cta a:hover, .btn1:hover, .btn2:hover, .btn3:hover, .connect a:hover, .blog a:hover, .covid a:hover, .dark-web 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: 5px 4% 1% 0; } .imgCenter { display: block; margin: 40px auto 20px; } .imgRight { float: right; margin: 5px 0 1% 4%; } .clear { clear: both; } .nowrap { white-space: nowrap; } .hide { display: none !important; } .center { text-align: center; } .video, .videohalf { width: 100%; height: 54vw; border-radius: 5px; } .video { max-height: 608px; } .videohalf { max-height: 293px; } .container { background-color: #fff; padding-top: 105px; background-attachment: fixed } .wrap { max-width: 1080px; display: block; margin: 0 auto; position: relative; } .grid { display: grid; grid-gap: 10px; } .grid.mid { align-items: center; align-self: center; } .grid.half { grid-template-columns: repeat(2,1fr); } .grid.third { grid-template-columns: repeat(3,1fr); } .grid.fourth { grid-template-columns: repeat(4,1fr); } .table { display: table; width: 100%; } .table > div { display: table-cell; vertical-align: top; } .table.half > div { width: 50%; } .table.half > div:first-of-type { padding-right: 2%; } .table.half > div:last-of-type { padding-left: 2%; } .table.third > div { width: calc(100% / 3); } .table.third > div:nth-of-type(1) { padding-right: 2%; } .table.third > div:nth-of-type(2) { padding-left: 1%; padding-right: 1% } .table.third > div:nth-of-type(3) { padding-left: 2%; } .table.quad > div { width: 25%; } header .table > div, .intro .table > div, .cta .table > div, .covid .table > div, .address .table > div, footer .table > div { vertical-align: middle; } nav li, .banner.contrast img, .banner.contrast p, footer .social li { display: inline-block; } .nolist ul { list-style: none; padding-left: 0; } .nolist ol { list-style: none; } .nolist li { list-style: none; } h1, h2, h3, h4, h5, h6, p, footer li, .address li, #contact, .special, .blogsidebar li,details, summary { padding-left: 20px; padding-right: 20px } footer .social li{padding-left:0;padding-right:0} summary{cursor:pointer} sup{line-height:0} header { width: 100%; font-size: 13px; background-color: #fff; box-shadow: 0 0 10px rgba(0,0,0,.1); position: fixed; z-index: 999; } header .secondrow .table > div:first-of-type { width: 250px; } header .secondrow .table > div:last-of-type { width: calc(100% - 270px); text-align: right; } .top { background-color: #494949; padding: 5px 0; color: #fff; } .top ul { margin: 0; padding: 0; } .top li { display: inline-block; } .top a { color: #fff; margin-right: 20px; } .top i { margin-right: 5px; display: inline-block; width: 17px; height: 13px } #headersocialicons { text-align: right; } #headersocialicons li a { margin-right: 20px; } #headersocialicons .fa-facebook, #headersocialicons .fa-linkedin, #headersocialicons .fa-instagram, #headersocialicons .fa-youtube-play { background: none; color: #fff; } nav { text-transform: uppercase; } nav a { display: block; padding: 28px 5px; color: #0058a6; } nav a:hover { color: #81b043; } nav i { margin-left: 5px; } nav ul ul { display: none; position: absolute; top: 75px; width: 220px; background-color: #fff; border-top: 3px solid #81b043; box-shadow: 0 0 10px rgba(0,0,0,.1); } nav ul ul li { display: block; } nav ul ul a { padding: 20px 15px; } nav ul ul a:hover { background-color: #f5f5f5; } nav ul li:hover > ul { display: block; z-index: 999; } nav ul ul ul { top: -3px; left: 220px; } .bgimg { position: relative } .bgimg > img:first-of-type { position: absolute; width: 100%; height: 100%; inset: 0; object-fit: cover; z-index: 0;object-position:center} .banner, .banner a, .intro h1, .intro a, .cta, .cta a, .covid a, .covid p { color: #fff; } .banner { height: 100px; background-color: #2ea3f2; background-size: cover; background-position: center; padding: 0 } .banner .overlay { height: 100%; background-color: rgba(0,0,0,.3);position:relative } .banner .wrap, .banner.main .wrap { top: 50%; transform: translateY(-50%); } .banner p { font-size: 28px; text-transform: uppercase; margin: 0; } .banner span { display: block; width: 280px; background-color: #0c71c3; padding: 10px 0; margin: 40px auto; border: 2px solid #fff; border-radius: 5px; } .banner i, .intro i, .cta i, .covid i, .dark-web i { display: none; vertical-align: central; margin-left: 10px; border: 2px solid #fff; border-radius: 100px; } .banner i { padding: 1px 7px 3px 7px; } .banner a:hover i, .intro a:hover i, .cta a:hover i, .covid a:hover i, .dark-web a:hover i { display: inline-block; } .banner.main { height: 450px !important;display:block } .banner.main p, .banner.about p { text-align: center; text-shadow: 2px 2px 3px rgba(0,0,0,.6); } .banner.main p:first-of-type { max-width: 600px; font-size: 40px; text-align: center; line-height: 1.2; text-transform: none; margin: 0 auto; } .banner.main p { max-width: 600px; font-size: 46px; text-align: center; line-height: 1.2; text-transform: none; margin: 0 auto; } .banner.contrast { height: 250px; font-size: 0; } .banner.contrast img, .banner.contrast p { vertical-align: middle; } .banner.contrast img { width: 350px; margin-right: 50px; } .banner.contrast p, .banner.about p { text-transform: none; } .banner.contrast p, .banner.about strong { line-height: 1.3; } .banner.contrast p { width: calc(100% - 400px); font-size: 28px; } .banner.about { height: 500px; } .banner.about { background-image: url(/images-design/banners/contrast-communications-company-page.jpg); background-position: center; } .banner.about p { width: 80%; font-size: 18px; margin: 0 auto 20px; } .banner.about strong { font-size: 30px; font-weight: normal; } .cycle-slideshow { height: 100%; text-align: center; position: relative; overflow: hidden; } .cycle-slideshow .wrap { position: relative; top: 50%; transform: translateY(-50%); } .cycle-slideshow a { display: block; width: 100%; height: 100%; margin: 0 auto; position: relative; text-decoration: none; background-size: cover; background-position: center; } .banner.main h1, .banner.main p { max-width: 900px; font-weight: 400; line-height: 160%; color: #fff; text-align: center; margin: 0 auto; text-shadow: 1px 1px 1px #000; } .cycle-slideshow h1 { max-width: 600px; font-size: 34px; } .cycle-slideshow p { font-size: 24px; } .slide1 { background-image: url(/images-design/banners/helping-one-another-on-a-tablet.jpg); } .slide2 { background-image: url(/images-design/banners/woman-working-from-home-office.jpg); } .slide3 { background-image: url(/images-design/banners/co-workers-using-voip.jpg); } .slide4 { background-image: url(/images-design/banners/team-working-in-shared-space.jpg); } .intro, .cta, .covid { font-size: 20px; } .intro { background-color: #3a4149; } .cta a, .intro a, .covid a { display: block; text-align: center; padding: 10px 20px; border-radius: 50px; } .intro .table > div, .cta .table > div, .covid .table > div { padding: 0 10px; } .intro a { background-color: #0c71c3; } .intro i, .cta i, .covid i { padding: 0 6px 1px 8px; } .intro h1, .cta p, .covid p { font-weight: bold; } .intro h1 { width: 80%; font-size: 24px; font-weight: bold; } .intro .table > div:first-of-type { width: calc(100% - 200px); } .intro .table > div:last-of-type { width: 200px; text-align: right; } .featured { padding: 60px 0 20px; } .featured .grid { padding: 0 5px; } .featured .table.half > div { padding: 5px 5px !important; } .featured a { color: #333; display: block } .featured a:hover h2 { font-weight: bold; color: #0c71c3; } .featured h2, .featured p, .comments h2, .comments p, .blog h2, .values h2, .values li, .values p { text-align: center; } .featured h2 { font-size: 20px; margin: 10px 0; } .featured p { margin: 0; } .comments h2, .blog h2 { font-size: 30px; } .comments { padding: 20px 0 60px; } .comments .table > div, .testimonials .table > div { background-color: #f5f5f5; padding: 30px 0 80px !important; position: relative; } .comments .table > div { border: 5px solid #fff; } .comments h2 { text-transform: uppercase; margin-bottom: 30px; } .comments i, .testimonials i { color: #0c71c3; padding: 12px 5px 8px; border: 2px solid #0c71c3; border-radius: 100px; position: absolute; top: -20px; left: 50%; transform: translateX(-50%); } .comments p, .testimonials p { margin: 15px auto; } .comments p { width: 90%; } .comments p:first-of-type, .testimonials p:first-of-type { margin-top: 0; } .comments p:last-of-type, .testimonials p:last-of-type { position: absolute; left: 50%; transform: translateX(-50%); bottom: 10px; } .comments strong, .testimonials strong { display: block; } .values { margin-bottom: 50px; } .values h2 { font-size: 30px; color: #0058a6; margin: 30px 0 0; } .values .grid { grid-gap: 10px 20px; } .values ul, .values details > summary:first-of-type { list-style: none; padding: 0; } .values p { max-width: 900px; margin: 10px auto 20px; } .values summary { font-size: 18px; color: #000; } .values svg { display: block; padding: 10px; margin: 10px auto; border-radius: 50px; } .values .grid li:nth-of-type(1) svg { background-color: #0c71c3; } .values .grid li:nth-of-type(2) svg { background-color: #94c94d; } .values .grid li:nth-of-type(3) svg { background-color: #2ea3f2; } .values .grid li:nth-of-type(4) svg { background-color: #0058a6; } .cta { background-color: #0058a6; padding: 20px 0; } .cta a { background-color: #81b043; } .cta .table > div:first-of-type { width: calc(100% - 250px); } .cta .table > div:last-of-type { width: 250px; text-align: right; } .blog { padding: 20px 0; } .blog h3 { font-size: 16px; } .blog { padding: 20px 0; } .blog p:first-of-type { color: #bbb; } .dark-web { background-color: #3a4149; padding: 10px 0 20px; margin-bottom: 50px; } .dark-web h2, .dark-web p { text-align: center !important; color: #fff; } .dark-web h2 { font-weight: bold; } .dark-web a { background-color: #81b043; display: block; text-align: center; padding: 10px 0; border-radius: 50px; color: white; } .dark-web i { padding: 1px 7px 3px 7px; } .pager a { position: absolute; } .carousel { width: 90% !important; left: 50%; transform: translateX(-50%); overflow: hidden; height: 670px } .carousel h3 { color: #444; font-weight: bold } .carousel .post { width: 305px; height: 300px; vertical-align: top; margin: 0 10px } .carousel .post p:nth-of-type(2) { height: 146px; overflow: hidden } .carousel h3, .carousel p { white-space: normal; } .pager a { font-size: 60px; color: rgba(51,51,51,.1); padding: 150px 0; } .pager a:hover { color: rgba(51,51,51,.2); } .pager a:first-of-type { left: 0; } .pager a:last-of-type { right: 0; } main, footer .table.third { padding: 40px 0; } main h1, main h2, main h3, main h4, .special { color: #000; } main h2, main h3, main h4 { margin-top: 30px; } main h1, .special { font-size: 24px; line-height: 1.3; margin-bottom: 30px; } main h2 { font-size: 20px; } main h3 { font-size: 18px; } main h4 { font-size: 16px; } .special { font-weight: normal; display: block; text-align: left; margin-top: .83em } main ul, main ol { padding-left: 30px; } main li { margin: 5px 0; } .btn1, .btn2, .btn3 { display: inline-block; font-size: 14px; color: #fff; padding: 10px 40px; margin: 10px 0; border-radius: 3px; transition: ease-out .3s; } .btn1 { background-color: #0c71c3; } .btn1:hover, .connect a:hover .btn1 { background-color: #0d7fdb; transition: ease-in .3s; } .btn2 { background-color: #81b043; } .btn2:hover { background-color: #94c94d; } .btn3 { background-color: #0058a6; } .btn3:hover { background-color: #0065bf; } .interior { background-size: cover; background-position: top center; } .interior > .wrap > .table { min-height: 400px; } .interior .table.half > div:last-of-type { padding: 40px 0 50px 40px; } .pagesub h2, .pagesub strong { display: block; font-size: 28px; text-align: center; background-color: #494949; color: #fff; padding: 29px 0; margin: 0; font-weight: normal } .pagesub h2 em { display: block; font-size: 18px; font-style: normal; } .pagesub h3 { font-size: 20px; } .pagesub .table.half > div { border-top: 1px solid #eee; } .pagesub .table.half > div:first-of-type, .pagesub .table.half > div:last-of-type { padding: 0 20px 20px; } .pagesub .table.half > div:last-of-type { border-left: 1px solid #eee; } .pagesub .table.half:first-of-type > div { border-top: none; } .margin { margin: 30px 0; } .connect { padding: 20px 4% } .connect a { display: block; padding: 20px 0 10px; border-top: 1px solid #eee; clear: both } .connect a { display: flex } .connect a > img { flex: 0 0 300px; max-width: 300px; margin-bottom: 20px; object-fit: cover } .connect a > div { flex: 1 1 0 } .connect a:nth-of-type(odd) img { order: 2; margin-left: 20px; transform: scaleX(-1) } .connect a:nth-of-type(even) div { margin-left: 20px } .connect a:first-of-type { border-top: none; } .connect div { text-align: left; } .connect h1 { margin-bottom: 0; } .connect h2 { margin-top: 0; padding-top: 10px; } .connect p { color: #494949; } .contact i, .pagesub i { color: #0c71c3; padding: 7px 5px; margin-right: 10px; border: 1px solid #0c71c3; border-radius: 100px; } .title { background-color: #0058a6; padding: 20px 0; margin-bottom: 40px; } .title h1, .title p { text-align: center; color: #fff; margin: 0; } .title h1 { font-size: 30px; text-transform: uppercase; } .title p { font-size: 20px; } #remote .grid h2 { font-size: 24px; } #remote .grid img { max-width: 400px; } .testimonials .table > div { border-top: 25px solid #fff; border-left: 10px solid #fff; border-right: 10px solid #fff; border-bottom: 10px solid #fff; } .testimonials p { width: 85%; } .address ul { list-style: none; padding-left: 0; margin-top: 20px; } .address li { margin: 0; } .address .btn1, .address .btn2, .address .btn3 { width: 100%; text-align: center; padding: 10px 0; } .blogsidebar ul { list-style: none; padding: 0; } .posts .post { padding-bottom: 15px; } main .postThumbnail { border: 1px solid #eee } main .blogs .post { border-color: #eee } #newsblog .postThumbnail { width: 250px; height: 250px; border-radius: 500px; margin: 0 auto; overflow: hidden } #newsblog .postThumbnail img { display: block; object-fit: cover; width: 100%; height: 100%; float: none; max-width: 100%; margin: 0 } #companyVideo { padding-bottom: 2% } form { margin: 20px 0; } form .table.half > div:first-of-type { padding-right: 5px; } form .table.half > div:last-of-type { padding-left: 5px; } form input[type=text], form input[type=email], form input[type=tel], form input[type=submit], form textarea { font-family: 'Montserrat', sans-serif; font-size: 14px; } form input[type=text], form input[type=email], form input[type=tel], form textarea { background-color: #f5f5f5; margin-bottom: 15px; padding: 0 20px; border: none; } 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] { height: 50px; } form textarea { height: 150px; padding: 20px; } form input[type=submit] { min-width: 250px; background-color: #81b043; color: #fff; padding: 15px 0; border: none; border-radius: 3px; transition: ease-out .3s; } form input[type=submit]:hover { cursor: pointer; text-decoration: none; background-color: #94c94d; color: #fff; transition: ease-in .3s; } .address #contact { width: 96%; } .address #contact input[type=text], .address #contact input[type=email], .address #contact input[type=tel], .address #contact textarea { background-color: rgba(255,255,255,.95); } #sales .table.half > div:last-of-type { padding: 0 0 0 5px; } #checklist { margin-top: 40px; } .footbg { background-color: #c1c2c4; } .footbg a { color: #0c71c3 } footer .table.half, footer .fa { color: #fff; } footer .table > div { padding: 0 10px; } footer .table > div:last-of-type p { text-align: right; } footer .table.half { padding: 20px 0; } footer ul { list-style: none; } footer .social li { text-align: center; } footer .social a { display: block; } .social .fa { font-size: 18px; vertical-align: middle; padding: 12px 10px; margin: 10px; border-radius: 50px; } .fa-facebook { background-color: #3b5998; } .fa-twitter { background-color: #1da1f2; } .fa-instagram { background-color: #E1306C; } .fa-linkedin { background-color: #0077b5; } .fa-youtube-play { background-color: #FF0000; } .social a:hover .fa { font-size: 24px; padding: 9px 6px; } .ccpaNotice { background-color: #838485 !important; } .ccpaNotice, .ccpaNotice a { color: #ccc !important } .ccpaNotice a { white-space: nowrap } .blogs { padding: 0 0 20px } .posts .post:last-of-type { border-bottom: none } .blogs .postThumbnail { border-radius: 500px; height: 300px } #newsblog .postThumbnail:empty { background-image: url(/images-design/logo-square.svg); width: 250px; height: 250px; background-size: cover } #userguides details, #screenbeam p { text-align: left; } .lastpass {text-indent: 20px;} .guides img {width: 400px;} @media(max-width:999px) { nav ul ul { display: none !important } .featured h2 span { display: block } .social .fa { margin: 10px 6px } nav i.fa { display: none } nav a { padding: 8px; margin: 5px } .connect a > img { max-width: 50% } main > .wrap { padding: 0 !important } .managed { padding: 20px 0 40px } main ul, main ol { padding-left: 45px } .address #contact { width: auto; } footer .table > div, .table > div, header li, .connect, .banner { padding-left: 0 !important; padding-right: 0 !important } .top { padding: 10px 0 } .container { padding-top: 0 } .intro .table > div { display: block; width: auto !important; padding: 0 !important } header .top ul, nav { text-align: center } header { position: relative } header > .wrap { padding: 20px 0 } header .table > div { display: block; width: auto !important; padding: 0 !important } header .secondrow .table > div:first-of-type a { padding: 0 5px; text-align: center; display: block } header .secondrow img{max-width:500px;width:100%} #headersocialicons { text-align: center; padding: 10px 0; } .cta .table > div:last-of-type { width: 300px } .connect a:nth-of-type(even) div, .connect a:nth-of-type(odd) img { margin-left: 0 } .address .table li a span { display: block } .address .table > div:first-of-type li { padding-right: 0 } .banner.contrast { height: auto; padding: 20px 0 } .banner.contrast .wrap { top: unset; transform: none } .banner.contrast img { width: 35%; margin-right: 0 } .banner.contrast p { width: calc(65% - 40px) } .comments p { padding: 0 10px !important; width: calc(100% - 20px); } main .postThumbnail { width: 250px; height: 250px } .grid.fourth{grid-template-columns:1fr 1fr} .grid.fourth h2{text-align:center;margin-top:10px} .grid.fourth p{max-width:400px;margin:1em auto;padding:0 10px} } @media(max-width:800px) { .blogs .postThumbnail { width: 225px; height: 225px } } @media(max-width:767px) { .featured .grid { grid-template-columns: repeat(2,1fr); } .connect a p:last-of-type, footer .table.third li { text-align: center } footer .table.third > div { display: block; width: auto; padding: 0 !important } footer .table.third p, .ccpaNotice { text-align: center !important } footer .table.third { padding: 20px 0 } #userguides .grid.half {grid-template-columns: 1fr;} #userguides .lastpass iframe {width: 100%; } } @media(max-width:700px) { .connect .imgLeft, .connect .imgRight { max-width: 50% } .interior { background-image: none !important } .interior .table.half > div { display: block; width: auto; } .interior .table.half > div:last-of-type { padding: 20px 0 !important } .interior .wrap > .table > div:first-of-type { padding: 20px 0; min-height: 200px; background-size: cover; background-position: center top } .interior.cloud .wrap > .table > div:first-of-type { background-image: url(/images-content/cloud-services.jpg) } .interior.careers .wrap > .table > div:first-of-type { background-image: url(/images-content/careers.jpg) } .interior.sales .wrap > .table > div:first-of-type { background-image: url(/images-content/sales.jpg) } .interior.address .wrap > .table > div:first-of-type { background-image: url(/images-content/contact-center.jpg) } .interior.support .wrap > .table > div:first-of-type { background-image: url(/images-content/customer-support.jpg); background-position: center } .interior.surveillance .wrap > .table > div:first-of-type { background-image: url(/images-content/hd-surveillance.jpg); background-position: center } .interior.network .wrap > .table > div:first-of-type { background-image: url(/images-content/networking.jpg); } .interior.cabling .wrap > .table > div:first-of-type { background-image: url(/images-content/structured-cabling.jpg); background-position: center } .interior.voice .wrap > .table > div:first-of-type { background-image: url(/images-content/voice-solutions.jpg); } .interior.voice .table.half, .interior.network .table.half { min-height: 150px; } .address .table li a span { display: inline } .intro .table > div { display: block; width: auto !important; padding: 0 !important } .intro h1 { width: auto; text-align: center } .intro p { max-width: 300px; margin: 1em auto } .banner { height: auto !important; } .banner .overlay { padding: 15px 0; height: calc(100% - 30px) } .banner .wrap { top: unset; transform: none } .banner > .wrap > p { padding-top: 5px; padding-bottom: 5px } .banner.about p { width: auto; margin: 1em auto } main .blogs .postThumbnail { width: clamp(200px, 45vw, 300px); height: clamp(200px, 45vw, 300px) } .banner.main{height:350px !important} } @media(max-width:600px) { .connect a { display: block } .connect a img { max-width: 100%; height: 250px; width: 100% } .banner.contrast img { width: 150px; } .banner.contrast p { width: calc(100% - 150px - 40px); font-size: 20px } .cta .table > div, .table.third > div { display: block; width: auto !important; padding: 0 !important } .featured .table.third > div { padding: 0 !important } .featured p { margin: 1em auto } .featured .table.half > div { padding: 5px 0 !important; } .featured img { height: 200px; width: 100%; object-fit: cover } .featured .table > div:nth-of-type(even) { margin: 60px 0 } .featured h2 span { display: inline } .cta .table > div:last-of-type p { max-width: 300px; margin: 1em auto } .cta p { text-align: center } main .table.half > div { display: block; width: auto; padding: 0 } .testimonials .table { display: inline } .testimonials .table > div { border-style: solid none; padding: 30px 0 20px !important; margin-bottom: 30px } .testimonials p { width: auto } .comments p:last-of-type, .testimonials p:last-of-type { position: relative; bottom: unset; text-align: center } .comments .table.half > div { height: auto; padding: 20px 0 !important; margin-bottom: 20px; border: none; } .grid.half {grid-template-columns: 1fr;} } @media(max-width:500px) { .imgRight { float: none; margin: 1em auto; max-width: 100% } .covid .table > div { display: block; width: auto !important; padding: 0 !important } .covid p { text-align: center } footer .table.half > div { display: block; width: auto; padding: 0 } footer .table.half p { text-align: center !important } footer .table { padding: 10px 0 !important } .top li { display: block; text-align: center } .top a { margin: 5px; display: block } h1, h2, h3, h4, h5, h6, p, footer li, .address li, #contact, .special, details, summary { padding-left: 10px; padding-right: 10px } main ul, main ol { padding-left: 35px } #headersocialicons li { display: inline-block; } main .blogs .postThumbnail { margin-top: 0 } .featured .grid,.grid.fourth { grid-template-columns: 1fr; } } @media(max-width:400px) { .banner.contrast img { display: none } .banner.contrast p { width: auto; display: block } main .blogs .postThumbnail { float: none; margin: 0 auto; width: 300px; height: 300px; max-width: 100% } }