body { background : #f7f5f1; }
p { margin : 0; }
.zeropadding { padding: 0; }
.img-fluid { max-width : 100%; height : auto; }
.float-left { float: left; }
.text-left { text-align: left; }
.float-right { float: right; }
.text-right { text-align: right; }
.text-center { text-align : center; }
.opensans_regular { font-family: 'Open Sans', sans-serif; }
.Montserrat_regular { font-family: 'Montserrat', sans-serif; }
.opensans_semibold { font-family: 'Open Sans', sans-serif; font-weight : 600; }
.opensans_bold { font-family: 'Open Sans', sans-serif; font-weight : 700; }
.tfs { color : #253873; }
.bfe { color : #b58e5b; }
.tet { color : #2e2e2e; }
.fof { color : #f15b5b; }

footer {
    background: rgb(36, 57, 120);
    padding: 80px 0px;
    display: inline-block;
}

body { float : left; width : 100%; position : relative; clear : both; padding: 0;    margin: 0 auto; font-family: 'Open Sans', sans-serif; font-size : 14px; line-height: 18px; overflow-x : hidden; }
.fullcols { float : left; width : 100%; position : relative; clear : both; padding: 0;    margin: 0 auto;}
.sections { float : left; width : 100%; position : relative; clear : both; padding : 2em 0; margin : 0 auto; }
.containers { float : left; width : 90%; position : relative; clear : both; margin : 0 5%; }

.refers_left h1 { font-family: 'Montserrat', sans-serif; font-weight : 600; }
.works_heads h2 { font-family: 'Montserrat', sans-serif; font-weight : 600; line-height: 45px; }



.desktop_heads {  background : #253873 !important;  padding : 1px 0; }
.head_logo { float : left; }
.head_menu { float : right; }
.header ul {  width: 100%;  padding: 0;   margin: 1.5em 0 0 0; list-style-type: none;  }
.header ul li { display: inline-block; text-align: center;     margin: 0 10px; }
.header ul li a { color : #fff; text-decoration: none; font-family: 'Open Sans', sans-serif; font-size : 14px; }


.refers_left h1 { padding : 0.5em 0 2em 0; }
.refers_left .love { padding : 0 0 10px 0; font-size : 18px; }
.refers_left .spreads { padding : 0 0 10px 0; font-size : 15px; line-height: 18px; }
.refers_left .learnmore { padding : 2.5em 0 0em 0; }
.refers_left .learnmore a { /* background: #253873;  */ color: #fff;  text-decoration: none;  padding: 8px 35px 10px 35px;  border-radius: 30px; font-size : 15px; } 

.works_heads { }
.works_heads h2 {  }

.works_view { /* background : #f9f6f2; */ }
.wv_heads { color : #f15b5b; padding : 0 0 15px 0; font-size : 20px;     font-weight: 600; }
.wv_paras {  color : #253873; padding : 0; font-size : 14px; font-weight: 500; }
.works_right { margin : 0 1em 0; }

.works_view_one { text-align: center;  display: inline-block; }
.works_view_two p i { border-top : 1px solid #93918f; padding : 0; }


.refer_text { color : #000; font-size : 14px; padding : 1em 0;   min-height: 9em; }
.refer_text strong { color : #2e2e2e; font-size : 14px; font-weight : normal; }
.refer_show_rose { float : left; width :100%; }
.refer_show_rose span { background : #f15b5b; color:#fff; padding : 8px 3em 9px; border-radius: 30px; line-height: 40px; font-weight :500; }
.refer_show_blue { float : left; width :100%; }
.refer_show_blue span { background : #253773;  color : #fff; padding :8px 3em 9px; border-radius: 30px; line-height: 40px; font-weight :500;}

.terms_view { }
.terms_view ul { list-style-type : none; }
.terms_view ul li { font-family: 'Open Sans', sans-serif;  color: #000;  font-size: 14px;  float: left;  width: 100%;  margin: 10px 0;
 line-height: 24px; }
.terms_view ul li span.dots { background-image: url(images/check.svg);  content: ""; display: block;  width: 2.5%;  height: 26px;
    background-size: 20px;  background-repeat: no-repeat;  background-position-Y: 2px;  padding: 0;  float: left; }

.refers_head {  padding: 3% 0 0 0; }
.refers_head h1 strong { color: #253873;   border-bottom: 5px solid #f15b5b; }
.refers_left h1 span:first-child { line-height: 60px; font-size : 42px;	  }
.refers_left h1 span:last-child { line-height: 50px; font-size : 46px;	  }

#child  { background : #f6f4f0; }
#promise  { background : #f6f4f0; }
#programme  { background : #f9f6f2; }


#child p { line-height: 27px; font-size: 16px;  margin: 0 0 1em 0; }



#programme p { line-height: 27px; font-size: 16px;  margin: 0 0 1em 0; }

#promise p { line-height: 27px; font-size: 16px;  margin: 0 0 1em 0; }




.works_heads h3 { font-size : 17px; }
.works_heads h3 span { font-size : 17px; color : #f15b5b; }
.invite_form { /*  background : #f4f5f8;  */ }
.invite_form body { background : transparent !important; }

.this_works { float: left; width : 70%; padding : 0 15%;  }
.this_works_left {  float: left;   width: 25%;}
.this_works_center { float: left;  width: 50%; padding: 3em 0 0 0;  }
.this_works_right { float: left; width: 25%;     text-align: right;}

.this_works_last { float: left; width : 70%; padding : 5% 15% 3% 15%; }
.cashback { float: left;   width: 40%; }
.cashback_left { float: left;   width: 50%;  }
.cashback_right { float: left;   width: 50%; margin: 5% 0 0 0; }
.rewards { float: right;   width: 40%; }
.rewards_left { float: left;   width: 50%; margin: 5% 0 0 0; }
.rewards_right { float: left; text-align : right;  width: 50%; }
.rewards_right img { margin : 0 0 0 30px; }


@media screen and (max-width: 540px) {
/* .refers_left h1:after { background: url("images/Referal-bg.svg") no-repeat center center;  content: " "; position: relative;  width: 100%;
 height: 150px;  float: left;  margin: 1em 0 0em 0;  background-size: contain; } */
.refers_right {   } 
.refers_left h1 { padding : 0em 0 1em 0; }
.terms_view ul li span.texts { width: 90%; float : left;}
.terms_view ul li span.dots{ width: 10%; }
}

@media screen and (min-width: 541px) and (max-width: 767px) {
	
	
#child h2 { line-height: 30px; font-size : 20px; margin: 0 0 0.5em 0; }
#programme h2 { line-height: 30px; font-size : 20px; margin: 0 0 0.5em 0; }
#promise h2 { line-height: 30px; font-size : 20px; margin: 0 0 0.5em 0; }

.refers_left h1:after { /* background: url(images/Referal-bg.svg) no-repeat center center;  content: " ";  position: absolute;  width: 200px;
height: 200px;  margin: 0 auto;  background-size: contain; right: -3em; top: -1em;  */}
.refers_right {/*  display : none; */ } 
.refers_left h1 { padding : 0em 0 2.5em 0; }
.terms_view ul li span.texts { width: 95%; float : left; }
.terms_view ul li span.dots{ width: 5%; }
.works_heads iframe { height : 45em; }

}

@media screen and (orientation:landscape)
and (min-device-width: 361px) 
and (max-device-width: 767px) {
#popout {  width: 40%; max-width: 40%; }
}


@media screen and (max-width: 767px) {
body { font-size : 13px; overflow-x : hidden; }
.containers {  width : 94%; margin : 0 3%; }
.refers_left h1 { line-height: 40px; font-size :30px; text-align: center;  }  
.refer_count { float : left; width : 100%; }
.works_heads h2 {font-size :20px; }
.works_two_right { width :100%; }
.works_fig_top, .works_fig { float : left; width: 25%; margin : 0 auto; }
.works_right_top, .works_right { float : right; width: 73%;  margin : 0 auto; }
.works_right_top .wv_heads, .works_right_top .wv_paras { float : left; text-align : left; font-size : 15px; }
.works_right .wv_heads, .works_right .wv_paras  { float : left; text-align : left; font-size : 15px; }
.works_two_left { padding : 2em 0; }
.works_two_left, .works_two_right { width : 100%; }
.refer_count { 	text-align: center; margin: 0; }
.refer_text { min-height : 3em; }
.terms_view ul { width: 96%;  padding: 0 2%; }

.show_desktop { display : none; }
.show_mobile { display : block; }
.howdoes { padding: 5% 0 5% 0; }

.how_left { float: left;  width: 50%; padding: 8% 2% 0 0; }
.how_heads { color: #f15b5b;  padding: 0 0 10px 0;  font-size: 15px;  }
.how_paras { color: #2e2e2e;  padding: 0 0 10px 0;  font-size: 15px; }
.how_right { float: right; width: 48%; }
.how_right img { }
.refer_mobile { padding: 1em 0 3em 0; }

.head_logo { text-align: center;  width: 100%;}
.xs_zeropadding { padding : 0; margin : 0; }

.head_menu { display : none; }
.head_logo { text-align: left;  width: 75%;}
.mobile_menus { float: right; width: 20%;  margin: 1em 0 0 0; cursor : pointer;  height: 60px; }
.mobile_menus span { float: right; width: 50px;  height: 2px;   background: #fff;   padding: 0px; margin: 5px;  text-align: center; clear : both; }
.mobile_menus_close { float: right; width: 20%;  margin: 1em 0 0 0; cursor : pointer; }
.mobile_menus_close span { float: right;  width: auto;  padding: 0px;  margin: 5px;  text-align: center; color: #fff; font-size: 30px; font-weight: normal;} 

#all_menus { float: left; background: #253873;  width: 100%;  padding: 0;  margin: 0;  position: absolute;  z-index: 9999;  left: 0;  top: 75px; }
#all_menus ul { width :100%; padding: 0; }
#all_menus ul li { width :100%; padding: 10px 0; }
.desktop_heads .containers { padding : 0; margin : 0; width :100%; }
.head_view { float : left; padding : 0 2%; width :96%; }
.header { position: fixed; z-index: 9999;}
#home {  margin-top: 5em; }

.heads_hopes p, .footer_hopes p {  padding: 10px 2% !important;  width: 96%; }
.refers_left h1 span:first-child {  line-height: 40px;  font-size: 26px; }
.refers_left h1 span:last-child {   line-height: 40px;  font-size: 30px; }
.refers_left .love, .refers_left .spreads, .refers_left .learnmore a, .how_heads, .how_paras, .terms_view ul li span.texts {  font-size: 14px; }
.refers_left .spreads {   float : left; }
.refers_left .learnmore a { }
.refers_left .learnmore {  padding: 1.5em 0 0em 0; }
.how_right { margin: 10% 0 0 0; }
.how_earn { margin-top: 15%; }
.how_rewards { margin-top: 15%; }
.works_heads iframe { height : 45em !important; }

#popout img {   margin: 0 10px 0 0;   max-width: 96%;   height: auto;   padding: 0 2%; }

.refers_cols_left, .programme_left, .programme_right, .promise_left, .promise_right { width : 100%; text-align  :center; }
.refers_cols_right { width : 100%; }

.the_works_left { float :  left; width : 100%; text-align  :center !important; margin : 0 0 2em 0; }
.the_works_middle { float :  left; width : 100%; margin : 4em 0 4em 0; text-align  :center !important; }
.the_works_last { float :  left; width : 100%;  text-align  :center !important;  margin : 2em 0 0 0; }
.the_works_left img, .the_works_middle img, .the_works_last img { margin : 0 auto 5% auto; }
.the_works_left p, .the_works_middle p, .the_works_last p { float :  left; width : 100%;  text-align  :center !important;}

.refers_left { width : 100%; }
.refers_right { width : 100%; }

#child h2, #programme h2, #promise h2 { padding-bottom: 2em; line-height: 26px; font-size: 20px; }

.refers_left { width : 100%; }
.refers_right { width : 100%; }
.invite_form, #howwork, .works_view  { padding : 0 !important; }


}



@media screen and (min-width: 768px) and (max-width: 1024px) {
	
	

.head_logo { text-align: center;  width: 100%;}
.xs_zeropadding { padding : 0; margin : 0; }

.head_menu { display : none; }
.head_logo { text-align: left;  width: 75%;}
.mobile_menus { float: right; width: 20%;  margin: 1em 0 0 0; cursor : pointer;  height: 60px; }
.mobile_menus span { float: right; width: 50px;  height: 2px;   background: #fff;   padding: 0px; margin: 5px;  text-align: center; clear : both; }
.mobile_menus_close { float: right; width: 20%;  margin: 1em 0 0 0; cursor : pointer; }
.mobile_menus_close span { float: right;  width: auto;  padding: 0px;  margin: 5px;  text-align: center; color: #fff; font-size: 30px; font-weight: normal;} 

#all_menus { float: left; background: #253873;  width: 100%;  padding: 0;  margin: 0;  position: absolute;  z-index: 9999;  left: 0;  top: 75px; }
#all_menus ul { width :100%; padding: 0; }
#all_menus ul li { width :100%; padding: 10px 0; }
.desktop_heads .containers { padding : 0; margin : 0; width :100%; }
.head_view { float : left; padding : 0 2%; width :96%; }
.header { position: fixed; z-index: 9999;}
.terms_view ul li span.texts {  width: 97% !important; }	
.terms_view ul li span.dots { width: 3% ! important; }

.refers_left h1 { line-height: 50px;  }
.refers_left h1 span:first-child { font-size :40px;  }
.refers_left h1 span:last-child { font-size :45px; }
/* .refers_left h1:after { background: url("images/Referal-bg.svg") no-repeat center center;  content: " ";  position: absolute;  width: 270px; height: 200px;  margin: 0 auto;  background-size: contain;   left: auto; } */
.refers_right { display : none; } 
.works_two_left {width: 55%;} 
.works_two_right { width: 45%;}
.works_right  { margin : 0;}
.refers_left h1 { padding: 0em 10% 2em 0; }
.this_works { float: left;  width: 90%;  padding: 0 5%; }
.this_works_last { float: left; width: 90%; padding: 5% 5% 3% 5%;}
.refer_text {  min-height:11em; }
}

@media screen and (min-width: 768px){ 
.works_heads h2 {font-size :26px; }
.refer_count { float : left; width : 23%; padding : 0 1%; text-align : center; }
.works_view_one { padding : 1em 0 2em 0; }
.works_view_two  { padding : 0 0 2em 0; }
.works_fig_top { text-align: center;  display: inline-block; }
.header  {  position: fixed;  height: 85px; z-index: 999;  left: auto;  right: auto;  top: 0; width: 100vw; }
.content_overview { margin-top : 85px; width: 100vw; }
.show_desktop { display : block; }
.show_mobile { display : none; }
.works_two_right {  margin-top: 1em; }

.refers_left .spreads span { float : left; width : 100%; }
.refers_head { padding: 3% 0 0 0; float: left; width: 100%; margin: 0 auto; position: relative; }
.terms_view ul li span.dots {  width: 2%; }
.terms_view ul li span.texts { float : right; width: 98%; }
.works_heads iframe { height : 43em !important; }
.refer_count img { height : 150px; }


.refers_cols_left { width : 40%; }
.refers_cols_right { width : 60%; }

.programme_left { width : 65%; }
.programme_right { width : 30%; }

.promise_left { width : 45%; }
.promise_right { width : 53%; }

.the_works_left { float :  left; width : 40%; }
.the_works_middle { float :  left; width : 25%; }
.the_works_last { float :  left; width : 35%; }
.the_works_last div img { float :  right;   }

.the_works_left img, .the_works_middle img, .the_works_last img { margin : 0 0 3% 0; }
.the_works_middle { }
.the_works_last { }


#home { background-image: url(media/Childs-bg.png) !important;  background-position: top center;  background-repeat-x: no-repeat;  background-color: #fff; }


#child h2, #programme h2, #promise h2 { font-size: 26px;  line-height: 35px; margin-bottom: 0.5em; } 
#child h2:after, #programme h2:after, #promise h2:after  { content: " "; position: relative; width:4%;height: 3px; float: left;border-top: 5px solid #f15b5b; margin: 0 48%;}
.works_heads h2:after { content: " "; position: relative; width: 4%;height: 3px; float: left;border-top: 5px solid #f15b5b; margin: 0 48%; }

}

.desktop_heads { padding: 10px 0; }
.heads_hopes, .footer_hopes { border-bottom: 4px solid rgb(185, 151, 91);  background: rgba(0, 0, 0, 0) linear-gradient(to right, rgb(181, 142, 91) 5%, rgb(146, 115, 74) 50%, rgb(181, 142, 91) 95%) repeat scroll 0% 0%;}
.heads_hopes p, .footer_hopes p  { padding : 10px 0; }
.heads_hopes p a, .footer_hopes p  { color: #fff;    text-decoration: none;}

.works_two_left img { margin : -2em 0 0 0; }
.works_two_right img { margin : -1em 0 0 0; }

#main_nav li a.active { color: #b9975b;}

.how_right img { margin : -2em 0 0 0 }

.refers_left ul   { list-style-type: none;   margin :  0 auto; float : left; width : 100%; padding : 0 0 10px 0; }
.refers_left ul li   {  list-style-type: none;   display: flex;  margin: 0 auto;  }

.refers_left ul li::before {   background-image: url("images/check.svg"); content: "";  display: block;  width: 30px;   height	: 26px; padding: 1px;   background-size: 20px;   background-repeat: no-repeat;  background-position-Y: 2px;  margin-right: 5px;  flex-shrink: 0; }


#refer_form { padding : 0 !important;  margin : 0 !important; }
.works_heads iframe { height : 45em; }

#popout {   position: fixed;   right: 0;  left: auto;  bottom: 10px; }
#popout span { position: absolute;  top: -15px;  right: 0px;   color: rgb(255, 255, 255);   background: rgb(119, 119, 119); height: 20px;  width: 20px;  cursor: pointer;   padding: 6px;   border-radius: 100%; }
#popout img {margin  : 0 10px 0 0; }



@media screen and (min-width: 1150px) and (max-width: 1366px) {
.works_heads iframe { height : 29em; }
}


@media screen and (min-width: 1367px){
.works_heads iframe { height : 31em; }	
}
 
 .hlt { font-size : 18px; }
 
