html, body, div, a, p, table, pre, td, tr, th, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset, img, blockquote, iframe {margin: 0; padding: 0; border: 0; line-height: normal; text-decoration: none; font-family: 'play'; font-weight: normal} 

body {font-size: 1rem; background-color: white; overflow-y: scroll}
h1 {font-size: 1.6rem; font-weight: bold}
h2 {margin-bottom: 1rem; font-size: 1.4rem}
h3 {margin-top: 1rem; font-size: 1.2rem}
h4 {font-size: 1.1rem}
p {margin-bottom: 0.5rem}

a {color: navy}
a:hover {color: #AAF}

.whiteBack {background-color: white}
.white {color: white}
.contentBack {display: flex; flex-direction: column; width: 100%; position: relative; overflow: hidden; text-align: center}
.contentBox {width: 100%; padding: 1rem 0}
.firstContent {padding-top: 55px}

.hide {display: none}
.green {color: green}

#_home {width: 100%; max-width: 850px; background-color: red; margin: 0 auto; position: relative}

.backImg {position: fixed; top: 0; left: 0; width: 100%; height: 100vh; }
.backImg div {width: 100%; max-width: 850px; margin: 0 auto; height: 100vh; background: url(/img/static1.jpg) center; background-size: cover}

.menuDiv {position: fixed; left: 0; top: 0; height: 70px; width: 100%; z-index: 2; background: rgba(255, 255, 255, 0.9)}
.nobold {font-weight: normal; font-size: 1.4rem}
.menuHeader {width: 22rem; margin: 0 auto; margin-top: 5px; display: flex; align-items: center; justify-content: space-between; overflow: hidden}
.imgLogo {height: 40px}
.menuPhone {font-size: 1.1rem}
#_menuList {list-style: none; display: flex; width: 22rem; justify-content: space-between; margin: 0 auto; padding: 0; margin-top: 5px}
#_menuList li {font-size: 0.9rem; font-weight: bold}

.aboutBox {display: flex; flex-direction: row; background-image: linear-gradient(to left, rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 0.75) 30%, rgba(255, 255, 255, 0.95) 100%), url(/img/aboutBack.jpg); background-position: center; background-size: cover;}
.aboutText {width: 72%; margin-left: 2%; text-align: left}  

.typesList {list-style: none; display: flex; width: 100%; justify-content: space-around; margin: 0 auto; padding: 0}
.typesList li {font-size: 0.9rem}
.typesList li img {width: 80%; border-radius: 100%; margin-bottom: 0.5rem}

.reasonsList {list-style: none; width: 70%; margin: 0 auto; padding: 0}
.reasonsList li {font-size: 0.9rem; margin-bottom: 1rem; border: 1px solid #BBB; padding: 0.5rem; border-radius: 0.5rem; background: linear-gradient(to top, rgba(255, 255, 255, 0.75) 15%, rgba(255, 255, 255, 0.87) 40%, rgba(255, 255, 255, 1) 100%), url(/img/reasonsBack.jpg); background-size: cover}
.reasonBold {font-size: 1.2rem; color: #700; font-weight: bold}

.transparentDiv {height: 70vh; width: 100%}

.processBox {background: url(/img/processBack.jpg); background-position: center; background-size: cover}
.processBox h2 {margin-left: 7rem}
.processList {list-style: none; display: flex; flex-wrap: wrap; width: 100%; max-width: 400px; justify-content: space-around; margin: 0 auto; padding: 0}
.processLi {width: 10rem; height: 10rem; font-size: 0.8rem; position: relative; background-color: yellow; border: 1px solid black; border-radius: 100%}
.processLi:nth-child(even) {margin-top: 2rem}
.processLi:nth-child(1) {background: url(/img/process1.jpg); background-size: cover}
.processLi:nth-child(2) {background: url(/img/process2.jpg); background-size: cover}
.processLi:nth-child(3) {background: url(/img/process3.jpg); background-size: cover}
.processLi:nth-child(4) {background: url(/img/process4.jpg); background-size: cover}
.processLi:nth-child(5) {background: url(/img/process5.jpg); background-size: cover}
.processLi:nth-child(6) {background: url(/img/process6.jpg); background-size: cover}
.processLi:nth-child(7) {background: url(/img/process7.jpg); background-size: cover; border: 3px solid white; margin: 0.5rem 0}
.processNum {position: absolute; width: 2.5rem; height: 2.5rem; top:-0.5rem; left: 0rem; font-size: 2rem; font-weight: bold; background-color: white; border: 1px solid black; border-radius: 100%}
.processText {position: absolute; bottom: -0.5rem; right: -0.2rem; border-radius: 0.5rem; padding: 0.5rem; width: 7rem; border: 1px solid black; background-color: rgba(255, 255, 255, 0.8)}
.processList li ul {font-size: 0.7rem; text-align: left; list-style: disc inside; }
.processList li ul li {margin-left: 5px}

.priceBox {margin: 1rem auto; border-radius: 1rem}
#_priceHead {display: none}
.priceBox select {padding: 0.2rem; font-size: 1rem}
#_amountSelect {font-size: 1.4rem; margin-right: 0.5rem; background-color: rgba(255, 255, 255, 0.75)}
.rub {font-size: 0.75em; margin-top: 0.3em; margin-left: 0.3em;}
.priceItem {display: flex; flex-wrap: wrap; border: 1px solid gray; background-color: #EEE; width: 20rem; margin: 1rem auto; padding: 0.5rem; border-radius: 0.5rem}
.priceItem div {display: flex; align-items: top; margin-top: 0.5rem}
.priceItem div:nth-child(odd) {justify-content: flex-end; font-size: 0.9rem; width: 7rem}
.priceItem div:nth-child(even) {text-align: left; margin-left: 1rem; width: 12rem}
.priceItem div:nth-child(1) {align-items: center}
.priceItem div:nth-child(2) {align-items: center}
.priceItem div:nth-child(n+13) {align-items: center; font-size: 1.2rem}
.priceItem div:nth-child(n+14) {align-items: center; font-size: 1.4rem; font-weight: bold}
#_priceAddsLink {font-size: 1.1rem}
#_priceAdds {display: none; flex-wrap: wrap; justify-content: space-between; width: 20rem; margin: 0 auto}
#_priceAdds div {margin-top: 0.5rem}
#_priceAdds div:nth-child(odd) {justify-content: flex-end; text-align: right;  width: 10.5rem}
#_priceAdds div:nth-child(even) {display: flex; align-items: flex-end; text-align: left; width: 9rem}
#_priceAdds div:nth-child(10) {align-items: flex-end; font-size: 0.8rem; text-align: left; width: 9rem}

.presentBox {text-align: left; padding: 0; margin-bottom: 1rem}
.presentHead {position: relative; background: url(/img/presentBack.jpg); background-size: cover; margin-top: 1rem; margin-bottom: 1.5rem; padding: 0.5rem; border: 2px solid white}
.presentBox h2 {margin-right: 1rem; text-align: right}
.presentImg {border: 4px solid white; width: 9rem; position: absolute; top: -1rem; left: 1rem; border-radius: 100%}
.presentText {text-align: center; background: linear-gradient(to top, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.9) 100%), url(/img/presentBack.jpg); background-size: cover; margin-top: -1.5rem; padding: 1rem}
.presentText p:nth-child(1) {margin-top: 1.5rem}


.requizBox {display: flex; flex-wrap: wrap; align-items: center}
#_sendReq {width: 18rem; margin: 1rem auto; border: 1px solid gray; background-color: #EEE; padding: 1rem; border-radius: 1rem}
#_dataReq {display: none; font-size: 0.7rem; margin-top: 1rem; padding: 0.5rem; border: 1px solid gray; background-color: white; border-radius: 0.5rem}
.reqFields input {width: 12rem; font-size: 1.3rem; padding: 0.3rem; background-color: #FDFDFD}
.reqFields {display: flex; flex-wrap: wrap; justify-content: space-between}
.reqFields div {display: flex; align-items: center; margin-bottom: 1rem}
.reqFields div:nth-child(odd) {justify-content: flex-end; width: 4.5rem}
.reqFields div:nth-child(even) {width: 13rem}

.contactsBox {font-size: 0.8rem; margin: 1rem auto}
.contactsBox h3 {margin: 0}
.contactsBox h3:nth-child(3) {margin: 1.5rem auto}
.requiz {display: flex; flex-wrap: wrap; justify-content: space-between; width: 20rem; margin: 0 auto}
.requiz div {display: flex; align-items: top; margin-bottom: 0.5rem}
.requiz div:nth-child(odd) {justify-content: flex-end; width: 30%}
.requiz div:nth-child(even) {text-align: left; width: 65%}
.reqBox button {margin-top: 1rem; font-size: 1.1rem; padding: 0.5rem 1rem; border-radius: 1rem}

.footerBox div {text-align: right; padding-right: 1rem}

