/* 
Theme Name: Basic Theme 
Theme URI: 
Author: Everest Webdesign
Author URI: http://everestwebdesign.hu
Description: Basic Theme
Version: 1.0 
License: GNU General Public License v2 or later 
License URI: http://www.gnu.org/licenses/gpl-2.0.html 
Text Domain: basic-theme
*/



* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-size: 18px;
}

body {
    font-family: "Open Sans", sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 14px;
    color: #01021E;

}

.center-box {
    width: 90%;
    max-width: 1520px;
    margin: 0 auto;
    color: #01021E;
    font-size: 18px;
    font-family: "Open Sans", sans-serif;

}

section {
    margin-top: 60px;
}

.align-center {
    text-align: center;
}

p {
    margin-bottom: 14px;
    line-height: 1.6;
    font-family: "Open Sans", sans-serif;
    font-weight: 500;
    font-style: normal;

}

.logo {
    display: block;
    width: 250px !important;
    position: relative;
    padding: 10px 0;
    float: left;
}
nav {
        display: block;
    top: 40px;
    position: relative;
    left: 30px;
}
nav ul {
    display: block;
    text-align: left;
}
nav ul li {
    display: inline-block;
    position: relative;
}

nav li a {
    display: inline-block;
    text-decoration: none;
    color: #000;
    margin: 20px 0px 0px 40px;
    font-size: 1rem;
    text-align: center;
    font-family: "Open Sans", sans-serif;
    padding: 10px; /* >>> hozzáadva, hogy ne ugráljon */
   
}
nav li a:hover {
    color: #fff;
    background-color: #F8673B;
    border-radius: 50px;
}

.services2 .button {

    margin: 0 0 60px 0;
}

.service-container {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.column-3.services2 {
    display: flex;
    justify-content: space-between;
}

.service-container:hover {
    transform: scale(1.1);
    /* A kép nagyítása */
}


.hero {
    background-image: url(../img/bni-bg1.png);
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    padding-top: 20px;
}

.hero:after {
    content: "";
    position: absolute;
    height: 80px;
    bottom: 0;
    display: block;
    left: 0;
    background: white;
    width: 100%;
    background: linear-gradient(to top, white, transparent);
}

.hero2 {
    background-image: url(../img/csoport-bg.png);
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    padding-top: 20px;
    padding-bottom: 80px;
    text-align: center;
}

.hero2:after {
    content: "";
    position: absolute;
    height: 80px;
    bottom: 0;
    display: block;
    left: 0;
    background: white;
    width: 100%;
    background: linear-gradient(to top, white, transparent);
}

.hero-text {
    background-color: white;
    position: relative;
    padding: 40px;
    width: 60%;
    margin-top: 100px;
}

.hero-text2 {
    background-color: white;
    position: relative;
    padding: 40px;
    width: 60%;
}

img {
    width: 100%;
}

#logo-box {
    background-color: #fff;
    padding: 10px;
    border: solid 3px #CE1226;
    border-radius: 7px;
    width: 180px;
    position: relative;
    top: -50px;
    box-shadow: 30px 30px 30px 0px rgba(0, 0, 0, 0.4);
}

#logo-box2 {
    background-color: #fff;
    padding: 10px;
    border: solid 3px #CE1226;
    border-radius: 7px;
    width: 180px;
    position: relative;
    top: 40px;
    z-index: 1;
    box-shadow: 30px 30px 30px 0px rgba(0, 0, 0, 0.2);
}

.align-center {
    text-align: center;
}

.hero img {
    width: 100%;
}

.box1 {
    background-color: #F4F8FA;
    border: solid 1px #CBCBCB;
    border-radius: 20px 20px 20px 200px;
    box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.5);
    padding: 30px 30px 100px 30px;
    width: 80%;
    position: relative;
    margin-bottom: 40px;
}

.box1:before {
    background-image: url(../img/after.png);
    width: 66px !important;
    height: 75px !important;
    content: "";
    position: absolute;
    left: -30px;
    transform: none;
    z-index: 1;
    background-size: cover;
    top: -20px;
}

.box1 img,
.box2 img {
    width: 80%;
}

.box1,
.box2 {
    height: 100%;
}

.box2 {
    background-color: #F4F8FA;
    border: solid 1px #CBCBCB;
    border-radius: 20px 20px 200px 20px;
    box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.5);
    padding: 30px 30px 100px 30px;
    width: 80%;
    position: relative;
    margin-bottom: 40px;
}

.box2:before {
    background-image: url(../img/after.png);
    width: 66px !important;
    height: 75px !important;
    content: "";
    position: absolute;
    left: -30px;
    transform: none;
    z-index: 1;
    background-size: cover;
    top: -20px;
}

.box1 h2,
.box2 h2 {
    text-align: center;
}

.value {
    background-color: #86BBD8;
    color: #fff;
    text-transform: uppercase;
    font-weight: 600;
    padding: 30px;
    margin: 30px 0 30px 0px;
}

.value h3 {

    color: #fff;

}

.box3 {
    background-color: #FCFCFC;
    border: solid 1px #CBCBCB;
    border-radius: 200px 20px 20px 20px;
    box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.5);
    padding: 70px 30px 100px 30px;
    width: 80%;
    position: relative;
    margin-bottom: 40px;
}

.box3 h2,
.box4 h2 {
    text-align: center;
}

.box3:before {
    background-image: url(../img/after.png);
    width: 66px !important;
    height: 75px !important;
    content: "";
    position: absolute;
    left: -30px;
    transform: none;
    z-index: 1;
    background-size: cover;
    top: 90%;
}

.box4 {
    background-color: #FCFCFC;
    border: solid 1px #CBCBCB;
    border-radius: 20px 20px 200px 20px;
    box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.5);
    padding: 30px 30px 100px 30px;
    width: 80%;
    position: relative;
    margin-bottom: 40px;
}

.box4:before {
    background-image: url(../img/after.png);
    width: 66px !important;
    height: 75px !important;
    content: "";
    position: absolute;
    left: -30px;
    transform: none;
    z-index: 1;
    background-size: cover;
    top: 90%;
}

.item img {
    width: auto;
}

.item-row:before {
    background-color: #F8673B;
    width: 3px;
    height: 100%;
    content: "";
    position: absolute;
    margin-left: 100px;
    z-index: 1;

}

.item-row {
    position: relative;
}

.text {
    padding-left: 20px;
}

.item .row {
    margin-bottom: 50px;
}

.item .row p {
    width: 80%;
}

.preference2 {
    margin-top: 60px;
}

.preference2 h2 {
    width: 80%;
    flex-wrap: wrap;
}

.pic {
    width: 80%;
    margin-top: 60px;
}

.box5 {
    background-color: #F4F8FA;
    border: solid 1px #CBCBCB;
    border-radius: 200px 20px 20px 20px;
    box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.5);
    padding: 90px 30px 100px 30px;
    width: 80%;
    position: relative;
    margin-bottom: 40px;
}

.box5:before {
    background-image: url(../img/after.png);
    width: 66px !important;
    height: 75px !important;
    content: "";
    position: absolute;
    left: -30px;
    transform: none;
    z-index: 1;
    background-size: cover;
    top: 90%;
}

.box6 {
    background-color: #F4F8FA;
    border: solid 1px #CBCBCB;
    border-radius: 20px 200px 20px 20px;
    box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.5);
    padding: 30px 30px 100px 30px;
    width: 80%;
    position: relative;
    margin-bottom: 40px;

}

.box6:before {
    background-image: url(../img/after.png);
    width: 66px !important;
    height: 75px !important;
    content: "";
    position: absolute;
    left: -30px;
    transform: none;
    z-index: 1;
    background-size: cover;
    top: 90%;
}

.box6 h2,
.box5 h2 {
    text-align: center;
}

.box6,
.box5 {
    height: 100%;
}


h1 {
    font-size: 3rem;
    font-family: "Open Sans", sans-serif;
    font-weight: 700;
    font-style: normal;
    line-height: 1.5;
}

.hero-text h1 {


    margin-bottom: 30px;
    line-height: 1.2;
}

.button:hover {
    display: inline-block;
    width: auto;
    position: relative;
    padding: 15px;
    border-radius: 50px;
    border: solid 3px #F8673B;
    background-color: #fff;
    color: #F8673B;
    text-decoration: none;
    font-weight: 600;
}

.button {
    display: inline-block;
    width: auto;
    position: relative;
    padding: 15px;
    border-radius: 50px;
    background-color: #F8673B;
    color: #fff;
    text-decoration: none;
    font-weight: 600;
    margin-top: 30px;
}


h2 {
    font-size: 2rem;
    font-family: "Open Sans", sans-serif;
    font-weight: 700;
    font-style: normal;
    line-height: 1.5;
    color: #33658A;
    margin-bottom: 30px;
}

h3 {
    font-size: 1.5rem;
    font-family: "Open Sans", sans-serif;
    font-weight: 700;
    line-height: 1.5;
    font-weight: 600;
    color: #33658A;
}

::marker {
    display: none;
}



/* Árak BOX */
.price-box {
    background-color: #FCFCFC;
    border: solid 1px #CBCBCB;
    border-radius: 20px 20px 20px 200px;
    box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.5);
    padding: 30px 30px 100px 30px;
    width: 80%;
    position: relative;
    margin-bottom: 40px;
}

.price-box:before {
    background-image: url(../img/after.png);
    width: 60px !important;
    height: 75px !important;
    content: "";
    position: absolute;
    left: -30px;
    transform: none;
    z-index: 1;
    background-size: cover;
    top: 90%;
}


/* könyvelők részére tab */
tab1 {
    background-color: #86BBD8;
    border-radius: 20px;
    color: #fff;
}

tab2 {
    background-color: #33658A;
    border-radius: 20px;
    color: #fff;
}

/* árak színei 
#454545, 
#F8673B
*/
.reviews img {
    max-width: 180px;
}

.reviews-box {
    background-color: #FCFCFC;
    border: solid 1px #CBCBCB;
    border-radius: 20px 200px 20px 20px;
    /*box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.5);*/
    padding: 30px 100px 30px 30px;
    width: 80%;
    position: relative;
    margin-bottom: 40px;
}

.faq-box1 {
    background-color: #F4F8FA;
    border: 1px solid #CBCBCB;
    border-radius: 20px;
    box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.5);
    padding: 30px;
    width: 80%;
    position: relative;
    display: block; /* vagy flex, ha belül is rendeznél */
    margin: 0 auto 40px auto; /* ez középre teszi vízszintesen */
}

.faq-box2 {
    background-color: #FCFCFC;
    border: 1px solid #CBCBCB;
    border-radius: 20px;
    box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.5);
    padding: 30px;
    width: 80%;
    position: relative;
    display: block; /* vagy flex, ha belül is rendeznél */
    margin: 0 auto 40px auto; /* ez középre teszi vízszintesen */
}

.pic-contact {
    width: 70%;
    display: flex;
    justify-content: center;
    position: relative;
}

/* a tab paneleken a szöveg beviteli mező */

footer {
    background-color: #86BBD8;
    color: #fff;
    padding:20px;
}
footer p,
footer ul li {
    color: #fff;
}
footer ul li {
   text-align: center;
    display: inline-block;
    position:relative;
    margin-left: 10px;
    margin-right: 10px;
}
footer .logo {
    float: right;
    display: inline-block;
    position: relative;
}
@media (max-width: 768px) {
    h2 {
        font-size: 1.5rem;
    }

    h1 {
        font-size: 1.7rem;
    }

    ::marker {
        content: none !important;
    }

    ul {
        list-style: none;
        /* Ezzel elrejted az alapértelmezett felsorolásjelzést */
    }

    a {
        color: #fff;
        text-decoration: none;
    }
}

@media only screen and (min-width: 1550px) {}

@media only screen and (max-width: 960px) {}

@media only screen and (max-width: 768px) {}

@media only screen and (max-width: 1024px) {

    .box1,
    .box2,
    .box3,
    .box4 {
        width: auto;
        height: auto;

    }

    .box5,
    .box6,
    .price-box,
    .faq-box2,
    .faq-box1 {
        width: auto;
        height: auto;

    }
  .reviews-box {
        width: auto;
        height: auto;

    }

    .box1 img,
    .box2 img {
        width: 90%;
    }
}

.form-control
{
	width:100%;
	border:1px solid #CCCCCC;
	padding:8px;
	border-radius:8px;
	margin-bottom:10px;
	font-size:1rem;
}

.hibadoboz
{
	background:red;
	padding:8px;
	color:white;
	margin-bottom:8px;
}

.legordulo_doboz
{
	font-size:1rem;
	color:#555555;
	display:none;
}

.mobile_nav
{
	display:none;
}

.menu_legordulo
{
	position:absolute;
	right:35px;
	background:white;
	border:1px solid #CCCCCC;
	padding:8px;
	z-index:1000;
	margin-top:25px;
	display:none;
}

.mobile_menupont
{
	color:black;
	padding:8px;
	width:100%;
	float:left;
}

.also_linkek
{
	color:white;
	text-decoration:none;
}

.ar_item
{
	display:flex;
	/*justify-content:space-between;*/
	margin-bottom:10px;
}

.ar_item H4
{
	padding:8px;
}

.ar_item .text-sm
{
	width:35%;
}

.hero-text_2
{
	padding-top:60px;
}


.ceg_ar
{
	border:1px solid #CBCBCB;
	display:none;
	border-bottom-left-radius:20px;
	border-top-right-radius:20px;
	border-bottom-right-radius:20px;
}

.iroda_ar
{
	border:1px solid #CBCBCB;
	border-bottom-left-radius:20px;
	border-top-right-radius:20px;
	border-bottom-right-radius:20px;
}


.arvalto_doboz
{
	display:flex;
	/*justify-content:center;*/
	align-items:center;
	/*margin-bottom:15px;*/
}

.arvalto_doboz_belso
{
	/*width:100%;
	background:#f8754d;
	border-radius:35px;*/
	display:flex;
	/*justify-content:center;*/
	align-items:center;
	/*padding:8px;*/
}

.arvalto
{
	/*padding:8px;
	color:white;*/
	text-transform:uppercase;
	text-align:center;
	cursor:pointer;
	padding:8px;
	background:white;
}

.arvalto_aktiv
{
	/*padding:8px;
	color:black;*/
	text-transform:uppercase;
	background:white;
	font-weight:bold;
	border-top:1px solid #CBCBCB;
	border-left:1px solid #CBCBCB;
	border-right:1px solid #CBCBCB;
	position:relative;
	top:2px;
	border-top-left-radius:20px;
	border-top-right-radius:20px;
}

.gyik_cim
{
	display:flex;
	justify-content:space-between;
}

.lepjen_kapcsolatba
{
	margin-left:-138px;
}


@media only screen and (max-width: 450px) {}

@media only screen and (min-width: 801px) 
{
	.hero-alcontent
	{
		display:flex;
		justify-content:space-between;
		padding-bottom:60px;
	}
	
}

@media only screen and (max-width: 800px) 
{
	.lepjen_kapcsolatba
	{
		margin-left:0px;
	}
	
	.slider_velemeny_kulso
	{
		padding:8px !important;
	}
	
	/*
	.arvalto_doboz_belso
	{
		width:100%;
		background:#f8754d;
		border-radius:35px;
		display:flex;
		justify-content:center;
		align-items:center;
		padding:8px;
	}
	*/
	
	.arvalto
	{
		font-size:0.8rem;
	}
	
	.ar_item .text-sm
	{
		width:50%;
	}
	
	.desktop_nav
	{
		display:none;
	}
	
	.mobile_nav
	{
		display:flex;
		justify-content:end;
		font-size:26px;
		padding-right:40px;
	}
	
	.topbar2
	{
		position:fixed;
		width:100%;
		border-bottom:1px solid #CCCCCC;
		background:white;
		z-index:800;
		top:0px;
	}
}