/* CSS Document */

body{ background:#FFFFFF; font-family: 'Roboto Slab', serif;  width: 100%;
  overflow-x: hidden}

.navbar {
    border-radius: 0px;
}
.navbar-nav {
    float: right;
    
.navbar-default .navbar-nav>li>amargin: 0;
}
.navbar-default {
   background-image: linear-gradient(to right, #de0049, #a5043b);
    border-color: #e7e7e7;
}
.navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:focus, .navbar-inverse .navbar-nav>.active>a:hover {
    color: #fff;
    background-color: transparent;
	border-bottom: 2px solid #fff;
} 
.navbar {
	margin-bottom:0;
}
.navbar-default .navbar-nav>li>a {
    color: #fff;
}
.navbar-default .navbar-brand {
    color: #fff;
}
.container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header {
	 background-image: none;
	 border:transparent;
}
.navbar-inverse {
     background:transparent;
	 border-color:transparent;
}


.navbar-inverse .navbar-nav>li>a {
    color: #fff;
}
.navbar-inverse .navbar-brand {
    color: #ffff;
}
.navbar-btn {
    margin-top: 11px;
    margin-bottom: 11px;
}
.btn-danger {
    color: #fff;
    background-color: #280aa3;
    border-color: #280aa3;
	padding: 3px 8px;
    border-radius: 25px;
}
.btn-danger:hover {
    color: #fff;
    background-color: #280aa3;
    border-color: #280aa3;
	box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%)
}

.btn:hover{}
.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover {
    color: #fff;
    background-color: transparent;
	border-bottom: 2px solid #fff;
}
.footer_btm{
	width: 100%;
    height: 484px;
    background-image:url(../images/Group_199.png);
    background-size: 100%;
	}
.footer_btm h4{
	color:#fff;
	text-align:center;
	margin-top:164px;
}
.footer_btm h3 {
    font-size: 22px;
    color: #fff;
    margin-bottom: 18px;
}
.footer_btm h2{ color:#fff; text-align:center;}
.footer_btm  ul{ padding-left:0;}
.footer_btm  ul li{ list-style:none;}
.footer_btm a { color: #fff;}
.footer_btm a:hover { color: #fff; border-bottom:0px solid #fff;}
.secure_payment h4{ 
	color:#fff; font-size:22px; 
	float:left; margin-top:20px;
	margin-right:119px;
}
.ftr_paytm{ float:left;}
.ftr_gpay{ float:left;}
.ftr_bhim{ float:left;}
.soci_icon {
    border: 1px solid #fff;
    width: 35px;
    height: 35px;
    background: #fff;
    border-radius: 50%;
    text-align: center;
    margin-right: 10px;
    line-height: 14px;
	display:inline-block;
}
.soci_icon:hover{box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%)}
.soci_icon .fa{
	font-size: 22px;
    line-height: 34px;
    background: transparent;
	color: #a5043b;
	}
.social_icon_row{ text-align:center; position:relative;}
.pay_img{ 
	width:60px; 
	height:56px; 
	margin:10px 15px;
}
.bottom_Section{ 
	padding:20px 0;
 	background:#f9dec5; 
 	color:#790931;
}
.bottom_Section h3{ font-weight:400; font-size:21px;}
.slash{ font-size:53px; font-weight:300; } 
.register_section{ 
	background:url(../images/Group_1.png)center top no-repeat;
	width:100%;
	height:857px;
	background-size:cover;
}
.register_section label{font-weight:500;}
.Register{ background-color:#f9dec5; 
	border-radius:3px;
	margin-top:50px;
	padding:15px 24px;
}
.register_btn{
	color: #fff;
    background-color: #280aa3;
    border-color: #280aa3;
	padding: 3px 8px;
	width:130px;
	text-align:center;
    border-radius: 25px;
	margin-left:auto;
	margin-right:auto;
	color:#fff;
	margin-bottom:20px;
}
.register_btn .fa{ padding-right:5px;}
.register_form{
	color:#e5004b;
	margin-bottom:10px;
}
.radio-item input[type=radio]:checked + label:after { color:red;
}
input[type=checkbox], input[type=radio] {
    margin-right: 5px;
}
.candidate_info  input{
    width: 100%;
    margin-bottom: 12px;
    border-radius: 20px;
    border: 1px solid #fff;
    padding: 5px 8px;
	color:#e5004b;
}
.candidate_info label{
	color:#e5004b; 
	padding-left:4px; 
}
.can_reg_btn {
    color: #fff;
    background-color: #280aa3;
    border-color: #280aa3;
	padding: 3px 8px;
    border-radius: 25px;
	width: 110px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
	margin-top:10px;
}
.can_reg_btn:hover {
    background-color: #280aa3;
    border-color: #280aa3;
	box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%)
}
.perfectmatch_section{
 	background:url(../images/Group_1@2x.png);
	background-size:cover;
	width:100%;
}

.img_bride img{
	width:1125px;
}
.bride_sec{ width:100%;}
.img_bride{
	width:70%;
	float:left;
}
.Register_block{
	width:30%;
	float:right;
	padding-top:15px;
	padding-bottom:15px;
	padding-right:100px;
}
.match_section{ background:url(../images/Group_1.png); 
	width:100%;
	height:200px;
	background-size:cover;
}
.match_section h2{
	color:#fff;
	text-align:center;
}

 
.perfect_match_submenu nav{
 margin: 9px 0;
 background-color: #FF4649;
 background-color: #fff;
 border-radius: 44px;
 padding: 0 32px;
}
.perfect_match_submenu nav ul {
 padding: 0;
  margin: 0;
 list-style: none;
 position: relative;
 text-align:center;
 } 
.perfect_match_submenu nav ul li {
 display:inline-block;
 background-color: #fff;
 }
 .perfect_match_submenu nav ul li .fa{ margin-left:7px;}
.perfect_match_submenu nav a {
 display:block;
 padding:0 10px; 
 color:#FFF;
 font-size:18px;
 line-height: 50px;
 text-decoration:none;
 color:#e5004b
}
nav a:hover { 
 background-color:transparent; 
}
.perfect_match_submenu nav ul ul {
 display: none;
 position: absolute; 
 top: 60px; 
} 
.perfect_match_submenu nav ul li:hover > ul {
 display:inherit;
} 
.perfect_match_submenu nav ul ul li {
 width:230px;
 float:none;
 display:list-item;
 position: relative;
}
.perfect_match_submenu nav ul ul ul li {
 position: relative;
 top:-60px; 
 left:230px;
}
.perfect_match_submenu nav  ul li {
 border: 1px solid white;
} 
.perfect_match_submenu .divider{ height:32px; margin-left:17px;}
.search_btn{
	color: #fff;
    background-color: #280aa3;
    border-color: #280aa3;
	padding: 17px 10px;
	width:130px;
	text-align:center;
    border-radius: 25px;
	margin-left:auto;
	margin-right:auto;
	color:#fff;
}
.choose_section{ 
    padding: 20px 0;
}
.choose_box{
	background:#f9dec5;
	border-radius:5px;
	text-align:center;
	padding:10px 10px;
	margin:10px 15px;
}
.choose_section h2 {
    font-size: 32px;
    text-align: center;
    color: #320f4d;
    font-weight: 400;
}
.choose_img{margin-top:35px;}
.choose_text{ }
.choose_box img{ width:55px;}
.choose_box h3{ text-align: center;
    color: #e5004b;
    font-weight: 400;
    font-size: 18px;
    margin-bottom: 50px;
	}
.aboutus_section{
	padding: 63px 0;
    width: 100%;
    position: relative;
	
}
.couple_pic img{ width:59%}
.aboutus_section:before{
    width: 87px;
    content: " ";
    background: url(../images/Group_7.png);
    position: absolute;
    left: -19px;
    top: -12px;
    background-color: transparent;
    height: 156px;
}

.aboutus_section:after{
    min-width: 71px;
    content: " ";
    background:url(../images/Group_10.png)repeat-y;
    position: absolute;
    right: 0px;
    top: 307px;;
    background-color: transparent;
    height: 156px;
	background-size:contain;
}
.aboutus_section h2{	 
	font-size: 35px;
    text-align: left;
    color: #320f4d;
   	font-weight: 400;
    margin-bottom: 13px;
	}
.aboutus_section p{
	margin-left: 12px;
	color: #e5004b;
}
.plan_Sec{
	background:url(../images/Group_1@2x.png);
	background-size: 100%;
	width:100%;
	padding:15px 0;
}
.plan_Sec h2{ 
	color:#fff;
 	text-align:center; 
	font-size:18px;
	line-height: 34px;
	margin-bottom:45px;
	}
.plan_Sec h2:before{
	width: 87px;
    content: " ";
    background:url(../images/upgrade_1.png);
    position: absolute;
    margin-left: -43px;
    background-color: transparent;
    height: 156px;
	background-repeat:no-repeat;
}
.plan_Sec h2:after{
 	width: 37px;
    content: " ";
    background:url(../images/upgrade_2.png);
    background-repeat: no-repeat;
    position: absolute;
    right: 495px!important;
    background-color: transparent;
    height: 127px;
    background-size: contain;
}
.upgarde_box{
    background: #fff;
    border-radius: 32px;
    text-align: center;
    padding: 10px 20px;
    margin: 15px 35px;
	box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%)
}
.upgarde_img {
    margin-top: 35px;
}
.plan_btn{
	margin-top: 30px;
    background-color: #280aa3;
    border-color: #280aa3;
	padding: 13px 10px;
	width:130px;
	text-align:center;
    border-radius: 25px;
	margin-left:auto;
	margin-right:auto;
	color:#fff;
}
.plan_btn:hover{box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%)}
.plan_p{
	text-align: center;
    color: #fff;
	padding:10px 0;
	}
.upgarde_box h3{
	color:#320f4d;
	text-align:center;
	font-size:20px;
}
.upgarde_box p{
	color: #e5004b;
	text-align:center;
	margin-bottom:25px;
}
.stories_sec{
	background-size: 100%;
	padding: 25px 0;
    width: 100%;
    position: relative;
}
.stories_sec h2{
	text-align:center;
	color:#280aa3;
}
.story_img{
	text-align:center;
	margin-top: -12px;
}
.story_img img{ width:155px;}
.stories_sec:before{
     width:196px;
    content: " ";
    background:url(../images/Group_366@2x.png);
    position: absolute;
    left: -19px;
    top: 49px;
    background-color: transparent;
    height: 320px;
}
.stories_sec:after{
    min-width: 71px;
    content: " ";
    background:  url(../images/stories_sec.png)repeat-y;
    position: absolute;
    right: 0px;
    top: 73px;
    background-color: transparent;
    height: 156px;
	background-size:contain;
}
.story_bigimg{ text-align:center;}
.story_bigimg img{width:500px;}
.stories_sec p{
	margin-left: auto;
    margin-right: auto;
    text-align: center;
}

/* Login Page */


.header_bg{ height:60px;}
.login_sec{
	width:100%;
	padding:15px 0;
}

.login_sec:before{
     width: 87px;
    content: " ";
    background:url(../images/Group_366@2x.png)no-repeat;
    position: absolute;
    left: -19px;
    top: -12px;
    background-color: transparent;
    height: 156px;
}
.login_sec:after{
    min-width: 71px;
    content: " ";
    background:url(../images/Group_205@2x.png)repeat-y;
    position: absolute;
    right: 0px;
    top: 73px;
    background-color: transparent;
    height: 156px;
	background-size:contain;
}
.login_sec h2{
	text-align:center;
	color:#280aa3;
}
.login_sec_box{
	background:#f9dec5;
	border-radius:5px;
	padding: 49px 10px;
    margin: 25px 15px;
    height: 450px;
	box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%)
}

.radio-item input[type=radio]:checked + label:after { color:red;
}
input[type=checkbox], input[type=radio] {
    margin-right: 5px;
}
.login_sec_box  input{
    width: 100%;
    margin-bottom: 30px;
    border-radius: 20px;
    border: 1px solid #fff;
    padding: 5px 8px;
	color:#e5004b;
}
.login_sec_box label{
	padding-left:4px; 
	color:#e5004b;
}
.login_sec_btn{
	margin-top: 11px;
    
   background: #280aa3;
	padding: 13px 10px;
	width:100%;
	text-align:center;
    border-radius: 25px;
	margin-left:auto;
	margin-right:auto;
	color:#fff;
}
.login_sec_btn:hover{box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%)}
.login_sec p{
	margin-top: 15px;
    margin-left: 11px;
}
.login_sec p span{
	margin-left:10px;
}
.login_sec p a{
	color: #e5004b;
}
.login_sec_fbtn{
	margin-top: 11px;
    background-color: #3d5998;
	padding: 13px 10px;
	width:100%;
	text-align:center;
    border-radius: 25px;
	margin-left:auto;
	margin-right:auto;
	color:#fff;
}
.login_sec_gbtn{
	margin-top: 11px;
    background-color: #ed2822;
	padding: 13px 10px;
	width:100%;
	text-align:center;
    border-radius: 25px;
	margin-left:auto;
	margin-right:auto;
	color:#fff;
}
.login_sec_gbtn .fa{font-size:20px;}
.login_sec_gbtn .fa span {
    font-size: 16px;
    margin-left: 10px;
}
.login_sec_fbtn .fa{font-size:20px;}
.login_sec_fbtn .fa span {
    font-size: 16px;
    margin-left: 10px;
}
.login_sec_fbtn:hover{box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%)}
.login_sec_gbtn:hover{box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%)}




/* Contactus Page */

.Contactus_sec{
}
.Contactus_sec_btn{
	margin-top: 11px;
    background-color: #280aa3;
	padding: 13px 10px;
	width:150px;
	text-align:center;
    border-radius: 25px;
	margin-left:auto;
	margin-right:auto;
	color:#fff;
}
.Contactus_sec .login_sec_box{
	height:538px;
}
.Contactus_sec_btn:hover{box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%)}
.Contactus_sec  textarea{
    width: 100%;
	height:110px;
 	border:1px solid #fff;
}



/*Services Page*/


.services_section{
	width:100%;
	padding:15px 0;
}

.services_section h2{
	color:#280aa3;
	margin-bottom:20px;
}

.services_section .fa{
	font-size: 20px;
    color:#280aa3;
	
}
.services_section p span{ margin-left:10px; color:
 #e5004b;}




/*Services Page*/


.Upper_tab_sec{
	padding:15px 0;
	width:100%;
	margin-top:15px;
}
.Upper_tab_sec a{
		display:inline-block;
		padding: 10px;
		color: #fff;
		background:transparent;
}
.Upper_tab_sec a:active{ text-decoration:none;}
.Upper_tab_sec ul{
	list-style:none;
	margin-bottom: 15px;
}
.Upper_tab_sec ul li{
	display:inline-block;
	position:relative;
    width:200px;
    text-align:center;
	background:red;
	margin-right: 22px;
	background:#e6004b;
}
.Upper_tab_sec ul li:after{
    content:"";
    position:absolute;
    height:0;
    width:0;
    left:100%;
    top:0;
    border:20px solid transparent;
    border-left: 20px solid #e6004b;	
}

.Upper_tab_sec ul li:active{
	background:#770930;
}
.Upper_tab_sec ul li active.Upper_tab_sec ul li:after{
    content:"";
    position:absolute;
    height:0;
    width:0;
    left:100%;
    top:0;
    border:20px solid transparent;
    border-left: 20px solid #770930;	
}
.second_upper_tab{}
.second_upper_tab ul li{
	width:257px;
}
.upper_tab_brdr{
	border:1px solid #980436;
	margin-top: 20px;
}



/*Family details page*/

.familyDetail_sec{
	width:100%;
	padding:20px 0;
}
.familyDetail_sec  h2{color:#e5004b;}
.familyDetail_sec  h2 .fa{  font-size: 15px;
    margin-right: 10px;}
.familyedit_btn .fa{
    font-size: 20px;
    line-height: -2px;
    margin-right: 5px;
}
.familyedit_btn{
	margin-top: 11px;
    background-color: #280aa3;
	padding: 13px 10px;
	width:150px;
	text-align:center;
    border-radius: 25px;
	margin-left:auto;
	margin-right:auto;
	color:#fff;
	float:right;
}

.familyedit_btn:hover{box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%)}
.brder_family{
	border: 1px solid #98254c;
    padding: 27px 0;
    border-radius: 10px;
	color:#e5004b;
}
.brder_family .fa{
	color:#98254c;
	margin-right: 5px;
}
.familyDetail_sec h3{color: #280aa3;}

.familyedit_btn img{
	width: 20px;
    margin-right: 5px;
}
.button_center{ margin:0 auto;}
.back_edit_btn{
	margin-top: 11px;
    background-color: #280aa3;
	padding: 13px 10px;
	width:150px;
	text-align:center;
    border-radius: 25px;
	margin-left:auto;
	margin-right:auto;
	color:#fff;
	float:right;
}
.back_edit_btn:hover{box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%)}
.delete_edit_btn{
	margin-top: 11px;
    background-color: #e5004b;
	padding: 13px 10px;
	width:150px;
	text-align:center;
    border-radius: 25px;
	margin-left:auto;
	margin-right:auto;
	color:#fff;
	float:left;	
}
.delete_edit_btn:hover{box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%)}
.back_edit_btn .delete_edit_btn{
	display:inline-block;
}


/*Education details page*/
.education_add{}
.education_add select{
    padding: 7px 10px;
    border-radius: 21px;
    border: 1px solid #e5004b;
    color: #e5004b;
    text-align: left;
    width: 280px;
}

.education_add label{
	color: #280aa3;
	margin-left: 8px;
}
.education_add_mr{ margin-bottom:40px;}
.add_edit_btn{
	margin-top: 11px;
    background-color:  #280aa3;
	padding: 13px 10px;
	width:150px;
	text-align:center;
    border-radius: 25px;
	margin-left:auto;
	margin-right:auto;
	color:#fff;
	float:left;	
}
.add_edit_btn:hover{box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%)}
.active_li{ background:#780830!important; box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%)}
.active_li:after{border: 20px solid transparent!important; border-left: 20px solid #780830!important;}
.plan_mrgine{ margin-bottom:30px;}
.Privacy_sec{ width:100%; padding:30px 0;} 
.Privacy_sec p{ color:#e5004b;}
.Privacy_sec h3{color:#280aa3;}
.password_reset{ 
	text-align: center;
    border: 1px solid #280aa3;
    width: 500px;
    margin: auto;
	padding: 35px 55px;
	}
.password_reset  input{
    width: 100%;
    margin-bottom: 30px;
    border-radius: 20px;
    border: 1px solid #e5004b;
    padding: 5px 18px;
	color:#e5004b;
}


/*Besic Detail Page*/
.pro_pic{ text-align:center;}
.pro_pic img{
	border-radius: 10px;
    width: 100%;
}

/*Notification*/
.noti_bg{ background:#f9dec5; padding:20px 0; }

.not_pic{text-align:center; float:left; margin-right:30px;}
.not_pic img{
	border-radius: 10px;
   	height:100px;
}
.not-text{margin-top: 39px; }
.not-text p{color:#280aa3;}
.not-text p span{color:#e5004b; margin-left:5px;}
.lbl_yesterday{}
.txt_yesterday{
	position: relative;
    width: 151px;
    float: right;
	color:#f9dec5;
	
}
.not_brdr_btm{ border-bottom:2px solid #980436;}
.not_brdr_top{ border-top:2px solid #980436;}

/*Pending Request*/

.pending_box {
    background: #FFFFFF;
    border-radius: 7px;
    width: 280px;
    height: 361px;
    padding: 24px 15px;
	margin: 0 auto;
}
.pen-text{ font-size:22px; font-weight:600; text-align:center; color:#280aa3; margin-top:10px;}
.pending_box p{ color:#e5004b; font-size:18px;}


/*Send Request Page*/
.sentreq_sec{}
.sentreq_sec .perfect_match_submenu nav{ border:1px solid #e5004b;}
.sentreq_sec .pagination {
  display: inline-block;
}

.sentreq_sec .pagination strong {
    color: #fff;
    text-decoration: none;
    margin: 0 17px;
    border: none;
    padding: 4px 10px;
	background:#980436
}

.sentreq_sec .pagination a {
    color: #fff;
    text-decoration: none;
    margin: 0 17px;
    border: none;
    padding: 4px 10px;
	background:#980436
}

.sentreq_sec .pagination strong {
  background-color: #e5004b;
  color: white;
  border: none;
}

.sentreq_sec .pagination a:hover:not(.active) {background-color: #ddd;}
.line_spc{ line-height: 29px;}
.top_tab_pen_req{border: 1px solid #e5004b;
    border-radius: 30px;
}
.choose_file_btn{ text-align:center; color:#fff; background:#e5004b; border:1px solid transparent; border-radius:17px; width:120px; float:left; padding: 6px 10px;}
.choose_input{margin-left: -47px;
    background: transparent;
    border: 1px solid #e5004b;
    border-radius: 16px;
    padding: 6px 10px;
    width: 226px;}
.mar_up{ margin-top:20px;}
.upload_btn{ 
	width:150px;
	margin-top:0; 
	margin-top: 15px;
    margin-left: 12px;}
.upload_btn .fa{ margin-right:4px;}
.pro_pic_set{ width:280px!important; margin: 20px auto 20px auto;}
.plan_sec_user{ padding:20px 0; width:100%; background:#f9dec5;}
.plan_sec_user h2{ text-align:center; font-size:35px; color:#280aa3; margin-bottom:30px;}
.pre_plan_box{
    background: #FFFFFF;
    border-radius: 49px;
    padding: 24px 15px;
    margin: 0 auto;
	text-align:center;
	box-shadow: 0 5px 11px 0 rgb(0 0 0 / 18%), 0 4px 15px 0 rgb(0 0 0 / 15%)
}
.pre_plan_box h3{ color:#980436; font-size:25px; text-align:center; margin-bottom:30px;}
.pre_plan_box p{ color:#e5004b; margin-bottom:20px;}
.pre_pln_btn{ margin:0 auto!important;}
.faq_sec{padding:20px 0; }
.faq_sec h3{ font-size:18px; color:#e5004b;}
.faq_sec a{ color:#280aa3; }
.faq_sec h2{ color:#280aa3; text-align:center;}

/* Create four equal columns that sits next to each other */
.column {
  flex: 25%;
  max-width: 25%;
  padding: 0 4px;
}

.column img {
  margin-top: 8px;
  vertical-align: middle;
  width: 100%;
}

.services {
	border:1px solid;
	border-radius:6px;
	padding:20px;
	margin: 20px 30px;
}

/* Style the tab */
.tab {
  float: left;
  border: 1px solid #ccc;
  background-color: #f1f1f1;
  width: 30%;
  height: 500px;
}

/* Style the buttons inside the tab */
.tab button {
  display: block;
  background-color: inherit;
  color: black;
  padding: 22px 16px;
  width: 100%;
  border: none;
  outline: none;
  text-align: left;
  cursor: pointer;
  transition: 0.3s;
  font-size: 15px;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #ddd;
}

/* Create an active/current "tab button" class */
.tab button.active {
  background-color: #ccc;
}

/* Style the tab content */
.tabcontent {
  float: left;
  padding: 0px 12px;
  border: 1px solid #ccc;
  width: 70%;
  border-left: none;
  height: 500px;
}