.myWinSuccess {
    color: #000 !important;
} 

/*шрифты*/ 

.pangolin {
font-family: 'Pangolin', cursive;
text-shadow: 2px 2px 0px rgba(242, 242, 242, 1);
}

.color-red {
color: #780324;}
.color-blue {
color: #0076c2;}


b, strong {
    font-weight: 700;
}

/*-----------------------------------------------------------------------------------*/
/*	DIVIDERS
/*-----------------------------------------------------------------------------------*/
.divide0 {
  width: 100%;
  height: 0px; }

.divide2 {
  width: 100%;
  height: 2px; }

.divide3 {
  width: 100%;
  height: 3px; }

.divide5 {
  width: 100%;
  height: 5px; }

.divide10 {
  width: 100%;
  height: 10px; }

.divide15 {
  width: 100%;
  height: 15px; }

.divide20 {
  width: 100%;
  height: 20px; }

.divide25 {
  width: 100%;
  height: 25px; }

.divide30 {
  width: 100%;
  height: 30px; }

.divide35 {
  width: 100%;
  height: 35px; }

.divide40 {
  width: 100%;
  height: 40px; }

.divide45 {
  width: 100%;
  height: 40px; }

.divide50 {
  width: 100%;
  height: 50px; }

.divide55 {
  width: 100%;
  height: 55px; }

.divide60 {
  width: 100%;
  height: 60px; }

.divide65 {
  width: 100%;
  height: 65px; }

.divide70 {
  width: 100%;
  height: 70px; }

.divide75 {
  width: 100%;
  height: 75px; }

.divide80 {
  width: 100%;
  height: 80px; }

.divide85 {
  width: 100%;
  height: 85px; }

.divide90 {
  width: 100%;
  height: 90px; }

.divide100 {
  width: 100%;
  height: 100px; }

/*margins*/
.margin10 {
  margin-bottom: 10px; }

.margin20 {
  margin-bottom: 20px; }

.margin30 {
  margin-bottom: 30px; }

.margin40 {
  margin-bottom: 40px; }

.no-padding {
  padding: 0px; }

.no-padding.gray {
  background-color: #f5f5f5; }

.no-padding-inner h3 {
  text-transform: uppercase;
  font-weight: 900;
  margin-bottom: 40px; }

.no-padding-inner {
  padding: 60px; }

@media (max-width: 568px) {
  .no-padding-inner {
    padding: 15px; } }
.margin-0 {
  margin: 0px !important; }

/* Typography Template Name: Z-Theme - Responsive Bootstrap Template
http://mamoot-themes.com/theme-preview/z-theme-1-2/index.html
 ================================================== */

.title,
.subtitle {
 margin: 0;
 padding: 0;
}

.section-heading-page {
 margin-bottom: 40px;
 padding: 20px 0;
 color: black;
 border-bottom: 1px solid #ddd;
 background-color: #f7f7f7;
}

.heading-page {
 font-size: 27px;
 font-weight: 300;
 margin: 0;
}

.text-theme-xs,
.text-theme,
.text-theme-sm,
.text-theme-lg {
 margin: 0;
}

.text-theme-xs + .text-theme-xs {
 margin-top: 6px;
 margin-bottom: 0;
}

.text-theme-sm + .text-theme-sm {
 margin-top: 10px;
 margin-bottom: 0;
}

.text-theme + .text-theme {
 margin-top: 16px;
 margin-bottom: 0;
}

.text-theme-lg + .text-theme-lg {
 margin-top: 22px;
 margin-bottom: 0;
}

.text-theme + .btn.text-theme {
 margin-top: 20px;
}

.title-xs {
 font-size: 14px;
 font-weight: 700;
 margin: 0;
}

.title-sm {
 font-size: 20px;
 font-weight: 700;
 margin: 0;
}

.title-md {
 font-size: 24px;
 font-weight: 300;
 line-height: 28px; 
 margin: ;
}

.title-lg {
 font-size: 30px;
 font-weight: 800;
 margin-bottom: 0;
}

.title-xl {
 font-size: 38px;
 font-weight: 800;
 margin: 0;
}

.title-2-xl {
 font-size: 56px;
 font-weight: 800;
 margin: 0;
}

.title-404 {
 font-size: 140px;
 margin: 0;
}

.subtitle-404 {
 font-size: 20px;
 font-weight: 400;
}

.title-bg {
 display: inline-block;
 padding: 10px 8px;
 color: white;
 background-color: #d14f30;
}
.title-bg-red {
 display: inline-block;
 padding: 10px 8px;
 color: white;
 background-color: #b9083b;
}

.title-v2 {
 font-size: 20px;
 font-weight: 500;
color: #000;
 margin-top: 30px;
 margin-bottom: 16px;
 padding-bottom: 14px;
 padding-left: 25px;
 border-bottom: solid 1px #ddd;
 border-left: solid 1px #d14f30;
}

.headline {
 font-size: 24px;
 font-weight: 300;
 display: block;
 margin: 0;
 margin-bottom: 0;
 padding-bottom: 20px;
 border-bottom: solid 1px #ddd;
}

.title-2-xl.hr:after,
.title-xl.hr:after,
.title-lg.hr:after,
.title-md.hr:after,
.title-sm.hr:after,
.title-xs.hr:after {
 display: block;
 width: 60px;
 height: 4px;
 margin: 0 auto;
 margin-top: 20px;
 content: '';
 background-color: #d14f30;
}

.section-primary .hr:after,
.section-polygonal-primary .hr:after {
 background-color: white;
}

.title-2-xl.hr-left:after,
.title-xl.hr-left:after,
.title-lg.hr-left:after,
.title-md.hr-left:after,
.title-sm.hr-left:after,
.title-xs.hr-left:after {
 display: block;
 width: 60%;
 height: 3px;
 margin-top: 12px;
 content: '';
 background-color: #d14f30;
}

.title-2-xl.hr-full:after,
.title-xl.hr-full:after,
.title-lg.hr-full:after,
.title-md.hr-full:after,
.title-sm.hr-full:after,
.title-xs.hr-full:after {
 display: block;
 width: 100%;
 height: 3px;
 margin-top: 12px;
 content: '';
 background-color: #d14f30;
}

.title-xs.hr-before:before,
.title-sm.hr-before:before,
.title-md.hr-before:before,
.title-lg.hr-before:before,
.title-xl.hr-before:before,
.title-2-xl.hr-before:before {
 position: relative;
 display: inline-block;
 margin-right: 6px;
 content: '';
 background-color: #d14f30;
}

.title-xs.hr-before:before {
 top: 1px;
 width: 3px;
 height: 13px;
}

.title-sm.hr-before:before {
 top: 1px;
 width: 3px;
 height: 16px;
}

.title-md.hr-before:before {
 top: 1px;
 width: 3px;
 height: 19px;
}

.title-lg.hr-before:before {
 top: 1px;
 width: 4px;
 height: 24px;
}

.title-xl.hr-before:before {
 top: 1px;
 width: 5px;
 height: 29px;
}


/*---------------- рейтинг статей и теги -----------------------*/
.eTags .list,.eTags i,.sorting .list,.sorting i {
 display: inline-block;
}

.news-list .eMessage p {
 margin: 3px 0;
}

.eTags {
 margin-top: 40px;
}

.eTags i,.sorting i {
 line-height: 40px;
 color: #7D92BA;
 font-size: 20pt;
}

.eTags span,.sorting span {
 padding: 0 5px;
 margin-right: 10px;
 font-weight: 400;
 font-size: 10pt;
 color: #CCC;
}

.eTags .list a,.sorting .list a {
 text-decoration: none;
 font-size: 14px; /*--- теги под статьёй ---*/
 font-weight: 300;
 display: inline-block;
}

.eTags .list a:hover,.sorting .list a:hover {
 color: #7D92BA;
}

.sorting {
 margin-bottom: 30px;
}
.sorting.slist {
 display: none;
 padding: 10px;
 margin: -15px 0px 15px;
}

.sorting a {
 padding: 0 2px;
}

.sorting span.sortArrDown,.sorting span.sortArrUp {
 color: #666;
 margin: 0;
}

.sorting.slist i {
 font-size: 16pt;
}

.sorting.slist .list a {
 font-size: 12pt;
}

.sorting.slist span {
 padding: 0 3px;
}

.rating {
 position: relative;
 display: table;
 width: 100%;
 margin-top: 15px;
}

.rating:before {
 content: '';
 position: absolute;
 width: calc(100% - 170px);
 width: -moz-calc(100% - 170px);
 width: -webkit-calc(100% - 170px);
 width: -o-calc(100% - 170px);
 height: 1px;
 background: #eee;
 top: 50%;
 z-index: -2;
}
/*------------------ списки ---------------------*/
ol.wsnumber2{
 display: block;
 counter-reset: wslist2;
 color:#444;
 margin: 2em 0 2em 1em;
}

/* стили для ul */
ol.wsnumber2 li ul{
 margin: 1em 0 0em 1em;
 color:#777;
 transition: all 0.3s ease 0s;
 border-left: 1px solid #e3e3e3;
}

ol.wsnumber2 ul li{
 margin: 0 0 1em 2em;
 list-style: square outside;
 transition: all 0.3s ease 0s;
}
/*#end стили для ul */

ol.wsnumber2 > li {
 list-style: none;
 margin: 0 0 1em 2em;
 position:relative;
}

ol.wsnumber2 > li::before{
 background: #e3e3e3;
 border-radius: 50% 50% 50%; /*------- форма кляксы -----------*/
 color: #333;
 content: counter(wslist2) ".";
 counter-increment: wslist2;
 display: inline-block;
 height: 30px; /*--------------- высота кляксы ------------*/
 left: -40px; /*----------- отступ кляксы от текста -----------*/
 line-height: 16px; /*---------- центруем цифры внутри кляксы по высоте, чем больше значение, тем ниже находится цмфра ----------*/
 padding: 5px;
 position: absolute;
 text-align: center;
 top: 0;
 transition: all 0.3s ease 0s;
 width: 30px;
}

/*вложенный список ol */

ol.wsnumber2 ol{
 display: block;
 counter-reset: wslistc;
 color:#777;
 border-left: 1px solid #e3e3e3;
 padding-left:15px;
 transition: all 0.3s ease 0s;
}

ol.wsnumber2 ol li{
 margin: 1em 0 0em 3em;
 list-style: none;
 position:relative;
 transition: all 0.3s ease 0s;
}

ol.wsnumber2 li li{
 font-size: 14px;
}

ol.wsnumber2 ol li::before{
 background: #e3e3e3;
 border-radius: 0% 50% 50%;
 color: #333;
 content: counter(wslistc, lower-latin) ".";
 counter-increment: wslistc;
 display: inline-block;
 height: 22px;
 left: -40px;
 line-height: 22px;
 padding: 5px;
 position: absolute;
 text-align: center;
 top: 0;
 transition: all 0.3s ease 0s;
 width: 22px;
}

ol.wsnumber2 ol:hover, ol.wsnumber2 ul:hover{
 border-left: 1px solid #FB456C;
}

ol.wsnumber2 li li:hover{
 background: #eee;
 color:#333;
}
ol.wsnumber2 li:hover:before {
 background: #780324; /*------------------ цвет кляксы при наведении курсора -----------------*/
 color:#fff;
}
@media (max-width: 640px) {ol.wsnumber2 > li {
 list-style: none;
 margin: 0 0 1em 0em;
 position:relative;
}}

/*--------------------- zebra -----------------------*/
.zebra {
  list-style: none;
  border-left: 10px solid #b9083b;
  padding: 0;
  font-family: "Lucida Sans";
}
.zebra li {padding: 10px;}
.zebra li:nth-child(odd) {background: #e8eff8;}
.zebra li:nth-child(even) {background: white;}

/*----------------------- Списки list3a ---------*/

.list3a {
    padding:0;
    list-style: none;
    counter-reset: li;
}    
.list3a li {
    position: relative;
    border-left: 4px solid #00838F;
    padding:16px 20px 16px 28px;
    margin:12px 0 12px 80px;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}
.list3a li:before {
    line-height: 32px;
    position: absolute;
    top: 10px;
    left:-80px;
    width:80px;
    text-align:center;
    font-size: 24px;
    font-weight: bold;
    color: #00838F;
    counter-increment: li;
    content: counter(li);
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;    
}
.list3a li:hover:before {
    color: #00838F;
}
.list3a li:after {
    position: absolute;
    top: 26px;
    left: -40px;
    width: 60px;
    height: 60px;
    border: 8px solid #00838F;
    border-radius: 50%;
    content: '';
    opacity: 0;
    -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
    -moz-transition: -moz-transform 0.3s, opacity 0.3s;
    transition: transform 0.3s, opacity 0.3s;
    -webkit-transform: translateX(-50%) translateY(-50%) scale(0.1);
    -moz-transform: translateX(-50%) translateY(-50%) scale(0.1);
    transform: translateX(-50%) translateY(-50%) scale(0.1);
    pointer-events: none;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;        
}
.list3a li:hover:after {
    opacity: 0.2;
    -webkit-transform: translateX(-50%) translateY(-50%) scale(1);
    -moz-transform: translateX(-50%) translateY(-50%) scale(1);
    transform: translateX(-50%) translateY(-50%) scale(1);
}    


/*----------------------- Списки list3b ---------*/

.list3b {
    padding:0;
    list-style: none;
    counter-reset: li;
}    
.list3b li {
    position: relative;
    border-left: 4px solid #DDDDDD;
    padding:16px 20px 16px 28px;
    margin:12px 0 12px 80px;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}
.list3b li:before {
    line-height: 32px;
    position: absolute;
    top: 10px;
    left:-80px;
    width:80px;
    text-align:center;
    font-size: 16px;
    font-weight: bold;
    color: #DDDDDD;
    counter-increment: li;
    content: counter(li);
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;        
}
.list3b li:hover:before {
    color: #00838F;
}
.list3b li:after {
    position: absolute;
    top: 25px; /*----- центрируем цифру по вертикали ------*/
    left: -40px;
    width: 50px;
    height: 50px;
    border: 8px solid #00838F;
    border-radius: 50%;
    content: '';
    opacity: 0;
    -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
    -moz-transition: -moz-transform 0.3s, opacity 0.3s;
    transition: transform 0.3s, opacity 0.3s;
    -webkit-transform: translateX(-50%) translateY(-50%) scale(0.1);
    -moz-transform: translateX(-50%) translateY(-50%) scale(0.1);
    transform: translateX(-50%) translateY(-50%) scale(0.1);
    pointer-events: none;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;        
}
.list3b li:hover:after {
    opacity: 0.2;
    -webkit-transform: translateX(-50%) translateY(-50%) scale(1);
    -moz-transform: translateX(-50%) translateY(-50%) scale(1);
    transform: translateX(-50%) translateY(-50%) scale(1);
}    

/*---------------------- Списки list4a  -----------------------*/

.list4a {
    padding:0;
    list-style: none;
    counter-reset: li;
}    
.list4a li {
    position: relative;
    padding:12px 20px 20px 28px;
    margin-left: 40px;
    transition-duration: 0.3s;
}
.list4a li:before {
    border: 6px solid transparent;
    line-height: 30px;
    position: absolute;
    top: 0;
    left:-30px;
    width:42px;
    text-align:center;
    font-size: 13px;
    font-weight: bold;
    color: #00838f;
    counter-increment: li;
    content: counter(li);
    transition-duration: 0.3s;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;    
    }
.list4a li:hover:before {
    color: #00838f;    
}
.list4a li:after {
    position: absolute;
    top: 0;
    left: -30px;
    width: 42px;
    height: 42px;
    border: 6px solid #00838f;
    border-radius: 50%;
    content: '';
    opacity: 0.5;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;    
}
.list4a li:hover:after {
    animation: 500ms ease-in-out 0s bounceIn;
    opacity: 1;
}    
 
@keyframes bounceIn {
    0% {
        opacity: 0;
        transform: scale3d(.3, .3, .3);
    }
    20% {
        transform: scale3d(1.3, 1.3, 1.3);
    }
    40% {
        transform: scale3d(.9, .9, .9);
    }
    60% {
        opacity: 1;
        transform: scale3d(1.03, 1.03, 1.03);
    }
    80% {
        transform: scale3d(.97, .97, .97);
    }
    to {
        opacity: 1;
        transform: scale3d(1, 1, 1);
    }
}

/*-------------------------- list2b  -----------------------*/
.list2b {
    margin-bottom: 8px;
    padding:0;
    list-style: none;
    counter-reset: li;
}    
.list2b li {
    position: relative;
    border: 2px solid #DDDDDD;
    background: #FAFAFA;
    padding:16px 20px 16px 28px;
    margin:12px 0 12px 40px;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}
.list2b li:hover {
    background: #F0F5FB;
    border: 2px solid #ADCEE9;
}
.list2b li:before {
    line-height: 32px;
    position: absolute;
    top: 4px;
    left:-40px;
    width:40px;
    text-align:center;
    font-size: 16px;
    font-weight: bold;
    color: #FFF;
    background: #77AEDB;
    counter-increment: li;
    content: counter(li);
    -webkit-transition-duration: 0.2s;
    transition-duration: 0.2s;
}
.list2b li:hover:before {
    width:46px;
    background: #337AB7;
}
.list2b li:after {
    position: absolute;
    left: 0;
    top: 4px;
    content: "";
    height: 0;
    width: 0;
    border: 16px solid transparent;
    border-left-color: #77AEDB;
    -webkit-transition-duration: 0.2s;
    transition-duration: 0.2s
}
.list2b li:hover:after {
    margin-left: 6px;
    border-left-color: #337AB7;
}
/*------------------- list4b -----------------*/
.list4b {
    padding:0;
    list-style: none;
    counter-reset: li;
}    
.list4b li {
    position: relative;
    padding:12px 20px 20px 28px;
    margin-left: 40px;
    transition-duration: 0.3s;
}
.list4b li:before {
    border: 6px solid transparent;
    line-height: 30px;
    position: absolute;
    top: 0;
    left:-30px;
    width:42px;
    text-align:center;
    font-size: 15px;
    font-weight: bold;
    color: #DDDDDD;
    counter-increment: li;
    content: counter(li);
    transition-duration: 0.3s;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;    
}
.list4b li:hover:before {
    color: #780324;
}
.list4b a {
    color: #780324;
}
.list4b li:after {
    position: absolute;
    top: 0;
    left: -30px;
    width: 42px;
    height: 42px;
    border: 3px solid #DDDDDD; /*------- цвет кольца -----*/
    border-radius: 50%;
    content: '';
    opacity: 0.5;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;    
}
.list4b li:hover:after {
    animation: 500ms ease-in-out 0s bounceIn;
 opacity: 1;   
    border: 3px solid #780324; /*------- цвет кольца при наведении курсора -----*/   
}    
 
@keyframes bounceIn {
    0% {
        opacity: 0;
        transform: scale3d(.3, .3, .3);
    }
    20% {
        transform: scale3d(1.3, 1.3, 1.3);
    }
    40% {
        transform: scale3d(.9, .9, .9);
    }
    60% {
        opacity: 1;
        transform: scale3d(1.03, 1.03, 1.03);
    }
    80% {
        transform: scale3d(.97, .97, .97);
    }
    to {
        opacity: 1;
        transform: scale3d(1, 1, 1);
    }
}

/*-------------- Здесь текст или изображение, которое будет видно только на мобильных устройствах ------------------*/
.show-on-mobile { display: none; }
/* Smartphone Portrait and Landscape */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px){ .show-on-mobile { display: inline; }}
/*-------------- Здесь текст или изображение, которое не будет видно только на мобильных устройствах. ------------------*/
.hide-on-mobile { display: inline; }
/* Smartphone Portrait and Landscape */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px){ .hide-on-mobile { display: none; }}

/*-------------- Здесь текст или изображение, которое не будет видно только на мобильных устройствах 1030px. ------------------*/
.hide-on-mobile1030 { display: inline; }
/* Smartphone Portrait and Landscape */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 1030px){ .hide-on-mobile1030 { display: none; }}

/*-------------- Здесь текст или изображение, которое не будет видно только на мобильных устройствах 1205px. ------------------*/
.hide-on-mobile1205 { display: inline; }
/* Smartphone Portrait and Landscape */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 1205px){ .hide-on-mobile1205 { display: none; }}

/*-------------- Здесь текст или изображение, которое не будет видно только на мобильных устройствах 1550px. ------------------*/
.hide-on-mobile1550 { display: inline; }
/* Smartphone Portrait and Landscape */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 1550px){ .hide-on-mobile1550 { display: none; }}

/*-------------- Здесь текст или изображение, которое не будет видно только на мобильных устройствах 1790px. ------------------*/
.hide-on-mobile1790 { display: inline; }
/* Smartphone Portrait and Landscape */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 1790px){ .hide-on-mobile1790 { display: none; }}


/*---------------------- Цитаты -----------------------*/

/* цитата 2 */

.excerpt2 {
  display: block;
  margin-top: 1em;
  margin-bottom: 10px;
  margin-left: 40px;
  margin-right: 40px;
}

.excerpt2 {
margin: 0 0 20px;
background: #F0F0F1;
color: #333334;
padding: 20px 30px;
position: relative;
border-left: 35px solid #DFDEDE;
font-family: 'Lato', sans-serif;
}
.excerpt2:before {
content: "\201C";
font-family: serif;
position: absolute;
left: -29px;
top: 15px;
color: #BCBCBC;
font-size: 50px;
text-shadow: 1px 2px 0 white;
}
.excerpt2 p {
margin: 0 0 16px;
font-size: 18px;
letter-spacing: .05em;
line-height: 1.4;
}
.excerpt2 cite {
font-style: normal;
font-weight: 300;
}

/* цитата 9 */

.excerpt9 {
margin: 0;
color: #231E28;
padding: 30px 30px 30px 60px;
border-left: 8px solid #3D8ABC;
position: relative;
background: #FAF8EB;
font-family: 'Lato', sans-serif;
font-weight: 300;
}
.excerpt9:before{
content: "\201C";
font-family: Arial;
color: #3D8ABC;
font-size: 70px;
position: absolute;
left: 15px;
top: 30px;
}
.excerpt9 p {
font-style: italic;
font-size: 20px;
margin-top: 0;  
}

/* цитата 10 с ковычками */

.excerpt10 {
margin: 0 0 20px;
background: #f9f9f9;
color: #131314;
padding: 30px 30px 30px 90px;
position: relative;
}
.excerpt10:before {
content: "\201C";
position: absolute;
top: 20px;
left: 16px;
color: black;
width: 40px;
height: 40px;
border-radius: 50%;
background: #ed145b;
font-size: 35px;
font-weight: bold;
text-align: center;
line-height: 55px;
color: #fff;
}

.excerpt10:after {
content: "";
width: 4px;
background: #ed145b;
position:absolute;
left: 70px;
top: 20px;
bottom: 20px;
}
.excerpt10 p {
margin-top: 0;
font-size: 20px;
font-weight: 300;
line-height: 24px;
}
.excerpt10 cite {
font-style: normal;
text-transform: uppercase;
}
@media (max-width: 640px) {.excerpt10 p {
margin-top: 0;
font-size: 18px;
font-weight: 300;
line-height: 24px;
}
}
@media (max-width: 640px) {.excerpt10:before {
content: "\201C";
position: absolute;
top: 20px;
left: 1px;
color: black;
width: 0;
height: 0;
border-radius: 50%;
background: #ed145b;
font-size: 1px;
font-weight: bold;
text-align: center;
line-height: 55px;
color: #fff;
}
}

@media (max-width: 640px) {.excerpt10 {
margin: 0 0 20px;
background: #f9f9f9;
color: #131314;
padding: 30px 30px 30px 20px;
position: relative;
}
}
@media (max-width: 640px) {.excerpt10:after {
content: "";
width: 4px;
background: #ed145b;
position:absolute;
left: 1px;
top: 20px;
bottom: 20px;
}}

/* цитата 110 с восклицательным знаком */

.excerpt101 {
margin: 0 0 20px;
background: #f9f9f9;
color: #131314;
padding: 30px 30px 30px 90px;
position: relative;
}
.excerpt101:before {
content: "\0021";
position: absolute;
top: 20px;
left: 16px;
color: black;
width: 40px;
height: 40px;
border-radius: 50%;
background: #780324;
font-size: 35px;
font-weight: bold;
text-align: center;
line-height: 40px;/*---- положение восклицательного знака по вертикали ---*/
color: #fff;
}

.excerpt101:after {
content: "";
width: 4px;
background: #780324;
position:absolute;
left: 70px;
top: 20px;
bottom: 20px;
}
.excerpt101 p {
margin-top: 0;
font-size: 20px;
font-weight: 300;
line-height: 24px;
}
.excerpt101 cite {
font-style: normal;
text-transform: uppercase;
}
@media (max-width: 640px) {.excerpt101 p {
margin-top: 0;
font-size: 18px;
font-weight: 300;
line-height: 24px;
}
}
@media (max-width: 640px) {.excerpt101:before {
content: "\201C";
position: absolute;
top: 20px;
left: 1px;
color: black;
width: 0;
height: 0;
border-radius: 50%;
background: #ed145b;
font-size: 1px;
font-weight: bold;
text-align: center;
line-height: 55px;
color: #fff;
}
}

@media (max-width: 640px) {.excerpt101 {
margin: 0 0 20px;
background: #f9f9f9;
color: #131314;
padding: 30px 30px 30px 20px;
position: relative;
}
}
@media (max-width: 640px) {.excerpt101:after {
content: "";
width: 4px;
background: #ed145b;
position:absolute;
left: 1px;
top: 20px;
bottom: 20px;
}}


/* цитата snowflake снежинка */

.snowflake {
margin: 0 0 20px;
background: #f9f9f9; /* фон за текстом */
color: #131314;
padding: 30px 30px 30px 90px;
position: relative;
}
.snowflake:before {
content: "\2744";
position: absolute;
top: 20px;
left: 16px;
color: black;
width: 40px;
height: 40px;
border-radius: 50%;
background: #dddcdc;
font-size: 35px;
font-weight: bold;
text-align: center;
line-height: 40px;/*---- положение снеговика знака по вертикали ---*/
color: #fff;
box-shadow:3px 3px 10px rgba(0, 0, 0, 0.5);
-webkit-box-shadow:3px 3px 10px rgba(0, 0, 0, 0.5);
}

.snowflake:after {
content: "";
width: 4px;
background: #1c5e85;
position:absolute;
left: 70px;
top: 20px;
bottom: 20px;
}
.snowflake p {
margin-top: 0;
font-size: 20px;
font-weight: 300;
line-height: 24px;
}
.snowflake cite {
font-style: normal;
text-transform: uppercase;
}
@media (max-width: 640px) {.snowflake p {
margin-top: 0;
font-size: 18px;
font-weight: 300;
line-height: 24px;
}
}
@media (max-width: 640px) {.snowflake:before {
content: "\201C";
position: absolute;
top: 20px;
left: 1px;
color: black;
width: 0;
height: 0;
border-radius: 50%;
background: #0641dd;
font-size: 1px;
font-weight: bold;
text-align: center;
line-height: 55px;
color: #fff;
}
}

@media (max-width: 640px) {.snowflake{
margin: 0 0 20px;
background: #f9f9f9;
color: #131314;
padding: 30px 30px 30px 20px;
position: relative;
}
}
@media (max-width: 640px) {.snowflake:after {
content: "";
width: 4px;
background: #0641dd;
position:absolute;
left: 1px;
top: 20px;
bottom: 20px;
}}

/* цитата с местом под каринку с лева */

.excerptimg {
margin: 0 0 20px;
background: #f9f9f9;
color: #131314;
padding: 20px 20px 20px 10px;
position: relative;
}
.excerptimg:after {
content: "";
width: 4px;
background: #80a7c8;
position:absolute;
left: 10px;
top: 20px;
bottom: 20px;
}
.excerptimg p {
margin-top: 0;
font-size: 20px;
font-weight: 300;
line-height: 24px;
}
.excerptimg cite {
font-style: normal;
text-transform: uppercase;
}
@media (max-width: 640px) {.excerptimg p {
margin-top: 0;
font-size: 18px;
font-weight: 300;
line-height: 24px;
}
}

@media (max-width: 640px) {.excerptimg {
margin: 0 0 20px;
background: #f9f9f9;
color: #131314;
padding: 30px 30px 30px 20px;
position: relative;
}
}
@media (max-width: 640px) {.excerptimg:after {
content: "";
width: 4px;
background: #ed145b;
position:absolute;
left: 1px;
top: 20px;
bottom: 20px;
}}