@charset "utf-8";
/* CSS Document */

.topbar{
	width:100%;
}

body {
font-family: 'Calibri', sans-serif;
}
h4 {
    font-size: 35px;
    line-height: 36px;
    margin-bottom: 20px ;
	color: #74a2c5;
	font-weight: 700;
}
p{
	font-size: 18px;
	line-height: 20px;
	color: #000;
	
}
li{
	font-size: 18px;
	line-height: 25px;
}
.navmenu a{
		color: #010101 !important;
		font-family: Calibri;
		font-size: 18px;
		font-weight: 700;
	 }

	 .whyupsmile {
		padding: 50px 100px;
		position: relative;
		float: left;
	}
 .whyupsmile h4{
color: #74a2c5;
font-family: Calibri;
font-size: 35px;
font-weight: 700;
font-style: normal;
letter-spacing: normal;
line-height: 36px;
text-align: left;
margin-bottom: 20px;
}


.whyupsmile p{
color: #000;
font-family: Calibri;
font-size: 18px;
font-style: normal;
letter-spacing: normal;
line-height: 25px;
text-align: left;
font-style: normal;
letter-spacing: normal;

 }
.whydoctors{
padding: 50px 100px;
background-color: #f4f9fb;
position: relative;
float: left;
 }
 .whydoctors h4{

	color: #74a2c5;
font-family: Calibri;
font-size: 35px;
font-weight: 700;
font-style: normal;
letter-spacing: normal;
line-height: 36px;
text-align: left;
margin-bottom: 20px;
}	
.whydoctors p{
	color: #000;
	font-family: Calibri;
	font-size: 18px;
	font-style: normal;
	letter-spacing: normal;
	line-height: 25px;
	text-align: left;
	font-style: normal;
	letter-spacing: normal;
	 }	
	 .price{
		float: left;
		position: relative;
		padding: 55px 100px;
	}
	 
	 .price h4{

		color: #74a2c5;
		font-family: Calibri;
		font-size: 35px;
		font-weight: 700;
		font-style: normal;
		letter-spacing: normal;
		line-height: 36px;
		text-align: left;
		margin-bottom: 20px;
	}	
	.price p{
		color: #000;
		font-family: Calibri;
		font-size: 18px;
		font-style: normal;
		letter-spacing: normal;
		line-height: 25px;
		text-align: left;
		 }	 
	 .price_process{
	 padding: 25px;
	 }
	 .capabilities {
		float: left;
		position: relative;
		padding: 50px 100px;
	}


	 #contact_us{
		background-image: url(../images/contact_us.png);
		background-color: #f4f9fb;
		width: 100%;
		background-repeat: no-repeat;
		height: 100%;
		background-position: center;
		background-size: cover;
		width: 100%;
		float: left;
		position: relative;
	}

	input[type=text], select, textarea {
		width: 100%;
		padding: 12px;
		border: 1px solid #ccc;
		border-radius: 4px;
		box-sizing: border-box;
		margin-top: 6px;
		margin-bottom: 16px;
		resize: vertical;
	  }
	  
	  input[type=submit] {
		background-color: #57ee39;
		color: white;
		padding: 12px 20px;
		border: none;
		border-radius: 4px;
		cursor: pointer;
	  }
	  
	  input[type=submit]:hover {
		background-color: #57ee39;
	  }
	  #footer_section{
		  background-color: #2f3a43;
		  width: 100%;
		  float: left;
		  position: relative;
		  padding: 25px 74px;
	  }
	  
	  #footer_section p {
		color: #98a8b4;
		font-size: 16px !important;
	}
	  #footer_section a {
		color: #98a8b4;
		font-size: 15px;
	}
	  .fa {
		padding: 8px;
		font-size: 30px;
		width: 34px;
		text-align: center;
		text-decoration: none;
		margin: 10px 6px;
	}
	.fa:hover {
		opacity: 0.7;
	}
	.fixed_top {
		float: left;
		width: 100%;
		position: fixed;
		background-color: #fff;
		opacity: 10 !important;
	}
	.header {
		
		width: 100%;
		position: fixed;
		z-index: 9999;
		background-color: #fff;
		opacity: 0.9;
		padding: 0px 50px;
	}
	.banner{
		float:left;
		width:100%;
	}
	.banner img{
		float:left;
		width:100%;
		
	}
	.whyupsmile img{
		width:100%;
	}
	.whydoctors img{
		width: 100%;
	}
	.price img{
		width: 100%;
	}
	.doctor{
		position: absolute;
		left: 30%;
		transform: translateX(-26%);
		margin-top: 50px;
		width: 400px;
	}
	#pricing{
		background-image: url(../images/pricing_process.png);
		background-color: #f4f9fb;
		width: 100%;
		background-repeat: no-repeat;
		height: 100%;
		background-position: center;
		background-size: cover;
		position: relative;
        float: left;

	}
	#story{
		background-image: url(../images/ourstory.png);
		background-color: #f4f9fb;
		width: 100%;
		background-repeat: no-repeat;
		height: 100%;
		background-position: center;
		background-size: cover;
		width: 100%;
		float: left;
		position: relative;
		padding: 50px 100px;
	}
	#banner{
		background-image: url(../images/background.png);
		background-color: #f4f9fb;
		width: 100%;
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
		
	}
	
	#story h4{ 
		color: #74a2c5;
font-family: Calibri;
font-size: 35px;
font-weight: 700;
font-style: normal;
letter-spacing: normal;
line-height: 36px;
text-align: left;
margin-bottom: 20px;
	}
	#story p{ 
		color: #000;
		font-family: Calibri;
		font-size: 18px;
		font-style: normal;
		letter-spacing: normal;
		line-height: 25px;
		
		 }
		 input[type=text], select, textarea {
			width: calc(100% - 60px);
			padding: 5px;
			border: 1px solid #ccc;
			border-radius: 4px;
			background-color: #f4f9fb !important;
			margin: 0px;
		}
		
		.forms_con {
			padding: 34px;
			background-color: #fff;
			height: 300px;
			border: 1px solid #399ed6;
		}
		.fa {
			display: inline-block;
			border: 1px solid #2293d2;
			border-radius: 100%;
		}
		.forms_con img {
			width: auto;
			height: auto;
			object-fit: contain;
			margin-right: 10px;
		}
		.icon{
			width: 100%;
			display: flex;
			align-items: center;
			margin-bottom: 20px;
		}

		@media only screen and (min-width: 1024px) {
			.navmenu{
				float:right;
			}
		  }
		  .table td, .table th {
			font-size: 18px;
		}
		.tab_res{
			width:100%;
		}
		.diffupsmile{
			background-color: #fff;
			padding: 20px;
			border: 2px solid #76a3c6;
			margin-bottom: 10px;
			box-shadow: 2px 2px 8px 4px #cccccd;
			}

		.table-bordered td, .table-bordered th {
			border: 1px solid #fff; 
		}
		.table thead th {
			border-bottom: 2px solid #fff; 
		}
		.table-striped tbody tr:nth-of-type(odd) {
			background-color: #eaedf5 !important;
		}
		.table-striped tbody tr:nth-of-type(even) {
			background-color: #f5f6fa !important;
		}
		@media only screen and (max-width: 767px) {
			input[type=text], select, textarea {
				width: 100%;
				
			}
			.menu{
				width:50% !important;
			}
			.logo{
				width:50% !important;
			}
			.logo img{
				height: 35px;
    			margin-left: 10px;
			}
			.banner-inner img {
				height: auto !important;
			}
			#banner{
				height:auto;
			}
			.ourstory-inner{
				display: block !important;
				margin-bottom: 15px;
			}
			.contact_us_inner{
				display: block !important;
				margin-bottom: 15px;
			}
			.price_process {
				padding: 2px; 
				margin-left: 1px;
			}
			#story{
				background: none;
			}
			#contact_us{
				background: none;
				padding: 0px;
			}
			.banner_upsmileImobile{
				display: block !important;
			}
			.header {
				padding: 0px 5px;
			}
			.contact_us_inner{
				padding:0px 0px !important;
			}
			.banner-inner{
				display:none;
			}
			#banner{
				height:auto
			}
			.price_process ul {
				 margin-left: -25px !important; 
			}
			#pricing{
				background: none;
			}
			#compare p {
				padding: 0px 0px !important;
			}
			.navmenu a {
				font-size: 13px;
			}
			.nav-link {
				padding: 5px 0px;
			}
			table td, .table th {
				font-size: 15px !important;
			}
			.whyupsmile {
				padding: 10px 5px;
			}
			.whydoctors {
				padding: 10px 5px;
			}
			#pricing {
				padding: 10px 5px;
			}
			.capabilities{
				padding: 10px 5px;
			}
			#story {
				padding: 10px 5px;
			}
			.graphic_img {
				margin-top: 20px !important;
			}
			.forms_con {
				padding: 1px;
				height: 500px;
				border: 1px solid #fff;
			}
			#footer_section{
				display: none;
			}
			.tab_res{
				width:300px;
				overflow-x: auto; 
			}
			.fixed_top {
				position: fixed !important;
			}
			
			.banner img{
				height:auto;
			}
			h4 {
				font-size: 20px !important;
				line-height: 20px !important;
				
			}
			p {
				font-size: 15px !important;
				line-height: 18px !important;
		  }
			li {
				font-size: 15px !important;
				line-height: 25px !important;
			}
		}
		  .fa-twitter{
			  color:#02b0e8 !important;
		  }
		  .fa-facebook{
			color:#325497 !important;
		}
		.fa-linkedin{
			color:#0389d0 !important;
		}
		.fa-instagram{
			color:#e95950 !important;
		}
		.fa-snapchat{
			color:#FFFC00 !important;
		}
		table {
			color: #010101;
		}
		.graphic_img{
			margin-top: 150px;
		}
		.all-day{
			margin-top:65px;
		}
        .price_process p{
		margin-bottom: 1px;
		}
		#compare p{
		font-size: 15px !important;
		text-align: center;
		padding: 0px 30px;
	}
	#difference{
		margin-top: 40px;
	}
	.icon_message{
		width: 100%;
			display: flex;
			align-items: start;
			margin-bottom: 20px;
	}
	ul{
		margin-left: -22px;
	}
	.price_process ul{
		margin-left: 0px;
	}
	.navbar-light .navbar-toggler-icon-signup {
		background-color: #20bc01;
		text-transform: uppercase;
		font-family: "Calibri";
		padding: 10px 10px;
		border-radius: 4px;
		font-weight: 600;
	}
	.navbar-light .navbar-toggler-icon-signup a{
		color: #fff;
	}
	.signup{
		display: flex;
       align-items: center;
	}
	.navbar-toggler{
		margin-right: 10px;
	}
	@media (min-width: 992px){
.navbar-expand-lg .signup {
    display: none;
}
}
table th{
	padding:5px !important;
}
table td{
	padding:5px !important;
}
.ourstory-inner{
	display: none;
}
.contact_us_inner{
	display: none;
}
.menu{
	width:50%;
}
.logo{
	width:50%;
}
.navbar{
	padding:0px 0px !important;
}
.navbar-nav{
	padding-left:15px  !important;
}
.banner_upsmileImobile{
	display: none;
	margin-top: 20px;
}