body {
background:none;
font-family: 'Open Sans', sans-serif;
}

html {
  background-color:#FFFFFF;
}

  .wrap {
max-width:1200px;

margin-left: auto;
margin-right: auto;
opacity:1;
}

  .wrap_big {
max-width:1500px;

margin-left: auto;
margin-right: auto;
opacity:1;
}
.btn-main {
padding-top:8px;
padding-bottom:8px;
padding-left:10px;
padding-right:10px;
color:#fff;
border:2px solid #fff;
border-radius:5px;
font-size:12px;
text-align:center;
font-weight:bold;
font-family: 'Open Sans', sans-serif;
}

</style>

<style type="text/css">
input::-moz-placeholder {
  color: green;
}
.form_top {

   -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border-radius:3px 3px 0px 0px;
    box-shadow:0px;
    border:0px;
    height: 50px; // Increase height as required
    margin-bottom: 30px;
    padding: 0 20px; // Now only left & right padding
}
.form_middle {
   -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border-radius:0px;
    box-shadow:0px;
    border:0px;
    height: 50px; // Increase height as required
    margin-bottom: 30px;
    padding: 0 20px; // Now only left & right padding
}
.form_bottom {
   -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border-radius:0px 0px 3px 3px;
    box-shadow:0px;
    border:0px;
    height: 50px; // Increase height as required
    margin-bottom: 30px;
    padding: 0 20px; // Now only left & right padding
}

 div.c12 {padding: 0px; padding-top: 125px}
 div.c11 {padding:80px;padding-top:0px;padding-right:0px;}
 form.c10 {text-align:right;}
 .c9 {background:#00adee;padding:15px;color:#fff;text-align:center;}
 h2.c8 {color:#fff;font-weight:bold;font-size:19px;letter-spacing: 1px;font-family: 'Open Sans', sans-serif;}
 p.c7 {color:#fff;line-height: 250%;color:#a5b4c4;font-size:15px;font-family: 'Open Sans', sans-serif;}
 h2.c6 {color:#fff;font-weight:bold;font-size:20px;letter-spacing: 1px;font-family: 'Open Sans', sans-serif;text-align:center;}
 div.c5 {padding: 0px; padding-top: 50px}
 p.c4 {text-align:right;}
 div.c3 {padding:0px;}
 p.c2 {text-align:left;}
 img.c1 {width:150px;height:auto;}
 
 .sweeb_b {
 background: rgb(54, 25, 25);
 background: rgba(255, 255, 255, .1);
 border-radius:3px;
 color:#fff;
 padding-top:5px;

 overflow:hidden;
 margin-bottom:10px;
 margin-top:50px;
 }
 
 .sweeb_bottom {
 padding:10px;
 padding-top:8px;
 width:100%;
 height:40px;
 overflow:hidden;
 border-top:1px solid rgba(255, 255, 255, .1);
 background: rgb(54, 25, 25);
 background: rgba(0, 173, 238, .1);
 }
 
 .img_border {
 border:1px solid rgba(255, 255, 255, .2);
 border-radius:3px;
 }
 
 .sweeb_bottom:hover {
 background: rgba(0, 173, 238, .5);
 }
 
 .sweeb_a {
 color:#fff;
 text-align:center;
 font-size:16px;
 }
 .sweeb_a:hover{
 color:#fff;
 text-decoration:none;
 }
 
 .avatar {
display:block;
border-radius:100%;
margin-top:10px;
margin-left:0px;
margin-right:10px;
height:45px;
width:45px;
}

#columns {
	-webkit-column-count: 3;
	-webkit-column-gap: 10px;
	-webkit-column-fill: auto;
	-moz-column-count: 3;
	-moz-column-gap: 10px;
	
	column-count: 3;
	column-gap: 15px;
	column-fill: auto;

}

.pin {  
        width:350px;
        border-radius:3px;
	display: inline-block;
	background: #FEFEFE;
	border: 2px solid #FAFAFA;
	box-shadow: 0 1px 2px rgba(34, 25, 25, 0.4);
	margin: 0 2px 15px;
	-webkit-column-break-inside: avoid;
	-moz-column-break-inside: avoid;
	column-break-inside: avoid;
	padding: 0px;
	padding-bottom: 0px;
	background: -webkit-linear-gradient(45deg, #FFF, #F9F9F9);
	opacity: 1;
	
	-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-o-transition: all .2s ease;
	transition: all .2s ease;
}

.pin img {
	width: 100%;
	border-bottom: 1px solid #ccc;
	padding-bottom: 0px;
	margin-bottom: 5px;
}

.pin p {
	
	color: #333;
	margin: 0;

}

.box {
font-family: 'Open Sans', sans-serif;

display: inline-block;
background: #fff;
border: 1px solid #eee;
margin: 0 2px 15px;
padding: 10px;
padding-bottom: 5px;
opacity: 1;
	
	-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-o-transition: all .2s ease;
	transition: all .2s ease;
}


.logo {
display: block;
width: auto;
max-width: 100%;
margin-top:-10px;
margin-left:-10px;
background: #fff;

}

.nav-marg {
margin-left:5%;
margin-right:5%;
}
/* Background Color for Page */
body {
    background-color: #3b596d !important;
}

/* Outer Wrapper to Center Card */
.sweeba-register-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 50px 20px;
    min-height: calc(100vh - 200px);
}

/* White Box Card */
.sweeba-card {
    background: #ffffff;
    width: 100%;
    max-width: 460px;
    padding: 35px 40px;
    border-radius: 2px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

/* Heading & Text */
.sweeba-card h2 {
    color: #0284c7;
    font-size: 26px;
    font-weight: 500;
    margin-bottom: 6px;
}

.sweeba-card p {
    color: #475569;
    font-size: 14px;
    margin-bottom: 22px;
}

.sweeba-card p a {
    color: #0284c7;
    text-decoration: none;
}

/* Custom Input Fields */
.sweeba-input {
    width: 100%;
    padding: 10px 14px;
    border: 1px solid #38bdf8 !important;
    border-radius: 3px;
    font-size: 14px;
    color: #333;
    outline: none;
    margin-bottom: 16px;
}

.sweeba-input::placeholder {
    color: #94a3b8;
}

/* Checkbox Section */
.sweeba-checkbox {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 20px;
    font-size: 13px;
    color: #475569;
}

.sweeba-checkbox a {
    color: #0284c7;
    text-decoration: none;
}

/* Button */
.sweeba-btn {
    width: 100%;
    background-color: #56b4f8;
    color: white;
    border: none;
    padding: 11px;
    font-size: 15px;
    border-radius: 3px;
    cursor: pointer;
    transition: background-color 0.2s;
}

.sweeba-btn:hover {
    background-color: #38bdf8;
}

/* Login Outline Button */
.sweeba-btn-outline {
    width: 100%;
    background-color: transparent;
    color: #38bdf8;
    border: 1px solid #38bdf8;
    padding: 10px;
    font-size: 15px;
    border-radius: 3px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.sweeba-btn-outline:hover {
    background-color: #38bdf8;
    color: #ffffff;
}

/* Secondary Action Buttons (Forgot Password & Re-verify) */
.login-actions {
    display: flex;
    gap: 10px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #f1f5f9;
}

.btn-secondary-blue {
    flex: 1;
    background-color: #56b4f8;
    color: white;
    text-align: center;
    padding: 9px 12px;
    font-size: 13px;
    border-radius: 3px;
    text-decoration: none;
    display: inline-block;
    transition: background-color 0.2s;
}

.btn-secondary-blue:hover {
    background-color: #38bdf8;
    color: white;
}