/*
Theme Name: zamora
Theme URI: 
Author: IVAN GUEVARA 
Author URI: guevara.develop@gmail.com
Description:
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: zamora
Tags: zamora
*/

@font-face {
    font-family: 'Social Media Circled Regular';
    font-style: normal;
    font-weight: normal;
    src: local('Social Media Circled Regular'), url('./fonts/Social Media Circled.woff') format('woff');
}


:root{    
    --primary-font: "Open Sans", sans-serif;
    --secondary-font: "Poppins", sans-serif;
    --roboto-font: "Roboto", sans-serif;
    --social-media: 'Social Media Circled Regular';
    --gray-color: #374041;
    --blue-color: #1A206A;
    --secondary-blue:#DBF1F5;
}

body{
    font-family:var(--primary-font);        
    font-size: 18px;
    line-height: 28px;    
    position: relative;
    color:var(--gray-color);
    letter-spacing: 2px;
}

h1{
    font-size: 60px;
    line-height: 65px;
    font-weight: 600;
    letter-spacing: 0%;
    font-family: var(--secondary-font);
}

h2{
    font-size: 40px;
    line-height: 48px;
    font-weight: 600;
    letter-spacing: 0%;
    font-family: var(--secondary-font);
}

h3{
    font-size: 30px;
    line-height: 35px;
    font-weight: 600;
    letter-spacing: 0%;
    font-family: var(--secondary-font);
}

h4{
    font-size:22px;
    line-height: 24px;
    font-weight: 600;
    letter-spacing: 0%;
    font-family: var(--secondary-font);
}

h5{
    font-size: 20px;
    line-height: 27px;
    font-weight: 500;
    letter-spacing: 0%;
    font-family: var(--secondary-font);
}


header{
    position: relative;
    z-index: 99;
    background: var(--gray-color);
}   

header nav {
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center;
    padding:15px 0px;
}

.menu-header{
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

nav ul{
    display: flex;
    list-style-type: none;
    margin: 0;
    padding: 0;
}

footer ul{
    padding: 0px;
    list-style-type: none;
    margin:0px;
}

nav ul li{
    position: relative;        
    text-decoration: none;
}

footer ul li {
    position: relative;    
    margin:15px 0px;
    text-decoration: none;
}

nav ul li a, footer ul li a{    
    text-decoration: none;
    color: white;    
    font-size: 14px;
    transition: all .5s ease;
    font-family: 'Helvetica Neue Light';
    font-weight: 500;
}

nav ul li a{    
    padding:3px 30px;
    font-size:13px;
    line-height: 18px;
    text-transform: uppercase;
}

nav ul li a.active, nav ul li a:hover, footer ul li a.active, footer ul li a:hover{    
    color:white !important;    
}

.uppercase{
    text-transform: uppercase;
}

.menu-header .dropdown .btn{
    background:none;
    color:#A6A9AB;
    display: flex;
    align-items: center;
    font-size:20px;
    font-weight: bold;
    outline: none;
}

.menu-header .dropdown .dropdown-menu{
    width:100%;
    min-width: 100%;
}

.menu-header .dropdown .dropdown-menu div{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size:20px;
}

.social-media-circled{
    font-family: var(--social-media);    
    font-size:30px;
    font-weight: 100;
}

.social a{
    color:var(--orange-color);
    text-decoration: none;
    opacity:1;
    transition: opacity .5s ease;
}

.social a:hover{
    opacity: .8;
}

.card{
    border:5px var(--gray-color) solid;
    border-radius: 20px;
    padding:30px 20px;
}

.card2{
    background:rgba(147,213,224,.20);
    border-radius: 20px;
    padding: 15px;    
}


button{
    height:42px;
    border-radius: 42px;
    padding:5px 15px;
    font-family: var(--primary-font);
    font-size:16px;
    line-height: 16px;
    border:none;
}


input[type='text'], input[type='email']{
    border:1px #37404180 solid;
    border-radius: 10px;
    width:100%;
    margin-bottom:20px;
    height:33px;
    font-family: var(--primary-font);
    font-size:13px;
    line-height: 15px;
    padding:5px 15px;    
}

#home .card{
    margin-bottom: -40px !important;
}


@media all and (max-width: 1023px){
    body{        
        font-size: 16px;
        line-height: 20px;            
    }
    h1{
        font-size:40px;
        line-height: 45px;
    }

    h2{
        font-size:32px;
        line-height: 38px;
    }

    h2{
        font-size:28px;
        line-height: 32px;
    }

    h5{
        font-size:16px;
        line-height: 20px;
    }

    #home .card{
        margin-bottom: 30px !important;
    }

}