body {background-image: none; background-color: white; font-size: small; text-align: justify;  Font-family:Arial, sans-serif; overflow-y: scroll;margin:0; overflow-x: hidden;}


.main {position:  fixed; top: 0px; left: 0px;  background-color:white; padding: 0px; width: 100%; height: 100px; font-size: 1.2em; Font-family: Arial, sans-serif; z-index: 2;}


.navcent {background-color:white; padding: 0px; max-width: 1000px; height: auto; Font-family: Arial, sans-serif; margin-left:auto; margin-right:auto;}

.centered2 {color:#585858; padding: 0px; padding-top:20px; max-width: 1000px; height: auto; font-size: 1.3em; Font-family: Arial, sans-serif; margin-left:auto; margin-right:auto;clear:both;}

.centered3 {color:#585858; padding: 0px; max-width: 625px; height: auto; margin-left:auto; margin-right:auto;clear:both;}

.centered4 {color:white; text-align: left; padding: 0px;  max-width: 1000px; height: 100px; font-size: 2.4em; font-weight:bold; Font-family: Arial, sans-serif; margin-left:auto; margin-right:auto;clear:both;}

.centeredbenefits {color:#848484; padding: 0px; padding-top:10px; max-width: 1000px; height: auto; font-size: 1.8em; text-align: left; Font-family: Arial, sans-serif; margin-left:auto; margin-right:auto;clear:both;}

.head {text-align: center; color: white; background-color: #008AB3;  font-size: 4em; font-weight:bold; text-decoration: none; padding: 5px; padding-left: 15px; font-family: Arial, sans-serif;clear:both; }

.midhead {text-align: left; color: #0B243B; font-size: large; text-decoration: none; font-weight:bold; padding: 5px; padding-left: 15px; }

.subhead {border-bottom: 1px #172192 solid; ; color: #172192;font-size: 1.05em; padding: 2px; text-align: left;}

.Cirruslogo { color: midnightblue; width: 150px; height: 150px; font-size: 1.05em;text-align: left;}


.backgroundpic {position: relative; max-width: 100%; height: 450px; z-index: 0;}

.centerpanelfixed {position: absolute; top: 20px; left: 50%; transform: translate(-50%, 0%); width: 1000px;  font-size: 1.2em; Font-family: Arial, sans-serif;  margin-left:auto; margin-right:auto; z-index: 2; }

.testimonials {position: absolute; top: 170px; left: 25%; width: 550px; height:210px; border-radius: 0px; text-align: left; font-size: 2.0em; color:white; background: #7EC1EE; border: 0px solid white; padding:18px; z-index: 1;}


.overlaybox {position: fixed; right: 0px; bottom: 15px; width: 400px; height:auto; background-color: #7FC2EF; color: white; font-size: 1.2em; line-height: 1.2; padding:10px; border-radius: 17px 0px 0px 17px;}

.fullwidth {width:100%; color: white; background-color: #EFF2FB;  font-size: 1.05em; line-height: 1.2;  text-decoration: none; ; clear:both;}

.fullwidth2 {width:100%; color: white; background-color: #01A9DB;  font-size: 1.05em;  text-decoration: none; clear:both;}

.fullwidth3 {width:100%; color: white; background-color: #DEEFF4;  font-size: 1.05em;  text-decoration: none; clear:both;}

.fullwidth4 {width:100%; color: white; background-color: #01A9DB;  font-size: 1.05em;  text-decoration: none; clear:both;}

h2 { text-align: left; background-color: #848484; color: white;  font-size: 1.6em; text-decoration: none; font-weight:normal; padding: 20px; padding-left: 15px; font-family: Arial, sans-serif; }

h3 { font-size: 2.1em; line-height: 1; text-align: left; font-weight:bold; color: #585858;}

h4 { text-align: left; background-color: #0489B1; color: white;  font-size: 1.05em; text-decoration: none; font-weight:normal; padding: 5px; padding-left: 15px; font-family: , Arial; margin: 0px;}

h4:hover { text-align: left; background-color: #848484; color: white;  font-size: 1.05em; text-decoration: none; font-weight:normal; padding: 5px; padding-left: 15px; font-family: , Arial, sans-serif; margin: 0px;}

h5 { font-size: 2.4em; line-height: 1; text-align: left; font-weight:bold; color: #585858;}

h6 {font-size: 1.4em; line-height: 1; text-align: left; font-weight:normal; color: white;}

navh6 {font-size: 1.4em; line-height: 1; text-align: left; font-weight:normal; color: white;}


h7 { font-size: 1.8em; line-height: 1; text-align: left; font-weight:bold; color: #585858;}

h8 {font-size: 1.4em; line-height: 1; text-align: left; font-weight:bold; color: #0489B1;}

h9 {text-align: left; color: white; background-color: #008AB3;  font-size: 3em; font-weight:bold; text-decoration: none; padding: 5px; padding-left: 15px; font-family: Arial, sans-serif;clear:both; }

boxtitle { font-size: 1.8em;  text-align: center; color: white; ; Font-family:Arial, sans-serif;  }

boxtitle2 { font-size: 2.2em; text-align: center; Font-family:Arial, sans-serif;  }
boxtitle3 { font-size: 1.6em; text-align: center; Font-family:Arial, sans-serif; }
boxtitle4 { font-size: 1.6em; text-align: center; Font-family:Arial, sans-serif; font-weight:bold;  }


p {font-size: 1.05em; text-align: justify; color: #585858; Font-family:Arial, sans-serif;}




a.textlink:link {text-align: left;color: #0B243B; text-decoration: none; font-size: 1.05em;      -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s}
a.textlink:visited {text-align: left;color: #0B243B;  text-decoration: none; font-weight:bold;font-size: 1.05em;;}
a.textlink:hover {text-align: left;color: #585858;  text-decoration: none; font-size: 1.05em;}
a.textlink:active { } 

a.textlink2:link {text-align: left;color: #A4A4A4; text-decoration: none;font-size: 1.05em;}
a.textlink2:visited {text-align: left;color: #A4A4A4;  text-decoration: none; font-weight:bold;font-size: 1.05em;}
a.textlink2:hover {text-align: left;color:#848484;  text-decoration: none; font-size: 1.05em;}
a.textlink2:active { } 


a.textlinkwhite:link {text-align: left;color: white; text-decoration: none; font-size: 1.05em;     -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;}
a.textlinkwhite:visited {text-align: left; color: white; text-decoration: none; font-size: 1.05em;}
a.textlinkwhite:hover {text-align: left;color:#848484;  text-decoration: none; ; font-size: 1.05em;}
a.textlinkwhite:active {} 


.space {height: 100px; }

.space2 {height: 100%; border-top:2px #42C937 solid;; padding: 4px; text-align:center;} 


.box0  {max-width: 100%; height: auto; text-align: justify; font-size: 1.05em; background-color: white; color:#585858; padding:10px; padding-top:10px; padding-bottom:10px; margin-bottom:10px;line-height: 1.4; clear:both;}

.button  {max-width: 150px;  text-align: center; background-color: #848484; color:white; padding:0px;margin: auto; border-radius:0px;}

.buttonwide  {width: 250px;text-align: center; background-color: #848484; color:white; padding:2px;margin: auto; border-radius:0px;}

.solidboxlink  {max-width: 450px;height: 340px; text-align: center; color:white;  padding:0px; position: relative; margin: 10px;}

.centered {position: absolute; top: 70%; left: 50%; transform: translate(-50%, -50%);}


.teamtext {clear:both; font-size: 1.05em; text-align: left; background-color: #0489B1;color:white; padding:10px;}
.teamtext2 {clear:both; font-size: 1.05em; text-align: left; background-color: #0489B1;color:black; padding:10px;}
.newshead {color: white; padding: 10px; text-align: left; font-size: 1.2em;}
.teampic {max-width: 500px; padding:0px;}

.boxwrapleft {width: 100%; height: 100%; padding:0px; font-size: 1.05em;  margin: 0px; margin-bottom: 10px; clear:both;}
.boxwrapright {width: 100%; height: 100%; padding:0px; font-size: 1.05em;  margin: 0px; margin-bottom: 10px; clear:both;}



.newswrap3 {width: 100%; min-height: 100px; background-color: #0489B1;color:white; padding:0px; font-size: 1.05em;  margin: 0px;margin-bottom: 20px; }
.newsbox3 {width: 100%; height: auto; background-color: #0489B1; padding:10px; font-size: 1.05em; line-height: 1.4;  margin: 0px;  }


.newswrap4 {width: 100%; min-height: 100px; background-color: #01A9DB;color:white; padding:0px; font-size: 1.05em;  margin: 0px;margin-bottom: 20px; }
.newsbox4 {width: 100%; height: auto; background-color: #01A9DB; padding:10px; font-size: 1.05em; line-height: 1.4;  margin: 0px;  }


.boxwrapleft1 {width: 100%; height: auto;background-color: #585858; padding:0px; font-size: 1.05em; line-height: 1.4;  margin: 0px; margin-bottom: 20px;}
.boxwrapright1 {width: 100%; height: auto; background-color: #585858; padding:0px; font-size: 1.05em; line-height: 1.4;  margin: 0px; margin-bottom: 20px;}


.boxwrapleft4 {width: 100% height: auto;background-color: #DEEFF4; padding:0px; font-size: 1.05em;  margin: 0px; margin-bottom: 10px;}
.boxwrapright4 {width: 100% height: auto; background-color: #DEEFF4;padding:0px; font-size: 1.05em;  margin: 0px; margin-bottom: 10px;} 

.boximagepic  {width: 100%; height: auto; padding:0px; clear:both;}
.boximagepicteam  {background-color: #585858; width: 100%; height: auto;}

.boximagepic img {
	-webkit-filter: grayscale(0) !important;
	filter: grayscale(0) !important;
}

.boximagepic img:hover {
	-webkit-filter: grayscale(90%) !important;
	filter: grayscale(90%) !important;
-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
}


.hovgray img {
	-webkit-filter: grayscale(0) !important;
	filter: grayscale(0) !important;
}

.hovgray img:hover {
	-webkit-filter: grayscale(90%) !important;
	filter: grayscale(90%) !important;

-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
}




.boxwrapleft8 {width: 980px; height: auto;background-color: #008AB3; padding:0px; font-size: 1.05em; line-height: 1.4;  margin: 10px; margin-bottom: 20px;}
.boxwrapright8 {width: 980px; height: auto; background-color: #008AB3; padding:0px; font-size: 1.05em; line-height: 1.4;  margin: 10px; margin-bottom: 20px;}

@media only screen and (max-width: 980px) {

.head {font-size: 3em;}


  .boxwrapleft8 {width: 820px; height: auto; padding:0px; font-size: 1.05em;  margin: 10px; margin-bottom: 10px;}
  .boxwrapright8 {width: 820px; height: auto; padding:0px; font-size: 1.05em;  margin: 10px; margin-bottom: 10px;}
}

@media only screen and (max-width: 940px) {

.head {font-size: 3em;}
 
  .boxwrapleft8 {width: 740px; height: auto; padding:0px; font-size: 1.05em;  margin: 10px; margin-bottom: 10px;}
  .boxwrapright8 {width: 740px; height: auto; padding:0px; font-size: 1.05em;  margin: 10px; margin-bottom: 10px;}
}



.boxwrapleftsmall {width: 310px; height: 310px; padding:0px;  margin: 15px; margin-left: 0px; float:left;}
.boxwrapmiddlesmall {width: 310px; height: 310px; padding:0px;  margin: 15px; float:left; }
.boxwraprightsmall {width: 310px; height: 310px; padding:0px;  margin: 15px; margin-right: 0px; float:left;}

.boxsmalltop  {width: 310px; height: 100px; text-align: left; background-color: #0489B1; color:white; padding:10px; padding-left:10px; padding-bottom:10px; }


.footer {text-align: right; color: white; background-color: #0B243B;  font-size: 1.0em; text-decoration: none; ; padding: 10px; clear:both;}

.footernav {width:200px; font-size: 1.25em; text-align: left; line-height: 1.6;float: left; }

footertext { font-size: 1.05em; line-height: 1.3; text-align: right; font-weight:normal; float:right;}

.footerpanel {padding: 0px; max-width: 1200px; min-height: 200px; font-size: 1.0em; Font-family: Arial, sans-serif; margin-left:auto; margin-right:auto; overflow: auto;}

.footercenter {font-size: 1.00em; text-align: center; color: #A4A4A4; font-weight:normal; padding: 15px;}




a.click:link {width: 100%; height: 100%;   color:white; padding:0px;  text-decoration: none; font-weight:normal; display:block;    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;}
a.click:visited {width: 100%; height: 100%;   color:white; padding:0px;  text-decoration: none; font-weight:normal; display:block;}
a.click:hover {width: 100%; height: 100%;  background-color: #A4A4A4; color:white; padding:0px;  text-decoration: none; font-weight:normal; display:block;}
a.click:active {} 


a.click2:link {width: 100%; height: 90px;   color:white; padding:0px;  text-decoration: none; font-weight:normal; display:block;    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;}
a.click2:visited {width: 100%; height: 90px;;   color:white; padding:0px;  text-decoration: none; font-weight:normal; display:block;}
a.click2:hover {width: 100%; height: 90px;  color:white; padding:0px;  text-decoration: none; font-weight:normal; display:block;}
a.click2:active {} 



a.click4:link, a.click4:visited {width: 100%; height: 70px; background-color: #0B243B; color: white; padding-top: 15px;   text-align: center; text-decoration: none; display: inline-block;  margin-right: 0px; margin-bottom: 10px;
-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;}
a.click4:hover {background-color: #A4A4A4;color: white; text-align: center;
-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;}


a.click3:link, a.click3:visited {width: 100%; height: 210px; background-color: white; color: #585858; padding: 10px; margin-right: 0px; margin-bottom: 10px; text-align: left; text-decoration: none; font-size: 1.05em; line-height: 1.4; display: inline-block;      
-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;}
a.click3:hover {background-color: #A4A4A4;color: white;
-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;}


.hovgray img {
	-webkit-filter: grayscale(0) !important;
	filter: grayscale(0) !important;
}

.hovgray img:hover {
	-webkit-filter: grayscale(90%) !important;
	filter: grayscale(90%) !important;

-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
}




.linkover:hover {opacity: 0.4;
-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;}


.navmenu {background-color: white; color: #0B243B; Font-family:Arial, sans-serif; font-weight:bold;}

.navmenu a {color: #000000; text-align: center; padding: 30px 10px; text-decoration: none; font-size: 1.2em; font-weight:bold; display: block; float: left;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;}

.navmenu a:hover {background-color: white;  color: #7EC1EE; text-decoration: underline; font-weight:bold;}

.active {background-color: white; color: #0B243B; font-weight:bold;}


.hamburger {font-size: 2.0em;  cursor: pointer; padding-right:20px; padding-top: 20px; float: right; display: none; 
}



@media only screen and (max-width: 1500px) {
  .testimonials {position: absolute; top: 140px; left: 20%; width: 450px; height:170px;  font-size: 1.5em;}
}


@media only screen and (max-width: 1100px) {
  .testimonials {position: absolute; top: 130px; left: 15%; width: 350px; height:140px;  font-size: 1.2em; padding:12px; }
}


@media only screen and (max-width: 1020px) {
     .centerpanelfixed {position: absolute; top: 20px; left: 50%; transform: translate(-50%, 0%); margin-left:auto; margin-right:auto;  width: 660px;}
  .boxwrapleftsmall {  margin: 10px; margin-left: 0px; }
  .boxwrapmiddlesmall {  margin: 10px; margin-right: 0px;}
  .boxwraprightsmall {display: none;}
  .fullwidth3 {background-color: white;}
  .fullwidth4 {background-color: white;}
}



@media only screen and (max-width: 1000px) {
  .testimonials {display: none;}
  .navmenu a {display: none;}
  .hamburger {display: block;}

}


@media only screen and (max-width: 900px) {
  .boxwrap
 {width: 370px; height: auto; padding:0px; font-size: 1.05em;  margin: 10px; margin-bottom: 10px;}
  .boxwrapright1 {width: 370px; height: auto; padding:0px; font-size: 1.05em;  margin: 10px; margin-bottom: 10px;}
  .boxwrapleft8 {width: 650px; height: auto; padding:0px; font-size: 1.05em;  margin: 10px; margin-bottom: 10px;}
  .boxwrapright8 {width: 650px; height: auto; padding:0px; font-size: 1.05em;  margin: 10px; margin-bottom: 10px;}
}



@media only screen and (max-width: 830px) {
  .centered2 {padding-top:20px; max-width: 100%; } 
  .centered4 {padding-top:0px; max-width: 100%; height: 100px;font-size: 2.0em;} 
  .boxwrapleft8 {width: 100%; height: auto; margin: 0px; margin-bottom: 20px;}
  .boxwrapright8 {width: 100%; height: auto; margin: 0px; margin-bottom: 20px;}
}



@media only screen and (max-width: 790px) {
     .centerpanelfixed {position: absolute; top: 20px; left: 50%; transform: translate(-50%, 0%); margin-left:auto; margin-right:auto;  width: 300px;}
  .boxwrapleftsmall {margin-left:auto; margin-right:auto;clear:both; }
  .boxwrapmiddlesmall {display: none;}
  .boxwraprightsmall {display: none;}
  .newsbox3 {width:100%;}
   h5 {font-size: 1.7em;} 

}



@media only screen and (max-width: 625px) {
.centered3 {width: 100%; height: auto; margin-left:auto; margin-right:auto;}
.centeredbenefits{font-size: 1.5em;}
.footernav {width: 170px;}

}


@media only screen and (max-width: 400px) {

   boxtitle2 {font-size: 1.5em;} 
   .teampic {width:100%;} 
  .overlaybox {width: 95%; }
  .centeredbenefits{font-size: 1.2em;}
}







* {box-sizing:border-box}

/* Slideshow container */
.slideshow-container {
  max-width: 1000px;
height: auto;
  position: relative;
  margin: auto;
}

/* Hide the images by default */
.mySlides1, .mySlides2 {display: none}


/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: #0B243B;
  font-weight: bold;
  font-size: 40px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(11,36,59,0.8); color: rgba(224,230,248,1);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor:pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 6.0s;
  animation-name: fade;
  animation-duration: 6.0s;
}

@-webkit-keyframes fade {
  0% {opacity: 0.1} 
  20% {opacity: 0.8}
  100% {opacity: 1}
}

@keyframes fade {
  0% {opacity: 0.1} 
  20% {opacity: 0.8}
  100% {opacity: 1}
}




/* Accordion styles */

.tab {
  position: relative;
  margin-bottom: 10px;
  width: 100%;
  color: #fff;
  overflow: hidden;
 }


input {
  position: absolute;
  opacity: 0;
 z-index: -1;
}

label {
  position: relative;
  display: block;
  padding: 0 0 0 1em;
  background: #0489B1;
  font-weight: normal;
  line-height: 1;
 padding: 20px; min-height: 100px; cursor: pointer; font-size: 1.6em; text-align: left; Font-family:Arial, sans-serif; 
}


.blue label {
  background: #0489B1; padding-right: 50px;
}
.tab-content {
  max-height: 0;
  overflow: hidden;
  background: #1abc9c;
  -webkit-transition: max-height .7s;
  transition: max-height .7s;
}

.blue .tab-content {
  background: #848484; font-size: 1.1em; padding-left: 10px; padding-right: 10px;
}


.tab-content p{
  
}
/* :checked */
input:checked ~ .tab-content {
 max-height: 70em;
}

/* Icon */

label::after {
  position: absolute;
  right: 0;
  top: 0;
  display: block;
  width: 3em;
  height: 3em;
  line-height: 1;
 text-align: center;
  -webkit-transition: all .7s;
  transition: all .7s;
}

input[type=checkbox] + label::after {
  content: "+";
}
input[type=radio] + label::after {
  content: "\25BC"; padding-top: 20px;
}

input[type=checkbox]:checked + label::after {
 display:none;
}
input[type=radio]:checked + label::after {
 display:none;}






.sidenav {
    height: 100%; /* 100% Full-height */
    width: 0; /* 0 width - change this with JavaScript */
    position: fixed; /* Stay in place */
    z-index: 10; /* Stay on top */
    top: 0;
    left: 0;
    background-color: #111; /* Black*/
    overflow-x: hidden; /* Disable horizontal scroll */
    padding-top: 60px; /* Place content 60px from the top */
    transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}

/* The navigation menu links */
.sidenav a {
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 25px;
    color: #818181;
    display: block;
    transition: 0.3s;
}

/* When you mouse over the navigation links, change their color */
.sidenav a:hover{
    color: #f1f1f1;
}

/* Position and style the close button (top right corner) */
.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
}

/* Style page content - use this if you want to push the page content to the right when you open the side navigation */
#opac {
    transition: margin-left .5s;
    padding: 20px;
}

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
    .sidenav {padding-top: 15px;}
    .sidenav a {font-size: 18px;}

}


}


* {box-sizing:border-box}

/* teampic container */
.teampic-container {
  max-width: 1000px;
height: auto;
  position: relative;
  margin: auto;
}


/* Hide the images by default */
.teampics1, .teampics2 {display: none}

/* Fading animation */
.fadet {
  -webkit-animation-name: fadet;
  -webkit-animation-duration: 2.0s;
  animation-name: fadet;
  animation-duration: 2.0s;
}

@-webkit-keyframes fadet {
  0% {opacity: 0.1} 
  20% {opacity: 0.9}
  100% {opacity: 1}
}

@keyframes fadet {
  0% {opacity: 0.1} 
  20% {opacity: 0.9}
  100% {opacity: 1}
}



/* # The Rotating Marker # */
details summary::-webkit-details-marker { display: none; }
summary::before {
  content: "▶";
  position: absolute;
  top: 1rem;
  left: 0.8rem;
  transform: rotate(0);

}

details[open] > summary:before {
  transform: rotate(90deg);
  transition: 0.45s transform ease;
}

/* # The Sliding Summary # */
details { overflow: hidden; }
details summary {
  position: relative;
  z-index: 1;
}
@keyframes details-show {
  from {
    margin-bottom: -80%;
    opacity: 0;
    transform: translateY(-100%);
  }
}



details[open] > *:not(summary) { color: inherit; }



/* # Style 4 # */
details.style4 summary {
  padding-right: 2.2rem;
  padding-left: 1rem;
}
details.style4 summary::before {
  content: "+";
  color: white;
  font-size: 3rem;
  line-height: 1rem;
  transform: rotate(-0deg);
  top: 1.2rem;
  left: unset;
  right: 0.6rem;
}
details[open].style4 > summary:before {
  transform: rotate(45deg);
  color: red !important;
  transition: color ease 2s, transform ease 1s;
}



/* # Just Some Pretty Styles # */


p:last-child { padding: 0; }
details {
  max-width: 100%;
  margin-top: 5px;
  background: white;
}
summary {
  border: 4px solid transparent;
font-size: 1.2em;
  outline: none;
  padding: 1em;
  display: block;
  background: #01A9DB;
  color: white;
  padding-left: 2.2em;
  position: relative;
  cursor: pointer;
}
details[open] summary,
summary:hover {
  color: white;
  background: #0B243B;
-webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
}

.lotinfo {
  background: white;
  padding: 10px;
  border: 0px solid #0B243B;
  border-top: none;
line-height: 1.4;
font-size: 1.05em;
}