#request input[type=text],
#request input[type=submit],
#request textarea{
-webkit-appearance: none;
border-radius: 0;
}
#request form,
#request input:not(.button),
#request textarea{
width: 100%;
}
#request input:not(.button),
#request textarea{
background: #d4d4d4;
color: black;
font-family: "Roboto Light";
font-size: 18px;
border: 0;
border-radius: 5px;
-webkit-border-radius: 5px;
padding: 15px;
margin: 7px auto;
}
#request input{
height: 45px;
}
#request input::placeholder,
#request textarea::placeholder{
color: white;
font-family: "Roboto Light";
font-size: 18px;
}
#request textarea{
height: 160px;
}
#request input[type=submit],
#request .button{
width: 200px;
height: 50px;
border: 2px solid #d4d4d4;
border-radius: 5px;
-webkit-border-radius: 5px !important;
-webkit-appearance: none !important;
background: white;
color: black;
font-family: Roboto;
font-size: 20px;
margin: 7px 0 auto auto;
align-self: flex-end;
}
.error{
max-width: 100%;
font-family: Roboto;
font-size: 18px;
padding: 5px;
border: 1px solid red;
color: red;
border-radius: 3px;
margin: 0  auto 2px auto;
text-align: center;
}
.success{
max-width: 100%;
font-family: Roboto;
font-size: 18px;
padding: 5px;
border: 1px solid green;
color: green;
border-radius: 3px;
margin: 0  auto 2px auto;
text-align: center;
}
.error-text {
background: #F59E9E;
padding: 15px 0px;
text-align: center;
color: #fff;
}
.error-name, .error-email, .error-comments {
display: inline-block;
font-size: 11px;
position: absolute;
top: -30px;
color: white;
border: 1px solid red;
padding: 5px 10px;
line-height: 1.1;
background: red;
box-shadow: 0 0 3px 0px rgba(0, 0, 0, 0.3);
}
.error-name:after, .error-email:after, .error-comments:after {
content: '';
position: absolute;
left: 20px;
bottom: -10px;
border: 5px solid transparent;
border-top: 5px solid red;
}
.error-comments {
top: 16%;
left: 0;
}
.error-name {
left: 0;
}
.error-email {
right: 4%;
}
@media screen and (max-width: 1030px){
#request input:not(.button),
#request textarea {
padding: 5px 15px;
margin: 5px auto;
}
}
@media screen and (max-width: 900px) {
#request input,
#request textarea,
#request input[type=submit],
#request input::placeholder,
#request textarea::placeholder{
font-size: 18px;
}
#request input,
#request input[type=submit]{
height: 36px;
}
#request textarea{
height: 130px;
}
}
@media screen and (max-width: 850px) {
}
@media screen and (max-width: 710px) {
#request input,
#request textarea,
#request input::placeholder,
#request textarea::placeholder{
font-size: 18px;
margin: 7px auto;
}
#request input{
height: 45px;
padding: 15px;
}
#request textarea{
height: 160px;
padding: 15px;
}
#request input[type=submit]{
width: 200px;
height: 50px;
margin: 7px 0 auto auto;
}
}
@media screen and (max-width: 660px) {
}
@media screen and (max-width: 600px) {
}
@media screen and (max-width: 500px) {
}
@media screen and (max-width: 420px) {
#request input,
#request textarea,
#request input[type=submit],
#request input::placeholder,
#request textarea::placeholder{
font-size: 16px;
padding: 5px;
}
#request input,
#request input[type=submit]{
height: 40px;
}
#request textarea{
height: 130px;
}
}
@media screen and (max-width: 320px) {
#request input,
#request textarea,
#request input[type=submit],
#request input::placeholder,
#request textarea::placeholder{
font-size: 14px;
}
#request input,
#request input[type=submit]{
height: 40px;
width: 100%;
}
#request textarea{
height: 110px;
}
}html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
*{
margin: 0;
padding: 0;
box-sizing: border-box;
} article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
@font-face {
font-family: 'Roboto';
src: url(//newsmile.in.ua/wp-content/themes/dantist_anytheme/inc/css/fonts/Roboto.ttf);
}
@font-face {
font-family: 'Roboto Light';
src: url(//newsmile.in.ua/wp-content/themes/dantist_anytheme/inc/css/fonts/Roboto Light.ttf);
}
@font-face {
font-family: 'Roboto Bold Italic';
src: url(//newsmile.in.ua/wp-content/themes/dantist_anytheme/inc/css/fonts/Roboto Bold Italic.ttf);
}
@font-face {
font-family: 'Roboto Condensed';
src: url(//newsmile.in.ua/wp-content/themes/dantist_anytheme/inc/css/fonts/Roboto Condensed.ttf);
}
@font-face {
font-family: 'Roboto Italic';
src: url(//newsmile.in.ua/wp-content/themes/dantist_anytheme/inc/css/fonts/Roboto Italic.ttf);
}
@font-face {
font-family: 'Roboto Medium Italic';
src: url(//newsmile.in.ua/wp-content/themes/dantist_anytheme/inc/css/fonts/Roboto Medium Italic.ttf);
}
@font-face {
font-family: 'MarckScript Regular';
src: url(//newsmile.in.ua/wp-content/themes/dantist_anytheme/inc/css/fonts/MarckScript-Regular.ttf);
}
@font-face {
font-family: 'Inter Extra Light BETA';
src: url(//newsmile.in.ua/wp-content/themes/dantist_anytheme/inc/css/fonts/inter extra light.ttf);
}
:root{
--colspace: 50px;
--header-height: 930px;
--paddingspace: 40px;
--margin_space: 40px;
--vh : 1;
}
p, a{
padding: 0;
}
*{
box-sizing: border-box;
margin: 0;
padding: 0;
line-height: 1;
}
html{
width: 100%;
max-width: 100vw;
}
body{
max-width: 100vw; min-height: calc(100vh - 37px);
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
font-family: 'Roboto';
}
.full_container{
min-width: 100%;
width: 100%;
position: relative;
overflow-x: hidden !important;
}
header, footer{
width: 100%;
min-height: 3rem;
margin: 0;
text-align: center;
}
section{
height: auto !important;
}
table{
border-collapse: collapse;
}
ul{
list-style: none;
}
p{ font-family: 'Inter Extra Light BETA', sans-serif;
font-size: 20px;
line-height: 1.3;
}
.container {
width: 1200px;
margin: 0 auto;
}
.row{
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.justify-between{
-ms-justify-content: space-between;
justify-content: space-between;
align-items: center;
}
.justify-center{
align-items: center;
justify-content: center;
}
.justify-around{
justify-content: space-around;
}
.justify-start{
-webkit-justify-content: flex-start;
justify-content: flex-start;
}
.justify-end{
justify-content: flex-end;
}
.justify-evenly{
justify-content: space-evenly;
}
.align-start{
align-items: flex-start;
}
.align-center{
align-items: center !important;
}
.align-end{
align-items: flex-end;
}
.col-1{width: calc(100% / 1 - ( 1/1*0 * var(--colspace) ) );}
.col-2{width: calc(100% / 2 - ( 1/2*1 * var(--colspace) ) );}
.col-3{width: calc(100% / 3 - ( 1/3*2 * var(--colspace) ) );}
.col-4{width: calc(100% / 4 - ( 1/4*3 * var(--colspace) ) );}
.col-5{width: calc(100% / 5 - ( 1/5*4 * var(--colspace) ) );}
.col-6{width: calc(100% / 6 - ( 1/6*5 * var(--colspace) ) );}
.col-2_3{width: calc(100% / 3*2 - ( 1/3*2 * var(--colspace) ) );}
.col{
display: flex;
flex-direction: column;
}
.center{
text-align: center;
}
.left{
text-align: left;
}
.right{
text-align: right;
}
.vw100{
width: 100% !important;
overflow: hidden;
}
.w_45{
width: 45%;
}
.w_100{
width: 100%;
}
.w_100vw{
min-width: 100vw !important;
}
.height_100{
min-height: 100% !important;
}
.padding{
padding: var(--paddingspace);
}
.padding-vertical{
padding: 30px 0;
}
.padding-horizontal{
padding: 0 30px;
}
.no_wrap{
flex-wrap: nowrap !important;
}
.bold{
font-weight: bold;
}
.black{
color: black;
}
.margin-top{
margin-top: 40px !important;
}
section{
margin: 40px auto;
padding: var(--paddingspace) 0;
}
.relative{
position: relative;
}
.absolute{
position: absolute;
}
.btn{
border: 2px solid #c6c7c8;
border-radius: 5px;
padding: 10px 50px;
color: black;
font-size: 30px;
font-family: "MarckScript Regular";
} header{
font-family: 'Roboto', sans-serif;
font-weight: lighter;
}
nav li {
font-family: 'Roboto', sans-serif;
font-weight: normal;
}
a {
font-family: 'Roboto', sans-serif;
text-decoration: none;
outline: none;
display: block;
}
.font-MarckScript{
font-family: "MarckScript Regular";
}
@media screen and (max-width: 1200px) {
:root{
--header-height: 700px;
}
.container{
width: 1000px;
}
}
@media screen and (max-width: 1030px) {
.container{
width: 900px;
}
}
@media screen and (max-width: 900px) {
.container{
width: 800px;
}
p{
font-size: 16px;
line-height: 1.1;
}
}
@media screen and (max-width: 860px) {
.container{
width: 800px;
}
}
@media screen and (max-width: 810px) {
.container{
width:  750px;
}
}
@media screen and (max-width: 770px) {
:root{
--header-height: 630px;
--paddingspace: 20px;
--margin_space: 20px;
}
.container{
width:  700px;
}
section{
margin: 10px auto!important;
padding-left: 10px;
padding-right: 10px;
}
}
@media screen and (max-width: 710px) {
.container{
width:  650px;
}
}
@media screen and (max-width: 680px) {
.container{
width:  600px;
}
}
@media screen and (max-width: 660px) {
.container{
width:  550px;
}
}
@media screen and (max-width: 610px) {
:root{
--header-height: 530px;
}
.container{
width:  450px;
}
p {
font-size: 16px;
line-height: 1.1;
}
}
@media screen and (max-width: 560px) {
.container{
width: 420px;
}
}
@media screen and (max-width: 510px) {
.btn {
padding: 10px 50px;
color: black;
font-size: 20px;
font-family: "MarckScript Regular";
}
}
@media screen and (max-width: 460px) {
:root{
--header-height: 420px;
}
.container{
width:  360px;
}
}
@media screen and (max-width: 410px) {
.container{
width:  320px;
}
p{
font-size: 14px;
}
.padding-vertical{
padding: 10px 0;
}
}
@media screen and (max-width: 330px) {
.container{
width:  270px;
}
} header{ top: 0;
left: 0;
width: 100%;
height: auto;
margin: 0;
padding: 0;
flex: 0 0 auto;
overflow: hidden;
}
header a {
transition: .3s ease-in-out;
}
.navigation{
height: 120px;
margin: 0 auto;
padding: 10px 30px;
background: white; font-family: 'Inter Extra Light BETA', sans-serif !important;
font-size: 20px;
}
.title{
height: 100%;
margin: 0;
}
.site-title,
.site-description,
.site-title a{
color: black;
margin: auto 2px 0 2px;
}
.site-title a:hover{
color: black;
text-decoration: none;
}
h1.site-title{
font-style: italic;
margin-bottom: 1px;
}
.site-description{
margin: auto 2px 0 2px;
}
.site-info,
.site-contacts{
height: 100%;
}
.logo{
width: 100px;
height: auto;
margin-right: 30px;
}
img.custom-logo{
width: 120px;
height: 100px;
}
.header-contacts{
height: 100% !important;
}
.header-contacts p,
.header-contacts a{
padding: 5px 5px 0 5px;
color: black !important;
text-decoration: none;
}
.languages{
background: #d4d4d4;
padding: 3px;
margin:auto 30px 0 30px;
justify-content: flex-end;
align-items: center;
}
.languages a.current-lang{
background: white;
}
.languages a{
font-family: 'Inter Extra Light BETA', sans-serif !important; color: black;
padding: 5px 10px;
}
img.photo_icon{
height: 60px;
width: 30px;
}
.navigation-menu{   height: 70px;
background: black; }
.site-tagline{
height: 40px;
width: auto;
position: absolute;
top: calc(100% - 60px);
left: 0;
font-family: Roboto;
font-weight: 500;
font-size: 36px;
color: white;
z-index: 2; text-transform: uppercase;
text-align: right !important;
}
.site-tagline h3{
text-align: left;
margin-left: var(--paddingspace);
text-shadow: #000 4px 0 8px;
}
#video-banner{
position: relative;
min-width: 100%;
height: 700px; padding: 0;
margin: 0;
display: block;
overflow: hidden; }
#video-banner video{
position: absolute;
min-width: 100%;
min-height: 100%;
left: 50%;
top: 50%;
width: auto;
height: auto;
transform: translate(-50%,-50%);
-webkit-transform: translate(-50%,-50%);
z-index: -1;
}
#video-banner img{
position: relative;
left: 50%;
transform: translate(-50%);
min-width: 100% !important; height: auto;
}
@media screen and (max-width: 2000px) {   }
@media screen and (max-width: 1300px) {
#video-banner{
height: 500px;
}
.site-tagline {
top: calc(100% - 50px);
}
}
@media screen and (max-width: 1200px){
.site-info,
.site-contacts{
width: 50%;
flex-wrap: nowrap !important;
}
.site-description{
text-align: left;
word-wrap: break-spaces;
}    }
@media screen and (max-width: 1030px){
.navigation{
padding: 10px;
}
ul.top-menu li  a {
font-size: 16px !important;
}
#video-banner{
height: 500px;
}
}
@media screen and (max-width: 900px) {
.site-info,
.site-contacts{
width: 50%;
flex-wrap: nowrap !important;
}
.navigation{
font-size: 18px !important;
}
.languages {
margin: auto 10px 0 10px;
}
.site-info{
justify-content: flex-start;
}
.site-contacts{
justify-content: flex-end;
}
.title{
width: 60%;
}
.site-description{
text-align: left;
word-wrap: break-spaces;
}
.site-tagline{
font-size: 30px;
}
}
@media screen and (max-width: 800px) {
.navigation{
font-size: 16px !important;
}
}
@media screen and (max-width: 770px){
#video-banner{
height: 430px; }
.site-contacts {
flex-wrap: wrap !important;
}
.header-contacts {
height: auto !important;
}    }
@media screen and (max-width: 700px){
.site-info,
.site-contacts{
width: 40%;
}
.languages{
margin-right: 0 !important;
}
img.custom-logo {
width: 100px;
height: 80px;
}
}
@media screen and (max-width: 600px){
.navigation{
width: 100% !important;
padding-right: 10px !important;
padding-left: 10px !important;
}
#video-banner{
height: 330px;
}
.site-tagline{
font-size: 26px;
top: calc(100% - 40px);
}
.address  p {
text-align: center !important;
}
.hr {
width: 30% !important;
}
.top-info{
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
}
.social{
flex-direction: column;
justify-content: center;
align-items: center;
}
}
@media screen and (max-width: 500px) {
.site-info,
.site-contacts{
width: 50%;
}
.navigation{
padding: 5px;
}   .site-tagline{
font-size: 22px;
}
}
@media screen and (max-width: 420px){
.navigation{
font-size: 14px !important;
width: 100%;
}
.logo{
width: auto;
height: auto;
margin-right: 10px;
}
.navigation-menu {
height: 60px;
}
.site-info{
width: 45%;
}
img.custom-logo{
width: 65px;
height: 60px;
}
#video-banner{
height: 230px;
}
.site-tagline {
height: 30px;
top: calc(100% - 30px) !important;
font-size: 18px;
}
.header-contacts p,
.header-contacts a{
font-size: 14px;
}
img.photo_icon{
height: 45px;
width: 20px;
}
}
@media screen and (max-width: 320px) {
#video-banner{
height: 190px;
}    .header-contacts p,
.header-contacts a{
font-size: 12px !important;
padding: 5px 0 0 1px;
}
} .sub-menu {
background: inherit;
position: absolute;
left: 0;
top: 100%;
z-index: 5;
width: auto;
opacity: 0;
transform: scaleY(0);
transform-origin: 0 0;
transition: .5s ease-in-out;
list-style: none;
}
.sub-menu li{
height: 40px;
padding: 15px 30px 15px 0;
text-align: left;
background: transparent;
}
.sub-menu a {
color: inherit;
text-align: left;
padding: 12px 15px;
font-size: inherit;
border-top: 1px solid rgba(255,255,255,.1);
border-right: none !important;
}
.sub-menu li:last-child a { border-bottom: none; }
.main-menu > li:hover .sub-menu,
.top-menu > li:hover .sub-menu{
opacity: 1;
transform: scaleY(1);
}
.menu-item-has-children > a:after {
content: "▼";
color: inherit;
margin-left: 10px;
}
.sub-menu > li > a:after{
content: "";
}
.main-menu .menu-item-has-children:hover{
border-bottom: 1px solid rgba(255,255,255,.1);
} .menu-main-menu-container{
width: 100% !important;
}
.menu-mobile-navigation-container,
.top-menu{
width: 100% !important;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
text-align: center;
}
ul.top-menu{
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
ul.top-menu li { color: white;
text-align: center;
position: relative;
font-family: 'Roboto', sans-serif;
font-weight: normal;
line-height: 1;
text-align: center;
border-radius: 5px;
padding: 10px;
}
ul.top-menu li > a {
text-transform: uppercase;
font-family: 'Roboto', sans-serif;
font-size: 18px;
color: white; }
ul.top-menu li a:hover { color: #ffffff; }
.menu-item-has-children a:after {
content: "▼";
color: inherit;
margin-left: 10px;
}
ul.top-menu  > li:hover .submenu {
opacity: 1;
transform: scaleY(1);
}
ul.top-menu li.current_page_item {
color: #ffffff;
border: 2px solid white;
}
.top-menu ul li.current_page_item a {
color: #ffffff;
}
ul.top-menu  ul.sub-menu > li{
border-right: none !important;
width: auto !important;
background-color: rgba(167, 167, 167, 0.71) !important;
min-height: 40px !important;
padding: 5px 0 5px 5px !important;
}
ul.top-menu .sub-menu > li > a{
padding: 10px 0;
color: #ffffff !important;
}
@media screen and (max-width: 1200px){
ul.top-menu li > a {
font-size: 14px;
}
}
@media screen and (max-width: 770px){
nav.top-navigation{
display: none;
}
} .menu_icon{
width: 50px;
height: 40px;
font-size: 30px;
cursor: pointer;
position: absolute;
top: 135px !important;
left: calc(50% - 25px) !important;
display: none;
z-index: 10;
border: 1px solid white;
border-radius: 3px;
}
.menu_icon img{
padding: 5px;
height: 100%;
width: 100%;
}
.mobile-navigation{
position: absolute;
top: 180px;
left: 100%;
color: white; width: 0;
height: auto;
padding-left: 10px;
padding-right: 10px;
overflow: hidden;
border-radius: 5px;
background: black;
transition: .5s linear;
z-index: 99;
display: none;
}
.mob-menu{
list-style: none;
display: flex;
flex-direction: column;
justify-content: center;
align-content: center;
padding-left: 10px;
padding-right: 10px;
}
ul.mob-menu > li{
height: 40px !important;
padding: 10px;
text-align: center;
font-size: 18px;
font-family: "Roboto";
cursor: pointer;
}
ul.mob-menu > li:not(:last-child){
border-bottom: 1px solid white;
}
.mob-menu > li > a{
color: #777777;
}
.mob-menu li.current_page_item {
color: white;
text-decoration: underline;
}
.mob-menu li.current_page_item a {
color: white;
}
.menu-mobile-navigation-container{
justify-content: center;
align-items: center;
}
@media screen and (max-width: 770px){
.menu_icon,
.mobile-navigation{
display: block;
}
}
@media screen and (max-width: 420px){
.menu_icon{
top: 130px !important;
}
} main{
flex: 1 0 auto;
padding-bottom: var(--paddingspace);
}
.cards{
font-family: Roboto;
font-size: 20px;
}
.card h3{
font-size: 20px;
}
.card img {
padding: 20px;
width: 300px;
height: 265px;
border: 2px solid #bebebe;
margin-bottom: 20px;
margin-top: 20px;
}
.card a.button{
border: 2px solid #d4d4d4;
border-radius: 3px;
background: white;
width: 220px;
height: 46px;
color: black;
text-decoration: none;
}
.img-list{
height: auto;
}
.img-list > div:nth-child(1),
.img-list > div:nth-child(2){
height: 650px;
width: 475px;
}
.img-list > div:nth-child(1){
background: url(https://newsmile.in.ua/wp-content/uploads/2023/09/0393-min-1.jpg) no-repeat, center center;
background-size: cover;
}
.img-list .list{
font-family: 'MarckScript Regular';
width: 85% !important;
margin-right: auto;
margin-left: auto;
display: flex;
flex-direction: column;
justify-content: center;
}
.list h3{
font-size: 36px;
margin-bottom: var(--margin_space);
margin-left:100px;
}
.list ul{
margin-left: auto;
margin-right: auto;
}
.list li{
font-size: 24px;
margin: 10px auto;
}
.list li:before {
content: '';
display: inline-block;
height: 15px;
width: 15px;
background: url(//newsmile.in.ua/wp-content/themes/dantist_anytheme/img/check_mark.png) no-repeat center center;
background-size: contain;
padding-right: 20px;
}
.list li p{
padding-left: 10px;
}
.border{
width: 100%;
height: 100%;
padding: 2px;
border: 2px solid transparent;
background: linear-gradient(to bottom right, #d4d4d4 5%, white 30%, white 70%, #d4d4d4 95%) no-repeat;
}
.border div:first-child{
width: 100%;
height: 100%;
background: white;
}
.dd_height {
height : auto !important;
}
.form-img > div:nth-child(1),
.form-img > div:nth-child(2){
height: 650px;
width: 475px;
}
.form-img > div:nth-child(2){
background: url(//newsmile.in.ua/wp-content/themes/dantist_anytheme/img/main_5.jpg) no-repeat, center center;
background-size: cover;
}
.form-img .form{
width: 80% !important;
margin-right: auto;
margin-left: auto;
display: flex;
flex-direction: column;
justify-content: center;
}
.form h3{
font-family: 'MarckScript Regular';
font-size: 36px;
margin-bottom: var(--marginspace);
text-align: center;
}
.form p{
font-family: "Roboto Light";
font-size: 18px;
margin-bottom: var(--margin_space);
text-align: center;
}
.full_picture{
height: 625px !important;
border: 2px solid #bebebe;
padding: 20px;
position: relative;
}
.picture{
width: 100%;
height: 100%;
background: url(https://newsmile.in.ua/wp-content/uploads/2023/09/0391-min.jpg) no-repeat, center center !important;
background-size: cover !important;
z-index: 1;
}
.main-info_block,
.info_block{
align-self: flex-end;
width: 100%;
height: 135px;
font-family: "MarckScript Regular" !important;
font-size: 24px !important;
line-height: 1.3;
background: rgba(198, 199, 200, 0.76);
padding: 20px;
top: calc(100% - 135px);
z-index: 2;
}
.info_block p{
font-family: "MarckScript Regular" !important;
font-size: 24px !important;
line-height: 1.3;
}
.main-info_block{
display: none;
}
@media screen and (max-width: 1200px){
.cards{
justify-content: space-around;
align-items: center;
}
.main-info_block,
.info_block{
line-height: 1;
}
.info_block p {
font-size: 22px !important;
}
}
@media screen and (max-width: 1030px){
:root{
--marginspace: 20px;
--paddingspace: 20px;
}
.cards{
align-items: center;
}
.card{
margin-top: 30px;
font-size: 18px;
}
.card h3{
font-size: 18px;
}
.card img {
width: 275px;
height: 245px;
}
.img-list,
.form-img{
width: 100%;
height: auto;
}
.list h3,
.form-img h3{
text-align: center;
font-size: 30px;
margin-left: 0;
margin-bottom: 10px;
}
.form p{
margin-bottom: 10px;
}
.list li{
font-size: 22px;
margin: 5px auto;
}
.img-list > div:nth-child(1),
.img-list > div:nth-child(2),
.form-img > div:nth-child(1),
.form-img > div:nth-child(2){
height: 600px;
width: 400px;
}
.full_picture{
height: 575px !important;
}
.info_block p {
font-size: 20px !important;
line-height: 1.2;
}
}
@media screen and (max-width: 900px) {
.col-3{width: 45%;}
.list h3, .form-img h3 {
font-size: 26px;
}
.img-list > div:nth-child(1),
.img-list > div:nth-child(2),
.form-img > div:nth-child(1),
.form-img > div:nth-child(2){
height: 500px;
width: 350px;
}
.list{
width: 90%;
}
.list li{
font-size: 18px;
margin: 5px auto;
}
.form-img .form {
width: 85% !important;
}
.form p,
.form h3{
margin-bottom: 10px;
}
.form p{
font-size: 14px;
}
.main-info_block,
.info_block{
font-size: 22px;
}
.full_picture{
height: 500px !important;
}
}
@media screen and (max-width: 850px) {
.list{
width: 95%;
}
.list h3,
.form-img h3{
font-size: 31px;
text-align: center;
}
.list li{
margin: 2px auto;
}
.list li:before {
height: 10px;
width: 10px;
padding-right: 20px;
}
}
@media screen and (max-width: 770px) {
.info_block{
display: none;
}
.main-info_block{
display: block;
height: 160px;
}
.main-info_block p{
text-align: center;
font-size: 20px;
line-height: 1.2;
}
.full_picture{
height: 435px !important;
}
}
@media screen and (max-width: 710px) {
section{
padding: 0;
}
.img-list > div:nth-child(2){
order: 1;
}
.img-list > div:nth-child(1),
.form-img > div:nth-child(2){
order: 2;
}
.img-list > div:nth-child(1),
.img-list > div:nth-child(2),
.form-img > div:nth-child(1),
.form-img > div:nth-child(2){
height: 650px;
width: 470px;
margin-top: 30px;
}
.list h3,
.form-img h3{
font-size: 36px;
margin-bottom: var(--margin_space);
text-align: center;
}
.list ul{
margin-left: auto;
margin-right: auto;
}
.list li{
font-size: 24px;
margin: 10px auto;
}
.list li:before {
height: 15px;
width: 15px;
padding-right: 20px;
}
.form p{
margin: 7px auto;
}
.full_picture{
margin: 20px auto !important;
height: 400px !important;
}
}
@media screen and (max-width: 660px) {
.col-3{
width: 45%;
}
.card img {
width: 260px;
height: 240px;
padding: 15px;
}
.full_picture{
height: 355px !important;
}
.main-info_block{
height: 200px;
}
.main-info_block p{
font-size: 20px;
}
}
@media screen and (max-width: 600px) {
.col-3 {
width: 70%;
}
.card img {
width: 300px;
height: 265px;
padding: 15px;
}
.full_picture{
height: 275px !important;
padding: 10px;
}
}
@media screen and (max-width: 500px) {
.img-list > div:nth-child(1),
.img-list > div:nth-child(2),
.form-img > div:nth-child(1),
.form-img > div:nth-child(2){
height: 600px;
width: 400px;
}
.list h3,
.form-img h3{
font-size: 30px;
text-align: center;
}
.list li{
font-size: 20px;
margin: 10px auto;
}
.list li:before {
height: 10px;
width: 10px;
padding-right: 20px;
}
.full_picture{
margin-top: 0 !important;
height: 235px !important;
padding: 5px;
}
.main-info_block{
height: 220px;
}
}
@media screen and (max-width: 420px) {
.img-list > div:nth-child(1),
.img-list > div:nth-child(2),
.form-img > div:nth-child(1),
.form-img > div:nth-child(2){
height: 500px;
width: 95%;
}
.list h3,
.form-img h3{
font-size: 28px;
text-align: center;
}
.list li{
font-size: 18px;
margin: 5px auto;
}
.form p,
.form h3{
margin-bottom: 5px;
}
.form p{
font-size: 16px;
margin: 0 auto 5px auto;
padding-bottom: 5px;
}
.full_picture{
height: 195px !important;
}
.main-info_block p{
font-size: 18px;
line-height: 1.2;
}
}
@media screen and (max-width: 320px) {
.card img {
width: 260px;
height: 240px;
padding: 15px;
}
.img-list > div:nth-child(1),
.img-list > div:nth-child(2),
.form-img > div:nth-child(1),
.form-img > div:nth-child(2){
height: 450px;
width: 300px;
margin-top: 20px;
}
.list h3,
.form-img h3{
font-size: 24px;
text-align: center;
}
.list li{
font-size: 16px;
margin: 5px auto;
}
.form p,
.form h3{
margin-bottom: 5px;
}
.form h3{
font-size: 22px;
line-height: 1;
}
.form p{
font-size: 14px;
}
.full_picture{
height: 155px !important;
}
.main-info_block p{
font-size: 18px;
}
} footer{
flex: 0 0 auto;
background: #b3b3b3;
color: black;
font-family: "Roboto Light";
padding: var(--paddingspace);
font-size: 20px;
}
.address p, .social a{
font-family: "Roboto Light";
font-size: 20px;
margin-bottom: 10px;
}
.address div, .social div {
margin-top: 10px;
margin-bottom: 10px;
}
footer .social div {
margin-bottom: 0;
}
footer .social_icons{
margin-top: 30px;
z-index : 100;
}
.facebook,
.instagram{
display: inline-block;
overflow: hidden;
border-radius: 50%;
width: 40px;
height: 40px;
margin: auto 10px;
color:transparent !important;
cursor: pointer;
}
.facebook{
background: url(//newsmile.in.ua/wp-content/themes/dantist_anytheme/img/facebook_icon.png) no-repeat;
background-size: cover;
}
.instagram{
background: url(//newsmile.in.ua/wp-content/themes/dantist_anytheme/img/instagram_icon.png) no-repeat;
background-size: cover;
}
.facebook a,
.instagram a{
display: block;
width: 100%;
height: 100%;
cursor: pointer;
}
.footer-logo{
margin-top: -40px !important;
}
.hr{
width: 40%;
border-bottom: 1px solid #666668;
margin-bottom: 10px;
}
.copyright{
font-size: 20px;
margin-top: var(--margin_space) !important;
}
a.info-dev{
margin-top: 10px;
font-size: 18px;
color: black !important;
}
.info-dev span{
font-size: 16px;
}
@media screen and (max-width: 770px) {
footer,
.address p, .social a,
.copyright,
footer .header-contacts p{
font-size: 18px;
}
.footer-logo{
margin-top: var(--margin_space) !important;
}
}
@media screen and (max-width: 600px) {
footer .social_icons{
margin-top: 10px;
}
} .aside-navigation {
background: #f3f3f3;
border: 1px solid #e7e7e7;
}
.aside-menu {
margin: 0;
padding: 0;
text-transform: uppercase;
}
.aside-menu li {
font-weight: 300;
list-style: square inside;
border-top: 1px solid #e7e7e7;
font: 14px 'Oswald', sans-serif;
padding: 10px;
font-weight: 300;
}
.aside-menu li:first-child {
border: none;
}
.aside-menu li.current-menu-item,
.aside-menu li.current-menu-item a {
color: #000d2b;
}
.aside-menu a {
color: #8f8f8f;
text-decoration: none;
}
.sidebar-heading {
background: rgba(0, 13, 43, 0.71);
font: 14px 'Oswald', sans-serif;
color: #fff;
padding: 10px;
margin: 0;
text-transform: uppercase;
}
.map {
padding: 10px;
margin: 0 0 30px 0;
}
.diagnostic.banner{
background: url(https://newsmile.in.ua/wp-content/uploads/2023/09/0018-min.jpg)no-repeat, center center;
background-size: cover;
}
.diagnostic .padding-vertical{
padding: 20px 0;
}
.diagnostic .list li{
font-family: "Roboto Light";
font-size: 20px;
margin: 10px auto;
line-height: 1.3;
padding-right: 20px !important;
}
.img-list.diagnostic > div:nth-child(1).img_1{
background: url(https://newsmile.in.ua/wp-content/uploads/2023/09/0183-min-2.jpg) no-repeat, center center;
background-size: cover;
}
.img-list.diagnostic > div:nth-child(1).img_2{
background: url(https://newsmile.in.ua/wp-content/uploads/2020/08/diagnostics_kt_4.jpg) no-repeat, center center;
background-size: cover;
}
@media screen and (max-width: 900px){
.img-list.diagnostic > div:nth-child(1),
.img-list.diagnostic > div:nth-child(2){
height: 500px;
width: 60%;
margin-top: 20px;
}
.diagnostic .list li {
font-size: 16px;
margin: 10px auto;
line-height: 1.1;
padding-right: 20px !important;
}
}
@media screen and (max-width: 800px){
.img-list.diagnostic > div:nth-child(1),
.img-list.diagnostic > div:nth-child(2){
height: 500px;
width: 80%;
}
}
@media screen and (max-width: 710px){
.img-list.diagnostic > div:nth-child(1) {
order: 1;
}
}
@media screen and (max-width: 650px){
.diagnostic:not(.banner){
width: 90%;
}
.img-list.diagnostic > div:nth-child(1),
.img-list.diagnostic > div:nth-child(2){
width: 100%;
}
}
@media screen and (max-width: 610px){
.diagnostic .list li{
font-size: 16px;
margin: 10px auto;
line-height: 1.1;
padding-right: 20px !important;
}
}
@media screen and (max-width: 420px) {
.diagnostic:not(.banner) {
width: 94%;
}
.diagnostic .list li {
font-size: 14px;
}
.diagnostic .padding-vertical{
padding: 20px 0 !important;
}
}
.cont{
margin: auto;
max-width: 1000px;
}
.formatText li{
font-weight: 100;
font-family: "Roboto Light";
font-size: 17px;
}
.InfoCard{
display: flex;
justify-content: center;
flex-direction: row;
flex-wrap: wrap; margin: 10px 0;
}
.InfoCard img{
padding: 20px;
width: 300px;
height: 265px;
border: 2px solid #bebebe;
margin: 20px 10px;
}
.borderText {
padding: 20px;
max-width: 657px;
max-height: fit-content;
border: 2px solid #bebebe;
margin: 20px 10px;
}
.borderText p{
font-size: 17px !important;
}
.underline{ margin: 20px 0 0 20px;
}
.child.banner{
background: url(https://newsmile.in.ua/wp-content/uploads/2020/08/DantChild.jpg)no-repeat, center center;
background-size: cover;
}
.child .padding-vertical{
padding: 20px 0;
}
.child .list li{
font-family: "Roboto Light";
font-size: 20px;
margin: 10px auto;
line-height: 1.3;
padding-right: 20px !important;
}
.img-list.child > div:nth-child(1).img_1{
background: url(https://test.web2018.dp.ua/wp-content/uploads/2020/08/childs_2.jpg) no-repeat, center center;
background-size: cover;
}
.img-list.child > div:nth-child(1).img_2{
background: url(https://test.web2018.dp.ua/wp-content/uploads/2020/08/childs_kt_4.jpg) no-repeat, center center;
background-size: cover;
}
@media screen and (max-width: 900px){
.img-list.child > div:nth-child(1),
.img-list.child > div:nth-child(2){
height: 500px;
width: 60%;
margin-top: 20px;
}
}
@media screen and (max-width: 800px){
.img-list.child > div:nth-child(1),
.img-list.child > div:nth-child(2){
height: 500px;
width: 80%;
}
}
@media screen and (max-width: 710px){
.img-list.child > div:nth-child(1) {
order: 1;
}
}
@media screen and (max-width: 650px){
.child:not(.banner){
width: 90%;
}
.img-list.child > div:nth-child(1),
.img-list.child > div:nth-child(2){
width: 100%;
}
}
@media screen and (max-width: 610px){
.child .list li{
font-size: 16px;
margin: 10px auto;
line-height: 1.1;
padding-right: 20px !important;
}
}
.cont{
margin: auto;
max-width: 1000px;
}
.formatText li{
font-weight: 100;
font-family: "Roboto Light";
font-size: 17px;
}
.InfoCard{
display: flex;
justify-content: center;
flex-direction: row;
flex-wrap: wrap; margin: 10px 0;
}
.InfoCard img{
padding: 20px;
width: 300px;
height: 265px;
border: 2px solid #bebebe;
margin: 20px 10px;
}
.borderText {
padding: 20px;
max-width: 657px;
max-height: fit-content;
border: 2px solid #bebebe;
margin: 20px 10px;
}
.borderText p{
font-size: 17px !important;
}
.underline{ margin: 20px 0 0 20px;
}
.grown.banner{
background: url(https://newsmile.in.ua/wp-content/uploads/2023/09/7390042-min.jpg)no-repeat, center center;
background-size: cover;
}
.grown .padding-vertical{
padding: 20px 0;
}
.grown .list li{
font-family: "Roboto Light";
font-size: 20px;
margin: 10px auto;
line-height: 1.3;
padding-right: 20px !important;
}
.img-list.grown > div:nth-child(1).img_1{
background: url(https://newsmile.in.ua/wp-content/uploads/2020/08/growns_2.jpg) no-repeat, center center;
background-size: cover;
}
.img-list.grown > div:nth-child(1).img_2{
background: url(https://newsmile.in.ua/wp-content/uploads/2020/08/growns_kt_4.jpg) no-repeat, center center;
background-size: cover;
}
@media screen and (max-width: 900px){
.img-list.grown > div:nth-child(1),
.img-list.grown > div:nth-child(2){
height: 500px;
width: 60%;
margin-top: 20px;
}
}
@media screen and (max-width: 800px){
.img-list.grown > div:nth-child(1),
.img-list.grown > div:nth-child(2){
height: 500px;
width: 80%;
}
}
@media screen and (max-width: 710px){
.img-list.grown > div:nth-child(1) {
order: 1;
}
}
@media screen and (max-width: 650px){
.grown:not(.banner){
width: 90%;
}
.img-list.grown > div:nth-child(1),
.img-list.grown > div:nth-child(2){
width: 100%;
}
}
@media screen and (max-width: 610px){
.grown .list li{
font-size: 16px;
margin: 10px auto;
line-height: 1.1;
padding-right: 20px !important;
}
}
.grown.banner.our_team {
background : url(https://newsmile.in.ua/wp-content/uploads/2023/09/0386-min-1.jpg)no-repeat, center center;
background-size : cover;
}
.dd_height {
height : auto !important;
} html {
scroll-behavior : smooth; } section.dd_cards,
.dd_descriptionCards {
max-width : 1170px;
margin-left : auto;
margin-right : auto;
display : flex;
flex-wrap : wrap;
justify-content : space-around;
}
section.dd_cards .dd_card,
section.dd_descriptionCards .dd_card {
width : 344px;
display : flex;
flex-wrap : wrap;
justify-content : center;
margin : 0 0 50px 0;
}
section.dd_cards .dd_card .dd_titleForCard,
section.dd_descriptionCards .dd_card .dd_titleForCard {
width : 100%;
text-align : center;
margin-bottom : 10px;
font-size : 20px;
}
section.dd_cards .dd_card .dd_imgForCard,
section.dd_descriptionCards .dd_card .dd_imgForCard {
border : solid 2px #d4d4d4;
padding : 20px;
width : 100%;
margin-bottom : 20px;
}
section.dd_cards .dd_card .dd_imgForCard>img, section.dd_descriptionCards .dd_descriptionCard .dd_imgForCard>img {
width: 300px;
height: 270px;
object-fit: cover;
object-position: 0 20%;
}
section.dd_cards .dd_card a,
section.dd_descriptionCards .dd_descriptionCard a {
font-size : 20px;
padding : 10px 50px;
border : solid 2px #d4d4d4;
border-radius : 5px;
background-color : white;
cursor : pointer;
outline : none !important;
color : black;
}  section.dd_descriptionCards .dd_descriptionCard {
max-width : 1170px;
display : flex;
flex-wrap : wrap !important;
align-items : flex-start;
justify-content : space-between !important;
margin-bottom : 50px;
}
section.dd_descriptionCards .dd_card {
margin-bottom : 0 !important;
}
section.dd_descriptionCards .dd_descriptionText {
max-width : 777px;
margin : 30px 0 0 30px;
border : solid 2px #d4d4d4; padding : 10px;
min-height : 310px;
} 
section.dd_descriptionCards .dd_descriptionText p,
section.dd_descriptionCards .dd_descriptionText span{
line-height : 1.3;
font-size : 20px;
}
section.dd_descriptionCards .dd_textStrong {
font-weight : bold;
font-size : 20px;
}
h3.dd_textStrong {
font-weight : normal !important;
}  @media screen and (max-width: 1150px) {
section.dd_descriptionCards .dd_descriptionText {
margin : 30px 0 0 0;
min-height : auto;
} 
}  @media screen and (max-width: 1120px) {
section.dd_descriptionCards .dd_descriptionCard {
justify-content : center !important;
}
section.dd_descriptionCards .dd_descriptionText {
margin : 20px 0 0 0;
min-height : auto;
}
section.dd_cards .dd_card {
width : 314px;
}
section.dd_cards .dd_card .dd_imgForCard>img {
width : 270px;
height : auto;
}
}  @media screen and (max-width: 770px) {
section.dd_descriptionCards .dd_descriptionText {
margin : 20px 10px 0 10px;
} 
}  @media screen and (max-width: 360px) {
section.dd_cards .dd_card,
section.dd_descriptionCards .dd_card {
width : 100%;
margin : 0 10px 50px 10px;
}
section.dd_descriptionCards .dd_descriptionText p,
section.dd_descriptionCards .dd_descriptionText span {
font-size : 18px;
}
section.dd_cards .dd_card .dd_imgForCard>img,
section.dd_descriptionCards .dd_descriptionCard .dd_imgForCard>img {
width : 100%;
height : auto;
}
} a.dd_goUp {
outline : none;
position : fixed;
bottom : -120px;
right : 25px;
border-radius : 50%;
border : solid 1px black;
width : 50px;
height : 50px;
font-size : 37.5px;
background-color : black; color : white;
cursor : pointer;
transition : all .5s;
z-index : 100;
}  .vl_border{
width: 100%;
height: auto !important;
padding: 2px;
border : solid 2px transparent !important;
border-image: linear-gradient(to left top, #d4d4d4 10%, transparent 30%, transparent 70%, #d4d4d4 90%) !important;
border-image-slice: 1 !important; }
.vl_container-header div{
width: 33%;
}
.vl_contacts span{
font-family: "Roboto Light";
font-size: 20px;
line-height: 1.2;
}
.vl_contacts a{
line-height: 1.2;
color: black;
text-decoration: none;
font-family: "Roboto Light";
font-size: 20px;
}
.vl_contacts a.order{
-webkit-border-radius: 3px;
border-radius: 5px;
border: 2px solid #d4d4d4;
width: 230px;
height: 45px;
text-align: center;
padding: 12px 0;
font-family: 'Roboto';
font-weight: bold;
margin-top: 12px;
line-height: 1;
}
.vl_border > div:first-child{
width: 100%; height: auto !important;
background: white;
}
.vl_form-block{
height: auto;
}
.vl_h3{
text-align: center;
font-family: "MarckScript Regular";
font-size: 36px;
}
.vl_form-block p{
margin: 40px 0;
text-align: center;
line-height: 1.2;
font-family: "Roboto Light";
font-size: 20px;
}
.vl_form-block > div:last-child, .vl_form-block > div:first-child{
height: 650px;
width: 49%;
}
.vl_form-block > div:last-child{
background: url(https://newsmile.in.ua/wp-content/uploads/2020/08/flowers.png) no-repeat;
background-position: right center;
background-size: cover;
}
.vl_map iframe{
width: 100%;
height: 500px;
}
.vl_present-card img{
width: 50%;
}
@media screen and (max-width: 810px){
.vl_contacts a.order{
width: 210px;
}
.vl_contacts span{
font-size: 18px;
}
.vl_contacts a {
line-height: 1.5;
font-size: 18px;
}
}
@media screen and (max-width: 715px){
.vl_container-header {
justify-content: space-evenly;
}
.vl_container-header div{
width: 50%;
}
.vl_contacts .vl_border .vl_logo{
order: 3;
}
.vl_form-block > div:last-child, .vl_form-block > div:first-child{
width: 100%;
}
.vl_form-block > div:last-child{
margin-top: 20px;
}
.vl_present-card img{
width: 100%;
}
.vl_map iframe{
height: 450px;
}
}
@media screen and (max-width: 610px){
.vl_container-header div{
margin-bottom: 30px;
align-items: center;
width: 100%;
}
.vl_container-header div:last-child{
margin-bottom: 0;
}
.vl_contacts .vl_border .vl_logo{
justify-content: space-evenly;
order: 0;
}
.vl_map iframe{
height: 360px;
}
}