* {

box-sizing: border-box;

text-decoration: none;

}



body{

font-family: Montserrat, sans-serif;

} 

.container {

padding: 10px 12px;

align-items: center;

width: 100%;

max-width: 680px;

}

/* -----------head-section----------- */

.head-section{

margin-top: 12px;

}



.head-section img{

text-align: center;

border-radius: 50%;

width: 96px;

height: 96px;

margin-left: auto;

margin-right: auto;

margin-bottom: 16px;

display: flex;

}



.head-section h1{

font-weight: 700;

font-size: 16px;

line-height: 1.5;

text-overflow: ellipsis;

max-width: 100%;

white-space: nowrap;

overflow: hidden;

text-align: center;

}



.middle-section a{

text-decoration: none;

}

.middle-section h1{

font-weight: 700;

font-size: 20px;
color: #03304e;

line-height: 1.5;

text-overflow: ellipsis;

max-width: 100%;

white-space: nowrap;

overflow: hidden;

text-align: center;
margin: 20px 0px 0px 0px;

}





.head-section h2 {

color: #000;

font-weight: 700;

padding: 0px;

margin: 0px;

text-align: center;

line-height: 1.5;

font-size: 14px;

}



.head-section .fa{

color:#4f7cfe;

margin: 15px;

transform: scale(1);

transition: width .1s ease-in-out;

font-size: 2em;

}



.head-section .fa:hover{



transform:scale(1.3);

-moz-transform:scale(1.3);

-webkit-transform:scale(1.3);

-ms-transform:scale(1.3);

-o-transform:scale(1.3);

}

/* -----------social-icon-------------- */

.social-icon{

max-width: 100%;
text-align: center;
padding: 0px 15px;

margin-left: auto;

margin-right: auto;



}



.social-icon a{

display: inline-block;

padding: 10px 2px;

}  

.social-icon img{

width: 35px;
height: 35px;
border-radius: 0px;
margin: 0px 3px 10px 3px;

} 



.social-icon img:hover{

transform:scale(1.3);

-moz-transform:scale(1.3);

-webkit-transform:scale(1.3);

-ms-transform:scale(1.3);

-o-transform:scale(1.3);

}

/* -----------------middle-section----------- */

.mydiv, .mydivi{
	width: 100%;

background-color: #036f9c;

color:#fff;

border: #036f9c 2px solid;

height:auto;

font-weight: 500;

font-size: 17px;

line-height: 1.5;  

position: relative;

text-align: center;

transition: .3s ease-in-out;

vertical-align: middle;
display: flex;
align-items: center;
/*justify-content: center;*/
padding:0px 8px;
min-height:50px;



}



.mydiv:hover{

transition: .3s ease-in-out;

color: #03304e;

background-color: #fff;

}





.mydivi:hover{

transition: .3s ease-in-out;

color: #03304e;

background-color: #fff;

} 

.mydiv img{

float:left;

/*width:60px;*/

height: 60px;
/*position: absolute;*/
left: 0px;

padding: 6px 0px;

/* margin-right: 30%; */
margin-right:10px;

}


.mydivi .content{ text-align:center; width:100%;padding-left: 15px;
    padding-right: 20px;}
.mydiv .content{ text-align:center; width:100%; padding-left: 0px;
    padding-right: 5px;}
.mydiv .content p, .mydivi .content p{padding: 20px 0px; margin-bottom:0 !important;}


.mydivi img{

float:left;

/*width:60px;*/

height: 60px;
/*position: absolute;*/
left: 0px;


padding: 6px 0px;

/* margin-right: 12%; */
margin-right:10px;

} 
.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover {
    background-color: #036f9c;
    border-color: #036f9c;
}
.pagination {
    display: inline-block;
    margin: 10px auto 60px !important;
    text-align: center;
    width: 100%;
    float: left;
}
.pagination > li > a, .pagination > li > span {
    float: none;
}
.pagination > li > a:focus, .pagination > li > a:hover, .pagination > li > span:focus, .pagination > li > span:hover {
    color: #03304e;
}
.pagination > li > a, .pagination > li > span {
    color: #03304e;
}
.editor_div iframe {
  width: 100%;
}
.content .fa {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  overflow: hidden;
  -moz-box-pack: end;
  justify-content: flex-end;
  -moz-box-align: center;
  align-items: center;
  right: 16px;
}



/* .mydivi p{

position:absolute;

width:400px;

top: 50%;

left: 50%;

transform: translate(-50%, -50%);

} */

@media screen and (max-width: 700px){
.container {
    padding: 10px 30px;
}
}
@media screen and (max-width: 650px){
/*.mydiv, .mydivi {
    line-height: 25px;
	padding: 20px 90px 20px 90px;
}*/
}

@media screen and (max-width: 632px){

.mydivi{

color:#fff;

min-height:60px;

line-height: 1.5;

font-weight: 500;

font-size: 17px;

position: relative;

text-align: center;

transition: .3s ease-in-out;

vertical-align:middle



}

}
@media screen and (max-width: 496px){
.mydiv, .mydivi {
	font-size: 16px !important;
}
}