.head_top
{
    width: 100%;
    height: 150px;
    /* border:2px solid red; */
    >.row
    {
        >div
        {
            padding:0 6%;
            width: 100%;
            
            /* border:2px solid blue; */
            &:first-of-type
            {
                height:50px;
                background-color:black;
                >nav
                {
                    width: 50%;
                    height: 100%;
                    /* border:1px solid red; */
                    >ul
                    {
                        width: 100%;
                        height: 100%;
                        display: flex; 
                    }
                    &:first-of-type
                    {
                        /* left */
                        >ul
                        {
                            justify-content: flex-start;
                            >li
                            {
                                width: 50px;
                                height: 100%;
                                /* border:2px solid white; */
                                padding:5px;
                                >a
                                {
                                    color:white;
                                    
                                }
                            }
                        }
            
                    }   
                    &:last-of-type
                    {
                    /* right */
                    >ul
                    {
                        justify-content: flex-end;
                        >li
                        {
                            height: 100%;
                            /* border:1px solid blanchedalmond; */
                            padding:0px 10px;

                            >a
                            {
                                color:white;
                                display: flex;
                                height:100%;
                                /* background-color:darkkhaki; */
                                align-items: center;
                            }
                        }
                    }
                    } 
                }
            }
            &:last-of-type
            {
                height:100px;
                background-color:#ffb600;
                >*
                {
                    /* border:2px solid white; */
                    height: 100%;
                }
                >figure
                {
                    width: 30%;
                    display: flex;
                    align-items: center;
                    >img
                    {
                        height: 50%;
                    }
                }
                >nav
                {
                    width: 70%;
                    >ul
                    {
                        width: 100%;
                        height: 100%;
                        display: flex;
                        flex-direction: row-reverse;
                        >li
                        {
                            height: 100%;
                            /* border:1px solid red; */
                            display: flex;
                            align-items: center;  
                            >a
                            {
                                font-size: 18px;
                                text-transform: capitalize;
                                /* background-color: yellow; */
                                padding:10px 15px;
                                transition:0.4s;  
                                &:hover
                                {
                                    color: white;
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}
/* end header */
.header_bottom
{
    width: 100%;
    height: 100vh;
    background-image:url(../img/banner-01.jpg);
    background-size:cover;
    position: relative;
    >*
    {
        color:white;
        
    }
&:before
{
    content:'';
    width: 100%;
    height: 100%;
    background-color:rgba(0, 0, 0, 0.456);
    position:absolute;
    top:0;
    left:0;
}
    >.row
    {
        position: relative;
        z-index:4;
        width: 50%;
        padding:3%;
        >h3
        {
            font-size: 22px;
        }
        >h1
        {
            font-size: 60px;
            margin:20px 0 50px 0;
            position: relative;
            &:hover
            {
                &:after
                {
                    width: 100%;
                }
            }
            &:after
            {
                content:'';
                width: 50px;
                height: 5px;
                background-color:#ffb600;
                position:absolute;
                left:0;
                bottom:-20px;
                transition:0.4s;
                
            }
        }
        >p
        {
            font-size: 22px;
        }
    }
}
/* end */
.services
{
    >.row
    {
        width: 100%;
        padding:0 6%;
        /* background-color:red; */
        justify-content: space-between;
        margin-top:-50px;    
        >.card
        {
            position: relative;
            z-index:2; 
            width: 33%;
            padding:10px;
            background-color:white;
            >*
            {
                width: 100%;
            }
            >figure
            {
                >img
                {
                    width:100%;
                    
                }
            }
            >div
            {
                text-align:center;
                padding-top:15px;
                >p
                {
                    color:rgba(0, 0, 0, 0.485);
                    margin-top:10px;
                    
                }
            }
            >.row
            {
                justify-content: center;
                padding:5px;
                >a
                {
                    width: 100px;
                    height:30px;
                    background-color:#ffb600;
                    border-radius:20px;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    margin-top:30px;   
                }
            }
        }
    }
}
/* end */
.section
{
    .exprience
{
    width: 100%;
    padding:6%;
    >.row
    {
        &:last-of-type
        {
            margin-top: 70px;
            >figure
            {
                justify-content: start;
            }
        }
        width: 100%;
        >*
        {
            width: 50%;
            
        }
        >div
        {
            padding-top: 50px;

            >h3
            {
                font-size:22px;
            }
            >h2
            {
                font-size:50px;
                margin:40px 0 80px 0;
                position: relative;
                &::after
                {
                    content:'';
                    display: flex;
                    width: 100px;
                    height: 5px;
                    background-color: #ffb600;
                    position:absolute;
                    bottom: -35px;
                    left: 0;
                }
            }
            >ul
            {
                >li
                {
                    display: flex;
                    line-height:50px;
                    font-size: 20px;
                    color: rgb(63, 62, 62);
                    >i
                    {
                        width: 40px;
                        height: 40px;
                        color:#ffb600;
                        margin-right:20px;
                    }
                }
            }
        }
        >figure
        {
            display: flex;
            justify-content:end;
            >img{
                width: 90%;
            }
        }
    }
}
}
/* end */
.footer{
    width: 100%;
    >.row
    {
        width: 100%;
        min-height:100px;
        /* border:1px solid black; */
        padding:2% 0;
        &:nth-of-type(1)
        {
            background-color:#FFB600;
   
            >figure
            {
                width: 30%;
                >img
                {
                    width: 70%;
                }
           
               
            }
            >.row
            {
                width: 70%;
                justify-content: end;
                gap:20px;
                align-items: center;
                >a
                {
                    display: flex;
                    width: 250px;
                    height: 50px;
                    border-radius:50px;
                    justify-content: center;
                    align-items: center;
                    text-transform: capitalize;
                
                    &:first-of-type
                    {
                        background-color: black;
                        color:white;
                    }
                    &:last-of-type
                    {
                        background-color:white;
                        color:black;
                    }

                }
                
            }
        }
        &:nth-of-type(2)
        {
            border-color: white;

            >ul
            {
                width: 20%;
                /* border:1px solid black; */
                >li
                {
                    line-height:50px;
                    >a
                    {
                        color:rgb(60,60,60);
                        text-transform: capitalize;
                    }
                }
            }
        }
        &:nth-of-type(3)
        {
            width: 100%;
            height: 100%;
            position: relative;
            display: flex;
            justify-content: flex-start;
            align-items: center;
            padding:0 20px;
            
            >img
                {
                    position: fixed;
                    bottom: 0;
                    right:20px;
                    width:200px;
                    height:200px;
                    border-radius:50%;
                    object-fit:cover;      
                    z-index:10;  
                }
            >p
                {
                    position:absolute;
                    left:20px;
                    bottom:20px;
                    display:inline;
                    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
                    font-size: 20px;
                }
            }
        
        }
    }