@media only screen and (max-width:991px){
header .logo {text-align: left; -ms-flex: 0 0 18%; flex: 0 0 18%; max-width: 18%;}
header .logo img {width: 100px; margin-top: 10px;}
header .col-lg-4 {-ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%;}
.print-btn {padding: 19px 0 0 0; -ms-flex: 0 0 18%; flex: 0 0 18%; max-width: 18%;}
.header-right {-ms-flex: 0 0 24%; flex: 0 0 24%; max-width: 24%;}
.header-right a {margin-left: 6px;}
.prg-d .col-lg-7{-ms-flex: 0 0 58.333333%; flex: 0 0 58.333333%; max-width: 58.333333%;}
.prg-d .col-lg-3{-ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
.prg-d .col-lg-2{-ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667%;}
.dated .col-lg-5 {-ms-flex: 0 0 41.666667%; flex: 0 0 41.666667%; max-width: 41.666667%;}
.dated .col-lg-7 {-ms-flex: 0 0 58.333333%; flex: 0 0 58.333333%; max-width: 58.333333%;}
.dated .col-lg-6 {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
.dated .col-lg-4 {-ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%;}
.tooltip .tooltiptext{margin-left: -80px;}
}

@media only screen and (max-width:920px){
.tooltip .tooltiptext {margin-left: -84px;}
}

@media only screen and (max-width:860px){
.tooltip .tooltiptext {margin-left: -90px;}
}

@media only screen and (max-width:848px){
header .logo {text-align: center; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
header .logo img {margin-top: 0;}
header .col-lg-4 {-ms-flex: 0 0 53%; flex: 0 0 53%; max-width: 53%;}
.header-right {-ms-flex: 0 0 29%; flex: 0 0 29%; max-width: 29%;}
}

@media only screen and (max-width:767px){
	.main-container {width: 96%; padding: 0;}
	.tooltip .tooltiptext {margin-left: -96px;}


}



@media only screen and (max-width:736px){
	header .col-lg-4 {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
.header-right {-ms-flex: 0 0 32%; flex: 0 0 32%; max-width: 32%;}
.prg-d .col-lg-7{-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
.prg-d .col-lg-2, .prg-d .col-lg-3{-ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
.row.badges .tick {float: right;}
.acc .mb-0 > a {padding: 16px 10px 16px 15px; font-size: 15px;}
.acc .mb-0 > a span{padding: 0;}
.acc .mb-0 > a span.col-pic {width: 40%; margin-right: 29px;}
.acc .mb-0 > a span.col-pic.bt {width: auto; margin-right: 60px;}
.acc .mb-0 > a:after, .nest-div .card-header a:after {right: 11px; background-size: 15px; width: 15px; height: 15px; margin-top: 0;}
.acc .mb-0 > a[aria-expanded="true"]:after, .nest-div .card-header a[aria-expanded="true"]:after{background-size: 15px; width: 15px; height: 15px; }
.tick1{right: 40px;}
.pink-bg-strip:before {width: 6px;}
.gr-bg-strip:before {width: 6px;}

}

@media only screen and (max-width:667px){
.row.dated.cl-3 {display: inline-block; vertical-align: top; width: 100%; text-align: left;}
.dated .col-lg-4 {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
.dated .col-lg-4:nth-child(2) {text-align: right;}
.dated .col-lg-4:nth-child(3) {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
}

@media only screen and (max-width:640px){
	header .col-lg-4 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; text-align: center;}
	.header-right {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
	header .top-circle{float: none; display: inline-block; vertical-align: top;}
	.top-circle-text{float: none; display: inline-block; vertical-align: top; text-align: left;}
	.print-btn {padding: 19px 15px 0 15px; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}

    }

@media only screen and (max-width:590px){
.tooltip .tooltiptext {margin-left: -50px; width: 150px;}
}

@media only screen and (max-width:575px){
	.tooltip .tooltiptext {width: 100%; bottom: 0; left: 0; margin-left: 0; max-width: 410px;}
.tooltip .tooltiptext::after {top: 75%; left: 100%; margin-left: 0; border-color: transparent transparent black black;}
}
@media only screen and (max-width:567px){

	
   .prg-d .col-lg-7{display: none;}
   .prg-d .col-lg-3, .prg-d .col-lg-2 {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
   .nest-div .collapse div.row{padding: 0;}
   .nest-div .collapse div.row div.col-lg-3 {width: 50%; text-align: center;}
   .nest-div .collapse div.row div.col-lg-1, .nest-div .collapse div.row div.col-lg-2{width: 25%; text-align: center; padding: 3px 15px !important;}
   .chiller_cb {height: 2rem; display: inline-block; vertical-align: top;}
   .chiller_cb label {padding-left: 0; vertical-align: top;}
   .chiller_cb span, .chiller_cb span.lf{text-align: center; right: 0; left: 0; margin: auto !important; padding: 0 !important; display: block;}
   .acc .mb-0 > a:after, .nest-div .card-header a:after {right: 11px; background-size: 15px; width: 15px; height: 15px; margin-top: 0;}
   .acc .mb-0 > a[aria-expanded="true"]:after, .nest-div .card-header a[aria-expanded="true"]:after{background-size: 15px; width: 15px; height: 15px; }
   .nest-div .tick img {width: 15px; height: 15px;}
   .acc .mb-0 > a span.col-pic.bt {width: auto; margin-right: 76px;}
   .tick1 {right: 45px;}
   .tick1 img {width: 15px; height: 15px;}
   	.tooltip .tooltiptext {width: 250px; bottom: 34px; left: 0; margin-left: 0; max-width: 410px; right: 0; margin: auto;}
.tooltip .tooltiptext::after {top: 100%; left: 75%; margin-left: 0; border-color: black transparent transparent transparent;}
} 

@media only screen and (max-width:520px){
.tooltip .tooltiptext::after {left: 77%;}
}

@media only screen and (max-width:480px){
	.badges .bluish, .badges .yellow-bg, .badges .mid-green-bg {margin-left: 0; height: auto; min-height: 50px; display: inline-block; vertical-align: top; width: 100%; position: relative;}
	.badges .bluish:before, .badges .yellow-bg:before, .badges .mid-green-bg:before{background: #d80467; width: 11px; content: ""; display: inline-block; vertical-align: top; position: absolute; left: 0; top: 0; z-index: 2; height: 100%; border-right: 1px solid #fff;} 
    .badges .bluish .coll-h, .badges .yellow-bg .coll-h, .badges .mid-green-bg .coll-h{padding-left: 10px; width: 100%;
    width: 89%; float: left;}
    .badges .bluish .col-pic, .badges .yellow-bg .col-pic, .badges .mid-green-bg .col-pic, .nest-div .col-pic {display: none; width: 75%; margin-top: 0; text-align: left; padding-left: 10px;}
    .badges .bluish .col-pic img, .badges .yellow-bg .col-pic img, .badges .mid-green-bg .col-pic img {margin-right: 5px; margin-left: 0;}
	.badges .wd11{display: none;}
	.row.badges .tick {margin-right: 5px;}
	.nest-div .coll-h {width: 82%;}
	.dated .col-lg-5 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;text-align: center;}
	.dated .col-lg-7 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;text-align: center;}
	.dated .col-lg-6 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;text-align: center;}
	.light-grey-btn button {float: none; margin-top: 10px;}
}

@media only screen and (max-width:414px){
	.top-container {padding: 10px 15px;}
	header .col-lg-4 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; text-align: center;}
	.header-right {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; text-align: center; padding: 10px 15px 0 15px;}
	.print-btn {padding: 10px 15px 0 15px; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
	.print-btn a {width: 104px; height: 31px; display: block; text-align: center; margin: auto;}
	.top-circle-text {font-size: 22px;}
	.nest-div .collapse div.row div.col-lg-1, .nest-div .collapse div.row div.col-lg-2 {width: 50%;}
	.nest-div .collapse div.row, .nest-div .collapse div.row span{font-size: 13px;}
	.nest-div .collapse div.row span{padding: 0 0 0 0px;}
	.acc .mb-0 > a span.col-pic{display: none;}
	.acc .mb-0 > a span.col-pic.bt {display: inline-block; vertical-align: top; margin-top: -9px;}
	.dated .col-lg-4 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
	.dated .col-lg-4:nth-child(2) {text-align:left;}
	.dated .col-lg-4:nth-child(3) {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; text-align: left !important;}
	.tooltip .tooltiptext {right: auto; width: 244px;}
	.tooltip .tooltiptext::after {left: 32%;}
} 

@media only screen and (max-width:382px){
.tooltip .tooltiptext::after {left: 29%;}
} 

@media only screen and (max-width:366px){
.tooltip .tooltiptext::after {left: 27%;}
}

@media only screen and (max-width:343px){
.tooltip .tooltiptext::after {left: 25%;}
} 