html,body,h1,h2,h3,h4,ul,ol,p {margin: 0;}
/*theme ----*/
.theme-light {
--bg-color: #f1f1f1;
--font-color: #0d0d0d;
--a-color: #228b22;
--top-color: #fff;
--green-color: #268e50;	
--blue-color: #191970;
--grey-dark-color: #333;
--grey-color: #666;
--black-color: #000;
--ar-hds-color: #236c58;
--ar-isn-color: #3d3d3d;
--mush-color: #def0f7;
--sura-ar-color: #25586b;
--sura-comm-color: #7d7d7d;
--td-bg-color: #e8ffe8;
--td-bord-color: #030303;
--sl-color: #003366;
--karta-color: #0000CD;
--pag-color: #f1f1f1;
--hover-color: #f1f1f1;
--bism-img: url(/img/bismillyah.jpg);
--geo-img: url(/img/geo.png);
--point-img: url(/img/point.png);
}
.theme-dark {
--bg-color: #2a2c2d;
--font-color: #f1f1f1;
--a-color: #75e3ff;
--top-color: #000;
--green-color: #545252;
--blue-color: #f1f1f1;
--grey-dark-color: #f1f1f1;
--grey-color: #f1f1f1;
--black-color: #f1f1f1;
--ar-hds-color: #f1f1f1;
--ar-isn-color: #f1f1f1;
--mush-color: #545252;
--sura-ar-color: #f1f1f1;
--sura-comm-color: #f1f1f1;
--td-bg-color: #3b3b3b;
--td-bord-color: #666;
--sl-color: #f1f1f1;
--karta-color: #f1f1f1;
--pag-color: #545252;
--hover-color: #999;
--bism-img: url(/img/bismi-llyah.jpg);
--geo-img: url(/img/geo2.png);
--point-img: url(/img/point2.png);
}
body {background: var(--bg-color); color: var(--font-color); font-size: 13px; font-family: Arial, Verdana, sans-serif, Helvetica;}
a {color: var(--a-color); text-decoration: underline;} 
a:hover {text-decoration: none;}
p {color: var(--font-color);}
h1 {margin: 25px 9px 25px 9px; text-align: center; font-size: 25px; color: var(--font-color); text-transform: uppercase; font-family: OpenSans-Light, Arial, Verdana, sans-serif, Helvetica; font-weight: lighter;}
h1 span {font-size: 35px; color: var(--blue-color); line-height: 55px;}
h2 {margin: 31px 9px; text-align: center; font-size: 25px; color: var(--font-color); font-family: OpenSans-Light, Arial, Verdana, sans-serif, Helvetica; font-weight: lighter;}
h3 {margin: 27px 7px; text-align: center; font-size: 21px; color: var(--font-color); font-family: OpenSans-Light, Arial, Verdana, sans-serif, Helvetica; font-weight: lighter;}
h4 {margin: 23px 7px; font-size: 17px; color: var(--font-color); font-family: OpenSans-Light, Arial, Verdana, sans-serif, Helvetica; font-weight: lighter;}
img, iframe {max-width:100%; height: auto; border: 0; vertical-align: middle;}
button:focus, input:focus, textarea:focus {outline: none;}
section, article, aside, address, footer {display: block;}
hr {margin: 5px 21px}
.c-r {text-align: center;}
.r_img {float: right; margin: 5px 0 10px  10px; width: 290px;}
.l_img {float:left; margin: 5px 10px 10px 0; width: 290px;}
.clear {clear: both;}
/*top -----*/
.top_fix {position: fixed; width: 100%; height: 71px; top: 0px; background: var(--top-color); z-index: 10; -webkit-box-shadow: 0px 4px 9px 0px rgba(34, 60, 80, 0.2);
-moz-box-shadow: 0px 4px 9px 0px rgba(34, 60, 80, 0.2); box-shadow: 0px 4px 9px 0px rgba(34, 60, 80, 0.2);}
.logo {background: url(/img/logo.png) no-repeat; position: fixed; top: 9px; left: 25px; float: left; width: 235px; height: 63px; text-decoration: none;}
.logo span {display: block; margin-left: 59px;}
.logo span:first-child {margin-top: 3px; font-size: 21px; color: var(--font-color); text-transform: uppercase; font-family: Arial, Verdana, sans-serif; letter-spacing: -0.6px;}
.logo span:last-child {margin-top: 2px; padding-left: 2px; font-size: 13px; color: #29773e; text-transform: uppercase; font-weight: bold; letter-spacing: -0.3px; font-family: Arial, Verdana, sans-serif;}
.bism {width: 100%; height: 100%; text-align: center; display: flex; align-items: center; justify-content: center; background: var(--top-color);}
.bism-img {background-image: var(--bism-img); width: 100%; height: 100%; background-position: center; background-repeat: no-repeat;}
/*menu -----*/
.mob-menu {display: block;}
.hidden-menu-ticker {display: none;}
.btn-menu {position: fixed; padding: 17px; top: -3px; right: 11px; border:0px solid #0d0d0d; cursor: pointer; transition: left .23s; z-index: 3; width: 25px; 
-webkit-transform: translateZ(0); -webkit-backface-visibility: hidden; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 1px;}
.btn-menu span {display: block; height: 3px; background-color: var(--font-color); margin: 7px 0 0;transition: all .1s linear .23s; position: relative;}
.hidden-menu-ticker:checked ~ .hidden-menu {left: 0;}
.hidden-menu-ticker:checked ~ .btn-menu span.first {-webkit-transform: rotate(45deg); top: 10px;}
.hidden-menu-ticker:checked ~ .btn-menu span.second {opacity: 0;}
.hidden-menu-ticker:checked ~ .btn-menu span.third {-webkit-transform: rotate(-45deg); top: -10px;}
.hidden-menu {display: block; position: fixed; top: 69px; left: 100%; width: 100%; height: 100%; margin: 0; padding: 30px 10px 10px; list-style:none; 
background: var(--bg-color); box-sizing: border-box; transition: left .2s; z-index: 2; -webkit-transform: translateZ(0); -webkit-backface-visibility: hidden;}
.hidden-menu li {padding: 15px 0; border-bottom: solid 0px #eee;}
.hidden-menu li a {margin-left: 39px; font-size:19px; color: var(--font-color); text-decoration: none; font-family: OpenSans-Light, Verdana, Arial, sans-serif;}
.hidden-menu li a:hover, a:active {color: #22B14C;}
/* switch-theme ----- */
.switch {position: fixed; top: 11px; right: 17px; display: inline-block; width: 50px; height: 25px;}
/* hide checkbox ---- */
.switch input {opacity: 0; width: 0; height: 0;}
/* The slider */
.slider {position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc;-webkit-transition: 0.4s; transition: 0.4s; cursor: pointer;}
.slider:before {position: absolute; height: 30px; width: 30px; left: 0px; bottom: 4px; top: 0; bottom: 0; margin: auto 0;-webkit-transition: 0.4s; transition: 0.4s;
box-shadow: 0 0px 15px #2020203d; background: white url('/img/hilyal.png'); background-repeat: no-repeat; background-position: center; content: "";}
input:checked + .slider {background-color: #666;}
input:focus + .slider {box-shadow: 0 0 1px #333;}
input:checked + .slider:before {-webkit-transform: translateX(24px);-ms-transform: translateX(24px); transform: translateX(24px); 
background: white url('/img/shams.png'); background-repeat: no-repeat; background-position: center;}
/* Rounded sliders */
.slider.round {border-radius: 15px;}
.slider.round:before {border-radius: 50%;}
/*drop -----*/
.wrap-dropdown {position: relative; width: 350px; margin: 0 30px; cursor: pointer; outline: none;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-ms-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out; transition: all 0.3s ease-out;}
.wrap-dropdown span {padding: 0 10px; font-size:19px; color: var(--font-color);}
.wrap-dropdown:after {position: absolute; top: 25px; left: 85px; border-width: 6px 6px 0 6px; border-style: solid; border-color: var(--black-color) transparent; content: "";}
.wrap-dropdown .dropdown {position: relative; top: 20px; left: -35px; background: var(--bg-color); list-style: none;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-ms-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; max-height: 0; overflow: hidden;}
.wrap-dropdown .dropdown li {display: block; padding: 13px 0px;}
.wrap-dropdown .dropdown li a {text-align: left; font-size:17px; color: var(--font-color); text-decoration: none; transition: all 0.3s ease-out;}
.wrap-dropdown .dropdown li:last-of-type a {border: none;}
.wrap-dropdown .dropdown li i {margin-right: 5px; color: inherit; vertical-align: middle;}
.wrap-dropdown .dropdown li:hover a {color: #22B14C;}
.wrap-dropdown.active:after {border-width: 0 6px 6px 6px; border-color: var(--black-color) transparent;}
.wrap-dropdown.active .dropdown {max-height: 300px;}
/*top-time -----*/
.salyat-top-time {margin-top: 81px; text-align: center;}
.salyat-top-time > div {display: inline-block;}
.salyat-top-time p {margin-top: -5px; padding: 0 55px 5px 55px; background: var(--green-color); font-size: 20px; color: #fff; font-weight: normal;}
.salyat-top-time span {font-size: 10px;}
/*geo -----*/
.geoloc{text-align: center;margin: 13px 0;} 
.geo {background-image: var(--geo-img); padding-left: 17px; background-size: 17px 17px; background-position: left center; background-repeat: no-repeat;}
.geoloc > div {display: inline-block; font-size: 13px; color: var(--font-color);}
.gorod {background-image: var(--point-img); padding-left: 19px; background-size: 17px 17px; background-position: left center; background-repeat: no-repeat;}
.gorod select {width: 70px; background: var(--bg-color); color: var(--font-color);}
.data span {font-size: 15px; color: var(--font-color); font-weight: bold;}
.data a {color: var(--font-color);}
#clock {color: var(--font-color); font-weight: bold; font-size: 15px;}
.print {background: var(--bg-color); color: var(--font-color);}
/*content -----*/
.content {width: 1055px; margin: 0 auto;}
.content_bl {width: 800px; height: auto; float: left; background: var(--bg-color);}
blockquote {margin: 10px 10px; background-color: #f4f7f9; border: 1px #464647 dotted; border-left: 4px #61BC00 solid;}
blockquote p {padding: 25px 15px; font-size: 17px; color: var(--font-color); font-weight: normal;  font-family: Verdana, OpenSans-Light, Arial, sans-serif;}
.text p {padding: 0 15px; font-size: 17px; font-weight: normal; color: var(--font-color); line-height: 1.5; font-family: Verdana, OpenSans-Light, Arial, sans-serif;}
.text a {color: var(--a-color); text-decoration: underline;} 
.text a:hover {text-decoration: none;}
p.ar-ayt {padding: 19px 15px 15px 15px; font-size: 29px; font-weight: normal; color: var(--blue-color); line-height: 1.7; font-family: "Arabic-Sans", Helvetica, sans-serif;}
p.trg {padding: 0 15px; font-size: 16px; font-weight: bold; color: var(--font-color); font-style: italic; line-height: 1.5; font-family: Verdana, Arial, sans-serif;}
p.ar-hds {padding: 9px 15px 15px 15px; font-size: 28px; font-weight: normal; color: var(--ar-hds-color); line-height: 1.6;}
p.ar-isn {padding: 19px 15px 15px 15px; font-size: 25px; font-weight: normal; color: var(--ar-isn-color); line-height: 1.5;}
p.ar-rwt {padding: 5px 15px 25px 15px; font-size: 19px; font-weight: normal; color: var(--ar-isn-color); line-height: 1.1;}
p.trg-hds {padding: 0 15px; font-size: 16px; font-weight: normal; color: var(--font-color); font-style: italic; line-height: 1.5; font-family: Verdana, Arial, sans-serif;}
p.rkm {text-align: right;  font-size: 14px; padding: 7px 15px 19px 15px; font-weight: normal; color: var(--font-color); line-height: 1.5; font-family: Verdana, Arial, sans-serif;}
.rt_img {float: right; width: 350px; padding: 15px 15px;}
.lt_img {float: left; width: 350px; padding: 15px 15px;}
.gal-wkf h2 span {font-size: 37px;}
.gal-wkf p {margin: 9px 29px; font-size: 16px; line-height: 1;}
.gal-wkf p i {margin: -5px 31px 7px -11px; font-size: 47px; font-weight: bold; display: inline-block; vertical-align: top; 
-moz-transform: rotate(25deg); -ms-transform: rotate(25deg); -webkit-transform: rotate(25deg); -o-transform: rotate(25deg); transform: rotate(25deg);}
.gal-wkf p span {margin-right: 19px; font-size: 47px; font-weight: bold; display: inline-block; vertical-align: top;}
.gal-wkf p:last-child span {margin-left: -9px; margin-right: 11px; font-size: 31px; font-weight: bold; display: inline-block; vertical-align: top;}
/*quran-all-sury -----*/
.quran-sury {display:block; margin:0px auto;}
.sura {width: 98%; height: auto; border: 2px solid #25586b; margin: 9px 3px 9px 3px; background: var(--bg-color); border-radius: 3px; cursor: pointer;}
.sura a {text-decoration: none;}
.sura a:hover {background-color: #f1f1f1; text-decoration: none;}
.sura-number {float: left; margin-left: 15px; padding:29px 15px; font-size: 19px; color: var(--grey-dark-color);}
.sura-name {display:block; padding:5px 5px;}
.sura-name-translit {font-size: 16px; color: var(--sura-ar-color); padding: 3px 15px; font-weight: bold; font-family: OpenSans-Light, Verdana, Arial, sans-serif;}
.sura-name-rus {font-size: 15px; color: var(--grey-dark-color); padding: 5px 15px; font-family: OpenSans-Light, Verdana, Arial, sans-serif;}
.sura-comm {font-size: 13px; color: var(--sura-comm-color); padding: 3px 15px;}
.sura-ar {float: right; margin-top: -69px;  margin-right: 11%; font-size: 29px; color: var(--sura-ar-color);}
/*quran-read -----*/
.tanz {text-align: center; font-size: 17px;}
.quran {display: block;}
.quran h2 {font-size: 39px; color: var(--font-color);}
.quran h2 span {font-size: 27px;}
.quran h2 a {font-size: 25px; margin: 0px 25px; text-decoration: none;}
.quran h2 a:hover {color: var(--font-color); text-decoration: none;}
/*quran-ihtiyar -----*/
.quran-iht {height: 59px; width: 90%; text-align: center; margin: 15px 15px; -webkit-box-shadow: 0px 3px 9px 0px rgba(34, 60, 80, 0.07);
-moz-box-shadow: 0px 3px 9px 0px rgba(34, 60, 80, 0.07); box-shadow: 0px 3px 9px 0px rgba(34, 60, 80, 0.07);}
.iht {display: inline-block; margin: 10px 5px; padding: 8px 15px;}
.iht li {display: inline;}
.iht li a {margin: 0 5px; padding: 7px 16px; font-size: 19px; background: var(--green-color); color: #f1f1f1; text-decoration: none; 
transition: background .3s; border: 1px solid var(--green-color); border-radius:3px 3px; -webkit-box-shadow: 0px 3px 9px 0px rgba(34, 60, 80, 0.07);
-moz-box-shadow: 0px 3px 9px 0px rgba(34, 60, 80, 0.07); box-shadow: 0px 3px 9px 0px rgba(34, 60, 80, 0.07);}
.iht li a:hover {background: var(--hover-color); color: var(--font-color); cursor: pointer;}
.iht li.active a{background: var(--hover-color); color: var(--font-color);}
/*quran-text -----*/
.sura-all {margin-top: 25px;}
.sura-all .snoska {font-size: 15px;}
.ar-sura {margin-right: 9%;}
.ar-sura a {margin-left: 9%; font-size: 17px;}
.ar-sura .bismillah {font-size: 31px; color: var(--font-color); line-height: 2.1;}
.ar-sura p {text-align: right; font-size: 31px; color: var(--font-color); line-height: 2.1; font-family: "Arabic-Sans", Helvetica, sans-serif;}
.ar-sura p span {font-size: 31px; color: var(--a-color);}
.tr-sura h2, .ru-sura h2, .tf-sura h2 {font-size: 23px; color: var(--font-color);}
.tr-sura h3, .ru-sura h3, .tf-sura h3 {font-size: 21px;}
.tf-sura h4, .sl-sura h4 {text-align: center; font-size: 18px;}
.tf-sura p.ayat {font-size: 25px; color: var(--blue-color);}
.tf-sura p.hds {font-size: 23px; color: var(--ar-hds-color);}
.tr-sura p, .ru-sura p {font-size: 17px; line-height: 2.3; font-family: OpenSans-Light, Verdana, Arial, sans-serif;} 
.sl-sura audio {margin: 35px 5px;}
/*quran-page -----*/
.quran-page {text-align: center; margin: 35px 0;}
ul.pag {display: inline-block; padding: 0; margin: 0;}
ul.pag li {display: inline;}
ul.pag li span {font-size: 17px; font-weight: bold;}
ul.pag li a {float: left; margin: 0 9px; padding: 8px 17px; background: var(--pag-color); color: var(--font-color); text-decoration: none; transition: background .3s; border: 1px solid var(--green-color);}
ul.pag li a:hover {background: var(--hover-color);}
ul.pag li a.active {background: var(--green-color); color: #f1f1f1; border: 1px solid var(--green-color); font-size: 15px;}
ul.pag li a.no-active {background: var(--pag-color); border: 1px solid var(--green-color);}
.quran-page p {margin: 41px 0; font-size: 17px;}
/*list -----*/
.list h3 {margin: 31px 9px; text-align: center; font-size: 23px; color: var(--font-color); font-family: OpenSans-Light, Arial, Verdana, sans-serif; font-weight: normal;}
.list ul {text-align: center; list-style-type: none;}
.list li {margin: 15px 15px 15px -25px; border: 1px solid #2A90B9; border-width: 1px 1px; border-radius: 3px; -webkit-box-shadow: 0px 3px 9px 0px rgba(34, 60, 80, 0.07);
-moz-box-shadow: 0px 3px 9px 0px rgba(34, 60, 80, 0.07); box-shadow: 0px 3px 9px 0px rgba(34, 60, 80, 0.07);}
.list li a {display: block; padding: 15px 25px; background: var(--mush-color); font-size: 19px; color: var(--font-color); font-family: Arial, Helvetica; text-decoration: none;}
.list li a:hover {background: #69ACCF; color: #f1f1f1;}
/*audio -----*/
.sura-audio {width: 97%; height: auto; margin: 5px 5px; background-color: #f7fcfd; border: 2px solid #0a5875; border-radius: 3px;}
.sura-audio-info {display:block; float: right;}
.sura-audio-name {font-size: 16px; color: #0a5875; padding: 7px 15px; font-weight: bold; font-family: OpenSans-Light, Verdana, Arial;}
.sura-audio-name i {font-size: 15px; color: #0a5875; padding: 0 9px 0 0;  font-weight: bold;}
.sura-audio-name  span {font-size: 23px; color: #0a5875; padding: 0px 15px; font-weight: bold;}
.sura-audio-rus {font-size: 15px; color: #333; padding: 7px 15px; font-family: OpenSans-Light, Verdana, Arial;}
.sura-audio-txt {font-size: 13px; color: #333; padding: 7px 15px;}
.player {display:block; margin: 15px;}
.pl {margin: 0px 0px;}
.btn {margin: 15px 0px;}
.btn div {display:inline-block; margin: 0px 35px;}
.rd {background-image: url(/img/rd.png); padding-left: 23px; background-size: 21px 21px; background-position: left center; background-repeat: no-repeat;}
.dl {background-image: url(/img/dl.png); padding-left: 23px; background-size: 21px 21px; background-position: left center; background-repeat: no-repeat;}
.rd a, .dl a {font-size: 15px; color: #7d7d7d;}
/*salyat-list -----*/
.multi-col {column-count: 3; column-gap: 15px; column-fill: balance; margin-right: 19px; list-style: none; padding-left: 10px;}
.multi-col li {padding: 9px 15px;}
.multi-col li a {font: 17px sans-serif; color: var(--karta-color); text-decoration: underline;}
.multi-col li a:hover {color: #4169E1; text-decoration: none;}
/*salyat-widget -----*/
.salyat-widget {margin: 35px 5px; text-align: center;}
.salyat-widget > div {display: inline-block;}
.salyat-widget p {padding: 5px 23px 5px 23px; background: var(--bg-color); font-size: 19px; color: var(--grey-color); font-weight: normal;}
.salyat-widget p span {font-size: 25px; font-weight: normal;}
.salyat-widget p i {font-size: 27px; font-style: normal; color: var(--font-color);}
.coord {margin: 10px 5px 30px  5px; text-align: center; list-style-type: none;}
.loc {display: inline-block; padding-left: 20px; background-image: var(--geo-img); background-position: left center; background-size: 15px 15px; background-repeat: no-repeat;}
.metod {margin: 10px 5px; text-align: center;}
.metod select {width: 185px; background: var(--bg-color); color: var(--font-color);}
/*table -----*/
.table_cen {width: 95%; text-align: center; border: 1px solid #333; margin: auto;}
.table_text_cen {text-align: center; width: 100%; border: 1px solid var(--td-bord-color); font-family: Helvetica;}
.table_text_cen h2 {font-family: Arial, Helvetica;}
table {border-collapse: collapse; border-spacing: 0;}
th {font-size: 17px;} 
.rot{width: 25px; font-size: 12px; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); border: 0px solid #f1f1f1;}
th span{font-size: 12px;}
td, th {padding: 9px 0; border: 1px solid var(--td-bord-color);}
tbody tr:nth-child(even) {background: var(--td-bg-color);}
.news_link {height: auto; text-align: center; list-style: none;}
.news_link li {display: inline-block; margin-top: 25px; padding: 2px 15px;}
.news_link li a {font: 15px sans-serif; color: #22B04C; font-weight: bold; text-decoration: underline;}
.news_link li a:hover {color: #6c0; text-decoration: none;}
.news_link li span {font: 15px sans-serif; color: var(--font-color); font-weight: bold;}
.karta {height: auto; text-align: left; list-style: none;}
.karta li {display: block; padding: 9px 15px;}
.karta li a {font: 17px sans-serif; color: var(--karta-color); text-decoration: underline;}
.karta li a:hover {color: #4169E1; text-decoration: none;}
/*right_bl -----*/
.right_bl {float: right; width: 250px; background: var(--bg-color);}
.rt_bl {display: block; margin: 0 auto;}
.rt_bl h3 {text-align:left; margin: 27px 45px; font-size: 17px; font-weight: bold;}
.rt_bl ul {margin: 21px 0; list-style: none;}
.rt_bl li {margin-left: 5px;}
.rt_bl a {font-size: 15px; color: var(--font-color); line-height: 31px;}
.rt_bl a:hover {color: var(--a-color); text-decoration: none;}
.sl p {text-align: center; margin: 25px 0; font-size: 35px; color: var(--sl-color);}
/*massage -----*/
.tool {text-align: center; width: 100%; height: auto; background: #282828;}
.tool div {display: inline-block; vertical-align: middle; margin: 15px 4px;}
.mess input {padding: 11px 13px; width: 400px; font-size: 15px; color: #f1f1f1; background: transparent none repeat scroll 0 0; border: 1px solid #f1f1f1;}
.send button {padding: 11px 21px; width: 100%; color: #f1f1f1; font-size: 15px; background: rgba(0, 0, 0, 0) none repeat scroll 0 0; border: 1px solid #f1f1f1; transition: all 0.3s ease 0s; cursor: pointer;}
.send button:hover {background: #22b14c;}
.social {display: inline-block;}
.tl {background: url(/img/soc/tl.png) no-repeat; float: left; margin-left: 7px; width: 43px; height: 43px;}
.wa {background: url(/img/soc/wa.png) no-repeat; float: left; margin-left: 7px; width: 43px; height: 43px;}
.vk {background: url(/img/soc/vk.png) no-repeat; float: left; margin-left: 7px; width: 43px; height: 43px;} 
.in {background: url(/img/soc/in.png) no-repeat; float: left; margin-left: 7px; width: 43px; height: 43px;} 
/*footer -----*/
.footer {background: #181818 none repeat scroll 0 0; padding: 20px 0;} 
.container{text-align: center;}
.col-4 {display: inline-block; width: 21%; min-width: 150px;  text-align: left;}
.footer-title h4 {margin-left: -15px; margin-top: 25px; color: #f1f1f1; font-size: 15px; font-weight: 700; text-transform: uppercase;}
ul.footer-content  {margin-left: -15px; margin-top: 15px; padding-left: 0;}
ul.footer-content li {display: block;}
ul.footer-content li a, ul.footer-content li span  {font-size: 15px; color: #f1f1f1; font-family: 'Roboto', sans-serif; line-height: 40px; text-decoration: none;}
ul.footer-content li a:hover {color: #19d119;}
ul.footer-content li i {color: #19d119; float: left; line-height: 37px; width: 25px;}
.copyright-area {background: #111 none repeat scroll 0 0; padding: 20px 0 20px;}
.copyright p,.copyright a {text-align: center; font-size: 13px; color: #f1f1f1; text-decoration: none;}
.copyright > p > a:hover {color: #19d119; text-decoration: underline;}
.count {margin-left: 15px;}
#top {background: url("../../img/up.png") no-repeat 0 0 transparent; position: fixed; bottom: 29px; right: 11px; cursor: pointer; text-decoration: none; width: 49px; height: 49px; visibility: hidden; opacity: 1;}
#top.cd-is-visible {visibility: visible;}
#top:hover {background: url("../../img/up.png") no-repeat -49px 0 transparent;}
/*modal -----*/
.modalform {position: fixed; top: 35%; left: 56%; z-index: 19; display: none; margin: 0 auto; margin-top: -100px; margin-left: -175px; 
width: 310px; height: 230px; background: #f1f1f1; padding-top: 40px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; 
border: 2px solid #228b22; border-radius: 10px; font-size: 15px; text-align: center;}
.form-contact .modal input[type=submit], .form-modal input[type=submit] {margin-left:25px; margin-top:5px;}
#close, #closer {position: absolute; top: -1px; right: -1px; border-radius: 7px; width: 30px; height: 30px; background: #228b22; 
color: #f1f1f1; cursor: pointer; text-align: center; font-size: 17px; line-height: 30px;}
#bg-close {position: fixed; z-index: 17 !important; top: 0; left: 0; z-index: 0; display: none; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); cursor: pointer;}
.form-modal input[type=text] + label {right: -174px !important;}
.form-modal textarea + label {right: -219px !important;}
#title {margin-left: -14px;}
.form-modal div:nth-child(4) label {right: -193px !important;}
.form-modal.one div:nth-child(2) label {right: -193px !important;}
.polit {margin-bottom: 5px; font-size: 9px;}
.polit a {text-decoration: underline dotted;}
/*form -----*/
.back {margin: 0 9px; background: var(--pag-color);}
.back input[name="name"] {width: 90%; margin: 9px;}
.back input[name="email"] {width: 90%; margin: 9px;}
.back input[type="button"] {cursor: pointer;}
.back textarea {width: 90%; height: 120px; margin: 9px;}
.back input, textarea {background-color: rgba(255, 255, 255, 0.4); border: 2px solid rgba(122, 192, 0, 0.15); padding: 10px; 
font-family: Keffeesatz, Arial; color: #4b4b4b; font-size:1.6em; -webkit-border-radius: 5px; margin-bottom: 15px; margin-top: -10px;}
.back input:focus, .back textarea:focus {border: 2px solid #22b04c; background-color: rgba(255, 255, 255, 1);}
.g-recaptcha {margin-left: 9px;}
.back input[type="submit"] {margin: 9px; border: none; cursor: pointer; color: #f1f1f1; font-size:1.7em; background-color: #22b04c; padding: 5px 25px 8px 25px; 
-webkit-border-radius: 3px; -moz-border-radius: 3px; -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.4); -moz-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.6); 
border-bottom: 1px solid rgba(0, 0, 0, 0.4); border-top: 1px solid rgba(255, 255, 255, 0.6); background: -webkit-gradient(
linear, left bottom, left top, color-stop(0.23, #619702), color-stop(0.62, #7ac000)
); 
background: -moz-linear-gradient( center bottom, #619702 23%, #7ac000 62% );
}
.back input[type="submit"]:hover {color: #f1f1f1; border-bottom: 1px solid rgba(0, 0, 0, 0.4); background-color: #ff5400; background: -webkit-gradient(
linear, left bottom, left top, color-stop(0.23, #c34000), color-stop(0.62, #ff5400)
);
background: -moz-linear-gradient(
center bottom, #c34000 23%, #ff5400 62%
);
}
.back input[type="submit"]:active {top: 1px;}
.back p {margin-bottom: 5px; font-size: 9px;}
.back a {text-decoration: underline dotted;}

/*fonts -----*/
@font-face {
  font-family: 'Arabic-Sans';
   src: url('/tmpl/fonts/arabic_sans.woff2') format('woff2'), /* Super Modern Browsers */
        url('/tmpl/fonts/arabic_sans.otf') format('truetype'),
		url('/tmpl/fonts/arabic_sans.svg#liberation_sans') format('svg'), /* Chrome < 4, Legacy iOS */
		url('/tmpl/fonts/arabic_sans.ttf') format('truetype'); /* Safari, Android, iOS */
  font-display: swap;
}

/*media -----*/
@media screen and (min-width: 2000px) {
.bism-img {background-size: 21%;}
}
@media screen and (max-width: 1999px) {
.bism-img {background-size: 27%;}
}
@media screen and (max-width: 1699px) {
.bism-img {background-size: 35%;}
}
@media screen and (max-width: 1199px) {
.bism-img {background-size: 41%;}    
.salyat-top-time p {padding: 0 45px 5px 45px;}	
.content {width: 955px;}
.content_bl {width: 750px;}
.right_bl {width: 200px;}
}
@media screen and (max-width: 999px) {
.salyat-top-time p {padding: 0 40px 5px 40px;}
.content {width: 850px;}
.content_bl {width: 650px;}
.iht {margin: 9px 4px;}
.iht li a {padding: 6px 13px; margin: 0 1px; font-size: 17px;}
.salyat-widget p {padding: 0 13px 5px 13px; font-size: 19px;}
}
@media screen and (max-width: 915px) {
.salyat-top-time p {padding: 0 35px 5px 35px;}
}
@media screen and (max-width: 891px) {
.salyat-top-time p {font-size: 17px; padding: 0 25px 7px 25px; font-weight: bold;}	
.content {width: 100%;}	
.content_bl {float: none; width: 100%;}
.sura-audio-info {float: none; text-align: center;}
.player {text-align: center;}
.multi-col li a {font: 16px sans-serif;}
.salyat-widget {margin: 25px 5px;}
.salyat-widget > div {display: block;}
.salyat-widget > div p {display: inline-block; margin: 13px 5px;}
.salyat-widget p {padding: 0 25px 5px 25px; background: var(--bg-color); font-size: 19px; font-weight: normal;}
.salyat-widget p span {font-size: 25px; font-weight: normal;}
.salyat-widget p i {position:relative; top:-9px; font-size: 33px;}
.right_bl {float: none; width: 100%;}
.rt_bl {display: block; margin: 0 auto; padding: 0 55px;}
}
@media only screen and (max-width: 740px){
.logo {top: 5px; left: 17px; float: left; height: 61px;}
.logo span {display: block; margin-left: 59px;}
.hidden-menu {top: 61px; padding: 30px 10px 10px;}
.salyat-top-time {margin-top: 75px; text-align: center;}
.print {display: none;}
.quran h2 {font-size: 31px;}
.quran h2 span {font-size: 25px;}
.quran h2 a {font-size: 25px; margin: 0px 5px;}
.tr-sura h2, .ru-sura h2, .tf-sura h2 {font-size: 21px;}
.tr-sura h3, .ru-sura h3, .tf-sura h3 {font-size: 19px;}
.quran-iht {width: 100%; height: 53px; margin: 0;}
.iht {margin: 9px 3px;}
.iht li a {padding: 6px 9px; margin: 0 1px; font-size: 14px;}
.ar-sura p {font-size: 29px;}
.ar-sura p span {font-size: 29px;}
.r_img, .l_img {float: none; display: block; margin: auto; width: 90%; margin-bottom: 15px;}
.tool {text-align: left;}
div.mess, div.send {margin-left: 25px;}
.count {display: none;}
}
@media screen and (max-width: 715px) {
.logo {width: 70px;}	
.logo span:first-child {display:none;}
.logo span:last-child {display:none;}
.bism-img {background-size: 60%;}
.salyat-top-time p {padding: 0 15px 5px 15px;}
ul.pag li a {margin: 0 7px; padding: 8px 15px;}
}
@media screen and (max-width: 665px) {
h1 {margin: 21px 9px 21px 9px; font-size: 23px; font-weight: normal;} 
h1 span {font-size: 29px;}
.tanz {font-size: 15px;}
h2 {margin: 27px 9px; font-size: 19px; font-weight: normal;}
h3 {margin: 19px 7px; font-size: 19px; font-weight: normal;}
.gal-wkf h2 span {font-size: 31px;}
.gal-wkf p {margin: 51px 25px; font-size: 15px;}
.gal-wkf p i {vertical-align: middle;}
.gal-wkf p span {vertical-align: middle;}
.list h3 {font-size: 19px;}
.list li a {font-size: 17px;} 
.rot {width: 35px;}
}
@media only screen and (max-width:605px){
.salyat-top-time p {padding: 0 5px 5px 5px;}	
.mess input {width: 300px;}
.print {display:none;}
.sura-ar {margin-top: -79px;}
}
@media only screen and (max-width:470px){
h1 {font-size: 21px; text-transform: none;} 
h1 span {font-size: 27px;}
.logo {left: 9px;}     
.salyat-top-time p {padding: 0 4px 5px 4px; font-size: 16px;}
th {font-size: 14px;} 
.rot {width: 19px; font-size: 11px;}
}
@media only screen and (max-width:391px){
.salyat-top-time p {padding: 0 2px 4px 2px;}
}
@media only screen and (max-width:365px){
.salyat-top-time p {padding: 0 0px 4px 0px; font-size: 15px;}
.iht {margin: 9px 1px;}
.iht li a {padding: 5px 5px;}
}
#cookie_not{display: none; justify-content: space-between; align-items: flex-end; position: fixed; bottom: 9px; left: 50%; width: 900px;
max-width: 90%; transform: translateX(-50%); padding: 15px; background-color: white;  z-index: 9999;
border-radius: 3px; box-shadow: 2px 3px 10px rgba(0, 0, 0, 0.4);}
#cookie_not p{margin: 0; font-size: 12px; text-align: left; color: #0d0d0d;}
.button{appearance: none; float: right; border: 0; border-radius: 3px; background: #666; color: #f1f1f1; padding: 7px 15px; font-size: 16px; cursor: pointer;}
@media (min-width: 576px){
#cookie_not.show{display: flex;}
.cookie_acc{margin: 0 0 0 15px;}
}
@media (max-width: 575px){
#cookie_not.show{display: block; text-align: left;}
.cookie_acc{margin: 10px 0 0 0;}
}