@font-face {
    font-family: Cuprum; /* Имя шрифта */
    src: url(Cuprum-Regular.ttf); /* Путь к файлу со шрифтом */
}

@font-face {
    font-family: Cuprum-Bold; /* Имя шрифта */
    src: url(Cuprum-Bold.ttf); /* Путь к файлу со шрифтом */
}

body p, body li {
    font-family:'Cuprum';	
}

body p {
    color: #222;
    line-height: 1.2;
}

h1 {
    font-family:'Cuprum';
    font-weight:100;
    color:green;
    font-size:42px;		
    text-shadow: 1px 1px 2px rgba(0,0,0,0.1);
    margin-bottom:35px;	
}

h2 {
    color:#466F9E;
    position:absolute;
    font-family:'Cuprum';
    font-size:42px;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.25);
    top:-25px;
}

#logo {
    position:absolute;
    left:2%;
    top:2%;
    z-index:1000;
    width:8%;
    max-width:150px;
    min-width:40px;
}



hr {
    width:99%;
    margin:20px auto;
    border-left:none;
    border-right:none;
    border-top: 1px solid #D8D8D8;
    border-bottom: 1px solid #EFEFEF;
    border-radius:3px;
}

#home h1 {
    position:relative;
    margin:0;
    padding-top:25px;
}


#home hr {
    margin:10px auto; padding:0;
}

header {
    overflow-x:hidden;
}

header .container-fluid {
    min-height: 100vh;
    min-width:200px;
    padding:10% 0;
    width:78%;
}


#about .container-fluid {
    height:auto;
    min-width:200px;
    padding:40px 0 20px 0;
    width:70%;
}


#sonder .container-fluid {
    height:auto;
    min-height: 100vh;
    min-width:200px;
    padding:40px 0;
    width:78%;
}

#orderSection .container-fluid {
    min-height: 100vh;
    min-width:200px;
    padding:40px 0 60px 0;
    width:100%;
}

#orderSection {
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(img/tab7.jpg);    
}

#sonder {
    position:relative;
    background-color:#f0f0f0;
    overflow-y:hidden;
}

#sonder h3, #about h3 {
    font-family:'Cuprum';
    font-size:42px;
    color:#058205;
    margin:20px 0;
    text-shadow:2px 2px 2px rgba(255,255,255,0.2);
    z-index:1000;
}

h4 {
    font-family:'Cuprum';
    font-size:18px;
}

.f-18 {
    font-size:18px;
    width:100%;
    text-align:left;
    background-color:#f9f9f9;
}

.f-18:hover {
    text-decoration:none;
}

h5 {
    font-family:'Cuprum';
    font-size:24px;
    color:#058205;
    text-shadow:2px 2px 2px rgba(255,255,255,0.2);
}


#home {
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(img/tab1.jpg);
}

.goodsBlock {
    background-color:#fff;
    text-align:center;
    max-width:302px;
    padding-bottom:20px;
    margin:10px 0;
    box-shadow: 1px 1px 4px rgba(0,0,0,0.3);
    border-radius:3px;
    cursor:pointer;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;	
}

.goodsBlock:hover {
    -moz-transform: scale(1.05);
    -webkit-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);
}

.goodsBlock img {
    margin:20px auto;
    width:100%;
}
    
.goodsBlock h4 {
    font-family:'Cuprum';
    font-weight:100;
    color:#466F9E;
    font-size:26px;		
    text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
    margin-top:5px;
}



.farmGood {
    position:relative;
    background-color:white;
    max-width:330px;
    min-height:330px;
    padding-bottom:20px;
    margin-bottom:50px;
    text-align:center;		
    border-radius:20px;
    box-shadow: 0 0 5px rgba(0,0,0,0.2);
    z-index:900;
    }

.farmGood img {
    height:180px;
    margin:20px auto 5px auto;
    max-width:98%;
}

hr.storeSpacing {
    width:100%;
    border:none;
    clear:both;
    padding:15px 0;
}


#treeDecorL, #treeDecorR {
    display:none;
    position:absolute;
    z-index:900;
    top:100px;
    filter:contrast(0.75);
    /*filter: brightness(90%);*/
}
#treeDecorL {
    left:0px;
}
#treeDecorR {
    right:0px;
    transform: scale(-1, 1);
}


h6.name {
  position: relative;
  display: inline-block;
  color: #777674;
  font-family:Cuprum;
  font-weight:normal;
  font-size:16px;
  text-decoration: none;
  text-shadow: rgba(255,255,255,.5) 1px 1px, rgba(100,100,100,.3) 3px 7px 3px;
  user-select: none;
  padding: 1em 2em;
  outline: none;
  border-radius: 3px / 100%;
  background-image:
   linear-gradient(45deg, rgba(255,255,255,.0) 30%, rgba(255,255,255,.8), rgba(255,255,255,.0) 70%),
   linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0) 20%, rgba(255,255,255,0) 90%, rgba(255,255,255,.3)),
   linear-gradient(to right, rgba(125,125,125,1), rgba(255,255,255,.9) 45%, rgba(125,125,125,.5)),
   linear-gradient(to right, rgba(125,125,125,1), rgba(255,255,255,.9) 45%, rgba(125,125,125,.5)),
   linear-gradient(to right, rgba(223,190,170,1), rgba(255,255,255,.9) 45%, rgba(223,190,170,.5)),
   linear-gradient(to right, rgba(223,190,170,1), rgba(255,255,255,.9) 45%, rgba(223,190,170,.5));
  background-repeat: no-repeat;
  background-size: 200% 100%, auto, 100% 2px, 100% 2px, 100% 1px, 100% 1px;
  background-position: 200% 0, 0 0, 0 0, 0 100%, 0 4px, 0 calc(100% - 4px);
  box-shadow: rgba(0,0,0,.5) 3px 10px 10px -10px;
}

h6.name:hover {
  transition: .5s linear;
  background-position: -200% 0, 0 0, 0 0, 0 100%, 0 4px, 0 calc(100% - 4px);
}

h6.name:active {
  top: 1px;
}

#sendDopButton {
    cursor:pointer;
    position:absolute;
    bottom:-30px;
    right:-20px;
    background-color:green;
    padding:6px 18px 22px 18px;
    min-width:35px;
    min-height:25px;	
    border-radius:40px;
    box-shadow:inset 0 15px 30px rgba(255,255,255,0.5), 0 0 6px rgba(0,0,0,0.4),inset 0 -8px 8px rgba(0,0,0,0.4),inset 0 3px 3px rgba(255,255,255,0.3);;
}

.farmGood p {
    position:absolute;
    /*display:none;*/
    bottom:-30px;
    right:-20px;
    background-color:#47A347;
    color:#fff;
    padding:24px 20px;
    min-width:35px;
    min-height:25px;
    font-size:18px;
    border-radius:40px;
    box-shadow:inset 0 15px 20px rgba(255,255,255,0.4), 0 0 6px rgba(0,0,0,0.4),inset 0 -8px 8px rgba(0,0,0,0.4),inset 0 3px 3px rgba(255,255,255,0.3);;
}

.farmGood input, .modalInput {
    /*display:none;*/
    width:30px;
    height:30px;
    margin-top:20px;
    text-align:center;
    border:none;
    box-shadow:inset 0 -2px 2px rgba(0,0,0,0.2), inset 0 2px 2px rgba(0,0,0,0.2);
}	
    
.farmGood button, .modalButton {
    /*display:none;*/
    height:30px;
    width:30px;	
    margin-top:20px;
    border:#f8f9fa 1px outset;
}
/*
.modalButton, .modalInput {
    margin-top:0px;
}*/

.farmGood .Rbutton, .modalRButton {
    border-bottom-right-radius: 10px;
    border-top-right-radius: 10px;
}

.farmGood .Lbutton, .modalLButton {
    border-bottom-left-radius: 10px;
    border-top-left-radius: 10px;
}

.red {
  color:#ff887a;
  line-height:3em;
  font-family:Cuprum;
  font-weight:normal;
  font-size:16px;    
}

.price {
    position:absolute;
    font-family:Cuprum;
    /*display:none;*/
    bottom:205px;
    right:40px;
    background-color:#47A347;
    color:white;
    padding:24px 20px;
    min-width:35px;
    min-height:25px;
    font-size:18px;
    border-radius:40px;
    box-shadow:inset 0 15px 20px rgba(255,255,255,0.4), 0 0 6px rgba(0,0,0,0.4),inset 0 -8px 8px rgba(0,0,0,0.4),inset 0 3px 3px rgba(255,255,255,0.3);;
}

#eco2 {
    position: absolute;
}

#villageLabel {
    background:#3C9C3C;
}
#naturalLabel {
    background:#FFBF01;
}
#supplierLabel {
    background:#47709E;
}
#preorderLabel {
    background:#47709E;
}
#discussLabel {
    background:#CCC;
}

.productLabel {
    width:58px;
    height:26px;
    position:absolute;
    top:25px;
    left:-8px;
    display:block;
    box-shadow:inset 0 15px 25px rgba(255,255,255,0.5), -2px 2px 2px rgba(0,0,0,0.25),inset 0 -6px 6px rgba(0,0,0,0.25),inset 0 3px 3px rgba(255,255,255,0.3);;
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px;
    padding:0;
}

.productLabel:hover {
    -moz-transform: scale(0.95);
    -webkit-transform: scale(0.95);
    -o-transform: scale(0.95);
    transform: scale(0.95);    
}

.productLabel:nth-child(2) {
    top:65px;
}
.productLabel:nth-child(3) {
    top:105px;
}
.productLabel:nth-child(4) {
    top:145px;
}
.plTriangle {
    background:transparent;
    border-bottom: 15px solid transparent;
    border-top: 15px solid transparent;
    border-left: 12px solid transparent;
    border-right: 12px solid white;
    display:block;
    position:absolute;
    top:0;
    right:0;
}

.productLabel b {
    font-weight:normal;
    font-family:Cuprum;
    font-size:18px;
    text-align:left;
    position:absolute;
    left:12px;
    color:#fff;
    text-shadow:-1px 1px 1px rgba(0,0,0,0.1);
}

.productLabel::after {
    content:" ";
    display:block;
    height:30px;
    width:2px;
    background-color:#fff;
    position:absolute;
    top:0;
    right:-1px;
}


body li {
 font-size:21px;
 margin:0 5px;
} 

nav {
    background-color: rgba(69,123,176,0.8);
}

.navbar ul {
    margin:0 auto;
}

ul.navbar-nav li {
    margin:0px 10px;
} 

ul.navbar-nav li:hover {
    -moz-transform: scale(1.05);
    -webkit-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05);
}


#wantBox {
    width:140px;
    border-radius:10px;
    background-color:#f9f9f9;
    border: solid 1px #eee;
    font-family:Cuprum;
    font-style:italic;
    color:#bbb;
    font-size:15px;
}

#corbForm h4 {
    font-family:'Cuprum';
    font-weight:normal;
    font-size:23px;
    color:#058205;/* #466F9E;*/ 
    text-align:center;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
    padding-top:15px;
    margin-bottom:10px;
}

#corbForm #infoLabel {
    background-color:#466F9E;
    color:#fff;
    padding:26px 20px;
    margin:15px auto 10px auto;
    display:block;
    width:80%;
    max-width:480px;
    text-align:center;
    min-height:20px;
    border-radius:20px;
    box-shadow:inset 0 15px 30px rgba(255,255,255,0.5), 0 0 6px rgba(0,0,0,0.4);
}

#corb {
    position:fixed;
    right:-164px;
    top:20%;
    padding-top:10px;
    width:160px;
    height:75px;
    background-color:green;
    border-top-left-radius:16px;
    border-bottom-left-radius:16px;		
    box-shadow:inset 0 25px 50px rgba(255,255,255,0.5), 0 0 4px rgba(0,0,0,0.3);
    text-align:center;
    color:#fff;
    z-index:1000;
    cursor:pointer;
}
    
#corb p {
    color:#fff;
}

#corbForm {
    background-color:rgba(255,255,255,0.95);
    position:relative;
    margin: 170px 0 0 0;
    padding:0 25px 20px 25px;
    width:60%;
    /*min-height:250px;*/
    box-shadow: 1px 1px 4px rgba(0,0,0,0.3);
    border-top-right-radius:24px;
    border-bottom-right-radius:24px;
    transition: 3s;
}


#oneMoreClick {
    position:absolute;
    border:none;
    bottom:-25px;
    right:-25px;
    background-color:green;
    text-align:center;
    font-family:'Cuprum';
    font-size:17px;
    color:#fff;
    cursor:pointer;
    display:none;
    padding:38px 19px;
    border-radius:50px;
    box-shadow:inset 0 15px 20px rgba(255,255,255,0.5), 0 0 6px rgba(0,0,0,0.4), inset 0 -15px 15px rgba(0,0,0,0.4),inset 0 3px 3px rgba(255,255,255,0.3);
}


#tableOrder {
    width:80%; max-width:480px;
    margin:15px 0 8px 0;
    text-align:center;
    font-family:'Cuprum';
    font-size:18px;
    color:#222;
}

#tableOrder th {
    height:42px;
    color:#fff;
    font-weight:normal;
    background-color:#6792BD;
    vertical-align:center;
    border:none;/*solid 1px #ddd;*/
}

#tableOrder th:first-child {
    border-top-left-radius:14px;
}

#tableOrder th:last-child {
    border-top-right-radius:14px;
}

#tableOrder td {
    border:none;/*solid 1px #ddd;*/
}

#tableOrder tr:nth-child(even) {
    background-color:rgba(232,233,247,0.75);
}

#tableOrder tr:last-child {
    background-color:transparent;
}

#tableOrder tr td:nth-child(1) {
    padding:4px 10px;
}

#tableOrder tr td:nth-child(2) {
    text-align:left;
    padding-left:10px;
}

#tableOrder tr td:nth-child(3), #tableOrder tr td:nth-child(4), #tableOrder tr td:last-child, #tableOrder tr:nth-last-child(2) td:nth-child(2) {
    text-align:right;
    padding-right:20px;
}

#tableOrder tr:nth-last-child(2) td {
    border-top:2px solid #6792BD;
}

#tableOrder tr:last-child td {
    border-bottom-left-radius:10px;
    border-bottom-right-radius:10px;
    background-color:#6792BD;
    height:3px;
}

.imgAbout {
    border-radius:50%;
    margin-bottom:30px;
}




.yellow {
    color:#FFC050;
    margin:0;
}

#alertPhone, #alertEmail, #alertText, #alertStatus {
    display:none;
}

#conPhone, #conEmail, #conTextArea {
    border:none; border-bottom: solid 1px grey; margin:0 0 20px 0; box-shadow:none;
}


#inputBox {
    display:none;
    margin:0 auto;
    width:80%; max-width:480px;
    vertical-align:top;
}

#inputBox p {
    text-align:left;
}

#sendMessage {
    width:100px; height:100px;
    vertical-align:top; border-radius:50%;
    display:inline-block; margin:4px 0 0 30px;
}



#deliveryDay {
    margin-bottom:30px;
}

#conTextArea {
    font-size:normal;
}   

.loader {
  border: 15px solid #ffffff; /* Light grey */
  border-top: 15px solid green;/*#3498db; /* Blue */
  border-radius: 50%;
  width: 60px;
  height: 60px;
  animation: spin 2s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.card-body {
    padding:5px 15px 10px 15px;
}

#accordion p, .modal-body p {
    color:#444;
}

#accordion {
    margin-top:30px;
}

.point {
    cursor:pointer;
}




@media (max-width: 575px) {
    #eco2 {
        top:20px;
        left:210px;	
    }    
    #logo {
        left:-50px;
        top:70px;
        z-index:900;
        width:110px;
    }    
    header .container-fluid {
        padding: 50px 10px 20px 10px;
    }
    ul.navbar-nav li {
        margin-left:20px;
    }
    #corbForm {
        margin: 70px auto 70px 0;
        width:85%;    
    }
    #corb {
        top:10%;
    }
    #conTextArea {
        font-size:13px;
    }
    .price {
        bottom:140px;
        right:20px;
    }
}
@media (min-width: 561px) and (max-width: 575px) {
    #eco2 {
        top:0;
        left:368px;	
    }
    #conTextArea {
        font-size:normal;
    }    
}
@media (min-width: 576px) and (max-width: 767px) {
    #eco2 {
        top:0;
        left:368px;	
    }
    #logo {
        left:-40px;
        top:60px;
        z-index:900;
        width:110px;
    }
    header .container-fluid {
        padding: 69px 0px;
    } 
    ul.navbar-nav li {
        margin-left:60px;
    }
    #corbForm {
        margin: 70px auto 70px 0;
        width:80%;    
    }
    #corb {
        top:12%;
    } 
    #conTextArea {
        font-size:normal;
    } 
    .price {
        bottom:140px;
        right:20px;
    }    
}
@media (min-width: 768px) and (max-width: 991px) {
    #eco2 {
        top:0;
        left:368px;	
    }
    #logo {
            left:0px;
            top:80px;
            z-index:900;
            width:108px;
        } 
    header .container-fluid {
        padding: 90px 0px 60px 0px;
    } 
    ul.navbar-nav li {
        margin-left:100px;
    }
    #corbForm {
        margin: 125px 0 0 0;
        width:75%;
    }
    #corb {
        top:14%;
    }   
}
@media (min-width: 992px) and (max-width: 1028px) {
    #logo {
        left:5px;
        top:70px;
        z-index:1000;
        width:120px;
    } 
    ul.navbar-nav li {
        margin:0px 8px;
    }         
    .navbar ul {
        margin:0 auto;
    }
    #corbForm {
        margin: 150px 0 0 0;
        width:70%;
    }
    #corb {
        top:16%;
    }    
}
@media (min-width: 1029px) and (max-width: 1199px) {
    #logo {
        left:10px;
        top:45px;
        z-index:1000;
        width:130px;
    } 
    header .container-fluid {
        padding: 8% 0px;
    }
    ul.navbar-nav li {
        margin:0px 8px;
    }         
    .navbar ul {
        margin:0 auto;
    }
    #corbForm {
        margin: 170px 0 0 0;
        width:65%;
    }
    #corb {
        top:18%;
    }    
}
@media (min-width: 1200px) {
    #eco2 {
        top:0;
        left:368px;	
    }  
    #logo {
        left:2%;
        top:2%;
        z-index:1000;
        width:200px;
    } 
    header .container-fluid {
        padding: 10% 0px;
    }
    ul.navbar-nav li {
        margin:0px 10px;
    }         
    .navbar ul {
        margin:0 auto;
    }
    #corbForm {
        margin: 170px 0 0 0;
        width:60%;
    }
    #corb {
        top:20%;
    }    
}