/* css */
/* html, body, header, footer, .site, .site-content, .site-main, article, .entry-content, .entry-header  {
    margin-right: 0px!important;
    margin-left: 0px!important;
    max-width: 100%!important;
    padding-right: 0px!important;
    padding-left: 0px!important;
}

.site-header-wrap {
width: 90%!important;
margin-left: auto!important;
margin-right: auto!important;
}
*/

/* general formatting */
.page .entry-title {
display: none;
}

/* footer formatting */
.footer-link {
color: black;
}

.link-container{
        word-wrap:break-word !important;
}

.link-container > * a:link, .link-container > * a:visited{
color:black !important;
}

.link-text{
font-family:Montserrat !important;
font-size:15px !important;
letter-spacing:1.2px !important;
}

.link-container > * a:hover, .link-container > * a:active{
color:rgb(50,143,211) !important;
}

@media only screen and (max-width:1025px){
.link-container, .link-header{
    text-align:center !important;
}
}

/* header formatting */
.elementor-location-header {
margin: 0;
height: 90px !important;
}
.header-container {
margin: 0;
height: 90px !important;
}

/* homepage formatting */

/* carousel on homepage */
.slidingIconContainer{
width: 320px;
height: 320px;
border-radius: 30%;
margin-right: 10px;
margin-left: 10px;
margin-top:auto;
margin-bottom:auto;
vertical-align:middle;
/*background-color:;*/
display: flex;
flex-flow: row;
align-items: self-start;
}

.slidingIcon{
height:250px;
width:auto;
margin-top:auto;
margin-bottom:auto;
padding:12px;
}

.carouselContainer {
background: pr;
height: 320px;
margin: auto;
overflow: hidden;
position: relative;
width: 680px;
}

.carouselContainer::before, .carouselContainer::after {
background: linear-gradient(to right, white 0%, rgba(255, 255, 255, 0) 100%);
content: "";
height: 320px;
position: absolute;
width: 200px;
z-index: 2;
}

.carouselContainer::after {
right: 0;
top: 0;
-webkit-transform: rotateZ(180deg);
      transform: rotateZ(180deg);
}

.carouselContainer::before {
left: 0;
top: 0;
}

.carouselTrack {
-webkit-animation: scroll 18s linear infinite;
animation: scroll 18s linear infinite;
display: flex;
width: calc(340px * 6);
height:320px;
vertical-align: middle;
}

@media only screen and (max-width:679px){
.carouselContainer{
    width: 320px;
    overflow:hidden;
}
}

.carouselContainer .slidingIconContainer {
height: 320px;
width: 320px;
}

@-webkit-keyframes scroll {
0% {
-webkit-transform: translateX(calc(340px * 2));
        transform: translateX(calc(340px * 2));
}
100% {
-webkit-transform: translateX(calc(-340px * 6));
        transform: translateX(calc(-340px * 6));
}
}

@keyframes scroll {
0% {
-webkit-transform: translateX(calc(340px * 2));
        transform: translateX(calc(340px * 2));
}
100% {
-webkit-transform: translateX(calc(-340px * 6));
        transform: translateX(calc(-340px * 6));
}
}

/* Organizations images on homepage*/
.org-images{
  margin-top:3%;
margin-left:auto;
margin-right:auto;
margin-bottom:3%;
}

/* Workplace infrastructure formatting */

/* custom header formatting, which is used on both WI and PS */
.customHeaderContainer{
position:relative;
background-size:cover;
  background-attachment:fixed;
background-position:center;
  background-repeat:no-repeat;
height:650px;
    width:100vw;
overflow:hidden;
}

@media (hover: none) {
.customHeaderContainer{
background-attachment:scroll !important;
}
}


.customHeaderContainer-wi{
background-image: url("https://portsidetechnology.com/wp-content/uploads/2021/12/Workplace-Infrastructure-Webpage.webp");
}

.customHeaderText{
text-align:center;
color:white;
font-size:52px;
font-weight:900;
/*white-space: nowrap;*/
font-family:Montserrat;
letter-spacing: 1.2px;
  margin-left: 1%;
  margin-right: 1%;
}

@media only screen and (max-width: 640px){
.customHeaderText{
    font-size: 42px !important;
}
}

.customSubheaderText{
text-align:center;
color: white;
background-color: rgb(50, 143, 211) ;
font-size:16px;
font-family:Montserrat;
font-weight:500;
text-transform:uppercase;
letter-spacing: 1.2px;
/*white-space: nowrap;*/
margin-right:30vw;
margin-left:30vw;
padding-right:2.5vw;
padding-left:2.5vw;
padding-top:1.5vh;
padding-bottom:1.5vh;
}

.customHeaderSubcontainer{
position:absolute;
width:100vw;
top:50%;
left:50%;
transform:translate(-50%, -50%);
}

/* solution icon boxes on the Workplace Infrastructure page */
.solutioniconboxes{
border-style: solid;
border-radius: 20px;
border-width: 0px;
}

.solutioniconboxes:hover{
animation: arise 1s ease-in-out 0s 1 normal forwards;
box-shadow: 7px 7px 9px 9px rgb(0,0,0,5);
transform: scale(1);
z-index:1;
}

@keyframes arise{
0%{
    transform: scale(1);
    box-shadow: 7px 7px 9px 9px rgb(0,0,0,5);
}
100%{
    transform: scale(1.1);
    box-shadow: 7px 7px 15px 9px rgb(0,0,0,5);
    z-index: 3;
}
}

/* pricing calculator on the WI page */
.checkbox, .hidden-class{
visibility: hidden !important;
opacity:0 !important;
height:0 !important;
width:0 !important;
padding:0 !important;
margin:0 !important;
  display: none !important;
}

.solutionsCalc{
margin-left:3%;
margin-right:3%;
}

.wpcf7{
text-align:center;
vertical-align:middle;
}

.button-container-submit{
text-align:center;
margin-top:1%;
margin-bottom:1%;
}

.price-output{
background-color:white;
color:black;
text-align:center;
font-size:27px;
line-height: 1.1;
font-weight:bold;
font-family:"Montserrat";
padding:2%;
}

.wpcf7 input[type=submit]{
background-color:rgb(50, 143, 211) !important;
color:white !important;
padding-top:1.5% !important;
padding-bottom:1.5% !important;
text-align:center !important;
vertical-align:middle !important;
margin:1% auto 1% auto !important;
border-radius:11px !important;
}

.wpcf7 label{
padding-top:1.5% !important;
padding-bottom:1.5% !important;
text-align:center !important;
vertical-align:middle !important;
margin:1% auto 1% auto !important;
border-radius:11px !important;
color: rgb(50, 143, 211);
font-family:Montserrat;
font-weight:bold;
font-size: 20px;
}

.wpcf7 input[type=text]{
padding-top:1.5% !important;
padding-bottom:1.5% !important;
text-align:center !important;
vertical-align:middle !important;
margin:1% auto 1% auto !important;
border-radius:11px !important;
}

.wpcf7 input[type=email]{
padding-top:1.5% !important;
padding-bottom:1.5% !important;
text-align:center !important;
vertical-align:middle !important;
margin:1% auto 1% auto !important;
border-radius:11px !important;
}

.wpcf7-submit{
	color: white !important;
	font-family:Montserrat;
	font-weight:bold;
	font-size: 20px;
}

.wpcf7-response-output{
	color: rgb(50, 143, 211);
	font-family:Montserrat;
	font-weight:bold;
	font-size: 20px;
}

.input-label{
color: rgb(50, 143, 211);
font-family:Montserrat;
font-weight:bold;
font-size: 20px;
margin-bottom:3px;
}

.checkboxes-container{
display:flex;
flex-wrap:wrap;
justify-content:center;
}

.range-container{
vertical-align:middle;
text-align:center;
margin-top:7px;
margin-bottom:7px;
padding:4px;
border-style:solid;
border-radius:12px;
border-width:1px;
border-color: rgb(50, 143, 211);
}

.range-subcontainer{
display:flex;
flex:1;
justify-content:space-around;
margin-left:auto;
margin-right:auto;
margin-top:4px;
margin-bottom:auto;
vertical-align:middle;
}

.num-container{
display:flex;
justify-content:center;
vertical-align:middle;
}

.br-clear{
clear:both;
}

.customCheckbox-checked{
position:relative;
cursor:pointer;
width:300px;
  height:120px;
border: solid;
border-width:0px;
border-radius: 12px;
padding:1%;
margin:2%;
font-family:"Montserrat";
font-size:20px;
font-weight:bold;
text-align:center !important;
vertical-align:middle;
color: white !important;
background-color: rgb(50, 143, 211);
box-shadow: inset 0px 0px 12px 1px black;
}

.customCheckbox-checked label{
	color: white !important;
}

.customCheckbox-checked i{
color: rgb(240, 178, 84);
}

.customCheckbox-unchecked{
position:relative;
float:left;
cursor:pointer;
width:300px;
  height:120px;
border: solid;
border-width:2px;
border-radius: 12px;
padding:1%;
margin:2%;
font-family:"Montserrat";
font-size:20px;
font-weight:bold;
text-align:center !important;
vertical-align:middle;
color: rgb(50, 143, 211);
background-color: white;
}

.customCheckbox-unchecked i{
color: rgb(50, 143, 211);
}

input[type=number]{
height:50px;
width:150px;
font-family:Montserrat;
font-size:18px;
border-color: rgb(50, 143, 211) !important;
border-width: 2px;
padding-left:4px;
padding-right:4px;
}

input[type=range] {
height: 26px;
-webkit-appearance: none;
margin: 10px;
width: 50vw;
border-width:0px !important;
}

input[type=range]:focus {
outline: none;
border-width:0px !important;
}

input[type=range]::-webkit-slider-runnable-track {
width: 100%;
height: 14px;
cursor: pointer;
animate: 0.2s;
box-shadow: 1px 1px 1px #50555C;
background: #50555C;
border-radius: 14px;
border: 0px solid rgb(50, 143, 211);
}
input[type=range]::-webkit-slider-thumb {
box-shadow: 0px 0px 0px #000000;
border: 0px solid rgb(50, 143, 211);
height: 20px;
width: 40px;
border-radius: 12px;
background: #529DE1;
cursor: pointer;
-webkit-appearance: none;
margin-top: -3px;
}
input[type=range]:focus::-webkit-slider-runnable-track {
background: #50555C;
}
input[type=range]::-moz-range-track {
width: 100%;
height: 14px;
cursor: pointer;
animate: 0.2s;
box-shadow: 1px 1px 1px #50555C;
background: #50555C;
border-radius: 14px;
border: 0px solid rgb(50, 143, 211);
}
input[type=range]::-moz-range-thumb {
box-shadow: 0px 0px 0px #000000;
border: 0px solid rgb(50, 143, 211);
height: 20px;
width: 40px;
border-radius: 12px;
background: #529DE1;
cursor: pointer;
}
input[type=range]::-ms-track {
width: 100%;
height: 14px;
cursor: pointer;
animate: 0.2s;
background: transparent;
border-color: transparent;
color: transparent;
border-width:0px;
}
input[type=range]::-ms-fill-lower {
background: #50555C;
border: 0px solid rgb(50, 143, 211);
border-radius: 28px;
box-shadow: 1px 1px 1px #50555C;
}
input[type=range]::-ms-fill-upper {
background: #50555C;
border: 0px solid rgb(50, 143, 211);
border-radius: 28px;
box-shadow: 1px 1px 1px #50555C;
}
input[type=range]::-ms-thumb {
margin-top: 1px;
box-shadow: 0px 0px 0px #000000;
border: 0px solid rgb(50, 143, 211);
height: 20px;
width: 40px;
border-radius: 12px;
background: #529DE1;
cursor: pointer;
}
input[type=range]:focus::-ms-fill-lower {
background: #50555C;
border-width:0px;
}
input[type=range]:focus::-ms-fill-upper {
background: #50555C;
border-width:0px;

}

/* Professional Services formatting */

/* see also the custom header formatting in the WI section, which is used on both WI and PS */
.customHeaderContainer-ps{
background-image: url("https://portsidetechnology.com/wp-content/uploads/2021/12/Professional-Services-Webpage.webp");
}

/* Contact us formatting */

/* the custom header on the contact us page uses different formatting than those on the other pages */


/* custom header formatting, which is used on both WI and PS */
.customHeaderContainer-contactus{
position:relative;
background-size:cover;
background-attachment:fixed;
background-position:center;
    background-repeat:no-repeat;
height:650px;
    width:100vw;
overflow:hidden;
}

@media (hover: none) {
.customHeaderContainer-contactus{
background-attachment:scroll !important;
}
}

.customHeaderContainer-contactus{
background-image: url("https://portsidetechnology.com/wp-content/uploads/2021/12/charleston_bridge.webp");
}

.customHeaderText-contactus{
text-align:center;
color:white;
font-size:52px;
font-weight:900;
/*white-space: nowrap;*/
font-family:Montserrat;
letter-spacing: 1.2px;
  margin-left: 1%;
  margin-right: 1%;
}

@media only screen and (max-width: 640px){
.customHeaderText-contactus{
    font-size: 42px !important;
}
}

.customSubheaderText-contactus{
text-align:center;
color: white;
background-color: rgb(50, 143, 211) ;
font-size:16px;
font-family:Montserrat;
font-weight:500;
text-transform:uppercase;
letter-spacing: 1.2px;
/*white-space: nowrap;*/
margin-right:30vw;
margin-left:30vw;
padding-right:2.5vw;
padding-left:2.5vw;
padding-top:1.5vh;
padding-bottom:1.5vh;
}

.customHeaderSubcontainer-contactus{
position:absolute;
width:100vw;
top:50%;
left:50%;
transform:translate(-50%, -50%);
}

.image-box {
white-space:normal;
word-break:normal;
word-wrap:break-word;
}