﻿/*--------------------
TABLE OF CONTENTS
01. Base Styles
02. Typography/Link Styles
03. Header Styles
05. Content Styles
06. Footer Styles
    font-family: 'Dosis', sans-serif;
    font-family: 'Open Sans', sans-serif;

/*======================
01. BASE STYLES
========================*/
@font-face {
	font-family: 'Conv_Doctor Soos Light 1.1';
	src: url('../fonts/Doctor Soos Light 1.1.eot');
	src: local('☺'), url('../fonts/Doctor Soos Light 1.1.woff') format('woff'), url('../fonts/Doctor Soos Light 1.1.ttf') format('truetype'), url('../fonts/Doctor Soos Light 1.1.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Conv_Doctor Soos Bold 2.1';
	src: url('../fonts/Doctor Soos Bold 2.1.eot');
	src: local('☺'), url('../fonts/Doctor Soos Bold 2.1.woff') format('woff'), url('../fonts/Doctor Soos Bold 2.1.ttf') format('truetype'), url('../fonts/Doctor Soos Bold 2.1.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
body {
	font: 100%/1.4 'Open Sans', sans-serif;
	color: #000;
	background: #2a374b;
	margin: 0;
}
img {
	max-width: 100%;
}
.containerfull {
	width: 100%;
	margin: 0 auto;
	position: relative;
}
.container {
	width: 95%;
	margin: 0 auto;
	max-width: 1200px;
	position: relative;
}
.column {
	float: left;
	margin: 0 1%;
}
/*USE class="row" to add "padding" to top and bottom of a section area. */
.row {
	width: 100%;
	padding: 10px 0;
	display: inline-block;
	position: relative;
}
.teal {
	background: #1f8ec4;
}
.white {
	color: #fff;
}
.text {
	padding-top: 15px;
}
.clear {
	clear: both;
}
.alignleft {
	float: left;
	margin-right: 40px !important;
	margin-bottom: 15px;
}
.alignright {
	float: right;
	margin-left: 40px !important;
	margin-bottom: 15px;
}
.alignright h4 {
	text-align: center;
}
.alignmid {
	display: block;
	margin: 0 auto;
}
.center {
	text-align: center;
}
/*======================
02. TYPOGRAPHY/LINK STYLES
========================*/
.pediatric h1, .pediatric h2, .pediatric h3, .pediatric h4, .pediatric h5, .pediatric h6 {
	font-family: 'Doctor Soos Light', cursive;
}
.pediatric h2, .pediatric h4, .pediatric h6 {
	color: #1f8ec4;
}
.pediatric h3, .pediatric h5 {
	color: #1f8ec4;
}
.prothodontics h1, .prothodontics h2, .prothodontics h3, .prothodontics h4, .prothodontics h5, .prothodontics h6 {
	font: 'Montserrat', sans-serif;
}
.prothodontics h2, .prothodontics h4, .prothodontics h6 {
	color: #003764;
}
.prothodontics h3, .prothodontics h5 {
	color: #003764;
}
h1 {
	font-size: 2.4em;
	line-height: 1em;
	padding-bottom: 5px;
}
h2 {
	font-size: 2.5em;
}
h3 {
	font-size: 2.1em;
}
h4 {
	font-size: 1.7em;
}
h5 {
	font-size: 1.4em;
	padding-bottom: 0;
	font-weight: 700;
}
h6 {
	font-size: 1.5em;
	margin: 3px;
}
.pediatric h6 {
	font-size: 1.8em;
	margin: 3px 0 -6px;
}
.support h2, .support h3, .support h3, .support h4 {
	padding-bottom: 0;
}
h2 strong {
	color: #2dd45c;
	font-weight: 700;
}
a {
	color: #36009b;
	transition: 0.5s all ease;
}
a:hover {
	color: #4c1c9b;
}
p {
	line-height: 1.3em;
	font-size: 0.95em;
	margin: 2px;
}
.column li {
	line-height: 1.7em;
	font-size: 0.95em;
}
.prothodontics a.button {
	color: #fff;
	background-color: #003764;
	display: inline-block;
	text-decoration: none;
	font: 'Montserrat', sans-serif;
	font-weight: 300;
	margin: 15px 0;
	font-size: 1.18em;
	padding: 10px;
}
.prothodontics a.button:hover {
	color: #141e2e;
	background-color: #2a7295;
}
.pediatric a.button {
	color: #fff;
	background-color: #2dd45c;
	display: inline-block;
	text-decoration: none;
	font-family: 'Doctor Soos Light', cursive;
	margin: 15px 0;
	font-size: 1.5em;
	padding: 6px 10px;
	-webkit-border-radius: 15;
	-moz-border-radius: 15;
	border-radius: 15px;
}
.pediatric a.button:hover {
	color: #fff;
	background-color: #16b643;
}
a.white {
	color: #fff;
}
a.button i {
	margin-left: 15px;
}
/*======================
03. HEADER STYLES
========================*/
.logo {
	position: absolute;
	width: 490px;
	text-align: center;
	z-index: 999;
	top: -130px;
	left: -6%;
}
.logo img {
	margin: 0 auto;
	/* Adjust the next two values to reposition the logo */
	width: 60%;
	padding-top: 30%;
}
.welcome {
	position: relative;
}
.overlay {
	background: rgba(82,213,98,0.9);
	position: absolute;
	top: 0;
	z-index: 997;
	width: 40%;
	height: 100%;
	border-top-right-radius: 50%;
	border-bottom-right-radius: 50%;
}
.support .overlay {
	width: 40%;
	border-top-right-radius: 30%200px;
	border-bottom-right-radius: 30%200px;
}
.overlay h1, .overlay p, .teal h2, .teal h2 strong {
	color: #fff;
}
.headerimg img {
	display: block;
}
.textblock {
	margin: 50% 15% 0 10%;
}
.support .textblock {
	margin: 45% 15% 0 10%;
}
.headerimg {
	margin: 0;
	padding: 0;
}
/*======================
05. CONTENT STYLES
========================*/
.page-logo {
	text-align: center;
	background: #d5d7de;
	padding: 15px 8px 10px;
	margin: 0 auto;
}
.page-title {
	text-align: center;
	font: 'Montserrat', sans-serif;
	font-weight: 300;
	text-transform: uppercase;
	color: #fff;
	font-size: 1.8em;
	line-height: 1em;
	background: #75777c;
	padding: 15px 8px;
	margin: 0 auto;
}
.content {
	overflow: hidden;
	width: 100%;
}
.disclaimer {
	width: 100%;
	background-color: #d5d7de;
	float: left;
	text-align: center;
	padding: 0 0 25px;
	padding-bottom: 500em;
	margin-bottom: -500em;
}
.disclaimer p {
	margin: 35px 50px;
}
.prothodontics {
	width: 50%;
	background-color: #fff;
	float: left;
	text-align: center;
	padding: 0 0 25px;
	padding-bottom: 500em;
	margin-bottom: -500em;
}
.pediatric {
	width: 50%;
	float: left;
	text-align: center;
	padding: 0 0 25px;
	padding-bottom: 500em;
	margin-bottom: -500em;
	background: #dacefe url('../img/landing-burst-bg2.jpg') no-repeat;
	background-position: top center;
}
.address-pedo {
	width: 80%;
	margin: 0 auto;
}
.address-pedo-location {
	float: left;
	width: 50%;
}
.social-pros {
	width: 100%;
}
.social-pros a .fa-circle {
	color: #003764;
	transition: 0.5s all ease;
}
.social-pros a:hover .fa-circle {
	color: #1e99cc;
}
.social-ped {
	width: 100%;
}
.social-ped a .fa-circle {
	color: #2dd45c;
	transition: 0.5s all ease;
}
.social-ped a:hover .fa-circle {
	color: #16b643;
}
/*======================
06. FOOTER STYLES
========================*/
footer {
	font-size: 0.85em;
	color: #fff;
	background: #141e2e;
	display: block;
	width: 85%;
	max-width: 1200px;
	margin: 0 auto;
	text-align: center;
}
footer a {
	text-decoration: underline;
	transition: 0.5s all ease;
	color: #fff;
}
footer a:hover, ul.sitemap li a:hover {
	color: #1e99cc;
}
ul.sitemap {
	list-style-type: none;
}
ul.sitemap li {
	display: inline-block;
	margin: 0;
	padding: 3px 0;
}
ul.sitemap li a {
	display: block;
	text-decoration: none;
	color: #fff;
	font-weight: 700;
	padding-right: 20px;
	font-family: 'Open Sans', sans-serif;
	text-transform: uppercase;
	transition: 0.5s all ease;
}

/*======================
MEDIA QUERIES
========================*/
@media (max-width:1600px) {
.containerfull {
	width: 90%;
}
.container {
	width: 85%;
}
.logo {
	width: 290px;
	height: 230px;
	top: -55px;
	left: 0%;
}
.logo img {
	margin: 0 auto;
	/* Adjust the next two values to reposition the logo */
	width: 95%;
	padding-top: 22%;
}
h1 {
	font-size: 1.8em;
}
.support h1 {
	font-size: 2.2em;
}
ul.quick li a {
	font-size: 1em;
}
.row {
	padding: 25px 0;
}
.text {
	padding-top: 0;
}
.textblock p {
	line-height: 1.4em;
	font-size: .9em;
	padding-bottom: 10px;
}
}

@media (max-width: 1200px) {
.desktopmenu {
	display: none !important;
}
.number {
	display: block;
	background: #36009d;
	color: #fff;
	padding: 10px;
	text-align: right;
}
.number a {
	color: #fff;
}
.mobile {
	display: block;
	line-height: 5.5em;
	cursor: pointer;
	background: #1f8ec4;
	text-align: center;
	color: #fff;
	float: right;
	font-family: 'Dosis', sans-serif;
	text-decoration: none;
	text-transform: uppercase;
	width: 100px;
}
a.mobile:hover {
	color: #fff;
}
.overlay, .support .overlay {
	background: rgba(31,142,196,0.9);
	position: relative;
	width: 100%;
	height: auto;
	border-top-right-radius: 0;
	border-bottom-right-radius: 30px;
	border-bottom-left-radius: 30px;
	display: block;
	height: 100%;
	margin-top: 5px;
}
.overlay h1, .overlay p, .teal h2, .teal h2 strong {
	color: #fff;
}
.textblock, .support .textblock {
	margin: 0 5%;
	padding: 20px 0;
}
}

@media screen and (max-width:1000px) {
.grid1, .grid2, .grid3, .grid4, .grid5, .grid6, .grid7, .grid8, .grid9, .grid10, .grid11, .grid12 {
	width: 100%;
	margin: 0;
}
.container img, .containerfull img {
	display: block;
	margin: 0 auto 10px auto;
}
.containerfull .welcome img {
	margin: 0 auto;
}
a.button {
	margin: 0 0 20px 0;
}
h6 {
	font-size: 1.4em;
}
.address-pedo {
	width: 100%;
}
}

@media screen and (max-width:850px) {
.alignleft, .alignright {
	float: none;
	display: block;
	margin: 0 auto !important;
	padding-bottom: 20px;
}
hr {
	margin-top: 0px;
}
.logo {
	width: auto;
	height: auto;
	background: none;
	position: relative;
	top: 0;
	left: 0;
}
.logo img {
	width: 80%;
	max-width: 270px;
	padding-top: 30px;
}
.mobile {
	width: 70px;
}
.nomobile {
	display: none;
}
ul.quick li {
	float: none;
	width: 100%;
	margin-right: 0;
	margin-bottom: 5px;
}
.mobile {
	line-height: 3.5em;
}
.number {
	text-align: center;
}
.prothodontics {
	width: 100%;
	background-color: #dedede;
	float: none;
	text-align: center;
	padding: 0 0 25px;
	padding-bottom: 500em;
	margin-bottom: -500em;
}
.pediatric {
	width: 100%;
	background-color: #2cd45b;
	float: none;
	text-align: center;
	padding: 0 0 25px;
	padding-bottom: 500em;
	margin-bottom: -500em;
	background: #d2efff url('../img/landing-burst-bg.jpg') no-repeat;
	background-position: top center;
}
}

@media (max-device-width:570px) {
/*For Iphone 5S and Smaller */
.address-pedo-location {
	float: none;
	width: 100%;
}
.container {
	width: 100%;
}
footer {
	width: 100%;
}
}
