@font-face {
font-family: "Montserrat-Medium";
src: url("Montserrat-Medium.ttf");
}
body {margin:0px; overflow:overlay; font-family: Montserrat-Medium, Arial; font-size:1em; text-align:center; color:#555555;}
::-webkit-scrollbar {width: 15px;}
::-webkit-scrollbar-track {background: rgba(0, 0, 0, 0.2); box-shadow: none; border-radius: 10px;}
::-webkit-scrollbar-thumb {background: #D46CE4; border-radius: 10px;}
::-webkit-scrollbar-thumb:hover {background: #D683E2;}
h3 {margin-top:30px; color:#000000; font-weight:normal; font-size:3.2em;}
h4 {display:inline-block; margin-top:50px; color:#D46CE4; font-weight:normal; font-size:1em; letter-spacing:3px;}
a {text-decoration:none;}
.xtitle {display:inline-block; margin-top:50px; letter-spacing:3px;}
.button {display:inline-block; margin:20px 0 0 0; border:2px solid #D46CE4; padding:12px 20px; background:#ffffff; color:#D46CE4; letter-spacing: 2px; transition: .3s ease;}
.button:hover {background:#D46CE4; color:#ffffff;}

a.up {display:block; position:fixed; right:10px; bottom:10px; width:40px; height:40px; background:url('../images/up.png'); z-index:1; opacity:.3; transition: .3s ease;}
a.up:hover {opacity:1;}
.hr {margin-top:20px; width:100px; height:2px; border-bottom:2px solid #D46CE4;}
p {line-height:30px; text-align:left;}

.header {width:100%; height:155px; background:#ffffff;}
.header .logoContainer {float:left; width:190px; padding:43px 0px 0px 10px;}
.header .logo {display:block; width:200px; vertical-align:middle;}
.header .right {position:absolute; right:0px; top:0px; text-align:right;}
.header .middle {display:inline-block; height:155px; padding:20px 40px 0 0;}
.header .links {border-bottom:1px solid #dddddd;}
.header .links .vert {display:inline-block; padding:20px 10px 20px; color:#D46CE4;}
.header .links img {display:inline-block; padding:20px 10px 20px; vertical-align:middle;}
.header .links .tel {color:#D46CE4;}
.header .links .tel:hover {text-decoration:underline;}
.header .navbar span {display:inline-block; margin:20px 0px 0px 40px; font-weight:bold;}
.header .navbar a {display:inline-block; margin:20px 0px 0px 40px; color:#555555;}
.header .navbar a:hover {color:#D46CE4;}
.header .appointment {display:inline-block; float:right; background:#D46CE4; width:220px; height:155px; text-align:center;}
.header .appointment a {display:inline-block; margin-top:55px; border:2px solid #ffffff; padding:13px 17px 13px 42px; color:#ffffff; background:url('../images/calendar.png') 13px center no-repeat; transition: .3s ease;}
.header .appointment a:hover {color:#000000; text-decoration:none; background: #ffffff url('../images/calendar-h.png') 13px center no-repeat;} 

div.contentDetail {clear:both; margin:0 5% 0; padding:20px 0 0 0; font-size:1.2em;}
div.contentDetail img.left {float:left; margin:0 2% 2% 0;}
div.contentDetail img.right {float:right; margin:0 0 2% 2%;}

.info {padding:30px 0; clear:both;}
.info .map {width:600px; height:450px; border:0;}
.info .request {display:inline-block; width:600px; height:450px; vertical-align:top;}
.info .request .logo {width:200px;}
.info .request h4 {margin-top:20px;}
.info .request h3 {font-size:2em;}
.info .request form {display:inline-block; width:500px; text-align:left;}
.info .request form input {border:0px; border-bottom:1px solid #D46CE4; width:230px; padding:10px 0px; font-size:1em;}
.info .request form textarea {border:0px; border-bottom:1px solid #D46CE4; width:490px; height:50px; resize:none; padding:10px 0px; font-size:1em; font-family: Montserrat-Medium, Arial;}
.info .request form .submit {text-align:center;}
.info .request .button2 {display:inline-block; margin:20px 0 0 0; border:2px solid #D46CE4; width:230px; padding:12px 20px; background:#ffffff; color:#D46CE4; letter-spacing: 2px; transition: .3s ease;}
.info .request .button2:hover {background:#D46CE4; color:#ffffff;}

#consultation {
    opacity:1.0;
    transition: opacity .5s;
    }
#consultation textarea {padding:10px;}
#ok {position:absolute; top:0px; left:0px; width:100%; overflow:hidden; padding:0px 0 0 0; height:1px; opacity: 0; transition: opacity .5s;}
#ok div {display:inline-block; font-size:2em; color:black;}

.footer {background:#000000; color:#dddddd; line-height:50px;}

@media (min-width:240px) and (max-width:767px) { 
    .header .logoContainer {float:none; width:100%; padding:0px 0px 0px 0px; text-align:center;}
    .header .logo {display:inline-block; width:200px;}
    .header .right {position:relative; text-align:center;}
    .header .middle {padding:0 0 0 0;}
    .welcome {display:none;}                  
    .header .links .vert {padding:0 10px 10px;}
    .header .links img {padding:0 10px 10px;}
    .header .navbar a {margin:20px 0px 0px 20px;}
    .header .appointment {display:none;}

    img.left, img.right {float:none; width:100%;}
    
    .info {margin-bottom:30px;}
    .info .map {width:100%; height:450px; border:0;}
    .info .request {width:100%;}
    .info .request form {width:90%;}
    .info .request form input {width:150px;}
    .info .request form textarea {width:90%;}
}
@media (min-width:768px) and (max-width:930px) {
    .welcome {display:none;}
    .header .appointment {display:none;}
}
@media (min-width:931px) and (max-width:1050px) {
    .welcome {display:none;}
}
@media (min-width:1051px) and (max-width:1920px) {
}