@font-face {
    font-family: 'HeeboBold';
    src: url('files/Heebo-Bold.eot');
    src: url('files/Heebo-Bold.eot?#iefix') format('embedded-opentype'),
        url('files/Heebo-Bold.woff2') format('woff2'),
        url('files/Heebo-Bold.woff') format('woff'),
        url('files/Heebo-Bold.ttf') format('truetype'),
        url('files/Heebo-Bold.svg#Heebo-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'HeeboLight';
    src: url('files/Heebo-Light.eot');
    src: url('files/Heebo-Light.eot?#iefix') format('embedded-opentype'),
        url('files/Heebo-Light.woff2') format('woff2'),
        url('files/Heebo-Light.woff') format('woff'),
        url('files/Heebo-Light.ttf') format('truetype'),
        url('files/Heebo-Light.svg#Heebo-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'HeeboRegular';
    src: url('files/Heebo-Regular.eot');
    src: url('files/Heebo-Regular.eot?#iefix') format('embedded-opentype'),
        url('files/Heebo-Regular.woff2') format('woff2'),
        url('files/Heebo-Regular.woff') format('woff'),
        url('files/Heebo-Regular.ttf') format('truetype'),
        url('files/Heebo-Regular.svg#Heebo-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'HeeboBlack';
    src: url('files/Heebo-Black.eot');
    src: url('files/Heebo-Black.eot?#iefix') format('embedded-opentype'),
        url('files/Heebo-Black.woff2') format('woff2'),
        url('files/Heebo-Black.woff') format('woff'),
        url('files/Heebo-Black.ttf') format('truetype'),
        url('files/Heebo-Black.svg#Heebo-Black') format('svg');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

body{
	margin:0px;
	padding:0px;
	direction:rtl;
	font-family:HeeboRegular;
	background-color:#FFF;
	font-size:18px;
}

::placeholder{
    font-family:HeeboBold;
    font-size:1.3rem;
    color:#161E27;
}

.compOnly{
    display:inline;
}

.mobileOnly{
    display:none;
}

*{
    box-sizing: border-box;
}

ul{margin-top:5px}

p{margin:0px}

.r100{
    float:right;
    width:100%;
}

.fr{
    float:right;
}

.mt20{
    margin-top:20px;
}

.mt10{
    margin-top:5px
}

.topSection{
    float:right;
    width:100%;
    height:64px
}

.logo{
    float:right;
    width:100%;
    height:300px;
    text-align:center
}

.logo1{
    float:right;
    width:100%;
    height:200px;
    text-align:center
}

.logo img{
    width:200px;
}

.logo1 img{
    width:150px;
}

.data{
    float:right;
    width:100%;
    color:black;
    text-align:center;
}

.data .inside{
    margin:0px auto;
    width:1089px
}

.searchArea{
    float:right;
    width:100%;
    margin-top:50px;
    height:140px
}

.searchArea .in1{
    margin:0px auto;
    width:1200px;
    height:100%;
    background-image:url('../cut/morla1.svg');
    background-position:90% 80%;
    background-repeat:no-repeat
}

.searchArea .in2{
    margin:0px auto;
    width:685px;
    height:68px;
    box-shadow: 0px 0px 50px #0000001A;
    border: 1px solid #B5B5B5;
    border-radius: 34px;
}

.searchArea .add{
    float:right;
    width:8%;
    text-align:center;
    padding-top:20px
}

.searchArea .inputArea{
    float:right;
    width:76%;
    height:100%
}

.searchArea input{
    border:0px;
    width:100%;
    height:60px;
    font-size:1.3rem;
    margin-top:5px;
    outline:none
}

.searchArea .submit{
    float:left;
    width:8%;
    text-align:center;
    padding-top:10px
}

.oneArea{
    float:right;
    width:100%;
    margin-top:50px
}

.oneArea .inside{
    margin:0px auto;
    width:1600px
}

.oneArea .subjectTitle{
    float:right;
    width:100%;
    font-family:HeeboBold;
    font-size:1.66rem;
    margin-bottom:20px;
    margin-top:20px;
    color:#161E27
}

.overOneBox{
    float:right;
    width:390px;
    height:390px;
    margin-left:13.3px;
    margin-bottom:20px;
    display:none;
}

.oneBox{
    position: relative;
    width:100%;
    height:100%;
    background-image:url('cut/pacman.png');
    background-position:center center;
    background-size:cover;
    background-repeat:no-repeat;

    cursor:pointer;
}

.overOneBox:nth-child(4n+1){
    margin-left:0px;
}

/* dark overlay */
.oneBox::before{
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0);
    transition: background 0.4s ease;
}

/* text */
.boxText{
    position: absolute;
    bottom: 20px;
    width: 100%;
    text-align: center;
    color: white;
    font-family: HeeboBold;
    font-size: 1.33rem;
    transition: all 0.4s ease;
    z-index: 2;
}

/* hover effects */
.oneBox:hover::before{
    background: rgba(0,0,0,0.55);
}

.oneBox:hover .boxText{
    top: 50%;
    left: 50%;
    width: auto;

    transform: translate(-50%, -50%);
    font-size: 1.8rem;
}

.teachTitle{
    float:right;
    width:100%;
    font-family:HeeboBold;
    font-size:1.66rem;
    color:#161E27;
    text-align:center;
}

.teachInside{
    margin:0px auto;
    width:220px
}

.teachMethods{
    float:right;
    width:100%;
    margin-top:20px;
    margin-bottom:40px
}

.oneMethod{
    float:right;
    width:60px;
    height:80px;
    margin-left:20px
}

.oneMethod:nth-child(3){
    margin-left:0px;
}

.oneMethod .redRect{
    float:right;
    width:60px;
    height:60px;
    background: transparent linear-gradient(180deg, #F20B0B 0%, #C00909 31%, #810606 100%) 0% 0% no-repeat padding-box;
    border-radius: 10px;
}

.insideRect{
    float:right;
    width:100%;
    height:100%;
    background-size:80%;
    background-position:center center;
    background-repeat:no-repeat;
}

.footer{
    float:right;
    width:100%;
    height:450px;
    background: #161E27 0% 0% no-repeat padding-box;
    border: 1px solid #707070;
    padding:50px;
    color:white;
    margin-top:50px
}

.footer .inner{
    margin:0px auto;
    width:1600px
}

.footer .inner .oneSection{
    float:right;
    width:25%;
    height:100%
}

.footer .inner .oneSection .title{
    float:right;
    width:100%;
    font-family:HeeboBold;
    margin-bottom:10px;
    color:#F7D6E5
}

.footer .inner .oneSection .item{
    float:right;
    width:100%;
    margin-bottom:10px
}

.oneTag{
    float:right;
    width:auto;
    height:28px;
    margin-left:10px;
    background: #F7D6E5 0% 0% no-repeat padding-box;
    border: 1px solid #D4347C;
    border-radius: 5px;
    color:#D4347C;
    padding-left:5px;
    padding-right:5px;
    margin-bottom:10px;
    padding-top:0px
}

.inner1{
    margin:0px auto;
    width:1600px
}

.inner1 .right{
    float:right;
    width:60%
}

.inner1 .left{
    float:left;
    width:25%
}

.bcLink{
    float:right;
    margin-left:10px;
    font-size:0.9rem;
    color:#161E27
}

.bcData{
    float:right;
    margin-left:10px;
    font-size:0.9rem;
    color:#C20909
}

.bcSeperator{
    float:right;
    margin-left:10px;
    margin-top:-2px;
}

.menu{
    float:right;
    margin-top:15px;
}

.innerTitle{
    float:right;
    width:100%;
    font-family:HeeboRegular;
    font-size:3.6rem;
    color:#161E27
}

.innerSubTitle{
    float:right;
    width:100%;
    margin-bottom:5px;
    font-size:1.66rem
}

.lineSeperator{
    float:right;
    width:100%;
    height:1px;
    background-color:#DEDEDE;
    margin-bottom:5px
}

.oneIcon{
    float:right;
    margin-left:10px
}

.oneText{
    float:right;
    font-size:1.4rem
}

.innerSection{
    float:right;
    width:100%;
    margin-top:20px
}

.oneSection .secImage{
    width:100%;
}

.courseDetails{
    float:right;
    width:100%;
    margin-top:10px;
    font-size:1.1rem
}

.listen{
    float:right;
    font-size:1.3rem;
    color:#C20909;
    margin-top:10px
}

.smallTitle{
    float:right;
    width:100%;
    font-size:1.66rem;
    margin-top:10px;
}

.teachers{
    float:right;
    width:80%;
    margin-top:20px;
    font-size:1.1rem
}

.teachers .oneTeacher{
    float:right;
    margin-left:20px
}

.teachers .oneTeacher .oneIcon{
    float:right;
    margin-left:5px
}

.title2{
    float:right;
    width:100%;
    font-size:1.66rem;
    font-family:HeeboBold;
    color:#000;
    margin-bottom:20px
}

.oneExtraCourse{
    float:right;
    width:100%;
    margin-bottom:50px
}

img.fullImage{
    width:100%;
}

.red-bullets li::marker {
    color: #BE090B;
}

.inner2{
    margin:0px auto;
    width:858px;
}

.fSubjects{
    float:right;
    width:100%;
}

.contactImage{
    float:right;
    width:50%;
    text-align: right;
    margin-bottom:20px;
    border-left:1px solid #707070
}

.contactPeople{
    float:right;
    width:50%;
    padding-right:50px
}

.subMenuItem{
	float:right;
	width:100%;
	height:40px;
	color:#737374;
	cursor:pointer
}

.subMenuItem:hover{
	color:#000000;
}

@media only screen and (max-width: 1600px) {
    .footer .inner{
        width:1200px
    }

    .oneArea .inside{
        width:1200px
    }

    .inner1{
        width:1200px
    }

    .overOneBox{
        width:290px;
        height:290px;
    }
}

@media only screen and (max-width: 1280px) {
    .footer .inner{
        width:960px
    }

    .oneArea .inside{
        width:960px
    }

    .inner1{
        width:960px
    }

    .overOneBox{
        width:230px;
        height:230px;
    }

    .data .inside{
        width:960px
    }

    .searchArea .in1{
        width:960px;
   }
}

@media only screen and (max-width: 1024px) {
    .footer .inner{
        width:95%
    }

    .oneArea .inside{
        width:95%
    }

    .inner1{
        width:95%
    }

    .overOneBox{
        width:49%;
        height:200px;
        margin-left:1%;
    }

    .data .inside{
        width:95%
    }

    .searchArea .in1{
        width:95%;
        background-image:none;
   }

   .footer{
        height:auto;
    }

   .footer .inner .oneSection{
        width:90%;
        margin-right:5%;
    }

   .compOnly{
    display:none;
    }

    .mobileOnly{
        display:inline;
    }
}

@media only screen and (max-width: 1024px) {
    .searchArea .in2{
        width:90%;
    }

    .oneArea .subjectTitle{
        font-size:1.66rem;
    }

    .fSubjects{
        display:none;
    }

    .footer .inner .oneSection .title{
        border-bottom:1px solid #707070;
        height:40px;
    }

    .noBorder{
        border: 0px !important;;
    }

    .searchArea .submit{
        width:16%;
        padding-left:10px;
    }

    .inner1 .right{
        width:100%
    }

    .inner1 .left{
        width:100%
    }

    .inner2{
        width:90%;
    }

    .contactImage{
        width:100%;
        text-align: center;
        margin-bottom:20px;
        border-left:0;
    }

    .contactPeople{
        width:100%;
        padding-right:0px
    }
}