/*!
 * Theme Name: 		   OceanWP
 * Text Domain: 	   oceanwp
 * Version:            2.0.2
 * Tested up to:       5.6
 * Requires at least:  5.3
 * Requires PHP:       7.2
 * Author:             Nick
 * Author URI:         https://oceanwp.org/about-me/
 * Theme URI:          https://oceanwp.org/
 * Description:        OceanWP is the perfect theme for your project. Lightweight and highly extendable, it will enable you to create almost any type of website such a blog, portfolio, business website and WooCommerce storefront with a beautiful & professional design. Very fast, responsive, RTL & translation ready, best SEO practices, unique WooCommerce features to increase conversion and much more. You can even edit the settings on tablet & mobile so your site looks good on every device. Work with the most popular page builders as Elementor, Beaver Builder, Brizy, Visual Composer, Divi, SiteOrigin, etc... Developers will love his extensible codebase making it a joy to customize and extend. Best friend of Elementor & WooCommerce. Looking for a Multi-Purpose theme? Look no further! Check the demos to realize that it's the only theme you will ever need: https://oceanwp.org/demos/
 * Tags:               two-columns, right-sidebar, footer-widgets, blog, news, custom-background, custom-menu, post-formats, rtl-language-support, sticky-post, editor-style, threaded-comments, translation-ready, buddypress, custom-colors, featured-images, full-width-template, theme-options, e-commerce, block-styles, wide-blocks, accessibility-ready
 *
 * License: GNU General Public License v2.0 or later
 * License URI: https://www.gnu.org/licenses/gpl-2.0.html
 *
 * All files, unless otherwise stated, are released under the GNU General Public
 * License version 2.0 (http://www.gnu.org/licenses/gpl-2.0.html)

 * This theme, like WordPress, is licensed under the GPL.
 * Use it to make something cool, have fun, and share what you've learned
 * with others.
 *
 * DO NOT ADD YOUR CSS TO THIS FILE - IT WILL BE LOST
 * To add your own CSS, use a child theme: https://github.com/oceanwp/oceanwp-child-theme
 *
 * CSS file is in "assets/css"
 */
 
#site-header-inner {
	padding:8px 0px!important;
}

.topbar-content a{
	background:#8ECCC7!important;
	padding:15px 30px 13px 30px;
	margin-top:-15px;
	margin-bottom:-13px;
}
 
 #site-navigation-wrap {
	margin-top:6px;
}

#first-row {
	padding-top:150px;
	padding-bottom:150px;
}

#main #pg-5-0 > .panel-row-style {
	background-position: top center!important;
}

#first-row h1 {
	font-size:50px;
}

#first-row .sub-title1 {
	font-size:30px;
	font-family: Arial;
	color:#000;
}

#first-row .sub-title2 {
	font-size:28px;
	margin-bottom:40px;
	font-family: Arial;
	color:#000;
}

#first-row  .CTA-btn{
	text-decoration:none;
	text-transform:uppercase;
	border:1px solid #000;
	padding:15px 20px;
	color:#000;
	font-size:20px;
	font-family: Arial;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	transition: all 0.5s ease;
	display:block;
	max-width:350px;
	text-align:center;
}

#first-row .CTA-btn:hover {
	background:rgba(255,255,255,0.3);
	 -webkit-transform: scale(1.05);
	 -moz-transform: scale(1.05);
	 -o-transform: scale(1.05);
	box-shadow: 0 30px 70px rgba(0,0,0,.52);	
}



#servises-row {
	padding-top:50px;
	padding-bottom:50px;
}

.servises-item {
	text-align:center;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.servises-item:hover {
	margin-top:-20px;
}

.servises-item img {
	border-radius: 100%;
	border:5px solid #f1f1f1;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

.servises-item:hover img{
	border:5px solid #8ECCC8;
}

.servises-row .panel-grid-cell {
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	transition: all 0.5s ease;
	padding:0px;
	background:#fff;
}


.servises-row .panel-grid-cell:hover {
	box-shadow: 0 30px 70px rgba(0,0,0,.52);
	margin-top:-10px;
}

.servises-row .servises-item-img {
	margin-bottom:-20px!important;
}

.servises-row .servises-item-img img {
      -webkit-clip-path: polygon(0 0, 100% 0, 100% 86%, 0 100%);
      clip-path: polygon(0 0, 100% 0, 100% 86%, 0 100%);
    }

.servises-item2 {
	padding:0px 15px 0px 15px;
}

.servises-item h3, .servises-item2 h3 {
	text-transform:uppercase;
	text-align:center;
}

.servises-item2 p {
	margin-bottom:10px;
}

.servises-item2 .servises-more-btn, #focus .CTA-btn {
	text-decoration:none!important;
	background:#CBEBEA;
	text-transform:uppercase;
	color:#000;
	padding:10px 20px;
	border-radius: 30px;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	transition: all 0.5s ease;
	opacity:0!important;
	display:block;
	max-width:150px;
	margin:auto;
	border:1px solid #f1f1f1;
	text-align:center;

}

.servises-row .panel-grid-cell:hover .servises-more-btn {
	opacity:1!important;
	 -webkit-transform: scale(1.05);
	 -moz-transform: scale(1.05);
	 -o-transform: scale(1.05);
}

#focus .CTA-btn {
	opacity:1!important; 
	float:left;
	max-width:350px;
	margin-top:20px;

 }

.servises-item2 .servises-more-btn:hover, #focus .CTA-btn:hover {
	background:#8ECCC7!important;
}

#main .section-title h2 {
	text-align:center;
	text-transform:uppercase;
	font-size:30px!important;
	font-weight:normal;
	color:#000;
}

.mindfulness .servises-more-btn, .cognitive .servises-more-btn, .youth .servises-more-btn{
	margin-top:35px;
}



#about-row .section-title {
	margin-bottom:-20px;
}

#about-row .section-title h2{
	text-align:left;
	margin-top:20px;
	margin-bottom:0px;
}

#about-row .about-text h3 {
	font-size:26px;
	font-family:Arial;
	font-weight:normal;
}

#about-row .about-text h3.sub-title {
	font-size:30px;
	font-family: Aref Ruqaa;
	font-weight:bold;
}

#about-row .about-text p {
	font-family:Arial;
	font-size:16px;
	text-align:justify;
}

#testimonials, #mental-wellbeing, #focus, #cta {
	padding:40px 0px;
}

#mental-wellbeing .about-text, #focus .about-text{
	font-family:Arial;
	font-size:17px;
	text-align:justify;
}

#footer-widgets {
	padding-top:30px;

}

#footer-widgets #text-2 {
    display: block;
    width: 100px;
    margin: auto;
}


#footer-widgets #text-2 {
	margin-top:20px!important;
	
}

#footer-widgets #text-2 img {
	width:100px;
	height:auto;
    display: block;
    margin-top: -100px !important;
	margin-bottom:30px;
    position: absolute;
}

#footer-widgets #text-2 p {
	margin-bottom:0px;
}

#footer-widgets .widget_nav_menu ul {
	text-align:center;
	margin-top:20px;
}

#footer-widgets .widget_nav_menu li {
	display:inline;
	float:none;
}

#footer-widgets .widget_nav_menu li a {
	text-transform:uppercase;
	font-size:20px;
	padding:15px 20px 0px 20px; 
}

#content-wrap {
	opacity:1px;
}

#contact .contact-item p{
	margin-bottom:0px;
	font-size:17px;
}

#contact .contact-item img {
	margin-bottom:20px;
}

#contact .contact-item a {
	text-decoration:none;
}

#cta {
	border-top:3px solid #8ECCC7;
	border-bottom:3px solid #8ECCC7;
}

#cta p {
	font-size:25px;
	margin-bottom:10px;
}

#cta img {
	width:200px;
	height:auto;
	
}

#cta a {
	color:#fff;
	background:#8ECCC7;
	padding:15px 30px;
	text-align:center;
	text-decoration:none;
	border-radius: 30px;
	text-transform:uppercase;
	display:inline-block;
	margin-top:40px;
	font-size:20px;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

#cta a:hover {
	box-shadow: 0 30px 70px rgba(0,0,0,.52);
	 -webkit-transform: scale(1.05);
	 -moz-transform: scale(1.05);
	 -o-transform: scale(1.05);
	
}

#main{
	min-height:60vh;
}


.cells .panel-grid-cell {
	/*box-shadow: 0 1px 10px rgba(0,0,0,.52);*/
	background:#f1f1f1;
	height:300px;
	padding:20px;
}

.cells .panel-grid-cell h4{
	text-align:center;
	margin-top:10px;
	font-size:20px;
	font-family: Aref Ruqaa;
}

.cells .cell1{
	background:url(images/adress.png)top center no-repeat;
	
}

.cells .cell2{
	background:url(images/phone.png)top center no-repeat;
	
}

.cells .cell3{
	background:url(images/email.png)top center no-repeat;
	
}

.cells .cell{
	padding-top:90px;
	background-size:auto 80px;
}

.cells .cell1 p {
	padding:0px 20px;
}

.cells .cell2 p {
	margin-bottom:0px;
}

.cells .cell p{
	text-align:center;
	font-size:18px;
}

.cells .cell p strong{
	font-weight:500!important;
	color:#777;
}

.cells .cell a{
	text-decoration:none!important;
}

.cont-info{
	padding-bottom:50px;
}



.page-header.background-image-page-header .page-header-title{
	color:#000!important;
	margin-bottom: 20px;
}

.background-image-page-header .page-subheading{
		color:#777!important;
		margin-bottom: 20px;
} 

.btn{
	margin:auto!important;
	display:block!important;
	background:none!important;
	width:100%!important;
}

.btn a {
	color:#fff;
	background:#8ECCC7;
	padding:15px 30px;
	text-align:center;
	text-decoration:none;
	border-radius: 30px;
	text-transform:uppercase;
	display:inline-block;
	margin-top:40px;
	font-size:20px;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	transition: all 0.5s ease;
	text-decoration:none!important;
}

.btn a:hover {
	box-shadow: 0 30px 70px rgba(0,0,0,.52);
	 -webkit-transform: scale(1.05);
	 -moz-transform: scale(1.05);
	 -o-transform: scale(1.05);
	
}

.cont-info h3 {
    text-align: center;
    text-transform: uppercase;
    font-size: 30px !important;
    font-weight: normal;
    color: #000;
	font-family: Aref Ruqaa;
}

#about-page p {
    font-family: Arial;
    font-size: 16px;
    text-align: justify;
}

#about-page ul li {
    font-family: Arial;
    font-size: 16px;
    text-align: justify;
}

#about-page  img{
	max-width:400px!important;
	float:right!important;
	
}

.serv-text{
	box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.32);
	padding:30px 40px;
	border-top:5px solid #8ECCC7;
	margin-top: -70px;
	background: #fff;
	margin-bottom: 50px;
}


.serv-text p, .serv-text ul li{
	font-family: Arial;
    font-size: 16px;
    text-align: justify;
	
}

.serv-text .textwidget a{
	text-decoration:none!important;
	color:#8ECCC7;
}

.serv-text h3{
	
    font-size: 25px;
  
	font-family: Aref Ruqaa;
}

.dropdown-menu ul li a.menu-link{
	font-size: 14px!important;
}

/**************************************MEDIA********************************************/
@media (max-width: 920px) {
	.cells .cell p {
		
		font-size: 15px;
	}
	
	#about-page img {
		width: 40% !important;
		float: right !important;
	}
}

@media (max-width: 780px) {
	#about-page img {
		display:none;
	}
	
	.cells .panel-grid-cell {
      height: auto;
	  display:block;
	  width:100%;
	  max-width:350px;
	  margin:auto!important;
	  margin-bottom:20px!important;
	}
	
	.cells .cell{
		background-position:center 10px;
	}
	
	.cont-info {
		padding-bottom: 0px;
	}
}

@media (max-width: 410px) {
	.btn a{
		font-size: 14px;
	}
}

@media (max-width: 400px) {
	.serv-text p, .serv-text ul li {
		
		text-align: left;
	}
	
	.serv-text {
		padding: 20px;
	}
}