/** Chat Box Css Start **/
.pum-theme-182802 .pum-content + .pum-close, .pum-theme-default-theme .pum-content + .pum-close {
        border: 1px none #00f !important;
    background-color: #00f !important;
    line-height: 15px !important;
}
.BottomBannerWrap img{
    max-width: 100%;
    width: 100%;
    height: auto;
}
.ChatBoxWrap, 
.ChatBoxWrapTop,
.ChatBoxWrapBottom{
    display: block;
    width: 400px;
    margin: 0 auto;
    position: fixed;
    bottom: 0px;
    right: 0px;
    background-color: #fff;
    box-shadow: none;
    text-align: center;
    padding: 10px;
    box-sizing: border-box;
    font-family: 'Europa','Helvetica Neue',Arial,sans-serif !important;
    color: #333;
    border-radius: 5px;
    z-index: 9;
    -webkit-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
    box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
}
.ChatBoxWrapTop .ListWrap ul li .Col .Col,
.ChatBoxWrapBottom .ListWrap ul li .Col{
    display: flex;
    background-color: #de00a5;
    align-items: center;
}
.ChatBoxWrapBottom .ListWrap ul li .Col .ImgWrap, 
.ChatBoxWrapBottom .ListWrap ul li .Col .ImgWrap img{
    position: relative !important;
    width: 50px !important;
    height: 40px !important;
}
.ChatBoxWrapBottom .ListWrap ul li .Col .Name .ImgWrap{
    display: none;
}
.ChatBoxWrapTop .ListWrap ul li .Col > .ImgWrap,
.ChatBoxWrapTop .ListWrap ul li .Col > .ImgWrap img{
    position: relative !important;
}


.ChatBoxWrap p.selectionShareable{
	display: none;
}
.boxclose,
.boxclosebottom{
    position: absolute;
    bottom: 12px;
    z-index: 9;
    top: auto; 
    padding: 0;
    right: 5px;
    width: 25px;
    height: 25px;
    background-color: transparent;
    display: inline-block;
    text-align: center;
    align-items: center;
    justify-content: center;
    color: #fff !important;
    text-transform: uppercase;
    font-size: 18px;
    text-decoration: none !important;
    line-height: 24px;
    border-radius: 100%;
    outline: none !important;
}

.boxclose span,
.boxclosebottom span{
	font-family: 'Europa','Helvetica Neue',Arial,sans-serif !important;
    font-weight: 600;
}
.ChatLogoWrap{
	line-height: 0;
	margin-bottom: 20px;
}
.ChatBoxWrap p{
	margin-bottom: 15px;
}
.ChatBoxWrap .ShortDesc{
	font-family: 'Europa','Helvetica Neue',Arial,sans-serif !important;
    font-weight: 600;
    font-size: 16px;
    line-height: 1.3; 
    margin-bottom: 10px; 
    text-align: left;
} 
.ChatBoxWrap .ShortDesc div{
	margin-bottom: 15px;
}
.ChatBoxWrap .ListWrap ul{
	display: grid;
    grid-template-columns: repeat(auto-fit,181px);
    justify-content: center;
    grid-gap: 8px; 
    list-style-type: none; 
    padding: 0px;
}
.ChatBoxWrap .ListWrap ul li .Col{
	position: relative;
}
.ChatBoxWrap .ListWrap ul li .Col .ImgWrap{
	line-height: 0;
	overflow:hidden;
	border-radius: 5px;
}
.ChatBoxWrap .ListWrap ul li .Col .ImgWrap img{
	 -moz-transition:all 0.3s ease-in-out;
    -webkit-transition:all 0.3s ease-in-out;
    transition:all 0.3s ease-in-out;
    width: 100%;
    border-radius: 5px; 
}
.ChatBoxWrap .ListWrap ul li a:hover .Col .ImgWrap img{
	transform: scale(1.1,1.1);
}
.ChatBoxWrap .ListWrap ul li .Col .Name{
	background-color:#de00a5;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 5px; 
	border-radius: 0px 0px 5px 5px;
}
.ChatBoxWrapTop .ListWrap ul li .Col > .Name h5.Title,
.ChatBoxWrapBottom .ListWrap ul li .Col .Name h5.Title,
.ChatBoxWrap .ListWrap ul li .Col .Name h6 a,
.ChatBoxWrap .ListWrap ul li .Col .Name h6{
	font-family: 'Europa','Helvetica Neue',Arial,sans-serif !important;
    font-weight: 600;
    font-size: 16px;
    line-height: 1.3;
    color: #fff;
}
.ChatBoxWrap .ListWrap ul li .Col .Name h6 a:hover{
	text-decoration: underline;
}
.ChatBoxWrapBottom .ListWrap ul li .Col .Name h5.Title{
    margin: 0px;
}

.ChatBoxWrapTop{
    display: none;
}
.ChatBoxWrapBottom{
    display: none !important;
}
/** Chat Box Css End **/




/** 271020 vish **/
#sgpb-popup-dialog-main-div{
    -webkit-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2) !important;;
    -moz-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2) !important;;
    box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2) !important;
    border-bottom-width: 0 !important;
    border-bottom-color: #fff !important;
} 



/** Bottom Banner Start **/
#footerbanner {
    background-color: #fff !important;
    position: fixed;
    width: 100%;
    z-index: 10000;
    bottom: -262px; /*-264px*/
    height: max-content;
    border-top: 1px solid #ededee; 
	-webkit-box-shadow: 0px 0px 15px 0px rgb(0 0 0 / 20%);
    -moz-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
    box-shadow: 0px 0px 15px 0px rgb(0 0 0 / 20%);
}
#footerbanner .BottomBannerWrap{
	position: relative;
	width: 1100px;
    margin: 10px auto;
}
#footerbanner .BottomBannerWrap #close_bb{
	position:absolute;
	text-indent: -999999px;
    display: block;
    background-image: url(https://cdn-wordpress-info.futurelearn.com/info/wp-content/themes/futurelearn/resources/images/closebutton.png);
    width: 21px;
    height: 21px;
    top: 0px;
    right: -30px;
    z-index: 9;
}
#footerbanner .BottomBannerWrap .BannerLogoAndText{
	display: flex;
	align-items: center;
	justify-content: center;
}
#footerbanner .BottomBannerWrap .BannerLogoAndText .LogoCol{
	width: 125px;	
	margin-right: 50px;
}
#footerbanner .BottomBannerWrap .BannerLogoAndText .Text{
	font-size: 20px;
    line-height: 1.5;
	display: flex;
	align-items: center;
}
#footerbanner .BottomBannerWrap .BannerLogoAndText h6{
	color: #de00a5;
    font-size: 20px;
    line-height: 1.3;
    margin-bottom: 0px;
    margin-left: 10px;
}
#footerbanner .BottomBannerWrap .ListWrap{
	margin-top: 12px;
}
#footerbanner .BottomBannerWrap .ListWrap ul{
	padding: 0px;
    margin: 0;
    display: flex;
	list-style-type: none;
}
#footerbanner .BottomBannerWrap .ListWrap ul li{
	width: 250px;
	margin-right: 33px;
}
#footerbanner .BottomBannerWrap .ListWrap ul li:last-child{
	margin-right: 0px;
}
#footerbanner .BottomBannerWrap .ListWrap ul li .Col{
	position: relative;
	overflow: hidden;
}
#footerbanner .BottomBannerWrap .ListWrap ul li .Col .ImgWrap{
	line-height: 0;
	border-radius: 5px;
	overflow: hidden;
}
#footerbanner .BottomBannerWrap .ListWrap ul li .Col .ImgWrap img{
	border-radius: 5px;
	max-width: 100%;
	transition: all 0.3s ease-in-out;
    min-height: 168px;
}
#footerbanner .BottomBannerWrap .ListWrap ul li a:hover .Col .ImgWrap img{
	transform: scale(1.1,1.1);
}
#footerbanner .BottomBannerWrap .ListWrap ul li .Col h5.Title{
	position: absolute;
    background-color: #de00a5;
    color: #fff;
    font-size: 15px;
    line-height: 1.2;
    text-transform: uppercase;
    bottom: 0;
    left: 0;
    margin: 0;
    width: 100%;
    border-radius: 0px 0px 5px 5px;
    padding: 7px 40px 7px 10px;
    font-weight: 400;
    letter-spacing: 0.5px;
}
#footerbanner .BottomBannerWrap .ListWrap ul li .Col h5.Title::after{
	content: '';
	position: absolute;
	background: url(https://cdn-wordpress-info.futurelearn.com/wp-content/themes/futurelearn/resources/images/next-white-arrow.png) no-repeat;
	width: 18px;
	height: 18px;
	top: 50%;
	right: 10px;
	margin-top: -9px;
}
/** Bottom Banner End **/






@media only screen and (min-width:1225px) and (max-width:1280px) {}
@media only screen and (min-width:320px) and (max-width:1224px) {}
@media only screen and (min-width:320px) and (max-width:1024px) {
	/*#footerbanner{
		display: none !important;
	}*/
    #footerbanner .BottomBannerWrap{
        width: 94% !important;
    }
    #footerbanner .BottomBannerWrap #close_bb{
        top: -20px !important;
        right: 5px !important;
    } 
   .ChatBoxWrapBottom{
        display: none !important;
    }
    .ChatBoxWrap {
        width: 100%;
        height: auto;
        bottom: 0px;
        border-radius: 0px;
        padding: 15px 12px;
        background-color: #f3f3f4;
        display: none !important;
    } 
    .ChatBoxWrapTop {
        position: relative;
        bottom: auto;
        right: auto;
        border-radius: 0px;
        width: 100%;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow:none;
        background-color: #fff;
        margin-bottom: 30px;
        padding: 0px 0px;
        display: block;
    }
    .ChatBoxWrapBottom {
        position: fixed;
        bottom: 0px;
        width: 100%; 
        border-radius: 0px;
        padding: 15px 12px;
        background-color: #f3f3f4;  
       /* display: block !important; */
    }
    .boxclose {
        bottom: auto;
        top: -17px;
        right: 6px;
    }
    .boxclosebottom{
        bottom: auto;
        top: -17px;
        right: 6px;
    }
    .ChatLogoWrap,
    .ChatBoxWrap .ShortDesc,
    .ChatBoxWrap .ListWrap ul li:nth-child(2),
    .ChatBoxWrap .ListWrap ul li:nth-child(3),
    .ChatBoxWrap .ListWrap ul li:nth-child(4){
        display: none;
    }
    .ChatBoxWrap .ListWrap ul {
        grid-template-columns: repeat(auto-fit,100%);
        grid-gap: 0;
        margin-bottom: 0px;
    }
    .ChatBoxWrapTop .ListWrap ul {
        grid-template-columns: repeat(auto-fit,100%);
        grid-gap: 0;
        margin-bottom: 0px;
        padding-left: 0px
    }
    .ChatBoxWrapBottom .ListWrap ul {
        grid-template-columns: repeat(auto-fit,100%);
        grid-gap: 0;
        margin-bottom: 0px;
        padding-left: 0px
    }
    .ChatBoxWrap .ListWrap ul li,
    .ChatBoxWrapTop .ListWrap ul li,
    .ChatBoxWrapBottom .ListWrap ul li{
        display: inline-block;
        position: relative;
    }
    .ChatBoxWrapTop .ListWrap ul li,
    .ChatBoxWrapBottom .ListWrap ul li{
        width: 100%;
    }
    .ChatBoxWrap .ListWrap ul li .Col,
    .ChatBoxWrapTop .ListWrap ul li .Col,
    .ChatBoxWrapBottom .ListWrap ul li .Col  {
        position: relative;
    }
    
    .ChatBoxWrapTop .ListWrap ul li .Col{
        display: flex;
    }
    .ChatBoxWrap .ListWrap ul li .Col .ImgWrap,
    .ChatBoxWrap .ListWrap ul li .Col .ImgWrap img,
    .ChatBoxWrapTop .ListWrap ul li .Col .ImgWrap,
    .ChatBoxWrapTop .ListWrap ul li .Col .ImgWrap img,
    .ChatBoxWrapBottom .ListWrap ul li .Col .ImgWrap,
    .ChatBoxWrapBottom .ListWrap ul li .Col .ImgWrap img {
        border-radius: 0;
        width: 60px;
        height: 51px;
        position: absolute;
        left: 0;
        z-index: 2;
    }
    .ChatBoxWrapTop .ListWrap ul li .Col .ImgWrap,
    .ChatBoxWrapTop .ListWrap ul li .Col .ImgWrap img  {
        width: 70px;
        height: 60px;
        position: absolute;
        display: inline-block;
        left: 0px;
    }

    .ChatBoxWrap .ListWrap ul li .Col .Name,
    .ChatBoxWrapTop .ListWrap ul li .Col .Name,
    .ChatBoxWrapBottom .ListWrap ul li .Col .Name {
        position: inherit;
        bottom: inherit; 
        left: inherit;
        z-index: 1;
        width: 100%;
        padding: 15px 5px 15px 60px;
        border-radius: 0px 0px;
        background-color:#de00a5;
    }
    .ChatBoxWrapBottom .ListWrap ul li .Col .Name{
       padding: 16px 5px 16px 70px; 
       display: table;
    }
    .ChatBoxWrapTop .ListWrap ul li .Col .Name {
        padding: 0px 0px 0px 90px;
        position: relative;
        display: table;
        /* width: calc(100% - 70px); */
        min-height: 60px;
        /* vertical-align: middle; */
        text-align: center;
        box-sizing: border-box;
    }
    .ChatBoxWrap .ListWrap ul li .Col .Name h6 a, 
    .ChatBoxWrap .ListWrap ul li .Col .Name h6{
        /*text-align: left;*/
        margin-bottom: 0;
        color: #fff;
    }
    .ChatBoxWrapTop .ListWrap ul li .Col .Name h6 a, 
    .ChatBoxWrapTop .ListWrap ul li .Col .Name h6,
    .ChatBoxWrapBottom .ListWrap ul li .Col .Name h6 a, 
    .ChatBoxWrapBottom .ListWrap ul li .Col .Name h6 {
        padding: 0px;
        color: #fff;
        margin-bottom: 0; 
        display: table-cell;
        vertical-align: middle;
        text-align: center;
    }
    .ChatBoxWrapBottom .ListWrap ul li .Col .Name,
    .ChatBoxWrapTop .ListWrap ul li .Col .Name{
        display: flex !important;
        align-items: center;
        justify-content: center;
        padding:5px 10px !important;
        min-height: inherit  !important;
    }
    .ChatBoxWrapTop .ListWrap ul li .Col .Name{
        min-height: 60px !important;
    }

}
@media only screen and (min-width:481px) and (max-width:768px) {}
@media only screen and (min-width:481px) and (max-width:667px) {}
@media only screen and (min-width:320px) and (max-width:480px) {
    .ChatBoxWrap {
		width: 100%;
		height: auto;
		bottom: 0px;
		border-radius: 0px;
		padding: 15px 12px;
        background-color: #f3f3f4;
        display: none !important;
	} 
    .ChatBoxWrapTop {
        position: relative;
        bottom: auto;
        right: auto;
        border-radius: 0px;
        width: 100%;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow:none;
        background-color: #fff;
        margin-bottom: 30px;
        padding: 0px 0px;
        display: block;
    }
    .ChatBoxWrapBottom {
        position: fixed;
        bottom: 0px;
        width: 100%; 
        border-radius: 0px;
        padding: 15px 12px;
        background-color: #f3f3f4;  
       /* display: block !important; */
    }
	.boxclose {
		bottom: auto;
		top: -17px;
		right: 6px;
	}
    .boxclosebottom{
        bottom: auto;
        top: -17px;
        right: 6px;
    }
	.ChatLogoWrap,
	.ChatBoxWrap .ShortDesc,
	.ChatBoxWrap .ListWrap ul li:nth-child(2),
	.ChatBoxWrap .ListWrap ul li:nth-child(3),
	.ChatBoxWrap .ListWrap ul li:nth-child(4){
		display: none;
	}
    .ChatBoxWrap .ListWrap ul {
        grid-template-columns: repeat(auto-fit,100%);
		grid-gap: 0;
		margin-bottom: 0px;
    }
    .ChatBoxWrapTop .ListWrap ul {
        grid-template-columns: repeat(auto-fit,100%);
        grid-gap: 0;
        margin-bottom: 0px;
        padding-left: 0px
    }
    .ChatBoxWrapBottom .ListWrap ul {
        grid-template-columns: repeat(auto-fit,100%);
        grid-gap: 0;
        margin-bottom: 0px;
        padding-left: 0px
    }
	.ChatBoxWrap .ListWrap ul li,
    .ChatBoxWrapTop .ListWrap ul li,
    .ChatBoxWrapBottom .ListWrap ul li{
		display: inline-block;
		position: relative;
	}
    .ChatBoxWrapTop .ListWrap ul li,
    .ChatBoxWrapBottom .ListWrap ul li{
        width: 100%;
    }
	.ChatBoxWrap .ListWrap ul li .Col,
    .ChatBoxWrapTop .ListWrap ul li .Col,
    .ChatBoxWrapBottom .ListWrap ul li .Col  {
		position: relative;
	}
    
    .ChatBoxWrap .ListWrap ul li .Col .ImgWrap,
	.ChatBoxWrap .ListWrap ul li .Col .ImgWrap img,
    .ChatBoxWrapTop .ListWrap ul li .Col .ImgWrap,
    .ChatBoxWrapTop .ListWrap ul li .Col .ImgWrap img,
    .ChatBoxWrapBottom .ListWrap ul li .Col .ImgWrap,
    .ChatBoxWrapBottom .ListWrap ul li .Col .ImgWrap img {
        border-radius: 0;
		width: 60px;
		height: 51px;
		position: absolute;
		left: 0;
		z-index: 2;
	}
    .ChatBoxWrapTop .ListWrap ul li .Col .ImgWrap,
    .ChatBoxWrapTop .ListWrap ul li .Col .ImgWrap img  {
        width: 70px;
        height: 60px;
        position: absolute;
        display: inline-block;
        left: 0px;
    }

	.ChatBoxWrap .ListWrap ul li .Col .Name,
    .ChatBoxWrapTop .ListWrap ul li .Col .Name,
    .ChatBoxWrapBottom .ListWrap ul li .Col .Name {
        position: inherit;
        bottom: inherit; 
        left: inherit;
		z-index: 1;
		width: 100%;
		padding: 15px 5px 15px 60px;
		border-radius: 0px 0px;
        background-color:#de00a5;
    }
    .ChatBoxWrapBottom .ListWrap ul li .Col .Name{
       padding: 16px 5px 16px 70px; 
       display: table;
    }
    .ChatBoxWrapTop .ListWrap ul li .Col .Name {
        padding: 0px 10px 0px 80px;
        position: relative;
        display: table;
        /* width: calc(100% - 70px); */
        min-height: 60px;
        /* vertical-align: middle; */
        text-align: center;
        box-sizing: border-box;
    }
	.ChatBoxWrap .ListWrap ul li .Col .Name h6 a, 
	.ChatBoxWrap .ListWrap ul li .Col .Name h6{
		/*text-align: left;*/
        margin-bottom: 0;
        color: #fff; 
	}
    .ChatBoxWrapTop .ListWrap ul li .Col .Name h6 a, 
    .ChatBoxWrapTop .ListWrap ul li .Col .Name h6,
    .ChatBoxWrapBottom .ListWrap ul li .Col .Name h6 a, 
    .ChatBoxWrapBottom .ListWrap ul li .Col .Name h6 {
        padding: 0px;
        color: #fff;
        margin-bottom: 0;
        display: table-cell;
        vertical-align: middle;
        text-align: center;
    }
	
} 

@media only screen and (max-width:320px){
    /*.ChatBoxWrap,
    .ChatBoxWrapTop,
    .ChatBoxWrapBottom {
        padding: 26px 16px;
    }*/
    .ChatBoxWrapBottom .ListWrap ul li .Col .ImgWrap,
    .ChatBoxWrapBottom .ListWrap ul li .Col .ImgWrap img {
        width: 50px;
        height: 48px; 
    }
    .ChatBoxWrapBottom .ListWrap ul li .Col .Name h6 a, 
    .ChatBoxWrapBottom .ListWrap ul li .Col .Name h6 {
       font-size: 14px;
    }
    .ChatBoxWrapBottom .ListWrap ul li .Col .Name {
        padding: 16px 8px 16px 58px;
    } 
}
