/*======================
PRIMARY STYLES
========================*/
@font-face {
    font-family: 'aaarghnormal';
    src: url('../font/aaargh-webfont.eot');
    src: url('../font/aaargh-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/aaargh-webfont.woff') format('woff'),
         url('../font/aaargh-webfont.ttf') format('truetype'),
         url('../font/aaargh-webfont.svg#aaarghnormal') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'boopeebold';
    src: url('../font/boopee-bold-webfont.eot');
    src: url('../font/boopee-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/boopee-bold-webfont.woff2') format('woff2'),
         url('../font/boopee-bold-webfont.woff') format('woff'),
         url('../font/boopee-bold-webfont.ttf') format('truetype'),
         url('../font/boopee-bold-webfont.svg#boopeebold') format('svg');
    font-weight: normal;
    font-style: normal;

}

body {	
	background:#fff;
	color:#696969;
	font:100%/1.4 "Open Sans", sans-serif;
}

img {
	max-width:100%;
	height:auto;
}

.container {
	max-width:960px;
	margin:0 auto;
	position:relative;
}

.clear {clear:both;}

.alignleft {
	float:left;
	margin-right:15px; 
}
.alignright {
	float:right;
	margin-left:15px;
}
.alignmid {
	display:block;
	margin:0 auto;
}
.center {text-align:center;}
.border {border:1px solid #936ca3;}

.left {float:left;}
.half {width:48%;margin-left:1%;}
.third {width:33%;}
.tcenter {text-align:center;}



/*======================
TYPOGRAPHY/LINK STYLES
========================*/

h1,h2,h3,h4,h5,h6 {
	font-family: 'aaarghnormal';
	font-weight:normal;
	padding-bottom:0;
}

h2,h3,h4,h5,h6 {color: #8d2f82;}

h1 {font-size:2.9em;color: #76bd22; line-height: 1.2em;}
h2 {font-size:2.3em; line-height: 1.3em;font-family: 'aaarghnormal';}
h2.doctor {font-size:2em;color:#404647;line-height:1em;font-weight:bold;font-family: 'aaarghnormal';}
h3 {font-size:1.5em;}
h3.contact {font-family: 'aaarghnormal';font-size:1.8em;line-height:1.2em;}
h4 {font-size:1.1em;}
h5 {font-size:0.8em;}
h6 {font-size:0.6em;}
.doc {font-size:.8em;}
a {
	color:#fb8b30;
	transition:0.5s all ease;
}

a:hover {color:#e29742;}

a.btn {
	background:#f4da6b;
	color:#8d2f82;
	text-align:center;
	display:inline-block;
	text-decoration:none;
	padding:2px 5% 4px 5%;
	font-size:1em;
	border-radius:20px;
	-webkit-border-radius:20px;
	font-weight:bold;
	transition:all ease 0.5s;
	-webkit-transition:all ease 0.5s;
}

a.btn:hover {
	background:#d5ba47;
}

hr {
	background:#46addd;
	border:0;
	height:10px;
	padding:0;
	width: 100%;
	margin: 10px 0;
}

/*======================
HEADER STYLES
========================*/
header {
	position:relative;
}

#menu-btn {display:none;}

#logo {
	float:left;
	margin-top:10px;
	line-height:2.7em;
}
#logo img{
	max-width:235px;
}
#logo p { 
	font-size:1em;
	margin: -10px 0 0 0;
	padding: 0;
}

#header-address {
	position:absolute;
	top:195px;
	right:10px;
	width:600px;
	text-align:right;
	font-size:1em;
}

#social {
	background-color:#a2dada;
	vertical-align: middle;
	border-radius: 0 0 10px 10px;
	position:absolute;
	top:0;
	right:10px;
	padding:6px 15px;
}

#social img {
	padding:0 2px;
	vertical-align: middle;

}
/*======================
NAV STYLES
========================*/
nav {
	background-color:#f55197;
	border-radius: 15px 15px 0 0;
	font-size:0.9em;
}

nav ul {
	text-align:center;
	list-style-type:none;
	padding-bottom:0;
}

nav li {
	display:inline-block;
	margin:0;
	position:relative;
}

nav li a {
	display:block;
	font-size:1.2em;
	font-family:'aaarghnormal';
	text-decoration:none;
	color:#fff;
	padding:14px 20px 15px 20px;
	font-weight:600;
		}

nav li:hover a {
	background:#f53a8a;
	color:#fff;
}

/*DROPDOWNS */

nav li ul {
    display: none;
}
nav li:hover ul {
    display: block;
    position: absolute;
    top: 52px;
    z-index: 9999;
}
nav li:hover li {
    float: none;
    white-space: nowrap;
    width: 100%;
}
nav li:hover li a {
    background:#fff;
    padding: 12px 30px 12px 20px;
    text-align: left;
    font-size:0.9em;
    color:#f55197;
}
nav li:hover li a:hover {
    background:#f55197;
	color:#fff;
}

/*======================
CONTENT STYLES
========================*/


#slideshow{
	background:#76bd22;
	width:100%;
	border-bottom-width:5px;
    border-bottom-color:#8d2f82;
    border-bottom-style: solid;
}

#slider {
	max-width:960px;
	margin:0 auto;
	position:relative;
}

#supt-content{
	position:relative;
	font-size: 0.9em;
	line-height: 1.5em;
}

#welcome{
	margin-top:15px;
	font-size:0.9em;
	float:left;
	width:39%; /* 380px/960px */
}
#welcome h3{
	line-height: 1.2em;
	color:#5D5D5D;
}

#welcome-circle{
	border-radius: 0 0 300px 300px;
	-webkit-border-radius: 0 0 300px 300px;
	position:relative;
	background: #fb8b30;
	margin:0;
	text-align: center;
	margin:5px 0 10px 1%;
	height:280px; 
	width:57%; /* 550px/960px */
	float:right;
}

#blog{
	width:72%; /* 390px/540px */
	height:100%;
	margin:0 auto;
	text-align:center;
	color:#fff;
	padding-top:8px;
}

#blog h4{
	margin-top:0px;
	color:#fff;
}

#blog p{
	padding:3px;
	font-size: 1em;
}

#blog hr{
	padding-bottom:0px;
	padding-top:0px;
	height:1px;
	background:#fff;
}

#quicklinks{
	margin:0 auto;
	position:relative;
	width:100%;
	text-align:center;
}

#quicklinks img{
	padding-top:10px;
	padding-bottom:10px;
}

a.trans {
	width:24%;
	display:inline-block;
}

a.trans img {
	transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
    transition: transform 0.2s ease-in 0s;
    -webkit-transition: transform 0.2s ease-in 0s;
}

a.trans:hover img {
	transform: rotate(7deg);
	-webkit-transform: rotate(7deg);
}
#activity {
	width:25%;
	padding-bottom:15px;
	text-align:center;
	float:left;
}


#supt{
	background:#76bd22;
	min-height:70px;
	padding-top:20px;
	width:100%;
	z-index:100;
}

#supt h2{
	color:#fff;
	font-size:3.2em;
	margin-left:20px;
}

#supt-content{
	top:10px;
	width:81%; /* 780px/960px */
	float:left;
}

#supt-content hr {
	height:2px;
}

#supt-quicklinks{
	top:10px;
	margin-left: 2%;
	width: 17%;
	float: left;
}

#supt-quicklinks a.trans {
	display:block;
	width:100%;
	margin-bottom: 20px;
}

div.topic {
	font-weight:bold;
	font-size:1.2em;
}

#form .clear {clear:both;}
#form .center {text-align:center;}
#form h3 {margin:0 1%;}
#form small {font-style:italic;}
#form hr {width:98%;margin:10px 1% 15px 1%;}

/*GRID */
#form .column {
	float:left;
	margin:0 1%;
}

#form .full {width:98%;margin:0 1%;}
#form .half {width:48%;}
#form .twothird {width:65%;}
#form .onethird {width:31%;}

/*FORM STYLES*/

#form input:not([type=submit]):not([type=checkbox]) {
	width:96%;
	padding:10px 2%;
}

#form textarea {
	width:100%;
	resize:none;
}

#form select {
	width:101%;
	padding:10px 2%;
}

/*MEDIA QUERIES */

@media (max-width:767px) {
	#form .column {
		float:none;
		margin:0;
	}
	#form .full, #form .half, #form .twothird, #form .onethird {
		width:100%;margin:0;
	}
}

/*======================
FOOTER STYLES
========================*/
footer{
	background:#f6f6f6;
	border-top-width:5px;
    border-top-color:#8d2f82;
    border-top-style: solid;
	font-size:0.7em;
	margin-top:50px;
}

#footer-left{
	margin-top:10px;
	float:none;
	width: 100%;
	text-align:center;
}

body.home #footer-left {
	width:70%;
	float:left;
	text-align:left;
}

#footer-right{
	margin-top:10px;
	text-align:left;
	display:none;
	float: right;
	width: 25%;
	margin-left:5%;
}

body.home #footer-right {
	display:inline;
}
/*======================
MEDIA QUERIES
========================*/

/*TABLETS */
@media (max-width: 1024px) {
	.container, #slider {
		width:95%;
	}
}

/*PORTRAIT TABLETS */
@media (max-width:900px) {

	#social img {
		width:30px;
	}
	#logo p {
		font-size: 0.9em;
	}

	nav li a {
		font-size: 1em;
		padding:10px 13px 11px 13px;
	}

	nav li:hover ul {
		top:41px;
	}

	nav li:hover li a {
		font-size:0.8em;
	}

	#welcome-circle {
		height: 230px;
	}

	#blog p{
	font-size: 0.7em;
	}

	a.btn {
		font-size: 0.8em;
	}
	#welcome {
		font-size:0.8em;
	}
	#header-address {
		font-size:1em;
		top:108px;
	}
	
	
	
	
	
	nav {border-radius:0;}

	#desktop {display:none;}
	.container, #slider {
		width: 98%;
	}

	h3 {
		font-size:1.4em;
	}

	#social {
		position:relative;
		text-align:right;
		margin:0 auto;
		padding:8px 2%;
		width:96%;
		right:0;
	}

	#social strong {display:none;}

	#menu-btn {
		display:inline;
		position:absolute;
		top:10px;
		left:20px;
	}

	nav li:hover ul {
    display: block;
    position: relative;
    top: 0;
    z-index: 9999;
}



	#logo {
		float:none;
		text-align:center;
		margin-top:15px;
	}

	#logo p {
		line-height:1.4em;
		margin-top:20px;
		margin-bottom: -20px;
		font-size: 1em;
		margin: 20px 20px -20px 20px;
	}
	#header-address p{
		font-size:1.6em;
		margin-bottom:-20px;
	}
	#header-address {
	position:relative;
	top:auto;
	right:auto;
	width:100%;
	text-align:center;
	font-size:.8em;
}
	h2.doctor {
		display:none;
	}

}

/* MOBILE LAYOUTS */
@media (max-width:767px) {
	#header-address p{
		font-size:1.1em;
		margin-bottom:-20px;
	}
	#welcome {
		float: none;
		width: 95%;
		margin:0 auto;
	}

	#welcome, #content {
		line-height:1.7em;
	}

	#welcome-circle {
		float: none;
		width: 93%;
		margin:0 auto;
		margin-bottom: 15px;
		height:265px;
	}

	#blog {width:80%;}

	#blog h4 {
		font-size:1em;
	}
	#blog p {
		font-size:0.75em;
	}
	#quicklinks {
		width:93%;
		margin:0 auto;
	}

	#supt-content {
		top:10px;
		width:95%;
		float:none;
		margin: 0 auto;
	}

	#supt-quicklinks{
		top:10px;
		margin-left: 0;
		width: 98%;
		float: none;
		margin: 0 auto;
		text-align:center;
	}

	#quicklinks a.trans {
		width:45%;
		display:inline-block;
		margin-bottom:10px;
	}

	#supt-quicklinks a.trans {
		display:inline-block;
		width:48%;
		margin-bottom: 20px;
	}

	#supt h2 {
		font-size:2.5em;
		text-align:center;
		margin:0;
	}

	footer {
		text-align:center;
		padding-top:20px;
	}

	#footer-left {
		float: none;
		width:80%;
		margin:0 auto;
	}

	#footer-right {
		width:40%;
		float: none;
		margin:0 auto;
		text-align:center;
		margin-left:0;
	}

	.alignleft {
		float:none;
		display:block;
		margin: 10px auto;
	}
	.alignright {
		float:none;
		display:block;
		margin:10px auto;
	}
	#activity {
	width:50%;
}
}
@media (max-width:420px) {
	h2.doctor {
		font-size:1.3em;
	}
}