:root {
  --bg-color: #F5F5F5;
  --lgreen: rgba(2,204,168,1.0);
}

/*RESET*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote,  pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

html { 
    height: 100%;
    scroll-behavior: smooth;
}
  
body {
    font: normal .80em 'Droid Sans', arial, sans-serif;
    background: #F9F9F9;
    color: #444;
    line-height:1;
    overflow-x:hidden;
}

article,aside,details,figcaption,figure, footer,header,hgroup,menu,nav,section{ 
    display:block;
}

nav ul {
   list-style:none;
}

blockquote, q {
   quotes:none;
}

blockquote:before, blockquote:after, q:before, q:after {
   content:'';
   content:none;
}

a {
   margin:0;
   padding:0;
   font-size:100%;
   vertical-align:baseline;
   background:transparent;
 }

/* change colors to suit your needs */
ins {
   background-color:#ff9;
   color:#000;
   text-decoration:none;
}

/* change colors to suit your needs */
mark {
   background-color:#ff9;
   color:#000; 
   font-style:italic;
   font-weight:bold;
}

del {
   text-decoration: line-through;
}

abbr[title], dfn[title] {
   border-bottom:1px dotted;
   cursor:help;
}

table {
   border-collapse:collapse;
   border-spacing:0;
}

/* change border color to suit your needs */
hr {
   display:block;
   height:1px;
   border:0;   
   border-top:1px solid #cccccc;
   margin:1em 0;
   padding:0;
}

input, select {
   vertical-align:middle;
}

/*REMAINING CODE*/
h1, h2, h3, h4, h5, h6 { 
    color: #362C20;
    letter-spacing: 0em;
    padding: 0 0 5px 0;
}

body{
    background: var(--bg-color);
/*    background: #151a2c;*/
}

.pcLink{
    display:block;
}
.mobileLink{
    display:none;
}

#top{
    background: var(--lgreen);
/*    background: #e84a43;*/
    width: 100%;
    height: 30vh;
}
#site_content { 
    text-align: justify;
    width: 65%;
    overflow: hidden;
    margin: 9vh 0 10vh 16vw;
    padding: 25px;
    text-shadow: 0 1px #FFF;
    background: white;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
} 
.content { 
    width: 100%;
    overflow: hidden;
    text-align: left;
    float: left;
    font-size: 135%;
    clear: both;
}
.content h1 {
    padding: 0 15px 20px 0;
    font: 250% 'News Cycle', arial, sans-serif;
    text-shadow:  #225555 0 2px;
    margin: 0 1px;
}

/*Textbox formatting*/
input[type="text"] {
    border: none;
    padding: 5px;
    width: 99%;
    border-bottom: 2px solid gray;
}

#country_code{
    border: 1px solid black;
    padding: 5px;
    width: 35px;
    border-bottom: 2px solid gray;
}

#mobile_number{
    border: 1px solid black;
    padding: 5px;
    width: 100px;
    border-bottom: 2px solid gray;
}

input[type="text"]:focus {
    background-color: lightblue;
    border-bottom: 2px solid teal;
}

/*Radio Button formatting*/
input[type="radio"] {
    margin: 0 10px 0 10px;
    line-height: 28px;
}

/*Required and Errors*/
.error {
    color: #FF0000;
}
.errorText {
    display: block;
    color: #FF0000;
    margin-top: -15px;
}

br {
    display: block;
    margin: 10px 0;
    line-height: 28px;
}

.ques{
    border: 2px solid black;
    margin: 10px;
    padding: 10px;
}

.boxsizingBorder {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}

textarea {
  width:100%;
}

@media screen and (max-width: 710px) {
    /* CSS for below 720 layout goes here : SMALL mobiles?? */
    #top{
        display:none;
        background: var(--lgreen);
    /*    background: #009688;*/
        width: 100%;
        height: 25vh;
    }
    #icons{
        display:none;
        z-index:-1;
    }
    #site_content { 
        text-align: justify;
        width: 88%;
        overflow: hidden;
        margin: 0 0 10vh 0;
        padding: 25px;
        text-shadow: 0 1px #FFF;
        font-size: 100%
        background: white;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    } 
    .content { 
        width: 100%;
        overflow: hidden;
        text-align: left;
        font-size: 100%
        float: left;
        clear: both;
    }
    .content h1 {
        padding: 0 15px 20px 0;
        font: 200% 'News Cycle', arial, sans-serif;
        text-shadow:  #225555 0 2px;
        margin: 0 1px;
    }

    /*Required and Errors*/
    .error {
        color: #FF0000;
    }
    .errorText {
        display: block;
        font-size: 100%
        color: #FF0000;
    }

}