/*-------------------------
        HEADER
--------------------------*/

header{
	min-height:60px;
	padding:5px 10px;
	align-items:center;
}

header > div{
	width:100%;
	padding-top:0px;
	align-items:center;
}

header > div img{
	width:40px;
	height:auto;
}

header > div h5{
	font:500 22px poppins_semibold;
	padding:2px 0px 0px 10px;
	line-height:16px;
	text-align:center;
}

header > div h5 > p{
	font:400 14px notosans;
	text-align:center;
}

header > div figure{
position:relative;
top:5px;
}


/*-------------------------
      DESKTOP MENU
--------------------------*/

nav#menu{
	display:none;
}


/*-------------------------
      ACTION BUTTON
--------------------------*/

div#action_div{
	display:none;
}


/*-------------------------
    MOBILE MENU ICON
--------------------------*/

div#mobile_menu_icon{
	position:absolute;
	right:15px;
	top:50%;
	transform:translateY(-50%);
	width:42px;
	height:42px;
	display:flex;
	justify-content:center;
	align-items:center;
	border-radius:8px;
	background:rgb(232,178,71);
	cursor:pointer;
}

div#mobile_menu_icon svg{
	width:22px;
	height:22px;
	color:black;
}

/*-------------------------
      MOBILE MENU
--------------------------*/

nav#mobile_menu{
	position:fixed;
	top:0px;
	right:-100%;
	width:240px;
	height:100vh;
	background:white;
	display:flex;
	flex-direction:column;
	padding-top:65px;
	box-shadow:-5px 0px 25px rgba(0,0,0,.15);
	transition:.35s;
	z-index:9999;
}

nav#mobile_menu.active{
	right:0px;
}

nav#mobile_menu a{
	display:flex;
	align-items:center;
	gap:12px;

	padding:18px 20px;

	text-decoration:none;

	font:14px notosans;

	color:#222;

	border-bottom:1px solid rgb(240,240,240);
	transition:.2s;
}

nav#mobile_menu a svg{
	width:18px;
	height:18px;
}

nav#mobile_menu a:hover{
	color:rgb(232,178,71);
	background:rgb(248,248,248);
}

div#action_div p{
display:none;
padding:auto;
align-item:center;
justify-content:center;
width:100%;
text-align:center;
margin-top:30px;
}
/*==========================================
    DESIGNER CHECKER INTRO
==========================================*/

div#designer_checker_intro{
    width:100%;
    text-align:center;
    margin:40px 0 35px;
}

div#designer_checker_intro h1{
    font-family:Playfair;
    font-size:2.5rem;
    color:#1c2b4a;
    letter-spacing:.5px;
    margin-bottom:12px;
}

div#designer_checker_intro p{
    width:100%;
    max-width:800px;
    margin:auto;
    font-family:roboto_regular;
    font-size:0.8rem;
    line-height:1.8;
    color:#666;
}

div#search_page_wrapper{
max-width:99%;
}

div#designer_search_div em{
display:block;
font:normal 12px notosans;
color:rgb(100,100,100);
margin:15px 0px 0px 0px;
}

form#check_student_dtls div#form_row{
display:flex;
flex-wrap:wrap;
flex-direction:column;
gap:10px;
}

form#check_student_dtls label{
display:block;
font:16px poppins_semibold;
}

div#input_div{
width:100%;
}

div#submit_div{
width:100%;
height:55px;
}

div#submit_div > input[type='submit']{
width:100%;
background:transparent;
}

div#designer_card_wrapper{
width:100%;
}


div#display_designer_info{
margin:50px 0px 0px 0px;
background:rgb(255,255,255);
box-sizing:border-box;
border-radius:5px;
width:100%;
max-width:98%;
margin:auto;
}

div#thumb_details_div{
display:flex;
flex-wrap:wrap;
flex-direction:column;
gap:20px;
margin:20px 0px 0px 0px;
}

div#thumb_details_div > div{
/*border:1px solid red;*/
}

div#thumb_wrap{
display:flex;
flex-direction:column;
gap:30px;
border-right:0px;
border-bottom:1px solid rgb(200,200,200);
padding-right:10px;
}

div#thumb_div{
position:relative;
/*border:1px solid red;*/
}

div#thumb_div > div{
position:relative;
height:210px;
width:200px;
margin:auto;
border-radius:50%;
/*border:1px solid blue;*/
}

div#thumb_div > div:after{
content:'';
top:50%;
left:50%;
transform:translate(-50%,-50%);
height:220px;
width:210px;
position:absolute;
z-index:1;
display:block;
border:2px solid rgb(232, 178, 71);
border-radius:50%;
}

div#thumb_div div figure{
position:relative;
height:210px;
width:200px;
border-radius:50%;
overflow:hidden;
}

div#thumb_div figure img{
width:100%;
height:100%;
object-fit:cover;
}

div#details_div{
/*border:1px solid red;*/
}

div#details_div > h5{
font:28px poppins_semibold;
margin:0px 0px 20px 0px;
}

div#details_div > div{
display:flex;
gap:10px;
margin:0px 0px 20px 0px;
}

div#details_div > div > span{
display:block;
height:20px;
width:20px;
border-right:1px solid rgb(200,200,200);
font:bold 12px notosans;
padding-right:5px;
}

div#details_div > div > span svg{
display:block;
width:20px;
height:20px;
margin-top:2px;
color:#E8B247;
}

div#model_card_wrapper{
box-shadow:0 15px 40px rgba(0, 0, 0, 0.08);
border:1px solid rgb(240,240,240);
min-height:200px;
border-radius:15px;
box-sizing:border-box;
padding:20px;
}

div.d_details p:first-of-type{
font:bold 14px notosans;
color:#292151;
}

div.d_details p:last-of-type{
font:14px notosans;
color:rgb(100,100,100);
}

div#thumb_slot_info{
padding:5px;
width:100%;
}

div#thumb_slot_info > div{
/*border:1px solid red;*/
width:100%;
margin:auto;
}

div#thumb_slot_info > div > h5{
font:12px notosans;
text-align:center;
color:rgb(100,100,100);
}

div#thumb_slot_info > div > p{
width:80px;
height:70px;
}

div#thumb_slot_info > div span{
display:block;
height:1px;
width:80%;
margin:auto auto 10px auto;
background:rgb(240,240,240);
}

div#thumb_slot_info > div h6{
margin:10px auto 10px auto;
background:rgb(239, 203, 132);
border:2px solid rgb(232, 178, 71);
height:30px;
width:100px;
border-radius:10px;
text-align:center;
font:14px poppins_semibold;
box-sizing:border-box;
padding:3px 0px 0px 0px;
}

div#display_models_header{
position:relative;
display:flex;
flex-wrap:wrap;
}

div#display_models_header > div{
width:100%;
}

div#display_models_header > div h5{
font:14px poppins_semibold;
}

div#display_models_header_2 p{
position:relative;
top:auto;
right:auto;
width:100%;
display:flex;
gap:5px;
}

div#display_models_header_2 p span{
display:block;
height:25px;
width:25px;
border-radius:50%;
background:white;
text-align:center;
align-items:center;
margin:-2px 0px 0px 0px;
}

div#display_models_header_2 p span svg{
color:rgb(0, 38, 91);
height:20px;
width:20px;
margin:2px auto auto auto;
}

div#display_models_wrapper{
position:relative;
margin:30px 0px 0px 0px;
}

div#designer_model_pair{
position:relative;
border:1px solid rgb(200,200,200);
border-radius:5px;
min-height:150px;
}

div#designer_model_pair > div#model_name_data{
display:flex;
justify-content:center;
gap:20px;
padding:80px 0px 0px 10px;
}

div.assign_model_count{
    position:absolute;
    top:0;
    left:50px;
    width:90px;
    height:50px;
    background:rgb(0, 38, 91);
    color:#fff;
    z-index:2;
	font:16px poppins_semibold;

}

div.assign_model_count:after{
    border-left:47px solid transparent;
    border-right:47px solid transparent;
    border-top:25px solid rgb(0, 38, 91);
}

div#model_info_wrap{
display:flex;
flex-direction:row;
flex-wrap:wrap;
justify-content:flex-start;
padding:0px 0px 0px 10px;
}

div#model_info_wrap figure{
width:100%;
/*border:1px solid red;*/
}

div#model_info_wrap figure img{
width:20%;
height:80%;
margin:auto;
}

div#model_info_wrap > div:not(div#model_info_wrap > div:first-of-type){
width:100%;
}

div#designer_model_pair > div > div{
border-right:0px;
border-bottom:1px solid rgb(200,200,200);
padding:10px;
margin:0px 5px 5px 5px;
display:flex;
flex-direction:column;
justify-content:center;
gap:10px;
text-align:center;
}

div#designer_model_pair > div > div h5{
font:600 14px notosans;
text-align:center;
}

div#designer_model_pair > div > div p{
font:14px notosans;
text-align:center;
}

div#designer_model_pair > div > div:last-of-type{
border:0px;
padding-left:10px;
}

div#designer_model_pair > div > p{
font:22px poppins_semibold;
text-align:center;
}

div#model_sex span svg{
color:#ED4D88;
}

div#model_size span svg{
color:#437ED1;
}

div#model_phone span svg{
color:#4CB37F;
}

div#model_note{
padding:10px;
border:2px dashed rgb(200,200,200);
margin:10px;
}

div#model_note p{
text-align:center;
color:rgb(100,100,100);
font:14px notosans;
}

div#checker_bg{
width:100px;
margin:auto;
position:fixed;
left:50%;
top:50%;
transform:translate(-50%,-50%);
/*border:1px solid red;*/
display:none;
}

div#checker_bg img{
display:block;
margin:auto;
}

/*==========================================
    BACK HOME
==========================================*/
div.back_home_wrapper{

    width:100%;

    text-align:center;

    margin:20px 0px 50px 0px;

}

a.back_home{
    margin:5px auto 0 auto;
	width:80%;
}

/*==========================================
    DESIGNER NOT FOUND
==========================================*/

div.not_found{
    width:85%;
    margin:30px auto auto auto;
    padding:30px 20px;
    border-radius:12px;
}

div.not_found svg{
    width:45px;
    height:45px;
    margin:0 auto 15px;

}

div.not_found h3{
    font:22px Playfair;
    margin:0 0 15px;
}

div.not_found p{
    width:100%;
    font:14px/1.7 notosans;
}

/*==========================
      FOOTER (320px)
==========================*/

#footer{
    width:100%;
    background:#111827;
    color:#fff;
    padding:40px 0 0;
}

.footer_container{
    width:90%;
    margin:auto;

    display:flex;
    flex-direction:column;
    gap:35px;
}

.footer_section{
    width:100%;
}

.footer_section h2{
    font-size:1.6rem;
    margin-bottom:15px;
}

.footer_section h3{
    font-size:1.2rem;
    margin-bottom:15px;
}

.footer_section p{
    font-size:.9rem;
    line-height:1.7;
    margin-bottom:20px;
}

/*==========================
      QUICK LINKS
==========================*/

.footer_section ul{
    list-style:none;
    padding:0;
    margin:0;
}

.footer_section ul li{
    margin-bottom:12px;
}

.footer_section ul li a{
    text-decoration:none;
    color:#c8c8c8;
    font-size:.95rem;
}

.footer_section ul li a:hover{
    color:#c89b2b;
    padding-left:5px;
}

/*==========================
        SOCIALS
==========================*/

.footer_socials{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
}

.footer_socials a{
    width:42px;
    height:42px;

    display:flex;
    justify-content:center;
    align-items:center;

    border-radius:50%;
    background:#1f2937;
    color:#fff;
}

.footer_socials svg{
    width:18px;
    height:18px;
}

/*==========================
      WHATSAPP BUTTON
==========================*/

.whatsapp_btn{
    width:100%;

    display:flex;
    justify-content:center;
    align-items:center;
    gap:10px;

    padding:14px;

    text-decoration:none;

    background:#25D366;
    color:#fff;

    border-radius:8px;

    font-size:.95rem;
    font-weight:600;

    box-sizing:border-box;
}

.whatsapp_btn svg{
    width:20px;
    height:20px;
}

/*==========================
      FOOTER BOTTOM
==========================*/

.footer_bottom{
    margin-top:40px;
    padding:20px 5%;

    display:flex;
    flex-direction:column;
    gap:10px;
    align-items:center;
    justify-content:center;

    text-align:center;

    border-top:1px solid rgba(255,255,255,.08);
}

.footer_bottom p{
    font-size:.85rem;
    color:#bdbdbd;
    line-height:1.6;
}

.footer_bottom strong{
    color:#c89b2b;
    font-weight:600;
}